Autocomplete

Installation

NPM packages are currently unstable and may cause issues. Use it at your own risk.

npm install @mijn-ui/react-autocomplete

Usage

import {
  Autocomplete,
  AutocompleteContent,
  AutocompleteGroup,
  AutocompleteItem,
  AutocompleteTrigger,
} from "@mijn-ui/react"

<Autocomplete>
  <AutocompleteTrigger placeholder={"Search for a framework"} />
  <AutocompleteGroup>
    <AutocompleteContent>
      <AutocompleteItem value="nextjs">Next.js</AutocompleteItem>
    </AutocompleteContent>
  </AutocompleteGroup>
</Autocomplete>

Examples

Autocomplete With Scrollarea

Autocomplete With Dialog

Autocomplete Style Slots

Slot Name	Targeted Component	Purpose
`base`	`AutoComplete`	Styles the root `AutoComplete` component.
`trigger`	`AutoComplete`	Styles the trigger for the autocomplete.
`content`	`AutoCompleteContent`	Applies styles to the content container.
`contentEmpty`	`AutoCompleteContent`	Styles the content when no results are available.
`skeleton`	`AutoCompleteContent`	Styles the skeleton/loading state of content.
`group`	`AutoCompleteGroup`	Styles groups of autocomplete items.
`item`	`AutoCompleteItem`	Styles individual autocomplete items.

Installation

Usage

Examples

Autocomplete With Scrollarea

Autocomplete With Dialog

Autocomplete Style Slots

On this page