"use client";
import { jsxs, jsx } from 'react/jsx-runtime';
import { useId, useState } from 'react';
import { Content as Content2 } from '../../../../node_modules/.pnpm/@radix-ui_react-popover@1.1.15_@types_react-dom@19.2.3_@types_react@19.2.6__@types_reac_5c5a3ca63b34dfe7d9d23f1e8cee675c/node_modules/@radix-ui/react-popover/dist/index.mjs';
import { ChevronDownIcon, CheckIcon } from 'lucide-react';
import { cn } from '../lib/utils.mjs';
import { Button } from './button.mjs';
import { Command, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem } from './command.mjs';
import { Popover, PopoverTrigger } from './popover.mjs';

function SearchSelect({
  options,
  value,
  onChange,
  placeholder = "Select option",
  emptyMessage = "No option found."
}) {
  const id = useId();
  const [open, setOpen] = useState(false);
  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, modal: false, children: [
    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
      Button,
      {
        id,
        variant: "outline",
        role: "combobox",
        "aria-expanded": open,
        className: "bg-background hover:bg-background border-input w-full justify-between px-3 font-normal outline-offset-0 outline-none focus-visible:outline-[3px]",
        children: [
          /* @__PURE__ */ jsx("span", { className: cn("truncate", !value && "text-muted-foreground"), children: value ? options.find((option) => option.value === value)?.label : placeholder }),
          /* @__PURE__ */ jsx(
            ChevronDownIcon,
            {
              size: 16,
              className: "text-muted-foreground/80 shrink-0",
              "aria-hidden": "true"
            }
          )
        ]
      }
    ) }),
    /* @__PURE__ */ jsx(
      Content2,
      {
        align: "start",
        sideOffset: 4,
        className: cn(
          "border-input bg-popover text-popover-foreground pointer-events-auto",
          "data-[state=open]:animate-in data-[state=closed]:animate-out",
          "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
          "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
          "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2",
          "data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
          "z-50 w-full min-w-[var(--radix-popper-anchor-width)] origin-(--radix-popover-content-transform-origin)",
          "rounded-md border p-0 shadow-md outline-hidden"
        ),
        children: /* @__PURE__ */ jsxs(Command, { children: [
          /* @__PURE__ */ jsx(CommandInput, { placeholder: "Search options..." }),
          /* @__PURE__ */ jsxs(CommandList, { children: [
            /* @__PURE__ */ jsx(CommandEmpty, { children: emptyMessage }),
            /* @__PURE__ */ jsx(CommandGroup, { children: options.map((option) => /* @__PURE__ */ jsxs(
              CommandItem,
              {
                value: option.value,
                onSelect: (currentValue) => {
                  onChange(currentValue === value ? "" : currentValue);
                  setOpen(false);
                },
                children: [
                  option.label,
                  value === option.value && /* @__PURE__ */ jsx(CheckIcon, { size: 16, className: "ml-auto" })
                ]
              },
              option.value
            )) })
          ] })
        ] })
      }
    )
  ] });
}

export { SearchSelect as default };
