prime-ui-kit 0.7.13 → 0.9.1

package/dist/chunks/chunk-NHOWNIAR.js

@@ -0,0 +1,3239 @@
+// src/internal/ControlSizeContext.tsx
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+var ControlSizeContext = React.createContext(null);
+ControlSizeContext.displayName = "ControlSizeContext";
+function ControlSizeProvider({ value, children }) {
+  return /* @__PURE__ */ jsx(ControlSizeContext.Provider, { value, children });
+}
+ControlSizeProvider.displayName = "ControlSizeProvider";
+function useOptionalControlSize() {
+  return React.useContext(ControlSizeContext) ?? void 0;
+}
+function useControlSize(sizeProp) {
+  const host = React.useContext(ControlSizeContext);
+  return sizeProp ?? host ?? "m";
+}
+
+// src/components/scroll-container/ScrollContainer.tsx
+import * as React3 from "react";
+
+// src/hooks/useMergedRefs.ts
+import * as React2 from "react";
+
+// src/internal/mergeRefs.ts
+function mergeRefs(...refs) {
+  return (value) => {
+    for (const ref of refs) {
+      if (ref == null) continue;
+      if (typeof ref === "function") {
+        ref(value);
+      } else {
+        ref.current = value;
+      }
+    }
+  };
+}
+
+// src/hooks/useMergedRefs.ts
+function useMergedRefs(...refs) {
+  return React2.useMemo(() => mergeRefs(...refs), refs);
+}
+
+// src/internal/cx.ts
+function cx(...classNames) {
+  return classNames.filter(Boolean).join(" ");
+}
+
+// src/internal/data-attributes.ts
+function toDataAttributes(input) {
+  const result = {};
+  for (const [key, value] of Object.entries(input)) {
+    if (value === void 0) {
+      continue;
+    }
+    const attributeName = `data-${key}`;
+    result[attributeName] = typeof value === "boolean" ? String(value) : `${value}`;
+  }
+  return result;
+}
+
+// src/components/scroll-container/ScrollContainer.module.css
+var ScrollContainer_default = {
+  root: "ScrollContainer_root",
+  vertical: "ScrollContainer_vertical",
+  horizontal: "ScrollContainer_horizontal",
+  both: "ScrollContainer_both",
+  overscrollContain: "ScrollContainer_overscrollContain",
+  overscrollNone: "ScrollContainer_overscrollNone",
+  scrollbarHidden: "ScrollContainer_scrollbarHidden"
+};
+
+// src/components/scroll-container/ScrollContainer.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+var axisClass = {
+  vertical: ScrollContainer_default.vertical,
+  horizontal: ScrollContainer_default.horizontal,
+  both: ScrollContainer_default.both
+};
+function useEdgeOverflow(ref, enabled, horizontal) {
+  const [overflow, setOverflow] = React3.useState({ start: false, end: false });
+  React3.useLayoutEffect(() => {
+    const node = ref.current;
+    if (!enabled || !node) return;
+    const update = () => {
+      const position = horizontal ? Math.abs(node.scrollLeft) : node.scrollTop;
+      const max = horizontal ? node.scrollWidth - node.clientWidth : node.scrollHeight - node.clientHeight;
+      const start = position > 1;
+      const end = max - position > 1;
+      setOverflow((prev) => prev.start === start && prev.end === end ? prev : { start, end });
+    };
+    let frame = 0;
+    const schedule = () => {
+      if (frame) return;
+      frame = requestAnimationFrame(() => {
+        frame = 0;
+        update();
+      });
+    };
+    update();
+    node.addEventListener("scroll", schedule, { passive: true });
+    const resize = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(schedule);
+    const observeChildren = () => {
+      for (const child of Array.from(node.children)) resize?.observe(child);
+    };
+    resize?.observe(node);
+    observeChildren();
+    const mutation = new MutationObserver(() => {
+      observeChildren();
+      schedule();
+    });
+    mutation.observe(node, { childList: true });
+    return () => {
+      cancelAnimationFrame(frame);
+      node.removeEventListener("scroll", schedule);
+      resize?.disconnect();
+      mutation.disconnect();
+    };
+  }, [ref, enabled, horizontal]);
+  return enabled ? overflow : { start: false, end: false };
+}
+function ScrollContainer({
+  as: Component = "div",
+  axis = "vertical",
+  overscrollBehavior = "contain",
+  fade = false,
+  scrollbar = "thin",
+  className,
+  ref,
+  ...rest
+}) {
+  const innerRef = React3.useRef(null);
+  const mergedRef = useMergedRefs(innerRef, ref);
+  const horizontal = axis === "horizontal";
+  const overflow = useEdgeOverflow(innerRef, fade, horizontal);
+  return /* @__PURE__ */ jsx2(
+    Component,
+    {
+      ref: mergedRef,
+      className: cx(
+        ScrollContainer_default.root,
+        axisClass[axis],
+        overscrollBehavior === "contain" && ScrollContainer_default.overscrollContain,
+        overscrollBehavior === "none" && ScrollContainer_default.overscrollNone,
+        scrollbar === "hidden" && ScrollContainer_default.scrollbarHidden,
+        className
+      ),
+      ...toDataAttributes({
+        fade: fade ? horizontal ? "horizontal" : "vertical" : void 0,
+        "overflow-start": overflow.start || void 0,
+        "overflow-end": overflow.end || void 0
+      }),
+      ...rest
+    }
+  );
+}
+
+// src/internal/iconBox.module.css
+var iconBox_default = {
+  box: "iconBox_box",
+  xs: "iconBox_xs",
+  s: "iconBox_s",
+  m: "iconBox_m",
+  l: "iconBox_l",
+  xl: "iconBox_xl",
+  inherit: "iconBox_inherit"
+};
+
+// src/internal/iconBox.ts
+function iconBoxClass(size, tier) {
+  return cx(iconBox_default.box, iconBox_default[size ?? tier ?? "m"], size === void 0 && iconBox_default.inherit);
+}
+
+// src/internal/textTone.module.css
+var textTone_default = {
+  tone: "textTone_tone"
+};
+
+// src/icons/Icon.module.css
+var Icon_default = {
+  root: "Icon_root"
+};
+
+// src/icons/registry.ts
+import {
+  Activity,
+  AlertTriangle,
+  ArrowDown,
+  ArrowUp,
+  ArrowUpDown,
+  Bell,
+  Bold,
+  BookOpen,
+  Calendar,
+  ChartColumn,
+  Check,
+  CheckCircle2,
+  ChevronDown,
+  ChevronLeft,
+  ChevronRight,
+  ChevronsLeft,
+  ChevronsUpDown,
+  ChevronUp,
+  Circle,
+  CloudOff,
+  CloudUpload,
+  Code2,
+  Copy,
+  Download,
+  ExternalLink,
+  Eye,
+  EyeOff,
+  FileText,
+  GripVertical,
+  HardDrive,
+  House,
+  Image,
+  Inbox,
+  Info,
+  Italic,
+  KeyRound,
+  LayoutDashboard,
+  LayoutGrid,
+  Link2,
+  List,
+  ListFilter,
+  ListTodo,
+  Lock,
+  LogIn,
+  LogOut,
+  Mail,
+  MailCheck,
+  Menu,
+  MessageSquare,
+  Minus,
+  Monitor,
+  Moon,
+  MoreHorizontal,
+  Package,
+  PanelLeftClose,
+  PanelLeftOpen,
+  Pipette,
+  Plus,
+  Receipt,
+  RefreshCw,
+  Rocket,
+  Search,
+  Send,
+  Settings,
+  ShoppingCart,
+  Smartphone,
+  Sun,
+  Tablet,
+  Trash2,
+  Truck,
+  Underline,
+  UserRound,
+  Users,
+  Wallet,
+  X,
+  XCircle
+} from "lucide-react";
+var iconRegistry = {
+  "nav.chevronDown": ChevronDown,
+  "nav.chevronLeft": ChevronLeft,
+  "nav.chevronRight": ChevronRight,
+  "nav.chevronUp": ChevronUp,
+  "nav.chevronsLeft": ChevronsLeft,
+  "nav.chevronsUpDown": ChevronsUpDown,
+  "nav.dashboard": LayoutDashboard,
+  "nav.home": House,
+  "nav.itemDot": Circle,
+  "nav.layoutGrid": LayoutGrid,
+  "nav.menu": Menu,
+  "nav.sidebarCollapse": PanelLeftClose,
+  "nav.sidebarExpand": PanelLeftOpen,
+  "action.add": Plus,
+  "action.check": Check,
+  "action.close": X,
+  "action.copy": Copy,
+  "action.delete": Trash2,
+  "action.download": Download,
+  "action.drag": GripVertical,
+  "action.externalLink": ExternalLink,
+  "action.eyedropper": Pipette,
+  "action.filter": ListFilter,
+  "action.login": LogIn,
+  "action.logout": LogOut,
+  "action.more": MoreHorizontal,
+  "action.refresh": RefreshCw,
+  "action.remove": Minus,
+  "action.search": Search,
+  "action.send": Send,
+  "action.settings": Settings,
+  "action.upload": CloudUpload,
+  "field.calendar": Calendar,
+  "field.email": Mail,
+  "field.password.show": Eye,
+  "field.password.hide": EyeOff,
+  "format.bold": Bold,
+  "format.italic": Italic,
+  "format.link": Link2,
+  "format.list": List,
+  "format.underline": Underline,
+  "object.activity": Activity,
+  "object.bell": Bell,
+  "object.book": BookOpen,
+  "object.cart": ShoppingCart,
+  "object.chart": ChartColumn,
+  "object.document": FileText,
+  "object.image": Image,
+  "object.inbox": Inbox,
+  "object.key": KeyRound,
+  "object.message": MessageSquare,
+  "object.package": Package,
+  "object.receipt": Receipt,
+  "object.rocket": Rocket,
+  "object.storage": HardDrive,
+  "object.tasks": ListTodo,
+  "object.truck": Truck,
+  "object.user": UserRound,
+  "object.users": Users,
+  "object.wallet": Wallet,
+  "sort.ascending": ArrowUp,
+  "sort.descending": ArrowDown,
+  "sort.none": ArrowUpDown,
+  "status.danger": XCircle,
+  "status.emailSent": MailCheck,
+  "status.info": Info,
+  "status.locked": Lock,
+  "status.offline": CloudOff,
+  "status.success": CheckCircle2,
+  "status.warning": AlertTriangle,
+  "theme.dark": Moon,
+  "theme.light": Sun,
+  "view.code": Code2,
+  "view.preview": Eye,
+  "viewport.desktop": Monitor,
+  "viewport.mobile": Smartphone,
+  "viewport.tablet": Tablet
+};
+
+// src/icons/Icon.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+function IconSvg({
+  glyph: GlyphSvg,
+  className,
+  size,
+  tone = "default",
+  strokeWidth = 1.75,
+  ...rest
+}) {
+  const tier = useOptionalControlSize();
+  return /* @__PURE__ */ jsx3(
+    GlyphSvg,
+    {
+      className: cx(Icon_default.root, iconBoxClass(size, tier), textTone_default.tone, className),
+      "data-tone": tone === "default" ? void 0 : tone,
+      strokeWidth,
+      "aria-hidden": "true",
+      ...rest
+    }
+  );
+}
+function Icon({ name, ...rest }) {
+  return /* @__PURE__ */ jsx3(IconSvg, { glyph: iconRegistry[name], ...rest });
+}
+function createIcon(glyph) {
+  function DomainIcon(props) {
+    return /* @__PURE__ */ jsx3(IconSvg, { glyph, ...props });
+  }
+  DomainIcon.displayName = `Icon(${glyph.displayName ?? "Glyph"})`;
+  return DomainIcon;
+}
+
+// src/components/spinner/Spinner.tsx
+import * as React4 from "react";
+
+// src/internal/VisuallyHidden.module.css
+var VisuallyHidden_default = {
+  root: "VisuallyHidden_root"
+};
+
+// src/internal/VisuallyHidden.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var visuallyHiddenClass = VisuallyHidden_default.root;
+function VisuallyHidden({ className, ...rest }) {
+  return /* @__PURE__ */ jsx4("span", { className: cx(VisuallyHidden_default.root, className), ...rest });
+}
+
+// src/components/spinner/Spinner.module.css
+var Spinner_default = {
+  root: "Spinner_root",
+  ring: "Spinner_ring",
+  primeSpinnerTurn: "Spinner_primeSpinnerTurn"
+};
+
+// src/components/spinner/Spinner.tsx
+import { jsx as jsx5, jsxs } from "react/jsx-runtime";
+var SPINNER_LABELS = {
+  loading: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430"
+};
+function Spinner({
+  size: sizeProp,
+  tone = "default",
+  labels: labelsProp,
+  className,
+  ...rest
+}) {
+  const controlSize = useOptionalControlSize();
+  const labels = React4.useMemo(() => ({ ...SPINNER_LABELS, ...labelsProp }), [labelsProp]);
+  const size = sizeProp ?? controlSize ?? "m";
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      role: "status",
+      className: cx(Spinner_default.root, iconBoxClass(sizeProp, controlSize), textTone_default.tone, className),
+      ...toDataAttributes({ size, tone: tone === "default" ? void 0 : tone }),
+      ...rest,
+      children: [
+        /* @__PURE__ */ jsx5("span", { className: Spinner_default.ring, "aria-hidden": "true" }),
+        /* @__PURE__ */ jsx5(VisuallyHidden, { children: labels.loading })
+      ]
+    }
+  );
+}
+
+// src/internal/fieldSurface.module.css
+var fieldSurface_default = {
+  surface: "fieldSurface_surface"
+};
+
+// src/internal/fieldTier.module.css
+var fieldTier_default = {
+  tier: "fieldTier_tier"
+};
+
+// src/internal/fieldTrigger.module.css
+var fieldTrigger_default = {
+  trigger: "fieldTrigger_trigger"
+};
+
+// src/internal/fieldClasses.ts
+var fieldSurfaceClass = fieldSurface_default.surface;
+var fieldTierClass = fieldTier_default.tier;
+var fieldTriggerClass = `${fieldTier_default.tier} ${fieldSurface_default.surface} ${fieldTrigger_default.trigger}`;
+
+// src/internal/iconLayout.ts
+import * as React5 from "react";
+function iconLayout(children, iconType) {
+  const content = React5.Children.toArray(children).filter(
+    (child) => !(typeof child === "string" && child.trim() === "")
+  );
+  const isIcon = (child) => React5.isValidElement(child) && child.type === iconType;
+  const iconOnly = content.length > 0 && content.every(isIcon);
+  return {
+    iconOnly,
+    leadingIcon: !iconOnly && content.length > 0 && isIcon(content[0]),
+    trailingIcon: !iconOnly && content.length > 0 && isIcon(content[content.length - 1])
+  };
+}
+
+// src/internal/slot.tsx
+import * as React6 from "react";
+import { Fragment, jsx as jsx6 } from "react/jsx-runtime";
+var isPrevented = (event) => typeof event === "object" && event !== null && event.defaultPrevented === true;
+function mergeProps(slotProps, childProps) {
+  const merged = { ...slotProps };
+  for (const key of Object.keys(childProps)) {
+    const slotValue = slotProps[key];
+    const childValue = childProps[key];
+    if (key === "ref") continue;
+    if (key === "className") {
+      if (typeof childValue === "function" && typeof slotValue === "string") {
+        const slotClass = slotValue;
+        merged[key] = (...args) => {
+          const resolved = childValue(...args);
+          return [slotClass, resolved].filter(Boolean).join(" ") || void 0;
+        };
+      } else {
+        const parts = [slotValue, childValue].filter(Boolean);
+        merged[key] = parts.length > 0 ? parts.join(" ") : void 0;
+      }
+    } else if (key === "style") {
+      merged[key] = slotValue != null && childValue != null ? { ...slotValue, ...childValue } : childValue ?? slotValue;
+    } else if (key === "aria-describedby" && slotValue && childValue) {
+      merged[key] = `${childValue} ${slotValue}`;
+    } else if (key.startsWith("on") && typeof slotValue === "function" && typeof childValue === "function") {
+      merged[key] = (...args) => {
+        childValue(...args);
+        if (!isPrevented(args[0])) slotValue(...args);
+      };
+    } else if (childValue !== void 0) {
+      merged[key] = childValue;
+    }
+  }
+  return merged;
+}
+function blockDisabledClick(event) {
+  event.preventDefault();
+  event.stopPropagation();
+}
+function Slot({ children, ref, ...slotProps }) {
+  const child = React6.isValidElement(children) ? children : null;
+  const childRef = child?.props.ref ?? void 0;
+  const composedRef = useMergedRefs(ref, childRef);
+  if (!child) return /* @__PURE__ */ jsx6(Fragment, { children });
+  const merged = mergeProps(slotProps, child.props);
+  const disabled = slotProps["aria-disabled"] === true || slotProps["aria-disabled"] === "true";
+  if (disabled) merged.onClickCapture = blockDisabledClick;
+  return React6.cloneElement(child, { ...merged, ref: composedRef });
+}
+Slot.displayName = "Slot";
+
+// src/components/button/Button.module.css
+var Button_default = {
+  root: "Button_root",
+  icon: "Button_icon",
+  spinner: "Button_spinner"
+};
+
+// src/components/button/Button.tsx
+import { jsx as jsx7, jsxs as jsxs2 } from "react/jsx-runtime";
+function ButtonRoot({
+  children,
+  className,
+  variant = "solid",
+  tone = "accent",
+  size: sizeProp,
+  fullWidth,
+  type = "button",
+  loading = false,
+  disabled,
+  asChild = false,
+  onClick: onClick2,
+  ref,
+  ...rest
+}) {
+  const size = useControlSize(sizeProp);
+  const isDisabled = disabled || loading;
+  const layout = iconLayout(children, ButtonIcon);
+  const dataAttrs = toDataAttributes({
+    variant,
+    tone,
+    size,
+    // `disabled` only: a loading button is busy, not unavailable, and keeps its colors.
+    disabled: disabled || void 0,
+    loading,
+    "full-width": fullWidth,
+    "icon-only": layout.iconOnly || void 0,
+    "leading-icon": layout.leadingIcon || void 0,
+    "trailing-icon": layout.trailingIcon || void 0,
+    // Without a leading icon the spinner is centered over the hidden label: width stays put.
+    "loading-overlay": loading && !asChild && !layout.leadingIcon && !layout.iconOnly || void 0
+  });
+  const classes = cx(fieldTierClass, Button_default.root, className);
+  if (asChild) {
+    return /* @__PURE__ */ jsx7(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx7(
+      Slot,
+      {
+        ...rest,
+        ref,
+        className: classes,
+        "aria-disabled": isDisabled || void 0,
+        "aria-busy": loading || void 0,
+        onClick: isDisabled ? (event) => event.preventDefault() : onClick2,
+        ...dataAttrs,
+        children
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsx7(
+    "button",
+    {
+      ...rest,
+      ref,
+      type,
+      className: classes,
+      disabled: isDisabled,
+      "aria-busy": loading || void 0,
+      onClick: onClick2,
+      ...dataAttrs,
+      children: /* @__PURE__ */ jsxs2(ControlSizeProvider, { value: size, children: [
+        loading ? /* @__PURE__ */ jsx7(Spinner, { className: Button_default.spinner, "aria-hidden": "true" }) : null,
+        children
+      ] })
+    }
+  );
+}
+ButtonRoot.displayName = "Button.Root";
+function ButtonIcon({ children, className, ...rest }) {
+  return /* @__PURE__ */ jsx7("span", { className: cx(Button_default.icon, className), "aria-hidden": "true", ...rest, children });
+}
+ButtonIcon.displayName = "Button.Icon";
+var Button = { Root: ButtonRoot, Icon: ButtonIcon };
+
+// src/internal/states.ts
+var controlSizes = ["xs", "s", "m", "l", "xl"];
+function stepDown(size, n = 1) {
+  return controlSizes[Math.max(0, controlSizes.indexOf(size) - n)] ?? "xs";
+}
+var variants = ["solid", "soft", "outline", "ghost"];
+var tones = ["neutral", "accent", "success", "warning", "danger", "info"];
+var paletteColors = [
+  "gray",
+  "blue",
+  "green",
+  "orange",
+  "red",
+  "yellow",
+  "purple",
+  "sky",
+  "pink",
+  "teal"
+];
+var dataStates = [
+  "open",
+  "closed",
+  "checked",
+  "unchecked",
+  "indeterminate",
+  "active",
+  "inactive"
+];
+var textTones = [
+  "default",
+  "secondary",
+  "muted",
+  "accent",
+  "success",
+  "warning",
+  "danger"
+];
+
+// src/internal/enterMotion.module.css
+var enterMotion_default = {
+  enter: "enterMotion_enter",
+  primeEnter: "enterMotion_primeEnter",
+  enterBase: "enterMotion_enterBase",
+  enterBaseChildren: "enterMotion_enterBaseChildren"
+};
+
+// src/components/hint/Hint.module.css
+var Hint_default = {
+  root: "Hint_root",
+  icon: "Hint_icon"
+};
+
+// src/components/hint/Hint.tsx
+import { jsx as jsx8 } from "react/jsx-runtime";
+function HintRoot({ className, size = "m", invalid, disabled, children, ...rest }) {
+  return /* @__PURE__ */ jsx8(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx8(
+    "p",
+    {
+      ...rest,
+      className: cx(Hint_default.root, invalid && enterMotion_default.enter, className),
+      ...toDataAttributes({
+        size,
+        invalid: invalid || void 0,
+        disabled: disabled || void 0
+      }),
+      children
+    }
+  ) });
+}
+HintRoot.displayName = "Hint.Root";
+function HintIcon({ className, ...rest }) {
+  return /* @__PURE__ */ jsx8("span", { "aria-hidden": "true", className: cx(Hint_default.icon, className), ...rest });
+}
+HintIcon.displayName = "Hint.Icon";
+var Hint = { Root: HintRoot, Icon: HintIcon };
+
+// src/components/label/Label.module.css
+var Label_default = {
+  root: "Label_root",
+  icon: "Label_icon",
+  asterisk: "Label_asterisk",
+  description: "Label_description",
+  optional: "Label_optional"
+};
+
+// src/components/label/Label.tsx
+import { jsx as jsx9, jsxs as jsxs3 } from "react/jsx-runtime";
+var LABEL_LABELS = { optional: "\u043D\u0435\u043E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u043E" };
+function LabelRoot({
+  className,
+  disabled,
+  children,
+  size: sizeProp,
+  required,
+  optional,
+  labels,
+  ref,
+  ...rest
+}) {
+  const size = useControlSize(sizeProp);
+  return (
+    // biome-ignore lint/a11y/noLabelWithoutControl: field label primitive; association via htmlFor or wrapping control is caller responsibility
+    /* @__PURE__ */ jsx9(
+      "label",
+      {
+        ref,
+        className: cx(Label_default.root, className),
+        "aria-disabled": disabled || void 0,
+        ...rest,
+        ...toDataAttributes({ disabled: disabled || void 0, size }),
+        children: /* @__PURE__ */ jsxs3(ControlSizeProvider, { value: size, children: [
+          children,
+          required ? /* @__PURE__ */ jsx9("span", { className: Label_default.asterisk, "aria-hidden": "true", children: "*" }) : null,
+          optional ? /* @__PURE__ */ jsx9("span", { className: Label_default.optional, children: labels?.optional ?? LABEL_LABELS.optional }) : null
+        ] })
+      }
+    )
+  );
+}
+LabelRoot.displayName = "Label.Root";
+function LabelIcon({ className, ...rest }) {
+  return /* @__PURE__ */ jsx9("span", { className: cx(Label_default.icon, className), "aria-hidden": "true", ...rest });
+}
+LabelIcon.displayName = "Label.Icon";
+function LabelDescription({ className, ...rest }) {
+  return /* @__PURE__ */ jsx9("span", { className: cx(Label_default.description, className), ...rest });
+}
+LabelDescription.displayName = "Label.Description";
+var Label = {
+  Root: LabelRoot,
+  Icon: LabelIcon,
+  Description: LabelDescription
+};
+
+// src/components/checkbox/Checkbox.tsx
+import * as React9 from "react";
+
+// src/hooks/useControllableState.ts
+import * as React7 from "react";
+function useControllableState({
+  value,
+  defaultValue,
+  onChange
+}) {
+  const [internalValue, setInternalValue] = React7.useState(defaultValue);
+  const isControlled = value !== void 0;
+  const currentValue = isControlled ? value : internalValue;
+  const currentValueRef = React7.useRef(currentValue);
+  currentValueRef.current = currentValue;
+  const setValue = React7.useCallback(
+    (nextValue) => {
+      const previousValue = currentValueRef.current;
+      const computedValue = typeof nextValue === "function" ? nextValue(previousValue) : nextValue;
+      if (Object.is(previousValue, computedValue)) {
+        return;
+      }
+      currentValueRef.current = computedValue;
+      if (!isControlled) {
+        setInternalValue(computedValue);
+      }
+      onChange?.(computedValue);
+    },
+    [isControlled, onChange]
+  );
+  return [currentValue, setValue];
+}
+
+// src/internal/ChoiceField.module.css
+var ChoiceField_default = {
+  tier: "ChoiceField_tier",
+  field: "ChoiceField_field",
+  row: "ChoiceField_row",
+  controlCell: "ChoiceField_controlCell",
+  input: "ChoiceField_input",
+  text: "ChoiceField_text",
+  support: "ChoiceField_support",
+  visual: "ChoiceField_visual"
+};
+
+// src/internal/ChoiceField.tsx
+import { jsx as jsx10, jsxs as jsxs4 } from "react/jsx-runtime";
+var choiceInputClass = ChoiceField_default.input;
+var choiceVisualClass = ChoiceField_default.visual;
+var choiceTierClass = ChoiceField_default.tier;
+function ChoiceField({
+  ids,
+  size,
+  state,
+  disabled,
+  readOnly = false,
+  hint,
+  error,
+  control,
+  className,
+  children
+}) {
+  return /* @__PURE__ */ jsx10(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsxs4(
+    "div",
+    {
+      className: cx(ChoiceField_default.tier, ChoiceField_default.field, className),
+      ...toDataAttributes({
+        size,
+        state,
+        invalid: ids.invalid || void 0,
+        disabled: disabled || void 0,
+        readonly: readOnly || void 0
+      }),
+      children: [
+        /* @__PURE__ */ jsxs4("label", { htmlFor: ids.controlId, className: ChoiceField_default.row, children: [
+          /* @__PURE__ */ jsx10("span", { className: ChoiceField_default.controlCell, children: control }),
+          children
+        ] }),
+        ids.showError ? /* @__PURE__ */ jsx10(Hint.Root, { id: ids.errorId, size, invalid: true, className: ChoiceField_default.support, children: error }) : ids.showHint ? /* @__PURE__ */ jsx10(Hint.Root, { id: ids.hintId, size, disabled, className: ChoiceField_default.support, children: hint }) : null
+      ]
+    }
+  ) });
+}
+function ChoiceLabel({ className, ...rest }) {
+  return /* @__PURE__ */ jsx10("span", { className: cx(ChoiceField_default.text, className), ...rest });
+}
+
+// src/internal/FieldFrame.tsx
+import * as React8 from "react";
+
+// src/internal/formatLabel.ts
+function formatLabel(template, values) {
+  return template.replace(
+    /\{(\w+)\}/g,
+    (_, name) => Object.hasOwn(values, name) ? String(values[name] ?? "") : ""
+  ).trim();
+}
+
+// src/internal/FieldFrame.module.css
+var FieldFrame_default = {
+  root: "FieldFrame_root",
+  label: "FieldFrame_label",
+  labelRow: "FieldFrame_labelRow",
+  labelEnd: "FieldFrame_labelEnd",
+  body: "FieldFrame_body",
+  supportText: "FieldFrame_supportText",
+  support: "FieldFrame_support",
+  counter: "FieldFrame_counter"
+};
+
+// src/internal/FieldFrame.tsx
+import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
+function hasContent(node) {
+  return node != null && node !== false && node !== "";
+}
+function useFieldFrame(explicitId, {
+  label,
+  hint,
+  error,
+  invalid
+}, ariaDescribedBy) {
+  const generated = React8.useId();
+  const controlId = explicitId ?? generated;
+  const labelId = `${controlId}-label`;
+  const hintId = `${controlId}-hint`;
+  const errorId = `${controlId}-error`;
+  const showError = hasContent(error);
+  const showHint = !showError && hasContent(hint);
+  const describedBy = [ariaDescribedBy, showHint ? hintId : void 0, showError ? errorId : void 0].filter(Boolean).join(" ") || void 0;
+  return {
+    controlId,
+    labelId,
+    hintId,
+    errorId,
+    describedBy,
+    labelledBy: hasContent(label) ? labelId : void 0,
+    showHint,
+    showError,
+    invalid: Boolean(invalid) || showError
+  };
+}
+function FieldFrame({
+  size,
+  ids,
+  label,
+  required,
+  optional,
+  hint,
+  error,
+  disabled,
+  optionalLabel,
+  group = false,
+  labelEnd,
+  counter,
+  reserveSupportRow = false,
+  className,
+  children,
+  ...rest
+}) {
+  const { showError, showHint } = ids;
+  const showSupport = showError || showHint || counter != null || reserveSupportRow;
+  const labelNode = hasContent(label) ? /* @__PURE__ */ jsx11(
+    Label.Root,
+    {
+      id: ids.labelId,
+      htmlFor: group ? void 0 : ids.controlId,
+      size,
+      required,
+      optional,
+      disabled,
+      labels: { optional: optionalLabel },
+      className: FieldFrame_default.label,
+      children: label
+    }
+  ) : null;
+  return /* @__PURE__ */ jsxs5(
+    "div",
+    {
+      ...rest,
+      className: cx(FieldFrame_default.root, className),
+      ...toDataAttributes({
+        size,
+        invalid: ids.invalid || void 0,
+        disabled: disabled || void 0
+      }),
+      children: [
+        labelEnd != null ? /* @__PURE__ */ jsxs5("div", { className: FieldFrame_default.labelRow, children: [
+          labelNode,
+          /* @__PURE__ */ jsx11("span", { className: FieldFrame_default.labelEnd, children: labelEnd })
+        ] }) : labelNode,
+        /* @__PURE__ */ jsxs5("div", { className: FieldFrame_default.body, children: [
+          children,
+          showSupport ? /* @__PURE__ */ jsxs5(
+            "div",
+            {
+              className: FieldFrame_default.support,
+              ...toDataAttributes({ size, reserve: reserveSupportRow || void 0 }),
+              children: [
+                showError ? /* @__PURE__ */ jsx11(Hint.Root, { id: ids.errorId, size, invalid: true, className: FieldFrame_default.supportText, children: error }) : showHint ? /* @__PURE__ */ jsx11(
+                  Hint.Root,
+                  {
+                    id: ids.hintId,
+                    size,
+                    disabled,
+                    className: FieldFrame_default.supportText,
+                    children: hint
+                  }
+                ) : /* @__PURE__ */ jsx11("span", { className: FieldFrame_default.supportText }),
+                counter
+              ]
+            }
+          ) : null
+        ] })
+      ]
+    }
+  );
+}
+function FieldCounter({ current, max, size, label, className, ...rest }) {
+  return /* @__PURE__ */ jsxs5(
+    "span",
+    {
+      ...rest,
+      className: cx(FieldFrame_default.counter, className),
+      "data-size": size,
+      "data-invalid": current > max || void 0,
+      "aria-live": "polite",
+      children: [
+        /* @__PURE__ */ jsxs5("span", { "aria-hidden": "true", children: [
+          current,
+          "/",
+          max
+        ] }),
+        /* @__PURE__ */ jsx11(VisuallyHidden, { children: formatLabel(label, { current, max }) })
+      ]
+    }
+  );
+}
+
+// src/components/checkbox/Checkbox.module.css
+var Checkbox_default = {
+  root: "Checkbox_root",
+  indicator: "Checkbox_indicator",
+  control: "Checkbox_control",
+  svg: "Checkbox_svg",
+  checkPath: "Checkbox_checkPath",
+  indeterminateLine: "Checkbox_indeterminateLine"
+};
+
+// src/components/checkbox/Checkbox.tsx
+import { Fragment as Fragment2, jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
+function CheckboxMark() {
+  return /* @__PURE__ */ jsxs6("svg", { viewBox: "0 0 24 24", className: Checkbox_default.svg, "aria-hidden": "true", focusable: "false", children: [
+    /* @__PURE__ */ jsx12("path", { d: "M5.5 12.5l4.25 4.25L18.5 8", pathLength: 1, className: Checkbox_default.checkPath }),
+    /* @__PURE__ */ jsx12("path", { d: "M7 12h10", pathLength: 1, className: Checkbox_default.indeterminateLine })
+  ] });
+}
+function CheckboxRoot({
+  id,
+  checked: checkedProp,
+  defaultChecked = false,
+  onCheckedChange,
+  indeterminate = false,
+  invalid,
+  hint,
+  error,
+  size: sizeProp,
+  disabled = false,
+  readOnly = false,
+  className,
+  "aria-describedby": ariaDescribedBy,
+  children,
+  ref,
+  ...inputRest
+}) {
+  const size = useControlSize(sizeProp);
+  const ids = useFieldFrame(id, { hint, error, invalid }, ariaDescribedBy);
+  const [checked, setChecked] = useControllableState({
+    value: checkedProp,
+    defaultValue: defaultChecked,
+    onChange: onCheckedChange
+  });
+  const internalRef = React9.useRef(null);
+  const mergedRef = useMergedRefs(internalRef, ref);
+  React9.useEffect(() => {
+    if (internalRef.current) internalRef.current.indeterminate = indeterminate;
+  }, [indeterminate]);
+  return /* @__PURE__ */ jsx12(
+    ChoiceField,
+    {
+      ids,
+      size,
+      state: indeterminate ? "indeterminate" : checked ? "checked" : "unchecked",
+      disabled,
+      readOnly,
+      hint,
+      error,
+      className: cx(Checkbox_default.root, className),
+      control: /* @__PURE__ */ jsxs6(Fragment2, { children: [
+        /* @__PURE__ */ jsx12(
+          "input",
+          {
+            ...inputRest,
+            ref: mergedRef,
+            id: ids.controlId,
+            type: "checkbox",
+            className: choiceInputClass,
+            disabled,
+            checked,
+            onChange: (event) => {
+              if (!readOnly) setChecked(event.target.checked);
+            },
+            "aria-invalid": ids.invalid || void 0,
+            "aria-readonly": readOnly || void 0,
+            "aria-describedby": ids.describedBy
+          }
+        ),
+        /* @__PURE__ */ jsx12("span", { className: cx(choiceVisualClass, Checkbox_default.control), "aria-hidden": "true", children: /* @__PURE__ */ jsx12(CheckboxMark, {}) })
+      ] }),
+      children
+    }
+  );
+}
+CheckboxRoot.displayName = "Checkbox.Root";
+function CheckboxLabel(props) {
+  return /* @__PURE__ */ jsx12(ChoiceLabel, { ...props });
+}
+CheckboxLabel.displayName = "Checkbox.Label";
+function CheckboxIndicator({
+  checked = false,
+  indeterminate = false,
+  disabled = false,
+  size: sizeProp,
+  className,
+  ...rest
+}) {
+  const size = useControlSize(sizeProp);
+  return /* @__PURE__ */ jsx12(
+    "span",
+    {
+      "aria-hidden": "true",
+      className: cx(
+        choiceTierClass,
+        choiceVisualClass,
+        Checkbox_default.control,
+        Checkbox_default.indicator,
+        className
+      ),
+      ...toDataAttributes({
+        size,
+        state: indeterminate ? "indeterminate" : checked ? "checked" : "unchecked",
+        disabled: disabled || void 0
+      }),
+      ...rest,
+      children: /* @__PURE__ */ jsx12(CheckboxMark, {})
+    }
+  );
+}
+CheckboxIndicator.displayName = "Checkbox.Indicator";
+var Checkbox = {
+  Root: CheckboxRoot,
+  Label: CheckboxLabel,
+  Indicator: CheckboxIndicator
+};
+
+// src/internal/swatch.tsx
+import * as React10 from "react";
+
+// src/internal/swatch.module.css
+var swatch_default = {
+  fill: "swatch_fill",
+  checker: "swatch_checker",
+  tier: "swatch_tier",
+  chip: "swatch_chip",
+  swatch: "swatch_swatch",
+  check: "swatch_check"
+};
+
+// src/internal/swatch.tsx
+import { Fragment as Fragment3, jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
+var COLOR_PRESETS = [
+  { value: "#ef4444", label: "\u041A\u0440\u0430\u0441\u043D\u044B\u0439" },
+  { value: "#f97316", label: "\u041E\u0440\u0430\u043D\u0436\u0435\u0432\u044B\u0439" },
+  { value: "#eab308", label: "\u0416\u0451\u043B\u0442\u044B\u0439" },
+  { value: "#22c55e", label: "\u0417\u0435\u043B\u0451\u043D\u044B\u0439" },
+  { value: "#14b8a6", label: "\u0411\u0438\u0440\u044E\u0437\u043E\u0432\u044B\u0439" },
+  { value: "#5068f5", label: "\u0421\u0438\u043D\u0438\u0439" },
+  { value: "#a855f7", label: "\u0424\u0438\u043E\u043B\u0435\u0442\u043E\u0432\u044B\u0439" },
+  { value: "#ec4899", label: "\u0420\u043E\u0437\u043E\u0432\u044B\u0439" },
+  { value: "#b91c1c", label: "\u0422\u0451\u043C\u043D\u043E-\u043A\u0440\u0430\u0441\u043D\u044B\u0439" },
+  { value: "#c2410c", label: "\u0422\u0451\u043C\u043D\u043E-\u043E\u0440\u0430\u043D\u0436\u0435\u0432\u044B\u0439" },
+  { value: "#a16207", label: "\u0413\u043E\u0440\u0447\u0438\u0447\u043D\u044B\u0439" },
+  { value: "#15803d", label: "\u0422\u0451\u043C\u043D\u043E-\u0437\u0435\u043B\u0451\u043D\u044B\u0439" },
+  { value: "#0f766e", label: "\u0422\u0451\u043C\u043D\u043E-\u0431\u0438\u0440\u044E\u0437\u043E\u0432\u044B\u0439" },
+  { value: "#2f4ae0", label: "\u0422\u0451\u043C\u043D\u043E-\u0441\u0438\u043D\u0438\u0439" },
+  { value: "#7e22ce", label: "\u0422\u0451\u043C\u043D\u043E-\u0444\u0438\u043E\u043B\u0435\u0442\u043E\u0432\u044B\u0439" },
+  { value: "#be185d", label: "\u0422\u0451\u043C\u043D\u043E-\u0440\u043E\u0437\u043E\u0432\u044B\u0439" }
+];
+function useSwatchOptions(presets, allowEmpty, emptyLabel) {
+  return React10.useMemo(
+    () => [
+      ...presets.map((preset) => ({ ...preset, contrast: markContrast(preset.value) })),
+      ...allowEmpty ? [{ value: null, label: emptyLabel, contrast: "dark" }] : []
+    ],
+    [presets, allowEmpty, emptyLabel]
+  );
+}
+var swatchClass = swatch_default.swatch;
+var swatchTierClass = swatch_default.tier;
+function SwatchFill({ value }) {
+  if (value == null) return /* @__PURE__ */ jsx13("span", { "aria-hidden": true, className: swatch_default.checker });
+  return /* @__PURE__ */ jsx13("svg", { className: swatch_default.fill, "aria-hidden": "true", viewBox: "0 0 1 1", preserveAspectRatio: "none", children: /* @__PURE__ */ jsx13("rect", { width: "1", height: "1", fill: value }) });
+}
+function SwatchContent({ value, selected }) {
+  return /* @__PURE__ */ jsxs7(Fragment3, { children: [
+    /* @__PURE__ */ jsx13(SwatchFill, { value }),
+    selected ? /* @__PURE__ */ jsx13(Icon, { name: "action.check", strokeWidth: 3, className: swatch_default.check }) : null
+  ] });
+}
+function SwatchChip({ value, className, ...rest }) {
+  return /* @__PURE__ */ jsx13("span", { ...rest, "aria-hidden": true, className: cx(swatch_default.chip, className), children: /* @__PURE__ */ jsx13(SwatchFill, { value }) });
+}
+function sameColor(a, b) {
+  return (a ?? "").trim().toLowerCase() === (b ?? "").trim().toLowerCase();
+}
+function colorToRgb(value) {
+  const input = value.trim().toLowerCase();
+  const hex = /^#([0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})$/.exec(input)?.[1];
+  if (hex) {
+    const full = hex.length <= 4 ? [...hex].map((c) => c + c).join("") : hex;
+    return [0, 2, 4].map((i) => Number.parseInt(full.slice(i, i + 2), 16));
+  }
+  const fn = /^(rgba?|hsla?)\(([^)]+)\)$/.exec(input);
+  if (!fn) return null;
+  const parts = fn[2].split(/[\s,/]+/).filter(Boolean);
+  if (parts.length < 3) return null;
+  const num = (part, scale) => part.endsWith("%") ? Number.parseFloat(part) / 100 * scale : Number.parseFloat(part);
+  if (fn[1].startsWith("rgb")) {
+    const rgb = parts.slice(0, 3).map((part) => num(part, 255));
+    return rgb.every(Number.isFinite) ? rgb : null;
+  }
+  const h = Number.parseFloat(parts[0]);
+  const s = num(parts[1], 1);
+  const l = num(parts[2], 1);
+  if (![h, s, l].every(Number.isFinite)) return null;
+  const a = s * Math.min(l, 1 - l);
+  const channel = (n) => {
+    const k = (n + h / 30) % 12;
+    return 255 * (l - a * Math.max(-1, Math.min(k - 3, 9 - k, 1)));
+  };
+  return [channel(0), channel(8), channel(4)];
+}
+function markContrast(value) {
+  const rgb = colorToRgb(value);
+  if (!rgb) return "dark";
+  const lin = (c) => {
+    const s = c / 255;
+    return s <= 0.03928 ? s / 12.92 : ((s + 0.055) / 1.055) ** 2.4;
+  };
+  const l = 0.2126 * lin(rgb[0]) + 0.7152 * lin(rgb[1]) + 0.0722 * lin(rgb[2]);
+  return l > 0.179 ? "dark" : "light";
+}
+
+// src/components/color-swatches/ColorSwatches.tsx
+import * as React11 from "react";
+
+// src/internal/rovingFocus.ts
+var PREV = {
+  horizontal: ["ArrowLeft"],
+  vertical: ["ArrowUp"],
+  both: ["ArrowLeft", "ArrowUp"]
+};
+var NEXT = {
+  horizontal: ["ArrowRight"],
+  vertical: ["ArrowDown"],
+  both: ["ArrowRight", "ArrowDown"]
+};
+function rovingIndex(key, index, count, orientation = "both") {
+  if (count <= 0) return null;
+  if (key === "Home") return 0;
+  if (key === "End") return count - 1;
+  if (NEXT[orientation].includes(key)) return index < 0 ? 0 : (index + 1) % count;
+  if (PREV[orientation].includes(key)) return index < 0 ? count - 1 : (index - 1 + count) % count;
+  return null;
+}
+function gridIndex(key, index, count, columns) {
+  if (count <= 0) return null;
+  const from = Math.min(Math.max(index, 0), count - 1);
+  const step = Math.max(1, columns);
+  switch (key) {
+    case "ArrowRight":
+      return Math.min(from + 1, count - 1);
+    case "ArrowLeft":
+      return Math.max(from - 1, 0);
+    case "ArrowDown":
+      return from + step < count ? from + step : from;
+    case "ArrowUp":
+      return from - step >= 0 ? from - step : from;
+    case "Home":
+      return 0;
+    case "End":
+      return count - 1;
+    default:
+      return null;
+  }
+}
+
+// src/components/color-swatches/ColorSwatches.module.css
+var ColorSwatches_default = {
+  grid: "ColorSwatches_grid"
+};
+
+// src/components/color-swatches/ColorSwatches.tsx
+import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
+var COLOR_SWATCHES_LABELS = {
+  group: "\u0426\u0432\u0435\u0442",
+  empty: "\u0411\u0435\u0437 \u0446\u0432\u0435\u0442\u0430",
+  optional: "\u043D\u0435\u043E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u043E"
+};
+function columnsOf(items) {
+  const top = items[0]?.offsetTop;
+  const count = items.findIndex((item) => !item || item.offsetTop !== top);
+  return Math.max(1, count === -1 ? items.length : count);
+}
+function ColorSwatches({
+  value: valueProp,
+  defaultValue = null,
+  onValueChange,
+  presets = COLOR_PRESETS,
+  size: sizeProp,
+  disabled = false,
+  invalid,
+  allowEmpty = false,
+  name,
+  id,
+  className,
+  label,
+  required,
+  optional,
+  hint,
+  error,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy,
+  labels: labelsProp,
+  ...rest
+}) {
+  const size = useControlSize(sizeProp);
+  const labels = { ...COLOR_SWATCHES_LABELS, ...labelsProp };
+  const [value, setValue] = useControllableState({
+    value: valueProp,
+    defaultValue,
+    onChange: onValueChange
+  });
+  const ids = useFieldFrame(id, { label, hint, error, invalid }, ariaDescribedBy);
+  const options = useSwatchOptions(presets, allowEmpty, labels.empty);
+  const selectedIndex = options.findIndex((option) => sameColor(option.value, value));
+  const focusIndex = Math.max(0, selectedIndex);
+  const itemRefs = React11.useRef([]);
+  const labelledBy = ariaLabelledBy ?? ids.labelledBy;
+  const onKeyDown2 = (event) => {
+    const current = itemRefs.current.indexOf(document.activeElement);
+    const next = gridIndex(
+      event.key,
+      current === -1 ? focusIndex : current,
+      options.length,
+      columnsOf(itemRefs.current)
+    );
+    if (next === null) return;
+    event.preventDefault();
+    setValue(options[next].value);
+    itemRefs.current[next]?.focus();
+  };
+  return /* @__PURE__ */ jsx14(
+    FieldFrame,
+    {
+      ...rest,
+      size,
+      ids,
+      label,
+      required,
+      optional,
+      hint,
+      error,
+      disabled,
+      optionalLabel: labels.optional,
+      group: true,
+      className,
+      children: /* @__PURE__ */ jsxs8(
+        "div",
+        {
+          id: ids.controlId,
+          role: "radiogroup",
+          "aria-label": labelledBy ? void 0 : ariaLabel ?? labels.group,
+          "aria-labelledby": labelledBy,
+          "aria-describedby": ids.describedBy,
+          "aria-required": required || void 0,
+          "aria-invalid": ids.invalid || void 0,
+          className: cx(swatchTierClass, ColorSwatches_default.grid),
+          ...toDataAttributes({
+            size,
+            invalid: ids.invalid || void 0,
+            disabled: disabled || void 0
+          }),
+          onKeyDown: disabled ? void 0 : onKeyDown2,
+          children: [
+            options.map((option, index) => {
+              const selected = index === selectedIndex;
+              return (
+                // biome-ignore lint/a11y/useSemanticElements: a swatch is a styled button in a roving radiogroup; a native radio cannot carry the color fill and check mark
+                /* @__PURE__ */ jsx14(
+                  "button",
+                  {
+                    ref: (el) => {
+                      itemRefs.current[index] = el;
+                    },
+                    type: "button",
+                    role: "radio",
+                    "aria-checked": selected,
+                    "aria-label": option.label,
+                    title: option.label,
+                    tabIndex: index === focusIndex ? 0 : -1,
+                    disabled,
+                    className: swatchClass,
+                    ...toDataAttributes({
+                      state: selected ? "checked" : "unchecked",
+                      contrast: option.contrast
+                    }),
+                    onClick: () => setValue(option.value),
+                    children: /* @__PURE__ */ jsx14(SwatchContent, { value: option.value, selected })
+                  },
+                  option.value ?? "empty"
+                )
+              );
+            }),
+            name ? /* @__PURE__ */ jsx14("input", { type: "hidden", name, value: value ?? "" }) : null
+          ]
+        }
+      )
+    }
+  );
+}
+
+// src/components/empty-page/EmptyPage.module.css
+var EmptyPage_default = {
+  root: "EmptyPage_root",
+  iconWrap: "EmptyPage_iconWrap",
+  title: "EmptyPage_title",
+  description: "EmptyPage_description",
+  actions: "EmptyPage_actions"
+};
+
+// src/components/empty-page/EmptyPage.tsx
+import { jsx as jsx15 } from "react/jsx-runtime";
+function EmptyPageRoot({
+  size = "m",
+  layout = "default",
+  className,
+  children,
+  ...rest
+}) {
+  return /* @__PURE__ */ jsx15(
+    "div",
+    {
+      className: cx(EmptyPage_default.root, layout !== "compact" && enterMotion_default.enterBaseChildren, className),
+      ...rest,
+      ...toDataAttributes({ size, layout: layout === "default" ? void 0 : layout }),
+      children: /* @__PURE__ */ jsx15(ControlSizeProvider, { value: size, children })
+    }
+  );
+}
+EmptyPageRoot.displayName = "EmptyPage.Root";
+function EmptyPageIcon({ tone = "neutral", className, ...rest }) {
+  return /* @__PURE__ */ jsx15("div", { className: cx(EmptyPage_default.iconWrap, className), "data-tone": tone, ...rest });
+}
+EmptyPageIcon.displayName = "EmptyPage.Icon";
+function EmptyPageTitle({ as: Tag = "h2", className, ref, ...rest }) {
+  return /* @__PURE__ */ jsx15(Tag, { ref, className: cx(EmptyPage_default.title, className), ...rest });
+}
+EmptyPageTitle.displayName = "EmptyPage.Title";
+function EmptyPageDescription({ className, ...rest }) {
+  return /* @__PURE__ */ jsx15("p", { className: cx(EmptyPage_default.description, className), ...rest });
+}
+EmptyPageDescription.displayName = "EmptyPage.Description";
+function EmptyPageActions({ className, ...rest }) {
+  return /* @__PURE__ */ jsx15("div", { className: cx(EmptyPage_default.actions, className), ...rest });
+}
+EmptyPageActions.displayName = "EmptyPage.Actions";
+var EmptyPage = {
+  Root: EmptyPageRoot,
+  Icon: EmptyPageIcon,
+  Title: EmptyPageTitle,
+  Description: EmptyPageDescription,
+  Actions: EmptyPageActions
+};
+
+// src/components/divider/Divider.module.css
+var Divider_default = {
+  root: "Divider_root",
+  content: "Divider_content"
+};
+
+// src/components/divider/Divider.tsx
+import { jsx as jsx16 } from "react/jsx-runtime";
+function Divider({
+  orientation = "horizontal",
+  align = "center",
+  size = "m",
+  children,
+  className,
+  role = "separator",
+  ...rest
+}) {
+  return /* @__PURE__ */ jsx16(
+    "div",
+    {
+      ...rest,
+      className: cx(Divider_default.root, className),
+      role,
+      ...orientation === "vertical" ? { "aria-orientation": "vertical" } : {},
+      ...toDataAttributes({ orientation, align, size }),
+      children: children != null ? /* @__PURE__ */ jsx16(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx16("span", { className: Divider_default.content, children }) }) : null
+    }
+  );
+}
+
+// src/components/input/Input.tsx
+import * as React13 from "react";
+
+// src/internal/context.ts
+import * as React12 from "react";
+function createComponentContext(displayName) {
+  const Ctx = React12.createContext(null);
+  Ctx.displayName = `${displayName}Context`;
+  function useComponentContext() {
+    const value = React12.useContext(Ctx);
+    if (value === null) {
+      throw new Error(
+        `[prime-ui-kit] \`${displayName}\` sub-component must be used inside \`${displayName}.Root\`.`
+      );
+    }
+    return value;
+  }
+  return [Ctx.Provider, useComponentContext];
+}
+
+// src/components/input/Input.module.css
+var Input_default = {
+  root: "Input_root",
+  wrapper: "Input_wrapper",
+  affix: "Input_affix",
+  field: "Input_field",
+  inlineAffix: "Input_inlineAffix",
+  icon: "Input_icon",
+  action: "Input_action"
+};
+
+// src/components/input/Input.tsx
+import { jsx as jsx17 } from "react/jsx-runtime";
+var INPUT_LABELS = {
+  optional: "\u043D\u0435\u043E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u043E",
+  clear: "\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C",
+  counter: "{current} \u0438\u0437 {max} \u0441\u0438\u043C\u0432\u043E\u043B\u043E\u0432"
+};
+var [InputProvider, useInputContext] = createComponentContext("Input");
+function InputRoot({
+  size: sizeProp,
+  invalid,
+  focusRing = true,
+  label,
+  required = false,
+  optional = false,
+  hint,
+  error,
+  counter,
+  reserveSupportRow = false,
+  id,
+  labels: labelsProp,
+  children,
+  className,
+  ...rest
+}) {
+  const size = useControlSize(sizeProp);
+  const ids = useFieldFrame(id, { label, hint, error, invalid });
+  const labels = React13.useMemo(() => ({ ...INPUT_LABELS, ...labelsProp }), [labelsProp]);
+  const { invalid: isInvalid, controlId: inputId, describedBy } = ids;
+  const inputRef = React13.useRef(null);
+  const contextValue = React13.useMemo(
+    () => ({
+      size,
+      invalid: isInvalid,
+      focusRing,
+      required,
+      inputId,
+      inputRef,
+      describedBy,
+      labels
+    }),
+    [size, isInvalid, focusRing, required, inputId, describedBy, labels]
+  );
+  return /* @__PURE__ */ jsx17(InputProvider, { value: contextValue, children: /* @__PURE__ */ jsx17(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx17(
+    FieldFrame,
+    {
+      ...rest,
+      size,
+      ids,
+      label,
+      required,
+      optional,
+      hint,
+      error,
+      counter,
+      reserveSupportRow,
+      optionalLabel: labels.optional,
+      className: cx(fieldTierClass, Input_default.root, className),
+      children
+    }
+  ) }) });
+}
+InputRoot.displayName = "Input.Root";
+function InputWrapper({ children, className, ...rest }) {
+  const { size, invalid, focusRing } = useInputContext();
+  return /* @__PURE__ */ jsx17(
+    "div",
+    {
+      ...rest,
+      className: cx(fieldSurfaceClass, Input_default.wrapper, className),
+      ...toDataAttributes({
+        size,
+        invalid: invalid || void 0,
+        "focus-ring": focusRing ? void 0 : false
+      }),
+      children
+    }
+  );
+}
+InputWrapper.displayName = "Input.Wrapper";
+function InputField({
+  className,
+  "aria-describedby": ariaDescribedBy,
+  required,
+  onChange,
+  onValueChange,
+  ref,
+  ...rest
+}) {
+  const { inputId, inputRef, invalid, required: requiredCtx, describedBy } = useInputContext();
+  const setRefs = useMergedRefs(inputRef, ref);
+  const resolvedDescribedBy = [ariaDescribedBy, describedBy].filter(Boolean).join(" ") || void 0;
+  return /* @__PURE__ */ jsx17(
+    "input",
+    {
+      ...rest,
+      ref: setRefs,
+      id: inputId,
+      className: cx(Input_default.field, className),
+      "aria-invalid": invalid || void 0,
+      "aria-describedby": resolvedDescribedBy,
+      required: required ?? (requiredCtx || void 0),
+      onChange: (event) => {
+        onChange?.(event);
+        onValueChange?.(event.target.value);
+      }
+    }
+  );
+}
+InputField.displayName = "Input.Field";
+function InputIcon({ side, children, className, ...rest }) {
+  return /* @__PURE__ */ jsx17("span", { ...rest, className: cx(Input_default.icon, className), "data-side": side, "aria-hidden": "true", children });
+}
+InputIcon.displayName = "Input.Icon";
+function InputAffix({ side, children, className, ...rest }) {
+  return /* @__PURE__ */ jsx17("div", { ...rest, className: cx(Input_default.affix, className), "data-side": side, "aria-hidden": "true", children });
+}
+InputAffix.displayName = "Input.Affix";
+function InputInlineAffix({ side, children, className, ...rest }) {
+  return /* @__PURE__ */ jsx17(
+    "span",
+    {
+      ...rest,
+      className: cx(Input_default.inlineAffix, className),
+      "data-side": side,
+      "aria-hidden": "true",
+      children
+    }
+  );
+}
+InputInlineAffix.displayName = "Input.InlineAffix";
+function InputClearButton({ className, onClick: onClick2, ref, ...rest }) {
+  const { inputId, inputRef, labels } = useInputContext();
+  return /* @__PURE__ */ jsx17(
+    "button",
+    {
+      ...rest,
+      ref,
+      type: "button",
+      className: cx(Input_default.action, className),
+      "aria-label": labels.clear,
+      "aria-controls": inputId,
+      onClick: (event) => {
+        onClick2?.(event);
+        if (!event.defaultPrevented) inputRef.current?.focus();
+      },
+      children: /* @__PURE__ */ jsx17(Icon, { name: "action.close" })
+    }
+  );
+}
+InputClearButton.displayName = "Input.ClearButton";
+function InputCounter(props) {
+  const { size, labels } = useInputContext();
+  return /* @__PURE__ */ jsx17(FieldCounter, { ...props, size, label: labels.counter });
+}
+InputCounter.displayName = "Input.Counter";
+var Input = {
+  Root: InputRoot,
+  Wrapper: InputWrapper,
+  Field: InputField,
+  Icon: InputIcon,
+  Affix: InputAffix,
+  InlineAffix: InputInlineAffix,
+  ClearButton: InputClearButton,
+  Counter: InputCounter
+};
+
+// src/internal/imageSlot.tsx
+import * as React15 from "react";
+
+// src/hooks/useImageStatus.ts
+import * as React14 from "react";
+function useImageStatus(report, { onLoad, onError } = {}) {
+  const [status, setStatus] = React14.useState("loading");
+  React14.useLayoutEffect(() => {
+    report("loading");
+    return () => report("idle");
+  }, [report]);
+  const handleLoad = React14.useCallback(
+    (event) => {
+      setStatus("loaded");
+      report("loaded");
+      onLoad?.(event);
+    },
+    [onLoad, report]
+  );
+  const handleError = React14.useCallback(
+    (event) => {
+      setStatus("error");
+      report("error");
+      onError?.(event);
+    },
+    [onError, report]
+  );
+  return { status, onLoad: handleLoad, onError: handleError };
+}
+
+// src/internal/imageSlot.tsx
+import { jsx as jsx18 } from "react/jsx-runtime";
+function createImageSlot(name, classNames) {
+  const [Provider, useSlotContext] = createComponentContext(name);
+  function ImageSlotProvider({ children }) {
+    const [imageStatus, setImageStatus] = React15.useState("idle");
+    const value = React15.useMemo(() => ({ imageStatus, setImageStatus }), [imageStatus]);
+    return /* @__PURE__ */ jsx18(Provider, { value, children });
+  }
+  function ImageInner({ src, alt = "", className, onLoad, onError, ...rest }) {
+    const { setImageStatus } = useSlotContext();
+    const image = useImageStatus(setImageStatus, { onLoad, onError });
+    return /* @__PURE__ */ jsx18(
+      "img",
+      {
+        src,
+        alt,
+        className: cx(classNames.image, className),
+        onLoad: image.onLoad,
+        onError: image.onError,
+        ...toDataAttributes({ status: image.status }),
+        ...rest
+      }
+    );
+  }
+  function Image2(props) {
+    return /* @__PURE__ */ jsx18(ImageInner, { ...props }, props.src);
+  }
+  Image2.displayName = `${name}.Image`;
+  function Fallback({ className, ...rest }) {
+    const { imageStatus } = useSlotContext();
+    return /* @__PURE__ */ jsx18(
+      "span",
+      {
+        className: cx(classNames.fallback, className),
+        "aria-hidden": imageStatus === "loaded" ? true : void 0,
+        ...rest
+      }
+    );
+  }
+  Fallback.displayName = `${name}.Fallback`;
+  return {
+    ImageSlotProvider,
+    useImageSlot: () => useSlotContext().imageStatus,
+    Image: Image2,
+    Fallback
+  };
+}
+
+// src/internal/palette.module.css
+var palette_default = {
+  hue: "palette_hue"
+};
+
+// src/components/thumbnail/Thumbnail.module.css
+var Thumbnail_default = {
+  root: "Thumbnail_root",
+  image: "Thumbnail_image",
+  fallback: "Thumbnail_fallback"
+};
+
+// src/components/thumbnail/Thumbnail.tsx
+import { jsx as jsx19 } from "react/jsx-runtime";
+var slot = createImageSlot("Thumbnail", { image: Thumbnail_default.image, fallback: Thumbnail_default.fallback });
+function ThumbnailRoot({
+  size = "m",
+  ratio = "1:1",
+  color = "gray",
+  variant = "soft",
+  fullWidth = false,
+  ring = false,
+  className,
+  children,
+  ...rest
+}) {
+  return /* @__PURE__ */ jsx19(slot.ImageSlotProvider, { children: /* @__PURE__ */ jsx19(
+    "div",
+    {
+      className: cx(Thumbnail_default.root, palette_default.hue, className),
+      ...toDataAttributes({
+        size,
+        ratio,
+        color,
+        variant,
+        "full-width": fullWidth || void 0,
+        ring: ring || void 0
+      }),
+      ...rest,
+      children
+    }
+  ) });
+}
+ThumbnailRoot.displayName = "Thumbnail.Root";
+function ThumbnailImage({ fit = "cover", ...rest }) {
+  return /* @__PURE__ */ jsx19(slot.Image, { ...rest, "data-fit": fit });
+}
+ThumbnailImage.displayName = "Thumbnail.Image";
+var ThumbnailFallback = slot.Fallback;
+var Thumbnail = {
+  Root: ThumbnailRoot,
+  Image: ThumbnailImage,
+  Fallback: ThumbnailFallback
+};
+
+// src/components/select/Select.tsx
+import * as React26 from "react";
+
+// src/internal/listbox.ts
+import * as React16 from "react";
+var optionDomId = (listboxId, value) => `${listboxId}-opt-${value.replace(/\s+/g, "_")}`;
+function enabledOptions(container) {
+  if (!container) return [];
+  return Array.from(
+    container.querySelectorAll('[role="option"]:not([data-disabled="true"])')
+  );
+}
+function createStore(initial) {
+  let value = initial;
+  const listeners = /* @__PURE__ */ new Set();
+  return {
+    get: () => value,
+    set: (next) => {
+      if (Object.is(value, next)) return;
+      value = next;
+      for (const listener of listeners) listener();
+    },
+    subscribe: (listener) => {
+      listeners.add(listener);
+      return () => listeners.delete(listener);
+    }
+  };
+}
+function useCreateStore(initial) {
+  return React16.useState(() => createStore(initial))[0];
+}
+function useStoreSlice(store, select) {
+  const read = () => select(store.get());
+  return React16.useSyncExternalStore(store.subscribe, read, read);
+}
+function handleListboxKeyDown(event, { items, highlight, onSelect }) {
+  if (items.length === 0) return;
+  const highlighted = highlight.get();
+  const current = items.findIndex((item) => item.dataset.value === highlighted);
+  const next = rovingIndex(event.key, current, items.length, "vertical");
+  if (next !== null) {
+    event.preventDefault();
+    const item = items[next];
+    highlight.set(item?.dataset.value);
+    item?.scrollIntoView?.({ block: "nearest" });
+    return;
+  }
+  if (event.key === "Enter" || event.key === " ") {
+    event.preventDefault();
+    if (highlighted === void 0) return;
+    onSelect(highlighted, items[current]?.dataset.label ?? highlighted);
+  }
+}
+var TYPEAHEAD_RESET_MS = 500;
+function useTypeahead() {
+  const state = React16.useRef({ buffer: "", timer: 0 });
+  React16.useEffect(() => () => window.clearTimeout(state.current.timer), []);
+  const isTyping = React16.useCallback(() => state.current.buffer !== "", []);
+  const find = React16.useCallback(
+    (key, items, highlighted) => {
+      const s = state.current;
+      window.clearTimeout(s.timer);
+      s.buffer += key.toLocaleLowerCase();
+      s.timer = window.setTimeout(() => {
+        s.buffer = "";
+      }, TYPEAHEAD_RESET_MS);
+      const start = items.findIndex((item) => item.dataset.value === highlighted);
+      const repeated = [...s.buffer].every((char) => char === s.buffer[0]);
+      const prefix = repeated ? key.toLocaleLowerCase() : s.buffer;
+      const from = repeated ? start + 1 : Math.max(start, 0);
+      return [...items.slice(from), ...items.slice(0, from)].find(
+        (item) => (item.dataset.label ?? "").toLocaleLowerCase().startsWith(prefix)
+      );
+    },
+    []
+  );
+  return { find, isTyping };
+}
+
+// src/internal/MenuGroup.tsx
+import * as React17 from "react";
+
+// src/internal/menu.module.css
+var menu_default = {
+  tier: "menu_tier",
+  menu: "menu_menu",
+  item: "menu_item",
+  itemIcon: "menu_itemIcon",
+  shortcut: "menu_shortcut",
+  group: "menu_group",
+  groupLabel: "menu_groupLabel",
+  separator: "menu_separator",
+  searchRow: "menu_searchRow",
+  searchInput: "menu_searchInput"
+};
+
+// src/internal/MenuGroup.tsx
+import { jsx as jsx20, jsxs as jsxs9 } from "react/jsx-runtime";
+function MenuGroup({ label, className, children, ...rest }) {
+  const labelId = React17.useId();
+  return (
+    // biome-ignore lint/a11y/useSemanticElements: role="group" inside a menu / listbox; <fieldset> is not allowed there
+    /* @__PURE__ */ jsxs9(
+      "div",
+      {
+        ...rest,
+        role: "group",
+        "aria-labelledby": label != null ? labelId : void 0,
+        className: cx(menu_default.group, className),
+        children: [
+          label != null ? /* @__PURE__ */ jsx20("div", { id: labelId, role: "presentation", className: menu_default.groupLabel, children: label }) : null,
+          children
+        ]
+      }
+    )
+  );
+}
+
+// src/internal/floatingSurface.module.css
+var floatingSurface_default = {
+  surface: "floatingSurface_surface",
+  layer: "floatingSurface_layer"
+};
+
+// src/internal/overlayMotion.module.css
+var overlayMotion_default = {
+  dialog: "overlayMotion_dialog",
+  drawer: "overlayMotion_drawer",
+  floating: "overlayMotion_floating",
+  scrim: "overlayMotion_scrim",
+  overlayFadeIn: "overlayMotion_overlayFadeIn",
+  overlayFadeOut: "overlayMotion_overlayFadeOut",
+  overlayDialogIn: "overlayMotion_overlayDialogIn",
+  overlayDialogOut: "overlayMotion_overlayDialogOut",
+  overlaySheetIn: "overlayMotion_overlaySheetIn",
+  overlaySheetOut: "overlayMotion_overlaySheetOut",
+  overlayDrawerIn: "overlayMotion_overlayDrawerIn",
+  overlayDrawerOut: "overlayMotion_overlayDrawerOut",
+  overlayFloatIn: "overlayMotion_overlayFloatIn",
+  overlayFloatOut: "overlayMotion_overlayFloatOut"
+};
+
+// src/internal/Portal.tsx
+import * as React18 from "react";
+import { createPortal } from "react-dom";
+function Portal({ children, container }) {
+  const [mounted, setMounted] = React18.useState(false);
+  React18.useLayoutEffect(() => {
+    setMounted(true);
+    return () => setMounted(false);
+  }, []);
+  if (!mounted) return null;
+  return createPortal(children, container ?? document.body);
+}
+
+// src/internal/overlay/layerStack.ts
+import * as React19 from "react";
+
+// src/internal/overlay/focus.ts
+var FOCUSABLE = [
+  "a[href]",
+  "button:not([disabled])",
+  'input:not([disabled]):not([type="hidden"])',
+  "select:not([disabled])",
+  "textarea:not([disabled])",
+  "[tabindex]"
+].map((selector) => `${selector}:not([tabindex="-1"])`).join(", ");
+function getFocusable(container) {
+  return Array.from(container.querySelectorAll(FOCUSABLE)).filter((el) => {
+    if (el.getAttribute("aria-hidden") === "true") return false;
+    const style = window.getComputedStyle(el);
+    return style.display !== "none" && style.visibility !== "hidden";
+  });
+}
+function focusInto(container) {
+  if (container.contains(document.activeElement)) return;
+  const target = container.querySelector("[data-autofocus]") ?? getFocusable(container)[0] ?? container;
+  target.focus({ preventScroll: true });
+}
+function focusBack(el) {
+  if (el?.isConnected) el.focus({ preventScroll: true });
+}
+function activeElement() {
+  if (typeof document === "undefined") return null;
+  const el = document.activeElement;
+  return el instanceof HTMLElement && el !== document.body ? el : null;
+}
+
+// src/internal/overlay/layerStack.ts
+var stack = [];
+var pendingClick = null;
+function isAncestor(ancestor, entry) {
+  for (let p = entry.parent; p; p = p.parent) if (p === ancestor) return true;
+  return false;
+}
+function contains(entry, target) {
+  return target !== null && entry.refs.some((ref) => ref.current?.contains(target));
+}
+function topInteractive() {
+  for (let i = stack.length - 1; i >= 0; i--) {
+    if (stack[i]?.dismiss !== "none") return stack[i];
+  }
+  return void 0;
+}
+function trapTab(event) {
+  const active = document.activeElement;
+  for (let i = stack.length - 1; i >= 0; i--) {
+    const entry = stack[i];
+    if (!entry || entry.dismiss === "none") continue;
+    const panel = entry.refs[0]?.current;
+    if (!panel) continue;
+    const inside = panel.contains(active);
+    if (!entry.trap) {
+      if (inside) return;
+      continue;
+    }
+    const focusable = getFocusable(panel);
+    if (focusable.length === 0) {
+      event.preventDefault();
+      panel.focus({ preventScroll: true });
+      return;
+    }
+    const first = focusable[0];
+    const last = focusable[focusable.length - 1];
+    if (event.shiftKey ? !inside || active === first : !inside || active === last) {
+      event.preventDefault();
+      (event.shiftKey ? last : first)?.focus();
+    }
+    return;
+  }
+}
+function onKeyDown(event) {
+  if (event.key === "Tab") {
+    trapTab(event);
+    return;
+  }
+  if (event.key !== "Escape" || event.defaultPrevented) return;
+  stack[stack.length - 1]?.onDismiss("escape");
+}
+function onPointerDown(event) {
+  pendingClick = null;
+  const top = topInteractive();
+  const target = event.target instanceof Node ? event.target : null;
+  if (!top || !target || contains(top, target)) return;
+  if (top.dismiss === "click") pendingClick = top;
+  else top.onDismiss("outside");
+}
+function onClick(event) {
+  const layer = pendingClick;
+  pendingClick = null;
+  const target = event.target instanceof Node ? event.target : null;
+  if (!layer || layer !== topInteractive() || !target || contains(layer, target)) return;
+  layer.onDismiss("scrim");
+}
+function listen(on) {
+  if (on) {
+    document.addEventListener("keydown", onKeyDown);
+    document.addEventListener("pointerdown", onPointerDown, true);
+    document.addEventListener("click", onClick, true);
+  } else {
+    document.removeEventListener("keydown", onKeyDown);
+    document.removeEventListener("pointerdown", onPointerDown, true);
+    document.removeEventListener("click", onClick, true);
+  }
+}
+function push(entry) {
+  if (stack.length === 0) listen(true);
+  const below = stack.findIndex((other) => isAncestor(entry, other));
+  if (below === -1) stack.push(entry);
+  else stack.splice(below, 0, entry);
+  return () => {
+    const index = stack.indexOf(entry);
+    if (index !== -1) stack.splice(index, 1);
+    if (pendingClick === entry) pendingClick = null;
+    if (stack.length === 0) listen(false);
+  };
+}
+var LayerContext = React19.createContext(null);
+var LayerProvider = LayerContext.Provider;
+function useLayer(open, options) {
+  const parent = React19.useContext(LayerContext);
+  const [entry] = React19.useState(() => ({ parent, trap: false, ...options }));
+  entry.parent = parent;
+  entry.refs = options.refs;
+  entry.dismiss = options.dismiss;
+  entry.trap = options.trap ?? false;
+  entry.onDismiss = options.onDismiss;
+  React19.useLayoutEffect(() => open ? push(entry) : void 0, [open, entry]);
+  return entry;
+}
+
+// src/internal/overlay/FloatingPanel.tsx
+import { jsx as jsx21 } from "react/jsx-runtime";
+function FloatingPanel({
+  floating,
+  size,
+  scroll = false,
+  surface = true,
+  className,
+  onKeyDown: onKeyDown2,
+  children,
+  ref,
+  ...rest
+}) {
+  const panelRef = useMergedRefs(floating.panelRef, ref);
+  if (!floating.mounted) return null;
+  const props = {
+    ...rest,
+    className: cx(
+      surface && floatingSurface_default.surface,
+      floatingSurface_default.layer,
+      overlayMotion_default.floating,
+      className
+    ),
+    "data-state": floating.presence.state,
+    "data-side": floating.side,
+    "data-size": size,
+    onAnimationEnd: floating.presence.onExitEnd,
+    onKeyDown: (event) => {
+      onKeyDown2?.(event);
+      floating.onKeyDown(event);
+    }
+  };
+  return /* @__PURE__ */ jsx21(Portal, { children: /* @__PURE__ */ jsx21(LayerProvider, { value: floating.layer, children: /* @__PURE__ */ jsx21(ControlSizeProvider, { value: size, children: scroll ? /* @__PURE__ */ jsx21(ScrollContainer, { ...props, ref: panelRef, children }) : /* @__PURE__ */ jsx21("div", { ...props, ref: panelRef, children }) }) }) });
+}
+function FloatingTrigger({ triggerProps, children, ...forwarded }) {
+  return /* @__PURE__ */ jsx21(Slot, { ...forwarded, children: /* @__PURE__ */ jsx21(Slot, { ...triggerProps, children }) });
+}
+
+// src/internal/overlay/useFloatingLayer.ts
+import * as React23 from "react";
+
+// src/hooks/usePosition.ts
+import * as React21 from "react";
+
+// src/internal/AnchorRectContext.tsx
+import * as React20 from "react";
+var AnchorRectContext = React20.createContext(null);
+var AnchorRectProvider = AnchorRectContext.Provider;
+function useAnchorRectResolver() {
+  return React20.useContext(AnchorRectContext);
+}
+
+// src/internal/layoutPxFromPrimitives.ts
+var FALLBACK_ROOT_FONT_PX = 16;
+function getRootFontSizePx() {
+  if (typeof document === "undefined") {
+    return FALLBACK_ROOT_FONT_PX;
+  }
+  const raw = getComputedStyle(document.documentElement).fontSize;
+  const parsed = Number.parseFloat(raw);
+  return Number.isFinite(parsed) && parsed > 0 ? parsed : FALLBACK_ROOT_FONT_PX;
+}
+
+// src/internal/scrollAncestors.ts
+var SCROLLABLE = /^(auto|scroll|overlay)$/;
+function getScrollContainers(node) {
+  const out = [window];
+  if (!node || typeof window === "undefined") return out;
+  for (let el = node.parentElement; el; el = el.parentElement) {
+    const { overflowX, overflowY } = window.getComputedStyle(el);
+    if (SCROLLABLE.test(overflowY) || SCROLLABLE.test(overflowX)) {
+      out.push(el);
+    }
+  }
+  if (window.visualViewport) out.push(window.visualViewport);
+  return out;
+}
+
+// src/hooks/usePosition.ts
+var FLOAT_MAX_HEIGHT_VAR = "--float-max-h";
+var FLOAT_MIN_WIDTH_VAR = "--float-min-w";
+var FLOAT_MAX_WIDTH_VAR = "--float-max-w";
+var FLOAT_ARROW_VAR = "--float-arrow";
+var MIN_MENU_ESTIMATE = 176;
+var FALLBACK_VIEWPORT_PAD_PX = 8;
+var FALLBACK_PANEL_OFFSET_PX = 4;
+var MIN_FLOATING_MAX_HEIGHT = 120;
+var FIRST_PAINT_FLOAT_HEIGHT_GUESS_PX = 280;
+var OPPOSITE = {
+  top: "bottom",
+  bottom: "top",
+  left: "right",
+  right: "left"
+};
+function readCssLengthPx(name, fallbackPx) {
+  if (typeof document === "undefined") return fallbackPx;
+  const raw = getComputedStyle(document.documentElement).getPropertyValue(name).trim();
+  if (!raw) return fallbackPx;
+  const n = Number.parseFloat(raw);
+  if (!Number.isFinite(n)) return fallbackPx;
+  if (raw.endsWith("rem")) return Math.round(n * getRootFontSizePx());
+  if (raw.endsWith("px") || n === 0) return Math.round(n);
+  return fallbackPx;
+}
+function getViewportPadPx() {
+  return readCssLengthPx("--prime-space-2", FALLBACK_VIEWPORT_PAD_PX);
+}
+var clamp = (value, min, max) => Math.max(min, Math.min(value, Math.max(min, max)));
+function computeFloatingPosition(anchor, contentW, contentH, vw, vh, opts) {
+  const { align, offset, flip, matchAnchorWidth, arrowInset } = opts;
+  const pad = opts.viewportPad ?? FALLBACK_VIEWPORT_PAD_PX;
+  const room = {
+    top: anchor.top - offset - pad,
+    bottom: vh - anchor.bottom - offset - pad,
+    left: anchor.left - offset - pad,
+    right: vw - anchor.right - offset - pad
+  };
+  const isVertical = (s) => s === "top" || s === "bottom";
+  const mainSize = isVertical(opts.side) ? contentH : contentW;
+  let side = opts.side;
+  if (flip && mainSize > 0 && room[side] < mainSize) {
+    const opposite = OPPOSITE[side];
+    if (room[opposite] >= mainSize || room[opposite] > room[side]) side = opposite;
+  }
+  const vertical = isVertical(side);
+  const viewportMaxWidth = Math.max(0, Math.floor(vw - pad * 2));
+  const maxWidth = vertical ? viewportMaxWidth : Math.max(0, Math.min(viewportMaxWidth, Math.floor(room[side])));
+  const width = Math.min(
+    maxWidth,
+    contentW > 0 ? contentW : matchAnchorWidth ? anchor.width : Math.max(anchor.width, MIN_MENU_ESTIMATE)
+  );
+  let main;
+  if (side === "bottom") main = anchor.bottom + offset;
+  else if (side === "right") main = anchor.right + offset;
+  else if (side === "left") main = Math.max(pad, anchor.left - offset - width);
+  else
+    main = Math.max(
+      pad,
+      anchor.top - offset - (contentH > 0 ? contentH : FIRST_PAINT_FLOAT_HEIGHT_GUESS_PX)
+    );
+  const anchorStart = vertical ? anchor.left : anchor.top;
+  const anchorSize = vertical ? anchor.width : anchor.height;
+  const crossSize = vertical ? width : contentH;
+  const viewport = vertical ? vw : vh;
+  const crossFor = (a) => a === "start" ? anchorStart : a === "end" ? anchorStart + anchorSize - crossSize : anchorStart + anchorSize / 2 - crossSize / 2;
+  const fits = (x) => x >= pad && x + crossSize <= viewport - pad;
+  let cross = crossFor(align);
+  if (flip && !fits(cross)) {
+    const opposite = align === "end" ? "start" : align === "start" ? "end" : align;
+    if (opposite !== align && fits(crossFor(opposite))) cross = crossFor(opposite);
+  }
+  cross = Math.round(clamp(cross, pad, viewport - crossSize - pad));
+  const out = {
+    top: Math.round(vertical ? main : cross),
+    left: Math.round(vertical ? cross : main),
+    side,
+    maxWidth,
+    maxHeight: Math.max(MIN_FLOATING_MAX_HEIGHT, Math.floor(vertical ? room[side] : vh - pad * 2))
+  };
+  if (matchAnchorWidth) out.minWidth = Math.min(anchor.width, maxWidth);
+  if (arrowInset !== void 0) {
+    out.arrow = Math.round(
+      clamp(anchorStart + anchorSize / 2 - cross, arrowInset, crossSize - arrowInset)
+    );
+  }
+  return out;
+}
+function usePosition(enabled, anchorRef, layerRef, {
+  side: preferredSide = "bottom",
+  align = "start",
+  matchAnchorWidth = false,
+  offsetToken = "--prime-panel-offset",
+  arrowInset
+} = {}) {
+  const [attached, setAttached] = React21.useState(false);
+  const [resolvedSide, setResolvedSide] = React21.useState(preferredSide);
+  const resolveAnchorRect = useAnchorRectResolver();
+  const metricsRef = React21.useRef(null);
+  const update = React21.useCallback(
+    (remeasure) => {
+      const anchor = anchorRef.current;
+      const layer = layerRef.current;
+      if (!anchor || !layer) return;
+      if (remeasure || !metricsRef.current) {
+        metricsRef.current = {
+          offset: readCssLengthPx(offsetToken, FALLBACK_PANEL_OFFSET_PX),
+          pad: getViewportPadPx(),
+          arrow: arrowInset?.(layer)
+        };
+      }
+      const { offset, pad, arrow } = metricsRef.current;
+      const rect = anchor.getBoundingClientRect();
+      const pos = computeFloatingPosition(
+        resolveAnchorRect ? resolveAnchorRect(anchor, rect) : rect,
+        layer.offsetWidth,
+        layer.offsetHeight,
+        window.innerWidth,
+        window.innerHeight,
+        {
+          side: preferredSide,
+          align,
+          offset,
+          viewportPad: pad,
+          flip: true,
+          matchAnchorWidth,
+          arrowInset: arrow
+        }
+      );
+      setResolvedSide(pos.side);
+      const set = (name, value) => {
+        if (layer.style.getPropertyValue(name) !== value) layer.style.setProperty(name, value);
+      };
+      const px = (n) => n === void 0 ? "" : `${n}px`;
+      set("position", "fixed");
+      set("top", px(pos.top));
+      set("left", px(pos.left));
+      set(FLOAT_MIN_WIDTH_VAR, px(pos.minWidth));
+      set(FLOAT_MAX_WIDTH_VAR, px(pos.maxWidth));
+      set(FLOAT_MAX_HEIGHT_VAR, px(pos.maxHeight));
+      set(FLOAT_ARROW_VAR, px(pos.arrow));
+    },
+    [
+      anchorRef,
+      layerRef,
+      preferredSide,
+      align,
+      matchAnchorWidth,
+      offsetToken,
+      arrowInset,
+      resolveAnchorRect
+    ]
+  );
+  const updateRef = React21.useRef(update);
+  updateRef.current = update;
+  const attachLayer = React21.useCallback(
+    (node) => {
+      layerRef.current = node;
+      setAttached(node !== null);
+    },
+    [layerRef]
+  );
+  const active = enabled && attached;
+  React21.useLayoutEffect(() => {
+    if (active) update(true);
+  }, [active, update]);
+  React21.useLayoutEffect(() => {
+    if (!active) return;
+    let frame = 0;
+    let remeasure = false;
+    const schedule = (measure) => {
+      remeasure ||= measure;
+      cancelAnimationFrame(frame);
+      frame = requestAnimationFrame(() => {
+        updateRef.current(remeasure);
+        remeasure = false;
+      });
+    };
+    const follow = () => schedule(false);
+    const resize = () => schedule(true);
+    window.addEventListener("resize", resize);
+    const scrollTargets = getScrollContainers(anchorRef.current);
+    for (const target of scrollTargets) {
+      target.addEventListener("scroll", follow, { passive: true });
+    }
+    window.visualViewport?.addEventListener("resize", resize);
+    const observer = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(follow);
+    if (layerRef.current) observer?.observe(layerRef.current);
+    if (anchorRef.current) observer?.observe(anchorRef.current);
+    return () => {
+      cancelAnimationFrame(frame);
+      window.removeEventListener("resize", resize);
+      for (const target of scrollTargets) target.removeEventListener("scroll", follow);
+      window.visualViewport?.removeEventListener("resize", resize);
+      observer?.disconnect();
+    };
+  }, [active, anchorRef, layerRef]);
+  return { side: resolvedSide, attachLayer };
+}
+
+// src/hooks/usePresence.ts
+import * as React22 from "react";
+var DURATION_FALLBACK_MS = {
+  fast: 230,
+  base: 380,
+  slow: 570
+};
+var TIMEOUT_SLACK_MS = 50;
+function prefersReducedMotion() {
+  return typeof window !== "undefined" && typeof window.matchMedia === "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+}
+function parseDurationMs(raw) {
+  const value = raw.trim();
+  if (value === "") return null;
+  const n = Number.parseFloat(value);
+  if (Number.isNaN(n)) return null;
+  if (value.endsWith("ms")) return n;
+  if (value.endsWith("s")) return n * 1e3;
+  return null;
+}
+function motionDurationMs(token) {
+  if (typeof document === "undefined") return DURATION_FALLBACK_MS[token];
+  const raw = getComputedStyle(document.documentElement).getPropertyValue(
+    `--prime-motion-duration-${token}`
+  );
+  return parseDurationMs(raw) ?? DURATION_FALLBACK_MS[token];
+}
+function exitTimeoutMs(token) {
+  return motionDurationMs(token) + TIMEOUT_SLACK_MS;
+}
+function usePresence(open, options = {}) {
+  const { exitDuration = "base" } = options;
+  const [mounted, setMounted] = React22.useState(open);
+  if (open && !mounted) setMounted(true);
+  if (!open && mounted && prefersReducedMotion()) setMounted(false);
+  const openRef = React22.useRef(open);
+  openRef.current = open;
+  React22.useEffect(() => {
+    if (open || !mounted) return;
+    const id = window.setTimeout(() => setMounted(false), exitTimeoutMs(exitDuration));
+    return () => window.clearTimeout(id);
+  }, [open, mounted, exitDuration]);
+  const onExitEnd = React22.useCallback((event) => {
+    if (event.target !== event.currentTarget) return;
+    if (!openRef.current) setMounted(false);
+  }, []);
+  return { mounted: open || mounted, state: open ? "open" : "closed", onExitEnd };
+}
+
+// src/internal/overlay/useFloatingLayer.ts
+function useFloatingLayer({
+  open,
+  onOpenChange,
+  triggerRef,
+  closeOnEscape = true,
+  closeOnOutsideClick = true,
+  dismiss = "pointerdown",
+  focusOnOpen = false,
+  trap = false,
+  tabExit = "none",
+  exitDuration = "fast",
+  skipExit = false,
+  ...positionOptions
+}) {
+  const presence = usePresence(open, { exitDuration });
+  const mounted = presence.mounted && (open || !skipExit);
+  const contentRef = React23.useRef(null);
+  const position = usePosition(mounted, triggerRef, contentRef, positionOptions);
+  const [panel, setPanel] = React23.useState(null);
+  const { attachLayer } = position;
+  const panelRef = React23.useCallback(
+    (node) => {
+      attachLayer(node);
+      setPanel(node);
+    },
+    [attachLayer]
+  );
+  const outsideRef = React23.useRef(false);
+  const close = React23.useCallback(() => {
+    outsideRef.current = false;
+    onOpenChange(false);
+  }, [onOpenChange]);
+  const onDismiss = (reason) => {
+    if (reason === "escape") {
+      if (closeOnEscape) close();
+    } else if (closeOnOutsideClick) {
+      outsideRef.current = true;
+      onOpenChange(false);
+    }
+  };
+  const layer = useLayer(open, {
+    refs: [contentRef, triggerRef],
+    dismiss,
+    trap,
+    onDismiss
+  });
+  const passive = dismiss === "none";
+  React23.useEffect(() => {
+    if (!open || !panel || passive) return;
+    outsideRef.current = false;
+    if (focusOnOpen) focusInto(panel);
+    return () => {
+      if (outsideRef.current) return;
+      const active = document.activeElement;
+      if (!active || active === document.body || panel.contains(active)) {
+        focusBack(triggerRef.current);
+      }
+    };
+  }, [open, panel, passive, focusOnOpen, triggerRef]);
+  const onKeyDown2 = (event) => {
+    if (event.key !== "Tab" || event.defaultPrevented || trap || tabExit === "none") return;
+    const node = contentRef.current;
+    if (!node) return;
+    if (tabExit === "edges") {
+      const focusable = getFocusable(node);
+      const active = document.activeElement;
+      const leaving = event.shiftKey ? active === node || active === focusable[0] : focusable.length === 0 || active === focusable[focusable.length - 1];
+      if (!leaving) return;
+    }
+    if (event.shiftKey) event.preventDefault();
+    focusBack(triggerRef.current);
+    close();
+  };
+  return {
+    open,
+    presence,
+    mounted,
+    side: position.side,
+    panelRef,
+    contentRef,
+    layer,
+    close,
+    onKeyDown: onKeyDown2
+  };
+}
+
+// src/components/select/Select.module.css
+var Select_default = {
+  trigger: "Select_trigger",
+  triggerMain: "Select_triggerMain",
+  value: "Select_value",
+  valueBody: "Select_valueBody",
+  triggerIcon: "Select_triggerIcon",
+  chevron: "Select_chevron",
+  clear: "Select_clear",
+  content: "Select_content",
+  listbox: "Select_listbox",
+  search: "Select_search",
+  group: "Select_group",
+  separator: "Select_separator",
+  status: "Select_status",
+  item: "Select_item",
+  itemText: "Select_itemText",
+  itemTitle: "Select_itemTitle",
+  itemDescription: "Select_itemDescription",
+  itemMeta: "Select_itemMeta",
+  media: "Select_media",
+  check: "Select_check"
+};
+
+// src/components/select/SelectItem.tsx
+import * as React25 from "react";
+
+// src/internal/HighlightMatch.tsx
+import * as React24 from "react";
+
+// src/internal/HighlightMatch.module.css
+var HighlightMatch_default = {
+  match: "HighlightMatch_match"
+};
+
+// src/internal/HighlightMatch.tsx
+import { Fragment as Fragment4, jsx as jsx22, jsxs as jsxs10 } from "react/jsx-runtime";
+function matchIndex(text, query) {
+  if (!query) return -1;
+  return text.toLowerCase().indexOf(query.toLowerCase());
+}
+function HighlightMatch({ text, query }) {
+  const q = query.trim();
+  const at = matchIndex(text, q);
+  if (at < 0) return /* @__PURE__ */ jsx22(Fragment4, { children: text });
+  return /* @__PURE__ */ jsxs10("span", { children: [
+    text.slice(0, at),
+    /* @__PURE__ */ jsx22("mark", { className: HighlightMatch_default.match, children: text.slice(at, at + q.length) }),
+    text.slice(at + q.length)
+  ] });
+}
+function highlightChildren(children, query) {
+  if (!query.trim()) return children;
+  return React24.Children.map(
+    children,
+    (child) => typeof child === "string" || typeof child === "number" ? /* @__PURE__ */ jsx22(HighlightMatch, { text: String(child), query }) : child
+  );
+}
+
+// src/components/select/selectContext.ts
+var normalize = (text) => text.trim().toLocaleLowerCase();
+function createItemRegistry() {
+  const entries = /* @__PURE__ */ new Map();
+  const version = createStore(0);
+  const bump = () => version.set(version.get() + 1);
+  return {
+    version,
+    labelOf: (value) => entries.get(value)?.label ?? value,
+    register: (value, label, haystack) => {
+      const entry = entries.get(value);
+      entries.set(value, { label, haystack, mounted: (entry?.mounted ?? 0) + 1 });
+      bump();
+      return () => {
+        const current = entries.get(value);
+        if (current) current.mounted -= 1;
+        bump();
+      };
+    },
+    anyMatch: (query) => {
+      for (const entry of entries.values()) {
+        if (entry.mounted > 0 && (query === "" || entry.haystack.includes(query))) return true;
+      }
+      return false;
+    }
+  };
+}
+var [SelectProvider, useSelectContext] = createComponentContext("Select");
+
+// src/components/select/SelectItem.tsx
+import { jsx as jsx23, jsxs as jsxs11 } from "react/jsx-runtime";
+var MEDIA_SIZE = { xs: "xs", s: "xs", m: "s", l: "s", xl: "m" };
+function textOf(node) {
+  if (node == null || typeof node === "boolean") return "";
+  if (typeof node === "string" || typeof node === "number") return String(node);
+  if (Array.isArray(node)) return node.map(textOf).join("");
+  if (React25.isValidElement(node))
+    return textOf(node.props.children);
+  return "";
+}
+function SelectItemIcon({ className, ...rest }) {
+  return /* @__PURE__ */ jsx23("span", { "aria-hidden": "true", className: cx(menu_default.itemIcon, className), ...rest });
+}
+SelectItemIcon.displayName = "Select.ItemIcon";
+var OptionQueryContext = React25.createContext("");
+function SelectItemText({ children, className, ...rest }) {
+  const query = React25.useContext(OptionQueryContext);
+  return /* @__PURE__ */ jsx23("span", { ...rest, className: cx(Select_default.itemTitle, className), children: highlightChildren(children, query) });
+}
+SelectItemText.displayName = "Select.ItemText";
+function SelectItemDescription({
+  children,
+  className,
+  ...rest
+}) {
+  const query = React25.useContext(OptionQueryContext);
+  return /* @__PURE__ */ jsx23("span", { ...rest, className: cx(Select_default.itemDescription, className), children: highlightChildren(children, query) });
+}
+SelectItemDescription.displayName = "Select.ItemDescription";
+function SelectItemMeta({ children, className, ...rest }) {
+  return /* @__PURE__ */ jsx23("span", { ...rest, className: cx(Select_default.itemMeta, className), children });
+}
+SelectItemMeta.displayName = "Select.ItemMeta";
+function splitItemChildren(children) {
+  const parts = {
+    leading: [],
+    body: [],
+    meta: [],
+    rich: false,
+    title: "",
+    description: ""
+  };
+  let plain = "";
+  for (const child of React25.Children.toArray(children)) {
+    if (!React25.isValidElement(child)) {
+      plain += textOf(child);
+      parts.body.push(child);
+    } else if (child.type === React25.Fragment) {
+      const inner = splitItemChildren(child.props.children);
+      parts.leading.push(...inner.leading);
+      parts.body.push(...inner.body);
+      parts.meta.push(...inner.meta);
+      parts.rich ||= inner.rich;
+      parts.title ||= inner.title;
+      parts.description ||= inner.description;
+      plain += inner.title;
+    } else if (child.type === SelectItemIcon) {
+      parts.leading.push(child);
+    } else if (child.type === Thumbnail.Root) {
+      parts.leading.push(child);
+      parts.rich = true;
+    } else if (child.type === SelectItemMeta) {
+      parts.meta.push(child);
+    } else {
+      if (child.type === SelectItemText) parts.title = textOf(child.props.children);
+      if (child.type === SelectItemDescription) {
+        parts.description = textOf(child.props.children);
+        parts.rich = true;
+      }
+      parts.body.push(child);
+    }
+  }
+  parts.title = (parts.title || plain).trim();
+  return parts;
+}
+function sizeMedia(leading, size) {
+  return leading.map(
+    (node) => React25.isValidElement(node) && node.type === Thumbnail.Root ? React25.cloneElement(node, {
+      size: node.props.size ?? MEDIA_SIZE[size],
+      className: cx(Select_default.media, node.props.className),
+      "aria-hidden": true
+    }) : node
+  );
+}
+function SelectItem({
+  value,
+  label,
+  keywords,
+  disabled,
+  className,
+  children,
+  ref
+}) {
+  const { multiple, size, selected, highlight, pick, registry, listboxId, query } = useSelectContext();
+  const parts = splitItemChildren(children);
+  const resolvedLabel = label || parts.title || value;
+  const haystack = normalize(`${resolvedLabel} ${parts.description} ${keywords ?? ""}`);
+  const isSelected = selected.includes(value);
+  const isHighlighted = useStoreSlice(highlight, (current) => current === value);
+  React25.useLayoutEffect(
+    () => registry.register(value, resolvedLabel, haystack),
+    [registry, value, resolvedLabel, haystack]
+  );
+  const search = normalize(query);
+  if (search !== "" && !haystack.includes(search)) return null;
+  return (
+    // biome-ignore lint/a11y/useFocusableInteractive: focus stays on the listbox / search (aria-activedescendant)
+    // biome-ignore lint/a11y/useKeyWithClickEvents: the keyboard is handled on the listbox
+    /* @__PURE__ */ jsxs11(
+      "div",
+      {
+        ref,
+        id: optionDomId(listboxId, value),
+        role: "option",
+        "aria-selected": isSelected,
+        "aria-disabled": disabled || void 0,
+        className: cx(menu_default.item, Select_default.item, className),
+        onClick: () => {
+          if (!disabled) pick(value);
+        },
+        onMouseMove: () => {
+          if (!disabled && !isHighlighted) highlight.set(value);
+        },
+        ...toDataAttributes({
+          value,
+          label: resolvedLabel,
+          selected: isSelected,
+          highlighted: isHighlighted,
+          disabled: Boolean(disabled),
+          rich: parts.rich || void 0
+        }),
+        children: [
+          multiple ? /* @__PURE__ */ jsx23(Checkbox.Indicator, { checked: isSelected, disabled, size: stepDown(size) }) : null,
+          sizeMedia(parts.leading, size),
+          /* @__PURE__ */ jsx23("span", { className: Select_default.itemText, children: /* @__PURE__ */ jsx23(OptionQueryContext.Provider, { value: query, children: highlightChildren(parts.body, query) }) }),
+          parts.meta,
+          multiple ? null : /* @__PURE__ */ jsx23("span", { className: Select_default.check, "aria-hidden": "true", children: isSelected ? /* @__PURE__ */ jsx23(Icon, { name: "action.check" }) : null })
+        ]
+      }
+    )
+  );
+}
+SelectItem.displayName = "Select.Item";
+
+// src/components/select/Select.tsx
+import { jsx as jsx24, jsxs as jsxs12 } from "react/jsx-runtime";
+var SELECT_LABELS = {
+  search: "\u041F\u043E\u0438\u0441\u043A",
+  empty: "\u041D\u0438\u0447\u0435\u0433\u043E \u043D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D\u043E",
+  emptyHint: "\u041F\u043E\u043F\u0440\u043E\u0431\u0443\u0439\u0442\u0435 \u0438\u0437\u043C\u0435\u043D\u0438\u0442\u044C \u0437\u0430\u043F\u0440\u043E\u0441",
+  loading: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430\u2026",
+  clear: "\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C",
+  optional: "\u043D\u0435\u043E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u043E"
+};
+function SelectRoot(props) {
+  const {
+    size = "m",
+    label,
+    required = false,
+    optional,
+    hint,
+    error,
+    invalid,
+    focusRing = true,
+    disabled = false,
+    placeholder,
+    id,
+    open,
+    defaultOpen = false,
+    onOpenChange,
+    clearable = false,
+    loading = false,
+    labels: labelsProp,
+    className,
+    children,
+    multiple: _multiple,
+    value: _value,
+    defaultValue: _defaultValue,
+    onValueChange: _onValueChange,
+    ...rest
+  } = props;
+  const multiple = props.multiple === true;
+  const labels = React26.useMemo(() => ({ ...SELECT_LABELS, ...labelsProp }), [labelsProp]);
+  const ids = useFieldFrame(id, { hint, error, invalid });
+  const [value, setValue] = useControllableState({
+    value: props.value,
+    defaultValue: props.defaultValue ?? (multiple ? [] : void 0),
+    onChange: props.onValueChange
+  });
+  const selected = React26.useMemo(
+    () => Array.isArray(value) ? value : value ? [value] : [],
+    [value]
+  );
+  const [isOpen, setOpen] = useControllableState({
+    value: open,
+    defaultValue: defaultOpen,
+    onChange: onOpenChange
+  });
+  const highlight = useCreateStore(void 0);
+  const [registry] = React26.useState(createItemRegistry);
+  const [query, setQuery] = React26.useState("");
+  const triggerRef = React26.useRef(null);
+  if (!isOpen && query !== "") setQuery("");
+  const pick = React26.useCallback(
+    (optionValue) => {
+      if (multiple) {
+        setValue((prev) => {
+          const list = Array.isArray(prev) ? prev : [];
+          return list.includes(optionValue) ? list.filter((item) => item !== optionValue) : [...list, optionValue];
+        });
+        return;
+      }
+      setValue(optionValue);
+      setOpen(false);
+    },
+    [multiple, setValue, setOpen]
+  );
+  const clear = React26.useCallback(() => setValue(multiple ? [] : ""), [multiple, setValue]);
+  const context = React26.useMemo(
+    () => ({
+      size,
+      invalid: ids.invalid,
+      focusRing,
+      required,
+      disabled,
+      placeholder,
+      multiple,
+      selected,
+      registry,
+      pick,
+      clear,
+      clearable,
+      loading,
+      isOpen,
+      setOpen,
+      highlight,
+      query,
+      setQuery,
+      triggerId: ids.controlId,
+      listboxId: `${ids.controlId}-listbox`,
+      describedBy: ids.describedBy,
+      triggerRef,
+      labels
+    }),
+    [
+      size,
+      ids.invalid,
+      ids.controlId,
+      ids.describedBy,
+      focusRing,
+      required,
+      disabled,
+      placeholder,
+      multiple,
+      selected,
+      registry,
+      pick,
+      clear,
+      clearable,
+      loading,
+      isOpen,
+      setOpen,
+      highlight,
+      query,
+      labels
+    ]
+  );
+  return /* @__PURE__ */ jsx24(
+    FieldFrame,
+    {
+      ...rest,
+      size,
+      ids,
+      label,
+      required,
+      optional,
+      hint,
+      error,
+      disabled,
+      optionalLabel: labels.optional,
+      className,
+      children: /* @__PURE__ */ jsx24(SelectProvider, { value: context, children: /* @__PURE__ */ jsx24(ControlSizeProvider, { value: size, children }) })
+    }
+  );
+}
+SelectRoot.displayName = "Select.Root";
+function SelectTrigger({
+  className,
+  children,
+  onClick: onClick2,
+  onKeyDown: onKeyDown2,
+  "aria-describedby": ariaDescribedBy,
+  ref,
+  ...rest
+}) {
+  const {
+    isOpen,
+    setOpen,
+    triggerId,
+    listboxId,
+    disabled,
+    size,
+    invalid,
+    focusRing,
+    required,
+    describedBy,
+    triggerRef,
+    loading,
+    clearable,
+    selected,
+    clear,
+    labels
+  } = useSelectContext();
+  const mergedRef = useMergedRefs(triggerRef, ref);
+  const showClear = clearable && selected.length > 0 && !disabled && !loading;
+  return /* @__PURE__ */ jsxs12(
+    "button",
+    {
+      ...rest,
+      ref: mergedRef,
+      id: triggerId,
+      type: "button",
+      role: "combobox",
+      "aria-expanded": isOpen,
+      "aria-haspopup": "listbox",
+      "aria-controls": listboxId,
+      "aria-invalid": invalid || void 0,
+      "aria-required": required || void 0,
+      "aria-describedby": [ariaDescribedBy, describedBy].filter(Boolean).join(" ") || void 0,
+      "aria-busy": loading || void 0,
+      disabled,
+      className: cx(fieldTriggerClass, Select_default.trigger, className),
+      onClick: (event) => {
+        onClick2?.(event);
+        if (!event.defaultPrevented) setOpen(!isOpen);
+      },
+      onKeyDown: (event) => {
+        onKeyDown2?.(event);
+        if (event.defaultPrevented) return;
+        if (["ArrowDown", "ArrowUp", " ", "Enter"].includes(event.key)) {
+          event.preventDefault();
+          if (!isOpen) setOpen(true);
+        } else if (showClear && (event.key === "Delete" || event.key === "Backspace")) {
+          event.preventDefault();
+          clear();
+        }
+      },
+      ...toDataAttributes({
+        state: isOpen ? "open" : "closed",
+        size,
+        invalid: invalid || void 0,
+        loading: loading || void 0,
+        disabled: disabled || void 0,
+        "focus-ring": focusRing ? void 0 : false
+      }),
+      children: [
+        /* @__PURE__ */ jsx24("span", { className: Select_default.triggerMain, children }),
+        showClear ? (
+          // A segment, not a button: interactive content inside a <button> is invalid. The keyboard
+          // clears with Delete / Backspace on the trigger.
+          /* @__PURE__ */ jsx24(
+            "span",
+            {
+              className: Select_default.clear,
+              "aria-hidden": "true",
+              title: labels.clear,
+              "data-select-clear": "",
+              onMouseDown: (event) => event.preventDefault(),
+              onClick: (event) => {
+                event.stopPropagation();
+                clear();
+              },
+              children: /* @__PURE__ */ jsx24(Icon, { name: "action.close" })
+            }
+          )
+        ) : null,
+        /* @__PURE__ */ jsx24("span", { className: Select_default.chevron, "aria-hidden": "true", children: loading ? /* @__PURE__ */ jsx24(Spinner, { "aria-hidden": "true" }) : /* @__PURE__ */ jsx24(Icon, { name: "nav.chevronDown" }) })
+      ]
+    }
+  );
+}
+SelectTrigger.displayName = "Select.Trigger";
+function SelectValue({ renderValue, className, ...rest }) {
+  const { selected, registry, placeholder, multiple, size } = useSelectContext();
+  const text = useStoreSlice(registry.version, () => selected.map(registry.labelOf).join(", "));
+  if (selected.length > 0 && renderValue && !multiple) {
+    const value = selected[0] ?? "";
+    const parts = splitItemChildren(renderValue({ value, label: text }));
+    return /* @__PURE__ */ jsxs12(
+      "span",
+      {
+        ...rest,
+        className: cx(Select_default.value, className),
+        ...toDataAttributes({ rich: parts.rich || void 0 }),
+        children: [
+          sizeMedia(parts.leading, size),
+          /* @__PURE__ */ jsx24("span", { className: Select_default.valueBody, children: parts.body })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx24(
+    "span",
+    {
+      ...rest,
+      className: cx(Select_default.value, className),
+      ...toDataAttributes({ placeholder: selected.length === 0 || void 0 }),
+      children: selected.length > 0 ? text : placeholder
+    }
+  );
+}
+SelectValue.displayName = "Select.Value";
+function SelectTriggerIcon({ className, ...rest }) {
+  return /* @__PURE__ */ jsx24("span", { "aria-hidden": "true", className: cx(Select_default.triggerIcon, className), ...rest });
+}
+SelectTriggerIcon.displayName = "Select.TriggerIcon";
+function SelectContent({ searchable = false, className, children, ...rest }) {
+  const {
+    isOpen,
+    setOpen,
+    pick,
+    triggerId,
+    listboxId,
+    triggerRef,
+    highlight,
+    multiple,
+    size,
+    query,
+    setQuery,
+    loading,
+    labels,
+    registry
+  } = useSelectContext();
+  const listboxRef = React26.useRef(null);
+  const floating = useFloatingLayer({
+    open: isOpen,
+    onOpenChange: setOpen,
+    triggerRef,
+    side: "bottom",
+    align: "start",
+    matchAnchorWidth: true,
+    focusOnOpen: true,
+    tabExit: "always"
+  });
+  const highlighted = useStoreSlice(highlight, (value) => value);
+  const isEmpty = useStoreSlice(registry.version, () => !registry.anyMatch(normalize(query)));
+  const typeahead = useTypeahead();
+  const handleKeyDown = (event) => {
+    const inSearch = event.target instanceof HTMLInputElement;
+    if (inSearch && [" ", "Home", "End"].includes(event.key)) return;
+    const items = enabledOptions(listboxRef.current);
+    const printable = event.key.length === 1 && !event.ctrlKey && !event.metaKey && !event.altKey;
+    if (printable && !inSearch && (event.key !== " " || typeahead.isTyping())) {
+      event.preventDefault();
+      const match = typeahead.find(event.key, items, highlight.get());
+      if (match) {
+        highlight.set(match.dataset.value);
+        match.scrollIntoView?.({ block: "nearest" });
+      }
+      return;
+    }
+    handleListboxKeyDown(event, { items, highlight, onSelect: pick });
+  };
+  if (!floating.mounted) return /* @__PURE__ */ jsx24("div", { hidden: true, children });
+  const activeDescendant = isOpen && highlighted !== void 0 ? optionDomId(listboxId, highlighted) : void 0;
+  return /* @__PURE__ */ jsxs12(
+    FloatingPanel,
+    {
+      ...rest,
+      floating,
+      size,
+      className: cx(menu_default.tier, menu_default.menu, Select_default.content, className),
+      onKeyDown: handleKeyDown,
+      ...toDataAttributes({ searching: query !== "" || void 0 }),
+      children: [
+        searchable ? (
+          // The permanent focus of the panel: no ring, the caret is the indicator (foundation §7).
+          /* @__PURE__ */ jsxs12("div", { className: cx(menu_default.searchRow, Select_default.search), "data-focus-ring": "false", children: [
+            /* @__PURE__ */ jsx24(Icon, { name: "action.search", size: "s" }),
+            /* @__PURE__ */ jsx24(
+              "input",
+              {
+                type: "text",
+                className: menu_default.searchInput,
+                value: query,
+                placeholder: labels.search,
+                "aria-label": labels.search,
+                "aria-controls": listboxId,
+                "aria-activedescendant": activeDescendant,
+                "aria-autocomplete": "list",
+                autoComplete: "off",
+                spellCheck: false,
+                "data-autofocus": "",
+                onChange: (event) => setQuery(event.target.value)
+              }
+            )
+          ] })
+        ) : null,
+        loading ? /* @__PURE__ */ jsxs12("div", { className: Select_default.status, role: "status", children: [
+          /* @__PURE__ */ jsx24(Spinner, { "aria-hidden": "true" }),
+          labels.loading
+        ] }) : null,
+        /* @__PURE__ */ jsx24(
+          ScrollContainer,
+          {
+            ref: listboxRef,
+            id: listboxId,
+            role: "listbox",
+            "aria-multiselectable": multiple || void 0,
+            "aria-labelledby": triggerId,
+            "aria-activedescendant": searchable ? void 0 : activeDescendant,
+            "aria-busy": loading || void 0,
+            tabIndex: -1,
+            "data-autofocus": searchable ? void 0 : "",
+            className: Select_default.listbox,
+            children
+          }
+        ),
+        isEmpty && !loading ? /* @__PURE__ */ jsxs12(EmptyPage.Root, { layout: "compact", role: "status", children: [
+          /* @__PURE__ */ jsx24(EmptyPage.Title, { as: "p", children: labels.empty }),
+          query !== "" && labels.emptyHint ? /* @__PURE__ */ jsx24(EmptyPage.Description, { children: labels.emptyHint }) : null
+        ] }) : null,
+        /* @__PURE__ */ jsx24(HighlightOnOpen, { listboxRef, highlight })
+      ]
+    }
+  );
+}
+SelectContent.displayName = "Select.Content";
+function HighlightOnOpen({
+  listboxRef,
+  highlight
+}) {
+  const { isOpen, query, selected } = useSelectContext();
+  const selectedRef = React26.useRef(selected);
+  selectedRef.current = selected;
+  React26.useLayoutEffect(() => {
+    if (!isOpen) return;
+    const options = enabledOptions(listboxRef.current);
+    const first = options.find((item) => selectedRef.current.includes(item.dataset.value ?? ""));
+    highlight.set(first?.dataset.value);
+    first?.scrollIntoView?.({ block: "nearest" });
+    return () => highlight.set(void 0);
+  }, [isOpen, listboxRef, highlight]);
+  React26.useLayoutEffect(() => {
+    if (query !== "") highlight.set(enabledOptions(listboxRef.current)[0]?.dataset.value);
+  }, [query, listboxRef, highlight]);
+  return null;
+}
+function SelectGroup({ className, ...rest }) {
+  return /* @__PURE__ */ jsx24(MenuGroup, { ...rest, className: cx(Select_default.group, className) });
+}
+SelectGroup.displayName = "Select.Group";
+function SelectSeparator({ className, ...rest }) {
+  return /* @__PURE__ */ jsx24(Divider, { ...rest, className: cx(menu_default.separator, Select_default.separator, className) });
+}
+SelectSeparator.displayName = "Select.Separator";
+var Select = {
+  Root: SelectRoot,
+  Trigger: SelectTrigger,
+  Value: SelectValue,
+  TriggerIcon: SelectTriggerIcon,
+  Content: SelectContent,
+  Item: SelectItem,
+  ItemIcon: SelectItemIcon,
+  ItemText: SelectItemText,
+  ItemDescription: SelectItemDescription,
+  ItemMeta: SelectItemMeta,
+  Group: SelectGroup,
+  Separator: SelectSeparator
+};
+
+export {
+  ControlSizeProvider,
+  useOptionalControlSize,
+  useControlSize,
+  useMergedRefs,
+  cx,
+  toDataAttributes,
+  ScrollContainer,
+  createComponentContext,
+  createImageSlot,
+  palette_default,
+  textTone_default,
+  Icon,
+  createIcon,
+  fieldSurfaceClass,
+  fieldTierClass,
+  fieldTriggerClass,
+  iconLayout,
+  Slot,
+  visuallyHiddenClass,
+  VisuallyHidden,
+  Spinner,
+  Button,
+  useControllableState,
+  overlayMotion_default,
+  Portal,
+  focusInto,
+  focusBack,
+  activeElement,
+  LayerProvider,
+  useLayer,
+  FloatingPanel,
+  FloatingTrigger,
+  AnchorRectProvider,
+  readCssLengthPx,
+  getViewportPadPx,
+  prefersReducedMotion,
+  motionDurationMs,
+  exitTimeoutMs,
+  usePresence,
+  useFloatingLayer,
+  rovingIndex,
+  gridIndex,
+  controlSizes,
+  stepDown,
+  variants,
+  tones,
+  paletteColors,
+  dataStates,
+  textTones,
+  enterMotion_default,
+  Hint,
+  choiceInputClass,
+  choiceVisualClass,
+  ChoiceField,
+  ChoiceLabel,
+  Label,
+  formatLabel,
+  useFieldFrame,
+  FieldFrame,
+  FieldCounter,
+  Checkbox,
+  COLOR_PRESETS,
+  useSwatchOptions,
+  swatchClass,
+  swatchTierClass,
+  SwatchFill,
+  SwatchContent,
+  SwatchChip,
+  sameColor,
+  ColorSwatches,
+  EmptyPage,
+  matchIndex,
+  HighlightMatch,
+  highlightChildren,
+  optionDomId,
+  enabledOptions,
+  useCreateStore,
+  useStoreSlice,
+  handleListboxKeyDown,
+  menu_default,
+  MenuGroup,
+  Divider,
+  Input,
+  Thumbnail,
+  Select
+};