@salt-ds/core 1.29.0 → 1.30.0

package/dist-cjs/checkbox/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sources":["../src/checkbox/Checkbox.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ChangeEventHandler,\n  FocusEventHandler,\n  forwardRef,\n  InputHTMLAttributes,\n  ReactNode,\n  useRef,\n} from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n  makePrefixer,\n  useControlled,\n  useIsomorphicLayoutEffect,\n} from \"../utils\";\nimport { CheckboxIcon } from \"./CheckboxIcon\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { AdornmentValidationStatus } from \"../status-adornment\";\nimport { useCheckboxGroup } from \"./internal/useCheckboxGroup\";\n\nimport checkboxCss from \"./Checkbox.css\";\n\nconst withBaseName = makePrefixer(\"saltCheckbox\");\nexport interface CheckboxProps\n  extends Omit<\n    InputHTMLAttributes<HTMLLabelElement>,\n    \"onChange\" | \"onBlur\" | \"onFocus\"\n  > {\n  /**\n   * If `true`, the checkbox will be checked.\n   */\n  checked?: boolean;\n  /**\n   * Whether the checkbox component is checked by default\n   * This will be disregarded if checked is already set.\n   */\n  defaultChecked?: boolean;\n  /**\n   * If `true`, the checkbox will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * **Deprecated**: Use validationStatus instead\n   * If `true`, the checkbox will be in the error state.\n   */\n  error?: boolean;\n  /**\n   * If true, the checkbox appears indeterminate. A data-indeterminate attribute is set on the input.\n   */\n  indeterminate?: boolean;\n  /**\n   * Properties applied to the input element.\n   */\n  inputProps?: Partial<InputHTMLAttributes<HTMLInputElement>>;\n  /**\n   * The label to be shown next to the checkbox.\n   */\n  label?: ReactNode;\n  /**\n   * The name applied to the input.\n   */\n  name?: string;\n  /**\n   * Callback when checkbox loses focus.\n   */\n  onBlur?: FocusEventHandler<HTMLInputElement>;\n  /**\n   * Callback when checked state is changed.\n   */\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n  /**\n   * Callback when checkbox gains focus.\n   */\n  onFocus?: FocusEventHandler<HTMLInputElement>;\n  /**\n   * The value of the checkbox.\n   */\n  value?: string;\n  /**\n   * Validation status, one of \"warning\" | \"error\" | \"success\"\n   *\n   * Checkbox has styling variants for \"error\" and \"warning\".\n   * No visual styling will be applied on \"success\" variant.\n   */\n  validationStatus?: AdornmentValidationStatus;\n}\n\nexport const Checkbox = forwardRef<HTMLLabelElement, CheckboxProps>(\n  function Checkbox(\n    {\n      checked: checkedProp,\n      className,\n      defaultChecked,\n      disabled: disabledProp,\n      error,\n      indeterminate,\n      inputProps = {},\n      label,\n      name,\n      onBlur,\n      onChange,\n      onFocus,\n      value,\n      validationStatus: validationStatusProp,\n      readOnly: readOnlyProp,\n      ...rest\n    },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-checkbox\",\n      css: checkboxCss,\n      window: targetWindow,\n    });\n    const checkboxGroup = useCheckboxGroup();\n\n    const {\n      \"aria-describedby\": inputDescribedBy,\n      \"aria-labelledby\": inputLabelledBy,\n      className: inputClassName,\n      onChange: inputOnChange,\n      ...restInputProps\n    } = inputProps;\n\n    const checkboxGroupChecked =\n      checkedProp ??\n      (checkboxGroup?.checkedValues && value\n        ? checkboxGroup.checkedValues.includes(value)\n        : checkedProp);\n\n    const [checked, setChecked] = useControlled({\n      controlled: checkboxGroupChecked,\n      default: Boolean(defaultChecked),\n      name: \"Checkbox\",\n      state: \"checked\",\n    });\n\n    const {\n      a11yProps: formFieldA11yProps,\n      disabled: formFieldDisabled,\n      readOnly: formFieldReadOnly,\n      validationStatus: formFieldValidationStatus,\n    } = useFormFieldProps();\n\n    const disabled =\n      checkboxGroup?.disabled || formFieldDisabled || disabledProp;\n    const readOnly =\n      checkboxGroup?.readOnly || formFieldReadOnly || readOnlyProp;\n    const validationStatus = !disabled\n      ? checkboxGroup?.validationStatus ??\n        formFieldValidationStatus ??\n        validationStatusProp\n      : undefined;\n\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n      // Workaround for https://github.com/facebook/react/issues/9023\n      if (event.nativeEvent.defaultPrevented || readOnly) {\n        return;\n      }\n\n      const value = event.target.checked;\n      setChecked(value);\n      onChange?.(event);\n      inputOnChange?.(event);\n      checkboxGroup?.onChange?.(event);\n    };\n\n    useIsomorphicLayoutEffect(() => {\n      if (inputRef.current != null) {\n        inputRef.current.indeterminate = indeterminate ?? false;\n      }\n    }, [indeterminate]);\n\n    return (\n      <label\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"disabled\")]: disabled,\n            [withBaseName(\"readOnly\")]: readOnly,\n            [withBaseName(\"error\")]: error /* **Deprecated** */,\n            [withBaseName(validationStatus ?? \"\")]: validationStatus,\n          },\n          className\n        )}\n        ref={ref}\n        {...rest}\n      >\n        <input\n          aria-readonly={readOnly || undefined}\n          aria-describedby={clsx(\n            checkboxGroup === undefined\n              ? formFieldA11yProps?.[\"aria-describedby\"]\n              : undefined,\n            inputDescribedBy\n          )}\n          aria-labelledby={clsx(\n            checkboxGroup === undefined\n              ? formFieldA11yProps?.[\"aria-labelledby\"]\n              : undefined,\n            inputLabelledBy\n          )}\n          name={name}\n          value={value}\n          checked={checked}\n          className={clsx(withBaseName(\"input\"), inputClassName)}\n          data-indeterminate={indeterminate}\n          defaultChecked={defaultChecked}\n          disabled={disabled}\n          readOnly={readOnly}\n          onBlur={onBlur}\n          onChange={handleChange}\n          onFocus={onFocus}\n          type=\"checkbox\"\n          ref={inputRef}\n          {...restInputProps}\n        />\n        <CheckboxIcon\n          checked={checked}\n          disabled={disabled}\n          readOnly={readOnly}\n          indeterminate={indeterminate}\n          validationStatus={validationStatus}\n          error={error}\n        />\n        {label}\n      </label>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","Checkbox","useWindow","useComponentCssInjection","checkboxCss","useCheckboxGroup","useControlled","useFormFieldProps","useRef","_a","value","useIsomorphicLayoutEffect","jsxs","clsx","jsx","CheckboxIcon"],"mappings":"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"}
+{"version":3,"file":"Checkbox.js","sources":["../src/checkbox/Checkbox.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ChangeEventHandler,\n  FocusEventHandler,\n  forwardRef,\n  InputHTMLAttributes,\n  ReactNode,\n  useRef,\n} from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n  makePrefixer,\n  useControlled,\n  useIsomorphicLayoutEffect,\n} from \"../utils\";\nimport { CheckboxIcon } from \"./CheckboxIcon\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { AdornmentValidationStatus } from \"../status-adornment\";\nimport { useCheckboxGroup } from \"./internal/useCheckboxGroup\";\n\nimport checkboxCss from \"./Checkbox.css\";\n\nconst withBaseName = makePrefixer(\"saltCheckbox\");\nexport interface CheckboxProps\n  extends Omit<\n    InputHTMLAttributes<HTMLLabelElement>,\n    \"onChange\" | \"onBlur\" | \"onFocus\"\n  > {\n  /**\n   * If `true`, the checkbox will be checked.\n   */\n  checked?: boolean;\n  /**\n   * Whether the checkbox component is checked by default\n   * This will be disregarded if checked is already set.\n   */\n  defaultChecked?: boolean;\n  /**\n   * If `true`, the checkbox will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * **Deprecated**: Use validationStatus instead\n   * If `true`, the checkbox will be in the error state.\n   */\n  error?: boolean;\n  /**\n   * If true, the checkbox appears indeterminate. A data-indeterminate attribute is set on the input.\n   */\n  indeterminate?: boolean;\n  /**\n   * Properties applied to the input element.\n   */\n  inputProps?: Partial<InputHTMLAttributes<HTMLInputElement>>;\n  /**\n   * The label to be shown next to the checkbox.\n   */\n  label?: ReactNode;\n  /**\n   * The name applied to the input.\n   */\n  name?: string;\n  /**\n   * Callback when checkbox loses focus.\n   */\n  onBlur?: FocusEventHandler<HTMLInputElement>;\n  /**\n   * Callback when checked state is changed.\n   */\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n  /**\n   * Callback when checkbox gains focus.\n   */\n  onFocus?: FocusEventHandler<HTMLInputElement>;\n  /**\n   * The value of the checkbox.\n   */\n  value?: string;\n  /**\n   * Validation status, one of \"warning\" | \"error\" | \"success\"\n   *\n   * Checkbox has styling variants for \"error\" and \"warning\".\n   * No visual styling will be applied on \"success\" variant.\n   */\n  validationStatus?: AdornmentValidationStatus;\n}\n\nexport const Checkbox = forwardRef<HTMLLabelElement, CheckboxProps>(\n  function Checkbox(\n    {\n      checked: checkedProp,\n      className,\n      defaultChecked,\n      disabled: disabledProp,\n      error,\n      indeterminate,\n      inputProps = {},\n      label,\n      name,\n      onBlur,\n      onChange,\n      onFocus,\n      value,\n      validationStatus: validationStatusProp,\n      readOnly: readOnlyProp,\n      ...rest\n    },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-checkbox\",\n      css: checkboxCss,\n      window: targetWindow,\n    });\n    const checkboxGroup = useCheckboxGroup();\n\n    const {\n      \"aria-describedby\": inputDescribedBy,\n      \"aria-labelledby\": inputLabelledBy,\n      className: inputClassName,\n      onChange: inputOnChange,\n      ...restInputProps\n    } = inputProps;\n\n    const checkboxGroupChecked =\n      checkedProp ??\n      (checkboxGroup?.checkedValues && value\n        ? checkboxGroup.checkedValues.includes(value)\n        : checkedProp);\n\n    const [checked, setChecked] = useControlled({\n      controlled: checkboxGroupChecked,\n      default: Boolean(defaultChecked),\n      name: \"Checkbox\",\n      state: \"checked\",\n    });\n\n    const {\n      a11yProps: formFieldA11yProps,\n      disabled: formFieldDisabled,\n      readOnly: formFieldReadOnly,\n      validationStatus: formFieldValidationStatus,\n    } = useFormFieldProps();\n\n    const disabled =\n      checkboxGroup?.disabled || formFieldDisabled || disabledProp;\n    const readOnly =\n      checkboxGroup?.readOnly || formFieldReadOnly || readOnlyProp;\n    const validationStatus = !disabled\n      ? checkboxGroup?.validationStatus ??\n        formFieldValidationStatus ??\n        validationStatusProp\n      : undefined;\n\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n      // Workaround for https://github.com/facebook/react/issues/9023\n      if (event.nativeEvent.defaultPrevented || readOnly) {\n        return;\n      }\n\n      const value = event.target.checked;\n      setChecked(value);\n      onChange?.(event);\n      inputOnChange?.(event);\n      checkboxGroup?.onChange?.(event);\n    };\n\n    useIsomorphicLayoutEffect(() => {\n      if (inputRef.current != null) {\n        inputRef.current.indeterminate = indeterminate ?? false;\n      }\n    }, [indeterminate]);\n\n    return (\n      <label\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"disabled\")]: disabled,\n            [withBaseName(\"readOnly\")]: readOnly,\n            [withBaseName(\"error\")]: error /* **Deprecated** */,\n            [withBaseName(validationStatus ?? \"\")]: validationStatus,\n          },\n          className\n        )}\n        ref={ref}\n        {...rest}\n      >\n        <input\n          aria-readonly={readOnly || undefined}\n          aria-describedby={clsx(\n            checkboxGroup === undefined\n              ? formFieldA11yProps?.[\"aria-describedby\"]\n              : undefined,\n            inputDescribedBy\n          )}\n          aria-labelledby={clsx(\n            checkboxGroup === undefined\n              ? formFieldA11yProps?.[\"aria-labelledby\"]\n              : undefined,\n            inputLabelledBy\n          )}\n          name={name}\n          value={value}\n          checked={checked}\n          className={clsx(withBaseName(\"input\"), inputClassName)}\n          data-indeterminate={indeterminate}\n          defaultChecked={defaultChecked}\n          disabled={disabled}\n          readOnly={readOnly}\n          onBlur={onBlur}\n          onChange={handleChange}\n          onFocus={onFocus}\n          type=\"checkbox\"\n          ref={inputRef}\n          {...restInputProps}\n        />\n        <CheckboxIcon\n          checked={checked}\n          disabled={disabled}\n          readOnly={readOnly}\n          indeterminate={indeterminate}\n          validationStatus={validationStatus}\n          error={error}\n        />\n        {label}\n      </label>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","Checkbox","useWindow","useComponentCssInjection","checkboxCss","useCheckboxGroup","useControlled","useFormFieldProps","useRef","_a","value","useIsomorphicLayoutEffect","jsxs","clsx","jsx","CheckboxIcon"],"mappings":"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"}

package/dist-cjs/checkbox/CheckboxGroup.js

@@ -39,6 +39,7 @@ require('../dialog/DialogActions.js');
 require('../dialog/DialogContent.js');
 require('../dialog/DialogContext.js');
 require('../dialog/DialogCloseButton.js');
+require('../divider/Divider.js');
 require('../drawer/Drawer.js');
 require('../drawer/DrawerCloseButton.js');
 require('../dropdown/Dropdown.js');
@@ -65,6 +66,7 @@ require('../interactable-card/InteractableCardGroup.js');
 require('../interactable-card/InteractableCardGroupContext.js');
 require('../link/Link.js');
 require('../link-card/LinkCard.js');
+require('../list-box/ListBox.js');
 require('../list-control/ListControlContext.js');
 require('../menu/MenuContext.js');
 require('@floating-ui/react');
@@ -102,6 +104,7 @@ require('../toast/Toast.js');
 require('../toast/ToastContent.js');
 require('../split-layout/SplitLayout.js');
 require('../switch/Switch.js');
+require('../tag/Tag.js');
 require('../toggle-button/ToggleButton.js');
 require('../toggle-button-group/ToggleButtonGroup.js');
 require('../toggle-button-group/ToggleButtonGroupContext.js');

package/dist-cjs/checkbox/CheckboxGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxGroup.js","sources":["../src/checkbox/CheckboxGroup.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ChangeEvent,\n  ChangeEventHandler,\n  ComponentPropsWithoutRef,\n  forwardRef,\n} from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { AdornmentValidationStatus } from \"../status-adornment\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { CheckboxGroupContext } from \"./internal/CheckboxGroupContext\";\nimport checkboxGroupCss from \"./CheckboxGroup.css\";\n\nexport interface CheckboxGroupProps\n  extends Omit<ComponentPropsWithoutRef<\"fieldset\">, \"onChange\"> {\n  /**\n   * The current checked options.\n   */\n  checkedValues?: string[];\n  /**\n   * The default selected options for un-controlled component.\n   */\n  defaultCheckedValues?: string[];\n  /**\n   * Display group of elements in a compact row.\n   */\n  direction?: \"horizontal\" | \"vertical\";\n  /**\n   * Disable the Checkbox group\n   */\n  disabled?: boolean;\n  /**\n   * The name used to reference the value of the control.\n   */\n  name?: string;\n  /**\n   * Callback fired when a checkbox is clicked.\n   * `event.target.value` returns the value of the checkbox that was clicked.\n   */\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n  /**\n   * If `true`, the component is read only.\n   */\n  readOnly?: boolean;\n  /**\n   * Only for horizontal direction. When `true` the text in radio button label will wrap to fit within the container. Otherwise, the checkboxes will wrap onto the next line.\n   */\n  wrap?: boolean;\n  /**\n   * Validation status.\n   */\n  validationStatus?: AdornmentValidationStatus;\n}\n\nconst withBaseName = makePrefixer(\"saltCheckboxGroup\");\n\nexport const CheckboxGroup = forwardRef<\n  HTMLFieldSetElement,\n  CheckboxGroupProps\n>(function CheckboxGroup(\n  {\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-describedby\": ariaDescribedBy,\n    checkedValues: checkedValuesProp,\n    defaultCheckedValues = [],\n    children,\n    className,\n    disabled: disabledProp,\n    direction = \"vertical\",\n    name,\n    onChange,\n    readOnly: readOnlyProp,\n    wrap,\n    validationStatus: validationStatusProp,\n    ...other\n  },\n  ref\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-checkbox-group\",\n    css: checkboxGroupCss,\n    window: targetWindow,\n  });\n\n  const {\n    a11yProps,\n    disabled: formFieldDisabled,\n    readOnly: formFieldReadOnly,\n    validationStatus: formFieldValidationStatus,\n  } = useFormFieldProps();\n\n  const disabled = formFieldDisabled || disabledProp;\n  const readOnly = formFieldReadOnly || readOnlyProp;\n  const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n\n  const [checkedValues, setCheckedValues] = useControlled({\n    controlled: checkedValuesProp,\n    default: defaultCheckedValues,\n    name: \"CheckboxGroup\",\n    state: \"checkedValues\",\n  });\n\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    const name = event.target.value;\n    setCheckedValues((oldValues: string[] = []) => {\n      const isSelected = oldValues.includes(name);\n\n      return isSelected\n        ? oldValues.filter((value) => value !== name)\n        : oldValues.concat(name);\n    });\n\n    onChange?.(event);\n  };\n\n  return (\n    <fieldset\n      aria-labelledby={\n        clsx(a11yProps?.[\"aria-labelledby\"], ariaLabelledBy) || undefined\n      }\n      aria-describedby={\n        clsx(a11yProps?.[\"aria-describedby\"], ariaDescribedBy) || undefined\n      }\n      className={clsx(\n        withBaseName(),\n        withBaseName(direction),\n        {\n          [withBaseName(\"noWrap\")]: !wrap,\n        },\n        className\n      )}\n      ref={ref}\n      {...other}\n    >\n      <CheckboxGroupContext.Provider\n        value={{\n          disabled,\n          name,\n          onChange: handleChange,\n          checkedValues,\n          readOnly,\n          validationStatus,\n        }}\n      >\n        {children}\n      </CheckboxGroupContext.Provider>\n    </fieldset>\n  );\n});\n"],"names":["makePrefixer","forwardRef","CheckboxGroup","useWindow","useComponentCssInjection","checkboxGroupCss","useFormFieldProps","useControlled","name","jsx","clsx","CheckboxGroupContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwDA,MAAM,YAAA,GAAeA,0BAAa,mBAAmB,CAAA,CAAA;AAExC,MAAA,aAAA,GAAgBC,gBAG3B,CAAA,SAASC,cACT,CAAA;AAAA,EACE,iBAAmB,EAAA,cAAA;AAAA,EACnB,kBAAoB,EAAA,eAAA;AAAA,EACpB,aAAe,EAAA,iBAAA;AAAA,EACf,uBAAuB,EAAC;AAAA,EACxB,QAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAU,EAAA,YAAA;AAAA,EACV,SAAY,GAAA,UAAA;AAAA,EACZ,IAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAU,EAAA,YAAA;AAAA,EACV,IAAA;AAAA,EACA,gBAAkB,EAAA,oBAAA;AAAA,EACf,GAAA,KAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,qBAAA;AAAA,IACR,GAAK,EAAAC,eAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA;AAAA,IACJ,SAAA;AAAA,IACA,QAAU,EAAA,iBAAA;AAAA,IACV,QAAU,EAAA,iBAAA;AAAA,IACV,gBAAkB,EAAA,yBAAA;AAAA,MAChBC,mCAAkB,EAAA,CAAA;AAEtB,EAAA,MAAM,WAAW,iBAAqB,IAAA,YAAA,CAAA;AACtC,EAAA,MAAM,WAAW,iBAAqB,IAAA,YAAA,CAAA;AACtC,EAAA,MAAM,mBAAmB,yBAA6B,IAAA,IAAA,GAAA,yBAAA,GAAA,oBAAA,CAAA;AAEtD,EAAA,MAAM,CAAC,aAAA,EAAe,gBAAgB,CAAA,GAAIC,2BAAc,CAAA;AAAA,IACtD,UAAY,EAAA,iBAAA;AAAA,IACZ,OAAS,EAAA,oBAAA;AAAA,IACT,IAAM,EAAA,eAAA;AAAA,IACN,KAAO,EAAA,eAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAM,MAAA,YAAA,GAAe,CAAC,KAAyC,KAAA;AAC7D,IAAMC,MAAAA,KAAAA,GAAO,MAAM,MAAO,CAAA,KAAA,CAAA;AAC1B,IAAiB,gBAAA,CAAA,CAAC,SAAsB,GAAA,EAAO,KAAA;AAC7C,MAAM,MAAA,UAAA,GAAa,SAAU,CAAA,QAAA,CAASA,KAAI,CAAA,CAAA;AAE1C,MAAO,OAAA,UAAA,GACH,SAAU,CAAA,MAAA,CAAO,CAAC,KAAA,KAAU,UAAUA,KAAI,CAAA,GAC1C,SAAU,CAAA,MAAA,CAAOA,KAAI,CAAA,CAAA;AAAA,KAC1B,CAAA,CAAA;AAED,IAAW,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACb,CAAA;AAEA,EAAA,uBACGC,cAAA,CAAA,UAAA,EAAA;AAAA,IACC,iBACE,EAAAC,SAAA,CAAK,SAAY,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAA,iBAAA,CAAA,EAAoB,cAAc,CAAK,IAAA,KAAA,CAAA;AAAA,IAE1D,kBACE,EAAAA,SAAA,CAAK,SAAY,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAA,kBAAA,CAAA,EAAqB,eAAe,CAAK,IAAA,KAAA,CAAA;AAAA,IAE5D,SAAW,EAAAA,SAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,aAAa,SAAS,CAAA;AAAA,MACtB;AAAA,QACE,CAAC,YAAA,CAAa,QAAQ,CAAA,GAAI,CAAC,IAAA;AAAA,OAC7B;AAAA,MACA,SAAA;AAAA,KACF;AAAA,IACA,GAAA;AAAA,IACC,GAAG,KAAA;AAAA,IAEJ,QAAA,kBAAAD,cAAA,CAACE,0CAAqB,QAArB,EAAA;AAAA,MACC,KAAO,EAAA;AAAA,QACL,QAAA;AAAA,QACA,IAAA;AAAA,QACA,QAAU,EAAA,YAAA;AAAA,QACV,aAAA;AAAA,QACA,QAAA;AAAA,QACA,gBAAA;AAAA,OACF;AAAA,MAEC,QAAA;AAAA,KACH,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"CheckboxGroup.js","sources":["../src/checkbox/CheckboxGroup.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ChangeEvent,\n  ChangeEventHandler,\n  ComponentPropsWithoutRef,\n  forwardRef,\n} from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { AdornmentValidationStatus } from \"../status-adornment\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { CheckboxGroupContext } from \"./internal/CheckboxGroupContext\";\nimport checkboxGroupCss from \"./CheckboxGroup.css\";\n\nexport interface CheckboxGroupProps\n  extends Omit<ComponentPropsWithoutRef<\"fieldset\">, \"onChange\"> {\n  /**\n   * The current checked options.\n   */\n  checkedValues?: string[];\n  /**\n   * The default selected options for un-controlled component.\n   */\n  defaultCheckedValues?: string[];\n  /**\n   * Display group of elements in a compact row.\n   */\n  direction?: \"horizontal\" | \"vertical\";\n  /**\n   * Disable the Checkbox group\n   */\n  disabled?: boolean;\n  /**\n   * The name used to reference the value of the control.\n   */\n  name?: string;\n  /**\n   * Callback fired when a checkbox is clicked.\n   * `event.target.value` returns the value of the checkbox that was clicked.\n   */\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n  /**\n   * If `true`, the component is read only.\n   */\n  readOnly?: boolean;\n  /**\n   * Only for horizontal direction. When `true` the text in radio button label will wrap to fit within the container. Otherwise, the checkboxes will wrap onto the next line.\n   */\n  wrap?: boolean;\n  /**\n   * Validation status.\n   */\n  validationStatus?: AdornmentValidationStatus;\n}\n\nconst withBaseName = makePrefixer(\"saltCheckboxGroup\");\n\nexport const CheckboxGroup = forwardRef<\n  HTMLFieldSetElement,\n  CheckboxGroupProps\n>(function CheckboxGroup(\n  {\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-describedby\": ariaDescribedBy,\n    checkedValues: checkedValuesProp,\n    defaultCheckedValues = [],\n    children,\n    className,\n    disabled: disabledProp,\n    direction = \"vertical\",\n    name,\n    onChange,\n    readOnly: readOnlyProp,\n    wrap,\n    validationStatus: validationStatusProp,\n    ...other\n  },\n  ref\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-checkbox-group\",\n    css: checkboxGroupCss,\n    window: targetWindow,\n  });\n\n  const {\n    a11yProps,\n    disabled: formFieldDisabled,\n    readOnly: formFieldReadOnly,\n    validationStatus: formFieldValidationStatus,\n  } = useFormFieldProps();\n\n  const disabled = formFieldDisabled || disabledProp;\n  const readOnly = formFieldReadOnly || readOnlyProp;\n  const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n\n  const [checkedValues, setCheckedValues] = useControlled({\n    controlled: checkedValuesProp,\n    default: defaultCheckedValues,\n    name: \"CheckboxGroup\",\n    state: \"checkedValues\",\n  });\n\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    const name = event.target.value;\n    setCheckedValues((oldValues: string[] = []) => {\n      const isSelected = oldValues.includes(name);\n\n      return isSelected\n        ? oldValues.filter((value) => value !== name)\n        : oldValues.concat(name);\n    });\n\n    onChange?.(event);\n  };\n\n  return (\n    <fieldset\n      aria-labelledby={\n        clsx(a11yProps?.[\"aria-labelledby\"], ariaLabelledBy) || undefined\n      }\n      aria-describedby={\n        clsx(a11yProps?.[\"aria-describedby\"], ariaDescribedBy) || undefined\n      }\n      className={clsx(\n        withBaseName(),\n        withBaseName(direction),\n        {\n          [withBaseName(\"noWrap\")]: !wrap,\n        },\n        className\n      )}\n      ref={ref}\n      {...other}\n    >\n      <CheckboxGroupContext.Provider\n        value={{\n          disabled,\n          name,\n          onChange: handleChange,\n          checkedValues,\n          readOnly,\n          validationStatus,\n        }}\n      >\n        {children}\n      </CheckboxGroupContext.Provider>\n    </fieldset>\n  );\n});\n"],"names":["makePrefixer","forwardRef","CheckboxGroup","useWindow","useComponentCssInjection","checkboxGroupCss","useFormFieldProps","useControlled","name","jsx","clsx","CheckboxGroupContext"],"mappings":"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"}

package/dist-cjs/checkbox/CheckboxIcon.js

@@ -38,6 +38,7 @@ require('../dialog/DialogActions.js');
 require('../dialog/DialogContent.js');
 require('../dialog/DialogContext.js');
 require('../dialog/DialogCloseButton.js');
+require('../divider/Divider.js');
 require('../drawer/Drawer.js');
 require('../drawer/DrawerCloseButton.js');
 require('../dropdown/Dropdown.js');
@@ -65,6 +66,7 @@ require('../interactable-card/InteractableCardGroup.js');
 require('../interactable-card/InteractableCardGroupContext.js');
 require('../link/Link.js');
 require('../link-card/LinkCard.js');
+require('../list-box/ListBox.js');
 require('../list-control/ListControlContext.js');
 require('../menu/MenuContext.js');
 require('@floating-ui/react');
@@ -102,6 +104,7 @@ require('../toast/Toast.js');
 require('../toast/ToastContent.js');
 require('../split-layout/SplitLayout.js');
 require('../switch/Switch.js');
+require('../tag/Tag.js');
 require('../toggle-button/ToggleButton.js');
 require('../toggle-button-group/ToggleButtonGroup.js');
 require('../toggle-button-group/ToggleButtonGroupContext.js');

package/dist-cjs/checkbox/CheckboxIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxIcon.js","sources":["../src/checkbox/CheckboxIcon.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useDensity } from \"../salt-provider\";\nimport { AdornmentValidationStatus } from \"../status-adornment\";\nimport { makePrefixer } from \"../utils\";\nimport checkboxIconCss from \"./CheckboxIcon.css\";\nimport {\n  IconProps,\n  SuccessIcon,\n  SuccessSmallIcon,\n  SuccessSmallSolidIcon,\n  SuccessSolidIcon,\n} from \"@salt-ds/icons\";\n\nexport interface CheckboxIconProps {\n  checked?: boolean;\n  className?: string;\n  disabled?: boolean;\n  /**\n   * @deprecated Use validationStatus instead\n   */\n  error?: boolean;\n  indeterminate?: boolean;\n  readOnly?: boolean;\n  validationStatus?: AdornmentValidationStatus;\n}\n\nconst withBaseName = makePrefixer(\"saltCheckboxIcon\");\n\nfunction CheckedIcon(props: IconProps) {\n  const density = useDensity();\n  return density === \"high\" ? (\n    <SuccessSmallSolidIcon {...props} />\n  ) : (\n    <SuccessSolidIcon {...props} />\n  );\n}\n\nfunction CheckedReadOnlyIcon(props: IconProps) {\n  const density = useDensity();\n  return density === \"high\" ? (\n    <SuccessSmallIcon {...props} />\n  ) : (\n    <SuccessIcon {...props} />\n  );\n}\n\nexport const CheckboxIcon = ({\n  checked = false,\n  className,\n  disabled,\n  error,\n  indeterminate,\n  validationStatus,\n  readOnly,\n}: CheckboxIconProps): JSX.Element => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-checkbox-icon\",\n    css: checkboxIconCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div\n      aria-hidden=\"true\"\n      className={clsx(\n        withBaseName(),\n        {\n          [withBaseName(\"checked\")]: checked,\n          [withBaseName(\"disabled\")]: disabled,\n          [withBaseName(\"error\")]: error,\n          [withBaseName(validationStatus || \"\")]: validationStatus,\n          [withBaseName(\"indeterminate\")]: indeterminate,\n          [withBaseName(\"readOnly\")]: readOnly,\n        },\n        className\n      )}\n    >\n      {checked && !indeterminate && !readOnly && (\n        <CheckedIcon className={withBaseName(\"icon\")} />\n      )}\n      {checked && !indeterminate && readOnly && (\n        <CheckedReadOnlyIcon className={withBaseName(\"icon\")} />\n      )}\n    </div>\n  );\n};\n"],"names":["makePrefixer","useDensity","jsx","SuccessSmallSolidIcon","SuccessSolidIcon","SuccessSmallIcon","SuccessIcon","useWindow","useComponentCssInjection","checkboxIconCss","jsxs","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,MAAM,YAAA,GAAeA,0BAAa,kBAAkB,CAAA,CAAA;AAEpD,SAAS,YAAY,KAAkB,EAAA;AACrC,EAAA,MAAM,UAAUC,uBAAW,EAAA,CAAA;AAC3B,EAAO,OAAA,OAAA,KAAY,yBAChBC,cAAA,CAAAC,2BAAA,EAAA;AAAA,IAAuB,GAAG,KAAA;AAAA,GAAO,oBAEjCD,cAAA,CAAAE,sBAAA,EAAA;AAAA,IAAkB,GAAG,KAAA;AAAA,GAAO,CAAA,CAAA;AAEjC,CAAA;AAEA,SAAS,oBAAoB,KAAkB,EAAA;AAC7C,EAAA,MAAM,UAAUH,uBAAW,EAAA,CAAA;AAC3B,EAAO,OAAA,OAAA,KAAY,yBAChBC,cAAA,CAAAG,sBAAA,EAAA;AAAA,IAAkB,GAAG,KAAA;AAAA,GAAO,oBAE5BH,cAAA,CAAAI,iBAAA,EAAA;AAAA,IAAa,GAAG,KAAA;AAAA,GAAO,CAAA,CAAA;AAE5B,CAAA;AAEO,MAAM,eAAe,CAAC;AAAA,EAC3B,OAAU,GAAA,KAAA;AAAA,EACV,SAAA;AAAA,EACA,QAAA;AAAA,EACA,KAAA;AAAA,EACA,aAAA;AAAA,EACA,gBAAA;AAAA,EACA,QAAA;AACF,CAAsC,KAAA;AACpC,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,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,IACC,aAAY,EAAA,MAAA;AAAA,IACZ,SAAW,EAAAC,SAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb;AAAA,QACE,CAAC,YAAa,CAAA,SAAS,CAAI,GAAA,OAAA;AAAA,QAC3B,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,QAC5B,CAAC,YAAa,CAAA,OAAO,CAAI,GAAA,KAAA;AAAA,QACzB,CAAC,YAAA,CAAa,gBAAoB,IAAA,EAAE,CAAI,GAAA,gBAAA;AAAA,QACxC,CAAC,YAAa,CAAA,eAAe,CAAI,GAAA,aAAA;AAAA,QACjC,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,OAC9B;AAAA,MACA,SAAA;AAAA,KACF;AAAA,IAEC,QAAA,EAAA;AAAA,MAAA,OAAA,IAAW,CAAC,aAAA,IAAiB,CAAC,QAAA,oBAC5BT,cAAA,CAAA,WAAA,EAAA;AAAA,QAAY,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,OAAG,CAAA;AAAA,MAE/C,OAAW,IAAA,CAAC,aAAiB,IAAA,QAAA,oBAC3BA,cAAA,CAAA,mBAAA,EAAA;AAAA,QAAoB,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,OAAG,CAAA;AAAA,KAAA;AAAA,GAE1D,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"CheckboxIcon.js","sources":["../src/checkbox/CheckboxIcon.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useDensity } from \"../salt-provider\";\nimport { AdornmentValidationStatus } from \"../status-adornment\";\nimport { makePrefixer } from \"../utils\";\nimport checkboxIconCss from \"./CheckboxIcon.css\";\nimport {\n  IconProps,\n  SuccessIcon,\n  SuccessSmallIcon,\n  SuccessSmallSolidIcon,\n  SuccessSolidIcon,\n} from \"@salt-ds/icons\";\n\nexport interface CheckboxIconProps {\n  checked?: boolean;\n  className?: string;\n  disabled?: boolean;\n  /**\n   * @deprecated Use validationStatus instead\n   */\n  error?: boolean;\n  indeterminate?: boolean;\n  readOnly?: boolean;\n  validationStatus?: AdornmentValidationStatus;\n}\n\nconst withBaseName = makePrefixer(\"saltCheckboxIcon\");\n\nfunction CheckedIcon(props: IconProps) {\n  const density = useDensity();\n  return density === \"high\" ? (\n    <SuccessSmallSolidIcon {...props} />\n  ) : (\n    <SuccessSolidIcon {...props} />\n  );\n}\n\nfunction CheckedReadOnlyIcon(props: IconProps) {\n  const density = useDensity();\n  return density === \"high\" ? (\n    <SuccessSmallIcon {...props} />\n  ) : (\n    <SuccessIcon {...props} />\n  );\n}\n\nexport const CheckboxIcon = ({\n  checked = false,\n  className,\n  disabled,\n  error,\n  indeterminate,\n  validationStatus,\n  readOnly,\n}: CheckboxIconProps): JSX.Element => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-checkbox-icon\",\n    css: checkboxIconCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div\n      aria-hidden=\"true\"\n      className={clsx(\n        withBaseName(),\n        {\n          [withBaseName(\"checked\")]: checked,\n          [withBaseName(\"disabled\")]: disabled,\n          [withBaseName(\"error\")]: error,\n          [withBaseName(validationStatus || \"\")]: validationStatus,\n          [withBaseName(\"indeterminate\")]: indeterminate,\n          [withBaseName(\"readOnly\")]: readOnly,\n        },\n        className\n      )}\n    >\n      {checked && !indeterminate && !readOnly && (\n        <CheckedIcon className={withBaseName(\"icon\")} />\n      )}\n      {checked && !indeterminate && readOnly && (\n        <CheckedReadOnlyIcon className={withBaseName(\"icon\")} />\n      )}\n    </div>\n  );\n};\n"],"names":["makePrefixer","useDensity","jsx","SuccessSmallSolidIcon","SuccessSolidIcon","SuccessSmallIcon","SuccessIcon","useWindow","useComponentCssInjection","checkboxIconCss","jsxs","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,MAAM,YAAA,GAAeA,0BAAa,kBAAkB,CAAA,CAAA;AAEpD,SAAS,YAAY,KAAkB,EAAA;AACrC,EAAA,MAAM,UAAUC,uBAAW,EAAA,CAAA;AAC3B,EAAO,OAAA,OAAA,KAAY,yBAChBC,cAAA,CAAAC,2BAAA,EAAA;AAAA,IAAuB,GAAG,KAAA;AAAA,GAAO,oBAEjCD,cAAA,CAAAE,sBAAA,EAAA;AAAA,IAAkB,GAAG,KAAA;AAAA,GAAO,CAAA,CAAA;AAEjC,CAAA;AAEA,SAAS,oBAAoB,KAAkB,EAAA;AAC7C,EAAA,MAAM,UAAUH,uBAAW,EAAA,CAAA;AAC3B,EAAO,OAAA,OAAA,KAAY,yBAChBC,cAAA,CAAAG,sBAAA,EAAA;AAAA,IAAkB,GAAG,KAAA;AAAA,GAAO,oBAE5BH,cAAA,CAAAI,iBAAA,EAAA;AAAA,IAAa,GAAG,KAAA;AAAA,GAAO,CAAA,CAAA;AAE5B,CAAA;AAEO,MAAM,eAAe,CAAC;AAAA,EAC3B,OAAU,GAAA,KAAA;AAAA,EACV,SAAA;AAAA,EACA,QAAA;AAAA,EACA,KAAA;AAAA,EACA,aAAA;AAAA,EACA,gBAAA;AAAA,EACA,QAAA;AACF,CAAsC,KAAA;AACpC,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,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,IACC,aAAY,EAAA,MAAA;AAAA,IACZ,SAAW,EAAAC,SAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb;AAAA,QACE,CAAC,YAAa,CAAA,SAAS,CAAI,GAAA,OAAA;AAAA,QAC3B,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,QAC5B,CAAC,YAAa,CAAA,OAAO,CAAI,GAAA,KAAA;AAAA,QACzB,CAAC,YAAA,CAAa,gBAAoB,IAAA,EAAE,CAAI,GAAA,gBAAA;AAAA,QACxC,CAAC,YAAa,CAAA,eAAe,CAAI,GAAA,aAAA;AAAA,QACjC,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,OAC9B;AAAA,MACA,SAAA;AAAA,KACF;AAAA,IAEC,QAAA,EAAA;AAAA,MAAA,OAAA,IAAW,CAAC,aAAA,IAAiB,CAAC,QAAA,oBAC5BT,cAAA,CAAA,WAAA,EAAA;AAAA,QAAY,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,OAAG,CAAA;AAAA,MAE/C,OAAW,IAAA,CAAC,aAAiB,IAAA,QAAA,oBAC3BA,cAAA,CAAA,mBAAA,EAAA;AAAA,QAAoB,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,OAAG,CAAA;AAAA,KAAA;AAAA,GAE1D,CAAA,CAAA;AAEJ;;;;"}

package/dist-cjs/checkbox/internal/CheckboxGroupContext.js

@@ -37,6 +37,7 @@ require('../../dialog/DialogActions.js');
 require('../../dialog/DialogContent.js');
 require('../../dialog/DialogContext.js');
 require('../../dialog/DialogCloseButton.js');
+require('../../divider/Divider.js');
 require('../../drawer/Drawer.js');
 require('../../drawer/DrawerCloseButton.js');
 require('../../dropdown/Dropdown.js');
@@ -64,6 +65,7 @@ require('../../interactable-card/InteractableCardGroup.js');
 require('../../interactable-card/InteractableCardGroupContext.js');
 require('../../link/Link.js');
 require('../../link-card/LinkCard.js');
+require('../../list-box/ListBox.js');
 require('../../list-control/ListControlContext.js');
 require('../../menu/MenuContext.js');
 require('@floating-ui/react');
@@ -101,6 +103,7 @@ require('../../toast/Toast.js');
 require('../../toast/ToastContent.js');
 require('../../split-layout/SplitLayout.js');
 require('../../switch/Switch.js');
+require('../../tag/Tag.js');
 require('../../toggle-button/ToggleButton.js');
 require('../../toggle-button-group/ToggleButtonGroup.js');
 require('../../toggle-button-group/ToggleButtonGroupContext.js');

package/dist-cjs/checkbox/internal/CheckboxGroupContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxGroupContext.js","sources":["../src/checkbox/internal/CheckboxGroupContext.ts"],"sourcesContent":["import { AdornmentValidationStatus } from \"../../status-adornment\";\nimport { CheckboxGroupProps } from \"../CheckboxGroup\";\nimport { createContext } from \"../../utils\";\n\nexport interface CheckboxGroupState {\n  disabled?: boolean;\n  name?: CheckboxGroupProps[\"name\"];\n  onChange?: CheckboxGroupProps[\"onChange\"];\n  checkedValues?: CheckboxGroupProps[\"checkedValues\"];\n  readOnly?: boolean;\n  validationStatus?: AdornmentValidationStatus;\n}\n\nconst CheckboxGroupContext = createContext<CheckboxGroupState | undefined>(\n  \"CheckboxGroupContext\",\n  undefined\n);\n\nexport { CheckboxGroupContext };\n"],"names":["createContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,MAAM,oBAAuB,GAAAA,2BAAA;AAAA,EAC3B,sBAAA;AAAA,EACA,KAAA,CAAA;AACF;;;;"}
+{"version":3,"file":"CheckboxGroupContext.js","sources":["../src/checkbox/internal/CheckboxGroupContext.ts"],"sourcesContent":["import { AdornmentValidationStatus } from \"../../status-adornment\";\nimport { CheckboxGroupProps } from \"../CheckboxGroup\";\nimport { createContext } from \"../../utils\";\n\nexport interface CheckboxGroupState {\n  disabled?: boolean;\n  name?: CheckboxGroupProps[\"name\"];\n  onChange?: CheckboxGroupProps[\"onChange\"];\n  checkedValues?: CheckboxGroupProps[\"checkedValues\"];\n  readOnly?: boolean;\n  validationStatus?: AdornmentValidationStatus;\n}\n\nconst CheckboxGroupContext = createContext<CheckboxGroupState | undefined>(\n  \"CheckboxGroupContext\",\n  undefined\n);\n\nexport { CheckboxGroupContext };\n"],"names":["createContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,MAAM,oBAAuB,GAAAA,2BAAA;AAAA,EAC3B,sBAAA;AAAA,EACA,KAAA,CAAA;AACF;;;;"}

package/dist-cjs/combo-box/ComboBox.js

@@ -38,6 +38,7 @@ require('../dialog/DialogActions.js');
 require('../dialog/DialogContent.js');
 require('../dialog/DialogContext.js');
 require('../dialog/DialogCloseButton.js');
+require('../divider/Divider.js');
 require('../drawer/Drawer.js');
 require('../drawer/DrawerCloseButton.js');
 require('../dropdown/Dropdown.js');
@@ -66,6 +67,7 @@ require('../interactable-card/InteractableCardGroup.js');
 require('../interactable-card/InteractableCardGroupContext.js');
 require('../link/Link.js');
 require('../link-card/LinkCard.js');
+require('../list-box/ListBox.js');
 var ListControlContext = require('../list-control/ListControlContext.js');
 require('../menu/MenuContext.js');
 require('../menu/MenuItem.js');
@@ -102,6 +104,7 @@ require('../toast/Toast.js');
 require('../toast/ToastContent.js');
 require('../split-layout/SplitLayout.js');
 require('../switch/Switch.js');
+require('../tag/Tag.js');
 require('../toggle-button/ToggleButton.js');
 require('../toggle-button-group/ToggleButtonGroup.js');
 require('../toggle-button-group/ToggleButtonGroupContext.js');
@@ -122,6 +125,7 @@ const ComboBox = React.forwardRef(function ComboBox2(props, ref) {
     endAdornment,
     readOnly: readOnlyProp,
     multiselect,
+    selectOnTab = !multiselect,
     onSelectionChange,
     selected,
     defaultSelected,
@@ -174,10 +178,14 @@ const ComboBox = React.forwardRef(function ComboBox2(props, ref) {
     openState,
     setOpen,
     openKey,
-    getOptionAtIndex,
     getIndexOfOption,
     getOptionsMatching,
-    options,
+    getFirstOption,
+    getLastOption,
+    getOptionAfter,
+    getOptionBefore,
+    getOptionPageAbove,
+    getOptionPageBelow,
     selectedState,
     select,
     clear,
@@ -241,8 +249,7 @@ const ComboBox = React.forwardRef(function ComboBox2(props, ref) {
     (_a2 = inputRef.current) == null ? void 0 : _a2.focus();
   };
   const handleKeyDown = (event) => {
-    const currentIndex = activeState ? getIndexOfOption(activeState) : -1;
-    const count = options.length - 1;
+    var _a2, _b2, _c;
     if (readOnly) {
       return;
     }
@@ -252,25 +259,26 @@ const ComboBox = React.forwardRef(function ComboBox2(props, ref) {
         return;
       }
     }
+    const activeOption = activeState != null ? activeState : (_a2 = getFirstOption()) == null ? void 0 : _a2.data;
     let newActive;
     switch (event.key) {
       case "ArrowDown":
-        newActive = getOptionAtIndex(Math.min(count, currentIndex + 1));
+        newActive = (_b2 = getOptionAfter(activeOption)) != null ? _b2 : getLastOption();
         break;
       case "ArrowUp":
-        newActive = getOptionAtIndex(Math.max(0, currentIndex - 1));
+        newActive = (_c = getOptionBefore(activeOption)) != null ? _c : getFirstOption();
         break;
       case "Home":
-        newActive = getOptionAtIndex(0);
+        newActive = getFirstOption();
         break;
       case "End":
-        newActive = getOptionAtIndex(count);
+        newActive = getLastOption();
         break;
       case "PageUp":
-        newActive = getOptionAtIndex(Math.max(0, currentIndex - 10));
+        newActive = getOptionPageAbove(activeOption);
         break;
       case "PageDown":
-        newActive = getOptionAtIndex(Math.min(count, currentIndex + 10));
+        newActive = getOptionPageBelow(activeOption);
         break;
       case "Enter":
         if (openState && (activeState == null ? void 0 : activeState.disabled)) {
@@ -286,7 +294,7 @@ const ComboBox = React.forwardRef(function ComboBox2(props, ref) {
         }
         break;
       case "Tab":
-        if (!multiselect && activeState) {
+        if (openState && selectOnTab && activeState && !(activeState == null ? void 0 : activeState.disabled) && !selectedState.includes(activeState == null ? void 0 : activeState.value)) {
           select(event, activeState);
         }
         break;
@@ -294,9 +302,9 @@ const ComboBox = React.forwardRef(function ComboBox2(props, ref) {
     if (newActive) {
       setFocusVisibleState(true);
     }
-    if (newActive && (newActive == null ? void 0 : newActive.id) != (activeState == null ? void 0 : activeState.id)) {
+    if (newActive && newActive.data.id != (activeState == null ? void 0 : activeState.id)) {
       event.preventDefault();
-      setActive(newActive);
+      setActive(newActive.data);
     }
     onKeyDown == null ? void 0 : onKeyDown(event);
   };
@@ -319,9 +327,9 @@ const ComboBox = React.forwardRef(function ComboBox2(props, ref) {
     setValueState(value2);
     queueMicrotask(() => {
       if (value2 != "") {
-        const newOption = getOptionAtIndex(0);
+        const newOption = getFirstOption();
         if (newOption) {
-          setActive(newOption);
+          setActive(newOption.data);
         }
       } else {
         setActive(void 0);
@@ -361,17 +369,17 @@ const ComboBox = React.forwardRef(function ComboBox2(props, ref) {
     }
     if (!newActive) {
       if (openKey.current === "ArrowDown") {
-        newActive = getOptionAtIndex(0);
+        newActive = getFirstOption();
         setFocusVisibleState(true);
       } else if (openKey.current === "ArrowUp") {
-        newActive = getOptionAtIndex(options.length - 1);
+        newActive = getLastOption();
         setFocusVisibleState(true);
       }
     }
     if (!newActive) {
-      newActive = getOptionAtIndex(0);
+      newActive = getFirstOption();
     }
-    setActive(newActive);
+    setActive(newActive == null ? void 0 : newActive.data);
   }, [openState, children]);
   const buttonId = useId.useId();
   const listId = useId.useId();
@@ -380,7 +388,7 @@ const ComboBox = React.forwardRef(function ComboBox2(props, ref) {
     value: listControl,
     children: [
       /* @__PURE__ */ jsxRuntime.jsx(PillInput.PillInput, {
-        tabIndex: -1,
+        tabIndex: !disabled ? -1 : void 0,
         className: clsx.clsx(
           withBaseName(),
           {

package/dist-cjs/combo-box/ComboBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboBox.js","sources":["../src/combo-box/ComboBox.tsx"],"sourcesContent":["import {\n  ChangeEvent,\n  FocusEvent,\n  ForwardedRef,\n  forwardRef,\n  KeyboardEvent,\n  MouseEvent,\n  ReactNode,\n  Ref,\n  SyntheticEvent,\n  useEffect,\n  useRef,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport {\n  flip,\n  size,\n  useClick,\n  useDismiss,\n  useFocus,\n  useInteractions,\n} from \"@floating-ui/react\";\nimport { ChevronDownIcon, ChevronUpIcon } from \"@salt-ds/icons\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport {\n  makePrefixer,\n  useFloatingUI,\n  UseFloatingUIProps,\n  useForkRef,\n  useId,\n} from \"../utils\";\nimport { Button } from \"../button\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { defaultValueToString } from \"../list-control/ListControlState\";\nimport { ListControlContext } from \"../list-control/ListControlContext\";\nimport { useComboBox, UseComboBoxProps } from \"./useComboBox\";\nimport { OptionList } from \"../option/OptionList\";\nimport { PillInput, PillInputProps } from \"../pill-input\";\nimport comboBoxCss from \"./ComboBox.css\";\n\nexport type ComboBoxProps<Item = string> = {\n  /**\n   * The options to display in the combo box.\n   */\n  children?: ReactNode;\n} & UseComboBoxProps<Item> &\n  PillInputProps;\n\nconst withBaseName = makePrefixer(\"saltComboBox\");\n\nexport const ComboBox = forwardRef(function ComboBox<Item>(\n  props: ComboBoxProps<Item>,\n  ref: ForwardedRef<HTMLDivElement>\n) {\n  const {\n    children,\n    className,\n    disabled: disabledProp,\n    endAdornment,\n    readOnly: readOnlyProp,\n    multiselect,\n    onSelectionChange,\n    selected,\n    defaultSelected,\n    defaultOpen,\n    onOpenChange,\n    onChange,\n    open,\n    inputProps: inputPropsProp,\n    variant = \"primary\",\n    onKeyDown,\n    onFocus,\n    onBlur,\n    value,\n    defaultValue,\n    valueToString = defaultValueToString,\n    truncate,\n    ...rest\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-combo-box\",\n    css: comboBoxCss,\n    window: targetWindow,\n  });\n\n  const {\n    a11yProps: { \"aria-labelledby\": formFieldLabelledBy } = {},\n    disabled: formFieldDisabled,\n    readOnly: formFieldReadOnly,\n  } = useFormFieldProps();\n\n  const disabled = Boolean(disabledProp) || formFieldDisabled;\n  const readOnly = Boolean(readOnlyProp) || formFieldReadOnly;\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const listControl = useComboBox<Item>({\n    open,\n    defaultOpen,\n    onOpenChange,\n    multiselect,\n    defaultSelected,\n    selected,\n    onSelectionChange,\n    value,\n    defaultValue,\n    disabled,\n    readOnly,\n    valueToString,\n  });\n\n  const {\n    activeState,\n    setActive,\n    openState,\n    setOpen,\n    openKey,\n    getOptionAtIndex,\n    getIndexOfOption,\n    getOptionsMatching,\n    options,\n    selectedState,\n    select,\n    clear,\n    focusVisibleState,\n    setFocusVisibleState,\n    focusedState,\n    setFocusedState,\n    listRef,\n    valueState,\n    setValueState,\n    removePill,\n  } = listControl;\n\n  const handleOpenChange: UseFloatingUIProps[\"onOpenChange\"] = (\n    newOpen,\n    _event,\n    reason\n  ) => {\n    const focusNotBlur = reason === \"focus\" && newOpen;\n    if (reason == \"focus\") {\n      setFocusedState(newOpen);\n    }\n\n    if (reason == \"focus\" && !newOpen) {\n      setFocusVisibleState(false);\n    }\n\n    if (readOnly || focusNotBlur) return;\n    setOpen(newOpen);\n\n    if (newOpen) {\n      inputRef.current?.focus();\n    }\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      strategy: \"fixed\",\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(${availableHeight}px - var(--salt-spacing-100)), calc((var(--salt-size-base) + var(--salt-spacing-100)) * 5))`,\n            });\n          },\n        }),\n        flip({ fallbackStrategy: \"initialPlacement\" }),\n      ],\n    });\n\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    useDismiss(context),\n    useFocus(context),\n    useClick(context, { keyboardHandlers: false, toggle: false }),\n  ]);\n\n  const handleRef = useForkRef<HTMLDivElement>(reference, ref);\n\n  const handleButtonClick = (event: MouseEvent<HTMLButtonElement>) => {\n    if (!readOnly) {\n      event.stopPropagation();\n      setFocusVisibleState(false);\n      setOpen(!openState, \"manual\");\n    }\n  };\n\n  const handleButtonFocus = () => {\n    inputRef.current?.focus();\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\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    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        if (openState && activeState?.disabled) {\n          event.preventDefault();\n          return;\n        }\n\n        if (!openState || !activeState) {\n          return;\n        }\n\n        select(event, activeState);\n\n        if (!multiselect) {\n          event.preventDefault();\n        }\n\n        break;\n      case \"Tab\":\n        if (!multiselect && activeState) {\n          select(event, activeState);\n        }\n        break;\n    }\n\n    if (newActive) {\n      setFocusVisibleState(true);\n    }\n\n    if (newActive && newActive?.id != activeState?.id) {\n      event.preventDefault();\n      setActive(newActive);\n    }\n\n    onKeyDown?.(event);\n  };\n\n  const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n    setFocusedState(true);\n    onFocus?.(event);\n  };\n\n  const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\n    event.persist();\n    onBlur?.(event);\n  };\n\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    const value = event.target.value;\n\n    if (!openState) {\n      setOpen(true, \"input\");\n    }\n\n    if (value === \"\" && !multiselect) {\n      clear(event);\n    }\n\n    setValueState(value);\n\n    // Wait for the filter to happen\n    queueMicrotask(() => {\n      if (value != \"\") {\n        const newOption = getOptionAtIndex(0);\n        if (newOption) {\n          setActive(newOption);\n        }\n      } else {\n        setActive(undefined);\n      }\n    });\n\n    onChange?.(event);\n  };\n\n  const handlePillRemove = (event: SyntheticEvent, index: number) => {\n    event.stopPropagation();\n    const removed = selectedState[index];\n    removePill(event, removed);\n  };\n\n  const handleListMouseOver = () => {\n    setFocusVisibleState(false);\n  };\n\n  const handleListMouseLeave = () => {\n    setActive(undefined);\n  };\n\n  const handleFocusInput = () => {\n    inputRef.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 > -1) {\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        setFocusVisibleState(true);\n      } else if (openKey.current === \"ArrowUp\") {\n        newActive = getOptionAtIndex(options.length - 1);\n        setFocusVisibleState(true);\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    /* eslint-disable-next-line react-hooks/exhaustive-deps -- We only want this to run when the list's openState or the displayed options change */\n  }, [openState, children]);\n\n  const buttonId = useId();\n  const listId = useId();\n\n  const handleListRef = useForkRef<HTMLDivElement>(listRef, floating);\n\n  return (\n    <ListControlContext.Provider value={listControl}>\n      <PillInput\n        tabIndex={-1}\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"focused\")]: focusedState,\n            [withBaseName(\"focusVisible\")]: focusVisibleState,\n          },\n          className\n        )}\n        endAdornment={\n          <>\n            {endAdornment}\n            {!readOnly ? (\n              <Button\n                aria-labelledby={clsx(buttonId, formFieldLabelledBy)}\n                aria-label=\"Show options\"\n                aria-expanded={openState}\n                aria-controls={openState ? listId : undefined}\n                aria-haspopup=\"listbox\"\n                disabled={disabled}\n                variant=\"secondary\"\n                onClick={handleButtonClick}\n                onFocus={handleButtonFocus}\n                tabIndex={-1}\n              >\n                {openState ? (\n                  <ChevronUpIcon aria-hidden />\n                ) : (\n                  <ChevronDownIcon aria-hidden />\n                )}\n              </Button>\n            ) : undefined}\n          </>\n        }\n        onChange={handleChange}\n        role=\"combobox\"\n        disabled={disabled}\n        readOnly={readOnly}\n        inputProps={{\n          role: \"combobox\",\n          \"aria-expanded\": openState,\n          \"aria-multiselectable\": multiselect,\n          \"aria-controls\": openState ? listId : undefined,\n          onKeyDown: handleKeyDown,\n          ...inputPropsProp,\n        }}\n        aria-activedescendant={activeState?.id}\n        variant={variant}\n        inputRef={inputRef}\n        value={valueState}\n        ref={handleRef}\n        {...getReferenceProps({\n          onBlur: handleBlur,\n          onFocus: handleFocus,\n          ...rest,\n        })}\n        pills={\n          multiselect ? selectedState.map((item) => valueToString(item)) : []\n        }\n        truncate={truncate && !focusedState && !openState}\n        onPillRemove={handlePillRemove}\n        hidePillClose={!focusedState || readOnly}\n        emptyReadOnlyMarker={\n          readOnly && selectedState.length > 0 ? \"\" : undefined\n        }\n      />\n      <OptionList\n        open={(openState || focusedState) && !readOnly && children != undefined}\n        collapsed={!openState}\n        ref={handleListRef}\n        id={listId}\n        tabIndex={-1}\n        {...getFloatingProps({\n          onMouseOver: handleListMouseOver,\n          onFocus: handleFocusInput,\n          onClick: handleFocusInput,\n          onMouseLeave: handleListMouseLeave,\n        })}\n        left={x ?? 0}\n        top={y ?? 0}\n        position={strategy}\n        width={elements.floating?.offsetWidth}\n        height={elements.floating?.offsetHeight}\n      >\n        {children}\n      </OptionList>\n    </ListControlContext.Provider>\n  );\n}) as <Item = string>(\n  props: ComboBoxProps<Item> & { ref?: Ref<HTMLDivElement> }\n) => JSX.Element;\n"],"names":["makePrefixer","forwardRef","ComboBox","defaultValueToString","useWindow","useComponentCssInjection","comboBoxCss","useFormFieldProps","useRef","useComboBox","_a","useFloatingUI","size","elements","flip","useInteractions","useDismiss","useFocus","useClick","useForkRef","value","useEffect","useId","jsxs","ListControlContext","jsx","PillInput","clsx","Fragment","Button","ChevronUpIcon","ChevronDownIcon","OptionList"],"mappings":"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"}
+{"version":3,"file":"ComboBox.js","sources":["../src/combo-box/ComboBox.tsx"],"sourcesContent":["import {\n  ChangeEvent,\n  FocusEvent,\n  ForwardedRef,\n  forwardRef,\n  KeyboardEvent,\n  MouseEvent,\n  ReactNode,\n  Ref,\n  SyntheticEvent,\n  useEffect,\n  useRef,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport {\n  flip,\n  size,\n  useClick,\n  useDismiss,\n  useFocus,\n  useInteractions,\n} from \"@floating-ui/react\";\nimport { ChevronDownIcon, ChevronUpIcon } from \"@salt-ds/icons\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport {\n  makePrefixer,\n  useFloatingUI,\n  UseFloatingUIProps,\n  useForkRef,\n  useId,\n} from \"../utils\";\nimport { Button } from \"../button\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { defaultValueToString } from \"../list-control/ListControlState\";\nimport { ListControlContext } from \"../list-control/ListControlContext\";\nimport { useComboBox, UseComboBoxProps } from \"./useComboBox\";\nimport { OptionList } from \"../option/OptionList\";\nimport { PillInput, PillInputProps } from \"../pill-input\";\nimport comboBoxCss from \"./ComboBox.css\";\n\nexport type ComboBoxProps<Item = string> = {\n  /**\n   * The options to display in the combo box.\n   */\n  children?: ReactNode;\n  /**\n   * If true, options will be selected on tab key press.\n   */\n  selectOnTab?: boolean;\n} & UseComboBoxProps<Item> &\n  PillInputProps;\n\nconst withBaseName = makePrefixer(\"saltComboBox\");\n\nexport const ComboBox = forwardRef(function ComboBox<Item>(\n  props: ComboBoxProps<Item>,\n  ref: ForwardedRef<HTMLDivElement>\n) {\n  const {\n    children,\n    className,\n    disabled: disabledProp,\n    endAdornment,\n    readOnly: readOnlyProp,\n    multiselect,\n    selectOnTab = !multiselect,\n    onSelectionChange,\n    selected,\n    defaultSelected,\n    defaultOpen,\n    onOpenChange,\n    onChange,\n    open,\n    inputProps: inputPropsProp,\n    variant = \"primary\",\n    onKeyDown,\n    onFocus,\n    onBlur,\n    value,\n    defaultValue,\n    valueToString = defaultValueToString,\n    truncate,\n    ...rest\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-combo-box\",\n    css: comboBoxCss,\n    window: targetWindow,\n  });\n\n  const {\n    a11yProps: { \"aria-labelledby\": formFieldLabelledBy } = {},\n    disabled: formFieldDisabled,\n    readOnly: formFieldReadOnly,\n  } = useFormFieldProps();\n\n  const disabled = Boolean(disabledProp) || formFieldDisabled;\n  const readOnly = Boolean(readOnlyProp) || formFieldReadOnly;\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const listControl = useComboBox<Item>({\n    open,\n    defaultOpen,\n    onOpenChange,\n    multiselect,\n    defaultSelected,\n    selected,\n    onSelectionChange,\n    value,\n    defaultValue,\n    disabled,\n    readOnly,\n    valueToString,\n  });\n\n  const {\n    activeState,\n    setActive,\n    openState,\n    setOpen,\n    openKey,\n    getIndexOfOption,\n    getOptionsMatching,\n    getFirstOption,\n    getLastOption,\n    getOptionAfter,\n    getOptionBefore,\n    getOptionPageAbove,\n    getOptionPageBelow,\n    selectedState,\n    select,\n    clear,\n    focusVisibleState,\n    setFocusVisibleState,\n    focusedState,\n    setFocusedState,\n    listRef,\n    valueState,\n    setValueState,\n    removePill,\n  } = listControl;\n\n  const handleOpenChange: UseFloatingUIProps[\"onOpenChange\"] = (\n    newOpen,\n    _event,\n    reason\n  ) => {\n    const focusNotBlur = reason === \"focus\" && newOpen;\n    if (reason == \"focus\") {\n      setFocusedState(newOpen);\n    }\n\n    if (reason == \"focus\" && !newOpen) {\n      setFocusVisibleState(false);\n    }\n\n    if (readOnly || focusNotBlur) return;\n    setOpen(newOpen);\n\n    if (newOpen) {\n      inputRef.current?.focus();\n    }\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      strategy: \"fixed\",\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(${availableHeight}px - var(--salt-spacing-100)), calc((var(--salt-size-base) + var(--salt-spacing-100)) * 5))`,\n            });\n          },\n        }),\n        flip({ fallbackStrategy: \"initialPlacement\" }),\n      ],\n    });\n\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    useDismiss(context),\n    useFocus(context),\n    useClick(context, { keyboardHandlers: false, toggle: false }),\n  ]);\n\n  const handleRef = useForkRef<HTMLDivElement>(reference, ref);\n\n  const handleButtonClick = (event: MouseEvent<HTMLButtonElement>) => {\n    if (!readOnly) {\n      event.stopPropagation();\n      setFocusVisibleState(false);\n      setOpen(!openState, \"manual\");\n    }\n  };\n\n  const handleButtonFocus = () => {\n    inputRef.current?.focus();\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\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    const activeOption = activeState ?? getFirstOption()?.data;\n\n    let newActive;\n    switch (event.key) {\n      case \"ArrowDown\":\n        newActive = getOptionAfter(activeOption) ?? getLastOption();\n        break;\n      case \"ArrowUp\":\n        newActive = getOptionBefore(activeOption) ?? getFirstOption();\n        break;\n      case \"Home\":\n        newActive = getFirstOption();\n        break;\n      case \"End\":\n        newActive = getLastOption();\n        break;\n      case \"PageUp\":\n        newActive = getOptionPageAbove(activeOption);\n        break;\n      case \"PageDown\":\n        newActive = getOptionPageBelow(activeOption);\n        break;\n      case \"Enter\":\n        if (openState && activeState?.disabled) {\n          event.preventDefault();\n          return;\n        }\n\n        if (!openState || !activeState) {\n          return;\n        }\n\n        select(event, activeState);\n\n        if (!multiselect) {\n          event.preventDefault();\n        }\n\n        break;\n      case \"Tab\":\n        if (\n          openState &&\n          selectOnTab &&\n          activeState &&\n          !activeState?.disabled &&\n          !selectedState.includes(activeState?.value)\n        ) {\n          select(event, activeState);\n        }\n        break;\n    }\n\n    if (newActive) {\n      setFocusVisibleState(true);\n    }\n\n    if (newActive && newActive.data.id != activeState?.id) {\n      event.preventDefault();\n      setActive(newActive.data);\n    }\n\n    onKeyDown?.(event);\n  };\n\n  const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n    setFocusedState(true);\n    onFocus?.(event);\n  };\n\n  const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\n    event.persist();\n    onBlur?.(event);\n  };\n\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    const value = event.target.value;\n\n    if (!openState) {\n      setOpen(true, \"input\");\n    }\n\n    if (value === \"\" && !multiselect) {\n      clear(event);\n    }\n\n    setValueState(value);\n\n    // Wait for the filter to happen\n    queueMicrotask(() => {\n      if (value != \"\") {\n        const newOption = getFirstOption();\n        if (newOption) {\n          setActive(newOption.data);\n        }\n      } else {\n        setActive(undefined);\n      }\n    });\n\n    onChange?.(event);\n  };\n\n  const handlePillRemove = (event: SyntheticEvent, index: number) => {\n    event.stopPropagation();\n    const removed = selectedState[index];\n    removePill(event, removed);\n  };\n\n  const handleListMouseOver = () => {\n    setFocusVisibleState(false);\n  };\n\n  const handleListMouseLeave = () => {\n    setActive(undefined);\n  };\n\n  const handleFocusInput = () => {\n    inputRef.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 > -1) {\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 = getFirstOption();\n        setFocusVisibleState(true);\n      } else if (openKey.current === \"ArrowUp\") {\n        newActive = getLastOption();\n        setFocusVisibleState(true);\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 = getFirstOption();\n    }\n\n    setActive(newActive?.data);\n    /* eslint-disable-next-line react-hooks/exhaustive-deps -- We only want this to run when the list's openState or the displayed options change */\n  }, [openState, children]);\n\n  const buttonId = useId();\n  const listId = useId();\n\n  const handleListRef = useForkRef<HTMLDivElement>(listRef, floating);\n\n  return (\n    <ListControlContext.Provider value={listControl}>\n      <PillInput\n        // Ensures that the field is focused when you don't directly click on the input.\n        tabIndex={!disabled ? -1 : undefined}\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"focused\")]: focusedState,\n            [withBaseName(\"focusVisible\")]: focusVisibleState,\n          },\n          className\n        )}\n        endAdornment={\n          <>\n            {endAdornment}\n            {!readOnly ? (\n              <Button\n                aria-labelledby={clsx(buttonId, formFieldLabelledBy)}\n                aria-label=\"Show options\"\n                aria-expanded={openState}\n                aria-controls={openState ? listId : undefined}\n                aria-haspopup=\"listbox\"\n                disabled={disabled}\n                variant=\"secondary\"\n                onClick={handleButtonClick}\n                onFocus={handleButtonFocus}\n                tabIndex={-1}\n              >\n                {openState ? (\n                  <ChevronUpIcon aria-hidden />\n                ) : (\n                  <ChevronDownIcon aria-hidden />\n                )}\n              </Button>\n            ) : undefined}\n          </>\n        }\n        onChange={handleChange}\n        role=\"combobox\"\n        disabled={disabled}\n        readOnly={readOnly}\n        inputProps={{\n          role: \"combobox\",\n          \"aria-expanded\": openState,\n          \"aria-multiselectable\": multiselect,\n          \"aria-controls\": openState ? listId : undefined,\n          onKeyDown: handleKeyDown,\n          ...inputPropsProp,\n        }}\n        aria-activedescendant={activeState?.id}\n        variant={variant}\n        inputRef={inputRef}\n        value={valueState}\n        ref={handleRef}\n        {...getReferenceProps({\n          onBlur: handleBlur,\n          onFocus: handleFocus,\n          ...rest,\n        })}\n        pills={\n          multiselect ? selectedState.map((item) => valueToString(item)) : []\n        }\n        truncate={truncate && !focusedState && !openState}\n        onPillRemove={handlePillRemove}\n        hidePillClose={!focusedState || readOnly}\n        emptyReadOnlyMarker={\n          readOnly && selectedState.length > 0 ? \"\" : undefined\n        }\n      />\n      <OptionList\n        open={(openState || focusedState) && !readOnly && children != undefined}\n        collapsed={!openState}\n        ref={handleListRef}\n        id={listId}\n        tabIndex={-1}\n        {...getFloatingProps({\n          onMouseOver: handleListMouseOver,\n          onFocus: handleFocusInput,\n          onClick: handleFocusInput,\n          onMouseLeave: handleListMouseLeave,\n        })}\n        left={x ?? 0}\n        top={y ?? 0}\n        position={strategy}\n        width={elements.floating?.offsetWidth}\n        height={elements.floating?.offsetHeight}\n      >\n        {children}\n      </OptionList>\n    </ListControlContext.Provider>\n  );\n}) as <Item = string>(\n  props: ComboBoxProps<Item> & { ref?: Ref<HTMLDivElement> }\n) => JSX.Element;\n"],"names":["makePrefixer","forwardRef","ComboBox","defaultValueToString","useWindow","useComponentCssInjection","comboBoxCss","useFormFieldProps","useRef","useComboBox","_a","useFloatingUI","size","elements","flip","useInteractions","useDismiss","useFocus","useClick","useForkRef","_b","value","useEffect","useId","jsxs","ListControlContext","jsx","PillInput","clsx","Fragment","Button","ChevronUpIcon","ChevronDownIcon","OptionList"],"mappings":"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"}

package/dist-cjs/combo-box/useComboBox.js

@@ -38,6 +38,7 @@ require('../dialog/DialogActions.js');
 require('../dialog/DialogContent.js');
 require('../dialog/DialogContext.js');
 require('../dialog/DialogCloseButton.js');
+require('../divider/Divider.js');
 require('../drawer/Drawer.js');
 require('../drawer/DrawerCloseButton.js');
 require('../dropdown/Dropdown.js');
@@ -65,6 +66,7 @@ require('../interactable-card/InteractableCardGroup.js');
 require('../interactable-card/InteractableCardGroupContext.js');
 require('../link/Link.js');
 require('../link-card/LinkCard.js');
+require('../list-box/ListBox.js');
 require('../list-control/ListControlContext.js');
 require('../menu/MenuContext.js');
 require('@floating-ui/react');
@@ -102,6 +104,7 @@ require('../toast/Toast.js');
 require('../toast/ToastContent.js');
 require('../split-layout/SplitLayout.js');
 require('../switch/Switch.js');
+require('../tag/Tag.js');
 require('../toggle-button/ToggleButton.js');
 require('../toggle-button-group/ToggleButtonGroup.js');
 require('../toggle-button-group/ToggleButtonGroupContext.js');
@@ -137,7 +140,7 @@ function useComboBox(props) {
   const { selectedState, getOptionsMatching, setSelectedState, setOpen } = listControl;
   const [valueState, setValueState] = useControlled.useControlled({
     controlled: value,
-    default: (defaultValue != null ? defaultValue : selectedState.length === 1 && !multiselect) ? listControl.valueToString(selectedState[0]) : defaultValue,
+    default: defaultValue != null ? defaultValue : selectedState.length === 1 && !multiselect ? listControl.valueToString(selectedState[0]) : defaultValue,
     name: "ComboBox",
     state: "value"
   });
@@ -156,7 +159,7 @@ function useComboBox(props) {
     setSelectedState(newSelected);
     const newValue = getOptionsMatching(
       (option2) => newSelected.includes(option2.value)
-    ).map((option2) => listControl.valueToString(option2.value));
+    ).map((option2) => listControl.valueToString(option2.data.value));
     setValueState(multiselect ? "" : newValue[0]);
     onSelectionChange == null ? void 0 : onSelectionChange(event, newSelected);
     if (!multiselect) {

package/dist-cjs/combo-box/useComboBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"useComboBox.js","sources":["../src/combo-box/useComboBox.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, SyntheticEvent } from \"react\";\nimport {\n  useListControl,\n  ListControlProps,\n} from \"../list-control/ListControlState\";\nimport { OptionValue } from \"../list-control/ListControlContext\";\nimport { useControlled } from \"../utils\";\n\nexport type UseComboBoxProps<Item> = ListControlProps<Item> &\n  Pick<ComponentPropsWithoutRef<\"input\">, \"value\" | \"defaultValue\">;\n\nexport function useComboBox<Item>(props: UseComboBoxProps<Item>) {\n  const {\n    open,\n    defaultOpen,\n    onOpenChange,\n    multiselect,\n    defaultSelected,\n    selected,\n    onSelectionChange,\n    disabled,\n    readOnly,\n    valueToString,\n    value,\n    defaultValue,\n  } = props;\n\n  const listControl = useListControl<Item>({\n    open,\n    defaultOpen,\n    onOpenChange,\n    multiselect,\n    defaultSelected,\n    selected,\n    onSelectionChange,\n    disabled,\n    readOnly,\n    valueToString,\n  });\n\n  const { selectedState, getOptionsMatching, setSelectedState, setOpen } =\n    listControl;\n\n  const [valueState, setValueState] = useControlled({\n    controlled: value,\n    default:\n      defaultValue ?? (selectedState.length === 1 && !multiselect)\n        ? listControl.valueToString(selectedState[0])\n        : defaultValue,\n    name: \"ComboBox\",\n    state: \"value\",\n  });\n\n  const select = (event: SyntheticEvent, option: OptionValue<Item>) => {\n    if (option.disabled || disabled || readOnly) {\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    const newValue = getOptionsMatching((option) =>\n      newSelected.includes(option.value)\n    ).map((option) => listControl.valueToString(option.value));\n    setValueState(multiselect ? \"\" : newValue[0]);\n    onSelectionChange?.(event, newSelected);\n\n    if (!multiselect) {\n      setOpen(false);\n    }\n  };\n\n  const removePill = (event: SyntheticEvent, itemToRemove: Item) => {\n    if (!multiselect || disabled || readOnly) {\n      return;\n    }\n\n    let newSelected;\n\n    if (selectedState.includes(itemToRemove)) {\n      newSelected = selectedState.filter((item) => item !== itemToRemove);\n    } else {\n      newSelected = selectedState.concat([itemToRemove]);\n    }\n\n    setSelectedState(newSelected);\n    setValueState(\"\");\n    onSelectionChange?.(event, newSelected);\n  };\n\n  return { ...listControl, select, valueState, setValueState, removePill };\n}\n"],"names":["useListControl","useControlled","option"],"mappings":"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"}
+{"version":3,"file":"useComboBox.js","sources":["../src/combo-box/useComboBox.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, SyntheticEvent } from \"react\";\nimport {\n  useListControl,\n  ListControlProps,\n} from \"../list-control/ListControlState\";\nimport { OptionValue } from \"../list-control/ListControlContext\";\nimport { useControlled } from \"../utils\";\n\nexport type UseComboBoxProps<Item> = ListControlProps<Item> &\n  Pick<ComponentPropsWithoutRef<\"input\">, \"value\" | \"defaultValue\">;\n\nexport function useComboBox<Item>(props: UseComboBoxProps<Item>) {\n  const {\n    open,\n    defaultOpen,\n    onOpenChange,\n    multiselect,\n    defaultSelected,\n    selected,\n    onSelectionChange,\n    disabled,\n    readOnly,\n    valueToString,\n    value,\n    defaultValue,\n  } = props;\n\n  const listControl = useListControl<Item>({\n    open,\n    defaultOpen,\n    onOpenChange,\n    multiselect,\n    defaultSelected,\n    selected,\n    onSelectionChange,\n    disabled,\n    readOnly,\n    valueToString,\n  });\n\n  const { selectedState, getOptionsMatching, setSelectedState, setOpen } =\n    listControl;\n\n  const [valueState, setValueState] = useControlled({\n    controlled: value,\n    default:\n      defaultValue ??\n      (selectedState.length === 1 && !multiselect\n        ? listControl.valueToString(selectedState[0])\n        : defaultValue),\n    name: \"ComboBox\",\n    state: \"value\",\n  });\n\n  const select = (event: SyntheticEvent, option: OptionValue<Item>) => {\n    if (option.disabled || disabled || readOnly) {\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    const newValue = getOptionsMatching((option) =>\n      newSelected.includes(option.value)\n    ).map((option) => listControl.valueToString(option.data.value));\n    setValueState(multiselect ? \"\" : newValue[0]);\n    onSelectionChange?.(event, newSelected);\n\n    if (!multiselect) {\n      setOpen(false);\n    }\n  };\n\n  const removePill = (event: SyntheticEvent, itemToRemove: Item) => {\n    if (!multiselect || disabled || readOnly) {\n      return;\n    }\n\n    let newSelected;\n\n    if (selectedState.includes(itemToRemove)) {\n      newSelected = selectedState.filter((item) => item !== itemToRemove);\n    } else {\n      newSelected = selectedState.concat([itemToRemove]);\n    }\n\n    setSelectedState(newSelected);\n    setValueState(\"\");\n    onSelectionChange?.(event, newSelected);\n  };\n\n  return { ...listControl, select, valueState, setValueState, removePill };\n}\n"],"names":["useListControl","useControlled","option"],"mappings":"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"}

package/dist-cjs/dialog/Dialog.js

@@ -38,6 +38,7 @@ require('./DialogActions.js');
 require('./DialogContent.js');
 var DialogContext = require('./DialogContext.js');
 require('./DialogCloseButton.js');
+require('../divider/Divider.js');
 require('../drawer/Drawer.js');
 require('../drawer/DrawerCloseButton.js');
 require('../dropdown/Dropdown.js');
@@ -65,6 +66,7 @@ require('../interactable-card/InteractableCardGroup.js');
 require('../interactable-card/InteractableCardGroupContext.js');
 require('../link/Link.js');
 require('../link-card/LinkCard.js');
+require('../list-box/ListBox.js');
 require('../list-control/ListControlContext.js');
 require('../menu/MenuContext.js');
 require('../menu/MenuItem.js');
@@ -101,6 +103,7 @@ require('../toast/Toast.js');
 require('../toast/ToastContent.js');
 require('../split-layout/SplitLayout.js');
 require('../switch/Switch.js');
+require('../tag/Tag.js');
 require('../toggle-button/ToggleButton.js');
 require('../toggle-button-group/ToggleButtonGroup.js');
 require('../toggle-button-group/ToggleButtonGroupContext.js');

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

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","sources":["../src/dialog/Dialog.tsx"],"sourcesContent":["import {\n  forwardRef,\n  HTMLAttributes,\n  useEffect,\n  useMemo,\n  useState,\n  ComponentProps,\n  ReactNode,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport {\n  FloatingFocusManager,\n  useClick,\n  useDismiss,\n  useInteractions,\n} from \"@floating-ui/react\";\nimport {\n  makePrefixer,\n  useFloatingComponent,\n  useFloatingUI,\n  useCurrentBreakpoint,\n  useForkRef,\n  useId,\n} from \"../utils\";\nimport { Scrim } from \"../scrim\";\nimport { ValidationStatus } from \"../status-indicator\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport dialogCss from \"./Dialog.css\";\nimport { DialogContext } from \"./DialogContext\";\n\ninterface ConditionalScrimWrapperProps {\n  children?: ReactNode;\n  condition: boolean;\n}\n\nexport const ConditionalScrimWrapper = ({\n  condition,\n  children,\n}: ConditionalScrimWrapperProps) => {\n  return condition ? <Scrim fixed>{children}</Scrim> : <>{children} </>;\n};\n\nexport interface DialogProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Display or hide the component.\n   */\n  open?: boolean;\n  /**\n   * Callback function triggered when open state changes.\n   */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * The status of the Dialog\n   * */\n  status?: ValidationStatus;\n  /**\n   * Which element to initially focus. Can be either a number (tabbable index as specified by the order) or a ref.\n   * Default value is 0 (first tabbable element).\n   * */\n  initialFocus?: ComponentProps<typeof FloatingFocusManager>[\"initialFocus\"];\n  /**\n   * Size of the Dialog\n   * */\n  size?: \"small\" | \"medium\" | \"large\";\n  /**\n   * Prevent the dialog closing on click away\n   * */\n  disableDismiss?: boolean;\n  /**\n   * Prevent Scrim from rendering\n   * */\n  disableScrim?: boolean;\n  /**\n   * Optional id prop\n   * Used for accessibility purposes to announce the title and subtitle when using a screen reader\n   * */\n  idProp?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltDialog\");\n\nexport const Dialog = forwardRef<HTMLDivElement, DialogProps>(function Dialog(\n  props,\n  ref\n) {\n  const {\n    children,\n    className,\n    open = false,\n    onOpenChange,\n    status,\n    disableDismiss,\n    size = \"medium\",\n    disableScrim,\n    idProp,\n    ...rest\n  } = props;\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-dialog\",\n    css: dialogCss,\n    window: targetWindow,\n  });\n\n  const id = useId(idProp);\n\n  const currentbreakpoint = useCurrentBreakpoint();\n\n  const [showComponent, setShowComponent] = useState(false);\n\n  const { context, floating, elements } = useFloatingUI({\n    open: showComponent,\n    onOpenChange,\n  });\n\n  const { getFloatingProps } = useInteractions([\n    useClick(context),\n    useDismiss(context, { enabled: !disableDismiss }),\n  ]);\n\n  const { Component: FloatingComponent } = useFloatingComponent();\n\n  const floatingRef = useForkRef<HTMLDivElement>(floating, ref);\n\n  useEffect(() => {\n    if (open && !showComponent) {\n      setShowComponent(true);\n    }\n\n    if (!open && showComponent) {\n      const animate = setTimeout(() => {\n        setShowComponent(false);\n      }, 300); // var(--salt-duration-perceptible)\n      return () => clearTimeout(animate);\n    }\n  }, [open, showComponent, setShowComponent]);\n\n  const contextValue = useMemo(() => ({ status, id }), [status, id]);\n\n  return (\n    <DialogContext.Provider value={contextValue}>\n      <ConditionalScrimWrapper condition={showComponent && !disableScrim}>\n        <FloatingComponent\n          open={showComponent}\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-labelledby={id}\n          ref={floatingRef}\n          width={elements.floating?.offsetWidth}\n          height={elements.floating?.offsetHeight}\n          focusManagerProps={{\n            context: context,\n          }}\n          className={clsx(\n            withBaseName(),\n            withBaseName(size, currentbreakpoint),\n            {\n              [withBaseName(\"enterAnimation\")]: open,\n              [withBaseName(\"exitAnimation\")]: !open,\n              [withBaseName(status as string)]: status,\n            },\n            className\n          )}\n          onAnimationEnd={() => {\n            if (!open && showComponent) {\n              setShowComponent(false);\n            }\n          }}\n          {...getFloatingProps()}\n          {...rest}\n        >\n          {children}\n        </FloatingComponent>\n      </ConditionalScrimWrapper>\n    </DialogContext.Provider>\n  );\n});\n"],"names":["jsx","Scrim","jsxs","Fragment","makePrefixer","forwardRef","Dialog","useWindow","useComponentCssInjection","dialogCss","useId","useCurrentBreakpoint","useState","useFloatingUI","useInteractions","useClick","useDismiss","useFloatingComponent","useForkRef","useEffect","useMemo","DialogContext","clsx"],"mappings":"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"}
+{"version":3,"file":"Dialog.js","sources":["../src/dialog/Dialog.tsx"],"sourcesContent":["import {\n  forwardRef,\n  HTMLAttributes,\n  useEffect,\n  useMemo,\n  useState,\n  ComponentProps,\n  ReactNode,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport {\n  FloatingFocusManager,\n  useClick,\n  useDismiss,\n  useInteractions,\n} from \"@floating-ui/react\";\nimport {\n  makePrefixer,\n  useFloatingComponent,\n  useFloatingUI,\n  useCurrentBreakpoint,\n  useForkRef,\n  useId,\n} from \"../utils\";\nimport { Scrim } from \"../scrim\";\nimport { ValidationStatus } from \"../status-indicator\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport dialogCss from \"./Dialog.css\";\nimport { DialogContext } from \"./DialogContext\";\n\ninterface ConditionalScrimWrapperProps {\n  children?: ReactNode;\n  condition: boolean;\n}\n\nexport const ConditionalScrimWrapper = ({\n  condition,\n  children,\n}: ConditionalScrimWrapperProps) => {\n  return condition ? <Scrim fixed>{children}</Scrim> : <>{children} </>;\n};\n\nexport interface DialogProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Display or hide the component.\n   */\n  open?: boolean;\n  /**\n   * Callback function triggered when open state changes.\n   */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * The status of the Dialog\n   * */\n  status?: ValidationStatus;\n  /**\n   * Which element to initially focus. Can be either a number (tabbable index as specified by the order) or a ref.\n   * Default value is 0 (first tabbable element).\n   * */\n  initialFocus?: ComponentProps<typeof FloatingFocusManager>[\"initialFocus\"];\n  /**\n   * Size of the Dialog\n   * */\n  size?: \"small\" | \"medium\" | \"large\";\n  /**\n   * Prevent the dialog closing on click away\n   * */\n  disableDismiss?: boolean;\n  /**\n   * Prevent Scrim from rendering\n   * */\n  disableScrim?: boolean;\n  /**\n   * Optional id prop\n   * Used for accessibility purposes to announce the title and subtitle when using a screen reader\n   * */\n  idProp?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltDialog\");\n\nexport const Dialog = forwardRef<HTMLDivElement, DialogProps>(function Dialog(\n  props,\n  ref\n) {\n  const {\n    children,\n    className,\n    open = false,\n    onOpenChange,\n    status,\n    disableDismiss,\n    size = \"medium\",\n    disableScrim,\n    idProp,\n    ...rest\n  } = props;\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-dialog\",\n    css: dialogCss,\n    window: targetWindow,\n  });\n\n  const id = useId(idProp);\n\n  const currentbreakpoint = useCurrentBreakpoint();\n\n  const [showComponent, setShowComponent] = useState(false);\n\n  const { context, floating, elements } = useFloatingUI({\n    open: showComponent,\n    onOpenChange,\n  });\n\n  const { getFloatingProps } = useInteractions([\n    useClick(context),\n    useDismiss(context, { enabled: !disableDismiss }),\n  ]);\n\n  const { Component: FloatingComponent } = useFloatingComponent();\n\n  const floatingRef = useForkRef<HTMLDivElement>(floating, ref);\n\n  useEffect(() => {\n    if (open && !showComponent) {\n      setShowComponent(true);\n    }\n\n    if (!open && showComponent) {\n      const animate = setTimeout(() => {\n        setShowComponent(false);\n      }, 300); // var(--salt-duration-perceptible)\n      return () => clearTimeout(animate);\n    }\n  }, [open, showComponent, setShowComponent]);\n\n  const contextValue = useMemo(() => ({ status, id }), [status, id]);\n\n  return (\n    <DialogContext.Provider value={contextValue}>\n      <ConditionalScrimWrapper condition={showComponent && !disableScrim}>\n        <FloatingComponent\n          open={showComponent}\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-labelledby={id}\n          ref={floatingRef}\n          width={elements.floating?.offsetWidth}\n          height={elements.floating?.offsetHeight}\n          focusManagerProps={{\n            context: context,\n          }}\n          className={clsx(\n            withBaseName(),\n            withBaseName(size, currentbreakpoint),\n            {\n              [withBaseName(\"enterAnimation\")]: open,\n              [withBaseName(\"exitAnimation\")]: !open,\n              [withBaseName(status as string)]: status,\n            },\n            className\n          )}\n          onAnimationEnd={() => {\n            if (!open && showComponent) {\n              setShowComponent(false);\n            }\n          }}\n          {...getFloatingProps()}\n          {...rest}\n        >\n          {children}\n        </FloatingComponent>\n      </ConditionalScrimWrapper>\n    </DialogContext.Provider>\n  );\n});\n"],"names":["jsx","Scrim","jsxs","Fragment","makePrefixer","forwardRef","Dialog","useWindow","useComponentCssInjection","dialogCss","useId","useCurrentBreakpoint","useState","useFloatingUI","useInteractions","useClick","useDismiss","useFloatingComponent","useForkRef","useEffect","useMemo","DialogContext","clsx"],"mappings":"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"}