---
title: Installation and setup
description: Add Search, register its catalog, and mount the search surface.
order: 10
toc:
  - id: add-the-package
    title: Add the package
  - id: import-styles
    title: Import styles
  - id: mount-search
    title: Mount search
---

## Add the package {#add-the-package}

Add Search to the consuming application:

```json
{
  "dependencies": {
    "@workspace/search": "workspace:*"
  }
}
```

## Import styles {#import-styles}

Import the Search stylesheet once from the application's global stylesheet so Tailwind scans the utilities used by the package:

```css
@import "@workspace/search/globals.css";
```

Also add `@workspace/search/locales/{locale}` to the application's internationalization catalog sources.

## Mount search {#mount-search}

```tsx
import { SearchDialog, SearchProvider, SearchTrigger } from "@workspace/search"

;<SearchProvider adapter={searchAdapter} onSelect={openResult}>
  <SearchTrigger>Search</SearchTrigger>
  <SearchDialog />
</SearchProvider>
```

`SearchDialog` registers `Mod+K` by default. Pass `hotkey={false}` when the application manages shortcuts centrally.