@flanksource/clicky-ui/dist/components/select.js

Flanksource Clicky UI — React component library built on shadcn/ui with light/dark and density theming.

import { jsxs, jsx } from "react/jsx-runtime";
import { forwardRef } from "react";
import { cn } from "../lib/utils.js";
import { Icon } from "../data/Icon.js";
const Select = forwardRef(
  ({ className, options, placeholder, children, ...props }, ref) => {
    return /* @__PURE__ */ jsxs("div", { className: "relative inline-flex w-full items-center", children: [
      /* @__PURE__ */ jsxs(
        "select",
        {
          ref,
          className: cn(
            "h-control-h w-full appearance-none rounded-md border border-input bg-background px-control-px pr-8 text-sm text-foreground",
            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1",
            "disabled:cursor-not-allowed disabled:opacity-50",
            className
          ),
          ...props,
          children: [
            placeholder !== void 0 && /* @__PURE__ */ jsx("option", { value: "", disabled: true, children: placeholder }),
            options ? options.map((opt) => /* @__PURE__ */ jsx("option", { value: opt.value, disabled: opt.disabled, children: opt.label }, opt.value)) : children
          ]
        }
      ),
      /* @__PURE__ */ jsx(
        Icon,
        {
          name: "codicon:chevron-down",
          className: "pointer-events-none absolute right-2 top-1/2 -translate-y-1/2 text-xs text-muted-foreground"
        }
      )
    ] });
  }
);
Select.displayName = "Select";
export {
  Select
};
//# sourceMappingURL=select.js.map