@fluentui/react-tree 9.16.3 → 9.16.5
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.
- package/CHANGELOG.md +35 -2
- package/dist/index.d.cts +941 -0
- package/lib/FlatTree.js +1 -1
- package/lib/FlatTree.js.map +1 -1
- package/lib/FlatTreeItem.js +1 -1
- package/lib/FlatTreeItem.js.map +1 -1
- package/lib/Tree.js +1 -1
- package/lib/Tree.js.map +1 -1
- package/lib/TreeItem.js +1 -1
- package/lib/TreeItem.js.map +1 -1
- package/lib/TreeItemLayout.js +1 -1
- package/lib/TreeItemLayout.js.map +1 -1
- package/lib/TreeItemPersonaLayout.js +1 -1
- package/lib/TreeItemPersonaLayout.js.map +1 -1
- package/lib/components/FlatTree/FlatTree.js +6 -6
- package/lib/components/FlatTree/FlatTree.js.map +1 -1
- package/lib/components/FlatTree/index.js +6 -6
- package/lib/components/FlatTree/index.js.map +1 -1
- package/lib/components/FlatTree/renderFlatTree.js +1 -1
- package/lib/components/FlatTree/renderFlatTree.js.map +1 -1
- package/lib/components/FlatTree/useFlatControllableCheckedItems.js +4 -4
- package/lib/components/FlatTree/useFlatControllableCheckedItems.js.map +1 -1
- package/lib/components/FlatTree/useFlatTree.js +8 -8
- package/lib/components/FlatTree/useFlatTree.js.map +1 -1
- package/lib/components/FlatTree/useFlatTreeContextValues.js +1 -1
- package/lib/components/FlatTree/useFlatTreeStyles.styles.js +2 -2
- package/lib/components/FlatTree/useFlatTreeStyles.styles.js.map +1 -1
- package/lib/components/FlatTree/useFlatTreeStyles.styles.raw.js +2 -2
- package/lib/components/FlatTree/useHeadlessFlatTree.js +10 -10
- package/lib/components/FlatTree/useHeadlessFlatTree.js.map +1 -1
- package/lib/components/FlatTreeItem/FlatTreeItem.js +1 -1
- package/lib/components/FlatTreeItem/FlatTreeItem.js.map +1 -1
- package/lib/components/FlatTreeItem/index.js +1 -1
- package/lib/components/FlatTreeItem/index.js.map +1 -1
- package/lib/components/Tree/Tree.js +6 -6
- package/lib/components/Tree/Tree.js.map +1 -1
- package/lib/components/Tree/index.js +5 -5
- package/lib/components/Tree/index.js.map +1 -1
- package/lib/components/Tree/renderTree.js +2 -2
- package/lib/components/Tree/renderTree.js.map +1 -1
- package/lib/components/Tree/useNestedControllableCheckedItems.js +3 -3
- package/lib/components/Tree/useNestedControllableCheckedItems.js.map +1 -1
- package/lib/components/Tree/useTree.js +11 -11
- package/lib/components/Tree/useTree.js.map +1 -1
- package/lib/components/Tree/useTreeContextValues.js +1 -1
- package/lib/components/Tree/useTreeStyles.styles.js +2 -2
- package/lib/components/Tree/useTreeStyles.styles.js.map +1 -1
- package/lib/components/Tree/useTreeStyles.styles.raw.js +2 -2
- package/lib/components/TreeItem/TreeItem.js +6 -6
- package/lib/components/TreeItem/TreeItem.js.map +1 -1
- package/lib/components/TreeItem/index.js +5 -5
- package/lib/components/TreeItem/index.js.map +1 -1
- package/lib/components/TreeItem/renderTreeItem.js +2 -2
- package/lib/components/TreeItem/renderTreeItem.js.map +1 -1
- package/lib/components/TreeItem/useTreeItem.js +9 -9
- package/lib/components/TreeItem/useTreeItem.js.map +1 -1
- package/lib/components/TreeItem/useTreeItemContextValues.js +1 -1
- package/lib/components/TreeItem/useTreeItemStyles.styles.js +6 -6
- package/lib/components/TreeItem/useTreeItemStyles.styles.js.map +1 -1
- package/lib/components/TreeItem/useTreeItemStyles.styles.raw.js +6 -6
- package/lib/components/TreeItem/useTreeItemStyles.styles.raw.js.map +1 -1
- package/lib/components/TreeItemChevron.js +5 -5
- package/lib/components/TreeItemChevron.js.map +1 -1
- package/lib/components/TreeItemLayout/TreeItemLayout.js +5 -5
- package/lib/components/TreeItemLayout/TreeItemLayout.js.map +1 -1
- package/lib/components/TreeItemLayout/index.js +4 -4
- package/lib/components/TreeItemLayout/index.js.map +1 -1
- package/lib/components/TreeItemLayout/renderTreeItemLayout.js +2 -2
- package/lib/components/TreeItemLayout/useTreeItemLayout.js +44 -40
- package/lib/components/TreeItemLayout/useTreeItemLayout.js.map +1 -1
- package/lib/components/TreeItemLayout/useTreeItemLayoutStyles.styles.js +5 -5
- package/lib/components/TreeItemLayout/useTreeItemLayoutStyles.styles.js.map +1 -1
- package/lib/components/TreeItemLayout/useTreeItemLayoutStyles.styles.raw.js +5 -5
- package/lib/components/TreeItemLayout/useTreeItemLayoutStyles.styles.raw.js.map +1 -1
- package/lib/components/TreeItemPersonaLayout/TreeItemPersonaLayout.js +6 -6
- package/lib/components/TreeItemPersonaLayout/TreeItemPersonaLayout.js.map +1 -1
- package/lib/components/TreeItemPersonaLayout/index.js +4 -4
- package/lib/components/TreeItemPersonaLayout/index.js.map +1 -1
- package/lib/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js +3 -3
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayout.js +8 -7
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayout.js.map +1 -1
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutContextValues.js +1 -1
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.js +5 -5
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.js.map +1 -1
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.raw.js +5 -5
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.raw.js.map +1 -1
- package/lib/components/TreeProvider.js +2 -2
- package/lib/components/TreeProvider.js.map +1 -1
- package/lib/contexts/index.js +3 -3
- package/lib/contexts/index.js.map +1 -1
- package/lib/contexts/subtreeContext.js +1 -1
- package/lib/contexts/treeContext.js +3 -3
- package/lib/contexts/treeContext.js.map +1 -1
- package/lib/contexts/treeItemContext.js +3 -3
- package/lib/contexts/treeItemContext.js.map +1 -1
- package/lib/hooks/useControllableOpenItems.js +3 -3
- package/lib/hooks/useControllableOpenItems.js.map +1 -1
- package/lib/hooks/useFlatTreeNavigation.js +9 -9
- package/lib/hooks/useFlatTreeNavigation.js.map +1 -1
- package/lib/hooks/useHTMLElementWalkerRef.js +4 -4
- package/lib/hooks/useHTMLElementWalkerRef.js.map +1 -1
- package/lib/hooks/useRootTree.js +8 -8
- package/lib/hooks/useRootTree.js.map +1 -1
- package/lib/hooks/useRovingTabIndexes.js +3 -3
- package/lib/hooks/useSubtree.js +4 -4
- package/lib/hooks/useSubtree.js.map +1 -1
- package/lib/hooks/useTreeNavigation.js +8 -8
- package/lib/hooks/useTreeNavigation.js.map +1 -1
- package/lib/index.js +12 -12
- package/lib/index.js.map +1 -1
- package/lib/utils/createCheckedItems.js +1 -1
- package/lib/utils/createCheckedItems.js.map +1 -1
- package/lib/utils/createHTMLElementWalker.js +1 -1
- package/lib/utils/tokens.js +1 -1
- package/lib-commonjs/{FlatTree.js → FlatTree.cjs} +1 -1
- package/lib-commonjs/{FlatTree.js.map → FlatTree.cjs.map} +1 -1
- package/lib-commonjs/{FlatTreeItem.js → FlatTreeItem.cjs} +1 -1
- package/lib-commonjs/{FlatTreeItem.js.map → FlatTreeItem.cjs.map} +1 -1
- package/lib-commonjs/{Tree.js → Tree.cjs} +1 -1
- package/lib-commonjs/{Tree.js.map → Tree.cjs.map} +1 -1
- package/lib-commonjs/{TreeItem.js → TreeItem.cjs} +1 -1
- package/lib-commonjs/{TreeItem.js.map → TreeItem.cjs.map} +1 -1
- package/lib-commonjs/{TreeItemLayout.js → TreeItemLayout.cjs} +1 -1
- package/lib-commonjs/{TreeItemLayout.js.map → TreeItemLayout.cjs.map} +1 -1
- package/lib-commonjs/{TreeItemPersonaLayout.js → TreeItemPersonaLayout.cjs} +1 -1
- package/lib-commonjs/{TreeItemPersonaLayout.js.map → TreeItemPersonaLayout.cjs.map} +1 -1
- package/lib-commonjs/components/FlatTree/{FlatTree.js → FlatTree.cjs} +4 -4
- package/lib-commonjs/components/FlatTree/{FlatTree.js.map → FlatTree.cjs.map} +1 -1
- package/lib-commonjs/components/FlatTree/{index.js → index.cjs} +6 -6
- package/lib-commonjs/components/FlatTree/{index.js.map → index.cjs.map} +1 -1
- package/lib-commonjs/components/FlatTree/{renderFlatTree.js → renderFlatTree.cjs} +1 -1
- package/lib-commonjs/components/FlatTree/{renderFlatTree.js.map → renderFlatTree.cjs.map} +1 -1
- package/lib-commonjs/components/FlatTree/{useFlatControllableCheckedItems.js → useFlatControllableCheckedItems.cjs} +2 -2
- package/lib-commonjs/components/FlatTree/{useFlatControllableCheckedItems.js.map → useFlatControllableCheckedItems.cjs.map} +1 -1
- package/lib-commonjs/components/FlatTree/{useFlatTree.js → useFlatTree.cjs} +6 -6
- package/lib-commonjs/components/FlatTree/{useFlatTree.js.map → useFlatTree.cjs.map} +1 -1
- package/lib-commonjs/components/FlatTree/useFlatTreeStyles.styles.cjs.map +1 -0
- package/lib-commonjs/components/FlatTree/{useHeadlessFlatTree.js → useHeadlessFlatTree.cjs} +8 -8
- package/lib-commonjs/components/FlatTree/{useHeadlessFlatTree.js.map → useHeadlessFlatTree.cjs.map} +1 -1
- package/lib-commonjs/components/FlatTreeItem/{FlatTreeItem.js → FlatTreeItem.cjs} +1 -1
- package/lib-commonjs/components/FlatTreeItem/{FlatTreeItem.js.map → FlatTreeItem.cjs.map} +1 -1
- package/lib-commonjs/components/FlatTreeItem/{index.js → index.cjs} +1 -1
- package/lib-commonjs/components/FlatTreeItem/{index.js.map → index.cjs.map} +1 -1
- package/lib-commonjs/components/Tree/{Tree.js → Tree.cjs} +4 -4
- package/lib-commonjs/components/Tree/{Tree.js.map → Tree.cjs.map} +1 -1
- package/lib-commonjs/components/Tree/{index.js → index.cjs} +5 -5
- package/lib-commonjs/components/Tree/{index.js.map → index.cjs.map} +1 -1
- package/lib-commonjs/components/Tree/{renderTree.js → renderTree.cjs} +1 -1
- package/lib-commonjs/components/Tree/{renderTree.js.map → renderTree.cjs.map} +1 -1
- package/lib-commonjs/components/Tree/{useNestedControllableCheckedItems.js → useNestedControllableCheckedItems.cjs} +2 -2
- package/lib-commonjs/components/Tree/{useNestedControllableCheckedItems.js.map → useNestedControllableCheckedItems.cjs.map} +1 -1
- package/lib-commonjs/components/Tree/{useTree.js → useTree.cjs} +9 -9
- package/lib-commonjs/components/Tree/{useTree.js.map → useTree.cjs.map} +1 -1
- package/lib-commonjs/components/Tree/useTreeStyles.styles.cjs.map +1 -0
- package/lib-commonjs/components/TreeItem/{TreeItem.js → TreeItem.cjs} +4 -4
- package/lib-commonjs/components/TreeItem/{TreeItem.js.map → TreeItem.cjs.map} +1 -1
- package/lib-commonjs/components/TreeItem/{index.js → index.cjs} +5 -5
- package/lib-commonjs/components/TreeItem/{index.js.map → index.cjs.map} +1 -1
- package/lib-commonjs/components/TreeItem/{renderTreeItem.js → renderTreeItem.cjs} +2 -2
- package/lib-commonjs/components/TreeItem/{renderTreeItem.js.map → renderTreeItem.cjs.map} +1 -1
- package/lib-commonjs/components/TreeItem/{useTreeItem.js → useTreeItem.cjs} +14 -14
- package/lib-commonjs/components/TreeItem/{useTreeItem.js.map → useTreeItem.cjs.map} +1 -1
- package/lib-commonjs/components/TreeItem/{useTreeItemStyles.styles.js → useTreeItemStyles.styles.cjs} +1 -1
- package/lib-commonjs/components/TreeItem/useTreeItemStyles.styles.cjs.map +1 -0
- package/lib-commonjs/components/TreeItem/{useTreeItemStyles.styles.raw.js → useTreeItemStyles.styles.raw.cjs} +3 -3
- package/lib-commonjs/components/TreeItem/{useTreeItemStyles.styles.raw.js.map → useTreeItemStyles.styles.raw.cjs.map} +1 -1
- package/lib-commonjs/components/{TreeItemChevron.js → TreeItemChevron.cjs} +1 -1
- package/lib-commonjs/components/{TreeItemChevron.js.map → TreeItemChevron.cjs.map} +1 -1
- package/lib-commonjs/components/TreeItemLayout/{TreeItemLayout.js → TreeItemLayout.cjs} +3 -3
- package/lib-commonjs/components/TreeItemLayout/{TreeItemLayout.js.map → TreeItemLayout.cjs.map} +1 -1
- package/lib-commonjs/components/TreeItemLayout/{index.js → index.cjs} +4 -4
- package/lib-commonjs/components/TreeItemLayout/{index.js.map → index.cjs.map} +1 -1
- package/lib-commonjs/components/TreeItemLayout/{useTreeItemLayout.js → useTreeItemLayout.cjs} +48 -44
- package/lib-commonjs/components/TreeItemLayout/useTreeItemLayout.cjs.map +1 -0
- package/lib-commonjs/components/TreeItemLayout/{useTreeItemLayoutStyles.styles.js → useTreeItemLayoutStyles.styles.cjs} +2 -2
- package/lib-commonjs/components/TreeItemLayout/useTreeItemLayoutStyles.styles.cjs.map +1 -0
- package/lib-commonjs/components/TreeItemLayout/{useTreeItemLayoutStyles.styles.raw.js → useTreeItemLayoutStyles.styles.raw.cjs} +3 -3
- package/lib-commonjs/components/TreeItemLayout/{useTreeItemLayoutStyles.styles.raw.js.map → useTreeItemLayoutStyles.styles.raw.cjs.map} +1 -1
- package/lib-commonjs/components/TreeItemPersonaLayout/{TreeItemPersonaLayout.js → TreeItemPersonaLayout.cjs} +4 -4
- package/lib-commonjs/components/TreeItemPersonaLayout/{TreeItemPersonaLayout.js.map → TreeItemPersonaLayout.cjs.map} +1 -1
- package/lib-commonjs/components/TreeItemPersonaLayout/{index.js → index.cjs} +4 -4
- package/lib-commonjs/components/TreeItemPersonaLayout/{index.js.map → index.cjs.map} +1 -1
- package/lib-commonjs/components/TreeItemPersonaLayout/{useTreeItemPersonaLayout.js → useTreeItemPersonaLayout.cjs} +7 -6
- package/lib-commonjs/components/TreeItemPersonaLayout/{useTreeItemPersonaLayout.js.map → useTreeItemPersonaLayout.cjs.map} +1 -1
- package/lib-commonjs/components/TreeItemPersonaLayout/{useTreeItemPersonaLayoutStyles.styles.js → useTreeItemPersonaLayoutStyles.styles.cjs} +2 -2
- package/lib-commonjs/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.cjs.map +1 -0
- package/lib-commonjs/components/TreeItemPersonaLayout/{useTreeItemPersonaLayoutStyles.styles.raw.js → useTreeItemPersonaLayoutStyles.styles.raw.cjs} +3 -3
- package/lib-commonjs/components/TreeItemPersonaLayout/{useTreeItemPersonaLayoutStyles.styles.raw.js.map → useTreeItemPersonaLayoutStyles.styles.raw.cjs.map} +1 -1
- package/lib-commonjs/components/{TreeProvider.js → TreeProvider.cjs} +5 -5
- package/lib-commonjs/components/{TreeProvider.js.map → TreeProvider.cjs.map} +1 -1
- package/lib-commonjs/contexts/{index.js → index.cjs} +3 -3
- package/lib-commonjs/contexts/{index.js.map → index.cjs.map} +1 -1
- package/lib-commonjs/contexts/{treeContext.js → treeContext.cjs} +2 -2
- package/lib-commonjs/contexts/{treeContext.js.map → treeContext.cjs.map} +1 -1
- package/lib-commonjs/contexts/{treeItemContext.js → treeItemContext.cjs} +1 -1
- package/lib-commonjs/contexts/{treeItemContext.js.map → treeItemContext.cjs.map} +1 -1
- package/lib-commonjs/hooks/{useControllableOpenItems.js → useControllableOpenItems.cjs} +1 -1
- package/lib-commonjs/hooks/{useControllableOpenItems.js.map → useControllableOpenItems.cjs.map} +1 -1
- package/lib-commonjs/hooks/{useFlatTreeNavigation.js → useFlatTreeNavigation.cjs} +6 -6
- package/lib-commonjs/hooks/{useFlatTreeNavigation.js.map → useFlatTreeNavigation.cjs.map} +1 -1
- package/lib-commonjs/hooks/{useHTMLElementWalkerRef.js → useHTMLElementWalkerRef.cjs} +2 -2
- package/lib-commonjs/hooks/{useHTMLElementWalkerRef.js.map → useHTMLElementWalkerRef.cjs.map} +1 -1
- package/lib-commonjs/hooks/{useRootTree.js → useRootTree.cjs} +5 -5
- package/lib-commonjs/hooks/{useRootTree.js.map → useRootTree.cjs.map} +1 -1
- package/lib-commonjs/hooks/{useSubtree.js → useSubtree.cjs} +1 -1
- package/lib-commonjs/hooks/{useSubtree.js.map → useSubtree.cjs.map} +1 -1
- package/lib-commonjs/hooks/{useTreeNavigation.js → useTreeNavigation.cjs} +5 -5
- package/lib-commonjs/hooks/{useTreeNavigation.js.map → useTreeNavigation.cjs.map} +1 -1
- package/lib-commonjs/{index.js → index.cjs} +16 -16
- package/lib-commonjs/{index.js.map → index.cjs.map} +1 -1
- package/lib-commonjs/utils/{createCheckedItems.js → createCheckedItems.cjs} +1 -1
- package/lib-commonjs/utils/{createCheckedItems.js.map → createCheckedItems.cjs.map} +1 -1
- package/package.json +27 -21
- package/lib-commonjs/components/FlatTree/useFlatTreeStyles.styles.js.map +0 -1
- package/lib-commonjs/components/Tree/useTreeStyles.styles.js.map +0 -1
- package/lib-commonjs/components/TreeItem/useTreeItemStyles.styles.js.map +0 -1
- package/lib-commonjs/components/TreeItemLayout/useTreeItemLayout.js.map +0 -1
- package/lib-commonjs/components/TreeItemLayout/useTreeItemLayoutStyles.styles.js.map +0 -1
- package/lib-commonjs/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.js.map +0 -1
- /package/lib-commonjs/components/FlatTree/{FlatTree.types.js → FlatTree.types.cjs} +0 -0
- /package/lib-commonjs/components/FlatTree/{FlatTree.types.js.map → FlatTree.types.cjs.map} +0 -0
- /package/lib-commonjs/components/FlatTree/{useFlatTreeContextValues.js → useFlatTreeContextValues.cjs} +0 -0
- /package/lib-commonjs/components/FlatTree/{useFlatTreeContextValues.js.map → useFlatTreeContextValues.cjs.map} +0 -0
- /package/lib-commonjs/components/FlatTree/{useFlatTreeStyles.styles.js → useFlatTreeStyles.styles.cjs} +0 -0
- /package/lib-commonjs/components/FlatTree/{useFlatTreeStyles.styles.raw.js → useFlatTreeStyles.styles.raw.cjs} +0 -0
- /package/lib-commonjs/components/FlatTree/{useFlatTreeStyles.styles.raw.js.map → useFlatTreeStyles.styles.raw.cjs.map} +0 -0
- /package/lib-commonjs/components/FlatTreeItem/{FlatTreeItem.types.js → FlatTreeItem.types.cjs} +0 -0
- /package/lib-commonjs/components/FlatTreeItem/{FlatTreeItem.types.js.map → FlatTreeItem.types.cjs.map} +0 -0
- /package/lib-commonjs/components/Tree/{Tree.types.js → Tree.types.cjs} +0 -0
- /package/lib-commonjs/components/Tree/{Tree.types.js.map → Tree.types.cjs.map} +0 -0
- /package/lib-commonjs/components/Tree/{useTreeContextValues.js → useTreeContextValues.cjs} +0 -0
- /package/lib-commonjs/components/Tree/{useTreeContextValues.js.map → useTreeContextValues.cjs.map} +0 -0
- /package/lib-commonjs/components/Tree/{useTreeStyles.styles.js → useTreeStyles.styles.cjs} +0 -0
- /package/lib-commonjs/components/Tree/{useTreeStyles.styles.raw.js → useTreeStyles.styles.raw.cjs} +0 -0
- /package/lib-commonjs/components/Tree/{useTreeStyles.styles.raw.js.map → useTreeStyles.styles.raw.cjs.map} +0 -0
- /package/lib-commonjs/components/TreeItem/{TreeItem.types.js → TreeItem.types.cjs} +0 -0
- /package/lib-commonjs/components/TreeItem/{TreeItem.types.js.map → TreeItem.types.cjs.map} +0 -0
- /package/lib-commonjs/components/TreeItem/{useTreeItemContextValues.js → useTreeItemContextValues.cjs} +0 -0
- /package/lib-commonjs/components/TreeItem/{useTreeItemContextValues.js.map → useTreeItemContextValues.cjs.map} +0 -0
- /package/lib-commonjs/components/TreeItemLayout/{TreeItemLayout.types.js → TreeItemLayout.types.cjs} +0 -0
- /package/lib-commonjs/components/TreeItemLayout/{TreeItemLayout.types.js.map → TreeItemLayout.types.cjs.map} +0 -0
- /package/lib-commonjs/components/TreeItemLayout/{renderTreeItemLayout.js → renderTreeItemLayout.cjs} +0 -0
- /package/lib-commonjs/components/TreeItemLayout/{renderTreeItemLayout.js.map → renderTreeItemLayout.cjs.map} +0 -0
- /package/lib-commonjs/components/TreeItemPersonaLayout/{TreeItemPersonaLayout.types.js → TreeItemPersonaLayout.types.cjs} +0 -0
- /package/lib-commonjs/components/TreeItemPersonaLayout/{TreeItemPersonaLayout.types.js.map → TreeItemPersonaLayout.types.cjs.map} +0 -0
- /package/lib-commonjs/components/TreeItemPersonaLayout/{renderTreeItemPersonaLayout.js → renderTreeItemPersonaLayout.cjs} +0 -0
- /package/lib-commonjs/components/TreeItemPersonaLayout/{renderTreeItemPersonaLayout.js.map → renderTreeItemPersonaLayout.cjs.map} +0 -0
- /package/lib-commonjs/components/TreeItemPersonaLayout/{useTreeItemPersonaLayoutContextValues.js → useTreeItemPersonaLayoutContextValues.cjs} +0 -0
- /package/lib-commonjs/components/TreeItemPersonaLayout/{useTreeItemPersonaLayoutContextValues.js.map → useTreeItemPersonaLayoutContextValues.cjs.map} +0 -0
- /package/lib-commonjs/contexts/{subtreeContext.js → subtreeContext.cjs} +0 -0
- /package/lib-commonjs/contexts/{subtreeContext.js.map → subtreeContext.cjs.map} +0 -0
- /package/lib-commonjs/hooks/{useRovingTabIndexes.js → useRovingTabIndexes.cjs} +0 -0
- /package/lib-commonjs/hooks/{useRovingTabIndexes.js.map → useRovingTabIndexes.cjs.map} +0 -0
- /package/lib-commonjs/utils/{ImmutableMap.js → ImmutableMap.cjs} +0 -0
- /package/lib-commonjs/utils/{ImmutableMap.js.map → ImmutableMap.cjs.map} +0 -0
- /package/lib-commonjs/utils/{ImmutableSet.js → ImmutableSet.cjs} +0 -0
- /package/lib-commonjs/utils/{ImmutableSet.js.map → ImmutableSet.cjs.map} +0 -0
- /package/lib-commonjs/utils/{assert.js → assert.cjs} +0 -0
- /package/lib-commonjs/utils/{assert.js.map → assert.cjs.map} +0 -0
- /package/lib-commonjs/utils/{createHTMLElementWalker.js → createHTMLElementWalker.cjs} +0 -0
- /package/lib-commonjs/utils/{createHTMLElementWalker.js.map → createHTMLElementWalker.cjs.map} +0 -0
- /package/lib-commonjs/utils/{createHeadlessTree.js → createHeadlessTree.cjs} +0 -0
- /package/lib-commonjs/utils/{createHeadlessTree.js.map → createHeadlessTree.cjs.map} +0 -0
- /package/lib-commonjs/utils/{flattenTree.js → flattenTree.cjs} +0 -0
- /package/lib-commonjs/utils/{flattenTree.js.map → flattenTree.cjs.map} +0 -0
- /package/lib-commonjs/utils/{getTreeItemValueFromElement.js → getTreeItemValueFromElement.cjs} +0 -0
- /package/lib-commonjs/utils/{getTreeItemValueFromElement.js.map → getTreeItemValueFromElement.cjs.map} +0 -0
- /package/lib-commonjs/utils/{nextTypeAheadElement.js → nextTypeAheadElement.cjs} +0 -0
- /package/lib-commonjs/utils/{nextTypeAheadElement.js.map → nextTypeAheadElement.cjs.map} +0 -0
- /package/lib-commonjs/utils/{normalizeOpenItems.js → normalizeOpenItems.cjs} +0 -0
- /package/lib-commonjs/utils/{normalizeOpenItems.js.map → normalizeOpenItems.cjs.map} +0 -0
- /package/lib-commonjs/utils/{tokens.js → tokens.cjs} +0 -0
- /package/lib-commonjs/utils/{tokens.js.map → tokens.cjs.map} +0 -0
- /package/lib-commonjs/utils/{treeItemFilter.js → treeItemFilter.cjs} +0 -0
- /package/lib-commonjs/utils/{treeItemFilter.js.map → treeItemFilter.cjs.map} +0 -0
|
@@ -13,11 +13,11 @@ const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildc
|
|
|
13
13
|
const _reactutilities = require("@fluentui/react-utilities");
|
|
14
14
|
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
15
15
|
const _reactmotioncomponentspreview = require("@fluentui/react-motion-components-preview");
|
|
16
|
-
const _createCheckedItems = require("../utils/createCheckedItems");
|
|
17
|
-
const _tokens = require("../utils/tokens");
|
|
18
|
-
const _useControllableOpenItems = require("./useControllableOpenItems");
|
|
19
|
-
const _ImmutableSet = require("../utils/ImmutableSet");
|
|
20
|
-
const _ImmutableMap = require("../utils/ImmutableMap");
|
|
16
|
+
const _createCheckedItems = require("../utils/createCheckedItems.cjs");
|
|
17
|
+
const _tokens = require("../utils/tokens.cjs");
|
|
18
|
+
const _useControllableOpenItems = require("./useControllableOpenItems.cjs");
|
|
19
|
+
const _ImmutableSet = require("../utils/ImmutableSet.cjs");
|
|
20
|
+
const _ImmutableMap = require("../utils/ImmutableMap.cjs");
|
|
21
21
|
function useRootTree(props, ref) {
|
|
22
22
|
warnIfNoProperPropsRootTree(props);
|
|
23
23
|
const { appearance = 'subtle', size = 'medium', selectionMode = 'none' } = props;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/hooks/useRootTree.ts"],"sourcesContent":["'use client';\n\nimport { getIntrinsicElementProps, useEventCallback, slot } from '@fluentui/react-utilities';\nimport type { TreeCheckedChangeData, TreeProps, TreeState } from '../Tree';\nimport * as React from 'react';\nimport { Collapse } from '@fluentui/react-motion-components-preview';\nimport type { TreeContextValue, TreeItemRequest } from '../contexts/treeContext';\nimport { createCheckedItems } from '../utils/createCheckedItems';\nimport { treeDataTypes } from '../utils/tokens';\nimport { createNextOpenItems } from './useControllableOpenItems';\nimport { ImmutableSet } from '../utils/ImmutableSet';\nimport { ImmutableMap } from '../utils/ImmutableMap';\n\n/**\n * Create the state required to render the root level tree.\n *\n * @param props - props from this instance of tree\n * @param ref - reference to root HTMLElement of tree\n */\nexport function useRootTree(\n props: TreeProps,\n ref: React.Ref<HTMLElement>,\n): Omit<TreeState & TreeContextValue, 'treeType'> {\n warnIfNoProperPropsRootTree(props);\n\n const { appearance = 'subtle', size = 'medium', selectionMode = 'none' } = props;\n\n const openItems = React.useMemo(() => ImmutableSet.from(props.openItems), [props.openItems]);\n const checkedItems = React.useMemo(() => createCheckedItems(props.checkedItems), [props.checkedItems]);\n\n const requestOpenChange = (request: Extract<TreeItemRequest, { requestType: 'open' }>) => {\n props.onOpenChange?.(request.event, {\n ...request,\n openItems: ImmutableSet.dangerouslyGetInternalSet(createNextOpenItems(request, openItems)),\n });\n };\n\n const requestCheckedChange = (request: Extract<TreeItemRequest, { requestType: 'selection' }>) => {\n if (selectionMode === 'none') {\n return;\n }\n props.onCheckedChange?.(request.event, {\n ...request,\n selectionMode,\n checkedItems: ImmutableMap.dangerouslyGetInternalMap(checkedItems),\n // Casting is required here due to selection | multiselection spreading the union problem\n } as TreeCheckedChangeData);\n };\n\n const requestNavigation = (request: Extract<TreeItemRequest, { requestType: 'navigate' }>) => {\n let isScrollPrevented = false;\n props.onNavigation?.(request.event, {\n ...request,\n preventScroll: () => {\n isScrollPrevented = true;\n },\n isScrollPrevented: () => isScrollPrevented,\n });\n switch (request.type) {\n case treeDataTypes.ArrowDown:\n case treeDataTypes.ArrowUp:\n case treeDataTypes.Home:\n case treeDataTypes.End:\n // stop the default behavior of the event\n // which is to scroll the page\n request.event.preventDefault();\n }\n };\n\n const requestTreeResponse = useEventCallback((request: TreeItemRequest) => {\n switch (request.requestType) {\n case 'navigate':\n return requestNavigation(request);\n case 'open':\n return requestOpenChange(request);\n case 'selection':\n return requestCheckedChange(request);\n }\n });\n\n return {\n components: {\n root: 'div',\n collapseMotion: Collapse,\n },\n contextType: 'root',\n selectionMode,\n navigationMode: props.navigationMode ?? 'tree',\n open: true,\n appearance,\n size,\n level: 1,\n openItems,\n checkedItems,\n requestTreeResponse,\n forceUpdateRovingTabIndex: () => {\n // noop\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: ref as React.Ref<HTMLDivElement>,\n role: 'tree',\n 'aria-multiselectable': selectionMode === 'multiselect' ? true : undefined,\n ...props,\n }),\n { elementType: 'div' },\n ),\n collapseMotion: undefined,\n };\n}\n\nfunction warnIfNoProperPropsRootTree(props: Pick<TreeProps, 'aria-label' | 'aria-labelledby'>) {\n if (process.env.NODE_ENV === 'development') {\n if (!props['aria-label'] && !props['aria-labelledby']) {\n // eslint-disable-next-line no-console\n console.warn(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [useRootTree]:\n Tree must have either a \\`aria-label\\` or \\`aria-labelledby\\` property defined\n `);\n }\n }\n}\n"],"names":["getIntrinsicElementProps","useEventCallback","slot","React","Collapse","createCheckedItems","treeDataTypes","createNextOpenItems","ImmutableSet","ImmutableMap","useRootTree","props","ref","warnIfNoProperPropsRootTree","appearance","size","selectionMode","openItems","useMemo","from","checkedItems","requestOpenChange","request","onOpenChange","event","dangerouslyGetInternalSet","requestCheckedChange","onCheckedChange","dangerouslyGetInternalMap","requestNavigation","isScrollPrevented","onNavigation","preventScroll","type","ArrowDown","ArrowUp","Home","End","preventDefault","requestTreeResponse","requestType","components","root","collapseMotion","contextType","navigationMode","open","level","forceUpdateRovingTabIndex","always","role","undefined","elementType","process","env","NODE_ENV","console","warn"],"mappings":"AAAA;;;;;+BAmBgBU;;;;;;;gCAjBiD,4BAA4B;iEAEtE,QAAQ;8CACN,4CAA4C;oCAElC,
|
|
1
|
+
{"version":3,"sources":["../src/hooks/useRootTree.ts"],"sourcesContent":["'use client';\n\nimport { getIntrinsicElementProps, useEventCallback, slot } from '@fluentui/react-utilities';\nimport type { TreeCheckedChangeData, TreeProps, TreeState } from '../Tree';\nimport * as React from 'react';\nimport { Collapse } from '@fluentui/react-motion-components-preview';\nimport type { TreeContextValue, TreeItemRequest } from '../contexts/treeContext';\nimport { createCheckedItems } from '../utils/createCheckedItems';\nimport { treeDataTypes } from '../utils/tokens';\nimport { createNextOpenItems } from './useControllableOpenItems';\nimport { ImmutableSet } from '../utils/ImmutableSet';\nimport { ImmutableMap } from '../utils/ImmutableMap';\n\n/**\n * Create the state required to render the root level tree.\n *\n * @param props - props from this instance of tree\n * @param ref - reference to root HTMLElement of tree\n */\nexport function useRootTree(\n props: TreeProps,\n ref: React.Ref<HTMLElement>,\n): Omit<TreeState & TreeContextValue, 'treeType'> {\n warnIfNoProperPropsRootTree(props);\n\n const { appearance = 'subtle', size = 'medium', selectionMode = 'none' } = props;\n\n const openItems = React.useMemo(() => ImmutableSet.from(props.openItems), [props.openItems]);\n const checkedItems = React.useMemo(() => createCheckedItems(props.checkedItems), [props.checkedItems]);\n\n const requestOpenChange = (request: Extract<TreeItemRequest, { requestType: 'open' }>) => {\n props.onOpenChange?.(request.event, {\n ...request,\n openItems: ImmutableSet.dangerouslyGetInternalSet(createNextOpenItems(request, openItems)),\n });\n };\n\n const requestCheckedChange = (request: Extract<TreeItemRequest, { requestType: 'selection' }>) => {\n if (selectionMode === 'none') {\n return;\n }\n props.onCheckedChange?.(request.event, {\n ...request,\n selectionMode,\n checkedItems: ImmutableMap.dangerouslyGetInternalMap(checkedItems),\n // Casting is required here due to selection | multiselection spreading the union problem\n } as TreeCheckedChangeData);\n };\n\n const requestNavigation = (request: Extract<TreeItemRequest, { requestType: 'navigate' }>) => {\n let isScrollPrevented = false;\n props.onNavigation?.(request.event, {\n ...request,\n preventScroll: () => {\n isScrollPrevented = true;\n },\n isScrollPrevented: () => isScrollPrevented,\n });\n switch (request.type) {\n case treeDataTypes.ArrowDown:\n case treeDataTypes.ArrowUp:\n case treeDataTypes.Home:\n case treeDataTypes.End:\n // stop the default behavior of the event\n // which is to scroll the page\n request.event.preventDefault();\n }\n };\n\n const requestTreeResponse = useEventCallback((request: TreeItemRequest) => {\n switch (request.requestType) {\n case 'navigate':\n return requestNavigation(request);\n case 'open':\n return requestOpenChange(request);\n case 'selection':\n return requestCheckedChange(request);\n }\n });\n\n return {\n components: {\n root: 'div',\n collapseMotion: Collapse,\n },\n contextType: 'root',\n selectionMode,\n navigationMode: props.navigationMode ?? 'tree',\n open: true,\n appearance,\n size,\n level: 1,\n openItems,\n checkedItems,\n requestTreeResponse,\n forceUpdateRovingTabIndex: () => {\n // noop\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: ref as React.Ref<HTMLDivElement>,\n role: 'tree',\n 'aria-multiselectable': selectionMode === 'multiselect' ? true : undefined,\n ...props,\n }),\n { elementType: 'div' },\n ),\n collapseMotion: undefined,\n };\n}\n\nfunction warnIfNoProperPropsRootTree(props: Pick<TreeProps, 'aria-label' | 'aria-labelledby'>) {\n if (process.env.NODE_ENV === 'development') {\n if (!props['aria-label'] && !props['aria-labelledby']) {\n // eslint-disable-next-line no-console\n console.warn(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [useRootTree]:\n Tree must have either a \\`aria-label\\` or \\`aria-labelledby\\` property defined\n `);\n }\n }\n}\n"],"names":["getIntrinsicElementProps","useEventCallback","slot","React","Collapse","createCheckedItems","treeDataTypes","createNextOpenItems","ImmutableSet","ImmutableMap","useRootTree","props","ref","warnIfNoProperPropsRootTree","appearance","size","selectionMode","openItems","useMemo","from","checkedItems","requestOpenChange","request","onOpenChange","event","dangerouslyGetInternalSet","requestCheckedChange","onCheckedChange","dangerouslyGetInternalMap","requestNavigation","isScrollPrevented","onNavigation","preventScroll","type","ArrowDown","ArrowUp","Home","End","preventDefault","requestTreeResponse","requestType","components","root","collapseMotion","contextType","navigationMode","open","level","forceUpdateRovingTabIndex","always","role","undefined","elementType","process","env","NODE_ENV","console","warn"],"mappings":"AAAA;;;;;+BAmBgBU;;;;;;;gCAjBiD,4BAA4B;iEAEtE,QAAQ;8CACN,4CAA4C;oCAElC,iCAA8B;wBACnC,qBAAkB;0CACZ,gCAA6B;8BACpC,2BAAwB;8BACxB,2BAAwB;AAQ9C,qBACLC,KAAgB,EAChBC,GAA2B;IAE3BC,4BAA4BF;IAE5B,MAAM,EAAEG,aAAa,QAAQ,EAAEC,OAAO,QAAQ,EAAEC,gBAAgB,MAAM,EAAE,GAAGL;IAE3E,MAAMM,YAAYd,OAAMe,OAAO,CAAC,IAAMV,0BAAAA,CAAaW,IAAI,CAACR,MAAMM,SAAS,GAAG;QAACN,MAAMM,SAAS;KAAC;IAC3F,MAAMG,eAAejB,OAAMe,OAAO,CAAC,QAAMb,sCAAAA,EAAmBM,MAAMS,YAAY,GAAG;QAACT,MAAMS,YAAY;KAAC;IAErG,MAAMC,oBAAoB,CAACC;YACzBX;SAAAA,sBAAAA,MAAMY,YAAAA,AAAY,MAAA,QAAlBZ,wBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,oBAAAA,IAAAA,CAAAA,OAAqBW,QAAQE,KAAK,EAAE;YAClC,GAAGF,OAAO;YACVL,WAAWT,0BAAAA,CAAaiB,yBAAyB,KAAClB,6CAAAA,EAAoBe,SAASL;QACjF;IACF;IAEA,MAAMS,uBAAuB,CAACJ;YAI5BX;QAHA,IAAIK,kBAAkB,QAAQ;YAC5B;QACF;SACAL,yBAAAA,MAAMgB,eAAAA,AAAe,MAAA,QAArBhB,2BAAAA,KAAAA,IAAAA,KAAAA,IAAAA,uBAAAA,IAAAA,CAAAA,OAAwBW,QAAQE,KAAK,EAAE;YACrC,GAAGF,OAAO;YACVN;YACAI,cAAcX,0BAAAA,CAAamB,yBAAyB,CAACR;QAEvD;IACF;IAEA,MAAMS,oBAAoB,CAACP;YAEzBX;QADA,IAAImB,oBAAoB;SACxBnB,sBAAAA,MAAMoB,YAAAA,AAAY,MAAA,QAAlBpB,wBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,oBAAAA,IAAAA,CAAAA,OAAqBW,QAAQE,KAAK,EAAE;YAClC,GAAGF,OAAO;YACVU,eAAe;gBACbF,oBAAoB;YACtB;YACAA,mBAAmB,IAAMA;QAC3B;QACA,OAAQR,QAAQW,IAAI;YAClB,KAAK3B,qBAAAA,CAAc4B,SAAS;YAC5B,KAAK5B,qBAAAA,CAAc6B,OAAO;YAC1B,KAAK7B,qBAAAA,CAAc8B,IAAI;YACvB,KAAK9B,qBAAAA,CAAc+B,GAAG;gBACpB,yCAAyC;gBACzC,8BAA8B;gBAC9Bf,QAAQE,KAAK,CAACc,cAAc;QAChC;IACF;IAEA,MAAMC,sBAAsBtC,oCAAAA,EAAiB,CAACqB;QAC5C,OAAQA,QAAQkB,WAAW;YACzB,KAAK;gBACH,OAAOX,kBAAkBP;YAC3B,KAAK;gBACH,OAAOD,kBAAkBC;YAC3B,KAAK;gBACH,OAAOI,qBAAqBJ;QAChC;IACF;QASkBX;IAPlB,OAAO;QACL8B,YAAY;YACVC,MAAM;YACNC,gBAAgBvC,sCAAAA;QAClB;QACAwC,aAAa;QACb5B;QACA6B,gBAAgBlC,yBAAAA,MAAMkC,cAAAA,AAAc,MAAA,QAApBlC,0BAAAA,KAAAA,IAAAA,wBAAwB;QACxCmC,MAAM;QACNhC;QACAC;QACAgC,OAAO;QACP9B;QACAG;QACAmB;QACAS,2BAA2B;QACzB,OAAO;QACT;QACAN,MAAMxC,oBAAAA,CAAK+C,MAAM,KACfjD,wCAAAA,EAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FY,KAAKA;YACLsC,MAAM;YACN,wBAAwBlC,kBAAkB,gBAAgB,OAAOmC;YACjE,GAAGxC,KAAK;QACV,IACA;YAAEyC,aAAa;QAAM;QAEvBT,gBAAgBQ;IAClB;AACF;AAEA,SAAStC,4BAA4BF,KAAwD;IAC3F,IAAI0C,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1C,IAAI,CAAC5C,KAAK,CAAC,aAAa,IAAI,CAACA,KAAK,CAAC,kBAAkB,EAAE;YACrD,sCAAsC;YACtC6C,QAAQC,IAAI,CAAsB,CAAC;8EAGnC,CAAC;QACH;IACF;AACF"}
|
|
@@ -9,7 +9,7 @@ Object.defineProperty(exports, "useSubtree", {
|
|
|
9
9
|
return useSubtree;
|
|
10
10
|
}
|
|
11
11
|
});
|
|
12
|
-
const _index = require("../contexts/index");
|
|
12
|
+
const _index = require("../contexts/index.cjs");
|
|
13
13
|
const _reactutilities = require("@fluentui/react-utilities");
|
|
14
14
|
const _reactmotioncomponentspreview = require("@fluentui/react-motion-components-preview");
|
|
15
15
|
const _reactmotion = require("@fluentui/react-motion");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/hooks/useSubtree.ts"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport type { TreeProps, TreeState } from '../Tree';\nimport type { SubtreeContextValue } from '../contexts/index';\nimport { useSubtreeContext_unstable, useTreeItemContext_unstable } from '../contexts/index';\nimport { getIntrinsicElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { Collapse } from '@fluentui/react-motion-components-preview';\nimport { presenceMotionSlot } from '@fluentui/react-motion';\n\n/**\n * Create the state required to render a sub-level tree.\n *\n * @param props - props from this instance of tree\n * @param ref - reference to root HTMLElement of tree\n */\nexport function useSubtree(\n props: TreeProps,\n ref: React.Ref<HTMLElement>,\n): Omit<TreeState & SubtreeContextValue, 'treeType'> {\n const subtreeRef = useTreeItemContext_unstable(ctx => ctx.subtreeRef);\n\n const { level: parentLevel } = useSubtreeContext_unstable();\n\n const open = useTreeItemContext_unstable(ctx => ctx.open);\n\n return {\n contextType: 'subtree',\n open,\n components: {\n root: 'div',\n collapseMotion: Collapse,\n },\n level: parentLevel + 1,\n root: slot.always(\n getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: useMergedRefs(ref, subtreeRef) as React.Ref<HTMLDivElement>,\n role: 'group',\n ...props,\n }),\n { elementType: 'div' },\n ),\n collapseMotion: presenceMotionSlot(props.collapseMotion, {\n elementType: Collapse,\n defaultProps: {\n visible: open,\n unmountOnExit: true,\n },\n }),\n };\n}\n"],"names":["useSubtreeContext_unstable","useTreeItemContext_unstable","getIntrinsicElementProps","useMergedRefs","slot","Collapse","presenceMotionSlot","useSubtree","props","ref","subtreeRef","ctx","level","parentLevel","open","contextType","components","root","collapseMotion","always","role","elementType","defaultProps","visible","unmountOnExit"],"mappings":"AAAA;;;;;+BAgBgBO;;;;;;uBAXwD,
|
|
1
|
+
{"version":3,"sources":["../src/hooks/useSubtree.ts"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport type { TreeProps, TreeState } from '../Tree';\nimport type { SubtreeContextValue } from '../contexts/index';\nimport { useSubtreeContext_unstable, useTreeItemContext_unstable } from '../contexts/index';\nimport { getIntrinsicElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { Collapse } from '@fluentui/react-motion-components-preview';\nimport { presenceMotionSlot } from '@fluentui/react-motion';\n\n/**\n * Create the state required to render a sub-level tree.\n *\n * @param props - props from this instance of tree\n * @param ref - reference to root HTMLElement of tree\n */\nexport function useSubtree(\n props: TreeProps,\n ref: React.Ref<HTMLElement>,\n): Omit<TreeState & SubtreeContextValue, 'treeType'> {\n const subtreeRef = useTreeItemContext_unstable(ctx => ctx.subtreeRef);\n\n const { level: parentLevel } = useSubtreeContext_unstable();\n\n const open = useTreeItemContext_unstable(ctx => ctx.open);\n\n return {\n contextType: 'subtree',\n open,\n components: {\n root: 'div',\n collapseMotion: Collapse,\n },\n level: parentLevel + 1,\n root: slot.always(\n getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: useMergedRefs(ref, subtreeRef) as React.Ref<HTMLDivElement>,\n role: 'group',\n ...props,\n }),\n { elementType: 'div' },\n ),\n collapseMotion: presenceMotionSlot(props.collapseMotion, {\n elementType: Collapse,\n defaultProps: {\n visible: open,\n unmountOnExit: true,\n },\n }),\n };\n}\n"],"names":["useSubtreeContext_unstable","useTreeItemContext_unstable","getIntrinsicElementProps","useMergedRefs","slot","Collapse","presenceMotionSlot","useSubtree","props","ref","subtreeRef","ctx","level","parentLevel","open","contextType","components","root","collapseMotion","always","role","elementType","defaultProps","visible","unmountOnExit"],"mappings":"AAAA;;;;;+BAgBgBO;;;;;;uBAXwD,uBAAoB;gCAC9B,4BAA4B;8CACjE,4CAA4C;6BAClC,yBAAyB;AAQrD,oBACLC,KAAgB,EAChBC,GAA2B;IAE3B,MAAMC,iBAAaT,kCAAAA,EAA4BU,CAAAA,MAAOA,IAAID,UAAU;IAEpE,MAAM,EAAEE,OAAOC,WAAW,EAAE,OAAGb,iCAAAA;IAE/B,MAAMc,WAAOb,kCAAAA,EAA4BU,CAAAA,MAAOA,IAAIG,IAAI;IAExD,OAAO;QACLC,aAAa;QACbD;QACAE,YAAY;YACVC,MAAM;YACNC,gBAAgBb,sCAAAA;QAClB;QACAO,OAAOC,cAAc;QACrBI,MAAMb,oBAAAA,CAAKe,MAAM,KACfjB,wCAAAA,EAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FO,SAAKN,6BAAAA,EAAcM,KAAKC;YACxBU,MAAM;YACN,GAAGZ,KAAK;QACV,IACA;YAAEa,aAAa;QAAM;QAEvBH,oBAAgBZ,+BAAAA,EAAmBE,MAAMU,cAAc,EAAE;YACvDG,aAAahB,sCAAAA;YACbiB,cAAc;gBACZC,SAAST;gBACTU,eAAe;YACjB;QACF;IACF;AACF"}
|
|
@@ -10,13 +10,13 @@ Object.defineProperty(exports, "useTreeNavigation", {
|
|
|
10
10
|
}
|
|
11
11
|
});
|
|
12
12
|
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
|
13
|
-
const _nextTypeAheadElement = require("../utils/nextTypeAheadElement");
|
|
14
|
-
const _tokens = require("../utils/tokens");
|
|
15
|
-
const _useRovingTabIndexes = require("./useRovingTabIndexes");
|
|
13
|
+
const _nextTypeAheadElement = require("../utils/nextTypeAheadElement.cjs");
|
|
14
|
+
const _tokens = require("../utils/tokens.cjs");
|
|
15
|
+
const _useRovingTabIndexes = require("./useRovingTabIndexes.cjs");
|
|
16
16
|
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
17
|
-
const _useHTMLElementWalkerRef = require("./useHTMLElementWalkerRef");
|
|
17
|
+
const _useHTMLElementWalkerRef = require("./useHTMLElementWalkerRef.cjs");
|
|
18
18
|
const _reactutilities = require("@fluentui/react-utilities");
|
|
19
|
-
const _TreeItemLayout = require("../TreeItemLayout");
|
|
19
|
+
const _TreeItemLayout = require("../TreeItemLayout.cjs");
|
|
20
20
|
const _reacttabster = require("@fluentui/react-tabster");
|
|
21
21
|
function useTreeNavigation(navigationMode = 'tree') {
|
|
22
22
|
'use no memo'; // justified: compiler would optimize useTreeNavigation — manual opt-out to preserve runtime behavior
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/hooks/useTreeNavigation.ts"],"sourcesContent":["'use client';\n\nimport type { TreeNavigationData_unstable, TreeNavigationMode } from '../components/Tree/Tree.types';\nimport { nextTypeAheadElement } from '../utils/nextTypeAheadElement';\nimport { treeDataTypes } from '../utils/tokens';\nimport { useRovingTabIndex } from './useRovingTabIndexes';\nimport type { HTMLElementWalker } from '../utils/createHTMLElementWalker';\nimport * as React from 'react';\nimport { useHTMLElementWalkerRef } from './useHTMLElementWalkerRef';\nimport { useMergedRefs } from '@fluentui/react-utilities';\nimport { treeItemLayoutClassNames } from '../TreeItemLayout';\nimport { useFocusFinders } from '@fluentui/react-tabster';\n\n/***\n * Hook used to manage navigation in the tree.\n *\n * @param navigationMode - the navigation mode of the tree, 'tree' (default) or 'treegrid'\n */\nexport function useTreeNavigation(navigationMode: TreeNavigationMode = 'tree'): {\n navigate: (data: TreeNavigationData_unstable, focusOptions?: FocusOptions) => HTMLElement | null;\n treeRef: React.RefCallback<HTMLElement>;\n forceUpdateRovingTabIndex: () => void;\n} {\n 'use no memo'; // justified: compiler would optimize useTreeNavigation — manual opt-out to preserve runtime behavior\n\n const { rove, initialize: initializeRovingTabIndex, forceUpdate: forceUpdateRovingTabIndex } = useRovingTabIndex();\n const { findFirstFocusable } = useFocusFinders();\n const { walkerRef, rootRef: walkerRootRef } = useHTMLElementWalkerRef();\n\n const rootRefCallback: React.RefCallback<HTMLElement> = React.useCallback(\n root => {\n if (root && walkerRef.current) {\n initializeRovingTabIndex(walkerRef.current);\n }\n },\n [walkerRef, initializeRovingTabIndex],\n );\n\n const getNextElement = (data: TreeNavigationData_unstable) => {\n if (!walkerRef.current) {\n return null;\n }\n switch (data.type) {\n case treeDataTypes.Click:\n return data.target;\n case treeDataTypes.TypeAhead:\n walkerRef.current.currentElement = data.target;\n return nextTypeAheadElement(walkerRef.current, data.event.key);\n case treeDataTypes.ArrowLeft: {\n const actions = queryActions(data.target);\n if (navigationMode === 'treegrid' && actions?.contains(data.target.ownerDocument.activeElement)) {\n return data.target;\n }\n walkerRef.current.currentElement = data.target;\n return walkerRef.current.parentElement();\n }\n case treeDataTypes.ArrowRight:\n if (navigationMode === 'treegrid') {\n const actions = queryActions(data.target);\n if (actions) {\n findFirstFocusable(actions)?.focus();\n }\n return null;\n }\n walkerRef.current.currentElement = data.target;\n return walkerRef.current.firstChild();\n case treeDataTypes.End:\n walkerRef.current.currentElement = walkerRef.current.root;\n return lastChildRecursive(walkerRef.current);\n case treeDataTypes.Home:\n walkerRef.current.currentElement = walkerRef.current.root;\n return walkerRef.current.firstChild();\n case treeDataTypes.ArrowDown:\n walkerRef.current.currentElement = data.target;\n return walkerRef.current.nextElement();\n case treeDataTypes.ArrowUp:\n walkerRef.current.currentElement = data.target;\n return walkerRef.current.previousElement();\n }\n };\n function navigate(data: TreeNavigationData_unstable, focusOptions?: FocusOptions) {\n const nextElement = getNextElement(data);\n if (nextElement) {\n rove(nextElement, focusOptions);\n }\n return nextElement;\n }\n return {\n navigate,\n treeRef: useMergedRefs(walkerRootRef, rootRefCallback) as React.RefCallback<HTMLElement>,\n forceUpdateRovingTabIndex,\n } as const;\n}\n\nfunction lastChildRecursive(walker: HTMLElementWalker) {\n let lastElement: HTMLElement | null = null;\n let nextElement: HTMLElement | null = null;\n while ((nextElement = walker.lastChild())) {\n lastElement = nextElement;\n }\n return lastElement;\n}\n\nconst queryActions = (target: HTMLElement) =>\n target.querySelector<HTMLElement>(\n `:scope > .${treeItemLayoutClassNames.root} > .${treeItemLayoutClassNames.actions}`,\n );\n"],"names":["nextTypeAheadElement","treeDataTypes","useRovingTabIndex","React","useHTMLElementWalkerRef","useMergedRefs","treeItemLayoutClassNames","useFocusFinders","useTreeNavigation","navigationMode","rove","initialize","initializeRovingTabIndex","forceUpdate","forceUpdateRovingTabIndex","findFirstFocusable","walkerRef","rootRef","walkerRootRef","rootRefCallback","useCallback","root","current","getNextElement","data","type","Click","target","TypeAhead","currentElement","event","key","ArrowLeft","actions","queryActions","contains","ownerDocument","activeElement","parentElement","ArrowRight","focus","firstChild","End","lastChildRecursive","Home","ArrowDown","nextElement","ArrowUp","previousElement","navigate","focusOptions","treeRef","walker","lastElement","lastChild","querySelector"],"mappings":"AAAA;;;;;+BAkBgBQ;;;;;;;sCAfqB,
|
|
1
|
+
{"version":3,"sources":["../src/hooks/useTreeNavigation.ts"],"sourcesContent":["'use client';\n\nimport type { TreeNavigationData_unstable, TreeNavigationMode } from '../components/Tree/Tree.types';\nimport { nextTypeAheadElement } from '../utils/nextTypeAheadElement';\nimport { treeDataTypes } from '../utils/tokens';\nimport { useRovingTabIndex } from './useRovingTabIndexes';\nimport type { HTMLElementWalker } from '../utils/createHTMLElementWalker';\nimport * as React from 'react';\nimport { useHTMLElementWalkerRef } from './useHTMLElementWalkerRef';\nimport { useMergedRefs } from '@fluentui/react-utilities';\nimport { treeItemLayoutClassNames } from '../TreeItemLayout';\nimport { useFocusFinders } from '@fluentui/react-tabster';\n\n/***\n * Hook used to manage navigation in the tree.\n *\n * @param navigationMode - the navigation mode of the tree, 'tree' (default) or 'treegrid'\n */\nexport function useTreeNavigation(navigationMode: TreeNavigationMode = 'tree'): {\n navigate: (data: TreeNavigationData_unstable, focusOptions?: FocusOptions) => HTMLElement | null;\n treeRef: React.RefCallback<HTMLElement>;\n forceUpdateRovingTabIndex: () => void;\n} {\n 'use no memo'; // justified: compiler would optimize useTreeNavigation — manual opt-out to preserve runtime behavior\n\n const { rove, initialize: initializeRovingTabIndex, forceUpdate: forceUpdateRovingTabIndex } = useRovingTabIndex();\n const { findFirstFocusable } = useFocusFinders();\n const { walkerRef, rootRef: walkerRootRef } = useHTMLElementWalkerRef();\n\n const rootRefCallback: React.RefCallback<HTMLElement> = React.useCallback(\n root => {\n if (root && walkerRef.current) {\n initializeRovingTabIndex(walkerRef.current);\n }\n },\n [walkerRef, initializeRovingTabIndex],\n );\n\n const getNextElement = (data: TreeNavigationData_unstable) => {\n if (!walkerRef.current) {\n return null;\n }\n switch (data.type) {\n case treeDataTypes.Click:\n return data.target;\n case treeDataTypes.TypeAhead:\n walkerRef.current.currentElement = data.target;\n return nextTypeAheadElement(walkerRef.current, data.event.key);\n case treeDataTypes.ArrowLeft: {\n const actions = queryActions(data.target);\n if (navigationMode === 'treegrid' && actions?.contains(data.target.ownerDocument.activeElement)) {\n return data.target;\n }\n walkerRef.current.currentElement = data.target;\n return walkerRef.current.parentElement();\n }\n case treeDataTypes.ArrowRight:\n if (navigationMode === 'treegrid') {\n const actions = queryActions(data.target);\n if (actions) {\n findFirstFocusable(actions)?.focus();\n }\n return null;\n }\n walkerRef.current.currentElement = data.target;\n return walkerRef.current.firstChild();\n case treeDataTypes.End:\n walkerRef.current.currentElement = walkerRef.current.root;\n return lastChildRecursive(walkerRef.current);\n case treeDataTypes.Home:\n walkerRef.current.currentElement = walkerRef.current.root;\n return walkerRef.current.firstChild();\n case treeDataTypes.ArrowDown:\n walkerRef.current.currentElement = data.target;\n return walkerRef.current.nextElement();\n case treeDataTypes.ArrowUp:\n walkerRef.current.currentElement = data.target;\n return walkerRef.current.previousElement();\n }\n };\n function navigate(data: TreeNavigationData_unstable, focusOptions?: FocusOptions) {\n const nextElement = getNextElement(data);\n if (nextElement) {\n rove(nextElement, focusOptions);\n }\n return nextElement;\n }\n return {\n navigate,\n treeRef: useMergedRefs(walkerRootRef, rootRefCallback) as React.RefCallback<HTMLElement>,\n forceUpdateRovingTabIndex,\n } as const;\n}\n\nfunction lastChildRecursive(walker: HTMLElementWalker) {\n let lastElement: HTMLElement | null = null;\n let nextElement: HTMLElement | null = null;\n while ((nextElement = walker.lastChild())) {\n lastElement = nextElement;\n }\n return lastElement;\n}\n\nconst queryActions = (target: HTMLElement) =>\n target.querySelector<HTMLElement>(\n `:scope > .${treeItemLayoutClassNames.root} > .${treeItemLayoutClassNames.actions}`,\n );\n"],"names":["nextTypeAheadElement","treeDataTypes","useRovingTabIndex","React","useHTMLElementWalkerRef","useMergedRefs","treeItemLayoutClassNames","useFocusFinders","useTreeNavigation","navigationMode","rove","initialize","initializeRovingTabIndex","forceUpdate","forceUpdateRovingTabIndex","findFirstFocusable","walkerRef","rootRef","walkerRootRef","rootRefCallback","useCallback","root","current","getNextElement","data","type","Click","target","TypeAhead","currentElement","event","key","ArrowLeft","actions","queryActions","contains","ownerDocument","activeElement","parentElement","ArrowRight","focus","firstChild","End","lastChildRecursive","Home","ArrowDown","nextElement","ArrowUp","previousElement","navigate","focusOptions","treeRef","walker","lastElement","lastChild","querySelector"],"mappings":"AAAA;;;;;+BAkBgBQ;;;;;;;sCAfqB,mCAAgC;wBACvC,qBAAkB;qCACd,2BAAwB;iEAEnC,QAAQ;yCACS,+BAA4B;gCACtC,4BAA4B;gCACjB,uBAAoB;8BAC7B,0BAA0B;AAOnD,2BAA2BC,iBAAqC,MAAM;IAK3E,eAAe,qGAAqG;IAEpH,MAAM,EAAEC,IAAI,EAAEC,YAAYC,wBAAwB,EAAEC,aAAaC,yBAAyB,EAAE,OAAGZ,sCAAAA;IAC/F,MAAM,EAAEa,kBAAkB,EAAE,GAAGR,iCAAAA;IAC/B,MAAM,EAAES,SAAS,EAAEC,SAASC,aAAa,EAAE,OAAGd,gDAAAA;IAE9C,MAAMe,kBAAkDhB,OAAMiB,WAAW,CACvEC,CAAAA;QACE,IAAIA,QAAQL,UAAUM,OAAO,EAAE;YAC7BV,yBAAyBI,UAAUM,OAAO;QAC5C;IACF,GACA;QAACN;QAAWJ;KAAyB;IAGvC,MAAMW,iBAAiB,CAACC;QACtB,IAAI,CAACR,UAAUM,OAAO,EAAE;YACtB,OAAO;QACT;QACA,OAAQE,KAAKC,IAAI;YACf,KAAKxB,qBAAAA,CAAcyB,KAAK;gBACtB,OAAOF,KAAKG,MAAM;YACpB,KAAK1B,qBAAAA,CAAc2B,SAAS;gBAC1BZ,UAAUM,OAAO,CAACO,cAAc,GAAGL,KAAKG,MAAM;gBAC9C,WAAO3B,0CAAAA,EAAqBgB,UAAUM,OAAO,EAAEE,KAAKM,KAAK,CAACC,GAAG;YAC/D,KAAK9B,qBAAAA,CAAc+B,SAAS;gBAAE;oBAC5B,MAAMC,UAAUC,aAAaV,KAAKG,MAAM;oBACxC,IAAIlB,mBAAmB,eAAcwB,YAAAA,QAAAA,YAAAA,KAAAA,IAAAA,KAAAA,IAAAA,QAASE,QAAQ,CAACX,KAAKG,MAAM,CAACS,aAAa,CAACC,cAAa,GAAG;wBAC/F,OAAOb,KAAKG,MAAM;oBACpB;oBACAX,UAAUM,OAAO,CAACO,cAAc,GAAGL,KAAKG,MAAM;oBAC9C,OAAOX,UAAUM,OAAO,CAACgB,aAAa;gBACxC;YACA,KAAKrC,qBAAAA,CAAcsC,UAAU;gBAC3B,IAAI9B,mBAAmB,YAAY;oBACjC,MAAMwB,UAAUC,aAAaV,KAAKG,MAAM;oBACxC,IAAIM,SAAS;4BACXlB;yBAAAA,sBAAAA,mBAAmBkB,QAAAA,MAAAA,QAAnBlB,wBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,oBAA6ByB,KAAK;oBACpC;oBACA,OAAO;gBACT;gBACAxB,UAAUM,OAAO,CAACO,cAAc,GAAGL,KAAKG,MAAM;gBAC9C,OAAOX,UAAUM,OAAO,CAACmB,UAAU;YACrC,KAAKxC,qBAAAA,CAAcyC,GAAG;gBACpB1B,UAAUM,OAAO,CAACO,cAAc,GAAGb,UAAUM,OAAO,CAACD,IAAI;gBACzD,OAAOsB,mBAAmB3B,UAAUM,OAAO;YAC7C,KAAKrB,qBAAAA,CAAc2C,IAAI;gBACrB5B,UAAUM,OAAO,CAACO,cAAc,GAAGb,UAAUM,OAAO,CAACD,IAAI;gBACzD,OAAOL,UAAUM,OAAO,CAACmB,UAAU;YACrC,KAAKxC,qBAAAA,CAAc4C,SAAS;gBAC1B7B,UAAUM,OAAO,CAACO,cAAc,GAAGL,KAAKG,MAAM;gBAC9C,OAAOX,UAAUM,OAAO,CAACwB,WAAW;YACtC,KAAK7C,qBAAAA,CAAc8C,OAAO;gBACxB/B,UAAUM,OAAO,CAACO,cAAc,GAAGL,KAAKG,MAAM;gBAC9C,OAAOX,UAAUM,OAAO,CAAC0B,eAAe;QAC5C;IACF;IACA,SAASC,SAASzB,IAAiC,EAAE0B,YAA2B;QAC9E,MAAMJ,cAAcvB,eAAeC;QACnC,IAAIsB,aAAa;YACfpC,KAAKoC,aAAaI;QACpB;QACA,OAAOJ;IACT;IACA,OAAO;QACLG;QACAE,aAAS9C,6BAAAA,EAAca,eAAeC;QACtCL;IACF;AACF;AAEA,SAAS6B,mBAAmBS,MAAyB;IACnD,IAAIC,cAAkC;IACtC,IAAIP,cAAkC;IACtC,MAAQA,cAAcM,OAAOE,SAAS,GAAK;QACzCD,cAAcP;IAChB;IACA,OAAOO;AACT;AAEA,MAAMnB,eAAe,CAACP,SACpBA,OAAO4B,aAAa,CAClB,CAAC,UAAU,EAAEjD,wCAAAA,CAAyBe,IAAI,CAAC,IAAI,EAAEf,wCAAAA,CAAyB2B,OAAO,EAAE"}
|
|
@@ -28,7 +28,7 @@ _export(exports, {
|
|
|
28
28
|
return _TreeItemPersonaLayout.TreeItemPersonaLayout;
|
|
29
29
|
},
|
|
30
30
|
TreeItemProvider: function() {
|
|
31
|
-
return
|
|
31
|
+
return _index.TreeItemProvider;
|
|
32
32
|
},
|
|
33
33
|
TreeProvider: function() {
|
|
34
34
|
return _TreeProvider.TreeProvider;
|
|
@@ -85,19 +85,19 @@ _export(exports, {
|
|
|
85
85
|
return _useHeadlessFlatTree.useHeadlessFlatTree_unstable;
|
|
86
86
|
},
|
|
87
87
|
useSubtreeContext_unstable: function() {
|
|
88
|
-
return
|
|
88
|
+
return _index.useSubtreeContext_unstable;
|
|
89
89
|
},
|
|
90
90
|
useTreeContextValues_unstable: function() {
|
|
91
91
|
return _Tree.useTreeContextValues_unstable;
|
|
92
92
|
},
|
|
93
93
|
useTreeContext_unstable: function() {
|
|
94
|
-
return
|
|
94
|
+
return _index.useTreeContext_unstable;
|
|
95
95
|
},
|
|
96
96
|
useTreeItemContextValues_unstable: function() {
|
|
97
97
|
return _TreeItem.useTreeItemContextValues_unstable;
|
|
98
98
|
},
|
|
99
99
|
useTreeItemContext_unstable: function() {
|
|
100
|
-
return
|
|
100
|
+
return _index.useTreeItemContext_unstable;
|
|
101
101
|
},
|
|
102
102
|
useTreeItemLayoutStyles_unstable: function() {
|
|
103
103
|
return _TreeItemLayout.useTreeItemLayoutStyles_unstable;
|
|
@@ -127,15 +127,15 @@ _export(exports, {
|
|
|
127
127
|
return _Tree.useTree_unstable;
|
|
128
128
|
}
|
|
129
129
|
});
|
|
130
|
-
const _Tree = require("./Tree");
|
|
131
|
-
const _FlatTree = require("./FlatTree");
|
|
132
|
-
const _TreeProvider = require("./components/TreeProvider");
|
|
133
|
-
const
|
|
134
|
-
const _tokens = require("./utils/tokens");
|
|
135
|
-
const _useHeadlessFlatTree = require("./components/FlatTree/useHeadlessFlatTree");
|
|
136
|
-
const _TreeItem = require("./TreeItem");
|
|
137
|
-
const _FlatTreeItem = require("./FlatTreeItem");
|
|
138
|
-
const _TreeItemLayout = require("./TreeItemLayout");
|
|
139
|
-
const _TreeItemPersonaLayout = require("./TreeItemPersonaLayout");
|
|
140
|
-
const _flattenTree = require("./utils/flattenTree");
|
|
141
|
-
const _useTreeNavigation = require("./hooks/useTreeNavigation");
|
|
130
|
+
const _Tree = require("./Tree.cjs");
|
|
131
|
+
const _FlatTree = require("./FlatTree.cjs");
|
|
132
|
+
const _TreeProvider = require("./components/TreeProvider.cjs");
|
|
133
|
+
const _index = require("./contexts/index.cjs");
|
|
134
|
+
const _tokens = require("./utils/tokens.cjs");
|
|
135
|
+
const _useHeadlessFlatTree = require("./components/FlatTree/useHeadlessFlatTree.cjs");
|
|
136
|
+
const _TreeItem = require("./TreeItem.cjs");
|
|
137
|
+
const _FlatTreeItem = require("./FlatTreeItem.cjs");
|
|
138
|
+
const _TreeItemLayout = require("./TreeItemLayout.cjs");
|
|
139
|
+
const _TreeItemPersonaLayout = require("./TreeItemPersonaLayout.cjs");
|
|
140
|
+
const _flattenTree = require("./utils/flattenTree.cjs");
|
|
141
|
+
const _useTreeNavigation = require("./hooks/useTreeNavigation.cjs");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n Tree,\n treeClassNames,\n useTree_unstable,\n useTreeStyles_unstable,\n useTreeContextValues_unstable,\n renderTree_unstable,\n} from './Tree';\n\nexport type {\n TreeSlots,\n TreeProps,\n TreeState,\n TreeContextValues,\n TreeOpenChangeData,\n TreeSelectionValue,\n TreeOpenChangeEvent,\n TreeCheckedChangeData,\n TreeCheckedChangeEvent,\n TreeNavigationData_unstable,\n TreeNavigationEvent_unstable,\n TreeNavigationMode,\n TreeNavigationDataParam,\n} from './Tree';\n\nexport {\n FlatTree,\n flatTreeClassNames,\n useFlatTree_unstable,\n useFlatTreeStyles_unstable,\n useFlatTreeContextValues_unstable,\n renderFlatTree_unstable,\n} from './FlatTree';\n\nexport type { FlatTreeSlots, FlatTreeProps, FlatTreeState } from './FlatTree';\n\nexport { TreeProvider, TreeRootReset } from './components/TreeProvider';\n\nexport {\n useTreeContext_unstable,\n useTreeItemContext_unstable,\n useSubtreeContext_unstable,\n TreeItemProvider,\n} from './contexts';\nexport type { TreeContextValue, SubtreeContextValue, TreeItemContextValue } from './contexts';\n\nexport { treeItemLevelToken } from './utils/tokens';\n\nexport { useHeadlessFlatTree_unstable } from './components/FlatTree/useHeadlessFlatTree';\nexport type {\n HeadlessFlatTree,\n HeadlessFlatTreeItem,\n HeadlessFlatTreeItemProps,\n HeadlessFlatTreeOptions,\n} from './components/FlatTree/useHeadlessFlatTree';\n\nexport {\n TreeItem,\n treeItemClassNames,\n renderTreeItem_unstable,\n useTreeItemStyles_unstable,\n useTreeItemContextValues_unstable,\n useTreeItem_unstable,\n} from './TreeItem';\nexport type {\n TreeItemProps,\n TreeItemState,\n TreeItemSlots,\n TreeItemType,\n TreeItemValue,\n TreeItemOpenChangeData,\n TreeItemOpenChangeEvent,\n TreeItemCSSProperties,\n} from './TreeItem';\n\nexport { FlatTreeItem } from './FlatTreeItem';\nexport type { FlatTreeItemProps } from './FlatTreeItem';\n\nexport {\n TreeItemLayout,\n treeItemLayoutClassNames,\n renderTreeItemLayout_unstable,\n useTreeItemLayoutStyles_unstable,\n useTreeItemLayout_unstable,\n} from './TreeItemLayout';\nexport type { TreeItemLayoutProps, TreeItemLayoutSlots, TreeItemLayoutState } from './TreeItemLayout';\n\nexport {\n TreeItemPersonaLayout,\n treeItemPersonaLayoutClassNames,\n renderTreeItemPersonaLayout_unstable,\n useTreeItemPersonaLayoutStyles_unstable,\n useTreeItemPersonaLayout_unstable,\n} from './TreeItemPersonaLayout';\nexport type {\n TreeItemPersonaLayoutProps,\n TreeItemPersonaLayoutSlots,\n TreeItemPersonaLayoutState,\n} from './TreeItemPersonaLayout';\n\nexport { flattenTree_unstable } from './utils/flattenTree';\nexport type { FlattenTreeItem } from './utils/flattenTree';\n\nexport { useTreeNavigation } from './hooks/useTreeNavigation';\n"],"names":["Tree","treeClassNames","useTree_unstable","useTreeStyles_unstable","useTreeContextValues_unstable","renderTree_unstable","FlatTree","flatTreeClassNames","useFlatTree_unstable","useFlatTreeStyles_unstable","useFlatTreeContextValues_unstable","renderFlatTree_unstable","TreeProvider","TreeRootReset","useTreeContext_unstable","useTreeItemContext_unstable","useSubtreeContext_unstable","TreeItemProvider","treeItemLevelToken","useHeadlessFlatTree_unstable","TreeItem","treeItemClassNames","renderTreeItem_unstable","useTreeItemStyles_unstable","useTreeItemContextValues_unstable","useTreeItem_unstable","FlatTreeItem","TreeItemLayout","treeItemLayoutClassNames","renderTreeItemLayout_unstable","useTreeItemLayoutStyles_unstable","useTreeItemLayout_unstable","TreeItemPersonaLayout","treeItemPersonaLayoutClassNames","renderTreeItemPersonaLayout_unstable","useTreeItemPersonaLayoutStyles_unstable","useTreeItemPersonaLayout_unstable","flattenTree_unstable","useTreeNavigation"],"mappings":";;;;;;;;;;;IA0BEM;iCAAQ;;gBAiDW;eAAZoB;;;eA1EP1B,UAAI;;YAwDI;eAARoB;;kBAsBc;eAAdO;;;eASAK,4CAAqB;;oBA9CL;eAAhBf;;;eANOL,0BAAY;;;eAAEC,2BAAa;;sBAThB;eAAlBN;;;eAyEO8B,iCAAoB;;IArE3B1B;gDAAuB;;IAkDvBkB;4DAA6B;;;eAS7BK,2DAAoC;;IA/BpCZ;gDAAuB;;;eArDvBjB,yBAAmB;;;eAJnBJ,oBAAc;;;eAwDdoB,4BAAkB;;;eAsBlBO,wCAAwB;;;eAlCjBV,0BAAkB;;;eA2CzBe,sDAA+B;;;eA3D/BvB,2CAAiC;;;eADjCD,oCAA0B;;;eAD1BD,8BAAoB;;;eAoBbW,iDAA4B;;;eAPnCH,
|
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n Tree,\n treeClassNames,\n useTree_unstable,\n useTreeStyles_unstable,\n useTreeContextValues_unstable,\n renderTree_unstable,\n} from './Tree';\n\nexport type {\n TreeSlots,\n TreeProps,\n TreeState,\n TreeContextValues,\n TreeOpenChangeData,\n TreeSelectionValue,\n TreeOpenChangeEvent,\n TreeCheckedChangeData,\n TreeCheckedChangeEvent,\n TreeNavigationData_unstable,\n TreeNavigationEvent_unstable,\n TreeNavigationMode,\n TreeNavigationDataParam,\n} from './Tree';\n\nexport {\n FlatTree,\n flatTreeClassNames,\n useFlatTree_unstable,\n useFlatTreeStyles_unstable,\n useFlatTreeContextValues_unstable,\n renderFlatTree_unstable,\n} from './FlatTree';\n\nexport type { FlatTreeSlots, FlatTreeProps, FlatTreeState } from './FlatTree';\n\nexport { TreeProvider, TreeRootReset } from './components/TreeProvider';\n\nexport {\n useTreeContext_unstable,\n useTreeItemContext_unstable,\n useSubtreeContext_unstable,\n TreeItemProvider,\n} from './contexts';\nexport type { TreeContextValue, SubtreeContextValue, TreeItemContextValue } from './contexts';\n\nexport { treeItemLevelToken } from './utils/tokens';\n\nexport { useHeadlessFlatTree_unstable } from './components/FlatTree/useHeadlessFlatTree';\nexport type {\n HeadlessFlatTree,\n HeadlessFlatTreeItem,\n HeadlessFlatTreeItemProps,\n HeadlessFlatTreeOptions,\n} from './components/FlatTree/useHeadlessFlatTree';\n\nexport {\n TreeItem,\n treeItemClassNames,\n renderTreeItem_unstable,\n useTreeItemStyles_unstable,\n useTreeItemContextValues_unstable,\n useTreeItem_unstable,\n} from './TreeItem';\nexport type {\n TreeItemProps,\n TreeItemState,\n TreeItemSlots,\n TreeItemType,\n TreeItemValue,\n TreeItemOpenChangeData,\n TreeItemOpenChangeEvent,\n TreeItemCSSProperties,\n} from './TreeItem';\n\nexport { FlatTreeItem } from './FlatTreeItem';\nexport type { FlatTreeItemProps } from './FlatTreeItem';\n\nexport {\n TreeItemLayout,\n treeItemLayoutClassNames,\n renderTreeItemLayout_unstable,\n useTreeItemLayoutStyles_unstable,\n useTreeItemLayout_unstable,\n} from './TreeItemLayout';\nexport type { TreeItemLayoutProps, TreeItemLayoutSlots, TreeItemLayoutState } from './TreeItemLayout';\n\nexport {\n TreeItemPersonaLayout,\n treeItemPersonaLayoutClassNames,\n renderTreeItemPersonaLayout_unstable,\n useTreeItemPersonaLayoutStyles_unstable,\n useTreeItemPersonaLayout_unstable,\n} from './TreeItemPersonaLayout';\nexport type {\n TreeItemPersonaLayoutProps,\n TreeItemPersonaLayoutSlots,\n TreeItemPersonaLayoutState,\n} from './TreeItemPersonaLayout';\n\nexport { flattenTree_unstable } from './utils/flattenTree';\nexport type { FlattenTreeItem } from './utils/flattenTree';\n\nexport { useTreeNavigation } from './hooks/useTreeNavigation';\n"],"names":["Tree","treeClassNames","useTree_unstable","useTreeStyles_unstable","useTreeContextValues_unstable","renderTree_unstable","FlatTree","flatTreeClassNames","useFlatTree_unstable","useFlatTreeStyles_unstable","useFlatTreeContextValues_unstable","renderFlatTree_unstable","TreeProvider","TreeRootReset","useTreeContext_unstable","useTreeItemContext_unstable","useSubtreeContext_unstable","TreeItemProvider","treeItemLevelToken","useHeadlessFlatTree_unstable","TreeItem","treeItemClassNames","renderTreeItem_unstable","useTreeItemStyles_unstable","useTreeItemContextValues_unstable","useTreeItem_unstable","FlatTreeItem","TreeItemLayout","treeItemLayoutClassNames","renderTreeItemLayout_unstable","useTreeItemLayoutStyles_unstable","useTreeItemLayout_unstable","TreeItemPersonaLayout","treeItemPersonaLayoutClassNames","renderTreeItemPersonaLayout_unstable","useTreeItemPersonaLayoutStyles_unstable","useTreeItemPersonaLayout_unstable","flattenTree_unstable","useTreeNavigation"],"mappings":";;;;;;;;;;;IA0BEM;iCAAQ;;gBAiDW;eAAZoB;;;eA1EP1B,UAAI;;YAwDI;eAARoB;;kBAsBc;eAAdO;;;eASAK,4CAAqB;;oBA9CL;eAAhBf;;;eANOL,0BAAY;;;eAAEC,2BAAa;;sBAThB;eAAlBN;;;eAyEO8B,iCAAoB;;IArE3B1B;gDAAuB;;IAkDvBkB;4DAA6B;;;eAS7BK,2DAAoC;;IA/BpCZ;gDAAuB;;;eArDvBjB,yBAAmB;;;eAJnBJ,oBAAc;;;eAwDdoB,4BAAkB;;;eAsBlBO,wCAAwB;;;eAlCjBV,0BAAkB;;;eA2CzBe,sDAA+B;;;eA3D/BvB,2CAAiC;;;eADjCD,oCAA0B;;;eAD1BD,8BAAoB;;;eAoBbW,iDAA4B;;;eAPnCH,iCAA0B;;;eApC1BZ,mCAA6B;;;eAkC7BU,8BAAuB;;;eAsBvBU,2CAAiC;;IArBjCT;iDAA2B;;;eA0C3Be,gDAAgC;;IAChCC,0BAA0B;;;;eAQ1BI,8DAAuC;;qCACN;eAAjCC;;;eAhCAb,oCAA0B;;;eAE1BE,8BAAoB;;;eAyCba,oCAAiB;;;eAnGxBnC,4BAAsB;;;eADtBD,sBAAgB;;;sBAIX,YAAS;0BAyBT,gBAAa;8BAIwB,+BAA4B;uBAOjE,sBAAa;wBAGe,oBAAiB;qCAEP,+CAA4C;0BAelF,gBAAa;8BAYS,oBAAiB;gCASvC,sBAAmB;uCASnB,6BAA0B;6BAOI,yBAAsB;mCAGzB,+BAA4B"}
|
|
@@ -8,7 +8,7 @@ Object.defineProperty(exports, "createCheckedItems", {
|
|
|
8
8
|
return createCheckedItems;
|
|
9
9
|
}
|
|
10
10
|
});
|
|
11
|
-
const _ImmutableMap = require("./ImmutableMap");
|
|
11
|
+
const _ImmutableMap = require("./ImmutableMap.cjs");
|
|
12
12
|
const tuplifyCheckedItem = (value)=>Array.isArray(value) ? value : [
|
|
13
13
|
value,
|
|
14
14
|
true
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/utils/createCheckedItems.ts"],"sourcesContent":["import type { TreeSelectionValue } from '../Tree';\nimport type { TreeItemValue } from '../TreeItem';\nimport { ImmutableMap } from './ImmutableMap';\n\nconst tuplifyCheckedItem = (\n value: TreeItemValue | [TreeItemValue, TreeSelectionValue],\n): [TreeItemValue, TreeSelectionValue] => (Array.isArray(value) ? value : [value, true]);\n\nexport const createCheckedItems = (\n iterable?: Iterable<TreeItemValue | [TreeItemValue, TreeSelectionValue]>,\n): ImmutableMap<TreeItemValue, TreeSelectionValue> => ImmutableMap.from(iterable, tuplifyCheckedItem);\n"],"names":["ImmutableMap","tuplifyCheckedItem","value","Array","isArray","createCheckedItems","iterable","from"],"mappings":";;;;;;;;;;8BAE6B,
|
|
1
|
+
{"version":3,"sources":["../src/utils/createCheckedItems.ts"],"sourcesContent":["import type { TreeSelectionValue } from '../Tree';\nimport type { TreeItemValue } from '../TreeItem';\nimport { ImmutableMap } from './ImmutableMap';\n\nconst tuplifyCheckedItem = (\n value: TreeItemValue | [TreeItemValue, TreeSelectionValue],\n): [TreeItemValue, TreeSelectionValue] => (Array.isArray(value) ? value : [value, true]);\n\nexport const createCheckedItems = (\n iterable?: Iterable<TreeItemValue | [TreeItemValue, TreeSelectionValue]>,\n): ImmutableMap<TreeItemValue, TreeSelectionValue> => ImmutableMap.from(iterable, tuplifyCheckedItem);\n"],"names":["ImmutableMap","tuplifyCheckedItem","value","Array","isArray","createCheckedItems","iterable","from"],"mappings":";;;;;;;;;;8BAE6B,oBAAiB;AAE9C,MAAMC,qBAAqB,CACzBC,QACyCC,MAAMC,OAAO,CAACF,SAASA,QAAQ;QAACA;QAAO;KAAK;AAEhF,MAAMG,qBAAqB,CAChCC,WACoDN,0BAAAA,CAAaO,IAAI,CAACD,UAAUL,oBAAoB"}
|
package/package.json
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-tree",
|
|
3
|
-
"version": "9.16.
|
|
3
|
+
"version": "9.16.5",
|
|
4
4
|
"description": "Tree component for Fluent UI React",
|
|
5
|
-
"main": "lib-commonjs/index.
|
|
5
|
+
"main": "lib-commonjs/index.cjs",
|
|
6
6
|
"module": "lib/index.js",
|
|
7
7
|
"typings": "./dist/index.d.ts",
|
|
8
8
|
"sideEffects": false,
|
|
@@ -12,21 +12,21 @@
|
|
|
12
12
|
},
|
|
13
13
|
"license": "MIT",
|
|
14
14
|
"dependencies": {
|
|
15
|
-
"@fluentui/keyboard-keys": "^9.0.
|
|
16
|
-
"@fluentui/react-aria": "^9.17.
|
|
17
|
-
"@fluentui/react-avatar": "^9.11.
|
|
18
|
-
"@fluentui/react-button": "^9.
|
|
19
|
-
"@fluentui/react-checkbox": "^9.6.
|
|
20
|
-
"@fluentui/react-context-selector": "^9.2.
|
|
15
|
+
"@fluentui/keyboard-keys": "^9.0.9",
|
|
16
|
+
"@fluentui/react-aria": "^9.17.14",
|
|
17
|
+
"@fluentui/react-avatar": "^9.11.5",
|
|
18
|
+
"@fluentui/react-button": "^9.11.0",
|
|
19
|
+
"@fluentui/react-checkbox": "^9.6.4",
|
|
20
|
+
"@fluentui/react-context-selector": "^9.2.19",
|
|
21
21
|
"@fluentui/react-icons": "^2.0.245",
|
|
22
|
-
"@fluentui/react-
|
|
23
|
-
"@fluentui/react-motion": "^9.16.
|
|
24
|
-
"@fluentui/react-
|
|
25
|
-
"@fluentui/react-
|
|
26
|
-
"@fluentui/react-
|
|
27
|
-
"@fluentui/react-
|
|
28
|
-
"@fluentui/react-
|
|
29
|
-
"@fluentui/react-
|
|
22
|
+
"@fluentui/react-jsx-runtime": "^9.4.5",
|
|
23
|
+
"@fluentui/react-motion": "^9.16.2",
|
|
24
|
+
"@fluentui/react-motion-components-preview": "^0.15.7",
|
|
25
|
+
"@fluentui/react-radio": "^9.6.5",
|
|
26
|
+
"@fluentui/react-shared-contexts": "^9.26.3",
|
|
27
|
+
"@fluentui/react-tabster": "^9.26.17",
|
|
28
|
+
"@fluentui/react-theme": "^9.2.2",
|
|
29
|
+
"@fluentui/react-utilities": "^9.26.6",
|
|
30
30
|
"@griffel/react": "^1.5.32",
|
|
31
31
|
"@swc/helpers": "^0.5.1"
|
|
32
32
|
},
|
|
@@ -38,10 +38,14 @@
|
|
|
38
38
|
},
|
|
39
39
|
"exports": {
|
|
40
40
|
".": {
|
|
41
|
-
"
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
41
|
+
"import": {
|
|
42
|
+
"types": "./dist/index.d.ts",
|
|
43
|
+
"default": "./lib/index.js"
|
|
44
|
+
},
|
|
45
|
+
"require": {
|
|
46
|
+
"types": "./dist/index.d.cts",
|
|
47
|
+
"default": "./lib-commonjs/index.cjs"
|
|
48
|
+
}
|
|
45
49
|
},
|
|
46
50
|
"./package.json": "./package.json"
|
|
47
51
|
},
|
|
@@ -54,7 +58,9 @@
|
|
|
54
58
|
"files": [
|
|
55
59
|
"*.md",
|
|
56
60
|
"dist/*.d.ts",
|
|
61
|
+
"dist/*.d.cts",
|
|
57
62
|
"lib",
|
|
58
63
|
"lib-commonjs"
|
|
59
|
-
]
|
|
64
|
+
],
|
|
65
|
+
"type": "module"
|
|
60
66
|
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["useFlatTreeStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const flatTreeClassNames = {\n root: 'fui-FlatTree'\n};\nconst useBaseStyles = makeResetStyles({\n display: 'flex',\n flexDirection: 'column',\n rowGap: tokens.spacingVerticalXXS\n});\nexport const useFlatTreeStyles_unstable = (state)=>{\n const baseStyles = useBaseStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(flatTreeClassNames.root, baseStyles, state.root.className);\n return state;\n};\n"],"names":["__resetStyles","mergeClasses","tokens","flatTreeClassNames","root","useBaseStyles","useFlatTreeStyles_unstable","state","baseStyles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;sBAGmB;;;IAQlBM,0BAA0B;;;;uBAVO,gBAAgB;AAEvD,MAAMH,qBAAqB;IAC9BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,aAAa,GAAA,WAAA,OAAGL,oBAAA,EAAA,WAAA,MAAA;IAAA;CAIrB,CAAC;AACK,oCAAoCO,KAAK,IAAG;IAC/C,MAAMC,UAAU,GAAGH,aAAa,CAAC,CAAC;IAClC,oDAAA;IACAE,KAAK,CAACH,IAAI,CAACK,SAAS,OAAGR,mBAAY,EAACE,kBAAkB,CAACC,IAAI,EAAEI,UAAU,EAAED,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;IAC9F,OAAOF,KAAK;AAChB,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["useTreeStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const treeClassNames = {\n root: 'fui-Tree'\n};\nconst useBaseStyles = makeResetStyles({\n display: 'flex',\n flexDirection: 'column',\n rowGap: tokens.spacingVerticalXXS\n});\nconst useStyles = makeStyles({\n subtree: {\n paddingTop: tokens.spacingVerticalXXS\n }\n});\nexport const useTreeStyles_unstable = (state)=>{\n const baseStyles = useBaseStyles();\n const styles = useStyles();\n const isSubTree = state.level > 1;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(treeClassNames.root, baseStyles, isSubTree && styles.subtree, state.root.className);\n return state;\n};\n"],"names":["__resetStyles","__styles","mergeClasses","tokens","treeClassNames","root","useBaseStyles","useStyles","subtree","z8tnut","d","useTreeStyles_unstable","state","baseStyles","styles","isSubTree","level","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCI,cAAc;;;0BAaQ;;;;uBAfuB,gBAAgB;AAEnE,uBAAuB;IAC1BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,aAAa,GAAA,WAAA,OAAGN,oBAAA,EAAA,WAAA,MAAA;IAAA;CAIrB,CAAC;AACF,MAAMO,SAAS,GAAA,WAAA,OAAGN,eAAA,EAAA;IAAAO,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAIjB,CAAC;AACK,MAAMC,0BAA0BC,KAAK,IAAG;IAC3C,MAAMC,UAAU,GAAGP,aAAa,CAAC,CAAC;IAClC,MAAMQ,MAAM,GAAGP,SAAS,CAAC,CAAC;IAC1B,MAAMQ,SAAS,GAAGH,KAAK,CAACI,KAAK,GAAG,CAAC;IACjC,oDAAA;IACAJ,KAAK,CAACP,IAAI,CAACY,SAAS,OAAGf,mBAAY,EAACE,cAAc,CAACC,IAAI,EAAEQ,UAAU,EAAEE,SAAS,IAAID,MAAM,CAACN,OAAO,EAAEI,KAAK,CAACP,IAAI,CAACY,SAAS,CAAC;IACvH,OAAOL,KAAK;AAChB,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["useTreeItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { treeItemLevelToken } from '../../utils/tokens';\nimport { treeItemLayoutClassNames } from '../TreeItemLayout/useTreeItemLayoutStyles.styles';\nimport { treeItemPersonaLayoutClassNames } from '../TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles';\nexport const treeItemClassNames = {\n root: 'fui-TreeItem'\n};\nconst useBaseStyles = makeResetStyles({\n position: 'relative',\n cursor: 'pointer',\n display: 'flex',\n flexDirection: 'column',\n boxSizing: 'border-box',\n backgroundColor: tokens.colorSubtleBackground,\n color: tokens.colorNeutralForeground2,\n paddingRight: tokens.spacingHorizontalNone,\n // if using createCustomFocusIndicatorStyle then we need to remove default outline styles provided by the browser\n ':focus': {\n outlineStyle: 'none'\n },\n ':focus-visible': {\n outlineStyle: 'none'\n },\n // This adds the focus outline for the TreeItemLayout element\n ...createCustomFocusIndicatorStyle({\n borderRadius: tokens.borderRadiusMedium,\n outlineColor: tokens.colorStrokeFocus2,\n outlineRadius: tokens.borderRadiusMedium,\n // FIXME: tokens.strokeWidthThick causes some weird bugs\n outlineWidth: '2px',\n outlineStyle: 'solid'\n }, {\n customizeSelector: (selector)=>`${selector} > .${treeItemLayoutClassNames.root}, ${selector} > .${treeItemPersonaLayoutClassNames.root}`\n })\n});\nconst useStyles = makeStyles({\n ...Object.fromEntries(Array.from({\n length: 10\n }, (_, index)=>[\n `level${index + 1}`,\n {\n [treeItemLevelToken]: index + 1\n }\n ]))\n});\n/**\n * Apply styling to the TreeItem slots based on the state\n */ export const useTreeItemStyles_unstable = (state)=>{\n const baseStyles = useBaseStyles();\n const styles = useStyles();\n const { level } = state;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(treeItemClassNames.root, baseStyles, isStaticallyDefinedLevel(level) && styles[`level${level}`], state.root.className);\n // For levels beyond the statically generated classes (> 10), fall back to an\n // inline style that sets the indentation CSS variable dynamically. This avoids\n // generating an unbounded number of atomic classes while still supporting\n // arbitrarily deep trees. User-provided inline styles take precedence.\n if (!isStaticallyDefinedLevel(level)) {\n // eslint-disable-next-line react-hooks/immutability\n state.root.style = {\n [treeItemLevelToken]: level,\n ...state.root.style\n };\n }\n return state;\n};\nfunction isStaticallyDefinedLevel(level) {\n return level >= 1 && level <= 10;\n}\n"],"names":["__resetStyles","__styles","mergeClasses","tokens","createCustomFocusIndicatorStyle","treeItemLevelToken","treeItemLayoutClassNames","treeItemPersonaLayoutClassNames","treeItemClassNames","root","useBaseStyles","useStyles","level1","iytv0q","level2","level3","level4","level5","level6","level7","level8","level9","level10","d","useTreeItemStyles_unstable","state","baseStyles","styles","level","className","isStaticallyDefinedLevel","style"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAOCQ,kBAAkB;;;8BA2CY;;;;uBAjDe,gBAAgB;wBAGvC,oBAAoB;AAGhD,2BAA2B;IAC9BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,aAAa,GAAA,WAAA,OAAGV,oBAAA,EAAA,YAAA,WAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;CA2BrB,CAAC;AACF,MAAMW,SAAS,GAAA,WAAA,OAAGV,eAAA,EAAA;IAAAW,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,MAAA,EAAA;QAAAD,MAAA,EAAA;IAAA;IAAAE,MAAA,EAAA;QAAAF,MAAA,EAAA;IAAA;IAAAG,MAAA,EAAA;QAAAH,MAAA,EAAA;IAAA;IAAAI,MAAA,EAAA;QAAAJ,MAAA,EAAA;IAAA;IAAAK,MAAA,EAAA;QAAAL,MAAA,EAAA;IAAA;IAAAM,MAAA,EAAA;QAAAN,MAAA,EAAA;IAAA;IAAAO,MAAA,EAAA;QAAAP,MAAA,EAAA;IAAA;IAAAQ,MAAA,EAAA;QAAAR,MAAA,EAAA;IAAA;IAAAS,OAAA,EAAA;QAAAT,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAU,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CASjB,CAAC;AAGS,MAAMC,8BAA8BC,KAAK,IAAG;IACnD,MAAMC,UAAU,GAAGhB,aAAa,CAAC,CAAC;IAClC,MAAMiB,MAAM,GAAGhB,SAAS,CAAC,CAAC;IAC1B,MAAM,EAAEiB,KAAAA,EAAO,GAAGH,KAAK;IACvB,oDAAA;IACAA,KAAK,CAAChB,IAAI,CAACoB,SAAS,OAAG3B,mBAAY,EAACM,kBAAkB,CAACC,IAAI,EAAEiB,UAAU,EAAEI,wBAAwB,CAACF,KAAK,CAAC,IAAID,MAAM,CAAC,CAAA,KAAA,EAAQC,KAAK,EAAE,CAAC,EAAEH,KAAK,CAAChB,IAAI,CAACoB,SAAS,CAAC;IAC1J,6EAAA;IACA,+EAAA;IACA,0EAAA;IACA,uEAAA;IACA,IAAI,CAACC,wBAAwB,CAACF,KAAK,CAAC,EAAE;QAClC,oDAAA;QACAH,KAAK,CAAChB,IAAI,CAACsB,KAAK,GAAG;YACf,CAAC1B,0BAAkB,CAAA,EAAGuB,KAAK;YAC3B,GAAGH,KAAK,CAAChB,IAAI,CAACsB,KAAAA;QAClB,CAAC;IACL;IACA,OAAON,KAAK;AAChB,CAAC;AACD,SAASK,wBAAwBA,CAACF,KAAK,EAAE;IACrC,OAAOA,KAAK,IAAI,CAAC,IAAIA,KAAK,IAAI,EAAE;AACpC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/TreeItemLayout/useTreeItemLayout.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n getIntrinsicElementProps,\n isResolvedShorthand,\n useMergedRefs,\n slot,\n useEventCallback,\n elementContains,\n useControllableState,\n} from '@fluentui/react-utilities';\nimport { useTreeItemContext_unstable, useTreeContext_unstable } from '../../contexts';\nimport type {\n TreeItemLayoutActionSlotProps,\n TreeItemLayoutActionVisibilityChangeData,\n TreeItemLayoutProps,\n TreeItemLayoutState,\n} from './TreeItemLayout.types';\nimport type { CheckboxProps } from '@fluentui/react-checkbox';\nimport { Checkbox } from '@fluentui/react-checkbox';\nimport type { RadioProps } from '@fluentui/react-radio';\nimport { Radio } from '@fluentui/react-radio';\nimport { TreeItemChevron } from '../TreeItemChevron';\nimport { useArrowNavigationGroup, useIsNavigatingWithKeyboard } from '@fluentui/react-tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\n\n/**\n * Create the state required to render TreeItemLayout.\n *\n * The returned state can be modified with hooks such as useTreeItemLayoutStyles_unstable,\n * before being passed to renderTreeItemLayout_unstable.\n *\n * @param props - props from this instance of TreeItemLayout\n * @param ref - reference to root HTMLElement of TreeItemLayout\n */\nexport const useTreeItemLayout_unstable = (\n props: TreeItemLayoutProps,\n ref: React.Ref<HTMLElement>,\n): TreeItemLayoutState => {\n const { main, iconAfter, iconBefore } = props;\n\n const layoutRef = useTreeItemContext_unstable(ctx => ctx.layoutRef);\n const selectionMode = useTreeContext_unstable(ctx => ctx.selectionMode);\n const navigationMode = useTreeContext_unstable(ctx => ctx.navigationMode ?? 'tree');\n\n const [isActionsVisibleFromProps, onActionVisibilityChange]: [\n TreeItemLayoutActionSlotProps['visible'],\n TreeItemLayoutActionSlotProps['onVisibilityChange'],\n ] = isResolvedShorthand(props.actions)\n ? // .visible .onVisibilityChange prop should not be propagated to the DOM\n [props.actions.visible, props.actions.onVisibilityChange]\n : [undefined, undefined];\n\n const [isActionsVisible, setIsActionsVisible] = useControllableState({\n state: isActionsVisibleFromProps,\n initialState: false,\n });\n\n const selectionRef = useTreeItemContext_unstable(ctx => ctx.selectionRef);\n const expandIconRef = useTreeItemContext_unstable(ctx => ctx.expandIconRef);\n const actionsRef = useTreeItemContext_unstable(ctx => ctx.actionsRef);\n const actionsRefInternal = React.useRef<HTMLDivElement>(null);\n const treeItemRef = useTreeItemContext_unstable(ctx => ctx.treeItemRef);\n const subtreeRef = useTreeItemContext_unstable(ctx => ctx.subtreeRef);\n const checked = useTreeItemContext_unstable(ctx => ctx.checked);\n const isBranch = useTreeItemContext_unstable(ctx => ctx.itemType === 'branch');\n\n // FIXME: Asserting is required here, as converting this to RefObject on context type would be a breaking change\n // eslint-disable-next-line react-hooks/refs\n assertIsRefObject(treeItemRef);\n // FIXME: Asserting is required here, as converting this to RefObject on context type would be a breaking change\n // eslint-disable-next-line react-hooks/refs\n assertIsRefObject(subtreeRef);\n\n const setActionsVisibleIfNotFromSubtree = React.useCallback(\n (event: MouseEvent | FocusEvent) => {\n const isTargetFromSubtree = Boolean(\n subtreeRef.current && elementContains(subtreeRef.current, event.target as Node),\n );\n if (!isTargetFromSubtree) {\n onActionVisibilityChange?.(event, {\n visible: true,\n event,\n type: event.type,\n } as Extract<TreeItemLayoutActionVisibilityChangeData, { event: typeof event }>);\n if (event.defaultPrevented) {\n return;\n }\n setIsActionsVisible(true);\n }\n },\n [subtreeRef, setIsActionsVisible, onActionVisibilityChange],\n );\n\n const { targetDocument } = useFluent();\n const isNavigatingWithKeyboard = useIsNavigatingWithKeyboard();\n\n const setActionsInvisibleIfNotFromSubtree = React.useCallback(\n (event: FocusEvent | MouseEvent) => {\n const isRelatedTargetFromActions = () =>\n Boolean(actionsRefInternal.current && elementContains(actionsRefInternal.current, event.relatedTarget as Node));\n const isRelatedTargetFromTreeItem = () =>\n Boolean(treeItemRef.current && elementContains(treeItemRef.current, event.relatedTarget as Node));\n const isTargetFromActions = () => Boolean(actionsRefInternal.current?.contains(event.target as Node));\n if (isRelatedTargetFromActions()) {\n onActionVisibilityChange?.(event, {\n visible: true,\n event,\n type: event.type,\n } as Extract<TreeItemLayoutActionVisibilityChangeData, { event: typeof event }>);\n if (event.defaultPrevented) {\n return;\n }\n setIsActionsVisible(true);\n return;\n }\n if (isTargetFromActions() && isRelatedTargetFromTreeItem()) {\n return;\n }\n // when a mouseout event happens during keyboard interaction\n // we should not hide the actions if the activeElement is the treeitem or an action\n // as the focus on the treeitem takes precedence over the mouseout event\n if (\n event.type === 'mouseout' &&\n isNavigatingWithKeyboard() &&\n (targetDocument?.activeElement === treeItemRef.current ||\n elementContains(actionsRefInternal.current, targetDocument?.activeElement as Node))\n ) {\n return;\n }\n onActionVisibilityChange?.(event, {\n visible: false,\n event,\n type: event.type,\n } as Extract<TreeItemLayoutActionVisibilityChangeData, { event: typeof event }>);\n if (event.defaultPrevented) {\n return;\n }\n setIsActionsVisible(false);\n },\n [setIsActionsVisible, onActionVisibilityChange, treeItemRef, isNavigatingWithKeyboard, targetDocument],\n );\n\n const expandIcon = slot.optional(props.expandIcon, {\n renderByDefault: isBranch,\n defaultProps: {\n children: <TreeItemChevron />,\n 'aria-hidden': true,\n },\n elementType: 'div',\n });\n const expandIconRefs = useMergedRefs(expandIcon?.ref, expandIconRef);\n if (expandIcon) {\n expandIcon.ref = expandIconRefs;\n }\n const arrowNavigationProps = useArrowNavigationGroup({ circular: navigationMode === 'tree', axis: 'horizontal' });\n const actions = isActionsVisible\n ? slot.optional(props.actions, {\n defaultProps: { ...arrowNavigationProps, role: 'toolbar' },\n elementType: 'div',\n })\n : undefined;\n delete actions?.visible;\n delete actions?.onVisibilityChange;\n\n const actionsRefs = useMergedRefs(actions?.ref, actionsRef, actionsRefInternal);\n const handleActionsBlur = useEventCallback((event: React.FocusEvent<HTMLDivElement>) => {\n if (isResolvedShorthand(props.actions)) {\n props.actions.onBlur?.(event);\n }\n const isRelatedTargetFromActions = Boolean(elementContains(event.currentTarget, event.relatedTarget as Node));\n onActionVisibilityChange?.(event, {\n visible: isRelatedTargetFromActions,\n event,\n type: event.type,\n } as Extract<TreeItemLayoutActionVisibilityChangeData, { event: typeof event }>);\n setIsActionsVisible(isRelatedTargetFromActions);\n });\n if (actions) {\n actions.ref = actionsRefs;\n actions.onBlur = handleActionsBlur;\n }\n\n const hasActions = Boolean(props.actions);\n\n React.useEffect(() => {\n if (treeItemRef.current && hasActions) {\n const treeItemElement = treeItemRef.current;\n\n const handleMouseOver = setActionsVisibleIfNotFromSubtree;\n const handleMouseOut = setActionsInvisibleIfNotFromSubtree;\n const handleFocus = setActionsVisibleIfNotFromSubtree;\n const handleBlur = setActionsInvisibleIfNotFromSubtree;\n\n treeItemElement.addEventListener('mouseover', handleMouseOver);\n treeItemElement.addEventListener('mouseout', handleMouseOut);\n treeItemElement.addEventListener('focus', handleFocus);\n treeItemElement.addEventListener('blur', handleBlur);\n\n return () => {\n treeItemElement.removeEventListener('mouseover', handleMouseOver);\n treeItemElement.removeEventListener('mouseout', handleMouseOut);\n treeItemElement.removeEventListener('focus', handleFocus);\n treeItemElement.removeEventListener('blur', handleBlur);\n };\n }\n }, [hasActions, treeItemRef, setActionsVisibleIfNotFromSubtree, setActionsInvisibleIfNotFromSubtree]);\n\n return {\n components: {\n root: 'div',\n expandIcon: 'div',\n iconBefore: 'div',\n main: 'div',\n iconAfter: 'div',\n actions: 'div',\n aside: 'div',\n // Casting here to a union between checkbox and radio\n selector: (selectionMode === 'multiselect' ? Checkbox : Radio) as React.ElementType<CheckboxProps | RadioProps>,\n },\n buttonContextValue: { size: 'small' },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ...props,\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: useMergedRefs(ref, layoutRef) as React.Ref<HTMLDivElement>,\n }),\n {\n elementType: 'div',\n },\n ),\n iconBefore: slot.optional(iconBefore, { elementType: 'div' }),\n main: slot.always(main, { elementType: 'div' }),\n iconAfter: slot.optional(iconAfter, { elementType: 'div' }),\n aside: !isActionsVisible ? slot.optional(props.aside, { elementType: 'div' }) : undefined,\n actions,\n expandIcon,\n selector: slot.optional(props.selector, {\n renderByDefault: selectionMode !== 'none',\n defaultProps: {\n checked,\n tabIndex: -1,\n 'aria-hidden': true,\n ref: selectionRef,\n // casting here to a union between checkbox and radio\n // since ref is not present on the selector signature\n // FIXME: look into Slot type to see if we can make this work\n } as CheckboxProps | RadioProps,\n elementType: (selectionMode === 'multiselect' ? Checkbox : Radio) as React.ElementType<\n CheckboxProps | RadioProps\n >,\n }),\n };\n};\n\nfunction assertIsRefObject<Value>(ref?: React.Ref<Value>): asserts ref is React.RefObject<Value> {\n if (process.env.NODE_ENV !== 'production') {\n if (typeof ref !== 'object' || ref === null || !('current' in ref)) {\n throw new Error(`\n @fluentui/react-tree [${useTreeItemLayout_unstable.name}]:\n Internal Error: contextual ref is not a RefObject! Please report this bug immediately, as contextual refs should be RefObjects.\n `);\n }\n }\n}\n"],"names":["React","getIntrinsicElementProps","isResolvedShorthand","useMergedRefs","slot","useEventCallback","elementContains","useControllableState","useTreeItemContext_unstable","useTreeContext_unstable","Checkbox","Radio","TreeItemChevron","useArrowNavigationGroup","useIsNavigatingWithKeyboard","useFluent_unstable","useFluent","useTreeItemLayout_unstable","props","ref","main","iconAfter","iconBefore","layoutRef","ctx","selectionMode","navigationMode","isActionsVisibleFromProps","onActionVisibilityChange","actions","visible","onVisibilityChange","undefined","isActionsVisible","setIsActionsVisible","state","initialState","selectionRef","expandIconRef","actionsRef","actionsRefInternal","useRef","treeItemRef","subtreeRef","checked","isBranch","itemType","assertIsRefObject","setActionsVisibleIfNotFromSubtree","useCallback","event","isTargetFromSubtree","Boolean","current","target","type","defaultPrevented","targetDocument","isNavigatingWithKeyboard","setActionsInvisibleIfNotFromSubtree","isRelatedTargetFromActions","relatedTarget","isRelatedTargetFromTreeItem","isTargetFromActions","contains","activeElement","expandIcon","optional","renderByDefault","defaultProps","children","elementType","expandIconRefs","arrowNavigationProps","circular","axis","role","actionsRefs","handleActionsBlur","onBlur","currentTarget","hasActions","useEffect","treeItemElement","handleMouseOver","handleMouseOut","handleFocus","handleBlur","addEventListener","removeEventListener","components","root","aside","selector","buttonContextValue","size","always","tabIndex","process","env","NODE_ENV","Error","name"],"mappings":"AAAA;;;;;+BAoCaiB;;;;;;;iEAlCU,QAAQ;gCASxB,4BAA4B;0BACkC,iBAAiB;+BAQ7D,2BAA2B;4BAE9B,wBAAwB;iCACd,qBAAqB;8BACgB,0BAA0B;qCAC/C,kCAAkC;AAW3E,mCAAmC,CACxCC,OACAC;IAEA,MAAM,EAAEC,IAAI,EAAEC,SAAS,EAAEC,UAAU,EAAE,GAAGJ;IAExC,MAAMK,YAAYf,yCAAAA,EAA4BgB,CAAAA,MAAOA,IAAID,SAAS;IAClE,MAAME,oBAAgBhB,iCAAAA,EAAwBe,CAAAA,MAAOA,IAAIC,aAAa;IACtE,MAAMC,qBAAiBjB,iCAAAA,EAAwBe,CAAAA;YAAOA;eAAAA,uBAAAA,IAAIE,cAAAA,AAAc,MAAA,QAAlBF,wBAAAA,KAAAA,IAAAA,sBAAsB;;IAE5E,MAAM,CAACG,2BAA2BC,yBAAyB,OAGvD1B,mCAAAA,EAAoBgB,MAAMW,OAAO,IAEjC;QAACX,MAAMW,OAAO,CAACC,OAAO;QAAEZ,MAAMW,OAAO,CAACE,kBAAkB;KAAC,GACzD;QAACC;QAAWA;KAAU;IAE1B,MAAM,CAACC,kBAAkBC,oBAAoB,OAAG3B,oCAAAA,EAAqB;QACnE4B,OAAOR;QACPS,cAAc;IAChB;IAEA,MAAMC,mBAAe7B,qCAAAA,EAA4BgB,CAAAA,MAAOA,IAAIa,YAAY;IACxE,MAAMC,oBAAgB9B,qCAAAA,EAA4BgB,CAAAA,MAAOA,IAAIc,aAAa;IAC1E,MAAMC,iBAAa/B,qCAAAA,EAA4BgB,CAAAA,MAAOA,IAAIe,UAAU;IACpE,MAAMC,qBAAqBxC,OAAMyC,MAAM,CAAiB;IACxD,MAAMC,kBAAclC,qCAAAA,EAA4BgB,CAAAA,MAAOA,IAAIkB,WAAW;IACtE,MAAMC,iBAAanC,qCAAAA,EAA4BgB,CAAAA,MAAOA,IAAImB,UAAU;IACpE,MAAMC,UAAUpC,yCAAAA,EAA4BgB,CAAAA,MAAOA,IAAIoB,OAAO;IAC9D,MAAMC,eAAWrC,qCAAAA,EAA4BgB,CAAAA,MAAOA,IAAIsB,QAAQ,KAAK;IAErE,gHAAgH;IAChH,4CAA4C;IAC5CC,kBAAkBL;IAClB,gHAAgH;IAChH,4CAA4C;IAC5CK,kBAAkBJ;IAElB,MAAMK,oCAAoChD,OAAMiD,WAAW,CACzD,CAACC;QACC,MAAMC,sBAAsBC,QAC1BT,WAAWU,OAAO,IAAI/C,mCAAAA,EAAgBqC,WAAWU,OAAO,EAAEH,MAAMI,MAAM;QAExE,IAAI,CAACH,qBAAqB;YACxBvB,6BAAAA,QAAAA,6BAAAA,KAAAA,IAAAA,KAAAA,IAAAA,yBAA2BsB,OAAO;gBAChCpB,SAAS;gBACToB;gBACAK,MAAML,MAAMK,IAAI;YAClB;YACA,IAAIL,MAAMM,gBAAgB,EAAE;gBAC1B;YACF;YACAtB,oBAAoB;QACtB;IACF,GACA;QAACS;QAAYT;QAAqBN;KAAyB;IAG7D,MAAM,EAAE6B,cAAc,EAAE,OAAGzC,uCAAAA;IAC3B,MAAM0C,+BAA2B5C,yCAAAA;IAEjC,MAAM6C,sCAAsC3D,OAAMiD,WAAW,CAC3D,CAACC;QACC,MAAMU,6BAA6B,IACjCR,QAAQZ,mBAAmBa,OAAO,QAAI/C,+BAAAA,EAAgBkC,mBAAmBa,OAAO,EAAEH,MAAMW,aAAa;QACvG,MAAMC,8BAA8B,IAClCV,QAAQV,YAAYW,OAAO,IAAI/C,mCAAAA,EAAgBoC,YAAYW,OAAO,EAAEH,MAAMW,aAAa;QACzF,MAAME,sBAAsB;gBAAcvB;mBAARY,QAAAA,CAAQZ,8BAAAA,mBAAmBa,OAAAA,AAAO,MAAA,QAA1Bb,gCAAAA,KAAAA,IAAAA,KAAAA,IAAAA,4BAA4BwB,QAAQ,CAACd,MAAMI,MAAM;;QAC3F,IAAIM,8BAA8B;YAChChC,6BAAAA,QAAAA,6BAAAA,KAAAA,IAAAA,KAAAA,IAAAA,yBAA2BsB,OAAO;gBAChCpB,SAAS;gBACToB;gBACAK,MAAML,MAAMK,IAAI;YAClB;YACA,IAAIL,MAAMM,gBAAgB,EAAE;gBAC1B;YACF;YACAtB,oBAAoB;YACpB;QACF;QACA,IAAI6B,yBAAyBD,+BAA+B;YAC1D;QACF;QACA,4DAA4D;QAC5D,mFAAmF;QACnF,wEAAwE;QACxE,IACEZ,MAAMK,IAAI,KAAK,cACfG,8BACCD,CAAAA,CAAAA,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBQ,aAAAA,AAAa,MAAKvB,YAAYW,OAAO,QACpD/C,+BAAAA,EAAgBkC,mBAAmBa,OAAO,EAAEI,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBQ,cAAa,CAAQ,EACnF;YACA;QACF;QACArC,6BAAAA,QAAAA,6BAAAA,KAAAA,IAAAA,KAAAA,IAAAA,yBAA2BsB,OAAO;YAChCpB,SAAS;YACToB;YACAK,MAAML,MAAMK,IAAI;QAClB;QACA,IAAIL,MAAMM,gBAAgB,EAAE;YAC1B;QACF;QACAtB,oBAAoB;IACtB,GACA;QAACA;QAAqBN;QAA0Bc;QAAagB;QAA0BD;KAAe;IAGxG,MAAMS,aAAa9D,oBAAAA,CAAK+D,QAAQ,CAACjD,MAAMgD,UAAU,EAAE;QACjDE,iBAAiBvB;QACjBwB,cAAc;YACZC,UAAAA,WAAAA,GAAU,OAAA,aAAA,CAAC1D,gCAAAA,EAAAA;YACX,eAAe;QACjB;QACA2D,aAAa;IACf;IACA,MAAMC,qBAAiBrE,6BAAAA,EAAc+D,eAAAA,QAAAA,eAAAA,KAAAA,IAAAA,KAAAA,IAAAA,WAAY/C,GAAG,EAAEmB;IACtD,IAAI4B,YAAY;QACdA,WAAW/C,GAAG,GAAGqD;IACnB;IACA,MAAMC,2BAAuB5D,qCAAAA,EAAwB;QAAE6D,UAAUhD,mBAAmB;QAAQiD,MAAM;IAAa;IAC/G,MAAM9C,UAAUI,mBACZ7B,oBAAAA,CAAK+D,QAAQ,CAACjD,MAAMW,OAAO,EAAE;QAC3BwC,cAAc;YAAE,GAAGI,oBAAoB;YAAEG,MAAM;QAAU;QACzDL,aAAa;IACf,KACAvC;IACGH,YAAAA,QAAAA,YAAAA,KAAAA,IAAAA,OAAAA,OAAAA,QAASC,OAAO;IAChBD,YAAAA,QAAAA,YAAAA,KAAAA,IAAAA,OAAAA,OAAAA,QAASE,kBAAkB;IAElC,MAAM8C,cAAc1E,iCAAAA,EAAc0B,YAAAA,QAAAA,YAAAA,KAAAA,IAAAA,KAAAA,IAAAA,QAASV,GAAG,EAAEoB,YAAYC;IAC5D,MAAMsC,wBAAoBzE,gCAAAA,EAAiB,CAAC6C;QAC1C,IAAIhD,uCAAAA,EAAoBgB,MAAMW,OAAO,GAAG;gBACtCX,uBAAAA;aAAAA,wBAAAA,CAAAA,iBAAAA,MAAMW,OAAO,AAAPA,EAAQkD,MAAAA,AAAM,MAAA,QAApB7D,0BAAAA,KAAAA,IAAAA,KAAAA,IAAAA,sBAAAA,IAAAA,CAAAA,gBAAuBgC;QACzB;QACA,MAAMU,6BAA6BR,YAAQ9C,+BAAAA,EAAgB4C,MAAM8B,aAAa,EAAE9B,MAAMW,aAAa;QACnGjC,6BAAAA,QAAAA,6BAAAA,KAAAA,IAAAA,KAAAA,IAAAA,yBAA2BsB,OAAO;YAChCpB,SAAS8B;YACTV;YACAK,MAAML,MAAMK,IAAI;QAClB;QACArB,oBAAoB0B;IACtB;IACA,IAAI/B,SAAS;QACXA,QAAQV,GAAG,GAAG0D;QACdhD,QAAQkD,MAAM,GAAGD;IACnB;IAEA,MAAMG,aAAa7B,QAAQlC,MAAMW,OAAO;IAExC7B,OAAMkF,SAAS,CAAC;QACd,IAAIxC,YAAYW,OAAO,IAAI4B,YAAY;YACrC,MAAME,kBAAkBzC,YAAYW,OAAO;YAE3C,MAAM+B,kBAAkBpC;YACxB,MAAMqC,iBAAiB1B;YACvB,MAAM2B,cAActC;YACpB,MAAMuC,aAAa5B;YAEnBwB,gBAAgBK,gBAAgB,CAAC,aAAaJ;YAC9CD,gBAAgBK,gBAAgB,CAAC,YAAYH;YAC7CF,gBAAgBK,gBAAgB,CAAC,SAASF;YAC1CH,gBAAgBK,gBAAgB,CAAC,QAAQD;YAEzC,OAAO;gBACLJ,gBAAgBM,mBAAmB,CAAC,aAAaL;gBACjDD,gBAAgBM,mBAAmB,CAAC,YAAYJ;gBAChDF,gBAAgBM,mBAAmB,CAAC,SAASH;gBAC7CH,gBAAgBM,mBAAmB,CAAC,QAAQF;YAC9C;QACF;IACF,GAAG;QAACN;QAAYvC;QAAaM;QAAmCW;KAAoC;IAEpG,OAAO;QACL+B,YAAY;YACVC,MAAM;YACNzB,YAAY;YACZ5C,YAAY;YACZF,MAAM;YACNC,WAAW;YACXQ,SAAS;YACT+D,OAAO;YACP,qDAAqD;YACrDC,UAAWpE,kBAAkB,gBAAgBf,uBAAAA,GAAWC,iBAAAA;QAC1D;QACAmF,oBAAoB;YAAEC,MAAM;QAAQ;QACpCJ,MAAMvF,oBAAAA,CAAK4F,MAAM,KACf/F,wCAAAA,EAAyB,OAAO;YAC9B,GAAGiB,KAAK;YACR,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FC,KAAKhB,iCAAAA,EAAcgB,KAAKI;QAC1B,IACA;YACEgD,aAAa;QACf;QAEFjD,YAAYlB,oBAAAA,CAAK+D,QAAQ,CAAC7C,YAAY;YAAEiD,aAAa;QAAM;QAC3DnD,MAAMhB,oBAAAA,CAAK4F,MAAM,CAAC5E,MAAM;YAAEmD,aAAa;QAAM;QAC7ClD,WAAWjB,oBAAAA,CAAK+D,QAAQ,CAAC9C,WAAW;YAAEkD,aAAa;QAAM;QACzDqB,OAAO,CAAC3D,mBAAmB7B,oBAAAA,CAAK+D,QAAQ,CAACjD,MAAM0E,KAAK,EAAE;YAAErB,aAAa;QAAM,KAAKvC;QAChFH;QACAqC;QACA2B,UAAUzF,oBAAAA,CAAK+D,QAAQ,CAACjD,MAAM2E,QAAQ,EAAE;YACtCzB,iBAAiB3C,kBAAkB;YACnC4C,cAAc;gBACZzB;gBACAqD,UAAU,CAAC;gBACX,eAAe;gBACf9E,KAAKkB;YAIP;YACAkC,aAAc9C,kBAAkB,gBAAgBf,uBAAAA,GAAWC,iBAAAA;QAG7D;IACF;AACF,EAAE;AAEF,SAASoC,kBAAyB5B,GAAsB;IACtD,IAAI+E,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzC,IAAI,OAAOjF,QAAQ,YAAYA,QAAQ,QAAQ,CAAE,CAAA,aAAaA,GAAAA,CAAE,EAAI;YAClE,MAAM,IAAIkF,MAAM,CAAC;8BACO,EAAEpF,2BAA2BqF,IAAI,CAAC;;MAE1D,CAAC;QACH;IACF;AACF"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["useTreeItemLayoutStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useTreeContext_unstable } from '../../contexts/treeContext';\nimport { treeItemLevelToken } from '../../utils/tokens';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\nexport const treeItemLayoutClassNames = {\n root: 'fui-TreeItemLayout',\n iconBefore: 'fui-TreeItemLayout__iconBefore',\n main: 'fui-TreeItemLayout__main',\n iconAfter: 'fui-TreeItemLayout__iconAfter',\n expandIcon: 'fui-TreeItemLayout__expandIcon',\n aside: 'fui-TreeItemLayout__aside',\n actions: 'fui-TreeItemLayout__actions',\n selector: 'fui-TreeItemLayout__selector'\n};\nconst useRootBaseStyles = makeResetStyles({\n display: 'flex',\n alignItems: 'center',\n minHeight: '32px',\n boxSizing: 'border-box',\n gridArea: 'layout',\n ':hover': {\n color: tokens.colorNeutralForeground2Hover,\n backgroundColor: tokens.colorSubtleBackgroundHover,\n // TODO: stop using treeItemLayoutClassNames.expandIcon for styling\n [`& .${treeItemLayoutClassNames.expandIcon}`]: {\n color: tokens.colorNeutralForeground3Hover\n }\n },\n ':active': {\n color: tokens.colorNeutralForeground2Pressed,\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n // TODO: stop using treeItemLayoutClassNames.expandIcon for styling\n [`& .${treeItemLayoutClassNames.expandIcon}`]: {\n color: tokens.colorNeutralForeground3Pressed\n }\n }\n});\n/**\n * Styles for the root slot\n */ const useRootStyles = makeStyles({\n leaf: {\n paddingLeft: `calc(var(${treeItemLevelToken}, 1) * ${tokens.spacingHorizontalXXL})`\n },\n branch: {\n paddingLeft: `calc((var(${treeItemLevelToken}, 1) - 1) * ${tokens.spacingHorizontalXXL})`\n },\n medium: {\n ...typographyStyles.body1\n },\n small: {\n minHeight: '24px',\n ...typographyStyles.caption1\n },\n // Appearance variations\n subtle: {},\n 'subtle-alpha': {\n ':hover': {\n backgroundColor: tokens.colorSubtleBackgroundLightAlphaHover\n },\n ':active': {\n backgroundColor: tokens.colorSubtleBackgroundLightAlphaPressed\n }\n },\n transparent: {\n backgroundColor: tokens.colorTransparentBackground,\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover\n },\n ':active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed\n }\n }\n});\n/**\n * Styles for the action icon slot\n */ const useActionsBaseStyles = makeResetStyles({\n display: 'flex',\n marginLeft: 'auto',\n position: 'relative',\n zIndex: 1,\n gridArea: 'aside',\n padding: `0 ${tokens.spacingHorizontalS}`\n});\n/**\n * Styles for the action icon slot\n */ const useAsideBaseStyles = makeResetStyles({\n display: 'flex',\n marginLeft: 'auto',\n alignItems: 'center',\n zIndex: 0,\n gridArea: 'aside',\n padding: `0 ${tokens.spacingHorizontalM}`,\n gap: tokens.spacingHorizontalXS\n});\n/**\n * Styles for the expand icon slot\n */ const useExpandIconBaseStyles = makeResetStyles({\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n minWidth: '24px',\n boxSizing: 'border-box',\n color: tokens.colorNeutralForeground3,\n flex: `0 0 auto`,\n padding: `${tokens.spacingVerticalXS} 0`\n});\n/**\n * Styles for the content slot\n */ const useMainBaseStyles = makeResetStyles({\n padding: `0 ${tokens.spacingHorizontalXXS}`\n});\n/**\n * Styles for the before/after icon slot\n */ const useIconBaseStyles = makeResetStyles({\n display: 'flex',\n alignItems: 'center',\n color: tokens.colorNeutralForeground2,\n lineHeight: tokens.lineHeightBase500,\n fontSize: tokens.fontSizeBase500\n});\nconst useIconBeforeStyles = makeStyles({\n medium: {\n paddingRight: tokens.spacingHorizontalXS\n },\n small: {\n paddingRight: tokens.spacingHorizontalXXS\n }\n});\nconst useIconAfterStyles = makeStyles({\n medium: {\n paddingLeft: tokens.spacingHorizontalXS\n },\n small: {\n paddingLeft: tokens.spacingHorizontalXXS\n }\n});\n/**\n * Apply styling to the TreeItemLayout slots based on the state\n */ export const useTreeItemLayoutStyles_unstable = (state)=>{\n const { main, iconAfter, iconBefore, expandIcon, root, aside, actions, selector } = state;\n const rootStyles = useRootStyles();\n const rootBaseStyles = useRootBaseStyles();\n const actionsBaseStyles = useActionsBaseStyles();\n const asideBaseStyles = useAsideBaseStyles();\n const mainBaseStyles = useMainBaseStyles();\n const expandIconBaseStyles = useExpandIconBaseStyles();\n const iconBaseStyles = useIconBaseStyles();\n const iconBeforeStyles = useIconBeforeStyles();\n const iconAfterStyles = useIconAfterStyles();\n const size = useTreeContext_unstable((ctx)=>ctx.size);\n const appearance = useTreeContext_unstable((ctx)=>ctx.appearance);\n const itemType = useTreeItemContext_unstable((ctx)=>ctx.itemType);\n // eslint-disable-next-line react-hooks/immutability\n root.className = mergeClasses(treeItemLayoutClassNames.root, rootBaseStyles, rootStyles[appearance], rootStyles[size], rootStyles[itemType], root.className);\n // eslint-disable-next-line react-hooks/immutability\n main.className = mergeClasses(treeItemLayoutClassNames.main, mainBaseStyles, main.className);\n if (expandIcon) {\n // eslint-disable-next-line react-hooks/immutability\n expandIcon.className = mergeClasses(treeItemLayoutClassNames.expandIcon, expandIconBaseStyles, expandIcon.className);\n }\n if (iconBefore) {\n // eslint-disable-next-line react-hooks/immutability\n iconBefore.className = mergeClasses(treeItemLayoutClassNames.iconBefore, iconBaseStyles, iconBeforeStyles[size], iconBefore.className);\n }\n if (iconAfter) {\n // eslint-disable-next-line react-hooks/immutability\n iconAfter.className = mergeClasses(treeItemLayoutClassNames.iconAfter, iconBaseStyles, iconAfterStyles[size], iconAfter.className);\n }\n if (actions) {\n // eslint-disable-next-line react-hooks/immutability\n actions.className = mergeClasses(treeItemLayoutClassNames.actions, actionsBaseStyles, actions.className);\n }\n if (aside) {\n // eslint-disable-next-line react-hooks/immutability\n aside.className = mergeClasses(treeItemLayoutClassNames.aside, asideBaseStyles, aside.className);\n }\n if (selector) {\n // eslint-disable-next-line react-hooks/immutability\n selector.className = mergeClasses(treeItemLayoutClassNames.selector, selector.className);\n }\n return state;\n};\n"],"names":["__resetStyles","__styles","mergeClasses","tokens","typographyStyles","useTreeContext_unstable","treeItemLevelToken","useTreeItemContext_unstable","treeItemLayoutClassNames","root","iconBefore","main","iconAfter","expandIcon","aside","actions","selector","useRootBaseStyles","useRootStyles","leaf","uwmqm3","branch","medium","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","small","sshi5w","subtle","Jwef8y","ecr2s2","transparent","De3pzq","d","h","a","useActionsBaseStyles","useAsideBaseStyles","useExpandIconBaseStyles","useMainBaseStyles","useIconBaseStyles","useIconBeforeStyles","z189sj","useIconAfterStyles","useTreeItemLayoutStyles_unstable","state","rootStyles","rootBaseStyles","actionsBaseStyles","asideBaseStyles","mainBaseStyles","expandIconBaseStyles","iconBaseStyles","iconBeforeStyles","iconAfterStyles","size","ctx","appearance","itemType","className"],"mappings":"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"}
|
package/lib-commonjs/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["useTreeItemPersonaLayoutStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { treeItemLevelToken } from '../../utils/tokens';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\nimport { useTreeContext_unstable } from '../../contexts/treeContext';\nexport const treeItemPersonaLayoutClassNames = {\n root: 'fui-TreeItemPersonaLayout',\n media: 'fui-TreeItemPersonaLayout__media',\n description: 'fui-TreeItemPersonaLayout__description',\n main: 'fui-TreeItemPersonaLayout__main',\n expandIcon: 'fui-TreeItemPersonaLayout__expandIcon',\n aside: 'fui-TreeItemPersonaLayout__aside',\n actions: 'fui-TreeItemPersonaLayout__actions',\n selector: 'fui-TreeItemPersonaLayout__selector'\n};\nconst useRootBaseStyles = makeResetStyles({\n display: 'grid',\n gridTemplateRows: '1fr auto',\n gridTemplateColumns: 'auto auto 1fr auto',\n gridTemplateAreas: `\n \"expandIcon media main aside\"\n \"expandIcon media description aside\"\n `,\n alignItems: 'center',\n ...typographyStyles.body1,\n ':active': {\n color: tokens.colorNeutralForeground2Pressed,\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n // TODO: stop using treeItemPersonaLayoutClassNames.expandIcon for styling\n [`& .${treeItemPersonaLayoutClassNames.expandIcon}`]: {\n color: tokens.colorNeutralForeground3Pressed\n }\n },\n ':hover': {\n color: tokens.colorNeutralForeground2Hover,\n backgroundColor: tokens.colorSubtleBackgroundHover,\n // TODO: stop using treeItemPersonaLayoutClassNames.expandIcon for styling\n [`& .${treeItemPersonaLayoutClassNames.expandIcon}`]: {\n color: tokens.colorNeutralForeground3Hover\n }\n }\n});\n/**\n * Styles for the root slot\n */ const useRootStyles = makeStyles({\n leaf: {\n paddingLeft: `calc(var(${treeItemLevelToken}, 1) * ${tokens.spacingHorizontalXXL})`\n },\n branch: {\n paddingLeft: `calc((var(${treeItemLevelToken}, 1) - 1) * ${tokens.spacingHorizontalXXL})`\n },\n // Size variations\n medium: {\n ...typographyStyles.body1\n },\n small: {\n minHeight: '24px',\n ...typographyStyles.caption1\n },\n // Appearance variations\n subtle: {},\n 'subtle-alpha': {\n ':hover': {\n backgroundColor: tokens.colorSubtleBackgroundLightAlphaHover\n },\n ':active': {\n backgroundColor: tokens.colorSubtleBackgroundLightAlphaPressed\n }\n },\n transparent: {\n backgroundColor: tokens.colorTransparentBackground,\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover\n },\n ':active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed\n }\n }\n});\n/**\n * Styles for the expand icon slot\n */ const useMediaBaseStyles = makeResetStyles({\n display: 'flex',\n alignItems: 'center',\n width: '32px',\n height: '32px',\n gridArea: 'media',\n padding: `0 ${tokens.spacingHorizontalXS} 0 ${tokens.spacingHorizontalXXS}`\n});\nconst useMainBaseStyles = makeResetStyles({\n gridArea: 'main',\n padding: `${tokens.spacingVerticalMNudge} ${tokens.spacingHorizontalXS} ${tokens.spacingVerticalMNudge} ${tokens.spacingHorizontalS}`\n});\nconst useMainStyles = makeStyles({\n withDescription: {\n padding: `${tokens.spacingVerticalMNudge} ${tokens.spacingHorizontalXS} 0 ${tokens.spacingHorizontalS}`\n }\n});\nconst useDescriptionBaseStyles = makeResetStyles({\n gridArea: 'description',\n ...typographyStyles.caption1,\n padding: `0 ${tokens.spacingHorizontalXS} ${tokens.spacingVerticalMNudge} ${tokens.spacingHorizontalS}`\n});\n/**\n * Styles for the action icon slot\n */ const useActionsBaseStyles = makeResetStyles({\n display: 'flex',\n marginLeft: 'auto',\n position: 'relative',\n zIndex: 1,\n gridArea: 'aside',\n padding: `0 ${tokens.spacingHorizontalS}`\n});\n/**\n * Styles for the action icon slot\n */ const useAsideBaseStyles = makeResetStyles({\n display: 'flex',\n marginLeft: 'auto',\n alignItems: 'center',\n zIndex: 0,\n gridArea: 'aside',\n padding: `0 ${tokens.spacingHorizontalM}`,\n gap: tokens.spacingHorizontalXS\n});\n/**\n * Styles for the expand icon slot\n */ const useExpandIconBaseStyles = makeResetStyles({\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n minWidth: '24px',\n boxSizing: 'border-box',\n color: tokens.colorNeutralForeground3,\n gridArea: 'expandIcon',\n flex: `0 0 auto`,\n padding: `${tokens.spacingVerticalXS} 0`\n});\n/**\n * Apply styling to the TreeItemPersonaLayout slots based on the state\n */ export const useTreeItemPersonaLayoutStyles_unstable = (state)=>{\n const rootBaseStyles = useRootBaseStyles();\n const rootStyles = useRootStyles();\n const mediaBaseStyles = useMediaBaseStyles();\n const descriptionBaseStyles = useDescriptionBaseStyles();\n const actionsBaseStyles = useActionsBaseStyles();\n const asideBaseStyles = useAsideBaseStyles();\n const expandIconBaseStyles = useExpandIconBaseStyles();\n const mainBaseStyles = useMainBaseStyles();\n const mainStyles = useMainStyles();\n const size = useTreeContext_unstable((ctx)=>ctx.size);\n const appearance = useTreeContext_unstable((ctx)=>ctx.appearance);\n const itemType = useTreeItemContext_unstable((ctx)=>ctx.itemType);\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(treeItemPersonaLayoutClassNames.root, rootBaseStyles, rootStyles[itemType], rootStyles[appearance], rootStyles[size], state.root.className);\n // eslint-disable-next-line react-hooks/immutability\n state.media.className = mergeClasses(treeItemPersonaLayoutClassNames.media, mediaBaseStyles, state.media.className);\n if (state.main) {\n // eslint-disable-next-line react-hooks/immutability\n state.main.className = mergeClasses(treeItemPersonaLayoutClassNames.main, mainBaseStyles, state.description && mainStyles.withDescription, state.main.className);\n }\n if (state.description) {\n // eslint-disable-next-line react-hooks/immutability\n state.description.className = mergeClasses(treeItemPersonaLayoutClassNames.description, descriptionBaseStyles, state.description.className);\n }\n if (state.actions) {\n // eslint-disable-next-line react-hooks/immutability\n state.actions.className = mergeClasses(treeItemPersonaLayoutClassNames.actions, actionsBaseStyles, state.actions.className);\n }\n if (state.aside) {\n // eslint-disable-next-line react-hooks/immutability\n state.aside.className = mergeClasses(treeItemPersonaLayoutClassNames.aside, asideBaseStyles, state.aside.className);\n }\n if (state.expandIcon) {\n // eslint-disable-next-line react-hooks/immutability\n state.expandIcon.className = mergeClasses(treeItemPersonaLayoutClassNames.expandIcon, expandIconBaseStyles, state.expandIcon.className);\n }\n if (state.selector) {\n // eslint-disable-next-line react-hooks/immutability\n state.selector.className = mergeClasses(treeItemPersonaLayoutClassNames.selector, state.selector.className);\n }\n return state;\n};\n"],"names":["__resetStyles","__styles","mergeClasses","tokens","typographyStyles","treeItemLevelToken","useTreeItemContext_unstable","useTreeContext_unstable","treeItemPersonaLayoutClassNames","root","media","description","main","expandIcon","aside","actions","selector","useRootBaseStyles","useRootStyles","leaf","uwmqm3","branch","medium","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","small","sshi5w","subtle","Jwef8y","ecr2s2","transparent","De3pzq","d","h","a","useMediaBaseStyles","useMainBaseStyles","useMainStyles","withDescription","Byoj8tv","z189sj","z8tnut","B0ocmuz","p","useDescriptionBaseStyles","useActionsBaseStyles","useAsideBaseStyles","useExpandIconBaseStyles","useTreeItemPersonaLayoutStyles_unstable","state","rootBaseStyles","rootStyles","mediaBaseStyles","descriptionBaseStyles","actionsBaseStyles","asideBaseStyles","expandIconBaseStyles","mainBaseStyles","mainStyles","size","ctx","appearance","itemType","className"],"mappings":"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"}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
/package/lib-commonjs/components/FlatTreeItem/{FlatTreeItem.types.js → FlatTreeItem.types.cjs}
RENAMED
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
/package/lib-commonjs/components/Tree/{useTreeContextValues.js.map → useTreeContextValues.cjs.map}
RENAMED
|
File without changes
|
|
File without changes
|
/package/lib-commonjs/components/Tree/{useTreeStyles.styles.raw.js → useTreeStyles.styles.raw.cjs}
RENAMED
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
/package/lib-commonjs/components/TreeItemLayout/{TreeItemLayout.types.js → TreeItemLayout.types.cjs}
RENAMED
|
File without changes
|
|
File without changes
|
/package/lib-commonjs/components/TreeItemLayout/{renderTreeItemLayout.js → renderTreeItemLayout.cjs}
RENAMED
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|