@fluentui/react-tree 9.0.0-beta.2 → 9.0.0-beta.21

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

@@ -0,0 +1,149 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useRootTree", {
+    enumerable: true,
+    get: ()=>useRootTree
+});
+const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _reactDom = /*#__PURE__*/ _interopRequireWildcard(require("react-dom"));
+const _reactUtilities = require("@fluentui/react-utilities");
+const _hooks = require("../../hooks");
+const _tokens = require("../../utils/tokens");
+function useRootTree(props, ref) {
+    warnIfNoProperPropsRootTree(props);
+    const { appearance ='subtle' , size ='medium'  } = props;
+    const [openItems, updateOpenItems] = (0, _hooks.useOpenItemsState)(props);
+    const [navigate, navigationRef] = (0, _hooks.useNestedTreeNavigation)();
+    const requestOpenChange = (data)=>{
+        var _props_onOpenChange;
+        (_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 ? void 0 : _props_onOpenChange.call(props, data.event, data);
+        if (data.event.isDefaultPrevented()) {
+            return;
+        }
+        return updateOpenItems(data);
+    };
+    const requestNavigation = (data)=>{
+        var _props_onNavigation_unstable;
+        (_props_onNavigation_unstable = props.onNavigation_unstable) === null || _props_onNavigation_unstable === void 0 ? void 0 : _props_onNavigation_unstable.call(props, data.event, data);
+        if (data.event.isDefaultPrevented()) {
+            return;
+        }
+        navigate(data);
+        if (data.type === _tokens.treeDataTypes.ArrowDown || data.type === _tokens.treeDataTypes.ArrowUp) {
+            data.event.preventDefault();
+        }
+    };
+    const handleTreeItemClick = ({ event , value , itemType , type  })=>{
+        _reactDom.unstable_batchedUpdates(()=>{
+            requestOpenChange({
+                event,
+                value,
+                open: itemType === 'branch' && !openItems.has(value),
+                type,
+                target: event.currentTarget
+            });
+            requestNavigation({
+                event,
+                value,
+                target: event.currentTarget,
+                type: _tokens.treeDataTypes.Click
+            });
+        });
+    };
+    const handleTreeItemKeyDown = ({ event , type , value , itemType  })=>{
+        const open = openItems.has(value);
+        switch(type){
+            case _tokens.treeDataTypes.ArrowRight:
+                if (itemType === 'leaf') {
+                    return;
+                }
+                if (!open) {
+                    return requestOpenChange({
+                        event,
+                        value,
+                        open: true,
+                        type: _tokens.treeDataTypes.ArrowRight,
+                        target: event.currentTarget
+                    });
+                }
+                return requestNavigation({
+                    event,
+                    value,
+                    type,
+                    target: event.currentTarget
+                });
+            case _tokens.treeDataTypes.Enter:
+                return requestOpenChange({
+                    event,
+                    value,
+                    open: itemType === 'branch' && !open,
+                    type: _tokens.treeDataTypes.Enter,
+                    target: event.currentTarget
+                });
+            case _tokens.treeDataTypes.ArrowLeft:
+                if (open && itemType === 'branch') {
+                    return requestOpenChange({
+                        event,
+                        value,
+                        open: false,
+                        type: _tokens.treeDataTypes.ArrowLeft,
+                        target: event.currentTarget
+                    });
+                }
+                return requestNavigation({
+                    event,
+                    value,
+                    target: event.currentTarget,
+                    type: _tokens.treeDataTypes.ArrowLeft
+                });
+            case _tokens.treeDataTypes.End:
+            case _tokens.treeDataTypes.Home:
+            case _tokens.treeDataTypes.ArrowUp:
+            case _tokens.treeDataTypes.ArrowDown:
+            case _tokens.treeDataTypes.TypeAhead:
+                return requestNavigation({
+                    event,
+                    value,
+                    type,
+                    target: event.currentTarget
+                });
+        }
+    };
+    const requestTreeResponse = (0, _reactUtilities.useEventCallback)((request)=>{
+        switch(request.event.type){
+            case 'click':
+                // casting is required here as we're narrowing down the event to only click events
+                return handleTreeItemClick(request);
+            case 'keydown':
+                // casting is required here as we're narrowing down the event to only keyboard events
+                return handleTreeItemKeyDown(request);
+        }
+    });
+    return {
+        components: {
+            root: 'div'
+        },
+        open: true,
+        appearance,
+        size,
+        level: 1,
+        openItems,
+        requestTreeResponse,
+        root: (0, _reactUtilities.getNativeElementProps)('div', {
+            ref: (0, _reactUtilities.useMergedRefs)(navigationRef, ref),
+            role: 'tree',
+            ...props
+        })
+    };
+}
+function warnIfNoProperPropsRootTree(props) {
+    if (process.env.NODE_ENV === 'development') {
+        if (!props['aria-label'] && !props['aria-labelledby']) {
+            // eslint-disable-next-line no-console
+            console.warn('Tree must have either a `aria-label` or `aria-labelledby` property defined');
+        }
+    }
+}

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

@@ -0,0 +1 @@
+{"version":3,"sources":["useRootTree.js"],"sourcesContent":["import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { getNativeElementProps, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { useNestedTreeNavigation, useOpenItemsState } from '../../hooks';\nimport { treeDataTypes } from '../../utils/tokens';\n/**\n * Create the state required to render the root level Tree.\n *\n * @param props - props from this instance of Tree\n * @param ref - reference to root HTMLElement of Tree\n */ export function useRootTree(props, ref) {\n    warnIfNoProperPropsRootTree(props);\n    const { appearance ='subtle' , size ='medium'  } = props;\n    const [openItems, updateOpenItems] = useOpenItemsState(props);\n    const [navigate, navigationRef] = useNestedTreeNavigation();\n    const requestOpenChange = (data)=>{\n        var _props_onOpenChange;\n        (_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 ? void 0 : _props_onOpenChange.call(props, data.event, data);\n        if (data.event.isDefaultPrevented()) {\n            return;\n        }\n        return updateOpenItems(data);\n    };\n    const requestNavigation = (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, data.event, data);\n        if (data.event.isDefaultPrevented()) {\n            return;\n        }\n        navigate(data);\n        if (data.type === treeDataTypes.ArrowDown || data.type === treeDataTypes.ArrowUp) {\n            data.event.preventDefault();\n        }\n    };\n    const handleTreeItemClick = ({ event , value , itemType , type  })=>{\n        ReactDOM.unstable_batchedUpdates(()=>{\n            requestOpenChange({\n                event,\n                value,\n                open: itemType === 'branch' && !openItems.has(value),\n                type,\n                target: event.currentTarget\n            });\n            requestNavigation({\n                event,\n                value,\n                target: event.currentTarget,\n                type: treeDataTypes.Click\n            });\n        });\n    };\n    const handleTreeItemKeyDown = ({ event , type , value , itemType  })=>{\n        const open = openItems.has(value);\n        switch(type){\n            case treeDataTypes.ArrowRight:\n                if (itemType === 'leaf') {\n                    return;\n                }\n                if (!open) {\n                    return requestOpenChange({\n                        event,\n                        value,\n                        open: true,\n                        type: treeDataTypes.ArrowRight,\n                        target: event.currentTarget\n                    });\n                }\n                return requestNavigation({\n                    event,\n                    value,\n                    type,\n                    target: event.currentTarget\n                });\n            case treeDataTypes.Enter:\n                return requestOpenChange({\n                    event,\n                    value,\n                    open: itemType === 'branch' && !open,\n                    type: treeDataTypes.Enter,\n                    target: event.currentTarget\n                });\n            case treeDataTypes.ArrowLeft:\n                if (open && itemType === 'branch') {\n                    return requestOpenChange({\n                        event,\n                        value,\n                        open: false,\n                        type: treeDataTypes.ArrowLeft,\n                        target: event.currentTarget\n                    });\n                }\n                return requestNavigation({\n                    event,\n                    value,\n                    target: event.currentTarget,\n                    type: treeDataTypes.ArrowLeft\n                });\n            case treeDataTypes.End:\n            case treeDataTypes.Home:\n            case treeDataTypes.ArrowUp:\n            case treeDataTypes.ArrowDown:\n            case treeDataTypes.TypeAhead:\n                return requestNavigation({\n                    event,\n                    value,\n                    type,\n                    target: event.currentTarget\n                });\n        }\n    };\n    const requestTreeResponse = useEventCallback((request)=>{\n        switch(request.event.type){\n            case 'click':\n                // casting is required here as we're narrowing down the event to only click events\n                return handleTreeItemClick(request);\n            case 'keydown':\n                // casting is required here as we're narrowing down the event to only keyboard events\n                return handleTreeItemKeyDown(request);\n        }\n    });\n    return {\n        components: {\n            root: 'div'\n        },\n        open: true,\n        appearance,\n        size,\n        level: 1,\n        openItems,\n        requestTreeResponse,\n        root: getNativeElementProps('div', {\n            ref: useMergedRefs(navigationRef, ref),\n            role: 'tree',\n            ...props\n        })\n    };\n}\nfunction warnIfNoProperPropsRootTree(props) {\n    if (process.env.NODE_ENV === 'development') {\n        if (!props['aria-label'] && !props['aria-labelledby']) {\n            // eslint-disable-next-line no-console\n            console.warn('Tree must have either a `aria-label` or `aria-labelledby` property defined');\n        }\n    }\n}\n"],"names":["useRootTree","props","ref","warnIfNoProperPropsRootTree","appearance","size","openItems","updateOpenItems","useOpenItemsState","navigate","navigationRef","useNestedTreeNavigation","requestOpenChange","data","_props_onOpenChange","onOpenChange","call","event","isDefaultPrevented","requestNavigation","_props_onNavigation_unstable","onNavigation_unstable","type","treeDataTypes","ArrowDown","ArrowUp","preventDefault","handleTreeItemClick","value","itemType","ReactDOM","unstable_batchedUpdates","open","has","target","currentTarget","Click","handleTreeItemKeyDown","ArrowRight","Enter","ArrowLeft","End","Home","TypeAhead","requestTreeResponse","useEventCallback","request","components","root","level","getNativeElementProps","useMergedRefs","role","process","env","NODE_ENV","console","warn"],"mappings":"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"}

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

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useSubtree", {
+    enumerable: true,
+    get: ()=>useSubtree
+});
+const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _reactUtilities = require("@fluentui/react-utilities");
+const _contexts = require("../../contexts");
+function useSubtree(props, ref) {
+    const contextAppearance = (0, _contexts.useTreeContext_unstable)((ctx)=>ctx.appearance);
+    const contextSize = (0, _contexts.useTreeContext_unstable)((ctx)=>ctx.size);
+    const subtreeRef = (0, _contexts.useTreeItemContext_unstable)((ctx)=>ctx.subtreeRef);
+    const value = (0, _contexts.useTreeItemContext_unstable)((ctx)=>ctx.value);
+    const { appearance =contextAppearance !== null && contextAppearance !== void 0 ? contextAppearance : 'subtle' , size =contextSize !== null && contextSize !== void 0 ? contextSize : 'medium'  } = props;
+    const parentLevel = (0, _contexts.useTreeContext_unstable)((ctx)=>ctx.level);
+    const openItems = (0, _contexts.useTreeContext_unstable)((ctx)=>ctx.openItems);
+    const requestTreeResponse = (0, _contexts.useTreeContext_unstable)((ctx)=>ctx.requestTreeResponse);
+    const open = openItems.has(value);
+    return {
+        open,
+        components: {
+            root: 'div'
+        },
+        appearance,
+        size,
+        level: parentLevel + 1,
+        root: (0, _reactUtilities.getNativeElementProps)('div', {
+            ref: (0, _reactUtilities.useMergedRefs)(ref, subtreeRef),
+            role: 'group',
+            ...props
+        }),
+        openItems,
+        requestTreeResponse
+    };
+}

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

@@ -0,0 +1 @@
+{"version":3,"sources":["useSubtree.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs } from '@fluentui/react-utilities';\nimport { useTreeContext_unstable, useTreeItemContext_unstable } from '../../contexts';\n/**\n * Create the state required to render a sub-level Tree.\n *\n * @param props - props from this instance of Tree\n * @param ref - reference to root HTMLElement of Tree\n */ export function useSubtree(props, ref) {\n    const contextAppearance = useTreeContext_unstable((ctx)=>ctx.appearance);\n    const contextSize = useTreeContext_unstable((ctx)=>ctx.size);\n    const subtreeRef = useTreeItemContext_unstable((ctx)=>ctx.subtreeRef);\n    const value = useTreeItemContext_unstable((ctx)=>ctx.value);\n    const { appearance =contextAppearance !== null && contextAppearance !== void 0 ? contextAppearance : 'subtle' , size =contextSize !== null && contextSize !== void 0 ? contextSize : 'medium'  } = props;\n    const parentLevel = useTreeContext_unstable((ctx)=>ctx.level);\n    const openItems = useTreeContext_unstable((ctx)=>ctx.openItems);\n    const requestTreeResponse = useTreeContext_unstable((ctx)=>ctx.requestTreeResponse);\n    const open = openItems.has(value);\n    return {\n        open,\n        components: {\n            root: 'div'\n        },\n        appearance,\n        size,\n        level: parentLevel + 1,\n        root: getNativeElementProps('div', {\n            ref: useMergedRefs(ref, subtreeRef),\n            role: 'group',\n            ...props\n        }),\n        openItems,\n        requestTreeResponse\n    };\n}\n"],"names":["useSubtree","props","ref","contextAppearance","useTreeContext_unstable","ctx","appearance","contextSize","size","subtreeRef","useTreeItemContext_unstable","value","parentLevel","level","openItems","requestTreeResponse","open","has","components","root","getNativeElementProps","useMergedRefs","role"],"mappings":";;;;+BAQoBA;;aAAAA;;;6DARG;gCAC8B;0BACgB;AAM1D,SAASA,WAAWC,KAAK,EAAEC,GAAG,EAAE;IACvC,MAAMC,oBAAoBC,IAAAA,iCAAuB,EAAC,CAACC,MAAMA,IAAIC,UAAU;IACvE,MAAMC,cAAcH,IAAAA,iCAAuB,EAAC,CAACC,MAAMA,IAAIG,IAAI;IAC3D,MAAMC,aAAaC,IAAAA,qCAA2B,EAAC,CAACL,MAAMA,IAAII,UAAU;IACpE,MAAME,QAAQD,IAAAA,qCAA2B,EAAC,CAACL,MAAMA,IAAIM,KAAK;IAC1D,MAAM,EAAEL,YAAYH,sBAAsB,IAAI,IAAIA,sBAAsB,KAAK,IAAIA,oBAAoB,QAAQ,CAAA,EAAGK,MAAMD,gBAAgB,IAAI,IAAIA,gBAAgB,KAAK,IAAIA,cAAc,QAAQ,CAAA,EAAG,GAAGN;IACnM,MAAMW,cAAcR,IAAAA,iCAAuB,EAAC,CAACC,MAAMA,IAAIQ,KAAK;IAC5D,MAAMC,YAAYV,IAAAA,iCAAuB,EAAC,CAACC,MAAMA,IAAIS,SAAS;IAC9D,MAAMC,sBAAsBX,IAAAA,iCAAuB,EAAC,CAACC,MAAMA,IAAIU,mBAAmB;IAClF,MAAMC,OAAOF,UAAUG,GAAG,CAACN;IAC3B,OAAO;QACHK;QACAE,YAAY;YACRC,MAAM;QACV;QACAb;QACAE;QACAK,OAAOD,cAAc;QACrBO,MAAMC,IAAAA,qCAAqB,EAAC,OAAO;YAC/BlB,KAAKmB,IAAAA,6BAAa,EAACnB,KAAKO;YACxBa,MAAM;YACN,GAAGrB,KAAK;QACZ;QACAa;QACAC;IACJ;AACJ"}

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

@@ -1,120 +1,20 @@
 "use strict";
-
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
 });
-exports.useTree_unstable = void 0;
-const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
-const contexts_1 = /*#__PURE__*/require("../../contexts");
-const hooks_1 = /*#__PURE__*/require("../../hooks");
-const tokens_1 = /*#__PURE__*/require("../../utils/tokens");
-/**
- * Create the state required to render Tree.
- *
- * The returned state can be modified with hooks such as useTreeStyles_unstable,
- * before being passed to renderTree_unstable.
- *
- * @param props - props from this instance of Tree
- * @param ref - reference to root HTMLElement of Tree
- */
-const useTree_unstable = (props, ref) => {
-  const isSubtree = contexts_1.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 ? useSubtree(props, ref) : useRootTree(props, ref);
+Object.defineProperty(exports, "useTree_unstable", {
+    enumerable: true,
+    get: ()=>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 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
+    // 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);
 };
-exports.useTree_unstable = useTree_unstable;
-/**
- * Create the state required to render a sub-level Tree.
- *
- * @param props - props from this instance of Tree
- * @param ref - reference to root HTMLElement of Tree
- */
-function useSubtree(props, ref) {
-  const contextAppearance = contexts_1.useTreeContext_unstable(ctx => ctx.appearance);
-  const contextSize = contexts_1.useTreeContext_unstable(ctx => ctx.size);
-  const {
-    appearance = contextAppearance !== null && contextAppearance !== void 0 ? contextAppearance : 'subtle',
-    size = contextSize !== null && contextSize !== void 0 ? contextSize : 'medium'
-  } = props;
-  const parentLevel = contexts_1.useTreeContext_unstable(ctx => ctx.level);
-  const openItems = contexts_1.useTreeContext_unstable(ctx => ctx.openItems);
-  const requestOpenChange = contexts_1.useTreeContext_unstable(ctx => ctx.requestOpenChange);
-  const requestNavigation = contexts_1.useTreeContext_unstable(ctx => ctx.requestNavigation);
-  return {
-    components: {
-      root: 'div'
-    },
-    appearance,
-    size,
-    level: parentLevel + 1,
-    root: react_utilities_1.getNativeElementProps('div', {
-      ref,
-      role: 'group',
-      ...props
-    }),
-    openItems,
-    requestOpenChange,
-    requestNavigation
-  };
-}
-/**
- * Create the state required to render the root level Tree.
- *
- * @param props - props from this instance of Tree
- * @param ref - reference to root HTMLElement of Tree
- */
-function useRootTree(props, ref) {
-  warnIfNoProperPropsRootTree(props);
-  const {
-    appearance = 'subtle',
-    size = 'medium'
-  } = props;
-  const [openItems, updateOpenItems] = hooks_1.useOpenItemsState(props);
-  const [navigate, navigationRef] = hooks_1.useNestedTreeNavigation();
-  const requestOpenChange = react_utilities_1.useEventCallback(data => {
-    var _a;
-    (_a = props.onOpenChange) === null || _a === void 0 ? void 0 : _a.call(props, data.event, data);
-    if (data.event.isDefaultPrevented()) {
-      return;
-    }
-    return updateOpenItems(data);
-  });
-  const requestNavigation = react_utilities_1.useEventCallback(data => {
-    var _a;
-    (_a = props.onNavigation_unstable) === null || _a === void 0 ? void 0 : _a.call(props, data.event, data);
-    if (data.event.isDefaultPrevented()) {
-      return;
-    }
-    navigate(data);
-    if (data.type === tokens_1.treeDataTypes.arrowDown || data.type === tokens_1.treeDataTypes.arrowUp) {
-      data.event.preventDefault();
-    }
-  });
-  return {
-    components: {
-      root: 'div'
-    },
-    appearance,
-    size,
-    level: 1,
-    openItems,
-    requestOpenChange,
-    requestNavigation,
-    root: react_utilities_1.getNativeElementProps('div', {
-      ref: react_utilities_1.useMergedRefs(navigationRef, ref),
-      role: 'tree',
-      ...props
-    })
-  };
-}
-function warnIfNoProperPropsRootTree(props) {
-  if (process.env.NODE_ENV === 'development') {
-    if (!props['aria-label'] && !props['aria-labelledby']) {
-      // eslint-disable-next-line no-console
-      console.warn('Tree must have either a `aria-label` or `aria-labelledby` property defined');
-    }
-  }
-}
-//# sourceMappingURL=useTree.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["react_utilities_1","require","contexts_1","hooks_1","tokens_1","useTree_unstable","props","ref","isSubtree","useTreeContext_unstable","ctx","level","useSubtree","useRootTree","exports","contextAppearance","appearance","contextSize","size","parentLevel","openItems","requestOpenChange","requestNavigation","components","root","getNativeElementProps","role","warnIfNoProperPropsRootTree","updateOpenItems","useOpenItemsState","navigate","navigationRef","useNestedTreeNavigation","useEventCallback","data","_a","onOpenChange","call","event","isDefaultPrevented","onNavigation_unstable","type","treeDataTypes","arrowDown","arrowUp","preventDefault","useMergedRefs","process","env","NODE_ENV","console","warn"],"sources":["../src/packages/react-components/react-tree/src/components/Tree/useTree.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { TreeOpenChangeData, TreeProps, TreeState, TreeNavigationData_unstable } from './Tree.types';\nimport { useTreeContext_unstable } from '../../contexts';\nimport { useNestedTreeNavigation, useOpenItemsState } from '../../hooks';\nimport { treeDataTypes } from '../../utils/tokens';\n\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 */\nexport const useTree_unstable = (props: TreeProps, ref: React.Ref<HTMLElement>): TreeState => {\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\n/**\n * Create the state required to render a sub-level Tree.\n *\n * @param props - props from this instance of Tree\n * @param ref - reference to root HTMLElement of Tree\n */\nfunction useSubtree(props: TreeProps, ref: React.Ref<HTMLElement>): TreeState {\n  const contextAppearance = useTreeContext_unstable(ctx => ctx.appearance);\n  const contextSize = useTreeContext_unstable(ctx => ctx.size);\n\n  const { appearance = contextAppearance ?? 'subtle', size = contextSize ?? 'medium' } = props;\n\n  const parentLevel = useTreeContext_unstable(ctx => ctx.level);\n  const openItems = useTreeContext_unstable(ctx => ctx.openItems);\n  const requestOpenChange = useTreeContext_unstable(ctx => ctx.requestOpenChange);\n  const requestNavigation = useTreeContext_unstable(ctx => ctx.requestNavigation);\n\n  return {\n    components: {\n      root: 'div',\n    },\n    appearance,\n    size,\n    level: parentLevel + 1,\n    root: getNativeElementProps('div', {\n      ref,\n      role: 'group',\n      ...props,\n    }),\n    openItems,\n    requestOpenChange,\n    requestNavigation,\n  };\n}\n\n/**\n * Create the state required to render the root level Tree.\n *\n * @param props - props from this instance of Tree\n * @param ref - reference to root HTMLElement of Tree\n */\nfunction useRootTree(props: TreeProps, ref: React.Ref<HTMLElement>): TreeState {\n  warnIfNoProperPropsRootTree(props);\n\n  const { appearance = 'subtle', size = 'medium' } = props;\n\n  const [openItems, updateOpenItems] = useOpenItemsState(props);\n  const [navigate, navigationRef] = useNestedTreeNavigation();\n\n  const requestOpenChange = useEventCallback((data: TreeOpenChangeData) => {\n    props.onOpenChange?.(data.event, data);\n    if (data.event.isDefaultPrevented()) {\n      return;\n    }\n    return updateOpenItems(data);\n  });\n\n  const requestNavigation = useEventCallback((data: TreeNavigationData_unstable) => {\n    props.onNavigation_unstable?.(data.event, data);\n    if (data.event.isDefaultPrevented()) {\n      return;\n    }\n    navigate(data);\n    if (data.type === treeDataTypes.arrowDown || data.type === treeDataTypes.arrowUp) {\n      data.event.preventDefault();\n    }\n  });\n\n  return {\n    components: {\n      root: 'div',\n    },\n    appearance,\n    size,\n    level: 1,\n    openItems,\n    requestOpenChange,\n    requestNavigation,\n    root: getNativeElementProps('div', {\n      ref: useMergedRefs(navigationRef, ref),\n      role: 'tree',\n      ...props,\n    }),\n  };\n}\n\nfunction warnIfNoProperPropsRootTree(props: Pick<TreeProps, 'aria-label' | 'aria-labelledby'>) {\n  if (process.env.NODE_ENV === 'development') {\n    if (!props['aria-label'] && !props['aria-labelledby']) {\n      // eslint-disable-next-line no-console\n      console.warn('Tree must have either a `aria-label` or `aria-labelledby` property defined');\n    }\n  }\n}\n"],"mappings":"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"}
+{"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"}

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

@@ -1,33 +1,24 @@
 "use strict";
-
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
+});
+Object.defineProperty(exports, "useTreeContextValues_unstable", {
+    enumerable: true,
+    get: ()=>useTreeContextValues_unstable
 });
-exports.useTreeContextValues_unstable = void 0;
 function useTreeContextValues_unstable(state) {
-  const {
-    openItems,
-    level,
-    appearance,
-    size,
-    requestOpenChange,
-    requestNavigation
-  } = state;
-  /**
+    const { openItems , level , appearance , size , requestTreeResponse  } = state;
+    /**
    * This context is created with "@fluentui/react-context-selector",
    * there is no sense to memoize it
-   */
-  const tree = {
-    appearance,
-    size,
-    level,
-    openItems,
-    requestOpenChange,
-    requestNavigation
-  };
-  return {
-    tree
-  };
+   */ const tree = {
+        appearance,
+        size,
+        level,
+        openItems,
+        requestTreeResponse
+    };
+    return {
+        tree
+    };
 }
-exports.useTreeContextValues_unstable = useTreeContextValues_unstable;
-//# sourceMappingURL=useTreeContextValues.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["useTreeContextValues_unstable","state","openItems","level","appearance","size","requestOpenChange","requestNavigation","tree","exports"],"sources":["../src/packages/react-components/react-tree/src/components/Tree/useTreeContextValues.ts"],"sourcesContent":["import { TreeContextValue } from '../../contexts';\nimport type { TreeContextValues, TreeState } from './Tree.types';\n\nexport function useTreeContextValues_unstable(state: TreeState): TreeContextValues {\n  const { openItems, level, appearance, size, requestOpenChange, requestNavigation } = state;\n  /**\n   * This context is created with \"@fluentui/react-context-selector\",\n   * there is no sense to memoize it\n   */\n  const tree: TreeContextValue = {\n    appearance,\n    size,\n    level,\n    openItems,\n    requestOpenChange,\n    requestNavigation,\n  };\n\n  return { tree };\n}\n"],"mappings":";;;;;;AAGA,SAAgBA,6BAA6BA,CAACC,KAAgB;EAC5D,MAAM;IAAEC,SAAS;IAAEC,KAAK;IAAEC,UAAU;IAAEC,IAAI;IAAEC,iBAAiB;IAAEC;EAAiB,CAAE,GAAGN,KAAK;EAC1F;;;;EAIA,MAAMO,IAAI,GAAqB;IAC7BJ,UAAU;IACVC,IAAI;IACJF,KAAK;IACLD,SAAS;IACTI,iBAAiB;IACjBC;GACD;EAED,OAAO;IAAEC;EAAI,CAAE;AACjB;AAhBAC,OAAA,CAAAT,6BAAA,GAAAA,6BAAA"}
+{"version":3,"sources":["useTreeContextValues.js"],"sourcesContent":["export function useTreeContextValues_unstable(state) {\n    const { openItems , level , 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        appearance,\n        size,\n        level,\n        openItems,\n        requestTreeResponse\n    };\n    return {\n        tree\n    };\n}\n"],"names":["useTreeContextValues_unstable","state","openItems","level","appearance","size","requestTreeResponse","tree"],"mappings":";;;;+BAAgBA;;aAAAA;;AAAT,SAASA,8BAA8BC,KAAK,EAAE;IACjD,MAAM,EAAEC,UAAS,EAAGC,MAAK,EAAGC,WAAU,EAAGC,KAAI,EAAGC,oBAAmB,EAAG,GAAGL;IACzE;;;GAGD,GAAG,MAAMM,OAAO;QACXH;QACAC;QACAF;QACAD;QACAI;IACJ;IACA,OAAO;QACHC;IACJ;AACJ"}

package/lib-commonjs/components/Tree/useTreeStyles.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, {
+    treeClassNames: ()=>treeClassNames,
+    useTreeStyles_unstable: ()=>useTreeStyles_unstable
+});
+const _react = require("@griffel/react");
+const treeClassNames = {
+    root: 'fui-Tree'
+};
+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{grid-row-start:subtree;}",
+        ".fwt6ga{grid-column-start:subtree;}",
+        ".fi45nfw{grid-row-end:subtree;}",
+        ".f10ort2y{grid-column-end:subtree;}"
+    ]
+});
+const useTreeStyles_unstable = (state)=>{
+    const styles = useStyles();
+    const isSubtree = state.level > 0;
+    state.root.className = (0, _react.mergeClasses)(treeClassNames.root, styles.root, isSubtree && styles.subtree, state.root.className);
+    return state;
+}; //# sourceMappingURL=useTreeStyles.styles.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["useTreeStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } 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    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{grid-row-start:subtree;}\", \".fwt6ga{grid-column-start:subtree;}\", \".fi45nfw{grid-row-end:subtree;}\", \".f10ort2y{grid-column-end:subtree;}\"]\n});\nexport const useTreeStyles_unstable = state => {\n  const styles = useStyles();\n  const isSubtree = state.level > 0;\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","Bh6795r","Bnnss6s","xawz","Ijaq50","Br312pm","nk6f5a","Bw0ie65","d","state","styles","isSubtree","level","className","mergeClasses"],"mappings":";;;;;;;;;;;IAEaA,cAAc,MAAdA;IAqBAC,sBAAsB,MAAtBA;;uBAvBsC;AAE5C,MAAMD,iBAAiB;IAC5BE,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;QAAsC;QAAuC;QAAmC;KAAsC;AAClnB;AACO,MAAMf,yBAAyBgB,CAAAA,QAAS;IAC7C,MAAMC,SAASf;IACf,MAAMgB,YAAYF,MAAMG,KAAK,GAAG;IAChCH,MAAMf,IAAI,CAACmB,SAAS,GAAGC,IAAAA,mBAAY,EAACtB,eAAeE,IAAI,EAAEgB,OAAOhB,IAAI,EAAEiB,aAAaD,OAAOV,OAAO,EAAES,MAAMf,IAAI,CAACmB,SAAS;IACvH,OAAOJ;AACT,GACA,gDAAgD"}

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

@@ -1,22 +1,21 @@
 "use strict";
-
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
 });
-exports.TreeItem = void 0;
-const React = /*#__PURE__*/require("react");
-const useTreeItem_1 = /*#__PURE__*/require("./useTreeItem");
-const renderTreeItem_1 = /*#__PURE__*/require("./renderTreeItem");
-const useTreeItemStyles_1 = /*#__PURE__*/require("./useTreeItemStyles");
-const useTreeItemContextValues_1 = /*#__PURE__*/require("./useTreeItemContextValues");
-/**
- * TreeItem component - TODO: add more docs
- */
-exports.TreeItem = /*#__PURE__*/React.forwardRef((props, ref) => {
-  const state = useTreeItem_1.useTreeItem_unstable(props, ref);
-  useTreeItemStyles_1.useTreeItemStyles_unstable(state);
-  const contextValues = useTreeItemContextValues_1.useTreeItemContextValues_unstable(state);
-  return renderTreeItem_1.renderTreeItem_unstable(state, contextValues);
+Object.defineProperty(exports, "TreeItem", {
+    enumerable: true,
+    get: ()=>TreeItem
 });
-exports.TreeItem.displayName = 'TreeItem';
-//# sourceMappingURL=TreeItem.js.map
+const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _useTreeItem = require("./useTreeItem");
+const _renderTreeItem = require("./renderTreeItem");
+const _useTreeItemStylesStyles = require("./useTreeItemStyles.styles");
+const _useTreeItemContextValues = require("./useTreeItemContextValues");
+const TreeItem = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
+    const state = (0, _useTreeItem.useTreeItem_unstable)(props, ref);
+    (0, _useTreeItemStylesStyles.useTreeItemStyles_unstable)(state);
+    const contextValues = (0, _useTreeItemContextValues.useTreeItemContextValues_unstable)(state);
+    return (0, _renderTreeItem.renderTreeItem_unstable)(state, contextValues);
+});
+TreeItem.displayName = 'TreeItem';

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

@@ -1 +1 @@
-{"version":3,"names":["React","require","useTreeItem_1","renderTreeItem_1","useTreeItemStyles_1","useTreeItemContextValues_1","exports","TreeItem","forwardRef","props","ref","state","useTreeItem_unstable","useTreeItemStyles_unstable","contextValues","useTreeItemContextValues_unstable","renderTreeItem_unstable","displayName"],"sources":["../src/packages/react-components/react-tree/src/components/TreeItem/TreeItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItem_unstable } from './useTreeItem';\nimport { renderTreeItem_unstable } from './renderTreeItem';\nimport { useTreeItemStyles_unstable } from './useTreeItemStyles';\nimport type { TreeItemProps } from './TreeItem.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTreeItemContextValues_unstable } from './useTreeItemContextValues';\n\n/**\n * TreeItem component - TODO: add more docs\n */\nexport const TreeItem: ForwardRefComponent<TreeItemProps> = React.forwardRef((props, ref) => {\n  const state = useTreeItem_unstable(props, ref);\n\n  useTreeItemStyles_unstable(state);\n  const contextValues = useTreeItemContextValues_unstable(state);\n  return renderTreeItem_unstable(state, contextValues);\n});\n\nTreeItem.displayName = 'TreeItem';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,aAAA,gBAAAD,OAAA;AACA,MAAAE,gBAAA,gBAAAF,OAAA;AACA,MAAAG,mBAAA,gBAAAH,OAAA;AAGA,MAAAI,0BAAA,gBAAAJ,OAAA;AAEA;;;AAGaK,OAAA,CAAAC,QAAQ,gBAAuCP,KAAK,CAACQ,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAC1F,MAAMC,KAAK,GAAGT,aAAA,CAAAU,oBAAoB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAE9CN,mBAAA,CAAAS,0BAA0B,CAACF,KAAK,CAAC;EACjC,MAAMG,aAAa,GAAGT,0BAAA,CAAAU,iCAAiC,CAACJ,KAAK,CAAC;EAC9D,OAAOR,gBAAA,CAAAa,uBAAuB,CAACL,KAAK,EAAEG,aAAa,CAAC;AACtD,CAAC,CAAC;AAEFR,OAAA,CAAAC,QAAQ,CAACU,WAAW,GAAG,UAAU"}
+{"version":3,"sources":["TreeItem.js"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItem_unstable } from './useTreeItem';\nimport { renderTreeItem_unstable } from './renderTreeItem';\nimport { useTreeItemStyles_unstable } from './useTreeItemStyles.styles';\nimport { useTreeItemContextValues_unstable } from './useTreeItemContextValues';\n/**\n * The `TreeItem` component represents a single item in a tree.\n * It expects a certain order of children to work properly: the first child should be the node itself,\n * and the second child should be a nested subtree in the form of another Tree component or a standalone TreeItem.\n * This order follows the same order as document traversal for the TreeWalker API in JavaScript:\n * https://developer.mozilla.org/en-US/docs/Web/API/TreeWalker.\n * The content and layout of a TreeItem can be defined using the TreeItemLayout or TreeItemPersonaLayout component,\n * which should be used as a direct child of TreeItem.\n *\n * When a TreeItem has nested child subtree, an expand/collapse control is displayed,\n * allowing the user to show or hide the children.\n */ export const TreeItem = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n    const state = useTreeItem_unstable(props, ref);\n    useTreeItemStyles_unstable(state);\n    const contextValues = useTreeItemContextValues_unstable(state);\n    return renderTreeItem_unstable(state, contextValues);\n});\nTreeItem.displayName = 'TreeItem';\n"],"names":["TreeItem","React","forwardRef","props","ref","state","useTreeItem_unstable","useTreeItemStyles_unstable","contextValues","useTreeItemContextValues_unstable","renderTreeItem_unstable","displayName"],"mappings":";;;;+BAgBiBA;;aAAAA;;;6DAhBM;6BACc;gCACG;yCACG;0CACO;AAYvC,MAAMA,WAAW,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAM;IACrE,MAAMC,QAAQC,IAAAA,iCAAoB,EAACH,OAAOC;IAC1CG,IAAAA,mDAA0B,EAACF;IAC3B,MAAMG,gBAAgBC,IAAAA,2DAAiC,EAACJ;IACxD,OAAOK,IAAAA,uCAAuB,EAACL,OAAOG;AAC1C;AACAR,SAASW,WAAW,GAAG"}

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

@@ -1,7 +1,6 @@
 "use strict";
-
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
 });
-const tokens_1 = /*#__PURE__*/require("../../utils/tokens");
-//# sourceMappingURL=TreeItem.types.js.map
+const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));

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

@@ -1 +1 @@
-{"version":3,"names":["tokens_1","require"],"sources":["../src/packages/react-components/react-tree/src/components/TreeItem/TreeItem.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, ExtractSlotProps, Slot } from '@fluentui/react-utilities';\nimport type { ButtonContextValue } from '@fluentui/react-button';\nimport type { TreeItemContextValue } from '../../contexts';\nimport { treeItemLevelToken } from '../../utils/tokens';\nimport * as React from 'react';\n\nexport type TreeItemCSSProperties = React.CSSProperties & { [treeItemLevelToken]?: string | number };\n\nexport type TreeItemSlots = {\n  root: Slot<ExtractSlotProps<Slot<'div'> & { style?: TreeItemCSSProperties }>>;\n  content: NonNullable<Slot<'div'>>;\n  subtree?: Slot<'span'>;\n  /**\n   * Expand icon slot,\n   * by default renders a chevron icon to indicate opening and closing\n   */\n  expandIcon?: Slot<'span'>;\n  /**\n   * Actions slot that renders on the end of tree item\n   * when the item is hovered/focused\n   */\n  actions?: Slot<'span'>;\n};\n\nexport type TreeItemContextValues = {\n  treeItem: TreeItemContextValue;\n  button: ButtonContextValue;\n};\n\n/**\n * TreeItem Props\n */\nexport type TreeItemProps = ComponentProps<Partial<TreeItemSlots>> & {\n  /**\n   * If a TreeItem is a leaf, it'll not present the `expandIcon` slot by default.\n   * This attribute is used to force the decision if a TreeItem is a leaf or not. By not providing this property\n   * this will be inferred by the presence of a subtree as part of the TreeItem children.\n   */\n  leaf?: boolean;\n};\n\n/**\n * State used in rendering TreeItem\n */\nexport type TreeItemState = ComponentState<TreeItemSlots> & {\n  open: boolean;\n  isLeaf: boolean;\n  level: number;\n  /**\n   * By design, a button included on the actions slot should be small\n   */\n  buttonSize: 'small';\n  isActionsVisible: boolean;\n};\n"],"mappings":";;;;;AAGA,MAAAA,QAAA,gBAAAC,OAAA"}
+{"version":3,"sources":["TreeItem.types.js"],"sourcesContent":["import * as React from 'react';\n"],"names":[],"mappings":";;;;;6DAAuB"}

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

@@ -1,12 +1,10 @@
 "use strict";
-
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
 });
-const tslib_1 = /*#__PURE__*/require("tslib");
-tslib_1.__exportStar(require("./TreeItem"), exports);
-tslib_1.__exportStar(require("./TreeItem.types"), exports);
-tslib_1.__exportStar(require("./renderTreeItem"), exports);
-tslib_1.__exportStar(require("./useTreeItem"), exports);
-tslib_1.__exportStar(require("./useTreeItemStyles"), exports);
-//# sourceMappingURL=index.js.map
+const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
+_exportStar(require("./TreeItem"), exports);
+_exportStar(require("./TreeItem.types"), exports);
+_exportStar(require("./renderTreeItem"), exports);
+_exportStar(require("./useTreeItem"), exports);
+_exportStar(require("./useTreeItemStyles.styles"), exports);

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

@@ -1 +1 @@
-{"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-tree/src/components/TreeItem/index.ts"],"sourcesContent":["export * from './TreeItem';\nexport * from './TreeItem.types';\nexport * from './renderTreeItem';\nexport * from './useTreeItem';\nexport * from './useTreeItemStyles';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,gBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,sBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,sBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,mBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,yBAAAC,OAAA"}
+{"version":3,"sources":["index.js"],"sourcesContent":["export * from './TreeItem';\nexport * from './TreeItem.types';\nexport * from './renderTreeItem';\nexport * from './useTreeItem';\nexport * from './useTreeItemStyles.styles';\n"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA"}