@salt-ds/core 1.31.0 → 1.32.0

package/dist-es/menu/MenuPanelContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuPanelContext.js","sources":["../src/menu/MenuPanelContext.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport { MenuContextValue } from \"./MenuContext\";\nimport { createContext } from \"../utils\";\n\nexport interface MenuPanelContextValue\n  extends Pick<\n    MenuContextValue,\n    \"getItemProps\" | \"activeIndex\" | \"setFocusInside\"\n  > {}\n\nexport const MenuPanelContext = createContext<MenuPanelContextValue>(\n  \"MenuPanelContext\",\n  {\n    activeIndex: null,\n    getItemProps: () => ({}),\n    setFocusInside: () => undefined,\n  }\n);\n\nexport function useMenuPanelContext() {\n  return useContext(MenuPanelContext);\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUO,MAAM,gBAAmB,GAAA,aAAA;AAAA,EAC9B,kBAAA;AAAA,EACA;AAAA,IACE,WAAa,EAAA,IAAA;AAAA,IACb,YAAA,EAAc,OAAO,EAAC,CAAA;AAAA,IACtB,gBAAgB,MAAM,KAAA,CAAA;AAAA,GACxB;AACF,EAAA;AAEO,SAAS,mBAAsB,GAAA;AACpC,EAAA,OAAO,WAAW,gBAAgB,CAAA,CAAA;AACpC;;;;"}
+{"version":3,"file":"MenuPanelContext.js","sources":["../src/menu/MenuPanelContext.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport { createContext } from \"../utils\";\nimport type { MenuContextValue } from \"./MenuContext\";\n\nexport interface MenuPanelContextValue\n  extends Pick<\n    MenuContextValue,\n    \"getItemProps\" | \"activeIndex\" | \"setFocusInside\"\n  > {}\n\nexport const MenuPanelContext = createContext<MenuPanelContextValue>(\n  \"MenuPanelContext\",\n  {\n    activeIndex: null,\n    getItemProps: () => ({}),\n    setFocusInside: () => undefined,\n  },\n);\n\nexport function useMenuPanelContext() {\n  return useContext(MenuPanelContext);\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUO,MAAM,gBAAmB,GAAA,aAAA;AAAA,EAC9B,kBAAA;AAAA,EACA;AAAA,IACE,WAAa,EAAA,IAAA;AAAA,IACb,YAAA,EAAc,OAAO,EAAC,CAAA;AAAA,IACtB,gBAAgB,MAAM,KAAA,CAAA;AAAA,GACxB;AACF,EAAA;AAEO,SAAS,mBAAsB,GAAA;AACpC,EAAA,OAAO,WAAW,gBAAgB,CAAA,CAAA;AACpC;;;;"}

package/dist-es/menu/MenuTrigger.js

@@ -1,8 +1,5 @@
 import { jsx, Fragment } from 'react/jsx-runtime';
 import { isValidElement, cloneElement } from 'react';
-import { useMenuContext } from './MenuContext.js';
-import { MenuTriggerContext } from './MenuTriggerContext.js';
-import { useMenuPanelContext } from './MenuPanelContext.js';
 import '../utils/useFloatingUI/useFloatingUI.js';
 import { useForkRef } from '../utils/useForkRef.js';
 import '../utils/useId.js';
@@ -26,10 +23,10 @@ import '../button/Button.js';
 import '../card/Card.js';
 import '../checkbox/Checkbox.js';
 import '../checkbox/CheckboxGroup.js';
-import 'clsx';
+import '@salt-ds/icons';
 import '@salt-ds/styles';
 import '@salt-ds/window';
-import '@salt-ds/icons';
+import 'clsx';
 import '../combo-box/ComboBox.js';
 import '../dialog/Dialog.js';
 import '../dialog/DialogHeader.js';
@@ -48,6 +45,7 @@ import '../flex-item/FlexItem.js';
 import '../flex-layout/FlexLayout.js';
 import '../flow-layout/FlowLayout.js';
 import '../form-field/FormField.js';
+import '../form-field-context/FormFieldContext.js';
 import '../status-indicator/StatusIndicator.js';
 import '../text/Text.js';
 import '../text/Code.js';
@@ -56,7 +54,6 @@ import '../text/Headings.js';
 import '../text/Label.js';
 import '../text/TextAction.js';
 import '../text/TextNotation.js';
-import '../form-field-context/FormFieldContext.js';
 import '../grid-item/GridItem.js';
 import '../grid-layout/GridLayout.js';
 import '../input/Input.js';
@@ -68,8 +65,11 @@ import '../link-card/LinkCard.js';
 import '../list-box/ListBox.js';
 import '../list-control/ListControlContext.js';
 import '@floating-ui/react';
+import { useMenuContext } from './MenuContext.js';
 import './MenuItem.js';
 import './MenuPanel.js';
+import { useMenuPanelContext } from './MenuPanelContext.js';
+import { MenuTriggerContext } from './MenuTriggerContext.js';
 import './MenuGroup.js';
 import '../multiline-input/MultilineInput.js';
 import '../navigation-item/NavigationItem.js';
@@ -105,13 +105,14 @@ import '../toggle-button/ToggleButton.js';
 import '../toggle-button-group/ToggleButtonGroup.js';
 import '../toggle-button-group/ToggleButtonGroupContext.js';
 import '../tooltip/Tooltip.js';
+import { getRefFromChildren } from '../utils/getRefFromChildren.js';
 
 function MenuTrigger(props) {
   const { children } = props;
   const { getReferenceProps, refs, setFocusInside, focusInside, openState } = useMenuContext();
   const { setFocusInside: setFocusInsideParent } = useMenuPanelContext();
   const handleRef = useForkRef(
-    isValidElement(children) ? children.ref : null,
+    getRefFromChildren(children),
     refs == null ? void 0 : refs.setReference
   );
   if (!children || !isValidElement(children)) {

package/dist-es/menu/MenuTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuTrigger.js","sources":["../src/menu/MenuTrigger.tsx"],"sourcesContent":["import { cloneElement, isValidElement, ReactNode } from \"react\";\nimport { useMenuContext } from \"./MenuContext\";\nimport { MenuTriggerContext } from \"./MenuTriggerContext\";\nimport { useMenuPanelContext } from \"./MenuPanelContext\";\nimport { mergeProps, useForkRef } from \"../utils\";\n\nexport interface MenuTriggerProps {\n  /**\n   * The trigger element for the menu. This should be a single child element and accept a ref.\n   */\n  children?: ReactNode;\n}\n\nexport function MenuTrigger(props: MenuTriggerProps) {\n  const { children } = props;\n\n  const { getReferenceProps, refs, setFocusInside, focusInside, openState } =\n    useMenuContext();\n  const { setFocusInside: setFocusInsideParent } = useMenuPanelContext();\n\n  const handleRef = useForkRef(\n    // @ts-expect-error error TS2339 missing property ref\n    isValidElement(children) ? children.ref : null,\n    refs?.setReference\n  );\n\n  if (!children || !isValidElement(children)) {\n    // Should we log or throw error?\n    return <>{children}</>;\n  }\n\n  return (\n    <MenuTriggerContext.Provider\n      value={{ triggersSubmenu: true, blurActive: focusInside && openState }}\n    >\n      {cloneElement(children, {\n        ...mergeProps(\n          getReferenceProps({\n            onFocus() {\n              setFocusInsideParent(true);\n              setFocusInside(false);\n            },\n          }),\n          children.props\n        ),\n        ref: handleRef,\n      })}\n    </MenuTriggerContext.Provider>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaO,SAAS,YAAY,KAAyB,EAAA;AACnD,EAAM,MAAA,EAAE,UAAa,GAAA,KAAA,CAAA;AAErB,EAAA,MAAM,EAAE,iBAAmB,EAAA,IAAA,EAAM,gBAAgB,WAAa,EAAA,SAAA,KAC5D,cAAe,EAAA,CAAA;AACjB,EAAA,MAAM,EAAE,cAAA,EAAgB,oBAAqB,EAAA,GAAI,mBAAoB,EAAA,CAAA;AAErE,EAAA,MAAM,SAAY,GAAA,UAAA;AAAA,IAEhB,cAAe,CAAA,QAAQ,CAAI,GAAA,QAAA,CAAS,GAAM,GAAA,IAAA;AAAA,IAC1C,IAAM,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,IAAA,CAAA,YAAA;AAAA,GACR,CAAA;AAEA,EAAA,IAAI,CAAC,QAAA,IAAY,CAAC,cAAA,CAAe,QAAQ,CAAG,EAAA;AAE1C,IAAO,uBAAA,GAAA,CAAA,QAAA,EAAA;AAAA,MAAG,QAAA;AAAA,KAAS,CAAA,CAAA;AAAA,GACrB;AAEA,EACE,uBAAA,GAAA,CAAC,mBAAmB,QAAnB,EAAA;AAAA,IACC,OAAO,EAAE,eAAA,EAAiB,IAAM,EAAA,UAAA,EAAY,eAAe,SAAU,EAAA;AAAA,IAEpE,uBAAa,QAAU,EAAA;AAAA,MACtB,GAAG,UAAA;AAAA,QACD,iBAAkB,CAAA;AAAA,UAChB,OAAU,GAAA;AACR,YAAA,oBAAA,CAAqB,IAAI,CAAA,CAAA;AACzB,YAAA,cAAA,CAAe,KAAK,CAAA,CAAA;AAAA,WACtB;AAAA,SACD,CAAA;AAAA,QACD,QAAS,CAAA,KAAA;AAAA,OACX;AAAA,MACA,GAAK,EAAA,SAAA;AAAA,KACN,CAAA;AAAA,GACH,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"MenuTrigger.js","sources":["../src/menu/MenuTrigger.tsx"],"sourcesContent":["import { type ReactNode, cloneElement, isValidElement } from \"react\";\nimport { getRefFromChildren, mergeProps, useForkRef } from \"../utils\";\nimport { useMenuContext } from \"./MenuContext\";\nimport { useMenuPanelContext } from \"./MenuPanelContext\";\nimport { MenuTriggerContext } from \"./MenuTriggerContext\";\n\nexport interface MenuTriggerProps {\n  /**\n   * The trigger element for the menu. This should be a single child element and accept a ref.\n   */\n  children?: ReactNode;\n}\n\nexport function MenuTrigger(props: MenuTriggerProps) {\n  const { children } = props;\n\n  const { getReferenceProps, refs, setFocusInside, focusInside, openState } =\n    useMenuContext();\n  const { setFocusInside: setFocusInsideParent } = useMenuPanelContext();\n\n  const handleRef = useForkRef(\n    getRefFromChildren(children),\n    refs?.setReference,\n  );\n\n  if (!children || !isValidElement(children)) {\n    // Should we log or throw error?\n    return <>{children}</>;\n  }\n\n  return (\n    <MenuTriggerContext.Provider\n      value={{ triggersSubmenu: true, blurActive: focusInside && openState }}\n    >\n      {cloneElement(children, {\n        ...mergeProps(\n          getReferenceProps({\n            onFocus() {\n              setFocusInsideParent(true);\n              setFocusInside(false);\n            },\n          }),\n          children.props,\n        ),\n        ref: handleRef,\n      })}\n    </MenuTriggerContext.Provider>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaO,SAAS,YAAY,KAAyB,EAAA;AACnD,EAAM,MAAA,EAAE,UAAa,GAAA,KAAA,CAAA;AAErB,EAAA,MAAM,EAAE,iBAAmB,EAAA,IAAA,EAAM,gBAAgB,WAAa,EAAA,SAAA,KAC5D,cAAe,EAAA,CAAA;AACjB,EAAA,MAAM,EAAE,cAAA,EAAgB,oBAAqB,EAAA,GAAI,mBAAoB,EAAA,CAAA;AAErE,EAAA,MAAM,SAAY,GAAA,UAAA;AAAA,IAChB,mBAAmB,QAAQ,CAAA;AAAA,IAC3B,IAAM,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,IAAA,CAAA,YAAA;AAAA,GACR,CAAA;AAEA,EAAA,IAAI,CAAC,QAAA,IAAY,CAAC,cAAA,CAAe,QAAQ,CAAG,EAAA;AAE1C,IAAO,uBAAA,GAAA,CAAA,QAAA,EAAA;AAAA,MAAG,QAAA;AAAA,KAAS,CAAA,CAAA;AAAA,GACrB;AAEA,EACE,uBAAA,GAAA,CAAC,mBAAmB,QAAnB,EAAA;AAAA,IACC,OAAO,EAAE,eAAA,EAAiB,IAAM,EAAA,UAAA,EAAY,eAAe,SAAU,EAAA;AAAA,IAEpE,uBAAa,QAAU,EAAA;AAAA,MACtB,GAAG,UAAA;AAAA,QACD,iBAAkB,CAAA;AAAA,UAChB,OAAU,GAAA;AACR,YAAA,oBAAA,CAAqB,IAAI,CAAA,CAAA;AACzB,YAAA,cAAA,CAAe,KAAK,CAAA,CAAA;AAAA,WACtB;AAAA,SACD,CAAA;AAAA,QACD,QAAS,CAAA,KAAA;AAAA,OACX;AAAA,MACA,GAAK,EAAA,SAAA;AAAA,KACN,CAAA;AAAA,GACH,CAAA,CAAA;AAEJ;;;;"}

package/dist-es/menu/MenuTriggerContext.js

@@ -23,9 +23,9 @@ import '../button/Button.js';
 import '../card/Card.js';
 import '../checkbox/Checkbox.js';
 import '../checkbox/CheckboxGroup.js';
+import '@salt-ds/icons';
 import '@salt-ds/styles';
 import '@salt-ds/window';
-import '@salt-ds/icons';
 import '../combo-box/ComboBox.js';
 import '../dialog/Dialog.js';
 import '../dialog/DialogHeader.js';
@@ -44,6 +44,7 @@ import '../flex-item/FlexItem.js';
 import '../flex-layout/FlexLayout.js';
 import '../flow-layout/FlowLayout.js';
 import '../form-field/FormField.js';
+import '../form-field-context/FormFieldContext.js';
 import '../status-indicator/StatusIndicator.js';
 import '../text/Text.js';
 import '../text/Code.js';
@@ -52,7 +53,6 @@ import '../text/Headings.js';
 import '../text/Label.js';
 import '../text/TextAction.js';
 import '../text/TextNotation.js';
-import '../form-field-context/FormFieldContext.js';
 import '../grid-item/GridItem.js';
 import '../grid-layout/GridLayout.js';
 import '../input/Input.js';
@@ -63,8 +63,8 @@ import '../link/Link.js';
 import '../link-card/LinkCard.js';
 import '../list-box/ListBox.js';
 import '../list-control/ListControlContext.js';
-import './MenuContext.js';
 import '@floating-ui/react';
+import './MenuContext.js';
 import './MenuItem.js';
 import './MenuPanel.js';
 import './MenuPanelContext.js';

package/dist-es/menu/MenuTriggerContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuTriggerContext.js","sources":["../src/menu/MenuTriggerContext.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport { createContext } from \"../utils\";\n\nexport interface MenuTriggerContextValue {\n  triggersSubmenu: boolean;\n  blurActive: boolean;\n}\n\nexport const MenuTriggerContext = createContext<MenuTriggerContextValue>(\n  \"MenuTriggerContext\",\n  { triggersSubmenu: false, blurActive: false }\n);\n\nexport function useIsMenuTrigger() {\n  return useContext(MenuTriggerContext);\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQO,MAAM,kBAAqB,GAAA,aAAA;AAAA,EAChC,oBAAA;AAAA,EACA,EAAE,eAAA,EAAiB,KAAO,EAAA,UAAA,EAAY,KAAM,EAAA;AAC9C,EAAA;AAEO,SAAS,gBAAmB,GAAA;AACjC,EAAA,OAAO,WAAW,kBAAkB,CAAA,CAAA;AACtC;;;;"}
+{"version":3,"file":"MenuTriggerContext.js","sources":["../src/menu/MenuTriggerContext.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport { createContext } from \"../utils\";\n\nexport interface MenuTriggerContextValue {\n  triggersSubmenu: boolean;\n  blurActive: boolean;\n}\n\nexport const MenuTriggerContext = createContext<MenuTriggerContextValue>(\n  \"MenuTriggerContext\",\n  { triggersSubmenu: false, blurActive: false },\n);\n\nexport function useIsMenuTrigger() {\n  return useContext(MenuTriggerContext);\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQO,MAAM,kBAAqB,GAAA,aAAA;AAAA,EAChC,oBAAA;AAAA,EACA,EAAE,eAAA,EAAiB,KAAO,EAAA,UAAA,EAAY,KAAM,EAAA;AAC9C,EAAA;AAEO,SAAS,gBAAmB,GAAA;AACjC,EAAA,OAAO,WAAW,kBAAkB,CAAA,CAAA;AACtC;;;;"}

package/dist-es/multiline-input/MultilineInput.js

@@ -1,8 +1,8 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { clsx } from 'clsx';
-import { forwardRef, useRef, useState, useCallback, useLayoutEffect } from 'react';
 import { useComponentCssInjection } from '@salt-ds/styles';
 import { useWindow } from '@salt-ds/window';
+import { clsx } from 'clsx';
+import { forwardRef, useRef, useState, useCallback, useLayoutEffect } from 'react';
 import '../form-field-context/FormFieldContext.js';
 import { useFormFieldProps } from '../form-field-context/useFormFieldProps.js';
 import { StatusAdornment } from '../status-adornment/StatusAdornment.js';
@@ -67,12 +67,12 @@ import '../link/Link.js';
 import '../link-card/LinkCard.js';
 import '../list-box/ListBox.js';
 import '../list-control/ListControlContext.js';
-import '../menu/MenuContext.js';
 import '@floating-ui/react';
+import '../menu/MenuContext.js';
 import '../menu/MenuItem.js';
 import '../menu/MenuPanel.js';
-import '../menu/MenuTriggerContext.js';
 import '../menu/MenuPanelContext.js';
+import '../menu/MenuTriggerContext.js';
 import '../menu/MenuGroup.js';
 import '../navigation-item/NavigationItem.js';
 import '../option/Option.js';

package/dist-es/multiline-input/MultilineInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"MultilineInput.js","sources":["../src/multiline-input/MultilineInput.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ChangeEvent,\n  ComponentPropsWithoutRef,\n  FocusEvent,\n  forwardRef,\n  ReactNode,\n  Ref,\n  TextareaHTMLAttributes,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { StatusAdornment } from \"../status-adornment\";\nimport { makePrefixer, useControlled, useForkRef } from \"../utils\";\n\nimport multilineInputCss from \"./MultilineInput.css\";\n\nconst withBaseName = makePrefixer(\"saltMultilineInput\");\n\nexport interface MultilineInputProps\n  extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\">,\n    Pick<\n      ComponentPropsWithoutRef<\"textarea\">,\n      \"disabled\" | \"value\" | \"defaultValue\" | \"placeholder\"\n    > {\n  /**\n   * Styling variant with full border. Defaults to false\n   */\n  bordered?: boolean;\n  /**\n   * End adornment component\n   */\n  endAdornment?: ReactNode;\n  /**\n   * If `true`, the component is read only.\n   */\n  readOnly?: boolean;\n  /**\n   * The default minimum number of rows. Defaults to 3\n   */\n  rows?: number;\n  /**\n   * Start adornment component\n   */\n  startAdornment?: ReactNode;\n  /**\n   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#Attributes) applied to the `textarea` element.\n   */\n  textAreaProps?: TextareaHTMLAttributes<HTMLTextAreaElement>;\n  /**\n   * Optional ref for the textarea component\n   */\n  textAreaRef?: Ref<HTMLTextAreaElement>;\n  /**\n   * Validation status.\n   */\n  validationStatus?: \"error\" | \"warning\" | \"success\";\n  /**\n   * Styling variant. Defaults to \"primary\".\n   */\n  variant?: \"primary\" | \"secondary\";\n}\n\nexport const MultilineInput = forwardRef<HTMLDivElement, MultilineInputProps>(\n  function MultilineInput(\n    {\n      \"aria-activedescendant\": ariaActiveDescendant,\n      \"aria-expanded\": ariaExpanded,\n      \"aria-owns\": ariaOwns,\n      bordered = false,\n      className: classNameProp,\n      disabled,\n      endAdornment,\n      id,\n      placeholder,\n      readOnly,\n      role,\n      rows = 3,\n      startAdornment,\n      style,\n      textAreaProps = {},\n      textAreaRef,\n      value: valueProp,\n      defaultValue: defaultValueProp = valueProp === undefined ? \"\" : undefined,\n      validationStatus: validationStatusProp,\n      variant = \"primary\",\n      ...other\n    },\n    ref\n  ) {\n    const inputRef = useRef<HTMLTextAreaElement>(null);\n    const handleRef = useForkRef(inputRef, textAreaRef);\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-multiline-input\",\n      css: multilineInputCss,\n      window: targetWindow,\n    });\n\n    const restA11yProps = {\n      \"aria-activedescendant\": ariaActiveDescendant,\n      \"aria-expanded\": ariaExpanded,\n      \"aria-owns\": ariaOwns,\n    };\n\n    const [focused, setFocused] = useState(false);\n\n    const {\n      \"aria-describedby\": textAreaDescribedBy,\n      \"aria-labelledby\": textAreaLabelledBy,\n      onBlur,\n      onChange,\n      onFocus,\n      required: textAreaRequired,\n      ...restTextAreaProps\n    } = textAreaProps;\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 isDisabled = disabled || formFieldDisabled;\n    const isReadOnly = readOnly || formFieldReadOnly;\n    const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n    const isRequired = formFieldRequired\n      ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n      : textAreaRequired;\n\n    const [value, setValue] = useControlled({\n      controlled: valueProp,\n      default: defaultValueProp,\n      name: \"MultilineInput\",\n      state: \"value\",\n    });\n\n    const previousHeight = useRef<string | undefined>(undefined);\n    const input = inputRef.current;\n\n    const changeHeight = useCallback(() => {\n      if (!input) return;\n      const hasBeenManuallyResized =\n        previousHeight.current !== undefined &&\n        input.style.height !== previousHeight.current;\n      if (!hasBeenManuallyResized) {\n        const previousOverflow = input.style.overflow;\n        input.style.overflow = \"hidden\";\n        input.style.height = \"auto\";\n        input.scrollHeight; // Needed to work around Firefox bug. https://bugzilla.mozilla.org/show_bug.cgi?id=1787062\n        const newHeight = `${\n          input.scrollHeight + (input.offsetHeight - input.clientHeight)\n        }px`;\n        input.style.height = newHeight;\n        previousHeight.current = newHeight;\n        input.style.overflow = previousOverflow;\n      }\n    }, [input]);\n\n    const handleChange = (event: ChangeEvent<HTMLTextAreaElement>) => {\n      const value = event.target.value;\n      setValue(value);\n      onChange?.(event);\n      changeHeight();\n    };\n\n    useLayoutEffect(() => {\n      changeHeight();\n    }, [value, changeHeight]);\n\n    const handleBlur = (event: FocusEvent<HTMLTextAreaElement>) => {\n      onBlur?.(event);\n      setFocused(false);\n    };\n\n    const handleFocus = (event: FocusEvent<HTMLTextAreaElement>) => {\n      onFocus?.(event);\n      setFocused(true);\n    };\n\n    const multilineInputStyles = {\n      \"--saltMultilineInput-rows\": rows,\n      ...style,\n    };\n\n    return (\n      <div\n        className={clsx(\n          withBaseName(),\n          withBaseName(variant),\n          {\n            [withBaseName(\"withAdornmentRow\")]: endAdornment,\n            [withBaseName(\"bordered\")]: bordered,\n            [withBaseName(\"focused\")]: !isDisabled && focused,\n            [withBaseName(\"disabled\")]: isDisabled,\n            [withBaseName(\"readOnly\")]: isReadOnly,\n            [withBaseName(validationStatus ?? \"\")]: validationStatus,\n          },\n          classNameProp\n        )}\n        ref={ref}\n        style={multilineInputStyles}\n        {...other}\n      >\n        {startAdornment && (\n          <div className={withBaseName(\"startAdornmentContainer\")}>\n            {startAdornment}\n          </div>\n        )}\n        <textarea\n          aria-describedby={clsx(formFieldDescribedBy, textAreaDescribedBy)}\n          aria-labelledby={clsx(formFieldLabelledBy, textAreaLabelledBy)}\n          className={clsx(withBaseName(\"textarea\"), textAreaProps?.className)}\n          disabled={isDisabled}\n          id={id}\n          readOnly={isReadOnly}\n          ref={handleRef}\n          required={isRequired}\n          role={role}\n          rows={rows}\n          tabIndex={isDisabled ? -1 : 0}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onFocus={!isDisabled ? handleFocus : undefined}\n          placeholder={placeholder}\n          value={value}\n          {...restA11yProps}\n          {...restTextAreaProps}\n        />\n        <div className={withBaseName(\"suffixAdornments\")}>\n          {!isDisabled && validationStatus && (\n            <div className={withBaseName(\"statusAdornmentContainer\")}>\n              <StatusAdornment status={validationStatus} />\n            </div>\n          )}\n          {endAdornment && (\n            <div className={withBaseName(\"endAdornmentContainer\")}>\n              {endAdornment}\n            </div>\n          )}\n        </div>\n        <div className={withBaseName(\"activationIndicator\")} />\n      </div>\n    );\n  }\n);\n"],"names":["MultilineInput","multilineInputCss","value"],"mappings":"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"}
+{"version":3,"file":"MultilineInput.js","sources":["../src/multiline-input/MultilineInput.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ChangeEvent,\n  type ComponentPropsWithoutRef,\n  type FocusEvent,\n  type ReactNode,\n  type Ref,\n  type TextareaHTMLAttributes,\n  forwardRef,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { StatusAdornment } from \"../status-adornment\";\nimport { makePrefixer, useControlled, useForkRef } from \"../utils\";\n\nimport multilineInputCss from \"./MultilineInput.css\";\n\nconst withBaseName = makePrefixer(\"saltMultilineInput\");\n\nexport interface MultilineInputProps\n  extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\">,\n    Pick<\n      ComponentPropsWithoutRef<\"textarea\">,\n      \"disabled\" | \"value\" | \"defaultValue\" | \"placeholder\"\n    > {\n  /**\n   * Styling variant with full border. Defaults to false\n   */\n  bordered?: boolean;\n  /**\n   * End adornment component\n   */\n  endAdornment?: ReactNode;\n  /**\n   * If `true`, the component is read only.\n   */\n  readOnly?: boolean;\n  /**\n   * The default minimum number of rows. Defaults to 3\n   */\n  rows?: number;\n  /**\n   * Start adornment component\n   */\n  startAdornment?: ReactNode;\n  /**\n   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#Attributes) applied to the `textarea` element.\n   */\n  textAreaProps?: TextareaHTMLAttributes<HTMLTextAreaElement>;\n  /**\n   * Optional ref for the textarea component\n   */\n  textAreaRef?: Ref<HTMLTextAreaElement>;\n  /**\n   * Validation status.\n   */\n  validationStatus?: \"error\" | \"warning\" | \"success\";\n  /**\n   * Styling variant. Defaults to \"primary\".\n   */\n  variant?: \"primary\" | \"secondary\";\n}\n\nexport const MultilineInput = forwardRef<HTMLDivElement, MultilineInputProps>(\n  function MultilineInput(\n    {\n      \"aria-activedescendant\": ariaActiveDescendant,\n      \"aria-expanded\": ariaExpanded,\n      \"aria-owns\": ariaOwns,\n      bordered = false,\n      className: classNameProp,\n      disabled,\n      endAdornment,\n      id,\n      placeholder,\n      readOnly,\n      role,\n      rows = 3,\n      startAdornment,\n      style,\n      textAreaProps = {},\n      textAreaRef,\n      value: valueProp,\n      defaultValue: defaultValueProp = valueProp === undefined ? \"\" : undefined,\n      validationStatus: validationStatusProp,\n      variant = \"primary\",\n      ...other\n    },\n    ref,\n  ) {\n    const inputRef = useRef<HTMLTextAreaElement>(null);\n    const handleRef = useForkRef(inputRef, textAreaRef);\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-multiline-input\",\n      css: multilineInputCss,\n      window: targetWindow,\n    });\n\n    const restA11yProps = {\n      \"aria-activedescendant\": ariaActiveDescendant,\n      \"aria-expanded\": ariaExpanded,\n      \"aria-owns\": ariaOwns,\n    };\n\n    const [focused, setFocused] = useState(false);\n\n    const {\n      \"aria-describedby\": textAreaDescribedBy,\n      \"aria-labelledby\": textAreaLabelledBy,\n      onBlur,\n      onChange,\n      onFocus,\n      required: textAreaRequired,\n      ...restTextAreaProps\n    } = textAreaProps;\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 isDisabled = disabled || formFieldDisabled;\n    const isReadOnly = readOnly || formFieldReadOnly;\n    const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n    const isRequired = formFieldRequired\n      ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n      : textAreaRequired;\n\n    const [value, setValue] = useControlled({\n      controlled: valueProp,\n      default: defaultValueProp,\n      name: \"MultilineInput\",\n      state: \"value\",\n    });\n\n    const previousHeight = useRef<string | undefined>(undefined);\n    const input = inputRef.current;\n\n    const changeHeight = useCallback(() => {\n      if (!input) return;\n      const hasBeenManuallyResized =\n        previousHeight.current !== undefined &&\n        input.style.height !== previousHeight.current;\n      if (!hasBeenManuallyResized) {\n        const previousOverflow = input.style.overflow;\n        input.style.overflow = \"hidden\";\n        input.style.height = \"auto\";\n        input.scrollHeight; // Needed to work around Firefox bug. https://bugzilla.mozilla.org/show_bug.cgi?id=1787062\n        const newHeight = `${\n          input.scrollHeight + (input.offsetHeight - input.clientHeight)\n        }px`;\n        input.style.height = newHeight;\n        previousHeight.current = newHeight;\n        input.style.overflow = previousOverflow;\n      }\n    }, [input]);\n\n    const handleChange = (event: ChangeEvent<HTMLTextAreaElement>) => {\n      const value = event.target.value;\n      setValue(value);\n      onChange?.(event);\n      changeHeight();\n    };\n\n    useLayoutEffect(() => {\n      changeHeight();\n    }, [value, changeHeight]);\n\n    const handleBlur = (event: FocusEvent<HTMLTextAreaElement>) => {\n      onBlur?.(event);\n      setFocused(false);\n    };\n\n    const handleFocus = (event: FocusEvent<HTMLTextAreaElement>) => {\n      onFocus?.(event);\n      setFocused(true);\n    };\n\n    const multilineInputStyles = {\n      \"--saltMultilineInput-rows\": rows,\n      ...style,\n    };\n\n    return (\n      <div\n        className={clsx(\n          withBaseName(),\n          withBaseName(variant),\n          {\n            [withBaseName(\"withAdornmentRow\")]: endAdornment,\n            [withBaseName(\"bordered\")]: bordered,\n            [withBaseName(\"focused\")]: !isDisabled && focused,\n            [withBaseName(\"disabled\")]: isDisabled,\n            [withBaseName(\"readOnly\")]: isReadOnly,\n            [withBaseName(validationStatus ?? \"\")]: validationStatus,\n          },\n          classNameProp,\n        )}\n        ref={ref}\n        style={multilineInputStyles}\n        {...other}\n      >\n        {startAdornment && (\n          <div className={withBaseName(\"startAdornmentContainer\")}>\n            {startAdornment}\n          </div>\n        )}\n        <textarea\n          aria-describedby={clsx(formFieldDescribedBy, textAreaDescribedBy)}\n          aria-labelledby={clsx(formFieldLabelledBy, textAreaLabelledBy)}\n          className={clsx(withBaseName(\"textarea\"), textAreaProps?.className)}\n          disabled={isDisabled}\n          id={id}\n          readOnly={isReadOnly}\n          ref={handleRef}\n          required={isRequired}\n          role={role}\n          rows={rows}\n          tabIndex={isDisabled ? -1 : 0}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onFocus={!isDisabled ? handleFocus : undefined}\n          placeholder={placeholder}\n          value={value}\n          {...restA11yProps}\n          {...restTextAreaProps}\n        />\n        <div className={withBaseName(\"suffixAdornments\")}>\n          {!isDisabled && validationStatus && (\n            <div className={withBaseName(\"statusAdornmentContainer\")}>\n              <StatusAdornment status={validationStatus} />\n            </div>\n          )}\n          {endAdornment && (\n            <div className={withBaseName(\"endAdornmentContainer\")}>\n              {endAdornment}\n            </div>\n          )}\n        </div>\n        <div className={withBaseName(\"activationIndicator\")} />\n      </div>\n    );\n  },\n);\n"],"names":["MultilineInput","multilineInputCss","value"],"mappings":"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"}

package/dist-es/navigation-item/ConditionalWrapper.js

@@ -18,6 +18,7 @@ const ConditionalWrapper = ({
     "aria-expanded": expanded,
     className,
     onClick: handleExpand,
+    type: "button",
     children
   }) : /* @__PURE__ */ jsx("a", {
     "aria-current": active ? "page" : void 0,

package/dist-es/navigation-item/ConditionalWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConditionalWrapper.js","sources":["../src/navigation-item/ConditionalWrapper.tsx"],"sourcesContent":["import { MouseEvent, ReactNode } from \"react\";\nimport { NavigationItemProps } from \"./NavigationItem\";\n\ninterface ConditionalWrapperProps\n  extends Pick<\n    NavigationItemProps,\n    \"parent\" | \"expanded\" | \"onExpand\" | \"active\" | \"href\" | \"onClick\"\n  > {\n  children: ReactNode;\n  className: string;\n}\n\nexport const ConditionalWrapper = ({\n  children,\n  className,\n  parent,\n  expanded,\n  onExpand,\n  active,\n  href,\n}: ConditionalWrapperProps) => {\n  const handleExpand = (event: MouseEvent<HTMLButtonElement>) => {\n    event.stopPropagation();\n    onExpand?.(event);\n  };\n\n  return parent || href === undefined ? (\n    <button\n      aria-label=\"expand\"\n      aria-expanded={expanded}\n      className={className}\n      onClick={handleExpand}\n    >\n      {children}\n    </button>\n  ) : (\n    <a\n      aria-current={active ? \"page\" : undefined}\n      href={href}\n      className={className}\n    >\n      {children}\n    </a>\n  );\n};\n"],"names":[],"mappings":";;AAYO,MAAM,qBAAqB,CAAC;AAAA,EACjC,QAAA;AAAA,EACA,SAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,MAAA;AAAA,EACA,IAAA;AACF,CAA+B,KAAA;AAC7B,EAAM,MAAA,YAAA,GAAe,CAAC,KAAyC,KAAA;AAC7D,IAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AACtB,IAAW,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACb,CAAA;AAEA,EAAO,OAAA,MAAA,IAAU,IAAS,KAAA,KAAA,CAAA,mBACvB,GAAA,CAAA,QAAA,EAAA;AAAA,IACC,YAAW,EAAA,QAAA;AAAA,IACX,eAAe,EAAA,QAAA;AAAA,IACf,SAAA;AAAA,IACA,OAAS,EAAA,YAAA;AAAA,IAER,QAAA;AAAA,GACH,oBAEC,GAAA,CAAA,GAAA,EAAA;AAAA,IACC,cAAA,EAAc,SAAS,MAAS,GAAA,KAAA,CAAA;AAAA,IAChC,IAAA;AAAA,IACA,SAAA;AAAA,IAEC,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"ConditionalWrapper.js","sources":["../src/navigation-item/ConditionalWrapper.tsx"],"sourcesContent":["import type { MouseEvent, ReactNode } from \"react\";\nimport type { NavigationItemProps } from \"./NavigationItem\";\n\ninterface ConditionalWrapperProps\n  extends Pick<\n    NavigationItemProps,\n    \"parent\" | \"expanded\" | \"onExpand\" | \"active\" | \"href\" | \"onClick\"\n  > {\n  children: ReactNode;\n  className: string;\n}\n\nexport const ConditionalWrapper = ({\n  children,\n  className,\n  parent,\n  expanded,\n  onExpand,\n  active,\n  href,\n}: ConditionalWrapperProps) => {\n  const handleExpand = (event: MouseEvent<HTMLButtonElement>) => {\n    event.stopPropagation();\n    onExpand?.(event);\n  };\n\n  return parent || href === undefined ? (\n    <button\n      aria-label=\"expand\"\n      aria-expanded={expanded}\n      className={className}\n      onClick={handleExpand}\n      type=\"button\"\n    >\n      {children}\n    </button>\n  ) : (\n    <a\n      aria-current={active ? \"page\" : undefined}\n      href={href}\n      className={className}\n    >\n      {children}\n    </a>\n  );\n};\n"],"names":[],"mappings":";;AAYO,MAAM,qBAAqB,CAAC;AAAA,EACjC,QAAA;AAAA,EACA,SAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,MAAA;AAAA,EACA,IAAA;AACF,CAA+B,KAAA;AAC7B,EAAM,MAAA,YAAA,GAAe,CAAC,KAAyC,KAAA;AAC7D,IAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AACtB,IAAW,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACb,CAAA;AAEA,EAAO,OAAA,MAAA,IAAU,IAAS,KAAA,KAAA,CAAA,mBACvB,GAAA,CAAA,QAAA,EAAA;AAAA,IACC,YAAW,EAAA,QAAA;AAAA,IACX,eAAe,EAAA,QAAA;AAAA,IACf,SAAA;AAAA,IACA,OAAS,EAAA,YAAA;AAAA,IACT,IAAK,EAAA,QAAA;AAAA,IAEJ,QAAA;AAAA,GACH,oBAEC,GAAA,CAAA,GAAA,EAAA;AAAA,IACC,cAAA,EAAc,SAAS,MAAS,GAAA,KAAA,CAAA;AAAA,IAChC,IAAA;AAAA,IACA,SAAA;AAAA,IAEC,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ;;;;"}

package/dist-es/navigation-item/ExpansionIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpansionIcon.js","sources":["../src/navigation-item/ExpansionIcon.tsx"],"sourcesContent":["import { ChevronDownIcon, ChevronRightIcon } from \"@salt-ds/icons\";\nimport { NavigationItemProps } from \"./NavigationItem\";\n\nconst iconExpansionMap = {\n  vertical: {\n    expanded: ChevronDownIcon,\n    collapsed: ChevronRightIcon,\n  },\n  horizontal: {\n    expanded: ChevronDownIcon,\n    collapsed: ChevronDownIcon,\n  },\n};\n\nexport function ExpansionIcon({\n  expanded = false,\n  orientation = \"horizontal\",\n}: Pick<NavigationItemProps, \"expanded\" | \"orientation\" | \"className\">) {\n  const Icon =\n    iconExpansionMap[orientation][expanded ? \"expanded\" : \"collapsed\"];\n  return <Icon aria-hidden=\"true\" />;\n}\n"],"names":[],"mappings":";;;AAGA,MAAM,gBAAmB,GAAA;AAAA,EACvB,QAAU,EAAA;AAAA,IACR,QAAU,EAAA,eAAA;AAAA,IACV,SAAW,EAAA,gBAAA;AAAA,GACb;AAAA,EACA,UAAY,EAAA;AAAA,IACV,QAAU,EAAA,eAAA;AAAA,IACV,SAAW,EAAA,eAAA;AAAA,GACb;AACF,CAAA,CAAA;AAEO,SAAS,aAAc,CAAA;AAAA,EAC5B,QAAW,GAAA,KAAA;AAAA,EACX,WAAc,GAAA,YAAA;AAChB,CAAwE,EAAA;AACtE,EAAA,MAAM,IACJ,GAAA,gBAAA,CAAiB,WAAa,CAAA,CAAA,QAAA,GAAW,UAAa,GAAA,WAAA,CAAA,CAAA;AACxD,EAAA,uBAAQ,GAAA,CAAA,IAAA,EAAA;AAAA,IAAK,aAAY,EAAA,MAAA;AAAA,GAAO,CAAA,CAAA;AAClC;;;;"}
+{"version":3,"file":"ExpansionIcon.js","sources":["../src/navigation-item/ExpansionIcon.tsx"],"sourcesContent":["import { ChevronDownIcon, ChevronRightIcon } from \"@salt-ds/icons\";\nimport type { NavigationItemProps } from \"./NavigationItem\";\n\nconst iconExpansionMap = {\n  vertical: {\n    expanded: ChevronDownIcon,\n    collapsed: ChevronRightIcon,\n  },\n  horizontal: {\n    expanded: ChevronDownIcon,\n    collapsed: ChevronDownIcon,\n  },\n};\n\nexport function ExpansionIcon({\n  expanded = false,\n  orientation = \"horizontal\",\n}: Pick<NavigationItemProps, \"expanded\" | \"orientation\" | \"className\">) {\n  const Icon =\n    iconExpansionMap[orientation][expanded ? \"expanded\" : \"collapsed\"];\n  return <Icon aria-hidden=\"true\" />;\n}\n"],"names":[],"mappings":";;;AAGA,MAAM,gBAAmB,GAAA;AAAA,EACvB,QAAU,EAAA;AAAA,IACR,QAAU,EAAA,eAAA;AAAA,IACV,SAAW,EAAA,gBAAA;AAAA,GACb;AAAA,EACA,UAAY,EAAA;AAAA,IACV,QAAU,EAAA,eAAA;AAAA,IACV,SAAW,EAAA,eAAA;AAAA,GACb;AACF,CAAA,CAAA;AAEO,SAAS,aAAc,CAAA;AAAA,EAC5B,QAAW,GAAA,KAAA;AAAA,EACX,WAAc,GAAA,YAAA;AAChB,CAAwE,EAAA;AACtE,EAAA,MAAM,IACJ,GAAA,gBAAA,CAAiB,WAAa,CAAA,CAAA,QAAA,GAAW,UAAa,GAAA,WAAA,CAAA,CAAA;AACxD,EAAA,uBAAQ,GAAA,CAAA,IAAA,EAAA;AAAA,IAAK,aAAY,EAAA,MAAA;AAAA,GAAO,CAAA,CAAA;AAClC;;;;"}

package/dist-es/navigation-item/NavigationItem.js

@@ -1,11 +1,11 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
+import { clsx } from 'clsx';
 import { forwardRef } from 'react';
 import { makePrefixer } from '../utils/makePrefixer.js';
 import '../utils/useFloatingUI/useFloatingUI.js';
 import '../utils/useId.js';
 import '../salt-provider/SaltProvider.js';
 import '../viewport/ViewportProvider.js';
-import { clsx } from 'clsx';
 import '../accordion/AccordionGroup.js';
 import '../accordion/AccordionPanel.js';
 import '../accordion/Accordion.js';
@@ -23,9 +23,9 @@ import '../button/Button.js';
 import '../card/Card.js';
 import '../checkbox/Checkbox.js';
 import '../checkbox/CheckboxGroup.js';
+import '@salt-ds/icons';
 import { useComponentCssInjection } from '@salt-ds/styles';
 import { useWindow } from '@salt-ds/window';
-import '@salt-ds/icons';
 import '../combo-box/ComboBox.js';
 import '../dialog/Dialog.js';
 import '../dialog/DialogHeader.js';
@@ -44,6 +44,7 @@ import '../flex-item/FlexItem.js';
 import '../flex-layout/FlexLayout.js';
 import '../flow-layout/FlowLayout.js';
 import '../form-field/FormField.js';
+import '../form-field-context/FormFieldContext.js';
 import '../status-indicator/StatusIndicator.js';
 import '../text/Text.js';
 import '../text/Code.js';
@@ -52,7 +53,6 @@ import '../text/Headings.js';
 import '../text/Label.js';
 import '../text/TextAction.js';
 import '../text/TextNotation.js';
-import '../form-field-context/FormFieldContext.js';
 import '../grid-item/GridItem.js';
 import '../grid-layout/GridLayout.js';
 import '../input/Input.js';
@@ -63,12 +63,12 @@ import '../link/Link.js';
 import '../link-card/LinkCard.js';
 import '../list-box/ListBox.js';
 import '../list-control/ListControlContext.js';
-import '../menu/MenuContext.js';
 import '@floating-ui/react';
+import '../menu/MenuContext.js';
 import '../menu/MenuItem.js';
 import '../menu/MenuPanel.js';
-import '../menu/MenuTriggerContext.js';
 import '../menu/MenuPanelContext.js';
+import '../menu/MenuTriggerContext.js';
 import '../menu/MenuGroup.js';
 import '../multiline-input/MultilineInput.js';
 import '../option/Option.js';
@@ -103,8 +103,8 @@ import '../toggle-button/ToggleButton.js';
 import '../toggle-button-group/ToggleButtonGroup.js';
 import '../toggle-button-group/ToggleButtonGroupContext.js';
 import '../tooltip/Tooltip.js';
-import { ExpansionIcon } from './ExpansionIcon.js';
 import { ConditionalWrapper } from './ConditionalWrapper.js';
+import { ExpansionIcon } from './ExpansionIcon.js';
 import css_248z from './NavigationItem.css.js';
 
 const withBaseName = makePrefixer("saltNavigationItem");

package/dist-es/navigation-item/NavigationItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationItem.js","sources":["../src/navigation-item/NavigationItem.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, MouseEventHandler } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { clsx } from \"clsx\";\nimport { ExpansionIcon } from \"./ExpansionIcon\";\nimport { ConditionalWrapper } from \"./ConditionalWrapper\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport navigationItemCss from \"./NavigationItem.css\";\n\nexport interface NavigationItemProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * Whether the navigation item is active.\n   */\n  active?: boolean;\n  /**\n   * Whether the nested group is collapsed and there is an active nested item within it.\n   */\n  blurActive?: boolean;\n  /**\n   * Whether the navigation item is expanded.\n   */\n  expanded?: boolean;\n  /**\n   * Level of nesting.\n   */\n  level?: number;\n  /**\n   * The orientation of the navigation item.\n   */\n  orientation?: \"horizontal\" | \"vertical\";\n  /**\n   * Whether the navigation item is a parent with nested items.\n   */\n  parent?: boolean;\n  /**\n   * Action to be triggered when the navigation item is expanded.\n   */\n  onExpand?: MouseEventHandler<HTMLButtonElement>;\n  /**\n   * Href to be passed to the Link element.\n   */\n  href?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltNavigationItem\");\n\nexport const NavigationItem = forwardRef<HTMLDivElement, NavigationItemProps>(\n  function NavigationItem(props, ref) {\n    const {\n      active,\n      blurActive,\n      children,\n      className,\n      expanded = false,\n      orientation = \"horizontal\",\n      parent,\n      level = 0,\n      onExpand,\n      href,\n      style: styleProp,\n      ...rest\n    } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-navigation-item\",\n      css: navigationItemCss,\n      window: targetWindow,\n    });\n\n    const style = {\n      ...styleProp,\n      \"--saltNavigationItem-level\": `${level}`,\n    };\n\n    return (\n      <div\n        ref={ref}\n        className={clsx(withBaseName(), className)}\n        style={style}\n        {...rest}\n      >\n        <ConditionalWrapper\n          className={clsx(\n            withBaseName(\"wrapper\"),\n            {\n              [withBaseName(\"active\")]: active || blurActive,\n              [withBaseName(\"blurActive\")]: blurActive,\n              [withBaseName(\"rootItem\")]: level === 0,\n            },\n            withBaseName(orientation)\n          )}\n          parent={parent}\n          expanded={expanded}\n          onExpand={onExpand}\n          active={active}\n          href={href}\n        >\n          <span className={withBaseName(\"label\")}>{children}</span>\n          {parent && (\n            <ExpansionIcon expanded={expanded} orientation={orientation} />\n          )}\n        </ConditionalWrapper>\n      </div>\n    );\n  }\n);\n"],"names":["NavigationItem","navigationItemCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA,CAAA;AAE/C,MAAM,cAAiB,GAAA,UAAA;AAAA,EAC5B,SAASA,eAAe,CAAA,KAAA,EAAO,GAAK,EAAA;AAClC,IAAM,MAAA;AAAA,MACJ,MAAA;AAAA,MACA,UAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,QAAW,GAAA,KAAA;AAAA,MACX,WAAc,GAAA,YAAA;AAAA,MACd,MAAA;AAAA,MACA,KAAQ,GAAA,CAAA;AAAA,MACR,QAAA;AAAA,MACA,IAAA;AAAA,MACA,KAAO,EAAA,SAAA;AAAA,MACJ,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,sBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,KAAQ,GAAA;AAAA,MACZ,GAAG,SAAA;AAAA,MACH,8BAA8B,CAAG,EAAA,KAAA,CAAA,CAAA;AAAA,KACnC,CAAA;AAEA,IAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,KAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEJ,QAAC,kBAAA,IAAA,CAAA,kBAAA,EAAA;AAAA,QACC,SAAW,EAAA,IAAA;AAAA,UACT,aAAa,SAAS,CAAA;AAAA,UACtB;AAAA,YACE,CAAC,YAAA,CAAa,QAAQ,CAAA,GAAI,MAAU,IAAA,UAAA;AAAA,YACpC,CAAC,YAAa,CAAA,YAAY,CAAI,GAAA,UAAA;AAAA,YAC9B,CAAC,YAAA,CAAa,UAAU,CAAA,GAAI,KAAU,KAAA,CAAA;AAAA,WACxC;AAAA,UACA,aAAa,WAAW,CAAA;AAAA,SAC1B;AAAA,QACA,MAAA;AAAA,QACA,QAAA;AAAA,QACA,QAAA;AAAA,QACA,MAAA;AAAA,QACA,IAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAC,GAAA,CAAA,MAAA,EAAA;AAAA,YAAK,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,YAAI,QAAA;AAAA,WAAS,CAAA;AAAA,UACjD,0BACE,GAAA,CAAA,aAAA,EAAA;AAAA,YAAc,QAAA;AAAA,YAAoB,WAAA;AAAA,WAA0B,CAAA;AAAA,SAAA;AAAA,OAEjE,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"NavigationItem.js","sources":["../src/navigation-item/NavigationItem.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  type MouseEventHandler,\n  forwardRef,\n} from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { ConditionalWrapper } from \"./ConditionalWrapper\";\nimport { ExpansionIcon } from \"./ExpansionIcon\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport navigationItemCss from \"./NavigationItem.css\";\n\nexport interface NavigationItemProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * Whether the navigation item is active.\n   */\n  active?: boolean;\n  /**\n   * Whether the nested group is collapsed and there is an active nested item within it.\n   */\n  blurActive?: boolean;\n  /**\n   * Whether the navigation item is expanded.\n   */\n  expanded?: boolean;\n  /**\n   * Level of nesting.\n   */\n  level?: number;\n  /**\n   * The orientation of the navigation item.\n   */\n  orientation?: \"horizontal\" | \"vertical\";\n  /**\n   * Whether the navigation item is a parent with nested items.\n   */\n  parent?: boolean;\n  /**\n   * Action to be triggered when the navigation item is expanded.\n   */\n  onExpand?: MouseEventHandler<HTMLButtonElement>;\n  /**\n   * Href to be passed to the Link element.\n   */\n  href?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltNavigationItem\");\n\nexport const NavigationItem = forwardRef<HTMLDivElement, NavigationItemProps>(\n  function NavigationItem(props, ref) {\n    const {\n      active,\n      blurActive,\n      children,\n      className,\n      expanded = false,\n      orientation = \"horizontal\",\n      parent,\n      level = 0,\n      onExpand,\n      href,\n      style: styleProp,\n      ...rest\n    } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-navigation-item\",\n      css: navigationItemCss,\n      window: targetWindow,\n    });\n\n    const style = {\n      ...styleProp,\n      \"--saltNavigationItem-level\": `${level}`,\n    };\n\n    return (\n      <div\n        ref={ref}\n        className={clsx(withBaseName(), className)}\n        style={style}\n        {...rest}\n      >\n        <ConditionalWrapper\n          className={clsx(\n            withBaseName(\"wrapper\"),\n            {\n              [withBaseName(\"active\")]: active || blurActive,\n              [withBaseName(\"blurActive\")]: blurActive,\n              [withBaseName(\"rootItem\")]: level === 0,\n            },\n            withBaseName(orientation),\n          )}\n          parent={parent}\n          expanded={expanded}\n          onExpand={onExpand}\n          active={active}\n          href={href}\n        >\n          <span className={withBaseName(\"label\")}>{children}</span>\n          {parent && (\n            <ExpansionIcon expanded={expanded} orientation={orientation} />\n          )}\n        </ConditionalWrapper>\n      </div>\n    );\n  },\n);\n"],"names":["NavigationItem","navigationItemCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkDA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA,CAAA;AAE/C,MAAM,cAAiB,GAAA,UAAA;AAAA,EAC5B,SAASA,eAAe,CAAA,KAAA,EAAO,GAAK,EAAA;AAClC,IAAM,MAAA;AAAA,MACJ,MAAA;AAAA,MACA,UAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,QAAW,GAAA,KAAA;AAAA,MACX,WAAc,GAAA,YAAA;AAAA,MACd,MAAA;AAAA,MACA,KAAQ,GAAA,CAAA;AAAA,MACR,QAAA;AAAA,MACA,IAAA;AAAA,MACA,KAAO,EAAA,SAAA;AAAA,MACJ,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,sBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,KAAQ,GAAA;AAAA,MACZ,GAAG,SAAA;AAAA,MACH,8BAA8B,CAAG,EAAA,KAAA,CAAA,CAAA;AAAA,KACnC,CAAA;AAEA,IAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,KAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEJ,QAAC,kBAAA,IAAA,CAAA,kBAAA,EAAA;AAAA,QACC,SAAW,EAAA,IAAA;AAAA,UACT,aAAa,SAAS,CAAA;AAAA,UACtB;AAAA,YACE,CAAC,YAAA,CAAa,QAAQ,CAAA,GAAI,MAAU,IAAA,UAAA;AAAA,YACpC,CAAC,YAAa,CAAA,YAAY,CAAI,GAAA,UAAA;AAAA,YAC9B,CAAC,YAAA,CAAa,UAAU,CAAA,GAAI,KAAU,KAAA,CAAA;AAAA,WACxC;AAAA,UACA,aAAa,WAAW,CAAA;AAAA,SAC1B;AAAA,QACA,MAAA;AAAA,QACA,QAAA;AAAA,QACA,QAAA;AAAA,QACA,MAAA;AAAA,QACA,IAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAC,GAAA,CAAA,MAAA,EAAA;AAAA,YAAK,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,YAAI,QAAA;AAAA,WAAS,CAAA;AAAA,UACjD,0BACE,GAAA,CAAA,aAAA,EAAA;AAAA,YAAc,QAAA;AAAA,YAAoB,WAAA;AAAA,WAA0B,CAAA;AAAA,SAAA;AAAA,OAEjE,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-es/option/Option.js

@@ -1,13 +1,16 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { forwardRef, useRef, useMemo, useEffect } from 'react';
-import { clsx } from 'clsx';
-import { useWindow } from '@salt-ds/window';
 import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
+import { clsx } from 'clsx';
+import { forwardRef, useRef, useMemo, useEffect } from 'react';
+import { Checkbox } from '../checkbox/Checkbox.js';
+import '../checkbox/CheckboxGroup.js';
+import '@salt-ds/icons';
+import '../salt-provider/SaltProvider.js';
 import { makePrefixer } from '../utils/makePrefixer.js';
 import '../utils/useFloatingUI/useFloatingUI.js';
 import { useForkRef } from '../utils/useForkRef.js';
 import { useId } from '../utils/useId.js';
-import '../salt-provider/SaltProvider.js';
 import '../viewport/ViewportProvider.js';
 import '../accordion/AccordionGroup.js';
 import '../accordion/AccordionPanel.js';
@@ -24,9 +27,6 @@ import '../border-layout/BorderLayout.js';
 import '../breakpoints/BreakpointProvider.js';
 import '../button/Button.js';
 import '../card/Card.js';
-import { Checkbox } from '../checkbox/Checkbox.js';
-import '../checkbox/CheckboxGroup.js';
-import '@salt-ds/icons';
 import '../combo-box/ComboBox.js';
 import '../dialog/Dialog.js';
 import '../dialog/DialogHeader.js';
@@ -45,6 +45,7 @@ import '../flex-item/FlexItem.js';
 import '../flex-layout/FlexLayout.js';
 import '../flow-layout/FlowLayout.js';
 import '../form-field/FormField.js';
+import '../form-field-context/FormFieldContext.js';
 import '../status-indicator/StatusIndicator.js';
 import '../text/Text.js';
 import '../text/Code.js';
@@ -53,7 +54,6 @@ import '../text/Headings.js';
 import '../text/Label.js';
 import '../text/TextAction.js';
 import '../text/TextNotation.js';
-import '../form-field-context/FormFieldContext.js';
 import '../grid-item/GridItem.js';
 import '../grid-layout/GridLayout.js';
 import '../input/Input.js';
@@ -64,12 +64,12 @@ import '../link/Link.js';
 import '../link-card/LinkCard.js';
 import '../list-box/ListBox.js';
 import { useListControlContext } from '../list-control/ListControlContext.js';
-import '../menu/MenuContext.js';
 import '@floating-ui/react';
+import '../menu/MenuContext.js';
 import '../menu/MenuItem.js';
 import '../menu/MenuPanel.js';
-import '../menu/MenuTriggerContext.js';
 import '../menu/MenuPanelContext.js';
+import '../menu/MenuTriggerContext.js';
 import '../menu/MenuGroup.js';
 import '../multiline-input/MultilineInput.js';
 import '../navigation-item/NavigationItem.js';
@@ -107,90 +107,92 @@ import '../tooltip/Tooltip.js';
 import css_248z from './Option.css.js';
 
 const withBaseName = makePrefixer("saltOption");
-const Option = forwardRef(function Option2(props, ref) {
-  const {
-    className,
-    children,
-    disabled: disabledProp,
-    onClick,
-    id: idProp,
-    value,
-    ...rest
-  } = props;
-  const targetWindow = useWindow();
-  useComponentCssInjection({
-    testId: "salt-option",
-    css: css_248z,
-    window: targetWindow
-  });
-  const optionRef = useRef(null);
-  const id = useId(idProp);
-  const {
-    setActive,
-    activeState,
-    multiselect,
-    select,
-    register,
-    selectedState,
-    focusVisibleState,
-    valueToString,
-    disabled: listDisabled
-  } = useListControlContext();
-  const disabled = disabledProp || listDisabled;
-  const selected = selectedState.includes(value);
-  const active = (activeState == null ? void 0 : activeState.id) === id;
-  const optionValue = useMemo(
-    () => ({
-      id: String(id),
-      disabled: Boolean(disabled),
-      value
-    }),
-    [id, disabled, value]
-  );
-  const handleClick = (event) => {
-    if (disabled || id == void 0) {
-      return;
-    }
-    setActive(optionValue);
-    select(event, optionValue);
-    onClick == null ? void 0 : onClick(event);
-  };
-  const handleMouseOver = () => {
-    setActive(optionValue);
-  };
-  useEffect(() => {
-    if (id && optionRef.current) {
-      return register(optionValue, optionRef.current);
-    }
-  }, [optionValue, id, register]);
-  const handleRef = useForkRef(optionRef, ref);
-  return /* @__PURE__ */ jsxs("div", {
-    "aria-disabled": disabled ? "true" : void 0,
-    "aria-selected": selected,
-    className: clsx(
-      withBaseName(),
-      {
-        [withBaseName("active")]: active,
-        [withBaseName("focusVisible")]: focusVisibleState && active
-      },
-      className
-    ),
-    ref: handleRef,
-    role: "option",
-    id,
-    onClick: handleClick,
-    onMouseOver: handleMouseOver,
-    ...rest,
-    children: [
-      multiselect && /* @__PURE__ */ jsx(Checkbox, {
-        checked: selected,
-        "aria-hidden": "true",
-        inputProps: { tabIndex: -1 }
+const Option = forwardRef(
+  function Option2(props, ref) {
+    const {
+      className,
+      children,
+      disabled: disabledProp,
+      onClick,
+      id: idProp,
+      value,
+      ...rest
+    } = props;
+    const targetWindow = useWindow();
+    useComponentCssInjection({
+      testId: "salt-option",
+      css: css_248z,
+      window: targetWindow
+    });
+    const optionRef = useRef(null);
+    const id = useId(idProp);
+    const {
+      setActive,
+      activeState,
+      multiselect,
+      select,
+      register,
+      selectedState,
+      focusVisibleState,
+      valueToString,
+      disabled: listDisabled
+    } = useListControlContext();
+    const disabled = disabledProp || listDisabled;
+    const selected = selectedState.includes(value);
+    const active = (activeState == null ? void 0 : activeState.id) === id;
+    const optionValue = useMemo(
+      () => ({
+        id: String(id),
+        disabled: Boolean(disabled),
+        value
       }),
-      children != null ? children : valueToString(value)
-    ]
-  });
-});
+      [id, disabled, value]
+    );
+    const handleClick = (event) => {
+      if (disabled || id === void 0) {
+        return;
+      }
+      setActive(optionValue);
+      select(event, optionValue);
+      onClick == null ? void 0 : onClick(event);
+    };
+    const handleMouseOver = () => {
+      setActive(optionValue);
+    };
+    useEffect(() => {
+      if (id && optionRef.current) {
+        return register(optionValue, optionRef.current);
+      }
+    }, [optionValue, id, register]);
+    const handleRef = useForkRef(optionRef, ref);
+    return /* @__PURE__ */ jsxs("div", {
+      "aria-disabled": disabled ? "true" : void 0,
+      "aria-selected": selected,
+      className: clsx(
+        withBaseName(),
+        {
+          [withBaseName("active")]: active,
+          [withBaseName("focusVisible")]: focusVisibleState && active
+        },
+        className
+      ),
+      ref: handleRef,
+      role: "option",
+      id,
+      onClick: handleClick,
+      onMouseOver: handleMouseOver,
+      ...rest,
+      children: [
+        multiselect && /* @__PURE__ */ jsx(Checkbox, {
+          checked: selected,
+          "aria-hidden": "true",
+          inputProps: { tabIndex: -1 }
+        }),
+        children != null ? children : valueToString(value)
+      ]
+    });
+  }
+);
 
 export { Option };
 //# sourceMappingURL=Option.js.map

package/dist-es/option/Option.js.map

@@ -1 +1 @@
-{"version":3,"file":"Option.js","sources":["../src/option/Option.tsx"],"sourcesContent":["import {\n  ComponentPropsWithoutRef,\n  forwardRef,\n  MouseEvent,\n  ReactNode,\n  useEffect,\n  useMemo,\n  useRef,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer, useForkRef, useId } from \"../utils\";\nimport { Checkbox } from \"../checkbox\";\nimport {\n  OptionValue,\n  useListControlContext,\n} from \"../list-control/ListControlContext\";\nimport optionCss from \"./Option.css\";\n\nexport interface OptionProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * If `true`, the option will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * The value of the option.\n   */\n  value: unknown;\n  /**\n   * The content of the option.\n   */\n  children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltOption\");\n\nexport const Option = forwardRef<HTMLDivElement, OptionProps>(function Option(\n  props,\n  ref\n) {\n  const {\n    className,\n    children,\n    disabled: disabledProp,\n    onClick,\n    id: idProp,\n    value,\n    ...rest\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-option\",\n    css: optionCss,\n    window: targetWindow,\n  });\n\n  const optionRef = useRef(null);\n  const id = useId(idProp);\n\n  const {\n    setActive,\n    activeState,\n    multiselect,\n    select,\n    register,\n    selectedState,\n    focusVisibleState,\n    valueToString,\n    disabled: listDisabled,\n  } = useListControlContext();\n\n  const disabled = disabledProp || listDisabled;\n\n  const selected = selectedState.includes(value);\n  const active = activeState?.id === id;\n\n  const optionValue: OptionValue<unknown> = useMemo(\n    () => ({\n      id: String(id),\n      disabled: Boolean(disabled),\n      value,\n    }),\n    [id, disabled, value]\n  );\n\n  const handleClick = (event: MouseEvent<HTMLDivElement>) => {\n    if (disabled || id == undefined) {\n      return;\n    }\n\n    // set active descendent\n    setActive(optionValue);\n\n    // handle selection\n    select(event, optionValue);\n\n    onClick?.(event);\n  };\n\n  const handleMouseOver = () => {\n    setActive(optionValue);\n  };\n\n  useEffect(() => {\n    if (id && optionRef.current) {\n      return register(optionValue, optionRef.current);\n    }\n  }, [optionValue, id, register]);\n\n  const handleRef = useForkRef(optionRef, ref);\n\n  return (\n    <div\n      aria-disabled={disabled ? \"true\" : undefined}\n      aria-selected={selected}\n      className={clsx(\n        withBaseName(),\n        {\n          [withBaseName(\"active\")]: active,\n          [withBaseName(\"focusVisible\")]: focusVisibleState && active,\n        },\n        className\n      )}\n      ref={handleRef}\n      role=\"option\"\n      id={id}\n      onClick={handleClick}\n      onMouseOver={handleMouseOver}\n      {...rest}\n    >\n      {multiselect && (\n        <Checkbox\n          checked={selected}\n          aria-hidden=\"true\"\n          inputProps={{ tabIndex: -1 }}\n        />\n      )}\n      {children ?? valueToString(value)}\n    </div>\n  );\n});\n"],"names":["Option","optionCss"],"mappings":"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"}
+{"version":3,"file":"Option.js","sources":["../src/option/Option.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  type MouseEvent,\n  type ReactNode,\n  forwardRef,\n  useEffect,\n  useMemo,\n  useRef,\n} from \"react\";\nimport { Checkbox } from \"../checkbox\";\nimport {\n  type OptionValue,\n  useListControlContext,\n} from \"../list-control/ListControlContext\";\nimport { makePrefixer, useForkRef, useId } from \"../utils\";\nimport optionCss from \"./Option.css\";\n\nexport interface OptionProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * If `true`, the option will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * The value of the option.\n   */\n  value: unknown;\n  /**\n   * The content of the option.\n   */\n  children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltOption\");\n\nexport const Option = forwardRef<HTMLDivElement, OptionProps>(\n  function Option(props, ref) {\n    const {\n      className,\n      children,\n      disabled: disabledProp,\n      onClick,\n      id: idProp,\n      value,\n      ...rest\n    } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-option\",\n      css: optionCss,\n      window: targetWindow,\n    });\n\n    const optionRef = useRef(null);\n    const id = useId(idProp);\n\n    const {\n      setActive,\n      activeState,\n      multiselect,\n      select,\n      register,\n      selectedState,\n      focusVisibleState,\n      valueToString,\n      disabled: listDisabled,\n    } = useListControlContext();\n\n    const disabled = disabledProp || listDisabled;\n\n    const selected = selectedState.includes(value);\n    const active = activeState?.id === id;\n\n    const optionValue: OptionValue<unknown> = useMemo(\n      () => ({\n        id: String(id),\n        disabled: Boolean(disabled),\n        value,\n      }),\n      [id, disabled, value],\n    );\n\n    const handleClick = (event: MouseEvent<HTMLDivElement>) => {\n      if (disabled || id === undefined) {\n        return;\n      }\n\n      // set active descendent\n      setActive(optionValue);\n\n      // handle selection\n      select(event, optionValue);\n\n      onClick?.(event);\n    };\n\n    const handleMouseOver = () => {\n      setActive(optionValue);\n    };\n\n    useEffect(() => {\n      if (id && optionRef.current) {\n        return register(optionValue, optionRef.current);\n      }\n    }, [optionValue, id, register]);\n\n    const handleRef = useForkRef(optionRef, ref);\n\n    return (\n      <div\n        aria-disabled={disabled ? \"true\" : undefined}\n        aria-selected={selected}\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"active\")]: active,\n            [withBaseName(\"focusVisible\")]: focusVisibleState && active,\n          },\n          className,\n        )}\n        ref={handleRef}\n        role=\"option\"\n        id={id}\n        onClick={handleClick}\n        onMouseOver={handleMouseOver}\n        {...rest}\n      >\n        {multiselect && (\n          <Checkbox\n            checked={selected}\n            aria-hidden=\"true\"\n            inputProps={{ tabIndex: -1 }}\n          />\n        )}\n        {children ?? valueToString(value)}\n      </div>\n    );\n  },\n);\n"],"names":["Option","optionCss"],"mappings":"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"}