@salt-ds/lab 1.0.0-alpha.67 → 1.0.0-alpha.68

package/dist-es/dropdown/useDropdownBase.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDropdownBase.js","sources":["../src/dropdown/useDropdownBase.ts"],"sourcesContent":["import { useControlled } from \"@salt-ds/core\";\nimport { type KeyboardEvent, useCallback, useRef, useState } from \"react\";\n\nimport { useFormFieldLegacyProps } from \"../form-field-context-legacy\";\nimport { WidthOnly, type measurements, useResizeObserver } from \"../responsive\";\nimport type { DropdownHookProps, DropdownHookResult } from \"./dropdownTypes\";\nimport { useClickAway } from \"./useClickAway\";\n\nconst NO_OBSERVER: string[] = [];\n\nexport const useDropdownBase = ({\n  ariaLabelledBy: ariaLabelledByProp,\n  defaultIsOpen,\n  disabled,\n  // TODO check how we're using fullWidth, do we need a separate value for the popup component\n  fullWidth: fullWidthProp,\n  id,\n  isOpen: isOpenProp,\n  onOpenChange,\n  onKeyDown: onKeyDownProp,\n  openOnFocus,\n  popupWidth: popupWidthProp,\n  rootRef,\n  width,\n}: DropdownHookProps): DropdownHookResult => {\n  const justFocused = useRef<number | null>(null);\n  const popperRef = useRef<HTMLElement | null>(null);\n  const popperCallbackRef = useCallback((element: HTMLElement | null) => {\n    popperRef.current = element;\n  }, []);\n  const [isOpen, setIsOpen] = useControlled({\n    controlled: isOpenProp,\n    default: Boolean(defaultIsOpen),\n    name: \"useDropdown\",\n    state: \"isOpen\",\n  });\n\n  const {\n    inFormField,\n    setFocused: setFormFieldFocused,\n    a11yProps: { \"aria-labelledby\": ariaLabelledBy, ...restA11yProps } = {},\n  } = useFormFieldLegacyProps();\n\n  const [popup, setPopup] = useState<measurements>({\n    width: popupWidthProp ?? width ?? 0,\n  });\n\n  const showDropdown = useCallback(() => {\n    setIsOpen(true);\n    onOpenChange?.(true);\n  }, [onOpenChange]);\n\n  const hideDropdown = useCallback(() => {\n    setIsOpen(false);\n    onOpenChange?.(false);\n  }, [onOpenChange]);\n\n  useClickAway({\n    popperRef,\n    rootRef,\n    isOpen,\n    onClose: hideDropdown,\n  });\n\n  const handleTriggerFocus = useCallback(() => {\n    if (!disabled) {\n      setFormFieldFocused?.(true);\n\n      if (openOnFocus) {\n        setIsOpen(true);\n        onOpenChange?.(true);\n        // Suppress response to click if click was the cause of focus\n        justFocused.current = window.setTimeout(() => {\n          justFocused.current = null;\n        }, 1000);\n      }\n    }\n  }, [disabled, onOpenChange, openOnFocus, setFormFieldFocused]);\n\n  const handleTriggerBlur = useCallback(() => {\n    setFormFieldFocused?.(false);\n  }, [setFormFieldFocused]);\n\n  const handleTriggerToggle = useCallback(\n    (e: MouseEvent) => {\n      // Do not trigger menu open for 'Enter' and 'SPACE' key as they're handled in `handleKeyDown`\n      if (\n        [\"Enter\", \" \"].indexOf(\n          (e as unknown as KeyboardEvent<HTMLDivElement>).key,\n        ) === -1\n      ) {\n        const newIsOpen = !isOpen;\n        setIsOpen(newIsOpen);\n        onOpenChange?.(newIsOpen);\n      }\n    },\n    [isOpen, onOpenChange],\n  );\n\n  const handleKeydown = useCallback(\n    (evt: KeyboardEvent<HTMLElement>) => {\n      if ((evt.key === \"Tab\" || evt.key === \"Escape\") && isOpen) {\n        // No preventDefault here, this behaviour does not need to be exclusive\n        hideDropdown();\n      } else if (\n        (evt.key === \"Enter\" || evt.key === \"ArrowDown\" || evt.key === \" \") &&\n        !isOpen\n      ) {\n        evt.preventDefault();\n        showDropdown();\n      } else {\n        onKeyDownProp?.(evt);\n      }\n    },\n    [hideDropdown, isOpen, onKeyDownProp, showDropdown],\n  );\n\n  const fullWidth = fullWidthProp ?? inFormField;\n  const measurements = fullWidth ? WidthOnly : NO_OBSERVER;\n  useResizeObserver(rootRef, measurements, setPopup, fullWidth);\n\n  const componentId = `${id}-dropdown`;\n\n  const getAriaLabelledBy = (\n    labelledBy: string | undefined,\n    labelledByProp: string | undefined,\n  ): string | undefined => {\n    if (labelledBy === undefined && labelledByProp === undefined) {\n      return undefined;\n    }\n    return [labelledBy, labelledByProp].filter((x) => !!x).join(\" \");\n  };\n\n  // TODO do we use aria-popup - valid values are menu, dialog, grid, tree, listbox\n  const triggerProps = {\n    ...restA11yProps,\n    \"aria-expanded\": isOpen,\n    \"aria-labelledby\": getAriaLabelledBy(ariaLabelledBy, ariaLabelledByProp),\n    \"aria-owns\": isOpen ? componentId : undefined,\n    id: `${id}-control`,\n    onClick: disabled || openOnFocus ? undefined : handleTriggerToggle,\n    onFocus: handleTriggerFocus,\n    onBlur: handleTriggerBlur,\n    role: \"listbox\",\n    onKeyDown: disabled ? undefined : handleKeydown,\n    style: { width: fullWidth ? undefined : width },\n  };\n\n  const dropdownComponentProps = {\n    \"aria-labelledby\": ariaLabelledBy,\n    id: componentId,\n    width: popup.width,\n  };\n\n  return {\n    componentProps: dropdownComponentProps,\n    popperRef: popperCallbackRef,\n    isOpen,\n    label: \"Dropdown Button\",\n    triggerProps,\n  };\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useDropdownBase.js","sources":["../src/dropdown/useDropdownBase.ts"],"sourcesContent":["import { useControlled } from \"@salt-ds/core\";\nimport { type KeyboardEvent, useCallback, useRef, useState } from \"react\";\n\nimport { useFormFieldLegacyProps } from \"../form-field-context-legacy\";\nimport { WidthOnly, type measurements, useResizeObserver } from \"../responsive\";\nimport type { DropdownHookProps, DropdownHookResult } from \"./dropdownTypes\";\nimport { useClickAway } from \"./useClickAway\";\n\nconst NO_OBSERVER: string[] = [];\n\nexport const useDropdownBase = ({\n  ariaLabelledBy: ariaLabelledByProp,\n  defaultIsOpen,\n  disabled,\n  // TODO check how we're using fullWidth, do we need a separate value for the popup component\n  fullWidth: fullWidthProp,\n  id,\n  isOpen: isOpenProp,\n  onOpenChange,\n  onKeyDown: onKeyDownProp,\n  openOnFocus,\n  popupWidth: popupWidthProp,\n  rootRef,\n  width,\n}: DropdownHookProps): DropdownHookResult => {\n  const justFocused = useRef<number | null>(null);\n  const popperRef = useRef<HTMLElement | null>(null);\n  const popperCallbackRef = useCallback((element: HTMLElement | null) => {\n    popperRef.current = element;\n  }, []);\n  const [isOpen, setIsOpen] = useControlled({\n    controlled: isOpenProp,\n    default: Boolean(defaultIsOpen),\n    name: \"useDropdown\",\n    state: \"isOpen\",\n  });\n\n  const {\n    inFormField,\n    setFocused: setFormFieldFocused,\n    a11yProps: { \"aria-labelledby\": ariaLabelledBy, ...restA11yProps } = {},\n  } = useFormFieldLegacyProps();\n\n  const [popup, setPopup] = useState<measurements>({\n    width: popupWidthProp ?? width ?? 0,\n  });\n\n  const showDropdown = useCallback(() => {\n    setIsOpen(true);\n    onOpenChange?.(true);\n  }, [onOpenChange]);\n\n  const hideDropdown = useCallback(() => {\n    setIsOpen(false);\n    onOpenChange?.(false);\n  }, [onOpenChange]);\n\n  useClickAway({\n    popperRef,\n    rootRef,\n    isOpen,\n    onClose: hideDropdown,\n  });\n\n  const handleTriggerFocus = useCallback(() => {\n    if (!disabled) {\n      setFormFieldFocused?.(true);\n\n      if (openOnFocus) {\n        setIsOpen(true);\n        onOpenChange?.(true);\n        // Suppress response to click if click was the cause of focus\n        justFocused.current = window.setTimeout(() => {\n          justFocused.current = null;\n        }, 1000);\n      }\n    }\n  }, [disabled, onOpenChange, openOnFocus, setFormFieldFocused]);\n\n  const handleTriggerBlur = useCallback(() => {\n    setFormFieldFocused?.(false);\n  }, [setFormFieldFocused]);\n\n  const handleTriggerToggle = useCallback(\n    (e: MouseEvent) => {\n      // Do not trigger menu open for 'Enter' and 'SPACE' key as they're handled in `handleKeyDown`\n      if (\n        [\"Enter\", \" \"].indexOf(\n          (e as unknown as KeyboardEvent<HTMLDivElement>).key,\n        ) === -1\n      ) {\n        const newIsOpen = !isOpen;\n        setIsOpen(newIsOpen);\n        onOpenChange?.(newIsOpen);\n      }\n    },\n    [isOpen, onOpenChange],\n  );\n\n  const handleKeydown = useCallback(\n    (evt: KeyboardEvent<HTMLElement>) => {\n      if ((evt.key === \"Tab\" || evt.key === \"Escape\") && isOpen) {\n        // No preventDefault here, this behaviour does not need to be exclusive\n        hideDropdown();\n      } else if (\n        (evt.key === \"Enter\" || evt.key === \"ArrowDown\" || evt.key === \" \") &&\n        !isOpen\n      ) {\n        evt.preventDefault();\n        showDropdown();\n      } else {\n        onKeyDownProp?.(evt);\n      }\n    },\n    [hideDropdown, isOpen, onKeyDownProp, showDropdown],\n  );\n\n  const fullWidth = fullWidthProp ?? inFormField;\n  const measurements = fullWidth ? WidthOnly : NO_OBSERVER;\n  useResizeObserver(rootRef, measurements, setPopup, fullWidth);\n\n  const componentId = `${id}-dropdown`;\n\n  const getAriaLabelledBy = (\n    labelledBy: string | undefined,\n    labelledByProp: string | undefined,\n  ): string | undefined => {\n    if (labelledBy === undefined && labelledByProp === undefined) {\n      return undefined;\n    }\n    return [labelledBy, labelledByProp].filter((x) => !!x).join(\" \");\n  };\n\n  // TODO do we use aria-popup - valid values are menu, dialog, grid, tree, listbox\n  const triggerProps = {\n    ...restA11yProps,\n    \"aria-expanded\": isOpen,\n    \"aria-labelledby\": getAriaLabelledBy(ariaLabelledBy, ariaLabelledByProp),\n    \"aria-owns\": isOpen ? componentId : undefined,\n    id: `${id}-control`,\n    onClick: disabled || openOnFocus ? undefined : handleTriggerToggle,\n    onFocus: handleTriggerFocus,\n    onBlur: handleTriggerBlur,\n    role: \"listbox\",\n    onKeyDown: disabled ? undefined : handleKeydown,\n    style: { width: fullWidth ? undefined : width },\n  };\n\n  const dropdownComponentProps = {\n    \"aria-labelledby\": ariaLabelledBy,\n    id: componentId,\n    width: popup.width,\n  };\n\n  return {\n    componentProps: dropdownComponentProps,\n    popperRef: popperCallbackRef,\n    isOpen,\n    label: \"Dropdown Button\",\n    triggerProps,\n  };\n};\n"],"names":[],"mappings":"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"}

package/dist-es/editable-label/EditableLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditableLabel.js","sources":["../src/editable-label/EditableLabel.tsx"],"sourcesContent":["import { useControlled, useIsomorphicLayoutEffect } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n  type ChangeEvent,\n  type ForwardedRef,\n  type KeyboardEvent,\n  type ReactElement,\n  forwardRef,\n  useCallback,\n  useRef,\n} from \"react\";\nimport { InputLegacy as Input } from \"../input-legacy\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport editableLabelCss from \"./EditableLabel.css\";\n\nconst classBase = \"saltEditableLabel\";\n\nexport interface EditableLabelProps {\n  className?: string;\n  defaultEditing?: boolean;\n  defaultValue?: string;\n  editing?: boolean;\n  onEnterEditMode: () => void;\n  onChange?: (value: string) => void;\n  onExitEditMode: (\n    originalLabel: string | undefined,\n    editedLabel: string | undefined,\n    allowDeactivation?: boolean,\n  ) => void;\n  defaultIsEditing?: boolean;\n  value?: string;\n}\n\nexport const EditableLabel = forwardRef(function EditableLabel(\n  {\n    className: classNameProp,\n    defaultEditing,\n    defaultValue,\n    editing: editingProp,\n    onChange,\n    onEnterEditMode,\n    onExitEditMode,\n    value: valueProp,\n  }: EditableLabelProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>,\n): ReactElement<EditableLabelProps> {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-editable-label\",\n    css: editableLabelCss,\n    window: targetWindow,\n  });\n\n  const inputRef = useRef<HTMLInputElement | null>(null);\n\n  const [value, setValue] = useControlled({\n    controlled: valueProp,\n    default: defaultValue ?? \"\",\n    name: \"EditableLabel\",\n    state: \"value\",\n  });\n\n  const [editing, setEditing] = useControlled({\n    controlled: editingProp,\n    default: defaultEditing || false,\n    name: \"EditableLabel\",\n    state: \"editing\",\n  });\n\n  const initialValue = useRef(value);\n\n  useIsomorphicLayoutEffect(() => {\n    if (editing) {\n      if (inputRef.current !== null) {\n        inputRef.current.select();\n        inputRef.current.focus();\n      }\n    }\n  }, [editing]);\n\n  const enterEditMode = useCallback(() => {\n    setEditing(true);\n    // ignoreBlur.current = false;\n    onEnterEditMode?.();\n  }, [onEnterEditMode]);\n\n  const exitEditMode = ({\n    cancelEdit = false,\n    allowDeactivation = false,\n  } = {}) => {\n    setEditing(false);\n    const originalValue = initialValue.current;\n    if (originalValue !== value) {\n      if (cancelEdit) {\n        setValue(originalValue);\n      } else {\n        initialValue.current = value;\n      }\n    }\n    onExitEditMode?.(originalValue, value, allowDeactivation);\n  };\n\n  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {\n    const { value } = evt.target;\n    setValue(value);\n    onChange?.(value);\n  };\n\n  const handleDoubleClick = () => {\n    enterEditMode();\n  };\n\n  const handleBlur = () => {\n    exitEditMode({ allowDeactivation: true });\n  };\n\n  const handleKeyDown = (evt: KeyboardEvent<HTMLInputElement>) => {\n    if (editing && evt.key === \"Enter\") {\n      evt.stopPropagation();\n      // we are likely to lose focus as a consequence of user response\n      // to exitEdit transition, don't want it to trigger another\n      //shouldn't we call setEditing here in case we are in uncontrolled mode ?\n      exitEditMode();\n    } else if (evt.key === \"ArrowRight\" || evt.key === \"ArrowLeft\") {\n      evt.stopPropagation();\n    } else if (evt.key === \"Escape\") {\n      exitEditMode({ cancelEdit: true });\n    }\n  };\n\n  const className = clsx(classBase, classNameProp, {\n    [`${classBase}-editing`]: editing,\n  });\n  return (\n    <div\n      className={className}\n      onDoubleClick={handleDoubleClick}\n      data-text={value}\n      ref={forwardedRef}\n    >\n      {editing ? (\n        <Input\n          inputProps={{ className: `${classBase}-input` }}\n          value={value}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onKeyDown={handleKeyDown}\n          ref={inputRef}\n          style={{ padding: 0 }}\n          textAlign=\"left\"\n        />\n      ) : (\n        value\n      )}\n    </div>\n  );\n});\n"],"names":["EditableLabel","editableLabelCss","value","Input"],"mappings":"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"}
+{"version":3,"file":"EditableLabel.js","sources":["../src/editable-label/EditableLabel.tsx"],"sourcesContent":["import { useControlled, useIsomorphicLayoutEffect } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n  type ChangeEvent,\n  type ForwardedRef,\n  type KeyboardEvent,\n  type ReactElement,\n  forwardRef,\n  useCallback,\n  useRef,\n} from \"react\";\nimport { InputLegacy as Input } from \"../input-legacy\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport editableLabelCss from \"./EditableLabel.css\";\n\nconst classBase = \"saltEditableLabel\";\n\nexport interface EditableLabelProps {\n  className?: string;\n  defaultEditing?: boolean;\n  defaultValue?: string;\n  editing?: boolean;\n  onEnterEditMode: () => void;\n  onChange?: (value: string) => void;\n  onExitEditMode: (\n    originalLabel: string | undefined,\n    editedLabel: string | undefined,\n    allowDeactivation?: boolean,\n  ) => void;\n  defaultIsEditing?: boolean;\n  value?: string;\n}\n\nexport const EditableLabel = forwardRef(function EditableLabel(\n  {\n    className: classNameProp,\n    defaultEditing,\n    defaultValue,\n    editing: editingProp,\n    onChange,\n    onEnterEditMode,\n    onExitEditMode,\n    value: valueProp,\n  }: EditableLabelProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>,\n): ReactElement<EditableLabelProps> {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-editable-label\",\n    css: editableLabelCss,\n    window: targetWindow,\n  });\n\n  const inputRef = useRef<HTMLInputElement | null>(null);\n\n  const [value, setValue] = useControlled({\n    controlled: valueProp,\n    default: defaultValue ?? \"\",\n    name: \"EditableLabel\",\n    state: \"value\",\n  });\n\n  const [editing, setEditing] = useControlled({\n    controlled: editingProp,\n    default: defaultEditing || false,\n    name: \"EditableLabel\",\n    state: \"editing\",\n  });\n\n  const initialValue = useRef(value);\n\n  useIsomorphicLayoutEffect(() => {\n    if (editing) {\n      if (inputRef.current !== null) {\n        inputRef.current.select();\n        inputRef.current.focus();\n      }\n    }\n  }, [editing]);\n\n  const enterEditMode = useCallback(() => {\n    setEditing(true);\n    // ignoreBlur.current = false;\n    onEnterEditMode?.();\n  }, [onEnterEditMode]);\n\n  const exitEditMode = ({\n    cancelEdit = false,\n    allowDeactivation = false,\n  } = {}) => {\n    setEditing(false);\n    const originalValue = initialValue.current;\n    if (originalValue !== value) {\n      if (cancelEdit) {\n        setValue(originalValue);\n      } else {\n        initialValue.current = value;\n      }\n    }\n    onExitEditMode?.(originalValue, value, allowDeactivation);\n  };\n\n  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {\n    const { value } = evt.target;\n    setValue(value);\n    onChange?.(value);\n  };\n\n  const handleDoubleClick = () => {\n    enterEditMode();\n  };\n\n  const handleBlur = () => {\n    exitEditMode({ allowDeactivation: true });\n  };\n\n  const handleKeyDown = (evt: KeyboardEvent<HTMLInputElement>) => {\n    if (editing && evt.key === \"Enter\") {\n      evt.stopPropagation();\n      // we are likely to lose focus as a consequence of user response\n      // to exitEdit transition, don't want it to trigger another\n      //shouldn't we call setEditing here in case we are in uncontrolled mode ?\n      exitEditMode();\n    } else if (evt.key === \"ArrowRight\" || evt.key === \"ArrowLeft\") {\n      evt.stopPropagation();\n    } else if (evt.key === \"Escape\") {\n      exitEditMode({ cancelEdit: true });\n    }\n  };\n\n  const className = clsx(classBase, classNameProp, {\n    [`${classBase}-editing`]: editing,\n  });\n  return (\n    <div\n      className={className}\n      onDoubleClick={handleDoubleClick}\n      data-text={value}\n      ref={forwardedRef}\n    >\n      {editing ? (\n        <Input\n          inputProps={{ className: `${classBase}-input` }}\n          value={value}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onKeyDown={handleKeyDown}\n          ref={inputRef}\n          style={{ padding: 0 }}\n          textAlign=\"left\"\n        />\n      ) : (\n        value\n      )}\n    </div>\n  );\n});\n"],"names":["EditableLabel","editableLabelCss","value","Input"],"mappings":"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"}

package/dist-es/form-field-legacy/FormFieldLegacy.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormFieldLegacy.js","sources":["../src/form-field-legacy/FormFieldLegacy.tsx"],"sourcesContent":["import { Tooltip, makePrefixer, useForkRef, useId } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n  type Dispatch,\n  type ElementType,\n  type FocusEventHandler,\n  type ForwardedRef,\n  type HTMLAttributes,\n  type SetStateAction,\n  forwardRef,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { FormFieldLegacyContext } from \"../form-field-context-legacy\";\nimport {\n  FormActivationIndicator,\n  type FormActivationIndicatorProps,\n} from \"./FormActivationIndicator\";\nimport { FormHelperText, type FormHelperTextProps } from \"./FormHelperText\";\nimport { FormLabel, type FormLabelProps } from \"./FormLabel\";\nimport type { NecessityIndicatorOptions } from \"./NecessityIndicator\";\nimport type { StatusIndicatorProps } from \"./StatusIndicator\";\nimport { classBase } from \"./constant\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport formFieldLegacyCss from \"./FormFieldLegacy.css\";\n\nexport type FormFieldLabelPlacement = \"top\" | \"left\";\nexport type FormFieldHelperTextPlacement = \"bottom\" | \"tooltip\";\nexport type FormFieldValidationStatus = \"error\" | \"warning\";\n\nexport interface A11yValueProps\n  extends Pick<NecessityIndicatorOptions, \"required\"> {\n  /**\n   * If `true`, the FormField will be disabled.\n   */\n  disabled?: boolean;\n  /** id of the helper text node */\n  helperTextId?: string;\n  /** id of the label node */\n  labelId?: string;\n  /**\n   * The FormField value is Readonly\n   */\n  readOnly?: boolean;\n\n  /**\n   * Whether the form field needs to render helper text\n   */\n  renderHelperText?: boolean;\n}\n\nexport interface FormFieldLegacyProps\n  extends HTMLAttributes<HTMLDivElement>,\n    A11yValueProps {\n  /**\n   * The component used for activation indicator. Default to `FormActivationIndicator`.\n   */\n  ActivationIndicatorComponent?: ElementType<FormActivationIndicatorProps>;\n  /**\n   * Outer focus ring focus will not be applied. Defaults to false.\n   */\n  disableFocusRing?: boolean;\n  // I hate this fullWidth business. We should support a width prop. The default should be 100% (standard block behaviour)\n  // we should also support 'auto' or explicit numeric values\n  /**\n   * Whether the form field is occupying full width.\n   */\n  fullWidth?: boolean;\n  /**\n   * Whether to show the StatusIndicator component for validation states.\n   */\n  hasStatusIndicator?: boolean;\n  /**\n   * The helper text content\n   */\n  helperText?: string;\n  /**\n   * The component used for the helper text. Default to `FormHelperText`.\n   */\n  HelperTextComponent?: ElementType<FormHelperTextProps>;\n  /**\n   * Location the helperText, values: 'bottom' (default) or 'tooltip'.\n   */\n  helperTextPlacement?: FormFieldHelperTextPlacement;\n  /**\n   * Props to be applied to the `HelperTextComponent`.\n   *\n   * Generic on `FormHelperTextProps` is omitted.\n   */\n  HelperTextProps?: Partial<FormHelperTextProps>;\n  /**\n   * The label value for the FormField\n   */\n  label?: string;\n  /**\n   * The component used for the label. Default to `FormLabel`.\n   */\n  LabelComponent?: ElementType;\n  /**\n   * Location the label, values: 'top' (default) or 'left'\n   */\n  labelPlacement?: FormFieldLabelPlacement;\n  /**\n   * Props to be applied to the `LabelComponent`\n   */\n  LabelProps?: Partial<FormLabelProps>;\n  /**\n   * Override props to be used with the StatusIndicator component\n   */\n  StatusIndicatorProps?: Partial<StatusIndicatorProps>;\n  /**\n   * The state for the FormField: Must be one of: 'error'|'warning'|undefined\n   */\n  validationStatus?: FormFieldValidationStatus;\n  /**\n   * FormField variants; defaults to primary.\n   *\n   * **Deprecated:** The 'tertiary' variant has been deprecated\n   */\n  variant?: \"primary\" | \"secondary\" | \"tertiary\";\n}\n\nexport interface useA11yValueValue {\n  \"aria-labelledby\": A11yValueProps[\"labelId\"];\n  \"aria-required\": A11yValueProps[\"required\"];\n  \"aria-describedby\": A11yValueProps[\"helperTextId\"] | undefined;\n  disabled: A11yValueProps[\"disabled\"];\n  readOnly: A11yValueProps[\"readOnly\"];\n}\n\nconst useA11yValue = ({\n  required,\n  disabled,\n  readOnly,\n  labelId,\n  helperTextId,\n  renderHelperText,\n}: A11yValueProps) => {\n  return useMemo(\n    () => ({\n      \"aria-labelledby\": labelId,\n      \"aria-required\": required,\n      \"aria-describedby\": renderHelperText ? helperTextId : undefined,\n      disabled,\n      readOnly,\n    }),\n    [labelId, disabled, readOnly, required, renderHelperText, helperTextId],\n  );\n};\n\n// TODO: Add TS props for this\nexport const useFormFieldLegacy = ({\n  onBlur,\n  onFocus,\n}: {\n  onBlur?: FocusEventHandler<HTMLDivElement>;\n  onFocus?: FocusEventHandler<HTMLDivElement>;\n}): [\n  { focused: boolean },\n  { setFocused: Dispatch<SetStateAction<boolean>> },\n  {\n    onBlur: FocusEventHandler<HTMLDivElement>;\n    onFocus: FocusEventHandler<HTMLDivElement>;\n  },\n] => {\n  const [focused, setFocused] = useState(false);\n  const handleBlur: FocusEventHandler<HTMLDivElement> = (event) => {\n    setFocused(false);\n    onBlur?.(event);\n  };\n  const handleFocus: FocusEventHandler<HTMLDivElement> = (event) => {\n    setFocused(true);\n    onFocus?.(event);\n  };\n  return [\n    {\n      focused,\n    },\n    {\n      setFocused,\n    },\n    {\n      onBlur: handleBlur,\n      onFocus: handleFocus,\n    },\n  ];\n};\n\nconst withBaseName = makePrefixer(classBase);\n\nexport const FormFieldLegacy = forwardRef(\n  (\n    {\n      ActivationIndicatorComponent = FormActivationIndicator,\n      children,\n      className,\n      disabled,\n      disableFocusRing = false,\n      fullWidth = true,\n      hasStatusIndicator,\n      HelperTextComponent = FormHelperText,\n      HelperTextProps,\n      helperText,\n      helperTextPlacement = \"bottom\",\n      label,\n      LabelComponent = FormLabel,\n      labelPlacement = \"top\",\n      LabelProps = { displayedNecessity: \"required\" },\n      onBlur,\n      onFocus,\n      readOnly,\n      required,\n      StatusIndicatorProps,\n      validationStatus,\n      variant = \"primary\",\n      ...restProps\n    }: FormFieldLegacyProps,\n    ref: ForwardedRef<HTMLDivElement>,\n  ) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-form-field-legacy\",\n      css: formFieldLegacyCss,\n      window: targetWindow,\n    });\n\n    const labelId = useId(LabelProps?.id);\n    const helperTextId = useId(HelperTextProps?.id);\n    const rootRef = useRef<HTMLDivElement>(null);\n\n    const renderHelperText = !!helperText;\n\n    const a11yValue = useA11yValue({\n      required,\n      disabled,\n      readOnly,\n      labelId,\n      helperTextId,\n      renderHelperText,\n    });\n\n    const [states, dispatchers, eventHandlers] = useFormFieldLegacy({\n      onBlur,\n      onFocus,\n    });\n\n    const hasLabel = label !== undefined;\n    const labelTop = hasLabel && labelPlacement === \"top\";\n    const labelLeft = hasLabel && labelPlacement === \"left\";\n    const isWarning = validationStatus === \"warning\";\n    const isError = validationStatus === \"error\";\n    const focusClass = disableFocusRing\n      ? \"lowFocused\"\n      : \"focused\"; /* NOTE: need to look at */\n    const inlineHelperText =\n      renderHelperText && helperTextPlacement === \"bottom\";\n    const tooltipHelperText =\n      renderHelperText &&\n      helperTextPlacement === \"tooltip\" &&\n      !hasStatusIndicator;\n\n    const handleTriggerRef = useForkRef(rootRef, ref);\n\n    return (\n      <Tooltip disabled={!tooltipHelperText} content={helperText}>\n        <div\n          ref={handleTriggerRef}\n          className={clsx(\n            withBaseName(),\n            {\n              [withBaseName(\"disabled\")]: disabled,\n              [withBaseName(\"readOnly\")]: readOnly,\n              [withBaseName(\"warning\")]: isWarning,\n              [withBaseName(\"error\")]: isError,\n              [withBaseName(\"fullWidth\")]: fullWidth,\n              [withBaseName(focusClass)]: states.focused,\n              [withBaseName(\"labelTop\")]: labelTop,\n              [withBaseName(\"labelLeft\")]: labelLeft,\n              [withBaseName(\"withHelperText\")]: inlineHelperText,\n              [withBaseName(variant)]: variant,\n            },\n            className,\n          )}\n          {...eventHandlers}\n          {...restProps}\n        >\n          <FormFieldLegacyContext.Provider\n            value={{\n              ...states,\n              ...dispatchers,\n              ...eventHandlers,\n              a11yProps: a11yValue,\n              inFormField: true,\n              ref: rootRef,\n            }}\n          >\n            {hasLabel && (\n              <LabelComponent\n                {...LabelProps}\n                validationStatus={validationStatus}\n                hasStatusIndicator={hasStatusIndicator}\n                StatusIndicatorProps={StatusIndicatorProps}\n                className={LabelProps.className}\n                label={label}\n                disabled={disabled}\n                readOnly={readOnly}\n                required={required}\n                tooltipText={helperText}\n                id={labelId}\n              />\n            )}\n            {children}\n            <ActivationIndicatorComponent\n              hasIcon={!hasStatusIndicator}\n              validationStatus={validationStatus}\n            />\n            {renderHelperText && (\n              <HelperTextComponent\n                helperText={helperText}\n                helperTextPlacement={helperTextPlacement}\n                {...HelperTextProps}\n                id={helperTextId}\n              />\n            )}\n          </FormFieldLegacyContext.Provider>\n        </div>\n      </Tooltip>\n    );\n  },\n);\n"],"names":["formFieldLegacyCss"],"mappings":"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"}
+{"version":3,"file":"FormFieldLegacy.js","sources":["../src/form-field-legacy/FormFieldLegacy.tsx"],"sourcesContent":["import { Tooltip, makePrefixer, useForkRef, useId } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n  type Dispatch,\n  type ElementType,\n  type FocusEventHandler,\n  type ForwardedRef,\n  type HTMLAttributes,\n  type SetStateAction,\n  forwardRef,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { FormFieldLegacyContext } from \"../form-field-context-legacy\";\nimport {\n  FormActivationIndicator,\n  type FormActivationIndicatorProps,\n} from \"./FormActivationIndicator\";\nimport { FormHelperText, type FormHelperTextProps } from \"./FormHelperText\";\nimport { FormLabel, type FormLabelProps } from \"./FormLabel\";\nimport type { NecessityIndicatorOptions } from \"./NecessityIndicator\";\nimport type { StatusIndicatorProps } from \"./StatusIndicator\";\nimport { classBase } from \"./constant\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport formFieldLegacyCss from \"./FormFieldLegacy.css\";\n\nexport type FormFieldLabelPlacement = \"top\" | \"left\";\nexport type FormFieldHelperTextPlacement = \"bottom\" | \"tooltip\";\nexport type FormFieldValidationStatus = \"error\" | \"warning\";\n\nexport interface A11yValueProps\n  extends Pick<NecessityIndicatorOptions, \"required\"> {\n  /**\n   * If `true`, the FormField will be disabled.\n   */\n  disabled?: boolean;\n  /** id of the helper text node */\n  helperTextId?: string;\n  /** id of the label node */\n  labelId?: string;\n  /**\n   * The FormField value is Readonly\n   */\n  readOnly?: boolean;\n\n  /**\n   * Whether the form field needs to render helper text\n   */\n  renderHelperText?: boolean;\n}\n\nexport interface FormFieldLegacyProps\n  extends HTMLAttributes<HTMLDivElement>,\n    A11yValueProps {\n  /**\n   * The component used for activation indicator. Default to `FormActivationIndicator`.\n   */\n  ActivationIndicatorComponent?: ElementType<FormActivationIndicatorProps>;\n  /**\n   * Outer focus ring focus will not be applied. Defaults to false.\n   */\n  disableFocusRing?: boolean;\n  // I hate this fullWidth business. We should support a width prop. The default should be 100% (standard block behaviour)\n  // we should also support 'auto' or explicit numeric values\n  /**\n   * Whether the form field is occupying full width.\n   */\n  fullWidth?: boolean;\n  /**\n   * Whether to show the StatusIndicator component for validation states.\n   */\n  hasStatusIndicator?: boolean;\n  /**\n   * The helper text content\n   */\n  helperText?: string;\n  /**\n   * The component used for the helper text. Default to `FormHelperText`.\n   */\n  HelperTextComponent?: ElementType<FormHelperTextProps>;\n  /**\n   * Location the helperText, values: 'bottom' (default) or 'tooltip'.\n   */\n  helperTextPlacement?: FormFieldHelperTextPlacement;\n  /**\n   * Props to be applied to the `HelperTextComponent`.\n   *\n   * Generic on `FormHelperTextProps` is omitted.\n   */\n  HelperTextProps?: Partial<FormHelperTextProps>;\n  /**\n   * The label value for the FormField\n   */\n  label?: string;\n  /**\n   * The component used for the label. Default to `FormLabel`.\n   */\n  LabelComponent?: ElementType;\n  /**\n   * Location the label, values: 'top' (default) or 'left'\n   */\n  labelPlacement?: FormFieldLabelPlacement;\n  /**\n   * Props to be applied to the `LabelComponent`\n   */\n  LabelProps?: Partial<FormLabelProps>;\n  /**\n   * Override props to be used with the StatusIndicator component\n   */\n  StatusIndicatorProps?: Partial<StatusIndicatorProps>;\n  /**\n   * The state for the FormField: Must be one of: 'error'|'warning'|undefined\n   */\n  validationStatus?: FormFieldValidationStatus;\n  /**\n   * FormField variants; defaults to primary.\n   *\n   * **Deprecated:** The 'tertiary' variant has been deprecated\n   */\n  variant?: \"primary\" | \"secondary\" | \"tertiary\";\n}\n\nexport interface useA11yValueValue {\n  \"aria-labelledby\": A11yValueProps[\"labelId\"];\n  \"aria-required\": A11yValueProps[\"required\"];\n  \"aria-describedby\": A11yValueProps[\"helperTextId\"] | undefined;\n  disabled: A11yValueProps[\"disabled\"];\n  readOnly: A11yValueProps[\"readOnly\"];\n}\n\nconst useA11yValue = ({\n  required,\n  disabled,\n  readOnly,\n  labelId,\n  helperTextId,\n  renderHelperText,\n}: A11yValueProps) => {\n  return useMemo(\n    () => ({\n      \"aria-labelledby\": labelId,\n      \"aria-required\": required,\n      \"aria-describedby\": renderHelperText ? helperTextId : undefined,\n      disabled,\n      readOnly,\n    }),\n    [labelId, disabled, readOnly, required, renderHelperText, helperTextId],\n  );\n};\n\n// TODO: Add TS props for this\nexport const useFormFieldLegacy = ({\n  onBlur,\n  onFocus,\n}: {\n  onBlur?: FocusEventHandler<HTMLDivElement>;\n  onFocus?: FocusEventHandler<HTMLDivElement>;\n}): [\n  { focused: boolean },\n  { setFocused: Dispatch<SetStateAction<boolean>> },\n  {\n    onBlur: FocusEventHandler<HTMLDivElement>;\n    onFocus: FocusEventHandler<HTMLDivElement>;\n  },\n] => {\n  const [focused, setFocused] = useState(false);\n  const handleBlur: FocusEventHandler<HTMLDivElement> = (event) => {\n    setFocused(false);\n    onBlur?.(event);\n  };\n  const handleFocus: FocusEventHandler<HTMLDivElement> = (event) => {\n    setFocused(true);\n    onFocus?.(event);\n  };\n  return [\n    {\n      focused,\n    },\n    {\n      setFocused,\n    },\n    {\n      onBlur: handleBlur,\n      onFocus: handleFocus,\n    },\n  ];\n};\n\nconst withBaseName = makePrefixer(classBase);\n\nexport const FormFieldLegacy = forwardRef(\n  (\n    {\n      ActivationIndicatorComponent = FormActivationIndicator,\n      children,\n      className,\n      disabled,\n      disableFocusRing = false,\n      fullWidth = true,\n      hasStatusIndicator,\n      HelperTextComponent = FormHelperText,\n      HelperTextProps,\n      helperText,\n      helperTextPlacement = \"bottom\",\n      label,\n      LabelComponent = FormLabel,\n      labelPlacement = \"top\",\n      LabelProps = { displayedNecessity: \"required\" },\n      onBlur,\n      onFocus,\n      readOnly,\n      required,\n      StatusIndicatorProps,\n      validationStatus,\n      variant = \"primary\",\n      ...restProps\n    }: FormFieldLegacyProps,\n    ref: ForwardedRef<HTMLDivElement>,\n  ) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-form-field-legacy\",\n      css: formFieldLegacyCss,\n      window: targetWindow,\n    });\n\n    const labelId = useId(LabelProps?.id);\n    const helperTextId = useId(HelperTextProps?.id);\n    const rootRef = useRef<HTMLDivElement>(null);\n\n    const renderHelperText = !!helperText;\n\n    const a11yValue = useA11yValue({\n      required,\n      disabled,\n      readOnly,\n      labelId,\n      helperTextId,\n      renderHelperText,\n    });\n\n    const [states, dispatchers, eventHandlers] = useFormFieldLegacy({\n      onBlur,\n      onFocus,\n    });\n\n    const hasLabel = label !== undefined;\n    const labelTop = hasLabel && labelPlacement === \"top\";\n    const labelLeft = hasLabel && labelPlacement === \"left\";\n    const isWarning = validationStatus === \"warning\";\n    const isError = validationStatus === \"error\";\n    const focusClass = disableFocusRing\n      ? \"lowFocused\"\n      : \"focused\"; /* NOTE: need to look at */\n    const inlineHelperText =\n      renderHelperText && helperTextPlacement === \"bottom\";\n    const tooltipHelperText =\n      renderHelperText &&\n      helperTextPlacement === \"tooltip\" &&\n      !hasStatusIndicator;\n\n    const handleTriggerRef = useForkRef(rootRef, ref);\n\n    return (\n      <Tooltip disabled={!tooltipHelperText} content={helperText}>\n        <div\n          ref={handleTriggerRef}\n          className={clsx(\n            withBaseName(),\n            {\n              [withBaseName(\"disabled\")]: disabled,\n              [withBaseName(\"readOnly\")]: readOnly,\n              [withBaseName(\"warning\")]: isWarning,\n              [withBaseName(\"error\")]: isError,\n              [withBaseName(\"fullWidth\")]: fullWidth,\n              [withBaseName(focusClass)]: states.focused,\n              [withBaseName(\"labelTop\")]: labelTop,\n              [withBaseName(\"labelLeft\")]: labelLeft,\n              [withBaseName(\"withHelperText\")]: inlineHelperText,\n              [withBaseName(variant)]: variant,\n            },\n            className,\n          )}\n          {...eventHandlers}\n          {...restProps}\n        >\n          <FormFieldLegacyContext.Provider\n            value={{\n              ...states,\n              ...dispatchers,\n              ...eventHandlers,\n              a11yProps: a11yValue,\n              inFormField: true,\n              ref: rootRef,\n            }}\n          >\n            {hasLabel && (\n              <LabelComponent\n                {...LabelProps}\n                validationStatus={validationStatus}\n                hasStatusIndicator={hasStatusIndicator}\n                StatusIndicatorProps={StatusIndicatorProps}\n                className={LabelProps.className}\n                label={label}\n                disabled={disabled}\n                readOnly={readOnly}\n                required={required}\n                tooltipText={helperText}\n                id={labelId}\n              />\n            )}\n            {children}\n            <ActivationIndicatorComponent\n              hasIcon={!hasStatusIndicator}\n              validationStatus={validationStatus}\n            />\n            {renderHelperText && (\n              <HelperTextComponent\n                helperText={helperText}\n                helperTextPlacement={helperTextPlacement}\n                {...HelperTextProps}\n                id={helperTextId}\n              />\n            )}\n          </FormFieldLegacyContext.Provider>\n        </div>\n      </Tooltip>\n    );\n  },\n);\n"],"names":["formFieldLegacyCss"],"mappings":"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"}

package/dist-es/form-field-legacy/StatusIndicator.js

@@ -1,5 +1,5 @@
 import { jsx } from 'react/jsx-runtime';
-import { makePrefixer, StatusIndicator as StatusIndicator$1, Tooltip } from '@salt-ds/core';
+import { makePrefixer, Tooltip, StatusIndicator as StatusIndicator$1 } from '@salt-ds/core';
 import { clsx } from 'clsx';
 
 const withBaseName = makePrefixer("saltFormField");

package/dist-es/form-field-legacy/StatusIndicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusIndicator.js","sources":["../src/form-field-legacy/StatusIndicator.tsx"],"sourcesContent":["import {\n  StatusIndicator as BaseStatusIndicator,\n  Tooltip,\n  type TooltipProps,\n  makePrefixer,\n} from \"@salt-ds/core\";\nimport type { IconProps } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport type { ElementType } from \"react\";\n\nconst withBaseName = makePrefixer(\"saltFormField\");\n\nexport type StatusIndicatorStatus = \"error\" | \"info\" | \"warning\" | \"success\";\n\nexport interface StatusIndicatorProps extends IconProps {\n  hasTooltip?: boolean;\n  IconProps?: Partial<IconProps>;\n  status?: StatusIndicatorStatus;\n  TooltipComponent?: ElementType<TooltipProps>;\n  TooltipProps?: Partial<TooltipProps>;\n  tooltipText?: string;\n}\n\nexport const StatusIndicator = (props: StatusIndicatorProps) => {\n  const {\n    TooltipComponent = Tooltip,\n    hasTooltip = false,\n    TooltipProps,\n    tooltipText,\n    IconProps,\n    className,\n    status = \"info\",\n    ...restProps\n  } = props;\n\n  return (\n    <TooltipComponent\n      hideIcon\n      status={status}\n      content={tooltipText}\n      placement=\"top\"\n      disabled={!hasTooltip}\n      {...TooltipProps}\n    >\n      <BaseStatusIndicator\n        status={status}\n        {...restProps}\n        {...IconProps}\n        className={clsx(\n          withBaseName(\"statusIndicator\"),\n          className,\n          IconProps?.className,\n        )}\n      />\n    </TooltipComponent>\n  );\n};\n"],"names":["BaseStatusIndicator"],"mappings":";;;;AAUA,MAAM,YAAA,GAAe,aAAa,eAAe,CAAA;AAapC,MAAA,eAAA,GAAkB,CAAC,KAAgC,KAAA;AAC9D,EAAM,MAAA;AAAA,IACJ,gBAAmB,GAAA,OAAA;AAAA,IACnB,UAAa,GAAA,KAAA;AAAA,IACb,YAAA;AAAA,IACA,WAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAS,GAAA,MAAA;AAAA,IACT,GAAG;AAAA,GACD,GAAA,KAAA;AAEJ,EACE,uBAAA,GAAA;AAAA,IAAC,gBAAA;AAAA,IAAA;AAAA,MACC,QAAQ,EAAA,IAAA;AAAA,MACR,MAAA;AAAA,MACA,OAAS,EAAA,WAAA;AAAA,MACT,SAAU,EAAA,KAAA;AAAA,MACV,UAAU,CAAC,UAAA;AAAA,MACV,GAAG,YAAA;AAAA,MAEJ,QAAA,kBAAA,GAAA;AAAA,QAACA,iBAAA;AAAA,QAAA;AAAA,UACC,MAAA;AAAA,UACC,GAAG,SAAA;AAAA,UACH,GAAG,SAAA;AAAA,UACJ,SAAW,EAAA,IAAA;AAAA,YACT,aAAa,iBAAiB,CAAA;AAAA,YAC9B,SAAA;AAAA,YACA,SAAW,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAA;AAAA;AACb;AAAA;AACF;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"StatusIndicator.js","sources":["../src/form-field-legacy/StatusIndicator.tsx"],"sourcesContent":["import {\n  StatusIndicator as BaseStatusIndicator,\n  Tooltip,\n  type TooltipProps,\n  makePrefixer,\n} from \"@salt-ds/core\";\nimport type { IconProps } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport type { ElementType } from \"react\";\n\nconst withBaseName = makePrefixer(\"saltFormField\");\n\nexport type StatusIndicatorStatus = \"error\" | \"info\" | \"warning\" | \"success\";\n\nexport interface StatusIndicatorProps extends IconProps {\n  hasTooltip?: boolean;\n  IconProps?: Partial<IconProps>;\n  status?: StatusIndicatorStatus;\n  TooltipComponent?: ElementType<TooltipProps>;\n  TooltipProps?: Partial<TooltipProps>;\n  tooltipText?: string;\n}\n\nexport const StatusIndicator = (props: StatusIndicatorProps) => {\n  const {\n    TooltipComponent = Tooltip,\n    hasTooltip = false,\n    TooltipProps,\n    tooltipText,\n    IconProps,\n    className,\n    status = \"info\",\n    ...restProps\n  } = props;\n\n  return (\n    <TooltipComponent\n      hideIcon\n      status={status}\n      content={tooltipText}\n      placement=\"top\"\n      disabled={!hasTooltip}\n      {...TooltipProps}\n    >\n      <BaseStatusIndicator\n        status={status}\n        {...restProps}\n        {...IconProps}\n        className={clsx(\n          withBaseName(\"statusIndicator\"),\n          className,\n          IconProps?.className,\n        )}\n      />\n    </TooltipComponent>\n  );\n};\n"],"names":["BaseStatusIndicator"],"mappings":";;;;AAUA,MAAM,YAAA,GAAe,aAAa,eAAe,CAAA;AAapC,MAAA,eAAA,GAAkB,CAAC,KAAgC,KAAA;AAC9D,EAAM,MAAA;AAAA,IACJ,gBAAmB,GAAA,OAAA;AAAA,IACnB,UAAa,GAAA,KAAA;AAAA,IACb,YAAA;AAAA,IACA,WAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAS,GAAA,MAAA;AAAA,IACT,GAAG;AAAA,GACD,GAAA,KAAA;AAEJ,EACE,uBAAA,GAAA;AAAA,IAAC,gBAAA;AAAA,IAAA;AAAA,MACC,QAAQ,EAAA,IAAA;AAAA,MACR,MAAA;AAAA,MACA,OAAS,EAAA,WAAA;AAAA,MACT,SAAU,EAAA,KAAA;AAAA,MACV,UAAU,CAAC,UAAA;AAAA,MACV,GAAG,YAAA;AAAA,MAEJ,QAAA,kBAAA,GAAA;AAAA,QAACA,iBAAA;AAAA,QAAA;AAAA,UACC,MAAA;AAAA,UACC,GAAG,SAAA;AAAA,UACH,GAAG,SAAA;AAAA,UACJ,SAAW,EAAA,IAAA;AAAA,YACT,aAAa,iBAAiB,CAAA;AAAA,YAC9B,SAAA;AAAA,YACA,SAAW,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAA;AAAA;AACb;AAAA;AACF;AAAA,GACF;AAEJ;;;;"}

package/dist-es/formatted-input/FormattedInput.js

@@ -5,7 +5,7 @@ import { forwardRef } from 'react';
 import { useRifm } from 'rifm';
 import { InputLegacy } from '../input-legacy/InputLegacy.js';
 import '../input-legacy/StaticInputAdornment.js';
-import { baseName, InputWithMask } from './internal/InputWithMask.js';
+import { InputWithMask, baseName } from './internal/InputWithMask.js';
 import { useComponentCssInjection } from '@salt-ds/styles';
 import { useWindow } from '@salt-ds/window';
 import css_248z from './FormattedInput.css.js';

package/dist-es/formatted-input/FormattedInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormattedInput.js","sources":["../src/formatted-input/FormattedInput.tsx"],"sourcesContent":["import { useControlled } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { forwardRef } from \"react\";\nimport { useRifm } from \"rifm\";\nimport {\n  InputLegacy as Input,\n  type InputLegacyProps as InputProps,\n} from \"../input-legacy\";\nimport {\n  InputWithMask,\n  type InputWithMaskProps,\n  baseName,\n} from \"./internal/InputWithMask\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport formattedInputCss from \"./FormattedInput.css\";\n\nexport type MaskFunction = (value: string | undefined) => boolean;\n\nexport interface RifmOptions {\n  format?: (str: string) => string;\n  replace?: (str: string) => string;\n  append?: (str: string) => string;\n  mask?: boolean | MaskFunction;\n  accept?: RegExp;\n}\n\nexport interface FormattedInputProps extends Omit<InputProps, \"onChange\"> {\n  mask?: string;\n  onChange?: (value: string) => void;\n  rifmOptions?: RifmOptions;\n  value?: string;\n  defaultValue?: string;\n}\n\nconst defaultFormatter = (string: string): string => string;\nconst defaultRifmOptions: RifmOptions = {};\n\nexport const FormattedInput = forwardRef<HTMLInputElement, FormattedInputProps>(\n  function FormattedInput(\n    {\n      defaultValue = \"\",\n      className,\n      inputProps,\n      mask,\n      onChange,\n      rifmOptions = defaultRifmOptions,\n      value: valueProp,\n      textAlign,\n      ...other\n    },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-formatted-input\",\n      css: formattedInputCss,\n      window: targetWindow,\n    });\n\n    const [valueState, setValueState] = useControlled<string | undefined>({\n      default: defaultValue,\n      controlled: valueProp,\n      name: \"FormattedInput\",\n      state: \"value\",\n    });\n\n    const handleChange = (value: string) => {\n      setValueState(value);\n      onChange?.(value);\n    };\n\n    let rifmMask = false;\n\n    if (rifmOptions.mask) {\n      rifmMask =\n        typeof rifmOptions.mask === \"function\"\n          ? rifmOptions.mask(valueState)\n          : rifmOptions.mask;\n    }\n\n    const rifm = useRifm({\n      format: defaultFormatter,\n      accept: /.*/,\n      ...rifmOptions,\n      mask: rifmMask,\n      value: valueState || \"\",\n      onChange: handleChange,\n    });\n\n    return (\n      <Input\n        className={clsx(baseName, className)}\n        inputComponent={InputWithMask}\n        inputProps={{ mask, textAlign, ...inputProps } as InputWithMaskProps}\n        onChange={rifm.onChange}\n        textAlign={textAlign}\n        value={rifm.value}\n        {...other}\n        ref={ref}\n      />\n    );\n  },\n);\n"],"names":["FormattedInput","formattedInputCss","Input"],"mappings":";;;;;;;;;;;;AAqCA,MAAM,gBAAA,GAAmB,CAAC,MAA2B,KAAA,MAAA;AACrD,MAAM,qBAAkC,EAAC;AAElC,MAAM,cAAiB,GAAA,UAAA;AAAA,EAC5B,SAASA,eACP,CAAA;AAAA,IACE,YAAe,GAAA,EAAA;AAAA,IACf,SAAA;AAAA,IACA,UAAA;AAAA,IACA,IAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAc,GAAA,kBAAA;AAAA,IACd,KAAO,EAAA,SAAA;AAAA,IACP,SAAA;AAAA,IACA,GAAG;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,sBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAI,aAAkC,CAAA;AAAA,MACpE,OAAS,EAAA,YAAA;AAAA,MACT,UAAY,EAAA,SAAA;AAAA,MACZ,IAAM,EAAA,gBAAA;AAAA,MACN,KAAO,EAAA;AAAA,KACR,CAAA;AAED,IAAM,MAAA,YAAA,GAAe,CAAC,KAAkB,KAAA;AACtC,MAAA,aAAA,CAAc,KAAK,CAAA;AACnB,MAAW,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAA,KAAA,CAAA;AAAA,KACb;AAEA,IAAA,IAAI,QAAW,GAAA,KAAA;AAEf,IAAA,IAAI,YAAY,IAAM,EAAA;AACpB,MACE,QAAA,GAAA,OAAO,YAAY,IAAS,KAAA,UAAA,GACxB,YAAY,IAAK,CAAA,UAAU,IAC3B,WAAY,CAAA,IAAA;AAAA;AAGpB,IAAA,MAAM,OAAO,OAAQ,CAAA;AAAA,MACnB,MAAQ,EAAA,gBAAA;AAAA,MACR,MAAQ,EAAA,IAAA;AAAA,MACR,GAAG,WAAA;AAAA,MACH,IAAM,EAAA,QAAA;AAAA,MACN,OAAO,UAAc,IAAA,EAAA;AAAA,MACrB,QAAU,EAAA;AAAA,KACX,CAAA;AAED,IACE,uBAAA,GAAA;AAAA,MAACC,WAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,IAAK,CAAA,QAAA,EAAU,SAAS,CAAA;AAAA,QACnC,cAAgB,EAAA,aAAA;AAAA,QAChB,UAAY,EAAA,EAAE,IAAM,EAAA,SAAA,EAAW,GAAG,UAAW,EAAA;AAAA,QAC7C,UAAU,IAAK,CAAA,QAAA;AAAA,QACf,SAAA;AAAA,QACA,OAAO,IAAK,CAAA,KAAA;AAAA,QACX,GAAG,KAAA;AAAA,QACJ;AAAA;AAAA,KACF;AAAA;AAGN;;;;"}
+{"version":3,"file":"FormattedInput.js","sources":["../src/formatted-input/FormattedInput.tsx"],"sourcesContent":["import { useControlled } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { forwardRef } from \"react\";\nimport { useRifm } from \"rifm\";\nimport {\n  InputLegacy as Input,\n  type InputLegacyProps as InputProps,\n} from \"../input-legacy\";\nimport {\n  InputWithMask,\n  type InputWithMaskProps,\n  baseName,\n} from \"./internal/InputWithMask\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport formattedInputCss from \"./FormattedInput.css\";\n\nexport type MaskFunction = (value: string | undefined) => boolean;\n\nexport interface RifmOptions {\n  format?: (str: string) => string;\n  replace?: (str: string) => string;\n  append?: (str: string) => string;\n  mask?: boolean | MaskFunction;\n  accept?: RegExp;\n}\n\nexport interface FormattedInputProps extends Omit<InputProps, \"onChange\"> {\n  mask?: string;\n  onChange?: (value: string) => void;\n  rifmOptions?: RifmOptions;\n  value?: string;\n  defaultValue?: string;\n}\n\nconst defaultFormatter = (string: string): string => string;\nconst defaultRifmOptions: RifmOptions = {};\n\nexport const FormattedInput = forwardRef<HTMLInputElement, FormattedInputProps>(\n  function FormattedInput(\n    {\n      defaultValue = \"\",\n      className,\n      inputProps,\n      mask,\n      onChange,\n      rifmOptions = defaultRifmOptions,\n      value: valueProp,\n      textAlign,\n      ...other\n    },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-formatted-input\",\n      css: formattedInputCss,\n      window: targetWindow,\n    });\n\n    const [valueState, setValueState] = useControlled<string | undefined>({\n      default: defaultValue,\n      controlled: valueProp,\n      name: \"FormattedInput\",\n      state: \"value\",\n    });\n\n    const handleChange = (value: string) => {\n      setValueState(value);\n      onChange?.(value);\n    };\n\n    let rifmMask = false;\n\n    if (rifmOptions.mask) {\n      rifmMask =\n        typeof rifmOptions.mask === \"function\"\n          ? rifmOptions.mask(valueState)\n          : rifmOptions.mask;\n    }\n\n    const rifm = useRifm({\n      format: defaultFormatter,\n      accept: /.*/,\n      ...rifmOptions,\n      mask: rifmMask,\n      value: valueState || \"\",\n      onChange: handleChange,\n    });\n\n    return (\n      <Input\n        className={clsx(baseName, className)}\n        inputComponent={InputWithMask}\n        inputProps={{ mask, textAlign, ...inputProps } as InputWithMaskProps}\n        onChange={rifm.onChange}\n        textAlign={textAlign}\n        value={rifm.value}\n        {...other}\n        ref={ref}\n      />\n    );\n  },\n);\n"],"names":["FormattedInput","formattedInputCss","Input"],"mappings":";;;;;;;;;;;;AAqCA,MAAM,gBAAA,GAAmB,CAAC,MAA2B,KAAA,MAAA;AACrD,MAAM,qBAAkC,EAAC;AAElC,MAAM,cAAiB,GAAA,UAAA;AAAA,EAC5B,SAASA,eACP,CAAA;AAAA,IACE,YAAe,GAAA,EAAA;AAAA,IACf,SAAA;AAAA,IACA,UAAA;AAAA,IACA,IAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAc,GAAA,kBAAA;AAAA,IACd,KAAO,EAAA,SAAA;AAAA,IACP,SAAA;AAAA,IACA,GAAG;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,sBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAI,aAAkC,CAAA;AAAA,MACpE,OAAS,EAAA,YAAA;AAAA,MACT,UAAY,EAAA,SAAA;AAAA,MACZ,IAAM,EAAA,gBAAA;AAAA,MACN,KAAO,EAAA;AAAA,KACR,CAAA;AAED,IAAM,MAAA,YAAA,GAAe,CAAC,KAAkB,KAAA;AACtC,MAAA,aAAA,CAAc,KAAK,CAAA;AACnB,MAAW,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAA,KAAA,CAAA;AAAA,KACb;AAEA,IAAA,IAAI,QAAW,GAAA,KAAA;AAEf,IAAA,IAAI,YAAY,IAAM,EAAA;AACpB,MACE,QAAA,GAAA,OAAO,YAAY,IAAS,KAAA,UAAA,GACxB,YAAY,IAAK,CAAA,UAAU,IAC3B,WAAY,CAAA,IAAA;AAAA;AAGpB,IAAA,MAAM,OAAO,OAAQ,CAAA;AAAA,MACnB,MAAQ,EAAA,gBAAA;AAAA,MACR,MAAQ,EAAA,IAAA;AAAA,MACR,GAAG,WAAA;AAAA,MACH,IAAM,EAAA,QAAA;AAAA,MACN,OAAO,UAAc,IAAA,EAAA;AAAA,MACrB,QAAU,EAAA;AAAA,KACX,CAAA;AAED,IACE,uBAAA,GAAA;AAAA,MAACC,WAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,IAAK,CAAA,QAAA,EAAU,SAAS,CAAA;AAAA,QACnC,cAAgB,EAAA,aAAA;AAAA,QAChB,UAAY,EAAA,EAAE,IAAM,EAAA,SAAA,EAAW,GAAG,UAAW,EAAA;AAAA,QAC7C,UAAU,IAAK,CAAA,QAAA;AAAA,QACf,SAAA;AAAA,QACA,OAAO,IAAK,CAAA,KAAA;AAAA,QACX,GAAG,KAAA;AAAA,QACJ;AAAA;AAAA,KACF;AAAA;AAGN;;;;"}

package/dist-es/index.js

@@ -64,13 +64,16 @@ export { DateInputRange, DateParserField } from './date-input/DateInputRange.js'
 export { DatePicker, DatePickerMain } from './date-picker/DatePicker.js';
 export { DatePickerActions } from './date-picker/DatePickerActions.js';
 export { DateRangeSelectionContext, SingleDateSelectionContext, useDatePickerContext } from './date-picker/DatePickerContext.js';
+export { DatePickerHelperText } from './date-picker/DatePickerHelperText.js';
 export { DatePickerOverlay } from './date-picker/DatePickerOverlay.js';
 export { DatePickerOverlayProvider, useDatePickerOverlay } from './date-picker/DatePickerOverlayProvider.js';
 export { DatePickerRangeInput, defaultRangeValidator } from './date-picker/DatePickerRangeInput.js';
+export { DatePickerRangeGridPanel } from './date-picker/DatePickerRangeGridPanel.js';
 export { DatePickerRangePanel } from './date-picker/DatePickerRangePanel.js';
 export { DatePickerSingleInput } from './date-picker/DatePickerSingleInput.js';
-export { DatePickerSinglePanel } from './date-picker/DatePickerSinglePanel.js';
+export { DatePickerSingleGridPanel } from './date-picker/DatePickerSingleGridPanel.js';
 export { DatePickerTrigger } from './date-picker/DatePickerTrigger.js';
+export { DatePickerSinglePanel } from './date-picker/DatePickerSinglePanel.js';
 export { DeckItem } from './deck-item/DeckItem.js';
 export { DeckLayout } from './deck-layout/DeckLayout.js';
 export { DropdownBase } from './dropdown/DropdownBase.js';
@@ -120,9 +123,6 @@ export { useWidth } from './responsive/useWidth.js';
 export { DropdownPlaceholder, NO_DATA, addAll, allExceptOverflowIndicator, byDescendingPriority, getDropdownPlaceholder, getElementForItem, getIsOverflowed, getOverflowIndicator, getRuntimePadding, isCollapsed, isCollapsedOrCollapsing, isCollapsible, isCollapsing, isOverflowed, measureContainer, measureContainerOverflow, measureElementSize, measureOverflowItems, notOverflowed, popNextItemByPriority } from './responsive/overflowUtils.js';
 export { isResponsiveAttribute, liftResponsivePropsToFormField } from './responsive/utils.js';
 export { SearchInput } from './search-input/SearchInput.js';
-export { Splitter } from './splitter/Splitter.js';
-export { SplitPanel } from './splitter/SplitPanel.js';
-export { SplitHandle } from './splitter/SplitHandle.js';
 export { StaticList } from './static-list/StaticList.js';
 export { StaticListItem } from './static-list/StaticListItem.js';
 export { StaticListItemContent } from './static-list/StaticListItemContent.js';

package/dist-es/input-legacy/InputLegacy.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputLegacy.js","sources":["../src/input-legacy/InputLegacy.tsx"],"sourcesContent":["import { makePrefixer, useControlled, useForkRef } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n  type AriaAttributes,\n  type ChangeEvent,\n  type ElementType,\n  type FocusEvent,\n  type FocusEventHandler,\n  type HTMLAttributes,\n  type InputHTMLAttributes,\n  type KeyboardEventHandler,\n  type MouseEvent,\n  type MouseEventHandler,\n  type ReactNode,\n  forwardRef,\n  useRef,\n  useState,\n} from \"react\";\nimport { useFormFieldLegacyProps } from \"../form-field-context-legacy\";\nimport { useCursorOnFocus } from \"./useCursorOnFocus\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport inputLegacyCss from \"./InputLegacy.css\";\n\nconst withBaseName = makePrefixer(\"saltInputLegacy\");\n\n// TODO: Double confirm whether this should be extending DivElement given root is `<div>`.\n// And forwarded ref is not assigned to the root like other components.\nexport interface InputLegacyProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\" | \"defaultValue\"> {\n  /**\n   * Determines the position of the text cursor on focus of the input.\n   *\n   * start = place cursor at the beginning<br>\n   * end = place cursor at the end<br>\n   * \\# = index to place the cursor<br>\n   */\n  cursorPositionOnFocus?: \"start\" | \"end\" | number;\n  /**\n   * The value of the `input` element, required for an uncontrolled component.\n   */\n  defaultValue?: HTMLInputElement[\"defaultValue\"];\n  /**\n   * If `true`, the component is disabled.\n   */\n  disabled?: HTMLInputElement[\"disabled\"];\n  /**\n   * The marker to use in an empty read only Input.\n   * Use `''` to disable this feature. Defaults to '—'.\n   */\n  emptyReadOnlyMarker?: string;\n  /**\n   * Determines what gets highlighted on focus of the input.\n   *\n   * If `true` all text will be highlighted.\n   * If an array text between those indices will be highlighted\n   * e.g. [0,1] will highlight the first character.\n   */\n  highlightOnFocus?: boolean | number[];\n  /**\n   * The HTML element to render the Input, e.g. 'input', a custom React component.\n   */\n  inputComponent?: ElementType;\n  /**\n   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.\n   */\n  inputProps?: InputHTMLAttributes<HTMLInputElement>;\n  onBlur?: FocusEventHandler<HTMLInputElement>;\n  /**\n   * Callback for change event.\n   */\n  onChange?: (event: ChangeEvent<HTMLInputElement>, value: string) => void;\n  onFocus?: FocusEventHandler<HTMLInputElement>;\n  onKeyDown?: KeyboardEventHandler<HTMLInputElement>;\n  onKeyUp?: KeyboardEventHandler<HTMLInputElement>;\n  onMouseUp?: MouseEventHandler<HTMLInputElement>;\n  onMouseMove?: MouseEventHandler<HTMLInputElement>;\n  onMouseDown?: MouseEventHandler<HTMLInputElement>;\n  /**\n   * If `true`, the component is read only.\n   */\n  readOnly?: boolean;\n  /**\n   *\n   * Determines the alignment of the input text.\n   */\n  textAlign?: \"left\" | \"right\" | \"center\";\n  type?: HTMLInputElement[\"type\"];\n  /**\n   * The value of the `input` element, required for a controlled component.\n   */\n  value?: HTMLInputElement[\"value\"];\n  renderSuffix?: (state: {\n    disabled?: boolean;\n    error?: boolean;\n    focused?: boolean;\n    margin?: \"dense\" | \"none\" | \"normal\";\n    required?: boolean;\n    startAdornment?: ReactNode;\n  }) => ReactNode;\n  endAdornment?: ReactNode;\n  startAdornment?: ReactNode;\n}\n\nfunction mergeA11yProps(\n  a11yProps: Partial<ReturnType<typeof useFormFieldLegacyProps>[\"a11yProps\"]>,\n  inputProps: InputLegacyProps[\"inputProps\"],\n  misplacedAriaProps: AriaAttributes,\n) {\n  const ariaLabelledBy = clsx(\n    a11yProps?.[\"aria-labelledby\"],\n    inputProps?.[\"aria-labelledby\"],\n  );\n\n  return {\n    ...misplacedAriaProps,\n    ...a11yProps,\n    ...inputProps,\n    // The weird filtering is due to TokenizedInputBase\n    \"aria-labelledby\": ariaLabelledBy\n      ? Array.from(new Set(ariaLabelledBy.split(\" \"))).join(\" \")\n      : null,\n  };\n}\n\nexport const InputLegacy = forwardRef<HTMLInputElement, InputLegacyProps>(\n  function Input(\n    {\n      \"aria-activedescendant\": ariaActiveDescendant,\n      \"aria-expanded\": ariaExpanded,\n      \"aria-owns\": ariaOwns,\n      className: classNameProp,\n      cursorPositionOnFocus,\n      disabled,\n      emptyReadOnlyMarker = \"—\",\n      endAdornment,\n      highlightOnFocus,\n      id,\n      inputComponent: InputComponent = \"input\",\n      inputProps: inputPropsProp,\n      role,\n      style,\n      value: valueProp,\n      // If we leave both value and defaultValue undefined, we will get a React warning on first edit\n      // (uncontrolled to controlled warning) from the React input\n      defaultValue: defaultValueProp = valueProp === undefined ? \"\" : undefined,\n      onBlur,\n      onChange,\n      onFocus,\n      onKeyDown,\n      onKeyUp,\n      onMouseUp,\n      onMouseMove,\n      onMouseDown,\n      readOnly: readOnlyProp,\n      renderSuffix,\n      startAdornment,\n      textAlign = \"left\",\n      type = \"text\",\n      ...other\n    },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-input-legacy\",\n      css: inputLegacyCss,\n      window: targetWindow,\n    });\n\n    const {\n      a11yProps: {\n        readOnly: a11yReadOnly,\n        disabled: a11yDisabled,\n        ...restA11y\n      } = {},\n      setFocused: setFormFieldFocused,\n      inFormField,\n    } = useFormFieldLegacyProps();\n\n    const [focused, setFocused] = useState(false);\n    const inputRef = useRef(null);\n    const handleRef = useForkRef(inputRef, ref);\n    const cursorOnFocusHelpers = useCursorOnFocus(inputRef, {\n      cursorPositionOnFocus,\n      highlightOnFocus,\n    });\n\n    const isDisabled = disabled || a11yDisabled;\n    const isReadOnly = readOnlyProp || a11yReadOnly;\n    const misplacedAriaProps = {\n      \"aria-activedescendant\": ariaActiveDescendant,\n      \"aria-expanded\": ariaExpanded,\n      \"aria-owns\": ariaOwns,\n      role,\n    };\n    const inputProps = mergeA11yProps(\n      restA11y,\n      inputPropsProp,\n      misplacedAriaProps,\n    );\n    const isEmptyReadOnly = isReadOnly && !defaultValueProp && !valueProp;\n    const defaultValue = isEmptyReadOnly\n      ? emptyReadOnlyMarker\n      : defaultValueProp;\n\n    const [value, setValue] = useControlled({\n      controlled: valueProp,\n      default: defaultValue,\n      name: \"Input\",\n      state: \"value\",\n    });\n\n    const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n      const value = event.target.value;\n      setValue(value);\n      onChange?.(event, value);\n    };\n\n    const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n      onFocus?.(event);\n      setFormFieldFocused?.(true);\n      setFocused(true);\n    };\n\n    const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\n      onBlur?.(event);\n      setFormFieldFocused?.(false);\n      setFocused(false);\n    };\n\n    const handleMouseMove = (event: MouseEvent<HTMLInputElement>) => {\n      cursorOnFocusHelpers.handleMouseMove(event);\n\n      onMouseMove?.(event);\n    };\n\n    const handleMouseUp = (event: MouseEvent<HTMLInputElement>) => {\n      cursorOnFocusHelpers.handleMouseUp();\n\n      onMouseUp?.(event);\n    };\n\n    const handleMouseDown = (event: MouseEvent<HTMLInputElement>) => {\n      cursorOnFocusHelpers.handleMouseDown();\n\n      onMouseDown?.(event);\n    };\n\n    return (\n      <div\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(`${textAlign}TextAlign`)]: textAlign,\n            [withBaseName(\"formField\")]: inFormField,\n            [withBaseName(\"focused\")]: focused && !inFormField,\n            [withBaseName(\"disabled\")]: isDisabled,\n            [withBaseName(\"inputAdornedStart\")]: startAdornment,\n            [withBaseName(\"inputAdornedEnd\")]: endAdornment,\n          },\n          classNameProp,\n        )}\n        style={style}\n        {...other}\n      >\n        {startAdornment && (\n          <div className={withBaseName(\"prefixContainer\")}>\n            {startAdornment}\n          </div>\n        )}\n        <InputComponent\n          type={type}\n          id={id}\n          {...inputProps}\n          className={clsx(withBaseName(\"input\"), inputProps?.className)}\n          disabled={isDisabled}\n          ref={handleRef}\n          value={value}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onKeyDown={onKeyDown}\n          onKeyUp={onKeyUp}\n          onFocus={handleFocus}\n          onMouseDown={handleMouseDown}\n          onMouseUp={handleMouseUp}\n          onMouseMove={handleMouseMove}\n          readOnly={isReadOnly}\n        />\n        {endAdornment && (\n          <div className={withBaseName(\"suffixContainer\")}>{endAdornment}</div>\n        )}\n        {/* TODO: Confirm implementation of suffix */}\n        {renderSuffix?.({ disabled, focused })}\n      </div>\n    );\n  },\n);\n"],"names":["inputLegacyCss","value"],"mappings":"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"}
+{"version":3,"file":"InputLegacy.js","sources":["../src/input-legacy/InputLegacy.tsx"],"sourcesContent":["import { makePrefixer, useControlled, useForkRef } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n  type AriaAttributes,\n  type ChangeEvent,\n  type ElementType,\n  type FocusEvent,\n  type FocusEventHandler,\n  type HTMLAttributes,\n  type InputHTMLAttributes,\n  type KeyboardEventHandler,\n  type MouseEvent,\n  type MouseEventHandler,\n  type ReactNode,\n  forwardRef,\n  useRef,\n  useState,\n} from \"react\";\nimport { useFormFieldLegacyProps } from \"../form-field-context-legacy\";\nimport { useCursorOnFocus } from \"./useCursorOnFocus\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport inputLegacyCss from \"./InputLegacy.css\";\n\nconst withBaseName = makePrefixer(\"saltInputLegacy\");\n\n// TODO: Double confirm whether this should be extending DivElement given root is `<div>`.\n// And forwarded ref is not assigned to the root like other components.\nexport interface InputLegacyProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\" | \"defaultValue\"> {\n  /**\n   * Determines the position of the text cursor on focus of the input.\n   *\n   * start = place cursor at the beginning<br>\n   * end = place cursor at the end<br>\n   * \\# = index to place the cursor<br>\n   */\n  cursorPositionOnFocus?: \"start\" | \"end\" | number;\n  /**\n   * The value of the `input` element, required for an uncontrolled component.\n   */\n  defaultValue?: HTMLInputElement[\"defaultValue\"];\n  /**\n   * If `true`, the component is disabled.\n   */\n  disabled?: HTMLInputElement[\"disabled\"];\n  /**\n   * The marker to use in an empty read only Input.\n   * Use `''` to disable this feature. Defaults to '—'.\n   */\n  emptyReadOnlyMarker?: string;\n  /**\n   * Determines what gets highlighted on focus of the input.\n   *\n   * If `true` all text will be highlighted.\n   * If an array text between those indices will be highlighted\n   * e.g. [0,1] will highlight the first character.\n   */\n  highlightOnFocus?: boolean | number[];\n  /**\n   * The HTML element to render the Input, e.g. 'input', a custom React component.\n   */\n  inputComponent?: ElementType;\n  /**\n   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.\n   */\n  inputProps?: InputHTMLAttributes<HTMLInputElement>;\n  onBlur?: FocusEventHandler<HTMLInputElement>;\n  /**\n   * Callback for change event.\n   */\n  onChange?: (event: ChangeEvent<HTMLInputElement>, value: string) => void;\n  onFocus?: FocusEventHandler<HTMLInputElement>;\n  onKeyDown?: KeyboardEventHandler<HTMLInputElement>;\n  onKeyUp?: KeyboardEventHandler<HTMLInputElement>;\n  onMouseUp?: MouseEventHandler<HTMLInputElement>;\n  onMouseMove?: MouseEventHandler<HTMLInputElement>;\n  onMouseDown?: MouseEventHandler<HTMLInputElement>;\n  /**\n   * If `true`, the component is read only.\n   */\n  readOnly?: boolean;\n  /**\n   *\n   * Determines the alignment of the input text.\n   */\n  textAlign?: \"left\" | \"right\" | \"center\";\n  type?: HTMLInputElement[\"type\"];\n  /**\n   * The value of the `input` element, required for a controlled component.\n   */\n  value?: HTMLInputElement[\"value\"];\n  renderSuffix?: (state: {\n    disabled?: boolean;\n    error?: boolean;\n    focused?: boolean;\n    margin?: \"dense\" | \"none\" | \"normal\";\n    required?: boolean;\n    startAdornment?: ReactNode;\n  }) => ReactNode;\n  endAdornment?: ReactNode;\n  startAdornment?: ReactNode;\n}\n\nfunction mergeA11yProps(\n  a11yProps: Partial<ReturnType<typeof useFormFieldLegacyProps>[\"a11yProps\"]>,\n  inputProps: InputLegacyProps[\"inputProps\"],\n  misplacedAriaProps: AriaAttributes,\n) {\n  const ariaLabelledBy = clsx(\n    a11yProps?.[\"aria-labelledby\"],\n    inputProps?.[\"aria-labelledby\"],\n  );\n\n  return {\n    ...misplacedAriaProps,\n    ...a11yProps,\n    ...inputProps,\n    // The weird filtering is due to TokenizedInputBase\n    \"aria-labelledby\": ariaLabelledBy\n      ? Array.from(new Set(ariaLabelledBy.split(\" \"))).join(\" \")\n      : null,\n  };\n}\n\nexport const InputLegacy = forwardRef<HTMLInputElement, InputLegacyProps>(\n  function Input(\n    {\n      \"aria-activedescendant\": ariaActiveDescendant,\n      \"aria-expanded\": ariaExpanded,\n      \"aria-owns\": ariaOwns,\n      className: classNameProp,\n      cursorPositionOnFocus,\n      disabled,\n      emptyReadOnlyMarker = \"—\",\n      endAdornment,\n      highlightOnFocus,\n      id,\n      inputComponent: InputComponent = \"input\",\n      inputProps: inputPropsProp,\n      role,\n      style,\n      value: valueProp,\n      // If we leave both value and defaultValue undefined, we will get a React warning on first edit\n      // (uncontrolled to controlled warning) from the React input\n      defaultValue: defaultValueProp = valueProp === undefined ? \"\" : undefined,\n      onBlur,\n      onChange,\n      onFocus,\n      onKeyDown,\n      onKeyUp,\n      onMouseUp,\n      onMouseMove,\n      onMouseDown,\n      readOnly: readOnlyProp,\n      renderSuffix,\n      startAdornment,\n      textAlign = \"left\",\n      type = \"text\",\n      ...other\n    },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-input-legacy\",\n      css: inputLegacyCss,\n      window: targetWindow,\n    });\n\n    const {\n      a11yProps: {\n        readOnly: a11yReadOnly,\n        disabled: a11yDisabled,\n        ...restA11y\n      } = {},\n      setFocused: setFormFieldFocused,\n      inFormField,\n    } = useFormFieldLegacyProps();\n\n    const [focused, setFocused] = useState(false);\n    const inputRef = useRef(null);\n    const handleRef = useForkRef(inputRef, ref);\n    const cursorOnFocusHelpers = useCursorOnFocus(inputRef, {\n      cursorPositionOnFocus,\n      highlightOnFocus,\n    });\n\n    const isDisabled = disabled || a11yDisabled;\n    const isReadOnly = readOnlyProp || a11yReadOnly;\n    const misplacedAriaProps = {\n      \"aria-activedescendant\": ariaActiveDescendant,\n      \"aria-expanded\": ariaExpanded,\n      \"aria-owns\": ariaOwns,\n      role,\n    };\n    const inputProps = mergeA11yProps(\n      restA11y,\n      inputPropsProp,\n      misplacedAriaProps,\n    );\n    const isEmptyReadOnly = isReadOnly && !defaultValueProp && !valueProp;\n    const defaultValue = isEmptyReadOnly\n      ? emptyReadOnlyMarker\n      : defaultValueProp;\n\n    const [value, setValue] = useControlled({\n      controlled: valueProp,\n      default: defaultValue,\n      name: \"Input\",\n      state: \"value\",\n    });\n\n    const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n      const value = event.target.value;\n      setValue(value);\n      onChange?.(event, value);\n    };\n\n    const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n      onFocus?.(event);\n      setFormFieldFocused?.(true);\n      setFocused(true);\n    };\n\n    const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\n      onBlur?.(event);\n      setFormFieldFocused?.(false);\n      setFocused(false);\n    };\n\n    const handleMouseMove = (event: MouseEvent<HTMLInputElement>) => {\n      cursorOnFocusHelpers.handleMouseMove(event);\n\n      onMouseMove?.(event);\n    };\n\n    const handleMouseUp = (event: MouseEvent<HTMLInputElement>) => {\n      cursorOnFocusHelpers.handleMouseUp();\n\n      onMouseUp?.(event);\n    };\n\n    const handleMouseDown = (event: MouseEvent<HTMLInputElement>) => {\n      cursorOnFocusHelpers.handleMouseDown();\n\n      onMouseDown?.(event);\n    };\n\n    return (\n      <div\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(`${textAlign}TextAlign`)]: textAlign,\n            [withBaseName(\"formField\")]: inFormField,\n            [withBaseName(\"focused\")]: focused && !inFormField,\n            [withBaseName(\"disabled\")]: isDisabled,\n            [withBaseName(\"inputAdornedStart\")]: startAdornment,\n            [withBaseName(\"inputAdornedEnd\")]: endAdornment,\n          },\n          classNameProp,\n        )}\n        style={style}\n        {...other}\n      >\n        {startAdornment && (\n          <div className={withBaseName(\"prefixContainer\")}>\n            {startAdornment}\n          </div>\n        )}\n        <InputComponent\n          type={type}\n          id={id}\n          {...inputProps}\n          className={clsx(withBaseName(\"input\"), inputProps?.className)}\n          disabled={isDisabled}\n          ref={handleRef}\n          value={value}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onKeyDown={onKeyDown}\n          onKeyUp={onKeyUp}\n          onFocus={handleFocus}\n          onMouseDown={handleMouseDown}\n          onMouseUp={handleMouseUp}\n          onMouseMove={handleMouseMove}\n          readOnly={isReadOnly}\n        />\n        {endAdornment && (\n          <div className={withBaseName(\"suffixContainer\")}>{endAdornment}</div>\n        )}\n        {/* TODO: Confirm implementation of suffix */}\n        {renderSuffix?.({ disabled, focused })}\n      </div>\n    );\n  },\n);\n"],"names":["inputLegacyCss","value"],"mappings":"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"}

package/dist-es/input-legacy/useCursorOnFocus.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCursorOnFocus.js","sources":["../src/input-legacy/useCursorOnFocus.ts"],"sourcesContent":["import { ownerDocument } from \"@salt-ds/core\";\nimport {\n  type MouseEvent,\n  type MutableRefObject,\n  useEffect,\n  useRef,\n} from \"react\";\n\nfunction getSelectionRange(\n  input: HTMLInputElement,\n  { highlightOnFocus, cursorPositionOnFocus }: useCursorOnFocusProps,\n): [number | null, number | null] {\n  // highlightOnFocus highlight first so it takes priority over position on focus\n  if (highlightOnFocus === true) {\n    return [0, input.value.length];\n  }\n  if (Array.isArray(highlightOnFocus) && highlightOnFocus.length > 1) {\n    return [highlightOnFocus[0], highlightOnFocus[1]];\n  }\n\n  if (cursorPositionOnFocus === \"start\") {\n    return [0, 0];\n  }\n\n  if (cursorPositionOnFocus === \"end\") {\n    return [input.value.length, input.value.length];\n  }\n\n  if (cursorPositionOnFocus != null && !Number.isNaN(cursorPositionOnFocus)) {\n    return [cursorPositionOnFocus, cursorPositionOnFocus];\n  }\n  return [null, null];\n}\n\nfunction isSafari() {\n  return (\n    navigator.userAgent.toLowerCase().includes(\"safari\") &&\n    !navigator.userAgent.toLowerCase().includes(\"chrome\")\n  );\n}\n\nfunction isFirefox() {\n  return navigator.userAgent.toLowerCase().includes(\"firefox\");\n}\n\nexport interface useCursorOnFocusProps {\n  /**\n   * Determines the position of the text cursor on focus of the input.\n   *\n   * start = place cursor at the beginning\n   * end = place cursor at the end\n   * \\# = index to place the cursor\n   */\n  cursorPositionOnFocus?: \"start\" | \"end\" | number;\n  /**\n   * Determines what gets highlighted on focus of the input.\n   *\n   * If `true` all text will be highlighted.\n   * If an array text between those indices will be highlighted\n   * e.g. [0,1] will highlight the first character.\n   */\n  highlightOnFocus?: boolean | number[];\n}\n\nexport function useCursorOnFocus(\n  inputRef: MutableRefObject<HTMLInputElement | null>,\n  { cursorPositionOnFocus, highlightOnFocus }: useCursorOnFocusProps,\n) {\n  const wasClick = useRef(false);\n  const timeoutRef = useRef<number>(-1);\n  const originalCursorPosition = useRef<number | null | undefined>(-1);\n  const selectionInProgress = useRef(false);\n  const mouseMovement = useRef(0);\n\n  const selection = useRef<[number | null, number | null]>([null, null]);\n  const wasWindowFocus = useRef(false);\n\n  const handleMouseDown = () => {\n    wasClick.current = true;\n  };\n\n  const handleMouseMove = (event: MouseEvent) => {\n    if (selectionInProgress.current) {\n      mouseMovement.current +=\n        Math.abs(event.movementX) + Math.abs(event.movementY);\n\n      //Prevents the slightest mouse movement triggering the cursor to be repositioned.\n      if (mouseMovement.current < 3) {\n        event.preventDefault();\n\n        return;\n      }\n\n      if (typeof originalCursorPosition.current === \"number\") {\n        // Allows continued highlighted if the mouse down is part of a selection.\n        inputRef.current?.setSelectionRange(\n          originalCursorPosition.current,\n          originalCursorPosition.current,\n        );\n      }\n\n      //Reset so originalCursorPosition is only set once.\n      selectionInProgress.current = false;\n    }\n  };\n\n  const handleMouseUp = () => {\n    const isValidBrowser = isFirefox() || isSafari();\n    if (\n      selectionInProgress.current &&\n      mouseMovement.current < 3 &&\n      isValidBrowser &&\n      Array.isArray(selection.current)\n    ) {\n      const [start, end] = selection.current;\n      setTimeout(() => {\n        if (\n          (inputRef.current?.selectionStart !== start ||\n            inputRef.current?.selectionEnd !== end) &&\n          typeof start === \"number\" &&\n          typeof end === \"number\"\n        ) {\n          inputRef.current?.setSelectionRange(start, end);\n        }\n      }, 0);\n    }\n\n    wasClick.current = false;\n    selectionInProgress.current = false;\n    mouseMovement.current = 0;\n  };\n\n  useEffect(() => {\n    if (cursorPositionOnFocus != null || highlightOnFocus != null) {\n      const handleFocusBehaviour = () => {\n        if (!inputRef.current) {\n          return;\n        }\n\n        const [start, end] = getSelectionRange(inputRef.current, {\n          highlightOnFocus,\n          cursorPositionOnFocus,\n        });\n        if (start !== null && end !== null) {\n          window.clearTimeout(timeoutRef.current);\n          const needsTimeout = isSafari() || wasClick.current;\n\n          if (wasClick.current) {\n            selectionInProgress.current = true;\n            mouseMovement.current = 0;\n          }\n\n          selection.current = [start, end];\n          // Keyboard focus needs to be outside setTimeout otherwise a flash of selected text appears.\n          if (needsTimeout) {\n            // Make's sure setSelectionRange is run after browser has set cursor position.\n            timeoutRef.current = window.setTimeout(() => {\n              if (wasClick.current) {\n                originalCursorPosition.current =\n                  inputRef.current?.selectionStart;\n              }\n              inputRef.current?.setSelectionRange(start, end);\n            }, 0);\n          } else {\n            inputRef.current?.setSelectionRange(start, end);\n          }\n        }\n      };\n\n      const handleFocusIn = () => {\n        // Ignore focus of input on window focus\n        if (wasWindowFocus.current) {\n          wasWindowFocus.current = false;\n          return;\n        }\n\n        if (cursorPositionOnFocus != null || highlightOnFocus != null) {\n          handleFocusBehaviour();\n        }\n      };\n\n      //Reset everything on window re-focus\n      const handleWindowFocus = () => {\n        const doc = ownerDocument(inputRef.current);\n        if (\n          doc.visibilityState === \"visible\" &&\n          doc.activeElement === inputRef.current\n        ) {\n          wasClick.current = false;\n          selectionInProgress.current = false;\n          mouseMovement.current = 0;\n          wasWindowFocus.current = true;\n        }\n      };\n\n      const eventName = isSafari() || isFirefox() ? \"focusIn\" : \"focus\";\n      const input = inputRef.current;\n      const doc = ownerDocument(inputRef.current);\n      input?.addEventListener(eventName, handleFocusIn);\n      doc.addEventListener(\"visibilitychange\", handleWindowFocus);\n\n      return () => {\n        input?.removeEventListener(eventName, handleFocusIn);\n        doc?.removeEventListener(\"visibilitychange\", handleWindowFocus);\n      };\n    }\n\n    return undefined;\n  }, [cursorPositionOnFocus, highlightOnFocus, inputRef]);\n\n  return { handleMouseDown, handleMouseMove, handleMouseUp };\n}\n"],"names":["_a","doc"],"mappings":"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"}
+{"version":3,"file":"useCursorOnFocus.js","sources":["../src/input-legacy/useCursorOnFocus.ts"],"sourcesContent":["import { ownerDocument } from \"@salt-ds/core\";\nimport {\n  type MouseEvent,\n  type MutableRefObject,\n  useEffect,\n  useRef,\n} from \"react\";\n\nfunction getSelectionRange(\n  input: HTMLInputElement,\n  { highlightOnFocus, cursorPositionOnFocus }: useCursorOnFocusProps,\n): [number | null, number | null] {\n  // highlightOnFocus highlight first so it takes priority over position on focus\n  if (highlightOnFocus === true) {\n    return [0, input.value.length];\n  }\n  if (Array.isArray(highlightOnFocus) && highlightOnFocus.length > 1) {\n    return [highlightOnFocus[0], highlightOnFocus[1]];\n  }\n\n  if (cursorPositionOnFocus === \"start\") {\n    return [0, 0];\n  }\n\n  if (cursorPositionOnFocus === \"end\") {\n    return [input.value.length, input.value.length];\n  }\n\n  if (cursorPositionOnFocus != null && !Number.isNaN(cursorPositionOnFocus)) {\n    return [cursorPositionOnFocus, cursorPositionOnFocus];\n  }\n  return [null, null];\n}\n\nfunction isSafari() {\n  return (\n    navigator.userAgent.toLowerCase().includes(\"safari\") &&\n    !navigator.userAgent.toLowerCase().includes(\"chrome\")\n  );\n}\n\nfunction isFirefox() {\n  return navigator.userAgent.toLowerCase().includes(\"firefox\");\n}\n\nexport interface useCursorOnFocusProps {\n  /**\n   * Determines the position of the text cursor on focus of the input.\n   *\n   * start = place cursor at the beginning\n   * end = place cursor at the end\n   * \\# = index to place the cursor\n   */\n  cursorPositionOnFocus?: \"start\" | \"end\" | number;\n  /**\n   * Determines what gets highlighted on focus of the input.\n   *\n   * If `true` all text will be highlighted.\n   * If an array text between those indices will be highlighted\n   * e.g. [0,1] will highlight the first character.\n   */\n  highlightOnFocus?: boolean | number[];\n}\n\nexport function useCursorOnFocus(\n  inputRef: MutableRefObject<HTMLInputElement | null>,\n  { cursorPositionOnFocus, highlightOnFocus }: useCursorOnFocusProps,\n) {\n  const wasClick = useRef(false);\n  const timeoutRef = useRef<number>(-1);\n  const originalCursorPosition = useRef<number | null | undefined>(-1);\n  const selectionInProgress = useRef(false);\n  const mouseMovement = useRef(0);\n\n  const selection = useRef<[number | null, number | null]>([null, null]);\n  const wasWindowFocus = useRef(false);\n\n  const handleMouseDown = () => {\n    wasClick.current = true;\n  };\n\n  const handleMouseMove = (event: MouseEvent) => {\n    if (selectionInProgress.current) {\n      mouseMovement.current +=\n        Math.abs(event.movementX) + Math.abs(event.movementY);\n\n      //Prevents the slightest mouse movement triggering the cursor to be repositioned.\n      if (mouseMovement.current < 3) {\n        event.preventDefault();\n\n        return;\n      }\n\n      if (typeof originalCursorPosition.current === \"number\") {\n        // Allows continued highlighted if the mouse down is part of a selection.\n        inputRef.current?.setSelectionRange(\n          originalCursorPosition.current,\n          originalCursorPosition.current,\n        );\n      }\n\n      //Reset so originalCursorPosition is only set once.\n      selectionInProgress.current = false;\n    }\n  };\n\n  const handleMouseUp = () => {\n    const isValidBrowser = isFirefox() || isSafari();\n    if (\n      selectionInProgress.current &&\n      mouseMovement.current < 3 &&\n      isValidBrowser &&\n      Array.isArray(selection.current)\n    ) {\n      const [start, end] = selection.current;\n      setTimeout(() => {\n        if (\n          (inputRef.current?.selectionStart !== start ||\n            inputRef.current?.selectionEnd !== end) &&\n          typeof start === \"number\" &&\n          typeof end === \"number\"\n        ) {\n          inputRef.current?.setSelectionRange(start, end);\n        }\n      }, 0);\n    }\n\n    wasClick.current = false;\n    selectionInProgress.current = false;\n    mouseMovement.current = 0;\n  };\n\n  useEffect(() => {\n    if (cursorPositionOnFocus != null || highlightOnFocus != null) {\n      const handleFocusBehaviour = () => {\n        if (!inputRef.current) {\n          return;\n        }\n\n        const [start, end] = getSelectionRange(inputRef.current, {\n          highlightOnFocus,\n          cursorPositionOnFocus,\n        });\n        if (start !== null && end !== null) {\n          window.clearTimeout(timeoutRef.current);\n          const needsTimeout = isSafari() || wasClick.current;\n\n          if (wasClick.current) {\n            selectionInProgress.current = true;\n            mouseMovement.current = 0;\n          }\n\n          selection.current = [start, end];\n          // Keyboard focus needs to be outside setTimeout otherwise a flash of selected text appears.\n          if (needsTimeout) {\n            // Make's sure setSelectionRange is run after browser has set cursor position.\n            timeoutRef.current = window.setTimeout(() => {\n              if (wasClick.current) {\n                originalCursorPosition.current =\n                  inputRef.current?.selectionStart;\n              }\n              inputRef.current?.setSelectionRange(start, end);\n            }, 0);\n          } else {\n            inputRef.current?.setSelectionRange(start, end);\n          }\n        }\n      };\n\n      const handleFocusIn = () => {\n        // Ignore focus of input on window focus\n        if (wasWindowFocus.current) {\n          wasWindowFocus.current = false;\n          return;\n        }\n\n        if (cursorPositionOnFocus != null || highlightOnFocus != null) {\n          handleFocusBehaviour();\n        }\n      };\n\n      //Reset everything on window re-focus\n      const handleWindowFocus = () => {\n        const doc = ownerDocument(inputRef.current);\n        if (\n          doc.visibilityState === \"visible\" &&\n          doc.activeElement === inputRef.current\n        ) {\n          wasClick.current = false;\n          selectionInProgress.current = false;\n          mouseMovement.current = 0;\n          wasWindowFocus.current = true;\n        }\n      };\n\n      const eventName = isSafari() || isFirefox() ? \"focusIn\" : \"focus\";\n      const input = inputRef.current;\n      const doc = ownerDocument(inputRef.current);\n      input?.addEventListener(eventName, handleFocusIn);\n      doc.addEventListener(\"visibilitychange\", handleWindowFocus);\n\n      return () => {\n        input?.removeEventListener(eventName, handleFocusIn);\n        doc?.removeEventListener(\"visibilitychange\", handleWindowFocus);\n      };\n    }\n\n    return undefined;\n  }, [cursorPositionOnFocus, highlightOnFocus, inputRef]);\n\n  return { handleMouseDown, handleMouseMove, handleMouseUp };\n}\n"],"names":["_a","doc"],"mappings":"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"}

package/dist-es/list/Highlighter.js.map

@@ -1 +1 @@
-{"version":3,"file":"Highlighter.js","sources":["../src/list/Highlighter.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport type { ReactElement } from \"react\";\nimport { escapeRegExp } from \"../utils\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport highligherCss from \"./Highlighter.css\";\n\nconst withBaseName = makePrefixer(\"saltHighlighter\");\n\nexport interface HighlighterProps {\n  matchPattern?: RegExp | string;\n  text?: string;\n}\n\nexport const Highlighter = (\n  props: HighlighterProps,\n): ReactElement<HighlighterProps> => {\n  const { matchPattern, text = \"\" } = props;\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-hightligher\",\n    css: highligherCss,\n    window: targetWindow,\n  });\n  const matchRegex =\n    typeof matchPattern === \"string\"\n      ? new RegExp(`(${escapeRegExp(matchPattern)})`, \"gi\")\n      : matchPattern;\n\n  if (matchRegex === undefined || matchPattern === \"\") {\n    return <>{text}</>;\n  }\n  return (\n    <span>\n      {text.split(matchRegex).map((part, index) =>\n        part.match(matchRegex) ? (\n          <strong\n            className={withBaseName(\"highlight\")}\n            key={`${index}-${part}`}\n          >\n            {part}\n          </strong>\n        ) : (\n          part\n        ),\n      )}\n    </span>\n  );\n};\n"],"names":["highligherCss"],"mappings":";;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,iBAAiB,CAAA;AAOtC,MAAA,WAAA,GAAc,CACzB,KACmC,KAAA;AACnC,EAAA,MAAM,EAAE,YAAA,EAAc,IAAO,GAAA,EAAA,EAAO,GAAA,KAAA;AACpC,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,kBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AACD,EAAA,MAAM,UACJ,GAAA,OAAO,YAAiB,KAAA,QAAA,GACpB,IAAI,MAAA,CAAO,CAAI,CAAA,EAAA,YAAA,CAAa,YAAY,CAAC,CAAK,CAAA,CAAA,EAAA,IAAI,CAClD,GAAA,YAAA;AAEN,EAAI,IAAA,UAAA,KAAe,KAAa,CAAA,IAAA,YAAA,KAAiB,EAAI,EAAA;AACnD,IAAA,uCAAU,QAAK,EAAA,IAAA,EAAA,CAAA;AAAA;AAEjB,EAAA,uBACG,GAAA,CAAA,MAAA,EAAA,EACE,QAAK,EAAA,IAAA,CAAA,KAAA,CAAM,UAAU,CAAE,CAAA,GAAA;AAAA,IAAI,CAAC,IAAM,EAAA,KAAA,KACjC,IAAK,CAAA,KAAA,CAAM,UAAU,CACnB,mBAAA,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,QAGlC,QAAA,EAAA;AAAA,OAAA;AAAA,MAFI,CAAA,EAAG,KAAK,CAAA,CAAA,EAAI,IAAI,CAAA;AAAA,KAKvB,GAAA;AAAA,GAGN,EAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"Highlighter.js","sources":["../src/list/Highlighter.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport type { ReactElement } from \"react\";\nimport { escapeRegExp } from \"../utils\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport highligherCss from \"./Highlighter.css\";\n\nconst withBaseName = makePrefixer(\"saltHighlighter\");\n\nexport interface HighlighterProps {\n  matchPattern?: RegExp | string;\n  text?: string;\n}\n\nexport const Highlighter = (\n  props: HighlighterProps,\n): ReactElement<HighlighterProps> => {\n  const { matchPattern, text = \"\" } = props;\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-hightligher\",\n    css: highligherCss,\n    window: targetWindow,\n  });\n  const matchRegex =\n    typeof matchPattern === \"string\"\n      ? new RegExp(`(${escapeRegExp(matchPattern)})`, \"gi\")\n      : matchPattern;\n\n  if (matchRegex === undefined || matchPattern === \"\") {\n    return <>{text}</>;\n  }\n  return (\n    <span>\n      {text.split(matchRegex).map((part, index) =>\n        part.match(matchRegex) ? (\n          <strong\n            className={withBaseName(\"highlight\")}\n            key={`${index}-${part}`}\n          >\n            {part}\n          </strong>\n        ) : (\n          part\n        ),\n      )}\n    </span>\n  );\n};\n"],"names":["highligherCss"],"mappings":";;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,iBAAiB,CAAA;AAOtC,MAAA,WAAA,GAAc,CACzB,KACmC,KAAA;AACnC,EAAA,MAAM,EAAE,YAAA,EAAc,IAAO,GAAA,EAAA,EAAO,GAAA,KAAA;AACpC,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,kBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AACD,EAAA,MAAM,UACJ,GAAA,OAAO,YAAiB,KAAA,QAAA,GACpB,IAAI,MAAA,CAAO,CAAI,CAAA,EAAA,YAAA,CAAa,YAAY,CAAC,CAAK,CAAA,CAAA,EAAA,IAAI,CAClD,GAAA,YAAA;AAEN,EAAI,IAAA,UAAA,KAAe,MAAa,IAAA,YAAA,KAAiB,EAAI,EAAA;AACnD,IAAA,uCAAU,QAAK,EAAA,IAAA,EAAA,CAAA;AAAA;AAEjB,EAAA,uBACG,GAAA,CAAA,MAAA,EAAA,EACE,QAAK,EAAA,IAAA,CAAA,KAAA,CAAM,UAAU,CAAE,CAAA,GAAA;AAAA,IAAI,CAAC,IAAM,EAAA,KAAA,KACjC,IAAK,CAAA,KAAA,CAAM,UAAU,CACnB,mBAAA,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,QAGlC,QAAA,EAAA;AAAA,OAAA;AAAA,MAFI,CAAA,EAAG,KAAK,CAAA,CAAA,EAAI,IAAI,CAAA;AAAA,KAKvB,GAAA;AAAA,GAGN,EAAA,CAAA;AAEJ;;;;"}

package/dist-es/list/List.js.map

@@ -1 +1 @@
-{"version":3,"file":"List.js","sources":["../src/list/List.tsx"],"sourcesContent":["import { makePrefixer, useForkRef, useIdMemo } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n  type ForwardedRef,\n  type ReactElement,\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  useRef,\n} from \"react\";\nimport {\n  type CollectionIndexer,\n  type CollectionItem,\n  LIST_FOCUS_VISIBLE,\n  type ScrollingAPI,\n  type SelectionStrategy,\n  itemToString as defaultItemToString,\n  isSelected,\n  useCollectionItems,\n  useImperativeScrollingAPI,\n} from \"../common-hooks\";\n\nimport { ListItem as DefaultListItem, ListItemProxy } from \"./ListItem\";\nimport type { ListItemProps, ListProps } from \"./listTypes\";\nimport { useList } from \"./useList\";\nimport { useListHeight } from \"./useListHeight\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport listCss from \"./List.css\";\n\nconst defaultEmptyMessage = \"No data to display\";\n\nconst withBaseName = makePrefixer(\"saltList\");\n\nexport const List = forwardRef(function List<\n  Item,\n  Selection extends SelectionStrategy = \"default\",\n>(\n  {\n    ListItem = DefaultListItem,\n    ListPlaceholder,\n    borderless,\n    children,\n    className,\n    collapsibleHeaders = false,\n    defaultHighlightedIndex,\n    defaultSelected,\n    disabled: listDisabled = false,\n    disableFocus = false,\n    disableTypeToSelect,\n    displayedItemCount = 10,\n    emptyMessage,\n    focusVisible: focusVisibleProp,\n    getItemHeight: getItemHeightProp,\n    getItemId,\n    height,\n    highlightedIndex: highlightedIndexProp,\n    id: idProp,\n    itemGapSize = 0,\n    itemHeight: itemHeightProp,\n    itemTextHighlightPattern,\n    itemToString = defaultItemToString,\n    listHandlers: listHandlersProp,\n    maxHeight,\n    maxWidth,\n    minHeight,\n    minWidth,\n    onSelect,\n    onSelectionChange,\n    onHighlight,\n    restoreLastFocus,\n    selected: selectedProp,\n    selectionStrategy,\n    checkable = selectionStrategy === \"multiple\",\n    scrollingApiRef,\n    // TODO do we still need these ?\n    selectionKeys,\n    showEmptyMessage = false,\n    source,\n    style: styleProp,\n    stickyHeaders,\n    tabToSelect,\n    width,\n    ...htmlAttributes\n  }: ListProps<Item, Selection>,\n  forwardedRef?: ForwardedRef<HTMLDivElement>,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-list\",\n    css: listCss,\n    window: targetWindow,\n  });\n\n  const id = useIdMemo(idProp);\n  const rootRef = useRef<HTMLDivElement>(null);\n  const contentRef = useRef<HTMLDivElement>(null);\n  const rowHeightProxyRef = useRef<HTMLDivElement>(null);\n\n  const collectionHook = useCollectionItems<Item>({\n    id,\n    label: \"List\",\n    source,\n    children,\n    options: {\n      collapsibleHeaders,\n      // Add Group ChildTypes to options\n      getItemId,\n      itemToString,\n    },\n  });\n\n  const { preferredHeight } = useListHeight({\n    borderless,\n    displayedItemCount,\n    getItemHeight: getItemHeightProp,\n    height,\n    itemCount: collectionHook.data.length,\n    itemGapSize,\n    itemHeight: itemHeightProp,\n    rowHeightRef: rowHeightProxyRef,\n  });\n\n  const {\n    focusVisible,\n    highlightedIndex,\n    listControlProps,\n    listHandlers,\n    listItemHeaderHandlers,\n    scrollIntoView,\n    selected,\n  } = useList<Item, Selection>({\n    collapsibleHeaders,\n    collectionHook,\n    containerRef: rootRef,\n    contentRef,\n    defaultHighlightedIndex,\n    defaultSelected: collectionHook.itemToCollectionItem<\n      Selection,\n      typeof defaultSelected\n    >(defaultSelected),\n    disabled: listDisabled,\n    disableTypeToSelect,\n    highlightedIndex: highlightedIndexProp,\n    label: id,\n    listHandlers: listHandlersProp, // should this be in context ?\n    onSelect,\n    onSelectionChange,\n    onHighlight,\n    restoreLastFocus,\n    selected: collectionHook.itemToCollectionItem<\n      Selection,\n      typeof defaultSelected\n    >(selectedProp),\n    selectionStrategy,\n    selectionKeys,\n    stickyHeaders,\n    tabToSelect,\n  });\n\n  useImperativeScrollingAPI({\n    collectionHook,\n    forwardedRef: scrollingApiRef,\n    scrollableRef: rootRef,\n    scrollIntoView,\n  });\n\n  // focusVisible passes as a prop takes precedence\n  const appliedFocusVisible = focusVisibleProp ?? focusVisible;\n\n  const createHeader: (\n    idx: { value: number },\n    headerId: string,\n    title: string,\n    expanded?: boolean,\n  ) => ReactElement = function createHeader(idx, headerId, title, expanded) {\n    const header = (\n      <ListItem\n        {...listItemHeaderHandlers}\n        className={clsx(\"saltListItemHeader\", {\n          focusVisible: collapsibleHeaders && appliedFocusVisible === idx.value,\n        })}\n        aria-expanded={expanded}\n        data-idx={collapsibleHeaders ? idx.value : undefined}\n        data-highlighted={idx.value === highlightedIndex || undefined}\n        data-sticky={stickyHeaders}\n        data-selectable={false}\n        id={headerId}\n        key={`header-${idx.value}`}\n        label={title}\n        // role=\"presentation\"\n      />\n    );\n    idx.value += 1;\n    return header;\n  };\n\n  const getItemHeight =\n    getItemHeightProp === undefined ? () => itemHeightProp : getItemHeightProp;\n\n  function renderCollectionItem(\n    list: ReactElement[],\n    item: CollectionItem<Item>,\n    idx: { value: number },\n  ) {\n    // Note, a number of these props are specific to ListItem. What if user\n    // implements a custom ListItem but neglects to handle all these props.\n    // Is that on them ?\n    const { disabled, value, id: itemId, label } = item;\n    const isChildItem = isValidElement(value);\n    const listItemProps: ListItemProps<Item> & {\n      key: string;\n      \"data-idx\": number;\n    } = {\n      className: clsx({\n        saltHighlighted: idx.value === highlightedIndex,\n        saltFocusVisible: appliedFocusVisible === idx.value,\n      }),\n      disabled: disabled || listDisabled,\n      id: itemId,\n      item: isChildItem ? undefined : (item?.value ?? undefined),\n      itemHeight: getItemHeight(idx.value),\n      itemTextHighlightPattern,\n      key: itemId,\n      \"data-idx\": idx.value,\n      label,\n      role: \"option\",\n      selected: isSelected<Item>(selected, item),\n      showCheckbox: checkable,\n    };\n    list.push(\n      isChildItem ? (\n        cloneElement(value, listItemProps)\n      ) : (\n        <ListItem {...listItemProps} />\n      ),\n    );\n\n    idx.value += 1;\n  }\n\n  const addGroup: (\n    list: ReactElement[],\n    items: CollectionItem<Item>[],\n    idx: { value: number },\n  ) => void = function addGroup(\n    list: ReactElement[],\n    items: CollectionItem<Item>[],\n    idx: { value: number },\n  ) {\n    const { count = 0, id, expanded, label = \"\" } = items[idx.value];\n    const header = createHeader(idx, id, label, expanded);\n    const childItems: ReactElement | ReactElement[] =\n      expanded !== false\n        ? [header].concat(\n            renderCollectionItems(items, idx, idx.value + count) || [],\n          )\n        : header;\n\n    list.push(\n      <div key={id} role=\"group\">\n        {childItems}\n      </div>,\n    );\n  };\n\n  const renderCollectionItems = (\n    items: CollectionItem<Item>[],\n    idx: CollectionIndexer = { value: 0 },\n    end = items.length,\n  ): ReactElement[] | undefined => {\n    const listItems: ReactElement[] = [];\n    while (idx.value < end) {\n      const item = items[idx.value];\n      if (item.header && item.label != null) {\n        listItems.push(\n          createHeader(idx, item.id, item.label, item.expanded === false),\n        );\n      } else if (item.childNodes) {\n        addGroup(listItems, items, idx);\n      } else {\n        renderCollectionItem(listItems, item, idx);\n      }\n    }\n    return listItems;\n  };\n\n  function renderEmpty() {\n    if (emptyMessage || showEmptyMessage) {\n      return (\n        <span className={withBaseName(\"empty-message\")}>\n          {emptyMessage ?? defaultEmptyMessage}\n        </span>\n      );\n    }\n    return null;\n  }\n\n  const renderContent = () => {\n    if (collectionHook.data.length) {\n      return renderCollectionItems(collectionHook.data);\n    }\n    renderEmpty();\n  };\n\n  const contentHeight = \"auto\";\n  const sizeStyles = {\n    \"--list-item-gap\": itemGapSize ? `${itemGapSize}px` : undefined,\n    minWidth,\n    minHeight,\n    width: width ?? \"100%\",\n    height: height ?? \"100%\",\n    maxWidth: maxWidth ?? width,\n    maxHeight: maxHeight ?? preferredHeight,\n  };\n  return (\n    <div\n      aria-multiselectable={\n        selectionStrategy === \"multiple\" ||\n        selectionStrategy === \"extended\" ||\n        selectionStrategy === \"extended-multi-range\" ||\n        undefined\n      }\n      {...htmlAttributes}\n      {...listHandlers}\n      {...listControlProps}\n      className={clsx(withBaseName(), className, {\n        // TODO low-emphasis\n        [withBaseName(\"borderless\")]: borderless,\n        saltDisabled: listDisabled,\n        [withBaseName(\"collapsible\")]: collapsibleHeaders,\n        saltFocusVisible: highlightedIndex === LIST_FOCUS_VISIBLE,\n      })}\n      id={`${id}`}\n      ref={useForkRef<HTMLDivElement>(rootRef, forwardedRef)}\n      role=\"listbox\"\n      style={{ ...styleProp, ...sizeStyles }}\n      tabIndex={listDisabled || disableFocus ? undefined : 0}\n    >\n      <ListItemProxy ref={rowHeightProxyRef} />\n      {collectionHook.data.length === 0 && ListPlaceholder !== undefined ? (\n        <>\n          <ListPlaceholder />\n        </>\n      ) : (\n        <div\n          className={withBaseName(\"scrollingContentContainer\")}\n          ref={contentRef}\n          style={{ height: contentHeight }}\n        >\n          {renderContent()}\n        </div>\n      )}\n    </div>\n  );\n}) as <Item = string, Selection extends SelectionStrategy = \"default\">(\n  props: ListProps<Item, Selection> & {\n    ref?: ForwardedRef<ScrollingAPI<Item>>;\n  },\n) => ReactElement<ListProps<Item, Selection>>;\n"],"names":["List","ListItem","DefaultListItem","itemToString","defaultItemToString","listCss","createHeader","addGroup","id"],"mappings":"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"}
+{"version":3,"file":"List.js","sources":["../src/list/List.tsx"],"sourcesContent":["import { makePrefixer, useForkRef, useIdMemo } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n  type ForwardedRef,\n  type ReactElement,\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  useRef,\n} from \"react\";\nimport {\n  type CollectionIndexer,\n  type CollectionItem,\n  LIST_FOCUS_VISIBLE,\n  type ScrollingAPI,\n  type SelectionStrategy,\n  itemToString as defaultItemToString,\n  isSelected,\n  useCollectionItems,\n  useImperativeScrollingAPI,\n} from \"../common-hooks\";\n\nimport { ListItem as DefaultListItem, ListItemProxy } from \"./ListItem\";\nimport type { ListItemProps, ListProps } from \"./listTypes\";\nimport { useList } from \"./useList\";\nimport { useListHeight } from \"./useListHeight\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport listCss from \"./List.css\";\n\nconst defaultEmptyMessage = \"No data to display\";\n\nconst withBaseName = makePrefixer(\"saltList\");\n\nexport const List = forwardRef(function List<\n  Item,\n  Selection extends SelectionStrategy = \"default\",\n>(\n  {\n    ListItem = DefaultListItem,\n    ListPlaceholder,\n    borderless,\n    children,\n    className,\n    collapsibleHeaders = false,\n    defaultHighlightedIndex,\n    defaultSelected,\n    disabled: listDisabled = false,\n    disableFocus = false,\n    disableTypeToSelect,\n    displayedItemCount = 10,\n    emptyMessage,\n    focusVisible: focusVisibleProp,\n    getItemHeight: getItemHeightProp,\n    getItemId,\n    height,\n    highlightedIndex: highlightedIndexProp,\n    id: idProp,\n    itemGapSize = 0,\n    itemHeight: itemHeightProp,\n    itemTextHighlightPattern,\n    itemToString = defaultItemToString,\n    listHandlers: listHandlersProp,\n    maxHeight,\n    maxWidth,\n    minHeight,\n    minWidth,\n    onSelect,\n    onSelectionChange,\n    onHighlight,\n    restoreLastFocus,\n    selected: selectedProp,\n    selectionStrategy,\n    checkable = selectionStrategy === \"multiple\",\n    scrollingApiRef,\n    // TODO do we still need these ?\n    selectionKeys,\n    showEmptyMessage = false,\n    source,\n    style: styleProp,\n    stickyHeaders,\n    tabToSelect,\n    width,\n    ...htmlAttributes\n  }: ListProps<Item, Selection>,\n  forwardedRef?: ForwardedRef<HTMLDivElement>,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-list\",\n    css: listCss,\n    window: targetWindow,\n  });\n\n  const id = useIdMemo(idProp);\n  const rootRef = useRef<HTMLDivElement>(null);\n  const contentRef = useRef<HTMLDivElement>(null);\n  const rowHeightProxyRef = useRef<HTMLDivElement>(null);\n\n  const collectionHook = useCollectionItems<Item>({\n    id,\n    label: \"List\",\n    source,\n    children,\n    options: {\n      collapsibleHeaders,\n      // Add Group ChildTypes to options\n      getItemId,\n      itemToString,\n    },\n  });\n\n  const { preferredHeight } = useListHeight({\n    borderless,\n    displayedItemCount,\n    getItemHeight: getItemHeightProp,\n    height,\n    itemCount: collectionHook.data.length,\n    itemGapSize,\n    itemHeight: itemHeightProp,\n    rowHeightRef: rowHeightProxyRef,\n  });\n\n  const {\n    focusVisible,\n    highlightedIndex,\n    listControlProps,\n    listHandlers,\n    listItemHeaderHandlers,\n    scrollIntoView,\n    selected,\n  } = useList<Item, Selection>({\n    collapsibleHeaders,\n    collectionHook,\n    containerRef: rootRef,\n    contentRef,\n    defaultHighlightedIndex,\n    defaultSelected: collectionHook.itemToCollectionItem<\n      Selection,\n      typeof defaultSelected\n    >(defaultSelected),\n    disabled: listDisabled,\n    disableTypeToSelect,\n    highlightedIndex: highlightedIndexProp,\n    label: id,\n    listHandlers: listHandlersProp, // should this be in context ?\n    onSelect,\n    onSelectionChange,\n    onHighlight,\n    restoreLastFocus,\n    selected: collectionHook.itemToCollectionItem<\n      Selection,\n      typeof defaultSelected\n    >(selectedProp),\n    selectionStrategy,\n    selectionKeys,\n    stickyHeaders,\n    tabToSelect,\n  });\n\n  useImperativeScrollingAPI({\n    collectionHook,\n    forwardedRef: scrollingApiRef,\n    scrollableRef: rootRef,\n    scrollIntoView,\n  });\n\n  // focusVisible passes as a prop takes precedence\n  const appliedFocusVisible = focusVisibleProp ?? focusVisible;\n\n  const createHeader: (\n    idx: { value: number },\n    headerId: string,\n    title: string,\n    expanded?: boolean,\n  ) => ReactElement = function createHeader(idx, headerId, title, expanded) {\n    const header = (\n      <ListItem\n        {...listItemHeaderHandlers}\n        className={clsx(\"saltListItemHeader\", {\n          focusVisible: collapsibleHeaders && appliedFocusVisible === idx.value,\n        })}\n        aria-expanded={expanded}\n        data-idx={collapsibleHeaders ? idx.value : undefined}\n        data-highlighted={idx.value === highlightedIndex || undefined}\n        data-sticky={stickyHeaders}\n        data-selectable={false}\n        id={headerId}\n        key={`header-${idx.value}`}\n        label={title}\n        // role=\"presentation\"\n      />\n    );\n    idx.value += 1;\n    return header;\n  };\n\n  const getItemHeight =\n    getItemHeightProp === undefined ? () => itemHeightProp : getItemHeightProp;\n\n  function renderCollectionItem(\n    list: ReactElement[],\n    item: CollectionItem<Item>,\n    idx: { value: number },\n  ) {\n    // Note, a number of these props are specific to ListItem. What if user\n    // implements a custom ListItem but neglects to handle all these props.\n    // Is that on them ?\n    const { disabled, value, id: itemId, label } = item;\n    const isChildItem = isValidElement(value);\n    const listItemProps: ListItemProps<Item> & {\n      key: string;\n      \"data-idx\": number;\n    } = {\n      className: clsx({\n        saltHighlighted: idx.value === highlightedIndex,\n        saltFocusVisible: appliedFocusVisible === idx.value,\n      }),\n      disabled: disabled || listDisabled,\n      id: itemId,\n      item: isChildItem ? undefined : (item?.value ?? undefined),\n      itemHeight: getItemHeight(idx.value),\n      itemTextHighlightPattern,\n      key: itemId,\n      \"data-idx\": idx.value,\n      label,\n      role: \"option\",\n      selected: isSelected<Item>(selected, item),\n      showCheckbox: checkable,\n    };\n    list.push(\n      isChildItem ? (\n        cloneElement(value, listItemProps)\n      ) : (\n        <ListItem {...listItemProps} />\n      ),\n    );\n\n    idx.value += 1;\n  }\n\n  const addGroup: (\n    list: ReactElement[],\n    items: CollectionItem<Item>[],\n    idx: { value: number },\n  ) => void = function addGroup(\n    list: ReactElement[],\n    items: CollectionItem<Item>[],\n    idx: { value: number },\n  ) {\n    const { count = 0, id, expanded, label = \"\" } = items[idx.value];\n    const header = createHeader(idx, id, label, expanded);\n    const childItems: ReactElement | ReactElement[] =\n      expanded !== false\n        ? [header].concat(\n            renderCollectionItems(items, idx, idx.value + count) || [],\n          )\n        : header;\n\n    list.push(\n      <div key={id} role=\"group\">\n        {childItems}\n      </div>,\n    );\n  };\n\n  const renderCollectionItems = (\n    items: CollectionItem<Item>[],\n    idx: CollectionIndexer = { value: 0 },\n    end = items.length,\n  ): ReactElement[] | undefined => {\n    const listItems: ReactElement[] = [];\n    while (idx.value < end) {\n      const item = items[idx.value];\n      if (item.header && item.label != null) {\n        listItems.push(\n          createHeader(idx, item.id, item.label, item.expanded === false),\n        );\n      } else if (item.childNodes) {\n        addGroup(listItems, items, idx);\n      } else {\n        renderCollectionItem(listItems, item, idx);\n      }\n    }\n    return listItems;\n  };\n\n  function renderEmpty() {\n    if (emptyMessage || showEmptyMessage) {\n      return (\n        <span className={withBaseName(\"empty-message\")}>\n          {emptyMessage ?? defaultEmptyMessage}\n        </span>\n      );\n    }\n    return null;\n  }\n\n  const renderContent = () => {\n    if (collectionHook.data.length) {\n      return renderCollectionItems(collectionHook.data);\n    }\n    renderEmpty();\n  };\n\n  const contentHeight = \"auto\";\n  const sizeStyles = {\n    \"--list-item-gap\": itemGapSize ? `${itemGapSize}px` : undefined,\n    minWidth,\n    minHeight,\n    width: width ?? \"100%\",\n    height: height ?? \"100%\",\n    maxWidth: maxWidth ?? width,\n    maxHeight: maxHeight ?? preferredHeight,\n  };\n  return (\n    <div\n      aria-multiselectable={\n        selectionStrategy === \"multiple\" ||\n        selectionStrategy === \"extended\" ||\n        selectionStrategy === \"extended-multi-range\" ||\n        undefined\n      }\n      {...htmlAttributes}\n      {...listHandlers}\n      {...listControlProps}\n      className={clsx(withBaseName(), className, {\n        // TODO low-emphasis\n        [withBaseName(\"borderless\")]: borderless,\n        saltDisabled: listDisabled,\n        [withBaseName(\"collapsible\")]: collapsibleHeaders,\n        saltFocusVisible: highlightedIndex === LIST_FOCUS_VISIBLE,\n      })}\n      id={`${id}`}\n      ref={useForkRef<HTMLDivElement>(rootRef, forwardedRef)}\n      role=\"listbox\"\n      style={{ ...styleProp, ...sizeStyles }}\n      tabIndex={listDisabled || disableFocus ? undefined : 0}\n    >\n      <ListItemProxy ref={rowHeightProxyRef} />\n      {collectionHook.data.length === 0 && ListPlaceholder !== undefined ? (\n        <>\n          <ListPlaceholder />\n        </>\n      ) : (\n        <div\n          className={withBaseName(\"scrollingContentContainer\")}\n          ref={contentRef}\n          style={{ height: contentHeight }}\n        >\n          {renderContent()}\n        </div>\n      )}\n    </div>\n  );\n}) as <Item = string, Selection extends SelectionStrategy = \"default\">(\n  props: ListProps<Item, Selection> & {\n    ref?: ForwardedRef<ScrollingAPI<Item>>;\n  },\n) => ReactElement<ListProps<Item, Selection>>;\n"],"names":["List","ListItem","DefaultListItem","itemToString","defaultItemToString","listCss","createHeader","addGroup","id"],"mappings":"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"}

package/dist-es/list/ListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.js","sources":["../src/list/ListItem.tsx"],"sourcesContent":["import { CheckboxIcon, makePrefixer } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { type ForwardedRef, type HTMLAttributes, forwardRef } from \"react\";\nimport { Highlighter } from \"./Highlighter\";\nimport type { ListItemProps, ListItemType } from \"./listTypes\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport listItemCss from \"./ListItem.css\";\n\nconst withBaseName = makePrefixer(\"saltListItem\");\n\n// A dummy ListItem rendered once and not visible. We measure this to\n// determine height of ListItem and monitor it for size changes (in\n// case of runtime density switch). This allows ListItem height to\n// be controlled purely through CSS.\nexport const ListItemProxy = forwardRef(function ListItemNextProxy(\n  props: HTMLAttributes<HTMLDivElement>,\n  forwardedRef: ForwardedRef<HTMLDivElement>,\n) {\n  return (\n    <div\n      aria-hidden\n      className={clsx(withBaseName(), withBaseName(\"proxy\"))}\n      ref={forwardedRef}\n    />\n  );\n});\n\n// Note: the memo is effective if List label is passed as simple string\n// If children are used, it is the responsibility of caller to memoise\n// these if performance on highlight is perceived to be an issue.\nexport const ListItem = forwardRef<HTMLDivElement, ListItemProps>(\n  function ListItem(\n    {\n      children,\n      className: classNameProp,\n      disabled,\n      tabIndex,\n      item,\n      itemHeight,\n      itemTextHighlightPattern,\n      label,\n      selectable: _notUsed,\n      selected,\n      showCheckbox,\n      style: styleProp,\n      ...props\n    },\n    forwardedRef,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-list-item\",\n      css: listItemCss,\n      window: targetWindow,\n    });\n\n    const className = clsx(withBaseName(), classNameProp, {\n      saltDisabled: disabled,\n      [withBaseName(\"checkbox\")]: showCheckbox,\n    });\n    const style =\n      itemHeight !== undefined\n        ? {\n            ...styleProp,\n            height: itemHeight,\n          }\n        : styleProp;\n\n    return (\n      <div\n        className={className}\n        {...props}\n        aria-disabled={disabled || undefined}\n        aria-selected={selected || undefined}\n        ref={forwardedRef}\n        style={style}\n      >\n        {showCheckbox && <CheckboxIcon aria-hidden checked={selected} />}\n        {children && typeof children !== \"string\" ? (\n          children\n        ) : itemTextHighlightPattern == null ? (\n          <span className={withBaseName(\"textWrapper\")}>\n            {label || children}\n          </span>\n        ) : (\n          <Highlighter\n            matchPattern={itemTextHighlightPattern}\n            text={label || (children as string)}\n          />\n        )}\n      </div>\n    );\n  },\n) as ListItemType;\n"],"names":["ListItem","listItemCss"],"mappings":";;;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA;AAMzC,MAAM,aAAgB,GAAA,UAAA,CAAW,SAAS,iBAAA,CAC/C,OACA,YACA,EAAA;AACA,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,aAAW,EAAA,IAAA;AAAA,MACX,WAAW,IAAK,CAAA,YAAA,EAAgB,EAAA,YAAA,CAAa,OAAO,CAAC,CAAA;AAAA,MACrD,GAAK,EAAA;AAAA;AAAA,GACP;AAEJ,CAAC;AAKM,MAAM,QAAW,GAAA,UAAA;AAAA,EACtB,SAASA,SACP,CAAA;AAAA,IACE,QAAA;AAAA,IACA,SAAW,EAAA,aAAA;AAAA,IACX,QAAA;AAAA,IACA,QAAA;AAAA,IACA,IAAA;AAAA,IACA,UAAA;AAAA,IACA,wBAAA;AAAA,IACA,KAAA;AAAA,IACA,UAAY,EAAA,QAAA;AAAA,IACZ,QAAA;AAAA,IACA,YAAA;AAAA,IACA,KAAO,EAAA,SAAA;AAAA,IACP,GAAG;AAAA,KAEL,YACA,EAAA;AACA,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAA,MAAM,SAAY,GAAA,IAAA,CAAK,YAAa,EAAA,EAAG,aAAe,EAAA;AAAA,MACpD,YAAc,EAAA,QAAA;AAAA,MACd,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG;AAAA,KAC7B,CAAA;AACD,IAAM,MAAA,KAAA,GACJ,eAAe,KACX,CAAA,GAAA;AAAA,MACE,GAAG,SAAA;AAAA,MACH,MAAQ,EAAA;AAAA,KAEV,GAAA,SAAA;AAEN,IACE,uBAAA,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA;AAAA,QACC,GAAG,KAAA;AAAA,QACJ,iBAAe,QAAY,IAAA,KAAA,CAAA;AAAA,QAC3B,iBAAe,QAAY,IAAA,KAAA,CAAA;AAAA,QAC3B,GAAK,EAAA,YAAA;AAAA,QACL,KAAA;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,YAAA,oBAAiB,GAAA,CAAA,YAAA,EAAA,EAAa,aAAW,EAAA,IAAA,EAAC,SAAS,QAAU,EAAA,CAAA;AAAA,UAC7D,QAAY,IAAA,OAAO,QAAa,KAAA,QAAA,GAC/B,WACE,wBAA4B,IAAA,IAAA,mBAC7B,GAAA,CAAA,MAAA,EAAA,EAAK,WAAW,YAAa,CAAA,aAAa,CACxC,EAAA,QAAA,EAAA,KAAA,IAAS,UACZ,CAEA,mBAAA,GAAA;AAAA,YAAC,WAAA;AAAA,YAAA;AAAA,cACC,YAAc,EAAA,wBAAA;AAAA,cACd,MAAM,KAAU,IAAA;AAAA;AAAA;AAClB;AAAA;AAAA,KAEJ;AAAA;AAGN;;;;"}
+{"version":3,"file":"ListItem.js","sources":["../src/list/ListItem.tsx"],"sourcesContent":["import { CheckboxIcon, makePrefixer } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { type ForwardedRef, type HTMLAttributes, forwardRef } from \"react\";\nimport { Highlighter } from \"./Highlighter\";\nimport type { ListItemProps, ListItemType } from \"./listTypes\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport listItemCss from \"./ListItem.css\";\n\nconst withBaseName = makePrefixer(\"saltListItem\");\n\n// A dummy ListItem rendered once and not visible. We measure this to\n// determine height of ListItem and monitor it for size changes (in\n// case of runtime density switch). This allows ListItem height to\n// be controlled purely through CSS.\nexport const ListItemProxy = forwardRef(function ListItemNextProxy(\n  props: HTMLAttributes<HTMLDivElement>,\n  forwardedRef: ForwardedRef<HTMLDivElement>,\n) {\n  return (\n    <div\n      aria-hidden\n      className={clsx(withBaseName(), withBaseName(\"proxy\"))}\n      ref={forwardedRef}\n    />\n  );\n});\n\n// Note: the memo is effective if List label is passed as simple string\n// If children are used, it is the responsibility of caller to memoise\n// these if performance on highlight is perceived to be an issue.\nexport const ListItem = forwardRef<HTMLDivElement, ListItemProps>(\n  function ListItem(\n    {\n      children,\n      className: classNameProp,\n      disabled,\n      tabIndex,\n      item,\n      itemHeight,\n      itemTextHighlightPattern,\n      label,\n      selectable: _notUsed,\n      selected,\n      showCheckbox,\n      style: styleProp,\n      ...props\n    },\n    forwardedRef,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-list-item\",\n      css: listItemCss,\n      window: targetWindow,\n    });\n\n    const className = clsx(withBaseName(), classNameProp, {\n      saltDisabled: disabled,\n      [withBaseName(\"checkbox\")]: showCheckbox,\n    });\n    const style =\n      itemHeight !== undefined\n        ? {\n            ...styleProp,\n            height: itemHeight,\n          }\n        : styleProp;\n\n    return (\n      <div\n        className={className}\n        {...props}\n        aria-disabled={disabled || undefined}\n        aria-selected={selected || undefined}\n        ref={forwardedRef}\n        style={style}\n      >\n        {showCheckbox && <CheckboxIcon aria-hidden checked={selected} />}\n        {children && typeof children !== \"string\" ? (\n          children\n        ) : itemTextHighlightPattern == null ? (\n          <span className={withBaseName(\"textWrapper\")}>\n            {label || children}\n          </span>\n        ) : (\n          <Highlighter\n            matchPattern={itemTextHighlightPattern}\n            text={label || (children as string)}\n          />\n        )}\n      </div>\n    );\n  },\n) as ListItemType;\n"],"names":["ListItem","listItemCss"],"mappings":";;;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA;AAMzC,MAAM,aAAgB,GAAA,UAAA,CAAW,SAAS,iBAAA,CAC/C,OACA,YACA,EAAA;AACA,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,aAAW,EAAA,IAAA;AAAA,MACX,WAAW,IAAK,CAAA,YAAA,EAAgB,EAAA,YAAA,CAAa,OAAO,CAAC,CAAA;AAAA,MACrD,GAAK,EAAA;AAAA;AAAA,GACP;AAEJ,CAAC;AAKM,MAAM,QAAW,GAAA,UAAA;AAAA,EACtB,SAASA,SACP,CAAA;AAAA,IACE,QAAA;AAAA,IACA,SAAW,EAAA,aAAA;AAAA,IACX,QAAA;AAAA,IACA,QAAA;AAAA,IACA,IAAA;AAAA,IACA,UAAA;AAAA,IACA,wBAAA;AAAA,IACA,KAAA;AAAA,IACA,UAAY,EAAA,QAAA;AAAA,IACZ,QAAA;AAAA,IACA,YAAA;AAAA,IACA,KAAO,EAAA,SAAA;AAAA,IACP,GAAG;AAAA,KAEL,YACA,EAAA;AACA,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAA,MAAM,SAAY,GAAA,IAAA,CAAK,YAAa,EAAA,EAAG,aAAe,EAAA;AAAA,MACpD,YAAc,EAAA,QAAA;AAAA,MACd,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG;AAAA,KAC7B,CAAA;AACD,IAAM,MAAA,KAAA,GACJ,eAAe,MACX,GAAA;AAAA,MACE,GAAG,SAAA;AAAA,MACH,MAAQ,EAAA;AAAA,KAEV,GAAA,SAAA;AAEN,IACE,uBAAA,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA;AAAA,QACC,GAAG,KAAA;AAAA,QACJ,iBAAe,QAAY,IAAA,MAAA;AAAA,QAC3B,iBAAe,QAAY,IAAA,MAAA;AAAA,QAC3B,GAAK,EAAA,YAAA;AAAA,QACL,KAAA;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,YAAA,oBAAiB,GAAA,CAAA,YAAA,EAAA,EAAa,aAAW,EAAA,IAAA,EAAC,SAAS,QAAU,EAAA,CAAA;AAAA,UAC7D,QAAY,IAAA,OAAO,QAAa,KAAA,QAAA,GAC/B,WACE,wBAA4B,IAAA,IAAA,mBAC7B,GAAA,CAAA,MAAA,EAAA,EAAK,WAAW,YAAa,CAAA,aAAa,CACxC,EAAA,QAAA,EAAA,KAAA,IAAS,UACZ,CAEA,mBAAA,GAAA;AAAA,YAAC,WAAA;AAAA,YAAA;AAAA,cACC,YAAc,EAAA,wBAAA;AAAA,cACd,MAAM,KAAU,IAAA;AAAA;AAAA;AAClB;AAAA;AAAA,KAEJ;AAAA;AAGN;;;;"}

package/dist-es/list/VirtualizedList.js.map

@@ -1 +1 @@
-{"version":3,"file":"VirtualizedList.js","sources":["../src/list/VirtualizedList.tsx"],"sourcesContent":["import { makePrefixer, useForkRef, useIdMemo } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n  type ForwardedRef,\n  type ReactElement,\n  forwardRef,\n  useRef,\n} from \"react\";\nimport {\n  type CollectionIndexer,\n  type SelectionStrategy,\n  isSelected,\n  useCollectionItems,\n  useImperativeScrollingAPI,\n} from \"../common-hooks\";\nimport { useListHeight } from \"./useListHeight\";\n\nimport { ListItem, ListItemProxy } from \"./ListItem\";\nimport type { ListProps } from \"./listTypes\";\nimport { useList } from \"./useList\";\nimport { type Row, useVirtualization } from \"./useVirtualization\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport listCss from \"./List.css\";\n\nconst defaultEmptyMessage = \"No data to display\";\n\nconst withBaseName = makePrefixer(\"saltList\");\n\nexport const VirtualizedList = forwardRef(function List<\n  Item,\n  Selection extends SelectionStrategy = \"default\",\n>(\n  {\n    borderless,\n    children,\n    className,\n    collapsibleHeaders = false,\n    defaultHighlightedIndex: defaultHighlightedIdx,\n    defaultSelected,\n    disabled: listDisabled = false,\n    disableFocus = false,\n    disableTypeToSelect,\n    displayedItemCount = 10,\n    emptyMessage,\n    getItemHeight,\n    getItemId,\n    height,\n    highlightedIndex: highlightedIdxProp,\n    id: idProp,\n    itemGapSize = 0,\n    itemHeight: itemHeightProp,\n    itemTextHighlightPattern,\n    itemToString,\n    maxHeight,\n    maxWidth,\n    minHeight,\n    minWidth,\n    onSelect,\n    onSelectionChange,\n    onHighlight,\n    restoreLastFocus,\n    selected: selectedProp,\n    selectionStrategy,\n    scrollingApiRef,\n    // TODO do we still need these ?\n    selectionKeys,\n    showEmptyMessage = false,\n    source,\n    style: styleProp,\n    stickyHeaders,\n    tabToSelect,\n    width,\n    ...htmlAttributes\n  }: ListProps<Item, Selection>,\n  forwardedRef?: ForwardedRef<HTMLDivElement>,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-list\",\n    css: listCss,\n    window: targetWindow,\n  });\n\n  const id = useIdMemo(idProp);\n  const rootRef = useRef<HTMLDivElement>(null);\n  const rowHeightProxyRef = useRef<HTMLDivElement | null>(null);\n\n  const collectionHook = useCollectionItems<Item>({\n    id,\n    label: \"List\",\n    source,\n    children,\n    options: {\n      collapsibleHeaders,\n      getItemId,\n      itemToString,\n    },\n  });\n\n  const { preferredHeight } = useListHeight({\n    borderless,\n    displayedItemCount,\n    height,\n    itemCount: collectionHook.data.length,\n    itemGapSize,\n    itemHeight: itemHeightProp,\n    rowHeightRef: rowHeightProxyRef,\n  });\n  const {\n    focusVisible,\n    highlightedIndex,\n    listControlProps,\n    listHandlers,\n    scrollIntoView,\n    selected,\n  } = useList<Item, Selection>({\n    collapsibleHeaders,\n    collectionHook,\n    containerRef: rootRef,\n    defaultHighlightedIndex: defaultHighlightedIdx,\n    defaultSelected: collectionHook.itemToCollectionItem<\n      Selection,\n      typeof defaultSelected\n    >(defaultSelected),\n    disabled: listDisabled,\n    disableTypeToSelect,\n    highlightedIndex: highlightedIdxProp,\n    label: id,\n    onSelect,\n    onSelectionChange,\n    onHighlight,\n    restoreLastFocus,\n    selected: collectionHook.itemToCollectionItem<\n      Selection,\n      typeof defaultSelected\n    >(selectedProp),\n    selectionStrategy,\n    selectionKeys,\n    stickyHeaders,\n    tabToSelect,\n  });\n\n  // TODO move into useList\n  const {\n    rows: data,\n    contentHeight,\n    onVerticalScroll: onScroll,\n  } = useVirtualization<Item>({\n    viewportRef: rootRef,\n    data: collectionHook.data,\n    itemGapSize,\n  });\n\n  // FIXME: useImperativeScrollingAPI doesn't work when element is not rendered beyond `renderBuffer`\n  // One potential way: pass `scrollIntoView` to `useVirtualization` and update rows before original `scrollIntoView` been called\n  useImperativeScrollingAPI({\n    collectionHook,\n    forwardedRef: scrollingApiRef,\n    scrollableRef: rootRef,\n    scrollIntoView,\n  });\n\n  function addItem(\n    list: ReactElement[],\n    row: Row<Item>,\n    idx: { value: number },\n  ) {\n    const [key, offset, pos, item] = row;\n    const index = pos - 1;\n    list.push(\n      <ListItem\n        aria-setsize={collectionHook.data.length}\n        aria-posinset={pos}\n        className={clsx(className, {\n          saltHighlighted: index === highlightedIndex,\n          saltFocusVisible: focusVisible === index,\n        })}\n        data-idx={index}\n        key={key}\n        data-offset={offset}\n        role=\"option\"\n        selected={isSelected<Item>(selected, item)}\n        id={item.id}\n        style={{\n          transform: `translate3d(0px, ${offset}px, 0px)`,\n        }}\n      >\n        {item.label}\n      </ListItem>,\n    );\n    idx.value += 1;\n  }\n\n  function renderItems(\n    data: Row<Item>[],\n    idx: CollectionIndexer = { value: 0 },\n    end = data.length,\n  ) {\n    const listItems: ReactElement[] = [];\n    while (idx.value < end) {\n      const item = data[idx.value];\n      addItem(listItems, item, idx);\n    }\n    return listItems;\n  }\n\n  function renderEmpty() {\n    if (emptyMessage || showEmptyMessage) {\n      return (\n        <span className={withBaseName(\"empty-message\")}>\n          {emptyMessage ?? defaultEmptyMessage}\n        </span>\n      );\n    }\n    return null;\n  }\n\n  const renderContent = () => {\n    if (data.length) {\n      return renderItems(data);\n    }\n    renderEmpty();\n  };\n\n  const sizeStyles = {\n    \"--list-item-gap\": itemGapSize ? `${itemGapSize}px` : undefined,\n    minWidth,\n    minHeight,\n    width: width ?? \"100%\",\n    height: height ?? \"100%\",\n    maxWidth: maxWidth ?? width,\n    maxHeight: maxHeight ?? preferredHeight,\n  };\n  return (\n    <div\n      {...htmlAttributes}\n      {...listHandlers}\n      {...listControlProps}\n      className={clsx(withBaseName(), className, withBaseName(\"virtualized\"))}\n      id={`${id}`}\n      ref={useForkRef<HTMLDivElement>(rootRef, forwardedRef)}\n      role=\"listbox\"\n      onScroll={onScroll}\n      style={{ ...styleProp, ...sizeStyles }}\n      tabIndex={listDisabled || disableFocus ? undefined : 0}\n    >\n      <div\n        className={withBaseName(\"scrollingContentContainer\")}\n        style={{ height: contentHeight }}\n      >\n        <ListItemProxy ref={rowHeightProxyRef} />\n        {renderContent()}\n      </div>\n    </div>\n  );\n}) as <Item = string, Selection extends SelectionStrategy = \"default\">(\n  props: ListProps<Item, Selection> & {\n    ref?: ForwardedRef<HTMLDivElement>;\n  },\n) => ReactElement<ListProps<Item, Selection>>;\n"],"names":["listCss","data"],"mappings":"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"}
+{"version":3,"file":"VirtualizedList.js","sources":["../src/list/VirtualizedList.tsx"],"sourcesContent":["import { makePrefixer, useForkRef, useIdMemo } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n  type ForwardedRef,\n  type ReactElement,\n  forwardRef,\n  useRef,\n} from \"react\";\nimport {\n  type CollectionIndexer,\n  type SelectionStrategy,\n  isSelected,\n  useCollectionItems,\n  useImperativeScrollingAPI,\n} from \"../common-hooks\";\nimport { useListHeight } from \"./useListHeight\";\n\nimport { ListItem, ListItemProxy } from \"./ListItem\";\nimport type { ListProps } from \"./listTypes\";\nimport { useList } from \"./useList\";\nimport { type Row, useVirtualization } from \"./useVirtualization\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport listCss from \"./List.css\";\n\nconst defaultEmptyMessage = \"No data to display\";\n\nconst withBaseName = makePrefixer(\"saltList\");\n\nexport const VirtualizedList = forwardRef(function List<\n  Item,\n  Selection extends SelectionStrategy = \"default\",\n>(\n  {\n    borderless,\n    children,\n    className,\n    collapsibleHeaders = false,\n    defaultHighlightedIndex: defaultHighlightedIdx,\n    defaultSelected,\n    disabled: listDisabled = false,\n    disableFocus = false,\n    disableTypeToSelect,\n    displayedItemCount = 10,\n    emptyMessage,\n    getItemHeight,\n    getItemId,\n    height,\n    highlightedIndex: highlightedIdxProp,\n    id: idProp,\n    itemGapSize = 0,\n    itemHeight: itemHeightProp,\n    itemTextHighlightPattern,\n    itemToString,\n    maxHeight,\n    maxWidth,\n    minHeight,\n    minWidth,\n    onSelect,\n    onSelectionChange,\n    onHighlight,\n    restoreLastFocus,\n    selected: selectedProp,\n    selectionStrategy,\n    scrollingApiRef,\n    // TODO do we still need these ?\n    selectionKeys,\n    showEmptyMessage = false,\n    source,\n    style: styleProp,\n    stickyHeaders,\n    tabToSelect,\n    width,\n    ...htmlAttributes\n  }: ListProps<Item, Selection>,\n  forwardedRef?: ForwardedRef<HTMLDivElement>,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-list\",\n    css: listCss,\n    window: targetWindow,\n  });\n\n  const id = useIdMemo(idProp);\n  const rootRef = useRef<HTMLDivElement>(null);\n  const rowHeightProxyRef = useRef<HTMLDivElement | null>(null);\n\n  const collectionHook = useCollectionItems<Item>({\n    id,\n    label: \"List\",\n    source,\n    children,\n    options: {\n      collapsibleHeaders,\n      getItemId,\n      itemToString,\n    },\n  });\n\n  const { preferredHeight } = useListHeight({\n    borderless,\n    displayedItemCount,\n    height,\n    itemCount: collectionHook.data.length,\n    itemGapSize,\n    itemHeight: itemHeightProp,\n    rowHeightRef: rowHeightProxyRef,\n  });\n  const {\n    focusVisible,\n    highlightedIndex,\n    listControlProps,\n    listHandlers,\n    scrollIntoView,\n    selected,\n  } = useList<Item, Selection>({\n    collapsibleHeaders,\n    collectionHook,\n    containerRef: rootRef,\n    defaultHighlightedIndex: defaultHighlightedIdx,\n    defaultSelected: collectionHook.itemToCollectionItem<\n      Selection,\n      typeof defaultSelected\n    >(defaultSelected),\n    disabled: listDisabled,\n    disableTypeToSelect,\n    highlightedIndex: highlightedIdxProp,\n    label: id,\n    onSelect,\n    onSelectionChange,\n    onHighlight,\n    restoreLastFocus,\n    selected: collectionHook.itemToCollectionItem<\n      Selection,\n      typeof defaultSelected\n    >(selectedProp),\n    selectionStrategy,\n    selectionKeys,\n    stickyHeaders,\n    tabToSelect,\n  });\n\n  // TODO move into useList\n  const {\n    rows: data,\n    contentHeight,\n    onVerticalScroll: onScroll,\n  } = useVirtualization<Item>({\n    viewportRef: rootRef,\n    data: collectionHook.data,\n    itemGapSize,\n  });\n\n  // FIXME: useImperativeScrollingAPI doesn't work when element is not rendered beyond `renderBuffer`\n  // One potential way: pass `scrollIntoView` to `useVirtualization` and update rows before original `scrollIntoView` been called\n  useImperativeScrollingAPI({\n    collectionHook,\n    forwardedRef: scrollingApiRef,\n    scrollableRef: rootRef,\n    scrollIntoView,\n  });\n\n  function addItem(\n    list: ReactElement[],\n    row: Row<Item>,\n    idx: { value: number },\n  ) {\n    const [key, offset, pos, item] = row;\n    const index = pos - 1;\n    list.push(\n      <ListItem\n        aria-setsize={collectionHook.data.length}\n        aria-posinset={pos}\n        className={clsx(className, {\n          saltHighlighted: index === highlightedIndex,\n          saltFocusVisible: focusVisible === index,\n        })}\n        data-idx={index}\n        key={key}\n        data-offset={offset}\n        role=\"option\"\n        selected={isSelected<Item>(selected, item)}\n        id={item.id}\n        style={{\n          transform: `translate3d(0px, ${offset}px, 0px)`,\n        }}\n      >\n        {item.label}\n      </ListItem>,\n    );\n    idx.value += 1;\n  }\n\n  function renderItems(\n    data: Row<Item>[],\n    idx: CollectionIndexer = { value: 0 },\n    end = data.length,\n  ) {\n    const listItems: ReactElement[] = [];\n    while (idx.value < end) {\n      const item = data[idx.value];\n      addItem(listItems, item, idx);\n    }\n    return listItems;\n  }\n\n  function renderEmpty() {\n    if (emptyMessage || showEmptyMessage) {\n      return (\n        <span className={withBaseName(\"empty-message\")}>\n          {emptyMessage ?? defaultEmptyMessage}\n        </span>\n      );\n    }\n    return null;\n  }\n\n  const renderContent = () => {\n    if (data.length) {\n      return renderItems(data);\n    }\n    renderEmpty();\n  };\n\n  const sizeStyles = {\n    \"--list-item-gap\": itemGapSize ? `${itemGapSize}px` : undefined,\n    minWidth,\n    minHeight,\n    width: width ?? \"100%\",\n    height: height ?? \"100%\",\n    maxWidth: maxWidth ?? width,\n    maxHeight: maxHeight ?? preferredHeight,\n  };\n  return (\n    <div\n      {...htmlAttributes}\n      {...listHandlers}\n      {...listControlProps}\n      className={clsx(withBaseName(), className, withBaseName(\"virtualized\"))}\n      id={`${id}`}\n      ref={useForkRef<HTMLDivElement>(rootRef, forwardedRef)}\n      role=\"listbox\"\n      onScroll={onScroll}\n      style={{ ...styleProp, ...sizeStyles }}\n      tabIndex={listDisabled || disableFocus ? undefined : 0}\n    >\n      <div\n        className={withBaseName(\"scrollingContentContainer\")}\n        style={{ height: contentHeight }}\n      >\n        <ListItemProxy ref={rowHeightProxyRef} />\n        {renderContent()}\n      </div>\n    </div>\n  );\n}) as <Item = string, Selection extends SelectionStrategy = \"default\">(\n  props: ListProps<Item, Selection> & {\n    ref?: ForwardedRef<HTMLDivElement>;\n  },\n) => ReactElement<ListProps<Item, Selection>>;\n"],"names":["listCss","data"],"mappings":"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"}

package/dist-es/list/useList.js

@@ -81,7 +81,6 @@ const useList = ({
     disableHighlightOnFocus,
     highlightedIndex: highlightedIndexProp,
     indexPositions: dataHook.data,
-    label,
     onHighlight,
     onKeyboardNavigation: handleKeyboardNavigation,
     restoreLastFocus,