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

package/dist-es/toolbar/overflow-panel/OverflowPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"OverflowPanel.js","sources":["../src/toolbar/overflow-panel/OverflowPanel.tsx"],"sourcesContent":["import {\n  Button,\n  makePrefixer,\n  useControlled,\n  useIcon,\n  useIdMemo as useId,\n} from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n  type ForwardedRef,\n  type MouseEvent,\n  type ReactElement,\n  cloneElement,\n  forwardRef,\n  useCallback,\n  useRef,\n} from \"react\";\nimport { ToolbarField, type ToolbarFieldProps } from \"../toolbar-field\";\nimport { OverflowSeparator } from \"./OverflowSeparator\";\n\nimport {\n  useCollectionItems,\n  useKeyboardNavigationPanel,\n} from \"../../common-hooks\";\n\nimport { DropdownBase, type DropdownBaseProps } from \"../../dropdown\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport overflowPanelCss from \"./OverflowPanel.css\";\n\nconst withBaseName = makePrefixer(\"saltOverflowPanel\");\n\nexport interface DropdownPanelProps extends DropdownBaseProps {\n  /**\n   * Trigger button icon\n   */\n  triggerButtonIcon?: JSX.Element;\n  /**\n   * Trigger button text\n   */\n  triggerButtonLabel?: string;\n}\n\nexport const OverflowPanel = forwardRef(function DropdownPanel(\n  {\n    children,\n    className,\n    defaultIsOpen,\n    isOpen: isOpenProp,\n    onOpenChange,\n    triggerButtonIcon,\n    triggerButtonLabel,\n    ...props\n  }: DropdownPanelProps,\n  forwardedRef?: ForwardedRef<HTMLDivElement>,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-overflow-panel\",\n    css: overflowPanelCss,\n    window: targetWindow,\n  });\n  const { OverflowIcon } = useIcon();\n  const id = useId();\n  const collectionHook = useCollectionItems<ReactElement>({\n    id,\n    children,\n  });\n\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const [isOpen, setIsOpen] = useControlled<boolean>({\n    controlled: isOpenProp,\n    default: defaultIsOpen || false,\n    name: \"DropdownPanel\",\n  });\n\n  const { highlightedIndex: highlightedIdx, ...keyboardHook } =\n    useKeyboardNavigationPanel({\n      cycleFocus: true,\n      defaultHighlightedIndex: 0,\n      focusOnHighlight: true,\n      indexPositions: collectionHook.data,\n    });\n\n  const focusTrigger = useCallback(() => {\n    if (triggerRef.current) {\n      triggerRef.current.focus();\n    }\n  }, []);\n\n  const setPanelRef = useCallback((el: HTMLElement | null) => el?.focus(), []);\n\n  const handleItemClick = (evt: MouseEvent) => {\n    // if (sourceItem.props[\"data-close-on-click\"] !== false) closeMenu();\n    setIsOpen(false);\n    focusTrigger();\n  };\n\n  const handleOpenChange = (open: boolean) => {\n    setIsOpen(open);\n    onOpenChange?.(open);\n  };\n\n  const getTriggerButtonIcon = () =>\n    (triggerButtonIcon ?? triggerButtonLabel === undefined) ? (\n      <OverflowIcon />\n    ) : undefined;\n\n  return (\n    <DropdownBase\n      {...props}\n      className={clsx(withBaseName(), className)}\n      isOpen={isOpen}\n      onOpenChange={handleOpenChange}\n      placement=\"bottom-end\"\n      ref={forwardedRef}\n    >\n      <Button variant=\"secondary\" ref={triggerRef}>\n        {getTriggerButtonIcon()}\n        {triggerButtonLabel}\n      </Button>\n      <div\n        className={withBaseName(\"content\")}\n        ref={setPanelRef}\n        tabIndex={-1}\n        {...keyboardHook.listProps}\n      >\n        {collectionHook.data.map((item) => {\n          const { type } = item.value as ReactElement;\n          if (type === OverflowSeparator) {\n            return item.value;\n          }\n          const formFieldProps = {\n            id: item.id,\n            inOverflowPanel: true,\n            key: item.id,\n            onClick: handleItemClick,\n          } as ToolbarFieldProps;\n\n          if (type === ToolbarField) {\n            return cloneElement(item.value as ReactElement, formFieldProps);\n          }\n          return (\n            <ToolbarField {...formFieldProps} key={item.id}>\n              {item.value}\n            </ToolbarField>\n          );\n        })}\n      </div>\n    </DropdownBase>\n  );\n});\n"],"names":["overflowPanelCss","useId"],"mappings":"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"}
+{"version":3,"file":"OverflowPanel.js","sources":["../src/toolbar/overflow-panel/OverflowPanel.tsx"],"sourcesContent":["import {\n  Button,\n  makePrefixer,\n  useControlled,\n  useIcon,\n  useIdMemo as useId,\n} from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n  type ForwardedRef,\n  type MouseEvent,\n  type ReactElement,\n  cloneElement,\n  forwardRef,\n  useCallback,\n  useRef,\n} from \"react\";\nimport { ToolbarField, type ToolbarFieldProps } from \"../toolbar-field\";\nimport { OverflowSeparator } from \"./OverflowSeparator\";\n\nimport {\n  useCollectionItems,\n  useKeyboardNavigationPanel,\n} from \"../../common-hooks\";\n\nimport { DropdownBase, type DropdownBaseProps } from \"../../dropdown\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport overflowPanelCss from \"./OverflowPanel.css\";\n\nconst withBaseName = makePrefixer(\"saltOverflowPanel\");\n\nexport interface DropdownPanelProps extends DropdownBaseProps {\n  /**\n   * Trigger button icon\n   */\n  triggerButtonIcon?: JSX.Element;\n  /**\n   * Trigger button text\n   */\n  triggerButtonLabel?: string;\n}\n\nexport const OverflowPanel = forwardRef(function DropdownPanel(\n  {\n    children,\n    className,\n    defaultIsOpen,\n    isOpen: isOpenProp,\n    onOpenChange,\n    triggerButtonIcon,\n    triggerButtonLabel,\n    ...props\n  }: DropdownPanelProps,\n  forwardedRef?: ForwardedRef<HTMLDivElement>,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-overflow-panel\",\n    css: overflowPanelCss,\n    window: targetWindow,\n  });\n  const { OverflowIcon } = useIcon();\n  const id = useId();\n  const collectionHook = useCollectionItems<ReactElement>({\n    id,\n    children,\n  });\n\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const [isOpen, setIsOpen] = useControlled<boolean>({\n    controlled: isOpenProp,\n    default: defaultIsOpen || false,\n    name: \"DropdownPanel\",\n  });\n\n  const { highlightedIndex: highlightedIdx, ...keyboardHook } =\n    useKeyboardNavigationPanel({\n      cycleFocus: true,\n      defaultHighlightedIndex: 0,\n      focusOnHighlight: true,\n      indexPositions: collectionHook.data,\n    });\n\n  const focusTrigger = useCallback(() => {\n    if (triggerRef.current) {\n      triggerRef.current.focus();\n    }\n  }, []);\n\n  const setPanelRef = useCallback((el: HTMLElement | null) => el?.focus(), []);\n\n  const handleItemClick = (evt: MouseEvent) => {\n    // if (sourceItem.props[\"data-close-on-click\"] !== false) closeMenu();\n    setIsOpen(false);\n    focusTrigger();\n  };\n\n  const handleOpenChange = (open: boolean) => {\n    setIsOpen(open);\n    onOpenChange?.(open);\n  };\n\n  const getTriggerButtonIcon = () =>\n    (triggerButtonIcon ?? triggerButtonLabel === undefined) ? (\n      <OverflowIcon />\n    ) : undefined;\n\n  return (\n    <DropdownBase\n      {...props}\n      className={clsx(withBaseName(), className)}\n      isOpen={isOpen}\n      onOpenChange={handleOpenChange}\n      placement=\"bottom-end\"\n      ref={forwardedRef}\n    >\n      <Button variant=\"secondary\" ref={triggerRef}>\n        {getTriggerButtonIcon()}\n        {triggerButtonLabel}\n      </Button>\n      <div\n        className={withBaseName(\"content\")}\n        ref={setPanelRef}\n        tabIndex={-1}\n        {...keyboardHook.listProps}\n      >\n        {collectionHook.data.map((item) => {\n          const { type } = item.value as ReactElement;\n          if (type === OverflowSeparator) {\n            return item.value;\n          }\n          const formFieldProps = {\n            id: item.id,\n            inOverflowPanel: true,\n            key: item.id,\n            onClick: handleItemClick,\n          } as ToolbarFieldProps;\n\n          if (type === ToolbarField) {\n            return cloneElement(item.value as ReactElement, formFieldProps);\n          }\n          return (\n            <ToolbarField {...formFieldProps} key={item.id}>\n              {item.value}\n            </ToolbarField>\n          );\n        })}\n      </div>\n    </DropdownBase>\n  );\n});\n"],"names":["overflowPanelCss","useId"],"mappings":"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"}

package/dist-es/toolbar/toolbar-field/useToolbarField.js.map

@@ -1 +1 @@
-{"version":3,"file":"useToolbarField.js","sources":["../src/toolbar/toolbar-field/useToolbarField.ts"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  type MouseEvent,\n  type ReactElement,\n  type ReactNode,\n  isValidElement,\n  useCallback,\n} from \"react\";\nimport { ToolbarButton } from \"../ToolbarButton\";\nimport type { ToolbarFieldProps } from \"./toolbarFieldTypes\";\n\ntype TypeWithDisplayName = { displayName: string };\ntype ActivationIndicator = ToolbarFieldProps[\"ActivationIndicatorComponent\"];\ntype ToolbarFormFieldVariant = \"primary\" | \"tertiary\";\n\nconst NullActivationIndicator = () => null;\nconst primaryControls = [\"Dropdown\", \"Input\"];\n\nconst getChildElementName = (element: ReactNode): string => {\n  if (isValidElement(element)) {\n    const { type } = element;\n    if (typeof type === \"string\") {\n      return type;\n    }\n    if (typeof type.name === \"string\") {\n      return type.name;\n    }\n    if (\"displayName\" in type) {\n      return (type as TypeWithDisplayName).displayName;\n    }\n    return \"\";\n  }\n  throw Error(\n    \"useToolbarField, child of ToolbarField is not valid ReactElememnt\",\n  );\n};\n\n// ToolbarButton gets special styling treatment in the OverflowPanel but styling is\n// applied to the FormField, so we need to target those FormFields hosting ToolbarButtons.\nconst isToolbarButton = (element: ReactElement): boolean =>\n  isValidElement(element) && element.type === ToolbarButton;\n\n// Some props for Toolbar FormFields depend on the control hosted by\n// the FormField.\nexport const getToolbarFormFieldProps = (\n  child: ReactNode,\n  isOverflowPanel = false,\n): ToolbarFieldProps => {\n  let activationIndicator: ActivationIndicator = NullActivationIndicator;\n  let variant: ToolbarFormFieldVariant = \"tertiary\";\n  const element = child as ReactElement;\n  if (isValidElement(element)) {\n    const name = getChildElementName(element);\n    if (primaryControls.includes(name)) {\n      activationIndicator = undefined;\n      variant = \"primary\";\n    }\n  }\n  return {\n    ActivationIndicatorComponent: activationIndicator,\n    className: clsx({\n      \"saltFormFieldLegacy-toolbarButton\":\n        isOverflowPanel && isToolbarButton(element),\n      [`saltFormFieldLegacy-${variant}`]: variant,\n    }),\n    fullWidth: false,\n  };\n};\n\n// Eventually this list needs to be configurable at the Toolbar level\nconst InteractiveComponents = [\"Input\", \"Dropdown\"];\n\nexport const useToolbarField = (\n  props: ToolbarFieldProps,\n): ToolbarFieldProps => {\n  const {\n    ActivationIndicatorComponent: ActivationIndicatorComponentProp,\n    className: classNameProp,\n    inOverflowPanel,\n    labelPlacement: labelPlacementProp,\n    onClick,\n    ...rest\n  } = props;\n\n  const childElementName = getChildElementName(props.children);\n  const { className, ActivationIndicatorComponent, ...calculatedProps } =\n    getToolbarFormFieldProps(props.children, inOverflowPanel);\n\n  const labelPlacement =\n    labelPlacementProp ?? (inOverflowPanel ? \"top\" : \"left\");\n\n  // disableFocusRing ???\n\n  const handleClick = useCallback(\n    (e: MouseEvent<HTMLDivElement>) => {\n      if (onClick && !InteractiveComponents.includes(childElementName)) {\n        onClick(e);\n      }\n    },\n    [childElementName, onClick],\n  );\n  return {\n    ActivationIndicatorComponent:\n      ActivationIndicatorComponentProp ?? ActivationIndicatorComponent,\n    className: clsx(\"saltToolbarField\", classNameProp, className),\n    labelPlacement,\n    onClick: handleClick,\n    ...rest,\n    ...calculatedProps,\n  };\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useToolbarField.js","sources":["../src/toolbar/toolbar-field/useToolbarField.ts"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  type MouseEvent,\n  type ReactElement,\n  type ReactNode,\n  isValidElement,\n  useCallback,\n} from \"react\";\nimport { ToolbarButton } from \"../ToolbarButton\";\nimport type { ToolbarFieldProps } from \"./toolbarFieldTypes\";\n\ntype TypeWithDisplayName = { displayName: string };\ntype ActivationIndicator = ToolbarFieldProps[\"ActivationIndicatorComponent\"];\ntype ToolbarFormFieldVariant = \"primary\" | \"tertiary\";\n\nconst NullActivationIndicator = () => null;\nconst primaryControls = [\"Dropdown\", \"Input\"];\n\nconst getChildElementName = (element: ReactNode): string => {\n  if (isValidElement(element)) {\n    const { type } = element;\n    if (typeof type === \"string\") {\n      return type;\n    }\n    if (typeof type.name === \"string\") {\n      return type.name;\n    }\n    if (\"displayName\" in type) {\n      return (type as TypeWithDisplayName).displayName;\n    }\n    return \"\";\n  }\n  throw Error(\n    \"useToolbarField, child of ToolbarField is not valid ReactElememnt\",\n  );\n};\n\n// ToolbarButton gets special styling treatment in the OverflowPanel but styling is\n// applied to the FormField, so we need to target those FormFields hosting ToolbarButtons.\nconst isToolbarButton = (element: ReactElement): boolean =>\n  isValidElement(element) && element.type === ToolbarButton;\n\n// Some props for Toolbar FormFields depend on the control hosted by\n// the FormField.\nexport const getToolbarFormFieldProps = (\n  child: ReactNode,\n  isOverflowPanel = false,\n): ToolbarFieldProps => {\n  let activationIndicator: ActivationIndicator = NullActivationIndicator;\n  let variant: ToolbarFormFieldVariant = \"tertiary\";\n  const element = child as ReactElement;\n  if (isValidElement(element)) {\n    const name = getChildElementName(element);\n    if (primaryControls.includes(name)) {\n      activationIndicator = undefined;\n      variant = \"primary\";\n    }\n  }\n  return {\n    ActivationIndicatorComponent: activationIndicator,\n    className: clsx({\n      \"saltFormFieldLegacy-toolbarButton\":\n        isOverflowPanel && isToolbarButton(element),\n      [`saltFormFieldLegacy-${variant}`]: variant,\n    }),\n    fullWidth: false,\n  };\n};\n\n// Eventually this list needs to be configurable at the Toolbar level\nconst InteractiveComponents = [\"Input\", \"Dropdown\"];\n\nexport const useToolbarField = (\n  props: ToolbarFieldProps,\n): ToolbarFieldProps => {\n  const {\n    ActivationIndicatorComponent: ActivationIndicatorComponentProp,\n    className: classNameProp,\n    inOverflowPanel,\n    labelPlacement: labelPlacementProp,\n    onClick,\n    ...rest\n  } = props;\n\n  const childElementName = getChildElementName(props.children);\n  const { className, ActivationIndicatorComponent, ...calculatedProps } =\n    getToolbarFormFieldProps(props.children, inOverflowPanel);\n\n  const labelPlacement =\n    labelPlacementProp ?? (inOverflowPanel ? \"top\" : \"left\");\n\n  // disableFocusRing ???\n\n  const handleClick = useCallback(\n    (e: MouseEvent<HTMLDivElement>) => {\n      if (onClick && !InteractiveComponents.includes(childElementName)) {\n        onClick(e);\n      }\n    },\n    [childElementName, onClick],\n  );\n  return {\n    ActivationIndicatorComponent:\n      ActivationIndicatorComponentProp ?? ActivationIndicatorComponent,\n    className: clsx(\"saltToolbarField\", classNameProp, className),\n    labelPlacement,\n    onClick: handleClick,\n    ...rest,\n    ...calculatedProps,\n  };\n};\n"],"names":[],"mappings":"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"}

package/dist-es/tree/Tree.js

@@ -50,9 +50,7 @@ const Tree = forwardRef(function Tree2({
     id,
     source,
     options: {
-      noChildrenLabel: "No children available",
-      revealSelected: revealSelected ? Boolean(selectedProp) || Boolean(defaultSelected) || false : void 0
-    }
+      noChildrenLabel: "No children available"}
   });
   const preferredHeight = height ?? calcPreferredHeight({
     displayedItemCount: 10,
@@ -105,7 +103,6 @@ const Tree = forwardRef(function Tree2({
     // Note this isn't enough for a Tree, because of nested structure
     defaultSelected: collectionHook.itemToCollectionItem(defaultSelected),
     disabled,
-    groupSelection,
     onHighlight,
     onSelect: handleSelect,
     onSelectionChange: handleSelectionChange,
@@ -127,7 +124,6 @@ const Tree = forwardRef(function Tree2({
     isLeaf: true,
     role: "treeitem"
   };
-  const allowGroupSelect = false;
   function addLeafNode(list, item, idx) {
     const itemProps = {
       "aria-disabled": disabled || item.disabled,
@@ -169,7 +165,7 @@ const Tree = forwardRef(function Tree2({
           "aria-level": item.level,
           className: clsx({
             focusVisible: focusVisible === i,
-            [withBaseName("toggle")]: !allowGroupSelect
+            [withBaseName("toggle")]: true
           }),
           "data-idx": i,
           "data-selectable": true,

package/dist-es/tree/Tree.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tree.js","sources":["../src/tree/Tree.tsx"],"sourcesContent":["import { makePrefixer, useForkRef, useIdMemo } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n  type ForwardedRef,\n  type MouseEvent,\n  type ReactElement,\n  forwardRef,\n  isValidElement,\n  useCallback,\n  useRef,\n} from \"react\";\n\nimport {\n  type CollectionIndexer,\n  type CollectionItem,\n  GROUP_SELECTION_NONE,\n  type SelectHandler,\n  type SelectionChangeHandler,\n  type SelectionStrategy,\n  type SingleSelectionStrategy,\n  calcPreferredHeight,\n  closestListItemIndex,\n  isSelected,\n  useAutoSizer,\n  useCollectionItems,\n} from \"../common-hooks\";\nimport type { TreeProps } from \"./treeTypes\";\n\nimport { TreeNode } from \"./TreeNode\";\nimport { useTree } from \"./useTree\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport treeCss from \"./Tree.css\";\n\nconst withBaseName = makePrefixer(\"saltTree\");\n\nconst getSelectedItemsFromSource = (\n  source: any[],\n  selectionStrategy: SelectionStrategy,\n  result: any[] = [],\n) => {\n  const isSingleSelection =\n    selectionStrategy === \"default\" || selectionStrategy === \"deselectable\";\n  for (const item of source) {\n    if (item.selected === true) {\n      result.push(item);\n      if (isSingleSelection) {\n        break;\n      }\n    }\n    if (item.childNodes) {\n      getSelectedItemsFromSource(item.childNodes, selectionStrategy, result);\n      if (isSingleSelection && result.length === 1) {\n        break;\n      }\n    }\n  }\n\n  return isSingleSelection ? result[0] : result.length > 0 ? result : undefined;\n};\n\nexport const Tree = forwardRef(function Tree<\n  Item,\n  Selection extends SelectionStrategy = \"deselectable\",\n>(\n  {\n    className,\n    defaultSelected,\n    disabled,\n    groupSelection = GROUP_SELECTION_NONE,\n    height,\n    id: idProp,\n    onHighlight,\n    onToggle,\n    onSelect,\n    onSelectionChange,\n    revealSelected,\n    selected: selectedProp,\n    selectionStrategy,\n    source,\n    style: styleProp,\n    width,\n    ...htmlAttributes\n  }: TreeProps<Item, Selection>,\n  forwardedRef?: ForwardedRef<HTMLDivElement>,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-tree\",\n    css: treeCss,\n    window: targetWindow,\n  });\n\n  const id = useIdMemo(idProp);\n  const rootRef = useRef(null);\n  const contentRef = useRef(null);\n\n  const collectionHook = useCollectionItems<Item>({\n    id,\n    source,\n    options: {\n      noChildrenLabel: \"No children available\",\n      revealSelected: revealSelected\n        ? Boolean(selectedProp) || Boolean(defaultSelected) || false\n        : undefined,\n    },\n  });\n\n  //------------- from original List\n  const preferredHeight =\n    height ??\n    calcPreferredHeight({\n      displayedItemCount: 10,\n      itemCount: collectionHook.data.length,\n      itemHeight: 36,\n      // getItemHeight,\n      // itemGapSize,\n    });\n\n  const autoSize = useAutoSizer<HTMLDivElement>({\n    containerRef: rootRef,\n    responsive: width === undefined || height === undefined,\n    height: preferredHeight,\n    width,\n  });\n  //---------------\n\n  const handleSelect = useCallback<SelectHandler<CollectionItem<Item>>>(\n    (evt, selectedItem) => {\n      if (onSelect) {\n        if (isValidElement(selectedItem.value)) {\n          onSelect(evt, selectedItem.label as any);\n        } else if (selectedItem.value !== null) {\n          onSelect(evt, selectedItem.value);\n        }\n      }\n    },\n    [onSelect],\n  );\n\n  const handleSelectionChange = useCallback<\n    SelectionChangeHandler<CollectionItem<Item>, Selection>\n  >(\n    (evt, selected) => {\n      type returnType = Selection extends SingleSelectionStrategy\n        ? Item | null\n        : Item[];\n      if (onSelectionChange) {\n        onSelectionChange(\n          evt,\n          Array.isArray(selected)\n            ? (selected.map((s) => s.value) as returnType)\n            : selected && (selected.value as returnType),\n        );\n      }\n    },\n    [onSelectionChange],\n  );\n\n  // const getSelected = (\n  //   sel: Item | null | Item[]\n  // ):\n  //   | undefined\n  //   | (Selection extends SingleSelectionStrategy\n  //       ? CollectionItem<Item> | null\n  //       : CollectionItem<Item>[]) => {\n  //   if (sel !== undefined) {\n  //     return collectionHook.itemToCollectionItem<Selection, typeof sel>(sel);\n  //   } else if (Array.isArray(source)) {\n  //     const selected = getSelectedItemsFromSource(\n  //       source,\n  //       selectionStrategy ?? \"default\"\n  //     );\n  //     return Array.isArray(selected)\n  //       ? collectionHook.itemToCollectionItem(selected)\n  //       : selected\n  //       ? collectionHook.toCollectionItem(selected)\n  //       : undefined;\n  //   }\n  // };\n\n  const {\n    focusVisible,\n    highlightedIdx,\n    highlightItemAtIndex,\n    listHandlers,\n    listProps,\n    listItemHandlers,\n    selected,\n  } = useTree<Item, Selection>({\n    collectionHook,\n    containerRef: rootRef,\n    contentRef,\n    // Note this isn't enough for a Tree, because of nested structure\n    defaultSelected: collectionHook.itemToCollectionItem<\n      Selection,\n      typeof defaultSelected\n    >(defaultSelected),\n    disabled,\n    groupSelection,\n    onHighlight,\n    onSelect: handleSelect,\n    onSelectionChange: handleSelectionChange,\n    onToggle,\n    selected: collectionHook.itemToCollectionItem<\n      Selection,\n      typeof selectedProp\n    >(selectedProp),\n    selectionStrategy,\n  });\n\n  // TODO move into useTree (see useList)\n  const defaultItemHandlers = {\n    onMouseEnter: (evt: MouseEvent) => {\n      // if (!isScrolling.current) {\n      const idx = closestListItemIndex(evt.target as HTMLElement);\n      if (idx != null) {\n        highlightItemAtIndex(idx);\n      }\n      // onMouseEnterListItem && onMouseEnterListItem(evt, idx);\n      // }\n    },\n  };\n\n  const propsCommonToAllListItems = {\n    ...defaultItemHandlers,\n    ...listItemHandlers,\n    isLeaf: true,\n    role: \"treeitem\",\n  };\n  // const allowGroupSelect = groupSelectionEnabled(groupSelection);\n  const allowGroupSelect = false;\n\n  /**\n   * Add a ListItem from source item\n   */\n  function addLeafNode(\n    list: ReactElement[],\n    item: CollectionItem<Item>,\n    idx: CollectionIndexer,\n  ) {\n    const itemProps = {\n      \"aria-disabled\": disabled || item.disabled,\n      \"aria-level\": item.level,\n      \"data-idx\": idx.value,\n      description: item.description,\n      id: item.id,\n      key: item.id,\n      highlighted: idx.value === highlightedIdx || undefined,\n      selected: isSelected<Item>(selected, item),\n      className: clsx({\n        focusVisible: focusVisible === idx.value,\n      }),\n    };\n\n    list.push(\n      <TreeNode\n        {...propsCommonToAllListItems}\n        {...itemProps}\n        label={item.label}\n      >\n        {/* {item.icon ? <span className={`${classBase}Node-icon`} /> : null} */}\n      </TreeNode>,\n    );\n    idx.value += 1;\n  }\n\n  function addGroupNode(\n    list: ReactElement[],\n    items: CollectionItem<Item>[],\n    idx: CollectionIndexer,\n    id: string,\n    title: string,\n  ) {\n    const { value: i } = idx;\n    const item = items[i];\n    idx.value += 1;\n    list.push(\n      <TreeNode\n        {...defaultItemHandlers}\n        {...listItemHandlers}\n        aria-disabled={disabled || item.disabled}\n        aria-expanded={item.expanded}\n        aria-level={item.level}\n        className={clsx({\n          focusVisible: focusVisible === i,\n          [withBaseName(\"toggle\")]: !allowGroupSelect,\n        })}\n        // data-icon={child.icon}\n        data-idx={i}\n        data-selectable\n        description={item.description}\n        highlighted={i === highlightedIdx}\n        id={id}\n        key={`header-${i}`}\n        label={title}\n        selected={isSelected<Item>(selected, item)}\n      >\n        {item.expanded ? (\n          <ul className={withBaseName(\"child-nodes\")} role=\"group\">\n            {renderItems(items, idx, (item.level ?? 0) + 1)}\n          </ul>\n        ) : null}\n      </TreeNode>,\n    );\n  }\n\n  const renderItems = (\n    items: CollectionItem<Item>[],\n    idx: CollectionIndexer = { value: 0 },\n    level = 1,\n  ): ReactElement[] => {\n    const listItems: ReactElement[] = [];\n    while (idx.value < items.length) {\n      const item = items[idx.value];\n      if (item.level != null && item.level < level) {\n        break;\n      }\n      if (item.childNodes != null && item.id != null && item.label != null) {\n        addGroupNode(listItems, items, idx, item.id, item.label);\n      } else {\n        addLeafNode(listItems, item, idx);\n      }\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    // } else {\n    return null;\n    // }\n  }\n\n  const renderContent = () => {\n    if (collectionHook.data.length) {\n      return renderItems(collectionHook.data);\n    }\n    renderEmpty();\n  };\n\n  return (\n    <div\n      {...htmlAttributes}\n      {...listHandlers}\n      {...listProps}\n      className={clsx(withBaseName(), className)}\n      id={`Tree-${id}`}\n      ref={useForkRef(rootRef, forwardedRef)}\n      style={{ ...styleProp, ...autoSize }}\n      tabIndex={0}\n    >\n      <ul\n        className={withBaseName(\"scrollingContentContainer\")}\n        ref={contentRef}\n        role=\"tree\"\n        // style={{ height: contentHeight }}\n      >\n        {renderContent()}\n      </ul>\n    </div>\n  );\n});\n"],"names":["Tree","treeCss","selected","id"],"mappings":"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"}
+{"version":3,"file":"Tree.js","sources":["../src/tree/Tree.tsx"],"sourcesContent":["import { makePrefixer, useForkRef, useIdMemo } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n  type ForwardedRef,\n  type MouseEvent,\n  type ReactElement,\n  forwardRef,\n  isValidElement,\n  useCallback,\n  useRef,\n} from \"react\";\n\nimport {\n  type CollectionIndexer,\n  type CollectionItem,\n  GROUP_SELECTION_NONE,\n  type SelectHandler,\n  type SelectionChangeHandler,\n  type SelectionStrategy,\n  type SingleSelectionStrategy,\n  calcPreferredHeight,\n  closestListItemIndex,\n  isSelected,\n  useAutoSizer,\n  useCollectionItems,\n} from \"../common-hooks\";\nimport type { TreeProps } from \"./treeTypes\";\n\nimport { TreeNode } from \"./TreeNode\";\nimport { useTree } from \"./useTree\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport treeCss from \"./Tree.css\";\n\nconst withBaseName = makePrefixer(\"saltTree\");\n\nconst getSelectedItemsFromSource = (\n  source: any[],\n  selectionStrategy: SelectionStrategy,\n  result: any[] = [],\n) => {\n  const isSingleSelection =\n    selectionStrategy === \"default\" || selectionStrategy === \"deselectable\";\n  for (const item of source) {\n    if (item.selected === true) {\n      result.push(item);\n      if (isSingleSelection) {\n        break;\n      }\n    }\n    if (item.childNodes) {\n      getSelectedItemsFromSource(item.childNodes, selectionStrategy, result);\n      if (isSingleSelection && result.length === 1) {\n        break;\n      }\n    }\n  }\n\n  return isSingleSelection ? result[0] : result.length > 0 ? result : undefined;\n};\n\nexport const Tree = forwardRef(function Tree<\n  Item,\n  Selection extends SelectionStrategy = \"deselectable\",\n>(\n  {\n    className,\n    defaultSelected,\n    disabled,\n    groupSelection = GROUP_SELECTION_NONE,\n    height,\n    id: idProp,\n    onHighlight,\n    onToggle,\n    onSelect,\n    onSelectionChange,\n    revealSelected,\n    selected: selectedProp,\n    selectionStrategy,\n    source,\n    style: styleProp,\n    width,\n    ...htmlAttributes\n  }: TreeProps<Item, Selection>,\n  forwardedRef?: ForwardedRef<HTMLDivElement>,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-tree\",\n    css: treeCss,\n    window: targetWindow,\n  });\n\n  const id = useIdMemo(idProp);\n  const rootRef = useRef(null);\n  const contentRef = useRef(null);\n\n  const collectionHook = useCollectionItems<Item>({\n    id,\n    source,\n    options: {\n      noChildrenLabel: \"No children available\",\n      revealSelected: revealSelected\n        ? Boolean(selectedProp) || Boolean(defaultSelected) || false\n        : undefined,\n    },\n  });\n\n  //------------- from original List\n  const preferredHeight =\n    height ??\n    calcPreferredHeight({\n      displayedItemCount: 10,\n      itemCount: collectionHook.data.length,\n      itemHeight: 36,\n      // getItemHeight,\n      // itemGapSize,\n    });\n\n  const autoSize = useAutoSizer<HTMLDivElement>({\n    containerRef: rootRef,\n    responsive: width === undefined || height === undefined,\n    height: preferredHeight,\n    width,\n  });\n  //---------------\n\n  const handleSelect = useCallback<SelectHandler<CollectionItem<Item>>>(\n    (evt, selectedItem) => {\n      if (onSelect) {\n        if (isValidElement(selectedItem.value)) {\n          onSelect(evt, selectedItem.label as any);\n        } else if (selectedItem.value !== null) {\n          onSelect(evt, selectedItem.value);\n        }\n      }\n    },\n    [onSelect],\n  );\n\n  const handleSelectionChange = useCallback<\n    SelectionChangeHandler<CollectionItem<Item>, Selection>\n  >(\n    (evt, selected) => {\n      type returnType = Selection extends SingleSelectionStrategy\n        ? Item | null\n        : Item[];\n      if (onSelectionChange) {\n        onSelectionChange(\n          evt,\n          Array.isArray(selected)\n            ? (selected.map((s) => s.value) as returnType)\n            : selected && (selected.value as returnType),\n        );\n      }\n    },\n    [onSelectionChange],\n  );\n\n  // const getSelected = (\n  //   sel: Item | null | Item[]\n  // ):\n  //   | undefined\n  //   | (Selection extends SingleSelectionStrategy\n  //       ? CollectionItem<Item> | null\n  //       : CollectionItem<Item>[]) => {\n  //   if (sel !== undefined) {\n  //     return collectionHook.itemToCollectionItem<Selection, typeof sel>(sel);\n  //   } else if (Array.isArray(source)) {\n  //     const selected = getSelectedItemsFromSource(\n  //       source,\n  //       selectionStrategy ?? \"default\"\n  //     );\n  //     return Array.isArray(selected)\n  //       ? collectionHook.itemToCollectionItem(selected)\n  //       : selected\n  //       ? collectionHook.toCollectionItem(selected)\n  //       : undefined;\n  //   }\n  // };\n\n  const {\n    focusVisible,\n    highlightedIdx,\n    highlightItemAtIndex,\n    listHandlers,\n    listProps,\n    listItemHandlers,\n    selected,\n  } = useTree<Item, Selection>({\n    collectionHook,\n    containerRef: rootRef,\n    contentRef,\n    // Note this isn't enough for a Tree, because of nested structure\n    defaultSelected: collectionHook.itemToCollectionItem<\n      Selection,\n      typeof defaultSelected\n    >(defaultSelected),\n    disabled,\n    groupSelection,\n    onHighlight,\n    onSelect: handleSelect,\n    onSelectionChange: handleSelectionChange,\n    onToggle,\n    selected: collectionHook.itemToCollectionItem<\n      Selection,\n      typeof selectedProp\n    >(selectedProp),\n    selectionStrategy,\n  });\n\n  // TODO move into useTree (see useList)\n  const defaultItemHandlers = {\n    onMouseEnter: (evt: MouseEvent) => {\n      // if (!isScrolling.current) {\n      const idx = closestListItemIndex(evt.target as HTMLElement);\n      if (idx != null) {\n        highlightItemAtIndex(idx);\n      }\n      // onMouseEnterListItem && onMouseEnterListItem(evt, idx);\n      // }\n    },\n  };\n\n  const propsCommonToAllListItems = {\n    ...defaultItemHandlers,\n    ...listItemHandlers,\n    isLeaf: true,\n    role: \"treeitem\",\n  };\n  // const allowGroupSelect = groupSelectionEnabled(groupSelection);\n  const allowGroupSelect = false;\n\n  /**\n   * Add a ListItem from source item\n   */\n  function addLeafNode(\n    list: ReactElement[],\n    item: CollectionItem<Item>,\n    idx: CollectionIndexer,\n  ) {\n    const itemProps = {\n      \"aria-disabled\": disabled || item.disabled,\n      \"aria-level\": item.level,\n      \"data-idx\": idx.value,\n      description: item.description,\n      id: item.id,\n      key: item.id,\n      highlighted: idx.value === highlightedIdx || undefined,\n      selected: isSelected<Item>(selected, item),\n      className: clsx({\n        focusVisible: focusVisible === idx.value,\n      }),\n    };\n\n    list.push(\n      <TreeNode\n        {...propsCommonToAllListItems}\n        {...itemProps}\n        label={item.label}\n      >\n        {/* {item.icon ? <span className={`${classBase}Node-icon`} /> : null} */}\n      </TreeNode>,\n    );\n    idx.value += 1;\n  }\n\n  function addGroupNode(\n    list: ReactElement[],\n    items: CollectionItem<Item>[],\n    idx: CollectionIndexer,\n    id: string,\n    title: string,\n  ) {\n    const { value: i } = idx;\n    const item = items[i];\n    idx.value += 1;\n    list.push(\n      <TreeNode\n        {...defaultItemHandlers}\n        {...listItemHandlers}\n        aria-disabled={disabled || item.disabled}\n        aria-expanded={item.expanded}\n        aria-level={item.level}\n        className={clsx({\n          focusVisible: focusVisible === i,\n          [withBaseName(\"toggle\")]: !allowGroupSelect,\n        })}\n        // data-icon={child.icon}\n        data-idx={i}\n        data-selectable\n        description={item.description}\n        highlighted={i === highlightedIdx}\n        id={id}\n        key={`header-${i}`}\n        label={title}\n        selected={isSelected<Item>(selected, item)}\n      >\n        {item.expanded ? (\n          <ul className={withBaseName(\"child-nodes\")} role=\"group\">\n            {renderItems(items, idx, (item.level ?? 0) + 1)}\n          </ul>\n        ) : null}\n      </TreeNode>,\n    );\n  }\n\n  const renderItems = (\n    items: CollectionItem<Item>[],\n    idx: CollectionIndexer = { value: 0 },\n    level = 1,\n  ): ReactElement[] => {\n    const listItems: ReactElement[] = [];\n    while (idx.value < items.length) {\n      const item = items[idx.value];\n      if (item.level != null && item.level < level) {\n        break;\n      }\n      if (item.childNodes != null && item.id != null && item.label != null) {\n        addGroupNode(listItems, items, idx, item.id, item.label);\n      } else {\n        addLeafNode(listItems, item, idx);\n      }\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    // } else {\n    return null;\n    // }\n  }\n\n  const renderContent = () => {\n    if (collectionHook.data.length) {\n      return renderItems(collectionHook.data);\n    }\n    renderEmpty();\n  };\n\n  return (\n    <div\n      {...htmlAttributes}\n      {...listHandlers}\n      {...listProps}\n      className={clsx(withBaseName(), className)}\n      id={`Tree-${id}`}\n      ref={useForkRef(rootRef, forwardedRef)}\n      style={{ ...styleProp, ...autoSize }}\n      tabIndex={0}\n    >\n      <ul\n        className={withBaseName(\"scrollingContentContainer\")}\n        ref={contentRef}\n        role=\"tree\"\n        // style={{ height: contentHeight }}\n      >\n        {renderContent()}\n      </ul>\n    </div>\n  );\n});\n"],"names":["Tree","treeCss","selected","id"],"mappings":"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"}

package/dist-es/tree/TreeNode.js.map

@@ -1 +1 @@
-{"version":3,"file":"TreeNode.js","sources":["../src/tree/TreeNode.tsx"],"sourcesContent":["import { TriangleRightIcon } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport type { HTMLAttributes, MouseEventHandler, ReactNode } from \"react\";\n\nimport { makePrefixer } from \"@salt-ds/core\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport treeNodeCss from \"./TreeNode.css\";\n\nconst withBaseName = makePrefixer(\"saltTreeNode\");\nexport interface TreeNodeProps\n  extends Omit<HTMLAttributes<HTMLLIElement>, \"onMouseEnter\"> {\n  children?: ReactNode;\n  description?: string;\n  highlighted?: boolean;\n  idx?: number;\n  isLeaf?: boolean;\n  label?: string;\n  onMouseEnter?: MouseEventHandler;\n  selected?: boolean;\n}\n\nexport const TreeNode = ({\n  \"aria-level\": ariaLevel,\n  children,\n  className: classNameProp,\n  description,\n  highlighted,\n  idx,\n  isLeaf = false,\n  label,\n  onMouseEnter,\n  selected,\n  ...props\n}: TreeNodeProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-tree-node\",\n    css: treeNodeCss,\n    window: targetWindow,\n  });\n\n  const className = clsx(withBaseName(), classNameProp, {\n    [withBaseName(\"highlighted\")]: highlighted,\n  });\n\n  return (\n    <li {...props} className={className} role=\"presentation\">\n      <div\n        aria-level={ariaLevel}\n        aria-selected={selected || undefined}\n        className={withBaseName(\"item\")}\n        onMouseEnter={onMouseEnter}\n        role=\"treeitem\"\n      >\n        {isLeaf === false ? (\n          <span className={withBaseName(\"toggle\")} data-toggle={true}>\n            <TriangleRightIcon />\n          </span>\n        ) : null}\n        <div className={withBaseName(\"label\")}>\n          {/* {child.icon ? <span className={`${classBase}Node-icon`} /> : null} */}\n          {label}\n        </div>\n        {description !== undefined ? (\n          <div className={withBaseName(\"description\")}>{description}</div>\n        ) : null}\n      </div>\n      {children}\n    </li>\n  );\n};\n"],"names":["treeNodeCss"],"mappings":";;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA;AAazC,MAAM,WAAW,CAAC;AAAA,EACvB,YAAc,EAAA,SAAA;AAAA,EACd,QAAA;AAAA,EACA,SAAW,EAAA,aAAA;AAAA,EACX,WAAA;AAAA,EACA,WAAA;AAAA,EACA,GAAA;AAAA,EACA,MAAS,GAAA,KAAA;AAAA,EACT,KAAA;AAAA,EACA,YAAA;AAAA,EACA,QAAA;AAAA,EACA,GAAG;AACL,CAAqB,KAAA;AACnB,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,SAAY,GAAA,IAAA,CAAK,YAAa,EAAA,EAAG,aAAe,EAAA;AAAA,IACpD,CAAC,YAAA,CAAa,aAAa,CAAC,GAAG;AAAA,GAChC,CAAA;AAED,EAAA,4BACG,IAAI,EAAA,EAAA,GAAG,KAAO,EAAA,SAAA,EAAsB,MAAK,cACxC,EAAA,QAAA,EAAA;AAAA,oBAAA,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,YAAY,EAAA,SAAA;AAAA,QACZ,iBAAe,QAAY,IAAA,KAAA,CAAA;AAAA,QAC3B,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,QAC9B,YAAA;AAAA,QACA,IAAK,EAAA,UAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,UAAA,MAAA,KAAW,KACV,mBAAA,GAAA,CAAC,MAAK,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,QAAQ,CAAG,EAAA,aAAA,EAAa,IACpD,EAAA,QAAA,kBAAA,GAAA,CAAC,iBAAkB,EAAA,EAAA,CAAA,EACrB,CACE,GAAA,IAAA;AAAA,8BACH,KAAI,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,OAAO,GAEjC,QACH,EAAA,KAAA,EAAA,CAAA;AAAA,UACC,WAAA,KAAgB,yBACd,GAAA,CAAA,KAAA,EAAA,EAAI,WAAW,YAAa,CAAA,aAAa,CAAI,EAAA,QAAA,EAAA,WAAA,EAAY,CACxD,GAAA;AAAA;AAAA;AAAA,KACN;AAAA,IACC;AAAA,GACH,EAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"TreeNode.js","sources":["../src/tree/TreeNode.tsx"],"sourcesContent":["import { TriangleRightIcon } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport type { HTMLAttributes, MouseEventHandler, ReactNode } from \"react\";\n\nimport { makePrefixer } from \"@salt-ds/core\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport treeNodeCss from \"./TreeNode.css\";\n\nconst withBaseName = makePrefixer(\"saltTreeNode\");\nexport interface TreeNodeProps\n  extends Omit<HTMLAttributes<HTMLLIElement>, \"onMouseEnter\"> {\n  children?: ReactNode;\n  description?: string;\n  highlighted?: boolean;\n  idx?: number;\n  isLeaf?: boolean;\n  label?: string;\n  onMouseEnter?: MouseEventHandler;\n  selected?: boolean;\n}\n\nexport const TreeNode = ({\n  \"aria-level\": ariaLevel,\n  children,\n  className: classNameProp,\n  description,\n  highlighted,\n  idx,\n  isLeaf = false,\n  label,\n  onMouseEnter,\n  selected,\n  ...props\n}: TreeNodeProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-tree-node\",\n    css: treeNodeCss,\n    window: targetWindow,\n  });\n\n  const className = clsx(withBaseName(), classNameProp, {\n    [withBaseName(\"highlighted\")]: highlighted,\n  });\n\n  return (\n    <li {...props} className={className} role=\"presentation\">\n      <div\n        aria-level={ariaLevel}\n        aria-selected={selected || undefined}\n        className={withBaseName(\"item\")}\n        onMouseEnter={onMouseEnter}\n        role=\"treeitem\"\n      >\n        {isLeaf === false ? (\n          <span className={withBaseName(\"toggle\")} data-toggle={true}>\n            <TriangleRightIcon />\n          </span>\n        ) : null}\n        <div className={withBaseName(\"label\")}>\n          {/* {child.icon ? <span className={`${classBase}Node-icon`} /> : null} */}\n          {label}\n        </div>\n        {description !== undefined ? (\n          <div className={withBaseName(\"description\")}>{description}</div>\n        ) : null}\n      </div>\n      {children}\n    </li>\n  );\n};\n"],"names":["treeNodeCss"],"mappings":";;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA;AAazC,MAAM,WAAW,CAAC;AAAA,EACvB,YAAc,EAAA,SAAA;AAAA,EACd,QAAA;AAAA,EACA,SAAW,EAAA,aAAA;AAAA,EACX,WAAA;AAAA,EACA,WAAA;AAAA,EACA,GAAA;AAAA,EACA,MAAS,GAAA,KAAA;AAAA,EACT,KAAA;AAAA,EACA,YAAA;AAAA,EACA,QAAA;AAAA,EACA,GAAG;AACL,CAAqB,KAAA;AACnB,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,SAAY,GAAA,IAAA,CAAK,YAAa,EAAA,EAAG,aAAe,EAAA;AAAA,IACpD,CAAC,YAAA,CAAa,aAAa,CAAC,GAAG;AAAA,GAChC,CAAA;AAED,EAAA,4BACG,IAAI,EAAA,EAAA,GAAG,KAAO,EAAA,SAAA,EAAsB,MAAK,cACxC,EAAA,QAAA,EAAA;AAAA,oBAAA,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,YAAY,EAAA,SAAA;AAAA,QACZ,iBAAe,QAAY,IAAA,MAAA;AAAA,QAC3B,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,QAC9B,YAAA;AAAA,QACA,IAAK,EAAA,UAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,UAAA,MAAA,KAAW,KACV,mBAAA,GAAA,CAAC,MAAK,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,QAAQ,CAAG,EAAA,aAAA,EAAa,IACpD,EAAA,QAAA,kBAAA,GAAA,CAAC,iBAAkB,EAAA,EAAA,CAAA,EACrB,CACE,GAAA,IAAA;AAAA,8BACH,KAAI,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,OAAO,GAEjC,QACH,EAAA,KAAA,EAAA,CAAA;AAAA,UACC,WAAA,KAAgB,yBACd,GAAA,CAAA,KAAA,EAAA,EAAI,WAAW,YAAa,CAAA,aAAa,CAAI,EAAA,QAAA,EAAA,WAAA,EAAY,CACxD,GAAA;AAAA;AAAA;AAAA,KACN;AAAA,IACC;AAAA,GACH,EAAA,CAAA;AAEJ;;;;"}

package/dist-es/tree/use-tree-keyboard-navigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-tree-keyboard-navigation.js","sources":["../src/tree/use-tree-keyboard-navigation.ts"],"sourcesContent":["import { type KeyboardEvent, useCallback } from \"react\";\nimport type { CollectionHookResult, CollectionItem } from \"../common-hooks\";\nimport { ArrowLeft } from \"../common-hooks/keyUtils\";\n\nexport const getNodeParentPath = ({ id }: CollectionItem<any>) => {\n  let pos = id.lastIndexOf(\"-\");\n  if (pos !== -1) {\n    // using the built-in hierarchical id scheme\n    // rootId-n-n.n\n    const path = id.slice(pos + 1);\n    const steps = path.split(\".\");\n    if (steps.length === 1) {\n      return null;\n    }\n    steps.pop();\n    return `${id.slice(0, pos)}-${steps.join(\".\")}`;\n  }\n\n  pos = id.lastIndexOf(\"/\");\n  if (pos !== -1) {\n    // using a path scheme step/step/step\n    return id.slice(0, pos);\n  }\n};\n\ninterface TreeNavigationHookProps<Item> {\n  collectionHook: CollectionHookResult<Item>;\n  highlightedIdx: number;\n  highlightItemAtIndex: (index: number) => void;\n}\n\ninterface TreeNavigationHookResult {\n  listHandlers: {\n    onKeyDown: (evt: KeyboardEvent) => void;\n  };\n}\n\n// we need a way to set highlightedIdx when selection changes\nexport const useKeyboardNavigation = <Item>({\n  collectionHook,\n  highlightedIdx,\n  highlightItemAtIndex,\n}: TreeNavigationHookProps<Item>): TreeNavigationHookResult => {\n  const handleKeyDown = useCallback(\n    (e: KeyboardEvent) => {\n      if (e.key === ArrowLeft) {\n        const node = collectionHook.data[highlightedIdx];\n        const parentId = getNodeParentPath(node);\n        if (parentId) {\n          highlightItemAtIndex(\n            collectionHook.data.findIndex((item) => item.id === parentId),\n          );\n        }\n      }\n    },\n    [highlightedIdx, highlightItemAtIndex],\n  );\n\n  const listHandlers = {\n    onKeyDown: handleKeyDown,\n  };\n\n  return {\n    listHandlers,\n  };\n};\n"],"names":[],"mappings":";;;AAIO,MAAM,iBAAoB,GAAA,CAAC,EAAE,EAAA,EAA8B,KAAA;AAChE,EAAI,IAAA,GAAA,GAAM,EAAG,CAAA,WAAA,CAAY,GAAG,CAAA;AAC5B,EAAA,IAAI,QAAQ,CAAI,CAAA,EAAA;AAGd,IAAA,MAAM,IAAO,GAAA,EAAA,CAAG,KAAM,CAAA,GAAA,GAAM,CAAC,CAAA;AAC7B,IAAM,MAAA,KAAA,GAAQ,IAAK,CAAA,KAAA,CAAM,GAAG,CAAA;AAC5B,IAAI,IAAA,KAAA,CAAM,WAAW,CAAG,EAAA;AACtB,MAAO,OAAA,IAAA;AAAA;AAET,IAAA,KAAA,CAAM,GAAI,EAAA;AACV,IAAO,OAAA,CAAA,EAAG,EAAG,CAAA,KAAA,CAAM,CAAG,EAAA,GAAG,CAAC,CAAI,CAAA,EAAA,KAAA,CAAM,IAAK,CAAA,GAAG,CAAC,CAAA,CAAA;AAAA;AAG/C,EAAM,GAAA,GAAA,EAAA,CAAG,YAAY,GAAG,CAAA;AACxB,EAAA,IAAI,QAAQ,CAAI,CAAA,EAAA;AAEd,IAAO,OAAA,EAAA,CAAG,KAAM,CAAA,CAAA,EAAG,GAAG,CAAA;AAAA;AAE1B;AAeO,MAAM,wBAAwB,CAAO;AAAA,EAC1C,cAAA;AAAA,EACA,cAAA;AAAA,EACA;AACF,CAA+D,KAAA;AAC7D,EAAA,MAAM,aAAgB,GAAA,WAAA;AAAA,IACpB,CAAC,CAAqB,KAAA;AACpB,MAAI,IAAA,CAAA,CAAE,QAAQ,SAAW,EAAA;AACvB,QAAM,MAAA,IAAA,GAAO,cAAe,CAAA,IAAA,CAAK,cAAc,CAAA;AAC/C,QAAM,MAAA,QAAA,GAAW,kBAAkB,IAAI,CAAA;AACvC,QAAA,IAAI,QAAU,EAAA;AACZ,UAAA,oBAAA;AAAA,YACE,eAAe,IAAK,CAAA,SAAA,CAAU,CAAC,IAAS,KAAA,IAAA,CAAK,OAAO,QAAQ;AAAA,WAC9D;AAAA;AACF;AACF,KACF;AAAA,IACA,CAAC,gBAAgB,oBAAoB;AAAA,GACvC;AAEA,EAAA,MAAM,YAAe,GAAA;AAAA,IACnB,SAAW,EAAA;AAAA,GACb;AAEA,EAAO,OAAA;AAAA,IACL;AAAA,GACF;AACF;;;;"}
+{"version":3,"file":"use-tree-keyboard-navigation.js","sources":["../src/tree/use-tree-keyboard-navigation.ts"],"sourcesContent":["import { type KeyboardEvent, useCallback } from \"react\";\nimport type { CollectionHookResult, CollectionItem } from \"../common-hooks\";\nimport { ArrowLeft } from \"../common-hooks/keyUtils\";\n\nexport const getNodeParentPath = ({ id }: CollectionItem<any>) => {\n  let pos = id.lastIndexOf(\"-\");\n  if (pos !== -1) {\n    // using the built-in hierarchical id scheme\n    // rootId-n-n.n\n    const path = id.slice(pos + 1);\n    const steps = path.split(\".\");\n    if (steps.length === 1) {\n      return null;\n    }\n    steps.pop();\n    return `${id.slice(0, pos)}-${steps.join(\".\")}`;\n  }\n\n  pos = id.lastIndexOf(\"/\");\n  if (pos !== -1) {\n    // using a path scheme step/step/step\n    return id.slice(0, pos);\n  }\n};\n\ninterface TreeNavigationHookProps<Item> {\n  collectionHook: CollectionHookResult<Item>;\n  highlightedIdx: number;\n  highlightItemAtIndex: (index: number) => void;\n}\n\ninterface TreeNavigationHookResult {\n  listHandlers: {\n    onKeyDown: (evt: KeyboardEvent) => void;\n  };\n}\n\n// we need a way to set highlightedIdx when selection changes\nexport const useKeyboardNavigation = <Item>({\n  collectionHook,\n  highlightedIdx,\n  highlightItemAtIndex,\n}: TreeNavigationHookProps<Item>): TreeNavigationHookResult => {\n  const handleKeyDown = useCallback(\n    (e: KeyboardEvent) => {\n      if (e.key === ArrowLeft) {\n        const node = collectionHook.data[highlightedIdx];\n        const parentId = getNodeParentPath(node);\n        if (parentId) {\n          highlightItemAtIndex(\n            collectionHook.data.findIndex((item) => item.id === parentId),\n          );\n        }\n      }\n    },\n    [highlightedIdx, highlightItemAtIndex],\n  );\n\n  const listHandlers = {\n    onKeyDown: handleKeyDown,\n  };\n\n  return {\n    listHandlers,\n  };\n};\n"],"names":[],"mappings":";;;AAIO,MAAM,iBAAoB,GAAA,CAAC,EAAE,EAAA,EAA8B,KAAA;AAChE,EAAI,IAAA,GAAA,GAAM,EAAG,CAAA,WAAA,CAAY,GAAG,CAAA;AAC5B,EAAA,IAAI,QAAQ,EAAI,EAAA;AAGd,IAAA,MAAM,IAAO,GAAA,EAAA,CAAG,KAAM,CAAA,GAAA,GAAM,CAAC,CAAA;AAC7B,IAAM,MAAA,KAAA,GAAQ,IAAK,CAAA,KAAA,CAAM,GAAG,CAAA;AAC5B,IAAI,IAAA,KAAA,CAAM,WAAW,CAAG,EAAA;AACtB,MAAO,OAAA,IAAA;AAAA;AAET,IAAA,KAAA,CAAM,GAAI,EAAA;AACV,IAAO,OAAA,CAAA,EAAG,EAAG,CAAA,KAAA,CAAM,CAAG,EAAA,GAAG,CAAC,CAAI,CAAA,EAAA,KAAA,CAAM,IAAK,CAAA,GAAG,CAAC,CAAA,CAAA;AAAA;AAG/C,EAAM,GAAA,GAAA,EAAA,CAAG,YAAY,GAAG,CAAA;AACxB,EAAA,IAAI,QAAQ,EAAI,EAAA;AAEd,IAAO,OAAA,EAAA,CAAG,KAAM,CAAA,CAAA,EAAG,GAAG,CAAA;AAAA;AAE1B;AAeO,MAAM,wBAAwB,CAAO;AAAA,EAC1C,cAAA;AAAA,EACA,cAAA;AAAA,EACA;AACF,CAA+D,KAAA;AAC7D,EAAA,MAAM,aAAgB,GAAA,WAAA;AAAA,IACpB,CAAC,CAAqB,KAAA;AACpB,MAAI,IAAA,CAAA,CAAE,QAAQ,SAAW,EAAA;AACvB,QAAM,MAAA,IAAA,GAAO,cAAe,CAAA,IAAA,CAAK,cAAc,CAAA;AAC/C,QAAM,MAAA,QAAA,GAAW,kBAAkB,IAAI,CAAA;AACvC,QAAA,IAAI,QAAU,EAAA;AACZ,UAAA,oBAAA;AAAA,YACE,eAAe,IAAK,CAAA,SAAA,CAAU,CAAC,IAAS,KAAA,IAAA,CAAK,OAAO,QAAQ;AAAA,WAC9D;AAAA;AACF;AACF,KACF;AAAA,IACA,CAAC,gBAAgB,oBAAoB;AAAA,GACvC;AAEA,EAAA,MAAM,YAAe,GAAA;AAAA,IACnB,SAAW,EAAA;AAAA,GACb;AAEA,EAAO,OAAA;AAAA,IACL;AAAA,GACF;AACF;;;;"}

package/dist-es/tree/useTree.js.map

@@ -1 +1 @@
-{"version":3,"file":"useTree.js","sources":["../src/tree/useTree.ts"],"sourcesContent":["import {\n  type KeyboardEvent,\n  type MouseEvent,\n  useCallback,\n  useRef,\n} from \"react\";\nimport {\n  type ListHandlers,\n  type SelectionStrategy,\n  closestListItemIndex,\n  useCollapsibleGroups,\n  useKeyboardNavigation,\n  useSelection,\n  useViewportTracking,\n} from \"../common-hooks\";\nimport type { ListControlProps } from \"../list/listTypes\";\nimport type { TreeHookProps, TreeHookResult } from \"./treeTypes\";\nimport { useKeyboardNavigation as useTreeNavigation } from \"./use-tree-keyboard-navigation\";\n\nexport const useTree = <Item, Selection extends SelectionStrategy = \"default\">({\n  collectionHook,\n  containerRef,\n  contentRef = containerRef,\n  defaultSelected,\n  disabled,\n  onSelect,\n  onSelectionChange,\n  onToggle,\n  onHighlight: onHighlightProp,\n  selected: selectedProp,\n  selectionStrategy,\n}: // totalItemCount,\nTreeHookProps<Item, Selection>): TreeHookResult<Item, Selection> => {\n  const lastSelection = useRef(selectedProp || defaultSelected);\n\n  const handleKeyboardNavigation = (evt: KeyboardEvent, nextIdx: number) => {\n    selectionHook.listHandlers.onKeyboardNavigation?.(evt, nextIdx);\n  };\n\n  const { highlightedIndex: highlightedIdx, ...keyboardHook } =\n    useKeyboardNavigation<Item, Selection>({\n      containerRef,\n      indexPositions: collectionHook.data,\n      onHighlight: onHighlightProp,\n      onKeyboardNavigation: handleKeyboardNavigation,\n      selected: lastSelection.current,\n    });\n\n  const collapsibleHook = useCollapsibleGroups<Item>({\n    collapsibleHeaders: true,\n    collectionHook,\n    highlightedIdx,\n    onToggle,\n  });\n\n  const selectionHook = useSelection({\n    defaultSelected,\n    // groupSelection,\n    highlightedIdx,\n    indexPositions: collectionHook.data,\n    onSelect,\n    onSelectionChange,\n    selected: selectedProp,\n    selectionStrategy: selectionStrategy,\n  });\n\n  const treeNavigationHook = useTreeNavigation<Item>({\n    collectionHook,\n    highlightedIdx,\n    highlightItemAtIndex: keyboardHook.setHighlightedIndex,\n  });\n\n  const handleClick = useCallback(\n    (evt: MouseEvent) => {\n      collapsibleHook?.onClick?.(evt);\n      if (!evt.defaultPrevented) {\n        selectionHook.listHandlers.onClick?.(evt);\n      }\n    },\n    [collapsibleHook, selectionHook],\n  );\n\n  const handleKeyDown = useCallback(\n    (evt: KeyboardEvent) => {\n      keyboardHook.listProps.onKeyDown?.(evt);\n      if (!evt.defaultPrevented) {\n        selectionHook.listHandlers.onKeyDown?.(evt);\n      }\n      if (!evt.defaultPrevented) {\n        collapsibleHook?.onKeyDown?.(evt);\n      }\n      if (!evt.defaultPrevented) {\n        treeNavigationHook.listHandlers.onKeyDown?.(evt);\n      }\n    },\n    [\n      collapsibleHook.onKeyDown,\n      keyboardHook.listProps,\n      selectionHook.listHandlers,\n      treeNavigationHook.listHandlers,\n    ],\n  );\n\n  // This is only appropriate when we are directly controlling a List,\n  // not when a control is manipulating the list\n  const { isScrolling } = useViewportTracking({\n    containerRef,\n    contentRef,\n    highlightedIdx,\n    indexPositions: collectionHook.data,\n  });\n\n  const handleMouseMove = useCallback(\n    (evt: MouseEvent) => {\n      if (!isScrolling.current && !disabled) {\n        keyboardHook.listProps.onMouseMove();\n        const idx = closestListItemIndex(evt.target as HTMLElement);\n        if (idx !== undefined && idx !== highlightedIdx) {\n          const item = collectionHook.data[idx];\n          if (item.disabled) {\n            keyboardHook.setHighlightedIndex(-1);\n          } else {\n            keyboardHook.setHighlightedIndex(idx);\n          }\n        }\n      }\n    },\n    [\n      collectionHook.data,\n      disabled,\n      keyboardHook.setHighlightedIndex,\n      highlightedIdx,\n      isScrolling,\n    ],\n  );\n\n  const getActiveDescendant = () =>\n    highlightedIdx === undefined || highlightedIdx === -1\n      ? undefined\n      : collectionHook.data[highlightedIdx]?.id;\n\n  // We need this on reEntry for navigation hook to handle focus\n  lastSelection.current = selectionHook.selected;\n\n  const listProps: ListControlProps = {\n    \"aria-activedescendant\": getActiveDescendant(),\n    onBlur: keyboardHook.listProps.onBlur,\n    onFocus: keyboardHook.listProps.onFocus,\n    onKeyDown: handleKeyDown,\n    onMouseDownCapture: keyboardHook.listProps.onMouseDownCapture,\n    onMouseLeave: keyboardHook.listProps.onMouseLeave,\n  };\n\n  const listHandlers: ListHandlers = /*listHandlersProp || */ {\n    onClick: handleClick,\n    // MouseEnter would be much better for this. There is a bug in Cypress\n    // wheby it emits spurious MouseEnter (and MouseOver) events around\n    // keypress events, which break many tests.\n    onMouseMove: handleMouseMove,\n  };\n\n  const listItemHandlers = {\n    onClick: handleClick,\n  };\n\n  return {\n    focusVisible: keyboardHook.focusVisible,\n    highlightedIdx,\n    highlightItemAtIndex: keyboardHook.setHighlightedIndex,\n    listHandlers,\n    listProps,\n    listItemHandlers,\n    selected: selectionHook.selected,\n    setSelected: selectionHook.setSelected,\n  };\n};\n"],"names":["useTreeNavigation"],"mappings":"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"}
+{"version":3,"file":"useTree.js","sources":["../src/tree/useTree.ts"],"sourcesContent":["import {\n  type KeyboardEvent,\n  type MouseEvent,\n  useCallback,\n  useRef,\n} from \"react\";\nimport {\n  type ListHandlers,\n  type SelectionStrategy,\n  closestListItemIndex,\n  useCollapsibleGroups,\n  useKeyboardNavigation,\n  useSelection,\n  useViewportTracking,\n} from \"../common-hooks\";\nimport type { ListControlProps } from \"../list/listTypes\";\nimport type { TreeHookProps, TreeHookResult } from \"./treeTypes\";\nimport { useKeyboardNavigation as useTreeNavigation } from \"./use-tree-keyboard-navigation\";\n\nexport const useTree = <Item, Selection extends SelectionStrategy = \"default\">({\n  collectionHook,\n  containerRef,\n  contentRef = containerRef,\n  defaultSelected,\n  disabled,\n  onSelect,\n  onSelectionChange,\n  onToggle,\n  onHighlight: onHighlightProp,\n  selected: selectedProp,\n  selectionStrategy,\n}: // totalItemCount,\nTreeHookProps<Item, Selection>): TreeHookResult<Item, Selection> => {\n  const lastSelection = useRef(selectedProp || defaultSelected);\n\n  const handleKeyboardNavigation = (evt: KeyboardEvent, nextIdx: number) => {\n    selectionHook.listHandlers.onKeyboardNavigation?.(evt, nextIdx);\n  };\n\n  const { highlightedIndex: highlightedIdx, ...keyboardHook } =\n    useKeyboardNavigation<Item, Selection>({\n      containerRef,\n      indexPositions: collectionHook.data,\n      onHighlight: onHighlightProp,\n      onKeyboardNavigation: handleKeyboardNavigation,\n      selected: lastSelection.current,\n    });\n\n  const collapsibleHook = useCollapsibleGroups<Item>({\n    collapsibleHeaders: true,\n    collectionHook,\n    highlightedIdx,\n    onToggle,\n  });\n\n  const selectionHook = useSelection({\n    defaultSelected,\n    // groupSelection,\n    highlightedIdx,\n    indexPositions: collectionHook.data,\n    onSelect,\n    onSelectionChange,\n    selected: selectedProp,\n    selectionStrategy: selectionStrategy,\n  });\n\n  const treeNavigationHook = useTreeNavigation<Item>({\n    collectionHook,\n    highlightedIdx,\n    highlightItemAtIndex: keyboardHook.setHighlightedIndex,\n  });\n\n  const handleClick = useCallback(\n    (evt: MouseEvent) => {\n      collapsibleHook?.onClick?.(evt);\n      if (!evt.defaultPrevented) {\n        selectionHook.listHandlers.onClick?.(evt);\n      }\n    },\n    [collapsibleHook, selectionHook],\n  );\n\n  const handleKeyDown = useCallback(\n    (evt: KeyboardEvent) => {\n      keyboardHook.listProps.onKeyDown?.(evt);\n      if (!evt.defaultPrevented) {\n        selectionHook.listHandlers.onKeyDown?.(evt);\n      }\n      if (!evt.defaultPrevented) {\n        collapsibleHook?.onKeyDown?.(evt);\n      }\n      if (!evt.defaultPrevented) {\n        treeNavigationHook.listHandlers.onKeyDown?.(evt);\n      }\n    },\n    [\n      collapsibleHook.onKeyDown,\n      keyboardHook.listProps,\n      selectionHook.listHandlers,\n      treeNavigationHook.listHandlers,\n    ],\n  );\n\n  // This is only appropriate when we are directly controlling a List,\n  // not when a control is manipulating the list\n  const { isScrolling } = useViewportTracking({\n    containerRef,\n    contentRef,\n    highlightedIdx,\n    indexPositions: collectionHook.data,\n  });\n\n  const handleMouseMove = useCallback(\n    (evt: MouseEvent) => {\n      if (!isScrolling.current && !disabled) {\n        keyboardHook.listProps.onMouseMove();\n        const idx = closestListItemIndex(evt.target as HTMLElement);\n        if (idx !== undefined && idx !== highlightedIdx) {\n          const item = collectionHook.data[idx];\n          if (item.disabled) {\n            keyboardHook.setHighlightedIndex(-1);\n          } else {\n            keyboardHook.setHighlightedIndex(idx);\n          }\n        }\n      }\n    },\n    [\n      collectionHook.data,\n      disabled,\n      keyboardHook.setHighlightedIndex,\n      highlightedIdx,\n      isScrolling,\n    ],\n  );\n\n  const getActiveDescendant = () =>\n    highlightedIdx === undefined || highlightedIdx === -1\n      ? undefined\n      : collectionHook.data[highlightedIdx]?.id;\n\n  // We need this on reEntry for navigation hook to handle focus\n  lastSelection.current = selectionHook.selected;\n\n  const listProps: ListControlProps = {\n    \"aria-activedescendant\": getActiveDescendant(),\n    onBlur: keyboardHook.listProps.onBlur,\n    onFocus: keyboardHook.listProps.onFocus,\n    onKeyDown: handleKeyDown,\n    onMouseDownCapture: keyboardHook.listProps.onMouseDownCapture,\n    onMouseLeave: keyboardHook.listProps.onMouseLeave,\n  };\n\n  const listHandlers: ListHandlers = /*listHandlersProp || */ {\n    onClick: handleClick,\n    // MouseEnter would be much better for this. There is a bug in Cypress\n    // wheby it emits spurious MouseEnter (and MouseOver) events around\n    // keypress events, which break many tests.\n    onMouseMove: handleMouseMove,\n  };\n\n  const listItemHandlers = {\n    onClick: handleClick,\n  };\n\n  return {\n    focusVisible: keyboardHook.focusVisible,\n    highlightedIdx,\n    highlightItemAtIndex: keyboardHook.setHighlightedIndex,\n    listHandlers,\n    listProps,\n    listItemHandlers,\n    selected: selectionHook.selected,\n    setSelected: selectionHook.setSelected,\n  };\n};\n"],"names":["useTreeNavigation"],"mappings":"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"}

package/dist-es/utils/useClickOutside.js.map

@@ -1 +1 @@
-{"version":3,"file":"useClickOutside.js","sources":["../src/utils/useClickOutside.ts"],"sourcesContent":["import { type Ref, useEffect, useRef } from \"react\";\n\nconst defaultTriggerEvents: MouseEvents[] = [\"mousedown\"];\n\ntype MouseEvents = keyof {\n  [K in keyof GlobalEventHandlersEventMap as GlobalEventHandlersEventMap[K] extends MouseEvent\n    ? K\n    : never]: GlobalEventHandlersEventMap[K];\n};\n\nexport function useClickOutside<Element extends HTMLElement>(\n  handler: () => void,\n  triggerEvents?: MouseEvents[],\n  containers?: HTMLElement[],\n): Ref<Element> {\n  const ref = useRef<Element>(null);\n\n  useEffect(() => {\n    const handleEvent = (event: MouseEvent) => {\n      if (Array.isArray(containers)) {\n        const shouldCallHandler = containers.every((node) => {\n          return !node?.contains(event.target as Node);\n        });\n        shouldCallHandler && handler();\n      } else if (!ref.current?.contains(event.target as Node)) {\n        handler();\n      }\n    };\n\n    const events = triggerEvents ?? defaultTriggerEvents;\n\n    events.forEach((event) => {\n      document.addEventListener(event, handleEvent);\n    });\n\n    return () => {\n      events.forEach((event) => {\n        document.removeEventListener(event, handleEvent);\n      });\n    };\n  }, [handler, containers, triggerEvents]);\n\n  return ref;\n}\n"],"names":[],"mappings":";;AAEA,MAAM,oBAAA,GAAsC,CAAC,WAAW,CAAA;AAQxC,SAAA,eAAA,CACd,OACA,EAAA,aAAA,EACA,UACc,EAAA;AACd,EAAM,MAAA,GAAA,GAAM,OAAgB,IAAI,CAAA;AAEhC,EAAA,SAAA,CAAU,MAAM;AACd,IAAM,MAAA,WAAA,GAAc,CAAC,KAAsB,KAAA;AAlB/C,MAAA,IAAA,EAAA;AAmBM,MAAI,IAAA,KAAA,CAAM,OAAQ,CAAA,UAAU,CAAG,EAAA;AAC7B,QAAA,MAAM,iBAAoB,GAAA,UAAA,CAAW,KAAM,CAAA,CAAC,IAAS,KAAA;AACnD,UAAO,OAAA,EAAC,IAAM,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,IAAA,CAAA,QAAA,CAAS,KAAM,CAAA,MAAA,CAAA,CAAA;AAAA,SAC9B,CAAA;AACD,QAAA,iBAAA,IAAqB,OAAQ,EAAA;AAAA,iBACpB,EAAC,CAAA,EAAA,GAAA,GAAA,CAAI,YAAJ,IAAa,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,QAAA,CAAS,MAAM,MAAiB,CAAA,CAAA,EAAA;AACvD,QAAQ,OAAA,EAAA;AAAA;AACV,KACF;AAEA,IAAA,MAAM,SAAS,aAAiB,IAAA,oBAAA;AAEhC,IAAO,MAAA,CAAA,OAAA,CAAQ,CAAC,KAAU,KAAA;AACxB,MAAS,QAAA,CAAA,gBAAA,CAAiB,OAAO,WAAW,CAAA;AAAA,KAC7C,CAAA;AAED,IAAA,OAAO,MAAM;AACX,MAAO,MAAA,CAAA,OAAA,CAAQ,CAAC,KAAU,KAAA;AACxB,QAAS,QAAA,CAAA,mBAAA,CAAoB,OAAO,WAAW,CAAA;AAAA,OAChD,CAAA;AAAA,KACH;AAAA,GACC,EAAA,CAAC,OAAS,EAAA,UAAA,EAAY,aAAa,CAAC,CAAA;AAEvC,EAAO,OAAA,GAAA;AACT;;;;"}
+{"version":3,"file":"useClickOutside.js","sources":["../src/utils/useClickOutside.ts"],"sourcesContent":["import { type Ref, useEffect, useRef } from \"react\";\n\nconst defaultTriggerEvents: MouseEvents[] = [\"mousedown\"];\n\ntype MouseEvents = keyof {\n  [K in keyof GlobalEventHandlersEventMap as GlobalEventHandlersEventMap[K] extends MouseEvent\n    ? K\n    : never]: GlobalEventHandlersEventMap[K];\n};\n\nexport function useClickOutside<Element extends HTMLElement>(\n  handler: () => void,\n  triggerEvents?: MouseEvents[],\n  containers?: HTMLElement[],\n): Ref<Element> {\n  const ref = useRef<Element>(null);\n\n  useEffect(() => {\n    const handleEvent = (event: MouseEvent) => {\n      if (Array.isArray(containers)) {\n        const shouldCallHandler = containers.every((node) => {\n          return !node?.contains(event.target as Node);\n        });\n        shouldCallHandler && handler();\n      } else if (!ref.current?.contains(event.target as Node)) {\n        handler();\n      }\n    };\n\n    const events = triggerEvents ?? defaultTriggerEvents;\n\n    events.forEach((event) => {\n      document.addEventListener(event, handleEvent);\n    });\n\n    return () => {\n      events.forEach((event) => {\n        document.removeEventListener(event, handleEvent);\n      });\n    };\n  }, [handler, containers, triggerEvents]);\n\n  return ref;\n}\n"],"names":[],"mappings":";;AAEA,MAAM,oBAAA,GAAsC,CAAC,WAAW,CAAA;AAQxC,SAAA,eAAA,CACd,OACA,EAAA,aAAA,EACA,UACc,EAAA;AACd,EAAM,MAAA,GAAA,GAAM,OAAgB,IAAI,CAAA;AAEhC,EAAA,SAAA,CAAU,MAAM;AACd,IAAM,MAAA,WAAA,GAAc,CAAC,KAAsB,KAAA;AAlB/C,MAAA,IAAA,EAAA;AAmBM,MAAI,IAAA,KAAA,CAAM,OAAQ,CAAA,UAAU,CAAG,EAAA;AAC7B,QAAA,MAAM,iBAAoB,GAAA,UAAA,CAAW,KAAM,CAAA,CAAC,IAAS,KAAA;AACnD,UAAO,OAAA,EAAC,IAAM,IAAA,IAAA,GAAA,MAAA,GAAA,IAAA,CAAA,QAAA,CAAS,KAAM,CAAA,MAAA,CAAA,CAAA;AAAA,SAC9B,CAAA;AACD,QAAA,iBAAA,IAAqB,OAAQ,EAAA;AAAA,iBACpB,EAAC,CAAA,EAAA,GAAA,GAAA,CAAI,YAAJ,IAAa,GAAA,MAAA,GAAA,EAAA,CAAA,QAAA,CAAS,MAAM,MAAiB,CAAA,CAAA,EAAA;AACvD,QAAQ,OAAA,EAAA;AAAA;AACV,KACF;AAEA,IAAA,MAAM,SAAS,aAAiB,IAAA,oBAAA;AAEhC,IAAO,MAAA,CAAA,OAAA,CAAQ,CAAC,KAAU,KAAA;AACxB,MAAS,QAAA,CAAA,gBAAA,CAAiB,OAAO,WAAW,CAAA;AAAA,KAC7C,CAAA;AAED,IAAA,OAAO,MAAM;AACX,MAAO,MAAA,CAAA,OAAA,CAAQ,CAAC,KAAU,KAAA;AACxB,QAAS,QAAA,CAAA,mBAAA,CAAoB,OAAO,WAAW,CAAA;AAAA,OAChD,CAAA;AAAA,KACH;AAAA,GACC,EAAA,CAAC,OAAS,EAAA,UAAA,EAAY,aAAa,CAAC,CAAA;AAEvC,EAAO,OAAA,GAAA;AACT;;;;"}

package/dist-es/utils/useSlideSelection.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSlideSelection.js","sources":["../src/utils/useSlideSelection.ts"],"sourcesContent":["import { useState } from \"react\";\nimport type { LayoutAnimationTransition } from \"../deck-layout\";\n\nexport const useSlideSelection = (\n  initialValue?: number,\n): [\n  LayoutAnimationTransition | undefined,\n  number,\n  (sliderIndex: number, transition?: LayoutAnimationTransition) => void,\n] => {\n  const [selectedSlide, setSelectedSlide] = useState(initialValue || 0);\n  const [selectedTransition, setSelectedTransition] = useState<\n    LayoutAnimationTransition | undefined\n  >(undefined);\n\n  const handleSlideSelection = (\n    sliderIndex: number,\n    transition?: LayoutAnimationTransition,\n  ) => {\n    const newTransition = transition\n      ? transition\n      : selectedSlide < sliderIndex\n        ? \"increase\"\n        : \"decrease\";\n    setSelectedSlide(sliderIndex);\n    setSelectedTransition(newTransition);\n  };\n  return [selectedTransition, selectedSlide, handleSlideSelection];\n};\n"],"names":[],"mappings":";;AAGa,MAAA,iBAAA,GAAoB,CAC/B,YAKG,KAAA;AACH,EAAA,MAAM,CAAC,aAAe,EAAA,gBAAgB,CAAI,GAAA,QAAA,CAAS,gBAAgB,CAAC,CAAA;AACpE,EAAA,MAAM,CAAC,kBAAA,EAAoB,qBAAqB,CAAA,GAAI,SAElD,KAAS,CAAA,CAAA;AAEX,EAAM,MAAA,oBAAA,GAAuB,CAC3B,WAAA,EACA,UACG,KAAA;AACH,IAAA,MAAM,aAAgB,GAAA,UAAA,GAClB,UACA,GAAA,aAAA,GAAgB,cACd,UACA,GAAA,UAAA;AACN,IAAA,gBAAA,CAAiB,WAAW,CAAA;AAC5B,IAAA,qBAAA,CAAsB,aAAa,CAAA;AAAA,GACrC;AACA,EAAO,OAAA,CAAC,kBAAoB,EAAA,aAAA,EAAe,oBAAoB,CAAA;AACjE;;;;"}
+{"version":3,"file":"useSlideSelection.js","sources":["../src/utils/useSlideSelection.ts"],"sourcesContent":["import { useState } from \"react\";\nimport type { LayoutAnimationTransition } from \"../deck-layout\";\n\nexport const useSlideSelection = (\n  initialValue?: number,\n): [\n  LayoutAnimationTransition | undefined,\n  number,\n  (sliderIndex: number, transition?: LayoutAnimationTransition) => void,\n] => {\n  const [selectedSlide, setSelectedSlide] = useState(initialValue || 0);\n  const [selectedTransition, setSelectedTransition] = useState<\n    LayoutAnimationTransition | undefined\n  >(undefined);\n\n  const handleSlideSelection = (\n    sliderIndex: number,\n    transition?: LayoutAnimationTransition,\n  ) => {\n    const newTransition = transition\n      ? transition\n      : selectedSlide < sliderIndex\n        ? \"increase\"\n        : \"decrease\";\n    setSelectedSlide(sliderIndex);\n    setSelectedTransition(newTransition);\n  };\n  return [selectedTransition, selectedSlide, handleSlideSelection];\n};\n"],"names":[],"mappings":";;AAGa,MAAA,iBAAA,GAAoB,CAC/B,YAKG,KAAA;AACH,EAAA,MAAM,CAAC,aAAe,EAAA,gBAAgB,CAAI,GAAA,QAAA,CAAS,gBAAgB,CAAC,CAAA;AACpE,EAAA,MAAM,CAAC,kBAAA,EAAoB,qBAAqB,CAAA,GAAI,SAElD,MAAS,CAAA;AAEX,EAAM,MAAA,oBAAA,GAAuB,CAC3B,WAAA,EACA,UACG,KAAA;AACH,IAAA,MAAM,aAAgB,GAAA,UAAA,GAClB,UACA,GAAA,aAAA,GAAgB,cACd,UACA,GAAA,UAAA;AACN,IAAA,gBAAA,CAAiB,WAAW,CAAA;AAC5B,IAAA,qBAAA,CAAsB,aAAa,CAAA;AAAA,GACrC;AACA,EAAO,OAAA,CAAC,kBAAoB,EAAA,aAAA,EAAe,oBAAoB,CAAA;AACjE;;;;"}

package/dist-es/window/ElectronWindow.js

@@ -2,7 +2,7 @@ import { jsx } from 'react/jsx-runtime';
 import { useForkRef, useIsomorphicLayoutEffect, SaltProvider } from '@salt-ds/core';
 import { forwardRef, useState, useRef, useCallback, useEffect } from 'react';
 import ReactDOM from 'react-dom';
-import { isDesktop, Window as Window$1 } from './WindowContext.js';
+import { Window as Window$1, isDesktop } from './WindowContext.js';
 import { useComponentCssInjection } from '@salt-ds/styles';
 import { useWindow } from '@salt-ds/window';
 import css_248z from './ElectronWindow.css.js';

package/dist-es/window/ElectronWindow.js.map

@@ -1 +1 @@
-{"version":3,"file":"ElectronWindow.js","sources":["../src/window/ElectronWindow.tsx"],"sourcesContent":["import {\n  SaltProvider,\n  useForkRef,\n  useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { forwardRef, useCallback, useEffect, useRef, useState } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport {\n  Window as SaltWindow,\n  type WindowProps,\n  isDesktop,\n} from \"./WindowContext\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport electronWindowCss from \"./ElectronWindow.css\";\nimport { WindowParentContext, useWindowParentContext } from \"./desktop-utils\";\n\nconst Window = forwardRef<HTMLDivElement, WindowProps>(function ElectronWindow(\n  { className, children, id = \"dialog\", open = true, style = {}, ...rest },\n  forwardedRef,\n): JSX.Element | null {\n  const { top, left, position, ...styleRest } = style;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-electron-window\",\n    css: electronWindowCss,\n    window: targetWindow,\n  });\n\n  const [mountNode, setMountNode] = useState<Element | null>(null);\n  const windowRoot = useRef<HTMLDivElement>(null);\n\n  const forkedRef = useForkRef(forwardedRef, windowRoot);\n\n  if (!mountNode) {\n    const win = window.open(\"\", id);\n    win?.document.write(\n      `<html lang=\"en\"><head><title>${id}</title><base href=\"${location.origin}\"><style>body {margin: 0;}</style></head><body></body></html>`,\n    );\n    document.head.querySelectorAll(\"style\").forEach((htmlElement) => {\n      (win as Window).document.head.appendChild(htmlElement.cloneNode(true));\n    });\n    const bodyElement = (win as Window).document.body;\n    setMountNode(bodyElement);\n  }\n\n  const parentWindow = useWindowParentContext();\n\n  const closeWindow = useCallback(() => {\n    // biome-ignore lint/suspicious/noExplicitAny: any is simpler here.\n    const { ipcRenderer } = global as any;\n    if (ipcRenderer) {\n      ipcRenderer.send(\"window-close\", { id: id });\n    }\n  }, [id]);\n\n  // The timeout is required to give the Dialog component time to report the correct height\n  // otherwise the window will be smaller than expected\n  useEffect(() => {\n    setTimeout(() => {\n      if (windowRoot.current) {\n        const { scrollHeight: height, scrollWidth: width } = windowRoot.current;\n        // biome-ignore lint/suspicious/noExplicitAny: any is simpler here.\n        const { ipcRenderer } = global as any;\n        if (ipcRenderer) {\n          ipcRenderer.send(\"window-size\", {\n            id: id,\n            height: Math.ceil(height + 1),\n            width: Math.ceil(width + 1),\n          });\n        }\n      }\n    }, 80);\n  });\n\n  // The timeout is required to allow the window time to be moved into position and scaled\n  // before being shown to the user,\n  useEffect(() => {\n    // biome-ignore lint/suspicious/noExplicitAny: any is simpler here.\n    const { ipcRenderer } = global as any;\n    if (ipcRenderer) {\n      setTimeout(() => {\n        ipcRenderer.send(\"window-ready\", { id: id });\n      }, 100);\n    }\n\n    return () => {\n      closeWindow();\n    };\n  }, [closeWindow, id]);\n\n  // The timeout is required to give the Dialog component time to report the correct height\n  // otherwise the window will be smaller than expected\n  useIsomorphicLayoutEffect(() => {\n    setTimeout(() => {\n      // biome-ignore lint/suspicious/noExplicitAny: any is simpler here.\n      const { ipcRenderer } = global as any;\n      if (ipcRenderer) {\n        ipcRenderer.send(\"window-position\", {\n          id: id,\n          parentWindowID: parentWindow.id,\n          left: style.left,\n          top: style.top,\n        });\n      }\n    }, 90);\n  }, [style, id, parentWindow.id]);\n\n  return mountNode\n    ? ReactDOM.createPortal(\n        <SaltProvider>\n          <WindowParentContext.Provider\n            value={{\n              top: (style.top as number) + parentWindow.top,\n              left: (style.left as number) + parentWindow.left,\n              id: id,\n            }}\n          >\n            <div className=\"saltWindow\" ref={forkedRef}>\n              <div className={className} style={{ ...styleRest }} {...rest}>\n                {children}\n              </div>\n            </div>\n          </WindowParentContext.Provider>\n        </SaltProvider>,\n        mountNode,\n      )\n    : null;\n});\n\nexport const ElectronWindow = isDesktop ? Window : SaltWindow;\n"],"names":["ElectronWindow","electronWindowCss","SaltWindow"],"mappings":"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"}
+{"version":3,"file":"ElectronWindow.js","sources":["../src/window/ElectronWindow.tsx"],"sourcesContent":["import {\n  SaltProvider,\n  useForkRef,\n  useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { forwardRef, useCallback, useEffect, useRef, useState } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport {\n  Window as SaltWindow,\n  type WindowProps,\n  isDesktop,\n} from \"./WindowContext\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport electronWindowCss from \"./ElectronWindow.css\";\nimport { WindowParentContext, useWindowParentContext } from \"./desktop-utils\";\n\nconst Window = forwardRef<HTMLDivElement, WindowProps>(function ElectronWindow(\n  { className, children, id = \"dialog\", open = true, style = {}, ...rest },\n  forwardedRef,\n): JSX.Element | null {\n  const { top, left, position, ...styleRest } = style;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-electron-window\",\n    css: electronWindowCss,\n    window: targetWindow,\n  });\n\n  const [mountNode, setMountNode] = useState<Element | null>(null);\n  const windowRoot = useRef<HTMLDivElement>(null);\n\n  const forkedRef = useForkRef(forwardedRef, windowRoot);\n\n  if (!mountNode) {\n    const win = window.open(\"\", id);\n    win?.document.write(\n      `<html lang=\"en\"><head><title>${id}</title><base href=\"${location.origin}\"><style>body {margin: 0;}</style></head><body></body></html>`,\n    );\n    document.head.querySelectorAll(\"style\").forEach((htmlElement) => {\n      (win as Window).document.head.appendChild(htmlElement.cloneNode(true));\n    });\n    const bodyElement = (win as Window).document.body;\n    setMountNode(bodyElement);\n  }\n\n  const parentWindow = useWindowParentContext();\n\n  const closeWindow = useCallback(() => {\n    // biome-ignore lint/suspicious/noExplicitAny: any is simpler here.\n    const { ipcRenderer } = global as any;\n    if (ipcRenderer) {\n      ipcRenderer.send(\"window-close\", { id: id });\n    }\n  }, [id]);\n\n  // The timeout is required to give the Dialog component time to report the correct height\n  // otherwise the window will be smaller than expected\n  useEffect(() => {\n    setTimeout(() => {\n      if (windowRoot.current) {\n        const { scrollHeight: height, scrollWidth: width } = windowRoot.current;\n        // biome-ignore lint/suspicious/noExplicitAny: any is simpler here.\n        const { ipcRenderer } = global as any;\n        if (ipcRenderer) {\n          ipcRenderer.send(\"window-size\", {\n            id: id,\n            height: Math.ceil(height + 1),\n            width: Math.ceil(width + 1),\n          });\n        }\n      }\n    }, 80);\n  });\n\n  // The timeout is required to allow the window time to be moved into position and scaled\n  // before being shown to the user,\n  useEffect(() => {\n    // biome-ignore lint/suspicious/noExplicitAny: any is simpler here.\n    const { ipcRenderer } = global as any;\n    if (ipcRenderer) {\n      setTimeout(() => {\n        ipcRenderer.send(\"window-ready\", { id: id });\n      }, 100);\n    }\n\n    return () => {\n      closeWindow();\n    };\n  }, [closeWindow, id]);\n\n  // The timeout is required to give the Dialog component time to report the correct height\n  // otherwise the window will be smaller than expected\n  useIsomorphicLayoutEffect(() => {\n    setTimeout(() => {\n      // biome-ignore lint/suspicious/noExplicitAny: any is simpler here.\n      const { ipcRenderer } = global as any;\n      if (ipcRenderer) {\n        ipcRenderer.send(\"window-position\", {\n          id: id,\n          parentWindowID: parentWindow.id,\n          left: style.left,\n          top: style.top,\n        });\n      }\n    }, 90);\n  }, [style, id, parentWindow.id]);\n\n  return mountNode\n    ? ReactDOM.createPortal(\n        <SaltProvider>\n          <WindowParentContext.Provider\n            value={{\n              top: (style.top as number) + parentWindow.top,\n              left: (style.left as number) + parentWindow.left,\n              id: id,\n            }}\n          >\n            <div className=\"saltWindow\" ref={forkedRef}>\n              <div className={className} style={{ ...styleRest }} {...rest}>\n                {children}\n              </div>\n            </div>\n          </WindowParentContext.Provider>\n        </SaltProvider>,\n        mountNode,\n      )\n    : null;\n});\n\nexport const ElectronWindow = isDesktop ? Window : SaltWindow;\n"],"names":["ElectronWindow","electronWindowCss","SaltWindow"],"mappings":"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"}

package/dist-types/calendar/Calendar.d.ts

@@ -1,6 +1,7 @@
+import { type ResponsiveProp } from "@salt-ds/core";
 import { type ComponentPropsWithoutRef, type ReactNode } from "react";
 import { type UseCalendarMultiSelectProps, type UseCalendarOffsetProps, type UseCalendarRangeProps, type UseCalendarSingleProps } from "./useCalendar";
-import type { DateFrameworkType } from "@salt-ds/date-adapters";
+import type { DateFrameworkType, Timezone } from "@salt-ds/date-adapters";
 /**
  * Base props for the Calendar component.
  */
@@ -14,12 +15,26 @@ export interface CalendarBaseProps extends ComponentPropsWithoutRef<"div"> {
      */
     hideOutOfRangeDates?: boolean;
     /**
-     * Locale for date formatting
+     * Ref to attach to the focused element,enabling focus to be controlled.
      */
-    locale?: any;
+    focusedDateRef?: React.MutableRefObject<HTMLElement | null>;
+    /**
+     * Number of visible months, maximum 12, defaults to 1
+     */
+    numberOfVisibleMonths?: ResponsiveProp<1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12>;
+    /**
+     * Specifies the timezone behavior:
+     * - If undefined, the timezone will be derived from the passed date, or from `defaultSelectedDate`/`selectedDate`.
+     * - If set to "default", the default timezone of the date library will be used.
+     * - If set to "system", the local system's timezone will be applied.
+     * - If set to "UTC", the time will be returned in UTC.
+     * - If set to a valid IANA timezone identifier, the time will be returned for that specific timezone.
+     */
+    timezone?: Timezone;
 }
 /**
  * Props for the Calendar component with single date selection.
+ * @template TDate - The type of the date object.
  */
 export interface CalendarSingleProps<TDate extends DateFrameworkType> extends CalendarBaseProps, UseCalendarSingleProps<TDate> {
     /**
@@ -29,6 +44,7 @@ export interface CalendarSingleProps<TDate extends DateFrameworkType> extends Ca
 }
 /**
  * Props for the Calendar component with date range selection.
+ * @template TDate - The type of the date object.
  */
 export interface CalendarRangeProps<TDate extends DateFrameworkType> extends CalendarBaseProps, UseCalendarRangeProps<TDate> {
     /**
@@ -38,6 +54,7 @@ export interface CalendarRangeProps<TDate extends DateFrameworkType> extends Cal
 }
 /**
  * Props for the Calendar component with multi-select date selection.
+ * @template TDate - The type of the date object.
  */
 export interface CalendarMultiSelectProps<TDate extends DateFrameworkType> extends CalendarBaseProps, UseCalendarMultiSelectProps<TDate> {
     /**
@@ -47,6 +64,7 @@ export interface CalendarMultiSelectProps<TDate extends DateFrameworkType> exten
 }
 /**
  * Props for the Calendar component with offset date selection.
+ * @template TDate - The type of the date object.
  */
 export interface CalendarOffsetProps<TDate extends DateFrameworkType> extends CalendarBaseProps, UseCalendarOffsetProps<TDate> {
     /**
@@ -56,6 +74,7 @@ export interface CalendarOffsetProps<TDate extends DateFrameworkType> extends Ca
 }
 /**
  * Type representing the props for the Calendar component with various selection variants.
+ * @template TDate - The type of the date object.
  */
 export declare type CalendarProps<TDate extends DateFrameworkType> = CalendarSingleProps<TDate> | CalendarRangeProps<TDate> | CalendarMultiSelectProps<TDate> | CalendarOffsetProps<TDate>;
 export declare const Calendar: import("react").ForwardRefExoticComponent<CalendarProps<any> & import("react").RefAttributes<HTMLDivElement>>;

package/dist-types/calendar/CalendarGrid.d.ts

@@ -1,13 +1,29 @@
+import { type ResponsiveProp } from "@salt-ds/core";
 import { type ComponentPropsWithoutRef } from "react";
-import { type CalendarMonthProps } from "./internal/CalendarMonth";
+import type { CalendarDayProps } from "./internal/CalendarDay";
 import type { DateFrameworkType } from "@salt-ds/date-adapters";
+import { type CalendarMonthHeaderProps } from "./CalendarMonthHeader";
+import { type CalendarWeekHeaderProps } from "./CalendarWeekHeader";
 /**
  * Props for the CalendarGrid component.
+ * @template TDate - The type of the date object.
  */
 export interface CalendarGridProps<TDate extends DateFrameworkType> extends ComponentPropsWithoutRef<"div"> {
     /**
-     * Props getter to pass to each CalendarMonth element
+     * Number of columns
      */
-    getCalendarMonthProps?: (date: TDate) => Omit<CalendarMonthProps<TDate>, "date">;
+    columns?: ResponsiveProp<number | string>;
+    /**
+     * Props for `CalendarWeekHeader`
+     */
+    CalendarWeekHeaderProps?: Partial<CalendarWeekHeaderProps>;
+    /**
+     * Props for `CalendarMonthHeader`
+     */
+    CalendarMonthHeaderProps?: Partial<CalendarMonthHeaderProps<TDate>>;
+    /**
+     * Props for `CalendarDay`
+     */
+    CalendarDayProps?: Partial<CalendarDayProps<TDate>>;
 }
 export declare const CalendarGrid: import("react").ForwardRefExoticComponent<CalendarGridProps<any> & import("react").RefAttributes<HTMLDivElement>>;

package/dist-types/calendar/CalendarMonthHeader.d.ts

@@ -0,0 +1,18 @@
+import { type ComponentPropsWithRef } from "react";
+import type { DateFrameworkType } from "@salt-ds/date-adapters";
+/**
+ * Props for the CalendarMonthHeader component.
+ * @template TDate - The type of the date object.
+ */
+export interface CalendarMonthHeaderProps<TDate extends DateFrameworkType> extends ComponentPropsWithRef<"div"> {
+    /**
+     * Month value
+     */
+    month: TDate;
+    /**
+     * Format the month value
+     * @param date
+     */
+    format?: string;
+}
+export declare const CalendarMonthHeader: import("react").ForwardRefExoticComponent<Omit<CalendarMonthHeaderProps<any>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist-types/calendar/CalendarNavigation.d.ts

@@ -3,6 +3,7 @@ import type { DateFrameworkType } from "@salt-ds/date-adapters";
 import { type ComponentPropsWithRef } from "react";
 /**
  * Props for the CalendarNavigation component.
+ * @template TDate - The type of the date object.
  */
 export interface CalendarNavigationProps<TDate extends DateFrameworkType> extends ComponentPropsWithRef<"div"> {
     /**
@@ -28,11 +29,19 @@ export interface CalendarNavigationProps<TDate extends DateFrameworkType> extend
      * @param event - The click event.
      */
     onNavigateNext?: ButtonProps["onClick"];
+    /**
+     * If `true` then navigate next button is enabled
+     */
+    disableNavigateNext?: boolean;
     /**
      * Callback fired when navigating to the previous month.
      * @param event - The click event.
      */
     onNavigatePrevious?: ButtonProps["onClick"];
+    /**
+     * If `true` then navigate previous button is enabled
+     */
+    disableNavigatePrevious?: boolean;
     /**
      * If `true`, hides the year dropdown.
      */

package/dist-types/calendar/index.d.ts

@@ -5,3 +5,4 @@ export * from "./CalendarGrid";
 export * from "./useCalendarDay";
 export * from "./useCalendar";
 export * from "./useCalendarSelection";
+export type { renderCalendarDayProps, CalendarDayProps, } from "./internal/CalendarDay";

package/dist-types/calendar/internal/CalendarDay.d.ts

@@ -1,13 +1,32 @@
-import { type TooltipProps } from "@salt-ds/core";
-import { type ComponentPropsWithRef, type ReactElement } from "react";
+import { type RenderPropsType, type TooltipProps } from "@salt-ds/core";
+import { type ComponentPropsWithRef } from "react";
 import { type DayStatus } from "../useCalendarDay";
-export declare type DateFormatter = (day: Date) => string | undefined;
 export interface CalendarDayProps<TDate> extends Omit<ComponentPropsWithRef<"button">, "children"> {
-    day: TDate;
+    /**
+     * Day date
+     */
+    date: TDate;
+    /**
+     * Format of date
+     */
     format?: string;
-    renderDayContents?: (date: TDate, status: DayStatus) => ReactElement;
-    status?: DayStatus;
+    /**
+     * Render prop to enable customisation of day button.
+     */
+    render?: RenderPropsType["render"];
+    /**
+     * Month being rendered
+     */
     month: TDate;
+    /**
+     * Additional Tooltip props
+     */
     TooltipProps?: Partial<TooltipProps>;
 }
+export interface renderCalendarDayProps<TDate> extends CalendarDayProps<TDate> {
+    /**
+     * Status of day
+     */
+    status: DayStatus;
+}
 export declare const CalendarDay: import("react").ForwardRefExoticComponent<Omit<CalendarDayProps<any>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;

package/dist-types/calendar/internal/CalendarMonth.d.ts

@@ -6,12 +6,8 @@ export interface CalendarMonthProps<TDate> extends ComponentPropsWithRef<"div">
      */
     date: TDate;
     /**
-     * Function to render the contents of a day.
+     * Props for the CalendarDay component.
      */
-    renderDayContents?: CalendarDayProps<TDate>["renderDayContents"];
-    /**
-     * Props for the tooltip component.
-     */
-    TooltipProps?: CalendarDayProps<TDate>["TooltipProps"];
+    CalendarDayProps?: Partial<CalendarDayProps<TDate>>;
 }
 export declare const CalendarMonth: import("react").ForwardRefExoticComponent<Omit<CalendarMonthProps<any>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist-types/calendar/internal/utils.d.ts

@@ -1,10 +1,6 @@
-import type { DateFrameworkType, SaltDateAdapter } from "@salt-ds/date-adapters";
-export declare function daysOfWeek<TDate extends DateFrameworkType>(dateAdapter: SaltDateAdapter<TDate>, format: "long" | "short" | "narrow", locale?: any): string[];
+import type { DateFrameworkType, SaltDateAdapter, Timezone } from "@salt-ds/date-adapters";
+export declare function daysOfWeek<TDate extends DateFrameworkType>(dateAdapter: SaltDateAdapter<TDate>, format: "long" | "short" | "narrow"): string[];
 export declare function generateMonthsForYear<TDate extends DateFrameworkType>(dateAdapter: SaltDateAdapter<TDate>, currentYear: TDate): TDate[];
-export declare function generateVisibleDays<TDate extends DateFrameworkType>(dateAdapter: SaltDateAdapter<TDate>, currentMonth: TDate, locale?: any): {
-    date: TDate;
-    dateOfMonth: number;
-    isCurrentMonth: boolean;
-}[];
+export declare function generateVisibleDays<TDate extends DateFrameworkType>(dateAdapter: SaltDateAdapter<TDate>, currentMonth: TDate, timezone: Timezone): TDate[];
 export declare function monthDiff<TDate extends DateFrameworkType>(dateAdapter: SaltDateAdapter<TDate>, a: TDate, b: TDate): number;
 export declare function generateDatesForMonth<TDate extends DateFrameworkType>(dateAdapter: SaltDateAdapter<TDate>, date: TDate): TDate[];