silver-ui 0.3.0 → 0.4.0

package/dist/{chunk-ZXPKFGRB.cjs → chunk-TPB53MHV.cjs}

@@ -1,16 +1,16 @@
 'use strict';
 
-var chunkL6JT244G_cjs = require('./chunk-L6JT244G.cjs');
+var chunkSSOAZZNR_cjs = require('./chunk-SSOAZZNR.cjs');
 var chunkPYPXJC35_cjs = require('./chunk-PYPXJC35.cjs');
 var chunkVXBVSYPA_cjs = require('./chunk-VXBVSYPA.cjs');
-var chunkKFEXS6OK_cjs = require('./chunk-KFEXS6OK.cjs');
-var chunkMAL4D4LR_cjs = require('./chunk-MAL4D4LR.cjs');
-var chunkYBPG5RPR_cjs = require('./chunk-YBPG5RPR.cjs');
-var chunkYXYD5HKL_cjs = require('./chunk-YXYD5HKL.cjs');
-var chunkJMNH45Q3_cjs = require('./chunk-JMNH45Q3.cjs');
+var chunkYY6KJO5Z_cjs = require('./chunk-YY6KJO5Z.cjs');
+var chunkG2WW52GO_cjs = require('./chunk-G2WW52GO.cjs');
+var chunkQOKEU3DC_cjs = require('./chunk-QOKEU3DC.cjs');
+var chunkSBS7U7CN_cjs = require('./chunk-SBS7U7CN.cjs');
+var chunkM26XECB2_cjs = require('./chunk-M26XECB2.cjs');
 var chunk4TIAKZ4Q_cjs = require('./chunk-4TIAKZ4Q.cjs');
-var chunkSPDVNY2Z_cjs = require('./chunk-SPDVNY2Z.cjs');
 var chunkRU6JG3FS_cjs = require('./chunk-RU6JG3FS.cjs');
+var chunkSPDVNY2Z_cjs = require('./chunk-SPDVNY2Z.cjs');
 var lucideReact = require('lucide-react');
 var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
@@ -101,9 +101,10 @@ var styles = {
       outlineColor: "primary",
       outlineOffset: "focusOffsetTight"
     },
-    _disabled: {
+    '&[aria-disabled="true"]': {
       opacity: 0.55,
-      cursor: "not-allowed"
+      cursor: "not-allowed",
+      pointerEvents: "none"
     }
   }),
   checkbox: chunkRU6JG3FS_cjs.css({
@@ -222,7 +223,7 @@ function MultiSelect({
     statusMessageID,
     triggerRef,
     visibleSelectableOptions
-  } = chunkL6JT244G_cjs.useSelectListbox({
+  } = chunkSSOAZZNR_cjs.useSelectListbox({
     description,
     isDefaultOpen,
     isDisabled,
@@ -272,7 +273,7 @@ function MultiSelect({
       const overflow = selectedOptions.length - visible.length;
       return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: styles.badges, children: [
         visible.map((option) => /* @__PURE__ */ jsxRuntime.jsx(chunkPYPXJC35_cjs.Badge, { label: option.label ?? option.value }, option.value)),
-        overflow > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(chunkJMNH45Q3_cjs.Text, { as: "span", color: "secondary", type: "supporting", children: [
+        overflow > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(chunkM26XECB2_cjs.Text, { as: "span", color: "secondary", type: "supporting", children: [
           "+",
           overflow
         ] }) : null
@@ -289,44 +290,46 @@ function MultiSelect({
     }
     const isSelected = selectedValues.has(option.value);
     const isHighlighted = highlightedValue === option.value;
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      "button",
-      {
-        "aria-selected": isSelected,
-        className: chunkSPDVNY2Z_cjs.cx(
-          styles.option,
-          isHighlighted ? styles.optionHighlighted : void 0
-        ),
-        "data-value": option.value,
-        disabled: option.isDisabled,
-        id: getOptionId(option.value),
-        onClick: handleOptionClick,
-        onMouseEnter: handleOptionMouseEnter,
-        role: "option",
-        tabIndex: isHighlighted ? 0 : -1,
-        type: "button",
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "span",
-            {
-              "aria-hidden": "true",
-              className: chunkSPDVNY2Z_cjs.cx(
-                styles.checkbox,
-                isSelected ? styles.checkboxSelected : void 0
-              ),
-              children: isSelected ? /* @__PURE__ */ jsxRuntime.jsx(chunk4TIAKZ4Q_cjs.Icon, { icon: lucideReact.Check, size: "sm" }) : null
-            }
+    return (
+      // eslint-disable-next-line jsx-a11y-x/click-events-have-key-events -- keyboard navigation is handled by the combobox input, not individual options
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          "aria-disabled": option.isDisabled ?? void 0,
+          "aria-selected": isSelected,
+          className: chunkSPDVNY2Z_cjs.cx(
+            styles.option,
+            isHighlighted ? styles.optionHighlighted : void 0
           ),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles.optionContent, children: children == null ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-            option.icon != null ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles.iconSlot, children: /* @__PURE__ */ jsxRuntime.jsx(chunk4TIAKZ4Q_cjs.Icon, { color: "secondary", icon: option.icon, size: "sm" }) }) : null,
-            option.label
-          ] }) : children(option) })
-        ]
-      },
-      option.value
+          "data-value": option.value,
+          id: getOptionId(option.value),
+          onClick: option.isDisabled ? void 0 : handleOptionClick,
+          onMouseEnter: handleOptionMouseEnter,
+          role: "option",
+          tabIndex: isHighlighted ? 0 : -1,
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "span",
+              {
+                "aria-hidden": "true",
+                className: chunkSPDVNY2Z_cjs.cx(
+                  styles.checkbox,
+                  isSelected ? styles.checkboxSelected : void 0
+                ),
+                children: isSelected ? /* @__PURE__ */ jsxRuntime.jsx(chunk4TIAKZ4Q_cjs.Icon, { icon: lucideReact.Check, size: "sm" }) : null
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles.optionContent, children: children == null ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              option.icon != null ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles.iconSlot, children: /* @__PURE__ */ jsxRuntime.jsx(chunk4TIAKZ4Q_cjs.Icon, { color: "secondary", icon: option.icon, size: "sm" }) }) : null,
+              option.label
+            ] }) : children(option) })
+          ]
+        },
+        option.value
+      )
     );
   };
-  const optionNodes = chunkL6JT244G_cjs.renderSelectListboxOptions({
+  const optionNodes = chunkSSOAZZNR_cjs.renderSelectListboxOptions({
     dividerClassName: styles.divider,
     inputId,
     options,
@@ -361,29 +364,32 @@ function MultiSelect({
         id: listboxId,
         role: "listbox",
         children: [
-          hasSelectAll ? /* @__PURE__ */ jsxRuntime.jsxs(
-            "button",
-            {
-              "aria-selected": allSelected,
-              className: styles.option,
-              onClick: toggleAll,
-              role: "option",
-              type: "button",
-              children: [
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  "span",
-                  {
-                    "aria-hidden": "true",
-                    className: chunkSPDVNY2Z_cjs.cx(
-                      styles.checkbox,
-                      allSelected ? styles.checkboxSelected : void 0
-                    ),
-                    children: allSelected ? /* @__PURE__ */ jsxRuntime.jsx(chunk4TIAKZ4Q_cjs.Icon, { icon: lucideReact.Check, size: "sm" }) : null
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles.optionContent, children: selectAllLabel })
-              ]
-            }
+          hasSelectAll ? (
+            // eslint-disable-next-line jsx-a11y-x/click-events-have-key-events -- keyboard navigation is handled by the combobox input, not individual options
+            /* @__PURE__ */ jsxRuntime.jsxs(
+              "div",
+              {
+                "aria-selected": allSelected,
+                className: styles.option,
+                onClick: toggleAll,
+                role: "option",
+                tabIndex: -1,
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "span",
+                    {
+                      "aria-hidden": "true",
+                      className: chunkSPDVNY2Z_cjs.cx(
+                        styles.checkbox,
+                        allSelected ? styles.checkboxSelected : void 0
+                      ),
+                      children: allSelected ? /* @__PURE__ */ jsxRuntime.jsx(chunk4TIAKZ4Q_cjs.Icon, { icon: lucideReact.Check, size: "sm" }) : null
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles.optionContent, children: selectAllLabel })
+                ]
+              }
+            )
           ) : null,
           optionNodes
         ]
@@ -433,9 +439,9 @@ function MultiSelect({
               children: renderTriggerValue()
             }
           ),
-          isLoading ? /* @__PURE__ */ jsxRuntime.jsx(chunkYXYD5HKL_cjs.Spinner, { size: "sm" }) : null,
+          isLoading ? /* @__PURE__ */ jsxRuntime.jsx(chunkSBS7U7CN_cjs.Spinner, { size: "sm" }) : null,
           hasClear && value.length > 0 && !isDisabled ? /* @__PURE__ */ jsxRuntime.jsx(
-            chunkYBPG5RPR_cjs.Button,
+            chunkQOKEU3DC_cjs.Button,
             {
               icon: lucideReact.X,
               isIconOnly: true,
@@ -453,9 +459,9 @@ function MultiSelect({
       }
     )
   );
-  const necessity = chunkKFEXS6OK_cjs.getNecessity(isOptional, isRequired);
+  const necessity = chunkYY6KJO5Z_cjs.getNecessity(isOptional, isRequired);
   return /* @__PURE__ */ jsxRuntime.jsxs(
-    chunkKFEXS6OK_cjs.Field,
+    chunkYY6KJO5Z_cjs.Field,
     {
       className,
       description,
@@ -472,7 +478,7 @@ function MultiSelect({
       children: [
         trigger,
         /* @__PURE__ */ jsxRuntime.jsx(
-          chunkMAL4D4LR_cjs.Popover,
+          chunkG2WW52GO_cjs.Popover,
           {
             anchorRef: triggerRef,
             content: menu,
@@ -490,5 +496,5 @@ function MultiSelect({
 MultiSelect.displayName = "MultiSelect";
 
 exports.MultiSelect = MultiSelect;
-//# sourceMappingURL=chunk-ZXPKFGRB.cjs.map
-//# sourceMappingURL=chunk-ZXPKFGRB.cjs.map
+//# sourceMappingURL=chunk-TPB53MHV.cjs.map
+//# sourceMappingURL=chunk-TPB53MHV.cjs.map

package/dist/chunk-TPB53MHV.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/MultiSelect/MultiSelect.tsx"],"names":["css","useMemo","useCallback","useSelectListbox","jsx","cx","jsxs","Badge","Text","Icon","Check","Fragment","renderSelectListboxOptions","inputRecipe","Spinner","Button","X","ChevronDown","getNecessity","Field","Popover"],"mappings":"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","file":"chunk-TPB53MHV.cjs","sourcesContent":["import {Check, ChevronDown, X} from 'lucide-react';\nimport {\n  useCallback,\n  useMemo,\n  type CSSProperties,\n  type ReactNode,\n  type Ref,\n} from 'react';\nimport {css} from 'styled-system/css';\nimport {cx} from '../../internal/cx';\nimport {\n  renderSelectListboxOptions,\n  useSelectListbox,\n  type SelectListboxOptionData,\n} from '../../internal/useSelectListbox';\nimport {Badge} from '../Badge';\nimport {Button} from '../Button';\nimport {\n  Field,\n  getNecessity,\n  type FieldNecessity,\n  type InputSize,\n  type InputStatus,\n} from '../Field';\nimport {inputRecipe} from '../Field/inputStyles';\nimport {Icon, type IconComponent} from '../Icon';\nimport {Popover} from '../Popover';\nimport {Spinner} from '../Spinner';\nimport {Text} from '../Text';\n\nexport interface MultiSelectOptionData extends SelectListboxOptionData {\n  /**\n   * Icon displayed before the label.\n   */\n  icon?: IconComponent;\n  /**\n   * Whether the option is disabled.\n   */\n  isDisabled?: boolean;\n  /**\n   * Option label. Defaults to `value`.\n   */\n  label?: string;\n  /**\n   * Option value.\n   */\n  value: string;\n}\n\nexport interface MultiSelectDivider {\n  /**\n   * Discriminator identifying a divider entry.\n   */\n  type: 'divider';\n}\n\nexport interface MultiSelectSection {\n  /**\n   * Options within this section.\n   */\n  options: ReadonlyArray<MultiSelectOptionData>;\n  /**\n   * Optional heading text for the section.\n   */\n  title?: string;\n  /**\n   * Discriminator identifying a section entry.\n   */\n  type: 'section';\n}\n\nexport type MultiSelectOption =\n  | MultiSelectDivider\n  | MultiSelectOptionData\n  | MultiSelectSection\n  | string;\n\nexport type MultiSelectTriggerDisplay = 'count' | 'labels' | 'badges';\n\nexport type MultiSelectProps = {\n  /**\n   * Custom render function for selectable options.\n   */\n  children?: (option: MultiSelectOptionData) => ReactNode;\n  /**\n   * Additional CSS class names applied to the trigger wrapper.\n   */\n  className?: string;\n  /**\n   * Test ID applied to the combobox button.\n   */\n  'data-testid'?: string;\n  /**\n   * Supporting text displayed below the label.\n   */\n  description?: ReactNode;\n  /**\n   * Whether to show a clear button when values are selected.\n   * @default false\n   */\n  hasClear?: boolean;\n  /**\n   * Whether to show search input in the dropdown.\n   * @default false\n   */\n  hasSearch?: boolean;\n  /**\n   * Whether to show a select-all option.\n   * @default false\n   */\n  hasSelectAll?: boolean;\n  /**\n   * Whether the selector starts open.\n   * @default false\n   */\n  isDefaultOpen?: boolean;\n  /**\n   * Whether the selector is disabled.\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Whether to visually hide the label.\n   * @default false\n   */\n  isLabelHidden?: boolean;\n  /**\n   * Whether the selector is loading.\n   * @default false\n   */\n  isLoading?: boolean;\n  /**\n   * Field label.\n   */\n  label: string;\n  /**\n   * Icon shown before the label.\n   */\n  labelIcon?: IconComponent;\n  /**\n   * Tooltip content shown next to the label.\n   */\n  labelTooltip?: ReactNode;\n  /**\n   * Maximum number of badges before showing an overflow count.\n   * @default 3\n   */\n  maxBadges?: number;\n  /**\n   * Called when selection changes.\n   */\n  onChange: (value: string[]) => void;\n  /**\n   * Options to display.\n   */\n  options: ReadonlyArray<MultiSelectOption>;\n  /**\n   * Placeholder shown when no values are selected.\n   * @default 'Select...'\n   */\n  placeholder?: string;\n  /**\n   * Ref forwarded to the combobox button.\n   */\n  ref?: Ref<HTMLButtonElement>;\n  /**\n   * Search input placeholder.\n   * @default 'Search...'\n   */\n  searchPlaceholder?: string;\n  /**\n   * Select-all option label.\n   * @default 'Select all'\n   */\n  selectAllLabel?: string;\n  /**\n   * Select size.\n   * @default 'md'\n   */\n  size?: InputSize;\n  /**\n   * Start icon rendered in the trigger.\n   */\n  startIcon?: IconComponent;\n  /**\n   * Validation status displayed below the selector.\n   */\n  status?: InputStatus;\n  /**\n   * Inline styles applied to the trigger wrapper.\n   */\n  style?: CSSProperties;\n  /**\n   * How selected items are summarized in the trigger.\n   * @default 'count'\n   */\n  triggerDisplay?: MultiSelectTriggerDisplay;\n  /**\n   * Selected option values.\n   */\n  value: string[];\n} & FieldNecessity;\n\nconst styles = {\n  wrapper: css({\n    cursor: 'pointer',\n  }),\n  wrapperDisabled: css({\n    cursor: 'not-allowed',\n  }),\n  trigger: css({\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    gap: '2',\n    flex: 1,\n    minW: 0,\n    p: 0,\n    borderWidth: 0,\n    bg: 'transparent',\n    color: 'inherit',\n    cursor: 'pointer',\n    fontFamily: 'body',\n    outline: 'none',\n    textAlign: 'start',\n    _disabled: {cursor: 'not-allowed'},\n  }),\n  triggerText: css({\n    flex: 1,\n    minW: 0,\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    whiteSpace: 'nowrap',\n  }),\n  placeholder: css({color: 'fg.muted'}),\n  iconSlot: css({\n    display: 'inline-flex',\n    alignItems: 'center',\n    flexShrink: 0,\n    color: 'fg.muted',\n  }),\n  badges: css({\n    display: 'inline-flex',\n    alignItems: 'center',\n    gap: '1',\n    minW: 0,\n    overflow: 'hidden',\n  }),\n  menu: css({\n    display: 'flex',\n    flexDirection: 'column',\n    gap: '0.5',\n    maxH: '80',\n    overflowY: 'auto',\n    p: '1',\n  }),\n  search: css({\n    w: 'full',\n    px: '2',\n    py: '1',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'border.emphasized',\n    borderRadius: 'md',\n    fontFamily: 'body',\n    outline: 'none',\n    _focus: {borderColor: 'primary'},\n  }),\n  option: css({\n    display: 'flex',\n    alignItems: 'center',\n    gap: '2',\n    w: 'full',\n    px: '2',\n    py: '2',\n    borderWidth: 0,\n    borderRadius: 'md',\n    bg: 'transparent',\n    color: 'fg',\n    cursor: 'pointer',\n    fontFamily: 'body',\n    textAlign: 'start',\n    _hover: {bg: 'bg.subtle'},\n    _focusVisible: {\n      outlineWidth: 'focus',\n      outlineStyle: 'solid',\n      outlineColor: 'primary',\n      outlineOffset: 'focusOffsetTight',\n    },\n    '&[aria-disabled=\"true\"]': {\n      opacity: 0.55,\n      cursor: 'not-allowed',\n      pointerEvents: 'none',\n    },\n  }),\n  checkbox: css({\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    flexShrink: 0,\n    w: '5',\n    h: '5',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'fg.muted',\n    borderRadius: 'sm',\n    bg: 'bg',\n    color: 'fg.onPrimary',\n  }),\n  checkboxSelected: css({\n    bg: 'primary',\n    borderColor: 'primary',\n  }),\n  optionHighlighted: css({bg: 'bg.subtle'}),\n  optionContent: css({\n    display: 'inline-flex',\n    alignItems: 'center',\n    gap: '2',\n    minW: 0,\n    flex: 1,\n  }),\n  sectionHeading: css({\n    px: '2',\n    py: '1',\n    color: 'fg.muted',\n    fontFamily: 'body',\n    fontSize: 'sm',\n    fontWeight: 'semibold',\n  }),\n  divider: css({\n    h: '1px',\n    bg: 'border',\n    my: '1',\n  }),\n} as const;\n\n/**\n * Multi-select dropdown field with checkbox-style options.\n */\nexport function MultiSelect({\n  children,\n  className,\n  'data-testid': dataTestId,\n  description,\n  hasClear = false,\n  hasSearch = false,\n  hasSelectAll = false,\n  isDefaultOpen = false,\n  isDisabled = false,\n  isLabelHidden = false,\n  isLoading = false,\n  isOptional,\n  isRequired,\n  label,\n  labelIcon,\n  labelTooltip,\n  maxBadges = 3,\n  onChange,\n  options,\n  placeholder = 'Select...',\n  ref,\n  searchPlaceholder = 'Search...',\n  selectAllLabel = 'Select all',\n  size = 'md',\n  startIcon,\n  status,\n  style,\n  triggerDisplay = 'count',\n  value,\n}: MultiSelectProps): React.JSX.Element {\n  const selectedValues = useMemo(() => new Set(value), [value]);\n  const commitChange = useCallback(\n    (nextValue: string[]) => {\n      onChange(nextValue);\n    },\n    [onChange],\n  );\n\n  const toggleValue = useCallback(\n    (option: MultiSelectOptionData): boolean => {\n      if (option.isDisabled === true) {\n        return false;\n      }\n\n      const nextValues = new Set(value);\n      if (nextValues.has(option.value)) {\n        nextValues.delete(option.value);\n      } else {\n        nextValues.add(option.value);\n      }\n      commitChange(Array.from(nextValues));\n      return true;\n    },\n    [commitChange, value],\n  );\n\n  const {\n    activeDescendantId,\n    describedBy,\n    descriptionID,\n    filteredValues,\n    getOptionId,\n    handleKeyboardNavigation,\n    handleOptionClick,\n    handleOptionMouseEnter,\n    highlightedValue,\n    inputId,\n    isInteractionDisabled,\n    isOpen,\n    listboxId,\n    query,\n    selectableOptions,\n    setHighlightedValue,\n    setIsOpen,\n    setQuery,\n    statusMessageID,\n    triggerRef,\n    visibleSelectableOptions,\n  } = useSelectListbox({\n    description,\n    isDefaultOpen,\n    isDisabled,\n    isLoading,\n    onCommitOption: toggleValue,\n    options,\n    selectedValues,\n    shouldClearOnCommit: false,\n    status,\n  });\n\n  const selectedOptions = useMemo(\n    () => selectableOptions.filter(option => selectedValues.has(option.value)),\n    [selectableOptions, selectedValues],\n  );\n  const enabledVisibleOptions = useMemo(\n    () => visibleSelectableOptions.filter(option => option.isDisabled !== true),\n    [visibleSelectableOptions],\n  );\n  const allSelected =\n    enabledVisibleOptions.length > 0 &&\n    enabledVisibleOptions.every(option => selectedValues.has(option.value));\n\n  const toggleAll = useCallback(() => {\n    if (allSelected) {\n      commitChange(\n        value.filter(\n          optionValue =>\n            !enabledVisibleOptions.some(option => option.value === optionValue),\n        ),\n      );\n      return;\n    }\n\n    const nextValues = new Set(value);\n    for (const option of enabledVisibleOptions) {\n      nextValues.add(option.value);\n    }\n    commitChange(Array.from(nextValues));\n  }, [allSelected, commitChange, enabledVisibleOptions, value]);\n\n  const renderTriggerValue = (): ReactNode => {\n    if (selectedOptions.length === 0) {\n      return (\n        <span className={cx(styles.triggerText, styles.placeholder)}>\n          {placeholder}\n        </span>\n      );\n    }\n    if (triggerDisplay === 'labels') {\n      const labels = selectedOptions.map(\n        option => option.label ?? option.value,\n      );\n      return <span className={styles.triggerText}>{labels.join(', ')}</span>;\n    }\n    if (triggerDisplay === 'badges') {\n      const visible = selectedOptions.slice(0, maxBadges);\n      const overflow = selectedOptions.length - visible.length;\n      return (\n        <span className={styles.badges}>\n          {visible.map(option => (\n            <Badge key={option.value} label={option.label ?? option.value} />\n          ))}\n          {overflow > 0 ? (\n            <Text as=\"span\" color=\"secondary\" type=\"supporting\">\n              +{overflow}\n            </Text>\n          ) : null}\n        </span>\n      );\n    }\n    return (\n      <span className={styles.triggerText}>\n        {selectedOptions.length} selected\n      </span>\n    );\n  };\n\n  const renderOption = (option: MultiSelectOptionData): ReactNode => {\n    if (!filteredValues.has(option.value)) {\n      return null;\n    }\n    const isSelected = selectedValues.has(option.value);\n    const isHighlighted = highlightedValue === option.value;\n    return (\n      // eslint-disable-next-line jsx-a11y-x/click-events-have-key-events -- keyboard navigation is handled by the combobox input, not individual options\n      <div\n        aria-disabled={option.isDisabled ?? undefined}\n        aria-selected={isSelected}\n        className={cx(\n          styles.option,\n          isHighlighted ? styles.optionHighlighted : undefined,\n        )}\n        data-value={option.value}\n        id={getOptionId(option.value)}\n        key={option.value}\n        onClick={option.isDisabled ? undefined : handleOptionClick}\n        onMouseEnter={handleOptionMouseEnter}\n        role=\"option\"\n        tabIndex={isHighlighted ? 0 : -1}>\n        <span\n          aria-hidden=\"true\"\n          className={cx(\n            styles.checkbox,\n            isSelected ? styles.checkboxSelected : undefined,\n          )}>\n          {isSelected ? <Icon icon={Check} size=\"sm\" /> : null}\n        </span>\n        <span className={styles.optionContent}>\n          {children == null ? (\n            <>\n              {option.icon != null ? (\n                <span className={styles.iconSlot}>\n                  <Icon color=\"secondary\" icon={option.icon} size=\"sm\" />\n                </span>\n              ) : null}\n              {option.label}\n            </>\n          ) : (\n            children(option)\n          )}\n        </span>\n      </div>\n    );\n  };\n\n  const optionNodes = renderSelectListboxOptions({\n    dividerClassName: styles.divider,\n    inputId,\n    options,\n    renderOption,\n    sectionHeadingClassName: styles.sectionHeading,\n  });\n\n  const menu = (\n    <>\n      {hasSearch ? (\n        <input\n          aria-activedescendant={activeDescendantId}\n          aria-autocomplete=\"list\"\n          aria-controls={listboxId}\n          aria-label={`Search ${label}`}\n          className={styles.search}\n          onChange={event => {\n            setQuery(event.target.value);\n            setHighlightedValue(null);\n          }}\n          onKeyDown={handleKeyboardNavigation}\n          placeholder={searchPlaceholder}\n          type=\"search\"\n          value={query}\n        />\n      ) : null}\n      <div\n        aria-label={`${label} options`}\n        aria-multiselectable=\"true\"\n        className={styles.menu}\n        id={listboxId}\n        role=\"listbox\">\n        {hasSelectAll ? (\n          // eslint-disable-next-line jsx-a11y-x/click-events-have-key-events -- keyboard navigation is handled by the combobox input, not individual options\n          <div\n            aria-selected={allSelected}\n            className={styles.option}\n            onClick={toggleAll}\n            role=\"option\"\n            tabIndex={-1}>\n            <span\n              aria-hidden=\"true\"\n              className={cx(\n                styles.checkbox,\n                allSelected ? styles.checkboxSelected : undefined,\n              )}>\n              {allSelected ? <Icon icon={Check} size=\"sm\" /> : null}\n            </span>\n            <span className={styles.optionContent}>{selectAllLabel}</span>\n          </div>\n        ) : null}\n        {optionNodes}\n      </div>\n    </>\n  );\n\n  const trigger = (\n    // eslint-disable-next-line jsx-a11y-x/click-events-have-key-events, jsx-a11y-x/no-static-element-interactions -- mouse clicks anywhere on the visual input delegate to the inner combobox button; keyboard handling stays on that button.\n    <div\n      className={cx(\n        inputRecipe({\n          size,\n          status: status?.type,\n          isDisabled,\n        }),\n        styles.wrapper,\n        isInteractionDisabled ? styles.wrapperDisabled : undefined,\n      )}\n      onClick={() => {\n        if (!isInteractionDisabled) {\n          setIsOpen(currentIsOpen => !currentIsOpen);\n        }\n      }}\n      ref={triggerRef}>\n      {startIcon != null ? (\n        <span className={styles.iconSlot}>\n          <Icon color=\"secondary\" icon={startIcon} size=\"sm\" />\n        </span>\n      ) : null}\n      <button\n        aria-activedescendant={activeDescendantId}\n        aria-busy={isLoading || undefined}\n        aria-controls={listboxId}\n        aria-describedby={describedBy}\n        aria-expanded={isOpen}\n        aria-haspopup=\"listbox\"\n        aria-invalid={status?.type === 'error' || undefined}\n        className={styles.trigger}\n        data-testid={dataTestId}\n        disabled={isInteractionDisabled}\n        id={inputId}\n        onKeyDown={handleKeyboardNavigation}\n        ref={ref}\n        role=\"combobox\"\n        type=\"button\">\n        {renderTriggerValue()}\n      </button>\n      {isLoading ? <Spinner size=\"sm\" /> : null}\n      {hasClear && value.length > 0 && !isDisabled ? (\n        <Button\n          icon={X}\n          isIconOnly\n          label={`Clear ${label}`}\n          onClick={event => {\n            event.stopPropagation();\n            commitChange([]);\n          }}\n          size=\"sm\"\n          variant=\"ghost\"\n        />\n      ) : null}\n      <span className={styles.iconSlot}>\n        <Icon icon={ChevronDown} size=\"sm\" />\n      </span>\n    </div>\n  );\n\n  const necessity = getNecessity(isOptional, isRequired);\n\n  return (\n    <Field\n      className={className}\n      description={description}\n      descriptionID={descriptionID}\n      inputId={inputId}\n      isDisabled={isDisabled}\n      isLabelHidden={isLabelHidden}\n      {...necessity}\n      label={label}\n      labelIcon={labelIcon}\n      labelTooltip={labelTooltip}\n      status={\n        status == null ? undefined : {...status, messageID: statusMessageID}\n      }\n      style={style}>\n      {trigger}\n      <Popover\n        anchorRef={triggerRef}\n        content={menu}\n        hasAutoFocus={hasSearch}\n        hasCloseButton={false}\n        isEnabled={false}\n        isOpen={isOpen}\n        onOpenChange={setIsOpen}\n      />\n    </Field>\n  );\n}\n\nMultiSelect.displayName = 'MultiSelect';\n"]}

package/dist/chunk-TQA3BI7M.cjs

@@ -0,0 +1,216 @@
+'use strict';
+
+var chunkDVGLYE3G_cjs = require('./chunk-DVGLYE3G.cjs');
+var chunkQAO6QMNQ_cjs = require('./chunk-QAO6QMNQ.cjs');
+var chunkZ6RT3WPE_cjs = require('./chunk-Z6RT3WPE.cjs');
+var chunkSPDVNY2Z_cjs = require('./chunk-SPDVNY2Z.cjs');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/components/List/List.recipe.ts
+var markerSize = "6px";
+var listRecipe = chunkZ6RT3WPE_cjs.sva({
+  slots: ["root", "header", "list"],
+  base: {
+    root: {
+      display: "flex",
+      flexDirection: "column"
+    },
+    header: {
+      mb: "2"
+    },
+    list: {
+      display: "flex",
+      flexDirection: "column",
+      gap: "0.5",
+      m: 0,
+      p: 0,
+      listStyleType: "none"
+    }
+  },
+  variants: {
+    hasDividers: {
+      true: { list: { gap: 0 } }
+    },
+    hasCounter: {
+      true: { list: { counterReset: "silver-list" } }
+    }
+  },
+  defaultVariants: {
+    hasDividers: false,
+    hasCounter: false
+  }
+});
+var listItemRecipe = chunkZ6RT3WPE_cjs.sva({
+  slots: ["item", "markerContainer", "dot", "circle", "number"],
+  base: {
+    item: {},
+    markerContainer: {
+      alignSelf: "baseline",
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      flexShrink: 0,
+      w: "4",
+      mt: `calc((1em * 1.5 - ${markerSize}) / 2)`
+    },
+    dot: {
+      w: markerSize,
+      h: markerSize,
+      borderRadius: "full",
+      bg: "fg"
+    },
+    circle: {
+      w: markerSize,
+      h: markerSize,
+      borderRadius: "full",
+      borderWidth: "default",
+      borderStyle: "solid",
+      borderColor: "fg",
+      bg: "transparent"
+    },
+    number: {
+      alignSelf: "baseline",
+      flexShrink: 0,
+      color: "fg",
+      fontFamily: "body",
+      fontSize: "md",
+      lineHeight: "1.5",
+      w: "4",
+      _before: {
+        content: 'counter(silver-list) "."'
+      }
+    }
+  },
+  variants: {
+    hasCounter: {
+      true: {
+        item: { counterIncrement: "silver-list" }
+      }
+    },
+    hasDividers: {
+      true: {
+        item: {
+          borderBlockEndWidth: "default",
+          borderBlockEndStyle: "solid",
+          borderBlockEndColor: "border",
+          borderRadius: 0,
+          _last: {
+            borderBlockEndWidth: 0
+          }
+        }
+      }
+    }
+  },
+  defaultVariants: {
+    hasCounter: false,
+    hasDividers: false
+  }
+});
+var ListContext = react.createContext(null);
+ListContext.displayName = "ListContext";
+function List({
+  children,
+  className,
+  "data-testid": dataTestId,
+  hasDividers = false,
+  header,
+  listStyle = "none",
+  ref,
+  start,
+  style
+}) {
+  const headerId = react.useId();
+  const isOrdered = listStyle === "decimal";
+  const hasCounter = isOrdered;
+  const Component = isOrdered ? "ol" : "ul";
+  const counterReset = hasCounter && start != null && start !== 1 ? `silver-list ${start - 1}` : void 0;
+  const contextValue = react.useMemo(
+    () => ({ hasDividers, listStyle }),
+    [hasDividers, listStyle]
+  );
+  const classes = listRecipe({ hasDividers, hasCounter });
+  const listElement = /* @__PURE__ */ jsxRuntime.jsx(
+    Component,
+    {
+      "aria-labelledby": chunkQAO6QMNQ_cjs.isReactNode(header) ? headerId : void 0,
+      className: chunkSPDVNY2Z_cjs.cx(classes.list, className),
+      "data-testid": dataTestId,
+      ref,
+      role: listStyle === "none" && !isOrdered ? "list" : void 0,
+      start: isOrdered ? start : void 0,
+      style: { counterReset, ...style },
+      children
+    }
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(ListContext, { value: contextValue, children: !chunkQAO6QMNQ_cjs.isReactNode(header) ? listElement : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.root, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.header, id: headerId, children: header }),
+    listElement
+  ] }) });
+}
+List.displayName = "List";
+function Marker({
+  classes,
+  listStyle
+}) {
+  if (listStyle === "disc") {
+    return /* @__PURE__ */ jsxRuntime.jsx("span", { className: classes.markerContainer, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: classes.dot }) });
+  }
+  if (listStyle === "circle") {
+    return /* @__PURE__ */ jsxRuntime.jsx("span", { className: classes.markerContainer, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: classes.circle }) });
+  }
+  if (listStyle === "decimal") {
+    return /* @__PURE__ */ jsxRuntime.jsx("span", { className: classes.number });
+  }
+  return null;
+}
+function ListItem({
+  className,
+  "data-testid": dataTestId,
+  description,
+  endContent,
+  href,
+  isDisabled = false,
+  isSelected = false,
+  label,
+  onClick,
+  ref,
+  rel,
+  startContent,
+  style,
+  target
+}) {
+  const context = react.use(ListContext);
+  const hasDividers = context?.hasDividers ?? false;
+  const listStyle = context?.listStyle ?? "none";
+  const hasCounter = listStyle === "decimal";
+  const hasMarkers = listStyle !== "none";
+  const classes = listItemRecipe({ hasCounter, hasDividers });
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    chunkDVGLYE3G_cjs.Item,
+    {
+      as: "li",
+      className: chunkSPDVNY2Z_cjs.cx(classes.item, className),
+      "data-testid": dataTestId,
+      description,
+      endContent,
+      href,
+      isDisabled,
+      isSelected,
+      label,
+      leadingContent: hasMarkers ? /* @__PURE__ */ jsxRuntime.jsx(Marker, { classes, listStyle }) : void 0,
+      onClick,
+      ref,
+      rel,
+      startContent,
+      style,
+      target
+    }
+  );
+}
+ListItem.displayName = "ListItem";
+
+exports.List = List;
+exports.ListItem = ListItem;
+//# sourceMappingURL=chunk-TQA3BI7M.cjs.map
+//# sourceMappingURL=chunk-TQA3BI7M.cjs.map

package/dist/chunk-TQA3BI7M.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/List/List.recipe.ts","../src/components/List/ListContext.tsx","../src/components/List/List.tsx","../src/components/List/ListItem.tsx"],"names":["sva","createContext","useId","useMemo","jsx","isReactNode","cx","jsxs","use","Item"],"mappings":"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","file":"chunk-TQA3BI7M.cjs","sourcesContent":["import {sva, type RecipeVariantProps} from 'styled-system/css';\n\nconst markerSize = '6px';\n\nexport const listRecipe = sva({\n  slots: ['root', 'header', 'list'],\n  base: {\n    root: {\n      display: 'flex',\n      flexDirection: 'column',\n    },\n    header: {\n      mb: '2',\n    },\n    list: {\n      display: 'flex',\n      flexDirection: 'column',\n      gap: '0.5',\n      m: 0,\n      p: 0,\n      listStyleType: 'none',\n    },\n  },\n  variants: {\n    hasDividers: {\n      true: {list: {gap: 0}},\n    },\n    hasCounter: {\n      true: {list: {counterReset: 'silver-list'}},\n    },\n  },\n  defaultVariants: {\n    hasDividers: false,\n    hasCounter: false,\n  },\n});\n\nexport type ListVariants = RecipeVariantProps<typeof listRecipe>;\n\nexport const listItemRecipe = sva({\n  slots: ['item', 'markerContainer', 'dot', 'circle', 'number'],\n  base: {\n    item: {},\n    markerContainer: {\n      alignSelf: 'baseline',\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      flexShrink: 0,\n      w: '4',\n      mt: `calc((1em * 1.5 - ${markerSize}) / 2)`,\n    },\n    dot: {\n      w: markerSize,\n      h: markerSize,\n      borderRadius: 'full',\n      bg: 'fg',\n    },\n    circle: {\n      w: markerSize,\n      h: markerSize,\n      borderRadius: 'full',\n      borderWidth: 'default',\n      borderStyle: 'solid',\n      borderColor: 'fg',\n      bg: 'transparent',\n    },\n    number: {\n      alignSelf: 'baseline',\n      flexShrink: 0,\n      color: 'fg',\n      fontFamily: 'body',\n      fontSize: 'md',\n      lineHeight: '1.5',\n      w: '4',\n      _before: {\n        content: 'counter(silver-list) \".\"',\n      },\n    },\n  },\n  variants: {\n    hasCounter: {\n      true: {\n        item: {counterIncrement: 'silver-list'},\n      },\n    },\n    hasDividers: {\n      true: {\n        item: {\n          borderBlockEndWidth: 'default',\n          borderBlockEndStyle: 'solid',\n          borderBlockEndColor: 'border',\n          borderRadius: 0,\n          _last: {\n            borderBlockEndWidth: 0,\n          },\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    hasCounter: false,\n    hasDividers: false,\n  },\n});\n\nexport type ListItemVariants = RecipeVariantProps<typeof listItemRecipe>;\n","import {createContext} from 'react';\n\nexport type ListStyle = 'none' | 'disc' | 'decimal' | 'circle';\n\nexport interface ListContextValue {\n  hasDividers: boolean;\n  listStyle: ListStyle;\n}\n\nexport const ListContext = createContext<ListContextValue | null>(null);\nListContext.displayName = 'ListContext';\n","import {\n  useId,\n  useMemo,\n  type CSSProperties,\n  type ReactNode,\n  type Ref,\n} from 'react';\nimport {cx} from '../../internal/cx';\nimport isReactNode from '../../internal/isReactNode';\nimport {listRecipe} from './List.recipe';\nimport {ListContext, type ListStyle} from './ListContext';\n\nexport type {ListStyle};\n\nexport interface ListProps {\n  /**\n   * List items.\n   */\n  children: ReactNode;\n  /**\n   * Additional CSS class names applied to the list element.\n   */\n  className?: string;\n  /**\n   * Test ID applied to the list element.\n   */\n  'data-testid'?: string;\n  /**\n   * Whether to show dividers between list items.\n   * @default false\n   */\n  hasDividers?: boolean;\n  /**\n   * Header content rendered above and associated with the list.\n   */\n  header?: ReactNode;\n  /**\n   * List marker style. `decimal` renders an ordered list.\n   * @default 'none'\n   */\n  listStyle?: ListStyle;\n  /**\n   * Ref forwarded to the list element.\n   */\n  ref?: Ref<HTMLUListElement | HTMLOListElement>;\n  /**\n   * Starting number for ordered lists.\n   * @default 1\n   */\n  start?: number;\n  /**\n   * Inline styles applied to the list element.\n   */\n  style?: CSSProperties;\n}\n\n/**\n * Semantic vertical list container with optional dividers, markers, and header.\n */\nexport function List({\n  children,\n  className,\n  'data-testid': dataTestId,\n  hasDividers = false,\n  header,\n  listStyle = 'none',\n  ref,\n  start,\n  style,\n}: ListProps): React.JSX.Element {\n  const headerId = useId();\n  const isOrdered = listStyle === 'decimal';\n  const hasCounter = isOrdered;\n  const Component = isOrdered ? 'ol' : 'ul';\n  const counterReset =\n    hasCounter && start != null && start !== 1\n      ? `silver-list ${start - 1}`\n      : undefined;\n  const contextValue = useMemo(\n    () => ({hasDividers, listStyle}),\n    [hasDividers, listStyle],\n  );\n\n  const classes = listRecipe({hasDividers, hasCounter});\n\n  const listElement = (\n    <Component\n      aria-labelledby={isReactNode(header) ? headerId : undefined}\n      className={cx(classes.list, className)}\n      data-testid={dataTestId}\n      ref={ref as Ref<HTMLUListElement & HTMLOListElement>}\n      role={listStyle === 'none' && !isOrdered ? 'list' : undefined}\n      start={isOrdered ? start : undefined}\n      style={{counterReset, ...style}}>\n      {children}\n    </Component>\n  );\n\n  return (\n    <ListContext value={contextValue}>\n      {!isReactNode(header) ? (\n        listElement\n      ) : (\n        <div className={classes.root}>\n          <div className={classes.header} id={headerId}>\n            {header}\n          </div>\n          {listElement}\n        </div>\n      )}\n    </ListContext>\n  );\n}\n\nList.displayName = 'List';\n","import {\n  use,\n  type CSSProperties,\n  type MouseEventHandler,\n  type ReactNode,\n  type Ref,\n} from 'react';\nimport {cx} from '../../internal/cx';\nimport {Item} from '../Item';\nimport {listItemRecipe} from './List.recipe';\nimport {ListContext, type ListStyle} from './ListContext';\n\nexport interface ListItemProps {\n  /**\n   * Additional CSS class names applied to the list item.\n   */\n  className?: string;\n  /**\n   * Test ID applied to the list item.\n   */\n  'data-testid'?: string;\n  /**\n   * Supporting text shown below the label.\n   */\n  description?: ReactNode;\n  /**\n   * Trailing content rendered after the label area.\n   */\n  endContent?: ReactNode;\n  /**\n   * Link URL. When set, the content area renders as a link.\n   */\n  href?: string;\n  /**\n   * Whether the item is disabled.\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Whether the item is selected.\n   * @default false\n   */\n  isSelected?: boolean;\n  /**\n   * Primary item label.\n   */\n  label: ReactNode;\n  /**\n   * Click handler for interactive items.\n   */\n  onClick?: MouseEventHandler<HTMLElement>;\n  /**\n   * Ref forwarded to the list item.\n   */\n  ref?: Ref<HTMLLIElement>;\n  /**\n   * Link relationship.\n   */\n  rel?: string;\n  /**\n   * Content rendered before the label area.\n   */\n  startContent?: ReactNode;\n  /**\n   * Inline styles applied to the list item.\n   */\n  style?: CSSProperties;\n  /**\n   * Link target.\n   */\n  target?: string;\n}\n\ntype MarkerClasses = ReturnType<typeof listItemRecipe>;\n\nfunction Marker({\n  classes,\n  listStyle,\n}: {\n  classes: MarkerClasses;\n  listStyle: ListStyle;\n}): React.JSX.Element | null {\n  if (listStyle === 'disc') {\n    return (\n      <span className={classes.markerContainer}>\n        <span className={classes.dot} />\n      </span>\n    );\n  }\n\n  if (listStyle === 'circle') {\n    return (\n      <span className={classes.markerContainer}>\n        <span className={classes.circle} />\n      </span>\n    );\n  }\n\n  if (listStyle === 'decimal') {\n    return <span className={classes.number} />;\n  }\n\n  return null;\n}\n\n/**\n * Structured list item built on the shared `Item` primitive.\n */\nexport function ListItem({\n  className,\n  'data-testid': dataTestId,\n  description,\n  endContent,\n  href,\n  isDisabled = false,\n  isSelected = false,\n  label,\n  onClick,\n  ref,\n  rel,\n  startContent,\n  style,\n  target,\n}: ListItemProps): React.JSX.Element {\n  const context = use(ListContext);\n  const hasDividers = context?.hasDividers ?? false;\n  const listStyle = context?.listStyle ?? 'none';\n  const hasCounter = listStyle === 'decimal';\n  const hasMarkers = listStyle !== 'none';\n  const classes = listItemRecipe({hasCounter, hasDividers});\n\n  return (\n    <Item\n      as=\"li\"\n      className={cx(classes.item, className)}\n      data-testid={dataTestId}\n      description={description}\n      endContent={endContent}\n      href={href}\n      isDisabled={isDisabled}\n      isSelected={isSelected}\n      label={label}\n      leadingContent={\n        hasMarkers ? (\n          <Marker classes={classes} listStyle={listStyle} />\n        ) : undefined\n      }\n      onClick={onClick}\n      ref={ref}\n      rel={rel}\n      startContent={startContent}\n      style={style}\n      target={target}\n    />\n  );\n}\n\nListItem.displayName = 'ListItem';\n"]}

package/dist/{chunk-MACIT6C6.js → chunk-U6NH54YD.js}

@@ -1,8 +1,9 @@
-import { Button } from './chunk-HLN3JQYD.js';
-import { useIsomorphicLayoutEffect } from './chunk-ZNUOFLCQ.js';
+import { Button } from './chunk-2LABTS4P.js';
+import { useIsomorphicLayoutEffect } from './chunk-HINS4GY6.js';
 import { mergeRefs } from './chunk-SGLIDI6R.js';
-import { cx } from './chunk-PPNETWIP.js';
+import { isReactNode } from './chunk-2PSZAWLC.js';
 import { css } from './chunk-OD4DHHZH.js';
+import { cx } from './chunk-PPNETWIP.js';
 import { X, ChevronLeft, ChevronRight } from 'lucide-react';
 import { useRef, useState, useMemo, useCallback, useEffect } from 'react';
 import { jsx, jsxs } from 'react/jsx-runtime';
@@ -356,7 +357,7 @@ function Lightbox({
               )
             }
           ),
-          currentItem.caption != null ? /* @__PURE__ */ jsx("div", { className: styles.caption, children: currentItem.caption }) : null
+          isReactNode(currentItem.caption) ? /* @__PURE__ */ jsx("div", { className: styles.caption, children: currentItem.caption }) : null
         ] }) : null,
         canNext ? /* @__PURE__ */ jsx("div", { className: cx(styles.nav, styles.next), children: /* @__PURE__ */ jsx(
           Button,
@@ -418,5 +419,5 @@ function useLightbox(options) {
 }
 
 export { Lightbox, useLightbox };
-//# sourceMappingURL=chunk-MACIT6C6.js.map
-//# sourceMappingURL=chunk-MACIT6C6.js.map
+//# sourceMappingURL=chunk-U6NH54YD.js.map
+//# sourceMappingURL=chunk-U6NH54YD.js.map