Combobox

The Combobox component provides searchable dropdown functionality with custom options.

Import

import { Combobox } from "amvasdev-ui";

Examples

Basic Usage

Select a fruit

import { useState } from "react";
  import { Combobox } from "amvasdev-ui";

  function App() {
    const [value, setValue] = useState("");
    const [selectedOption, setSelectedOption] = useState(null);

    const options = [
      { id: "1", text: "Apple" },
      { id: "2", text: "Banana" },
      { id: "3", text: "Cherry" },
      { id: "4", text: "Date" },
    ];

    return (
      <Combobox
        id="fruits"
        name="fruits"
        label="Select a fruit"
        options={options}
        value={value}
        onChange={setValue}
        selectedOption={selectedOption}
        onSelect={setSelectedOption}
        placeholder="Search fruits..."
        optionLimit={5}
      />
    );
  }