@fluentui/react-tree 9.0.0-beta.26 → 9.0.0-beta.28

package/lib/utils/flattenTree.js.map

@@ -1 +1 @@
-{"version":3,"sources":["flattenTree.ts"],"sourcesContent":["import { FlatTreeItemProps } from '../hooks/useFlatTree';\nimport { TreeItemProps, TreeItemValue } from '../TreeItem';\n\nexport type NestedTreeItem<Props extends TreeItemProps> = Omit<Props, 'subtree' | 'itemType'> & {\n  value: TreeItemValue;\n  subtree?: NestedTreeItem<Props>[];\n};\n\nexport type FlattenedTreeItem<Props extends TreeItemProps> = FlatTreeItemProps & Props;\n\nfunction flattenTreeRecursive<Props extends TreeItemProps>(\n  items: NestedTreeItem<Props>[],\n  parent?: FlatTreeItemProps & Props,\n  level = 1,\n): FlattenedTreeItem<Props>[] {\n  return items.reduce<FlattenedTreeItem<Props>[]>((acc, { subtree, ...item }, index) => {\n    const flatTreeItem = {\n      'aria-level': level,\n      'aria-posinset': index + 1,\n      'aria-setsize': items.length,\n      parentValue: parent?.value,\n      ...item,\n    } as FlattenedTreeItem<Props>;\n    acc.push(flatTreeItem);\n    if (subtree !== undefined) {\n      acc.push(...flattenTreeRecursive<Props>(subtree, flatTreeItem, level + 1));\n    }\n    return acc;\n  }, []);\n}\n\n/**\n * Converts a nested structure to a flat one which can be consumed by `useFlatTreeItems`\n * @example\n * ```tsx\n * const defaultItems = flattenTree_unstable([\n *  {\n *    children: <TreeItemLayout>level 1, item 1</TreeItemLayout>,\n *    subtree: [\n *      {\n *        children: <TreeItemLayout>level 2, item 1</TreeItemLayout>,\n *      },\n *      {\n *        children: <TreeItemLayout>level 2, item 2</TreeItemLayout>,\n *      },\n *      {\n *        children: <TreeItemLayout>level 2, item 3</TreeItemLayout>,\n *      },\n *    ],\n *  },\n *  {\n *    children: <TreeItemLayout>level 1, item 2</TreeItemLayout>,\n *    subtree: [\n *      {\n *        children: <TreeItemLayout>level 2, item 1</TreeItemLayout>,\n *        subtree: [\n *          {\n *            children: <TreeItemLayout>level 3, item 1</TreeItemLayout>,\n *            subtree: [\n *              {\n *                children: <TreeItemLayout>level 4, item 1</TreeItemLayout>,\n *              },\n *            ],\n *          },\n *        ],\n *      },\n *    ],\n *  },\n * ]);\n * ```\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport const flattenTree_unstable = <Props extends TreeItemProps>(\n  items: NestedTreeItem<Props>[],\n): FlattenedTreeItem<Props>[] => flattenTreeRecursive(items);\n"],"names":["flattenTreeRecursive","items","parent","level","reduce","acc","subtree","item","index","flatTreeItem","length","parentValue","value","push","undefined","flattenTree_unstable"],"mappings":"AAUA,SAASA,qBACPC,KAA8B,EAC9BC,MAAkC,EAClCC,QAAQ,CAAC,EACmB;IAC5B,OAAOF,MAAMG,MAAM,CAA6B,CAACC,KAAK,EAAEC,QAAO,EAAE,GAAGC,MAAM,EAAEC,QAAU;QACpF,MAAMC,eAAe;YACnB,cAAcN;YACd,iBAAiBK,QAAQ;YACzB,gBAAgBP,MAAMS,MAAM;YAC5BC,aAAaT,mBAAAA,oBAAAA,KAAAA,IAAAA,OAAQU,KAAK;YAC1B,GAAGL,IAAI;QACT;QACAF,IAAIQ,IAAI,CAACJ;QACT,IAAIH,YAAYQ,WAAW;YACzBT,IAAIQ,IAAI,IAAIb,qBAA4BM,SAASG,cAAcN,QAAQ;QACzE,CAAC;QACD,OAAOE;IACT,GAAG,EAAE;AACP;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuCC,GACD,gEAAgE;AAChE,OAAO,MAAMU,uBAAuB,CAClCd,QAC+BD,qBAAqBC,OAAO"}
+{"version":3,"sources":["flattenTree.ts"],"sourcesContent":["import { HeadlessFlatTreeItemProps } from '../FlatTree';\nimport { TreeItemProps, TreeItemValue } from '../TreeItem';\n\nexport type FlattenTreeItem<Props extends TreeItemProps> = Omit<Props, 'subtree' | 'itemType'> & {\n  value: TreeItemValue;\n  subtree?: FlattenTreeItem<Props>[];\n};\n\nexport type FlattenedTreeItem<Props extends TreeItemProps> = HeadlessFlatTreeItemProps & Props;\n\nfunction flattenTreeRecursive<Props extends TreeItemProps>(\n  items: FlattenTreeItem<Props>[],\n  parent?: HeadlessFlatTreeItemProps & Props,\n  level = 1,\n): FlattenedTreeItem<Props>[] {\n  return items.reduce<FlattenedTreeItem<Props>[]>((acc, { subtree, ...item }, index) => {\n    const flatTreeItem = {\n      'aria-level': level,\n      'aria-posinset': index + 1,\n      'aria-setsize': items.length,\n      parentValue: parent?.value,\n      ...item,\n    } as FlattenedTreeItem<Props>;\n    acc.push(flatTreeItem);\n    if (subtree !== undefined) {\n      acc.push(...flattenTreeRecursive<Props>(subtree, flatTreeItem, level + 1));\n    }\n    return acc;\n  }, []);\n}\n\n/**\n * Converts a nested structure to a flat one which can be consumed by `useFlatTreeItems`\n * @example\n * ```tsx\n * const defaultItems = flattenTree_unstable([\n *  {\n *    children: <TreeItemLayout>level 1, item 1</TreeItemLayout>,\n *    subtree: [\n *      {\n *        children: <TreeItemLayout>level 2, item 1</TreeItemLayout>,\n *      },\n *      {\n *        children: <TreeItemLayout>level 2, item 2</TreeItemLayout>,\n *      },\n *      {\n *        children: <TreeItemLayout>level 2, item 3</TreeItemLayout>,\n *      },\n *    ],\n *  },\n *  {\n *    children: <TreeItemLayout>level 1, item 2</TreeItemLayout>,\n *    subtree: [\n *      {\n *        children: <TreeItemLayout>level 2, item 1</TreeItemLayout>,\n *        subtree: [\n *          {\n *            children: <TreeItemLayout>level 3, item 1</TreeItemLayout>,\n *            subtree: [\n *              {\n *                children: <TreeItemLayout>level 4, item 1</TreeItemLayout>,\n *              },\n *            ],\n *          },\n *        ],\n *      },\n *    ],\n *  },\n * ]);\n * ```\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport const flattenTree_unstable = <Props extends TreeItemProps>(\n  items: FlattenTreeItem<Props>[],\n): FlattenedTreeItem<Props>[] => flattenTreeRecursive(items);\n"],"names":["flattenTreeRecursive","items","parent","level","reduce","acc","subtree","item","index","flatTreeItem","length","parentValue","value","push","undefined","flattenTree_unstable"],"mappings":"AAUA,SAASA,qBACPC,KAA+B,EAC/BC,MAA0C,EAC1CC,QAAQ,CAAC,EACmB;IAC5B,OAAOF,MAAMG,MAAM,CAA6B,CAACC,KAAK,EAAEC,QAAO,EAAE,GAAGC,MAAM,EAAEC,QAAU;QACpF,MAAMC,eAAe;YACnB,cAAcN;YACd,iBAAiBK,QAAQ;YACzB,gBAAgBP,MAAMS,MAAM;YAC5BC,aAAaT,mBAAAA,oBAAAA,KAAAA,IAAAA,OAAQU,KAAK;YAC1B,GAAGL,IAAI;QACT;QACAF,IAAIQ,IAAI,CAACJ;QACT,IAAIH,YAAYQ,WAAW;YACzBT,IAAIQ,IAAI,IAAIb,qBAA4BM,SAASG,cAAcN,QAAQ;QACzE,CAAC;QACD,OAAOE;IACT,GAAG,EAAE;AACP;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuCC,GACD,gEAAgE;AAChE,OAAO,MAAMU,uBAAuB,CAClCd,QAC+BD,qBAAqBC,OAAO"}

package/lib-commonjs/FlatTree.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
+_exportStar(require("./components/FlatTree/index"), exports);

package/lib-commonjs/FlatTree.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["FlatTree.js"],"sourcesContent":["export * from './components/FlatTree/index';\n"],"names":[],"mappings":";;;;;oBAAc"}

package/lib-commonjs/components/FlatTree/FlatTree.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "FlatTree", {
+    enumerable: true,
+    get: ()=>FlatTree
+});
+const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _index = require("../Tree/index");
+const _useFlatTree = require("./useFlatTree");
+const _useFlatTreeStylesStyles = require("./useFlatTreeStyles.styles");
+const FlatTree = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
+    const state = (0, _useFlatTree.useFlatTree_unstable)(props, ref);
+    const contextValues = (0, _index.useTreeContextValues_unstable)(state);
+    (0, _useFlatTreeStylesStyles.useFlatTreeStyles_unstable)(state);
+    return (0, _index.renderTree_unstable)(state, contextValues);
+});
+FlatTree.displayName = 'FlatTree';

package/lib-commonjs/components/FlatTree/FlatTree.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["FlatTree.js"],"sourcesContent":["import * as React from 'react';\nimport { useTreeContextValues_unstable as useFlatTreeContextValues_unstable, renderTree_unstable as renderFlatTree_unstable } from '../Tree/index';\nimport { useFlatTree_unstable } from './useFlatTree';\nimport { useFlatTreeStyles_unstable } from './useFlatTreeStyles.styles';\n/**\n * FlatTree component - TODO: add more docs\n */ export const FlatTree = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n    const state = useFlatTree_unstable(props, ref);\n    const contextValues = useFlatTreeContextValues_unstable(state);\n    useFlatTreeStyles_unstable(state);\n    return renderFlatTree_unstable(state, contextValues);\n});\nFlatTree.displayName = 'FlatTree';\n"],"names":["FlatTree","React","forwardRef","props","ref","state","useFlatTree_unstable","contextValues","useFlatTreeContextValues_unstable","useFlatTreeStyles_unstable","renderFlatTree_unstable","displayName"],"mappings":";;;;+BAMiBA;;aAAAA;;;6DANM;uBAC4G;6BAC9F;yCACM;AAGhC,MAAMA,WAAW,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAM;IACrE,MAAMC,QAAQC,IAAAA,iCAAoB,EAACH,OAAOC;IAC1C,MAAMG,gBAAgBC,IAAAA,oCAAiC,EAACH;IACxDI,IAAAA,mDAA0B,EAACJ;IAC3B,OAAOK,IAAAA,0BAAuB,EAACL,OAAOE;AAC1C;AACAP,SAASW,WAAW,GAAG"}

package/lib-commonjs/components/FlatTree/FlatTree.types.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});

package/lib-commonjs/components/FlatTree/FlatTree.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":""}

package/lib-commonjs/components/FlatTree/index.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    renderFlatTree_unstable: ()=>_index.renderTree_unstable,
+    useFlatTreeContextValues_unstable: ()=>_index.useTreeContextValues_unstable
+});
+const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
+_exportStar(require("./FlatTree"), exports);
+_exportStar(require("./FlatTree.types"), exports);
+const _index = require("../Tree/index");
+_exportStar(require("./useHeadlessFlatTree"), exports);
+_exportStar(require("./useFlatTree"), exports);
+_exportStar(require("./useFlatTreeStyles.styles"), exports);

package/lib-commonjs/components/FlatTree/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.js"],"sourcesContent":["export * from './FlatTree';\nexport * from './FlatTree.types';\nexport { renderTree_unstable as renderFlatTree_unstable, useTreeContextValues_unstable as useFlatTreeContextValues_unstable } from '../Tree/index';\nexport * from './useHeadlessFlatTree';\nexport * from './useFlatTree';\nexport * from './useFlatTreeStyles.styles';\n"],"names":["renderFlatTree_unstable","renderTree_unstable","useFlatTreeContextValues_unstable","useTreeContextValues_unstable"],"mappings":";;;;;;;;;;;IAEgCA,uBAAuB,MAA9CC,0BAAmB;IAA8DC,iCAAiC,MAAlEC,oCAA6B;;;oBAFxE;oBACA;uBACqH;oBACrH;oBACA;oBACA"}

package/lib-commonjs/{hooks → components/FlatTree}/useFlatControllableCheckedItems.js

@@ -14,36 +14,23 @@ _export(exports, {
 });
 const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
 const _reactUtilities = require("@fluentui/react-utilities");
-const _immutableMap = require("../utils/ImmutableMap");
+const _immutableMap = require("../../utils/ImmutableMap");
 const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
-function initializeMap(iterable) {
-    const map = new Map();
-    if (iterable === undefined) {
-        return _immutableMap.ImmutableMap.empty;
-    }
-    for (const item of iterable){
-        if (Array.isArray(item)) {
-            map.set(item[0], item[1]);
-        } else {
-            map.set(item, true);
-        }
-    }
-    return _immutableMap.ImmutableMap.dangerouslyCreate_unstable(map);
-}
+const _createCheckedItems = require("../../utils/createCheckedItems");
 function useFlatControllableCheckedItems(props) {
     const [checkedItems, setCheckedItems] = (0, _reactUtilities.useControllableState)({
         initialState: _immutableMap.ImmutableMap.empty,
-        state: _react.useMemo(()=>props.checkedItems && initializeMap(props.checkedItems), [
+        state: _react.useMemo(()=>props.checkedItems && (0, _createCheckedItems.createCheckedItems)(props.checkedItems), [
             props.checkedItems
         ]),
-        defaultState: ()=>initializeMap(props.defaultCheckedItems)
+        defaultState: ()=>(0, _createCheckedItems.createCheckedItems)(props.defaultCheckedItems)
     });
     return [
         checkedItems,
         setCheckedItems
     ];
 }
-function createNextFlatCheckedItems(data, previousCheckedItems, flatTreeItems) {
+function createNextFlatCheckedItems(data, previousCheckedItems, virtualTree) {
     if (data.selectionMode === 'single') {
         return _immutableMap.ImmutableMap.create([
             [
@@ -52,28 +39,28 @@ function createNextFlatCheckedItems(data, previousCheckedItems, flatTreeItems) {
             ]
         ]);
     }
-    const treeItem = flatTreeItems.get(data.value);
+    const treeItem = virtualTree.get(data.value);
     if (!treeItem) {
         if (process.env.NODE_ENV !== 'production') {
             // eslint-disable-next-line no-console
-            console.error(`useFlatTree: tree item ${data.value} not found`);
+            console.error(`useHeadlessFlatTree: tree item ${data.value} not found`);
         }
         return previousCheckedItems;
     }
     const nextCheckedItems = new Map(previousCheckedItems);
-    for (const children of flatTreeItems.subtree(data.value)){
+    for (const children of virtualTree.subtree(data.value)){
         nextCheckedItems.set(children.value, data.checked);
     }
     nextCheckedItems.set(data.value, data.checked);
     let isAncestorsMixed = false;
-    for (const parent of flatTreeItems.ancestors(treeItem.value)){
+    for (const parent of virtualTree.ancestors(treeItem.value)){
         // if one parent is mixed, all ancestors are mixed
         if (isAncestorsMixed) {
             nextCheckedItems.set(parent.value, 'mixed');
             continue;
         }
         const checkedChildren = [];
-        for (const child of flatTreeItems.children(parent.value)){
+        for (const child of virtualTree.children(parent.value)){
             var _nextCheckedItems_get;
             if (((_nextCheckedItems_get = nextCheckedItems.get(child.value)) !== null && _nextCheckedItems_get !== void 0 ? _nextCheckedItems_get : false) === data.checked) {
                 checkedChildren.push(child);

package/lib-commonjs/components/FlatTree/useFlatControllableCheckedItems.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useFlatControllableCheckedItems.js"],"sourcesContent":["import { useControllableState } from '@fluentui/react-utilities';\nimport { ImmutableMap } from '../../utils/ImmutableMap';\nimport * as React from 'react';\nimport { createCheckedItems } from '../../utils/createCheckedItems';\nexport function useFlatControllableCheckedItems(props) {\n    const [checkedItems, setCheckedItems] = useControllableState({\n        initialState: ImmutableMap.empty,\n        state: React.useMemo(()=>props.checkedItems && createCheckedItems(props.checkedItems), [\n            props.checkedItems\n        ]),\n        defaultState: ()=>createCheckedItems(props.defaultCheckedItems)\n    });\n    return [\n        checkedItems,\n        setCheckedItems\n    ];\n}\nexport function createNextFlatCheckedItems(data, previousCheckedItems, virtualTree) {\n    if (data.selectionMode === 'single') {\n        return ImmutableMap.create([\n            [\n                data.value,\n                data.checked\n            ]\n        ]);\n    }\n    const treeItem = virtualTree.get(data.value);\n    if (!treeItem) {\n        if (process.env.NODE_ENV !== 'production') {\n            // eslint-disable-next-line no-console\n            console.error(`useHeadlessFlatTree: tree item ${data.value} not found`);\n        }\n        return previousCheckedItems;\n    }\n    const nextCheckedItems = new Map(previousCheckedItems);\n    for (const children of virtualTree.subtree(data.value)){\n        nextCheckedItems.set(children.value, data.checked);\n    }\n    nextCheckedItems.set(data.value, data.checked);\n    let isAncestorsMixed = false;\n    for (const parent of virtualTree.ancestors(treeItem.value)){\n        // if one parent is mixed, all ancestors are mixed\n        if (isAncestorsMixed) {\n            nextCheckedItems.set(parent.value, 'mixed');\n            continue;\n        }\n        const checkedChildren = [];\n        for (const child of virtualTree.children(parent.value)){\n            var _nextCheckedItems_get;\n            if (((_nextCheckedItems_get = nextCheckedItems.get(child.value)) !== null && _nextCheckedItems_get !== void 0 ? _nextCheckedItems_get : false) === data.checked) {\n                checkedChildren.push(child);\n            }\n        }\n        if (checkedChildren.length === parent.childrenValues.length) {\n            nextCheckedItems.set(parent.value, data.checked);\n        } else {\n            // if one parent is mixed, all ancestors are mixed\n            isAncestorsMixed = true;\n            nextCheckedItems.set(parent.value, 'mixed');\n        }\n    }\n    return ImmutableMap.dangerouslyCreate_unstable(nextCheckedItems);\n}\n"],"names":["useFlatControllableCheckedItems","createNextFlatCheckedItems","props","checkedItems","setCheckedItems","useControllableState","initialState","ImmutableMap","empty","state","React","useMemo","createCheckedItems","defaultState","defaultCheckedItems","data","previousCheckedItems","virtualTree","selectionMode","create","value","checked","treeItem","get","process","env","NODE_ENV","console","error","nextCheckedItems","Map","children","subtree","set","isAncestorsMixed","parent","ancestors","checkedChildren","child","_nextCheckedItems_get","push","length","childrenValues","dangerouslyCreate_unstable"],"mappings":";;;;;;;;;;;IAIgBA,+BAA+B,MAA/BA;IAaAC,0BAA0B,MAA1BA;;;gCAjBqB;8BACR;6DACN;oCACY;AAC5B,SAASD,gCAAgCE,KAAK,EAAE;IACnD,MAAM,CAACC,cAAcC,gBAAgB,GAAGC,IAAAA,oCAAoB,EAAC;QACzDC,cAAcC,0BAAY,CAACC,KAAK;QAChCC,OAAOC,OAAMC,OAAO,CAAC,IAAIT,MAAMC,YAAY,IAAIS,IAAAA,sCAAkB,EAACV,MAAMC,YAAY,GAAG;YACnFD,MAAMC,YAAY;SACrB;QACDU,cAAc,IAAID,IAAAA,sCAAkB,EAACV,MAAMY,mBAAmB;IAClE;IACA,OAAO;QACHX;QACAC;KACH;AACL;AACO,SAASH,2BAA2Bc,IAAI,EAAEC,oBAAoB,EAAEC,WAAW,EAAE;IAChF,IAAIF,KAAKG,aAAa,KAAK,UAAU;QACjC,OAAOX,0BAAY,CAACY,MAAM,CAAC;YACvB;gBACIJ,KAAKK,KAAK;gBACVL,KAAKM,OAAO;aACf;SACJ;IACL,CAAC;IACD,MAAMC,WAAWL,YAAYM,GAAG,CAACR,KAAKK,KAAK;IAC3C,IAAI,CAACE,UAAU;QACX,IAAIE,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;YACvC,sCAAsC;YACtCC,QAAQC,KAAK,CAAC,CAAC,+BAA+B,EAAEb,KAAKK,KAAK,CAAC,UAAU,CAAC;QAC1E,CAAC;QACD,OAAOJ;IACX,CAAC;IACD,MAAMa,mBAAmB,IAAIC,IAAId;IACjC,KAAK,MAAMe,YAAYd,YAAYe,OAAO,CAACjB,KAAKK,KAAK,EAAE;QACnDS,iBAAiBI,GAAG,CAACF,SAASX,KAAK,EAAEL,KAAKM,OAAO;IACrD;IACAQ,iBAAiBI,GAAG,CAAClB,KAAKK,KAAK,EAAEL,KAAKM,OAAO;IAC7C,IAAIa,mBAAmB,KAAK;IAC5B,KAAK,MAAMC,UAAUlB,YAAYmB,SAAS,CAACd,SAASF,KAAK,EAAE;QACvD,kDAAkD;QAClD,IAAIc,kBAAkB;YAClBL,iBAAiBI,GAAG,CAACE,OAAOf,KAAK,EAAE;YACnC,QAAS;QACb,CAAC;QACD,MAAMiB,kBAAkB,EAAE;QAC1B,KAAK,MAAMC,SAASrB,YAAYc,QAAQ,CAACI,OAAOf,KAAK,EAAE;YACnD,IAAImB;YACJ,IAAI,AAAC,CAAA,AAACA,CAAAA,wBAAwBV,iBAAiBN,GAAG,CAACe,MAAMlB,KAAK,CAAA,MAAO,IAAI,IAAImB,0BAA0B,KAAK,IAAIA,wBAAwB,KAAK,AAAD,MAAOxB,KAAKM,OAAO,EAAE;gBAC7JgB,gBAAgBG,IAAI,CAACF;YACzB,CAAC;QACL;QACA,IAAID,gBAAgBI,MAAM,KAAKN,OAAOO,cAAc,CAACD,MAAM,EAAE;YACzDZ,iBAAiBI,GAAG,CAACE,OAAOf,KAAK,EAAEL,KAAKM,OAAO;QACnD,OAAO;YACH,kDAAkD;YAClDa,mBAAmB,IAAI;YACvBL,iBAAiBI,GAAG,CAACE,OAAOf,KAAK,EAAE;QACvC,CAAC;IACL;IACA,OAAOb,0BAAY,CAACoC,0BAA0B,CAACd;AACnD"}

package/lib-commonjs/components/FlatTree/useFlatTree.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useFlatTree_unstable", {
+    enumerable: true,
+    get: ()=>useFlatTree_unstable
+});
+const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _useRootTree = require("../../hooks/useRootTree");
+const useFlatTree_unstable = _useRootTree.useRootTree;

package/lib-commonjs/components/FlatTree/useFlatTree.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useFlatTree.js"],"sourcesContent":["import * as React from 'react';\nimport { useRootTree } from '../../hooks/useRootTree';\nexport const useFlatTree_unstable = useRootTree;\n"],"names":["useFlatTree_unstable","useRootTree"],"mappings":";;;;+BAEaA;;aAAAA;;;6DAFU;6BACK;AACrB,MAAMA,uBAAuBC,wBAAW"}

package/lib-commonjs/{hooks → components/FlatTree}/useFlatTreeNavigation.js

@@ -8,13 +8,13 @@ Object.defineProperty(exports, "useFlatTreeNavigation", {
 });
 const _reactSharedContexts = require("@fluentui/react-shared-contexts");
 const _reactUtilities = require("@fluentui/react-utilities");
-const _nextTypeAheadElement = require("../utils/nextTypeAheadElement");
-const _tokens = require("../utils/tokens");
-const _treeItemFilter = require("../utils/treeItemFilter");
-const _useHTMLElementWalker = require("./useHTMLElementWalker");
-const _useRovingTabIndexes = require("./useRovingTabIndexes");
-const _getTreeItemValueFromElement = require("../utils/getTreeItemValueFromElement");
-function useFlatTreeNavigation(flatTreeItems) {
+const _nextTypeAheadElement = require("../../utils/nextTypeAheadElement");
+const _tokens = require("../../utils/tokens");
+const _treeItemFilter = require("../../utils/treeItemFilter");
+const _useHTMLElementWalker = require("../../hooks/useHTMLElementWalker");
+const _useRovingTabIndexes = require("../../hooks/useRovingTabIndexes");
+const _getTreeItemValueFromElement = require("../../utils/getTreeItemValueFromElement");
+function useFlatTreeNavigation(virtualTree) {
     const { targetDocument  } = (0, _reactSharedContexts.useFluent_unstable)();
     const [treeItemWalkerRef, treeItemWalkerRootRef] = (0, _useHTMLElementWalker.useHTMLElementWalkerRef)(_treeItemFilter.treeItemFilter);
     const [{ rove  }, rovingRootRef] = (0, _useRovingTabIndexes.useRovingTabIndex)(_treeItemFilter.treeItemFilter);
@@ -30,7 +30,7 @@ function useFlatTreeNavigation(flatTreeItems) {
                 treeItemWalker.currentElement = data.target;
                 return (0, _nextTypeAheadElement.nextTypeAheadElement)(treeItemWalker, data.event.key);
             case _tokens.treeDataTypes.ArrowLeft:
-                return parentElement(flatTreeItems, data.target, treeItemWalker);
+                return parentElement(virtualTree, data.target, treeItemWalker);
             case _tokens.treeDataTypes.ArrowRight:
                 treeItemWalker.currentElement = data.target;
                 return firstChild(data.target, treeItemWalker);
@@ -72,14 +72,14 @@ function firstChild(target, treeWalker) {
     }
     return null;
 }
-function parentElement(flatTreeItems, target, treeWalker) {
+function parentElement(virtualTreeItems, target, treeWalker) {
     const value = (0, _getTreeItemValueFromElement.getTreeItemValueFromElement)(target);
     if (value === null) {
         return null;
     }
-    const flatTreeItem = flatTreeItems.get(value);
-    if (flatTreeItem === null || flatTreeItem === void 0 ? void 0 : flatTreeItem.parentValue) {
-        return treeWalker.root.querySelector(`[${_getTreeItemValueFromElement.dataTreeItemValueAttrName}="${flatTreeItem.parentValue}"]`);
+    const virtualTreeItem = virtualTreeItems.get(value);
+    if (virtualTreeItem === null || virtualTreeItem === void 0 ? void 0 : virtualTreeItem.parentValue) {
+        return treeWalker.root.querySelector(`[${_getTreeItemValueFromElement.dataTreeItemValueAttrName}="${virtualTreeItem.parentValue}"]`);
     }
     return null;
 }

package/lib-commonjs/components/FlatTree/useFlatTreeNavigation.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useFlatTreeNavigation.js"],"sourcesContent":["import { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { nextTypeAheadElement } from '../../utils/nextTypeAheadElement';\nimport { treeDataTypes } from '../../utils/tokens';\nimport { treeItemFilter } from '../../utils/treeItemFilter';\nimport { useHTMLElementWalkerRef } from '../../hooks/useHTMLElementWalker';\nimport { useRovingTabIndex } from '../../hooks/useRovingTabIndexes';\nimport { dataTreeItemValueAttrName, getTreeItemValueFromElement } from '../../utils/getTreeItemValueFromElement';\nexport function useFlatTreeNavigation(virtualTree) {\n    const { targetDocument  } = useFluent_unstable();\n    const [treeItemWalkerRef, treeItemWalkerRootRef] = useHTMLElementWalkerRef(treeItemFilter);\n    const [{ rove  }, rovingRootRef] = useRovingTabIndex(treeItemFilter);\n    function getNextElement(data) {\n        if (!targetDocument || !treeItemWalkerRef.current) {\n            return null;\n        }\n        const treeItemWalker = treeItemWalkerRef.current;\n        switch(data.type){\n            case treeDataTypes.Click:\n                return data.target;\n            case treeDataTypes.TypeAhead:\n                treeItemWalker.currentElement = data.target;\n                return nextTypeAheadElement(treeItemWalker, data.event.key);\n            case treeDataTypes.ArrowLeft:\n                return parentElement(virtualTree, data.target, treeItemWalker);\n            case treeDataTypes.ArrowRight:\n                treeItemWalker.currentElement = data.target;\n                return firstChild(data.target, treeItemWalker);\n            case treeDataTypes.End:\n                treeItemWalker.currentElement = treeItemWalker.root;\n                return treeItemWalker.lastChild();\n            case treeDataTypes.Home:\n                treeItemWalker.currentElement = treeItemWalker.root;\n                return treeItemWalker.firstChild();\n            case treeDataTypes.ArrowDown:\n                treeItemWalker.currentElement = data.target;\n                return treeItemWalker.nextElement();\n            case treeDataTypes.ArrowUp:\n                treeItemWalker.currentElement = data.target;\n                return treeItemWalker.previousElement();\n        }\n    }\n    const navigate = useEventCallback((data)=>{\n        const nextElement = getNextElement(data);\n        if (nextElement) {\n            rove(nextElement);\n        }\n    });\n    return [\n        navigate,\n        useMergedRefs(treeItemWalkerRootRef, rovingRootRef)\n    ];\n}\nfunction firstChild(target, treeWalker) {\n    const nextElement = treeWalker.nextElement();\n    if (!nextElement) {\n        return null;\n    }\n    const nextElementAriaPosInSet = nextElement.getAttribute('aria-posinset');\n    const nextElementAriaLevel = nextElement.getAttribute('aria-level');\n    const targetAriaLevel = target.getAttribute('aria-level');\n    if (nextElementAriaPosInSet === '1' && Number(nextElementAriaLevel) === Number(targetAriaLevel) + 1) {\n        return nextElement;\n    }\n    return null;\n}\nfunction parentElement(virtualTreeItems, target, treeWalker) {\n    const value = getTreeItemValueFromElement(target);\n    if (value === null) {\n        return null;\n    }\n    const virtualTreeItem = virtualTreeItems.get(value);\n    if (virtualTreeItem === null || virtualTreeItem === void 0 ? void 0 : virtualTreeItem.parentValue) {\n        return treeWalker.root.querySelector(`[${dataTreeItemValueAttrName}=\"${virtualTreeItem.parentValue}\"]`);\n    }\n    return null;\n}\n"],"names":["useFlatTreeNavigation","virtualTree","targetDocument","useFluent_unstable","treeItemWalkerRef","treeItemWalkerRootRef","useHTMLElementWalkerRef","treeItemFilter","rove","rovingRootRef","useRovingTabIndex","getNextElement","data","current","treeItemWalker","type","treeDataTypes","Click","target","TypeAhead","currentElement","nextTypeAheadElement","event","key","ArrowLeft","parentElement","ArrowRight","firstChild","End","root","lastChild","Home","ArrowDown","nextElement","ArrowUp","previousElement","navigate","useEventCallback","useMergedRefs","treeWalker","nextElementAriaPosInSet","getAttribute","nextElementAriaLevel","targetAriaLevel","Number","virtualTreeItems","value","getTreeItemValueFromElement","virtualTreeItem","get","parentValue","querySelector","dataTreeItemValueAttrName"],"mappings":"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"}

package/lib-commonjs/components/FlatTree/useFlatTreeStyles.styles.js

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    flatTreeClassNames: ()=>flatTreeClassNames,
+    useFlatTreeStyles_unstable: ()=>useFlatTreeStyles_unstable
+});
+const _react = require("@griffel/react");
+const flatTreeClassNames = {
+    root: 'fui-FlatTree'
+};
+const useStyles = /*#__PURE__*/ (0, _react["__styles"])({
+    root: {
+        mc9l5x: "f22iagw",
+        Beiy3e4: "f1vx9l62",
+        Belr9w4: "f1j0q4x9"
+    },
+    subtree: {
+        Bh6795r: "fqerorx",
+        Bnnss6s: "f1neuvcm",
+        xawz: "f1s4axba",
+        Ijaq50: "f1na4k6z",
+        Br312pm: "fwt6ga",
+        nk6f5a: "fi45nfw",
+        Bw0ie65: "f10ort2y"
+    }
+}, {
+    d: [
+        ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}",
+        ".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}",
+        ".f1j0q4x9{row-gap:var(--spacingVerticalXXS);}",
+        ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}",
+        ".f1neuvcm{-webkit-flex-shrink:1;-ms-flex-negative:1;flex-shrink:1;}",
+        ".f1s4axba{-webkit-flex-basis:100%;-ms-flex-preferred-size:100%;flex-basis:100%;}",
+        ".f1na4k6z{-ms-grid-row:subtree;grid-row-start:subtree;}",
+        ".fwt6ga{-ms-grid-column:subtree;grid-column-start:subtree;}",
+        ".fi45nfw{-ms-grid-row-span:subtree;grid-row-end:subtree;}",
+        ".f10ort2y{-ms-grid-column-span:subtree;grid-column-end:subtree;}"
+    ]
+});
+const useFlatTreeStyles_unstable = (state)=>{
+    const styles = useStyles();
+    const isSubTree = state.level > 0;
+    state.root.className = (0, _react.mergeClasses)(flatTreeClassNames.root, styles.root, isSubTree && styles.subtree, state.root.className);
+    return state;
+}; //# sourceMappingURL=useFlatTreeStyles.styles.js.map

package/lib-commonjs/components/FlatTree/useFlatTreeStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useFlatTreeStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const flatTreeClassNames = {\n  root: 'fui-FlatTree'\n};\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    mc9l5x: \"f22iagw\",\n    Beiy3e4: \"f1vx9l62\",\n    Belr9w4: \"f1j0q4x9\"\n  },\n  subtree: {\n    Bh6795r: \"fqerorx\",\n    Bnnss6s: \"f1neuvcm\",\n    xawz: \"f1s4axba\",\n    Ijaq50: \"f1na4k6z\",\n    Br312pm: \"fwt6ga\",\n    nk6f5a: \"fi45nfw\",\n    Bw0ie65: \"f10ort2y\"\n  }\n}, {\n  d: [\".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}\", \".f1j0q4x9{row-gap:var(--spacingVerticalXXS);}\", \".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}\", \".f1neuvcm{-webkit-flex-shrink:1;-ms-flex-negative:1;flex-shrink:1;}\", \".f1s4axba{-webkit-flex-basis:100%;-ms-flex-preferred-size:100%;flex-basis:100%;}\", \".f1na4k6z{-ms-grid-row:subtree;grid-row-start:subtree;}\", \".fwt6ga{-ms-grid-column:subtree;grid-column-start:subtree;}\", \".fi45nfw{-ms-grid-row-span:subtree;grid-row-end:subtree;}\", \".f10ort2y{-ms-grid-column-span:subtree;grid-column-end:subtree;}\"]\n});\nexport const useFlatTreeStyles_unstable = state => {\n  const styles = useStyles();\n  const isSubTree = state.level > 0;\n  state.root.className = mergeClasses(flatTreeClassNames.root, styles.root, isSubTree && styles.subtree, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useFlatTreeStyles.styles.js.map"],"names":["flatTreeClassNames","useFlatTreeStyles_unstable","root","useStyles","__styles","mc9l5x","Beiy3e4","Belr9w4","subtree","Bh6795r","Bnnss6s","xawz","Ijaq50","Br312pm","nk6f5a","Bw0ie65","d","state","styles","isSubTree","level","className","mergeClasses"],"mappings":";;;;;;;;;;;IAEaA,kBAAkB,MAAlBA;IAqBAC,0BAA0B,MAA1BA;;uBAvBsC;AAE5C,MAAMD,qBAAqB;IAChCE,MAAM;AACR;AACA,MAAMC,YAAY,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACtCF,MAAM;QACJG,QAAQ;QACRC,SAAS;QACTC,SAAS;IACX;IACAC,SAAS;QACPC,SAAS;QACTC,SAAS;QACTC,MAAM;QACNC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,SAAS;IACX;AACF,GAAG;IACDC,GAAG;QAAC;QAAwF;QAA6F;QAAiD;QAAqF;QAAuE;QAAoF;QAA2D;QAA+D;QAA6D;KAAmE;AACttB;AACO,MAAMf,6BAA6BgB,CAAAA,QAAS;IACjD,MAAMC,SAASf;IACf,MAAMgB,YAAYF,MAAMG,KAAK,GAAG;IAChCH,MAAMf,IAAI,CAACmB,SAAS,GAAGC,IAAAA,mBAAY,EAACtB,mBAAmBE,IAAI,EAAEgB,OAAOhB,IAAI,EAAEiB,aAAaD,OAAOV,OAAO,EAAES,MAAMf,IAAI,CAACmB,SAAS;IAC3H,OAAOJ;AACT,GACA,oDAAoD"}

package/lib-commonjs/{hooks/useFlatTree.js → components/FlatTree/useHeadlessFlatTree.js}

@@ -2,21 +2,21 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-Object.defineProperty(exports, "useFlatTree_unstable", {
+Object.defineProperty(exports, "useHeadlessFlatTree_unstable", {
     enumerable: true,
-    get: ()=>useFlatTree_unstable
+    get: ()=>useHeadlessFlatTree_unstable
 });
 const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
 const _reactUtilities = require("@fluentui/react-utilities");
 const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
-const _createFlatTreeItems = require("../utils/createFlatTreeItems");
-const _tokens = require("../utils/tokens");
+const _createHeadlessTree = require("../../utils/createHeadlessTree");
+const _tokens = require("../../utils/tokens");
 const _useFlatTreeNavigation = require("./useFlatTreeNavigation");
-const _useControllableOpenItems = require("./useControllableOpenItems");
-const _getTreeItemValueFromElement = require("../utils/getTreeItemValueFromElement");
+const _useControllableOpenItems = require("../../hooks/useControllableOpenItems");
+const _getTreeItemValueFromElement = require("../../utils/getTreeItemValueFromElement");
 const _useFlatControllableCheckedItems = require("./useFlatControllableCheckedItems");
-function useFlatTree_unstable(flatTreeItemProps, options = {}) {
-    const flatTreeItems = _react.useMemo(()=>(0, _createFlatTreeItems.createFlatTreeItems)(flatTreeItemProps), [
+function useHeadlessFlatTree_unstable(flatTreeItemProps, options = {}) {
+    const flatTreeItems = _react.useMemo(()=>(0, _createHeadlessTree.createHeadlessTree)(flatTreeItemProps), [
         flatTreeItemProps
     ]);
     const [openItems, setOpenItems] = (0, _useControllableOpenItems.useControllableOpenItems)(options);
@@ -26,10 +26,7 @@ function useFlatTree_unstable(flatTreeItemProps, options = {}) {
     const handleOpenChange = (0, _reactUtilities.useEventCallback)((event, data)=>{
         var _options_onOpenChange;
         (_options_onOpenChange = options.onOpenChange) === null || _options_onOpenChange === void 0 ? void 0 : _options_onOpenChange.call(options, event, data);
-        if (!event.isDefaultPrevented()) {
-            setOpenItems((0, _useControllableOpenItems.createNextOpenItems)(data, openItems));
-        }
-        event.preventDefault();
+        setOpenItems((0, _useControllableOpenItems.createNextOpenItems)(data, openItems));
     });
     const handleCheckedChange = (0, _reactUtilities.useEventCallback)((event, data)=>{
         var _options_onCheckedChange;
@@ -39,10 +36,7 @@ function useFlatTree_unstable(flatTreeItemProps, options = {}) {
     const handleNavigation = (0, _reactUtilities.useEventCallback)((event, data)=>{
         var _options_onNavigation_unstable;
         (_options_onNavigation_unstable = options.onNavigation_unstable) === null || _options_onNavigation_unstable === void 0 ? void 0 : _options_onNavigation_unstable.call(options, event, data);
-        if (!event.isDefaultPrevented()) {
-            navigate(data);
-        }
-        event.preventDefault();
+        navigate(data);
     });
     const getNextNavigableItem = (0, _reactUtilities.useEventCallback)((visibleItems, data)=>{
         const item = flatTreeItems.get(data.value);

package/lib-commonjs/components/FlatTree/useHeadlessFlatTree.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useHeadlessFlatTree.js"],"sourcesContent":["import { useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { createHeadlessTree } from '../../utils/createHeadlessTree';\nimport { treeDataTypes } from '../../utils/tokens';\nimport { useFlatTreeNavigation } from './useFlatTreeNavigation';\nimport { createNextOpenItems, useControllableOpenItems } from '../../hooks/useControllableOpenItems';\nimport { dataTreeItemValueAttrName } from '../../utils/getTreeItemValueFromElement';\nimport { createNextFlatCheckedItems, useFlatControllableCheckedItems } from './useFlatControllableCheckedItems';\n/**\n * this hook provides FlatTree API to manage all required mechanisms to convert a list of items into renderable TreeItems\n * in multiple scenarios including virtualization.\n *\n * !!A flat tree is an unofficial spec for tree!!\n *\n * It should be used on cases where more complex interactions with a Tree is required.\n * On simple scenarios it is advised to simply use a nested structure instead.\n *\n * @param flatTreeItemProps - a list of tree items\n * @param options - in case control over the internal openItems is required\n */ export function useHeadlessFlatTree_unstable(flatTreeItemProps, options = {}) {\n    const flatTreeItems = React.useMemo(()=>createHeadlessTree(flatTreeItemProps), [\n        flatTreeItemProps\n    ]);\n    const [openItems, setOpenItems] = useControllableOpenItems(options);\n    const [checkedItems, setCheckedItems] = useFlatControllableCheckedItems(options);\n    const [navigate, navigationRef] = useFlatTreeNavigation(flatTreeItems);\n    const treeRef = React.useRef(null);\n    const handleOpenChange = useEventCallback((event, data)=>{\n        var _options_onOpenChange;\n        (_options_onOpenChange = options.onOpenChange) === null || _options_onOpenChange === void 0 ? void 0 : _options_onOpenChange.call(options, event, data);\n        setOpenItems(createNextOpenItems(data, openItems));\n    });\n    const handleCheckedChange = useEventCallback((event, data)=>{\n        var _options_onCheckedChange;\n        (_options_onCheckedChange = options.onCheckedChange) === null || _options_onCheckedChange === void 0 ? void 0 : _options_onCheckedChange.call(options, event, data);\n        setCheckedItems(createNextFlatCheckedItems(data, checkedItems, flatTreeItems));\n    });\n    const handleNavigation = useEventCallback((event, data)=>{\n        var _options_onNavigation_unstable;\n        (_options_onNavigation_unstable = options.onNavigation_unstable) === null || _options_onNavigation_unstable === void 0 ? void 0 : _options_onNavigation_unstable.call(options, event, data);\n        navigate(data);\n    });\n    const getNextNavigableItem = useEventCallback((visibleItems, data)=>{\n        const item = flatTreeItems.get(data.value);\n        if (item) {\n            switch(data.type){\n                case treeDataTypes.TypeAhead:\n                    return item;\n                case treeDataTypes.ArrowLeft:\n                    return flatTreeItems.get(item.parentValue);\n                case treeDataTypes.ArrowRight:\n                    return visibleItems[item.index + 1];\n                case treeDataTypes.End:\n                    return visibleItems[visibleItems.length - 1];\n                case treeDataTypes.Home:\n                    return visibleItems[0];\n                case treeDataTypes.ArrowDown:\n                    return visibleItems[item.index + 1];\n                case treeDataTypes.ArrowUp:\n                    return visibleItems[item.index - 1];\n            }\n        }\n    });\n    const getElementFromItem = React.useCallback((item)=>{\n        var _treeRef_current;\n        return (_treeRef_current = treeRef.current) === null || _treeRef_current === void 0 ? void 0 : _treeRef_current.querySelector(`[${dataTreeItemValueAttrName}=\"${item.value}\"]`);\n    }, []);\n    const ref = useMergedRefs(treeRef, navigationRef);\n    const getTreeProps = React.useCallback(()=>({\n            ref,\n            openItems,\n            selectionMode: options.selectionMode,\n            checkedItems,\n            onOpenChange: handleOpenChange,\n            onCheckedChange: handleCheckedChange,\n            // eslint-disable-next-line @typescript-eslint/naming-convention\n            onNavigation_unstable: handleNavigation\n        }), // eslint-disable-next-line react-hooks/exhaustive-deps\n    [\n        openItems,\n        checkedItems\n    ]);\n    const items = React.useCallback(()=>flatTreeItems.visibleItems(openItems), [\n        openItems,\n        flatTreeItems\n    ]);\n    return React.useMemo(()=>({\n            navigate,\n            getTreeProps,\n            getNextNavigableItem,\n            getElementFromItem,\n            items\n        }), [\n        navigate,\n        getTreeProps,\n        getNextNavigableItem,\n        getElementFromItem,\n        items\n    ]);\n}\n"],"names":["useHeadlessFlatTree_unstable","flatTreeItemProps","options","flatTreeItems","React","useMemo","createHeadlessTree","openItems","setOpenItems","useControllableOpenItems","checkedItems","setCheckedItems","useFlatControllableCheckedItems","navigate","navigationRef","useFlatTreeNavigation","treeRef","useRef","handleOpenChange","useEventCallback","event","data","_options_onOpenChange","onOpenChange","call","createNextOpenItems","handleCheckedChange","_options_onCheckedChange","onCheckedChange","createNextFlatCheckedItems","handleNavigation","_options_onNavigation_unstable","onNavigation_unstable","getNextNavigableItem","visibleItems","item","get","value","type","treeDataTypes","TypeAhead","ArrowLeft","parentValue","ArrowRight","index","End","length","Home","ArrowDown","ArrowUp","getElementFromItem","useCallback","_treeRef_current","current","querySelector","dataTreeItemValueAttrName","ref","useMergedRefs","getTreeProps","selectionMode","items"],"mappings":";;;;+BAmBoBA;;aAAAA;;;gCAnB4B;6DACzB;oCACY;wBACL;uCACQ;0CACwB;6CACpB;iDACkC;AAYjE,SAASA,6BAA6BC,iBAAiB,EAAEC,UAAU,CAAC,CAAC,EAAE;IAC9E,MAAMC,gBAAgBC,OAAMC,OAAO,CAAC,IAAIC,IAAAA,sCAAkB,EAACL,oBAAoB;QAC3EA;KACH;IACD,MAAM,CAACM,WAAWC,aAAa,GAAGC,IAAAA,kDAAwB,EAACP;IAC3D,MAAM,CAACQ,cAAcC,gBAAgB,GAAGC,IAAAA,gEAA+B,EAACV;IACxE,MAAM,CAACW,UAAUC,cAAc,GAAGC,IAAAA,4CAAqB,EAACZ;IACxD,MAAMa,UAAUZ,OAAMa,MAAM,CAAC,IAAI;IACjC,MAAMC,mBAAmBC,IAAAA,gCAAgB,EAAC,CAACC,OAAOC,OAAO;QACrD,IAAIC;QACHA,CAAAA,wBAAwBpB,QAAQqB,YAAY,AAAD,MAAO,IAAI,IAAID,0BAA0B,KAAK,IAAI,KAAK,IAAIA,sBAAsBE,IAAI,CAACtB,SAASkB,OAAOC,KAAK;QACvJb,aAAaiB,IAAAA,6CAAmB,EAACJ,MAAMd;IAC3C;IACA,MAAMmB,sBAAsBP,IAAAA,gCAAgB,EAAC,CAACC,OAAOC,OAAO;QACxD,IAAIM;QACHA,CAAAA,2BAA2BzB,QAAQ0B,eAAe,AAAD,MAAO,IAAI,IAAID,6BAA6B,KAAK,IAAI,KAAK,IAAIA,yBAAyBH,IAAI,CAACtB,SAASkB,OAAOC,KAAK;QACnKV,gBAAgBkB,IAAAA,2DAA0B,EAACR,MAAMX,cAAcP;IACnE;IACA,MAAM2B,mBAAmBX,IAAAA,gCAAgB,EAAC,CAACC,OAAOC,OAAO;QACrD,IAAIU;QACHA,CAAAA,iCAAiC7B,QAAQ8B,qBAAqB,AAAD,MAAO,IAAI,IAAID,mCAAmC,KAAK,IAAI,KAAK,IAAIA,+BAA+BP,IAAI,CAACtB,SAASkB,OAAOC,KAAK;QAC3LR,SAASQ;IACb;IACA,MAAMY,uBAAuBd,IAAAA,gCAAgB,EAAC,CAACe,cAAcb,OAAO;QAChE,MAAMc,OAAOhC,cAAciC,GAAG,CAACf,KAAKgB,KAAK;QACzC,IAAIF,MAAM;YACN,OAAOd,KAAKiB,IAAI;gBACZ,KAAKC,qBAAa,CAACC,SAAS;oBACxB,OAAOL;gBACX,KAAKI,qBAAa,CAACE,SAAS;oBACxB,OAAOtC,cAAciC,GAAG,CAACD,KAAKO,WAAW;gBAC7C,KAAKH,qBAAa,CAACI,UAAU;oBACzB,OAAOT,YAAY,CAACC,KAAKS,KAAK,GAAG,EAAE;gBACvC,KAAKL,qBAAa,CAACM,GAAG;oBAClB,OAAOX,YAAY,CAACA,aAAaY,MAAM,GAAG,EAAE;gBAChD,KAAKP,qBAAa,CAACQ,IAAI;oBACnB,OAAOb,YAAY,CAAC,EAAE;gBAC1B,KAAKK,qBAAa,CAACS,SAAS;oBACxB,OAAOd,YAAY,CAACC,KAAKS,KAAK,GAAG,EAAE;gBACvC,KAAKL,qBAAa,CAACU,OAAO;oBACtB,OAAOf,YAAY,CAACC,KAAKS,KAAK,GAAG,EAAE;YAC3C;QACJ,CAAC;IACL;IACA,MAAMM,qBAAqB9C,OAAM+C,WAAW,CAAC,CAAChB,OAAO;QACjD,IAAIiB;QACJ,OAAO,AAACA,CAAAA,mBAAmBpC,QAAQqC,OAAO,AAAD,MAAO,IAAI,IAAID,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBE,aAAa,CAAC,CAAC,CAAC,EAAEC,sDAAyB,CAAC,EAAE,EAAEpB,KAAKE,KAAK,CAAC,EAAE,CAAC,CAAC;IACnL,GAAG,EAAE;IACL,MAAMmB,MAAMC,IAAAA,6BAAa,EAACzC,SAASF;IACnC,MAAM4C,eAAetD,OAAM+C,WAAW,CAAC,IAAK,CAAA;YACpCK;YACAjD;YACAoD,eAAezD,QAAQyD,aAAa;YACpCjD;YACAa,cAAcL;YACdU,iBAAiBF;YACjB,gEAAgE;YAChEM,uBAAuBF;QAC3B,CAAA,GACJ;QACIvB;QACAG;KACH;IACD,MAAMkD,QAAQxD,OAAM+C,WAAW,CAAC,IAAIhD,cAAc+B,YAAY,CAAC3B,YAAY;QACvEA;QACAJ;KACH;IACD,OAAOC,OAAMC,OAAO,CAAC,IAAK,CAAA;YAClBQ;YACA6C;YACAzB;YACAiB;YACAU;QACJ,CAAA,GAAI;QACJ/C;QACA6C;QACAzB;QACAiB;QACAU;KACH;AACL"}

package/lib-commonjs/components/Tree/Tree.js

@@ -9,13 +9,13 @@ Object.defineProperty(exports, "Tree", {
 const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
 const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
 const _useTree = require("./useTree");
-const _renderTree = require("./renderTree");
-const _useTreeStylesStyles = require("./useTreeStyles.styles");
 const _useTreeContextValues = require("./useTreeContextValues");
+const _useTreeStylesStyles = require("./useTreeStyles.styles");
+const _renderTree = require("./renderTree");
 const Tree = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
     const state = (0, _useTree.useTree_unstable)(props, ref);
-    (0, _useTreeStylesStyles.useTreeStyles_unstable)(state);
     const contextValues = (0, _useTreeContextValues.useTreeContextValues_unstable)(state);
+    (0, _useTreeStylesStyles.useTreeStyles_unstable)(state);
     return (0, _renderTree.renderTree_unstable)(state, contextValues);
 });
 Tree.displayName = 'Tree';

package/lib-commonjs/components/Tree/Tree.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Tree.js"],"sourcesContent":["import * as React from 'react';\nimport { useTree_unstable } from './useTree';\nimport { renderTree_unstable } from './renderTree';\nimport { useTreeStyles_unstable } from './useTreeStyles.styles';\nimport { useTreeContextValues_unstable } from './useTreeContextValues';\n/**\n * A tree view widget presents a hierarchical list.\n * Any item in the hierarchy may have child items,\n * and items that have children may be expanded or collapsed to show or hide the children.\n * For example, in a file system navigator that uses a tree view to display folders and files,\n * an item representing a folder can be expanded to reveal the contents of the folder,\n * which may be files, folders, or both.\n */ export const Tree = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n    const state = useTree_unstable(props, ref);\n    useTreeStyles_unstable(state);\n    const contextValues = useTreeContextValues_unstable(state);\n    return renderTree_unstable(state, contextValues);\n});\nTree.displayName = 'Tree';\n"],"names":["Tree","React","forwardRef","props","ref","state","useTree_unstable","useTreeStyles_unstable","contextValues","useTreeContextValues_unstable","renderTree_unstable","displayName"],"mappings":";;;;+BAYiBA;;aAAAA;;;6DAZM;yBACU;4BACG;qCACG;sCACO;AAQnC,MAAMA,OAAO,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAM;IACjE,MAAMC,QAAQC,IAAAA,yBAAgB,EAACH,OAAOC;IACtCG,IAAAA,2CAAsB,EAACF;IACvB,MAAMG,gBAAgBC,IAAAA,mDAA6B,EAACJ;IACpD,OAAOK,IAAAA,+BAAmB,EAACL,OAAOG;AACtC;AACAR,KAAKW,WAAW,GAAG"}
+{"version":3,"sources":["Tree.js"],"sourcesContent":["import * as React from 'react';\nimport { useTree_unstable } from './useTree';\nimport { useTreeContextValues_unstable } from './useTreeContextValues';\nimport { useTreeStyles_unstable } from './useTreeStyles.styles';\nimport { renderTree_unstable } from './renderTree';\n/**\n * Tree component - TODO: add more docs\n */ export const Tree = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n    const state = useTree_unstable(props, ref);\n    const contextValues = useTreeContextValues_unstable(state);\n    useTreeStyles_unstable(state);\n    return renderTree_unstable(state, contextValues);\n});\nTree.displayName = 'Tree';\n"],"names":["Tree","React","forwardRef","props","ref","state","useTree_unstable","contextValues","useTreeContextValues_unstable","useTreeStyles_unstable","renderTree_unstable","displayName"],"mappings":";;;;+BAOiBA;;aAAAA;;;6DAPM;yBACU;sCACa;qCACP;4BACH;AAGzB,MAAMA,OAAO,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAM;IACjE,MAAMC,QAAQC,IAAAA,yBAAgB,EAACH,OAAOC;IACtC,MAAMG,gBAAgBC,IAAAA,mDAA6B,EAACH;IACpDI,IAAAA,2CAAsB,EAACJ;IACvB,OAAOK,IAAAA,+BAAmB,EAACL,OAAOE;AACtC;AACAP,KAAKW,WAAW,GAAG"}

package/lib-commonjs/components/Tree/index.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
 _exportStar(require("./Tree"), exports);
 _exportStar(require("./Tree.types"), exports);
-_exportStar(require("./renderTree"), exports);
 _exportStar(require("./useTree"), exports);
-_exportStar(require("./useTreeStyles.styles"), exports);
 _exportStar(require("./useTreeContextValues"), exports);
+_exportStar(require("./useTreeStyles.styles"), exports);
+_exportStar(require("./renderTree"), exports);

package/lib-commonjs/components/Tree/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.js"],"sourcesContent":["export * from './Tree';\nexport * from './Tree.types';\nexport * from './renderTree';\nexport * from './useTree';\nexport * from './useTreeStyles.styles';\nexport * from './useTreeContextValues';\n"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;oBACA"}
+{"version":3,"sources":["index.js"],"sourcesContent":["export * from './Tree';\nexport * from './Tree.types';\nexport * from './useTree';\nexport * from './useTreeContextValues';\nexport * from './useTreeStyles.styles';\nexport * from './renderTree';\n"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;oBACA"}

package/lib-commonjs/{hooks/useNestedControllableCheckedItems.js → components/Tree/useControllableCheckedItems.js}

@@ -2,35 +2,22 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-Object.defineProperty(exports, "useNestedControllableCheckedItems", {
+Object.defineProperty(exports, "useControllableCheckedItems", {
     enumerable: true,
-    get: ()=>useNestedControllableCheckedItems
+    get: ()=>useControllableCheckedItems
 });
 const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
 const _reactUtilities = require("@fluentui/react-utilities");
 const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
-const _immutableMap = require("../utils/ImmutableMap");
-function initializeMap(iterable) {
-    const map = new Map();
-    if (iterable === undefined) {
-        return _immutableMap.ImmutableMap.empty;
-    }
-    for (const item of iterable){
-        if (Array.isArray(item)) {
-            map.set(item[0], item[1]);
-        } else {
-            map.set(item, true);
-        }
-    }
-    return _immutableMap.ImmutableMap.dangerouslyCreate_unstable(map);
-}
-function useNestedControllableCheckedItems(props) {
+const _immutableMap = require("../../utils/ImmutableMap");
+const _createCheckedItems = require("../../utils/createCheckedItems");
+function useControllableCheckedItems(props) {
     return (0, _reactUtilities.useControllableState)({
         initialState: _immutableMap.ImmutableMap.empty,
-        state: _react.useMemo(()=>props.checkedItems && initializeMap(props.checkedItems), [
+        state: _react.useMemo(()=>props.checkedItems && (0, _createCheckedItems.createCheckedItems)(props.checkedItems), [
             props.checkedItems
         ]),
-        defaultState: ()=>initializeMap(props.defaultCheckedItems)
+        defaultState: ()=>(0, _createCheckedItems.createCheckedItems)(props.defaultCheckedItems)
     });
 } // export function useCheckedItemsState(props: Pick<TreeProps, 'checkedItems' | 'defaultCheckedItems' | 'selectionMode'>) {
  //   const [walkerRef, rootRef] = useHTMLElementWalkerRef(treeItemFilter);

package/lib-commonjs/components/Tree/useControllableCheckedItems.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useControllableCheckedItems.js"],"sourcesContent":["import { useControllableState } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { ImmutableMap } from '../../utils/ImmutableMap';\nimport { createCheckedItems } from '../../utils/createCheckedItems';\nexport function useControllableCheckedItems(props) {\n    return useControllableState({\n        initialState: ImmutableMap.empty,\n        state: React.useMemo(()=>props.checkedItems && createCheckedItems(props.checkedItems), [\n            props.checkedItems\n        ]),\n        defaultState: ()=>createCheckedItems(props.defaultCheckedItems)\n    });\n} // export function useCheckedItemsState(props: Pick<TreeProps, 'checkedItems' | 'defaultCheckedItems' | 'selectionMode'>) {\n //   const [walkerRef, rootRef] = useHTMLElementWalkerRef(treeItemFilter);\n //   const selections = React.useMemo(() => initializeSelection(props.checkedItems ?? []), [props.checkedItems]);\n //   const defaultSelections = React.useMemo(\n //     () => initializeSelection(props.defaultCheckedItems ?? []),\n //     [props.defaultCheckedItems],\n //   );\n //   const [checkedSelection, checkedSelectionManager] = useSelection<TreeItemValue>({\n //     selectionMode: props.selectionMode ?? 'single',\n //     selectedItems: selections.checkedSelection,\n //     defaultSelectedItems: defaultSelections.checkedSelection,\n //   });\n //   const [mixedSelection, setMixedSelection] = useControllableState({\n //     initialState: ImmutableSet.empty,\n //     defaultState: React.useMemo(\n //       () => ImmutableSet.create(defaultSelections.mixedSelection),\n //       [defaultSelections.mixedSelection],\n //     ),\n //     state: React.useMemo(() => ImmutableSet.create(selections.mixedSelection), [selections.mixedSelection]),\n //   });\n //   const updateCheckedItems = useEventCallback((data: TreeCheckedChangeData) => {\n //     if (props.selectionMode === 'single') {\n //       checkedSelectionManager.selectItem(data.value);\n //       return;\n //     }\n //     if (walkerRef.current === null) {\n //       return;\n //     }\n //     const nextSelectedState = !checkedSelectionManager.isSelected(data.value);\n //     let treeItemValues = getAllSubTreeItemValues(data).add(data.value);\n //     let mixedValues: ImmutableSet<TreeItemValue> = ImmutableSet.empty;\n //     walkerRef.current.currentElement = data.event.currentTarget;\n //     while (walkerRef.current.parentElement() !== null) {\n //       const descendants = Array.from(\n //         walkerRef.current.currentElement.querySelectorAll<HTMLElement>('[role=\"treeitem\"]'),\n //       ).filter(item => item.getAttribute(dataTreeItemValueAttrName) !== data.value);\n //       const isAllSiblingsEqualSelectionState = descendants.every(item => {\n //         return (\n //           (item.getAttribute('aria-selected') === 'true') === nextSelectedState ||\n //           treeItemValues.has(item.getAttribute(dataTreeItemValueAttrName) as TreeItemValue)\n //         );\n //       });\n //       if (isAllSiblingsEqualSelectionState) {\n //         treeItemValues = treeItemValues.add(\n //           walkerRef.current.currentElement.getAttribute(dataTreeItemValueAttrName) as TreeItemValue,\n //         );\n //         mixedValues = mixedValues.delete(\n //           walkerRef.current.currentElement.getAttribute(dataTreeItemValueAttrName) as TreeItemValue,\n //         );\n //       } else {\n //         treeItemValues = treeItemValues\n //           .delete(walkerRef.current.currentElement.getAttribute(dataTreeItemValueAttrName) as TreeItemValue)\n //           .add(data.value);\n //         mixedValues = mixedValues.add(\n //           walkerRef.current.currentElement.getAttribute(dataTreeItemValueAttrName) as TreeItemValue,\n //         );\n //       }\n //     }\n //     unstable_batchedUpdates(() => {\n //       nextSelectedState\n //         ? checkedSelectionManager.selectItems(treeItemValues)\n //         : checkedSelectionManager.deselectItems(treeItemValues);\n //       let nextMixedSelection = ImmutableSet.create(mixedSelection);\n //       for (const value of mixedValues) {\n //         nextMixedSelection = nextMixedSelection.add(value);\n //       }\n //       for (const value of treeItemValues) {\n //         nextMixedSelection = nextMixedSelection.delete(value);\n //       }\n //       setMixedSelection(nextMixedSelection);\n //     });\n //   });\n //   return [checkedSelection, mixedSelection, updateCheckedItems, rootRef] as const;\n // }\n // function getAllSubTreeItemValues(data: TreeCheckedChangeData) {\n //   const subTreeItems = Array.from(data.event.currentTarget.querySelectorAll('[role=\"treeitem\"]'));\n //   const values = new Set<TreeItemValue>();\n //   for (const item of subTreeItems) {\n //     values.add(item.getAttribute(dataTreeItemValueAttrName) as TreeItemValue);\n //   }\n //   return ImmutableSet.dangerouslyCreate(values);\n // }\n"],"names":["useControllableCheckedItems","props","useControllableState","initialState","ImmutableMap","empty","state","React","useMemo","checkedItems","createCheckedItems","defaultState","defaultCheckedItems"],"mappings":";;;;+BAIgBA;;aAAAA;;;gCAJqB;6DACd;8BACM;oCACM;AAC5B,SAASA,4BAA4BC,KAAK,EAAE;IAC/C,OAAOC,IAAAA,oCAAoB,EAAC;QACxBC,cAAcC,0BAAY,CAACC,KAAK;QAChCC,OAAOC,OAAMC,OAAO,CAAC,IAAIP,MAAMQ,YAAY,IAAIC,IAAAA,sCAAkB,EAACT,MAAMQ,YAAY,GAAG;YACnFR,MAAMQ,YAAY;SACrB;QACDE,cAAc,IAAID,IAAAA,sCAAkB,EAACT,MAAMW,mBAAmB;IAClE;AACJ,EAAE,2HAA2H;CAC5H,0EAA0E;CAC1E,iHAAiH;CACjH,6CAA6C;CAC7C,kEAAkE;CAClE,mCAAmC;CACnC,OAAO;CACP,sFAAsF;CACtF,sDAAsD;CACtD,kDAAkD;CAClD,gEAAgE;CAChE,QAAQ;CACR,uEAAuE;CACvE,wCAAwC;CACxC,mCAAmC;CACnC,qEAAqE;CACrE,4CAA4C;CAC5C,SAAS;CACT,+GAA+G;CAC/G,QAAQ;CACR,mFAAmF;CACnF,8CAA8C;CAC9C,wDAAwD;CACxD,gBAAgB;CAChB,QAAQ;CACR,wCAAwC;CACxC,gBAAgB;CAChB,QAAQ;CACR,iFAAiF;CACjF,0EAA0E;CAC1E,yEAAyE;CACzE,mEAAmE;CACnE,2DAA2D;CAC3D,wCAAwC;CACxC,+FAA+F;CAC/F,uFAAuF;CACvF,6EAA6E;CAC7E,mBAAmB;CACnB,qFAAqF;CACrF,8FAA8F;CAC9F,aAAa;CACb,YAAY;CACZ,gDAAgD;CAChD,+CAA+C;CAC/C,uGAAuG;CACvG,aAAa;CACb,4CAA4C;CAC5C,uGAAuG;CACvG,aAAa;CACb,iBAAiB;CACjB,0CAA0C;CAC1C,+GAA+G;CAC/G,8BAA8B;CAC9B,yCAAyC;CACzC,uGAAuG;CACvG,aAAa;CACb,UAAU;CACV,QAAQ;CACR,sCAAsC;CACtC,0BAA0B;CAC1B,gEAAgE;CAChE,mEAAmE;CACnE,sEAAsE;CACtE,2CAA2C;CAC3C,8DAA8D;CAC9D,UAAU;CACV,8CAA8C;CAC9C,iEAAiE;CACjE,UAAU;CACV,+CAA+C;CAC/C,UAAU;CACV,QAAQ;CACR,qFAAqF;CACrF,IAAI;CACJ,kEAAkE;CAClE,qGAAqG;CACrG,6CAA6C;CAC7C,uCAAuC;CACvC,iFAAiF;CACjF,MAAM;CACN,mDAAmD;CACnD,IAAI"}

package/lib-commonjs/components/Tree/useTree.js

@@ -8,13 +8,45 @@ Object.defineProperty(exports, "useTree_unstable", {
 });
 const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
 const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
-const _contexts = require("../../contexts");
-const _useSubtree = require("./useSubtree");
-const _useRootTree = require("./useRootTree");
+const _reactUtilities = require("@fluentui/react-utilities");
+const _useControllableOpenItems = require("../../hooks/useControllableOpenItems");
+const _useTreeNavigation = require("./useTreeNavigation");
+const _useControllableCheckedItems = require("./useControllableCheckedItems");
+const _treeContext = require("../../contexts/treeContext");
+const _useRootTree = require("../../hooks/useRootTree");
+const _useSubtree = require("../../hooks/useSubtree");
 const useTree_unstable = (props, ref)=>{
-    const isSubtree = (0, _contexts.useTreeContext_unstable)((ctx)=>ctx.level > 0);
-    // as isSubtree is static, this doesn't break rule of hooks
+    const [openItems, setOpenItems] = (0, _useControllableOpenItems.useControllableOpenItems)(props);
+    const [checkedItems] = (0, _useControllableCheckedItems.useControllableCheckedItems)(props);
+    const [navigate, navigationRef] = (0, _useTreeNavigation.useTreeNavigation)();
+    const handleOpenChange = (0, _reactUtilities.useEventCallback)((event, data)=>{
+        var _props_onOpenChange;
+        (_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 ? void 0 : _props_onOpenChange.call(props, event, data);
+        setOpenItems((0, _useControllableOpenItems.createNextOpenItems)(data, openItems));
+    });
+    const handleCheckedChange = (0, _reactUtilities.useEventCallback)((event, data)=>{
+        var _props_onCheckedChange;
+        (_props_onCheckedChange = props.onCheckedChange) === null || _props_onCheckedChange === void 0 ? void 0 : _props_onCheckedChange.call(props, event, data);
+    // TODO: implement next checked items for  tree
+    });
+    const handleNavigation = (0, _reactUtilities.useEventCallback)((event, data)=>{
+        var _props_onNavigation_unstable;
+        (_props_onNavigation_unstable = props.onNavigation_unstable) === null || _props_onNavigation_unstable === void 0 ? void 0 : _props_onNavigation_unstable.call(props, event, data);
+        navigate(data);
+    });
+    const baseProps = {
+        ...props,
+        openItems,
+        checkedItems,
+        onOpenChange: handleOpenChange,
+        // eslint-disable-next-line @typescript-eslint/naming-convention
+        onNavigation_unstable: handleNavigation,
+        onCheckedChange: handleCheckedChange
+    };
+    const baseRef = (0, _reactUtilities.useMergedRefs)(ref, navigationRef);
+    const isSubtree = (0, _treeContext.useTreeContext_unstable)((ctx)=>ctx.level > 0);
+    // as isSubTree is static, this doesn't break rule of hooks
     // and if this becomes an issue later on, this can be easily converted
     // eslint-disable-next-line react-hooks/rules-of-hooks
-    return isSubtree ? (0, _useSubtree.useSubtree)(props, ref) : (0, _useRootTree.useRootTree)(props, ref);
+    return isSubtree ? (0, _useSubtree.useSubtree)(baseProps, baseRef) : (0, _useRootTree.useRootTree)(baseProps, baseRef);
 };

package/lib-commonjs/components/Tree/useTree.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTree.js"],"sourcesContent":["import * as React from 'react';\nimport { useTreeContext_unstable } from '../../contexts';\nimport { useSubtree } from './useSubtree';\nimport { useRootTree } from './useRootTree';\n/**\n * Create the state required to render Tree.\n *\n * The returned state can be modified with hooks such as useTreeStyles_unstable,\n * before being passed to renderTree_unstable.\n *\n * @param props - props from this instance of Tree\n * @param ref - reference to root HTMLElement of Tree\n */ export const useTree_unstable = (props, ref)=>{\n    const isSubtree = useTreeContext_unstable((ctx)=>ctx.level > 0);\n    // as isSubtree 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 isSubtree ? useSubtree(props, ref) : useRootTree(props, ref);\n};\n"],"names":["useTree_unstable","props","ref","isSubtree","useTreeContext_unstable","ctx","level","useSubtree","useRootTree"],"mappings":";;;;+BAYiBA;;aAAAA;;;6DAZM;0BACiB;4BACb;6BACC;AASjB,MAAMA,mBAAmB,CAACC,OAAOC,MAAM;IAC9C,MAAMC,YAAYC,IAAAA,iCAAuB,EAAC,CAACC,MAAMA,IAAIC,KAAK,GAAG;IAC7D,2DAA2D;IAC3D,sEAAsE;IACtE,sDAAsD;IACtD,OAAOH,YAAYI,IAAAA,sBAAU,EAACN,OAAOC,OAAOM,IAAAA,wBAAW,EAACP,OAAOC,IAAI;AACvE"}
+{"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 { useTreeNavigation } from './useTreeNavigation';\nimport { useControllableCheckedItems } from './useControllableCheckedItems';\nimport { useTreeContext_unstable } from '../../contexts/treeContext';\nimport { useRootTree } from '../../hooks/useRootTree';\nimport { useSubtree } from '../../hooks/useSubtree';\nexport const useTree_unstable = (props, ref)=>{\n    const [openItems, setOpenItems] = useControllableOpenItems(props);\n    const [checkedItems] = useControllableCheckedItems(props);\n    const [navigate, navigationRef] = useTreeNavigation();\n    const handleOpenChange = useEventCallback((event, data)=>{\n        var _props_onOpenChange;\n        (_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 ? void 0 : _props_onOpenChange.call(props, event, data);\n        setOpenItems(createNextOpenItems(data, openItems));\n    });\n    const handleCheckedChange = useEventCallback((event, data)=>{\n        var _props_onCheckedChange;\n        (_props_onCheckedChange = props.onCheckedChange) === null || _props_onCheckedChange === void 0 ? void 0 : _props_onCheckedChange.call(props, event, data);\n    // TODO: implement next checked items for  tree\n    });\n    const handleNavigation = useEventCallback((event, data)=>{\n        var _props_onNavigation_unstable;\n        (_props_onNavigation_unstable = props.onNavigation_unstable) === null || _props_onNavigation_unstable === void 0 ? void 0 : _props_onNavigation_unstable.call(props, event, data);\n        navigate(data);\n    });\n    const baseProps = {\n        ...props,\n        openItems,\n        checkedItems,\n        onOpenChange: handleOpenChange,\n        // eslint-disable-next-line @typescript-eslint/naming-convention\n        onNavigation_unstable: handleNavigation,\n        onCheckedChange: handleCheckedChange\n    };\n    const baseRef = useMergedRefs(ref, navigationRef);\n    const isSubtree = useTreeContext_unstable((ctx)=>ctx.level > 0);\n    // as isSubTree 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 isSubtree ? useSubtree(baseProps, baseRef) : useRootTree(baseProps, baseRef);\n};\n"],"names":["useTree_unstable","props","ref","openItems","setOpenItems","useControllableOpenItems","checkedItems","useControllableCheckedItems","navigate","navigationRef","useTreeNavigation","handleOpenChange","useEventCallback","event","data","_props_onOpenChange","onOpenChange","call","createNextOpenItems","handleCheckedChange","_props_onCheckedChange","onCheckedChange","handleNavigation","_props_onNavigation_unstable","onNavigation_unstable","baseProps","baseRef","useMergedRefs","isSubtree","useTreeContext_unstable","ctx","level","useSubtree","useRootTree"],"mappings":";;;;+BAQaA;;aAAAA;;;6DARU;gCACyB;0CACc;mCAC5B;6CACU;6BACJ;6BACZ;4BACD;AACpB,MAAMA,mBAAmB,CAACC,OAAOC,MAAM;IAC1C,MAAM,CAACC,WAAWC,aAAa,GAAGC,IAAAA,kDAAwB,EAACJ;IAC3D,MAAM,CAACK,aAAa,GAAGC,IAAAA,wDAA2B,EAACN;IACnD,MAAM,CAACO,UAAUC,cAAc,GAAGC,IAAAA,oCAAiB;IACnD,MAAMC,mBAAmBC,IAAAA,gCAAgB,EAAC,CAACC,OAAOC,OAAO;QACrD,IAAIC;QACHA,CAAAA,sBAAsBd,MAAMe,YAAY,AAAD,MAAO,IAAI,IAAID,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBE,IAAI,CAAChB,OAAOY,OAAOC,KAAK;QAC7IV,aAAac,IAAAA,6CAAmB,EAACJ,MAAMX;IAC3C;IACA,MAAMgB,sBAAsBP,IAAAA,gCAAgB,EAAC,CAACC,OAAOC,OAAO;QACxD,IAAIM;QACHA,CAAAA,yBAAyBnB,MAAMoB,eAAe,AAAD,MAAO,IAAI,IAAID,2BAA2B,KAAK,IAAI,KAAK,IAAIA,uBAAuBH,IAAI,CAAChB,OAAOY,OAAOC,KAAK;IAC7J,+CAA+C;IAC/C;IACA,MAAMQ,mBAAmBV,IAAAA,gCAAgB,EAAC,CAACC,OAAOC,OAAO;QACrD,IAAIS;QACHA,CAAAA,+BAA+BtB,MAAMuB,qBAAqB,AAAD,MAAO,IAAI,IAAID,iCAAiC,KAAK,IAAI,KAAK,IAAIA,6BAA6BN,IAAI,CAAChB,OAAOY,OAAOC,KAAK;QACjLN,SAASM;IACb;IACA,MAAMW,YAAY;QACd,GAAGxB,KAAK;QACRE;QACAG;QACAU,cAAcL;QACd,gEAAgE;QAChEa,uBAAuBF;QACvBD,iBAAiBF;IACrB;IACA,MAAMO,UAAUC,IAAAA,6BAAa,EAACzB,KAAKO;IACnC,MAAMmB,YAAYC,IAAAA,oCAAuB,EAAC,CAACC,MAAMA,IAAIC,KAAK,GAAG;IAC7D,2DAA2D;IAC3D,sEAAsE;IACtE,sDAAsD;IACtD,OAAOH,YAAYI,IAAAA,sBAAU,EAACP,WAAWC,WAAWO,IAAAA,wBAAW,EAACR,WAAWC,QAAQ;AACvF"}