@salt-ds/lab 1.0.0-alpha.32 → 1.0.0-alpha.34

package/dist-cjs/dialog/{DialogTitle.js → DialogHeader.js}

@@ -8,17 +8,17 @@ var core = require('@salt-ds/core');
 var DialogContext = require('./DialogContext.js');
 var window = require('@salt-ds/window');
 var styles = require('@salt-ds/styles');
-var DialogTitle$1 = require('./DialogTitle.css.js');
+var DialogHeader$1 = require('./DialogHeader.css.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var clsx__default = /*#__PURE__*/_interopDefaultLegacy(clsx);
 
-const withBaseName = core.makePrefixer("saltDialogTitle");
-const DialogTitle = ({
+const withBaseName = core.makePrefixer("saltDialogHeader");
+const DialogHeader = ({
   className,
-  title,
-  subtitle,
+  header,
+  preheader,
   disableAccent,
   status: statusProp,
   ...rest
@@ -26,8 +26,8 @@ const DialogTitle = ({
   const { status: statusContext, id } = DialogContext.useDialogContext();
   const targetWindow = window.useWindow();
   styles.useComponentCssInjection({
-    testId: "salt-dialog-title",
-    css: DialogTitle$1,
+    testId: "salt-dialog-header",
+    css: DialogHeader$1,
     window: targetWindow
   });
   const status = statusProp != null ? statusProp : statusContext;
@@ -46,16 +46,16 @@ const DialogTitle = ({
       status && /* @__PURE__ */ jsxRuntime.jsx(core.StatusIndicator, {
         status
       }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", {
+      /* @__PURE__ */ jsxRuntime.jsxs(core.H2, {
+        className: withBaseName("header"),
         children: [
-          subtitle && /* @__PURE__ */ jsxRuntime.jsx(core.Text, {
-            as: "label",
+          preheader && /* @__PURE__ */ jsxRuntime.jsx(core.Text, {
             variant: "secondary",
-            children: subtitle
+            className: withBaseName("preheader"),
+            children: preheader
           }),
-          /* @__PURE__ */ jsxRuntime.jsx(core.H2, {
-            className: clsx__default["default"](withBaseName("title")),
-            children: title
+          /* @__PURE__ */ jsxRuntime.jsx("div", {
+            children: header
           })
         ]
       })
@@ -63,5 +63,5 @@ const DialogTitle = ({
   });
 };
 
-exports.DialogTitle = DialogTitle;
-//# sourceMappingURL=DialogTitle.js.map
+exports.DialogHeader = DialogHeader;
+//# sourceMappingURL=DialogHeader.js.map

package/dist-cjs/dialog/DialogHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DialogHeader.js","sources":["../src/dialog/DialogHeader.tsx"],"sourcesContent":["import { ReactNode, ComponentPropsWithoutRef } from \"react\";\nimport clsx from \"clsx\";\nimport {\n  H2,\n  StatusIndicator,\n  ValidationStatus,\n  makePrefixer,\n  Text,\n} from \"@salt-ds/core\";\nimport { useDialogContext } from \"./DialogContext\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport dialogTitleCss from \"./DialogHeader.css\";\n\nconst withBaseName = makePrefixer(\"saltDialogHeader\");\n\ninterface DialogTitleProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The status of the Dialog\n   */\n  status?: ValidationStatus | undefined;\n  /**\n   * Displays the accent bar in the Dialog Title */\n  disableAccent?: boolean;\n  /**\n   * Displays the header at the top of the Dialog\n   */\n  header: ReactNode;\n  /**\n   * Displays the preheader just above the header\n   **/\n  preheader?: ReactNode;\n\n  className?: string;\n}\n\nexport const DialogHeader = ({\n  className,\n  header,\n  preheader,\n  disableAccent,\n  status: statusProp,\n  ...rest\n}: DialogTitleProps) => {\n  const { status: statusContext, id } = useDialogContext();\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-dialog-header\",\n    css: dialogTitleCss,\n    window: targetWindow,\n  });\n\n  const status = statusProp ?? (statusContext as ValidationStatus);\n\n  return (\n    <div\n      id={id}\n      className={clsx(\n        withBaseName(),\n        {\n          [withBaseName(\"withAccent\")]: !disableAccent && !status,\n          [withBaseName(status)]: !!status,\n        },\n        className\n      )}\n      {...rest}\n    >\n      {status && <StatusIndicator status={status} />}\n      <H2 className={withBaseName(\"header\")}>\n        {preheader && (\n          <Text variant=\"secondary\" className={withBaseName(\"preheader\")}>\n            {preheader}\n          </Text>\n        )}\n        <div>{header}</div>\n      </H2>\n    </div>\n  );\n};\n"],"names":["makePrefixer","useDialogContext","useWindow","useComponentCssInjection","dialogTitleCss","jsxs","clsx","jsx","StatusIndicator","H2","Text"],"mappings":";;;;;;;;;;;;;;;;AAcA,MAAM,YAAA,GAAeA,kBAAa,kBAAkB,CAAA,CAAA;AAsB7C,MAAM,eAAe,CAAC;AAAA,EAC3B,SAAA;AAAA,EACA,MAAA;AAAA,EACA,SAAA;AAAA,EACA,aAAA;AAAA,EACA,MAAQ,EAAA,UAAA;AAAA,EACL,GAAA,IAAA;AACL,CAAwB,KAAA;AACtB,EAAA,MAAM,EAAE,MAAA,EAAQ,aAAe,EAAA,EAAA,KAAOC,8BAAiB,EAAA,CAAA;AACvD,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,oBAAA;AAAA,IACR,GAAK,EAAAC,cAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,SAAS,UAAe,IAAA,IAAA,GAAA,UAAA,GAAA,aAAA,CAAA;AAE9B,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,IACC,EAAA;AAAA,IACA,SAAW,EAAAC,wBAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb;AAAA,QACE,CAAC,YAAa,CAAA,YAAY,CAAI,GAAA,CAAC,iBAAiB,CAAC,MAAA;AAAA,QACjD,CAAC,YAAA,CAAa,MAAM,CAAA,GAAI,CAAC,CAAC,MAAA;AAAA,OAC5B;AAAA,MACA,SAAA;AAAA,KACF;AAAA,IACC,GAAG,IAAA;AAAA,IAEH,QAAA,EAAA;AAAA,MAAA,MAAA,oBAAWC,cAAA,CAAAC,oBAAA,EAAA;AAAA,QAAgB,MAAA;AAAA,OAAgB,CAAA;AAAA,sBAC3CH,eAAA,CAAAI,OAAA,EAAA;AAAA,QAAG,SAAA,EAAW,aAAa,QAAQ,CAAA;AAAA,QACjC,QAAA,EAAA;AAAA,UAAA,SAAA,oBACEF,cAAA,CAAAG,SAAA,EAAA;AAAA,YAAK,OAAQ,EAAA,WAAA;AAAA,YAAY,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,YAC1D,QAAA,EAAA,SAAA;AAAA,WACH,CAAA;AAAA,0BAEDH,cAAA,CAAA,KAAA,EAAA;AAAA,YAAK,QAAA,EAAA,MAAA;AAAA,WAAO,CAAA;AAAA,SAAA;AAAA,OACf,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}

package/dist-cjs/dropdown-next/DropdownNext.js

@@ -38,7 +38,6 @@ const DropdownNext = React.forwardRef(function DropdownNext2(props, ref) {
     selected,
     defaultSelected,
     defaultOpen,
-    defaultValue: defaultValueProp,
     value,
     onOpenChange,
     open,
@@ -50,6 +49,7 @@ const DropdownNext = React.forwardRef(function DropdownNext2(props, ref) {
     onKeyDown,
     onFocus,
     onBlur,
+    valueToString = ListControlState.defaultValueToString,
     ...rest
   } = props;
   const targetWindow = window$1.useWindow();
@@ -72,8 +72,6 @@ const DropdownNext = React.forwardRef(function DropdownNext2(props, ref) {
   const readOnly = Boolean(readOnlyProp) || formFieldReadOnly;
   const validationStatus = validationStatusProp != null ? validationStatusProp : formFieldValidationStatus;
   const required = formFieldRequired ? ["required", "asterisk"].includes(formFieldRequired) : requiredProp;
-  const isEmptyReadOnly = readOnly && !defaultValueProp && !value;
-  const defaultValue = isEmptyReadOnly ? emptyReadOnlyMarker : defaultValueProp;
   const listControl = ListControlState.useListControl({
     open,
     defaultOpen,
@@ -82,8 +80,7 @@ const DropdownNext = React.forwardRef(function DropdownNext2(props, ref) {
     defaultSelected,
     selected,
     onSelectionChange,
-    defaultValue,
-    value
+    valueToString
   });
   const {
     activeState,
@@ -98,12 +95,14 @@ const DropdownNext = React.forwardRef(function DropdownNext2(props, ref) {
     options,
     selectedState,
     select,
-    valueState,
     setFocusVisibleState,
     focusedState,
     setFocusedState,
     listRef
   } = listControl;
+  const selectedValue = selectedState.map((item) => valueToString(item)).join(", ");
+  const isEmptyReadOnly = readOnly && selectedValue === "";
+  const valueText = isEmptyReadOnly ? emptyReadOnlyMarker : value != null ? value : selectedValue;
   const { Component: FloatingComponent } = core.useFloatingComponent();
   const handleOpenChange = (newOpen, _event, reason) => {
     const focusNotBlur = reason === "focus" && newOpen;
@@ -297,9 +296,9 @@ const DropdownNext = React.forwardRef(function DropdownNext2(props, ref) {
           startAdornment,
           /* @__PURE__ */ jsxRuntime.jsx("span", {
             className: clsx.clsx(withBaseName("content"), {
-              [withBaseName("placeholder")]: !valueState
+              [withBaseName("placeholder")]: !valueText
             }),
-            children: !valueState ? placeholder : valueState
+            children: !valueText ? placeholder : valueText
           }),
           validationStatus && /* @__PURE__ */ jsxRuntime.jsx(core.StatusAdornment, {
             status: validationStatus

package/dist-cjs/dropdown-next/DropdownNext.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownNext.js","sources":["../src/dropdown-next/DropdownNext.tsx"],"sourcesContent":["import {\n  ComponentPropsWithoutRef,\n  forwardRef,\n  ReactNode,\n  KeyboardEvent,\n  useEffect,\n  FocusEvent,\n  useRef,\n  ForwardedRef,\n  Ref,\n} from \"react\";\nimport {\n  ListControlProps,\n  useListControl,\n} from \"../list-control/ListControlState\";\nimport { ChevronDownIcon, ChevronUpIcon } from \"@salt-ds/icons\";\nimport {\n  makePrefixer,\n  StatusAdornment,\n  useFloatingComponent,\n  useFloatingUI,\n  UseFloatingUIProps,\n  useForkRef,\n  useFormFieldProps,\n  useId,\n  ValidationStatus,\n} from \"@salt-ds/core\";\nimport {\n  flip,\n  size,\n  useClick,\n  useDismiss,\n  useFocus,\n  useInteractions,\n} from \"@floating-ui/react\";\nimport { clsx } from \"clsx\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport dropdownCss from \"./DropdownNext.css\";\nimport { ListControlContext } from \"../list-control/ListControlContext\";\nimport { OptionList } from \"../option/OptionList\";\n\nexport interface DropdownNextProps<Item = string>\n  extends Omit<ComponentPropsWithoutRef<\"button\">, \"value\" | \"defaultValue\">,\n    ListControlProps<Item> {\n  /**\n   * If `true`, the dropdown will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * If `true`, the dropdown will be read-only.\n   */\n  readOnly?: boolean;\n  /**\n   * The options to display in the dropdown.\n   */\n  children?: ReactNode;\n  /**\n   * The marker to use in an empty read only dropdown.\n   * Use `''` to disable this feature. Defaults to '—'.\n   */\n  emptyReadOnlyMarker?: string;\n  /**\n   * If `true`, the dropdown will be multiselect.\n   */\n  multiselect?: boolean;\n  /**\n   * The text shown when the dropdown has no value.\n   */\n  placeholder?: string;\n  /**\n   * If `true`, the dropdown will be required.\n   */\n  required?: boolean;\n  /**\n   * Start adornment component\n   */\n  startAdornment?: ReactNode;\n  /**\n   * Styling variant. Defaults to \"primary\".\n   */\n  variant?: \"primary\" | \"secondary\";\n  /**\n   * The default content of the dropdown shown in the button.\n   */\n  defaultValue?: string | readonly string[] | number | undefined;\n  /**\n   * The content of the dropdown shown in the button. The component will be controlled if this prop is provided.\n   */\n  value?: string | readonly string[] | number | undefined;\n  /**\n   * Validation status, one of \"error\" | \"warning\" | \"success\".\n   */\n  validationStatus?: Exclude<ValidationStatus, \"info\">;\n}\n\nfunction ExpandIcon({ open }: { open: boolean }) {\n  return open ? <ChevronUpIcon aria-hidden /> : <ChevronDownIcon aria-hidden />;\n}\n\nconst withBaseName = makePrefixer(\"saltDropdownNext\");\n\nexport const DropdownNext = forwardRef(function DropdownNext<Item>(\n  props: DropdownNextProps<Item>,\n  ref: ForwardedRef<HTMLButtonElement>\n) {\n  const {\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-describedby\": ariaDescribedBy,\n    children,\n    className,\n    disabled: disabledProp,\n    emptyReadOnlyMarker = \"—\",\n    readOnly: readOnlyProp,\n    multiselect,\n    onSelectionChange,\n    selected,\n    defaultSelected,\n    defaultOpen,\n    defaultValue: defaultValueProp,\n    value,\n    onOpenChange,\n    open,\n    placeholder,\n    startAdornment,\n    required: requiredProp,\n    variant = \"primary\",\n    validationStatus: validationStatusProp,\n    onKeyDown,\n    onFocus,\n    onBlur,\n    ...rest\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-DropdownNext\",\n    css: dropdownCss,\n    window: targetWindow,\n  });\n\n  const {\n    a11yProps: {\n      \"aria-describedby\": formFieldDescribedBy,\n      \"aria-labelledby\": formFieldLabelledBy,\n    } = {},\n    disabled: formFieldDisabled,\n    readOnly: formFieldReadOnly,\n    necessity: formFieldRequired,\n    validationStatus: formFieldValidationStatus,\n  } = useFormFieldProps();\n\n  const disabled = Boolean(disabledProp) || formFieldDisabled;\n  const readOnly = Boolean(readOnlyProp) || formFieldReadOnly;\n  const validationStatus = validationStatusProp ?? formFieldValidationStatus;\n  const required = formFieldRequired\n    ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n    : undefined ?? requiredProp;\n\n  const isEmptyReadOnly = readOnly && !defaultValueProp && !value;\n  const defaultValue = isEmptyReadOnly ? emptyReadOnlyMarker : defaultValueProp;\n\n  const listControl = useListControl<Item>({\n    open,\n    defaultOpen,\n    onOpenChange,\n    multiselect,\n    defaultSelected,\n    selected,\n    onSelectionChange,\n    defaultValue,\n    value,\n  });\n\n  const {\n    activeState,\n    setActive,\n    openState,\n    setOpen,\n    openKey,\n    getOptionAtIndex,\n    getIndexOfOption,\n    getOptionsMatching,\n    getOptionFromSearch,\n    options,\n    selectedState,\n    select,\n    valueState,\n    setFocusVisibleState,\n    focusedState,\n    setFocusedState,\n    listRef,\n  } = listControl;\n\n  const { Component: FloatingComponent } = useFloatingComponent();\n\n  const handleOpenChange: UseFloatingUIProps[\"onOpenChange\"] = (\n    newOpen,\n    _event,\n    reason\n  ) => {\n    const focusNotBlur = reason === \"focus\" && newOpen;\n    if (readOnly || focusNotBlur) return;\n    setOpen(newOpen);\n  };\n\n  const { x, y, strategy, elements, floating, reference, context } =\n    useFloatingUI({\n      open: openState && !readOnly && children != undefined,\n      onOpenChange: handleOpenChange,\n      placement: \"bottom-start\",\n      middleware: [\n        size({\n          apply({ rects, elements, availableHeight }) {\n            Object.assign(elements.floating.style, {\n              minWidth: `${rects.reference.width}px`,\n              maxHeight: `max(calc((var(--salt-size-base) + var(--salt-spacing-100)) * 5), calc(${availableHeight}px - var(--salt-spacing-100)))`,\n            });\n          },\n        }),\n        flip({ fallbackStrategy: \"initialPlacement\" }),\n      ],\n    });\n\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    useDismiss(context),\n    useFocus(context),\n    useClick(context),\n  ]);\n\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const handleTriggerRef = useForkRef<HTMLButtonElement>(reference, buttonRef);\n  const handleButtonRef = useForkRef(handleTriggerRef, ref);\n\n  const typeaheadString = useRef(\"\");\n  const typeaheadTimeout = useRef<number | undefined>();\n\n  const handleTypeahead = (event: KeyboardEvent<HTMLButtonElement>) => {\n    if (typeaheadTimeout.current) {\n      clearTimeout(typeaheadTimeout.current);\n    }\n    typeaheadString.current += event.key;\n    typeaheadTimeout.current = window.setTimeout(() => {\n      typeaheadString.current = \"\";\n    }, 500);\n\n    if (!openState) {\n      setOpen(true, \"input\");\n    }\n\n    let newOption = getOptionFromSearch(typeaheadString.current, activeState);\n\n    if (!newOption) {\n      newOption = getOptionFromSearch(typeaheadString.current);\n    }\n\n    if (newOption) {\n      setActive(newOption);\n      setFocusVisibleState(true);\n    }\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n    const currentIndex = activeState ? getIndexOfOption(activeState) : -1;\n    const count = options.length - 1;\n\n    if (readOnly) {\n      return;\n    }\n\n    if (!openState) {\n      if (event.key === \"ArrowDown\" || event.key === \"ArrowUp\") {\n        setOpen(true, undefined, event.key);\n        return;\n      }\n    }\n\n    if (\n      event.key.length === 1 &&\n      !event.ctrlKey &&\n      !event.metaKey &&\n      !event.altKey\n    ) {\n      event.preventDefault();\n      event.stopPropagation();\n      handleTypeahead(event);\n    }\n\n    let newActive;\n    switch (event.key) {\n      case \"ArrowDown\":\n        newActive = getOptionAtIndex(Math.min(count, currentIndex + 1));\n        break;\n      case \"ArrowUp\":\n        newActive = getOptionAtIndex(Math.max(0, currentIndex - 1));\n        break;\n      case \"Home\":\n        newActive = getOptionAtIndex(0);\n        break;\n      case \"End\":\n        newActive = getOptionAtIndex(count);\n        break;\n      case \"PageUp\":\n        newActive = getOptionAtIndex(Math.max(0, currentIndex - 10));\n        break;\n      case \"PageDown\":\n        newActive = getOptionAtIndex(Math.min(count, currentIndex + 10));\n        break;\n      case \"Enter\":\n      case \" \":\n        if (\n          (openState && Boolean(activeState?.disabled)) ||\n          (typeaheadString.current.trim().length > 0 && event.key === \" \")\n        ) {\n          event.preventDefault();\n          return;\n        }\n\n        if (!openState || !activeState) {\n          return;\n        }\n\n        event.preventDefault();\n        select(event, activeState);\n\n        break;\n      case \"Tab\":\n        if (!multiselect && activeState) {\n          select(event, activeState);\n        }\n        break;\n    }\n\n    if (newActive && newActive?.id != activeState?.id) {\n      event.preventDefault();\n      setActive(newActive);\n      setFocusVisibleState(true);\n    }\n\n    onKeyDown?.(event);\n  };\n\n  const handleFocus = (event: FocusEvent<HTMLButtonElement>) => {\n    setFocusedState(true);\n    onFocus?.(event);\n  };\n\n  const handleBlur = (event: FocusEvent<HTMLButtonElement>) => {\n    setFocusedState(false);\n    onBlur?.(event);\n  };\n\n  const handleListMouseOver = () => {\n    setFocusVisibleState(false);\n  };\n\n  const handleFocusButton = () => {\n    buttonRef.current?.focus();\n  };\n\n  useEffect(() => {\n    // We check the active index because the active item may have been removed\n    const activeIndex = activeState ? getIndexOfOption(activeState) : -1;\n    let newActive = undefined;\n\n    // If the active item is still in the list, we don't need to do anything\n    if (activeIndex > 0) {\n      return;\n    }\n\n    // If the list is closed we should clear the active item\n    if (!openState) {\n      setActive(undefined);\n      return;\n    }\n\n    // If we have selected an item, we should make that the active item\n    if (selectedState.length > 0) {\n      newActive = getOptionsMatching(\n        (option) => option.value === selectedState[0]\n      ).pop();\n    }\n\n    // If we still don't have an active item, we should check if the list has been opened with the keyboard\n    if (!newActive) {\n      if (openKey.current === \"ArrowDown\") {\n        newActive = getOptionAtIndex(0);\n      } else if (openKey.current === \"ArrowUp\") {\n        newActive = getOptionAtIndex(options.length - 1);\n      }\n    }\n\n    // If we still don't have an active item, we should just select the first item\n    if (!newActive) {\n      newActive = getOptionAtIndex(0);\n    }\n\n    setActive(newActive);\n  }, [openState, children]);\n\n  const listId = useId();\n\n  return (\n    <ListControlContext.Provider value={listControl}>\n      <button\n        className={clsx(\n          withBaseName(),\n          withBaseName(variant),\n          {\n            [withBaseName(\"disabled\")]: disabled,\n            [withBaseName(validationStatus ?? \"\")]: validationStatus,\n          },\n          className\n        )}\n        ref={handleButtonRef}\n        role=\"combobox\"\n        type=\"button\"\n        disabled={disabled}\n        aria-readonly={readOnly ? \"true\" : undefined}\n        aria-required={required ? \"true\" : undefined}\n        aria-expanded={openState}\n        aria-activedescendant={activeState?.id}\n        aria-labelledby={clsx(formFieldLabelledBy, ariaLabelledBy) || undefined}\n        aria-describedby={\n          clsx(formFieldDescribedBy, ariaDescribedBy) || undefined\n        }\n        aria-multiselectable={multiselect}\n        aria-controls={openState ? listId : undefined}\n        {...getReferenceProps({\n          onKeyDown: handleKeyDown,\n          onFocus: handleFocus,\n          onBlur: handleBlur,\n          ...rest,\n        })}\n      >\n        {startAdornment}\n        <span\n          className={clsx(withBaseName(\"content\"), {\n            [withBaseName(\"placeholder\")]: !valueState,\n          })}\n        >\n          {!valueState ? placeholder : valueState}\n        </span>\n        {validationStatus && <StatusAdornment status={validationStatus} />}\n        {!readOnly && <ExpandIcon open={openState} />}\n      </button>\n      <FloatingComponent\n        open={(openState || focusedState) && !readOnly && children != undefined}\n        {...getFloatingProps()}\n        left={x ?? 0}\n        top={y ?? 0}\n        position={strategy}\n        width={elements.floating?.offsetWidth}\n        height={elements.floating?.offsetHeight}\n        ref={floating}\n      >\n        <OptionList\n          id={listId}\n          collapsed={!openState}\n          onMouseOver={handleListMouseOver}\n          onFocus={handleFocusButton}\n          onClick={handleFocusButton}\n          ref={listRef}\n        >\n          {children}\n        </OptionList>\n      </FloatingComponent>\n    </ListControlContext.Provider>\n  );\n}) as <Item = string>(\n  props: DropdownNextProps<Item> & { ref?: Ref<HTMLButtonElement> }\n) => JSX.Element;\n"],"names":["jsx","ChevronUpIcon","ChevronDownIcon","makePrefixer","forwardRef","DropdownNext","useWindow","useComponentCssInjection","dropdownCss","useFormFieldProps","useListControl","useFloatingComponent","useFloatingUI","size","elements","flip","useInteractions","useDismiss","useFocus","useClick","useRef","useForkRef","_a","useEffect","useId","jsxs","ListControlContext","clsx","StatusAdornment","OptionList"],"mappings":"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"}
+{"version":3,"file":"DropdownNext.js","sources":["../src/dropdown-next/DropdownNext.tsx"],"sourcesContent":["import {\n  ComponentPropsWithoutRef,\n  forwardRef,\n  ReactNode,\n  KeyboardEvent,\n  useEffect,\n  FocusEvent,\n  useRef,\n  ForwardedRef,\n  Ref,\n} from \"react\";\nimport {\n  ListControlProps,\n  useListControl,\n  defaultValueToString,\n} from \"../list-control/ListControlState\";\nimport { ChevronDownIcon, ChevronUpIcon } from \"@salt-ds/icons\";\nimport {\n  makePrefixer,\n  StatusAdornment,\n  useFloatingComponent,\n  useFloatingUI,\n  UseFloatingUIProps,\n  useForkRef,\n  useFormFieldProps,\n  useId,\n  ValidationStatus,\n} from \"@salt-ds/core\";\nimport {\n  flip,\n  size,\n  useClick,\n  useDismiss,\n  useFocus,\n  useInteractions,\n} from \"@floating-ui/react\";\nimport { clsx } from \"clsx\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport dropdownCss from \"./DropdownNext.css\";\nimport { ListControlContext } from \"../list-control/ListControlContext\";\nimport { OptionList } from \"../option/OptionList\";\n\nexport type DropdownNextProps<Item = string> = {\n  /**\n   * If `true`, the dropdown will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * If `true`, the dropdown will be read-only.\n   */\n  readOnly?: boolean;\n  /**\n   * The options to display in the dropdown.\n   */\n  children?: ReactNode;\n  /**\n   * The marker to use in an empty read only dropdown.\n   * Use `''` to disable this feature. Defaults to '—'.\n   */\n  emptyReadOnlyMarker?: string;\n  /**\n   * If `true`, the dropdown will be multiselect.\n   */\n  multiselect?: boolean;\n  /**\n   * The text shown when the dropdown has no value.\n   */\n  placeholder?: string;\n  /**\n   * If `true`, the dropdown will be required.\n   */\n  required?: boolean;\n  /**\n   * Start adornment component\n   */\n  startAdornment?: ReactNode;\n  /**\n   * Styling variant. Defaults to \"primary\".\n   */\n  variant?: \"primary\" | \"secondary\";\n  /**\n   * The content of the dropdown shown in the button. The component will be controlled if this prop is provided.\n   */\n  value?: string;\n  /**\n   * Validation status, one of \"error\" | \"warning\" | \"success\".\n   */\n  validationStatus?: Exclude<ValidationStatus, \"info\">;\n} & Omit<ComponentPropsWithoutRef<\"button\">, \"value\" | \"defaultValue\"> &\n  ListControlProps<Item>;\n\nfunction ExpandIcon({ open }: { open: boolean }) {\n  return open ? <ChevronUpIcon aria-hidden /> : <ChevronDownIcon aria-hidden />;\n}\n\nconst withBaseName = makePrefixer(\"saltDropdownNext\");\n\nexport const DropdownNext = forwardRef(function DropdownNext<Item>(\n  props: DropdownNextProps<Item>,\n  ref: ForwardedRef<HTMLButtonElement>\n) {\n  const {\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-describedby\": ariaDescribedBy,\n    children,\n    className,\n    disabled: disabledProp,\n    emptyReadOnlyMarker = \"—\",\n    readOnly: readOnlyProp,\n    multiselect,\n    onSelectionChange,\n    selected,\n    defaultSelected,\n    defaultOpen,\n    value,\n    onOpenChange,\n    open,\n    placeholder,\n    startAdornment,\n    required: requiredProp,\n    variant = \"primary\",\n    validationStatus: validationStatusProp,\n    onKeyDown,\n    onFocus,\n    onBlur,\n    valueToString = defaultValueToString,\n    ...rest\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-DropdownNext\",\n    css: dropdownCss,\n    window: targetWindow,\n  });\n\n  const {\n    a11yProps: {\n      \"aria-describedby\": formFieldDescribedBy,\n      \"aria-labelledby\": formFieldLabelledBy,\n    } = {},\n    disabled: formFieldDisabled,\n    readOnly: formFieldReadOnly,\n    necessity: formFieldRequired,\n    validationStatus: formFieldValidationStatus,\n  } = useFormFieldProps();\n\n  const disabled = Boolean(disabledProp) || formFieldDisabled;\n  const readOnly = Boolean(readOnlyProp) || formFieldReadOnly;\n  const validationStatus = validationStatusProp ?? formFieldValidationStatus;\n  const required = formFieldRequired\n    ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n    : undefined ?? requiredProp;\n  const listControl = useListControl<Item>({\n    open,\n    defaultOpen,\n    onOpenChange,\n    multiselect,\n    defaultSelected,\n    selected,\n    onSelectionChange,\n    valueToString,\n  });\n\n  const {\n    activeState,\n    setActive,\n    openState,\n    setOpen,\n    openKey,\n    getOptionAtIndex,\n    getIndexOfOption,\n    getOptionsMatching,\n    getOptionFromSearch,\n    options,\n    selectedState,\n    select,\n    setFocusVisibleState,\n    focusedState,\n    setFocusedState,\n    listRef,\n  } = listControl;\n\n  const selectedValue = selectedState\n    .map((item) => valueToString(item))\n    .join(\", \");\n  const isEmptyReadOnly = readOnly && selectedValue === \"\";\n  const valueText = isEmptyReadOnly\n    ? emptyReadOnlyMarker\n    : value ?? selectedValue;\n\n  const { Component: FloatingComponent } = useFloatingComponent();\n\n  const handleOpenChange: UseFloatingUIProps[\"onOpenChange\"] = (\n    newOpen,\n    _event,\n    reason\n  ) => {\n    const focusNotBlur = reason === \"focus\" && newOpen;\n    if (readOnly || focusNotBlur) return;\n    setOpen(newOpen);\n  };\n\n  const { x, y, strategy, elements, floating, reference, context } =\n    useFloatingUI({\n      open: openState && !readOnly && children != undefined,\n      onOpenChange: handleOpenChange,\n      placement: \"bottom-start\",\n      middleware: [\n        size({\n          apply({ rects, elements, availableHeight }) {\n            Object.assign(elements.floating.style, {\n              minWidth: `${rects.reference.width}px`,\n              maxHeight: `max(calc((var(--salt-size-base) + var(--salt-spacing-100)) * 5), calc(${availableHeight}px - var(--salt-spacing-100)))`,\n            });\n          },\n        }),\n        flip({ fallbackStrategy: \"initialPlacement\" }),\n      ],\n    });\n\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    useDismiss(context),\n    useFocus(context),\n    useClick(context),\n  ]);\n\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const handleTriggerRef = useForkRef<HTMLButtonElement>(reference, buttonRef);\n  const handleButtonRef = useForkRef(handleTriggerRef, ref);\n\n  const typeaheadString = useRef(\"\");\n  const typeaheadTimeout = useRef<number | undefined>();\n\n  const handleTypeahead = (event: KeyboardEvent<HTMLButtonElement>) => {\n    if (typeaheadTimeout.current) {\n      clearTimeout(typeaheadTimeout.current);\n    }\n    typeaheadString.current += event.key;\n    typeaheadTimeout.current = window.setTimeout(() => {\n      typeaheadString.current = \"\";\n    }, 500);\n\n    if (!openState) {\n      setOpen(true, \"input\");\n    }\n\n    let newOption = getOptionFromSearch(typeaheadString.current, activeState);\n\n    if (!newOption) {\n      newOption = getOptionFromSearch(typeaheadString.current);\n    }\n\n    if (newOption) {\n      setActive(newOption);\n      setFocusVisibleState(true);\n    }\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n    const currentIndex = activeState ? getIndexOfOption(activeState) : -1;\n    const count = options.length - 1;\n\n    if (readOnly) {\n      return;\n    }\n\n    if (!openState) {\n      if (event.key === \"ArrowDown\" || event.key === \"ArrowUp\") {\n        setOpen(true, undefined, event.key);\n        return;\n      }\n    }\n\n    if (\n      event.key.length === 1 &&\n      !event.ctrlKey &&\n      !event.metaKey &&\n      !event.altKey\n    ) {\n      event.preventDefault();\n      event.stopPropagation();\n      handleTypeahead(event);\n    }\n\n    let newActive;\n    switch (event.key) {\n      case \"ArrowDown\":\n        newActive = getOptionAtIndex(Math.min(count, currentIndex + 1));\n        break;\n      case \"ArrowUp\":\n        newActive = getOptionAtIndex(Math.max(0, currentIndex - 1));\n        break;\n      case \"Home\":\n        newActive = getOptionAtIndex(0);\n        break;\n      case \"End\":\n        newActive = getOptionAtIndex(count);\n        break;\n      case \"PageUp\":\n        newActive = getOptionAtIndex(Math.max(0, currentIndex - 10));\n        break;\n      case \"PageDown\":\n        newActive = getOptionAtIndex(Math.min(count, currentIndex + 10));\n        break;\n      case \"Enter\":\n      case \" \":\n        if (\n          (openState && Boolean(activeState?.disabled)) ||\n          (typeaheadString.current.trim().length > 0 && event.key === \" \")\n        ) {\n          event.preventDefault();\n          return;\n        }\n\n        if (!openState || !activeState) {\n          return;\n        }\n\n        event.preventDefault();\n        select(event, activeState);\n\n        break;\n      case \"Tab\":\n        if (!multiselect && activeState) {\n          select(event, activeState);\n        }\n        break;\n    }\n\n    if (newActive && newActive?.id != activeState?.id) {\n      event.preventDefault();\n      setActive(newActive);\n      setFocusVisibleState(true);\n    }\n\n    onKeyDown?.(event);\n  };\n\n  const handleFocus = (event: FocusEvent<HTMLButtonElement>) => {\n    setFocusedState(true);\n    onFocus?.(event);\n  };\n\n  const handleBlur = (event: FocusEvent<HTMLButtonElement>) => {\n    setFocusedState(false);\n    onBlur?.(event);\n  };\n\n  const handleListMouseOver = () => {\n    setFocusVisibleState(false);\n  };\n\n  const handleFocusButton = () => {\n    buttonRef.current?.focus();\n  };\n\n  useEffect(() => {\n    // We check the active index because the active item may have been removed\n    const activeIndex = activeState ? getIndexOfOption(activeState) : -1;\n    let newActive = undefined;\n\n    // If the active item is still in the list, we don't need to do anything\n    if (activeIndex > 0) {\n      return;\n    }\n\n    // If the list is closed we should clear the active item\n    if (!openState) {\n      setActive(undefined);\n      return;\n    }\n\n    // If we have selected an item, we should make that the active item\n    if (selectedState.length > 0) {\n      newActive = getOptionsMatching(\n        (option) => option.value === selectedState[0]\n      ).pop();\n    }\n\n    // If we still don't have an active item, we should check if the list has been opened with the keyboard\n    if (!newActive) {\n      if (openKey.current === \"ArrowDown\") {\n        newActive = getOptionAtIndex(0);\n      } else if (openKey.current === \"ArrowUp\") {\n        newActive = getOptionAtIndex(options.length - 1);\n      }\n    }\n\n    // If we still don't have an active item, we should just select the first item\n    if (!newActive) {\n      newActive = getOptionAtIndex(0);\n    }\n\n    setActive(newActive);\n  }, [openState, children]);\n\n  const listId = useId();\n\n  return (\n    <ListControlContext.Provider value={listControl}>\n      <button\n        className={clsx(\n          withBaseName(),\n          withBaseName(variant),\n          {\n            [withBaseName(\"disabled\")]: disabled,\n            [withBaseName(validationStatus ?? \"\")]: validationStatus,\n          },\n          className\n        )}\n        ref={handleButtonRef}\n        role=\"combobox\"\n        type=\"button\"\n        disabled={disabled}\n        aria-readonly={readOnly ? \"true\" : undefined}\n        aria-required={required ? \"true\" : undefined}\n        aria-expanded={openState}\n        aria-activedescendant={activeState?.id}\n        aria-labelledby={clsx(formFieldLabelledBy, ariaLabelledBy) || undefined}\n        aria-describedby={\n          clsx(formFieldDescribedBy, ariaDescribedBy) || undefined\n        }\n        aria-multiselectable={multiselect}\n        aria-controls={openState ? listId : undefined}\n        {...getReferenceProps({\n          onKeyDown: handleKeyDown,\n          onFocus: handleFocus,\n          onBlur: handleBlur,\n          ...rest,\n        })}\n      >\n        {startAdornment}\n        <span\n          className={clsx(withBaseName(\"content\"), {\n            [withBaseName(\"placeholder\")]: !valueText,\n          })}\n        >\n          {!valueText ? placeholder : valueText}\n        </span>\n        {validationStatus && <StatusAdornment status={validationStatus} />}\n        {!readOnly && <ExpandIcon open={openState} />}\n      </button>\n      <FloatingComponent\n        open={(openState || focusedState) && !readOnly && children != undefined}\n        {...getFloatingProps()}\n        left={x ?? 0}\n        top={y ?? 0}\n        position={strategy}\n        width={elements.floating?.offsetWidth}\n        height={elements.floating?.offsetHeight}\n        ref={floating}\n      >\n        <OptionList\n          id={listId}\n          collapsed={!openState}\n          onMouseOver={handleListMouseOver}\n          onFocus={handleFocusButton}\n          onClick={handleFocusButton}\n          ref={listRef}\n        >\n          {children}\n        </OptionList>\n      </FloatingComponent>\n    </ListControlContext.Provider>\n  );\n}) as <Item = string>(\n  props: DropdownNextProps<Item> & { ref?: Ref<HTMLButtonElement> }\n) => JSX.Element;\n"],"names":["jsx","ChevronUpIcon","ChevronDownIcon","makePrefixer","forwardRef","DropdownNext","defaultValueToString","useWindow","useComponentCssInjection","dropdownCss","useFormFieldProps","useListControl","useFloatingComponent","useFloatingUI","size","elements","flip","useInteractions","useDismiss","useFocus","useClick","useRef","useForkRef","_a","useEffect","useId","jsxs","ListControlContext","clsx","StatusAdornment","OptionList"],"mappings":";;;;;;;;;;;;;;;;;AA4FA,SAAS,UAAA,CAAW,EAAE,IAAA,EAA2B,EAAA;AAC/C,EAAA,OAAO,uBAAQA,cAAA,CAAAC,mBAAA,EAAA;AAAA,IAAc,aAAW,EAAA,IAAA;AAAA,GAAC,oBAAMD,cAAA,CAAAE,qBAAA,EAAA;AAAA,IAAgB,aAAW,EAAA,IAAA;AAAA,GAAC,CAAA,CAAA;AAC7E,CAAA;AAEA,MAAM,YAAA,GAAeC,kBAAa,kBAAkB,CAAA,CAAA;AAE7C,MAAM,YAAe,GAAAC,gBAAA,CAAW,SAASC,aAAAA,CAC9C,OACA,GACA,EAAA;AArGF,EAAA,IAAA,EAAA,EAAA,EAAA,CAAA;AAsGE,EAAM,MAAA;AAAA,IACJ,iBAAmB,EAAA,cAAA;AAAA,IACnB,kBAAoB,EAAA,eAAA;AAAA,IACpB,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAU,EAAA,YAAA;AAAA,IACV,mBAAsB,GAAA,QAAA;AAAA,IACtB,QAAU,EAAA,YAAA;AAAA,IACV,WAAA;AAAA,IACA,iBAAA;AAAA,IACA,QAAA;AAAA,IACA,eAAA;AAAA,IACA,WAAA;AAAA,IACA,KAAA;AAAA,IACA,YAAA;AAAA,IACA,IAAA;AAAA,IACA,WAAA;AAAA,IACA,cAAA;AAAA,IACA,QAAU,EAAA,YAAA;AAAA,IACV,OAAU,GAAA,SAAA;AAAA,IACV,gBAAkB,EAAA,oBAAA;AAAA,IAClB,SAAA;AAAA,IACA,OAAA;AAAA,IACA,MAAA;AAAA,IACA,aAAgB,GAAAC,qCAAA;AAAA,IACb,GAAA,IAAA;AAAA,GACD,GAAA,KAAA,CAAA;AAEJ,EAAA,MAAM,eAAeC,kBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAAC,cAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA;AAAA,IACJ,SAAW,EAAA;AAAA,MACT,kBAAoB,EAAA,oBAAA;AAAA,MACpB,iBAAmB,EAAA,mBAAA;AAAA,QACjB,EAAC;AAAA,IACL,QAAU,EAAA,iBAAA;AAAA,IACV,QAAU,EAAA,iBAAA;AAAA,IACV,SAAW,EAAA,iBAAA;AAAA,IACX,gBAAkB,EAAA,yBAAA;AAAA,MAChBC,sBAAkB,EAAA,CAAA;AAEtB,EAAM,MAAA,QAAA,GAAW,OAAQ,CAAA,YAAY,CAAK,IAAA,iBAAA,CAAA;AAC1C,EAAM,MAAA,QAAA,GAAW,OAAQ,CAAA,YAAY,CAAK,IAAA,iBAAA,CAAA;AAC1C,EAAA,MAAM,mBAAmB,oBAAwB,IAAA,IAAA,GAAA,oBAAA,GAAA,yBAAA,CAAA;AACjD,EAAM,MAAA,QAAA,GAAW,oBACb,CAAC,UAAA,EAAY,UAAU,CAAE,CAAA,QAAA,CAAS,iBAAiB,CACtC,GAAA,YAAA,CAAA;AACjB,EAAA,MAAM,cAAcC,+BAAqB,CAAA;AAAA,IACvC,IAAA;AAAA,IACA,WAAA;AAAA,IACA,YAAA;AAAA,IACA,WAAA;AAAA,IACA,eAAA;AAAA,IACA,QAAA;AAAA,IACA,iBAAA;AAAA,IACA,aAAA;AAAA,GACD,CAAA,CAAA;AAED,EAAM,MAAA;AAAA,IACJ,WAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACA,gBAAA;AAAA,IACA,gBAAA;AAAA,IACA,kBAAA;AAAA,IACA,mBAAA;AAAA,IACA,OAAA;AAAA,IACA,aAAA;AAAA,IACA,MAAA;AAAA,IACA,oBAAA;AAAA,IACA,YAAA;AAAA,IACA,eAAA;AAAA,IACA,OAAA;AAAA,GACE,GAAA,WAAA,CAAA;AAEJ,EAAM,MAAA,aAAA,GAAgB,aACnB,CAAA,GAAA,CAAI,CAAC,IAAA,KAAS,cAAc,IAAI,CAAC,CACjC,CAAA,IAAA,CAAK,IAAI,CAAA,CAAA;AACZ,EAAM,MAAA,eAAA,GAAkB,YAAY,aAAkB,KAAA,EAAA,CAAA;AACtD,EAAM,MAAA,SAAA,GAAY,eACd,GAAA,mBAAA,GACA,KAAS,IAAA,IAAA,GAAA,KAAA,GAAA,aAAA,CAAA;AAEb,EAAA,MAAM,EAAE,SAAA,EAAW,iBAAkB,EAAA,GAAIC,yBAAqB,EAAA,CAAA;AAE9D,EAAA,MAAM,gBAAuD,GAAA,CAC3D,OACA,EAAA,MAAA,EACA,MACG,KAAA;AACH,IAAM,MAAA,YAAA,GAAe,WAAW,OAAW,IAAA,OAAA,CAAA;AAC3C,IAAA,IAAI,QAAY,IAAA,YAAA;AAAc,MAAA,OAAA;AAC9B,IAAA,OAAA,CAAQ,OAAO,CAAA,CAAA;AAAA,GACjB,CAAA;AAEA,EAAM,MAAA,EAAE,GAAG,CAAG,EAAA,QAAA,EAAU,UAAU,QAAU,EAAA,SAAA,EAAW,OAAQ,EAAA,GAC7DC,kBAAc,CAAA;AAAA,IACZ,IAAM,EAAA,SAAA,IAAa,CAAC,QAAA,IAAY,QAAY,IAAA,KAAA,CAAA;AAAA,IAC5C,YAAc,EAAA,gBAAA;AAAA,IACd,SAAW,EAAA,cAAA;AAAA,IACX,UAAY,EAAA;AAAA,MACVC,UAAK,CAAA;AAAA,QACH,MAAM,EAAE,KAAA,EAAO,QAAAC,EAAAA,SAAAA,EAAU,iBAAmB,EAAA;AAC1C,UAAO,MAAA,CAAA,MAAA,CAAOA,SAAS,CAAA,QAAA,CAAS,KAAO,EAAA;AAAA,YACrC,QAAA,EAAU,CAAG,EAAA,KAAA,CAAM,SAAU,CAAA,KAAA,CAAA,EAAA,CAAA;AAAA,YAC7B,WAAW,CAAyE,sEAAA,EAAA,eAAA,CAAA,8BAAA,CAAA;AAAA,WACrF,CAAA,CAAA;AAAA,SACH;AAAA,OACD,CAAA;AAAA,MACDC,UAAK,CAAA,EAAE,gBAAkB,EAAA,kBAAA,EAAoB,CAAA;AAAA,KAC/C;AAAA,GACD,CAAA,CAAA;AAEH,EAAA,MAAM,EAAE,iBAAA,EAAmB,gBAAiB,EAAA,GAAIC,qBAAgB,CAAA;AAAA,IAC9DC,iBAAW,OAAO,CAAA;AAAA,IAClBC,eAAS,OAAO,CAAA;AAAA,IAChBC,eAAS,OAAO,CAAA;AAAA,GACjB,CAAA,CAAA;AAED,EAAM,MAAA,SAAA,GAAYC,aAA0B,IAAI,CAAA,CAAA;AAChD,EAAM,MAAA,gBAAA,GAAmBC,eAA8B,CAAA,SAAA,EAAW,SAAS,CAAA,CAAA;AAC3E,EAAM,MAAA,eAAA,GAAkBA,eAAW,CAAA,gBAAA,EAAkB,GAAG,CAAA,CAAA;AAExD,EAAM,MAAA,eAAA,GAAkBD,aAAO,EAAE,CAAA,CAAA;AACjC,EAAA,MAAM,mBAAmBA,YAA2B,EAAA,CAAA;AAEpD,EAAM,MAAA,eAAA,GAAkB,CAAC,KAA4C,KAAA;AACnE,IAAA,IAAI,iBAAiB,OAAS,EAAA;AAC5B,MAAA,YAAA,CAAa,iBAAiB,OAAO,CAAA,CAAA;AAAA,KACvC;AACA,IAAA,eAAA,CAAgB,WAAW,KAAM,CAAA,GAAA,CAAA;AACjC,IAAiB,gBAAA,CAAA,OAAA,GAAU,MAAO,CAAA,UAAA,CAAW,MAAM;AACjD,MAAA,eAAA,CAAgB,OAAU,GAAA,EAAA,CAAA;AAAA,OACzB,GAAG,CAAA,CAAA;AAEN,IAAA,IAAI,CAAC,SAAW,EAAA;AACd,MAAA,OAAA,CAAQ,MAAM,OAAO,CAAA,CAAA;AAAA,KACvB;AAEA,IAAA,IAAI,SAAY,GAAA,mBAAA,CAAoB,eAAgB,CAAA,OAAA,EAAS,WAAW,CAAA,CAAA;AAExE,IAAA,IAAI,CAAC,SAAW,EAAA;AACd,MAAY,SAAA,GAAA,mBAAA,CAAoB,gBAAgB,OAAO,CAAA,CAAA;AAAA,KACzD;AAEA,IAAA,IAAI,SAAW,EAAA;AACb,MAAA,SAAA,CAAU,SAAS,CAAA,CAAA;AACnB,MAAA,oBAAA,CAAqB,IAAI,CAAA,CAAA;AAAA,KAC3B;AAAA,GACF,CAAA;AAEA,EAAM,MAAA,aAAA,GAAgB,CAAC,KAA4C,KAAA;AACjE,IAAA,MAAM,YAAe,GAAA,WAAA,GAAc,gBAAiB,CAAA,WAAW,CAAI,GAAA,CAAA,CAAA,CAAA;AACnE,IAAM,MAAA,KAAA,GAAQ,QAAQ,MAAS,GAAA,CAAA,CAAA;AAE/B,IAAA,IAAI,QAAU,EAAA;AACZ,MAAA,OAAA;AAAA,KACF;AAEA,IAAA,IAAI,CAAC,SAAW,EAAA;AACd,MAAA,IAAI,KAAM,CAAA,GAAA,KAAQ,WAAe,IAAA,KAAA,CAAM,QAAQ,SAAW,EAAA;AACxD,QAAQ,OAAA,CAAA,IAAA,EAAM,KAAW,CAAA,EAAA,KAAA,CAAM,GAAG,CAAA,CAAA;AAClC,QAAA,OAAA;AAAA,OACF;AAAA,KACF;AAEA,IAAA,IACE,KAAM,CAAA,GAAA,CAAI,MAAW,KAAA,CAAA,IACrB,CAAC,KAAA,CAAM,OACP,IAAA,CAAC,KAAM,CAAA,OAAA,IACP,CAAC,KAAA,CAAM,MACP,EAAA;AACA,MAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,MAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AACtB,MAAA,eAAA,CAAgB,KAAK,CAAA,CAAA;AAAA,KACvB;AAEA,IAAI,IAAA,SAAA,CAAA;AACJ,IAAA,QAAQ,KAAM,CAAA,GAAA;AAAA,MACP,KAAA,WAAA;AACH,QAAA,SAAA,GAAY,iBAAiB,IAAK,CAAA,GAAA,CAAI,KAAO,EAAA,YAAA,GAAe,CAAC,CAAC,CAAA,CAAA;AAC9D,QAAA,MAAA;AAAA,MACG,KAAA,SAAA;AACH,QAAA,SAAA,GAAY,iBAAiB,IAAK,CAAA,GAAA,CAAI,CAAG,EAAA,YAAA,GAAe,CAAC,CAAC,CAAA,CAAA;AAC1D,QAAA,MAAA;AAAA,MACG,KAAA,MAAA;AACH,QAAA,SAAA,GAAY,iBAAiB,CAAC,CAAA,CAAA;AAC9B,QAAA,MAAA;AAAA,MACG,KAAA,KAAA;AACH,QAAA,SAAA,GAAY,iBAAiB,KAAK,CAAA,CAAA;AAClC,QAAA,MAAA;AAAA,MACG,KAAA,QAAA;AACH,QAAA,SAAA,GAAY,iBAAiB,IAAK,CAAA,GAAA,CAAI,CAAG,EAAA,YAAA,GAAe,EAAE,CAAC,CAAA,CAAA;AAC3D,QAAA,MAAA;AAAA,MACG,KAAA,UAAA;AACH,QAAA,SAAA,GAAY,iBAAiB,IAAK,CAAA,GAAA,CAAI,KAAO,EAAA,YAAA,GAAe,EAAE,CAAC,CAAA,CAAA;AAC/D,QAAA,MAAA;AAAA,MACG,KAAA,OAAA,CAAA;AAAA,MACA,KAAA,GAAA;AACH,QAAA,IACG,SAAa,IAAA,OAAA,CAAQ,WAAa,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,WAAA,CAAA,QAAQ,CAC1C,IAAA,eAAA,CAAgB,OAAQ,CAAA,IAAA,EAAO,CAAA,MAAA,GAAS,CAAK,IAAA,KAAA,CAAM,QAAQ,GAC5D,EAAA;AACA,UAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,UAAA,OAAA;AAAA,SACF;AAEA,QAAI,IAAA,CAAC,SAAa,IAAA,CAAC,WAAa,EAAA;AAC9B,UAAA,OAAA;AAAA,SACF;AAEA,QAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,QAAA,MAAA,CAAO,OAAO,WAAW,CAAA,CAAA;AAEzB,QAAA,MAAA;AAAA,MACG,KAAA,KAAA;AACH,QAAI,IAAA,CAAC,eAAe,WAAa,EAAA;AAC/B,UAAA,MAAA,CAAO,OAAO,WAAW,CAAA,CAAA;AAAA,SAC3B;AACA,QAAA,MAAA;AAAA,KAAA;AAGJ,IAAA,IAAI,SAAa,IAAA,CAAA,SAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAW,EAAM,MAAA,WAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,WAAA,CAAa,EAAI,CAAA,EAAA;AACjD,MAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,MAAA,SAAA,CAAU,SAAS,CAAA,CAAA;AACnB,MAAA,oBAAA,CAAqB,IAAI,CAAA,CAAA;AAAA,KAC3B;AAEA,IAAY,SAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACd,CAAA;AAEA,EAAM,MAAA,WAAA,GAAc,CAAC,KAAyC,KAAA;AAC5D,IAAA,eAAA,CAAgB,IAAI,CAAA,CAAA;AACpB,IAAU,OAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACZ,CAAA;AAEA,EAAM,MAAA,UAAA,GAAa,CAAC,KAAyC,KAAA;AAC3D,IAAA,eAAA,CAAgB,KAAK,CAAA,CAAA;AACrB,IAAS,MAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,MAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACX,CAAA;AAEA,EAAA,MAAM,sBAAsB,MAAM;AAChC,IAAA,oBAAA,CAAqB,KAAK,CAAA,CAAA;AAAA,GAC5B,CAAA;AAEA,EAAA,MAAM,oBAAoB,MAAM;AAlWlC,IAAAE,IAAAA,GAAAA,CAAAA;AAmWI,IAAA,CAAAA,GAAA,GAAA,SAAA,CAAU,OAAV,KAAA,IAAA,GAAA,KAAA,CAAA,GAAAA,GAAmB,CAAA,KAAA,EAAA,CAAA;AAAA,GACrB,CAAA;AAEA,EAAAC,eAAA,CAAU,MAAM;AAEd,IAAA,MAAM,WAAc,GAAA,WAAA,GAAc,gBAAiB,CAAA,WAAW,CAAI,GAAA,CAAA,CAAA,CAAA;AAClE,IAAA,IAAI,SAAY,GAAA,KAAA,CAAA,CAAA;AAGhB,IAAA,IAAI,cAAc,CAAG,EAAA;AACnB,MAAA,OAAA;AAAA,KACF;AAGA,IAAA,IAAI,CAAC,SAAW,EAAA;AACd,MAAA,SAAA,CAAU,KAAS,CAAA,CAAA,CAAA;AACnB,MAAA,OAAA;AAAA,KACF;AAGA,IAAI,IAAA,aAAA,CAAc,SAAS,CAAG,EAAA;AAC5B,MAAY,SAAA,GAAA,kBAAA;AAAA,QACV,CAAC,MAAA,KAAW,MAAO,CAAA,KAAA,KAAU,aAAc,CAAA,CAAA,CAAA;AAAA,QAC3C,GAAI,EAAA,CAAA;AAAA,KACR;AAGA,IAAA,IAAI,CAAC,SAAW,EAAA;AACd,MAAI,IAAA,OAAA,CAAQ,YAAY,WAAa,EAAA;AACnC,QAAA,SAAA,GAAY,iBAAiB,CAAC,CAAA,CAAA;AAAA,OAChC,MAAA,IAAW,OAAQ,CAAA,OAAA,KAAY,SAAW,EAAA;AACxC,QAAY,SAAA,GAAA,gBAAA,CAAiB,OAAQ,CAAA,MAAA,GAAS,CAAC,CAAA,CAAA;AAAA,OACjD;AAAA,KACF;AAGA,IAAA,IAAI,CAAC,SAAW,EAAA;AACd,MAAA,SAAA,GAAY,iBAAiB,CAAC,CAAA,CAAA;AAAA,KAChC;AAEA,IAAA,SAAA,CAAU,SAAS,CAAA,CAAA;AAAA,GAClB,EAAA,CAAC,SAAW,EAAA,QAAQ,CAAC,CAAA,CAAA;AAExB,EAAA,MAAM,SAASC,UAAM,EAAA,CAAA;AAErB,EACE,uBAAAC,eAAA,CAACC,sCAAmB,QAAnB,EAAA;AAAA,IAA4B,KAAO,EAAA,WAAA;AAAA,IAClC,QAAA,EAAA;AAAA,sBAACD,eAAA,CAAA,QAAA,EAAA;AAAA,QACC,SAAW,EAAAE,SAAA;AAAA,UACT,YAAa,EAAA;AAAA,UACb,aAAa,OAAO,CAAA;AAAA,UACpB;AAAA,YACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,YAC5B,CAAC,YAAA,CAAa,gBAAoB,IAAA,IAAA,GAAA,gBAAA,GAAA,EAAE,CAAI,GAAA,gBAAA;AAAA,WAC1C;AAAA,UACA,SAAA;AAAA,SACF;AAAA,QACA,GAAK,EAAA,eAAA;AAAA,QACL,IAAK,EAAA,UAAA;AAAA,QACL,IAAK,EAAA,QAAA;AAAA,QACL,QAAA;AAAA,QACA,eAAA,EAAe,WAAW,MAAS,GAAA,KAAA,CAAA;AAAA,QACnC,eAAA,EAAe,WAAW,MAAS,GAAA,KAAA,CAAA;AAAA,QACnC,eAAe,EAAA,SAAA;AAAA,QACf,yBAAuB,WAAa,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,WAAA,CAAA,EAAA;AAAA,QACpC,iBAAiB,EAAAA,SAAA,CAAK,mBAAqB,EAAA,cAAc,CAAK,IAAA,KAAA,CAAA;AAAA,QAC9D,kBACE,EAAAA,SAAA,CAAK,oBAAsB,EAAA,eAAe,CAAK,IAAA,KAAA,CAAA;AAAA,QAEjD,sBAAsB,EAAA,WAAA;AAAA,QACtB,eAAA,EAAe,YAAY,MAAS,GAAA,KAAA,CAAA;AAAA,QACnC,GAAG,iBAAkB,CAAA;AAAA,UACpB,SAAW,EAAA,aAAA;AAAA,UACX,OAAS,EAAA,WAAA;AAAA,UACT,MAAQ,EAAA,UAAA;AAAA,UACR,GAAG,IAAA;AAAA,SACJ,CAAA;AAAA,QAEA,QAAA,EAAA;AAAA,UAAA,cAAA;AAAA,0BACA5B,cAAA,CAAA,MAAA,EAAA;AAAA,YACC,SAAW,EAAA4B,SAAA,CAAK,YAAa,CAAA,SAAS,CAAG,EAAA;AAAA,cACvC,CAAC,YAAA,CAAa,aAAa,CAAA,GAAI,CAAC,SAAA;AAAA,aACjC,CAAA;AAAA,YAEA,QAAA,EAAA,CAAC,YAAY,WAAc,GAAA,SAAA;AAAA,WAC9B,CAAA;AAAA,UACC,oCAAqB5B,cAAA,CAAA6B,oBAAA,EAAA;AAAA,YAAgB,MAAQ,EAAA,gBAAA;AAAA,WAAkB,CAAA;AAAA,UAC/D,CAAC,4BAAa7B,cAAA,CAAA,UAAA,EAAA;AAAA,YAAW,IAAM,EAAA,SAAA;AAAA,WAAW,CAAA;AAAA,SAAA;AAAA,OAC7C,CAAA;AAAA,sBACCA,cAAA,CAAA,iBAAA,EAAA;AAAA,QACC,IAAO,EAAA,CAAA,SAAA,IAAa,YAAiB,KAAA,CAAC,YAAY,QAAY,IAAA,KAAA,CAAA;AAAA,QAC7D,GAAG,gBAAiB,EAAA;AAAA,QACrB,MAAM,CAAK,IAAA,IAAA,GAAA,CAAA,GAAA,CAAA;AAAA,QACX,KAAK,CAAK,IAAA,IAAA,GAAA,CAAA,GAAA,CAAA;AAAA,QACV,QAAU,EAAA,QAAA;AAAA,QACV,KAAA,EAAA,CAAO,EAAS,GAAA,QAAA,CAAA,QAAA,KAAT,IAAmB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,WAAA;AAAA,QAC1B,MAAA,EAAA,CAAQ,EAAS,GAAA,QAAA,CAAA,QAAA,KAAT,IAAmB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,YAAA;AAAA,QAC3B,GAAK,EAAA,QAAA;AAAA,QAEL,QAAC,kBAAAA,cAAA,CAAA8B,qBAAA,EAAA;AAAA,UACC,EAAI,EAAA,MAAA;AAAA,UACJ,WAAW,CAAC,SAAA;AAAA,UACZ,WAAa,EAAA,mBAAA;AAAA,UACb,OAAS,EAAA,iBAAA;AAAA,UACT,OAAS,EAAA,iBAAA;AAAA,UACT,GAAK,EAAA,OAAA;AAAA,UAEJ,QAAA;AAAA,SACH,CAAA;AAAA,OACF,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-cjs/form-field-legacy/FormLabel.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = "/* Styles applied to root element */\n.salt-density-touch {\n  --formFieldLegacy-label-default-top: 11px;\n  --formFieldLegacy-label-left-top: 16px;\n  --formFieldLegacy-label-minHeight: 16px;\n}\n.salt-density-low {\n  --formFieldLegacy-label-default-top: 7px;\n  --formFieldLegacy-label-left-top: 12px;\n}\n.salt-density-medium {\n  --formFieldLegacy-label-default-top: 5px;\n  --formFieldLegacy-label-left-top: 8px;\n}\n.salt-density-high {\n  --formFieldLegacy-label-default-top: 3px;\n  --formFieldLegacy-label-left-top: 4px;\n}\n\n.saltFormLabel {\n  --formFieldLegacy-label-fontSize: var(--saltFormFieldLegacy-label-fontSize, var(--salt-text-label-fontSize));\n  --formFieldLegacy-label-top: var(--formFieldLegacy-label-default-top);\n  --formFieldLegacy-label-width: 100%;\n}\n\n.saltFormFieldLegacy-labelLeft .saltFormLabel {\n  --formFieldLegacy-label-top: var(--formFieldLegacy-label-left-top);\n  --formFieldLegacy-label-width: auto;\n}\n\n.saltFormLabel {\n  align-items: center;\n  color: var(--saltFormFieldLegacy-label-text-color, var(--salt-content-secondary-foreground));\n  display: block;\n  font-size: var(--formFieldLegacy-label-fontSize);\n  margin-bottom: var(--saltFormFieldLegacy-label-marginBottom, var(--formFieldLegacy-label-marginBottom));\n  min-height: var(--saltFormFieldLegacy-label-minHeight, var(--formFieldLegacy-label-minHeight, var(--salt-text-label-minHeight)));\n  margin-top: var(--saltFormFieldLegacy-label-marginTop, 0px);\n  line-height: var(--saltFormFieldLegacy-label-lineHeight, var(--salt-text-label-lineHeight));\n  overflow: hidden;\n  padding-left: var(--saltFormFieldLegacy-label-paddingLeft, var(--formFieldLegacy-label-paddingLeft));\n  padding-right: var(--saltFormFieldLegacy-label-paddingRight, var(--formFieldLegacy-label-paddingRight));\n  padding-top: var(--saltFormFieldLegacy-label-paddingTop, 0);\n  padding-bottom: var(--saltFormFieldLegacy-label-paddingBottom, 0);\n  text-overflow: ellipsis;\n  top: var(--saltFormFieldLegacy-label-top, var(--formFieldLegacy-label-top));\n  transform: translate(var(--saltFormFieldLegacy-label-transform-x, 0), var(--saltFormFieldLegacy-label-transform-y, var(--formFieldLegacy-label-top)));\n  white-space: nowrap;\n  width: var(--saltFormFieldLegacy-label-width, var(--formFieldLegacy-label-width, 100%));\n}\n\n.saltFormLabel ~ * {\n  z-index: 1;\n}\n\n/* Styles applied when `disabled={true}` */\n.saltFormLabel-disabled {\n  color: var(--saltFormFieldLegacy-label-text-color-disabled, var(--salt-content-secondary-foreground-disabled));\n  cursor: var(--salt-editable-cursor-disabled);\n}\n\n/* Styles applied when displayedNecessity or necessityText provided */\n.saltFormLabel-necessityIndicator {\n  font-style: var(--saltFormFieldLegacy-label-necessityIndicator-fontStyle, var(--salt-editable-help-fontStyle));\n  margin-left: 1ch;\n}\n\n/* Styles applied if `hasStatusIndicator={true}` */\n.saltFormLabel-statusIndicator {\n  margin-left: 6px;\n  vertical-align: top;\n}\n";
+var css_248z = "/* Styles applied to root element */\n.salt-density-touch {\n  --formFieldLegacy-label-default-top: 11px;\n  --formFieldLegacy-label-left-top: 16px;\n  --formFieldLegacy-label-minHeight: 16px;\n}\n.salt-density-low {\n  --formFieldLegacy-label-default-top: 7px;\n  --formFieldLegacy-label-left-top: 12px;\n}\n.salt-density-medium {\n  --formFieldLegacy-label-default-top: 5px;\n  --formFieldLegacy-label-left-top: 8px;\n}\n.salt-density-high {\n  --formFieldLegacy-label-default-top: 3px;\n  --formFieldLegacy-label-left-top: 4px;\n}\n\n.saltFormLabel {\n  --formFieldLegacy-label-fontSize: var(--saltFormFieldLegacy-label-fontSize, var(--salt-text-label-fontSize));\n  --formFieldLegacy-label-top: var(--formFieldLegacy-label-default-top);\n  --formFieldLegacy-label-width: 100%;\n}\n\n.saltFormFieldLegacy-labelLeft .saltFormLabel {\n  --formFieldLegacy-label-top: var(--formFieldLegacy-label-left-top);\n  --formFieldLegacy-label-width: auto;\n}\n\n.saltFormLabel {\n  align-items: center;\n  color: var(--saltFormFieldLegacy-label-text-color, var(--salt-content-secondary-foreground));\n  display: block;\n  font-size: var(--formFieldLegacy-label-fontSize);\n  margin-bottom: var(--saltFormFieldLegacy-label-marginBottom, var(--formFieldLegacy-label-marginBottom));\n  min-height: var(--saltFormFieldLegacy-label-minHeight, var(--formFieldLegacy-label-minHeight, var(--salt-text-label-minHeight)));\n  margin-top: var(--saltFormFieldLegacy-label-marginTop, 0px);\n  line-height: var(--saltFormFieldLegacy-label-lineHeight, var(--salt-text-label-lineHeight));\n  overflow: hidden;\n  padding-left: var(--saltFormFieldLegacy-label-paddingLeft, var(--formFieldLegacy-label-paddingLeft));\n  padding-right: var(--saltFormFieldLegacy-label-paddingRight, var(--formFieldLegacy-label-paddingRight));\n  padding-top: var(--saltFormFieldLegacy-label-paddingTop, 0);\n  padding-bottom: var(--saltFormFieldLegacy-label-paddingBottom, 0);\n  text-overflow: ellipsis;\n  top: var(--saltFormFieldLegacy-label-top, var(--formFieldLegacy-label-top));\n  transform: translate(var(--saltFormFieldLegacy-label-transform-x, 0), var(--saltFormFieldLegacy-label-transform-y, var(--formFieldLegacy-label-top)));\n  white-space: nowrap;\n  width: var(--saltFormFieldLegacy-label-width, var(--formFieldLegacy-label-width, 100%));\n  box-sizing: border-box;\n}\n\n.saltFormLabel ~ * {\n  z-index: 1;\n}\n\n/* Styles applied when `disabled={true}` */\n.saltFormLabel-disabled {\n  color: var(--saltFormFieldLegacy-label-text-color-disabled, var(--salt-content-secondary-foreground-disabled));\n  cursor: var(--salt-editable-cursor-disabled);\n}\n\n/* Styles applied when displayedNecessity or necessityText provided */\n.saltFormLabel-necessityIndicator {\n  font-style: var(--saltFormFieldLegacy-label-necessityIndicator-fontStyle, var(--salt-editable-help-fontStyle));\n  margin-left: 1ch;\n}\n\n/* Styles applied if `hasStatusIndicator={true}` */\n.saltFormLabel-statusIndicator.saltIcon {\n  margin-left: 6px;\n  vertical-align: top;\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=FormLabel.css.js.map

package/dist-cjs/index.js

@@ -62,13 +62,11 @@ var ContentStatus = require('./content-status/ContentStatus.js');
 var DeckItem = require('./deck-item/DeckItem.js');
 var DeckLayout = require('./deck-layout/DeckLayout.js');
 var Dialog = require('./dialog/Dialog.js');
-var DialogTitle = require('./dialog/DialogTitle.js');
+var DialogHeader = require('./dialog/DialogHeader.js');
 var DialogActions = require('./dialog/DialogActions.js');
 var DialogContent = require('./dialog/DialogContent.js');
 var DialogContext = require('./dialog/DialogContext.js');
 var DialogCloseButton = require('./dialog/DialogCloseButton.js');
-var Drawer = require('./drawer/Drawer.js');
-var DrawerCloseButton = require('./drawer/DrawerCloseButton.js');
 var DropdownBase = require('./dropdown/DropdownBase.js');
 var DropdownButton = require('./dropdown/DropdownButton.js');
 var Dropdown = require('./dropdown/Dropdown.js');
@@ -214,14 +212,12 @@ exports.DeckItem = DeckItem.DeckItem;
 exports.DeckLayout = DeckLayout.DeckLayout;
 exports.ConditionalScrimWrapper = Dialog.ConditionalScrimWrapper;
 exports.Dialog = Dialog.Dialog;
-exports.DialogTitle = DialogTitle.DialogTitle;
+exports.DialogHeader = DialogHeader.DialogHeader;
 exports.DialogActions = DialogActions.DialogActions;
 exports.DialogContent = DialogContent.DialogContent;
 exports.DialogContext = DialogContext.DialogContext;
 exports.useDialogContext = DialogContext.useDialogContext;
 exports.DialogCloseButton = DialogCloseButton.DialogCloseButton;
-exports.Drawer = Drawer.Drawer;
-exports.DrawerCloseButton = DrawerCloseButton.DrawerCloseButton;
 exports.DropdownBase = DropdownBase.DropdownBase;
 exports.DropdownButton = DropdownButton.DropdownButton;
 exports.Dropdown = Dropdown.Dropdown;

package/dist-cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist-cjs/input-legacy/InputLegacy.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = "/* Styles applied to the root element dependent on density */\n.salt-density-touch {\n  --inputLegacy-adornment-height: calc(var(--salt-size-base) + var(--salt-size-unit) * 0.5);\n  --inputLegacy-button-inset: 4px;\n}\n.salt-density-low {\n  --inputLegacy-adornment-height: calc(var(--salt-size-base) + var(--salt-size-unit) * 2 / 3);\n  --inputLegacy-button-inset: 4px;\n}\n.salt-density-medium {\n  --inputLegacy-adornment-height: calc(var(--salt-size-base) + var(--salt-size-unit) * 0.5);\n  --inputLegacy-button-inset: 2px;\n}\n.salt-density-high {\n  --inputLegacy-adornment-height: calc(var(--salt-size-base) + var(--salt-size-unit));\n  --inputLegacy-button-inset: 2px;\n}\n\n/* Style applied to the root element */\n.saltInputLegacy {\n  align-items: center;\n  background: var(--saltInputLegacy-background, none);\n  border: var(--saltInputLegacy-border, none);\n  border-radius: var(--saltInputLegacy-borderRadius, 0);\n  color: var(--saltInputLegacy-text-color, var(--salt-content-primary-foreground));\n  cursor: var(--saltInputLegacy-cursor, default);\n  display: inline-flex;\n  font-family: var(--saltInputLegacy-fontFamily, var(--salt-text-fontFamily));\n  font-size: var(--saltInputLegacy-fontSize, var(--salt-text-fontSize));\n  height: var(--saltInputLegacy-height, var(--salt-size-base));\n  line-height: var(--salt-text-lineHeight);\n  min-height: var(--saltInputLegacy-minHeight, var(--salt-size-base));\n  min-width: var(--saltInputLegacy-minWidth, 8em);\n  padding: var(--saltInputLegacy-padding, 0 var(--salt-size-unit));\n  position: var(--saltInputLegacy-position, relative);\n  width: 100%;\n}\n\n/* Reset in the next class */\n.saltInputLegacy-input:focus {\n  outline: none;\n}\n\n/* Pseudo-class applied to the root element when focused */\n.saltInputLegacy-focused {\n  outline-style: var(--saltInputLegacy-focused-outlineStyle, var(--salt-focused-outlineStyle));\n  outline-width: var(--saltInputLegacy-focused-outlineWidth, var(--salt-focused-outlineWidth));\n  outline-color: var(--saltInputLegacy-focused-outlineColor, var(--salt-focused-outlineColor));\n  outline-offset: var(--saltInputLegacy-focused-outlineOffset, var(--salt-focused-outlineOffset));\n}\n\n/* Style applied to selected input */\n.saltInputLegacy-input::selection {\n  background-color: var(--saltInputLegacy-highlight-color, var(--salt-content-foreground-highlight));\n}\n\n/* Style applied to inner input component */\n.saltInputLegacy-input {\n  background: var(--saltInputLegacy-background, none);\n  border: none;\n  box-sizing: content-box;\n  color: inherit;\n  display: block;\n  flex: 1;\n  font: inherit;\n  letter-spacing: var(--saltInputLegacy-letterSpacing, 0);\n  margin: 0;\n  min-width: 0;\n  overflow: hidden;\n  padding: 0;\n  height: 100%;\n  width: 100%;\n}\n\n/* Style applied to input if `disabled={true}` */\n.saltInputLegacy-disabled .saltInputLegacy-input {\n  cursor: var(--salt-editable-cursor-disabled);\n  color: var(--saltInputLegacy-text-color-disabled, var(--salt-content-primary-foreground-disabled));\n}\n\n/* Style applied to adornment containers */\n.saltInputLegacy-suffixContainer,\n.saltInputLegacy-prefixContainer {\n  display: flex;\n  align-items: center;\n\n  height: var(--inputLegacy-adornment-height);\n}\n\n/* Style applied to root element with start adornment */\n.saltInputLegacy-inputAdornedStart {\n  padding-left: var(--saltInputLegacy-adornedStart-padding, 0);\n}\n\n/* Style applied to inner input element with start adornment */\n.saltInputLegacy-inputAdornedStart .saltInputLegacy-input {\n  padding-left: var(--saltInputLegacy-adornedStart-input-padding, var(--salt-size-unit));\n}\n\n/* Style applied to root element with end adornment */\n.saltInputLegacy-inputAdornedEnd {\n  padding-right: var(--saltInputLegacy-adornedEnd-padding, 0);\n}\n\n/* Style applied to inner input element with end adornment */\n.saltInputLegacy-inputAdornedEnd .saltInputLegacy-input {\n  padding-right: var(--saltInputLegacy-adornedEnd-input-padding, var(--salt-size-unit));\n}\n\n/* Style applied to salt Button used within Input component adornments */\n.saltInputLegacy .saltInputLegacy-suffixContainer > .saltButton,\n.saltInputLegacy .saltInputLegacy-prefixContainer > .saltButton {\n  height: calc(var(--saltButton-height, var(--salt-size-base)) - (var(--inputLegacy-button-inset) * 2));\n  margin: var(--inputLegacy-button-inset);\n  padding: 0 calc(var(--salt-size-unit) - var(--inputLegacy-button-inset));\n}\n\n/* Style applied if `textAlign={\"left\"}` */\n.saltInputLegacy-leftTextAlign .saltInputLegacy-input {\n  text-align: left;\n}\n\n/* Style applied if `textAlign={\"center\"}` */\n.saltInputLegacy-centerTextAlign .saltInputLegacy-input {\n  text-align: center;\n}\n\n/* Style applied if `textAlign={\"right\"}` */\n.saltInputLegacy-rightTextAlign .saltInputLegacy-input {\n  text-align: right;\n}\n\n/* Style applied if `inFormField={true}` */\n.saltInputLegacy-formField {\n  min-width: var(--saltFormFieldLegacy-input-minWidth, 0px);\n  width: 100%;\n}\n";
+var css_248z = "/* Styles applied to the root element dependent on density */\n.salt-density-touch {\n  --inputLegacy-adornment-height: calc(var(--salt-size-base) + var(--salt-size-unit) * 0.5);\n  --inputLegacy-button-inset: 4px;\n}\n.salt-density-low {\n  --inputLegacy-adornment-height: calc(var(--salt-size-base) + var(--salt-size-unit) * 2 / 3);\n  --inputLegacy-button-inset: 4px;\n}\n.salt-density-medium {\n  --inputLegacy-adornment-height: calc(var(--salt-size-base) + var(--salt-size-unit) * 0.5);\n  --inputLegacy-button-inset: 2px;\n}\n.salt-density-high {\n  --inputLegacy-adornment-height: calc(var(--salt-size-base) + var(--salt-size-unit));\n  --inputLegacy-button-inset: 2px;\n}\n\n/* Style applied to the root element */\n.saltInputLegacy {\n  align-items: center;\n  background: var(--saltInputLegacy-background, none);\n  border: var(--saltInputLegacy-border, none);\n  border-radius: var(--saltInputLegacy-borderRadius, 0);\n  color: var(--saltInputLegacy-text-color, var(--salt-content-primary-foreground));\n  cursor: var(--saltInputLegacy-cursor, default);\n  display: inline-flex;\n  font-family: var(--saltInputLegacy-fontFamily, var(--salt-text-fontFamily));\n  font-size: var(--saltInputLegacy-fontSize, var(--salt-text-fontSize));\n  height: var(--saltInputLegacy-height, var(--salt-size-base));\n  line-height: var(--salt-text-lineHeight);\n  min-height: var(--saltInputLegacy-minHeight, var(--salt-size-base));\n  min-width: var(--saltInputLegacy-minWidth, 8em);\n  padding: var(--saltInputLegacy-padding, 0 var(--salt-size-unit));\n  position: var(--saltInputLegacy-position, relative);\n  width: 100%;\n  box-sizing: border-box;\n}\n\n/* Reset in the next class */\n.saltInputLegacy-input:focus {\n  outline: none;\n}\n\n/* Pseudo-class applied to the root element when focused */\n.saltInputLegacy-focused {\n  outline-style: var(--saltInputLegacy-focused-outlineStyle, var(--salt-focused-outlineStyle));\n  outline-width: var(--saltInputLegacy-focused-outlineWidth, var(--salt-focused-outlineWidth));\n  outline-color: var(--saltInputLegacy-focused-outlineColor, var(--salt-focused-outlineColor));\n  outline-offset: var(--saltInputLegacy-focused-outlineOffset, var(--salt-focused-outlineOffset));\n}\n\n/* Style applied to selected input */\n.saltInputLegacy-input::selection {\n  background-color: var(--saltInputLegacy-highlight-color, var(--salt-content-foreground-highlight));\n}\n\n/* Style applied to inner input component */\n.saltInputLegacy-input {\n  background: var(--saltInputLegacy-background, none);\n  border: none;\n  box-sizing: content-box;\n  color: inherit;\n  display: block;\n  flex: 1;\n  font: inherit;\n  letter-spacing: var(--saltInputLegacy-letterSpacing, 0);\n  margin: 0;\n  min-width: 0;\n  overflow: hidden;\n  padding: 0;\n  height: 100%;\n  width: 100%;\n}\n\n/* Style applied to input if `disabled={true}` */\n.saltInputLegacy-disabled .saltInputLegacy-input {\n  cursor: var(--salt-editable-cursor-disabled);\n  color: var(--saltInputLegacy-text-color-disabled, var(--salt-content-primary-foreground-disabled));\n}\n\n/* Style applied to adornment containers */\n.saltInputLegacy-suffixContainer,\n.saltInputLegacy-prefixContainer {\n  display: flex;\n  align-items: center;\n\n  height: var(--inputLegacy-adornment-height);\n}\n\n/* Style applied to root element with start adornment */\n.saltInputLegacy-inputAdornedStart {\n  padding-left: var(--saltInputLegacy-adornedStart-padding, 0);\n}\n\n/* Style applied to inner input element with start adornment */\n.saltInputLegacy-inputAdornedStart .saltInputLegacy-input {\n  padding-left: var(--saltInputLegacy-adornedStart-input-padding, var(--salt-size-unit));\n}\n\n/* Style applied to root element with end adornment */\n.saltInputLegacy-inputAdornedEnd {\n  padding-right: var(--saltInputLegacy-adornedEnd-padding, 0);\n}\n\n/* Style applied to inner input element with end adornment */\n.saltInputLegacy-inputAdornedEnd .saltInputLegacy-input {\n  padding-right: var(--saltInputLegacy-adornedEnd-input-padding, var(--salt-size-unit));\n}\n\n/* Style applied to salt Button used within Input component adornments */\n.saltInputLegacy .saltInputLegacy-suffixContainer > .saltButton,\n.saltInputLegacy .saltInputLegacy-prefixContainer > .saltButton {\n  height: calc(var(--saltButton-height, var(--salt-size-base)) - (var(--inputLegacy-button-inset) * 2));\n  margin: var(--inputLegacy-button-inset);\n  padding: 0 calc(var(--salt-size-unit) - var(--inputLegacy-button-inset));\n}\n\n/* Style applied if `textAlign={\"left\"}` */\n.saltInputLegacy-leftTextAlign .saltInputLegacy-input {\n  text-align: left;\n}\n\n/* Style applied if `textAlign={\"center\"}` */\n.saltInputLegacy-centerTextAlign .saltInputLegacy-input {\n  text-align: center;\n}\n\n/* Style applied if `textAlign={\"right\"}` */\n.saltInputLegacy-rightTextAlign .saltInputLegacy-input {\n  text-align: right;\n}\n\n/* Style applied if `inFormField={true}` */\n.saltInputLegacy-formField {\n  min-width: var(--saltFormFieldLegacy-input-minWidth, 0px);\n  width: 100%;\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=InputLegacy.css.js.map

package/dist-cjs/layer-layout/LayerLayout.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = ".saltLayerLayout {\n  --layerLayout-boxShadow: var(--saltLayerLayout-boxShadow, var(--salt-overlayable-shadow-modal));\n  --layerLayout-background: var(--saltLayerLayout-background, var(--salt-container-primary-background));\n  --layerLayout-padding: var(--saltLayerLayout-padding, var(--salt-size-container-spacing));\n  --layerLayout-margin: var(--saltLayerLayout-margin, var(--salt-size-container-spacing));\n}\n\n.saltLayerLayout {\n  background: var(--layerLayout-background);\n  display: flex;\n  flex-direction: column;\n  max-height: 100%;\n  max-width: 100%;\n  overflow: auto;\n  padding: var(--layerLayout-padding);\n  box-shadow: var(--saltLayerLayout-boxShadow, var(--layerLayout-boxShadow));\n  z-index: calc(var(--salt-zIndex-appHeader) - 1);\n}\n\n.saltLayerLayout-fullScreen {\n  width: 100vw;\n  height: 100vh;\n  margin: 0;\n  position: fixed;\n  top: 0;\n  left: 0;\n}\n\n.saltLayerLayout-center {\n  margin: var(--saltLayerLayout-margin, var(--layerLayout-margin));\n}\n\n.saltLayerLayout-center.saltLayerLayout-enter-animation,\n.saltLayerLayout-fullScreen.saltLayerLayout-enter-animation,\n.saltScrim.saltLayerLayout-enter-animation {\n  animation: var(--salt-animation-fade-in-center);\n}\n\n.saltLayerLayout-center.saltLayerLayout-exit-animation,\n.saltLayerLayout-fullScreen.saltLayerLayout-exit-animation,\n.saltScrim.saltLayerLayout-exit-animation {\n  animation: var(--salt-animation-fade-out-back);\n}\n\n.saltLayerLayout-anchor {\n  position: fixed;\n  max-height: 100%;\n  top: 0;\n}\n\n.saltLayerLayout-top {\n  left: 0;\n  right: 0;\n  bottom: auto;\n}\n\n.saltLayerLayout-top.saltLayerLayout-enter-animation {\n  animation: var(--salt-animation-slide-in-bottom);\n}\n\n.saltLayerLayout-top.saltLayerLayout-exit-animation {\n  animation: var(--salt-animation-slide-out-bottom);\n}\n\n.saltLayerLayout-right {\n  left: auto;\n  right: 0;\n  height: 100%;\n}\n\n.saltLayerLayout-right.saltLayerLayout-enter-animation {\n  animation: var(--salt-animation-slide-in-right);\n}\n\n.saltLayerLayout-right.saltLayerLayout-exit-animation {\n  animation: var(--salt-animation-slide-out-right);\n}\n\n.saltLayerLayout-left {\n  left: 0;\n  right: auto;\n  height: 100%;\n}\n\n.saltLayerLayout-left.saltLayerLayout-enter-animation {\n  animation: var(--salt-animation-slide-in-left);\n}\n\n.saltLayerLayout-left.saltLayerLayout-exit-animation {\n  animation: var(--salt-animation-slide-out-left);\n}\n\n.saltLayerLayout-bottom {\n  left: 0;\n  right: 0;\n  bottom: 0;\n  top: auto;\n}\n\n.saltLayerLayout-bottom.saltLayerLayout-enter-animation {\n  animation: var(--salt-animation-slide-in-top);\n}\n\n.saltLayerLayout-bottom.saltLayerLayout-exit-animation {\n  animation: var(--salt-animation-slide-out-top);\n}\n";
+var css_248z = ".saltLayerLayout {\n  --layerLayout-boxShadow: var(--saltLayerLayout-boxShadow, var(--salt-overlayable-shadow-modal));\n  --layerLayout-background: var(--saltLayerLayout-background, var(--salt-container-primary-background));\n  --layerLayout-padding: var(--saltLayerLayout-padding, var(--salt-size-container-spacing));\n  --layerLayout-margin: var(--saltLayerLayout-margin, var(--salt-size-container-spacing));\n}\n\n.saltLayerLayout {\n  background: var(--layerLayout-background);\n  display: flex;\n  flex-direction: column;\n  max-height: 100%;\n  max-width: 100%;\n  overflow: auto;\n  padding: var(--layerLayout-padding);\n  box-shadow: var(--saltLayerLayout-boxShadow, var(--layerLayout-boxShadow));\n  z-index: calc(var(--salt-zIndex-appHeader) - 1);\n  box-sizing: border-box;\n}\n\n.saltLayerLayout-fullScreen {\n  width: 100vw;\n  height: 100vh;\n  margin: 0;\n  position: fixed;\n  top: 0;\n  left: 0;\n}\n\n.saltLayerLayout-center {\n  margin: var(--saltLayerLayout-margin, var(--layerLayout-margin));\n}\n\n.saltLayerLayout-center.saltLayerLayout-enter-animation,\n.saltLayerLayout-fullScreen.saltLayerLayout-enter-animation,\n.saltScrim.saltLayerLayout-enter-animation {\n  animation: var(--salt-animation-fade-in-center);\n}\n\n.saltLayerLayout-center.saltLayerLayout-exit-animation,\n.saltLayerLayout-fullScreen.saltLayerLayout-exit-animation,\n.saltScrim.saltLayerLayout-exit-animation {\n  animation: var(--salt-animation-fade-out-back);\n}\n\n.saltLayerLayout-anchor {\n  position: fixed;\n  max-height: 100%;\n  top: 0;\n}\n\n.saltLayerLayout-top {\n  left: 0;\n  right: 0;\n  bottom: auto;\n}\n\n.saltLayerLayout-top.saltLayerLayout-enter-animation {\n  animation: var(--salt-animation-slide-in-bottom);\n}\n\n.saltLayerLayout-top.saltLayerLayout-exit-animation {\n  animation: var(--salt-animation-slide-out-bottom);\n}\n\n.saltLayerLayout-right {\n  left: auto;\n  right: 0;\n  height: 100%;\n}\n\n.saltLayerLayout-right.saltLayerLayout-enter-animation {\n  animation: var(--salt-animation-slide-in-right);\n}\n\n.saltLayerLayout-right.saltLayerLayout-exit-animation {\n  animation: var(--salt-animation-slide-out-right);\n}\n\n.saltLayerLayout-left {\n  left: 0;\n  right: auto;\n  height: 100%;\n}\n\n.saltLayerLayout-left.saltLayerLayout-enter-animation {\n  animation: var(--salt-animation-slide-in-left);\n}\n\n.saltLayerLayout-left.saltLayerLayout-exit-animation {\n  animation: var(--salt-animation-slide-out-left);\n}\n\n.saltLayerLayout-bottom {\n  left: 0;\n  right: 0;\n  bottom: 0;\n  top: auto;\n}\n\n.saltLayerLayout-bottom.saltLayerLayout-enter-animation {\n  animation: var(--salt-animation-slide-in-top);\n}\n\n.saltLayerLayout-bottom.saltLayerLayout-exit-animation {\n  animation: var(--salt-animation-slide-out-top);\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=LayerLayout.css.js.map

package/dist-cjs/list/List.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = ".saltList {\n  --list-background: var(--salt-container-primary-background);\n  --list-borderStyle: var(--salt-container-borderStyle);\n  --list-borderWidth: var(--salt-size-border);\n  --list-height: auto;\n  --list-item-height: var(--salt-size-stackable);\n  --list-item-gap: 0px;\n  --list-maxHeight: 100%;\n\n  background: var(--list-background);\n  border-color: var(--salt-container-primary-borderColor);\n  border-style: var(--list-borderStyle);\n  border-width: var(--list-borderWidth);\n  height: var(--saltList-height, var(--list-height));\n  max-height: var(--list-maxHeight);\n  outline: none;\n  overflow-y: auto;\n  position: relative;\n  user-select: none;\n  width: var(--saltList-width, auto);\n\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-fontSize);\n  font-weight: var(--salt-text-fontWeight);\n  line-height: var(--salt-text-lineHeight);\n}\n\n.saltList-borderless {\n  --list-borderStyle: none;\n}\n\n/* virtualised list */\n.saltList-viewport {\n  --list-item-height: 30px;\n  max-height: calc(var(--list-maxHeight) - 2 * var(--list-borderWidth));\n  overflow: auto;\n}\n\n.saltListItemHeader {\n  --saltList-item-background: var(--list-item-header-background);\n  color: var(--list-item-header-color);\n}\n\n.saltListItemHeader[data-sticky=\"true\"] {\n  --saltList-item-background: var(--list-background);\n  position: sticky;\n  top: 0;\n  z-index: 1;\n}\n\n.saltList-collapsible .saltListItemHeader:after {\n  border-width: var(--checkbox-borderWidth);\n  border-color: var(--checkbox-borderColor);\n  content: var(--list-item-header-twisty-content);\n  -webkit-mask: var(--list-svg-chevron-down) center center/12px 12px no-repeat;\n  mask: var(--list-svg-chevron-down) center center/12px 12px no-repeat;\n  background: var(--list-item-header-twisty-color);\n  height: 12px;\n  left: var(--list-item-header-twisty-left);\n  right: var(--list-item-header-twisty-right);\n  margin-top: -8px;\n  position: absolute;\n  top: var(--list-item-header-twisty-top);\n  transition: transform 0.3s;\n  width: 12px;\n}\n.saltListItemHeader[aria-expanded=\"false\"]:after {\n  transform: rotate(-90deg);\n}\n\n/* Selection */\n\n.saltList-scrollingContentContainer {\n  box-sizing: inherit;\n  position: relative;\n}\n\n.saltList-virtualized .saltListItem {\n  line-height: 30px;\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  will-change: transform;\n}\n.saltList.saltFocusVisible:after {\n  inset: 2px;\n}\n";
+var css_248z = ".saltList {\n  --list-background: var(--salt-container-primary-background);\n  --list-borderStyle: var(--salt-container-borderStyle);\n  --list-borderWidth: var(--salt-size-border);\n  --list-height: auto;\n  --list-item-height: var(--salt-size-stackable);\n  --list-item-gap: 0px;\n  --list-maxHeight: 100%;\n\n  background: var(--list-background);\n  border-color: var(--salt-container-primary-borderColor);\n  border-style: var(--list-borderStyle);\n  border-width: var(--list-borderWidth);\n  height: var(--saltList-height, var(--list-height));\n  max-height: var(--list-maxHeight);\n  outline: none;\n  overflow-y: auto;\n  position: relative;\n  user-select: none;\n  width: var(--saltList-width, auto);\n\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-fontSize);\n  font-weight: var(--salt-text-fontWeight);\n  line-height: var(--salt-text-lineHeight);\n\n  box-sizing: border-box;\n}\n\n.saltList-borderless {\n  --list-borderStyle: none;\n}\n\n/* virtualised list */\n.saltList-viewport {\n  --list-item-height: 30px;\n  max-height: calc(var(--list-maxHeight) - 2 * var(--list-borderWidth));\n  overflow: auto;\n}\n\n.saltListItemHeader {\n  --saltList-item-background: var(--list-item-header-background);\n  color: var(--list-item-header-color);\n}\n\n.saltListItemHeader[data-sticky=\"true\"] {\n  --saltList-item-background: var(--list-background);\n  position: sticky;\n  top: 0;\n  z-index: 1;\n}\n\n.saltList-collapsible .saltListItemHeader:after {\n  border-width: var(--checkbox-borderWidth);\n  border-color: var(--checkbox-borderColor);\n  content: var(--list-item-header-twisty-content);\n  -webkit-mask: var(--list-svg-chevron-down) center center/12px 12px no-repeat;\n  mask: var(--list-svg-chevron-down) center center/12px 12px no-repeat;\n  background: var(--list-item-header-twisty-color);\n  height: 12px;\n  left: var(--list-item-header-twisty-left);\n  right: var(--list-item-header-twisty-right);\n  margin-top: -8px;\n  position: absolute;\n  top: var(--list-item-header-twisty-top);\n  transition: transform 0.3s;\n  width: 12px;\n}\n.saltListItemHeader[aria-expanded=\"false\"]:after {\n  transform: rotate(-90deg);\n}\n\n/* Selection */\n\n.saltList-scrollingContentContainer {\n  box-sizing: inherit;\n  position: relative;\n}\n\n.saltList-virtualized .saltListItem {\n  line-height: 30px;\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  will-change: transform;\n}\n.saltList.saltFocusVisible:after {\n  inset: 2px;\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=List.css.js.map

package/dist-cjs/list-control/ListControlContext.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var core = require('@salt-ds/core');
 var React = require('react');
+var ListControlState = require('./ListControlState.js');
 
 const ListControlContext = core.createContext(
   "ListControlContext",
@@ -24,7 +25,8 @@ const ListControlContext = core.createContext(
       return void 0;
     },
     multiselect: false,
-    focusVisibleState: false
+    focusVisibleState: false,
+    valueToString: ListControlState.defaultValueToString
   }
 );
 function useListControlContext() {

package/dist-cjs/list-control/ListControlContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListControlContext.js","sources":["../src/list-control/ListControlContext.tsx"],"sourcesContent":["import { createContext } from \"@salt-ds/core\";\nimport { SyntheticEvent, useContext } from \"react\";\n\nexport interface OptionValue<Item> {\n  id: string;\n  disabled: boolean;\n  value: Item;\n  text: string;\n}\n\nexport type OpenChangeReason = \"input\" | \"manual\";\n\nexport interface ListControlContextValue<Item> {\n  openState: boolean;\n  setOpen: (newOpen: boolean, openChangeReason?: OpenChangeReason) => void;\n  register: (\n    optionValue: OptionValue<Item>,\n    element: HTMLElement\n  ) => () => void;\n  selectedState: unknown[];\n  select: (event: SyntheticEvent, option: OptionValue<Item>) => void;\n  activeState?: OptionValue<Item>;\n  setActive: (option: OptionValue<Item>) => void;\n  multiselect: boolean;\n  focusVisibleState: boolean;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any -- Need to use any here as a winder type but it gets narrowed when using the useListControl hook.\nexport const ListControlContext = createContext<ListControlContextValue<any>>(\n  \"ListControlContext\",\n  {\n    openState: false,\n    setOpen() {\n      return undefined;\n    },\n    register() {\n      return () => undefined;\n    },\n    selectedState: [],\n    select() {\n      return undefined;\n    },\n    activeState: undefined,\n    setActive() {\n      return undefined;\n    },\n    multiselect: false,\n    focusVisibleState: false,\n  }\n);\n\nexport function useListControlContext<Item>() {\n  return useContext(ListControlContext) as ListControlContextValue<Item>;\n}\n"],"names":["createContext","useContext"],"mappings":";;;;;;;AA4BO,MAAM,kBAAqB,GAAAA,kBAAA;AAAA,EAChC,oBAAA;AAAA,EACA;AAAA,IACE,SAAW,EAAA,KAAA;AAAA,IACX,OAAU,GAAA;AACR,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACT;AAAA,IACA,QAAW,GAAA;AACT,MAAA,OAAO,MAAM,KAAA,CAAA,CAAA;AAAA,KACf;AAAA,IACA,eAAe,EAAC;AAAA,IAChB,MAAS,GAAA;AACP,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACT;AAAA,IACA,WAAa,EAAA,KAAA,CAAA;AAAA,IACb,SAAY,GAAA;AACV,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACT;AAAA,IACA,WAAa,EAAA,KAAA;AAAA,IACb,iBAAmB,EAAA,KAAA;AAAA,GACrB;AACF,EAAA;AAEO,SAAS,qBAA8B,GAAA;AAC5C,EAAA,OAAOC,iBAAW,kBAAkB,CAAA,CAAA;AACtC;;;;;"}
+{"version":3,"file":"ListControlContext.js","sources":["../src/list-control/ListControlContext.tsx"],"sourcesContent":["import { createContext } from \"@salt-ds/core\";\nimport { SyntheticEvent, useContext } from \"react\";\nimport { defaultValueToString } from \"./ListControlState\";\n\nexport interface OptionValue<Item> {\n  id: string;\n  disabled: boolean;\n  value: Item;\n}\n\nexport type OpenChangeReason = \"input\" | \"manual\";\n\nexport interface ListControlContextValue<Item> {\n  openState: boolean;\n  setOpen: (newOpen: boolean, openChangeReason?: OpenChangeReason) => void;\n  register: (\n    optionValue: OptionValue<Item>,\n    element: HTMLElement\n  ) => () => void;\n  selectedState: unknown[];\n  select: (event: SyntheticEvent, option: OptionValue<Item>) => void;\n  activeState?: OptionValue<Item>;\n  setActive: (option: OptionValue<Item>) => void;\n  multiselect: boolean;\n  focusVisibleState: boolean;\n  valueToString: (item: Item) => string;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any -- Need to use any here as a winder type but it gets narrowed when using the useListControl hook.\nexport const ListControlContext = createContext<ListControlContextValue<any>>(\n  \"ListControlContext\",\n  {\n    openState: false,\n    setOpen() {\n      return undefined;\n    },\n    register() {\n      return () => undefined;\n    },\n    selectedState: [],\n    select() {\n      return undefined;\n    },\n    activeState: undefined,\n    setActive() {\n      return undefined;\n    },\n    multiselect: false,\n    focusVisibleState: false,\n    valueToString: defaultValueToString,\n  }\n);\n\nexport function useListControlContext<Item>() {\n  return useContext(ListControlContext) as ListControlContextValue<Item>;\n}\n"],"names":["createContext","defaultValueToString","useContext"],"mappings":";;;;;;;;AA6BO,MAAM,kBAAqB,GAAAA,kBAAA;AAAA,EAChC,oBAAA;AAAA,EACA;AAAA,IACE,SAAW,EAAA,KAAA;AAAA,IACX,OAAU,GAAA;AACR,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACT;AAAA,IACA,QAAW,GAAA;AACT,MAAA,OAAO,MAAM,KAAA,CAAA,CAAA;AAAA,KACf;AAAA,IACA,eAAe,EAAC;AAAA,IAChB,MAAS,GAAA;AACP,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACT;AAAA,IACA,WAAa,EAAA,KAAA,CAAA;AAAA,IACb,SAAY,GAAA;AACV,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACT;AAAA,IACA,WAAa,EAAA,KAAA;AAAA,IACb,iBAAmB,EAAA,KAAA;AAAA,IACnB,aAAe,EAAAC,qCAAA;AAAA,GACjB;AACF,EAAA;AAEO,SAAS,qBAA8B,GAAA;AAC5C,EAAA,OAAOC,iBAAW,kBAAkB,CAAA,CAAA;AACtC;;;;;"}

package/dist-cjs/list-control/ListControlState.js

@@ -5,6 +5,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 var core = require('@salt-ds/core');
 
+function defaultValueToString(item) {
+  return typeof item === "string" ? item : "";
+}
 function useListControl(props) {
   const {
     open: openProp,
@@ -14,19 +17,12 @@ function useListControl(props) {
     defaultSelected,
     selected: selectedProp,
     onSelectionChange,
-    defaultValue,
-    value,
     disabled,
-    readOnly
+    readOnly,
+    valueToString = defaultValueToString
   } = props;
   const [focusedState, setFocusedState] = React.useState(false);
   const [focusVisibleState, setFocusVisibleState] = React.useState(false);
-  const [valueState, setValueState] = core.useControlled({
-    controlled: value,
-    default: defaultValue,
-    name: "ListControl",
-    state: "value"
-  });
   const [activeState, setActiveState] = React.useState(
     void 0
   );
@@ -73,9 +69,6 @@ function useListControl(props) {
       }
     }
     setSelectedState(newSelected);
-    setValueState(
-      getOptionsMatching((option2) => newSelected.includes(option2.value)).map((option2) => option2.text).join(", ")
-    );
     onSelectionChange == null ? void 0 : onSelectionChange(event, newSelected);
     if (!multiselect) {
       setOpen(false);
@@ -83,7 +76,6 @@ function useListControl(props) {
   };
   const clear = (event) => {
     setSelectedState([]);
-    setValueState("");
     if (selectedState.length !== 0) {
       onSelectionChange == null ? void 0 : onSelectionChange(event, []);
     }
@@ -129,14 +121,20 @@ function useListControl(props) {
     const startIndex = startFrom ? getIndexOfOption(startFrom) + 1 : 0;
     const searchList = optionsRef.current.map((item) => item.value);
     let matches = searchList.filter(
-      (option) => collator.compare(option.text.substring(0, search.length), search) === 0
+      (option) => collator.compare(
+        valueToString(option.value).substring(0, search.length),
+        search
+      ) === 0
     );
     if (matches.length === 0) {
       const letters = search.split("");
       const allSameLetter = letters.length > 0 && letters.every((letter) => collator.compare(letter, letters[0]) === 0);
       if (allSameLetter) {
         matches = searchList.filter(
-          (option) => collator.compare(option.text[0].toLowerCase(), letters[0]) === 0
+          (option) => collator.compare(
+            valueToString(option.value)[0].toLowerCase(),
+            letters[0]
+          ) === 0
         );
       }
     }
@@ -174,8 +172,6 @@ function useListControl(props) {
     setSelectedState,
     select,
     clear,
-    valueState,
-    setValueState,
     focusVisibleState,
     setFocusVisibleState,
     focusedState,
@@ -186,9 +182,11 @@ function useListControl(props) {
     getOptionAtIndex,
     getIndexOfOption,
     getOptionsMatching,
-    getOptionFromSearch
+    getOptionFromSearch,
+    valueToString
   };
 }
 
+exports.defaultValueToString = defaultValueToString;
 exports.useListControl = useListControl;
 //# sourceMappingURL=ListControlState.js.map

package/dist-cjs/list-control/ListControlState.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListControlState.js","sources":["../src/list-control/ListControlState.ts"],"sourcesContent":["import {\n  SyntheticEvent,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { useControlled } from \"@salt-ds/core\";\nimport { OptionValue } from \"./ListControlContext\";\n\nexport type OpenChangeReason = \"input\" | \"manual\";\n\nexport interface ListControlProps<Item> {\n  disabled?: boolean;\n  readOnly?: boolean;\n  /**\n   * If true, the list will be open by default.\n   */\n  defaultOpen?: boolean;\n  /**\n   * If true, the list will be open. Useful for controlling the component.\n   */\n  open?: boolean;\n  /**\n   * Callback fired when the open state changes.\n   */\n  onOpenChange?: (newOpen: boolean, reason?: OpenChangeReason) => void;\n  /**\n   * The default selected options. If this is provided `defaultValue` should be provided as well.\n   */\n  defaultSelected?: Item[];\n  /**\n   * The selected options. The component will be controlled if this prop is provided.\n   */\n  selected?: Item[];\n  /**\n   * Callback fired when the selected options change.\n   */\n  onSelectionChange?: (event: SyntheticEvent, newSelected: Item[]) => void;\n  /**\n   * The default value.\n   */\n  defaultValue?: string | readonly string[] | number | undefined;\n  /**\n   * The value. The component will be controlled if this prop is provided.\n   */\n  value?: string | readonly string[] | number | undefined;\n  /**\n   * If true, multiple options can be selected.\n   */\n  multiselect?: boolean;\n}\n\nexport function useListControl<Item>(props: ListControlProps<Item>) {\n  const {\n    open: openProp,\n    defaultOpen,\n    onOpenChange,\n    multiselect,\n    defaultSelected,\n    selected: selectedProp,\n    onSelectionChange,\n    defaultValue,\n    value,\n    disabled,\n    readOnly,\n  } = props;\n\n  const [focusedState, setFocusedState] = useState(false);\n  const [focusVisibleState, setFocusVisibleState] = useState(false);\n\n  const [valueState, setValueState] = useControlled({\n    controlled: value,\n    default: defaultValue,\n    name: \"ListControl\",\n    state: \"value\",\n  });\n\n  const [activeState, setActiveState] = useState<OptionValue<Item> | undefined>(\n    undefined\n  );\n\n  const setActive = (option?: OptionValue<Item>) => {\n    if (option) {\n      setActiveState(option);\n    } else {\n      setActiveState(undefined);\n    }\n  };\n\n  const [openState, setOpenState] = useControlled({\n    controlled: openProp,\n    default: Boolean(defaultOpen),\n    name: \"ListControl\",\n    state: \"open\",\n  });\n\n  const openKey = useRef<string | undefined>(undefined);\n\n  const setOpen = (\n    newOpen: boolean,\n    reason?: OpenChangeReason,\n    key?: string\n  ) => {\n    if (disabled || readOnly) {\n      return;\n    }\n\n    setOpenState(newOpen);\n    openKey.current = key;\n\n    if (newOpen !== openState) {\n      onOpenChange?.(newOpen, reason);\n    }\n  };\n\n  const [selectedState, setSelectedState] = useControlled({\n    controlled: selectedProp,\n    default: defaultSelected ?? [],\n    name: \"ListControl\",\n    state: \"selected\",\n  });\n\n  const select = (event: SyntheticEvent, option: OptionValue<Item>) => {\n    if (option.disabled || readOnly || disabled) {\n      return;\n    }\n\n    let newSelected = [option.value];\n\n    if (multiselect) {\n      if (selectedState.includes(option.value)) {\n        newSelected = selectedState.filter((item) => item !== option.value);\n      } else {\n        newSelected = selectedState.concat([option.value]);\n      }\n    }\n\n    setSelectedState(newSelected);\n    setValueState(\n      getOptionsMatching((option) => newSelected.includes(option.value))\n        .map((option) => option.text)\n        .join(\", \")\n    );\n    onSelectionChange?.(event, newSelected);\n\n    if (!multiselect) {\n      setOpen(false);\n    }\n  };\n\n  const clear = (event: SyntheticEvent) => {\n    setSelectedState([]);\n    setValueState(\"\");\n    if (selectedState.length !== 0) {\n      onSelectionChange?.(event, []);\n    }\n  };\n\n  const optionsRef = useRef<\n    { value: OptionValue<Item>; element: HTMLElement }[]\n  >([]);\n\n  const register = useCallback(\n    (optionValue: OptionValue<Item>, element: HTMLElement) => {\n      const { id } = optionValue;\n      const option = optionsRef.current.find((item) => item.value.id === id);\n      const index = optionsRef.current.findIndex((option) => {\n        return (\n          option.element.compareDocumentPosition(element) &\n          Node.DOCUMENT_POSITION_PRECEDING\n        );\n      });\n\n      if (!option) {\n        if (index === -1) {\n          optionsRef.current.push({ value: optionValue, element });\n        } else {\n          optionsRef.current.splice(index, 0, { value: optionValue, element });\n        }\n      }\n\n      return () => {\n        optionsRef.current = optionsRef.current.filter(\n          (item) => item.value.id !== id\n        );\n      };\n    },\n    []\n  );\n\n  const getOptionAtIndex = (index: number) => {\n    return optionsRef.current[index]?.value;\n  };\n\n  const getIndexOfOption = (option: OptionValue<Item>) => {\n    return optionsRef.current.findIndex((item) => item.value.id === option.id);\n  };\n\n  const getOptionsMatching = (\n    predicate: (option: OptionValue<Item>) => boolean\n  ) => {\n    return optionsRef.current\n      .filter((item) => predicate(item.value))\n      .map((item) => item.value);\n  };\n\n  const getOptionFromSearch = (\n    search: string,\n    startFrom?: OptionValue<Item>\n  ) => {\n    const collator = new Intl.Collator(\"en\", {\n      usage: \"search\",\n      sensitivity: \"base\",\n    });\n\n    const startIndex = startFrom ? getIndexOfOption(startFrom) + 1 : 0;\n    const searchList = optionsRef.current.map((item) => item.value);\n\n    let matches = searchList.filter(\n      (option) =>\n        collator.compare(option.text.substring(0, search.length), search) === 0\n    );\n\n    if (matches.length === 0) {\n      const letters = search.split(\"\");\n      const allSameLetter =\n        letters.length > 0 &&\n        letters.every((letter) => collator.compare(letter, letters[0]) === 0);\n      if (allSameLetter) {\n        matches = searchList.filter(\n          (option) =>\n            collator.compare(option.text[0].toLowerCase(), letters[0]) === 0\n        );\n      }\n    }\n\n    return matches.find((option) => getIndexOfOption(option) >= startIndex);\n  };\n\n  const listRef = useRef<HTMLDivElement>(null);\n  useEffect(() => {\n    if (listRef.current) {\n      const activeElement = optionsRef.current.find(\n        (option) => option.value === activeState\n      )?.element;\n\n      if (!activeElement) {\n        return;\n      }\n\n      const { scrollTop } = listRef.current;\n      const { offsetTop, offsetHeight } = activeElement;\n\n      const isVisible =\n        offsetTop >= scrollTop &&\n        offsetTop + offsetHeight <= scrollTop + listRef.current.offsetHeight;\n\n      if (!isVisible) {\n        activeElement.scrollIntoView({\n          block: \"end\",\n          inline: \"nearest\",\n        });\n      }\n    }\n  }, [activeState]);\n\n  return {\n    multiselect: Boolean(multiselect),\n    openState,\n    setOpen,\n    openKey,\n    activeState,\n    setActive,\n    selectedState,\n    setSelectedState,\n    select,\n    clear,\n    valueState,\n    setValueState,\n    focusVisibleState,\n    setFocusVisibleState,\n    focusedState,\n    setFocusedState,\n    listRef,\n    options: optionsRef.current.map((option) => option.element),\n    register,\n    getOptionAtIndex,\n    getIndexOfOption,\n    getOptionsMatching,\n    getOptionFromSearch,\n  };\n}\n"],"names":["useState","useControlled","useRef","option","useCallback","useEffect"],"mappings":"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"}
+{"version":3,"file":"ListControlState.js","sources":["../src/list-control/ListControlState.ts"],"sourcesContent":["import {\n  SyntheticEvent,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { useControlled } from \"@salt-ds/core\";\nimport { OptionValue } from \"./ListControlContext\";\n\nexport type OpenChangeReason = \"input\" | \"manual\";\n\nexport type ListControlProps<Item> = {\n  /**\n   * If true, the control will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * If true, the control will be read-only.\n   */\n  readOnly?: boolean;\n  /**\n   * If true, the list will be open by default.\n   */\n  defaultOpen?: boolean;\n  /**\n   * If true, the list will be open. Useful for controlling the component.\n   */\n  open?: boolean;\n  /**\n   * Callback fired when the open state changes.\n   */\n  onOpenChange?: (newOpen: boolean, reason?: OpenChangeReason) => void;\n  /**\n   * The default selected options. If this is provided `defaultValue` should be provided as well.\n   */\n  defaultSelected?: Item[];\n  /**\n   * The selected options. The component will be controlled if this prop is provided.\n   */\n  selected?: Item[];\n  /**\n   * Callback fired when the selected options change.\n   */\n  onSelectionChange?: (event: SyntheticEvent, newSelected: Item[]) => void;\n  /**\n   * If true, multiple options can be selected.\n   */\n  multiselect?: boolean;\n  /**\n   * Callback used to convert an option's `value` to a string. This is needed when the value is different to the display value or the value is not a string.\n   */\n  valueToString?: (item: Item) => string;\n};\n\nexport function defaultValueToString<Item>(item: Item): string {\n  return typeof item === \"string\" ? item : \"\";\n}\n\nexport function useListControl<Item>(props: ListControlProps<Item>) {\n  const {\n    open: openProp,\n    defaultOpen,\n    onOpenChange,\n    multiselect,\n    defaultSelected,\n    selected: selectedProp,\n    onSelectionChange,\n    disabled,\n    readOnly,\n    valueToString = defaultValueToString,\n  } = props;\n\n  const [focusedState, setFocusedState] = useState(false);\n  const [focusVisibleState, setFocusVisibleState] = useState(false);\n\n  const [activeState, setActiveState] = useState<OptionValue<Item> | undefined>(\n    undefined\n  );\n\n  const setActive = (option?: OptionValue<Item>) => {\n    if (option) {\n      setActiveState(option);\n    } else {\n      setActiveState(undefined);\n    }\n  };\n\n  const [openState, setOpenState] = useControlled({\n    controlled: openProp,\n    default: Boolean(defaultOpen),\n    name: \"ListControl\",\n    state: \"open\",\n  });\n\n  const openKey = useRef<string | undefined>(undefined);\n\n  const setOpen = (\n    newOpen: boolean,\n    reason?: OpenChangeReason,\n    key?: string\n  ) => {\n    if (disabled || readOnly) {\n      return;\n    }\n\n    setOpenState(newOpen);\n    openKey.current = key;\n\n    if (newOpen !== openState) {\n      onOpenChange?.(newOpen, reason);\n    }\n  };\n\n  const [selectedState, setSelectedState] = useControlled({\n    controlled: selectedProp,\n    default: defaultSelected ?? [],\n    name: \"ListControl\",\n    state: \"selected\",\n  });\n\n  const select = (event: SyntheticEvent, option: OptionValue<Item>) => {\n    if (option.disabled || readOnly || disabled) {\n      return;\n    }\n\n    let newSelected = [option.value];\n\n    if (multiselect) {\n      if (selectedState.includes(option.value)) {\n        newSelected = selectedState.filter((item) => item !== option.value);\n      } else {\n        newSelected = selectedState.concat([option.value]);\n      }\n    }\n\n    setSelectedState(newSelected);\n    onSelectionChange?.(event, newSelected);\n\n    if (!multiselect) {\n      setOpen(false);\n    }\n  };\n\n  const clear = (event: SyntheticEvent) => {\n    setSelectedState([]);\n    if (selectedState.length !== 0) {\n      onSelectionChange?.(event, []);\n    }\n  };\n\n  const optionsRef = useRef<\n    { value: OptionValue<Item>; element: HTMLElement }[]\n  >([]);\n\n  const register = useCallback(\n    (optionValue: OptionValue<Item>, element: HTMLElement) => {\n      const { id } = optionValue;\n      const option = optionsRef.current.find((item) => item.value.id === id);\n      const index = optionsRef.current.findIndex((option) => {\n        return (\n          option.element.compareDocumentPosition(element) &\n          Node.DOCUMENT_POSITION_PRECEDING\n        );\n      });\n\n      if (!option) {\n        if (index === -1) {\n          optionsRef.current.push({ value: optionValue, element });\n        } else {\n          optionsRef.current.splice(index, 0, { value: optionValue, element });\n        }\n      }\n\n      return () => {\n        optionsRef.current = optionsRef.current.filter(\n          (item) => item.value.id !== id\n        );\n      };\n    },\n    []\n  );\n\n  const getOptionAtIndex = (index: number) => {\n    return optionsRef.current[index]?.value;\n  };\n\n  const getIndexOfOption = (option: OptionValue<Item>) => {\n    return optionsRef.current.findIndex((item) => item.value.id === option.id);\n  };\n\n  const getOptionsMatching = (\n    predicate: (option: OptionValue<Item>) => boolean\n  ) => {\n    return optionsRef.current\n      .filter((item) => predicate(item.value))\n      .map((item) => item.value);\n  };\n\n  const getOptionFromSearch = (\n    search: string,\n    startFrom?: OptionValue<Item>\n  ) => {\n    const collator = new Intl.Collator(\"en\", {\n      usage: \"search\",\n      sensitivity: \"base\",\n    });\n\n    const startIndex = startFrom ? getIndexOfOption(startFrom) + 1 : 0;\n    const searchList = optionsRef.current.map((item) => item.value);\n\n    let matches = searchList.filter(\n      (option) =>\n        collator.compare(\n          valueToString(option.value).substring(0, search.length),\n          search\n        ) === 0\n    );\n\n    if (matches.length === 0) {\n      const letters = search.split(\"\");\n      const allSameLetter =\n        letters.length > 0 &&\n        letters.every((letter) => collator.compare(letter, letters[0]) === 0);\n      if (allSameLetter) {\n        matches = searchList.filter(\n          (option) =>\n            collator.compare(\n              valueToString(option.value)[0].toLowerCase(),\n              letters[0]\n            ) === 0\n        );\n      }\n    }\n\n    return matches.find((option) => getIndexOfOption(option) >= startIndex);\n  };\n\n  const listRef = useRef<HTMLDivElement>(null);\n  useEffect(() => {\n    if (listRef.current) {\n      const activeElement = optionsRef.current.find(\n        (option) => option.value === activeState\n      )?.element;\n\n      if (!activeElement) {\n        return;\n      }\n\n      const { scrollTop } = listRef.current;\n      const { offsetTop, offsetHeight } = activeElement;\n\n      const isVisible =\n        offsetTop >= scrollTop &&\n        offsetTop + offsetHeight <= scrollTop + listRef.current.offsetHeight;\n\n      if (!isVisible) {\n        activeElement.scrollIntoView({\n          block: \"end\",\n          inline: \"nearest\",\n        });\n      }\n    }\n  }, [activeState]);\n\n  return {\n    multiselect: Boolean(multiselect),\n    openState,\n    setOpen,\n    openKey,\n    activeState,\n    setActive,\n    selectedState,\n    setSelectedState,\n    select,\n    clear,\n    focusVisibleState,\n    setFocusVisibleState,\n    focusedState,\n    setFocusedState,\n    listRef,\n    options: optionsRef.current.map((option) => option.element),\n    register,\n    getOptionAtIndex,\n    getIndexOfOption,\n    getOptionsMatching,\n    getOptionFromSearch,\n    valueToString,\n  };\n}\n"],"names":["useState","useControlled","useRef","useCallback","option","useEffect"],"mappings":"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"}

package/dist-cjs/option/Option.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = ".saltOption {\n  color: var(--salt-content-primary-foreground);\n  background: var(--salt-selectable-background);\n  font-size: var(--salt-text-fontSize);\n  font-weight: var(--salt-text-fontWeight);\n  min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  padding-left: var(--salt-spacing-100);\n  padding-right: var(--salt-spacing-100);\n  display: flex;\n  gap: var(--salt-spacing-100);\n  position: relative;\n  align-items: center;\n  margin-top: var(--salt-size-border);\n  margin-bottom: var(--salt-size-border);\n  border-top: var(--salt-size-border) var(--salt-container-borderStyle) transparent;\n  border-bottom: var(--salt-size-border) var(--salt-container-borderStyle) transparent;\n  cursor: var(--salt-selectable-cursor-hover);\n}\n\n.saltOption-active {\n  background: var(--salt-selectable-background-hover);\n}\n\n.saltOption-focusVisible {\n  outline: var(--salt-focused-outline);\n  outline-offset: calc(var(--salt-size-border) * -2);\n}\n\n.saltOption:hover {\n  background: var(--salt-selectable-background-hover);\n}\n\n.saltOption[aria-selected=\"true\"] {\n  background: var(--salt-selectable-background-selected);\n  border-color: var(--salt-selectable-borderColor-selected);\n}\n\n.saltOption[aria-disabled=\"true\"] {\n  color: var(--salt-content-primary-foreground-disabled);\n}\n";
+var css_248z = ".saltOption {\n  color: var(--salt-content-primary-foreground);\n  background: var(--salt-selectable-background);\n  font-size: var(--salt-text-fontSize);\n  font-weight: var(--salt-text-fontWeight);\n  min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  padding-left: var(--salt-spacing-100);\n  padding-right: var(--salt-spacing-100);\n  display: flex;\n  gap: var(--salt-spacing-100);\n  position: relative;\n  align-items: center;\n  margin-top: var(--salt-size-border);\n  margin-bottom: var(--salt-size-border);\n  border-top: var(--salt-size-border) var(--salt-container-borderStyle) transparent;\n  border-bottom: var(--salt-size-border) var(--salt-container-borderStyle) transparent;\n  cursor: var(--salt-selectable-cursor-hover);\n  box-sizing: border-box;\n}\n\n.saltOption-active {\n  background: var(--salt-selectable-background-hover);\n}\n\n.saltOption-focusVisible {\n  outline: var(--salt-focused-outline);\n  outline-offset: calc(var(--salt-size-border) * -2);\n}\n\n.saltOption:hover {\n  background: var(--salt-selectable-background-hover);\n}\n\n.saltOption[aria-selected=\"true\"] {\n  background: var(--salt-selectable-background-selected);\n  border-color: var(--salt-selectable-borderColor-selected);\n}\n\n.saltOption[aria-disabled=\"true\"] {\n  color: var(--salt-content-primary-foreground-disabled);\n  cursor: var(--salt-selectable-cursor-disabled);\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=Option.css.js.map