@fluentui/react-tree 9.3.1 → 9.4.1

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

@@ -8,5 +8,23 @@ Object.defineProperty(exports, "useFlatTreeContextValues_unstable", {
         return useFlatTreeContextValues_unstable;
     }
 });
-const _Tree = require("../../Tree");
-const useFlatTreeContextValues_unstable = _Tree.useTreeContextValues_unstable;
+const useFlatTreeContextValues_unstable = (state)=>{
+    const { openItems, level, contextType, treeType, checkedItems, selectionMode, appearance, size, requestTreeResponse } = state;
+    /**
+   * This context is created with "@fluentui/react-context-selector",
+   * there is no sense to memoize it
+   */ const tree = {
+        treeType,
+        size,
+        openItems,
+        appearance,
+        checkedItems,
+        selectionMode,
+        contextType,
+        level,
+        requestTreeResponse
+    };
+    return {
+        tree
+    };
+};

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

@@ -1 +1 @@
-{"version":3,"sources":["useFlatTreeContextValues.js"],"sourcesContent":["import { useTreeContextValues_unstable } from '../../Tree';\nexport const useFlatTreeContextValues_unstable = useTreeContextValues_unstable;\n"],"names":["useFlatTreeContextValues_unstable","useTreeContextValues_unstable"],"mappings":";;;;+BACaA;;;eAAAA;;;sBADiC;AACvC,MAAMA,oCAAoCC,mCAA6B"}
+{"version":3,"sources":["useFlatTreeContextValues.js"],"sourcesContent":["export const useFlatTreeContextValues_unstable = (state)=>{\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"],"names":["useFlatTreeContextValues_unstable","state","openItems","level","contextType","treeType","checkedItems","selectionMode","appearance","size","requestTreeResponse","tree"],"mappings":";;;;+BAAaA;;;eAAAA;;;AAAN,MAAMA,oCAAoC,CAACC;IAC9C,MAAM,EAAEC,SAAS,EAAEC,KAAK,EAAEC,WAAW,EAAEC,QAAQ,EAAEC,YAAY,EAAEC,aAAa,EAAEC,UAAU,EAAEC,IAAI,EAAEC,mBAAmB,EAAE,GAAGT;IACxH;;;GAGD,GAAG,MAAMU,OAAO;QACXN;QACAI;QACAP;QACAM;QACAF;QACAC;QACAH;QACAD;QACAO;IACJ;IACA,OAAO;QACHC;IACJ;AACJ"}

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

@@ -20,21 +20,11 @@ const _react = require("@griffel/react");
 const flatTreeClassNames = {
     root: 'fui-FlatTree'
 };
-const useStyles = /*#__PURE__*/ (0, _react.__styles)({
-    root: {
-        mc9l5x: "f22iagw",
-        Beiy3e4: "f1vx9l62",
-        Belr9w4: "f1j0q4x9"
-    }
-}, {
-    d: [
-        ".f22iagw{display:flex;}",
-        ".f1vx9l62{flex-direction:column;}",
-        ".f1j0q4x9{row-gap:var(--spacingVerticalXXS);}"
-    ]
-});
+const useBaseStyles = /*#__PURE__*/ (0, _react.__resetStyles)("rnv2ez3", null, [
+    ".rnv2ez3{display:flex;flex-direction:column;row-gap:var(--spacingVerticalXXS);}"
+]);
 const useFlatTreeStyles_unstable = (state)=>{
-    const styles = useStyles();
-    state.root.className = (0, _react.mergeClasses)(flatTreeClassNames.root, styles.root, state.root.className);
+    const baseStyles = useBaseStyles();
+    state.root.className = (0, _react.mergeClasses)(flatTreeClassNames.root, baseStyles, state.root.className);
     return state;
 }; //# sourceMappingURL=useFlatTreeStyles.styles.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["useFlatTreeStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses } 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}, {\n  d: [\".f22iagw{display:flex;}\", \".f1vx9l62{flex-direction:column;}\", \".f1j0q4x9{row-gap:var(--spacingVerticalXXS);}\"]\n});\nexport const useFlatTreeStyles_unstable = state => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(flatTreeClassNames.root, styles.root, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useFlatTreeStyles.styles.js.map"],"names":["flatTreeClassNames","useFlatTreeStyles_unstable","root","useStyles","__styles","mc9l5x","Beiy3e4","Belr9w4","d","state","styles","className","mergeClasses"],"mappings":";;;;;;;;;;;IAEaA,kBAAkB;eAAlBA;;IAYAC,0BAA0B;eAA1BA;;;uBAd0B;AAEhC,MAAMD,qBAAqB;IAChCE,MAAM;AACR;AACA,MAAMC,YAAY,WAAW,GAAEC,IAAAA,eAAQ,EAAC;IACtCF,MAAM;QACJG,QAAQ;QACRC,SAAS;QACTC,SAAS;IACX;AACF,GAAG;IACDC,GAAG;QAAC;QAA2B;QAAqC;KAAgD;AACtH;AACO,MAAMP,6BAA6BQ,CAAAA;IACxC,MAAMC,SAASP;IACfM,MAAMP,IAAI,CAACS,SAAS,GAAGC,IAAAA,mBAAY,EAACZ,mBAAmBE,IAAI,EAAEQ,OAAOR,IAAI,EAAEO,MAAMP,IAAI,CAACS,SAAS;IAC9F,OAAOF;AACT,GACA,oDAAoD"}
+{"version":3,"sources":["useFlatTreeStyles.styles.js"],"sourcesContent":["import { __resetStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const flatTreeClassNames = {\n  root: 'fui-FlatTree'\n};\nconst useBaseStyles = /*#__PURE__*/__resetStyles(\"rnv2ez3\", null, [\".rnv2ez3{display:flex;flex-direction:column;row-gap:var(--spacingVerticalXXS);}\"]);\nexport const useFlatTreeStyles_unstable = state => {\n  const baseStyles = useBaseStyles();\n  state.root.className = mergeClasses(flatTreeClassNames.root, baseStyles, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useFlatTreeStyles.styles.js.map"],"names":["flatTreeClassNames","useFlatTreeStyles_unstable","root","useBaseStyles","__resetStyles","state","baseStyles","className","mergeClasses"],"mappings":";;;;;;;;;;;IAEaA,kBAAkB;eAAlBA;;IAIAC,0BAA0B;eAA1BA;;;uBAN+B;AAErC,MAAMD,qBAAqB;IAChCE,MAAM;AACR;AACA,MAAMC,gBAAgB,WAAW,GAAEC,IAAAA,oBAAa,EAAC,WAAW,MAAM;IAAC;CAAkF;AAC9I,MAAMH,6BAA6BI,CAAAA;IACxC,MAAMC,aAAaH;IACnBE,MAAMH,IAAI,CAACK,SAAS,GAAGC,IAAAA,mBAAY,EAACR,mBAAmBE,IAAI,EAAEI,YAAYD,MAAMH,IAAI,CAACK,SAAS;IAC7F,OAAOF;AACT,GACA,oDAAoD"}

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

@@ -10,10 +10,10 @@ Object.defineProperty(exports, "renderTree_unstable", {
 });
 const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
 const _reactutilities = require("@fluentui/react-utilities");
-const _contexts = require("../../contexts");
+const _TreeProvider = require("../TreeProvider");
 const renderTree_unstable = (state, contextValues)=>{
     (0, _reactutilities.assertSlots)(state);
-    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_contexts.TreeProvider, {
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_TreeProvider.TreeProvider, {
         value: contextValues.tree,
         children: state.open && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.root, {
             children: state.root.children

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

@@ -1 +1 @@
-{"version":3,"sources":["renderTree.js"],"sourcesContent":["  import { jsx as _jsx } from \"@fluentui/react-jsx-runtime/jsx-runtime\";\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { TreeProvider } from '../../contexts';\nexport const renderTree_unstable = (state, contextValues)=>{\n    assertSlots(state);\n    return /*#__PURE__*/ _jsx(TreeProvider, {\n        value: contextValues.tree,\n        children: state.open && /*#__PURE__*/ _jsx(state.root, {\n            children: state.root.children\n        })\n    });\n};\n"],"names":["renderTree_unstable","state","contextValues","assertSlots","_jsx","TreeProvider","value","tree","children","open","root"],"mappings":";;;;+BAGaA;;;eAAAA;;;4BAHiB;gCACF;0BACC;AACtB,MAAMA,sBAAsB,CAACC,OAAOC;IACvCC,IAAAA,2BAAW,EAACF;IACZ,OAAO,WAAW,GAAGG,IAAAA,eAAI,EAACC,sBAAY,EAAE;QACpCC,OAAOJ,cAAcK,IAAI;QACzBC,UAAUP,MAAMQ,IAAI,IAAI,WAAW,GAAGL,IAAAA,eAAI,EAACH,MAAMS,IAAI,EAAE;YACnDF,UAAUP,MAAMS,IAAI,CAACF,QAAQ;QACjC;IACJ;AACJ"}
+{"version":3,"sources":["renderTree.js"],"sourcesContent":["  import { jsx as _jsx } from \"@fluentui/react-jsx-runtime/jsx-runtime\";\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { TreeProvider } from '../TreeProvider';\nexport const renderTree_unstable = (state, contextValues)=>{\n    assertSlots(state);\n    return /*#__PURE__*/ _jsx(TreeProvider, {\n        value: contextValues.tree,\n        children: state.open && /*#__PURE__*/ _jsx(state.root, {\n            children: state.root.children\n        })\n    });\n};\n"],"names":["renderTree_unstable","state","contextValues","assertSlots","_jsx","TreeProvider","value","tree","children","open","root"],"mappings":";;;;+BAGaA;;;eAAAA;;;4BAHiB;gCACF;8BACC;AACtB,MAAMA,sBAAsB,CAACC,OAAOC;IACvCC,IAAAA,2BAAW,EAACF;IACZ,OAAO,WAAW,GAAGG,IAAAA,eAAI,EAACC,0BAAY,EAAE;QACpCC,OAAOJ,cAAcK,IAAI;QACzBC,UAAUP,MAAMQ,IAAI,IAAI,WAAW,GAAGL,IAAAA,eAAI,EAACH,MAAMS,IAAI,EAAE;YACnDF,UAAUP,MAAMS,IAAI,CAACF,QAAQ;QACjC;IACJ;AACJ"}

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

@@ -13,7 +13,7 @@ const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const _reactutilities = require("@fluentui/react-utilities");
 const _useControllableOpenItems = require("../../hooks/useControllableOpenItems");
 const _useNestedControllableCheckedItems = require("./useNestedControllableCheckedItems");
-const _treeContext = require("../../contexts/treeContext");
+const _subtreeContext = require("../../contexts/subtreeContext");
 const _useRootTree = require("../../hooks/useRootTree");
 const _useSubtree = require("../../hooks/useSubtree");
 const _createHTMLElementWalker = require("../../utils/createHTMLElementWalker");
@@ -21,14 +21,11 @@ const _treeItemFilter = require("../../utils/treeItemFilter");
 const _useTreeNavigation = require("./useTreeNavigation");
 const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
 const useTree_unstable = (props, ref)=>{
-    const isSubtree = (0, _treeContext.useTreeContext_unstable)((ctx)=>ctx.level > 0);
-    // as isSubTree is static, this doesn't break rule of hooks
+    const { level } = (0, _subtreeContext.useSubtreeContext_unstable)();
+    // as level 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),
-        treeType: 'nested'
-    } : useNestedRootTree(props, ref);
+    return level > 0 ? (0, _useSubtree.useSubtree)(props, ref) : useNestedRootTree(props, ref);
 };
 function useNestedRootTree(props, ref) {
     const [openItems, setOpenItems] = (0, _useControllableOpenItems.useControllableOpenItems)(props);

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

@@ -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 { useTreeContext_unstable } from '../../contexts/treeContext';\nimport { useRootTree } from '../../hooks/useRootTree';\nimport { useSubtree } from '../../hooks/useSubtree';\nimport { createHTMLElementWalker } from '../../utils/createHTMLElementWalker';\nimport { treeItemFilter } from '../../utils/treeItemFilter';\nimport { useTreeNavigation } from './useTreeNavigation';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nexport 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 ? {\n        ...useSubtree(props, ref),\n        treeType: 'nested'\n    } : useNestedRootTree(props, ref);\n};\nfunction useNestedRootTree(props, ref) {\n    const [openItems, setOpenItems] = useControllableOpenItems(props);\n    const checkedItems = useNestedCheckedItems(props);\n    const { navigate, initialize } = useTreeNavigation();\n    const walkerRef = React.useRef();\n    const { targetDocument } = useFluent_unstable();\n    const initializeWalker = React.useCallback((root)=>{\n        if (root && targetDocument) {\n            walkerRef.current = createHTMLElementWalker(root, targetDocument, treeItemFilter);\n            initialize(walkerRef.current);\n        }\n    }, [\n        initialize,\n        targetDocument\n    ]);\n    const handleOpenChange = 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    const handleCheckedChange = useEventCallback((event, data)=>{\n        if (walkerRef.current) {\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    });\n    const handleNavigation = 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 (walkerRef.current && !event.isDefaultPrevented()) {\n            navigate(data, walkerRef.current);\n        }\n    });\n    return {\n        treeType: 'nested',\n        ...useRootTree({\n            ...props,\n            openItems,\n            checkedItems,\n            onOpenChange: handleOpenChange,\n            onNavigation: handleNavigation,\n            onCheckedChange: handleCheckedChange\n        }, useMergedRefs(ref, initializeWalker))\n    };\n}\n"],"names":["useTree_unstable","props","ref","isSubtree","useTreeContext_unstable","ctx","level","useSubtree","treeType","useNestedRootTree","openItems","setOpenItems","useControllableOpenItems","checkedItems","useNestedCheckedItems","navigate","initialize","useTreeNavigation","walkerRef","React","useRef","targetDocument","useFluent_unstable","initializeWalker","useCallback","root","current","createHTMLElementWalker","treeItemFilter","handleOpenChange","useEventCallback","event","data","_props_onOpenChange","nextOpenItems","createNextOpenItems","onOpenChange","call","dangerouslyGetInternalSet_unstable","handleCheckedChange","_props_onCheckedChange","nextCheckedItems","createNextNestedCheckedItems","onCheckedChange","dangerouslyGetInternalMap_unstable","handleNavigation","_props_onNavigation","onNavigation","isDefaultPrevented","useRootTree","useMergedRefs"],"mappings":";;;;+BAWaA;;;eAAAA;;;;iEAXU;gCACyB;0CACc;mDACM;6BAC5B;6BACZ;4BACD;yCACa;gCACT;mCACG;qCACC;AAC5B,MAAMA,mBAAmB,CAACC,OAAOC;IACpC,MAAMC,YAAYC,IAAAA,oCAAuB,EAAC,CAACC,MAAMA,IAAIC,KAAK,GAAG;IAC7D,2DAA2D;IAC3D,sEAAsE;IACtE,sDAAsD;IACtD,OAAOH,YAAY;QACf,GAAGI,IAAAA,sBAAU,EAACN,OAAOC,IAAI;QACzBM,UAAU;IACd,IAAIC,kBAAkBR,OAAOC;AACjC;AACA,SAASO,kBAAkBR,KAAK,EAAEC,GAAG;IACjC,MAAM,CAACQ,WAAWC,aAAa,GAAGC,IAAAA,kDAAwB,EAACX;IAC3D,MAAMY,eAAeC,IAAAA,wDAAqB,EAACb;IAC3C,MAAM,EAAEc,QAAQ,EAAEC,UAAU,EAAE,GAAGC,IAAAA,oCAAiB;IAClD,MAAMC,YAAYC,OAAMC,MAAM;IAC9B,MAAM,EAAEC,cAAc,EAAE,GAAGC,IAAAA,uCAAkB;IAC7C,MAAMC,mBAAmBJ,OAAMK,WAAW,CAAC,CAACC;QACxC,IAAIA,QAAQJ,gBAAgB;YACxBH,UAAUQ,OAAO,GAAGC,IAAAA,gDAAuB,EAACF,MAAMJ,gBAAgBO,8BAAc;YAChFZ,WAAWE,UAAUQ,OAAO;QAChC;IACJ,GAAG;QACCV;QACAK;KACH;IACD,MAAMQ,mBAAmBC,IAAAA,gCAAgB,EAAC,CAACC,OAAOC;QAC9C,IAAIC;QACJ,MAAMC,gBAAgBC,IAAAA,6CAAmB,EAACH,MAAMtB;QAC/CuB,CAAAA,sBAAsBhC,MAAMmC,YAAY,AAAD,MAAO,QAAQH,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBI,IAAI,CAACpC,OAAO8B,OAAO;YACpI,GAAGC,IAAI;YACPtB,WAAWwB,cAAcI,kCAAkC;QAC/D;QACA3B,aAAauB;IACjB;IACA,MAAMK,sBAAsBT,IAAAA,gCAAgB,EAAC,CAACC,OAAOC;QACjD,IAAId,UAAUQ,OAAO,EAAE;YACnB,IAAIc;YACJ,MAAMC,mBAAmBC,IAAAA,+DAA4B,EAACV,MAAMnB;YAC3D2B,CAAAA,yBAAyBvC,MAAM0C,eAAe,AAAD,MAAO,QAAQH,2BAA2B,KAAK,IAAI,KAAK,IAAIA,uBAAuBH,IAAI,CAACpC,OAAO8B,OAAO;gBAChJ,GAAGC,IAAI;gBACPnB,cAAc4B,iBAAiBG,kCAAkC;YACrE;QACJ;IACJ;IACA,MAAMC,mBAAmBf,IAAAA,gCAAgB,EAAC,CAACC,OAAOC;QAC9C,IAAIc;QACHA,CAAAA,sBAAsB7C,MAAM8C,YAAY,AAAD,MAAO,QAAQD,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBT,IAAI,CAACpC,OAAO8B,OAAOC;QACxI,IAAId,UAAUQ,OAAO,IAAI,CAACK,MAAMiB,kBAAkB,IAAI;YAClDjC,SAASiB,MAAMd,UAAUQ,OAAO;QACpC;IACJ;IACA,OAAO;QACHlB,UAAU;QACV,GAAGyC,IAAAA,wBAAW,EAAC;YACX,GAAGhD,KAAK;YACRS;YACAG;YACAuB,cAAcP;YACdkB,cAAcF;YACdF,iBAAiBJ;QACrB,GAAGW,IAAAA,6BAAa,EAAChD,KAAKqB,kBAAkB;IAC5C;AACJ"}
+{"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 { useSubtreeContext_unstable } from '../../contexts/subtreeContext';\nimport { useRootTree } from '../../hooks/useRootTree';\nimport { useSubtree } from '../../hooks/useSubtree';\nimport { createHTMLElementWalker } from '../../utils/createHTMLElementWalker';\nimport { treeItemFilter } from '../../utils/treeItemFilter';\nimport { useTreeNavigation } from './useTreeNavigation';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nexport const useTree_unstable = (props, ref)=>{\n    const { level } = useSubtreeContext_unstable();\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 level > 0 ? useSubtree(props, ref) : useNestedRootTree(props, ref);\n};\nfunction useNestedRootTree(props, ref) {\n    const [openItems, setOpenItems] = useControllableOpenItems(props);\n    const checkedItems = useNestedCheckedItems(props);\n    const { navigate, initialize } = useTreeNavigation();\n    const walkerRef = React.useRef();\n    const { targetDocument } = useFluent_unstable();\n    const initializeWalker = React.useCallback((root)=>{\n        if (root && targetDocument) {\n            walkerRef.current = createHTMLElementWalker(root, targetDocument, treeItemFilter);\n            initialize(walkerRef.current);\n        }\n    }, [\n        initialize,\n        targetDocument\n    ]);\n    const handleOpenChange = 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    const handleCheckedChange = useEventCallback((event, data)=>{\n        if (walkerRef.current) {\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    });\n    const handleNavigation = 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 (walkerRef.current && !event.isDefaultPrevented()) {\n            navigate(data, walkerRef.current);\n        }\n    });\n    return {\n        treeType: 'nested',\n        ...useRootTree({\n            ...props,\n            openItems,\n            checkedItems,\n            onOpenChange: handleOpenChange,\n            onNavigation: handleNavigation,\n            onCheckedChange: handleCheckedChange\n        }, useMergedRefs(ref, initializeWalker))\n    };\n}\n"],"names":["useTree_unstable","props","ref","level","useSubtreeContext_unstable","useSubtree","useNestedRootTree","openItems","setOpenItems","useControllableOpenItems","checkedItems","useNestedCheckedItems","navigate","initialize","useTreeNavigation","walkerRef","React","useRef","targetDocument","useFluent_unstable","initializeWalker","useCallback","root","current","createHTMLElementWalker","treeItemFilter","handleOpenChange","useEventCallback","event","data","_props_onOpenChange","nextOpenItems","createNextOpenItems","onOpenChange","call","dangerouslyGetInternalSet_unstable","handleCheckedChange","_props_onCheckedChange","nextCheckedItems","createNextNestedCheckedItems","onCheckedChange","dangerouslyGetInternalMap_unstable","handleNavigation","_props_onNavigation","onNavigation","isDefaultPrevented","treeType","useRootTree","useMergedRefs"],"mappings":";;;;+BAWaA;;;eAAAA;;;;iEAXU;gCACyB;0CACc;mDACM;gCACzB;6BACf;4BACD;yCACa;gCACT;mCACG;qCACC;AAC5B,MAAMA,mBAAmB,CAACC,OAAOC;IACpC,MAAM,EAAEC,KAAK,EAAE,GAAGC,IAAAA,0CAA0B;IAC5C,uDAAuD;IACvD,sEAAsE;IACtE,sDAAsD;IACtD,OAAOD,QAAQ,IAAIE,IAAAA,sBAAU,EAACJ,OAAOC,OAAOI,kBAAkBL,OAAOC;AACzE;AACA,SAASI,kBAAkBL,KAAK,EAAEC,GAAG;IACjC,MAAM,CAACK,WAAWC,aAAa,GAAGC,IAAAA,kDAAwB,EAACR;IAC3D,MAAMS,eAAeC,IAAAA,wDAAqB,EAACV;IAC3C,MAAM,EAAEW,QAAQ,EAAEC,UAAU,EAAE,GAAGC,IAAAA,oCAAiB;IAClD,MAAMC,YAAYC,OAAMC,MAAM;IAC9B,MAAM,EAAEC,cAAc,EAAE,GAAGC,IAAAA,uCAAkB;IAC7C,MAAMC,mBAAmBJ,OAAMK,WAAW,CAAC,CAACC;QACxC,IAAIA,QAAQJ,gBAAgB;YACxBH,UAAUQ,OAAO,GAAGC,IAAAA,gDAAuB,EAACF,MAAMJ,gBAAgBO,8BAAc;YAChFZ,WAAWE,UAAUQ,OAAO;QAChC;IACJ,GAAG;QACCV;QACAK;KACH;IACD,MAAMQ,mBAAmBC,IAAAA,gCAAgB,EAAC,CAACC,OAAOC;QAC9C,IAAIC;QACJ,MAAMC,gBAAgBC,IAAAA,6CAAmB,EAACH,MAAMtB;QAC/CuB,CAAAA,sBAAsB7B,MAAMgC,YAAY,AAAD,MAAO,QAAQH,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBI,IAAI,CAACjC,OAAO2B,OAAO;YACpI,GAAGC,IAAI;YACPtB,WAAWwB,cAAcI,kCAAkC;QAC/D;QACA3B,aAAauB;IACjB;IACA,MAAMK,sBAAsBT,IAAAA,gCAAgB,EAAC,CAACC,OAAOC;QACjD,IAAId,UAAUQ,OAAO,EAAE;YACnB,IAAIc;YACJ,MAAMC,mBAAmBC,IAAAA,+DAA4B,EAACV,MAAMnB;YAC3D2B,CAAAA,yBAAyBpC,MAAMuC,eAAe,AAAD,MAAO,QAAQH,2BAA2B,KAAK,IAAI,KAAK,IAAIA,uBAAuBH,IAAI,CAACjC,OAAO2B,OAAO;gBAChJ,GAAGC,IAAI;gBACPnB,cAAc4B,iBAAiBG,kCAAkC;YACrE;QACJ;IACJ;IACA,MAAMC,mBAAmBf,IAAAA,gCAAgB,EAAC,CAACC,OAAOC;QAC9C,IAAIc;QACHA,CAAAA,sBAAsB1C,MAAM2C,YAAY,AAAD,MAAO,QAAQD,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBT,IAAI,CAACjC,OAAO2B,OAAOC;QACxI,IAAId,UAAUQ,OAAO,IAAI,CAACK,MAAMiB,kBAAkB,IAAI;YAClDjC,SAASiB,MAAMd,UAAUQ,OAAO;QACpC;IACJ;IACA,OAAO;QACHuB,UAAU;QACV,GAAGC,IAAAA,wBAAW,EAAC;YACX,GAAG9C,KAAK;YACRM;YACAG;YACAuB,cAAcP;YACdkB,cAAcF;YACdF,iBAAiBJ;QACrB,GAAGY,IAAAA,6BAAa,EAAC9C,KAAKkB,kBAAkB;IAC5C;AACJ"}

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

@@ -8,22 +8,37 @@ Object.defineProperty(exports, "useTreeContextValues_unstable", {
         return useTreeContextValues_unstable;
     }
 });
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 function useTreeContextValues_unstable(state) {
-    const { openItems, checkedItems, selectionMode, level, appearance, size, requestTreeResponse, treeType } = state;
-    /**
-   * This context is created with "@fluentui/react-context-selector",
-   * there is no sense to memoize it
-   */ const tree = {
-        treeType,
-        size,
-        level,
-        openItems,
-        appearance,
-        checkedItems,
-        selectionMode,
-        requestTreeResponse
-    };
+    if (state.contextType === 'root') {
+        const { openItems, level, contextType, treeType, checkedItems, selectionMode, appearance, size, requestTreeResponse } = state;
+        /**
+     * This context is created with "@fluentui/react-context-selector",
+     * there is no sense to memoize it
+     */ const tree = {
+            treeType,
+            size,
+            openItems,
+            appearance,
+            checkedItems,
+            selectionMode,
+            contextType,
+            level,
+            requestTreeResponse
+        };
+        return {
+            tree
+        };
+    }
     return {
-        tree
+        // contextType is statically determined by the context
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        tree: _react.useMemo(()=>({
+                level: state.level,
+                contextType: 'subtree'
+            }), [
+            state.level
+        ])
     };
 }

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

@@ -1 +1 @@
-{"version":3,"sources":["useTreeContextValues.js"],"sourcesContent":["export function useTreeContextValues_unstable(state) {\n    const { openItems, checkedItems, selectionMode, level, appearance, size, requestTreeResponse, treeType } = 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        level,\n        openItems,\n        appearance,\n        checkedItems,\n        selectionMode,\n        requestTreeResponse\n    };\n    return {\n        tree\n    };\n}\n"],"names":["useTreeContextValues_unstable","state","openItems","checkedItems","selectionMode","level","appearance","size","requestTreeResponse","treeType","tree"],"mappings":";;;;+BAAgBA;;;eAAAA;;;AAAT,SAASA,8BAA8BC,KAAK;IAC/C,MAAM,EAAEC,SAAS,EAAEC,YAAY,EAAEC,aAAa,EAAEC,KAAK,EAAEC,UAAU,EAAEC,IAAI,EAAEC,mBAAmB,EAAEC,QAAQ,EAAE,GAAGR;IAC3G;;;GAGD,GAAG,MAAMS,OAAO;QACXD;QACAF;QACAF;QACAH;QACAI;QACAH;QACAC;QACAI;IACJ;IACA,OAAO;QACHE;IACJ;AACJ"}
+{"version":3,"sources":["useTreeContextValues.js"],"sourcesContent":["import * as React from 'react';\nexport function useTreeContextValues_unstable(state) {\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,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"}

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

@@ -20,26 +20,22 @@ const _react = require("@griffel/react");
 const treeClassNames = {
     root: 'fui-Tree'
 };
+const useBaseStyles = /*#__PURE__*/ (0, _react.__resetStyles)("rnv2ez3", null, [
+    ".rnv2ez3{display:flex;flex-direction:column;row-gap:var(--spacingVerticalXXS);}"
+]);
 const useStyles = /*#__PURE__*/ (0, _react.__styles)({
-    root: {
-        mc9l5x: "f22iagw",
-        Beiy3e4: "f1vx9l62",
-        Belr9w4: "f1j0q4x9"
-    },
     subtree: {
         z8tnut: "fclwglc"
     }
 }, {
     d: [
-        ".f22iagw{display:flex;}",
-        ".f1vx9l62{flex-direction:column;}",
-        ".f1j0q4x9{row-gap:var(--spacingVerticalXXS);}",
         ".fclwglc{padding-top:var(--spacingVerticalXXS);}"
     ]
 });
 const useTreeStyles_unstable = (state)=>{
+    const baseStyles = useBaseStyles();
     const styles = useStyles();
     const isSubTree = state.level > 1;
-    state.root.className = (0, _react.mergeClasses)(treeClassNames.root, styles.root, isSubTree && styles.subtree, state.root.className);
+    state.root.className = (0, _react.mergeClasses)(treeClassNames.root, baseStyles, isSubTree && styles.subtree, state.root.className);
     return state;
 }; //# sourceMappingURL=useTreeStyles.styles.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["useTreeStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const treeClassNames = {\n  root: 'fui-Tree'\n};\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    mc9l5x: \"f22iagw\",\n    Beiy3e4: \"f1vx9l62\",\n    Belr9w4: \"f1j0q4x9\"\n  },\n  subtree: {\n    z8tnut: \"fclwglc\"\n  }\n}, {\n  d: [\".f22iagw{display:flex;}\", \".f1vx9l62{flex-direction:column;}\", \".f1j0q4x9{row-gap:var(--spacingVerticalXXS);}\", \".fclwglc{padding-top:var(--spacingVerticalXXS);}\"]\n});\nexport const useTreeStyles_unstable = state => {\n  const styles = useStyles();\n  const isSubTree = state.level > 1;\n  state.root.className = mergeClasses(treeClassNames.root, styles.root, isSubTree && styles.subtree, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useTreeStyles.styles.js.map"],"names":["treeClassNames","useTreeStyles_unstable","root","useStyles","__styles","mc9l5x","Beiy3e4","Belr9w4","subtree","z8tnut","d","state","styles","isSubTree","level","className","mergeClasses"],"mappings":";;;;;;;;;;;IAEaA,cAAc;eAAdA;;IAeAC,sBAAsB;eAAtBA;;;uBAjB0B;AAEhC,MAAMD,iBAAiB;IAC5BE,MAAM;AACR;AACA,MAAMC,YAAY,WAAW,GAAEC,IAAAA,eAAQ,EAAC;IACtCF,MAAM;QACJG,QAAQ;QACRC,SAAS;QACTC,SAAS;IACX;IACAC,SAAS;QACPC,QAAQ;IACV;AACF,GAAG;IACDC,GAAG;QAAC;QAA2B;QAAqC;QAAiD;KAAmD;AAC1K;AACO,MAAMT,yBAAyBU,CAAAA;IACpC,MAAMC,SAAST;IACf,MAAMU,YAAYF,MAAMG,KAAK,GAAG;IAChCH,MAAMT,IAAI,CAACa,SAAS,GAAGC,IAAAA,mBAAY,EAAChB,eAAeE,IAAI,EAAEU,OAAOV,IAAI,EAAEW,aAAaD,OAAOJ,OAAO,EAAEG,MAAMT,IAAI,CAACa,SAAS;IACvH,OAAOJ;AACT,GACA,gDAAgD"}
+{"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  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,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"}

package/lib-commonjs/components/TreeItem/useTreeItem.js

@@ -15,17 +15,17 @@ const _reactutilities = require("@fluentui/react-utilities");
 const _reactportal = require("@fluentui/react-portal");
 const _keyboardkeys = require("@fluentui/keyboard-keys");
 const _tokens = require("../../utils/tokens");
-const _index = require("../../contexts/index");
+const _contexts = require("../../contexts");
 const _getTreeItemValueFromElement = require("../../utils/getTreeItemValueFromElement");
 function useTreeItem_unstable(props, ref) {
     var _props_value;
-    const treeType = (0, _index.useTreeContext_unstable)((ctx)=>ctx.treeType);
+    const treeType = (0, _contexts.useTreeContext_unstable)((ctx)=>ctx.treeType);
     if (treeType === 'flat') {
         warnIfNoProperPropsFlatTreeItem(props);
     }
-    const requestTreeResponse = (0, _index.useTreeContext_unstable)((ctx)=>ctx.requestTreeResponse);
-    const contextLevel = (0, _index.useTreeContext_unstable)((ctx)=>ctx.level);
-    const parentValue = (0, _index.useTreeItemContext_unstable)((ctx)=>{
+    const requestTreeResponse = (0, _contexts.useTreeContext_unstable)((ctx)=>ctx.requestTreeResponse);
+    const { level: contextLevel } = (0, _contexts.useSubtreeContext_unstable)();
+    const parentValue = (0, _contexts.useTreeItemContext_unstable)((ctx)=>{
         var _props_parentValue;
         return (_props_parentValue = props.parentValue) !== null && _props_parentValue !== void 0 ? _props_parentValue : ctx.value;
     });
@@ -43,12 +43,12 @@ function useTreeItem_unstable(props, ref) {
     const layoutRef = _react.useRef(null);
     const subtreeRef = _react.useRef(null);
     const selectionRef = _react.useRef(null);
-    const open = (0, _index.useTreeContext_unstable)((ctx)=>{
+    const open = (0, _contexts.useTreeContext_unstable)((ctx)=>{
         var _props_open;
         return (_props_open = props.open) !== null && _props_open !== void 0 ? _props_open : ctx.openItems.has(value);
     });
-    const selectionMode = (0, _index.useTreeContext_unstable)((ctx)=>ctx.selectionMode);
-    const checked = (0, _index.useTreeContext_unstable)((ctx)=>{
+    const selectionMode = (0, _contexts.useTreeContext_unstable)((ctx)=>ctx.selectionMode);
+    const checked = (0, _contexts.useTreeContext_unstable)((ctx)=>{
         var _ctx_checkedItems_get;
         return (_ctx_checkedItems_get = ctx.checkedItems.get(value)) !== null && _ctx_checkedItems_get !== void 0 ? _ctx_checkedItems_get : false;
     });

package/lib-commonjs/components/TreeItem/useTreeItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTreeItem.js"],"sourcesContent":["import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { getNativeElementProps, useId, useMergedRefs, useEventCallback, slot } from '@fluentui/react-utilities';\nimport { elementContains } from '@fluentui/react-portal';\nimport { Space } from '@fluentui/keyboard-keys';\nimport { treeDataTypes } from '../../utils/tokens';\nimport { useTreeContext_unstable, useTreeItemContext_unstable } from '../../contexts/index';\nimport { dataTreeItemValueAttrName } from '../../utils/getTreeItemValueFromElement';\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    var _props_value;\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 contextLevel = useTreeContext_unstable((ctx)=>ctx.level);\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 value = useId('fuiTreeItemValue-', (_props_value = props.value) === null || _props_value === void 0 ? void 0 : _props_value.toString());\n    const { onClick, onKeyDown, as = 'div', itemType = 'leaf', 'aria-level': level = contextLevel, ...rest } = props;\n    const [isActionsVisible, setActionsVisible] = React.useState(false);\n    const [isAsideVisible, setAsideVisible] = React.useState(true);\n    const handleActionsRef = React.useCallback((actionsElement)=>{\n        setAsideVisible(actionsElement === null);\n    }, []);\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 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 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        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: !open,\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                    event.preventDefault();\n                }\n                return;\n            case treeDataTypes.Enter:\n                {\n                    var _props_onOpenChange;\n                    const data = {\n                        value,\n                        event,\n                        open: !open,\n                        type: event.key,\n                        target: event.currentTarget\n                    };\n                    (_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 ? void 0 : _props_onOpenChange.call(props, event, data);\n                    return requestTreeResponse({\n                        ...data,\n                        itemType,\n                        requestType: 'open'\n                    });\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                    // 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: !open,\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                    return requestTreeResponse({\n                        ...data,\n                        itemType,\n                        parentValue,\n                        requestType: open ? 'open' : 'navigate'\n                    });\n                }\n            case treeDataTypes.ArrowRight:\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: !open,\n                    type: event.key,\n                    target: event.currentTarget\n                };\n                if (!open) {\n                    var _props_onOpenChange2;\n                    (_props_onOpenChange2 = props.onOpenChange) === null || _props_onOpenChange2 === void 0 ? void 0 : _props_onOpenChange2.call(props, event, data);\n                }\n                return requestTreeResponse({\n                    ...data,\n                    itemType,\n                    parentValue,\n                    requestType: open ? 'navigate' : 'open'\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 handleActionsVisible = useEventCallback((event)=>{\n        const isTargetFromSubtree = Boolean(subtreeRef.current && elementContains(subtreeRef.current, event.target));\n        if (!isTargetFromSubtree) {\n            setActionsVisible(true);\n        }\n    });\n    const handleActionsInvisible = useEventCallback((event)=>{\n        const isTargetFromSubtree = Boolean(subtreeRef.current && elementContains(subtreeRef.current, event.target));\n        const isRelatedTargetFromActions = Boolean(actionsRef.current && elementContains(actionsRef.current, event.relatedTarget));\n        if (isRelatedTargetFromActions) {\n            return setActionsVisible(true);\n        }\n        if (!isTargetFromSubtree) {\n            return setActionsVisible(false);\n        }\n    });\n    const handleChange = useEventCallback((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        actionsRef: useMergedRefs(handleActionsRef, actionsRef),\n        itemType,\n        level,\n        components: {\n            root: 'div'\n        },\n        isAsideVisible,\n        isActionsVisible,\n        root: slot.always(getNativeElementProps(as, {\n            tabIndex: -1,\n            [dataTreeItemValueAttrName]: value,\n            ...rest,\n            ref,\n            role: 'treeitem',\n            'aria-level': level,\n            'aria-checked': selectionMode === 'multiselect' ? checked : undefined,\n            // aria-selected is required according to WAI-ARIA spec\n            // https://www.w3.org/TR/wai-aria-1.1/#treeitem\n            // Casting: when selectionMode is 'single', checked is a boolean\n            'aria-selected': selectionMode === 'single' ? checked : 'false',\n            'aria-expanded': itemType === 'branch' ? open : undefined,\n            onClick: handleClick,\n            onKeyDown: handleKeyDown,\n            onMouseOver: handleActionsVisible,\n            onFocus: handleActionsVisible,\n            onMouseOut: handleActionsInvisible,\n            onBlur: handleActionsInvisible,\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","_props_value","treeType","useTreeContext_unstable","ctx","warnIfNoProperPropsFlatTreeItem","requestTreeResponse","contextLevel","level","parentValue","useTreeItemContext_unstable","_props_parentValue","value","useId","toString","onClick","onKeyDown","as","itemType","rest","isActionsVisible","setActionsVisible","React","useState","isAsideVisible","setAsideVisible","handleActionsRef","useCallback","actionsElement","actionsRef","useRef","expandIconRef","layoutRef","subtreeRef","selectionRef","open","_props_open","openItems","has","selectionMode","checked","_ctx_checkedItems_get","checkedItems","get","handleClick","useEventCallback","event","isDefaultPrevented","isEventFromActions","current","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","_props_onOpenChange1","ArrowRight","_props_onOpenChange2","isTypeAheadCharacter","length","match","altKey","ctrlKey","metaKey","TypeAhead","handleActionsVisible","isTargetFromSubtree","Boolean","handleActionsInvisible","isRelatedTargetFromActions","relatedTarget","handleChange","useMergedRefs","components","root","slot","always","getNativeElementProps","tabIndex","dataTreeItemValueAttrName","role","undefined","onMouseOver","onFocus","onMouseOut","onBlur","onChange","elementType","process","env","NODE_ENV","console","error","name"],"mappings":";;;;+BAgBoBA;;;eAAAA;;;;iEAhBG;oEACG;gCAC0D;6BACpD;8BACV;wBACQ;uBACuC;6CAC3B;AAS/B,SAASA,qBAAqBC,KAAK,EAAEC,GAAG;IAC/C,IAAIC;IACJ,MAAMC,WAAWC,IAAAA,8BAAuB,EAAC,CAACC,MAAMA,IAAIF,QAAQ;IAC5D,IAAIA,aAAa,QAAQ;QACrBG,gCAAgCN;IACpC;IACA,MAAMO,sBAAsBH,IAAAA,8BAAuB,EAAC,CAACC,MAAMA,IAAIE,mBAAmB;IAClF,MAAMC,eAAeJ,IAAAA,8BAAuB,EAAC,CAACC,MAAMA,IAAII,KAAK;IAC7D,MAAMC,cAAcC,IAAAA,kCAA2B,EAAC,CAACN;QAC7C,IAAIO;QACJ,OAAO,AAACA,CAAAA,qBAAqBZ,MAAMU,WAAW,AAAD,MAAO,QAAQE,uBAAuB,KAAK,IAAIA,qBAAqBP,IAAIQ,KAAK;IAC9H;IACA,iDAAiD;IACjD,sDAAsD;IACtD,MAAMA,QAAQC,IAAAA,qBAAK,EAAC,qBAAqB,AAACZ,CAAAA,eAAeF,MAAMa,KAAK,AAAD,MAAO,QAAQX,iBAAiB,KAAK,IAAI,KAAK,IAAIA,aAAaa,QAAQ;IAC1I,MAAM,EAAEC,OAAO,EAAEC,SAAS,EAAEC,KAAK,KAAK,EAAEC,WAAW,MAAM,EAAE,cAAcV,QAAQD,YAAY,EAAE,GAAGY,MAAM,GAAGpB;IAC3G,MAAM,CAACqB,kBAAkBC,kBAAkB,GAAGC,OAAMC,QAAQ,CAAC;IAC7D,MAAM,CAACC,gBAAgBC,gBAAgB,GAAGH,OAAMC,QAAQ,CAAC;IACzD,MAAMG,mBAAmBJ,OAAMK,WAAW,CAAC,CAACC;QACxCH,gBAAgBG,mBAAmB;IACvC,GAAG,EAAE;IACL,MAAMC,aAAaP,OAAMQ,MAAM,CAAC;IAChC,MAAMC,gBAAgBT,OAAMQ,MAAM,CAAC;IACnC,MAAME,YAAYV,OAAMQ,MAAM,CAAC;IAC/B,MAAMG,aAAaX,OAAMQ,MAAM,CAAC;IAChC,MAAMI,eAAeZ,OAAMQ,MAAM,CAAC;IAClC,MAAMK,OAAOhC,IAAAA,8BAAuB,EAAC,CAACC;QAClC,IAAIgC;QACJ,OAAO,AAACA,CAAAA,cAAcrC,MAAMoC,IAAI,AAAD,MAAO,QAAQC,gBAAgB,KAAK,IAAIA,cAAchC,IAAIiC,SAAS,CAACC,GAAG,CAAC1B;IAC3G;IACA,MAAM2B,gBAAgBpC,IAAAA,8BAAuB,EAAC,CAACC,MAAMA,IAAImC,aAAa;IACtE,MAAMC,UAAUrC,IAAAA,8BAAuB,EAAC,CAACC;QACrC,IAAIqC;QACJ,OAAO,AAACA,CAAAA,wBAAwBrC,IAAIsC,YAAY,CAACC,GAAG,CAAC/B,MAAK,MAAO,QAAQ6B,0BAA0B,KAAK,IAAIA,wBAAwB;IACxI;IACA,MAAMG,cAAcC,IAAAA,gCAAgB,EAAC,CAACC;QAClC/B,YAAY,QAAQA,YAAY,KAAK,IAAI,KAAK,IAAIA,QAAQ+B;QAC1D,IAAIA,MAAMC,kBAAkB,IAAI;YAC5B;QACJ;QACA,MAAMC,qBAAqBnB,WAAWoB,OAAO,IAAIC,IAAAA,4BAAe,EAACrB,WAAWoB,OAAO,EAAEH,MAAMK,MAAM;QACjG,IAAIH,oBAAoB;YACpB;QACJ;QACA,MAAMI,qBAAqBnB,WAAWgB,OAAO,IAAIC,IAAAA,4BAAe,EAACjB,WAAWgB,OAAO,EAAEH,MAAMK,MAAM;QACjG,IAAIC,oBAAoB;YACpB;QACJ;QACA,MAAMC,uBAAuBnB,aAAae,OAAO,IAAIC,IAAAA,4BAAe,EAAChB,aAAae,OAAO,EAAEH,MAAMK,MAAM;QACvG,IAAIE,sBAAsB;YACtB;QACJ;QACA,MAAMC,wBAAwBvB,cAAckB,OAAO,IAAIC,IAAAA,4BAAe,EAACnB,cAAckB,OAAO,EAAEH,MAAMK,MAAM;QAC1GI,UAASC,uBAAuB,CAAC;YAC7B,IAAIC;YACJ,MAAMC,OAAO;gBACTZ;gBACAlC;gBACAuB,MAAM,CAACA;gBACPgB,QAAQL,MAAMa,aAAa;gBAC3BC,MAAMN,wBAAwBO,qBAAa,CAACC,eAAe,GAAGD,qBAAa,CAACE,KAAK;YACrF;YACCN,CAAAA,sBAAsB1D,MAAMiE,YAAY,AAAD,MAAO,QAAQP,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBQ,IAAI,CAAClE,OAAO+C,OAAOY;YACxIpD,oBAAoB;gBAChB,GAAGoD,IAAI;gBACPxC;gBACAgD,aAAa;YACjB;YACA5D,oBAAoB;gBAChB,GAAGoD,IAAI;gBACPxC;gBACAT;gBACAyD,aAAa;gBACbN,MAAMC,qBAAa,CAACE,KAAK;YAC7B;QACJ;IACJ;IACA,MAAMI,gBAAgBtB,IAAAA,gCAAgB,EAAC,CAACC;QACpC9B,cAAc,QAAQA,cAAc,KAAK,IAAI,KAAK,IAAIA,UAAU8B;QAChE,2EAA2E;QAC3E,IAAIA,MAAMC,kBAAkB,MAAMD,MAAMa,aAAa,KAAKb,MAAMK,MAAM,EAAE;YACpE;QACJ;QACA,OAAOL,MAAMsB,GAAG;YACZ,KAAKC,mBAAK;gBACN,IAAI9B,kBAAkB,QAAQ;oBAC1B,IAAI+B;oBACHA,CAAAA,wBAAwBpC,aAAae,OAAO,AAAD,MAAO,QAAQqB,0BAA0B,KAAK,IAAI,KAAK,IAAIA,sBAAsBC,KAAK;oBAClIzB,MAAM0B,cAAc;gBACxB;gBACA;YACJ,KAAKX,qBAAa,CAACY,KAAK;gBACpB;oBACI,IAAIhB;oBACJ,MAAMC,OAAO;wBACT9C;wBACAkC;wBACAX,MAAM,CAACA;wBACPyB,MAAMd,MAAMsB,GAAG;wBACfjB,QAAQL,MAAMa,aAAa;oBAC/B;oBACCF,CAAAA,sBAAsB1D,MAAMiE,YAAY,AAAD,MAAO,QAAQP,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBQ,IAAI,CAAClE,OAAO+C,OAAOY;oBACxI,OAAOpD,oBAAoB;wBACvB,GAAGoD,IAAI;wBACPxC;wBACAgD,aAAa;oBACjB;gBACJ;YACJ,KAAKL,qBAAa,CAACa,GAAG;YACtB,KAAKb,qBAAa,CAACc,IAAI;YACvB,KAAKd,qBAAa,CAACe,OAAO;YAC1B,KAAKf,qBAAa,CAACgB,SAAS;gBACxB,OAAOvE,oBAAoB;oBACvB4D,aAAa;oBACbpB;oBACAlC;oBACAM;oBACAT;oBACAmD,MAAMd,MAAMsB,GAAG;oBACfjB,QAAQL,MAAMa,aAAa;gBAC/B;YACJ,KAAKE,qBAAa,CAACiB,SAAS;gBACxB;oBACI,4DAA4D;oBAC5D,IAAItE,UAAU,KAAK,CAAC2B,MAAM;wBACtB;oBACJ;oBACA,MAAMuB,OAAO;wBACT9C;wBACAkC;wBACAX,MAAM,CAACA;wBACPyB,MAAMd,MAAMsB,GAAG;wBACfjB,QAAQL,MAAMa,aAAa;oBAC/B;oBACA,IAAIxB,MAAM;wBACN,IAAI4C;wBACHA,CAAAA,uBAAuBhF,MAAMiE,YAAY,AAAD,MAAO,QAAQe,yBAAyB,KAAK,IAAI,KAAK,IAAIA,qBAAqBd,IAAI,CAAClE,OAAO+C,OAAOY;oBAC/I;oBACA,OAAOpD,oBAAoB;wBACvB,GAAGoD,IAAI;wBACPxC;wBACAT;wBACAyD,aAAa/B,OAAO,SAAS;oBACjC;gBACJ;YACJ,KAAK0B,qBAAa,CAACmB,UAAU;gBACzB,gDAAgD;gBAChD,IAAI9D,aAAa,QAAQ;oBACrB;gBACJ;gBACA,MAAMwC,OAAO;oBACT9C;oBACAkC;oBACAX,MAAM,CAACA;oBACPyB,MAAMd,MAAMsB,GAAG;oBACfjB,QAAQL,MAAMa,aAAa;gBAC/B;gBACA,IAAI,CAACxB,MAAM;oBACP,IAAI8C;oBACHA,CAAAA,uBAAuBlF,MAAMiE,YAAY,AAAD,MAAO,QAAQiB,yBAAyB,KAAK,IAAI,KAAK,IAAIA,qBAAqBhB,IAAI,CAAClE,OAAO+C,OAAOY;gBAC/I;gBACA,OAAOpD,oBAAoB;oBACvB,GAAGoD,IAAI;oBACPxC;oBACAT;oBACAyD,aAAa/B,OAAO,aAAa;gBACrC;QACR;QACA,MAAM+C,uBAAuBpC,MAAMsB,GAAG,CAACe,MAAM,KAAK,KAAKrC,MAAMsB,GAAG,CAACgB,KAAK,CAAC,SAAS,CAACtC,MAAMuC,MAAM,IAAI,CAACvC,MAAMwC,OAAO,IAAI,CAACxC,MAAMyC,OAAO;QACjI,IAAIL,sBAAsB;YACtB5E,oBAAoB;gBAChB4D,aAAa;gBACbpB;gBACAK,QAAQL,MAAMa,aAAa;gBAC3B/C;gBACAM;gBACA0C,MAAMC,qBAAa,CAAC2B,SAAS;gBAC7B/E;YACJ;QACJ;IACJ;IACA,MAAMgF,uBAAuB5C,IAAAA,gCAAgB,EAAC,CAACC;QAC3C,MAAM4C,sBAAsBC,QAAQ1D,WAAWgB,OAAO,IAAIC,IAAAA,4BAAe,EAACjB,WAAWgB,OAAO,EAAEH,MAAMK,MAAM;QAC1G,IAAI,CAACuC,qBAAqB;YACtBrE,kBAAkB;QACtB;IACJ;IACA,MAAMuE,yBAAyB/C,IAAAA,gCAAgB,EAAC,CAACC;QAC7C,MAAM4C,sBAAsBC,QAAQ1D,WAAWgB,OAAO,IAAIC,IAAAA,4BAAe,EAACjB,WAAWgB,OAAO,EAAEH,MAAMK,MAAM;QAC1G,MAAM0C,6BAA6BF,QAAQ9D,WAAWoB,OAAO,IAAIC,IAAAA,4BAAe,EAACrB,WAAWoB,OAAO,EAAEH,MAAMgD,aAAa;QACxH,IAAID,4BAA4B;YAC5B,OAAOxE,kBAAkB;QAC7B;QACA,IAAI,CAACqE,qBAAqB;YACtB,OAAOrE,kBAAkB;QAC7B;IACJ;IACA,MAAM0E,eAAelD,IAAAA,gCAAgB,EAAC,CAACC;QACnC,IAAIA,MAAMC,kBAAkB,IAAI;YAC5B;QACJ;QACA,MAAMK,qBAAqBnB,WAAWgB,OAAO,IAAIC,IAAAA,4BAAe,EAACjB,WAAWgB,OAAO,EAAEH,MAAMK,MAAM;QACjG,IAAIC,oBAAoB;YACpB;QACJ;QACA9C,oBAAoB;YAChB4D,aAAa;YACbpB;YACAlC;YACAM;YACA0C,MAAM;YACNT,QAAQL,MAAMa,aAAa;YAC3BnB,SAASA,YAAY,UAAU,OAAO,CAACA;QAC3C;IACJ;IACA,OAAO;QACH5B;QACAuB;QACAK;QACAP;QACAD;QACAE;QACAH;QACAF,YAAYmE,IAAAA,6BAAa,EAACtE,kBAAkBG;QAC5CX;QACAV;QACAyF,YAAY;YACRC,MAAM;QACV;QACA1E;QACAJ;QACA8E,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAACpF,IAAI;YACxCqF,UAAU,CAAC;YACX,CAACC,sDAAyB,CAAC,EAAE3F;YAC7B,GAAGO,IAAI;YACPnB;YACAwG,MAAM;YACN,cAAchG;YACd,gBAAgB+B,kBAAkB,gBAAgBC,UAAUiE;YAC5D,uDAAuD;YACvD,+CAA+C;YAC/C,gEAAgE;YAChE,iBAAiBlE,kBAAkB,WAAWC,UAAU;YACxD,iBAAiBtB,aAAa,WAAWiB,OAAOsE;YAChD1F,SAAS6B;YACT5B,WAAWmD;YACXuC,aAAajB;YACbkB,SAASlB;YACTmB,YAAYhB;YACZiB,QAAQjB;YACRkB,UAAUf;QACd,IAAI;YACAgB,aAAa;QACjB;IACJ;AACJ;AACA,SAAS1G,gCAAgCN,KAAK;IAC1C,IAAIiH,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACvC,IAAInH,KAAK,CAAC,gBAAgB,KAAK0G,aAAa1G,KAAK,CAAC,eAAe,KAAK0G,aAAa1G,KAAK,CAAC,aAAa,KAAK0G,aAAa1G,MAAMU,WAAW,KAAKgG,aAAa1G,KAAK,CAAC,aAAa,KAAK,GAAG;YAClL,sCAAsC;YACtCoH,QAAQC,KAAK,CAAC,CAAC,sBAAsB,EAAEtH,qBAAqBuH,IAAI,CAAC;;;;;;;sEAOP,CAAC;QAC/D;IACJ;AACJ"}
+{"version":3,"sources":["useTreeItem.js"],"sourcesContent":["import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { getNativeElementProps, useId, useMergedRefs, useEventCallback, slot } from '@fluentui/react-utilities';\nimport { elementContains } from '@fluentui/react-portal';\nimport { Space } from '@fluentui/keyboard-keys';\nimport { treeDataTypes } from '../../utils/tokens';\nimport { useTreeContext_unstable, useSubtreeContext_unstable, useTreeItemContext_unstable } from '../../contexts';\nimport { dataTreeItemValueAttrName } from '../../utils/getTreeItemValueFromElement';\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    var _props_value;\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 value = useId('fuiTreeItemValue-', (_props_value = props.value) === null || _props_value === void 0 ? void 0 : _props_value.toString());\n    const { onClick, onKeyDown, as = 'div', itemType = 'leaf', 'aria-level': level = contextLevel, ...rest } = props;\n    const [isActionsVisible, setActionsVisible] = React.useState(false);\n    const [isAsideVisible, setAsideVisible] = React.useState(true);\n    const handleActionsRef = React.useCallback((actionsElement)=>{\n        setAsideVisible(actionsElement === null);\n    }, []);\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 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 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        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: !open,\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                    event.preventDefault();\n                }\n                return;\n            case treeDataTypes.Enter:\n                {\n                    var _props_onOpenChange;\n                    const data = {\n                        value,\n                        event,\n                        open: !open,\n                        type: event.key,\n                        target: event.currentTarget\n                    };\n                    (_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 ? void 0 : _props_onOpenChange.call(props, event, data);\n                    return requestTreeResponse({\n                        ...data,\n                        itemType,\n                        requestType: 'open'\n                    });\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                    // 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: !open,\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                    return requestTreeResponse({\n                        ...data,\n                        itemType,\n                        parentValue,\n                        requestType: open ? 'open' : 'navigate'\n                    });\n                }\n            case treeDataTypes.ArrowRight:\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: !open,\n                    type: event.key,\n                    target: event.currentTarget\n                };\n                if (!open) {\n                    var _props_onOpenChange2;\n                    (_props_onOpenChange2 = props.onOpenChange) === null || _props_onOpenChange2 === void 0 ? void 0 : _props_onOpenChange2.call(props, event, data);\n                }\n                return requestTreeResponse({\n                    ...data,\n                    itemType,\n                    parentValue,\n                    requestType: open ? 'navigate' : 'open'\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 handleActionsVisible = useEventCallback((event)=>{\n        const isTargetFromSubtree = Boolean(subtreeRef.current && elementContains(subtreeRef.current, event.target));\n        if (!isTargetFromSubtree) {\n            setActionsVisible(true);\n        }\n    });\n    const handleActionsInvisible = useEventCallback((event)=>{\n        const isTargetFromSubtree = Boolean(subtreeRef.current && elementContains(subtreeRef.current, event.target));\n        const isRelatedTargetFromActions = Boolean(actionsRef.current && elementContains(actionsRef.current, event.relatedTarget));\n        if (isRelatedTargetFromActions) {\n            return setActionsVisible(true);\n        }\n        if (!isTargetFromSubtree) {\n            return setActionsVisible(false);\n        }\n    });\n    const handleChange = useEventCallback((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        actionsRef: useMergedRefs(handleActionsRef, actionsRef),\n        itemType,\n        level,\n        components: {\n            root: 'div'\n        },\n        isAsideVisible,\n        isActionsVisible,\n        root: slot.always(getNativeElementProps(as, {\n            tabIndex: -1,\n            [dataTreeItemValueAttrName]: value,\n            ...rest,\n            ref,\n            role: 'treeitem',\n            'aria-level': level,\n            'aria-checked': selectionMode === 'multiselect' ? checked : undefined,\n            // aria-selected is required according to WAI-ARIA spec\n            // https://www.w3.org/TR/wai-aria-1.1/#treeitem\n            // Casting: when selectionMode is 'single', checked is a boolean\n            'aria-selected': selectionMode === 'single' ? checked : 'false',\n            'aria-expanded': itemType === 'branch' ? open : undefined,\n            onClick: handleClick,\n            onKeyDown: handleKeyDown,\n            onMouseOver: handleActionsVisible,\n            onFocus: handleActionsVisible,\n            onMouseOut: handleActionsInvisible,\n            onBlur: handleActionsInvisible,\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","_props_value","treeType","useTreeContext_unstable","ctx","warnIfNoProperPropsFlatTreeItem","requestTreeResponse","level","contextLevel","useSubtreeContext_unstable","parentValue","useTreeItemContext_unstable","_props_parentValue","value","useId","toString","onClick","onKeyDown","as","itemType","rest","isActionsVisible","setActionsVisible","React","useState","isAsideVisible","setAsideVisible","handleActionsRef","useCallback","actionsElement","actionsRef","useRef","expandIconRef","layoutRef","subtreeRef","selectionRef","open","_props_open","openItems","has","selectionMode","checked","_ctx_checkedItems_get","checkedItems","get","handleClick","useEventCallback","event","isDefaultPrevented","isEventFromActions","current","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","_props_onOpenChange1","ArrowRight","_props_onOpenChange2","isTypeAheadCharacter","length","match","altKey","ctrlKey","metaKey","TypeAhead","handleActionsVisible","isTargetFromSubtree","Boolean","handleActionsInvisible","isRelatedTargetFromActions","relatedTarget","handleChange","useMergedRefs","components","root","slot","always","getNativeElementProps","tabIndex","dataTreeItemValueAttrName","role","undefined","onMouseOver","onFocus","onMouseOut","onBlur","onChange","elementType","process","env","NODE_ENV","console","error","name"],"mappings":"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"}

package/lib-commonjs/components/TreeItem/useTreeItemStyles.styles.js

@@ -20,7 +20,17 @@ const _react = require("@griffel/react");
 const treeItemClassNames = {
     root: 'fui-TreeItem'
 };
-const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
+const useBaseStyles = /*#__PURE__*/ (0, _react.__resetStyles)("r1hiwysc", "r1eoub7o", [
+    ".r1hiwysc{position:relative;cursor:pointer;display:flex;flex-direction:column;box-sizing:border-box;background-color:var(--colorSubtleBackground);color:var(--colorNeutralForeground2);padding-right:var(--spacingHorizontalNone);}",
+    ".r1hiwysc:focus{outline-style:none;}",
+    ".r1hiwysc:focus-visible{outline-style:none;}",
+    ".r1hiwysc[data-fui-focus-visible]>.fui-TreeItemLayout,.r1hiwysc[data-fui-focus-visible]>.fui-TreeItemPersonaLayout{border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);outline-color:var(--colorStrokeFocus2);outline-radius:var(--borderRadiusMedium);outline-width:2px;outline-style:solid;}",
+    ".r1eoub7o{position:relative;cursor:pointer;display:flex;flex-direction:column;box-sizing:border-box;background-color:var(--colorSubtleBackground);color:var(--colorNeutralForeground2);padding-left:var(--spacingHorizontalNone);}",
+    ".r1eoub7o:focus{outline-style:none;}",
+    ".r1eoub7o:focus-visible{outline-style:none;}",
+    ".r1eoub7o[data-fui-focus-visible]>.fui-TreeItemLayout,.r1eoub7o[data-fui-focus-visible]>.fui-TreeItemPersonaLayout{border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);outline-color:var(--colorStrokeFocus2);outline-radius:var(--borderRadiusMedium);outline-width:2px;outline-style:solid;}"
+]);
+const useStyles = /*#__PURE__*/ (0, _react.__styles)({
     level1: {
         iytv0q: "f10bgyvd"
     },
@@ -50,93 +60,6 @@ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
     },
     level10: {
         iytv0q: "fyat3t"
-    },
-    base: {
-        qhf8xq: "f10pi13n",
-        Bceei9c: "f1k6fduh",
-        mc9l5x: "f22iagw",
-        Beiy3e4: "f1vx9l62",
-        B7ck84d: "f1ewtqcl",
-        De3pzq: "fhovq9v",
-        sj55zd: "fkfq4zb",
-        z189sj: [
-            "flk2ux3",
-            "fkl3uby"
-        ]
-    },
-    focusIndicator: {
-        Brovlpu: "ftqa4ok",
-        B486eqv: "f2hkw1w",
-        B8q5s1w: "f8hki3x",
-        Bci5o5g: [
-            "f1d2448m",
-            "ffh67wi"
-        ],
-        n8qw10: "f1bjia2o",
-        Bdrgwmp: [
-            "ffh67wi",
-            "f1d2448m"
-        ],
-        Bm4h7ae: "f15bsgw9",
-        B7ys5i9: "f14e48fq",
-        Busjfv9: "f18yb2kv",
-        Bhk32uz: "fd6o370",
-        Bf4ptjt: "fh1cnn4",
-        kclons: [
-            "fy7oxxb",
-            "f184ne2d"
-        ],
-        Bhdgwq3: "fpukqih",
-        Blkhhs4: [
-            "f184ne2d",
-            "fy7oxxb"
-        ],
-        Bqtpl0w: "frrh606",
-        clg4pj: [
-            "f1v5zibi",
-            "fo2hd23"
-        ],
-        hgwjuy: "ful5kiu",
-        Bonggc9: [
-            "fo2hd23",
-            "f1v5zibi"
-        ],
-        B1tsrr9: [
-            "f1jqcqds",
-            "ftffrms"
-        ],
-        Dah5zi: [
-            "ftffrms",
-            "f1jqcqds"
-        ],
-        Bkh64rk: [
-            "f2e7qr6",
-            "fsr1zz6"
-        ],
-        qqdqy8: [
-            "fsr1zz6",
-            "f2e7qr6"
-        ],
-        B6dhp37: "f1dvezut",
-        i03rao: [
-            "fd0oaoj",
-            "f1cwg4i8"
-        ],
-        Boxcth7: "fjvm52t",
-        Bsom6fd: [
-            "f1cwg4i8",
-            "fd0oaoj"
-        ],
-        J0r882: "f57olzd",
-        Bule8hv: [
-            "f4stah7",
-            "fs1por5"
-        ],
-        Bjwuhne: "f480a47",
-        Ghsupd: [
-            "fs1por5",
-            "f4stah7"
-        ]
     }
 }, {
     d: [
@@ -149,56 +72,14 @@ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
         ".f1hrpd1h{--fluent-TreeItem--level:7;}",
         ".f1iy65d0{--fluent-TreeItem--level:8;}",
         ".ftg42e5{--fluent-TreeItem--level:9;}",
-        ".fyat3t{--fluent-TreeItem--level:10;}",
-        ".f10pi13n{position:relative;}",
-        ".f1k6fduh{cursor:pointer;}",
-        ".f22iagw{display:flex;}",
-        ".f1vx9l62{flex-direction:column;}",
-        ".f1ewtqcl{box-sizing:border-box;}",
-        ".fhovq9v{background-color:var(--colorSubtleBackground);}",
-        ".fkfq4zb{color:var(--colorNeutralForeground2);}",
-        ".flk2ux3{padding-right:var(--spacingHorizontalNone);}",
-        ".fkl3uby{padding-left:var(--spacingHorizontalNone);}",
-        ".f8hki3x[data-fui-focus-visible]{border-top-color:transparent;}",
-        ".f1d2448m[data-fui-focus-visible]{border-right-color:transparent;}",
-        ".ffh67wi[data-fui-focus-visible]{border-left-color:transparent;}",
-        ".f1bjia2o[data-fui-focus-visible]{border-bottom-color:transparent;}",
-        ".f15bsgw9[data-fui-focus-visible]::after{content:\"\";}",
-        ".f14e48fq[data-fui-focus-visible]::after{position:absolute;}",
-        ".f18yb2kv[data-fui-focus-visible]::after{pointer-events:none;}",
-        ".fd6o370[data-fui-focus-visible]::after{z-index:1;}",
-        ".fh1cnn4[data-fui-focus-visible]::after{border-top-style:solid;}",
-        ".fy7oxxb[data-fui-focus-visible]::after{border-right-style:solid;}",
-        ".f184ne2d[data-fui-focus-visible]::after{border-left-style:solid;}",
-        ".fpukqih[data-fui-focus-visible]::after{border-bottom-style:solid;}",
-        ".frrh606[data-fui-focus-visible]::after{border-top-width:2px;}",
-        ".f1v5zibi[data-fui-focus-visible]::after{border-right-width:2px;}",
-        ".fo2hd23[data-fui-focus-visible]::after{border-left-width:2px;}",
-        ".ful5kiu[data-fui-focus-visible]::after{border-bottom-width:2px;}",
-        ".f1jqcqds[data-fui-focus-visible]::after{border-bottom-right-radius:var(--borderRadiusMedium);}",
-        ".ftffrms[data-fui-focus-visible]::after{border-bottom-left-radius:var(--borderRadiusMedium);}",
-        ".f2e7qr6[data-fui-focus-visible]::after{border-top-right-radius:var(--borderRadiusMedium);}",
-        ".fsr1zz6[data-fui-focus-visible]::after{border-top-left-radius:var(--borderRadiusMedium);}",
-        ".f1dvezut[data-fui-focus-visible]::after{border-top-color:var(--colorStrokeFocus2);}",
-        ".fd0oaoj[data-fui-focus-visible]::after{border-right-color:var(--colorStrokeFocus2);}",
-        ".f1cwg4i8[data-fui-focus-visible]::after{border-left-color:var(--colorStrokeFocus2);}",
-        ".fjvm52t[data-fui-focus-visible]::after{border-bottom-color:var(--colorStrokeFocus2);}",
-        ".f57olzd[data-fui-focus-visible]::after{top:calc(2px * -1);}",
-        ".f4stah7[data-fui-focus-visible]::after{right:calc(2px * -1);}",
-        ".fs1por5[data-fui-focus-visible]::after{left:calc(2px * -1);}",
-        ".f480a47[data-fui-focus-visible]::after{bottom:calc(2px * -1);}"
-    ],
-    f: [
-        ".ftqa4ok:focus{outline-style:none;}"
-    ],
-    i: [
-        ".f2hkw1w:focus-visible{outline-style:none;}"
+        ".fyat3t{--fluent-TreeItem--level:10;}"
     ]
 });
 const useTreeItemStyles_unstable = (state)=>{
-    const rootStyles = useRootStyles();
+    const baseStyles = useBaseStyles();
+    const styles = useStyles();
     const { level } = state;
-    state.root.className = (0, _react.mergeClasses)(treeItemClassNames.root, isStaticallyDefinedLevel(level) && rootStyles[`level${level}`], rootStyles.base, rootStyles.focusIndicator, state.root.className);
+    state.root.className = (0, _react.mergeClasses)(treeItemClassNames.root, baseStyles, isStaticallyDefinedLevel(level) && styles[`level${level}`], state.root.className);
     return state;
 };
 function isStaticallyDefinedLevel(level) {