@fluentui/react-tree 9.0.0-beta.17 → 9.0.0-beta.19

package/lib/components/TreeItem/renderTreeItem.js.map

@@ -1 +1 @@
-{"version":3,"names":["createElement","getSlotsNext","TreeItemProvider","renderTreeItem_unstable","state","contextValues","slots","slotProps","root","value","treeItem","children"],"sources":["../../../src/components/TreeItem/renderTreeItem.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport type { TreeItemState, TreeItemSlots, TreeItemContextValues } from './TreeItem.types';\nimport { TreeItemProvider } from '../../contexts';\n\n/**\n * Render the final JSX of TreeItem\n */\nexport const renderTreeItem_unstable = (state: TreeItemState, contextValues: TreeItemContextValues) => {\n  const { slots, slotProps } = getSlotsNext<TreeItemSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      <TreeItemProvider value={contextValues.treeItem}>{slotProps.root.children}</TreeItemProvider>\n    </slots.root>\n  );\n};\n"],"mappings":"AAAA,2BACA,yBAEA,SAASA,aAAa,QAAQ;AAC9B,SAASC,YAAY,QAAQ;AAE7B,SAASC,gBAAgB,QAAQ;AAEjC;;;AAGA,OAAO,MAAMC,uBAAA,GAA0BA,CAACC,KAAA,EAAsBC,aAAA,KAAyC;EACrG,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGN,YAAA,CAA4BG,KAAA;EAEzD,oBACEJ,aAdJ,CAcKM,KAAA,CAAME,IAAI,EAAKD,SAAA,CAAUC,IAAI,eAC5BR,aAfN,CAeOE,gBAAA;IAAiBO,KAAA,EAAOJ,aAAA,CAAcK;KAAWH,SAAA,CAAUC,IAAI,CAACG,QAAQ;AAG/E"}
+{"version":3,"sources":["renderTreeItem.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport type { TreeItemState, TreeItemSlots, TreeItemContextValues } from './TreeItem.types';\nimport { TreeItemProvider } from '../../contexts';\n\n/**\n * Render the final JSX of TreeItem\n */\nexport const renderTreeItem_unstable = (state: TreeItemState, contextValues: TreeItemContextValues) => {\n  const { slots, slotProps } = getSlotsNext<TreeItemSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      <TreeItemProvider value={contextValues.treeItem}>{slotProps.root.children}</TreeItemProvider>\n    </slots.root>\n  );\n};\n"],"names":["createElement","getSlotsNext","TreeItemProvider","renderTreeItem_unstable","state","contextValues","slots","slotProps","root","value","treeItem","children"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,YAAY,QAAQ,4BAA4B;AAEzD,SAASC,gBAAgB,QAAQ,iBAAiB;AAElD;;CAEC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAAsBC,gBAAyC;IACrG,MAAM,EAAEC,MAAK,EAAEC,UAAS,EAAE,GAAGN,aAA4BG;IAEzD,qBACE,AAdJ,cAcKE,MAAME,IAAI,EAAKD,UAAUC,IAAI,gBAC5B,AAfN,cAeON;QAAiBO,OAAOJ,cAAcK,QAAQ;OAAGH,UAAUC,IAAI,CAACG,QAAQ;AAG/E,EAAE"}

package/lib/components/TreeItem/useTreeItem.js

@@ -12,129 +12,119 @@ import { treeDataTypes } from '../../utils/tokens';
  *
  * @param props - props from this instance of TreeItem
  * @param ref - reference to root HTMLElement of TreeItem
- */
-export function useTreeItem_unstable(props, ref) {
-  const contextLevel = useTreeContext_unstable(ctx => ctx.level);
-  const id = useId('fui-TreeItem-', props.id);
-  const {
-    onClick,
-    onKeyDown,
-    as = 'div',
-    value = id,
-    itemType = 'leaf',
-    'aria-level': level = contextLevel,
-    ...rest
-  } = props;
-  const requestTreeResponse = useTreeContext_unstable(ctx => ctx.requestTreeResponse);
-  const [isActionsVisible, setActionsVisible] = React.useState(false);
-  const [isAsideVisible, setAsideVisible] = React.useState(true);
-  const handleActionsRef = actions => {
-    setAsideVisible(actions === null);
-  };
-  const open = useTreeContext_unstable(ctx => ctx.openItems.has(value));
-  const actionsRef = React.useRef(null);
-  const expandIconRef = React.useRef(null);
-  const layoutRef = React.useRef(null);
-  const subtreeRef = React.useRef(null);
-  const handleClick = useEventCallback(event => {
-    onClick === null || onClick === void 0 ? void 0 : onClick(event);
-    if (event.isDefaultPrevented()) {
-      return;
-    }
-    const isEventFromActions = actionsRef.current && elementContains(actionsRef.current, event.target);
-    if (isEventFromActions) {
-      return;
-    }
-    const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target);
-    if (isEventFromSubtree) {
-      return;
-    }
-    const isFromExpandIcon = expandIconRef.current && elementContains(expandIconRef.current, event.target);
-    requestTreeResponse({
-      event,
-      itemType,
-      value,
-      type: isFromExpandIcon ? treeDataTypes.ExpandIconClick : treeDataTypes.Click
-    });
-  });
-  const handleKeyDown = useEventCallback(event => {
-    onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
-    if (event.isDefaultPrevented()) {
-      return;
-    }
-    if (event.currentTarget !== event.target) {
-      return;
-    }
-    switch (event.key) {
-      case treeDataTypes.End:
-      case treeDataTypes.Home:
-      case treeDataTypes.Enter:
-      case treeDataTypes.ArrowUp:
-      case treeDataTypes.ArrowDown:
-      case treeDataTypes.ArrowLeft:
-      case treeDataTypes.ArrowRight:
-        return requestTreeResponse({
-          event,
-          itemType,
-          value,
-          type: event.key
+ */ export function useTreeItem_unstable(props, ref) {
+    const contextLevel = useTreeContext_unstable((ctx)=>ctx.level);
+    const id = useId('fui-TreeItem-', props.id);
+    const { onClick , onKeyDown , as ='div' , value =id , itemType ='leaf' , 'aria-level': level = contextLevel , ...rest } = props;
+    const requestTreeResponse = useTreeContext_unstable((ctx)=>ctx.requestTreeResponse);
+    const [isActionsVisible, setActionsVisible] = React.useState(false);
+    const [isAsideVisible, setAsideVisible] = React.useState(true);
+    const handleActionsRef = (actions)=>{
+        setAsideVisible(actions === null);
+    };
+    const open = useTreeContext_unstable((ctx)=>ctx.openItems.has(value));
+    const actionsRef = React.useRef(null);
+    const expandIconRef = React.useRef(null);
+    const layoutRef = React.useRef(null);
+    const subtreeRef = React.useRef(null);
+    const handleClick = useEventCallback((event)=>{
+        onClick === null || onClick === void 0 ? void 0 : onClick(event);
+        if (event.isDefaultPrevented()) {
+            return;
+        }
+        const isEventFromActions = actionsRef.current && elementContains(actionsRef.current, event.target);
+        if (isEventFromActions) {
+            return;
+        }
+        const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target);
+        if (isEventFromSubtree) {
+            return;
+        }
+        const isFromExpandIcon = expandIconRef.current && elementContains(expandIconRef.current, event.target);
+        requestTreeResponse({
+            event,
+            itemType,
+            value,
+            type: isFromExpandIcon ? treeDataTypes.ExpandIconClick : treeDataTypes.Click
         });
-    }
-    const isTypeAheadCharacter = event.key.length === 1 && event.key.match(/\w/) && !event.altKey && !event.ctrlKey && !event.metaKey;
-    if (isTypeAheadCharacter) {
-      requestTreeResponse({
-        event,
-        itemType,
+    });
+    const handleKeyDown = useEventCallback((event)=>{
+        onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
+        if (event.isDefaultPrevented()) {
+            return;
+        }
+        if (event.currentTarget !== event.target) {
+            return;
+        }
+        switch(event.key){
+            case treeDataTypes.End:
+            case treeDataTypes.Home:
+            case treeDataTypes.Enter:
+            case treeDataTypes.ArrowUp:
+            case treeDataTypes.ArrowDown:
+            case treeDataTypes.ArrowLeft:
+            case treeDataTypes.ArrowRight:
+                return requestTreeResponse({
+                    event,
+                    itemType,
+                    value,
+                    type: event.key
+                });
+        }
+        const isTypeAheadCharacter = event.key.length === 1 && event.key.match(/\w/) && !event.altKey && !event.ctrlKey && !event.metaKey;
+        if (isTypeAheadCharacter) {
+            requestTreeResponse({
+                event,
+                itemType,
+                value,
+                type: treeDataTypes.TypeAhead
+            });
+        }
+    });
+    const handleActionsVisible = useEventCallback((event)=>{
+        const isTargetFromSubtree = Boolean(subtreeRef.current && elementContains(subtreeRef.current, event.target));
+        if (!isTargetFromSubtree) {
+            setActionsVisible(true);
+        }
+    });
+    const handleActionsInvisible = useEventCallback((event)=>{
+        const isTargetFromSubtree = Boolean(subtreeRef.current && elementContains(subtreeRef.current, event.target));
+        const isRelatedTargetFromActions = Boolean(actionsRef.current && elementContains(actionsRef.current, event.relatedTarget));
+        if (isRelatedTargetFromActions) {
+            return setActionsVisible(true);
+        }
+        if (!isTargetFromSubtree) {
+            return setActionsVisible(false);
+        }
+    });
+    return {
         value,
-        type: treeDataTypes.TypeAhead
-      });
-    }
-  });
-  const handleActionsVisible = useEventCallback(event => {
-    const isTargetFromSubtree = Boolean(subtreeRef.current && elementContains(subtreeRef.current, event.target));
-    if (!isTargetFromSubtree) {
-      setActionsVisible(true);
-    }
-  });
-  const handleActionsInvisible = useEventCallback(event => {
-    const isTargetFromSubtree = Boolean(subtreeRef.current && elementContains(subtreeRef.current, event.target));
-    const isRelatedTargetFromActions = Boolean(actionsRef.current && elementContains(actionsRef.current, event.relatedTarget));
-    if (isRelatedTargetFromActions) {
-      return setActionsVisible(true);
-    }
-    if (!isTargetFromSubtree) {
-      return setActionsVisible(false);
-    }
-  });
-  return {
-    value,
-    open,
-    subtreeRef,
-    actionsRef: useMergedRefs(actionsRef, handleActionsRef),
-    expandIconRef,
-    layoutRef,
-    itemType,
-    isActionsVisible,
-    isAsideVisible,
-    level,
-    components: {
-      root: 'div'
-    },
-    root: getNativeElementProps(as, {
-      tabIndex: -1,
-      ...rest,
-      id,
-      ref,
-      'aria-level': level,
-      'aria-expanded': itemType === 'branch' ? open : undefined,
-      role: 'treeitem',
-      onClick: handleClick,
-      onKeyDown: handleKeyDown,
-      onMouseOver: handleActionsVisible,
-      onFocus: handleActionsVisible,
-      onMouseOut: handleActionsInvisible,
-      onBlur: handleActionsInvisible
-    })
-  };
+        open,
+        subtreeRef,
+        actionsRef: useMergedRefs(actionsRef, handleActionsRef),
+        expandIconRef,
+        layoutRef,
+        itemType,
+        isActionsVisible,
+        isAsideVisible,
+        level,
+        components: {
+            root: 'div'
+        },
+        root: getNativeElementProps(as, {
+            tabIndex: -1,
+            ...rest,
+            id,
+            ref,
+            'aria-level': level,
+            'aria-expanded': itemType === 'branch' ? open : undefined,
+            role: 'treeitem',
+            onClick: handleClick,
+            onKeyDown: handleKeyDown,
+            onMouseOver: handleActionsVisible,
+            onFocus: handleActionsVisible,
+            onMouseOut: handleActionsInvisible,
+            onBlur: handleActionsInvisible
+        })
+    };
 }
-//# sourceMappingURL=useTreeItem.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","getNativeElementProps","useId","useMergedRefs","useEventCallback","elementContains","useTreeContext_unstable","treeDataTypes","useTreeItem_unstable","props","ref","contextLevel","ctx","level","id","onClick","onKeyDown","as","value","itemType","rest","requestTreeResponse","isActionsVisible","setActionsVisible","useState","isAsideVisible","setAsideVisible","handleActionsRef","actions","open","openItems","has","actionsRef","useRef","expandIconRef","layoutRef","subtreeRef","handleClick","event","isDefaultPrevented","isEventFromActions","current","target","isEventFromSubtree","isFromExpandIcon","type","ExpandIconClick","Click","handleKeyDown","currentTarget","key","End","Home","Enter","ArrowUp","ArrowDown","ArrowLeft","ArrowRight","isTypeAheadCharacter","length","match","altKey","ctrlKey","metaKey","TypeAhead","handleActionsVisible","isTargetFromSubtree","Boolean","handleActionsInvisible","isRelatedTargetFromActions","relatedTarget","components","root","tabIndex","undefined","role","onMouseOver","onFocus","onMouseOut","onBlur"],"sources":["../../../src/components/TreeItem/useTreeItem.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useId, useMergedRefs } from '@fluentui/react-utilities';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport { elementContains } from '@fluentui/react-portal';\nimport type { TreeItemProps, TreeItemState } from './TreeItem.types';\nimport { useTreeContext_unstable } from '../../contexts/index';\nimport { treeDataTypes } from '../../utils/tokens';\n\n/**\n * Create the state required to render TreeItem.\n *\n * The returned state can be modified with hooks such as useTreeItemStyles_unstable,\n * before being passed to renderTreeItem_unstable.\n *\n * @param props - props from this instance of TreeItem\n * @param ref - reference to root HTMLElement of TreeItem\n */\nexport function useTreeItem_unstable<Value = string>(\n  props: TreeItemProps<Value>,\n  ref: React.Ref<HTMLDivElement>,\n): TreeItemState {\n  const contextLevel = useTreeContext_unstable(ctx => ctx.level);\n\n  const id = useId('fui-TreeItem-', props.id);\n\n  const {\n    onClick,\n    onKeyDown,\n    as = 'div',\n    value = id,\n    itemType = 'leaf',\n    'aria-level': level = contextLevel,\n    ...rest\n  } = props;\n\n  const requestTreeResponse = useTreeContext_unstable(ctx => ctx.requestTreeResponse);\n\n  const [isActionsVisible, setActionsVisible] = React.useState(false);\n  const [isAsideVisible, setAsideVisible] = React.useState(true);\n\n  const handleActionsRef = (actions: HTMLDivElement | null) => {\n    setAsideVisible(actions === null);\n  };\n\n  const open = useTreeContext_unstable(ctx => ctx.openItems.has(value));\n\n  const actionsRef = React.useRef<HTMLDivElement>(null);\n  const expandIconRef = React.useRef<HTMLDivElement>(null);\n  const layoutRef = React.useRef<HTMLDivElement>(null);\n  const subtreeRef = React.useRef<HTMLDivElement>(null);\n\n  const handleClick = useEventCallback((event: React.MouseEvent<HTMLDivElement>) => {\n    onClick?.(event);\n    if (event.isDefaultPrevented()) {\n      return;\n    }\n    const isEventFromActions = actionsRef.current && elementContains(actionsRef.current, event.target as Node);\n    if (isEventFromActions) {\n      return;\n    }\n    const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target as Node);\n    if (isEventFromSubtree) {\n      return;\n    }\n    const isFromExpandIcon = expandIconRef.current && elementContains(expandIconRef.current, event.target as Node);\n    requestTreeResponse({\n      event,\n      itemType,\n      value,\n      type: isFromExpandIcon ? treeDataTypes.ExpandIconClick : treeDataTypes.Click,\n    });\n  });\n\n  const handleKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLDivElement>) => {\n    onKeyDown?.(event);\n    if (event.isDefaultPrevented()) {\n      return;\n    }\n    if (event.currentTarget !== event.target) {\n      return;\n    }\n    switch (event.key) {\n      case treeDataTypes.End:\n      case treeDataTypes.Home:\n      case treeDataTypes.Enter:\n      case treeDataTypes.ArrowUp:\n      case treeDataTypes.ArrowDown:\n      case treeDataTypes.ArrowLeft:\n      case treeDataTypes.ArrowRight:\n        return requestTreeResponse({ event, itemType, value, type: event.key });\n    }\n    const isTypeAheadCharacter =\n      event.key.length === 1 && event.key.match(/\\w/) && !event.altKey && !event.ctrlKey && !event.metaKey;\n    if (isTypeAheadCharacter) {\n      requestTreeResponse({ event, itemType, value, type: treeDataTypes.TypeAhead });\n    }\n  });\n\n  const handleActionsVisible = useEventCallback((event: React.FocusEvent | React.MouseEvent) => {\n    const isTargetFromSubtree = Boolean(\n      subtreeRef.current && elementContains(subtreeRef.current, event.target as Node),\n    );\n    if (!isTargetFromSubtree) {\n      setActionsVisible(true);\n    }\n  });\n\n  const handleActionsInvisible = useEventCallback((event: React.FocusEvent | React.MouseEvent) => {\n    const isTargetFromSubtree = Boolean(\n      subtreeRef.current && elementContains(subtreeRef.current, event.target as Node),\n    );\n    const isRelatedTargetFromActions = Boolean(\n      actionsRef.current && elementContains(actionsRef.current, event.relatedTarget as Node),\n    );\n    if (isRelatedTargetFromActions) {\n      return setActionsVisible(true);\n    }\n    if (!isTargetFromSubtree) {\n      return setActionsVisible(false);\n    }\n  });\n\n  return {\n    value,\n    open,\n    subtreeRef,\n    actionsRef: useMergedRefs(actionsRef, handleActionsRef),\n    expandIconRef,\n    layoutRef,\n    itemType,\n    isActionsVisible,\n    isAsideVisible,\n    level,\n    components: {\n      root: 'div',\n    },\n    root: getNativeElementProps(as, {\n      tabIndex: -1,\n      ...rest,\n      id,\n      ref,\n      'aria-level': level,\n      'aria-expanded': itemType === 'branch' ? open : undefined,\n      role: 'treeitem',\n      onClick: handleClick,\n      onKeyDown: handleKeyDown,\n      onMouseOver: handleActionsVisible,\n      onFocus: handleActionsVisible,\n      onMouseOut: handleActionsInvisible,\n      onBlur: handleActionsInvisible,\n    }),\n  };\n}\n"],"mappings":"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"}
+{"version":3,"sources":["useTreeItem.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useId, useMergedRefs } from '@fluentui/react-utilities';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport { elementContains } from '@fluentui/react-portal';\nimport type { TreeItemProps, TreeItemState } from './TreeItem.types';\nimport { useTreeContext_unstable } from '../../contexts/index';\nimport { treeDataTypes } from '../../utils/tokens';\n\n/**\n * Create the state required to render TreeItem.\n *\n * The returned state can be modified with hooks such as useTreeItemStyles_unstable,\n * before being passed to renderTreeItem_unstable.\n *\n * @param props - props from this instance of TreeItem\n * @param ref - reference to root HTMLElement of TreeItem\n */\nexport function useTreeItem_unstable<Value = string>(\n  props: TreeItemProps<Value>,\n  ref: React.Ref<HTMLDivElement>,\n): TreeItemState {\n  const contextLevel = useTreeContext_unstable(ctx => ctx.level);\n\n  const id = useId('fui-TreeItem-', props.id);\n\n  const {\n    onClick,\n    onKeyDown,\n    as = 'div',\n    value = id,\n    itemType = 'leaf',\n    'aria-level': level = contextLevel,\n    ...rest\n  } = props;\n\n  const requestTreeResponse = useTreeContext_unstable(ctx => ctx.requestTreeResponse);\n\n  const [isActionsVisible, setActionsVisible] = React.useState(false);\n  const [isAsideVisible, setAsideVisible] = React.useState(true);\n\n  const handleActionsRef = (actions: HTMLDivElement | null) => {\n    setAsideVisible(actions === null);\n  };\n\n  const open = useTreeContext_unstable(ctx => ctx.openItems.has(value));\n\n  const actionsRef = React.useRef<HTMLDivElement>(null);\n  const expandIconRef = React.useRef<HTMLDivElement>(null);\n  const layoutRef = React.useRef<HTMLDivElement>(null);\n  const subtreeRef = React.useRef<HTMLDivElement>(null);\n\n  const handleClick = useEventCallback((event: React.MouseEvent<HTMLDivElement>) => {\n    onClick?.(event);\n    if (event.isDefaultPrevented()) {\n      return;\n    }\n    const isEventFromActions = actionsRef.current && elementContains(actionsRef.current, event.target as Node);\n    if (isEventFromActions) {\n      return;\n    }\n    const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target as Node);\n    if (isEventFromSubtree) {\n      return;\n    }\n    const isFromExpandIcon = expandIconRef.current && elementContains(expandIconRef.current, event.target as Node);\n    requestTreeResponse({\n      event,\n      itemType,\n      value,\n      type: isFromExpandIcon ? treeDataTypes.ExpandIconClick : treeDataTypes.Click,\n    });\n  });\n\n  const handleKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLDivElement>) => {\n    onKeyDown?.(event);\n    if (event.isDefaultPrevented()) {\n      return;\n    }\n    if (event.currentTarget !== event.target) {\n      return;\n    }\n    switch (event.key) {\n      case treeDataTypes.End:\n      case treeDataTypes.Home:\n      case treeDataTypes.Enter:\n      case treeDataTypes.ArrowUp:\n      case treeDataTypes.ArrowDown:\n      case treeDataTypes.ArrowLeft:\n      case treeDataTypes.ArrowRight:\n        return requestTreeResponse({ event, itemType, value, type: event.key });\n    }\n    const isTypeAheadCharacter =\n      event.key.length === 1 && event.key.match(/\\w/) && !event.altKey && !event.ctrlKey && !event.metaKey;\n    if (isTypeAheadCharacter) {\n      requestTreeResponse({ event, itemType, value, type: treeDataTypes.TypeAhead });\n    }\n  });\n\n  const handleActionsVisible = useEventCallback((event: React.FocusEvent | React.MouseEvent) => {\n    const isTargetFromSubtree = Boolean(\n      subtreeRef.current && elementContains(subtreeRef.current, event.target as Node),\n    );\n    if (!isTargetFromSubtree) {\n      setActionsVisible(true);\n    }\n  });\n\n  const handleActionsInvisible = useEventCallback((event: React.FocusEvent | React.MouseEvent) => {\n    const isTargetFromSubtree = Boolean(\n      subtreeRef.current && elementContains(subtreeRef.current, event.target as Node),\n    );\n    const isRelatedTargetFromActions = Boolean(\n      actionsRef.current && elementContains(actionsRef.current, event.relatedTarget as Node),\n    );\n    if (isRelatedTargetFromActions) {\n      return setActionsVisible(true);\n    }\n    if (!isTargetFromSubtree) {\n      return setActionsVisible(false);\n    }\n  });\n\n  return {\n    value,\n    open,\n    subtreeRef,\n    actionsRef: useMergedRefs(actionsRef, handleActionsRef),\n    expandIconRef,\n    layoutRef,\n    itemType,\n    isActionsVisible,\n    isAsideVisible,\n    level,\n    components: {\n      root: 'div',\n    },\n    root: getNativeElementProps(as, {\n      tabIndex: -1,\n      ...rest,\n      id,\n      ref,\n      'aria-level': level,\n      'aria-expanded': itemType === 'branch' ? open : undefined,\n      role: 'treeitem',\n      onClick: handleClick,\n      onKeyDown: handleKeyDown,\n      onMouseOver: handleActionsVisible,\n      onFocus: handleActionsVisible,\n      onMouseOut: handleActionsInvisible,\n      onBlur: handleActionsInvisible,\n    }),\n  };\n}\n"],"names":["React","getNativeElementProps","useId","useMergedRefs","useEventCallback","elementContains","useTreeContext_unstable","treeDataTypes","useTreeItem_unstable","props","ref","contextLevel","ctx","level","id","onClick","onKeyDown","as","value","itemType","rest","requestTreeResponse","isActionsVisible","setActionsVisible","useState","isAsideVisible","setAsideVisible","handleActionsRef","actions","open","openItems","has","actionsRef","useRef","expandIconRef","layoutRef","subtreeRef","handleClick","event","isDefaultPrevented","isEventFromActions","current","target","isEventFromSubtree","isFromExpandIcon","type","ExpandIconClick","Click","handleKeyDown","currentTarget","key","End","Home","Enter","ArrowUp","ArrowDown","ArrowLeft","ArrowRight","isTypeAheadCharacter","length","match","altKey","ctrlKey","metaKey","TypeAhead","handleActionsVisible","isTargetFromSubtree","Boolean","handleActionsInvisible","isRelatedTargetFromActions","relatedTarget","components","root","tabIndex","undefined","role","onMouseOver","onFocus","onMouseOut","onBlur"],"mappings":"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"}

package/lib/components/TreeItem/useTreeItemContextValues.js

@@ -1,32 +1,20 @@
 export function useTreeItemContextValues_unstable(state) {
-  const {
-    value,
-    isActionsVisible,
-    isAsideVisible,
-    actionsRef,
-    itemType,
-    layoutRef,
-    subtreeRef,
-    expandIconRef,
-    open
-  } = state;
-  /**
-  * This context is created with "@fluentui/react-context-selector",
-  * there is no sense to memoize it
-  */
-  const treeItem = {
-    isActionsVisible,
-    isAsideVisible,
-    value,
-    actionsRef,
-    itemType,
-    layoutRef,
-    subtreeRef,
-    expandIconRef,
-    open
-  };
-  return {
-    treeItem
-  };
+    const { value , isActionsVisible , isAsideVisible , actionsRef , itemType , layoutRef , subtreeRef , expandIconRef , open  } = state;
+    /**
+   * This context is created with "@fluentui/react-context-selector",
+   * there is no sense to memoize it
+   */ const treeItem = {
+        isActionsVisible,
+        isAsideVisible,
+        value,
+        actionsRef,
+        itemType,
+        layoutRef,
+        subtreeRef,
+        expandIconRef,
+        open
+    };
+    return {
+        treeItem
+    };
 }
-//# sourceMappingURL=useTreeItemContextValues.js.map

package/lib/components/TreeItem/useTreeItemContextValues.js.map

@@ -1 +1 @@
-{"version":3,"names":["useTreeItemContextValues_unstable","state","value","isActionsVisible","isAsideVisible","actionsRef","itemType","layoutRef","subtreeRef","expandIconRef","open","treeItem"],"sources":["../../../src/components/TreeItem/useTreeItemContextValues.ts"],"sourcesContent":["import type { TreeItemContextValue } from '../../contexts';\nimport type { TreeItemContextValues, TreeItemState } from './TreeItem.types';\n\nexport function useTreeItemContextValues_unstable(\n  state: Pick<TreeItemState, keyof TreeItemContextValue>,\n): TreeItemContextValues {\n  const { value, isActionsVisible, isAsideVisible, actionsRef, itemType, layoutRef, subtreeRef, expandIconRef, open } =\n    state;\n\n  /**\n   * This context is created with \"@fluentui/react-context-selector\",\n   * there is no sense to memoize it\n   */\n  const treeItem: TreeItemContextValue = {\n    isActionsVisible,\n    isAsideVisible,\n    value,\n    actionsRef,\n    itemType,\n    layoutRef,\n    subtreeRef,\n    expandIconRef,\n    open,\n  };\n\n  return { treeItem };\n}\n"],"mappings":"AAGA,OAAO,SAASA,kCACdC,KAAsD,EAC/B;EACvB,MAAM;IAAEC,KAAA;IAAOC,gBAAA;IAAkBC,cAAA;IAAgBC,UAAA;IAAYC,QAAA;IAAUC,SAAA;IAAWC,UAAA;IAAYC,aAAA;IAAeC;EAAI,CAAE,GACjHT,KAAA;EAEF;;;;EAIA,MAAMU,QAAA,GAAiC;IACrCR,gBAAA;IACAC,cAAA;IACAF,KAAA;IACAG,UAAA;IACAC,QAAA;IACAC,SAAA;IACAC,UAAA;IACAC,aAAA;IACAC;EACF;EAEA,OAAO;IAAEC;EAAS;AACpB"}
+{"version":3,"sources":["useTreeItemContextValues.ts"],"sourcesContent":["import type { TreeItemContextValue } from '../../contexts';\nimport type { TreeItemContextValues, TreeItemState } from './TreeItem.types';\n\nexport function useTreeItemContextValues_unstable(\n  state: Pick<TreeItemState, keyof TreeItemContextValue>,\n): TreeItemContextValues {\n  const { value, isActionsVisible, isAsideVisible, actionsRef, itemType, layoutRef, subtreeRef, expandIconRef, open } =\n    state;\n\n  /**\n   * This context is created with \"@fluentui/react-context-selector\",\n   * there is no sense to memoize it\n   */\n  const treeItem: TreeItemContextValue = {\n    isActionsVisible,\n    isAsideVisible,\n    value,\n    actionsRef,\n    itemType,\n    layoutRef,\n    subtreeRef,\n    expandIconRef,\n    open,\n  };\n\n  return { treeItem };\n}\n"],"names":["useTreeItemContextValues_unstable","state","value","isActionsVisible","isAsideVisible","actionsRef","itemType","layoutRef","subtreeRef","expandIconRef","open","treeItem"],"mappings":"AAGA,OAAO,SAASA,kCACdC,KAAsD,EAC/B;IACvB,MAAM,EAAEC,MAAK,EAAEC,iBAAgB,EAAEC,eAAc,EAAEC,WAAU,EAAEC,SAAQ,EAAEC,UAAS,EAAEC,WAAU,EAAEC,cAAa,EAAEC,KAAI,EAAE,GACjHT;IAEF;;;GAGC,GACD,MAAMU,WAAiC;QACrCR;QACAC;QACAF;QACAG;QACAC;QACAC;QACAC;QACAC;QACAC;IACF;IAEA,OAAO;QAAEC;IAAS;AACpB,CAAC"}

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

@@ -75,13 +75,13 @@ const useRootStyles = /*#__PURE__*/__styles({
     i03rao: ["fd0oaoj", "f1cwg4i8"],
     Boxcth7: "fjvm52t",
     Bsom6fd: ["f1cwg4i8", "fd0oaoj"],
-    J0r882: "fdiulkx",
-    Bjwuhne: "f1yalx80",
-    Ghsupd: ["fq22d5a", "f1jw7pan"],
-    Bule8hv: ["f1jw7pan", "fq22d5a"]
+    J0r882: "f57olzd",
+    Bule8hv: ["f4stah7", "fs1por5"],
+    Bjwuhne: "f480a47",
+    Ghsupd: ["fs1por5", "f4stah7"]
   }
 }, {
-  d: [".f10bgyvd{--fluent-TreeItem--level:1;}", ".f1h0rod3{--fluent-TreeItem--level:2;}", ".fgoqafk{--fluent-TreeItem--level:3;}", ".f75dvuh{--fluent-TreeItem--level:4;}", ".fqk7yw6{--fluent-TreeItem--level:5;}", ".f1r3z17b{--fluent-TreeItem--level:6;}", ".f1hrpd1h{--fluent-TreeItem--level:7;}", ".f1iy65d0{--fluent-TreeItem--level:8;}", ".ftg42e5{--fluent-TreeItem--level:9;}", ".fyat3t{--fluent-TreeItem--level:10;}", ".f10pi13n{position:relative;}", ".f1k6fduh{cursor:pointer;}", ".f13qh94s{display:grid;}", ".f1ewtqcl{box-sizing:border-box;}", ".ffh4ag3{grid-template-rows:auto auto;}", ".f1y1g942{grid-template-columns:minmax(0, 100%) minmax(0px, min-content);}", ".faz22wj{grid-template-areas:\"layout  aside\" \"subtree subtree\";}", ".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);}", ".fdiulkx[data-fui-focus-visible]::after{top:-2px;}", ".f1yalx80[data-fui-focus-visible]::after{bottom:-2px;}", ".fq22d5a[data-fui-focus-visible]::after{left:-2px;}", ".f1jw7pan[data-fui-focus-visible]::after{right:-2px;}"],
+  d: [".f10bgyvd{--fluent-TreeItem--level:1;}", ".f1h0rod3{--fluent-TreeItem--level:2;}", ".fgoqafk{--fluent-TreeItem--level:3;}", ".f75dvuh{--fluent-TreeItem--level:4;}", ".fqk7yw6{--fluent-TreeItem--level:5;}", ".f1r3z17b{--fluent-TreeItem--level:6;}", ".f1hrpd1h{--fluent-TreeItem--level:7;}", ".f1iy65d0{--fluent-TreeItem--level:8;}", ".ftg42e5{--fluent-TreeItem--level:9;}", ".fyat3t{--fluent-TreeItem--level:10;}", ".f10pi13n{position:relative;}", ".f1k6fduh{cursor:pointer;}", ".f13qh94s{display:grid;}", ".f1ewtqcl{box-sizing:border-box;}", ".ffh4ag3{grid-template-rows:auto auto;}", ".f1y1g942{grid-template-columns:minmax(0, 100%) minmax(0px, min-content);}", ".faz22wj{grid-template-areas:\"layout  aside\" \"subtree subtree\";}", ".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;}"]
 });

package/lib/components/TreeItem/useTreeItemStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["__styles","mergeClasses","tokens","createFocusOutlineStyle","treeItemLevelToken","treeItemClassNames","root","useRootStyles","level1","iytv0q","level2","level3","level4","level5","level6","level7","level8","level9","level10","base","qhf8xq","Bceei9c","mc9l5x","B7ck84d","wkccdc","Budl1dq","zoa1oz","De3pzq","sj55zd","z189sj","focusIndicator","Brovlpu","B486eqv","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","Bm4h7ae","B7ys5i9","Busjfv9","Bhk32uz","Bf4ptjt","kclons","Bhdgwq3","Blkhhs4","Bqtpl0w","clg4pj","hgwjuy","Bonggc9","B1tsrr9","Dah5zi","Bkh64rk","qqdqy8","B6dhp37","i03rao","Boxcth7","Bsom6fd","J0r882","Bjwuhne","Ghsupd","Bule8hv","d","f","i","useTreeItemStyles_unstable","state","rootStyles","level","className","isStaticallyDefinedLevel"],"sources":["../../../src/components/TreeItem/useTreeItemStyles.styles.ts"],"sourcesContent":["import { GriffelStyle, makeStyles, mergeClasses } from '@griffel/react';\nimport type { TreeItemCSSProperties, TreeItemSlots, TreeItemState } from './TreeItem.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { treeItemLevelToken } from '../../utils/tokens';\n\nexport const treeItemClassNames: SlotClassNames<TreeItemSlots> = {\n  root: 'fui-TreeItem',\n};\n\ntype StaticLevel = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10;\ntype StaticLevelProperty = `level${StaticLevel}`;\n\nconst useRootStyles = makeStyles({\n  ...(Object.fromEntries(\n    Array.from<never, [StaticLevelProperty, TreeItemCSSProperties]>({ length: 10 }, (_, index) => [\n      `level${(index + 1) as StaticLevel}`,\n      { [treeItemLevelToken]: index + 1 },\n    ]),\n  ) as Record<StaticLevelProperty, GriffelStyle>),\n  base: {\n    position: 'relative',\n    cursor: 'pointer',\n    display: 'grid',\n    boxSizing: 'border-box',\n    gridTemplateRows: 'auto auto',\n    gridTemplateColumns: 'minmax(0, 100%) minmax(0px, min-content)',\n    gridTemplateAreas: `\n    \"layout  aside\"\n    \"subtree subtree\"\n    `,\n    backgroundColor: tokens.colorSubtleBackground,\n    color: tokens.colorNeutralForeground2,\n    paddingRight: tokens.spacingHorizontalNone,\n  },\n  focusIndicator: createFocusOutlineStyle(),\n});\n\n/**\n * Apply styling to the TreeItem slots based on the state\n */\nexport const useTreeItemStyles_unstable = (state: TreeItemState): TreeItemState => {\n  const rootStyles = useRootStyles();\n\n  const { level } = state;\n\n  state.root.className = mergeClasses(\n    treeItemClassNames.root,\n    isStaticallyDefinedLevel(level) && rootStyles[`level${level}` as StaticLevelProperty],\n    rootStyles.base,\n    rootStyles.focusIndicator,\n    state.root.className,\n  );\n\n  return state;\n};\n\nfunction isStaticallyDefinedLevel(level: number): level is StaticLevel {\n  return level >= 1 && level <= 10;\n}\n"],"mappings":"AAAA,SAAAA,QAAA,EAAmCC,YAAY,QAAQ;AAGvD,SAASC,MAAM,QAAQ;AACvB,SAASC,uBAAuB,QAAQ;AACxC,SAASC,kBAAkB,QAAQ;AAEnC,OAAO,MAAMC,kBAAA,GAAoD;EAC/DC,IAAA,EAAM;AACR;AAKA,MAAMC,aAAA,gBAAgBP,QAAA;EAAAQ,MAAA;IAAAC,MAAA;EAAA;EAAAC,MAAA;IAAAD,MAAA;EAAA;EAAAE,MAAA;IAAAF,MAAA;EAAA;EAAAG,MAAA;IAAAH,MAAA;EAAA;EAAAI,MAAA;IAAAJ,MAAA;EAAA;EAAAK,MAAA;IAAAL,MAAA;EAAA;EAAAM,MAAA;IAAAN,MAAA;EAAA;EAAAO,MAAA;IAAAP,MAAA;EAAA;EAAAQ,MAAA;IAAAR,MAAA;EAAA;EAAAS,OAAA;IAAAT,MAAA;EAAA;EAAAU,IAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;EAAAC,cAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;EAAAC,CAAA;EAAAC,CAAA;AAAA,EAuBtB;AAEA;;;AAGA,OAAO,MAAMC,0BAAA,GAA8BC,KAAA,IAAwC;EACjF,MAAMC,UAAA,GAAa3D,aAAA;EAEnB,MAAM;IAAE4D;EAAK,CAAE,GAAGF,KAAA;EAElBA,KAAA,CAAM3D,IAAI,CAAC8D,SAAS,GAAGnE,YAAA,CACrBI,kBAAA,CAAmBC,IAAI,EACvB+D,wBAAA,CAAyBF,KAAA,KAAUD,UAAU,CAAE,QAAOC,KAAM,EAAC,CAAwB,EACrFD,UAAA,CAAW/C,IAAI,EACf+C,UAAA,CAAWpC,cAAc,EACzBmC,KAAA,CAAM3D,IAAI,CAAC8D,SAAS;EAGtB,OAAOH,KAAA;AACT;AAEA,SAASI,yBAAyBF,KAAa,EAAwB;EACrE,OAAOA,KAAA,IAAS,KAAKA,KAAA,IAAS;AAChC"}
+{"version":3,"names":["__styles","mergeClasses","tokens","createFocusOutlineStyle","treeItemLevelToken","treeItemClassNames","root","useRootStyles","level1","iytv0q","level2","level3","level4","level5","level6","level7","level8","level9","level10","base","qhf8xq","Bceei9c","mc9l5x","B7ck84d","wkccdc","Budl1dq","zoa1oz","De3pzq","sj55zd","z189sj","focusIndicator","Brovlpu","B486eqv","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","Bm4h7ae","B7ys5i9","Busjfv9","Bhk32uz","Bf4ptjt","kclons","Bhdgwq3","Blkhhs4","Bqtpl0w","clg4pj","hgwjuy","Bonggc9","B1tsrr9","Dah5zi","Bkh64rk","qqdqy8","B6dhp37","i03rao","Boxcth7","Bsom6fd","J0r882","Bule8hv","Bjwuhne","Ghsupd","d","f","i","useTreeItemStyles_unstable","state","rootStyles","level","className","isStaticallyDefinedLevel"],"sources":["useTreeItemStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { treeItemLevelToken } from '../../utils/tokens';\nexport const treeItemClassNames = {\n    root: 'fui-TreeItem'\n};\nconst useRootStyles = makeStyles({\n    ...Object.fromEntries(Array.from({\n        length: 10\n    }, (_, index)=>[\n            `level${index + 1}`,\n            {\n                [treeItemLevelToken]: index + 1\n            }\n        ])),\n    base: {\n        position: 'relative',\n        cursor: 'pointer',\n        display: 'grid',\n        boxSizing: 'border-box',\n        gridTemplateRows: 'auto auto',\n        gridTemplateColumns: 'minmax(0, 100%) minmax(0px, min-content)',\n        gridTemplateAreas: `\n    \"layout  aside\"\n    \"subtree subtree\"\n    `,\n        backgroundColor: tokens.colorSubtleBackground,\n        color: tokens.colorNeutralForeground2,\n        paddingRight: tokens.spacingHorizontalNone\n    },\n    focusIndicator: createFocusOutlineStyle()\n});\n/**\n * Apply styling to the TreeItem slots based on the state\n */ export const useTreeItemStyles_unstable = (state)=>{\n    const rootStyles = useRootStyles();\n    const { level  } = state;\n    state.root.className = mergeClasses(treeItemClassNames.root, isStaticallyDefinedLevel(level) && rootStyles[`level${level}`], rootStyles.base, rootStyles.focusIndicator, state.root.className);\n    return state;\n};\nfunction isStaticallyDefinedLevel(level) {\n    return level >= 1 && level <= 10;\n}\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,uBAAuB,QAAQ,yBAAyB;AACjE,SAASC,kBAAkB,QAAQ,oBAAoB;AACvD,OAAO,MAAMC,kBAAkB,GAAG;EAC9BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,aAAa,gBAAGP,QAAA;EAAAQ,MAAA;IAAAC,MAAA;EAAA;EAAAC,MAAA;IAAAD,MAAA;EAAA;EAAAE,MAAA;IAAAF,MAAA;EAAA;EAAAG,MAAA;IAAAH,MAAA;EAAA;EAAAI,MAAA;IAAAJ,MAAA;EAAA;EAAAK,MAAA;IAAAL,MAAA;EAAA;EAAAM,MAAA;IAAAN,MAAA;EAAA;EAAAO,MAAA;IAAAP,MAAA;EAAA;EAAAQ,MAAA;IAAAR,MAAA;EAAA;EAAAS,OAAA;IAAAT,MAAA;EAAA;EAAAU,IAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;EAAAC,cAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;EAAAC,CAAA;EAAAC,CAAA;AAAA,CAyBrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,0BAA0B,GAAIC,KAAK,IAAG;EACnD,MAAMC,UAAU,GAAG3D,aAAa,CAAC,CAAC;EAClC,MAAM;IAAE4D;EAAO,CAAC,GAAGF,KAAK;EACxBA,KAAK,CAAC3D,IAAI,CAAC8D,SAAS,GAAGnE,YAAY,CAACI,kBAAkB,CAACC,IAAI,EAAE+D,wBAAwB,CAACF,KAAK,CAAC,IAAID,UAAU,CAAE,QAAOC,KAAM,EAAC,CAAC,EAAED,UAAU,CAAC/C,IAAI,EAAE+C,UAAU,CAACpC,cAAc,EAAEmC,KAAK,CAAC3D,IAAI,CAAC8D,SAAS,CAAC;EAC9L,OAAOH,KAAK;AAChB,CAAC;AACD,SAASI,wBAAwBA,CAACF,KAAK,EAAE;EACrC,OAAOA,KAAK,IAAI,CAAC,IAAIA,KAAK,IAAI,EAAE;AACpC"}

package/lib/components/TreeItemAside/TreeItemAside.js

@@ -5,11 +5,9 @@ import { useTreeItemAsideStyles_unstable } from './useTreeItemAsideStyles.styles
 /**
  * TreeItemAside component - represents a custom set of actionable elements that will be visible when a certain
  * `TreeItem` is currently "active".
- */
-export const TreeItemAside = /*#__PURE__*/React.forwardRef((props, ref) => {
-  const state = useTreeItemAside_unstable(props, ref);
-  useTreeItemAsideStyles_unstable(state);
-  return renderTreeItemAside_unstable(state);
+ */ export const TreeItemAside = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    const state = useTreeItemAside_unstable(props, ref);
+    useTreeItemAsideStyles_unstable(state);
+    return renderTreeItemAside_unstable(state);
 });
 TreeItemAside.displayName = 'TreeItemAside';
-//# sourceMappingURL=TreeItemAside.js.map

package/lib/components/TreeItemAside/TreeItemAside.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useTreeItemAside_unstable","renderTreeItemAside_unstable","useTreeItemAsideStyles_unstable","TreeItemAside","forwardRef","props","ref","state","displayName"],"sources":["../../../src/components/TreeItemAside/TreeItemAside.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItemAside_unstable } from './useTreeItemAside';\nimport { renderTreeItemAside_unstable } from './renderTreeItemAside';\nimport { useTreeItemAsideStyles_unstable } from './useTreeItemAsideStyles.styles';\nimport type { TreeItemAsideProps } from './TreeItemAside.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * TreeItemAside component - represents a custom set of actionable elements that will be visible when a certain\n * `TreeItem` is currently \"active\".\n */\nexport const TreeItemAside: ForwardRefComponent<TreeItemAsideProps> = React.forwardRef((props, ref) => {\n  const state = useTreeItemAside_unstable(props, ref);\n\n  useTreeItemAsideStyles_unstable(state);\n  return renderTreeItemAside_unstable(state);\n});\n\nTreeItemAside.displayName = 'TreeItemAside';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,yBAAyB,QAAQ;AAC1C,SAASC,4BAA4B,QAAQ;AAC7C,SAASC,+BAA+B,QAAQ;AAIhD;;;;AAIA,OAAO,MAAMC,aAAA,gBAAyDJ,KAAA,CAAMK,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACrG,MAAMC,KAAA,GAAQP,yBAAA,CAA0BK,KAAA,EAAOC,GAAA;EAE/CJ,+BAAA,CAAgCK,KAAA;EAChC,OAAON,4BAAA,CAA6BM,KAAA;AACtC;AAEAJ,aAAA,CAAcK,WAAW,GAAG"}
+{"version":3,"sources":["TreeItemAside.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItemAside_unstable } from './useTreeItemAside';\nimport { renderTreeItemAside_unstable } from './renderTreeItemAside';\nimport { useTreeItemAsideStyles_unstable } from './useTreeItemAsideStyles.styles';\nimport type { TreeItemAsideProps } from './TreeItemAside.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * TreeItemAside component - represents a custom set of actionable elements that will be visible when a certain\n * `TreeItem` is currently \"active\".\n */\nexport const TreeItemAside: ForwardRefComponent<TreeItemAsideProps> = React.forwardRef((props, ref) => {\n  const state = useTreeItemAside_unstable(props, ref);\n\n  useTreeItemAsideStyles_unstable(state);\n  return renderTreeItemAside_unstable(state);\n});\n\nTreeItemAside.displayName = 'TreeItemAside';\n"],"names":["React","useTreeItemAside_unstable","renderTreeItemAside_unstable","useTreeItemAsideStyles_unstable","TreeItemAside","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,wBAAwB;AACrE,SAASC,+BAA+B,QAAQ,kCAAkC;AAIlF;;;CAGC,GACD,OAAO,MAAMC,8BAAyDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACrG,MAAMC,QAAQP,0BAA0BK,OAAOC;IAE/CJ,gCAAgCK;IAChC,OAAON,6BAA6BM;AACtC,GAAG;AAEHJ,cAAcK,WAAW,GAAG"}

package/lib/components/TreeItemAside/TreeItemAside.types.js

@@ -1,2 +1 @@
-export {};
-//# sourceMappingURL=TreeItemAside.types.js.map
+export { };

package/lib/components/TreeItemAside/TreeItemAside.types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["../../../src/components/TreeItemAside/TreeItemAside.types.ts"],"sourcesContent":["import { ButtonContextValue } from '@fluentui/react-button';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type TreeItemAsideSlots = {\n  root: Slot<'div'>;\n};\n\n/**\n * TreeItemAside Props\n */\nexport type TreeItemAsideProps = ComponentProps<TreeItemAsideSlots> & {\n  /**\n   * boolean indicating if the aside content should behave as \"actions\"\n   *\n   * actionable elements are normally buttons, menus, or other focusable elements.\n   * Those elements are only visibly available if the given tree item is currently active.\n   */\n  actions?: boolean;\n  /**\n   * Forces visibility of the aside content, even if they're actions\n   */\n  visible?: true;\n};\n\n/**\n * State used in rendering TreeItemAside\n */\nexport type TreeItemAsideState = ComponentState<TreeItemAsideSlots> & {\n  actions: boolean;\n  visible: boolean;\n  buttonContextValue: ButtonContextValue;\n};\n"],"mappings":"AAAA"}
+{"version":3,"sources":["TreeItemAside.types.ts"],"sourcesContent":["import { ButtonContextValue } from '@fluentui/react-button';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type TreeItemAsideSlots = {\n  root: Slot<'div'>;\n};\n\n/**\n * TreeItemAside Props\n */\nexport type TreeItemAsideProps = ComponentProps<TreeItemAsideSlots> & {\n  /**\n   * boolean indicating if the aside content should behave as \"actions\"\n   *\n   * actionable elements are normally buttons, menus, or other focusable elements.\n   * Those elements are only visibly available if the given tree item is currently active.\n   */\n  actions?: boolean;\n  /**\n   * Forces visibility of the aside content, even if they're actions\n   */\n  visible?: true;\n};\n\n/**\n * State used in rendering TreeItemAside\n */\nexport type TreeItemAsideState = ComponentState<TreeItemAsideSlots> & {\n  actions: boolean;\n  visible: boolean;\n  buttonContextValue: ButtonContextValue;\n};\n"],"names":[],"mappings":"AAAA,WA+BE"}

package/lib/components/TreeItemAside/index.js

@@ -3,4 +3,3 @@ export * from './TreeItemAside.types';
 export * from './renderTreeItemAside';
 export * from './useTreeItemAside';
 export * from './useTreeItemAsideStyles.styles';
-//# sourceMappingURL=index.js.map

package/lib/components/TreeItemAside/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["../../../src/components/TreeItemAside/index.ts"],"sourcesContent":["export * from './TreeItemAside';\nexport * from './TreeItemAside.types';\nexport * from './renderTreeItemAside';\nexport * from './useTreeItemAside';\nexport * from './useTreeItemAsideStyles.styles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './TreeItemAside';\nexport * from './TreeItemAside.types';\nexport * from './renderTreeItemAside';\nexport * from './useTreeItemAside';\nexport * from './useTreeItemAsideStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,kBAAkB;AAChC,cAAc,wBAAwB;AACtC,cAAc,wBAAwB;AACtC,cAAc,qBAAqB;AACnC,cAAc,kCAAkC"}

package/lib/components/TreeItemAside/renderTreeItemAside.js

@@ -1,19 +1,14 @@
-/** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';
+/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
 import { getSlotsNext } from '@fluentui/react-utilities';
 import { ButtonContextProvider } from '@fluentui/react-button';
 /**
  * Render the final JSX of TreeItemAside
- */
-export const renderTreeItemAside_unstable = state => {
-  const {
-    slots,
-    slotProps
-  } = getSlotsNext(state);
-  if (!state.visible) {
-    return null;
-  }
-  return /*#__PURE__*/createElement(slots.root, slotProps.root, /*#__PURE__*/createElement(ButtonContextProvider, {
-    value: state.buttonContextValue
-  }, slotProps.root.children));
+ */ export const renderTreeItemAside_unstable = (state)=>{
+    const { slots , slotProps  } = getSlotsNext(state);
+    if (!state.visible) {
+        return null;
+    }
+    return /*#__PURE__*/ createElement(slots.root, slotProps.root, /*#__PURE__*/ createElement(ButtonContextProvider, {
+        value: state.buttonContextValue
+    }, slotProps.root.children));
 };
-//# sourceMappingURL=renderTreeItemAside.js.map

package/lib/components/TreeItemAside/renderTreeItemAside.js.map

@@ -1 +1 @@
-{"version":3,"names":["createElement","getSlotsNext","ButtonContextProvider","renderTreeItemAside_unstable","state","slots","slotProps","visible","root","value","buttonContextValue","children"],"sources":["../../../src/components/TreeItemAside/renderTreeItemAside.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { ButtonContextProvider } from '@fluentui/react-button';\nimport type { TreeItemAsideState, TreeItemAsideSlots } from './TreeItemAside.types';\n\n/**\n * Render the final JSX of TreeItemAside\n */\nexport const renderTreeItemAside_unstable = (state: TreeItemAsideState) => {\n  const { slots, slotProps } = getSlotsNext<TreeItemAsideSlots>(state);\n\n  if (!state.visible) {\n    return null;\n  }\n\n  return (\n    <slots.root {...slotProps.root}>\n      <ButtonContextProvider value={state.buttonContextValue}>{slotProps.root.children}</ButtonContextProvider>\n    </slots.root>\n  );\n};\n"],"mappings":"AAAA,2BACA,yBAEA,SAASA,aAAa,QAAQ;AAC9B,SAASC,YAAY,QAAQ;AAC7B,SAASC,qBAAqB,QAAQ;AAGtC;;;AAGA,OAAO,MAAMC,4BAAA,GAAgCC,KAAA,IAA8B;EACzE,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGL,YAAA,CAAiCG,KAAA;EAE9D,IAAI,CAACA,KAAA,CAAMG,OAAO,EAAE;IAClB,OAAO,IAAI;EACb;EAEA,oBACEP,aAlBJ,CAkBKK,KAAA,CAAMG,IAAI,EAAKF,SAAA,CAAUE,IAAI,eAC5BR,aAnBN,CAmBOE,qBAAA;IAAsBO,KAAA,EAAOL,KAAA,CAAMM;KAAqBJ,SAAA,CAAUE,IAAI,CAACG,QAAQ;AAGtF"}
+{"version":3,"sources":["renderTreeItemAside.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { ButtonContextProvider } from '@fluentui/react-button';\nimport type { TreeItemAsideState, TreeItemAsideSlots } from './TreeItemAside.types';\n\n/**\n * Render the final JSX of TreeItemAside\n */\nexport const renderTreeItemAside_unstable = (state: TreeItemAsideState) => {\n  const { slots, slotProps } = getSlotsNext<TreeItemAsideSlots>(state);\n\n  if (!state.visible) {\n    return null;\n  }\n\n  return (\n    <slots.root {...slotProps.root}>\n      <ButtonContextProvider value={state.buttonContextValue}>{slotProps.root.children}</ButtonContextProvider>\n    </slots.root>\n  );\n};\n"],"names":["createElement","getSlotsNext","ButtonContextProvider","renderTreeItemAside_unstable","state","slots","slotProps","visible","root","value","buttonContextValue","children"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,YAAY,QAAQ,4BAA4B;AACzD,SAASC,qBAAqB,QAAQ,yBAAyB;AAG/D;;CAEC,GACD,OAAO,MAAMC,+BAA+B,CAACC,QAA8B;IACzE,MAAM,EAAEC,MAAK,EAAEC,UAAS,EAAE,GAAGL,aAAiCG;IAE9D,IAAI,CAACA,MAAMG,OAAO,EAAE;QAClB,OAAO,IAAI;IACb,CAAC;IAED,qBACE,AAlBJ,cAkBKF,MAAMG,IAAI,EAAKF,UAAUE,IAAI,gBAC5B,AAnBN,cAmBON;QAAsBO,OAAOL,MAAMM,kBAAkB;OAAGJ,UAAUE,IAAI,CAACG,QAAQ;AAGtF,EAAE"}

package/lib/components/TreeItemAside/useTreeItemAside.js

@@ -9,27 +9,22 @@ import { useTreeItemContext_unstable } from '../../contexts/treeItemContext';
  *
  * @param props - props from this instance of TreeItemAside
  * @param ref - reference to root HTMLElement of TreeItemAside
- */
-export const useTreeItemAside_unstable = (props, ref) => {
-  const actionsRef = useTreeItemContext_unstable(ctx => ctx.actionsRef);
-  const contextVisible = useTreeItemContext_unstable(ctx => props.actions ? ctx.isActionsVisible : ctx.isAsideVisible);
-  const {
-    actions = false,
-    visible = contextVisible
-  } = props;
-  return {
-    actions,
-    visible,
-    buttonContextValue: {
-      size: 'small'
-    },
-    components: {
-      root: 'div'
-    },
-    root: getNativeElementProps('div', {
-      ref: useMergedRefs(ref, actions ? actionsRef : undefined),
-      ...props
-    })
-  };
+ */ export const useTreeItemAside_unstable = (props, ref)=>{
+    const actionsRef = useTreeItemContext_unstable((ctx)=>ctx.actionsRef);
+    const contextVisible = useTreeItemContext_unstable((ctx)=>props.actions ? ctx.isActionsVisible : ctx.isAsideVisible);
+    const { actions =false , visible =contextVisible  } = props;
+    return {
+        actions,
+        visible,
+        buttonContextValue: {
+            size: 'small'
+        },
+        components: {
+            root: 'div'
+        },
+        root: getNativeElementProps('div', {
+            ref: useMergedRefs(ref, actions ? actionsRef : undefined),
+            ...props
+        })
+    };
 };
-//# sourceMappingURL=useTreeItemAside.js.map

package/lib/components/TreeItemAside/useTreeItemAside.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","getNativeElementProps","useMergedRefs","useTreeItemContext_unstable","useTreeItemAside_unstable","props","ref","actionsRef","ctx","contextVisible","actions","isActionsVisible","isAsideVisible","visible","buttonContextValue","size","components","root","undefined"],"sources":["../../../src/components/TreeItemAside/useTreeItemAside.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs } from '@fluentui/react-utilities';\nimport type { TreeItemAsideProps, TreeItemAsideState } from './TreeItemAside.types';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\n\n/**\n * Create the state required to render TreeItemAside.\n *\n * The returned state can be modified with hooks such as useTreeItemAsideStyles_unstable,\n * before being passed to renderTreeItemAside_unstable.\n *\n * @param props - props from this instance of TreeItemAside\n * @param ref - reference to root HTMLElement of TreeItemAside\n */\nexport const useTreeItemAside_unstable = (\n  props: TreeItemAsideProps,\n  ref: React.Ref<HTMLElement>,\n): TreeItemAsideState => {\n  const actionsRef = useTreeItemContext_unstable(ctx => ctx.actionsRef);\n  const contextVisible = useTreeItemContext_unstable(ctx =>\n    props.actions ? ctx.isActionsVisible : ctx.isAsideVisible,\n  );\n  const { actions = false, visible = contextVisible } = props;\n\n  return {\n    actions,\n    visible,\n    buttonContextValue: { size: 'small' },\n    components: {\n      root: 'div',\n    },\n    root: getNativeElementProps('div', {\n      ref: useMergedRefs(ref, actions ? actionsRef : undefined),\n      ...props,\n    }),\n  };\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,qBAAqB,EAAEC,aAAa,QAAQ;AAErD,SAASC,2BAA2B,QAAQ;AAE5C;;;;;;;;;AASA,OAAO,MAAMC,yBAAA,GAA4BA,CACvCC,KAAA,EACAC,GAAA,KACuB;EACvB,MAAMC,UAAA,GAAaJ,2BAAA,CAA4BK,GAAA,IAAOA,GAAA,CAAID,UAAU;EACpE,MAAME,cAAA,GAAiBN,2BAAA,CAA4BK,GAAA,IACjDH,KAAA,CAAMK,OAAO,GAAGF,GAAA,CAAIG,gBAAgB,GAAGH,GAAA,CAAII,cAAc;EAE3D,MAAM;IAAEF,OAAA,GAAU,KAAK;IAAEG,OAAA,GAAUJ;EAAc,CAAE,GAAGJ,KAAA;EAEtD,OAAO;IACLK,OAAA;IACAG,OAAA;IACAC,kBAAA,EAAoB;MAAEC,IAAA,EAAM;IAAQ;IACpCC,UAAA,EAAY;MACVC,IAAA,EAAM;IACR;IACAA,IAAA,EAAMhB,qBAAA,CAAsB,OAAO;MACjCK,GAAA,EAAKJ,aAAA,CAAcI,GAAA,EAAKI,OAAA,GAAUH,UAAA,GAAaW,SAAS;MACxD,GAAGb;IACL;EACF;AACF"}
+{"version":3,"sources":["useTreeItemAside.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs } from '@fluentui/react-utilities';\nimport type { TreeItemAsideProps, TreeItemAsideState } from './TreeItemAside.types';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\n\n/**\n * Create the state required to render TreeItemAside.\n *\n * The returned state can be modified with hooks such as useTreeItemAsideStyles_unstable,\n * before being passed to renderTreeItemAside_unstable.\n *\n * @param props - props from this instance of TreeItemAside\n * @param ref - reference to root HTMLElement of TreeItemAside\n */\nexport const useTreeItemAside_unstable = (\n  props: TreeItemAsideProps,\n  ref: React.Ref<HTMLElement>,\n): TreeItemAsideState => {\n  const actionsRef = useTreeItemContext_unstable(ctx => ctx.actionsRef);\n  const contextVisible = useTreeItemContext_unstable(ctx =>\n    props.actions ? ctx.isActionsVisible : ctx.isAsideVisible,\n  );\n  const { actions = false, visible = contextVisible } = props;\n\n  return {\n    actions,\n    visible,\n    buttonContextValue: { size: 'small' },\n    components: {\n      root: 'div',\n    },\n    root: getNativeElementProps('div', {\n      ref: useMergedRefs(ref, actions ? actionsRef : undefined),\n      ...props,\n    }),\n  };\n};\n"],"names":["React","getNativeElementProps","useMergedRefs","useTreeItemContext_unstable","useTreeItemAside_unstable","props","ref","actionsRef","ctx","contextVisible","actions","isActionsVisible","isAsideVisible","visible","buttonContextValue","size","components","root","undefined"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,aAAa,QAAQ,4BAA4B;AAEjF,SAASC,2BAA2B,QAAQ,iCAAiC;AAE7E;;;;;;;;CAQC,GACD,OAAO,MAAMC,4BAA4B,CACvCC,OACAC,MACuB;IACvB,MAAMC,aAAaJ,4BAA4BK,CAAAA,MAAOA,IAAID,UAAU;IACpE,MAAME,iBAAiBN,4BAA4BK,CAAAA,MACjDH,MAAMK,OAAO,GAAGF,IAAIG,gBAAgB,GAAGH,IAAII,cAAc;IAE3D,MAAM,EAAEF,SAAU,KAAK,CAAA,EAAEG,SAAUJ,eAAc,EAAE,GAAGJ;IAEtD,OAAO;QACLK;QACAG;QACAC,oBAAoB;YAAEC,MAAM;QAAQ;QACpCC,YAAY;YACVC,MAAM;QACR;QACAA,MAAMhB,sBAAsB,OAAO;YACjCK,KAAKJ,cAAcI,KAAKI,UAAUH,aAAaW,SAAS;YACxD,GAAGb,KAAK;QACV;IACF;AACF,EAAE"}