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

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export {\n  Tree,\n  treeClassNames,\n  renderTree_unstable,\n  useTreeStyles_unstable,\n  useTree_unstable,\n  useTreeContextValues_unstable,\n} from './Tree';\nexport type {\n  TreeProps,\n  TreeState,\n  TreeSlots,\n  TreeOpenChangeData,\n  TreeOpenChangeEvent,\n  TreeNavigationEvent_unstable,\n  TreeNavigationData_unstable,\n} from './Tree';\n\nexport { TreeProvider, useTreeContext_unstable, useTreeItemContext_unstable, TreeItemProvider } from './contexts';\nexport type { TreeContextValue } from './contexts';\n\nexport { treeItemLevelToken } from './utils/tokens';\n\nexport {\n  TreeItem,\n  treeItemClassNames,\n  renderTreeItem_unstable,\n  useTreeItemStyles_unstable,\n  useTreeItem_unstable,\n} from './TreeItem';\nexport type { TreeItemProps, TreeItemState, TreeItemSlots } from './TreeItem';\n\nexport {\n  TreeItemLayout,\n  treeItemLayoutClassNames,\n  renderTreeItemLayout_unstable,\n  useTreeItemLayoutStyles_unstable,\n  useTreeItemLayout_unstable,\n} from './TreeItemLayout';\nexport type { TreeItemLayoutProps, TreeItemLayoutSlots, TreeItemLayoutState } from './TreeItemLayout';\n\nexport {\n  TreeItemPersonaLayout,\n  treeItemPersonaLayoutClassNames,\n  renderTreeItemPersonaLayout_unstable,\n  useTreeItemPersonaLayoutStyles_unstable,\n  useTreeItemPersonaLayout_unstable,\n} from './TreeItemPersonaLayout';\nexport type {\n  TreeItemPersonaLayoutProps,\n  TreeItemPersonaLayoutSlots,\n  TreeItemPersonaLayoutState,\n} from './TreeItemPersonaLayout';\n\nexport {\n  TreeItemAside,\n  treeItemAsideClassNames,\n  renderTreeItemAside_unstable,\n  useTreeItemAsideStyles_unstable,\n  useTreeItemAside_unstable,\n} from './TreeItemAside';\nexport type { TreeItemAsideProps, TreeItemAsideSlots, TreeItemAsideState } from './TreeItemAside';\n\nexport { useFlatTree_unstable } from './hooks/index';\nexport type { FlatTreeItem, FlatTreeItemProps, FlatTreeProps, FlatTree } from './hooks/index';\n\nexport { flattenTree_unstable } from './utils/flattenTree';\nexport type { NestedTreeItem } from './utils/flattenTree';\n"],"names":["Tree","treeClassNames","renderTree_unstable","useTreeStyles_unstable","useTree_unstable","useTreeContextValues_unstable","TreeProvider","useTreeContext_unstable","useTreeItemContext_unstable","TreeItemProvider","treeItemLevelToken","TreeItem","treeItemClassNames","renderTreeItem_unstable","useTreeItemStyles_unstable","useTreeItem_unstable","TreeItemLayout","treeItemLayoutClassNames","renderTreeItemLayout_unstable","useTreeItemLayoutStyles_unstable","useTreeItemLayout_unstable","TreeItemPersonaLayout","treeItemPersonaLayoutClassNames","renderTreeItemPersonaLayout_unstable","useTreeItemPersonaLayoutStyles_unstable","useTreeItemPersonaLayout_unstable","TreeItemAside","treeItemAsideClassNames","renderTreeItemAside_unstable","useTreeItemAsideStyles_unstable","useTreeItemAside_unstable","useFlatTree_unstable","flattenTree_unstable"],"mappings":"AAAA,SACEA,IAAI,EACJC,cAAc,EACdC,mBAAmB,EACnBC,sBAAsB,EACtBC,gBAAgB,EAChBC,6BAA6B,QACxB,SAAS;AAWhB,SAASC,YAAY,EAAEC,uBAAuB,EAAEC,2BAA2B,EAAEC,gBAAgB,QAAQ,aAAa;AAGlH,SAASC,kBAAkB,QAAQ,iBAAiB;AAEpD,SACEC,QAAQ,EACRC,kBAAkB,EAClBC,uBAAuB,EACvBC,0BAA0B,EAC1BC,oBAAoB,QACf,aAAa;AAGpB,SACEC,cAAc,EACdC,wBAAwB,EACxBC,6BAA6B,EAC7BC,gCAAgC,EAChCC,0BAA0B,QACrB,mBAAmB;AAG1B,SACEC,qBAAqB,EACrBC,+BAA+B,EAC/BC,oCAAoC,EACpCC,uCAAuC,EACvCC,iCAAiC,QAC5B,0BAA0B;AAOjC,SACEC,aAAa,EACbC,uBAAuB,EACvBC,4BAA4B,EAC5BC,+BAA+B,EAC/BC,yBAAyB,QACpB,kBAAkB;AAGzB,SAASC,oBAAoB,QAAQ,gBAAgB;AAGrD,SAASC,oBAAoB,QAAQ,sBAAsB"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export {\n  Tree,\n  treeClassNames,\n  renderTree_unstable,\n  useTreeStyles_unstable,\n  useTree_unstable,\n  useTreeContextValues_unstable,\n} from './Tree';\nexport type {\n  TreeProps,\n  TreeState,\n  TreeSlots,\n  TreeOpenChangeData,\n  TreeOpenChangeEvent,\n  TreeNavigationEvent_unstable,\n  TreeNavigationData_unstable,\n} from './Tree';\n\nexport { TreeProvider, useTreeContext_unstable, useTreeItemContext_unstable, TreeItemProvider } from './contexts';\nexport type { TreeContextValue } from './contexts';\n\nexport { treeItemLevelToken } from './utils/tokens';\n\nexport {\n  TreeItem,\n  treeItemClassNames,\n  renderTreeItem_unstable,\n  useTreeItemStyles_unstable,\n  useTreeItem_unstable,\n} from './TreeItem';\nexport type { TreeItemProps, TreeItemState, TreeItemSlots } from './TreeItem';\n\nexport {\n  TreeItemLayout,\n  treeItemLayoutClassNames,\n  renderTreeItemLayout_unstable,\n  useTreeItemLayoutStyles_unstable,\n  useTreeItemLayout_unstable,\n} from './TreeItemLayout';\nexport type { TreeItemLayoutProps, TreeItemLayoutSlots, TreeItemLayoutState } from './TreeItemLayout';\n\nexport {\n  TreeItemPersonaLayout,\n  treeItemPersonaLayoutClassNames,\n  renderTreeItemPersonaLayout_unstable,\n  useTreeItemPersonaLayoutStyles_unstable,\n  useTreeItemPersonaLayout_unstable,\n} from './TreeItemPersonaLayout';\nexport type {\n  TreeItemPersonaLayoutProps,\n  TreeItemPersonaLayoutSlots,\n  TreeItemPersonaLayoutState,\n} from './TreeItemPersonaLayout';\n\nexport { useFlatTree_unstable } from './hooks/index';\nexport type { FlatTreeItem, FlatTreeItemProps, FlatTreeProps, FlatTree } from './hooks/index';\n\nexport { flattenTree_unstable } from './utils/flattenTree';\nexport type { NestedTreeItem } from './utils/flattenTree';\n"],"names":["Tree","treeClassNames","renderTree_unstable","useTreeStyles_unstable","useTree_unstable","useTreeContextValues_unstable","TreeProvider","useTreeContext_unstable","useTreeItemContext_unstable","TreeItemProvider","treeItemLevelToken","TreeItem","treeItemClassNames","renderTreeItem_unstable","useTreeItemStyles_unstable","useTreeItem_unstable","TreeItemLayout","treeItemLayoutClassNames","renderTreeItemLayout_unstable","useTreeItemLayoutStyles_unstable","useTreeItemLayout_unstable","TreeItemPersonaLayout","treeItemPersonaLayoutClassNames","renderTreeItemPersonaLayout_unstable","useTreeItemPersonaLayoutStyles_unstable","useTreeItemPersonaLayout_unstable","useFlatTree_unstable","flattenTree_unstable"],"mappings":"AAAA,SACEA,IAAI,EACJC,cAAc,EACdC,mBAAmB,EACnBC,sBAAsB,EACtBC,gBAAgB,EAChBC,6BAA6B,QACxB,SAAS;AAWhB,SAASC,YAAY,EAAEC,uBAAuB,EAAEC,2BAA2B,EAAEC,gBAAgB,QAAQ,aAAa;AAGlH,SAASC,kBAAkB,QAAQ,iBAAiB;AAEpD,SACEC,QAAQ,EACRC,kBAAkB,EAClBC,uBAAuB,EACvBC,0BAA0B,EAC1BC,oBAAoB,QACf,aAAa;AAGpB,SACEC,cAAc,EACdC,wBAAwB,EACxBC,6BAA6B,EAC7BC,gCAAgC,EAChCC,0BAA0B,QACrB,mBAAmB;AAG1B,SACEC,qBAAqB,EACrBC,+BAA+B,EAC/BC,oCAAoC,EACpCC,uCAAuC,EACvCC,iCAAiC,QAC5B,0BAA0B;AAOjC,SAASC,oBAAoB,QAAQ,gBAAgB;AAGrD,SAASC,oBAAoB,QAAQ,sBAAsB"}

package/lib/utils/createFlatTreeItems.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 /**
  * creates a list of flat tree items
  * and provides a map to access each item by id
@@ -18,7 +17,7 @@ import * as React from 'react';
         if (!currentParent) {
             if (process.env.NODE_ENV === 'development') {
                 // eslint-disable-next-line no-console
-                console.error(`useFlatTree: item ${flatTreeItemProps[index].id} is wrongly positioned, did you properly ordered provided item props? make sure provided items are organized`);
+                console.error(`useFlatTree: item ${flatTreeItemProps[index].value} is wrongly positioned, did you properly ordered provided item props? make sure provided items are organized`);
             }
             break;
         }
@@ -27,7 +26,6 @@ import * as React from 'react';
         var _currentParent_level;
         const currentLevel = ((_currentParent_level = currentParent.level) !== null && _currentParent_level !== void 0 ? _currentParent_level : 0) + 1;
         const currentChildrenSize = ++currentParent.childrenSize;
-        const ref = React.createRef();
         const flatTreeItem = {
             value: treeItemProps.value,
             getTreeItemProps: ()=>({
@@ -35,11 +33,8 @@ import * as React from 'react';
                     'aria-level': currentLevel,
                     'aria-posinset': currentChildrenSize,
                     'aria-setsize': currentParent.childrenSize,
-                    itemType,
-                    // a reference to every parent element is necessary to ensure navigation
-                    ref: flatTreeItem.childrenSize > 0 ? ref : undefined
+                    itemType
                 }),
-            ref,
             level: currentLevel,
             parentValue,
             childrenSize: 0,
@@ -60,17 +55,15 @@ import * as React from 'react';
 export const flatTreeRootId = '__fuiFlatTreeRoot';
 function createFlatTreeRootItem() {
     return {
-        ref: {
-            current: null
-        },
-        value: flatTreeRootId,
         parentValue: undefined,
+        value: flatTreeRootId,
         getTreeItemProps: ()=>{
             if (process.env.NODE_ENV !== 'production') {
                 // eslint-disable-next-line no-console
                 console.error('useFlatTree: internal error, trying to access treeitem props from invalid root element');
             }
             return {
+                id: flatTreeRootId,
                 value: flatTreeRootId,
                 'aria-setsize': -1,
                 'aria-level': -1,

package/lib/utils/createFlatTreeItems.js.map

@@ -1 +1 @@
-{"version":3,"sources":["createFlatTreeItems.ts"],"sourcesContent":["import type { ImmutableSet } from './ImmutableSet';\nimport type { FlatTreeItem, FlatTreeItemProps } from '../hooks/useFlatTree';\nimport * as React from 'react';\n\n/**\n * @internal\n */\nexport type FlatTreeItems<Props extends FlatTreeItemProps<unknown>> = {\n  size: number;\n  root: FlatTreeItem;\n  get(key: Props['value']): FlatTreeItem<Props> | undefined;\n  set(key: Props['value'], value: FlatTreeItem<Props>): void;\n  getByIndex(index: number): FlatTreeItem<Props>;\n};\n\n/**\n * creates a list of flat tree items\n * and provides a map to access each item by id\n */\nexport function createFlatTreeItems<Props extends FlatTreeItemProps<unknown>>(\n  flatTreeItemProps: Props[],\n): FlatTreeItems<Props> {\n  const root = createFlatTreeRootItem();\n  const itemsPerValue = new Map<unknown, FlatTreeItem<FlatTreeItemProps<unknown>>>([[root.value, root]]);\n  const items: FlatTreeItem<FlatTreeItemProps<unknown>>[] = [];\n\n  for (let index = 0; index < flatTreeItemProps.length; index++) {\n    const { parentValue = flatTreeRootId, ...treeItemProps } = flatTreeItemProps[index];\n\n    const nextItemProps: Props | undefined = flatTreeItemProps[index + 1];\n    const currentParent = itemsPerValue.get(parentValue);\n    if (!currentParent) {\n      if (process.env.NODE_ENV === 'development') {\n        // eslint-disable-next-line no-console\n        console.error(\n          `useFlatTree: item ${flatTreeItemProps[index].id} is wrongly positioned, did you properly ordered provided item props? make sure provided items are organized`,\n        );\n      }\n      break;\n    }\n    const itemType =\n      treeItemProps.itemType ??\n      (treeItemProps.value === undefined || nextItemProps?.parentValue !== treeItemProps.value ? 'leaf' : 'branch');\n    const currentLevel = (currentParent.level ?? 0) + 1;\n    const currentChildrenSize = ++currentParent.childrenSize;\n    const ref = React.createRef<HTMLDivElement>();\n\n    const flatTreeItem: FlatTreeItem<FlatTreeItemProps<unknown>> = {\n      value: treeItemProps.value,\n      getTreeItemProps: () => ({\n        ...treeItemProps,\n        'aria-level': currentLevel,\n        'aria-posinset': currentChildrenSize,\n        'aria-setsize': currentParent.childrenSize,\n        itemType,\n        // a reference to every parent element is necessary to ensure navigation\n        ref: flatTreeItem.childrenSize > 0 ? ref : undefined,\n      }),\n      ref,\n      level: currentLevel,\n      parentValue,\n      childrenSize: 0,\n      index: -1,\n    };\n    itemsPerValue.set(flatTreeItem.value, flatTreeItem);\n    items.push(flatTreeItem);\n  }\n\n  const flatTreeItems: FlatTreeItems<FlatTreeItemProps<unknown>> = {\n    root,\n    size: items.length,\n    getByIndex: index => items[index],\n    get: key => itemsPerValue.get(key),\n    set: (key, value) => itemsPerValue.set(key, value),\n  };\n\n  return flatTreeItems as FlatTreeItems<Props>;\n}\n\nexport const flatTreeRootId = '__fuiFlatTreeRoot';\n\nfunction createFlatTreeRootItem(): FlatTreeItem {\n  return {\n    ref: { current: null },\n    value: flatTreeRootId,\n    parentValue: undefined,\n    getTreeItemProps: () => {\n      if (process.env.NODE_ENV !== 'production') {\n        // eslint-disable-next-line no-console\n        console.error('useFlatTree: internal error, trying to access treeitem props from invalid root element');\n      }\n      return { value: flatTreeRootId, 'aria-setsize': -1, 'aria-level': -1, 'aria-posinset': -1, itemType: 'branch' };\n    },\n    childrenSize: 0,\n    get index() {\n      if (process.env.NODE_ENV !== 'production') {\n        // eslint-disable-next-line no-console\n        console.error('useFlatTree: internal error, trying to access treeitem props from invalid root element');\n      }\n      return -1;\n    },\n    level: 0,\n  };\n}\n\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport function* VisibleFlatTreeItemGenerator<Props extends FlatTreeItemProps<unknown>>(\n  openItems: ImmutableSet<unknown>,\n  flatTreeItems: FlatTreeItems<Props>,\n) {\n  for (let index = 0, visibleIndex = 0; index < flatTreeItems.size; index++) {\n    const item = flatTreeItems.getByIndex(index) as FlatTreeItem<Props>;\n    if (isItemVisible(item, openItems, flatTreeItems)) {\n      item.index = visibleIndex++;\n      yield item;\n    } else {\n      // Jump the amount of children the current item has, since those items will also be hidden\n      index += item.childrenSize;\n    }\n  }\n}\n\nfunction isItemVisible(\n  item: FlatTreeItem<FlatTreeItemProps<unknown>>,\n  openItems: ImmutableSet<unknown>,\n  flatTreeItems: FlatTreeItems<FlatTreeItemProps<unknown>>,\n) {\n  if (item.level === 1) {\n    return true;\n  }\n  while (item.parentValue && item.parentValue !== flatTreeItems.root.value) {\n    if (!openItems.has(item.parentValue)) {\n      return false;\n    }\n    const parent = flatTreeItems.get(item.parentValue);\n    if (!parent) {\n      return false;\n    }\n    item = parent;\n  }\n  return true;\n}\n"],"names":["React","createFlatTreeItems","flatTreeItemProps","root","createFlatTreeRootItem","itemsPerValue","Map","value","items","index","length","parentValue","flatTreeRootId","treeItemProps","nextItemProps","currentParent","get","process","env","NODE_ENV","console","error","id","itemType","undefined","currentLevel","level","currentChildrenSize","childrenSize","ref","createRef","flatTreeItem","getTreeItemProps","set","push","flatTreeItems","size","getByIndex","key","current","VisibleFlatTreeItemGenerator","openItems","visibleIndex","item","isItemVisible","has","parent"],"mappings":"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"}
+{"version":3,"sources":["createFlatTreeItems.ts"],"sourcesContent":["import type { ImmutableSet } from './ImmutableSet';\nimport type { FlatTreeItem, FlatTreeItemProps } from '../hooks/useFlatTree';\nimport { TreeItemValue } from '../TreeItem';\n\n/**\n * @internal\n */\nexport type FlatTreeItems<Props extends FlatTreeItemProps> = {\n  size: number;\n  root: FlatTreeItem;\n  get(key: TreeItemValue): FlatTreeItem<Props> | undefined;\n  set(key: TreeItemValue, value: FlatTreeItem<Props>): void;\n  getByIndex(index: number): FlatTreeItem<Props>;\n};\n\n/**\n * creates a list of flat tree items\n * and provides a map to access each item by id\n */\nexport function createFlatTreeItems<Props extends FlatTreeItemProps>(flatTreeItemProps: Props[]): FlatTreeItems<Props> {\n  const root = createFlatTreeRootItem();\n  const itemsPerValue = new Map<TreeItemValue, FlatTreeItem<FlatTreeItemProps>>([[root.value, root]]);\n  const items: FlatTreeItem<FlatTreeItemProps>[] = [];\n\n  for (let index = 0; index < flatTreeItemProps.length; index++) {\n    const { parentValue = flatTreeRootId, ...treeItemProps } = flatTreeItemProps[index];\n\n    const nextItemProps: Props | undefined = flatTreeItemProps[index + 1];\n    const currentParent = itemsPerValue.get(parentValue);\n    if (!currentParent) {\n      if (process.env.NODE_ENV === 'development') {\n        // eslint-disable-next-line no-console\n        console.error(\n          `useFlatTree: item ${flatTreeItemProps[index].value} is wrongly positioned, did you properly ordered provided item props? make sure provided items are organized`,\n        );\n      }\n      break;\n    }\n    const itemType =\n      treeItemProps.itemType ??\n      (treeItemProps.value === undefined || nextItemProps?.parentValue !== treeItemProps.value ? 'leaf' : 'branch');\n    const currentLevel = (currentParent.level ?? 0) + 1;\n    const currentChildrenSize = ++currentParent.childrenSize;\n\n    const flatTreeItem: FlatTreeItem<FlatTreeItemProps> = {\n      value: treeItemProps.value,\n      getTreeItemProps: () => ({\n        ...treeItemProps,\n        'aria-level': currentLevel,\n        'aria-posinset': currentChildrenSize,\n        'aria-setsize': currentParent.childrenSize,\n        itemType,\n      }),\n      level: currentLevel,\n      parentValue,\n      childrenSize: 0,\n      index: -1,\n    };\n    itemsPerValue.set(flatTreeItem.value, flatTreeItem);\n    items.push(flatTreeItem);\n  }\n\n  const flatTreeItems: FlatTreeItems<FlatTreeItemProps> = {\n    root,\n    size: items.length,\n    getByIndex: index => items[index],\n    get: key => itemsPerValue.get(key),\n    set: (key, value) => itemsPerValue.set(key, value),\n  };\n\n  return flatTreeItems as FlatTreeItems<Props>;\n}\n\nexport const flatTreeRootId = '__fuiFlatTreeRoot';\n\nfunction createFlatTreeRootItem(): FlatTreeItem {\n  return {\n    parentValue: undefined,\n    value: flatTreeRootId,\n    getTreeItemProps: () => {\n      if (process.env.NODE_ENV !== 'production') {\n        // eslint-disable-next-line no-console\n        console.error('useFlatTree: internal error, trying to access treeitem props from invalid root element');\n      }\n      return {\n        id: flatTreeRootId,\n        value: flatTreeRootId,\n        'aria-setsize': -1,\n        'aria-level': -1,\n        'aria-posinset': -1,\n        itemType: 'branch',\n      };\n    },\n    childrenSize: 0,\n    get index() {\n      if (process.env.NODE_ENV !== 'production') {\n        // eslint-disable-next-line no-console\n        console.error('useFlatTree: internal error, trying to access treeitem props from invalid root element');\n      }\n      return -1;\n    },\n    level: 0,\n  };\n}\n\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport function* VisibleFlatTreeItemGenerator<Props extends FlatTreeItemProps>(\n  openItems: ImmutableSet<string>,\n  flatTreeItems: FlatTreeItems<Props>,\n) {\n  for (let index = 0, visibleIndex = 0; index < flatTreeItems.size; index++) {\n    const item = flatTreeItems.getByIndex(index) as FlatTreeItem<Props>;\n    if (isItemVisible(item, openItems, flatTreeItems)) {\n      item.index = visibleIndex++;\n      yield item;\n    } else {\n      // Jump the amount of children the current item has, since those items will also be hidden\n      index += item.childrenSize;\n    }\n  }\n}\n\nfunction isItemVisible(\n  item: FlatTreeItem<FlatTreeItemProps>,\n  openItems: ImmutableSet<TreeItemValue>,\n  flatTreeItems: FlatTreeItems<FlatTreeItemProps>,\n) {\n  if (item.level === 1) {\n    return true;\n  }\n  while (item.parentValue && item.parentValue !== flatTreeItems.root.value) {\n    if (!openItems.has(item.parentValue)) {\n      return false;\n    }\n    const parent = flatTreeItems.get(item.parentValue);\n    if (!parent) {\n      return false;\n    }\n    item = parent;\n  }\n  return true;\n}\n"],"names":["createFlatTreeItems","flatTreeItemProps","root","createFlatTreeRootItem","itemsPerValue","Map","value","items","index","length","parentValue","flatTreeRootId","treeItemProps","nextItemProps","currentParent","get","process","env","NODE_ENV","console","error","itemType","undefined","currentLevel","level","currentChildrenSize","childrenSize","flatTreeItem","getTreeItemProps","set","push","flatTreeItems","size","getByIndex","key","id","VisibleFlatTreeItemGenerator","openItems","visibleIndex","item","isItemVisible","has","parent"],"mappings":"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"}

package/lib/utils/flattenTree.js.map

@@ -1 +1 @@
-{"version":3,"sources":["flattenTree.ts"],"sourcesContent":["import { FlatTreeItemProps } from '../hooks/useFlatTree';\nimport { TreeItemProps } from '../TreeItem';\n\nexport type NestedTreeItem<Props extends TreeItemProps<unknown>> = Omit<Props, 'subtree' | 'itemType'> & {\n  subtree?: NestedTreeItem<Props>[];\n};\n\nexport type FlattenedTreeItem<Props extends TreeItemProps<unknown>> = FlatTreeItemProps<NonNullable<Props['value']>> &\n  Props;\n\nlet count = 1;\nfunction flattenTreeRecursive<Props extends TreeItemProps<unknown>>(\n  items: NestedTreeItem<Props>[],\n  parent?: FlatTreeItemProps<Props['value']> & Props,\n  level = 1,\n): FlattenedTreeItem<Props>[] {\n  return items.reduce<FlattenedTreeItem<Props>[]>((acc, { subtree, ...item }, index) => {\n    const id = item.id ?? `fui-FlatTreeItem-${count++}`;\n    const flatTreeItem = {\n      'aria-level': level,\n      'aria-posinset': index + 1,\n      'aria-setsize': items.length,\n      parentValue: parent?.value,\n      value: item.value ?? (id as unknown as Props['value']),\n      ...item,\n    } as FlattenedTreeItem<Props>;\n    acc.push(flatTreeItem);\n    if (subtree !== undefined) {\n      acc.push(...flattenTreeRecursive<Props>(subtree, flatTreeItem, level + 1));\n    }\n    return acc;\n  }, []);\n}\n\n/**\n * Converts a nested structure to a flat one which can be consumed by `useFlatTreeItems`\n * @example\n * ```tsx\n * const defaultItems = flattenTree_unstable([\n *  {\n *    children: <TreeItemLayout>level 1, item 1</TreeItemLayout>,\n *    subtree: [\n *      {\n *        children: <TreeItemLayout>level 2, item 1</TreeItemLayout>,\n *      },\n *      {\n *        children: <TreeItemLayout>level 2, item 2</TreeItemLayout>,\n *      },\n *      {\n *        children: <TreeItemLayout>level 2, item 3</TreeItemLayout>,\n *      },\n *    ],\n *  },\n *  {\n *    children: <TreeItemLayout>level 1, item 2</TreeItemLayout>,\n *    subtree: [\n *      {\n *        children: <TreeItemLayout>level 2, item 1</TreeItemLayout>,\n *        subtree: [\n *          {\n *            children: <TreeItemLayout>level 3, item 1</TreeItemLayout>,\n *            subtree: [\n *              {\n *                children: <TreeItemLayout>level 4, item 1</TreeItemLayout>,\n *              },\n *            ],\n *          },\n *        ],\n *      },\n *    ],\n *  },\n * ]);\n * ```\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport const flattenTree_unstable = <Props extends TreeItemProps<unknown>>(\n  items: NestedTreeItem<Props>[],\n): FlattenedTreeItem<Props>[] => flattenTreeRecursive(items);\n"],"names":["count","flattenTreeRecursive","items","parent","level","reduce","acc","subtree","item","index","id","flatTreeItem","length","parentValue","value","push","undefined","flattenTree_unstable"],"mappings":"AAUA,IAAIA,QAAQ;AACZ,SAASC,qBACPC,KAA8B,EAC9BC,MAAkD,EAClDC,QAAQ,CAAC,EACmB;IAC5B,OAAOF,MAAMG,MAAM,CAA6B,CAACC,KAAK,EAAEC,QAAO,EAAE,GAAGC,MAAM,EAAEC,QAAU;YACzED;QAAX,MAAME,KAAKF,CAAAA,WAAAA,KAAKE,EAAE,cAAPF,sBAAAA,WAAW,CAAC,iBAAiB,EAAER,QAAQ,CAAC;YAM1CQ;QALT,MAAMG,eAAe;YACnB,cAAcP;YACd,iBAAiBK,QAAQ;YACzB,gBAAgBP,MAAMU,MAAM;YAC5BC,aAAaV,mBAAAA,oBAAAA,KAAAA,IAAAA,OAAQW,KAAK;YAC1BA,OAAON,CAAAA,cAAAA,KAAKM,KAAK,cAAVN,yBAAAA,cAAeE,EAAgC;YACtD,GAAGF,IAAI;QACT;QACAF,IAAIS,IAAI,CAACJ;QACT,IAAIJ,YAAYS,WAAW;YACzBV,IAAIS,IAAI,IAAId,qBAA4BM,SAASI,cAAcP,QAAQ;QACzE,CAAC;QACD,OAAOE;IACT,GAAG,EAAE;AACP;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuCC,GACD,gEAAgE;AAChE,OAAO,MAAMW,uBAAuB,CAClCf,QAC+BD,qBAAqBC,OAAO"}
+{"version":3,"sources":["flattenTree.ts"],"sourcesContent":["import { FlatTreeItemProps } from '../hooks/useFlatTree';\nimport { TreeItemProps } from '../TreeItem';\n\nexport type NestedTreeItem<Props extends TreeItemProps> = Omit<Props, 'subtree' | 'itemType'> & {\n  subtree?: NestedTreeItem<Props>[];\n};\n\nexport type FlattenedTreeItem<Props extends TreeItemProps> = FlatTreeItemProps & Props;\n\nlet count = 1;\nfunction flattenTreeRecursive<Props extends TreeItemProps>(\n  items: NestedTreeItem<Props>[],\n  parent?: FlatTreeItemProps & Props,\n  level = 1,\n): FlattenedTreeItem<Props>[] {\n  return items.reduce<FlattenedTreeItem<Props>[]>((acc, { subtree, ...item }, index) => {\n    const id = item.id ?? `fui-FlatTreeItem-${count++}`;\n    const flatTreeItem = {\n      'aria-level': level,\n      'aria-posinset': index + 1,\n      'aria-setsize': items.length,\n      parentValue: parent?.value,\n      value: item.value ?? (id as unknown as Props['value']),\n      ...item,\n    } as FlattenedTreeItem<Props>;\n    acc.push(flatTreeItem);\n    if (subtree !== undefined) {\n      acc.push(...flattenTreeRecursive<Props>(subtree, flatTreeItem, level + 1));\n    }\n    return acc;\n  }, []);\n}\n\n/**\n * Converts a nested structure to a flat one which can be consumed by `useFlatTreeItems`\n * @example\n * ```tsx\n * const defaultItems = flattenTree_unstable([\n *  {\n *    children: <TreeItemLayout>level 1, item 1</TreeItemLayout>,\n *    subtree: [\n *      {\n *        children: <TreeItemLayout>level 2, item 1</TreeItemLayout>,\n *      },\n *      {\n *        children: <TreeItemLayout>level 2, item 2</TreeItemLayout>,\n *      },\n *      {\n *        children: <TreeItemLayout>level 2, item 3</TreeItemLayout>,\n *      },\n *    ],\n *  },\n *  {\n *    children: <TreeItemLayout>level 1, item 2</TreeItemLayout>,\n *    subtree: [\n *      {\n *        children: <TreeItemLayout>level 2, item 1</TreeItemLayout>,\n *        subtree: [\n *          {\n *            children: <TreeItemLayout>level 3, item 1</TreeItemLayout>,\n *            subtree: [\n *              {\n *                children: <TreeItemLayout>level 4, item 1</TreeItemLayout>,\n *              },\n *            ],\n *          },\n *        ],\n *      },\n *    ],\n *  },\n * ]);\n * ```\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport const flattenTree_unstable = <Props extends TreeItemProps>(\n  items: NestedTreeItem<Props>[],\n): FlattenedTreeItem<Props>[] => flattenTreeRecursive(items);\n"],"names":["count","flattenTreeRecursive","items","parent","level","reduce","acc","subtree","item","index","id","flatTreeItem","length","parentValue","value","push","undefined","flattenTree_unstable"],"mappings":"AASA,IAAIA,QAAQ;AACZ,SAASC,qBACPC,KAA8B,EAC9BC,MAAkC,EAClCC,QAAQ,CAAC,EACmB;IAC5B,OAAOF,MAAMG,MAAM,CAA6B,CAACC,KAAK,EAAEC,QAAO,EAAE,GAAGC,MAAM,EAAEC,QAAU;YACzED;QAAX,MAAME,KAAKF,CAAAA,WAAAA,KAAKE,EAAE,cAAPF,sBAAAA,WAAW,CAAC,iBAAiB,EAAER,QAAQ,CAAC;YAM1CQ;QALT,MAAMG,eAAe;YACnB,cAAcP;YACd,iBAAiBK,QAAQ;YACzB,gBAAgBP,MAAMU,MAAM;YAC5BC,aAAaV,mBAAAA,oBAAAA,KAAAA,IAAAA,OAAQW,KAAK;YAC1BA,OAAON,CAAAA,cAAAA,KAAKM,KAAK,cAAVN,yBAAAA,cAAeE,EAAgC;YACtD,GAAGF,IAAI;QACT;QACAF,IAAIS,IAAI,CAACJ;QACT,IAAIJ,YAAYS,WAAW;YACzBV,IAAIS,IAAI,IAAId,qBAA4BM,SAASI,cAAcP,QAAQ;QACzE,CAAC;QACD,OAAOE;IACT,GAAG,EAAE;AACP;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuCC,GACD,gEAAgE;AAChE,OAAO,MAAMW,uBAAuB,CAClCf,QAC+BD,qBAAqBC,OAAO"}

package/lib/utils/getTreeItemValueFromElement.js

@@ -0,0 +1,4 @@
+export const dataTreeItemValueAttrName = 'data-fui-tree-item-value';
+export const getTreeItemValueFromElement = (element)=>{
+    return element.getAttribute(dataTreeItemValueAttrName);
+};

package/lib/utils/getTreeItemValueFromElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["getTreeItemValueFromElement.ts"],"sourcesContent":["export const dataTreeItemValueAttrName = 'data-fui-tree-item-value';\n\nexport const getTreeItemValueFromElement = (element: HTMLElement) => {\n  return element.getAttribute(dataTreeItemValueAttrName);\n};\n"],"names":["dataTreeItemValueAttrName","getTreeItemValueFromElement","element","getAttribute"],"mappings":"AAAA,OAAO,MAAMA,4BAA4B,2BAA2B;AAEpE,OAAO,MAAMC,8BAA8B,CAACC,UAAyB;IACnE,OAAOA,QAAQC,YAAY,CAACH;AAC9B,EAAE"}

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

@@ -53,7 +53,7 @@ function useRootTree(props, ref) {
             });
         });
     };
-    const handleTreeItemKeyDown = ({ event , value , type , itemType  })=>{
+    const handleTreeItemKeyDown = ({ event , type , value , itemType  })=>{
         const open = openItems.has(value);
         switch(type){
             case _tokens.treeDataTypes.ArrowRight:

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

@@ -1 +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 , value , type , 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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"}
+{"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":";;;;+BAUoBA;;aAAAA;;;6DAVG;gEACG;gCAC6C;uBACZ;wBAC7B;AAMnB,SAASA,YAAYC,KAAK,EAAEC,GAAG,EAAE;IACxCC,4BAA4BF;IAC5B,MAAM,EAAEG,YAAY,SAAQ,EAAGC,MAAM,SAAQ,EAAG,GAAGJ;IACnD,MAAM,CAACK,WAAWC,gBAAgB,GAAGC,IAAAA,wBAAiB,EAACP;IACvD,MAAM,CAACQ,UAAUC,cAAc,GAAGC,IAAAA,8BAAuB;IACzD,MAAMC,oBAAoB,CAACC,OAAO;QAC9B,IAAIC;QACHA,CAAAA,sBAAsBb,MAAMc,YAAY,AAAD,MAAO,IAAI,IAAID,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBE,IAAI,CAACf,OAAOY,KAAKI,KAAK,EAAEJ,KAAK;QAClJ,IAAIA,KAAKI,KAAK,CAACC,kBAAkB,IAAI;YACjC;QACJ,CAAC;QACD,OAAOX,gBAAgBM;IAC3B;IACA,MAAMM,oBAAoB,CAACN,OAAO;QAC9B,IAAIO;QACHA,CAAAA,+BAA+BnB,MAAMoB,qBAAqB,AAAD,MAAO,IAAI,IAAID,iCAAiC,KAAK,IAAI,KAAK,IAAIA,6BAA6BJ,IAAI,CAACf,OAAOY,KAAKI,KAAK,EAAEJ,KAAK;QACtL,IAAIA,KAAKI,KAAK,CAACC,kBAAkB,IAAI;YACjC;QACJ,CAAC;QACDT,SAASI;QACT,IAAIA,KAAKS,IAAI,KAAKC,qBAAa,CAACC,SAAS,IAAIX,KAAKS,IAAI,KAAKC,qBAAa,CAACE,OAAO,EAAE;YAC9EZ,KAAKI,KAAK,CAACS,cAAc;QAC7B,CAAC;IACL;IACA,MAAMC,sBAAsB,CAAC,EAAEV,MAAK,EAAGW,MAAK,EAAGC,SAAQ,EAAGP,KAAI,EAAG,GAAG;QAChEQ,UAASC,uBAAuB,CAAC,IAAI;YACjCnB,kBAAkB;gBACdK;gBACAW;gBACAI,MAAMH,aAAa,YAAY,CAACvB,UAAU2B,GAAG,CAACL;gBAC9CN;gBACAY,QAAQjB,MAAMkB,aAAa;YAC/B;YACAhB,kBAAkB;gBACdF;gBACAW;gBACAM,QAAQjB,MAAMkB,aAAa;gBAC3Bb,MAAMC,qBAAa,CAACa,KAAK;YAC7B;QACJ;IACJ;IACA,MAAMC,wBAAwB,CAAC,EAAEpB,MAAK,EAAGK,KAAI,EAAGM,MAAK,EAAGC,SAAQ,EAAG,GAAG;QAClE,MAAMG,OAAO1B,UAAU2B,GAAG,CAACL;QAC3B,OAAON;YACH,KAAKC,qBAAa,CAACe,UAAU;gBACzB,IAAIT,aAAa,QAAQ;oBACrB;gBACJ,CAAC;gBACD,IAAI,CAACG,MAAM;oBACP,OAAOpB,kBAAkB;wBACrBK;wBACAW;wBACAI,MAAM,IAAI;wBACVV,MAAMC,qBAAa,CAACe,UAAU;wBAC9BJ,QAAQjB,MAAMkB,aAAa;oBAC/B;gBACJ,CAAC;gBACD,OAAOhB,kBAAkB;oBACrBF;oBACAW;oBACAN;oBACAY,QAAQjB,MAAMkB,aAAa;gBAC/B;YACJ,KAAKZ,qBAAa,CAACgB,KAAK;gBACpB,OAAO3B,kBAAkB;oBACrBK;oBACAW;oBACAI,MAAMH,aAAa,YAAY,CAACG;oBAChCV,MAAMC,qBAAa,CAACgB,KAAK;oBACzBL,QAAQjB,MAAMkB,aAAa;gBAC/B;YACJ,KAAKZ,qBAAa,CAACiB,SAAS;gBACxB,IAAIR,QAAQH,aAAa,UAAU;oBAC/B,OAAOjB,kBAAkB;wBACrBK;wBACAW;wBACAI,MAAM,KAAK;wBACXV,MAAMC,qBAAa,CAACiB,SAAS;wBAC7BN,QAAQjB,MAAMkB,aAAa;oBAC/B;gBACJ,CAAC;gBACD,OAAOhB,kBAAkB;oBACrBF;oBACAW;oBACAM,QAAQjB,MAAMkB,aAAa;oBAC3Bb,MAAMC,qBAAa,CAACiB,SAAS;gBACjC;YACJ,KAAKjB,qBAAa,CAACkB,GAAG;YACtB,KAAKlB,qBAAa,CAACmB,IAAI;YACvB,KAAKnB,qBAAa,CAACE,OAAO;YAC1B,KAAKF,qBAAa,CAACC,SAAS;YAC5B,KAAKD,qBAAa,CAACoB,SAAS;gBACxB,OAAOxB,kBAAkB;oBACrBF;oBACAW;oBACAN;oBACAY,QAAQjB,MAAMkB,aAAa;gBAC/B;QACR;IACJ;IACA,MAAMS,sBAAsBC,IAAAA,gCAAgB,EAAC,CAACC,UAAU;QACpD,OAAOA,QAAQ7B,KAAK,CAACK,IAAI;YACrB,KAAK;gBACD,kFAAkF;gBAClF,OAAOK,oBAAoBmB;YAC/B,KAAK;gBACD,qFAAqF;gBACrF,OAAOT,sBAAsBS;QACrC;IACJ;IACA,OAAO;QACHC,YAAY;YACRC,MAAM;QACV;QACAhB,MAAM,IAAI;QACV5B;QACAC;QACA4C,OAAO;QACP3C;QACAsC;QACAI,MAAME,IAAAA,qCAAqB,EAAC,OAAO;YAC/BhD,KAAKiD,IAAAA,6BAAa,EAACzC,eAAeR;YAClCkD,MAAM;YACN,GAAGnD,KAAK;QACZ;IACJ;AACJ;AACA,SAASE,4BAA4BF,KAAK,EAAE;IACxC,IAAIoD,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QACxC,IAAI,CAACtD,KAAK,CAAC,aAAa,IAAI,CAACA,KAAK,CAAC,kBAAkB,EAAE;YACnD,sCAAsC;YACtCuD,QAAQC,IAAI,CAAC;QACjB,CAAC;IACL,CAAC;AACL"}

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

@@ -12,10 +12,12 @@ const _reactUtilities = require("@fluentui/react-utilities");
 const _reactPortal = require("@fluentui/react-portal");
 const _index = require("../../contexts/index");
 const _tokens = require("../../utils/tokens");
+const _getTreeItemValueFromElement = require("../../utils/getTreeItemValueFromElement");
 function useTreeItem_unstable(props, ref) {
+    var _props_value;
     const contextLevel = (0, _index.useTreeContext_unstable)((ctx)=>ctx.level);
-    const id = (0, _reactUtilities.useId)('fui-TreeItem-', props.id);
-    const { onClick , onKeyDown , as ='div' , value =id , itemType ='leaf' , 'aria-level': level = contextLevel , ...rest } = props;
+    const value = (0, _reactUtilities.useId)('fuiTreeItemValue-', (_props_value = props.value) === null || _props_value === void 0 ? void 0 : _props_value.toString());
+    const { onClick , onKeyDown , as ='div' , itemType ='leaf' , 'aria-level': level = contextLevel , ...rest } = props;
     const requestTreeResponse = (0, _index.useTreeContext_unstable)((ctx)=>ctx.requestTreeResponse);
     const [isActionsVisible, setActionsVisible] = _react.useState(false);
     const [isAsideVisible, setAsideVisible] = _react.useState(true);
@@ -66,8 +68,8 @@ function useTreeItem_unstable(props, ref) {
             case _tokens.treeDataTypes.ArrowRight:
                 return requestTreeResponse({
                     event,
-                    itemType,
                     value,
+                    itemType,
                     type: event.key
                 });
         }
@@ -75,8 +77,8 @@ function useTreeItem_unstable(props, ref) {
         if (isTypeAheadCharacter) {
             requestTreeResponse({
                 event,
-                itemType,
                 value,
+                itemType,
                 type: _tokens.treeDataTypes.TypeAhead
             });
         }
@@ -114,11 +116,11 @@ function useTreeItem_unstable(props, ref) {
         root: (0, _reactUtilities.getNativeElementProps)(as, {
             tabIndex: -1,
             ...rest,
-            id,
             ref,
+            role: 'treeitem',
             'aria-level': level,
+            [_getTreeItemValueFromElement.dataTreeItemValueAttrName]: value,
             'aria-expanded': itemType === 'branch' ? open : undefined,
-            role: 'treeitem',
             onClick: handleClick,
             onKeyDown: handleKeyDown,
             onMouseOver: handleActionsVisible,

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

@@ -1 +1 @@
-{"version":3,"sources":["useTreeItem.js"],"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 { useTreeContext_unstable } from '../../contexts/index';\nimport { treeDataTypes } from '../../utils/tokens';\n/**\n * Create the state required to render TreeItem.\n *\n * The returned state can be modified with hooks such as useTreeItemStyles_unstable,\n * before being passed to renderTreeItem_unstable.\n *\n * @param props - props from this instance of TreeItem\n * @param ref - reference to root HTMLElement of TreeItem\n */ export function useTreeItem_unstable(props, ref) {\n    const contextLevel = useTreeContext_unstable((ctx)=>ctx.level);\n    const id = useId('fui-TreeItem-', props.id);\n    const { onClick , onKeyDown , as ='div' , value =id , itemType ='leaf' , 'aria-level': level = contextLevel , ...rest } = props;\n    const requestTreeResponse = useTreeContext_unstable((ctx)=>ctx.requestTreeResponse);\n    const [isActionsVisible, setActionsVisible] = React.useState(false);\n    const [isAsideVisible, setAsideVisible] = React.useState(true);\n    const handleActionsRef = (actions)=>{\n        setAsideVisible(actions === null);\n    };\n    const open = useTreeContext_unstable((ctx)=>ctx.openItems.has(value));\n    const actionsRef = React.useRef(null);\n    const expandIconRef = React.useRef(null);\n    const layoutRef = React.useRef(null);\n    const subtreeRef = React.useRef(null);\n    const handleClick = useEventCallback((event)=>{\n        onClick === null || onClick === void 0 ? void 0 : onClick(event);\n        if (event.isDefaultPrevented()) {\n            return;\n        }\n        const isEventFromActions = actionsRef.current && elementContains(actionsRef.current, event.target);\n        if (isEventFromActions) {\n            return;\n        }\n        const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target);\n        if (isEventFromSubtree) {\n            return;\n        }\n        const isFromExpandIcon = expandIconRef.current && elementContains(expandIconRef.current, event.target);\n        requestTreeResponse({\n            event,\n            itemType,\n            value,\n            type: isFromExpandIcon ? treeDataTypes.ExpandIconClick : treeDataTypes.Click\n        });\n    });\n    const handleKeyDown = useEventCallback((event)=>{\n        onKeyDown === null || onKeyDown === void 0 ? void 0 : 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({\n                    event,\n                    itemType,\n                    value,\n                    type: event.key\n                });\n        }\n        const isTypeAheadCharacter = event.key.length === 1 && event.key.match(/\\w/) && !event.altKey && !event.ctrlKey && !event.metaKey;\n        if (isTypeAheadCharacter) {\n            requestTreeResponse({\n                event,\n                itemType,\n                value,\n                type: treeDataTypes.TypeAhead\n            });\n        }\n    });\n    const handleActionsVisible = useEventCallback((event)=>{\n        const isTargetFromSubtree = Boolean(subtreeRef.current && elementContains(subtreeRef.current, event.target));\n        if (!isTargetFromSubtree) {\n            setActionsVisible(true);\n        }\n    });\n    const handleActionsInvisible = useEventCallback((event)=>{\n        const isTargetFromSubtree = Boolean(subtreeRef.current && elementContains(subtreeRef.current, event.target));\n        const isRelatedTargetFromActions = Boolean(actionsRef.current && elementContains(actionsRef.current, event.relatedTarget));\n        if (isRelatedTargetFromActions) {\n            return setActionsVisible(true);\n        }\n        if (!isTargetFromSubtree) {\n            return setActionsVisible(false);\n        }\n    });\n    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":["useTreeItem_unstable","props","ref","contextLevel","useTreeContext_unstable","ctx","level","id","useId","onClick","onKeyDown","as","value","itemType","rest","requestTreeResponse","isActionsVisible","setActionsVisible","React","useState","isAsideVisible","setAsideVisible","handleActionsRef","actions","open","openItems","has","actionsRef","useRef","expandIconRef","layoutRef","subtreeRef","handleClick","useEventCallback","event","isDefaultPrevented","isEventFromActions","current","elementContains","target","isEventFromSubtree","isFromExpandIcon","type","treeDataTypes","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","useMergedRefs","components","root","getNativeElementProps","tabIndex","undefined","role","onMouseOver","onFocus","onMouseOut","onBlur"],"mappings":";;;;+BAcoBA;;aAAAA;;;6DAdG;gCACqC;6BAE5B;uBACQ;wBACV;AASnB,SAASA,qBAAqBC,KAAK,EAAEC,GAAG,EAAE;IACjD,MAAMC,eAAeC,IAAAA,8BAAuB,EAAC,CAACC,MAAMA,IAAIC,KAAK;IAC7D,MAAMC,KAAKC,IAAAA,qBAAK,EAAC,iBAAiBP,MAAMM,EAAE;IAC1C,MAAM,EAAEE,QAAO,EAAGC,UAAS,EAAGC,IAAI,MAAK,EAAGC,OAAOL,GAAE,EAAGM,UAAU,OAAM,EAAG,cAAcP,QAAQH,YAAY,CAAA,EAAG,GAAGW,MAAM,GAAGb;IAC1H,MAAMc,sBAAsBX,IAAAA,8BAAuB,EAAC,CAACC,MAAMA,IAAIU,mBAAmB;IAClF,MAAM,CAACC,kBAAkBC,kBAAkB,GAAGC,OAAMC,QAAQ,CAAC,KAAK;IAClE,MAAM,CAACC,gBAAgBC,gBAAgB,GAAGH,OAAMC,QAAQ,CAAC,IAAI;IAC7D,MAAMG,mBAAmB,CAACC,UAAU;QAChCF,gBAAgBE,YAAY,IAAI;IACpC;IACA,MAAMC,OAAOpB,IAAAA,8BAAuB,EAAC,CAACC,MAAMA,IAAIoB,SAAS,CAACC,GAAG,CAACd;IAC9D,MAAMe,aAAaT,OAAMU,MAAM,CAAC,IAAI;IACpC,MAAMC,gBAAgBX,OAAMU,MAAM,CAAC,IAAI;IACvC,MAAME,YAAYZ,OAAMU,MAAM,CAAC,IAAI;IACnC,MAAMG,aAAab,OAAMU,MAAM,CAAC,IAAI;IACpC,MAAMI,cAAcC,IAAAA,gCAAgB,EAAC,CAACC,QAAQ;QAC1CzB,YAAY,IAAI,IAAIA,YAAY,KAAK,IAAI,KAAK,IAAIA,QAAQyB,MAAM;QAChE,IAAIA,MAAMC,kBAAkB,IAAI;YAC5B;QACJ,CAAC;QACD,MAAMC,qBAAqBT,WAAWU,OAAO,IAAIC,IAAAA,4BAAe,EAACX,WAAWU,OAAO,EAAEH,MAAMK,MAAM;QACjG,IAAIH,oBAAoB;YACpB;QACJ,CAAC;QACD,MAAMI,qBAAqBT,WAAWM,OAAO,IAAIC,IAAAA,4BAAe,EAACP,WAAWM,OAAO,EAAEH,MAAMK,MAAM;QACjG,IAAIC,oBAAoB;YACpB;QACJ,CAAC;QACD,MAAMC,mBAAmBZ,cAAcQ,OAAO,IAAIC,IAAAA,4BAAe,EAACT,cAAcQ,OAAO,EAAEH,MAAMK,MAAM;QACrGxB,oBAAoB;YAChBmB;YACArB;YACAD;YACA8B,MAAMD,mBAAmBE,qBAAa,CAACC,eAAe,GAAGD,qBAAa,CAACE,KAAK;QAChF;IACJ;IACA,MAAMC,gBAAgBb,IAAAA,gCAAgB,EAAC,CAACC,QAAQ;QAC5CxB,cAAc,IAAI,IAAIA,cAAc,KAAK,IAAI,KAAK,IAAIA,UAAUwB,MAAM;QACtE,IAAIA,MAAMC,kBAAkB,IAAI;YAC5B;QACJ,CAAC;QACD,IAAID,MAAMa,aAAa,KAAKb,MAAMK,MAAM,EAAE;YACtC;QACJ,CAAC;QACD,OAAOL,MAAMc,GAAG;YACZ,KAAKL,qBAAa,CAACM,GAAG;YACtB,KAAKN,qBAAa,CAACO,IAAI;YACvB,KAAKP,qBAAa,CAACQ,KAAK;YACxB,KAAKR,qBAAa,CAACS,OAAO;YAC1B,KAAKT,qBAAa,CAACU,SAAS;YAC5B,KAAKV,qBAAa,CAACW,SAAS;YAC5B,KAAKX,qBAAa,CAACY,UAAU;gBACzB,OAAOxC,oBAAoB;oBACvBmB;oBACArB;oBACAD;oBACA8B,MAAMR,MAAMc,GAAG;gBACnB;QACR;QACA,MAAMQ,uBAAuBtB,MAAMc,GAAG,CAACS,MAAM,KAAK,KAAKvB,MAAMc,GAAG,CAACU,KAAK,CAAC,SAAS,CAACxB,MAAMyB,MAAM,IAAI,CAACzB,MAAM0B,OAAO,IAAI,CAAC1B,MAAM2B,OAAO;QACjI,IAAIL,sBAAsB;YACtBzC,oBAAoB;gBAChBmB;gBACArB;gBACAD;gBACA8B,MAAMC,qBAAa,CAACmB,SAAS;YACjC;QACJ,CAAC;IACL;IACA,MAAMC,uBAAuB9B,IAAAA,gCAAgB,EAAC,CAACC,QAAQ;QACnD,MAAM8B,sBAAsBC,QAAQlC,WAAWM,OAAO,IAAIC,IAAAA,4BAAe,EAACP,WAAWM,OAAO,EAAEH,MAAMK,MAAM;QAC1G,IAAI,CAACyB,qBAAqB;YACtB/C,kBAAkB,IAAI;QAC1B,CAAC;IACL;IACA,MAAMiD,yBAAyBjC,IAAAA,gCAAgB,EAAC,CAACC,QAAQ;QACrD,MAAM8B,sBAAsBC,QAAQlC,WAAWM,OAAO,IAAIC,IAAAA,4BAAe,EAACP,WAAWM,OAAO,EAAEH,MAAMK,MAAM;QAC1G,MAAM4B,6BAA6BF,QAAQtC,WAAWU,OAAO,IAAIC,IAAAA,4BAAe,EAACX,WAAWU,OAAO,EAAEH,MAAMkC,aAAa;QACxH,IAAID,4BAA4B;YAC5B,OAAOlD,kBAAkB,IAAI;QACjC,CAAC;QACD,IAAI,CAAC+C,qBAAqB;YACtB,OAAO/C,kBAAkB,KAAK;QAClC,CAAC;IACL;IACA,OAAO;QACHL;QACAY;QACAO;QACAJ,YAAY0C,IAAAA,6BAAa,EAAC1C,YAAYL;QACtCO;QACAC;QACAjB;QACAG;QACAI;QACAd;QACAgE,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,IAAAA,qCAAqB,EAAC7D,IAAI;YAC5B8D,UAAU,CAAC;YACX,GAAG3D,IAAI;YACPP;YACAL;YACA,cAAcI;YACd,iBAAiBO,aAAa,WAAWW,OAAOkD,SAAS;YACzDC,MAAM;YACNlE,SAASuB;YACTtB,WAAWoC;YACX8B,aAAab;YACbc,SAASd;YACTe,YAAYZ;YACZa,QAAQb;QACZ;IACJ;AACJ"}
+{"version":3,"sources":["useTreeItem.js"],"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 { useTreeContext_unstable } from '../../contexts/index';\nimport { treeDataTypes } from '../../utils/tokens';\nimport { dataTreeItemValueAttrName } from '../../utils/getTreeItemValueFromElement';\n/**\n * Create the state required to render TreeItem.\n *\n * The returned state can be modified with hooks such as useTreeItemStyles_unstable,\n * before being passed to renderTreeItem_unstable.\n *\n * @param props - props from this instance of TreeItem\n * @param ref - reference to root HTMLElement of TreeItem\n */ export function useTreeItem_unstable(props, ref) {\n    var _props_value;\n    const contextLevel = useTreeContext_unstable((ctx)=>ctx.level);\n    const value = useId('fuiTreeItemValue-', (_props_value = props.value) === null || _props_value === void 0 ? void 0 : _props_value.toString());\n    const { onClick , onKeyDown , as ='div' , itemType ='leaf' , 'aria-level': level = contextLevel , ...rest } = props;\n    const requestTreeResponse = useTreeContext_unstable((ctx)=>ctx.requestTreeResponse);\n    const [isActionsVisible, setActionsVisible] = React.useState(false);\n    const [isAsideVisible, setAsideVisible] = React.useState(true);\n    const handleActionsRef = (actions)=>{\n        setAsideVisible(actions === null);\n    };\n    const open = useTreeContext_unstable((ctx)=>ctx.openItems.has(value));\n    const actionsRef = React.useRef(null);\n    const expandIconRef = React.useRef(null);\n    const layoutRef = React.useRef(null);\n    const subtreeRef = React.useRef(null);\n    const handleClick = useEventCallback((event)=>{\n        onClick === null || onClick === void 0 ? void 0 : onClick(event);\n        if (event.isDefaultPrevented()) {\n            return;\n        }\n        const isEventFromActions = actionsRef.current && elementContains(actionsRef.current, event.target);\n        if (isEventFromActions) {\n            return;\n        }\n        const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target);\n        if (isEventFromSubtree) {\n            return;\n        }\n        const isFromExpandIcon = expandIconRef.current && elementContains(expandIconRef.current, event.target);\n        requestTreeResponse({\n            event,\n            itemType,\n            value,\n            type: isFromExpandIcon ? treeDataTypes.ExpandIconClick : treeDataTypes.Click\n        });\n    });\n    const handleKeyDown = useEventCallback((event)=>{\n        onKeyDown === null || onKeyDown === void 0 ? void 0 : 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({\n                    event,\n                    value,\n                    itemType,\n                    type: event.key\n                });\n        }\n        const isTypeAheadCharacter = event.key.length === 1 && event.key.match(/\\w/) && !event.altKey && !event.ctrlKey && !event.metaKey;\n        if (isTypeAheadCharacter) {\n            requestTreeResponse({\n                event,\n                value,\n                itemType,\n                type: treeDataTypes.TypeAhead\n            });\n        }\n    });\n    const handleActionsVisible = useEventCallback((event)=>{\n        const isTargetFromSubtree = Boolean(subtreeRef.current && elementContains(subtreeRef.current, event.target));\n        if (!isTargetFromSubtree) {\n            setActionsVisible(true);\n        }\n    });\n    const handleActionsInvisible = useEventCallback((event)=>{\n        const isTargetFromSubtree = Boolean(subtreeRef.current && elementContains(subtreeRef.current, event.target));\n        const isRelatedTargetFromActions = Boolean(actionsRef.current && elementContains(actionsRef.current, event.relatedTarget));\n        if (isRelatedTargetFromActions) {\n            return setActionsVisible(true);\n        }\n        if (!isTargetFromSubtree) {\n            return setActionsVisible(false);\n        }\n    });\n    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            ref,\n            role: 'treeitem',\n            'aria-level': level,\n            [dataTreeItemValueAttrName]: value,\n            'aria-expanded': itemType === 'branch' ? open : undefined,\n            onClick: handleClick,\n            onKeyDown: handleKeyDown,\n            onMouseOver: handleActionsVisible,\n            onFocus: handleActionsVisible,\n            onMouseOut: handleActionsInvisible,\n            onBlur: handleActionsInvisible\n        })\n    };\n}\n"],"names":["useTreeItem_unstable","props","ref","_props_value","contextLevel","useTreeContext_unstable","ctx","level","value","useId","toString","onClick","onKeyDown","as","itemType","rest","requestTreeResponse","isActionsVisible","setActionsVisible","React","useState","isAsideVisible","setAsideVisible","handleActionsRef","actions","open","openItems","has","actionsRef","useRef","expandIconRef","layoutRef","subtreeRef","handleClick","useEventCallback","event","isDefaultPrevented","isEventFromActions","current","elementContains","target","isEventFromSubtree","isFromExpandIcon","type","treeDataTypes","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","useMergedRefs","components","root","getNativeElementProps","tabIndex","role","dataTreeItemValueAttrName","undefined","onMouseOver","onFocus","onMouseOut","onBlur"],"mappings":"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"}

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

@@ -50,11 +50,9 @@ const useRootStyles = /*#__PURE__*/ (0, _react["__styles"])({
     base: {
         qhf8xq: "f10pi13n",
         Bceei9c: "f1k6fduh",
-        mc9l5x: "f13qh94s",
+        mc9l5x: "f22iagw",
+        Beiy3e4: "f1vx9l62",
         B7ck84d: "f1ewtqcl",
-        wkccdc: "ffh4ag3",
-        Budl1dq: "f1y1g942",
-        zoa1oz: "faz22wj",
         De3pzq: "fhovq9v",
         sj55zd: "fkfq4zb",
         z189sj: [
@@ -150,11 +148,9 @@ const useRootStyles = /*#__PURE__*/ (0, _react["__styles"])({
         ".fyat3t{--fluent-TreeItem--level:10;}",
         ".f10pi13n{position:relative;}",
         ".f1k6fduh{cursor:pointer;}",
-        ".f13qh94s{display:grid;}",
+        ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}",
+        ".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}",
         ".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);}",

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

@@ -1 +1 @@
-{"version":3,"sources":["useTreeItemStyles.styles.js"],"sourcesContent":["import { __styles, 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 = /*#__PURE__*/__styles({\n  level1: {\n    iytv0q: \"f10bgyvd\"\n  },\n  level2: {\n    iytv0q: \"f1h0rod3\"\n  },\n  level3: {\n    iytv0q: \"fgoqafk\"\n  },\n  level4: {\n    iytv0q: \"f75dvuh\"\n  },\n  level5: {\n    iytv0q: \"fqk7yw6\"\n  },\n  level6: {\n    iytv0q: \"f1r3z17b\"\n  },\n  level7: {\n    iytv0q: \"f1hrpd1h\"\n  },\n  level8: {\n    iytv0q: \"f1iy65d0\"\n  },\n  level9: {\n    iytv0q: \"ftg42e5\"\n  },\n  level10: {\n    iytv0q: \"fyat3t\"\n  },\n  base: {\n    qhf8xq: \"f10pi13n\",\n    Bceei9c: \"f1k6fduh\",\n    mc9l5x: \"f13qh94s\",\n    B7ck84d: \"f1ewtqcl\",\n    wkccdc: \"ffh4ag3\",\n    Budl1dq: \"f1y1g942\",\n    zoa1oz: \"faz22wj\",\n    De3pzq: \"fhovq9v\",\n    sj55zd: \"fkfq4zb\",\n    z189sj: [\"flk2ux3\", \"fkl3uby\"]\n  },\n  focusIndicator: {\n    Brovlpu: \"ftqa4ok\",\n    B486eqv: \"f2hkw1w\",\n    B8q5s1w: \"f8hki3x\",\n    Bci5o5g: [\"f1d2448m\", \"ffh67wi\"],\n    n8qw10: \"f1bjia2o\",\n    Bdrgwmp: [\"ffh67wi\", \"f1d2448m\"],\n    Bm4h7ae: \"f15bsgw9\",\n    B7ys5i9: \"f14e48fq\",\n    Busjfv9: \"f18yb2kv\",\n    Bhk32uz: \"fd6o370\",\n    Bf4ptjt: \"fh1cnn4\",\n    kclons: [\"fy7oxxb\", \"f184ne2d\"],\n    Bhdgwq3: \"fpukqih\",\n    Blkhhs4: [\"f184ne2d\", \"fy7oxxb\"],\n    Bqtpl0w: \"frrh606\",\n    clg4pj: [\"f1v5zibi\", \"fo2hd23\"],\n    hgwjuy: \"ful5kiu\",\n    Bonggc9: [\"fo2hd23\", \"f1v5zibi\"],\n    B1tsrr9: [\"f1jqcqds\", \"ftffrms\"],\n    Dah5zi: [\"ftffrms\", \"f1jqcqds\"],\n    Bkh64rk: [\"f2e7qr6\", \"fsr1zz6\"],\n    qqdqy8: [\"fsr1zz6\", \"f2e7qr6\"],\n    B6dhp37: \"f1dvezut\",\n    i03rao: [\"fd0oaoj\", \"f1cwg4i8\"],\n    Boxcth7: \"fjvm52t\",\n    Bsom6fd: [\"f1cwg4i8\", \"fd0oaoj\"],\n    J0r882: \"f57olzd\",\n    Bule8hv: [\"f4stah7\", \"fs1por5\"],\n    Bjwuhne: \"f480a47\",\n    Ghsupd: [\"fs1por5\", \"f4stah7\"]\n  }\n}, {\n  d: [\".f10bgyvd{--fluent-TreeItem--level:1;}\", \".f1h0rod3{--fluent-TreeItem--level:2;}\", \".fgoqafk{--fluent-TreeItem--level:3;}\", \".f75dvuh{--fluent-TreeItem--level:4;}\", \".fqk7yw6{--fluent-TreeItem--level:5;}\", \".f1r3z17b{--fluent-TreeItem--level:6;}\", \".f1hrpd1h{--fluent-TreeItem--level:7;}\", \".f1iy65d0{--fluent-TreeItem--level:8;}\", \".ftg42e5{--fluent-TreeItem--level:9;}\", \".fyat3t{--fluent-TreeItem--level:10;}\", \".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);}\"],\n  f: [\".ftqa4ok:focus{outline-style:none;}\"],\n  i: [\".f2hkw1w:focus-visible{outline-style:none;}\"]\n});\n/**\n * Apply styling to the TreeItem slots based on the state\n */\nexport const useTreeItemStyles_unstable = state => {\n  const rootStyles = useRootStyles();\n  const {\n    level\n  } = 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//# sourceMappingURL=useTreeItemStyles.styles.js.map"],"names":["treeItemClassNames","useTreeItemStyles_unstable","root","useRootStyles","__styles","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","state","rootStyles","level","className","mergeClasses","isStaticallyDefinedLevel"],"mappings":";;;;;;;;;;;IAIaA,kBAAkB,MAAlBA;IAsFAC,0BAA0B,MAA1BA;;uBA1F0B;AAIhC,MAAMD,qBAAqB;IAChCE,MAAM;AACR;AACA,MAAMC,gBAAgB,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IAC1CC,QAAQ;QACNC,QAAQ;IACV;IACAC,QAAQ;QACND,QAAQ;IACV;IACAE,QAAQ;QACNF,QAAQ;IACV;IACAG,QAAQ;QACNH,QAAQ;IACV;IACAI,QAAQ;QACNJ,QAAQ;IACV;IACAK,QAAQ;QACNL,QAAQ;IACV;IACAM,QAAQ;QACNN,QAAQ;IACV;IACAO,QAAQ;QACNP,QAAQ;IACV;IACAQ,QAAQ;QACNR,QAAQ;IACV;IACAS,SAAS;QACPT,QAAQ;IACV;IACAU,MAAM;QACJC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,QAAQ;QACRC,QAAQ;QACRC,QAAQ;YAAC;YAAW;SAAU;IAChC;IACAC,gBAAgB;QACdC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;YAAC;YAAY;SAAU;QAChCC,QAAQ;QACRC,SAAS;YAAC;YAAW;SAAW;QAChCC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,SAAS;QACTC,SAAS;YAAC;YAAY;SAAU;QAChCC,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAU;QAC/BC,QAAQ;QACRC,SAAS;YAAC;YAAW;SAAW;QAChCC,SAAS;YAAC;YAAY;SAAU;QAChCC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,SAAS;YAAC;YAAW;SAAU;QAC/BC,QAAQ;YAAC;YAAW;SAAU;QAC9BC,SAAS;QACTC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,SAAS;QACTC,SAAS;YAAC;YAAY;SAAU;QAChCC,QAAQ;QACRC,SAAS;YAAC;YAAW;SAAU;QAC/BC,SAAS;QACTC,QAAQ;YAAC;YAAW;SAAU;IAChC;AACF,GAAG;IACDC,GAAG;QAAC;QAA0C;QAA0C;QAAyC;QAAyC;QAAyC;QAA0C;QAA0C;QAA0C;QAAyC;QAAyC;QAAiC;QAA8B;QAA4B;QAAqC;QAA2C;QAA8E;QAAwE;QAA4D;QAAmD;QAAyD;QAAwD;QAAmE;QAAsE;QAAoE;QAAuE;QAA2D;QAAgE;QAAkE;QAAuD;QAAoE;QAAsE;QAAsE;QAAuE;QAAkE;QAAqE;QAAmE;QAAqE;QAAmG;QAAiG;QAA+F;QAA8F;QAAwF;QAAyF;QAAyF;QAA0F;QAAgE;QAAkE;QAAiE;KAAkE;IAC59FC,GAAG;QAAC;KAAsC;IAC1CC,GAAG;QAAC;KAA8C;AACpD;AAIO,MAAM3D,6BAA6B4D,CAAAA,QAAS;IACjD,MAAMC,aAAa3D;IACnB,MAAM,EACJ4D,MAAK,EACN,GAAGF;IACJA,MAAM3D,IAAI,CAAC8D,SAAS,GAAGC,IAAAA,mBAAY,EAACjE,mBAAmBE,IAAI,EAAEgE,yBAAyBH,UAAUD,UAAU,CAAC,CAAC,KAAK,EAAEC,MAAM,CAAC,CAAC,EAAED,WAAW9C,IAAI,EAAE8C,WAAWnC,cAAc,EAAEkC,MAAM3D,IAAI,CAAC8D,SAAS;IAC7L,OAAOH;AACT;AACA,SAASK,yBAAyBH,KAAK,EAAE;IACvC,OAAOA,SAAS,KAAKA,SAAS;AAChC,EACA,oDAAoD"}
+{"version":3,"sources":["useTreeItemStyles.styles.js"],"sourcesContent":["import { __styles, 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 = /*#__PURE__*/__styles({\n  level1: {\n    iytv0q: \"f10bgyvd\"\n  },\n  level2: {\n    iytv0q: \"f1h0rod3\"\n  },\n  level3: {\n    iytv0q: \"fgoqafk\"\n  },\n  level4: {\n    iytv0q: \"f75dvuh\"\n  },\n  level5: {\n    iytv0q: \"fqk7yw6\"\n  },\n  level6: {\n    iytv0q: \"f1r3z17b\"\n  },\n  level7: {\n    iytv0q: \"f1hrpd1h\"\n  },\n  level8: {\n    iytv0q: \"f1iy65d0\"\n  },\n  level9: {\n    iytv0q: \"ftg42e5\"\n  },\n  level10: {\n    iytv0q: \"fyat3t\"\n  },\n  base: {\n    qhf8xq: \"f10pi13n\",\n    Bceei9c: \"f1k6fduh\",\n    mc9l5x: \"f22iagw\",\n    Beiy3e4: \"f1vx9l62\",\n    B7ck84d: \"f1ewtqcl\",\n    De3pzq: \"fhovq9v\",\n    sj55zd: \"fkfq4zb\",\n    z189sj: [\"flk2ux3\", \"fkl3uby\"]\n  },\n  focusIndicator: {\n    Brovlpu: \"ftqa4ok\",\n    B486eqv: \"f2hkw1w\",\n    B8q5s1w: \"f8hki3x\",\n    Bci5o5g: [\"f1d2448m\", \"ffh67wi\"],\n    n8qw10: \"f1bjia2o\",\n    Bdrgwmp: [\"ffh67wi\", \"f1d2448m\"],\n    Bm4h7ae: \"f15bsgw9\",\n    B7ys5i9: \"f14e48fq\",\n    Busjfv9: \"f18yb2kv\",\n    Bhk32uz: \"fd6o370\",\n    Bf4ptjt: \"fh1cnn4\",\n    kclons: [\"fy7oxxb\", \"f184ne2d\"],\n    Bhdgwq3: \"fpukqih\",\n    Blkhhs4: [\"f184ne2d\", \"fy7oxxb\"],\n    Bqtpl0w: \"frrh606\",\n    clg4pj: [\"f1v5zibi\", \"fo2hd23\"],\n    hgwjuy: \"ful5kiu\",\n    Bonggc9: [\"fo2hd23\", \"f1v5zibi\"],\n    B1tsrr9: [\"f1jqcqds\", \"ftffrms\"],\n    Dah5zi: [\"ftffrms\", \"f1jqcqds\"],\n    Bkh64rk: [\"f2e7qr6\", \"fsr1zz6\"],\n    qqdqy8: [\"fsr1zz6\", \"f2e7qr6\"],\n    B6dhp37: \"f1dvezut\",\n    i03rao: [\"fd0oaoj\", \"f1cwg4i8\"],\n    Boxcth7: \"fjvm52t\",\n    Bsom6fd: [\"f1cwg4i8\", \"fd0oaoj\"],\n    J0r882: \"f57olzd\",\n    Bule8hv: [\"f4stah7\", \"fs1por5\"],\n    Bjwuhne: \"f480a47\",\n    Ghsupd: [\"fs1por5\", \"f4stah7\"]\n  }\n}, {\n  d: [\".f10bgyvd{--fluent-TreeItem--level:1;}\", \".f1h0rod3{--fluent-TreeItem--level:2;}\", \".fgoqafk{--fluent-TreeItem--level:3;}\", \".f75dvuh{--fluent-TreeItem--level:4;}\", \".fqk7yw6{--fluent-TreeItem--level:5;}\", \".f1r3z17b{--fluent-TreeItem--level:6;}\", \".f1hrpd1h{--fluent-TreeItem--level:7;}\", \".f1iy65d0{--fluent-TreeItem--level:8;}\", \".ftg42e5{--fluent-TreeItem--level:9;}\", \".fyat3t{--fluent-TreeItem--level:10;}\", \".f10pi13n{position:relative;}\", \".f1k6fduh{cursor:pointer;}\", \".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}\", \".f1ewtqcl{box-sizing:border-box;}\", \".fhovq9v{background-color:var(--colorSubtleBackground);}\", \".fkfq4zb{color:var(--colorNeutralForeground2);}\", \".flk2ux3{padding-right:var(--spacingHorizontalNone);}\", \".fkl3uby{padding-left:var(--spacingHorizontalNone);}\", \".f8hki3x[data-fui-focus-visible]{border-top-color:transparent;}\", \".f1d2448m[data-fui-focus-visible]{border-right-color:transparent;}\", \".ffh67wi[data-fui-focus-visible]{border-left-color:transparent;}\", \".f1bjia2o[data-fui-focus-visible]{border-bottom-color:transparent;}\", \".f15bsgw9[data-fui-focus-visible]::after{content:\\\"\\\";}\", \".f14e48fq[data-fui-focus-visible]::after{position:absolute;}\", \".f18yb2kv[data-fui-focus-visible]::after{pointer-events:none;}\", \".fd6o370[data-fui-focus-visible]::after{z-index:1;}\", \".fh1cnn4[data-fui-focus-visible]::after{border-top-style:solid;}\", \".fy7oxxb[data-fui-focus-visible]::after{border-right-style:solid;}\", \".f184ne2d[data-fui-focus-visible]::after{border-left-style:solid;}\", \".fpukqih[data-fui-focus-visible]::after{border-bottom-style:solid;}\", \".frrh606[data-fui-focus-visible]::after{border-top-width:2px;}\", \".f1v5zibi[data-fui-focus-visible]::after{border-right-width:2px;}\", \".fo2hd23[data-fui-focus-visible]::after{border-left-width:2px;}\", \".ful5kiu[data-fui-focus-visible]::after{border-bottom-width:2px;}\", \".f1jqcqds[data-fui-focus-visible]::after{border-bottom-right-radius:var(--borderRadiusMedium);}\", \".ftffrms[data-fui-focus-visible]::after{border-bottom-left-radius:var(--borderRadiusMedium);}\", \".f2e7qr6[data-fui-focus-visible]::after{border-top-right-radius:var(--borderRadiusMedium);}\", \".fsr1zz6[data-fui-focus-visible]::after{border-top-left-radius:var(--borderRadiusMedium);}\", \".f1dvezut[data-fui-focus-visible]::after{border-top-color:var(--colorStrokeFocus2);}\", \".fd0oaoj[data-fui-focus-visible]::after{border-right-color:var(--colorStrokeFocus2);}\", \".f1cwg4i8[data-fui-focus-visible]::after{border-left-color:var(--colorStrokeFocus2);}\", \".fjvm52t[data-fui-focus-visible]::after{border-bottom-color:var(--colorStrokeFocus2);}\", \".f57olzd[data-fui-focus-visible]::after{top:calc(2px * -1);}\", \".f4stah7[data-fui-focus-visible]::after{right:calc(2px * -1);}\", \".fs1por5[data-fui-focus-visible]::after{left:calc(2px * -1);}\", \".f480a47[data-fui-focus-visible]::after{bottom:calc(2px * -1);}\"],\n  f: [\".ftqa4ok:focus{outline-style:none;}\"],\n  i: [\".f2hkw1w:focus-visible{outline-style:none;}\"]\n});\n/**\n * Apply styling to the TreeItem slots based on the state\n */\nexport const useTreeItemStyles_unstable = state => {\n  const rootStyles = useRootStyles();\n  const {\n    level\n  } = 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//# sourceMappingURL=useTreeItemStyles.styles.js.map"],"names":["treeItemClassNames","useTreeItemStyles_unstable","root","useRootStyles","__styles","level1","iytv0q","level2","level3","level4","level5","level6","level7","level8","level9","level10","base","qhf8xq","Bceei9c","mc9l5x","Beiy3e4","B7ck84d","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","state","rootStyles","level","className","mergeClasses","isStaticallyDefinedLevel"],"mappings":";;;;;;;;;;;IAIaA,kBAAkB,MAAlBA;IAoFAC,0BAA0B,MAA1BA;;uBAxF0B;AAIhC,MAAMD,qBAAqB;IAChCE,MAAM;AACR;AACA,MAAMC,gBAAgB,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IAC1CC,QAAQ;QACNC,QAAQ;IACV;IACAC,QAAQ;QACND,QAAQ;IACV;IACAE,QAAQ;QACNF,QAAQ;IACV;IACAG,QAAQ;QACNH,QAAQ;IACV;IACAI,QAAQ;QACNJ,QAAQ;IACV;IACAK,QAAQ;QACNL,QAAQ;IACV;IACAM,QAAQ;QACNN,QAAQ;IACV;IACAO,QAAQ;QACNP,QAAQ;IACV;IACAQ,QAAQ;QACNR,QAAQ;IACV;IACAS,SAAS;QACPT,QAAQ;IACV;IACAU,MAAM;QACJC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,QAAQ;QACRC,QAAQ;QACRC,QAAQ;YAAC;YAAW;SAAU;IAChC;IACAC,gBAAgB;QACdC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;YAAC;YAAY;SAAU;QAChCC,QAAQ;QACRC,SAAS;YAAC;YAAW;SAAW;QAChCC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,SAAS;QACTC,SAAS;YAAC;YAAY;SAAU;QAChCC,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAU;QAC/BC,QAAQ;QACRC,SAAS;YAAC;YAAW;SAAW;QAChCC,SAAS;YAAC;YAAY;SAAU;QAChCC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,SAAS;YAAC;YAAW;SAAU;QAC/BC,QAAQ;YAAC;YAAW;SAAU;QAC9BC,SAAS;QACTC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,SAAS;QACTC,SAAS;YAAC;YAAY;SAAU;QAChCC,QAAQ;QACRC,SAAS;YAAC;YAAW;SAAU;QAC/BC,SAAS;QACTC,QAAQ;YAAC;YAAW;SAAU;IAChC;AACF,GAAG;IACDC,GAAG;QAAC;QAA0C;QAA0C;QAAyC;QAAyC;QAAyC;QAA0C;QAA0C;QAA0C;QAAyC;QAAyC;QAAiC;QAA8B;QAAwF;QAA6F;QAAqC;QAA4D;QAAmD;QAAyD;QAAwD;QAAmE;QAAsE;QAAoE;QAAuE;QAA2D;QAAgE;QAAkE;QAAuD;QAAoE;QAAsE;QAAsE;QAAuE;QAAkE;QAAqE;QAAmE;QAAqE;QAAmG;QAAiG;QAA+F;QAA8F;QAAwF;QAAyF;QAAyF;QAA0F;QAAgE;QAAkE;QAAiE;KAAkE;IACp7FC,GAAG;QAAC;KAAsC;IAC1CC,GAAG;QAAC;KAA8C;AACpD;AAIO,MAAMzD,6BAA6B0D,CAAAA,QAAS;IACjD,MAAMC,aAAazD;IACnB,MAAM,EACJ0D,MAAK,EACN,GAAGF;IACJA,MAAMzD,IAAI,CAAC4D,SAAS,GAAGC,IAAAA,mBAAY,EAAC/D,mBAAmBE,IAAI,EAAE8D,yBAAyBH,UAAUD,UAAU,CAAC,CAAC,KAAK,EAAEC,MAAM,CAAC,CAAC,EAAED,WAAW5C,IAAI,EAAE4C,WAAWnC,cAAc,EAAEkC,MAAMzD,IAAI,CAAC4D,SAAS;IAC7L,OAAOH;AACT;AACA,SAASK,yBAAyBH,KAAK,EAAE;IACvC,OAAOA,SAAS,KAAKA,SAAS;AAChC,EACA,oDAAoD"}

package/lib-commonjs/components/TreeItemLayout/renderTreeItemLayout.js

@@ -8,7 +8,10 @@ Object.defineProperty(exports, "renderTreeItemLayout_unstable", {
 });
 const _reactJsxRuntime = require("@fluentui/react-jsx-runtime");
 const _reactUtilities = require("@fluentui/react-utilities");
+const _reactButton = require("@fluentui/react-button");
 const renderTreeItemLayout_unstable = (state)=>{
     const { slots , slotProps  } = (0, _reactUtilities.getSlotsNext)(state);
-    return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.expandIcon, slotProps.expandIcon), slots.iconBefore && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.iconBefore, slotProps.iconBefore), slotProps.root.children, slots.iconAfter && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.iconAfter, slotProps.iconAfter));
+    return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.expandIcon, slotProps.expandIcon), slots.iconBefore && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.iconBefore, slotProps.iconBefore), slotProps.root.children, slots.iconAfter && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.iconAfter, slotProps.iconAfter), /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_reactButton.ButtonContextProvider, {
+        value: state.buttonContextValue
+    }, slots.actions && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.actions, slotProps.actions), slots.aside && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.aside, slotProps.aside)));
 };

package/lib-commonjs/components/TreeItemLayout/renderTreeItemLayout.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderTreeItemLayout.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of TreeItemLayout\n */ export const renderTreeItemLayout_unstable = (state)=>{\n    const { slots , slotProps  } = getSlotsNext(state);\n    return /*#__PURE__*/ createElement(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/ createElement(slots.expandIcon, slotProps.expandIcon), slots.iconBefore && /*#__PURE__*/ createElement(slots.iconBefore, slotProps.iconBefore), slotProps.root.children, slots.iconAfter && /*#__PURE__*/ createElement(slots.iconAfter, slotProps.iconAfter));\n};\n"],"names":["renderTreeItemLayout_unstable","state","slots","slotProps","getSlotsNext","createElement","root","expandIcon","iconBefore","children","iconAfter"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAIjCA;;aAAAA;;iCAJkE;gCACtD;AAGlB,MAAMA,gCAAgC,CAACC,QAAQ;IACtD,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,4BAAY,EAACH;IAC5C,OAAO,WAAW,GAAGI,IAAAA,8BAAa,EAACH,MAAMI,IAAI,EAAEH,UAAUG,IAAI,EAAEJ,MAAMK,UAAU,IAAI,WAAW,GAAGF,IAAAA,8BAAa,EAACH,MAAMK,UAAU,EAAEJ,UAAUI,UAAU,GAAGL,MAAMM,UAAU,IAAI,WAAW,GAAGH,IAAAA,8BAAa,EAACH,MAAMM,UAAU,EAAEL,UAAUK,UAAU,GAAGL,UAAUG,IAAI,CAACG,QAAQ,EAAEP,MAAMQ,SAAS,IAAI,WAAW,GAAGL,IAAAA,8BAAa,EAACH,MAAMQ,SAAS,EAAEP,UAAUO,SAAS;AACjW"}
+{"version":3,"sources":["renderTreeItemLayout.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { ButtonContextProvider } from '@fluentui/react-button';\n/**\n * Render the final JSX of TreeItemLayout\n */ export const renderTreeItemLayout_unstable = (state)=>{\n    const { slots , slotProps  } = getSlotsNext(state);\n    return /*#__PURE__*/ createElement(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/ createElement(slots.expandIcon, slotProps.expandIcon), slots.iconBefore && /*#__PURE__*/ createElement(slots.iconBefore, slotProps.iconBefore), slotProps.root.children, slots.iconAfter && /*#__PURE__*/ createElement(slots.iconAfter, slotProps.iconAfter), /*#__PURE__*/ createElement(ButtonContextProvider, {\n        value: state.buttonContextValue\n    }, slots.actions && /*#__PURE__*/ createElement(slots.actions, slotProps.actions), slots.aside && /*#__PURE__*/ createElement(slots.aside, slotProps.aside)));\n};\n"],"names":["renderTreeItemLayout_unstable","state","slots","slotProps","getSlotsNext","createElement","root","expandIcon","iconBefore","children","iconAfter","ButtonContextProvider","value","buttonContextValue","actions","aside"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAKjCA;;aAAAA;;iCALkE;gCACtD;6BACS;AAG3B,MAAMA,gCAAgC,CAACC,QAAQ;IACtD,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,4BAAY,EAACH;IAC5C,OAAO,WAAW,GAAGI,IAAAA,8BAAa,EAACH,MAAMI,IAAI,EAAEH,UAAUG,IAAI,EAAEJ,MAAMK,UAAU,IAAI,WAAW,GAAGF,IAAAA,8BAAa,EAACH,MAAMK,UAAU,EAAEJ,UAAUI,UAAU,GAAGL,MAAMM,UAAU,IAAI,WAAW,GAAGH,IAAAA,8BAAa,EAACH,MAAMM,UAAU,EAAEL,UAAUK,UAAU,GAAGL,UAAUG,IAAI,CAACG,QAAQ,EAAEP,MAAMQ,SAAS,IAAI,WAAW,GAAGL,IAAAA,8BAAa,EAACH,MAAMQ,SAAS,EAAEP,UAAUO,SAAS,GAAG,WAAW,GAAGL,IAAAA,8BAAa,EAACM,kCAAqB,EAAE;QAC/YC,OAAOX,MAAMY,kBAAkB;IACnC,GAAGX,MAAMY,OAAO,IAAI,WAAW,GAAGT,IAAAA,8BAAa,EAACH,MAAMY,OAAO,EAAEX,UAAUW,OAAO,GAAGZ,MAAMa,KAAK,IAAI,WAAW,GAAGV,IAAAA,8BAAa,EAACH,MAAMa,KAAK,EAAEZ,UAAUY,KAAK;AAC9J"}

package/lib-commonjs/components/TreeItemLayout/useTreeItemLayout.js

@@ -12,16 +12,26 @@ const _reactUtilities = require("@fluentui/react-utilities");
 const _treeItemContext = require("../../contexts/treeItemContext");
 const _treeItemChevron = require("../TreeItemChevron");
 const useTreeItemLayout_unstable = (props, ref)=>{
-    const { iconAfter , iconBefore , expandIcon , as ='span'  } = props;
+    const { iconAfter , iconBefore , expandIcon , as ='span' , aside , actions  } = props;
     const layoutRef = (0, _treeItemContext.useTreeItemContext_unstable)((ctx)=>ctx.layoutRef);
     const expandIconRef = (0, _treeItemContext.useTreeItemContext_unstable)((ctx)=>ctx.expandIconRef);
+    const isActionsVisibleContext = (0, _treeItemContext.useTreeItemContext_unstable)((ctx)=>ctx.isActionsVisible);
+    const isAsideVisible = (0, _treeItemContext.useTreeItemContext_unstable)((ctx)=>ctx.isAsideVisible);
+    var _ref;
+    const isActionsVisible = (_ref = (0, _reactUtilities.isResolvedShorthand)(actions) ? actions.visible : undefined) !== null && _ref !== void 0 ? _ref : isActionsVisibleContext;
     const isBranch = (0, _treeItemContext.useTreeItemContext_unstable)((ctx)=>ctx.itemType === 'branch');
+    const actionsRef = (0, _reactUtilities.useMergedRefs)((0, _reactUtilities.isResolvedShorthand)(actions) ? actions.ref : undefined, (0, _treeItemContext.useTreeItemContext_unstable)((ctx)=>ctx.actionsRef));
     return {
         components: {
             root: 'div',
             expandIcon: 'div',
             iconBefore: 'div',
-            iconAfter: 'div'
+            iconAfter: 'div',
+            actions: 'div',
+            aside: 'div'
+        },
+        buttonContextValue: {
+            size: 'small'
         },
         root: (0, _reactUtilities.getNativeElementProps)(as, {
             ...props,
@@ -37,6 +47,15 @@ const useTreeItemLayout_unstable = (props, ref)=>{
                 'aria-hidden': true
             }
         }),
+        aside: isAsideVisible ? (0, _reactUtilities.resolveShorthand)(aside) : undefined,
+        actions: isActionsVisible ? (0, _reactUtilities.resolveShorthand)((0, _reactUtilities.isResolvedShorthand)(actions) ? {
+            ...actions,
+            visible: undefined
+        } : actions, {
+            defaultProps: {
+                ref: actionsRef
+            }
+        }) : undefined,
         expandIcon: (0, _reactUtilities.resolveShorthand)(expandIcon, {
             required: isBranch,
             defaultProps: {

package/lib-commonjs/components/TreeItemLayout/useTreeItemLayout.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTreeItemLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, isResolvedShorthand, resolveShorthand, useMergedRefs } from '@fluentui/react-utilities';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\nimport { TreeItemChevron } from '../TreeItemChevron';\n/**\n * Create the state required to render TreeItemLayout.\n *\n * The returned state can be modified with hooks such as useTreeItemLayoutStyles_unstable,\n * before being passed to renderTreeItemLayout_unstable.\n *\n * @param props - props from this instance of TreeItemLayout\n * @param ref - reference to root HTMLElement of TreeItemLayout\n */ export const useTreeItemLayout_unstable = (props, ref)=>{\n    const { iconAfter , iconBefore , expandIcon , as ='span'  } = props;\n    const layoutRef = useTreeItemContext_unstable((ctx)=>ctx.layoutRef);\n    const expandIconRef = useTreeItemContext_unstable((ctx)=>ctx.expandIconRef);\n    const isBranch = useTreeItemContext_unstable((ctx)=>ctx.itemType === 'branch');\n    return {\n        components: {\n            root: 'div',\n            expandIcon: 'div',\n            iconBefore: 'div',\n            iconAfter: 'div'\n        },\n        root: getNativeElementProps(as, {\n            ...props,\n            ref: useMergedRefs(ref, layoutRef)\n        }),\n        iconBefore: resolveShorthand(iconBefore, {\n            defaultProps: {\n                'aria-hidden': true\n            }\n        }),\n        iconAfter: resolveShorthand(iconAfter, {\n            defaultProps: {\n                'aria-hidden': true\n            }\n        }),\n        expandIcon: resolveShorthand(expandIcon, {\n            required: isBranch,\n            defaultProps: {\n                children: /*#__PURE__*/ React.createElement(TreeItemChevron, null),\n                'aria-hidden': true,\n                ref: useMergedRefs(isResolvedShorthand(expandIcon) ? expandIcon.ref : undefined, expandIconRef)\n            }\n        })\n    };\n};\n"],"names":["useTreeItemLayout_unstable","props","ref","iconAfter","iconBefore","expandIcon","as","layoutRef","useTreeItemContext_unstable","ctx","expandIconRef","isBranch","itemType","components","root","getNativeElementProps","useMergedRefs","resolveShorthand","defaultProps","required","children","React","createElement","TreeItemChevron","isResolvedShorthand","undefined"],"mappings":";;;;+BAYiBA;;aAAAA;;;6DAZM;gCACqE;iCAChD;iCACZ;AASrB,MAAMA,6BAA6B,CAACC,OAAOC,MAAM;IACxD,MAAM,EAAEC,UAAS,EAAGC,WAAU,EAAGC,WAAU,EAAGC,IAAI,OAAM,EAAG,GAAGL;IAC9D,MAAMM,YAAYC,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIF,SAAS;IAClE,MAAMG,gBAAgBF,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIC,aAAa;IAC1E,MAAMC,WAAWH,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIG,QAAQ,KAAK;IACrE,OAAO;QACHC,YAAY;YACRC,MAAM;YACNT,YAAY;YACZD,YAAY;YACZD,WAAW;QACf;QACAW,MAAMC,IAAAA,qCAAqB,EAACT,IAAI;YAC5B,GAAGL,KAAK;YACRC,KAAKc,IAAAA,6BAAa,EAACd,KAAKK;QAC5B;QACAH,YAAYa,IAAAA,gCAAgB,EAACb,YAAY;YACrCc,cAAc;gBACV,eAAe,IAAI;YACvB;QACJ;QACAf,WAAWc,IAAAA,gCAAgB,EAACd,WAAW;YACnCe,cAAc;gBACV,eAAe,IAAI;YACvB;QACJ;QACAb,YAAYY,IAAAA,gCAAgB,EAACZ,YAAY;YACrCc,UAAUR;YACVO,cAAc;gBACVE,UAAU,WAAW,GAAGC,OAAMC,aAAa,CAACC,gCAAe,EAAE,IAAI;gBACjE,eAAe,IAAI;gBACnBrB,KAAKc,IAAAA,6BAAa,EAACQ,IAAAA,mCAAmB,EAACnB,cAAcA,WAAWH,GAAG,GAAGuB,SAAS,EAAEf;YACrF;QACJ;IACJ;AACJ"}
+{"version":3,"sources":["useTreeItemLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, isResolvedShorthand, resolveShorthand, useMergedRefs } from '@fluentui/react-utilities';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\nimport { TreeItemChevron } from '../TreeItemChevron';\n/**\n * Create the state required to render TreeItemLayout.\n *\n * The returned state can be modified with hooks such as useTreeItemLayoutStyles_unstable,\n * before being passed to renderTreeItemLayout_unstable.\n *\n * @param props - props from this instance of TreeItemLayout\n * @param ref - reference to root HTMLElement of TreeItemLayout\n */ export const useTreeItemLayout_unstable = (props, ref)=>{\n    const { iconAfter , iconBefore , expandIcon , as ='span' , aside , actions  } = props;\n    const layoutRef = useTreeItemContext_unstable((ctx)=>ctx.layoutRef);\n    const expandIconRef = useTreeItemContext_unstable((ctx)=>ctx.expandIconRef);\n    const isActionsVisibleContext = useTreeItemContext_unstable((ctx)=>ctx.isActionsVisible);\n    const isAsideVisible = useTreeItemContext_unstable((ctx)=>ctx.isAsideVisible);\n    var _ref;\n    const isActionsVisible = (_ref = isResolvedShorthand(actions) ? actions.visible : undefined) !== null && _ref !== void 0 ? _ref : isActionsVisibleContext;\n    const isBranch = useTreeItemContext_unstable((ctx)=>ctx.itemType === 'branch');\n    const actionsRef = useMergedRefs(isResolvedShorthand(actions) ? actions.ref : undefined, useTreeItemContext_unstable((ctx)=>ctx.actionsRef));\n    return {\n        components: {\n            root: 'div',\n            expandIcon: 'div',\n            iconBefore: 'div',\n            iconAfter: 'div',\n            actions: 'div',\n            aside: 'div'\n        },\n        buttonContextValue: {\n            size: 'small'\n        },\n        root: getNativeElementProps(as, {\n            ...props,\n            ref: useMergedRefs(ref, layoutRef)\n        }),\n        iconBefore: resolveShorthand(iconBefore, {\n            defaultProps: {\n                'aria-hidden': true\n            }\n        }),\n        iconAfter: resolveShorthand(iconAfter, {\n            defaultProps: {\n                'aria-hidden': true\n            }\n        }),\n        aside: isAsideVisible ? resolveShorthand(aside) : undefined,\n        actions: isActionsVisible ? resolveShorthand(// visible props should not be propagated to the DOM\n        isResolvedShorthand(actions) ? {\n            ...actions,\n            visible: undefined\n        } : actions, {\n            defaultProps: {\n                ref: actionsRef\n            }\n        }) : undefined,\n        expandIcon: resolveShorthand(expandIcon, {\n            required: isBranch,\n            defaultProps: {\n                children: /*#__PURE__*/ React.createElement(TreeItemChevron, null),\n                'aria-hidden': true,\n                ref: useMergedRefs(isResolvedShorthand(expandIcon) ? expandIcon.ref : undefined, expandIconRef)\n            }\n        })\n    };\n};\n"],"names":["useTreeItemLayout_unstable","props","ref","iconAfter","iconBefore","expandIcon","as","aside","actions","layoutRef","useTreeItemContext_unstable","ctx","expandIconRef","isActionsVisibleContext","isActionsVisible","isAsideVisible","_ref","isResolvedShorthand","visible","undefined","isBranch","itemType","actionsRef","useMergedRefs","components","root","buttonContextValue","size","getNativeElementProps","resolveShorthand","defaultProps","required","children","React","createElement","TreeItemChevron"],"mappings":";;;;+BAYiBA;;aAAAA;;;6DAZM;gCACqE;iCAChD;iCACZ;AASrB,MAAMA,6BAA6B,CAACC,OAAOC,MAAM;IACxD,MAAM,EAAEC,UAAS,EAAGC,WAAU,EAAGC,WAAU,EAAGC,IAAI,OAAM,EAAGC,MAAK,EAAGC,QAAO,EAAG,GAAGP;IAChF,MAAMQ,YAAYC,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIF,SAAS;IAClE,MAAMG,gBAAgBF,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIC,aAAa;IAC1E,MAAMC,0BAA0BH,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIG,gBAAgB;IACvF,MAAMC,iBAAiBL,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAII,cAAc;IAC5E,IAAIC;IACJ,MAAMF,mBAAmB,AAACE,CAAAA,OAAOC,IAAAA,mCAAmB,EAACT,WAAWA,QAAQU,OAAO,GAAGC,SAAS,AAAD,MAAO,IAAI,IAAIH,SAAS,KAAK,IAAIA,OAAOH,uBAAuB;IACzJ,MAAMO,WAAWV,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIU,QAAQ,KAAK;IACrE,MAAMC,aAAaC,IAAAA,6BAAa,EAACN,IAAAA,mCAAmB,EAACT,WAAWA,QAAQN,GAAG,GAAGiB,SAAS,EAAET,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIW,UAAU;IAC1I,OAAO;QACHE,YAAY;YACRC,MAAM;YACNpB,YAAY;YACZD,YAAY;YACZD,WAAW;YACXK,SAAS;YACTD,OAAO;QACX;QACAmB,oBAAoB;YAChBC,MAAM;QACV;QACAF,MAAMG,IAAAA,qCAAqB,EAACtB,IAAI;YAC5B,GAAGL,KAAK;YACRC,KAAKqB,IAAAA,6BAAa,EAACrB,KAAKO;QAC5B;QACAL,YAAYyB,IAAAA,gCAAgB,EAACzB,YAAY;YACrC0B,cAAc;gBACV,eAAe,IAAI;YACvB;QACJ;QACA3B,WAAW0B,IAAAA,gCAAgB,EAAC1B,WAAW;YACnC2B,cAAc;gBACV,eAAe,IAAI;YACvB;QACJ;QACAvB,OAAOQ,iBAAiBc,IAAAA,gCAAgB,EAACtB,SAASY,SAAS;QAC3DX,SAASM,mBAAmBe,IAAAA,gCAAgB,EAC5CZ,IAAAA,mCAAmB,EAACT,WAAW;YAC3B,GAAGA,OAAO;YACVU,SAASC;QACb,IAAIX,OAAO,EAAE;YACTsB,cAAc;gBACV5B,KAAKoB;YACT;QACJ,KAAKH,SAAS;QACdd,YAAYwB,IAAAA,gCAAgB,EAACxB,YAAY;YACrC0B,UAAUX;YACVU,cAAc;gBACVE,UAAU,WAAW,GAAGC,OAAMC,aAAa,CAACC,gCAAe,EAAE,IAAI;gBACjE,eAAe,IAAI;gBACnBjC,KAAKqB,IAAAA,6BAAa,EAACN,IAAAA,mCAAmB,EAACZ,cAAcA,WAAWH,GAAG,GAAGiB,SAAS,EAAEP;YACrF;QACJ;IACJ;AACJ"}