@salt-ds/lab 1.0.0-alpha.92 → 1.0.0-alpha.94

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (204) hide show
  1. package/CHANGELOG.md +116 -0
  2. package/css/salt-lab.css +166 -249
  3. package/dist-cjs/index.js +6 -24
  4. package/dist-cjs/index.js.map +1 -1
  5. package/dist-cjs/toolbar-next/ToolbarContentNext.css.js +6 -0
  6. package/dist-cjs/toolbar-next/ToolbarContentNext.css.js.map +1 -0
  7. package/dist-cjs/toolbar-next/ToolbarContentNext.js +32 -0
  8. package/dist-cjs/toolbar-next/ToolbarContentNext.js.map +1 -0
  9. package/dist-cjs/toolbar-next/ToolbarNext.css.js +6 -0
  10. package/dist-cjs/toolbar-next/ToolbarNext.css.js.map +1 -0
  11. package/dist-cjs/toolbar-next/ToolbarNext.js +394 -0
  12. package/dist-cjs/toolbar-next/ToolbarNext.js.map +1 -0
  13. package/dist-cjs/toolbar-next/ToolbarNextOverflow.css.js +6 -0
  14. package/dist-cjs/toolbar-next/ToolbarNextOverflow.css.js.map +1 -0
  15. package/dist-cjs/toolbar-next/ToolbarNextOverflow.js +705 -0
  16. package/dist-cjs/toolbar-next/ToolbarNextOverflow.js.map +1 -0
  17. package/dist-cjs/toolbar-next/ToolbarNextOverflowFloatingBoundary.js +165 -0
  18. package/dist-cjs/toolbar-next/ToolbarNextOverflowFloatingBoundary.js.map +1 -0
  19. package/dist-cjs/toolbar-next/TooltrayNext.css.js +6 -0
  20. package/dist-cjs/toolbar-next/TooltrayNext.css.js.map +1 -0
  21. package/dist-cjs/toolbar-next/TooltrayNext.js +55 -0
  22. package/dist-cjs/toolbar-next/TooltrayNext.js.map +1 -0
  23. package/dist-cjs/toolbar-next/toolbarNextKeyboardUtils.js +391 -0
  24. package/dist-cjs/toolbar-next/toolbarNextKeyboardUtils.js.map +1 -0
  25. package/dist-cjs/toolbar-next/toolbarNextUtils.js +215 -0
  26. package/dist-cjs/toolbar-next/toolbarNextUtils.js.map +1 -0
  27. package/dist-cjs/toolbar-next/useToolbarNextKeyboardNavigation.js +334 -0
  28. package/dist-cjs/toolbar-next/useToolbarNextKeyboardNavigation.js.map +1 -0
  29. package/dist-cjs/toolbar-next/useToolbarNextOverflow.js +743 -0
  30. package/dist-cjs/toolbar-next/useToolbarNextOverflow.js.map +1 -0
  31. package/dist-es/index.js +3 -12
  32. package/dist-es/index.js.map +1 -1
  33. package/dist-es/toolbar-next/ToolbarContentNext.css.js +4 -0
  34. package/dist-es/toolbar-next/ToolbarContentNext.css.js.map +1 -0
  35. package/dist-es/toolbar-next/ToolbarContentNext.js +30 -0
  36. package/dist-es/toolbar-next/ToolbarContentNext.js.map +1 -0
  37. package/dist-es/toolbar-next/ToolbarNext.css.js +4 -0
  38. package/dist-es/toolbar-next/ToolbarNext.css.js.map +1 -0
  39. package/dist-es/toolbar-next/ToolbarNext.js +392 -0
  40. package/dist-es/toolbar-next/ToolbarNext.js.map +1 -0
  41. package/dist-es/toolbar-next/ToolbarNextOverflow.css.js +4 -0
  42. package/dist-es/toolbar-next/ToolbarNextOverflow.css.js.map +1 -0
  43. package/dist-es/toolbar-next/ToolbarNextOverflow.js +700 -0
  44. package/dist-es/toolbar-next/ToolbarNextOverflow.js.map +1 -0
  45. package/dist-es/toolbar-next/ToolbarNextOverflowFloatingBoundary.js +159 -0
  46. package/dist-es/toolbar-next/ToolbarNextOverflowFloatingBoundary.js.map +1 -0
  47. package/dist-es/toolbar-next/TooltrayNext.css.js +4 -0
  48. package/dist-es/toolbar-next/TooltrayNext.css.js.map +1 -0
  49. package/dist-es/toolbar-next/TooltrayNext.js +53 -0
  50. package/dist-es/toolbar-next/TooltrayNext.js.map +1 -0
  51. package/dist-es/toolbar-next/toolbarNextKeyboardUtils.js +372 -0
  52. package/dist-es/toolbar-next/toolbarNextKeyboardUtils.js.map +1 -0
  53. package/dist-es/toolbar-next/toolbarNextUtils.js +211 -0
  54. package/dist-es/toolbar-next/toolbarNextUtils.js.map +1 -0
  55. package/dist-es/toolbar-next/useToolbarNextKeyboardNavigation.js +332 -0
  56. package/dist-es/toolbar-next/useToolbarNextKeyboardNavigation.js.map +1 -0
  57. package/dist-es/toolbar-next/useToolbarNextOverflow.js +741 -0
  58. package/dist-es/toolbar-next/useToolbarNextOverflow.js.map +1 -0
  59. package/dist-types/index.d.ts +1 -2
  60. package/dist-types/toolbar-next/ToolbarContentNext.d.ts +11 -0
  61. package/dist-types/toolbar-next/ToolbarNext.d.ts +12 -0
  62. package/dist-types/toolbar-next/ToolbarNextOverflow.d.ts +34 -0
  63. package/dist-types/toolbar-next/ToolbarNextOverflowFloatingBoundary.d.ts +16 -0
  64. package/dist-types/toolbar-next/TooltrayNext.d.ts +37 -0
  65. package/dist-types/toolbar-next/index.d.ts +3 -0
  66. package/dist-types/toolbar-next/toolbarNextKeyboardUtils.d.ts +39 -0
  67. package/dist-types/toolbar-next/toolbarNextUtils.d.ts +42 -0
  68. package/dist-types/toolbar-next/useToolbarNextKeyboardNavigation.d.ts +41 -0
  69. package/dist-types/toolbar-next/useToolbarNextOverflow.d.ts +37 -0
  70. package/package.json +2 -2
  71. package/dist-cjs/side-panel/SidePanel.css.js +0 -6
  72. package/dist-cjs/side-panel/SidePanel.css.js.map +0 -1
  73. package/dist-cjs/side-panel/SidePanel.js +0 -197
  74. package/dist-cjs/side-panel/SidePanel.js.map +0 -1
  75. package/dist-cjs/side-panel/SidePanelCloseButton.js +0 -38
  76. package/dist-cjs/side-panel/SidePanelCloseButton.js.map +0 -1
  77. package/dist-cjs/side-panel/SidePanelContent.css.js +0 -6
  78. package/dist-cjs/side-panel/SidePanelContent.css.js.map +0 -1
  79. package/dist-cjs/side-panel/SidePanelContent.js +0 -66
  80. package/dist-cjs/side-panel/SidePanelContent.js.map +0 -1
  81. package/dist-cjs/side-panel/SidePanelHeader.css.js +0 -6
  82. package/dist-cjs/side-panel/SidePanelHeader.css.js.map +0 -1
  83. package/dist-cjs/side-panel/SidePanelHeader.js +0 -26
  84. package/dist-cjs/side-panel/SidePanelHeader.js.map +0 -1
  85. package/dist-cjs/side-panel/SidePanelProvider.js +0 -78
  86. package/dist-cjs/side-panel/SidePanelProvider.js.map +0 -1
  87. package/dist-cjs/side-panel/SidePanelTitle.css.js +0 -6
  88. package/dist-cjs/side-panel/SidePanelTitle.css.js.map +0 -1
  89. package/dist-cjs/side-panel/SidePanelTitle.js +0 -48
  90. package/dist-cjs/side-panel/SidePanelTitle.js.map +0 -1
  91. package/dist-cjs/side-panel/SidePanelTrigger.js +0 -37
  92. package/dist-cjs/side-panel/SidePanelTrigger.js.map +0 -1
  93. package/dist-cjs/side-panel/internal/SidePanelContext.js +0 -32
  94. package/dist-cjs/side-panel/internal/SidePanelContext.js.map +0 -1
  95. package/dist-cjs/side-panel/internal/useIsScrollable.js +0 -50
  96. package/dist-cjs/side-panel/internal/useIsScrollable.js.map +0 -1
  97. package/dist-cjs/side-panel/internal/useSidePanelTabOrder.js +0 -214
  98. package/dist-cjs/side-panel/internal/useSidePanelTabOrder.js.map +0 -1
  99. package/dist-cjs/side-panel/useSidePanel.js +0 -43
  100. package/dist-cjs/side-panel/useSidePanel.js.map +0 -1
  101. package/dist-cjs/tree/Tree.css.js +0 -6
  102. package/dist-cjs/tree/Tree.css.js.map +0 -1
  103. package/dist-cjs/tree/Tree.js +0 -300
  104. package/dist-cjs/tree/Tree.js.map +0 -1
  105. package/dist-cjs/tree/TreeContext.js +0 -31
  106. package/dist-cjs/tree/TreeContext.js.map +0 -1
  107. package/dist-cjs/tree/TreeNode.css.js +0 -6
  108. package/dist-cjs/tree/TreeNode.css.js.map +0 -1
  109. package/dist-cjs/tree/TreeNode.js +0 -103
  110. package/dist-cjs/tree/TreeNode.js.map +0 -1
  111. package/dist-cjs/tree/TreeNodeExpansionIcon.css.js +0 -6
  112. package/dist-cjs/tree/TreeNodeExpansionIcon.css.js.map +0 -1
  113. package/dist-cjs/tree/TreeNodeExpansionIcon.js +0 -62
  114. package/dist-cjs/tree/TreeNodeExpansionIcon.js.map +0 -1
  115. package/dist-cjs/tree/TreeNodeLabel.css.js +0 -6
  116. package/dist-cjs/tree/TreeNodeLabel.css.js.map +0 -1
  117. package/dist-cjs/tree/TreeNodeLabel.js +0 -26
  118. package/dist-cjs/tree/TreeNodeLabel.js.map +0 -1
  119. package/dist-cjs/tree/TreeNodeTrigger.css.js +0 -6
  120. package/dist-cjs/tree/TreeNodeTrigger.css.js.map +0 -1
  121. package/dist-cjs/tree/TreeNodeTrigger.js +0 -153
  122. package/dist-cjs/tree/TreeNodeTrigger.js.map +0 -1
  123. package/dist-cjs/tree/treeModel.js +0 -61
  124. package/dist-cjs/tree/treeModel.js.map +0 -1
  125. package/dist-cjs/tree/useTree.js +0 -337
  126. package/dist-cjs/tree/useTree.js.map +0 -1
  127. package/dist-es/side-panel/SidePanel.css.js +0 -4
  128. package/dist-es/side-panel/SidePanel.css.js.map +0 -1
  129. package/dist-es/side-panel/SidePanel.js +0 -195
  130. package/dist-es/side-panel/SidePanel.js.map +0 -1
  131. package/dist-es/side-panel/SidePanelCloseButton.js +0 -36
  132. package/dist-es/side-panel/SidePanelCloseButton.js.map +0 -1
  133. package/dist-es/side-panel/SidePanelContent.css.js +0 -4
  134. package/dist-es/side-panel/SidePanelContent.css.js.map +0 -1
  135. package/dist-es/side-panel/SidePanelContent.js +0 -64
  136. package/dist-es/side-panel/SidePanelContent.js.map +0 -1
  137. package/dist-es/side-panel/SidePanelHeader.css.js +0 -4
  138. package/dist-es/side-panel/SidePanelHeader.css.js.map +0 -1
  139. package/dist-es/side-panel/SidePanelHeader.js +0 -24
  140. package/dist-es/side-panel/SidePanelHeader.js.map +0 -1
  141. package/dist-es/side-panel/SidePanelProvider.js +0 -76
  142. package/dist-es/side-panel/SidePanelProvider.js.map +0 -1
  143. package/dist-es/side-panel/SidePanelTitle.css.js +0 -4
  144. package/dist-es/side-panel/SidePanelTitle.css.js.map +0 -1
  145. package/dist-es/side-panel/SidePanelTitle.js +0 -46
  146. package/dist-es/side-panel/SidePanelTitle.js.map +0 -1
  147. package/dist-es/side-panel/SidePanelTrigger.js +0 -35
  148. package/dist-es/side-panel/SidePanelTrigger.js.map +0 -1
  149. package/dist-es/side-panel/internal/SidePanelContext.js +0 -29
  150. package/dist-es/side-panel/internal/SidePanelContext.js.map +0 -1
  151. package/dist-es/side-panel/internal/useIsScrollable.js +0 -48
  152. package/dist-es/side-panel/internal/useIsScrollable.js.map +0 -1
  153. package/dist-es/side-panel/internal/useSidePanelTabOrder.js +0 -212
  154. package/dist-es/side-panel/internal/useSidePanelTabOrder.js.map +0 -1
  155. package/dist-es/side-panel/useSidePanel.js +0 -41
  156. package/dist-es/side-panel/useSidePanel.js.map +0 -1
  157. package/dist-es/tree/Tree.css.js +0 -4
  158. package/dist-es/tree/Tree.css.js.map +0 -1
  159. package/dist-es/tree/Tree.js +0 -298
  160. package/dist-es/tree/Tree.js.map +0 -1
  161. package/dist-es/tree/TreeContext.js +0 -26
  162. package/dist-es/tree/TreeContext.js.map +0 -1
  163. package/dist-es/tree/TreeNode.css.js +0 -4
  164. package/dist-es/tree/TreeNode.css.js.map +0 -1
  165. package/dist-es/tree/TreeNode.js +0 -101
  166. package/dist-es/tree/TreeNode.js.map +0 -1
  167. package/dist-es/tree/TreeNodeExpansionIcon.css.js +0 -4
  168. package/dist-es/tree/TreeNodeExpansionIcon.css.js.map +0 -1
  169. package/dist-es/tree/TreeNodeExpansionIcon.js +0 -60
  170. package/dist-es/tree/TreeNodeExpansionIcon.js.map +0 -1
  171. package/dist-es/tree/TreeNodeLabel.css.js +0 -4
  172. package/dist-es/tree/TreeNodeLabel.css.js.map +0 -1
  173. package/dist-es/tree/TreeNodeLabel.js +0 -24
  174. package/dist-es/tree/TreeNodeLabel.js.map +0 -1
  175. package/dist-es/tree/TreeNodeTrigger.css.js +0 -4
  176. package/dist-es/tree/TreeNodeTrigger.css.js.map +0 -1
  177. package/dist-es/tree/TreeNodeTrigger.js +0 -151
  178. package/dist-es/tree/TreeNodeTrigger.js.map +0 -1
  179. package/dist-es/tree/treeModel.js +0 -57
  180. package/dist-es/tree/treeModel.js.map +0 -1
  181. package/dist-es/tree/useTree.js +0 -335
  182. package/dist-es/tree/useTree.js.map +0 -1
  183. package/dist-types/side-panel/SidePanel.d.ts +0 -26
  184. package/dist-types/side-panel/SidePanelCloseButton.d.ts +0 -2
  185. package/dist-types/side-panel/SidePanelContent.d.ts +0 -5
  186. package/dist-types/side-panel/SidePanelHeader.d.ts +0 -5
  187. package/dist-types/side-panel/SidePanelProvider.d.ts +0 -20
  188. package/dist-types/side-panel/SidePanelTitle.d.ts +0 -3
  189. package/dist-types/side-panel/SidePanelTrigger.d.ts +0 -3
  190. package/dist-types/side-panel/index.d.ts +0 -8
  191. package/dist-types/side-panel/internal/SidePanelContext.d.ts +0 -52
  192. package/dist-types/side-panel/internal/index.d.ts +0 -3
  193. package/dist-types/side-panel/internal/useIsScrollable.d.ts +0 -2
  194. package/dist-types/side-panel/internal/useSidePanelTabOrder.d.ts +0 -7
  195. package/dist-types/side-panel/useSidePanel.d.ts +0 -58
  196. package/dist-types/tree/Tree.d.ts +0 -36
  197. package/dist-types/tree/TreeContext.d.ts +0 -77
  198. package/dist-types/tree/TreeNode.d.ts +0 -25
  199. package/dist-types/tree/TreeNodeExpansionIcon.d.ts +0 -4
  200. package/dist-types/tree/TreeNodeLabel.d.ts +0 -4
  201. package/dist-types/tree/TreeNodeTrigger.d.ts +0 -8
  202. package/dist-types/tree/index.d.ts +0 -4
  203. package/dist-types/tree/treeModel.d.ts +0 -24
  204. package/dist-types/tree/useTree.d.ts +0 -68
@@ -1 +0,0 @@
1
- {"version":3,"file":"Tree.js","sources":["../src/tree/Tree.tsx"],"sourcesContent":["import { makePrefixer, useForkRef } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type FocusEvent,\n forwardRef,\n type KeyboardEvent,\n type SyntheticEvent,\n useEffect,\n useRef,\n} from \"react\";\nimport treeCss from \"./Tree.css\";\nimport { TreeProvider } from \"./TreeContext\";\nimport { useTree } from \"./useTree\";\n\nexport interface TreeProps extends ComponentPropsWithoutRef<\"ul\"> {\n /**\n * Default expanded nodes (uncontrolled)\n */\n defaultExpanded?: string[];\n /**\n * Expanded nodes (controlled)\n */\n expanded?: string[];\n /**\n * Callback on expanded nodes change\n */\n onExpandedChange?: (event: SyntheticEvent, expanded: string[]) => void;\n /**\n * Default selected nodes (uncontrolled)\n */\n defaultSelected?: string[];\n /**\n * Selected nodes\n */\n selected?: string[];\n /**\n * Callback on selected nodes change\n */\n onSelectionChange?: (event: SyntheticEvent, selected: string[]) => void;\n /**\n * Sets multiselect mode with checkboxes and allows for multiple node selection\n */\n multiselect?: boolean;\n /**\n * Sets tree to disabled state, preventing all interaction\n */\n disabled?: boolean;\n}\n\nconst withBaseName = makePrefixer(\"saltTree\");\n\nexport const Tree = forwardRef<HTMLUListElement, TreeProps>(\n function Tree(props, ref) {\n const {\n children,\n className,\n defaultExpanded,\n expanded,\n onExpandedChange,\n defaultSelected,\n selected,\n onSelectionChange,\n multiselect = false,\n disabled = false,\n onKeyDown,\n onBlur,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tree\",\n css: treeCss,\n window: targetWindow,\n });\n\n const treeState = useTree({\n defaultExpanded,\n expanded,\n onExpandedChange,\n defaultSelected,\n selected,\n onSelectionChange,\n multiselect,\n disabled,\n children,\n });\n\n const {\n activeNode,\n setActiveNode,\n expandedArray,\n setExpandedArray,\n expandedState,\n toggleExpanded,\n select,\n selectedSet,\n setVisibleSelectionState,\n visibleNodes,\n getNodeMeta,\n getElement,\n getParent,\n getChildren,\n treeModel,\n disabledIdsSet,\n } = treeState;\n\n const lastKeypressRef = useRef<string>(\"\");\n const keypressTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(\n null,\n );\n const treeRef = useRef<HTMLUListElement>(null);\n\n useEffect(() => {\n return () => {\n if (keypressTimeoutRef.current) {\n clearTimeout(keypressTimeoutRef.current);\n }\n };\n }, []);\n\n const handleBlur = (event: FocusEvent<HTMLUListElement>) => {\n onBlur?.(event);\n const relatedTarget = event.relatedTarget as Node | null;\n if (!treeRef.current?.contains(relatedTarget)) {\n setActiveNode(undefined);\n }\n };\n\n const focusNode = (\n value: string,\n ): \"focused\" | \"already-focused\" | \"missing\" => {\n const element = getElement(value);\n if (!element) {\n return \"missing\";\n }\n\n const activeEl = targetWindow?.document.activeElement;\n if (activeEl === element) {\n return \"already-focused\";\n }\n\n element.focus();\n element.scrollIntoView({ block: \"nearest\", inline: \"nearest\" });\n return \"focused\";\n };\n\n const handleKeyDown = (event: KeyboardEvent<HTMLUListElement>) => {\n onKeyDown?.(event);\n\n if (disabled) return;\n\n if (visibleNodes.length === 0) return;\n\n const currentIndex = activeNode ? visibleNodes.indexOf(activeNode) : -1;\n\n let newActiveNode: string | undefined;\n let handled = false;\n\n switch (event.key) {\n case \"ArrowDown\": {\n handled = true;\n const nextIndex = currentIndex + 1;\n if (nextIndex < visibleNodes.length) {\n newActiveNode = visibleNodes[nextIndex];\n }\n break;\n }\n case \"ArrowUp\": {\n handled = true;\n const prevIndex = currentIndex - 1;\n if (prevIndex >= 0) {\n newActiveNode = visibleNodes[prevIndex];\n }\n break;\n }\n case \"ArrowRight\": {\n handled = true;\n if (activeNode) {\n const nodeMeta = getNodeMeta(activeNode);\n const isDisabled = disabledIdsSet.has(activeNode);\n const hasChildren = Boolean(nodeMeta?.hasChildren);\n const isExpanded = expandedState.has(activeNode);\n if (!isDisabled && hasChildren) {\n if (!isExpanded) {\n toggleExpanded(event, activeNode);\n } else {\n const firstChild = visibleNodes.find(\n (visibleNode) => getParent(visibleNode) === activeNode,\n );\n if (firstChild) {\n newActiveNode = firstChild;\n }\n }\n }\n }\n break;\n }\n case \"ArrowLeft\": {\n handled = true;\n if (activeNode) {\n const isDisabled = disabledIdsSet.has(activeNode);\n if (!isDisabled) {\n const isExpanded = expandedState.has(activeNode);\n if (isExpanded) {\n toggleExpanded(event, activeNode);\n } else {\n const parent = getParent(activeNode);\n if (parent) {\n newActiveNode = parent;\n }\n }\n }\n }\n break;\n }\n case \"Home\": {\n handled = true;\n newActiveNode = visibleNodes[0];\n break;\n }\n case \"End\": {\n handled = true;\n newActiveNode = visibleNodes[visibleNodes.length - 1];\n break;\n }\n case \"Enter\": {\n handled = true;\n if (activeNode) {\n select(event, activeNode);\n }\n break;\n }\n case \" \": {\n handled = true;\n if (activeNode) {\n select(event, activeNode);\n }\n break;\n }\n case \"*\": {\n handled = true;\n if (activeNode) {\n const parent = getParent(activeNode);\n // Get siblings: either children of parent, or root nodes if no parent\n const siblings = parent\n ? getChildren(parent)\n : treeModel.rootValues;\n\n const toExpand = siblings.filter((sibling) => {\n const siblingMeta = getNodeMeta(sibling);\n return (\n siblingMeta?.hasChildren &&\n !expandedState.has(sibling) &&\n !disabledIdsSet.has(sibling)\n );\n });\n\n if (toExpand.length > 0) {\n const newExpanded = [...expandedArray, ...toExpand];\n setExpandedArray(newExpanded);\n onExpandedChange?.(event, newExpanded);\n }\n }\n break;\n }\n default: {\n // Type-ahead\n if (\n event.key.length === 1 &&\n !event.ctrlKey &&\n !event.metaKey &&\n !event.altKey\n ) {\n handled = true;\n\n if (keypressTimeoutRef.current) {\n clearTimeout(keypressTimeoutRef.current);\n }\n\n lastKeypressRef.current += event.key.toLowerCase();\n const searchString = lastKeypressRef.current;\n\n keypressTimeoutRef.current = setTimeout(() => {\n lastKeypressRef.current = \"\";\n }, 500);\n\n const currentIndex = activeNode\n ? visibleNodes.indexOf(activeNode)\n : -1;\n let found = false;\n\n for (let i = currentIndex + 1; i < visibleNodes.length; i++) {\n const element = getElement(visibleNodes[i]);\n if (\n element?.textContent?.toLowerCase().startsWith(searchString)\n ) {\n newActiveNode = visibleNodes[i];\n found = true;\n break;\n }\n }\n\n if (!found) {\n for (let i = 0; i <= currentIndex; i++) {\n const element = getElement(visibleNodes[i]);\n if (\n element?.textContent?.toLowerCase().startsWith(searchString)\n ) {\n newActiveNode = visibleNodes[i];\n break;\n }\n }\n }\n }\n break;\n }\n }\n\n if (\n (event.ctrlKey || event.metaKey) &&\n event.key === \"a\" &&\n multiselect\n ) {\n handled = true;\n event.preventDefault();\n\n const allVisibleValues = visibleNodes.filter(\n (visibleNode) => !disabledIdsSet.has(visibleNode),\n );\n const allSelected = allVisibleValues.every((visible) =>\n selectedSet.has(visible),\n );\n\n const newSelected = allSelected ? [] : allVisibleValues;\n\n setVisibleSelectionState(newSelected);\n onSelectionChange?.(event, newSelected);\n return;\n }\n\n if (\n event.shiftKey &&\n (event.key === \"ArrowUp\" || event.key === \"ArrowDown\") &&\n multiselect\n ) {\n handled = true;\n const isDown = event.key === \"ArrowDown\";\n const currentIndex = activeNode ? visibleNodes.indexOf(activeNode) : -1;\n const nextIndex = isDown ? currentIndex + 1 : currentIndex - 1;\n\n if (nextIndex >= 0 && nextIndex < visibleNodes.length) {\n const nextValue = visibleNodes[nextIndex];\n\n if (!disabledIdsSet.has(nextValue)) {\n select(event, nextValue);\n newActiveNode = nextValue;\n }\n }\n }\n\n if (handled) {\n event.preventDefault();\n event.stopPropagation();\n }\n\n if (newActiveNode !== undefined) {\n const focusResult = focusNode(newActiveNode);\n if (focusResult !== \"focused\") {\n setActiveNode(newActiveNode);\n }\n }\n };\n\n const handleRef = useForkRef(treeRef, ref);\n\n return (\n <TreeProvider value={treeState}>\n <ul\n ref={handleRef}\n role=\"tree\"\n aria-multiselectable={multiselect ? true : undefined}\n aria-disabled={disabled || undefined}\n className={clsx(\n withBaseName(),\n { [withBaseName(\"disabled\")]: disabled },\n className,\n )}\n onKeyDown={handleKeyDown}\n onBlur={handleBlur}\n {...rest}\n >\n {children}\n </ul>\n </TreeProvider>\n );\n },\n);\n"],"names":["Tree","treeCss","currentIndex"],"mappings":"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"}
@@ -1,26 +0,0 @@
1
- import { createContext } from '@salt-ds/core';
2
- import { useContext } from 'react';
3
-
4
- const TreeContext = createContext(
5
- "Tree Context",
6
- void 0
7
- );
8
- const TreeProvider = TreeContext.Provider;
9
- function useTreeContext() {
10
- const context = useContext(TreeContext);
11
- if (!context) {
12
- throw new Error("useTreeContext must be used within a TreeProvider");
13
- }
14
- return context;
15
- }
16
- const TreeNodeContext = createContext(
17
- "TreeNodeContext",
18
- void 0
19
- );
20
- const TreeNodeProvider = TreeNodeContext.Provider;
21
- function useTreeNodeContext() {
22
- return useContext(TreeNodeContext);
23
- }
24
-
25
- export { TreeNodeProvider, TreeProvider, useTreeContext, useTreeNodeContext };
26
- //# sourceMappingURL=TreeContext.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TreeContext.js","sources":["../src/tree/TreeContext.ts"],"sourcesContent":["import { createContext } from \"@salt-ds/core\";\nimport {\n type Dispatch,\n type ReactNode,\n type Ref,\n type RefObject,\n type SetStateAction,\n type SyntheticEvent,\n useContext,\n} from \"react\";\nimport type { TreeModel, TreeNodeMeta } from \"./useTree\";\n\nexport interface TreeContextValue {\n expandedState: Set<string>;\n /** Toggle a node expansion state */\n toggleExpanded: (event: SyntheticEvent, value: string) => void;\n\n /** Selected node values */\n selectedState: string[];\n /** Selected node values as Set for O(1) lookups */\n selectedSet: Set<string>;\n /** Set selected state directly */\n setSelectedState: Dispatch<SetStateAction<string[]>>;\n /** Set selected state without expanding selection through hidden descendants */\n setVisibleSelectionState: (selected: string[]) => void;\n /** Select node */\n select: (event: SyntheticEvent, value: string) => void;\n\n /** Whether multiselect mode with checkboxes is enabled */\n multiselect: boolean;\n /** Disabled state of the tree */\n disabled: boolean;\n /** Set of disabled node IDs */\n disabledIdsSet: Set<string>;\n\n /** Tree model for traversal */\n treeModel: TreeModel;\n /** Get node metadata from tree model */\n getNodeMeta: (value: string) => TreeNodeMeta | undefined;\n /** Get parent of a node */\n getParent: (value: string) => string | undefined;\n /** Get children of a node */\n getChildren: (value: string) => string[];\n /** Get all descendants of a node */\n getDescendants: (value: string) => string[];\n /** Get all ancestors of a node */\n getAncestors: (value: string) => string[];\n /** Memoized visible (navigable) nodes in tree order */\n visibleNodes: string[];\n /** Memoized tabbable node ID for roving tabindex (computed once at tree level) */\n tabbableNodeId: string | undefined;\n /** Register a DOM element for focus management */\n registerElement: (value: string, element: HTMLElement) => () => void;\n /** Get DOM element for a node (if mounted) */\n getElement: (value: string) => HTMLElement | undefined;\n /** Active node value */\n activeNode: string | undefined;\n /** Set the active node */\n setActiveNode: Dispatch<SetStateAction<string | undefined>>;\n\n /** Set of indeterminate (partially selected) node IDs */\n indeterminateState: Set<string>;\n}\n\nconst TreeContext = createContext<TreeContextValue | undefined>(\n \"Tree Context\",\n undefined,\n);\n\nexport const TreeProvider = TreeContext.Provider;\n\nexport function useTreeContext(): TreeContextValue {\n const context = useContext(TreeContext);\n if (!context) {\n throw new Error(\"useTreeContext must be used within a TreeProvider\");\n }\n return context;\n}\n\nexport interface TreeNodeContextValue {\n /** Current node value */\n value: string;\n /** Current depth level */\n level: number;\n /** Whether node has children */\n hasChildren: boolean;\n /** Whether node is expanded */\n expanded: boolean;\n /** Whether node is disabled */\n disabled: boolean;\n /** Node id for the li element */\n id: string;\n /** Ref for the li element rendered by TreeNodeTrigger */\n nodeRef: RefObject<HTMLLIElement>;\n /** Callback ref that connects TreeNode's forwarded ref to the li element */\n setNodeRef: Ref<HTMLLIElement> | null;\n /** Whether node is selected */\n selected: boolean;\n /** Whether node is in indeterminate state (partially selected children) */\n indeterminate: boolean;\n /** Child TreeNode elements to be rendered inside the group */\n nodeChildren: ReactNode;\n}\n\nconst TreeNodeContext = createContext<TreeNodeContextValue | undefined>(\n \"TreeNodeContext\",\n undefined,\n);\n\nexport const TreeNodeProvider = TreeNodeContext.Provider;\n\nexport function useTreeNodeContext(): TreeNodeContextValue | undefined {\n return useContext(TreeNodeContext);\n}\n"],"names":[],"mappings":";;;AAgEA,MAAM,WAAA,GAAc,aAAA;AAAA,EAClB,cAAA;AAAA,EACA;AACF,CAAA;AAEO,MAAM,eAAe,WAAA,CAAY;AAEjC,SAAS,cAAA,GAAmC;AACjD,EAAA,MAAM,OAAA,GAAU,WAAW,WAAW,CAAA;AACtC,EAAA,IAAI,CAAC,OAAA,EAAS;AACZ,IAAA,MAAM,IAAI,MAAM,mDAAmD,CAAA;AAAA,EACrE;AACA,EAAA,OAAO,OAAA;AACT;AA2BA,MAAM,eAAA,GAAkB,aAAA;AAAA,EACtB,iBAAA;AAAA,EACA;AACF,CAAA;AAEO,MAAM,mBAAmB,eAAA,CAAgB;AAEzC,SAAS,kBAAA,GAAuD;AACrE,EAAA,OAAO,WAAW,eAAe,CAAA;AACnC;;;;"}
@@ -1,4 +0,0 @@
1
- var css_248z = ".saltTreeNode {\n list-style: none;\n position: relative;\n cursor: var(--salt-cursor-hover);\n}\n\n.saltTreeNode:focus {\n outline: none;\n}\n\n/* Focus visible styles - applied when keyboard navigation is used */\n.saltTreeNode:focus-visible > .saltTreeNodeTrigger,\n.saltTreeNode-focusVisible > .saltTreeNodeTrigger {\n outline: var(--salt-focused-outline);\n outline-offset: calc(var(--salt-size-fixed-100) * -2);\n position: relative;\n z-index: calc(var(--salt-zIndex-default) + 1);\n}\n\n/* Selected + focus visible */\n.saltTreeNode-selected:focus-visible > .saltTreeNodeTrigger,\n.saltTreeNode-selected.saltTreeNode-focusVisible > .saltTreeNodeTrigger {\n outline: var(--salt-focused-outline);\n outline-offset: calc(var(--salt-size-fixed-100) * -2);\n z-index: calc(var(--salt-zIndex-default) + 1);\n}\n\n.saltTreeNode-group {\n display: flex;\n flex-direction: column;\n gap: var(--salt-spacing-fixed-100);\n list-style: none;\n margin: 0;\n padding: 0;\n padding-top: var(--salt-spacing-fixed-100);\n}\n\n.saltTreeNode-checkbox {\n flex-shrink: 0;\n height: var(--salt-size-selectable);\n}\n\n.saltTreeNode-icon {\n display: flex;\n align-items: flex-start;\n justify-content: center;\n width: var(--salt-size-selectable);\n min-width: var(--salt-size-selectable);\n height: var(--salt-size-selectable);\n flex-shrink: 0;\n}\n\n.saltTreeNode-icon > * {\n color: var(--salt-content-primary-foreground);\n}\n";
2
-
3
- export { css_248z as default };
4
- //# sourceMappingURL=TreeNode.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TreeNode.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
@@ -1,101 +0,0 @@
1
- import { jsxs, jsx } from 'react/jsx-runtime';
2
- import { makePrefixer, useIdMemo, useForkRef } from '@salt-ds/core';
3
- import { useComponentCssInjection } from '@salt-ds/styles';
4
- import { useWindow } from '@salt-ds/window';
5
- import { forwardRef, useMemo, useRef } from 'react';
6
- import { useTreeContext, useTreeNodeContext, TreeNodeProvider } from './TreeContext.js';
7
- import css_248z from './TreeNode.css.js';
8
- import { TreeNodeLabel } from './TreeNodeLabel.js';
9
- import { TreeNodeTrigger } from './TreeNodeTrigger.js';
10
- import { flattenTreeNodeChildren, isTreeNodeElement } from './treeModel.js';
11
-
12
- const withBaseName = makePrefixer("saltTreeNode");
13
- function separateChildren(children) {
14
- const contentChildren = [];
15
- const nodeChildren = [];
16
- for (const child of flattenTreeNodeChildren(children)) {
17
- if (isTreeNodeElement(child)) {
18
- nodeChildren.push(child);
19
- } else {
20
- contentChildren.push(child);
21
- }
22
- }
23
- return { contentChildren, nodeChildren };
24
- }
25
- const TreeNode = forwardRef(
26
- function TreeNode2(props, ref) {
27
- const {
28
- value,
29
- label,
30
- icon: Icon,
31
- disabled: disabledProp,
32
- children
33
- } = props;
34
- const targetWindow = useWindow();
35
- useComponentCssInjection({
36
- testId: "salt-tree-node",
37
- css: css_248z,
38
- window: targetWindow
39
- });
40
- const id = useIdMemo();
41
- const {
42
- expandedState,
43
- selectedSet,
44
- disabled: treeDisabled,
45
- disabledIdsSet,
46
- indeterminateState
47
- } = useTreeContext();
48
- const parentContext = useTreeNodeContext();
49
- const level = ((parentContext == null ? void 0 : parentContext.level) ?? 0) + 1;
50
- const disabled = treeDisabled || (parentContext == null ? void 0 : parentContext.disabled) || disabledProp || disabledIdsSet.has(value);
51
- const expanded = expandedState.has(value);
52
- const selected = selectedSet.has(value);
53
- const indeterminate = indeterminateState.has(value);
54
- const usesLabelProp = label !== void 0;
55
- const { contentChildren, nodeChildren } = useMemo(
56
- () => usesLabelProp ? {
57
- contentChildren: [],
58
- nodeChildren: flattenTreeNodeChildren(children)
59
- } : separateChildren(children),
60
- [children, usesLabelProp]
61
- );
62
- const hasChildren = nodeChildren.some(isTreeNodeElement);
63
- const nodeRef = useRef(null);
64
- const setNodeRef = useForkRef(nodeRef, ref);
65
- const nodeContext = useMemo(
66
- () => ({
67
- value,
68
- level,
69
- hasChildren,
70
- expanded,
71
- disabled,
72
- id,
73
- nodeRef,
74
- setNodeRef,
75
- selected,
76
- indeterminate,
77
- nodeChildren
78
- }),
79
- [
80
- value,
81
- level,
82
- hasChildren,
83
- expanded,
84
- disabled,
85
- id,
86
- setNodeRef,
87
- selected,
88
- indeterminate,
89
- nodeChildren
90
- ]
91
- );
92
- const defaultContent = usesLabelProp ? /* @__PURE__ */ jsxs(TreeNodeTrigger, { children: [
93
- Icon ? /* @__PURE__ */ jsx("span", { className: withBaseName("icon"), children: /* @__PURE__ */ jsx(Icon, { "aria-hidden": true }) }) : null,
94
- /* @__PURE__ */ jsx(TreeNodeLabel, { children: label })
95
- ] }) : null;
96
- return /* @__PURE__ */ jsx(TreeNodeProvider, { value: nodeContext, children: usesLabelProp ? defaultContent : contentChildren });
97
- }
98
- );
99
-
100
- export { TreeNode };
101
- //# sourceMappingURL=TreeNode.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TreeNode.js","sources":["../src/tree/TreeNode.tsx"],"sourcesContent":["import { makePrefixer, useForkRef, useIdMemo } from \"@salt-ds/core\";\nimport type { IconProps } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n type ComponentType,\n forwardRef,\n type ReactNode,\n useMemo,\n useRef,\n} from \"react\";\nimport {\n TreeNodeProvider,\n useTreeContext,\n useTreeNodeContext,\n} from \"./TreeContext\";\nimport treeNodeCss from \"./TreeNode.css\";\nimport { TreeNodeLabel } from \"./TreeNodeLabel\";\nimport { TreeNodeTrigger } from \"./TreeNodeTrigger\";\nimport { flattenTreeNodeChildren, isTreeNodeElement } from \"./treeModel\";\n\nexport interface TreeNodeProps {\n /**\n * Unique value representing this node within the tree\n */\n value: string;\n /**\n * Label for the node. When provided, TreeNode automatically renders a TreeNodeTrigger.\n */\n label?: ReactNode;\n /**\n * Optional icon to display before the label\n */\n icon?: ComponentType<IconProps>;\n /**\n * Whether the node is disabled.\n */\n disabled?: boolean;\n /**\n * Child nodes or content.\n */\n children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltTreeNode\");\n\n// Need to take another look at this because its slightly brittle - alternative could be:\n// TreeNode having a 'content' prop that takes <TreeNodeTrigger> etc. and then `children` is reserved for other <TreeNode>'s\n// or a 'render' prop if we want to pass any state down. Simplifies it massively because then its clear children is for sub trees.\nfunction separateChildren(children: ReactNode): {\n contentChildren: ReactNode[];\n nodeChildren: ReactNode[];\n} {\n const contentChildren: ReactNode[] = [];\n const nodeChildren: ReactNode[] = [];\n\n for (const child of flattenTreeNodeChildren(children)) {\n if (isTreeNodeElement(child)) {\n nodeChildren.push(child);\n } else {\n contentChildren.push(child);\n }\n }\n\n return { contentChildren, nodeChildren };\n}\n\nexport const TreeNode = forwardRef<HTMLLIElement, TreeNodeProps>(\n function TreeNode(props, ref) {\n const {\n value,\n label,\n icon: Icon,\n disabled: disabledProp,\n children,\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tree-node\",\n css: treeNodeCss,\n window: targetWindow,\n });\n\n const id = useIdMemo();\n\n const {\n expandedState,\n selectedSet,\n disabled: treeDisabled,\n disabledIdsSet,\n indeterminateState,\n } = useTreeContext();\n\n const parentContext = useTreeNodeContext();\n const level = (parentContext?.level ?? 0) + 1;\n\n const disabled =\n treeDisabled ||\n parentContext?.disabled ||\n disabledProp ||\n disabledIdsSet.has(value);\n const expanded = expandedState.has(value);\n const selected = selectedSet.has(value);\n const indeterminate = indeterminateState.has(value);\n\n const usesLabelProp = label !== undefined;\n const { contentChildren, nodeChildren } = useMemo(\n () =>\n usesLabelProp\n ? {\n contentChildren: [],\n nodeChildren: flattenTreeNodeChildren(children),\n }\n : separateChildren(children),\n [children, usesLabelProp],\n );\n\n const hasChildren = nodeChildren.some(isTreeNodeElement);\n\n const nodeRef = useRef<HTMLLIElement>(null);\n const setNodeRef = useForkRef(nodeRef, ref);\n\n const nodeContext = useMemo(\n () => ({\n value,\n level,\n hasChildren,\n expanded,\n disabled,\n id,\n nodeRef,\n setNodeRef,\n selected,\n indeterminate,\n nodeChildren,\n }),\n [\n value,\n level,\n hasChildren,\n expanded,\n disabled,\n id,\n setNodeRef,\n selected,\n indeterminate,\n nodeChildren,\n ],\n );\n\n const defaultContent = usesLabelProp ? (\n <TreeNodeTrigger>\n {Icon ? (\n <span className={withBaseName(\"icon\")}>\n <Icon aria-hidden />\n </span>\n ) : null}\n <TreeNodeLabel>{label}</TreeNodeLabel>\n </TreeNodeTrigger>\n ) : null;\n\n return (\n <TreeNodeProvider value={nodeContext}>\n {usesLabelProp ? defaultContent : contentChildren}\n </TreeNodeProvider>\n );\n },\n);\n"],"names":["TreeNode","treeNodeCss"],"mappings":"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"}
@@ -1,4 +0,0 @@
1
- var css_248z = ".saltTreeNodeExpansionIcon {\n display: flex;\n align-items: flex-start;\n justify-content: center;\n width: var(--salt-size-selectable);\n min-width: var(--salt-size-selectable);\n height: var(--salt-size-selectable);\n flex-shrink: 0;\n position: relative;\n}\n\n.saltTreeNodeExpansionIcon-icon {\n color: var(--salt-content-primary-foreground);\n}\n\n.saltTreeNodeExpansionIcon::before {\n content: \"\";\n display: block;\n position: absolute;\n width: var(--salt-size-base);\n height: var(--salt-size-base);\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n}\n";
2
-
3
- export { css_248z as default };
4
- //# sourceMappingURL=TreeNodeExpansionIcon.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TreeNodeExpansionIcon.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
@@ -1,60 +0,0 @@
1
- import { jsx } from 'react/jsx-runtime';
2
- import { makePrefixer, useIcon } from '@salt-ds/core';
3
- import { useComponentCssInjection } from '@salt-ds/styles';
4
- import { useWindow } from '@salt-ds/window';
5
- import { clsx } from 'clsx';
6
- import { forwardRef } from 'react';
7
- import { useTreeNodeContext, useTreeContext } from './TreeContext.js';
8
- import css_248z from './TreeNodeExpansionIcon.css.js';
9
-
10
- const withBaseName = makePrefixer("saltTreeNodeExpansionIcon");
11
- const TreeNodeExpansionIcon = forwardRef(function TreeNodeExpansionIcon2(props, ref) {
12
- const { className, onClick, ...rest } = props;
13
- const targetWindow = useWindow();
14
- useComponentCssInjection({
15
- testId: "salt-tree-node-expansion-icon",
16
- css: css_248z,
17
- window: targetWindow
18
- });
19
- const nodeContext = useTreeNodeContext();
20
- if (!nodeContext) {
21
- throw new Error("TreeNodeExpansionIcon must be used within a TreeNode");
22
- }
23
- const { value, hasChildren, expanded, disabled } = nodeContext;
24
- const { toggleExpanded } = useTreeContext();
25
- const { ExpandGroupIcon, CollapseGroupIcon } = useIcon();
26
- const handleClick = (event) => {
27
- onClick == null ? void 0 : onClick(event);
28
- if (disabled || !hasChildren) return;
29
- toggleExpanded(event, value);
30
- };
31
- if (!hasChildren) {
32
- return /* @__PURE__ */ jsx(
33
- "span",
34
- {
35
- ref,
36
- className: clsx(withBaseName(), withBaseName("placeholder"), className),
37
- "aria-hidden": true,
38
- ...rest
39
- }
40
- );
41
- }
42
- const Icon = expanded ? CollapseGroupIcon : ExpandGroupIcon;
43
- return (
44
- // biome-ignore lint/a11y/useKeyWithClickEvents: keyboard handled at tree level, same as W3C
45
- /* @__PURE__ */ jsx(
46
- "span",
47
- {
48
- ref,
49
- className: clsx(withBaseName(), className),
50
- onClick: handleClick,
51
- "aria-hidden": true,
52
- ...rest,
53
- children: /* @__PURE__ */ jsx(Icon, { className: withBaseName("icon") })
54
- }
55
- )
56
- );
57
- });
58
-
59
- export { TreeNodeExpansionIcon };
60
- //# sourceMappingURL=TreeNodeExpansionIcon.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TreeNodeExpansionIcon.js","sources":["../src/tree/TreeNodeExpansionIcon.tsx"],"sourcesContent":["import { makePrefixer, useIcon } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type MouseEvent,\n} from \"react\";\nimport { useTreeContext, useTreeNodeContext } from \"./TreeContext\";\nimport treeNodeExpansionIconCss from \"./TreeNodeExpansionIcon.css\";\n\nexport interface TreeNodeExpansionIconProps\n extends ComponentPropsWithoutRef<\"span\"> {}\n\nconst withBaseName = makePrefixer(\"saltTreeNodeExpansionIcon\");\n\nexport const TreeNodeExpansionIcon = forwardRef<\n HTMLSpanElement,\n TreeNodeExpansionIconProps\n>(function TreeNodeExpansionIcon(props, ref) {\n const { className, onClick, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tree-node-expansion-icon\",\n css: treeNodeExpansionIconCss,\n window: targetWindow,\n });\n\n const nodeContext = useTreeNodeContext();\n if (!nodeContext) {\n throw new Error(\"TreeNodeExpansionIcon must be used within a TreeNode\");\n }\n\n const { value, hasChildren, expanded, disabled } = nodeContext;\n const { toggleExpanded } = useTreeContext();\n const { ExpandGroupIcon, CollapseGroupIcon } = useIcon();\n\n const handleClick = (event: MouseEvent<HTMLSpanElement>) => {\n onClick?.(event);\n if (disabled || !hasChildren) return;\n toggleExpanded(event, value);\n };\n\n if (!hasChildren) {\n return (\n <span\n ref={ref}\n className={clsx(withBaseName(), withBaseName(\"placeholder\"), className)}\n aria-hidden\n {...rest}\n />\n );\n }\n\n const Icon = expanded ? CollapseGroupIcon : ExpandGroupIcon;\n\n return (\n // biome-ignore lint/a11y/useKeyWithClickEvents: keyboard handled at tree level, same as W3C\n <span\n ref={ref}\n className={clsx(withBaseName(), className)}\n onClick={handleClick}\n aria-hidden\n {...rest}\n >\n <Icon className={withBaseName(\"icon\")} />\n </span>\n );\n});\n"],"names":["TreeNodeExpansionIcon","treeNodeExpansionIconCss"],"mappings":";;;;;;;;;AAeA,MAAM,YAAA,GAAe,aAAa,2BAA2B,CAAA;AAEtD,MAAM,qBAAA,GAAwB,UAAA,CAGnC,SAASA,sBAAAA,CAAsB,OAAO,GAAA,EAAK;AAC3C,EAAA,MAAM,EAAE,SAAA,EAAW,OAAA,EAAS,GAAG,MAAK,GAAI,KAAA;AAExC,EAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,+BAAA;AAAA,IACR,GAAA,EAAKC,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,MAAM,cAAc,kBAAA,EAAmB;AACvC,EAAA,IAAI,CAAC,WAAA,EAAa;AAChB,IAAA,MAAM,IAAI,MAAM,sDAAsD,CAAA;AAAA,EACxE;AAEA,EAAA,MAAM,EAAE,KAAA,EAAO,WAAA,EAAa,QAAA,EAAU,UAAS,GAAI,WAAA;AACnD,EAAA,MAAM,EAAE,cAAA,EAAe,GAAI,cAAA,EAAe;AAC1C,EAAA,MAAM,EAAE,eAAA,EAAiB,iBAAA,EAAkB,GAAI,OAAA,EAAQ;AAEvD,EAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAAuC;AAC1D,IAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,CAAA;AACV,IAAA,IAAI,QAAA,IAAY,CAAC,WAAA,EAAa;AAC9B,IAAA,cAAA,CAAe,OAAO,KAAK,CAAA;AAAA,EAC7B,CAAA;AAEA,EAAA,IAAI,CAAC,WAAA,EAAa;AAChB,IAAA,uBACE,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,WAAW,IAAA,CAAK,YAAA,IAAgB,YAAA,CAAa,aAAa,GAAG,SAAS,CAAA;AAAA,QACtE,aAAA,EAAW,IAAA;AAAA,QACV,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AAEA,EAAA,MAAM,IAAA,GAAO,WAAW,iBAAA,GAAoB,eAAA;AAE5C,EAAA;AAAA;AAAA,oBAEE,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,OAAA,EAAS,WAAA;AAAA,QACT,aAAA,EAAW,IAAA;AAAA,QACV,GAAG,IAAA;AAAA,QAEJ,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,SAAA,EAAW,YAAA,CAAa,MAAM,CAAA,EAAG;AAAA;AAAA;AACzC;AAEJ,CAAC;;;;"}
@@ -1,4 +0,0 @@
1
- var css_248z = ".saltTreeNodeLabel {\n flex: 1;\n font-family: var(--salt-text-fontFamily);\n font-size: var(--salt-text-fontSize);\n font-weight: var(--salt-text-fontWeight);\n line-height: var(--salt-text-lineHeight);\n letter-spacing: var(--salt-text-letterSpacing);\n word-break: break-word;\n}\n";
2
-
3
- export { css_248z as default };
4
- //# sourceMappingURL=TreeNodeLabel.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TreeNodeLabel.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
@@ -1,24 +0,0 @@
1
- import { jsx } from 'react/jsx-runtime';
2
- import { makePrefixer } from '@salt-ds/core';
3
- import { useComponentCssInjection } from '@salt-ds/styles';
4
- import { useWindow } from '@salt-ds/window';
5
- import { clsx } from 'clsx';
6
- import { forwardRef } from 'react';
7
- import css_248z from './TreeNodeLabel.css.js';
8
-
9
- const withBaseName = makePrefixer("saltTreeNodeLabel");
10
- const TreeNodeLabel = forwardRef(
11
- function TreeNodeLabel2(props, ref) {
12
- const { children, className, ...rest } = props;
13
- const targetWindow = useWindow();
14
- useComponentCssInjection({
15
- testId: "salt-tree-node-label",
16
- css: css_248z,
17
- window: targetWindow
18
- });
19
- return /* @__PURE__ */ jsx("span", { ref, className: clsx(withBaseName(), className), ...rest, children });
20
- }
21
- );
22
-
23
- export { TreeNodeLabel };
24
- //# sourceMappingURL=TreeNodeLabel.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TreeNodeLabel.js","sources":["../src/tree/TreeNodeLabel.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport treeNodeLabelCss from \"./TreeNodeLabel.css\";\n\nexport interface TreeNodeLabelProps extends ComponentPropsWithoutRef<\"span\"> {}\n\nconst withBaseName = makePrefixer(\"saltTreeNodeLabel\");\n\nexport const TreeNodeLabel = forwardRef<HTMLSpanElement, TreeNodeLabelProps>(\n function TreeNodeLabel(props, ref) {\n const { children, className, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tree-node-label\",\n css: treeNodeLabelCss,\n window: targetWindow,\n });\n\n return (\n <span ref={ref} className={clsx(withBaseName(), className)} {...rest}>\n {children}\n </span>\n );\n },\n);\n"],"names":["TreeNodeLabel","treeNodeLabelCss"],"mappings":";;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA;AAE9C,MAAM,aAAA,GAAgB,UAAA;AAAA,EAC3B,SAASA,cAAAA,CAAc,KAAA,EAAO,GAAA,EAAK;AACjC,IAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,GAAG,MAAK,GAAI,KAAA;AAEzC,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,sBAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACE,GAAA,CAAC,MAAA,EAAA,EAAK,GAAA,EAAU,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA,EAAI,GAAG,IAAA,EAC7D,QAAA,EACH,CAAA;AAAA,EAEJ;AACF;;;;"}
@@ -1,4 +0,0 @@
1
- var css_248z = ".saltTreeNodeTrigger {\n box-sizing: border-box;\n display: flex;\n align-items: flex-start;\n gap: var(--salt-spacing-100);\n width: 100%;\n min-height: var(--salt-size-base);\n\n padding-top: calc((var(--salt-size-base) - var(--salt-size-selectable)) / 2);\n padding-bottom: calc((var(--salt-size-base) - var(--salt-size-selectable)) / 2);\n padding-right: var(--salt-spacing-100);\n /* Keep a fixed spacing-100 outer left padding for all nodes, then add one\n indent step per additional level. Each indent step = (selectable element\n width + inter-item gap).\n Level-1 nodes get no extra indent; level-2 gets 1 step, level-3 gets 2, etc.\n */\n --saltTreeNodeTrigger-indentStep: calc(var(--salt-size-selectable) + var(--salt-spacing-100));\n /* Icons clamp to 12px minimum in Icon, so align against the rendered size. */\n --saltTreeNodeTrigger-iconOffsetY: calc((var(--salt-text-lineHeight) - max(var(--salt-size-icon), 12px)) / 2);\n --saltTreeNodeTrigger-directIconInsetX: max(0px, calc((var(--salt-size-selectable) - max(var(--salt-size-icon), 12px)) / 2));\n padding-left: calc(var(--salt-spacing-100) + (var(--saltTreeNodeTrigger-indentStep) * (var(--saltTreeNode-level, 1) - 1)));\n background: var(--salt-selectable-background);\n color: var(--salt-content-primary-foreground);\n}\n\n.saltTreeNodeTrigger:hover {\n background: var(--salt-selectable-background-hover);\n}\n\n.saltTreeNode:focus-visible > .saltTreeNodeTrigger,\n.saltTreeNode-focusVisible > .saltTreeNodeTrigger {\n background: var(--salt-selectable-background-hover);\n}\n\n.saltTreeNode-selected > .saltTreeNodeTrigger {\n background: var(--salt-selectable-background-selected);\n box-shadow:\n 0 calc(var(--salt-size-fixed-100) * -1) 0 0 var(--salt-selectable-borderColor-selected),\n 0 var(--salt-size-fixed-100) 0 0 var(--salt-selectable-borderColor-selected);\n position: relative;\n z-index: var(--salt-zIndex-default);\n}\n\n.saltTreeNode-selected:focus-visible > .saltTreeNodeTrigger,\n.saltTreeNode-selected.saltTreeNode-focusVisible > .saltTreeNodeTrigger {\n background: var(--salt-selectable-background-selected);\n}\n\n.saltTreeNode-disabled > .saltTreeNodeTrigger,\n.saltTreeNode-disabled:hover > .saltTreeNodeTrigger {\n opacity: 0.4;\n cursor: var(--salt-cursor-disabled);\n\n background: var(--salt-selectable-background);\n color: var(--salt-content-primary-foreground);\n}\n\n.saltTreeNodeTrigger > .saltTreeNode-checkbox {\n margin-block: calc((var(--salt-text-lineHeight) - var(--salt-size-selectable)) / 2);\n}\n\n.saltTreeNodeTrigger > .saltTreeNodeExpansionIcon > .saltTreeNodeExpansionIcon-icon,\n.saltTreeNodeTrigger > .saltTreeNode-icon > .saltIcon {\n --saltIcon-margin: var(--saltTreeNodeTrigger-iconOffsetY) 0 0 0;\n}\n\n.saltTreeNodeTrigger > .saltIcon {\n --saltIcon-margin: var(--saltTreeNodeTrigger-iconOffsetY) 0 0 0;\n box-sizing: content-box;\n padding-inline: var(--saltTreeNodeTrigger-directIconInsetX);\n flex-shrink: 0;\n color: var(--salt-content-primary-foreground);\n}\n";
2
-
3
- export { css_248z as default };
4
- //# sourceMappingURL=TreeNodeTrigger.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TreeNodeTrigger.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
@@ -1,151 +0,0 @@
1
- import { jsxs, jsx } from 'react/jsx-runtime';
2
- import { makePrefixer, useForkRef, CheckboxIcon } from '@salt-ds/core';
3
- import { useComponentCssInjection } from '@salt-ds/styles';
4
- import { useWindow } from '@salt-ds/window';
5
- import { clsx } from 'clsx';
6
- import { forwardRef, useRef, useState, useEffect } from 'react';
7
- import { useTreeNodeContext, useTreeContext } from './TreeContext.js';
8
- import { TreeNodeExpansionIcon } from './TreeNodeExpansionIcon.js';
9
- import css_248z from './TreeNodeTrigger.css.js';
10
-
11
- const withBaseName = makePrefixer("saltTreeNodeTrigger");
12
- const withNodeBaseName = makePrefixer("saltTreeNode");
13
- const TreeNodeTrigger = forwardRef(function TreeNodeTrigger2(props, ref) {
14
- const {
15
- className,
16
- children,
17
- style,
18
- onClick,
19
- onFocus,
20
- onBlur,
21
- onMouseDown,
22
- onKeyDown,
23
- ...rest
24
- } = props;
25
- const targetWindow = useWindow();
26
- useComponentCssInjection({
27
- testId: "salt-tree-node-trigger",
28
- css: css_248z,
29
- window: targetWindow
30
- });
31
- const nodeContext = useTreeNodeContext();
32
- if (!nodeContext) {
33
- throw new Error("TreeNodeTrigger must be used within a TreeNode");
34
- }
35
- const {
36
- value,
37
- level,
38
- hasChildren,
39
- expanded,
40
- disabled,
41
- id,
42
- nodeRef,
43
- setNodeRef,
44
- selected,
45
- indeterminate,
46
- nodeChildren
47
- } = nodeContext;
48
- const {
49
- multiselect,
50
- activeNode,
51
- setActiveNode,
52
- select,
53
- tabbableNodeId,
54
- registerElement
55
- } = useTreeContext();
56
- const triggerContentRef = useForkRef(useRef(null), ref);
57
- const wasMouseDownRef = useRef(false);
58
- const [focusVisible, setFocusVisible] = useState(false);
59
- const isActive = activeNode === value;
60
- const isTabbable = tabbableNodeId === value;
61
- useEffect(() => {
62
- if (nodeRef.current) {
63
- return registerElement(value, nodeRef.current);
64
- }
65
- }, [value, registerElement, nodeRef]);
66
- const handleClick = (event) => {
67
- onClick == null ? void 0 : onClick(event);
68
- if (disabled) return;
69
- const target = event.target;
70
- if (target.closest(".saltTreeNodeExpansionIcon")) return;
71
- const nestedTreeItem = target.closest('[role="treeitem"]');
72
- if (nestedTreeItem && nestedTreeItem !== nodeRef.current) {
73
- return;
74
- }
75
- setActiveNode(value);
76
- select(event, value);
77
- };
78
- const handleFocus = (event) => {
79
- if (event.target !== event.currentTarget) return;
80
- onFocus == null ? void 0 : onFocus(event);
81
- if (!wasMouseDownRef.current) {
82
- setFocusVisible(true);
83
- }
84
- wasMouseDownRef.current = false;
85
- setActiveNode(value);
86
- };
87
- const handleBlur = (event) => {
88
- if (event.target !== event.currentTarget) return;
89
- onBlur == null ? void 0 : onBlur(event);
90
- setFocusVisible(false);
91
- };
92
- const handleMouseDown = (event) => {
93
- wasMouseDownRef.current = true;
94
- onMouseDown == null ? void 0 : onMouseDown(event);
95
- };
96
- return /* @__PURE__ */ jsxs(
97
- "li",
98
- {
99
- ref: setNodeRef,
100
- id,
101
- role: "treeitem",
102
- "aria-expanded": hasChildren ? expanded : void 0,
103
- "aria-selected": multiselect ? void 0 : selected,
104
- "aria-checked": multiselect ? indeterminate ? "mixed" : selected : void 0,
105
- "aria-level": level,
106
- "aria-disabled": disabled || void 0,
107
- tabIndex: isTabbable ? 0 : -1,
108
- className: clsx(
109
- withNodeBaseName(),
110
- {
111
- [withNodeBaseName("expanded")]: expanded,
112
- [withNodeBaseName("selected")]: selected && !multiselect,
113
- [withNodeBaseName("active")]: isActive,
114
- [withNodeBaseName("disabled")]: disabled,
115
- [withNodeBaseName("hasChildren")]: hasChildren,
116
- [withNodeBaseName("focusVisible")]: focusVisible
117
- },
118
- className
119
- ),
120
- style: {
121
- "--saltTreeNode-level": level,
122
- ...style
123
- },
124
- onClick: handleClick,
125
- onFocus: handleFocus,
126
- onBlur: handleBlur,
127
- onMouseDown: handleMouseDown,
128
- onKeyDown,
129
- ...rest,
130
- children: [
131
- /* @__PURE__ */ jsxs("span", { ref: triggerContentRef, className: withBaseName(), children: [
132
- /* @__PURE__ */ jsx(TreeNodeExpansionIcon, {}),
133
- multiselect && /* @__PURE__ */ jsx(
134
- CheckboxIcon,
135
- {
136
- checked: selected,
137
- indeterminate,
138
- disabled,
139
- className: withNodeBaseName("checkbox")
140
- }
141
- ),
142
- children
143
- ] }),
144
- hasChildren && expanded && /* @__PURE__ */ jsx("ul", { role: "group", className: withNodeBaseName("group"), children: nodeChildren })
145
- ]
146
- }
147
- );
148
- });
149
-
150
- export { TreeNodeTrigger };
151
- //# sourceMappingURL=TreeNodeTrigger.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TreeNodeTrigger.js","sources":["../src/tree/TreeNodeTrigger.tsx"],"sourcesContent":["import { CheckboxIcon, makePrefixer, useForkRef } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type CSSProperties,\n type FocusEvent,\n forwardRef,\n type MouseEvent,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport { useTreeContext, useTreeNodeContext } from \"./TreeContext\";\nimport { TreeNodeExpansionIcon } from \"./TreeNodeExpansionIcon\";\nimport treeNodeTriggerCss from \"./TreeNodeTrigger.css\";\n\nexport interface TreeNodeTriggerProps extends ComponentPropsWithoutRef<\"li\"> {}\n\nconst withBaseName = makePrefixer(\"saltTreeNodeTrigger\");\nconst withNodeBaseName = makePrefixer(\"saltTreeNode\");\n\n/**\n * The forwarded ref points to the inner trigger content span (for tooltip positioning),\n * while the <li> handles focus, ARIA, and event handling.\n */\nexport const TreeNodeTrigger = forwardRef<\n HTMLSpanElement,\n TreeNodeTriggerProps\n>(function TreeNodeTrigger(props, ref) {\n const {\n className,\n children,\n style,\n onClick,\n onFocus,\n onBlur,\n onMouseDown,\n onKeyDown,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tree-node-trigger\",\n css: treeNodeTriggerCss,\n window: targetWindow,\n });\n\n const nodeContext = useTreeNodeContext();\n if (!nodeContext) {\n throw new Error(\"TreeNodeTrigger must be used within a TreeNode\");\n }\n\n const {\n value,\n level,\n hasChildren,\n expanded,\n disabled,\n id,\n nodeRef,\n setNodeRef,\n selected,\n indeterminate,\n nodeChildren,\n } = nodeContext;\n\n const {\n multiselect,\n activeNode,\n setActiveNode,\n select,\n tabbableNodeId,\n registerElement,\n } = useTreeContext();\n\n const triggerContentRef = useForkRef(useRef<HTMLSpanElement>(null), ref);\n const wasMouseDownRef = useRef(false);\n const [focusVisible, setFocusVisible] = useState(false);\n\n const isActive = activeNode === value;\n\n const isTabbable = tabbableNodeId === value;\n\n useEffect(() => {\n if (nodeRef.current) {\n return registerElement(value, nodeRef.current);\n }\n }, [value, registerElement, nodeRef]);\n\n const handleClick = (event: MouseEvent<HTMLLIElement>) => {\n onClick?.(event);\n if (disabled) return;\n const target = event.target as HTMLElement;\n if (target.closest(\".saltTreeNodeExpansionIcon\")) return;\n const nestedTreeItem = target.closest('[role=\"treeitem\"]');\n if (nestedTreeItem && nestedTreeItem !== nodeRef.current) {\n return;\n }\n setActiveNode(value);\n select(event, value);\n };\n\n const handleFocus = (event: FocusEvent<HTMLLIElement>) => {\n if (event.target !== event.currentTarget) return;\n onFocus?.(event);\n if (!wasMouseDownRef.current) {\n setFocusVisible(true);\n }\n wasMouseDownRef.current = false;\n setActiveNode(value);\n };\n\n const handleBlur = (event: FocusEvent<HTMLLIElement>) => {\n if (event.target !== event.currentTarget) return;\n onBlur?.(event);\n setFocusVisible(false);\n };\n\n const handleMouseDown = (event: MouseEvent<HTMLLIElement>) => {\n wasMouseDownRef.current = true;\n onMouseDown?.(event);\n };\n\n return (\n <li\n ref={setNodeRef}\n id={id}\n role=\"treeitem\"\n aria-expanded={hasChildren ? expanded : undefined}\n aria-selected={multiselect ? undefined : selected}\n aria-checked={\n multiselect ? (indeterminate ? \"mixed\" : selected) : undefined\n }\n aria-level={level}\n aria-disabled={disabled || undefined}\n tabIndex={isTabbable ? 0 : -1}\n className={clsx(\n withNodeBaseName(),\n {\n [withNodeBaseName(\"expanded\")]: expanded,\n [withNodeBaseName(\"selected\")]: selected && !multiselect,\n [withNodeBaseName(\"active\")]: isActive,\n [withNodeBaseName(\"disabled\")]: disabled,\n [withNodeBaseName(\"hasChildren\")]: hasChildren,\n [withNodeBaseName(\"focusVisible\")]: focusVisible,\n },\n className,\n )}\n style={\n {\n \"--saltTreeNode-level\": level,\n ...style,\n } as CSSProperties\n }\n onClick={handleClick}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onMouseDown={handleMouseDown}\n onKeyDown={onKeyDown}\n {...rest}\n >\n <span ref={triggerContentRef} className={withBaseName()}>\n <TreeNodeExpansionIcon />\n {multiselect && (\n <CheckboxIcon\n checked={selected}\n indeterminate={indeterminate}\n disabled={disabled}\n className={withNodeBaseName(\"checkbox\")}\n />\n )}\n {children}\n </span>\n\n {hasChildren && expanded && (\n <ul role=\"group\" className={withNodeBaseName(\"group\")}>\n {nodeChildren}\n </ul>\n )}\n </li>\n );\n});\n"],"names":["TreeNodeTrigger","treeNodeTriggerCss"],"mappings":"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"}
@@ -1,57 +0,0 @@
1
- import { Children, isValidElement, Fragment } from 'react';
2
-
3
- function isFragmentElement(child) {
4
- return isValidElement(child) && child.type === Fragment;
5
- }
6
- function isTreeNodeElement(child) {
7
- return isValidElement(child) && typeof child.props.value === "string";
8
- }
9
- function flattenTreeNodeChildren(children) {
10
- const flattenedChildren = [];
11
- Children.forEach(children, (child) => {
12
- if (isFragmentElement(child)) {
13
- flattenedChildren.push(...flattenTreeNodeChildren(child.props.children));
14
- } else if (child !== null && child !== void 0 && typeof child !== "boolean") {
15
- flattenedChildren.push(child);
16
- }
17
- });
18
- return flattenedChildren;
19
- }
20
- function getTreeNodeElements(children) {
21
- return flattenTreeNodeChildren(children).filter(isTreeNodeElement);
22
- }
23
- function buildTreeModel(children) {
24
- const nodes = /* @__PURE__ */ new Map();
25
- const rootValues = [];
26
- const childrenOf = /* @__PURE__ */ new Map();
27
- function traverse(reactChildren, parentValue, parentDisabled = false) {
28
- const treeNodeChildren = getTreeNodeElements(reactChildren);
29
- const siblingValues = [];
30
- for (const child of treeNodeChildren) {
31
- const value = child.props.value;
32
- const childTreeNodes = getTreeNodeElements(child.props.children);
33
- const hasChildren = childTreeNodes.length > 0;
34
- const disabled = parentDisabled || Boolean(child.props.disabled);
35
- nodes.set(value, {
36
- value,
37
- parentValue,
38
- hasChildren,
39
- disabled
40
- });
41
- siblingValues.push(value);
42
- if (hasChildren) {
43
- traverse(child.props.children, value, disabled);
44
- }
45
- }
46
- if (parentValue !== void 0) {
47
- childrenOf.set(parentValue, siblingValues);
48
- } else {
49
- rootValues.push(...siblingValues);
50
- }
51
- }
52
- traverse(children);
53
- return { nodes, rootValues, childrenOf };
54
- }
55
-
56
- export { buildTreeModel, flattenTreeNodeChildren, isTreeNodeElement };
57
- //# sourceMappingURL=treeModel.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"treeModel.js","sources":["../src/tree/treeModel.ts"],"sourcesContent":["import {\n Children,\n Fragment,\n isValidElement,\n type ReactElement,\n type ReactNode,\n} from \"react\";\n\nexport interface TreeNodeMeta {\n value: string;\n parentValue: string | undefined;\n hasChildren: boolean;\n disabled: boolean;\n}\n\nexport interface TreeModel {\n /** All nodes indexed by value */\n nodes: Map<string, TreeNodeMeta>;\n /** Ordered list of root node values */\n rootValues: string[];\n /** Maps parent value to ordered list of child values */\n childrenOf: Map<string, string[]>;\n}\n\ninterface TreeNodeElementProps {\n value: string;\n disabled?: boolean;\n children?: ReactNode;\n}\n\nfunction isFragmentElement(\n child: ReactNode,\n): child is ReactElement<{ children?: ReactNode }> {\n return (\n isValidElement<{ children?: ReactNode }>(child) && child.type === Fragment\n );\n}\n\nexport function isTreeNodeElement(\n child: ReactNode,\n): child is ReactElement<TreeNodeElementProps> {\n return (\n isValidElement<TreeNodeElementProps>(child) &&\n typeof child.props.value === \"string\"\n );\n}\n\nexport function flattenTreeNodeChildren(children: ReactNode): ReactNode[] {\n const flattenedChildren: ReactNode[] = [];\n\n Children.forEach(children, (child) => {\n if (isFragmentElement(child)) {\n flattenedChildren.push(...flattenTreeNodeChildren(child.props.children));\n } else if (\n child !== null &&\n child !== undefined &&\n typeof child !== \"boolean\"\n ) {\n flattenedChildren.push(child);\n }\n });\n\n return flattenedChildren;\n}\n\nfunction getTreeNodeElements(\n children: ReactNode,\n): ReactElement<TreeNodeElementProps>[] {\n return flattenTreeNodeChildren(children).filter(isTreeNodeElement);\n}\n\nexport function buildTreeModel(children: ReactNode): TreeModel {\n const nodes = new Map<string, TreeNodeMeta>();\n const rootValues: string[] = [];\n const childrenOf = new Map<string, string[]>();\n\n function traverse(\n reactChildren: ReactNode,\n parentValue?: string,\n parentDisabled = false,\n ): void {\n const treeNodeChildren = getTreeNodeElements(reactChildren);\n const siblingValues: string[] = [];\n\n for (const child of treeNodeChildren) {\n const value = child.props.value;\n const childTreeNodes = getTreeNodeElements(child.props.children);\n const hasChildren = childTreeNodes.length > 0;\n const disabled = parentDisabled || Boolean(child.props.disabled);\n\n nodes.set(value, {\n value,\n parentValue,\n hasChildren,\n disabled,\n });\n\n siblingValues.push(value);\n\n if (hasChildren) {\n traverse(child.props.children, value, disabled);\n }\n }\n\n if (parentValue !== undefined) {\n childrenOf.set(parentValue, siblingValues);\n } else {\n rootValues.push(...siblingValues);\n }\n }\n\n traverse(children);\n\n return { nodes, rootValues, childrenOf };\n}\n"],"names":[],"mappings":";;AA8BA,SAAS,kBACP,KAAA,EACiD;AACjD,EAAA,OACE,cAAA,CAAyC,KAAK,CAAA,IAAK,KAAA,CAAM,IAAA,KAAS,QAAA;AAEtE;AAEO,SAAS,kBACd,KAAA,EAC6C;AAC7C,EAAA,OACE,eAAqC,KAAK,CAAA,IAC1C,OAAO,KAAA,CAAM,MAAM,KAAA,KAAU,QAAA;AAEjC;AAEO,SAAS,wBAAwB,QAAA,EAAkC;AACxE,EAAA,MAAM,oBAAiC,EAAC;AAExC,EAAA,QAAA,CAAS,OAAA,CAAQ,QAAA,EAAU,CAAC,KAAA,KAAU;AACpC,IAAA,IAAI,iBAAA,CAAkB,KAAK,CAAA,EAAG;AAC5B,MAAA,iBAAA,CAAkB,KAAK,GAAG,uBAAA,CAAwB,KAAA,CAAM,KAAA,CAAM,QAAQ,CAAC,CAAA;AAAA,IACzE,WACE,KAAA,KAAU,IAAA,IACV,UAAU,MAAA,IACV,OAAO,UAAU,SAAA,EACjB;AACA,MAAA,iBAAA,CAAkB,KAAK,KAAK,CAAA;AAAA,IAC9B;AAAA,EACF,CAAC,CAAA;AAED,EAAA,OAAO,iBAAA;AACT;AAEA,SAAS,oBACP,QAAA,EACsC;AACtC,EAAA,OAAO,uBAAA,CAAwB,QAAQ,CAAA,CAAE,MAAA,CAAO,iBAAiB,CAAA;AACnE;AAEO,SAAS,eAAe,QAAA,EAAgC;AAC7D,EAAA,MAAM,KAAA,uBAAY,GAAA,EAA0B;AAC5C,EAAA,MAAM,aAAuB,EAAC;AAC9B,EAAA,MAAM,UAAA,uBAAiB,GAAA,EAAsB;AAE7C,EAAA,SAAS,QAAA,CACP,aAAA,EACA,WAAA,EACA,cAAA,GAAiB,KAAA,EACX;AACN,IAAA,MAAM,gBAAA,GAAmB,oBAAoB,aAAa,CAAA;AAC1D,IAAA,MAAM,gBAA0B,EAAC;AAEjC,IAAA,KAAA,MAAW,SAAS,gBAAA,EAAkB;AACpC,MAAA,MAAM,KAAA,GAAQ,MAAM,KAAA,CAAM,KAAA;AAC1B,MAAA,MAAM,cAAA,GAAiB,mBAAA,CAAoB,KAAA,CAAM,KAAA,CAAM,QAAQ,CAAA;AAC/D,MAAA,MAAM,WAAA,GAAc,eAAe,MAAA,GAAS,CAAA;AAC5C,MAAA,MAAM,QAAA,GAAW,cAAA,IAAkB,OAAA,CAAQ,KAAA,CAAM,MAAM,QAAQ,CAAA;AAE/D,MAAA,KAAA,CAAM,IAAI,KAAA,EAAO;AAAA,QACf,KAAA;AAAA,QACA,WAAA;AAAA,QACA,WAAA;AAAA,QACA;AAAA,OACD,CAAA;AAED,MAAA,aAAA,CAAc,KAAK,KAAK,CAAA;AAExB,MAAA,IAAI,WAAA,EAAa;AACf,QAAA,QAAA,CAAS,KAAA,CAAM,KAAA,CAAM,QAAA,EAAU,KAAA,EAAO,QAAQ,CAAA;AAAA,MAChD;AAAA,IACF;AAEA,IAAA,IAAI,gBAAgB,MAAA,EAAW;AAC7B,MAAA,UAAA,CAAW,GAAA,CAAI,aAAa,aAAa,CAAA;AAAA,IAC3C,CAAA,MAAO;AACL,MAAA,UAAA,CAAW,IAAA,CAAK,GAAG,aAAa,CAAA;AAAA,IAClC;AAAA,EACF;AAEA,EAAA,QAAA,CAAS,QAAQ,CAAA;AAEjB,EAAA,OAAO,EAAE,KAAA,EAAO,UAAA,EAAY,UAAA,EAAW;AACzC;;;;"}