@inf-monkeys-tech/monkeys-design 0.4.35 → 0.4.36

package/dist/{theme-Cuy60thu.d.ts → theme-Clm5dVb0.d.mts}

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as BaseAccordionProps, e as BaseAvatarProps, h as BaseBadgeProps, l as BaseBreadcrumbProps, n as BaseButtonProps, p as BaseCheckboxProps, z as BaseContextMenuProps, s as BaseContextMenuCheckboxItemProps, v as BaseContextMenuContentProps, x as BaseContextMenuItemProps, y as BaseContextMenuLabelProps, A as BaseContextMenuRadioGroupProps, C as BaseContextMenuRadioItemProps, D as BaseContextMenuSeparatorProps, F as BaseContextMenuSubProps, E as BaseContextMenuSubContentProps, G as BaseContextMenuSubTriggerProps, H as BaseContextMenuTriggerProps, L as BaseDescriptionListProps, N as BaseDialogProps, P as BaseDividerProps, T as BaseDropdownMenuProps, U as BaseEmptyStateProps, W as BaseFieldProps, X as BaseInputProps, a2 as BaseLayoutProps, a0 as BaseLayoutPaneProps, a4 as BaseLayoutResizeHandleProps, a7 as BaseLayoutSplitProps, a8 as BaseLoadingStateProps, aa as BaseNoticeProps, ac as BasePanelProps, ae as BasePaginationProps, ag as BaseProgressProps, aj as BaseRadioGroupProps, ap as BaseSelectProps, an as BaseSectionHeaderProps, as as BaseSegmentedControlProps, au as BaseSkeletonProps, ax as BaseSwitchProps, aV as BaseTableProps, az as BaseTableBodyProps, aB as BaseTableCaptionProps, aD as BaseTableCellProps, aK as BaseTableContainerProps, aM as BaseTableEmptyProps, aP as BaseTableFooterProps, aS as BaseTableHeadProps, aQ as BaseTableHeaderProps, aU as BaseTableLoadingProps, aX as BaseTableRowProps, aO as BaseTableFooterBarProps, b0 as BaseTabsProps, b1 as BaseTextareaProps, b4 as BaseTooltipProps, b6 as BaseToolbarProps, al as BaseResolvedTheme, r as BaseControlTone, c as BaseAppearance } from './types-CZALgtez.js';
+import { b as BaseAccordionProps, e as BaseAvatarProps, h as BaseBadgeProps, l as BaseBreadcrumbProps, n as BaseButtonProps, p as BaseCheckboxProps, z as BaseContextMenuProps, s as BaseContextMenuCheckboxItemProps, v as BaseContextMenuContentProps, x as BaseContextMenuItemProps, y as BaseContextMenuLabelProps, A as BaseContextMenuRadioGroupProps, C as BaseContextMenuRadioItemProps, D as BaseContextMenuSeparatorProps, F as BaseContextMenuSubProps, E as BaseContextMenuSubContentProps, G as BaseContextMenuSubTriggerProps, H as BaseContextMenuTriggerProps, L as BaseDescriptionListProps, N as BaseDialogProps, P as BaseDividerProps, T as BaseDropdownMenuProps, U as BaseEmptyStateProps, W as BaseFieldProps, X as BaseInputProps, a2 as BaseLayoutProps, a0 as BaseLayoutPaneProps, a4 as BaseLayoutResizeHandleProps, a7 as BaseLayoutSplitProps, a8 as BaseLoadingStateProps, ab as BaseMultiSelectProps, ad as BaseNoticeProps, af as BasePanelProps, ah as BasePaginationProps, aj as BaseProgressProps, am as BaseRadioGroupProps, as as BaseSelectProps, aq as BaseSectionHeaderProps, av as BaseSegmentedControlProps, ax as BaseSkeletonProps, aA as BaseSwitchProps, aY as BaseTableProps, aC as BaseTableBodyProps, aE as BaseTableCaptionProps, aG as BaseTableCellProps, aN as BaseTableContainerProps, aP as BaseTableEmptyProps, aS as BaseTableFooterProps, aV as BaseTableHeadProps, aT as BaseTableHeaderProps, aX as BaseTableLoadingProps, a_ as BaseTableRowProps, aR as BaseTableFooterBarProps, b3 as BaseTabsProps, b4 as BaseTextareaProps, b7 as BaseTooltipProps, b9 as BaseToolbarProps, ao as BaseResolvedTheme, r as BaseControlTone, c as BaseAppearance } from './types-Bn6PEDsX.mjs';
 import * as React from 'react';
 
 declare function BaseAccordion({ items, value, defaultValue, allowCollapse, appearance, className, classNames, style, onValueChange, id, ...accordionProps }: BaseAccordionProps): react_jsx_runtime.JSX.Element;
@@ -48,6 +48,8 @@ declare function BaseLayoutSplit({ orientation, primary, secondary, children, re
 
 declare function BaseLoadingState({ icon, title, description, actions, appearance, className, classNames, style, ...stateProps }: BaseLoadingStateProps): react_jsx_runtime.JSX.Element;
 
+declare const BaseMultiSelect: React.ForwardRefExoticComponent<BaseMultiSelectProps & React.RefAttributes<HTMLDivElement>>;
+
 declare function BaseNotice({ tone, icon, title, description, actions, children, appearance, className, classNames, style, ...noticeProps }: BaseNoticeProps): react_jsx_runtime.JSX.Element;
 
 declare function BasePanel({ as, title, description, media, header, footer, children, interactive, selected, disabled, appearance, className, classNames, style, ...panelProps }: BasePanelProps): react_jsx_runtime.JSX.Element;
@@ -96,4 +98,4 @@ declare function getBaseBadgeToneClassName(theme: BaseResolvedTheme, tone?: Base
 declare function getBaseNoticeToneClassName(theme: BaseResolvedTheme, tone?: BaseControlTone): string;
 declare function getBaseMenuItemToneClassName(theme: BaseResolvedTheme, tone?: BaseControlTone): string;
 
-export { BaseTextarea as $, BaseLayoutResizeHandle as A, BaseAccordion as B, BaseLayoutSplit as C, BaseLoadingState as D, BaseNotice as E, BasePanel as F, BasePagination as G, BaseProgress as H, BaseRadioGroup as I, BaseSelect as J, BaseSectionHeader as K, BaseSegmentedControl as L, BaseSkeleton as M, BaseSwitch as N, BaseTable as O, BaseTableBody as P, BaseTableCaption as Q, BaseTableCell as R, BaseTableContainer as S, BaseTableEmpty as T, BaseTableFooter as U, BaseTableFooterBar as V, BaseTableHead as W, BaseTableHeader as X, BaseTableLoading as Y, BaseTableRow as Z, BaseTabs as _, BaseAvatar as a, BaseTooltip as a0, BaseToolbar as a1, getBaseBadgeToneClassName as a2, getBaseButtonToneClassName as a3, getBaseMenuItemToneClassName as a4, getBaseNoticeToneClassName as a5, resolveBaseAppearance as a6, BaseBadge as b, BaseBreadcrumb as c, BaseButton as d, BaseCheckbox as e, BaseContextMenu as f, BaseContextMenuCheckboxItem as g, BaseContextMenuContent as h, BaseContextMenuItem as i, BaseContextMenuLabel as j, BaseContextMenuRadioGroup as k, BaseContextMenuRadioItem as l, BaseContextMenuSeparator as m, BaseContextMenuSub as n, BaseContextMenuSubContent as o, BaseContextMenuSubTrigger as p, BaseContextMenuTrigger as q, BaseDescriptionList as r, BaseDialog as s, BaseDivider as t, BaseDropdownMenu as u, BaseEmptyState as v, BaseField as w, BaseInput as x, BaseLayout as y, BaseLayoutPane as z };
+export { BaseTabs as $, BaseLayoutResizeHandle as A, BaseAccordion as B, BaseLayoutSplit as C, BaseLoadingState as D, BaseMultiSelect as E, BaseNotice as F, BasePanel as G, BasePagination as H, BaseProgress as I, BaseRadioGroup as J, BaseSelect as K, BaseSectionHeader as L, BaseSegmentedControl as M, BaseSkeleton as N, BaseSwitch as O, BaseTable as P, BaseTableBody as Q, BaseTableCaption as R, BaseTableCell as S, BaseTableContainer as T, BaseTableEmpty as U, BaseTableFooter as V, BaseTableFooterBar as W, BaseTableHead as X, BaseTableHeader as Y, BaseTableLoading as Z, BaseTableRow as _, BaseAvatar as a, BaseTextarea as a0, BaseTooltip as a1, BaseToolbar as a2, getBaseBadgeToneClassName as a3, getBaseButtonToneClassName as a4, getBaseMenuItemToneClassName as a5, getBaseNoticeToneClassName as a6, resolveBaseAppearance as a7, BaseBadge as b, BaseBreadcrumb as c, BaseButton as d, BaseCheckbox as e, BaseContextMenu as f, BaseContextMenuCheckboxItem as g, BaseContextMenuContent as h, BaseContextMenuItem as i, BaseContextMenuLabel as j, BaseContextMenuRadioGroup as k, BaseContextMenuRadioItem as l, BaseContextMenuSeparator as m, BaseContextMenuSub as n, BaseContextMenuSubContent as o, BaseContextMenuSubTrigger as p, BaseContextMenuTrigger as q, BaseDescriptionList as r, BaseDialog as s, BaseDivider as t, BaseDropdownMenu as u, BaseEmptyState as v, BaseField as w, BaseInput as x, BaseLayout as y, BaseLayoutPane as z };

package/dist/{theme-CoG9vCPT.d.mts → theme-sIoU5-YC.d.ts}

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as BaseAccordionProps, e as BaseAvatarProps, h as BaseBadgeProps, l as BaseBreadcrumbProps, n as BaseButtonProps, p as BaseCheckboxProps, z as BaseContextMenuProps, s as BaseContextMenuCheckboxItemProps, v as BaseContextMenuContentProps, x as BaseContextMenuItemProps, y as BaseContextMenuLabelProps, A as BaseContextMenuRadioGroupProps, C as BaseContextMenuRadioItemProps, D as BaseContextMenuSeparatorProps, F as BaseContextMenuSubProps, E as BaseContextMenuSubContentProps, G as BaseContextMenuSubTriggerProps, H as BaseContextMenuTriggerProps, L as BaseDescriptionListProps, N as BaseDialogProps, P as BaseDividerProps, T as BaseDropdownMenuProps, U as BaseEmptyStateProps, W as BaseFieldProps, X as BaseInputProps, a2 as BaseLayoutProps, a0 as BaseLayoutPaneProps, a4 as BaseLayoutResizeHandleProps, a7 as BaseLayoutSplitProps, a8 as BaseLoadingStateProps, aa as BaseNoticeProps, ac as BasePanelProps, ae as BasePaginationProps, ag as BaseProgressProps, aj as BaseRadioGroupProps, ap as BaseSelectProps, an as BaseSectionHeaderProps, as as BaseSegmentedControlProps, au as BaseSkeletonProps, ax as BaseSwitchProps, aV as BaseTableProps, az as BaseTableBodyProps, aB as BaseTableCaptionProps, aD as BaseTableCellProps, aK as BaseTableContainerProps, aM as BaseTableEmptyProps, aP as BaseTableFooterProps, aS as BaseTableHeadProps, aQ as BaseTableHeaderProps, aU as BaseTableLoadingProps, aX as BaseTableRowProps, aO as BaseTableFooterBarProps, b0 as BaseTabsProps, b1 as BaseTextareaProps, b4 as BaseTooltipProps, b6 as BaseToolbarProps, al as BaseResolvedTheme, r as BaseControlTone, c as BaseAppearance } from './types-CZALgtez.mjs';
+import { b as BaseAccordionProps, e as BaseAvatarProps, h as BaseBadgeProps, l as BaseBreadcrumbProps, n as BaseButtonProps, p as BaseCheckboxProps, z as BaseContextMenuProps, s as BaseContextMenuCheckboxItemProps, v as BaseContextMenuContentProps, x as BaseContextMenuItemProps, y as BaseContextMenuLabelProps, A as BaseContextMenuRadioGroupProps, C as BaseContextMenuRadioItemProps, D as BaseContextMenuSeparatorProps, F as BaseContextMenuSubProps, E as BaseContextMenuSubContentProps, G as BaseContextMenuSubTriggerProps, H as BaseContextMenuTriggerProps, L as BaseDescriptionListProps, N as BaseDialogProps, P as BaseDividerProps, T as BaseDropdownMenuProps, U as BaseEmptyStateProps, W as BaseFieldProps, X as BaseInputProps, a2 as BaseLayoutProps, a0 as BaseLayoutPaneProps, a4 as BaseLayoutResizeHandleProps, a7 as BaseLayoutSplitProps, a8 as BaseLoadingStateProps, ab as BaseMultiSelectProps, ad as BaseNoticeProps, af as BasePanelProps, ah as BasePaginationProps, aj as BaseProgressProps, am as BaseRadioGroupProps, as as BaseSelectProps, aq as BaseSectionHeaderProps, av as BaseSegmentedControlProps, ax as BaseSkeletonProps, aA as BaseSwitchProps, aY as BaseTableProps, aC as BaseTableBodyProps, aE as BaseTableCaptionProps, aG as BaseTableCellProps, aN as BaseTableContainerProps, aP as BaseTableEmptyProps, aS as BaseTableFooterProps, aV as BaseTableHeadProps, aT as BaseTableHeaderProps, aX as BaseTableLoadingProps, a_ as BaseTableRowProps, aR as BaseTableFooterBarProps, b3 as BaseTabsProps, b4 as BaseTextareaProps, b7 as BaseTooltipProps, b9 as BaseToolbarProps, ao as BaseResolvedTheme, r as BaseControlTone, c as BaseAppearance } from './types-Bn6PEDsX.js';
 import * as React from 'react';
 
 declare function BaseAccordion({ items, value, defaultValue, allowCollapse, appearance, className, classNames, style, onValueChange, id, ...accordionProps }: BaseAccordionProps): react_jsx_runtime.JSX.Element;
@@ -48,6 +48,8 @@ declare function BaseLayoutSplit({ orientation, primary, secondary, children, re
 
 declare function BaseLoadingState({ icon, title, description, actions, appearance, className, classNames, style, ...stateProps }: BaseLoadingStateProps): react_jsx_runtime.JSX.Element;
 
+declare const BaseMultiSelect: React.ForwardRefExoticComponent<BaseMultiSelectProps & React.RefAttributes<HTMLDivElement>>;
+
 declare function BaseNotice({ tone, icon, title, description, actions, children, appearance, className, classNames, style, ...noticeProps }: BaseNoticeProps): react_jsx_runtime.JSX.Element;
 
 declare function BasePanel({ as, title, description, media, header, footer, children, interactive, selected, disabled, appearance, className, classNames, style, ...panelProps }: BasePanelProps): react_jsx_runtime.JSX.Element;
@@ -96,4 +98,4 @@ declare function getBaseBadgeToneClassName(theme: BaseResolvedTheme, tone?: Base
 declare function getBaseNoticeToneClassName(theme: BaseResolvedTheme, tone?: BaseControlTone): string;
 declare function getBaseMenuItemToneClassName(theme: BaseResolvedTheme, tone?: BaseControlTone): string;
 
-export { BaseTextarea as $, BaseLayoutResizeHandle as A, BaseAccordion as B, BaseLayoutSplit as C, BaseLoadingState as D, BaseNotice as E, BasePanel as F, BasePagination as G, BaseProgress as H, BaseRadioGroup as I, BaseSelect as J, BaseSectionHeader as K, BaseSegmentedControl as L, BaseSkeleton as M, BaseSwitch as N, BaseTable as O, BaseTableBody as P, BaseTableCaption as Q, BaseTableCell as R, BaseTableContainer as S, BaseTableEmpty as T, BaseTableFooter as U, BaseTableFooterBar as V, BaseTableHead as W, BaseTableHeader as X, BaseTableLoading as Y, BaseTableRow as Z, BaseTabs as _, BaseAvatar as a, BaseTooltip as a0, BaseToolbar as a1, getBaseBadgeToneClassName as a2, getBaseButtonToneClassName as a3, getBaseMenuItemToneClassName as a4, getBaseNoticeToneClassName as a5, resolveBaseAppearance as a6, BaseBadge as b, BaseBreadcrumb as c, BaseButton as d, BaseCheckbox as e, BaseContextMenu as f, BaseContextMenuCheckboxItem as g, BaseContextMenuContent as h, BaseContextMenuItem as i, BaseContextMenuLabel as j, BaseContextMenuRadioGroup as k, BaseContextMenuRadioItem as l, BaseContextMenuSeparator as m, BaseContextMenuSub as n, BaseContextMenuSubContent as o, BaseContextMenuSubTrigger as p, BaseContextMenuTrigger as q, BaseDescriptionList as r, BaseDialog as s, BaseDivider as t, BaseDropdownMenu as u, BaseEmptyState as v, BaseField as w, BaseInput as x, BaseLayout as y, BaseLayoutPane as z };
+export { BaseTabs as $, BaseLayoutResizeHandle as A, BaseAccordion as B, BaseLayoutSplit as C, BaseLoadingState as D, BaseMultiSelect as E, BaseNotice as F, BasePanel as G, BasePagination as H, BaseProgress as I, BaseRadioGroup as J, BaseSelect as K, BaseSectionHeader as L, BaseSegmentedControl as M, BaseSkeleton as N, BaseSwitch as O, BaseTable as P, BaseTableBody as Q, BaseTableCaption as R, BaseTableCell as S, BaseTableContainer as T, BaseTableEmpty as U, BaseTableFooter as V, BaseTableFooterBar as W, BaseTableHead as X, BaseTableHeader as Y, BaseTableLoading as Z, BaseTableRow as _, BaseAvatar as a, BaseTextarea as a0, BaseTooltip as a1, BaseToolbar as a2, getBaseBadgeToneClassName as a3, getBaseButtonToneClassName as a4, getBaseMenuItemToneClassName as a5, getBaseNoticeToneClassName as a6, resolveBaseAppearance as a7, BaseBadge as b, BaseBreadcrumb as c, BaseButton as d, BaseCheckbox as e, BaseContextMenu as f, BaseContextMenuCheckboxItem as g, BaseContextMenuContent as h, BaseContextMenuItem as i, BaseContextMenuLabel as j, BaseContextMenuRadioGroup as k, BaseContextMenuRadioItem as l, BaseContextMenuSeparator as m, BaseContextMenuSub as n, BaseContextMenuSubContent as o, BaseContextMenuSubTrigger as p, BaseContextMenuTrigger as q, BaseDescriptionList as r, BaseDialog as s, BaseDivider as t, BaseDropdownMenu as u, BaseEmptyState as v, BaseField as w, BaseInput as x, BaseLayout as y, BaseLayoutPane as z };

package/dist/theme-system/index.d.mts

@@ -1,4 +1,4 @@
-import { c as BaseAppearance, al as BaseResolvedTheme } from '../types-CZALgtez.mjs';
+import { c as BaseAppearance, ao as BaseResolvedTheme } from '../types-Bn6PEDsX.mjs';
 import { c as DataExplorerAppearance, Y as DataExplorerResolvedTheme } from '../types-B81dpI1o.mjs';
 import 'react';
 import '@radix-ui/react-context-menu';

package/dist/theme-system/index.d.ts

@@ -1,4 +1,4 @@
-import { c as BaseAppearance, al as BaseResolvedTheme } from '../types-CZALgtez.js';
+import { c as BaseAppearance, ao as BaseResolvedTheme } from '../types-Bn6PEDsX.js';
 import { c as DataExplorerAppearance, Y as DataExplorerResolvedTheme } from '../types-B81dpI1o.js';
 import 'react';
 import '@radix-ui/react-context-menu';

package/dist/theme-system/index.js

@@ -9776,6 +9776,448 @@ react.forwardRef(
     );
   }
 );
+function normalizeValues(values) {
+  const nextValues = [];
+  const seen = /* @__PURE__ */ new Set();
+  values?.forEach((value) => {
+    if (seen.has(value)) return;
+    seen.add(value);
+    nextValues.push(value);
+  });
+  return nextValues;
+}
+function getNextEnabledIndex(options, currentIndex, direction) {
+  if (!options.length) return -1;
+  const startIndex = currentIndex >= 0 ? currentIndex : 0;
+  for (let offset = 1; offset <= options.length; offset += 1) {
+    const nextIndex = (startIndex + offset * direction + options.length) % options.length;
+    if (!options[nextIndex]?.disabled) {
+      return nextIndex;
+    }
+  }
+  return -1;
+}
+function getFirstEnabledIndex(options) {
+  return options.findIndex((option) => !option.disabled);
+}
+function getSafeTagCount(maxTagCount, total) {
+  if (maxTagCount === void 0) return total;
+  if (!Number.isFinite(maxTagCount)) return total;
+  return Math.max(0, Math.min(total, Math.floor(maxTagCount)));
+}
+function getDefaultRemoveLabel(option) {
+  return `Remove ${option.value}`;
+}
+react.forwardRef(
+  function BaseMultiSelect2({
+    options,
+    value,
+    defaultValue,
+    name,
+    placeholder = "Select options",
+    icon,
+    invalid = false,
+    disabled = false,
+    required = false,
+    openForPreview = false,
+    maxTagCount,
+    removeLabel = getDefaultRemoveLabel,
+    emptyLabel = "No options",
+    appearance,
+    className,
+    classNames,
+    style,
+    id,
+    "aria-invalid": nativeAriaInvalid,
+    "aria-label": nativeAriaLabel,
+    "aria-labelledby": nativeAriaLabelledBy,
+    onValueChange,
+    ...rootProps
+  }, ref) {
+    const theme = resolveBaseAppearance(appearance);
+    const generatedId = react.useId();
+    const multiSelectId = id ?? generatedId;
+    const controlId = `${multiSelectId}-control`;
+    const listboxId = `${multiSelectId}-listbox`;
+    const rootRef = react.useRef(null);
+    const optionList = options ?? [];
+    const forceOpen = openForPreview;
+    const [uncontrolledOpen, setUncontrolledOpen] = react.useState(false);
+    const open = forceOpen || uncontrolledOpen;
+    const [uncontrolledValue, setUncontrolledValue] = react.useState(
+      () => normalizeValues(defaultValue)
+    );
+    const [activeIndex, setActiveIndex] = react.useState(
+      () => getFirstEnabledIndex(optionList)
+    );
+    const isControlled = value !== void 0;
+    const selectedValues = react.useMemo(
+      () => normalizeValues(isControlled ? value : uncontrolledValue),
+      [isControlled, uncontrolledValue, value]
+    );
+    const selectedValueSet = react.useMemo(
+      () => new Set(selectedValues),
+      [selectedValues]
+    );
+    const optionByValue = react.useMemo(() => {
+      const map = /* @__PURE__ */ new Map();
+      optionList.forEach((option) => {
+        if (!map.has(option.value)) {
+          map.set(option.value, option);
+        }
+      });
+      return map;
+    }, [optionList]);
+    const selectedOptions = react.useMemo(
+      () => selectedValues.map((selectedValue) => optionByValue.get(selectedValue)).filter(
+        (option) => option !== void 0
+      ),
+      [optionByValue, selectedValues]
+    );
+    const firstEnabledIndex = react.useMemo(
+      () => getFirstEnabledIndex(optionList),
+      [optionList]
+    );
+    const resolvedActiveIndex = activeIndex >= 0 && !optionList[activeIndex]?.disabled ? activeIndex : firstEnabledIndex;
+    const visibleTagCount = getSafeTagCount(
+      maxTagCount,
+      selectedOptions.length
+    );
+    const visibleOptions = selectedOptions.slice(0, visibleTagCount);
+    const overflowCount = selectedOptions.length - visibleOptions.length;
+    const isPlaceholder = selectedOptions.length === 0;
+    const setRootRef = (node) => {
+      rootRef.current = node;
+      if (typeof ref === "function") {
+        ref(node);
+      } else if (ref) {
+        ref.current = node;
+      }
+    };
+    const setOpen = (nextOpen) => {
+      if (disabled || forceOpen) return;
+      setUncontrolledOpen(nextOpen);
+      if (nextOpen) {
+        setActiveIndex(resolvedActiveIndex);
+      }
+    };
+    react.useEffect(() => {
+      if (!open || forceOpen) return void 0;
+      const handlePointerDown = (event) => {
+        if (!rootRef.current?.contains(event.target)) {
+          setUncontrolledOpen(false);
+        }
+      };
+      document.addEventListener("pointerdown", handlePointerDown);
+      return () => {
+        document.removeEventListener("pointerdown", handlePointerDown);
+      };
+    }, [forceOpen, open]);
+    react.useEffect(() => {
+      if (resolvedActiveIndex >= 0 && resolvedActiveIndex !== activeIndex) {
+        setActiveIndex(resolvedActiveIndex);
+      }
+    }, [activeIndex, resolvedActiveIndex]);
+    const commitValues = (nextValues) => {
+      const normalizedValues = normalizeValues(nextValues);
+      if (!isControlled) {
+        setUncontrolledValue(normalizedValues);
+      }
+      onValueChange?.(normalizedValues);
+    };
+    const toggleOption = (option) => {
+      if (!option || option.disabled || disabled) return;
+      const nextValues = selectedValueSet.has(option.value) ? selectedValues.filter((selectedValue) => selectedValue !== option.value) : [...selectedValues, option.value];
+      commitValues(nextValues);
+    };
+    const removeOption = (option) => {
+      if (disabled) return;
+      commitValues(
+        selectedValues.filter((selectedValue) => selectedValue !== option.value)
+      );
+    };
+    const focusOption = (direction) => {
+      const nextIndex = getNextEnabledIndex(
+        optionList,
+        resolvedActiveIndex,
+        direction
+      );
+      if (nextIndex >= 0) {
+        setActiveIndex(nextIndex);
+      }
+    };
+    const handleKeyDown = (event) => {
+      if (disabled) return;
+      if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+        event.preventDefault();
+        if (!open) {
+          setOpen(true);
+          setActiveIndex(firstEnabledIndex);
+          return;
+        }
+        focusOption(event.key === "ArrowDown" ? 1 : -1);
+        return;
+      }
+      if (event.key === "Home") {
+        event.preventDefault();
+        setOpen(true);
+        setActiveIndex(firstEnabledIndex);
+        return;
+      }
+      if (event.key === "End") {
+        event.preventDefault();
+        setOpen(true);
+        for (let index = optionList.length - 1; index >= 0; index -= 1) {
+          if (!optionList[index]?.disabled) {
+            setActiveIndex(index);
+            break;
+          }
+        }
+        return;
+      }
+      if (event.key === "Enter" || event.key === " ") {
+        event.preventDefault();
+        if (!open) {
+          setOpen(true);
+          return;
+        }
+        toggleOption(optionList[resolvedActiveIndex]);
+        return;
+      }
+      if (event.key === "Escape") {
+        setOpen(false);
+      }
+    };
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ...rootProps,
+        id,
+        ref: setRootRef,
+        className: cn(
+          theme.slots.controlWrapper,
+          "overflow-visible",
+          open && "z-50",
+          invalid && theme.slots.controlInvalid,
+          disabled && theme.slots.controlDisabled,
+          classNames?.root,
+          className
+        ),
+        style: {
+          ...theme.styles.control,
+          ...invalid ? theme.styles.controlInvalid : void 0,
+          ...disabled ? theme.styles.controlDisabled : void 0,
+          ...style
+        },
+        children: [
+          hasRenderableNode(icon) ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn(theme.slots.controlIcon, classNames?.icon), children: icon }) : null,
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              id: controlId,
+              role: "combobox",
+              tabIndex: disabled ? -1 : 0,
+              "aria-haspopup": "listbox",
+              "aria-expanded": open,
+              "aria-controls": listboxId,
+              "aria-disabled": disabled || void 0,
+              "aria-required": required || void 0,
+              "aria-invalid": nativeAriaInvalid ?? (invalid || void 0),
+              "aria-label": nativeAriaLabel,
+              "aria-labelledby": nativeAriaLabelledBy,
+              className: cn(
+                theme.slots.controlBase,
+                "flex min-h-9 cursor-pointer flex-wrap items-center gap-1.5 py-1.5 pr-9 text-left",
+                disabled && "!cursor-not-allowed",
+                classNames?.control
+              ),
+              onClick: () => setOpen(!open),
+              onKeyDown: handleKeyDown,
+              children: /* @__PURE__ */ jsxRuntime.jsxs(
+                "span",
+                {
+                  className: cn(
+                    "flex min-w-0 flex-1 flex-wrap items-center gap-1.5",
+                    classNames?.tagList
+                  ),
+                  children: [
+                    visibleOptions.map((option) => /* @__PURE__ */ jsxRuntime.jsxs(
+                      "span",
+                      {
+                        className: cn(
+                          "inline-flex max-w-full items-center gap-1 rounded-full border border-border/70 bg-muted/65 px-2 py-0.5 text-xs font-medium text-foreground",
+                          classNames?.tag
+                        ),
+                        children: [
+                          /* @__PURE__ */ jsxRuntime.jsx(
+                            "span",
+                            {
+                              className: cn(
+                                "max-w-40 truncate",
+                                classNames?.tagLabel
+                              ),
+                              children: option.label
+                            }
+                          ),
+                          /* @__PURE__ */ jsxRuntime.jsx(
+                            "button",
+                            {
+                              type: "button",
+                              "aria-label": removeLabel(option),
+                              disabled,
+                              className: cn(
+                                "inline-flex h-4 w-4 shrink-0 items-center justify-center rounded-full text-muted-foreground hover:bg-background/80 hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/30 disabled:!cursor-not-allowed",
+                                classNames?.tagRemove
+                              ),
+                              onClick: (event) => {
+                                event.preventDefault();
+                                event.stopPropagation();
+                                removeOption(option);
+                              },
+                              onMouseDown: (event) => {
+                                event.preventDefault();
+                                event.stopPropagation();
+                              },
+                              onKeyDown: (event) => event.stopPropagation(),
+                              children: /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: "x" })
+                            }
+                          )
+                        ]
+                      },
+                      option.value
+                    )),
+                    overflowCount > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(
+                      "span",
+                      {
+                        className: cn(
+                          "inline-flex max-w-full items-center rounded-full border border-border/70 bg-muted/45 px-2 py-0.5 text-xs font-medium text-muted-foreground",
+                          classNames?.tag
+                        ),
+                        children: [
+                          "+",
+                          overflowCount
+                        ]
+                      }
+                    ) : null,
+                    isPlaceholder ? /* @__PURE__ */ jsxRuntime.jsx(
+                      "span",
+                      {
+                        className: cn(
+                          "min-w-0 truncate",
+                          theme.slots.selectPlaceholder,
+                          classNames?.placeholder
+                        ),
+                        children: placeholder
+                      }
+                    ) : null
+                  ]
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: cn(
+                theme.slots.selectChevron,
+                open && "rotate-[225deg]",
+                classNames?.chevron
+              )
+            }
+          ),
+          name ? selectedValues.map((selectedValue) => /* @__PURE__ */ jsxRuntime.jsx(
+            "input",
+            {
+              type: "hidden",
+              name,
+              value: selectedValue,
+              className: classNames?.hiddenInput
+            },
+            selectedValue
+          )) : null,
+          open ? /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              id: listboxId,
+              role: "listbox",
+              "aria-multiselectable": "true",
+              "aria-labelledby": controlId,
+              className: cn(theme.slots.selectMenu, classNames?.menu),
+              style: theme.styles.selectMenu,
+              children: optionList.length > 0 ? optionList.map((option, index) => {
+                const selected = selectedValueSet.has(option.value);
+                const active = index === resolvedActiveIndex;
+                return /* @__PURE__ */ jsxRuntime.jsxs(
+                  "button",
+                  {
+                    type: "button",
+                    role: "option",
+                    "aria-selected": selected,
+                    disabled: option.disabled,
+                    className: cn(
+                      theme.slots.selectOption,
+                      "gap-2",
+                      active && theme.slots.selectOptionActive,
+                      selected && theme.slots.selectOptionSelected,
+                      option.disabled && theme.slots.selectOptionDisabled,
+                      classNames?.option
+                    ),
+                    style: {
+                      ...theme.styles.selectOption,
+                      ...active ? theme.styles.selectOptionActive : void 0,
+                      ...selected ? theme.styles.selectOptionSelected : void 0
+                    },
+                    onMouseEnter: () => {
+                      if (!option.disabled) {
+                        setActiveIndex(index);
+                      }
+                    },
+                    onMouseDown: (event) => event.preventDefault(),
+                    onClick: () => toggleOption(option),
+                    children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        "span",
+                        {
+                          "aria-hidden": "true",
+                          className: cn(
+                            "inline-flex h-4 w-4 shrink-0 items-center justify-center rounded-sm border border-border/70 text-[10px]",
+                            selected && "border-primary/40 bg-primary text-primary-foreground",
+                            classNames?.optionIndicator
+                          ),
+                          children: selected ? "\u2713" : null
+                        }
+                      ),
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        "span",
+                        {
+                          className: cn(
+                            "min-w-0 flex-1 truncate",
+                            classNames?.optionLabel
+                          ),
+                          children: option.label
+                        }
+                      )
+                    ]
+                  },
+                  option.value
+                );
+              }) : /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  className: cn(
+                    "px-2.5 py-2 text-sm text-muted-foreground",
+                    classNames?.empty
+                  ),
+                  children: emptyLabel
+                }
+              )
+            }
+          ) : null
+        ]
+      }
+    );
+  }
+);
 function findOption(options, value) {
   if (value === void 0) return void 0;
   return options.find((option) => option.value === value);
@@ -9786,7 +10228,7 @@ function getInitialValue(options, defaultValue) {
   }
   return "";
 }
-function getNextEnabledIndex(options, currentIndex, direction) {
+function getNextEnabledIndex2(options, currentIndex, direction) {
   if (!options.length) return -1;
   for (let offset = 1; offset <= options.length; offset += 1) {
     const nextIndex = (currentIndex + offset * direction + options.length) % options.length;
@@ -9888,7 +10330,7 @@ react.forwardRef(
     };
     const focusOption = (direction) => {
       const currentIndex = activeIndex >= 0 ? activeIndex : 0;
-      const nextIndex = getNextEnabledIndex(optionList, currentIndex, direction);
+      const nextIndex = getNextEnabledIndex2(optionList, currentIndex, direction);
       if (nextIndex >= 0) {
         commitValue(optionList[nextIndex].value, optionList[nextIndex].disabled);
       }