@alice-ui/react/dist/chunk-FLBQC3AJ.mjs

import {
  ListBox
} from "./chunk-7CNHZW6F.mjs";
import {
  _Spinner
} from "./chunk-IGHU64CH.mjs";

// src/select/select.tsx
import { ChevronDownIcon } from "@alice-ui/icons";
import { clsx } from "@alice-ui/shared-utils";
import { select } from "@alice-ui/theme";
import { cloneElement, forwardRef, useMemo } from "react";
import {
  Select as AriaSelect,
  Button,
  Label,
  Popover,
  SelectValue,
  Text
} from "react-aria-components";
import { jsx, jsxs } from "react/jsx-runtime";
function Select(props, ref) {
  const {
    children,
    className,
    classNames,
    label,
    description,
    errorMessage,
    items,
    placement = "bottom",
    isLoading = false,
    selectorIcon = /* @__PURE__ */ jsx(ChevronDownIcon, {}),
    variant,
    color,
    radius,
    size,
    spinnerProps,
    popoverProps,
    listBoxProps,
    ...otherProps
  } = props;
  const slots = useMemo(
    () => select({ variant, color, radius, size }),
    [color, radius, size, variant]
  );
  const baseStyles = clsx(classNames == null ? void 0 : classNames.base, className);
  const clonedIcon = cloneElement(selectorIcon, {
    "aria-hidden": true,
    className: slots.selectorIcon({ class: classNames == null ? void 0 : classNames.selectorIcon })
  });
  const renderIndicator = useMemo(() => {
    if (isLoading) {
      return /* @__PURE__ */ jsx(
        _Spinner,
        {
          "aria-hidden": true,
          color: "current",
          size: "sm",
          ...spinnerProps,
          className: slots.spinner({ class: classNames == null ? void 0 : classNames.spinner })
        }
      );
    }
    return clonedIcon;
  }, [isLoading, clonedIcon, spinnerProps, slots, classNames == null ? void 0 : classNames.spinner]);
  return /* @__PURE__ */ jsxs(AriaSelect, { ref, className: slots.base({ class: baseStyles }), ...otherProps, children: [
    label && /* @__PURE__ */ jsx(Label, { className: slots.label({ class: classNames == null ? void 0 : classNames.label }), children: label }),
    /* @__PURE__ */ jsxs("div", { className: slots.mainWrapper({ class: classNames == null ? void 0 : classNames.mainWrapper }), children: [
      /* @__PURE__ */ jsxs(Button, { className: slots.trigger({ class: classNames == null ? void 0 : classNames.trigger }), children: [
        /* @__PURE__ */ jsx(SelectValue, { className: slots.value({ class: classNames == null ? void 0 : classNames.value }) }),
        renderIndicator
      ] }),
      errorMessage ? /* @__PURE__ */ jsx(
        Text,
        {
          slot: "errorMessage",
          elementType: "div",
          className: slots.errorMessage({ class: classNames == null ? void 0 : classNames.errorMessage }),
          children: errorMessage
        }
      ) : description ? /* @__PURE__ */ jsx(
        Text,
        {
          slot: "description",
          elementType: "div",
          className: slots.description({ class: classNames == null ? void 0 : classNames.description }),
          children: description
        }
      ) : null
    ] }),
    /* @__PURE__ */ jsx(
      Popover,
      {
        placement,
        className: slots.popover({ class: classNames == null ? void 0 : classNames.popover }),
        ...popoverProps,
        children: /* @__PURE__ */ jsx(ListBox, { ...listBoxProps, variant: "flat", color: "default", items, children })
      }
    )
  ] });
}
var _Select = forwardRef(Select);

export {
  _Select
};