@fluentui/react-tree 9.7.2 → 9.7.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (159) hide show
  1. package/CHANGELOG.md +31 -2
  2. package/lib/FlatTree.js.map +1 -1
  3. package/lib/FlatTreeItem.js.map +1 -1
  4. package/lib/Tree.js.map +1 -1
  5. package/lib/TreeItem.js.map +1 -1
  6. package/lib/TreeItemLayout.js.map +1 -1
  7. package/lib/TreeItemPersonaLayout.js.map +1 -1
  8. package/lib/components/FlatTree/FlatTree.js.map +1 -1
  9. package/lib/components/FlatTree/FlatTree.types.js.map +1 -1
  10. package/lib/components/FlatTree/index.js.map +1 -1
  11. package/lib/components/FlatTree/renderFlatTree.js.map +1 -1
  12. package/lib/components/FlatTree/useFlatControllableCheckedItems.js +1 -1
  13. package/lib/components/FlatTree/useFlatControllableCheckedItems.js.map +1 -1
  14. package/lib/components/FlatTree/useFlatTree.js.map +1 -1
  15. package/lib/components/FlatTree/useFlatTreeContextValues.js.map +1 -1
  16. package/lib/components/FlatTree/useHeadlessFlatTree.js.map +1 -1
  17. package/lib/components/FlatTreeItem/FlatTreeItem.js.map +1 -1
  18. package/lib/components/FlatTreeItem/FlatTreeItem.types.js +3 -1
  19. package/lib/components/FlatTreeItem/FlatTreeItem.types.js.map +1 -1
  20. package/lib/components/FlatTreeItem/index.js.map +1 -1
  21. package/lib/components/Tree/Tree.js.map +1 -1
  22. package/lib/components/Tree/Tree.types.js +3 -1
  23. package/lib/components/Tree/Tree.types.js.map +1 -1
  24. package/lib/components/Tree/index.js.map +1 -1
  25. package/lib/components/Tree/renderTree.js.map +1 -1
  26. package/lib/components/Tree/useNestedControllableCheckedItems.js.map +1 -1
  27. package/lib/components/Tree/useTree.js.map +1 -1
  28. package/lib/components/Tree/useTreeContextValues.js.map +1 -1
  29. package/lib/components/TreeItem/TreeItem.js.map +1 -1
  30. package/lib/components/TreeItem/TreeItem.types.js.map +1 -1
  31. package/lib/components/TreeItem/index.js.map +1 -1
  32. package/lib/components/TreeItem/renderTreeItem.js.map +1 -1
  33. package/lib/components/TreeItem/useTreeItem.js.map +1 -1
  34. package/lib/components/TreeItem/useTreeItemContextValues.js.map +1 -1
  35. package/lib/components/TreeItemChevron.js.map +1 -1
  36. package/lib/components/TreeItemLayout/TreeItemLayout.js.map +1 -1
  37. package/lib/components/TreeItemLayout/TreeItemLayout.types.js +3 -1
  38. package/lib/components/TreeItemLayout/TreeItemLayout.types.js.map +1 -1
  39. package/lib/components/TreeItemLayout/index.js.map +1 -1
  40. package/lib/components/TreeItemLayout/renderTreeItemLayout.js.map +1 -1
  41. package/lib/components/TreeItemLayout/useTreeItemLayout.js.map +1 -1
  42. package/lib/components/TreeItemPersonaLayout/TreeItemPersonaLayout.js.map +1 -1
  43. package/lib/components/TreeItemPersonaLayout/TreeItemPersonaLayout.types.js +3 -1
  44. package/lib/components/TreeItemPersonaLayout/TreeItemPersonaLayout.types.js.map +1 -1
  45. package/lib/components/TreeItemPersonaLayout/index.js.map +1 -1
  46. package/lib/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js.map +1 -1
  47. package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayout.js.map +1 -1
  48. package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutContextValues.js.map +1 -1
  49. package/lib/components/TreeProvider.js.map +1 -1
  50. package/lib/contexts/index.js.map +1 -1
  51. package/lib/contexts/subtreeContext.js.map +1 -1
  52. package/lib/contexts/treeContext.js.map +1 -1
  53. package/lib/contexts/treeItemContext.js.map +1 -1
  54. package/lib/hooks/useControllableOpenItems.js.map +1 -1
  55. package/lib/hooks/useFlatTreeNavigation.js.map +1 -1
  56. package/lib/hooks/useHTMLElementWalkerRef.js.map +1 -1
  57. package/lib/hooks/useRootTree.js.map +1 -1
  58. package/lib/hooks/useRovingTabIndexes.js +3 -1
  59. package/lib/hooks/useRovingTabIndexes.js.map +1 -1
  60. package/lib/hooks/useSubtree.js.map +1 -1
  61. package/lib/hooks/useTreeNavigation.js.map +1 -1
  62. package/lib/index.js.map +1 -1
  63. package/lib/utils/ImmutableMap.js.map +1 -1
  64. package/lib/utils/ImmutableSet.js.map +1 -1
  65. package/lib/utils/assert.js.map +1 -1
  66. package/lib/utils/createCheckedItems.js.map +1 -1
  67. package/lib/utils/createHTMLElementWalker.js.map +1 -1
  68. package/lib/utils/createHeadlessTree.js.map +1 -1
  69. package/lib/utils/createOpenItems.js.map +1 -1
  70. package/lib/utils/flattenTree.js.map +1 -1
  71. package/lib/utils/getTreeItemValueFromElement.js.map +1 -1
  72. package/lib/utils/nextTypeAheadElement.js.map +1 -1
  73. package/lib/utils/normalizeOpenItems.js.map +1 -1
  74. package/lib/utils/tokens.js.map +1 -1
  75. package/lib/utils/treeItemFilter.js.map +1 -1
  76. package/lib-commonjs/FlatTree.js.map +1 -1
  77. package/lib-commonjs/FlatTreeItem.js.map +1 -1
  78. package/lib-commonjs/Tree.js.map +1 -1
  79. package/lib-commonjs/TreeItem.js.map +1 -1
  80. package/lib-commonjs/TreeItemLayout.js.map +1 -1
  81. package/lib-commonjs/TreeItemPersonaLayout.js.map +1 -1
  82. package/lib-commonjs/components/FlatTree/FlatTree.js.map +1 -1
  83. package/lib-commonjs/components/FlatTree/FlatTree.types.js.map +1 -1
  84. package/lib-commonjs/components/FlatTree/index.js.map +1 -1
  85. package/lib-commonjs/components/FlatTree/renderFlatTree.js.map +1 -1
  86. package/lib-commonjs/components/FlatTree/useFlatControllableCheckedItems.js +4 -4
  87. package/lib-commonjs/components/FlatTree/useFlatControllableCheckedItems.js.map +1 -1
  88. package/lib-commonjs/components/FlatTree/useFlatTree.js.map +1 -1
  89. package/lib-commonjs/components/FlatTree/useFlatTreeContextValues.js.map +1 -1
  90. package/lib-commonjs/components/FlatTree/useFlatTreeStyles.styles.js.map +1 -1
  91. package/lib-commonjs/components/FlatTree/useHeadlessFlatTree.js.map +1 -1
  92. package/lib-commonjs/components/FlatTreeItem/FlatTreeItem.js.map +1 -1
  93. package/lib-commonjs/components/FlatTreeItem/FlatTreeItem.types.js +3 -1
  94. package/lib-commonjs/components/FlatTreeItem/FlatTreeItem.types.js.map +1 -1
  95. package/lib-commonjs/components/FlatTreeItem/index.js.map +1 -1
  96. package/lib-commonjs/components/Tree/Tree.js.map +1 -1
  97. package/lib-commonjs/components/Tree/Tree.types.js +3 -1
  98. package/lib-commonjs/components/Tree/Tree.types.js.map +1 -1
  99. package/lib-commonjs/components/Tree/index.js.map +1 -1
  100. package/lib-commonjs/components/Tree/renderTree.js.map +1 -1
  101. package/lib-commonjs/components/Tree/useNestedControllableCheckedItems.js +3 -3
  102. package/lib-commonjs/components/Tree/useNestedControllableCheckedItems.js.map +1 -1
  103. package/lib-commonjs/components/Tree/useTree.js.map +1 -1
  104. package/lib-commonjs/components/Tree/useTreeContextValues.js.map +1 -1
  105. package/lib-commonjs/components/Tree/useTreeStyles.styles.js.map +1 -1
  106. package/lib-commonjs/components/TreeItem/TreeItem.js.map +1 -1
  107. package/lib-commonjs/components/TreeItem/TreeItem.types.js.map +1 -1
  108. package/lib-commonjs/components/TreeItem/index.js.map +1 -1
  109. package/lib-commonjs/components/TreeItem/renderTreeItem.js.map +1 -1
  110. package/lib-commonjs/components/TreeItem/useTreeItem.js.map +1 -1
  111. package/lib-commonjs/components/TreeItem/useTreeItemContextValues.js.map +1 -1
  112. package/lib-commonjs/components/TreeItem/useTreeItemStyles.styles.js.map +1 -1
  113. package/lib-commonjs/components/TreeItemChevron.js.map +1 -1
  114. package/lib-commonjs/components/TreeItemLayout/TreeItemLayout.js.map +1 -1
  115. package/lib-commonjs/components/TreeItemLayout/TreeItemLayout.types.js +3 -1
  116. package/lib-commonjs/components/TreeItemLayout/TreeItemLayout.types.js.map +1 -1
  117. package/lib-commonjs/components/TreeItemLayout/index.js.map +1 -1
  118. package/lib-commonjs/components/TreeItemLayout/renderTreeItemLayout.js.map +1 -1
  119. package/lib-commonjs/components/TreeItemLayout/useTreeItemLayout.js.map +1 -1
  120. package/lib-commonjs/components/TreeItemLayout/useTreeItemLayoutStyles.styles.js.map +1 -1
  121. package/lib-commonjs/components/TreeItemPersonaLayout/TreeItemPersonaLayout.js.map +1 -1
  122. package/lib-commonjs/components/TreeItemPersonaLayout/TreeItemPersonaLayout.types.js +3 -1
  123. package/lib-commonjs/components/TreeItemPersonaLayout/TreeItemPersonaLayout.types.js.map +1 -1
  124. package/lib-commonjs/components/TreeItemPersonaLayout/index.js.map +1 -1
  125. package/lib-commonjs/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js.map +1 -1
  126. package/lib-commonjs/components/TreeItemPersonaLayout/useTreeItemPersonaLayout.js.map +1 -1
  127. package/lib-commonjs/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutContextValues.js.map +1 -1
  128. package/lib-commonjs/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.js.map +1 -1
  129. package/lib-commonjs/components/TreeProvider.js.map +1 -1
  130. package/lib-commonjs/contexts/index.js.map +1 -1
  131. package/lib-commonjs/contexts/subtreeContext.js.map +1 -1
  132. package/lib-commonjs/contexts/treeContext.js.map +1 -1
  133. package/lib-commonjs/contexts/treeItemContext.js.map +1 -1
  134. package/lib-commonjs/hooks/useControllableOpenItems.js +3 -3
  135. package/lib-commonjs/hooks/useControllableOpenItems.js.map +1 -1
  136. package/lib-commonjs/hooks/useFlatTreeNavigation.js.map +1 -1
  137. package/lib-commonjs/hooks/useHTMLElementWalkerRef.js.map +1 -1
  138. package/lib-commonjs/hooks/useRootTree.js.map +1 -1
  139. package/lib-commonjs/hooks/useRovingTabIndexes.js +3 -1
  140. package/lib-commonjs/hooks/useRovingTabIndexes.js.map +1 -1
  141. package/lib-commonjs/hooks/useSubtree.js.map +1 -1
  142. package/lib-commonjs/hooks/useTreeNavigation.js.map +1 -1
  143. package/lib-commonjs/index.js +65 -65
  144. package/lib-commonjs/index.js.map +1 -1
  145. package/lib-commonjs/utils/ImmutableMap.js.map +1 -1
  146. package/lib-commonjs/utils/ImmutableSet.js.map +1 -1
  147. package/lib-commonjs/utils/assert.js.map +1 -1
  148. package/lib-commonjs/utils/createCheckedItems.js.map +1 -1
  149. package/lib-commonjs/utils/createHTMLElementWalker.js.map +1 -1
  150. package/lib-commonjs/utils/createHeadlessTree.js.map +1 -1
  151. package/lib-commonjs/utils/createOpenItems.js.map +1 -1
  152. package/lib-commonjs/utils/flattenTree.js.map +1 -1
  153. package/lib-commonjs/utils/getTreeItemValueFromElement.js.map +1 -1
  154. package/lib-commonjs/utils/nextTypeAheadElement.js.map +1 -1
  155. package/lib-commonjs/utils/normalizeOpenItems.js.map +1 -1
  156. package/lib-commonjs/utils/tokens.js +3 -3
  157. package/lib-commonjs/utils/tokens.js.map +1 -1
  158. package/lib-commonjs/utils/treeItemFilter.js.map +1 -1
  159. package/package.json +11 -11
@@ -9,11 +9,11 @@ function _export(target, all) {
9
9
  });
10
10
  }
11
11
  _export(exports, {
12
- useNestedCheckedItems: function() {
13
- return useNestedCheckedItems;
14
- },
15
12
  createNextNestedCheckedItems: function() {
16
13
  return createNextNestedCheckedItems;
14
+ },
15
+ useNestedCheckedItems: function() {
16
+ return useNestedCheckedItems;
17
17
  }
18
18
  });
19
19
  const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
@@ -1 +1 @@
1
- {"version":3,"sources":["useNestedControllableCheckedItems.js"],"sourcesContent":["import * as React from 'react';\nimport { ImmutableMap } from '../../utils/ImmutableMap';\nimport { createCheckedItems } from '../../utils/createCheckedItems';\nexport function useNestedCheckedItems(props) {\n return React.useMemo(()=>createCheckedItems(props.checkedItems), [\n props.checkedItems\n ]);\n}\nexport function createNextNestedCheckedItems(data, previousCheckedItems) {\n if (data.selectionMode === 'single') {\n return ImmutableMap.create([\n [\n data.value,\n data.checked\n ]\n ]);\n }\n if (data.selectionMode === 'multiselect') {\n return previousCheckedItems.set(data.value, data.checked);\n }\n return previousCheckedItems;\n}\n"],"names":["useNestedCheckedItems","createNextNestedCheckedItems","props","React","useMemo","createCheckedItems","checkedItems","data","previousCheckedItems","selectionMode","ImmutableMap","create","value","checked","set"],"mappings":";;;;;;;;;;;IAGgBA,qBAAqB;eAArBA;;IAKAC,4BAA4B;eAA5BA;;;;iEARO;8BACM;oCACM;AAC5B,SAASD,sBAAsBE,KAAK;IACvC,OAAOC,OAAMC,OAAO,CAAC,IAAIC,IAAAA,sCAAkB,EAACH,MAAMI,YAAY,GAAG;QAC7DJ,MAAMI,YAAY;KACrB;AACL;AACO,SAASL,6BAA6BM,IAAI,EAAEC,oBAAoB;IACnE,IAAID,KAAKE,aAAa,KAAK,UAAU;QACjC,OAAOC,0BAAY,CAACC,MAAM,CAAC;YACvB;gBACIJ,KAAKK,KAAK;gBACVL,KAAKM,OAAO;aACf;SACJ;IACL;IACA,IAAIN,KAAKE,aAAa,KAAK,eAAe;QACtC,OAAOD,qBAAqBM,GAAG,CAACP,KAAKK,KAAK,EAAEL,KAAKM,OAAO;IAC5D;IACA,OAAOL;AACX"}
1
+ {"version":3,"sources":["useNestedControllableCheckedItems.ts"],"sourcesContent":["import * as React from 'react';\nimport type { TreeCheckedChangeData, TreeProps } from './Tree.types';\nimport { ImmutableMap } from '../../utils/ImmutableMap';\nimport { createCheckedItems } from '../../utils/createCheckedItems';\nimport { TreeItemValue } from '../TreeItem/TreeItem.types';\n\nexport function useNestedCheckedItems(props: Pick<TreeProps, 'checkedItems'>) {\n return React.useMemo(() => createCheckedItems(props.checkedItems), [props.checkedItems]);\n}\n\nexport function createNextNestedCheckedItems(\n data: Pick<TreeCheckedChangeData, 'selectionMode' | 'value' | 'checked'>,\n previousCheckedItems: ImmutableMap<TreeItemValue, 'mixed' | boolean>,\n): ImmutableMap<TreeItemValue, 'mixed' | boolean> {\n if (data.selectionMode === 'single') {\n return ImmutableMap.create([[data.value, data.checked]]);\n }\n if (data.selectionMode === 'multiselect') {\n return previousCheckedItems.set(data.value, data.checked);\n }\n return previousCheckedItems;\n}\n"],"names":["createNextNestedCheckedItems","useNestedCheckedItems","props","React","useMemo","createCheckedItems","checkedItems","data","previousCheckedItems","selectionMode","ImmutableMap","create","value","checked","set"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAUgBA,4BAAAA;eAAAA;;IAJAC,qBAAAA;eAAAA;;;;iEANO;8BAEM;oCACM;AAG5B,SAASA,sBAAsBC,KAAsC;IAC1E,OAAOC,OAAMC,OAAO,CAAC,IAAMC,IAAAA,sCAAAA,EAAmBH,MAAMI,YAAY,GAAG;QAACJ,MAAMI,YAAY;KAAC;AACzF;AAEO,SAASN,6BACdO,IAAwE,EACxEC,oBAAoE;IAEpE,IAAID,KAAKE,aAAa,KAAK,UAAU;QACnC,OAAOC,0BAAAA,CAAaC,MAAM,CAAC;YAAC;gBAACJ,KAAKK,KAAK;gBAAEL,KAAKM,OAAO;aAAC;SAAC;IACzD;IACA,IAAIN,KAAKE,aAAa,KAAK,eAAe;QACxC,OAAOD,qBAAqBM,GAAG,CAACP,KAAKK,KAAK,EAAEL,KAAKM,OAAO;IAC1D;IACA,OAAOL;AACT"}
@@ -1 +1 @@
1
- {"version":3,"sources":["useTree.js"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { createNextOpenItems, useControllableOpenItems } from '../../hooks/useControllableOpenItems';\nimport { createNextNestedCheckedItems, useNestedCheckedItems } from './useNestedControllableCheckedItems';\nimport { SubtreeContext } from '../../contexts/subtreeContext';\nimport { useRootTree } from '../../hooks/useRootTree';\nimport { useSubtree } from '../../hooks/useSubtree';\nimport { useTreeNavigation } from '../../hooks/useTreeNavigation';\nimport { useTreeContext_unstable } from '../../contexts/treeContext';\nexport const useTree_unstable = (props, ref)=>{\n 'use no memo';\n const isRoot = React.useContext(SubtreeContext) === undefined;\n // as level is static, this doesn't break rule of hooks\n // and if this becomes an issue later on, this can be easily converted\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return isRoot ? useNestedRootTree(props, ref) : useNestedSubtree(props, ref);\n};\nfunction useNestedRootTree(props, ref) {\n 'use no memo';\n const [openItems, setOpenItems] = useControllableOpenItems(props);\n const checkedItems = useNestedCheckedItems(props);\n const navigation = useTreeNavigation();\n return Object.assign(useRootTree({\n ...props,\n openItems,\n checkedItems,\n onOpenChange: useEventCallback((event, data)=>{\n var _props_onOpenChange;\n const nextOpenItems = createNextOpenItems(data, openItems);\n (_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 ? void 0 : _props_onOpenChange.call(props, event, {\n ...data,\n openItems: nextOpenItems.dangerouslyGetInternalSet_unstable()\n });\n setOpenItems(nextOpenItems);\n }),\n onNavigation: useEventCallback((event, data)=>{\n var _props_onNavigation;\n (_props_onNavigation = props.onNavigation) === null || _props_onNavigation === void 0 ? void 0 : _props_onNavigation.call(props, event, data);\n if (!event.isDefaultPrevented()) {\n navigation.navigate(data, {\n preventScroll: data.isScrollPrevented()\n });\n }\n }),\n onCheckedChange: useEventCallback((event, data)=>{\n var _props_onCheckedChange;\n const nextCheckedItems = createNextNestedCheckedItems(data, checkedItems);\n (_props_onCheckedChange = props.onCheckedChange) === null || _props_onCheckedChange === void 0 ? void 0 : _props_onCheckedChange.call(props, event, {\n ...data,\n checkedItems: nextCheckedItems.dangerouslyGetInternalMap_unstable()\n });\n })\n }, useMergedRefs(ref, navigation.treeRef)), {\n treeType: 'nested'\n });\n}\nfunction useNestedSubtree(props, ref) {\n 'use no memo';\n if (process.env.NODE_ENV === 'development') {\n // this doesn't break rule of hooks, as environment is a static value\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const treeType = useTreeContext_unstable((ctx)=>ctx.treeType);\n if (treeType === 'flat') {\n throw new Error(`@fluentui/react-tree [useTree]:\nSubtrees are not allowed in a FlatTree!\nYou cannot use a <Tree> component inside of a <FlatTree> component!`);\n }\n }\n return useSubtree(props, ref);\n}\n"],"names":["useTree_unstable","props","ref","isRoot","React","useContext","SubtreeContext","undefined","useNestedRootTree","useNestedSubtree","openItems","setOpenItems","useControllableOpenItems","checkedItems","useNestedCheckedItems","navigation","useTreeNavigation","Object","assign","useRootTree","onOpenChange","useEventCallback","event","data","_props_onOpenChange","nextOpenItems","createNextOpenItems","call","dangerouslyGetInternalSet_unstable","onNavigation","_props_onNavigation","isDefaultPrevented","navigate","preventScroll","isScrollPrevented","onCheckedChange","_props_onCheckedChange","nextCheckedItems","createNextNestedCheckedItems","dangerouslyGetInternalMap_unstable","useMergedRefs","treeRef","treeType","process","env","NODE_ENV","useTreeContext_unstable","ctx","Error","useSubtree"],"mappings":";;;;+BASaA;;;eAAAA;;;;iEATU;gCACyB;0CACc;mDACM;gCACrC;6BACH;4BACD;mCACO;6BACM;AACjC,MAAMA,mBAAmB,CAACC,OAAOC;IACpC;IACA,MAAMC,SAASC,OAAMC,UAAU,CAACC,8BAAc,MAAMC;IACpD,uDAAuD;IACvD,sEAAsE;IACtE,sDAAsD;IACtD,OAAOJ,SAASK,kBAAkBP,OAAOC,OAAOO,iBAAiBR,OAAOC;AAC5E;AACA,SAASM,kBAAkBP,KAAK,EAAEC,GAAG;IACjC;IACA,MAAM,CAACQ,WAAWC,aAAa,GAAGC,IAAAA,kDAAwB,EAACX;IAC3D,MAAMY,eAAeC,IAAAA,wDAAqB,EAACb;IAC3C,MAAMc,aAAaC,IAAAA,oCAAiB;IACpC,OAAOC,OAAOC,MAAM,CAACC,IAAAA,wBAAW,EAAC;QAC7B,GAAGlB,KAAK;QACRS;QACAG;QACAO,cAAcC,IAAAA,gCAAgB,EAAC,CAACC,OAAOC;YACnC,IAAIC;YACJ,MAAMC,gBAAgBC,IAAAA,6CAAmB,EAACH,MAAMb;YAC/Cc,CAAAA,sBAAsBvB,MAAMmB,YAAY,AAAD,MAAO,QAAQI,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBG,IAAI,CAAC1B,OAAOqB,OAAO;gBACpI,GAAGC,IAAI;gBACPb,WAAWe,cAAcG,kCAAkC;YAC/D;YACAjB,aAAac;QACjB;QACAI,cAAcR,IAAAA,gCAAgB,EAAC,CAACC,OAAOC;YACnC,IAAIO;YACHA,CAAAA,sBAAsB7B,MAAM4B,YAAY,AAAD,MAAO,QAAQC,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBH,IAAI,CAAC1B,OAAOqB,OAAOC;YACxI,IAAI,CAACD,MAAMS,kBAAkB,IAAI;gBAC7BhB,WAAWiB,QAAQ,CAACT,MAAM;oBACtBU,eAAeV,KAAKW,iBAAiB;gBACzC;YACJ;QACJ;QACAC,iBAAiBd,IAAAA,gCAAgB,EAAC,CAACC,OAAOC;YACtC,IAAIa;YACJ,MAAMC,mBAAmBC,IAAAA,+DAA4B,EAACf,MAAMV;YAC3DuB,CAAAA,yBAAyBnC,MAAMkC,eAAe,AAAD,MAAO,QAAQC,2BAA2B,KAAK,IAAI,KAAK,IAAIA,uBAAuBT,IAAI,CAAC1B,OAAOqB,OAAO;gBAChJ,GAAGC,IAAI;gBACPV,cAAcwB,iBAAiBE,kCAAkC;YACrE;QACJ;IACJ,GAAGC,IAAAA,6BAAa,EAACtC,KAAKa,WAAW0B,OAAO,IAAI;QACxCC,UAAU;IACd;AACJ;AACA,SAASjC,iBAAiBR,KAAK,EAAEC,GAAG;IAChC;IACA,IAAIyC,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QACxC,qEAAqE;QACrE,sDAAsD;QACtD,MAAMH,WAAWI,IAAAA,oCAAuB,EAAC,CAACC,MAAMA,IAAIL,QAAQ;QAC5D,IAAIA,aAAa,QAAQ;YACrB,MAAM,IAAIM,MAAM,CAAC;;mEAEsC,CAAC;QAC5D;IACJ;IACA,OAAOC,IAAAA,sBAAU,EAAChD,OAAOC;AAC7B"}
1
+ {"version":3,"sources":["useTree.ts"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport type { TreeProps, TreeState } from './Tree.types';\nimport { createNextOpenItems, useControllableOpenItems } from '../../hooks/useControllableOpenItems';\nimport { createNextNestedCheckedItems, useNestedCheckedItems } from './useNestedControllableCheckedItems';\nimport { SubtreeContext } from '../../contexts/subtreeContext';\nimport { useRootTree } from '../../hooks/useRootTree';\nimport { useSubtree } from '../../hooks/useSubtree';\nimport { useTreeNavigation } from '../../hooks/useTreeNavigation';\nimport { useTreeContext_unstable } from '../../contexts/treeContext';\n\nexport const useTree_unstable = (props: TreeProps, ref: React.Ref<HTMLElement>): TreeState => {\n 'use no memo';\n\n const isRoot = React.useContext(SubtreeContext) === undefined;\n // as level is static, this doesn't break rule of hooks\n // and if this becomes an issue later on, this can be easily converted\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return isRoot ? useNestedRootTree(props, ref) : useNestedSubtree(props, ref);\n};\n\nfunction useNestedRootTree(props: TreeProps, ref: React.Ref<HTMLElement>): TreeState {\n 'use no memo';\n\n const [openItems, setOpenItems] = useControllableOpenItems(props);\n const checkedItems = useNestedCheckedItems(props);\n const navigation = useTreeNavigation();\n\n return Object.assign(\n useRootTree(\n {\n ...props,\n openItems,\n checkedItems,\n onOpenChange: useEventCallback((event, data) => {\n const nextOpenItems = createNextOpenItems(data, openItems);\n props.onOpenChange?.(event, {\n ...data,\n openItems: nextOpenItems.dangerouslyGetInternalSet_unstable(),\n });\n setOpenItems(nextOpenItems);\n }),\n onNavigation: useEventCallback((event, data) => {\n props.onNavigation?.(event, data);\n if (!event.isDefaultPrevented()) {\n navigation.navigate(data, {\n preventScroll: data.isScrollPrevented(),\n });\n }\n }),\n onCheckedChange: useEventCallback((event, data) => {\n const nextCheckedItems = createNextNestedCheckedItems(data, checkedItems);\n props.onCheckedChange?.(event, {\n ...data,\n checkedItems: nextCheckedItems.dangerouslyGetInternalMap_unstable(),\n });\n }),\n },\n useMergedRefs(ref, navigation.treeRef),\n ),\n { treeType: 'nested' } as const,\n );\n}\n\nfunction useNestedSubtree(props: TreeProps, ref: React.Ref<HTMLElement>): TreeState {\n 'use no memo';\n\n if (process.env.NODE_ENV === 'development') {\n // this doesn't break rule of hooks, as environment is a static value\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const treeType = useTreeContext_unstable(ctx => ctx.treeType);\n if (treeType === 'flat') {\n throw new Error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [useTree]:\n Subtrees are not allowed in a FlatTree!\n You cannot use a <Tree> component inside of a <FlatTree> component!\n `);\n }\n }\n return useSubtree(props, ref);\n}\n"],"names":["useTree_unstable","props","ref","isRoot","React","useContext","SubtreeContext","undefined","useNestedRootTree","useNestedSubtree","openItems","setOpenItems","useControllableOpenItems","checkedItems","useNestedCheckedItems","navigation","useTreeNavigation","Object","assign","useRootTree","onOpenChange","useEventCallback","event","data","nextOpenItems","createNextOpenItems","dangerouslyGetInternalSet_unstable","onNavigation","isDefaultPrevented","navigate","preventScroll","isScrollPrevented","onCheckedChange","nextCheckedItems","createNextNestedCheckedItems","dangerouslyGetInternalMap_unstable","useMergedRefs","treeRef","treeType","process","env","NODE_ENV","useTreeContext_unstable","ctx","Error","useSubtree"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAWaA;;;eAAAA;;;;iEAXU;gCACyB;0CAEc;mDACM;gCACrC;6BACH;4BACD;mCACO;6BACM;AAEjC,MAAMA,mBAAmB,CAACC,OAAkBC;IACjD;IAEA,MAAMC,SAASC,OAAMC,UAAU,CAACC,8BAAAA,MAAoBC;IACpD,uDAAuD;IACvD,sEAAsE;IACtE,sDAAsD;IACtD,OAAOJ,SAASK,kBAAkBP,OAAOC,OAAOO,iBAAiBR,OAAOC;AAC1E;AAEA,SAASM,kBAAkBP,KAAgB,EAAEC,GAA2B;IACtE;IAEA,MAAM,CAACQ,WAAWC,aAAa,GAAGC,IAAAA,kDAAAA,EAAyBX;IAC3D,MAAMY,eAAeC,IAAAA,wDAAAA,EAAsBb;IAC3C,MAAMc,aAAaC,IAAAA,oCAAAA;IAEnB,OAAOC,OAAOC,MAAM,CAClBC,IAAAA,wBAAAA,EACE;QACE,GAAGlB,KAAK;QACRS;QACAG;QACAO,cAAcC,IAAAA,gCAAAA,EAAiB,CAACC,OAAOC;gBAErCtB;YADA,MAAMuB,gBAAgBC,IAAAA,6CAAAA,EAAoBF,MAAMb;YAChDT,CAAAA,sBAAAA,MAAMmB,YAAY,AAAZA,MAAY,QAAlBnB,wBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,oBAAAA,IAAAA,CAAAA,OAAqBqB,OAAO;gBAC1B,GAAGC,IAAI;gBACPb,WAAWc,cAAcE,kCAAkC;YAC7D;YACAf,aAAaa;QACf;QACAG,cAAcN,IAAAA,gCAAAA,EAAiB,CAACC,OAAOC;gBACrCtB;YAAAA,CAAAA,sBAAAA,MAAM0B,YAAY,AAAZA,MAAY,QAAlB1B,wBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,oBAAAA,IAAAA,CAAAA,OAAqBqB,OAAOC;YAC5B,IAAI,CAACD,MAAMM,kBAAkB,IAAI;gBAC/Bb,WAAWc,QAAQ,CAACN,MAAM;oBACxBO,eAAeP,KAAKQ,iBAAiB;gBACvC;YACF;QACF;QACAC,iBAAiBX,IAAAA,gCAAAA,EAAiB,CAACC,OAAOC;gBAExCtB;YADA,MAAMgC,mBAAmBC,IAAAA,+DAAAA,EAA6BX,MAAMV;YAC5DZ,CAAAA,yBAAAA,MAAM+B,eAAe,AAAfA,MAAe,QAArB/B,2BAAAA,KAAAA,IAAAA,KAAAA,IAAAA,uBAAAA,IAAAA,CAAAA,OAAwBqB,OAAO;gBAC7B,GAAGC,IAAI;gBACPV,cAAcoB,iBAAiBE,kCAAkC;YACnE;QACF;IACF,GACAC,IAAAA,6BAAAA,EAAclC,KAAKa,WAAWsB,OAAO,IAEvC;QAAEC,UAAU;IAAS;AAEzB;AAEA,SAAS7B,iBAAiBR,KAAgB,EAAEC,GAA2B;IACrE;IAEA,IAAIqC,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1C,qEAAqE;QACrE,sDAAsD;QACtD,MAAMH,WAAWI,IAAAA,oCAAAA,EAAwBC,CAAAA,MAAOA,IAAIL,QAAQ;QAC5D,IAAIA,aAAa,QAAQ;YACvB,MAAM,IAAIM,MAA2B,CAAC;;mEAItC,CAAC;QACH;IACF;IACA,OAAOC,IAAAA,sBAAAA,EAAW5C,OAAOC;AAC3B"}
@@ -1 +1 @@
1
- {"version":3,"sources":["useTreeContextValues.js"],"sourcesContent":["import * as React from 'react';\nexport function useTreeContextValues_unstable(state) {\n 'use no memo';\n if (state.contextType === 'root') {\n const { openItems, level, contextType, treeType, checkedItems, selectionMode, appearance, size, requestTreeResponse } = state;\n /**\n * This context is created with \"@fluentui/react-context-selector\",\n * there is no sense to memoize it\n */ const tree = {\n treeType,\n size,\n openItems,\n appearance,\n checkedItems,\n selectionMode,\n contextType,\n level,\n requestTreeResponse\n };\n return {\n tree\n };\n }\n return {\n // contextType is statically determined by the context\n // eslint-disable-next-line react-hooks/rules-of-hooks\n tree: React.useMemo(()=>({\n level: state.level,\n contextType: 'subtree'\n }), [\n state.level\n ])\n };\n}\n"],"names":["useTreeContextValues_unstable","state","contextType","openItems","level","treeType","checkedItems","selectionMode","appearance","size","requestTreeResponse","tree","React","useMemo"],"mappings":";;;;+BACgBA;;;eAAAA;;;;iEADO;AAChB,SAASA,8BAA8BC,KAAK;IAC/C;IACA,IAAIA,MAAMC,WAAW,KAAK,QAAQ;QAC9B,MAAM,EAAEC,SAAS,EAAEC,KAAK,EAAEF,WAAW,EAAEG,QAAQ,EAAEC,YAAY,EAAEC,aAAa,EAAEC,UAAU,EAAEC,IAAI,EAAEC,mBAAmB,EAAE,GAAGT;QACxH;;;KAGH,GAAG,MAAMU,OAAO;YACTN;YACAI;YACAN;YACAK;YACAF;YACAC;YACAL;YACAE;YACAM;QACJ;QACA,OAAO;YACHC;QACJ;IACJ;IACA,OAAO;QACH,sDAAsD;QACtD,sDAAsD;QACtDA,MAAMC,OAAMC,OAAO,CAAC,IAAK,CAAA;gBACjBT,OAAOH,MAAMG,KAAK;gBAClBF,aAAa;YACjB,CAAA,GAAI;YACJD,MAAMG,KAAK;SACd;IACL;AACJ"}
1
+ {"version":3,"sources":["useTreeContextValues.ts"],"sourcesContent":["import * as React from 'react';\nimport { TreeContextValue } from '../../contexts';\nimport { TreeContextValues, TreeState } from './Tree.types';\n\nexport function useTreeContextValues_unstable(state: TreeState): TreeContextValues {\n 'use no memo';\n\n if (state.contextType === 'root') {\n const {\n openItems,\n level,\n contextType,\n treeType,\n checkedItems,\n selectionMode,\n appearance,\n size,\n requestTreeResponse,\n } = state;\n /**\n * This context is created with \"@fluentui/react-context-selector\",\n * there is no sense to memoize it\n */\n const tree: TreeContextValue = {\n treeType,\n size,\n openItems,\n appearance,\n checkedItems,\n selectionMode,\n contextType,\n level,\n requestTreeResponse,\n };\n\n return { tree };\n }\n return {\n // contextType is statically determined by the context\n // eslint-disable-next-line react-hooks/rules-of-hooks\n tree: React.useMemo(() => ({ level: state.level, contextType: 'subtree' }), [state.level]),\n };\n}\n"],"names":["useTreeContextValues_unstable","state","contextType","openItems","level","treeType","checkedItems","selectionMode","appearance","size","requestTreeResponse","tree","React","useMemo"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAIgBA;;;eAAAA;;;;iEAJO;AAIhB,SAASA,8BAA8BC,KAAgB;IAC5D;IAEA,IAAIA,MAAMC,WAAW,KAAK,QAAQ;QAChC,MAAM,EACJC,SAAS,EACTC,KAAK,EACLF,WAAW,EACXG,QAAQ,EACRC,YAAY,EACZC,aAAa,EACbC,UAAU,EACVC,IAAI,EACJC,mBAAmB,EACpB,GAAGT;QACJ;;;KAGC,GACD,MAAMU,OAAyB;YAC7BN;YACAI;YACAN;YACAK;YACAF;YACAC;YACAL;YACAE;YACAM;QACF;QAEA,OAAO;YAAEC;QAAK;IAChB;IACA,OAAO;QACL,sDAAsD;QACtD,sDAAsD;QACtDA,MAAMC,OAAMC,OAAO,CAAC,IAAO,CAAA;gBAAET,OAAOH,MAAMG,KAAK;gBAAEF,aAAa;YAAU,CAAA,GAAI;YAACD,MAAMG,KAAK;SAAC;IAC3F;AACF"}
@@ -1 +1 @@
1
- {"version":3,"sources":["useTreeStyles.styles.js"],"sourcesContent":["import { __resetStyles, __styles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const treeClassNames = {\n root: 'fui-Tree'\n};\nconst useBaseStyles = /*#__PURE__*/__resetStyles(\"rnv2ez3\", null, [\".rnv2ez3{display:flex;flex-direction:column;row-gap:var(--spacingVerticalXXS);}\"]);\nconst useStyles = /*#__PURE__*/__styles({\n subtree: {\n z8tnut: \"fclwglc\"\n }\n}, {\n d: [\".fclwglc{padding-top:var(--spacingVerticalXXS);}\"]\n});\nexport const useTreeStyles_unstable = state => {\n 'use no memo';\n\n const baseStyles = useBaseStyles();\n const styles = useStyles();\n const isSubTree = state.level > 1;\n state.root.className = mergeClasses(treeClassNames.root, baseStyles, isSubTree && styles.subtree, state.root.className);\n return state;\n};\n//# sourceMappingURL=useTreeStyles.styles.js.map"],"names":["treeClassNames","useTreeStyles_unstable","root","useBaseStyles","__resetStyles","useStyles","__styles","subtree","z8tnut","d","state","baseStyles","styles","isSubTree","level","className","mergeClasses"],"mappings":";;;;;;;;;;;IAEaA,cAAc;eAAdA;;IAWAC,sBAAsB;eAAtBA;;;uBAbyC;AAE/C,MAAMD,iBAAiB;IAC5BE,MAAM;AACR;AACA,MAAMC,gBAAgB,WAAW,GAAEC,IAAAA,oBAAa,EAAC,WAAW,MAAM;IAAC;CAAkF;AACrJ,MAAMC,YAAY,WAAW,GAAEC,IAAAA,eAAQ,EAAC;IACtCC,SAAS;QACPC,QAAQ;IACV;AACF,GAAG;IACDC,GAAG;QAAC;KAAmD;AACzD;AACO,MAAMR,yBAAyBS,CAAAA;IACpC;IAEA,MAAMC,aAAaR;IACnB,MAAMS,SAASP;IACf,MAAMQ,YAAYH,MAAMI,KAAK,GAAG;IAChCJ,MAAMR,IAAI,CAACa,SAAS,GAAGC,IAAAA,mBAAY,EAAChB,eAAeE,IAAI,EAAES,YAAYE,aAAaD,OAAOL,OAAO,EAAEG,MAAMR,IAAI,CAACa,SAAS;IACtH,OAAOL;AACT,GACA,gDAAgD"}
1
+ {"version":3,"sources":["useTreeStyles.styles.js"],"sourcesContent":["import { 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 'use no memo';\n const baseStyles = useBaseStyles();\n const styles = useStyles();\n const isSubTree = state.level > 1;\n state.root.className = mergeClasses(treeClassNames.root, baseStyles, isSubTree && styles.subtree, state.root.className);\n return state;\n};\n"],"names":["treeClassNames","useTreeStyles_unstable","root","useBaseStyles","__resetStyles","useStyles","__styles","subtree","z8tnut","d","state","baseStyles","styles","isSubTree","level","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAEaA,cAAc;eAAdA;;IAaAC,sBAAsB;eAAtBA;;;uBAf6C;AAEnD,MAAMD,iBAAiB;IAC1BE,MAAM;AACV;AACA,MAAMC,gBAAa,WAAA,GAAGC,IAAAA,oBAAA,EAAA,WAAA,MAAA;IAAA;CAIrB;AACD,MAAMC,YAAS,WAAA,GAAGC,IAAAA,eAAA,EAAA;IAAAC,SAAA;QAAAC,QAAA;IAAA;AAAA,GAAA;IAAAC,GAAA;QAAA;KAAA;AAAA;AAKX,MAAMR,yBAA0BS,CAAAA;IACnC;IACA,MAAMC,aAAaR;IACnB,MAAMS,SAASP;IACf,MAAMQ,YAAYH,MAAMI,KAAK,GAAG;IAChCJ,MAAMR,IAAI,CAACa,SAAS,GAAGC,IAAAA,mBAAY,EAAChB,eAAeE,IAAI,EAAES,YAAYE,aAAaD,OAAOL,OAAO,EAAEG,MAAMR,IAAI,CAACa,SAAS;IACtH,OAAOL;AACX"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TreeItem.js"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItem_unstable } from './useTreeItem';\nimport { renderTreeItem_unstable } from './renderTreeItem';\nimport { useTreeItemStyles_unstable } from './useTreeItemStyles.styles';\nimport { useTreeItemContextValues_unstable } from './useTreeItemContextValues';\n/**\n * The `TreeItem` component represents a single item in a tree.\n * It expects a certain order of children to work properly: the first child should be the node itself,\n * and the second child should be a nested subtree in the form of another Tree component or a standalone TreeItem.\n * This order follows the same order as document traversal for the TreeWalker API in JavaScript:\n * https://developer.mozilla.org/en-US/docs/Web/API/TreeWalker.\n * The content and layout of a TreeItem can be defined using the TreeItemLayout or TreeItemPersonaLayout component,\n * which should be used as a direct child of TreeItem.\n *\n * When a TreeItem has nested child subtree, an expand/collapse control is displayed,\n * allowing the user to show or hide the children.\n */ export const TreeItem = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n const state = useTreeItem_unstable(props, ref);\n useTreeItemStyles_unstable(state);\n const contextValues = useTreeItemContextValues_unstable(state);\n return renderTreeItem_unstable(state, contextValues);\n});\nTreeItem.displayName = 'TreeItem';\n"],"names":["TreeItem","React","forwardRef","props","ref","state","useTreeItem_unstable","useTreeItemStyles_unstable","contextValues","useTreeItemContextValues_unstable","renderTreeItem_unstable","displayName"],"mappings":";;;;+BAgBiBA;;;eAAAA;;;;iEAhBM;6BACc;gCACG;yCACG;0CACO;AAYvC,MAAMA,WAAW,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC/D,MAAMC,QAAQC,IAAAA,iCAAoB,EAACH,OAAOC;IAC1CG,IAAAA,mDAA0B,EAACF;IAC3B,MAAMG,gBAAgBC,IAAAA,2DAAiC,EAACJ;IACxD,OAAOK,IAAAA,uCAAuB,EAACL,OAAOG;AAC1C;AACAR,SAASW,WAAW,GAAG"}
1
+ {"version":3,"sources":["TreeItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItem_unstable } from './useTreeItem';\nimport { renderTreeItem_unstable } from './renderTreeItem';\nimport { useTreeItemStyles_unstable } from './useTreeItemStyles.styles';\nimport type { TreeItemProps } from './TreeItem.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTreeItemContextValues_unstable } from './useTreeItemContextValues';\n\n/**\n * The `TreeItem` component represents a single item in a tree.\n * It expects a certain order of children to work properly: the first child should be the node itself,\n * and the second child should be a nested subtree in the form of another Tree component or a standalone TreeItem.\n * This order follows the same order as document traversal for the TreeWalker API in JavaScript:\n * https://developer.mozilla.org/en-US/docs/Web/API/TreeWalker.\n * The content and layout of a TreeItem can be defined using the TreeItemLayout or TreeItemPersonaLayout component,\n * which should be used as a direct child of TreeItem.\n *\n * When a TreeItem has nested child subtree, an expand/collapse control is displayed,\n * allowing the user to show or hide the children.\n */\nexport const TreeItem: ForwardRefComponent<TreeItemProps> = React.forwardRef((props, ref) => {\n const state = useTreeItem_unstable(props, ref);\n\n useTreeItemStyles_unstable(state);\n const contextValues = useTreeItemContextValues_unstable(state);\n return renderTreeItem_unstable(state, contextValues);\n});\n\nTreeItem.displayName = 'TreeItem';\n"],"names":["TreeItem","React","forwardRef","props","ref","state","useTreeItem_unstable","useTreeItemStyles_unstable","contextValues","useTreeItemContextValues_unstable","renderTreeItem_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAoBaA;;;eAAAA;;;;iEApBU;6BACc;gCACG;yCACG;0CAGO;AAc3C,MAAMA,WAAAA,WAAAA,GAA+CC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACnF,MAAMC,QAAQC,IAAAA,iCAAAA,EAAqBH,OAAOC;IAE1CG,IAAAA,mDAAAA,EAA2BF;IAC3B,MAAMG,gBAAgBC,IAAAA,2DAAAA,EAAkCJ;IACxD,OAAOK,IAAAA,uCAAAA,EAAwBL,OAAOG;AACxC;AAEAR,SAASW,WAAW,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TreeItem.types.js"],"sourcesContent":["import * as React from 'react';\n"],"names":[],"mappings":";;;;;iEAAuB"}
1
+ {"version":3,"sources":["TreeItem.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ArrowLeft, ArrowRight, Enter } from '@fluentui/keyboard-keys';\nimport type { ComponentProps, ComponentState, ExtractSlotProps, Slot } from '@fluentui/react-utilities';\nimport type { TreeItemContextValue } from '../../contexts';\nimport type { treeItemLevelToken } from '../../utils/tokens';\n\nexport type TreeItemCSSProperties = React.CSSProperties & { [treeItemLevelToken]?: string | number };\n\nexport type TreeItemType = 'leaf' | 'branch';\n\nexport type TreeItemSlots = {\n root: Slot<ExtractSlotProps<Slot<'div'> & { style?: TreeItemCSSProperties }>>;\n};\n\nexport type TreeItemValue = string | number;\n\nexport type TreeItemContextValues = {\n treeItem: TreeItemContextValue;\n};\n\nexport type TreeItemOpenChangeData = {\n open: boolean;\n value: TreeItemValue;\n target: HTMLElement;\n} & (\n | { event: React.MouseEvent<HTMLElement>; type: 'ExpandIconClick' }\n | { event: React.MouseEvent<HTMLElement>; type: 'Click' }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof Enter }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowRight }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowLeft }\n);\n\nexport type TreeItemOpenChangeEvent = TreeItemOpenChangeData['event'];\n\n/**\n * TreeItem Props\n */\nexport type TreeItemProps = ComponentProps<Partial<TreeItemSlots>> & {\n /**\n * A tree item can be a leaf or a branch\n */\n itemType: TreeItemType;\n /**\n * A tree item should have a well defined value, in case one is not provided by the user by this prop\n * one will be inferred internally.\n */\n value?: TreeItemValue;\n /**\n * Whether the tree item is in an open state\n *\n * This overrides the open value provided by the root tree,\n * and ensure control of the visibility of the tree item per tree item.\n *\n * NOTE: controlling the open state of a tree item will not affect the open state of its children\n */\n open?: boolean;\n // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n onOpenChange?: (e: TreeItemOpenChangeEvent, data: TreeItemOpenChangeData) => void;\n /**\n * This property is inferred through context on a nested tree, and required for a flat tree.\n */\n parentValue?: TreeItemValue;\n};\n\n/**\n * State used in rendering TreeItem\n */\nexport type TreeItemState = ComponentState<TreeItemSlots> &\n TreeItemContextValue & {\n level: number;\n itemType: TreeItemType;\n };\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;iEAAuB"}
@@ -1 +1 @@
1
- {"version":3,"sources":["index.js"],"sourcesContent":["export * from './TreeItem';\nexport * from './TreeItem.types';\nexport * from './renderTreeItem';\nexport * from './useTreeItem';\nexport * from './useTreeItemStyles.styles';\nexport * from './useTreeItemContextValues';\n"],"names":[],"mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA;uBACA"}
1
+ {"version":3,"sources":["index.ts"],"sourcesContent":["export * from './TreeItem';\nexport * from './TreeItem.types';\nexport * from './renderTreeItem';\nexport * from './useTreeItem';\nexport * from './useTreeItemStyles.styles';\nexport * from './useTreeItemContextValues';\n"],"names":[],"rangeMappings":";;;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA;uBACA"}
@@ -1 +1 @@
1
- {"version":3,"sources":["renderTreeItem.js"],"sourcesContent":[" import { jsx as _jsx } from \"@fluentui/react-jsx-runtime/jsx-runtime\";\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { TreeItemProvider } from '../../contexts';\n/**\n * Render the final JSX of TreeItem\n */ export const renderTreeItem_unstable = (state, contextValues)=>{\n assertSlots(state);\n return /*#__PURE__*/ _jsx(state.root, {\n children: /*#__PURE__*/ _jsx(TreeItemProvider, {\n value: contextValues.treeItem,\n children: state.root.children\n })\n });\n};\n"],"names":["renderTreeItem_unstable","state","contextValues","assertSlots","_jsx","root","children","TreeItemProvider","value","treeItem"],"mappings":";;;;+BAKiBA;;;eAAAA;;;4BALa;gCACF;0BACK;AAGtB,MAAMA,0BAA0B,CAACC,OAAOC;IAC/CC,IAAAA,2BAAW,EAACF;IACZ,OAAO,WAAW,GAAGG,IAAAA,eAAI,EAACH,MAAMI,IAAI,EAAE;QAClCC,UAAU,WAAW,GAAGF,IAAAA,eAAI,EAACG,0BAAgB,EAAE;YAC3CC,OAAON,cAAcO,QAAQ;YAC7BH,UAAUL,MAAMI,IAAI,CAACC,QAAQ;QACjC;IACJ;AACJ"}
1
+ {"version":3,"sources":["renderTreeItem.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { TreeItemState, TreeItemContextValues, TreeItemSlots } from './TreeItem.types';\nimport { TreeItemProvider } from '../../contexts';\n\n/**\n * Render the final JSX of TreeItem\n */\nexport const renderTreeItem_unstable = (state: TreeItemState, contextValues: TreeItemContextValues) => {\n assertSlots<TreeItemSlots>(state);\n\n return (\n <state.root>\n <TreeItemProvider value={contextValues.treeItem}>{state.root.children}</TreeItemProvider>\n </state.root>\n );\n};\n"],"names":["renderTreeItem_unstable","state","contextValues","assertSlots","_jsx","root","TreeItemProvider","value","treeItem","children"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;4BARb;gCAC4B;0BAEK;AAK1B,MAAMA,0BAA0B,CAACC,OAAsBC;IAC5DC,IAAAA,2BAAAA,EAA2BF;IAE3B,OAAA,WAAA,GACEG,IAAAA,eAAA,EAACH,MAAMI,IAAI,EAAA;kBACT,WAAA,GAAAD,IAAAA,eAAA,EAACE,0BAAAA,EAAAA;YAAiBC,OAAOL,cAAcM,QAAQ;sBAAGP,MAAMI,IAAI,CAACI,QAAQ;;;AAG3E"}
@@ -1 +1 @@
1
- {"version":3,"sources":["useTreeItem.js"],"sourcesContent":["import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { getIntrinsicElementProps, useId, useEventCallback, slot, elementContains, useMergedRefs } from '@fluentui/react-utilities';\nimport { Space } from '@fluentui/keyboard-keys';\nimport { treeDataTypes } from '../../utils/tokens';\nimport { useTreeContext_unstable, useSubtreeContext_unstable, useTreeItemContext_unstable, TreeContext } from '../../contexts';\nimport { dataTreeItemValueAttrName } from '../../utils/getTreeItemValueFromElement';\nimport { useHasParentContext } from '@fluentui/react-context-selector';\nimport { treeClassNames } from '../../Tree';\n/**\n * Create the state required to render TreeItem.\n *\n * The returned state can be modified with hooks such as useTreeItemStyles_unstable,\n * before being passed to renderTreeItem_unstable.\n *\n * @param props - props from this instance of TreeItem\n * @param ref - reference to root HTMLElement of TreeItem\n */ export function useTreeItem_unstable(props, ref) {\n 'use no memo';\n const treeType = useTreeContext_unstable((ctx)=>ctx.treeType);\n if (treeType === 'flat') {\n warnIfNoProperPropsFlatTreeItem(props);\n }\n const requestTreeResponse = useTreeContext_unstable((ctx)=>ctx.requestTreeResponse);\n const { level: contextLevel } = useSubtreeContext_unstable();\n const parentValue = useTreeItemContext_unstable((ctx)=>{\n var _props_parentValue;\n return (_props_parentValue = props.parentValue) !== null && _props_parentValue !== void 0 ? _props_parentValue : ctx.value;\n });\n // note, if the value is not externally provided,\n // then selection and expansion will not work properly\n const internalValue = useId('fuiTreeItemValue-');\n var _props_value;\n const value = (_props_value = props.value) !== null && _props_value !== void 0 ? _props_value : internalValue;\n const { onClick, onKeyDown, onChange, as = 'div', itemType = 'leaf', 'aria-level': level = contextLevel, 'aria-selected': ariaSelected, 'aria-expanded': ariaExpanded, ...rest } = props;\n const actionsRef = React.useRef(null);\n const expandIconRef = React.useRef(null);\n const layoutRef = React.useRef(null);\n const subtreeRef = React.useRef(null);\n const selectionRef = React.useRef(null);\n const treeItemRef = React.useRef(null);\n if (process.env.NODE_ENV !== 'production') {\n // This is acceptable since the NODE_ENV will not change during runtime\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const hasTreeContext = useHasParentContext(TreeContext);\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(()=>{\n var _treeItemRef_current;\n if (hasTreeContext) {\n return;\n }\n if ((_treeItemRef_current = treeItemRef.current) === null || _treeItemRef_current === void 0 ? void 0 : _treeItemRef_current.querySelector(`.${treeClassNames.root}`)) {\n // eslint-disable-next-line no-console\n console.error(`@fluentui/react-tree [useTreeItem]:\n<TreeItem> should be declared inside a <Tree> component.`);\n }\n }, [\n hasTreeContext\n ]);\n }\n const open = useTreeContext_unstable((ctx)=>{\n var _props_open;\n return (_props_open = props.open) !== null && _props_open !== void 0 ? _props_open : ctx.openItems.has(value);\n });\n const getNextOpen = ()=>itemType === 'branch' ? !open : open;\n const selectionMode = useTreeContext_unstable((ctx)=>ctx.selectionMode);\n const checked = useTreeContext_unstable((ctx)=>{\n var _ctx_checkedItems_get;\n return (_ctx_checkedItems_get = ctx.checkedItems.get(value)) !== null && _ctx_checkedItems_get !== void 0 ? _ctx_checkedItems_get : false;\n });\n const handleClick = useEventCallback((event)=>{\n onClick === null || onClick === void 0 ? void 0 : onClick(event);\n if (event.isDefaultPrevented()) {\n return;\n }\n if (itemType === 'leaf') {\n return;\n }\n const isEventFromActions = actionsRef.current && elementContains(actionsRef.current, event.target);\n if (isEventFromActions) {\n return;\n }\n const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target);\n if (isEventFromSubtree) {\n return;\n }\n const isEventFromSelection = selectionRef.current && elementContains(selectionRef.current, event.target);\n if (isEventFromSelection) {\n return;\n }\n const isEventFromExpandIcon = expandIconRef.current && elementContains(expandIconRef.current, event.target);\n ReactDOM.unstable_batchedUpdates(()=>{\n var _props_onOpenChange;\n const data = {\n event,\n value,\n open: getNextOpen(),\n target: event.currentTarget,\n type: isEventFromExpandIcon ? treeDataTypes.ExpandIconClick : treeDataTypes.Click\n };\n (_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 ? void 0 : _props_onOpenChange.call(props, event, data);\n requestTreeResponse({\n ...data,\n itemType,\n requestType: 'open'\n });\n requestTreeResponse({\n ...data,\n itemType,\n parentValue,\n requestType: 'navigate',\n type: treeDataTypes.Click\n });\n });\n });\n const handleKeyDown = useEventCallback((event)=>{\n onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);\n // Ignore keyboard events that do not originate from the current tree item.\n if (event.isDefaultPrevented() || event.currentTarget !== event.target) {\n return;\n }\n switch(event.key){\n case Space:\n if (selectionMode !== 'none') {\n var _selectionRef_current;\n (_selectionRef_current = selectionRef.current) === null || _selectionRef_current === void 0 ? void 0 : _selectionRef_current.click();\n // Prevents the page from scrolling down when the spacebar is pressed\n event.preventDefault();\n }\n return;\n case treeDataTypes.Enter:\n {\n return event.currentTarget.click();\n }\n case treeDataTypes.End:\n case treeDataTypes.Home:\n case treeDataTypes.ArrowUp:\n case treeDataTypes.ArrowDown:\n return requestTreeResponse({\n requestType: 'navigate',\n event,\n value,\n itemType,\n parentValue,\n type: event.key,\n target: event.currentTarget\n });\n case treeDataTypes.ArrowLeft:\n {\n // arrow left with alt key is reserved for history navigation\n if (event.altKey) {\n return;\n }\n // do not navigate to parent if the item is on the top level\n if (level === 1 && !open) {\n return;\n }\n const data = {\n value,\n event,\n open: getNextOpen(),\n type: event.key,\n target: event.currentTarget\n };\n if (open) {\n var _props_onOpenChange;\n (_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 ? void 0 : _props_onOpenChange.call(props, event, data);\n }\n requestTreeResponse({\n ...data,\n itemType,\n parentValue,\n requestType: open ? 'open' : 'navigate'\n });\n return;\n }\n case treeDataTypes.ArrowRight:\n {\n // arrow right with alt key is reserved for history navigation\n if (event.altKey) {\n return;\n }\n // do not navigate or open if the item is a leaf\n if (itemType === 'leaf') {\n return;\n }\n const data = {\n value,\n event,\n open: getNextOpen(),\n type: event.key,\n target: event.currentTarget\n };\n if (!open) {\n var _props_onOpenChange1;\n (_props_onOpenChange1 = props.onOpenChange) === null || _props_onOpenChange1 === void 0 ? void 0 : _props_onOpenChange1.call(props, event, data);\n }\n requestTreeResponse({\n ...data,\n itemType,\n parentValue,\n requestType: open ? 'navigate' : 'open'\n });\n return;\n }\n }\n const isTypeAheadCharacter = event.key.length === 1 && event.key.match(/\\w/) && !event.altKey && !event.ctrlKey && !event.metaKey;\n if (isTypeAheadCharacter) {\n requestTreeResponse({\n requestType: 'navigate',\n event,\n target: event.currentTarget,\n value,\n itemType,\n type: treeDataTypes.TypeAhead,\n parentValue\n });\n }\n });\n const handleChange = useEventCallback((event)=>{\n onChange === null || onChange === void 0 ? void 0 : onChange(event);\n if (event.isDefaultPrevented()) {\n return;\n }\n const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target);\n if (isEventFromSubtree) {\n return;\n }\n requestTreeResponse({\n requestType: 'selection',\n event,\n value,\n itemType,\n type: 'Change',\n target: event.currentTarget,\n checked: checked === 'mixed' ? true : !checked\n });\n });\n return {\n value,\n open,\n checked,\n subtreeRef,\n layoutRef,\n selectionRef,\n expandIconRef,\n treeItemRef,\n actionsRef,\n itemType,\n level,\n components: {\n root: 'div'\n },\n // FIXME: this property is not necessary anymore, but as removing it would be a breaking change, we need to keep it as false\n isAsideVisible: false,\n // FIXME: this property is not necessary anymore, but as removing it would be a breaking change, we need to keep it as false\n isActionsVisible: false,\n root: slot.always(getIntrinsicElementProps(as, {\n tabIndex: -1,\n [dataTreeItemValueAttrName]: value,\n ...rest,\n ref: useMergedRefs(ref, treeItemRef),\n role: 'treeitem',\n 'aria-level': level,\n 'aria-checked': selectionMode === 'multiselect' ? checked : undefined,\n // Casting: when selectionMode is 'single', checked is a boolean\n 'aria-selected': ariaSelected !== undefined ? ariaSelected : selectionMode === 'single' ? !!checked : undefined,\n 'aria-expanded': ariaExpanded !== undefined ? ariaExpanded : itemType === 'branch' ? open : undefined,\n onClick: handleClick,\n onKeyDown: handleKeyDown,\n onChange: handleChange\n }), {\n elementType: 'div'\n })\n };\n}\nfunction warnIfNoProperPropsFlatTreeItem(props) {\n if (process.env.NODE_ENV !== 'production') {\n if (props['aria-posinset'] === undefined || props['aria-setsize'] === undefined || props['aria-level'] === undefined || props.parentValue === undefined && props['aria-level'] !== 1) {\n // eslint-disable-next-line no-console\n console.error(`@fluentui/react-tree [${useTreeItem_unstable.name}]:\nA flat treeitem must have \"aria-posinset\", \"aria-setsize\", \"aria-level\"\nand \"parentValue\" (if \"aria-level\" > 1) to ensure a11y and navigation.\n\n- \"aria-posinset\": the position of this treeitem in the current level of the tree.\n- \"aria-setsize\": the number of siblings in this level of the tree.\n- \"aria-level\": the current level of the treeitem.\n- \"parentValue\": the \"value\" property of the parent item of this item.`);\n }\n }\n}\n"],"names":["useTreeItem_unstable","props","ref","treeType","useTreeContext_unstable","ctx","warnIfNoProperPropsFlatTreeItem","requestTreeResponse","level","contextLevel","useSubtreeContext_unstable","parentValue","useTreeItemContext_unstable","_props_parentValue","value","internalValue","useId","_props_value","onClick","onKeyDown","onChange","as","itemType","ariaSelected","ariaExpanded","rest","actionsRef","React","useRef","expandIconRef","layoutRef","subtreeRef","selectionRef","treeItemRef","process","env","NODE_ENV","hasTreeContext","useHasParentContext","TreeContext","useEffect","_treeItemRef_current","current","querySelector","treeClassNames","root","console","error","open","_props_open","openItems","has","getNextOpen","selectionMode","checked","_ctx_checkedItems_get","checkedItems","get","handleClick","useEventCallback","event","isDefaultPrevented","isEventFromActions","elementContains","target","isEventFromSubtree","isEventFromSelection","isEventFromExpandIcon","ReactDOM","unstable_batchedUpdates","_props_onOpenChange","data","currentTarget","type","treeDataTypes","ExpandIconClick","Click","onOpenChange","call","requestType","handleKeyDown","key","Space","_selectionRef_current","click","preventDefault","Enter","End","Home","ArrowUp","ArrowDown","ArrowLeft","altKey","ArrowRight","_props_onOpenChange1","isTypeAheadCharacter","length","match","ctrlKey","metaKey","TypeAhead","handleChange","components","isAsideVisible","isActionsVisible","slot","always","getIntrinsicElementProps","tabIndex","dataTreeItemValueAttrName","useMergedRefs","role","undefined","elementType","name"],"mappings":"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"}
1
+ {"version":3,"sources":["useTreeItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport {\n getIntrinsicElementProps,\n useId,\n useEventCallback,\n slot,\n elementContains,\n useMergedRefs,\n} from '@fluentui/react-utilities';\nimport type { TreeItemProps, TreeItemState, TreeItemValue } from './TreeItem.types';\nimport { Space } from '@fluentui/keyboard-keys';\nimport { treeDataTypes } from '../../utils/tokens';\nimport {\n useTreeContext_unstable,\n useSubtreeContext_unstable,\n useTreeItemContext_unstable,\n TreeContext,\n} from '../../contexts';\nimport { dataTreeItemValueAttrName } from '../../utils/getTreeItemValueFromElement';\nimport { useHasParentContext } from '@fluentui/react-context-selector';\nimport { treeClassNames } from '../../Tree';\n\n/**\n * Create the state required to render TreeItem.\n *\n * The returned state can be modified with hooks such as useTreeItemStyles_unstable,\n * before being passed to renderTreeItem_unstable.\n *\n * @param props - props from this instance of TreeItem\n * @param ref - reference to root HTMLElement of TreeItem\n */\nexport function useTreeItem_unstable(props: TreeItemProps, ref: React.Ref<HTMLDivElement>): TreeItemState {\n 'use no memo';\n\n const treeType = useTreeContext_unstable(ctx => ctx.treeType);\n if (treeType === 'flat') {\n warnIfNoProperPropsFlatTreeItem(props);\n }\n const requestTreeResponse = useTreeContext_unstable(ctx => ctx.requestTreeResponse);\n const { level: contextLevel } = useSubtreeContext_unstable();\n const parentValue = useTreeItemContext_unstable(ctx => props.parentValue ?? ctx.value);\n\n // note, if the value is not externally provided,\n // then selection and expansion will not work properly\n const internalValue = useId('fuiTreeItemValue-');\n const value: TreeItemValue = props.value ?? internalValue;\n\n const {\n onClick,\n onKeyDown,\n onChange,\n as = 'div',\n itemType = 'leaf',\n 'aria-level': level = contextLevel,\n 'aria-selected': ariaSelected,\n 'aria-expanded': ariaExpanded,\n ...rest\n } = props;\n\n const actionsRef = React.useRef<HTMLDivElement>(null);\n const expandIconRef = React.useRef<HTMLDivElement>(null);\n const layoutRef = React.useRef<HTMLDivElement>(null);\n const subtreeRef = React.useRef<HTMLDivElement>(null);\n const selectionRef = React.useRef<HTMLInputElement>(null);\n const treeItemRef = React.useRef<HTMLDivElement>(null);\n\n if (process.env.NODE_ENV !== 'production') {\n // This is acceptable since the NODE_ENV will not change during runtime\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const hasTreeContext = useHasParentContext(TreeContext);\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(() => {\n if (hasTreeContext) {\n return;\n }\n\n if (treeItemRef.current?.querySelector(`.${treeClassNames.root}`)) {\n // eslint-disable-next-line no-console\n console.error(/** #__DE-INDENT__ */ `\n @fluentui/react-tree [useTreeItem]:\n <TreeItem> should be declared inside a <Tree> component.\n `);\n }\n }, [hasTreeContext]);\n }\n\n const open = useTreeContext_unstable(ctx => props.open ?? ctx.openItems.has(value));\n const getNextOpen = () => (itemType === 'branch' ? !open : open);\n const selectionMode = useTreeContext_unstable(ctx => ctx.selectionMode);\n const checked = useTreeContext_unstable(ctx => ctx.checkedItems.get(value) ?? false);\n\n const handleClick = useEventCallback((event: React.MouseEvent<HTMLDivElement>) => {\n onClick?.(event);\n if (event.isDefaultPrevented()) {\n return;\n }\n if (itemType === 'leaf') {\n return;\n }\n const isEventFromActions = actionsRef.current && elementContains(actionsRef.current, event.target as Node);\n if (isEventFromActions) {\n return;\n }\n const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target as Node);\n if (isEventFromSubtree) {\n return;\n }\n const isEventFromSelection = selectionRef.current && elementContains(selectionRef.current, event.target as Node);\n if (isEventFromSelection) {\n return;\n }\n const isEventFromExpandIcon = expandIconRef.current && elementContains(expandIconRef.current, event.target as Node);\n\n ReactDOM.unstable_batchedUpdates(() => {\n const data = {\n event,\n value,\n open: getNextOpen(),\n target: event.currentTarget,\n type: isEventFromExpandIcon ? treeDataTypes.ExpandIconClick : treeDataTypes.Click,\n } as const;\n props.onOpenChange?.(event, data);\n requestTreeResponse({\n ...data,\n itemType,\n requestType: 'open',\n });\n requestTreeResponse({\n ...data,\n itemType,\n parentValue,\n requestType: 'navigate',\n type: treeDataTypes.Click,\n });\n });\n });\n\n const handleKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLDivElement>) => {\n onKeyDown?.(event);\n // Ignore keyboard events that do not originate from the current tree item.\n if (event.isDefaultPrevented() || event.currentTarget !== event.target) {\n return;\n }\n switch (event.key) {\n case Space:\n if (selectionMode !== 'none') {\n selectionRef.current?.click();\n // Prevents the page from scrolling down when the spacebar is pressed\n event.preventDefault();\n }\n return;\n case treeDataTypes.Enter: {\n return event.currentTarget.click();\n }\n case treeDataTypes.End:\n case treeDataTypes.Home:\n case treeDataTypes.ArrowUp:\n case treeDataTypes.ArrowDown:\n return requestTreeResponse({\n requestType: 'navigate',\n event,\n value,\n itemType,\n parentValue,\n type: event.key,\n target: event.currentTarget,\n });\n case treeDataTypes.ArrowLeft: {\n // arrow left with alt key is reserved for history navigation\n if (event.altKey) {\n return;\n }\n // do not navigate to parent if the item is on the top level\n if (level === 1 && !open) {\n return;\n }\n const data = {\n value,\n event,\n open: getNextOpen(),\n type: event.key,\n target: event.currentTarget,\n } as const;\n if (open) {\n props.onOpenChange?.(event, data);\n }\n requestTreeResponse({\n ...data,\n itemType,\n parentValue,\n requestType: open ? 'open' : 'navigate',\n });\n return;\n }\n case treeDataTypes.ArrowRight: {\n // arrow right with alt key is reserved for history navigation\n if (event.altKey) {\n return;\n }\n // do not navigate or open if the item is a leaf\n if (itemType === 'leaf') {\n return;\n }\n const data = {\n value,\n event,\n open: getNextOpen(),\n type: event.key,\n target: event.currentTarget,\n } as const;\n if (!open) {\n props.onOpenChange?.(event, data);\n }\n requestTreeResponse({\n ...data,\n itemType,\n parentValue,\n requestType: open ? 'navigate' : 'open',\n });\n return;\n }\n }\n const isTypeAheadCharacter =\n event.key.length === 1 && event.key.match(/\\w/) && !event.altKey && !event.ctrlKey && !event.metaKey;\n if (isTypeAheadCharacter) {\n requestTreeResponse({\n requestType: 'navigate',\n event,\n target: event.currentTarget,\n value,\n itemType,\n type: treeDataTypes.TypeAhead,\n parentValue,\n });\n }\n });\n\n const handleChange = useEventCallback((event: React.ChangeEvent<HTMLInputElement>) => {\n onChange?.(event);\n if (event.isDefaultPrevented()) {\n return;\n }\n const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target as Node);\n if (isEventFromSubtree) {\n return;\n }\n requestTreeResponse({\n requestType: 'selection',\n event,\n value,\n itemType,\n type: 'Change',\n target: event.currentTarget,\n checked: checked === 'mixed' ? true : !checked,\n });\n });\n\n return {\n value,\n open,\n checked,\n subtreeRef,\n layoutRef,\n selectionRef,\n expandIconRef,\n treeItemRef,\n actionsRef,\n itemType,\n level,\n components: {\n root: 'div',\n },\n // FIXME: this property is not necessary anymore, but as removing it would be a breaking change, we need to keep it as false\n isAsideVisible: false,\n // FIXME: this property is not necessary anymore, but as removing it would be a breaking change, we need to keep it as false\n isActionsVisible: false,\n root: slot.always(\n getIntrinsicElementProps(as, {\n tabIndex: -1,\n [dataTreeItemValueAttrName]: value,\n ...rest,\n ref: useMergedRefs(ref, treeItemRef),\n role: 'treeitem',\n 'aria-level': level,\n 'aria-checked': selectionMode === 'multiselect' ? checked : undefined,\n // Casting: when selectionMode is 'single', checked is a boolean\n 'aria-selected': ariaSelected !== undefined ? ariaSelected : selectionMode === 'single' ? !!checked : undefined,\n 'aria-expanded': ariaExpanded !== undefined ? ariaExpanded : itemType === 'branch' ? open : undefined,\n onClick: handleClick,\n onKeyDown: handleKeyDown,\n onChange: handleChange,\n } as const),\n { elementType: 'div' },\n ),\n };\n}\n\nfunction warnIfNoProperPropsFlatTreeItem(\n props: Pick<TreeItemProps, 'aria-setsize' | 'aria-posinset' | 'aria-level' | 'parentValue'>,\n) {\n if (process.env.NODE_ENV !== 'production') {\n if (\n props['aria-posinset'] === undefined ||\n props['aria-setsize'] === undefined ||\n props['aria-level'] === undefined ||\n (props.parentValue === undefined && props['aria-level'] !== 1)\n ) {\n // eslint-disable-next-line no-console\n console.error(/** #__DE-INDENT__ */ `\n @fluentui/react-tree [${useTreeItem_unstable.name}]:\n A flat treeitem must have \"aria-posinset\", \"aria-setsize\", \"aria-level\"\n and \"parentValue\" (if \"aria-level\" > 1) to ensure a11y and navigation.\n\n - \"aria-posinset\": the position of this treeitem in the current level of the tree.\n - \"aria-setsize\": the number of siblings in this level of the tree.\n - \"aria-level\": the current level of the treeitem.\n - \"parentValue\": the \"value\" property of the parent item of this item.\n `);\n }\n }\n}\n"],"names":["useTreeItem_unstable","props","ref","treeType","useTreeContext_unstable","ctx","warnIfNoProperPropsFlatTreeItem","requestTreeResponse","level","contextLevel","useSubtreeContext_unstable","parentValue","useTreeItemContext_unstable","value","internalValue","useId","onClick","onKeyDown","onChange","as","itemType","ariaSelected","ariaExpanded","rest","actionsRef","React","useRef","expandIconRef","layoutRef","subtreeRef","selectionRef","treeItemRef","process","env","NODE_ENV","hasTreeContext","useHasParentContext","TreeContext","useEffect","current","querySelector","treeClassNames","root","console","error","open","openItems","has","getNextOpen","selectionMode","checked","checkedItems","get","handleClick","useEventCallback","event","isDefaultPrevented","isEventFromActions","elementContains","target","isEventFromSubtree","isEventFromSelection","isEventFromExpandIcon","ReactDOM","unstable_batchedUpdates","data","currentTarget","type","treeDataTypes","ExpandIconClick","Click","onOpenChange","requestType","handleKeyDown","key","Space","click","preventDefault","Enter","End","Home","ArrowUp","ArrowDown","ArrowLeft","altKey","ArrowRight","isTypeAheadCharacter","length","match","ctrlKey","metaKey","TypeAhead","handleChange","components","isAsideVisible","isActionsVisible","slot","always","getIntrinsicElementProps","tabIndex","dataTreeItemValueAttrName","useMergedRefs","role","undefined","elementType","name"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"sources":["useTreeItemContextValues.js"],"sourcesContent":["export function useTreeItemContextValues_unstable(state) {\n const { value, itemType, layoutRef, subtreeRef, open, expandIconRef, actionsRef, treeItemRef, // eslint-disable-next-line deprecation/deprecation\n isActionsVisible, // eslint-disable-next-line deprecation/deprecation\n isAsideVisible, selectionRef, checked } = state;\n /**\n * This context is created with \"@fluentui/react-context-selector\",\n * there is no sense to memoize it\n */ const treeItem = {\n value,\n checked,\n itemType,\n layoutRef,\n subtreeRef,\n open,\n selectionRef,\n isActionsVisible,\n isAsideVisible,\n actionsRef,\n treeItemRef,\n expandIconRef\n };\n return {\n treeItem\n };\n}\n"],"names":["useTreeItemContextValues_unstable","state","value","itemType","layoutRef","subtreeRef","open","expandIconRef","actionsRef","treeItemRef","isActionsVisible","isAsideVisible","selectionRef","checked","treeItem"],"mappings":";;;;+BAAgBA;;;eAAAA;;;AAAT,SAASA,kCAAkCC,KAAK;IACnD,MAAM,EAAEC,KAAK,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,UAAU,EAAEC,IAAI,EAAEC,aAAa,EAAEC,UAAU,EAAEC,WAAW,EAC5FC,gBAAgB,EAChBC,cAAc,EAAEC,YAAY,EAAEC,OAAO,EAAE,GAAGZ;IAC1C;;;GAGD,GAAG,MAAMa,WAAW;QACfZ;QACAW;QACAV;QACAC;QACAC;QACAC;QACAM;QACAF;QACAC;QACAH;QACAC;QACAF;IACJ;IACA,OAAO;QACHO;IACJ;AACJ"}
1
+ {"version":3,"sources":["useTreeItemContextValues.ts"],"sourcesContent":["import type { TreeItemContextValues, TreeItemState } from './TreeItem.types';\nimport type { TreeItemContextValue } from '../../contexts';\n\nexport function useTreeItemContextValues_unstable(state: TreeItemState): TreeItemContextValues {\n const {\n value,\n itemType,\n layoutRef,\n subtreeRef,\n open,\n expandIconRef,\n actionsRef,\n treeItemRef,\n // eslint-disable-next-line deprecation/deprecation\n isActionsVisible,\n // eslint-disable-next-line deprecation/deprecation\n isAsideVisible,\n selectionRef,\n checked,\n } = state;\n\n /**\n * This context is created with \"@fluentui/react-context-selector\",\n * there is no sense to memoize it\n */\n const treeItem: TreeItemContextValue = {\n value,\n checked,\n itemType,\n layoutRef,\n subtreeRef,\n open,\n selectionRef,\n isActionsVisible,\n isAsideVisible,\n actionsRef,\n treeItemRef,\n expandIconRef,\n };\n\n return { treeItem };\n}\n"],"names":["useTreeItemContextValues_unstable","state","value","itemType","layoutRef","subtreeRef","open","expandIconRef","actionsRef","treeItemRef","isActionsVisible","isAsideVisible","selectionRef","checked","treeItem"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAGgBA;;;eAAAA;;;AAAT,SAASA,kCAAkCC,KAAoB;IACpE,MAAM,EACJC,KAAK,EACLC,QAAQ,EACRC,SAAS,EACTC,UAAU,EACVC,IAAI,EACJC,aAAa,EACbC,UAAU,EACVC,WAAW,EAEXC,gBAAgB,EAEhBC,cAAc,EACdC,YAAY,EACZC,OAAO,EACR,GAAGZ;IAEJ;;;GAGC,GACD,MAAMa,WAAiC;QACrCZ;QACAW;QACAV;QACAC;QACAC;QACAC;QACAM;QACAF;QACAC;QACAH;QACAC;QACAF;IACF;IAEA,OAAO;QAAEO;IAAS;AACpB"}
@@ -1 +1 @@
1
- {"version":3,"sources":["useTreeItemStyles.styles.js"],"sourcesContent":["import { __resetStyles, __styles, 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 = /*#__PURE__*/__resetStyles(\"r15xhw3a\", \"r2f6k57\", [\".r15xhw3a{position:relative;cursor:pointer;display:flex;flex-direction:column;box-sizing:border-box;background-color:var(--colorSubtleBackground);color:var(--colorNeutralForeground2);padding-right:var(--spacingHorizontalNone);}\", \".r15xhw3a:focus{outline-style:none;}\", \".r15xhw3a:focus-visible{outline-style:none;}\", \".r15xhw3a[data-fui-focus-visible]>.fui-TreeItemLayout,.r15xhw3a[data-fui-focus-visible]>.fui-TreeItemPersonaLayout{border-radius:var(--borderRadiusMedium);outline-color:var(--colorStrokeFocus2);outline-radius:var(--borderRadiusMedium);outline-width:2px;outline-style:solid;}\", \".r2f6k57{position:relative;cursor:pointer;display:flex;flex-direction:column;box-sizing:border-box;background-color:var(--colorSubtleBackground);color:var(--colorNeutralForeground2);padding-left:var(--spacingHorizontalNone);}\", \".r2f6k57:focus{outline-style:none;}\", \".r2f6k57:focus-visible{outline-style:none;}\", \".r2f6k57[data-fui-focus-visible]>.fui-TreeItemLayout,.r2f6k57[data-fui-focus-visible]>.fui-TreeItemPersonaLayout{border-radius:var(--borderRadiusMedium);outline-color:var(--colorStrokeFocus2);outline-radius:var(--borderRadiusMedium);outline-width:2px;outline-style:solid;}\"]);\nconst useStyles = /*#__PURE__*/__styles({\n level1: {\n iytv0q: \"f10bgyvd\"\n },\n level2: {\n iytv0q: \"f1h0rod3\"\n },\n level3: {\n iytv0q: \"fgoqafk\"\n },\n level4: {\n iytv0q: \"f75dvuh\"\n },\n level5: {\n iytv0q: \"fqk7yw6\"\n },\n level6: {\n iytv0q: \"f1r3z17b\"\n },\n level7: {\n iytv0q: \"f1hrpd1h\"\n },\n level8: {\n iytv0q: \"f1iy65d0\"\n },\n level9: {\n iytv0q: \"ftg42e5\"\n },\n level10: {\n iytv0q: \"fyat3t\"\n }\n}, {\n d: [\".f10bgyvd{--fluent-TreeItem--level:1;}\", \".f1h0rod3{--fluent-TreeItem--level:2;}\", \".fgoqafk{--fluent-TreeItem--level:3;}\", \".f75dvuh{--fluent-TreeItem--level:4;}\", \".fqk7yw6{--fluent-TreeItem--level:5;}\", \".f1r3z17b{--fluent-TreeItem--level:6;}\", \".f1hrpd1h{--fluent-TreeItem--level:7;}\", \".f1iy65d0{--fluent-TreeItem--level:8;}\", \".ftg42e5{--fluent-TreeItem--level:9;}\", \".fyat3t{--fluent-TreeItem--level:10;}\"]\n});\n/**\n * Apply styling to the TreeItem slots based on the state\n */\nexport const useTreeItemStyles_unstable = state => {\n 'use no memo';\n\n const baseStyles = useBaseStyles();\n const styles = useStyles();\n const {\n level\n } = state;\n state.root.className = mergeClasses(treeItemClassNames.root, baseStyles, isStaticallyDefinedLevel(level) && styles[`level${level}`], state.root.className);\n return state;\n};\nfunction isStaticallyDefinedLevel(level) {\n return level >= 1 && level <= 10;\n}\n//# sourceMappingURL=useTreeItemStyles.styles.js.map"],"names":["treeItemClassNames","useTreeItemStyles_unstable","root","useBaseStyles","__resetStyles","useStyles","__styles","level1","iytv0q","level2","level3","level4","level5","level6","level7","level8","level9","level10","d","state","baseStyles","styles","level","className","mergeClasses","isStaticallyDefinedLevel"],"mappings":";;;;;;;;;;;IAMaA,kBAAkB;eAAlBA;;IAyCAC,0BAA0B;eAA1BA;;;uBA/CyC;AAM/C,MAAMD,qBAAqB;IAChCE,MAAM;AACR;AACA,MAAMC,gBAAgB,WAAW,GAAEC,IAAAA,oBAAa,EAAC,YAAY,WAAW;IAAC;IAAuO;IAAwC;IAAgD;IAAsR;IAAqO;IAAuC;IAA+C;CAAmR;AAC5uC,MAAMC,YAAY,WAAW,GAAEC,IAAAA,eAAQ,EAAC;IACtCC,QAAQ;QACNC,QAAQ;IACV;IACAC,QAAQ;QACND,QAAQ;IACV;IACAE,QAAQ;QACNF,QAAQ;IACV;IACAG,QAAQ;QACNH,QAAQ;IACV;IACAI,QAAQ;QACNJ,QAAQ;IACV;IACAK,QAAQ;QACNL,QAAQ;IACV;IACAM,QAAQ;QACNN,QAAQ;IACV;IACAO,QAAQ;QACNP,QAAQ;IACV;IACAQ,QAAQ;QACNR,QAAQ;IACV;IACAS,SAAS;QACPT,QAAQ;IACV;AACF,GAAG;IACDU,GAAG;QAAC;QAA0C;QAA0C;QAAyC;QAAyC;QAAyC;QAA0C;QAA0C;QAA0C;QAAyC;KAAwC;AACpa;AAIO,MAAMjB,6BAA6BkB,CAAAA;IACxC;IAEA,MAAMC,aAAajB;IACnB,MAAMkB,SAAShB;IACf,MAAM,EACJiB,KAAK,EACN,GAAGH;IACJA,MAAMjB,IAAI,CAACqB,SAAS,GAAGC,IAAAA,mBAAY,EAACxB,mBAAmBE,IAAI,EAAEkB,YAAYK,yBAAyBH,UAAUD,MAAM,CAAC,CAAC,KAAK,EAAEC,MAAM,CAAC,CAAC,EAAEH,MAAMjB,IAAI,CAACqB,SAAS;IACzJ,OAAOJ;AACT;AACA,SAASM,yBAAyBH,KAAK;IACrC,OAAOA,SAAS,KAAKA,SAAS;AAChC,EACA,oDAAoD"}
1
+ {"version":3,"sources":["useTreeItemStyles.styles.js"],"sourcesContent":["import { 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 'use no memo';\n const baseStyles = useBaseStyles();\n const styles = useStyles();\n const { level } = state;\n state.root.className = mergeClasses(treeItemClassNames.root, baseStyles, isStaticallyDefinedLevel(level) && styles[`level${level}`], state.root.className);\n return state;\n};\nfunction isStaticallyDefinedLevel(level) {\n return level >= 1 && level <= 10;\n}\n"],"names":["treeItemClassNames","useTreeItemStyles_unstable","root","useBaseStyles","__resetStyles","useStyles","__styles","level1","iytv0q","level2","level3","level4","level5","level6","level7","level8","level9","level10","d","state","baseStyles","styles","level","className","mergeClasses","isStaticallyDefinedLevel"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAMaA,kBAAkB;eAAlBA;;IA2CIC,0BAA0B;eAA1BA;;;uBAjDyC;AAMnD,MAAMD,qBAAqB;IAC9BE,MAAM;AACV;AACA,MAAMC,gBAAa,WAAA,GAAGC,IAAAA,oBAAA,EAAA,YAAA,WAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;CA2BrB;AACD,MAAMC,YAAS,WAAA,GAAGC,IAAAA,eAAA,EAAA;IAAAC,QAAA;QAAAC,QAAA;IAAA;IAAAC,QAAA;QAAAD,QAAA;IAAA;IAAAE,QAAA;QAAAF,QAAA;IAAA;IAAAG,QAAA;QAAAH,QAAA;IAAA;IAAAI,QAAA;QAAAJ,QAAA;IAAA;IAAAK,QAAA;QAAAL,QAAA;IAAA;IAAAM,QAAA;QAAAN,QAAA;IAAA;IAAAO,QAAA;QAAAP,QAAA;IAAA;IAAAQ,QAAA;QAAAR,QAAA;IAAA;IAAAS,SAAA;QAAAT,QAAA;IAAA;AAAA,GAAA;IAAAU,GAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA;AAYP,MAAMjB,6BAA8BkB,CAAAA;IAC3C;IACA,MAAMC,aAAajB;IACnB,MAAMkB,SAAShB;IACf,MAAM,EAAEiB,KAAAA,EAAO,GAAGH;IAClBA,MAAMjB,IAAI,CAACqB,SAAS,GAAGC,IAAAA,mBAAY,EAACxB,mBAAmBE,IAAI,EAAEkB,YAAYK,yBAAyBH,UAAUD,MAAM,CAAC,CAAA,KAAA,EAAQC,MAAK,CAAE,CAAC,EAAEH,MAAMjB,IAAI,CAACqB,SAAS;IACzJ,OAAOJ;AACX;AACA,SAASM,yBAAyBH,KAAK;IACnC,OAAOA,SAAS,KAAKA,SAAS;AAClC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TreeItemChevron.js"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { ChevronRight12Regular } from '@fluentui/react-icons';\nimport { useTreeItemContext_unstable } from '../contexts/treeItemContext';\nexport const TreeItemChevron = /*#__PURE__*/ React.memo(()=>{\n const open = useTreeItemContext_unstable((ctx)=>ctx.open);\n const { dir } = useFluent_unstable();\n const expandIconRotation = open ? 90 : dir !== 'rtl' ? 0 : 180;\n return /*#__PURE__*/ React.createElement(ChevronRight12Regular, {\n style: expandIconInlineStyles[expandIconRotation]\n });\n});\nTreeItemChevron.displayName = 'TreeItemChevron';\nconst expandIconInlineStyles = {\n 90: {\n transform: `rotate(90deg)`\n },\n 0: {\n transform: `rotate(0deg)`\n },\n 180: {\n transform: `rotate(180deg)`\n }\n};\n"],"names":["TreeItemChevron","React","memo","open","useTreeItemContext_unstable","ctx","dir","useFluent_unstable","expandIconRotation","createElement","ChevronRight12Regular","style","expandIconInlineStyles","displayName","transform"],"mappings":";;;;+BAIaA;;;eAAAA;;;;iEAJU;qCACY;4BACG;iCACM;AACrC,MAAMA,kBAAkB,WAAW,GAAGC,OAAMC,IAAI,CAAC;IACpD,MAAMC,OAAOC,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIF,IAAI;IACxD,MAAM,EAAEG,GAAG,EAAE,GAAGC,IAAAA,uCAAkB;IAClC,MAAMC,qBAAqBL,OAAO,KAAKG,QAAQ,QAAQ,IAAI;IAC3D,OAAO,WAAW,GAAGL,OAAMQ,aAAa,CAACC,iCAAqB,EAAE;QAC5DC,OAAOC,sBAAsB,CAACJ,mBAAmB;IACrD;AACJ;AACAR,gBAAgBa,WAAW,GAAG;AAC9B,MAAMD,yBAAyB;IAC3B,IAAI;QACAE,WAAW,CAAC,aAAa,CAAC;IAC9B;IACA,GAAG;QACCA,WAAW,CAAC,YAAY,CAAC;IAC7B;IACA,KAAK;QACDA,WAAW,CAAC,cAAc,CAAC;IAC/B;AACJ"}
1
+ {"version":3,"sources":["TreeItemChevron.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { ChevronRight12Regular } from '@fluentui/react-icons';\nimport { useTreeItemContext_unstable } from '../contexts/treeItemContext';\n\nexport const TreeItemChevron = React.memo(() => {\n const open = useTreeItemContext_unstable(ctx => ctx.open);\n\n const { dir } = useFluent_unstable();\n\n const expandIconRotation = open ? 90 : dir !== 'rtl' ? 0 : 180;\n return <ChevronRight12Regular style={expandIconInlineStyles[expandIconRotation]} />;\n});\nTreeItemChevron.displayName = 'TreeItemChevron';\n\nconst expandIconInlineStyles = {\n 90: { transform: `rotate(90deg)` },\n 0: { transform: `rotate(0deg)` },\n 180: { transform: `rotate(180deg)` },\n} as const;\n"],"names":["TreeItemChevron","React","memo","open","useTreeItemContext_unstable","ctx","dir","useFluent_unstable","expandIconRotation","createElement","ChevronRight12Regular","style","expandIconInlineStyles","displayName","transform"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAKaA;;;eAAAA;;;;iEALU;qCACY;4BACG;iCACM;AAErC,MAAMA,kBAAAA,WAAAA,GAAkBC,OAAMC,IAAI,CAAC;IACxC,MAAMC,OAAOC,IAAAA,4CAAAA,EAA4BC,CAAAA,MAAOA,IAAIF,IAAI;IAExD,MAAM,EAAEG,GAAG,EAAE,GAAGC,IAAAA,uCAAAA;IAEhB,MAAMC,qBAAqBL,OAAO,KAAKG,QAAQ,QAAQ,IAAI;IAC3D,OAAA,WAAA,GAAOL,OAAAQ,aAAA,CAACC,iCAAAA,EAAAA;QAAsBC,OAAOC,sBAAsB,CAACJ,mBAAmB;;AACjF;AACAR,gBAAgBa,WAAW,GAAG;AAE9B,MAAMD,yBAAyB;IAC7B,IAAI;QAAEE,WAAW,CAAC,aAAa,CAAC;IAAC;IACjC,GAAG;QAAEA,WAAW,CAAC,YAAY,CAAC;IAAC;IAC/B,KAAK;QAAEA,WAAW,CAAC,cAAc,CAAC;IAAC;AACrC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TreeItemLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItemLayout_unstable } from './useTreeItemLayout';\nimport { renderTreeItemLayout_unstable } from './renderTreeItemLayout';\nimport { useTreeItemLayoutStyles_unstable } from './useTreeItemLayoutStyles.styles';\n/**\n * The `TreeItemLayout` component is used as a child of `TreeItem` to define the content and layout of a tree item.\n * It provides a consistent visual structure for tree items in a `Tree` component.\n * This component should only be used as a direct child of `TreeItem`.\n */ export const TreeItemLayout = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n const state = useTreeItemLayout_unstable(props, ref);\n useTreeItemLayoutStyles_unstable(state);\n return renderTreeItemLayout_unstable(state);\n});\nTreeItemLayout.displayName = 'TreeItemLayout';\n"],"names":["TreeItemLayout","React","forwardRef","props","ref","state","useTreeItemLayout_unstable","useTreeItemLayoutStyles_unstable","renderTreeItemLayout_unstable","displayName"],"mappings":";;;;+BAQiBA;;;eAAAA;;;;iEARM;mCACoB;sCACG;+CACG;AAKtC,MAAMA,iBAAiB,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACrE,MAAMC,QAAQC,IAAAA,6CAA0B,EAACH,OAAOC;IAChDG,IAAAA,+DAAgC,EAACF;IACjC,OAAOG,IAAAA,mDAA6B,EAACH;AACzC;AACAL,eAAeS,WAAW,GAAG"}
1
+ {"version":3,"sources":["TreeItemLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItemLayout_unstable } from './useTreeItemLayout';\nimport { renderTreeItemLayout_unstable } from './renderTreeItemLayout';\nimport { useTreeItemLayoutStyles_unstable } from './useTreeItemLayoutStyles.styles';\nimport type { TreeItemLayoutProps } from './TreeItemLayout.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * The `TreeItemLayout` component is used as a child of `TreeItem` to define the content and layout of a tree item.\n * It provides a consistent visual structure for tree items in a `Tree` component.\n * This component should only be used as a direct child of `TreeItem`.\n */\nexport const TreeItemLayout: ForwardRefComponent<TreeItemLayoutProps> = React.forwardRef((props, ref) => {\n const state = useTreeItemLayout_unstable(props, ref);\n\n useTreeItemLayoutStyles_unstable(state);\n return renderTreeItemLayout_unstable(state);\n});\n\nTreeItemLayout.displayName = 'TreeItemLayout';\n"],"names":["TreeItemLayout","React","forwardRef","props","ref","state","useTreeItemLayout_unstable","useTreeItemLayoutStyles_unstable","renderTreeItemLayout_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAYaA;;;eAAAA;;;;iEAZU;mCACoB;sCACG;+CACG;AAS1C,MAAMA,iBAAAA,WAAAA,GAA2DC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC/F,MAAMC,QAAQC,IAAAA,6CAAAA,EAA2BH,OAAOC;IAEhDG,IAAAA,+DAAAA,EAAiCF;IACjC,OAAOG,IAAAA,mDAAAA,EAA8BH;AACvC;AAEAL,eAAeS,WAAW,GAAG"}
@@ -1,4 +1,6 @@
1
- "use strict";
1
+ /**
2
+ * State used in rendering TreeItemLayout
3
+ */ "use strict";
2
4
  Object.defineProperty(exports, "__esModule", {
3
5
  value: true
4
6
  });
@@ -1 +1 @@
1
- {"version":3,"sources":[],"names":[],"mappings":""}
1
+ {"version":3,"sources":["TreeItemLayout.types.ts"],"sourcesContent":["import type * as React from 'react';\nimport type {\n Slot,\n ComponentProps,\n ComponentState,\n ExtractSlotProps,\n EventData,\n EventHandler,\n} from '@fluentui/react-utilities';\nimport { ButtonContextValue } from '@fluentui/react-button';\nimport { Checkbox } from '@fluentui/react-checkbox';\nimport { Radio } from '@fluentui/react-radio';\n\nexport type TreeItemLayoutActionVisibilityChangeData = (\n | EventData<'mouseover' | 'mouseout', MouseEvent>\n | EventData<'focus' | 'blur', FocusEvent>\n | EventData<'blur', React.FocusEvent>\n) & { visible: boolean };\n\nexport type TreeItemLayoutActionSlotProps = ExtractSlotProps<\n Slot<'div'> & {\n /**\n * Forces visibility of the aside/action content\n */\n visible?: boolean;\n onVisibilityChange?: EventHandler<TreeItemLayoutActionVisibilityChangeData>;\n }\n>;\n\nexport type TreeItemLayoutSlots = {\n root: Slot<'div'>;\n /**\n * Content. Children of the root slot are automatically rendered here\n */\n main: NonNullable<Slot<'div'>>;\n /**\n * Icon slot that renders right before main content\n */\n iconBefore?: Slot<'div'>;\n /**\n * Icon slot that renders right after main content\n */\n iconAfter?: Slot<'div'>;\n /**\n * Expand icon slot,\n * by default renders a chevron icon to indicate opening and closing\n */\n expandIcon?: Slot<'div'>;\n /**\n * Aside content is normally used to render a badge or other non-actionable content\n * It is aria-hidden by default and is only meant to be used as visual aid.\n */\n aside?: Slot<'div'>;\n /**\n * Actionable elements are normally buttons, menus, or other focusable elements.\n * Those elements are only visibly available if the given tree item is currently active.\n *\n * `actions` and `aside` slots are positioned on the exact same spot,\n * so they won't be visible at the same time.\n * `aside` slot is visible by default meanwhile `actions` slot are only visible when the tree item is active.\n *\n * `actions` slot supports a `visible` prop to force visibility of the actions.\n */\n actions?: Slot<TreeItemLayoutActionSlotProps>;\n selector?: Slot<typeof Checkbox> | Slot<typeof Radio>;\n};\n\n/**\n * TreeItemLayout Props\n */\nexport type TreeItemLayoutProps = ComponentProps<Partial<TreeItemLayoutSlots>>;\n\n/**\n * State used in rendering TreeItemLayout\n */\nexport type TreeItemLayoutState = ComponentState<TreeItemLayoutSlots> & {\n buttonContextValue: ButtonContextValue;\n};\n"],"names":[],"rangeMappings":";;","mappings":"AAwEA;;CAEC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["index.js"],"sourcesContent":["export * from './TreeItemLayout';\nexport * from './TreeItemLayout.types';\nexport * from './renderTreeItemLayout';\nexport * from './useTreeItemLayout';\nexport * from './useTreeItemLayoutStyles.styles';\n"],"names":[],"mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}
1
+ {"version":3,"sources":["index.ts"],"sourcesContent":["export * from './TreeItemLayout';\nexport * from './TreeItemLayout.types';\nexport * from './renderTreeItemLayout';\nexport * from './useTreeItemLayout';\nexport * from './useTreeItemLayoutStyles.styles';\n"],"names":[],"rangeMappings":";;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}
@@ -1 +1 @@
1
- {"version":3,"sources":["renderTreeItemLayout.js"],"sourcesContent":[" import { jsx as _jsx, jsxs as _jsxs } from \"@fluentui/react-jsx-runtime/jsx-runtime\";\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { ButtonContextProvider } from '@fluentui/react-button';\n/**\n * Render the final JSX of TreeItemLayout\n */ export const renderTreeItemLayout_unstable = (state)=>{\n assertSlots(state);\n return /*#__PURE__*/ _jsxs(state.root, {\n children: [\n state.expandIcon && /*#__PURE__*/ _jsx(state.expandIcon, {}),\n state.selector && /*#__PURE__*/ _jsx(state.selector, {}),\n state.iconBefore && /*#__PURE__*/ _jsx(state.iconBefore, {}),\n /*#__PURE__*/ _jsx(state.main, {\n children: state.root.children\n }),\n state.iconAfter && /*#__PURE__*/ _jsx(state.iconAfter, {}),\n /*#__PURE__*/ _jsxs(ButtonContextProvider, {\n value: state.buttonContextValue,\n children: [\n state.actions && /*#__PURE__*/ _jsx(state.actions, {}),\n state.aside && /*#__PURE__*/ _jsx(state.aside, {})\n ]\n })\n ]\n });\n};\n"],"names":["renderTreeItemLayout_unstable","state","assertSlots","_jsxs","root","children","expandIcon","_jsx","selector","iconBefore","main","iconAfter","ButtonContextProvider","value","buttonContextValue","actions","aside"],"mappings":";;;;+BAKiBA;;;eAAAA;;;4BAL4B;gCACjB;6BACU;AAG3B,MAAMA,gCAAgC,CAACC;IAC9CC,IAAAA,2BAAW,EAACD;IACZ,OAAO,WAAW,GAAGE,IAAAA,gBAAK,EAACF,MAAMG,IAAI,EAAE;QACnCC,UAAU;YACNJ,MAAMK,UAAU,IAAI,WAAW,GAAGC,IAAAA,eAAI,EAACN,MAAMK,UAAU,EAAE,CAAC;YAC1DL,MAAMO,QAAQ,IAAI,WAAW,GAAGD,IAAAA,eAAI,EAACN,MAAMO,QAAQ,EAAE,CAAC;YACtDP,MAAMQ,UAAU,IAAI,WAAW,GAAGF,IAAAA,eAAI,EAACN,MAAMQ,UAAU,EAAE,CAAC;YAC1D,WAAW,GAAGF,IAAAA,eAAI,EAACN,MAAMS,IAAI,EAAE;gBAC3BL,UAAUJ,MAAMG,IAAI,CAACC,QAAQ;YACjC;YACAJ,MAAMU,SAAS,IAAI,WAAW,GAAGJ,IAAAA,eAAI,EAACN,MAAMU,SAAS,EAAE,CAAC;YACxD,WAAW,GAAGR,IAAAA,gBAAK,EAACS,kCAAqB,EAAE;gBACvCC,OAAOZ,MAAMa,kBAAkB;gBAC/BT,UAAU;oBACNJ,MAAMc,OAAO,IAAI,WAAW,GAAGR,IAAAA,eAAI,EAACN,MAAMc,OAAO,EAAE,CAAC;oBACpDd,MAAMe,KAAK,IAAI,WAAW,GAAGT,IAAAA,eAAI,EAACN,MAAMe,KAAK,EAAE,CAAC;iBACnD;YACL;SACH;IACL;AACJ"}
1
+ {"version":3,"sources":["renderTreeItemLayout.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { TreeItemLayoutState, TreeItemLayoutSlots } from './TreeItemLayout.types';\nimport { ButtonContextProvider } from '@fluentui/react-button';\n\n/**\n * Render the final JSX of TreeItemLayout\n */\nexport const renderTreeItemLayout_unstable = (state: TreeItemLayoutState) => {\n assertSlots<TreeItemLayoutSlots>(state);\n\n return (\n <state.root>\n {state.expandIcon && <state.expandIcon />}\n {state.selector && <state.selector />}\n {state.iconBefore && <state.iconBefore />}\n <state.main>{state.root.children}</state.main>\n {state.iconAfter && <state.iconAfter />}\n <ButtonContextProvider value={state.buttonContextValue}>\n {state.actions && <state.actions />}\n {state.aside && <state.aside />}\n </ButtonContextProvider>\n </state.root>\n );\n};\n"],"names":["renderTreeItemLayout_unstable","state","assertSlots","_jsxs","root","expandIcon","_jsx","selector","iconBefore","main","children","iconAfter","ButtonContextProvider","value","buttonContextValue","actions","aside"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;4BARb;gCAC4B;6BAEU;AAK/B,MAAMA,gCAAgC,CAACC;IAC5CC,IAAAA,2BAAAA,EAAiCD;IAEjC,OAAA,WAAA,GACEE,IAAAA,gBAAA,EAACF,MAAMG,IAAI,EAAA;;YACRH,MAAMI,UAAU,IAAA,WAAA,GAAIC,IAAAA,eAAA,EAACL,MAAMI,UAAU,EAAA,CAAA;YACrCJ,MAAMM,QAAQ,IAAA,WAAA,GAAID,IAAAA,eAAA,EAACL,MAAMM,QAAQ,EAAA,CAAA;YACjCN,MAAMO,UAAU,IAAA,WAAA,GAAIF,IAAAA,eAAA,EAACL,MAAMO,UAAU,EAAA,CAAA;0BACtCF,IAAAA,eAAA,EAACL,MAAMQ,IAAI,EAAA;0BAAER,MAAMG,IAAI,CAACM,QAAQ;;YAC/BT,MAAMU,SAAS,IAAA,WAAA,GAAIL,IAAAA,eAAA,EAACL,MAAMU,SAAS,EAAA,CAAA;0BACpCR,IAAAA,gBAAA,EAACS,kCAAAA,EAAAA;gBAAsBC,OAAOZ,MAAMa,kBAAkB;;oBACnDb,MAAMc,OAAO,IAAA,WAAA,GAAIT,IAAAA,eAAA,EAACL,MAAMc,OAAO,EAAA,CAAA;oBAC/Bd,MAAMe,KAAK,IAAA,WAAA,GAAIV,IAAAA,eAAA,EAACL,MAAMe,KAAK,EAAA,CAAA;;;;;AAIpC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["useTreeItemLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, isResolvedShorthand, useMergedRefs, slot, useEventCallback, elementContains, useControllableState } from '@fluentui/react-utilities';\nimport { useTreeItemContext_unstable, useTreeContext_unstable } from '../../contexts';\nimport { Checkbox } from '@fluentui/react-checkbox';\nimport { Radio } from '@fluentui/react-radio';\nimport { TreeItemChevron } from '../TreeItemChevron';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\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 */ export const useTreeItemLayout_unstable = (props, ref)=>{\n 'use no memo';\n const { main, iconAfter, iconBefore } = props;\n const layoutRef = useTreeItemContext_unstable((ctx)=>ctx.layoutRef);\n const selectionMode = useTreeContext_unstable((ctx)=>ctx.selectionMode);\n const [isActionsVisibleFromProps, onActionVisibilityChange] = isResolvedShorthand(props.actions) ? [\n props.actions.visible,\n props.actions.onVisibilityChange\n ] : [\n undefined,\n undefined\n ];\n const [isActionsVisible, setIsActionsVisible] = useControllableState({\n state: isActionsVisibleFromProps,\n initialState: false\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(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 // FIXME: Asserting is required here, as converting this to RefObject on context type would be a breaking change\n assertIsRefObject(treeItemRef);\n // FIXME: Asserting is required here, as converting this to RefObject on context type would be a breaking change\n assertIsRefObject(subtreeRef);\n const setActionsVisibleIfNotFromSubtree = React.useCallback((event)=>{\n const isTargetFromSubtree = Boolean(subtreeRef.current && elementContains(subtreeRef.current, event.target));\n if (!isTargetFromSubtree) {\n onActionVisibilityChange === null || onActionVisibilityChange === void 0 ? void 0 : onActionVisibilityChange(event, {\n visible: true,\n event,\n type: event.type\n });\n setIsActionsVisible(true);\n }\n }, [\n subtreeRef,\n setIsActionsVisible,\n onActionVisibilityChange\n ]);\n const setActionsInvisibleIfNotFromSubtree = React.useCallback((event)=>{\n const isRelatedTargetFromActions = Boolean(actionsRefInternal.current && elementContains(actionsRefInternal.current, event.relatedTarget));\n if (isRelatedTargetFromActions) {\n onActionVisibilityChange === null || onActionVisibilityChange === void 0 ? void 0 : onActionVisibilityChange(event, {\n visible: true,\n event,\n type: event.type\n });\n setIsActionsVisible(true);\n return;\n }\n const isTargetFromSubtree = Boolean(subtreeRef.current && elementContains(subtreeRef.current, event.target));\n if (!isTargetFromSubtree) {\n onActionVisibilityChange === null || onActionVisibilityChange === void 0 ? void 0 : onActionVisibilityChange(event, {\n visible: false,\n event,\n type: event.type\n });\n setIsActionsVisible(false);\n return;\n }\n }, [\n subtreeRef,\n setIsActionsVisible,\n onActionVisibilityChange\n ]);\n const expandIcon = slot.optional(props.expandIcon, {\n renderByDefault: isBranch,\n defaultProps: {\n children: /*#__PURE__*/ React.createElement(TreeItemChevron, null),\n 'aria-hidden': true\n },\n elementType: 'div'\n });\n const expandIconRefs = useMergedRefs(expandIcon === null || expandIcon === void 0 ? void 0 : expandIcon.ref, expandIconRef);\n if (expandIcon) {\n expandIcon.ref = expandIconRefs;\n }\n const arrowNavigationProps = useArrowNavigationGroup({\n circular: true,\n axis: 'horizontal'\n });\n const actions = isActionsVisible ? slot.optional(props.actions, {\n defaultProps: {\n ...arrowNavigationProps,\n role: 'toolbar'\n },\n elementType: 'div'\n }) : undefined;\n actions === null || actions === void 0 ? true : delete actions.visible;\n actions === null || actions === void 0 ? true : delete actions.onVisibilityChange;\n const actionsRefs = useMergedRefs(actions === null || actions === void 0 ? void 0 : actions.ref, actionsRef, actionsRefInternal);\n const handleActionsBlur = useEventCallback((event)=>{\n if (isResolvedShorthand(props.actions)) {\n var _props_actions_onBlur, _props_actions;\n (_props_actions_onBlur = (_props_actions = props.actions).onBlur) === null || _props_actions_onBlur === void 0 ? void 0 : _props_actions_onBlur.call(_props_actions, event);\n }\n const isRelatedTargetFromActions = Boolean(elementContains(event.currentTarget, event.relatedTarget));\n onActionVisibilityChange === null || onActionVisibilityChange === void 0 ? void 0 : onActionVisibilityChange(event, {\n visible: isRelatedTargetFromActions,\n event,\n type: event.type\n });\n setIsActionsVisible(isRelatedTargetFromActions);\n });\n if (actions) {\n actions.ref = actionsRefs;\n actions.onBlur = handleActionsBlur;\n }\n const hasActions = Boolean(props.actions);\n React.useEffect(()=>{\n if (treeItemRef.current && hasActions && isActionsVisibleFromProps === undefined) {\n const treeItemElement = treeItemRef.current;\n const handleMouseOver = setActionsVisibleIfNotFromSubtree;\n const handleMouseOut = setActionsInvisibleIfNotFromSubtree;\n const handleFocus = setActionsVisibleIfNotFromSubtree;\n const handleBlur = setActionsInvisibleIfNotFromSubtree;\n treeItemElement.addEventListener('mouseover', handleMouseOver);\n treeItemElement.addEventListener('mouseout', handleMouseOut);\n treeItemElement.addEventListener('focus', handleFocus);\n treeItemElement.addEventListener('blur', handleBlur);\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 }, [\n hasActions,\n treeItemRef,\n isActionsVisibleFromProps,\n setActionsVisibleIfNotFromSubtree,\n 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\n },\n buttonContextValue: {\n size: 'small'\n },\n root: slot.always(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)\n }), {\n elementType: 'div'\n }),\n iconBefore: slot.optional(iconBefore, {\n defaultProps: {\n 'aria-hidden': true\n },\n elementType: 'div'\n }),\n main: slot.always(main, {\n elementType: 'div'\n }),\n iconAfter: slot.optional(iconAfter, {\n defaultProps: {\n 'aria-hidden': true\n },\n elementType: 'div'\n }),\n aside: !isActionsVisible ? slot.optional(props.aside, {\n defaultProps: {\n 'aria-hidden': true\n },\n elementType: 'div'\n }) : 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 },\n elementType: selectionMode === 'multiselect' ? Checkbox : Radio\n })\n };\n};\nfunction assertIsRefObject(ref) {\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":["useTreeItemLayout_unstable","props","ref","main","iconAfter","iconBefore","layoutRef","useTreeItemContext_unstable","ctx","selectionMode","useTreeContext_unstable","isActionsVisibleFromProps","onActionVisibilityChange","isResolvedShorthand","actions","visible","onVisibilityChange","undefined","isActionsVisible","setIsActionsVisible","useControllableState","state","initialState","selectionRef","expandIconRef","actionsRef","actionsRefInternal","React","useRef","treeItemRef","subtreeRef","checked","isBranch","itemType","assertIsRefObject","setActionsVisibleIfNotFromSubtree","useCallback","event","isTargetFromSubtree","Boolean","current","elementContains","target","type","setActionsInvisibleIfNotFromSubtree","isRelatedTargetFromActions","relatedTarget","expandIcon","slot","optional","renderByDefault","defaultProps","children","createElement","TreeItemChevron","elementType","expandIconRefs","useMergedRefs","arrowNavigationProps","useArrowNavigationGroup","circular","axis","role","actionsRefs","handleActionsBlur","useEventCallback","_props_actions_onBlur","_props_actions","onBlur","call","currentTarget","hasActions","useEffect","treeItemElement","handleMouseOver","handleMouseOut","handleFocus","handleBlur","addEventListener","removeEventListener","components","root","aside","selector","Checkbox","Radio","buttonContextValue","size","always","getIntrinsicElementProps","tabIndex","process","env","NODE_ENV","Error","name"],"mappings":"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"}
1
+ {"version":3,"sources":["useTreeItemLayout.tsx"],"sourcesContent":["import * 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 { Checkbox, CheckboxProps } from '@fluentui/react-checkbox';\nimport { Radio, RadioProps } from '@fluentui/react-radio';\nimport { TreeItemChevron } from '../TreeItemChevron';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\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 'use no memo';\n\n const { main, iconAfter, iconBefore } = props;\n\n const layoutRef = useTreeItemContext_unstable(ctx => ctx.layoutRef);\n const selectionMode = useTreeContext_unstable(ctx => ctx.selectionMode);\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 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 assertIsRefObject(treeItemRef);\n // FIXME: Asserting is required here, as converting this to RefObject on context type would be a breaking change\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 setIsActionsVisible(true);\n }\n },\n [subtreeRef, setIsActionsVisible, onActionVisibilityChange],\n );\n\n const setActionsInvisibleIfNotFromSubtree = React.useCallback(\n (event: FocusEvent | MouseEvent) => {\n const isRelatedTargetFromActions = Boolean(\n actionsRefInternal.current && elementContains(actionsRefInternal.current, event.relatedTarget as Node),\n );\n if (isRelatedTargetFromActions) {\n onActionVisibilityChange?.(event, {\n visible: true,\n event,\n type: event.type,\n } as Extract<TreeItemLayoutActionVisibilityChangeData, { event: typeof event }>);\n setIsActionsVisible(true);\n return;\n }\n const isTargetFromSubtree = Boolean(\n subtreeRef.current && elementContains(subtreeRef.current, event.target as Node),\n );\n if (!isTargetFromSubtree) {\n onActionVisibilityChange?.(event, {\n visible: false,\n event,\n type: event.type,\n } as Extract<TreeItemLayoutActionVisibilityChangeData, { event: typeof event }>);\n setIsActionsVisible(false);\n return;\n }\n },\n [subtreeRef, setIsActionsVisible, onActionVisibilityChange],\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: true, 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 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 && isActionsVisibleFromProps === undefined) {\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 }, [\n hasActions,\n treeItemRef,\n isActionsVisibleFromProps,\n setActionsVisibleIfNotFromSubtree,\n setActionsInvisibleIfNotFromSubtree,\n ]);\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, { defaultProps: { 'aria-hidden': true }, elementType: 'div' }),\n main: slot.always(main, { elementType: 'div' }),\n iconAfter: slot.optional(iconAfter, { defaultProps: { 'aria-hidden': true }, elementType: 'div' }),\n aside: !isActionsVisible\n ? slot.optional(props.aside, { defaultProps: { 'aria-hidden': true }, elementType: 'div' })\n : 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":["useTreeItemLayout_unstable","props","ref","main","iconAfter","iconBefore","layoutRef","useTreeItemContext_unstable","ctx","selectionMode","useTreeContext_unstable","isActionsVisibleFromProps","onActionVisibilityChange","isResolvedShorthand","actions","visible","onVisibilityChange","undefined","isActionsVisible","setIsActionsVisible","useControllableState","state","initialState","selectionRef","expandIconRef","actionsRef","actionsRefInternal","React","useRef","treeItemRef","subtreeRef","checked","isBranch","itemType","assertIsRefObject","setActionsVisibleIfNotFromSubtree","useCallback","event","isTargetFromSubtree","Boolean","current","elementContains","target","type","setActionsInvisibleIfNotFromSubtree","isRelatedTargetFromActions","relatedTarget","expandIcon","slot","optional","renderByDefault","defaultProps","children","createElement","TreeItemChevron","elementType","expandIconRefs","useMergedRefs","arrowNavigationProps","useArrowNavigationGroup","circular","axis","role","actionsRefs","handleActionsBlur","useEventCallback","onBlur","currentTarget","hasActions","useEffect","treeItemElement","handleMouseOver","handleMouseOut","handleFocus","handleBlur","addEventListener","removeEventListener","components","root","aside","selector","Checkbox","Radio","buttonContextValue","size","always","getIntrinsicElementProps","tabIndex","process","env","NODE_ENV","Error","name"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"sources":["useTreeItemLayoutStyles.styles.js"],"sourcesContent":["import { __resetStyles, __styles, 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 = /*#__PURE__*/__resetStyles(\"r1bx0xiv\", null, [\".r1bx0xiv{display:flex;align-items:center;min-height:32px;box-sizing:border-box;grid-area:layout;}\", \".r1bx0xiv:active{color:var(--colorNeutralForeground2Pressed);background-color:var(--colorSubtleBackgroundPressed);}\", \".r1bx0xiv:active .fui-TreeItemLayout__expandIcon{color:var(--colorNeutralForeground3Pressed);}\", \".r1bx0xiv:hover{color:var(--colorNeutralForeground2Hover);background-color:var(--colorSubtleBackgroundHover);}\", \".r1bx0xiv:hover .fui-TreeItemLayout__expandIcon{color:var(--colorNeutralForeground3Hover);}\"]);\n/**\n * Styles for the root slot\n */\nconst useRootStyles = /*#__PURE__*/__styles({\n leaf: {\n uwmqm3: [\"f1k1erfc\", \"faevyjx\"]\n },\n branch: {\n uwmqm3: [\"fo100m9\", \"f6yw3pu\"]\n },\n medium: {\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fkhj508\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"f1i3iumi\"\n },\n small: {\n sshi5w: \"f1pha7fy\",\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fy9rknc\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"fwrc4pm\"\n },\n subtle: {},\n \"subtle-alpha\": {\n Jwef8y: \"f146ro5n\",\n ecr2s2: \"fkam630\"\n },\n transparent: {\n De3pzq: \"f1c21dwh\",\n Jwef8y: \"fjxutwb\",\n ecr2s2: \"fophhak\"\n }\n}, {\n d: [\".f1k1erfc{padding-left:calc(var(--fluent-TreeItem--level, 1) * var(--spacingHorizontalXXL));}\", \".faevyjx{padding-right:calc(var(--fluent-TreeItem--level, 1) * var(--spacingHorizontalXXL));}\", \".fo100m9{padding-left:calc((var(--fluent-TreeItem--level, 1) - 1) * var(--spacingHorizontalXXL));}\", \".f6yw3pu{padding-right:calc((var(--fluent-TreeItem--level, 1) - 1) * var(--spacingHorizontalXXL));}\", \".fk6fouc{font-family:var(--fontFamilyBase);}\", \".fkhj508{font-size:var(--fontSizeBase300);}\", \".figsok6{font-weight:var(--fontWeightRegular);}\", \".f1i3iumi{line-height:var(--lineHeightBase300);}\", \".f1pha7fy{min-height:24px;}\", \".fy9rknc{font-size:var(--fontSizeBase200);}\", \".fwrc4pm{line-height:var(--lineHeightBase200);}\", \".f1c21dwh{background-color:var(--colorTransparentBackground);}\"],\n h: [\".f146ro5n:hover{background-color:var(--colorSubtleBackgroundLightAlphaHover);}\", \".fjxutwb:hover{background-color:var(--colorTransparentBackgroundHover);}\"],\n a: [\".fkam630:active{background-color:var(--colorSubtleBackgroundLightAlphaPressed);}\", \".fophhak:active{background-color:var(--colorTransparentBackgroundPressed);}\"]\n});\n/**\n * Styles for the action icon slot\n */\nconst useActionsBaseStyles = /*#__PURE__*/__resetStyles(\"rzvs2in\", \"r17h8a29\", [\".rzvs2in{display:flex;margin-left:auto;position:relative;z-index:1;grid-area:aside;padding:0 var(--spacingHorizontalS);}\", \".r17h8a29{display:flex;margin-right:auto;position:relative;z-index:1;grid-area:aside;padding:0 var(--spacingHorizontalS);}\"]);\n/**\n * Styles for the action icon slot\n */\nconst useAsideBaseStyles = /*#__PURE__*/__resetStyles(\"r1825u21\", \"rezy0yk\", [\".r1825u21{display:flex;margin-left:auto;align-items:center;z-index:0;grid-area:aside;padding:0 var(--spacingHorizontalM);gap:var(--spacingHorizontalXS);}\", \".rezy0yk{display:flex;margin-right:auto;align-items:center;z-index:0;grid-area:aside;padding:0 var(--spacingHorizontalM);gap:var(--spacingHorizontalXS);}\"]);\n/**\n * Styles for the expand icon slot\n */\nconst useExpandIconBaseStyles = /*#__PURE__*/__resetStyles(\"rh4pu5o\", null, [\".rh4pu5o{display:flex;align-items:center;justify-content:center;min-width:24px;box-sizing:border-box;color:var(--colorNeutralForeground3);flex:0 0 auto;padding:var(--spacingVerticalXS) 0;}\"]);\n/**\n * Styles for the content slot\n */\nconst useMainBaseStyles = /*#__PURE__*/__resetStyles(\"rklbe47\", null, [\".rklbe47{padding:0 var(--spacingHorizontalXXS);}\"]);\n/**\n * Styles for the before/after icon slot\n */\nconst useIconBaseStyles = /*#__PURE__*/__resetStyles(\"rphzgg1\", null, [\".rphzgg1{display:flex;align-items:center;color:var(--colorNeutralForeground2);line-height:var(--lineHeightBase500);font-size:var(--fontSizeBase500);}\"]);\nconst useIconBeforeStyles = /*#__PURE__*/__styles({\n medium: {\n z189sj: [\"f7x41pl\", \"fruq291\"]\n },\n small: {\n z189sj: [\"ffczdla\", \"fgiv446\"]\n }\n}, {\n d: [\".f7x41pl{padding-right:var(--spacingHorizontalXS);}\", \".fruq291{padding-left:var(--spacingHorizontalXS);}\", \".ffczdla{padding-right:var(--spacingHorizontalXXS);}\", \".fgiv446{padding-left:var(--spacingHorizontalXXS);}\"]\n});\nconst useIconAfterStyles = /*#__PURE__*/__styles({\n medium: {\n uwmqm3: [\"fruq291\", \"f7x41pl\"]\n },\n small: {\n uwmqm3: [\"fgiv446\", \"ffczdla\"]\n }\n}, {\n d: [\".fruq291{padding-left:var(--spacingHorizontalXS);}\", \".f7x41pl{padding-right:var(--spacingHorizontalXS);}\", \".fgiv446{padding-left:var(--spacingHorizontalXXS);}\", \".ffczdla{padding-right:var(--spacingHorizontalXXS);}\"]\n});\n/**\n * Apply styling to the TreeItemLayout slots based on the state\n */\nexport const useTreeItemLayoutStyles_unstable = state => {\n 'use no memo';\n\n const {\n main,\n iconAfter,\n iconBefore,\n expandIcon,\n root,\n aside,\n actions,\n selector\n } = 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 root.className = mergeClasses(treeItemLayoutClassNames.root, rootBaseStyles, rootStyles[appearance], rootStyles[size], rootStyles[itemType], root.className);\n main.className = mergeClasses(treeItemLayoutClassNames.main, mainBaseStyles, main.className);\n if (expandIcon) {\n expandIcon.className = mergeClasses(treeItemLayoutClassNames.expandIcon, expandIconBaseStyles, expandIcon.className);\n }\n if (iconBefore) {\n iconBefore.className = mergeClasses(treeItemLayoutClassNames.iconBefore, iconBaseStyles, iconBeforeStyles[size], iconBefore.className);\n }\n if (iconAfter) {\n iconAfter.className = mergeClasses(treeItemLayoutClassNames.iconAfter, iconBaseStyles, iconAfterStyles[size], iconAfter.className);\n }\n if (actions) {\n actions.className = mergeClasses(treeItemLayoutClassNames.actions, actionsBaseStyles, actions.className);\n }\n if (aside) {\n aside.className = mergeClasses(treeItemLayoutClassNames.aside, asideBaseStyles, aside.className);\n }\n if (selector) {\n selector.className = mergeClasses(treeItemLayoutClassNames.selector, selector.className);\n }\n return state;\n};\n//# sourceMappingURL=useTreeItemLayoutStyles.styles.js.map"],"names":["treeItemLayoutClassNames","useTreeItemLayoutStyles_unstable","root","iconBefore","main","iconAfter","expandIcon","aside","actions","selector","useRootBaseStyles","__resetStyles","useRootStyles","__styles","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","state","rootStyles","rootBaseStyles","actionsBaseStyles","asideBaseStyles","mainBaseStyles","expandIconBaseStyles","iconBaseStyles","iconBeforeStyles","iconAfterStyles","size","useTreeContext_unstable","ctx","appearance","itemType","useTreeItemContext_unstable","className","mergeClasses"],"mappings":"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"}
1
+ {"version":3,"sources":["useTreeItemLayoutStyles.styles.js"],"sourcesContent":["import { 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 ':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 ':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});\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 'use no memo';\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 root.className = mergeClasses(treeItemLayoutClassNames.root, rootBaseStyles, rootStyles[appearance], rootStyles[size], rootStyles[itemType], root.className);\n main.className = mergeClasses(treeItemLayoutClassNames.main, mainBaseStyles, main.className);\n if (expandIcon) {\n expandIcon.className = mergeClasses(treeItemLayoutClassNames.expandIcon, expandIconBaseStyles, expandIcon.className);\n }\n if (iconBefore) {\n iconBefore.className = mergeClasses(treeItemLayoutClassNames.iconBefore, iconBaseStyles, iconBeforeStyles[size], iconBefore.className);\n }\n if (iconAfter) {\n iconAfter.className = mergeClasses(treeItemLayoutClassNames.iconAfter, iconBaseStyles, iconAfterStyles[size], iconAfter.className);\n }\n if (actions) {\n actions.className = mergeClasses(treeItemLayoutClassNames.actions, actionsBaseStyles, actions.className);\n }\n if (aside) {\n aside.className = mergeClasses(treeItemLayoutClassNames.aside, asideBaseStyles, aside.className);\n }\n if (selector) {\n selector.className = mergeClasses(treeItemLayoutClassNames.selector, selector.className);\n }\n return state;\n};\n"],"names":["treeItemLayoutClassNames","useTreeItemLayoutStyles_unstable","root","iconBefore","main","iconAfter","expandIcon","aside","actions","selector","useRootBaseStyles","__resetStyles","useRootStyles","__styles","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","state","rootStyles","rootBaseStyles","actionsBaseStyles","asideBaseStyles","mainBaseStyles","expandIconBaseStyles","iconBaseStyles","iconBeforeStyles","iconAfterStyles","size","useTreeContext_unstable","ctx","appearance","itemType","useTreeItemContext_unstable","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TreeItemPersonaLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItemPersonaLayout_unstable } from './useTreeItemPersonaLayout';\nimport { renderTreeItemPersonaLayout_unstable } from './renderTreeItemPersonaLayout';\nimport { useTreeItemPersonaLayoutStyles_unstable } from './useTreeItemPersonaLayoutStyles.styles';\nimport { useTreeItemPersonaLayoutContextValues_unstable } from './useTreeItemPersonaLayoutContextValues';\n/**\n * The `TreeItemPersonaLayout` component is used as a child of `TreeItem` to display a `TreeItem` with a media (typically an avatar) and a description.\n * It provides a more visually appealing representation of a `TreeItem` and is typically used to display a list of people or topics.\n * This component should only be used as a direct child of `TreeItem`.\n */ export const TreeItemPersonaLayout = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n const state = useTreeItemPersonaLayout_unstable(props, ref);\n useTreeItemPersonaLayoutStyles_unstable(state);\n const contextValues = useTreeItemPersonaLayoutContextValues_unstable(state);\n return renderTreeItemPersonaLayout_unstable(state, contextValues);\n});\nTreeItemPersonaLayout.displayName = 'TreeItemPersonaLayout';\n"],"names":["TreeItemPersonaLayout","React","forwardRef","props","ref","state","useTreeItemPersonaLayout_unstable","useTreeItemPersonaLayoutStyles_unstable","contextValues","useTreeItemPersonaLayoutContextValues_unstable","renderTreeItemPersonaLayout_unstable","displayName"],"mappings":";;;;+BASiBA;;;eAAAA;;;;iEATM;0CAC2B;6CACG;sDACG;uDACO;AAKpD,MAAMA,wBAAwB,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC5E,MAAMC,QAAQC,IAAAA,2DAAiC,EAACH,OAAOC;IACvDG,IAAAA,6EAAuC,EAACF;IACxC,MAAMG,gBAAgBC,IAAAA,qFAA8C,EAACJ;IACrE,OAAOK,IAAAA,iEAAoC,EAACL,OAAOG;AACvD;AACAR,sBAAsBW,WAAW,GAAG"}
1
+ {"version":3,"sources":["TreeItemPersonaLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItemPersonaLayout_unstable } from './useTreeItemPersonaLayout';\nimport { renderTreeItemPersonaLayout_unstable } from './renderTreeItemPersonaLayout';\nimport { useTreeItemPersonaLayoutStyles_unstable } from './useTreeItemPersonaLayoutStyles.styles';\nimport type { TreeItemPersonaLayoutProps } from './TreeItemPersonaLayout.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTreeItemPersonaLayoutContextValues_unstable } from './useTreeItemPersonaLayoutContextValues';\n\n/**\n * The `TreeItemPersonaLayout` component is used as a child of `TreeItem` to display a `TreeItem` with a media (typically an avatar) and a description.\n * It provides a more visually appealing representation of a `TreeItem` and is typically used to display a list of people or topics.\n * This component should only be used as a direct child of `TreeItem`.\n */\nexport const TreeItemPersonaLayout: ForwardRefComponent<TreeItemPersonaLayoutProps> = React.forwardRef((props, ref) => {\n const state = useTreeItemPersonaLayout_unstable(props, ref);\n\n useTreeItemPersonaLayoutStyles_unstable(state);\n\n const contextValues = useTreeItemPersonaLayoutContextValues_unstable(state);\n\n return renderTreeItemPersonaLayout_unstable(state, contextValues);\n});\n\nTreeItemPersonaLayout.displayName = 'TreeItemPersonaLayout';\n"],"names":["TreeItemPersonaLayout","React","forwardRef","props","ref","state","useTreeItemPersonaLayout_unstable","useTreeItemPersonaLayoutStyles_unstable","contextValues","useTreeItemPersonaLayoutContextValues_unstable","renderTreeItemPersonaLayout_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAaaA;;;eAAAA;;;;iEAbU;0CAC2B;6CACG;sDACG;uDAGO;AAOxD,MAAMA,wBAAAA,WAAAA,GAAyEC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC7G,MAAMC,QAAQC,IAAAA,2DAAAA,EAAkCH,OAAOC;IAEvDG,IAAAA,6EAAAA,EAAwCF;IAExC,MAAMG,gBAAgBC,IAAAA,qFAAAA,EAA+CJ;IAErE,OAAOK,IAAAA,iEAAAA,EAAqCL,OAAOG;AACrD;AAEAR,sBAAsBW,WAAW,GAAG"}
@@ -1,4 +1,6 @@
1
- "use strict";
1
+ /**
2
+ * State used in rendering TreeItemPersonaLayout
3
+ */ "use strict";
2
4
  Object.defineProperty(exports, "__esModule", {
3
5
  value: true
4
6
  });
@@ -1 +1 @@
1
- {"version":3,"sources":[],"names":[],"mappings":""}
1
+ {"version":3,"sources":["TreeItemPersonaLayout.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { AvatarContextValue, AvatarSize } from '@fluentui/react-avatar';\nimport { ButtonContextValue } from '@fluentui/react-button';\nimport { TreeItemLayoutSlots } from '../TreeItemLayout/TreeItemLayout.types';\n\nexport type TreeItemPersonaLayoutContextValues = {\n avatar: AvatarContextValue;\n};\n\nexport type TreeItemPersonaLayoutSlots = Pick<TreeItemLayoutSlots, 'actions' | 'aside' | 'expandIcon' | 'selector'> & {\n root: NonNullable<Slot<'div'>>;\n /**\n * Avatar to display.\n */\n media: NonNullable<Slot<'div'>>;\n /**\n * Content. Children of the root slot are automatically rendered here\n */\n main: NonNullable<Slot<'div'>>;\n /**\n * Secondary text that describes or complements the content\n */\n description?: Slot<'div'>;\n};\n\n/**\n * TreeItemPersonaLayout Props\n */\nexport type TreeItemPersonaLayoutProps = ComponentProps<Partial<TreeItemPersonaLayoutSlots>>;\n\n/**\n * State used in rendering TreeItemPersonaLayout\n */\nexport type TreeItemPersonaLayoutState = ComponentState<TreeItemPersonaLayoutSlots> & {\n avatarSize: AvatarSize;\n buttonContextValue: ButtonContextValue;\n};\n"],"names":[],"rangeMappings":";;","mappings":"AA8BA;;CAEC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["index.js"],"sourcesContent":["export * from './TreeItemPersonaLayout';\nexport * from './TreeItemPersonaLayout.types';\nexport * from './renderTreeItemPersonaLayout';\nexport * from './useTreeItemPersonaLayout';\nexport * from './useTreeItemPersonaLayoutStyles.styles';\n"],"names":[],"mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}
1
+ {"version":3,"sources":["index.ts"],"sourcesContent":["export * from './TreeItemPersonaLayout';\nexport * from './TreeItemPersonaLayout.types';\nexport * from './renderTreeItemPersonaLayout';\nexport * from './useTreeItemPersonaLayout';\nexport * from './useTreeItemPersonaLayoutStyles.styles';\n"],"names":[],"rangeMappings":";;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}