@fluentui/react-tree 9.0.0-beta.11 → 9.0.0-beta.13

package/lib/utils/createFlatTreeItems.js

@@ -1,17 +1,19 @@
+import * as React from 'react';
 /**
  * creates a list of flat tree items
  * and provides a map to access each item by id
- */export function createFlatTreeItems(flatTreeItemProps) {
+ */
+export function createFlatTreeItems(flatTreeItemProps) {
   const root = createFlatTreeRootItem();
-  const itemsPerId = new Map([[flatTreeRootId, root]]);
+  const itemsPerValue = new Map([[root.value, root]]);
   const items = [];
   for (let index = 0; index < flatTreeItemProps.length; index++) {
     const {
-      parentId = flatTreeRootId,
+      parentValue = flatTreeRootId,
       ...treeItemProps
     } = flatTreeItemProps[index];
     const nextItemProps = flatTreeItemProps[index + 1];
-    const currentParent = itemsPerId.get(parentId);
+    const currentParent = itemsPerValue.get(parentValue);
     if (!currentParent) {
       if (process.env.NODE_ENV === 'development') {
         // eslint-disable-next-line no-console
@@ -19,50 +21,60 @@
       }
       break;
     }
-    const isLeaf = (nextItemProps === null || nextItemProps === void 0 ? void 0 : nextItemProps.parentId) !== treeItemProps.id;
+    var _treeItemProps_itemType;
+    const itemType = (_treeItemProps_itemType = treeItemProps.itemType) !== null && _treeItemProps_itemType !== void 0 ? _treeItemProps_itemType : treeItemProps.value === undefined || (nextItemProps === null || nextItemProps === void 0 ? void 0 : nextItemProps.parentValue) !== treeItemProps.value ? 'leaf' : 'branch';
     var _currentParent_level;
     const currentLevel = ((_currentParent_level = currentParent.level) !== null && _currentParent_level !== void 0 ? _currentParent_level : 0) + 1;
     const currentChildrenSize = ++currentParent.childrenSize;
+    const ref = /*#__PURE__*/React.createRef();
     const flatTreeItem = {
-      id: treeItemProps.id,
+      value: treeItemProps.value,
       getTreeItemProps: () => ({
         ...treeItemProps,
         'aria-level': currentLevel,
         'aria-posinset': currentChildrenSize,
         'aria-setsize': currentParent.childrenSize,
-        leaf: isLeaf
+        itemType,
+        // a reference to every parent element is necessary to ensure navigation
+        ref: flatTreeItem.childrenSize > 0 ? ref : undefined
       }),
+      ref,
       level: currentLevel,
-      parentId,
+      parentValue,
       childrenSize: 0,
       index: -1
     };
-    itemsPerId.set(flatTreeItem.id, flatTreeItem);
+    itemsPerValue.set(flatTreeItem.value, flatTreeItem);
     items.push(flatTreeItem);
   }
-  return {
+  const flatTreeItems = {
     root,
     size: items.length,
     getByIndex: index => items[index],
-    get: id => itemsPerId.get(id),
-    set: (id, value) => itemsPerId.set(id, value)
+    get: key => itemsPerValue.get(key),
+    set: (key, value) => itemsPerValue.set(key, value)
   };
+  return flatTreeItems;
 }
 export const flatTreeRootId = '__fuiFlatTreeRoot';
 function createFlatTreeRootItem() {
   return {
-    id: flatTreeRootId,
+    ref: {
+      current: null
+    },
+    value: flatTreeRootId,
+    parentValue: undefined,
     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,
         'aria-posinset': -1,
-        leaf: true
+        itemType: 'branch'
       };
     },
     childrenSize: 0,
@@ -80,13 +92,12 @@ function createFlatTreeRootItem() {
 export function* VisibleFlatTreeItemGenerator(openItems, flatTreeItems) {
   for (let index = 0, visibleIndex = 0; index < flatTreeItems.size; index++) {
     const item = flatTreeItems.getByIndex(index);
-    var _flatTreeItems_get;
-    const parent = item.parentId ? (_flatTreeItems_get = flatTreeItems.get(item.parentId)) !== null && _flatTreeItems_get !== void 0 ? _flatTreeItems_get : flatTreeItems.root : flatTreeItems.root;
     if (isItemVisible(item, openItems, flatTreeItems)) {
       item.index = visibleIndex++;
       yield item;
     } else {
-      index += parent.childrenSize - 1 + item.childrenSize;
+      // Jump the amount of children the current item has, since those items will also be hidden
+      index += item.childrenSize;
     }
   }
 }
@@ -94,11 +105,11 @@ function isItemVisible(item, openItems, flatTreeItems) {
   if (item.level === 1) {
     return true;
   }
-  while (item.parentId && item.parentId !== flatTreeItems.root.id) {
-    if (!openItems.has(item.parentId)) {
+  while (item.parentValue && item.parentValue !== flatTreeItems.root.value) {
+    if (!openItems.has(item.parentValue)) {
       return false;
     }
-    const parent = flatTreeItems.get(item.parentId);
+    const parent = flatTreeItems.get(item.parentValue);
     if (!parent) {
       return false;
     }

package/lib/utils/createFlatTreeItems.js.map

@@ -1 +1 @@
-{"version":3,"names":["createFlatTreeItems","flatTreeItemProps","root","createFlatTreeRootItem","itemsPerId","Map","flatTreeRootId","items","index","length","parentId","treeItemProps","nextItemProps","currentParent","get","process","env","NODE_ENV","console","error","id","isLeaf","_currentParent_level","currentLevel","level","currentChildrenSize","childrenSize","flatTreeItem","getTreeItemProps","leaf","set","push","size","getByIndex","value","VisibleFlatTreeItemGenerator","openItems","flatTreeItems","visibleIndex","item","_flatTreeItems_get","parent","isItemVisible","has"],"sources":["../../src/utils/createFlatTreeItems.ts"],"sourcesContent":["import type { TreeItemId } from '../TreeItem';\nimport type { ImmutableSet } from './ImmutableSet';\nimport type { FlatTreeItem, FlatTreeItemProps, MutableFlatTreeItem } from '../hooks/useFlatTree';\n\n/**\n * @internal\n */\nexport type FlatTreeItems = {\n  size: number;\n  root: FlatTreeItem;\n  get(id: string): FlatTreeItem | undefined;\n  set(id: string, value: FlatTreeItem): void;\n  getByIndex(index: number): FlatTreeItem;\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(flatTreeItemProps: FlatTreeItemProps[]): FlatTreeItems {\n  const root = createFlatTreeRootItem();\n  const itemsPerId = new Map<string, MutableFlatTreeItem>([[flatTreeRootId, root]]);\n  const items: MutableFlatTreeItem[] = [];\n\n  for (let index = 0; index < flatTreeItemProps.length; index++) {\n    const { parentId = flatTreeRootId, ...treeItemProps } = flatTreeItemProps[index];\n\n    const nextItemProps: FlatTreeItemProps | undefined = flatTreeItemProps[index + 1];\n    const currentParent = itemsPerId.get(parentId);\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 isLeaf = nextItemProps?.parentId !== treeItemProps.id;\n    const currentLevel = (currentParent.level ?? 0) + 1;\n    const currentChildrenSize = ++currentParent.childrenSize;\n\n    const flatTreeItem: FlatTreeItem = {\n      id: treeItemProps.id,\n      getTreeItemProps: () => ({\n        ...treeItemProps,\n        'aria-level': currentLevel,\n        'aria-posinset': currentChildrenSize,\n        'aria-setsize': currentParent.childrenSize,\n        leaf: isLeaf,\n      }),\n      level: currentLevel,\n      parentId,\n      childrenSize: 0,\n      index: -1,\n    };\n    itemsPerId.set(flatTreeItem.id, flatTreeItem);\n    items.push(flatTreeItem);\n  }\n\n  return {\n    root,\n    size: items.length,\n    getByIndex: index => items[index],\n    get: id => itemsPerId.get(id),\n    set: (id, value) => itemsPerId.set(id, value),\n  };\n}\n\nexport const flatTreeRootId = '__fuiFlatTreeRoot';\n\nfunction createFlatTreeRootItem(): FlatTreeItem {\n  return {\n    id: 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 { id: flatTreeRootId, 'aria-setsize': -1, 'aria-level': -1, 'aria-posinset': -1, leaf: true };\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(openItems: ImmutableSet<TreeItemId>, flatTreeItems: FlatTreeItems) {\n  for (let index = 0, visibleIndex = 0; index < flatTreeItems.size; index++) {\n    const item: MutableFlatTreeItem = flatTreeItems.getByIndex(index);\n    const parent = item.parentId ? flatTreeItems.get(item.parentId) ?? flatTreeItems.root : flatTreeItems.root;\n    if (isItemVisible(item, openItems, flatTreeItems)) {\n      item.index = visibleIndex++;\n      yield item;\n    } else {\n      index += parent.childrenSize - 1 + item.childrenSize;\n    }\n  }\n}\n\nfunction isItemVisible(item: FlatTreeItem, openItems: ImmutableSet<TreeItemId>, flatTreeItems: FlatTreeItems) {\n  if (item.level === 1) {\n    return true;\n  }\n  while (item.parentId && item.parentId !== flatTreeItems.root.id) {\n    if (!openItems.has(item.parentId)) {\n      return false;\n    }\n    const parent = flatTreeItems.get(item.parentId);\n    if (!parent) {\n      return false;\n    }\n    item = parent;\n  }\n  return true;\n}\n"],"mappings":"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"}
+{"version":3,"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","_treeItemProps_itemType","itemType","undefined","_currentParent_level","currentLevel","level","currentChildrenSize","childrenSize","ref","createRef","flatTreeItem","getTreeItemProps","set","push","flatTreeItems","size","getByIndex","key","current","VisibleFlatTreeItemGenerator","openItems","visibleIndex","item","isItemVisible","has","parent"],"sources":["../../src/utils/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"],"mappings":"AAEA,YAAYA,KAAA,MAAW;AAavB;;;;AAIA,OAAO,SAASC,oBACdC,iBAA0B,EACJ;EACtB,MAAMC,IAAA,GAAOC,sBAAA;EACb,MAAMC,aAAA,GAAgB,IAAIC,GAAA,CAAuD,CAAC,CAACH,IAAA,CAAKI,KAAK,EAAEJ,IAAA,CAAK,CAAC;EACrG,MAAMK,KAAA,GAAoD,EAAE;EAE5D,KAAK,IAAIC,KAAA,GAAQ,GAAGA,KAAA,GAAQP,iBAAA,CAAkBQ,MAAM,EAAED,KAAA,IAAS;IAC7D,MAAM;MAAEE,WAAA,GAAcC,cAAA;MAAgB,GAAGC;IAAA,CAAe,GAAGX,iBAAiB,CAACO,KAAA,CAAM;IAEnF,MAAMK,aAAA,GAAmCZ,iBAAiB,CAACO,KAAA,GAAQ,EAAE;IACrE,MAAMM,aAAA,GAAgBV,aAAA,CAAcW,GAAG,CAACL,WAAA;IACxC,IAAI,CAACI,aAAA,EAAe;MAClB,IAAIE,OAAA,CAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1C;QACAC,OAAA,CAAQC,KAAK,CACV,qBAAoBnB,iBAAiB,CAACO,KAAA,CAAM,CAACa,EAAG,8GAA6G;MAElK;MACA;IACF;QAEEC,uBAAA;IADF,MAAMC,QAAA,GACJ,CAAAD,uBAAA,GAAAV,aAAA,CAAcW,QAAQ,cAAtBD,uBAAA,cAAAA,uBAAA,GACCV,aAAA,CAAcN,KAAK,KAAKkB,SAAA,IAAa,CAAAX,aAAA,aAAAA,aAAA,uBAAAA,aAAA,CAAeH,WAAW,MAAKE,aAAA,CAAcN,KAAK,GAAG,SAAS,QAAQ;QACxFmB,oBAAA;IAAtB,MAAMC,YAAA,GAAe,CAAC,CAAAD,oBAAA,GAAAX,aAAA,CAAca,KAAK,cAAnBF,oBAAA,cAAAA,oBAAA,GAAuB,CAAC,IAAI;IAClD,MAAMG,mBAAA,GAAsB,EAAEd,aAAA,CAAce,YAAY;IACxD,MAAMC,GAAA,gBAAM/B,KAAA,CAAMgC,SAAS;IAE3B,MAAMC,YAAA,GAAyD;MAC7D1B,KAAA,EAAOM,aAAA,CAAcN,KAAK;MAC1B2B,gBAAA,EAAkBA,CAAA,MAAO;QACvB,GAAGrB,aAAa;QAChB,cAAcc,YAAA;QACd,iBAAiBE,mBAAA;QACjB,gBAAgBd,aAAA,CAAce,YAAY;QAC1CN,QAAA;QACA;QACAO,GAAA,EAAKE,YAAA,CAAaH,YAAY,GAAG,IAAIC,GAAA,GAAMN;MAC7C;MACAM,GAAA;MACAH,KAAA,EAAOD,YAAA;MACPhB,WAAA;MACAmB,YAAA,EAAc;MACdrB,KAAA,EAAO,CAAC;IACV;IACAJ,aAAA,CAAc8B,GAAG,CAACF,YAAA,CAAa1B,KAAK,EAAE0B,YAAA;IACtCzB,KAAA,CAAM4B,IAAI,CAACH,YAAA;EACb;EAEA,MAAMI,aAAA,GAA2D;IAC/DlC,IAAA;IACAmC,IAAA,EAAM9B,KAAA,CAAME,MAAM;IAClB6B,UAAA,EAAY9B,KAAA,IAASD,KAAK,CAACC,KAAA,CAAM;IACjCO,GAAA,EAAKwB,GAAA,IAAOnC,aAAA,CAAcW,GAAG,CAACwB,GAAA;IAC9BL,GAAA,EAAKA,CAACK,GAAA,EAAKjC,KAAA,KAAUF,aAAA,CAAc8B,GAAG,CAACK,GAAA,EAAKjC,KAAA;EAC9C;EAEA,OAAO8B,aAAA;AACT;AAEA,OAAO,MAAMzB,cAAA,GAAiB;AAE9B,SAASR,uBAAA,EAAuC;EAC9C,OAAO;IACL2B,GAAA,EAAK;MAAEU,OAAA,EAAS;IAAK;IACrBlC,KAAA,EAAOK,cAAA;IACPD,WAAA,EAAac,SAAA;IACbS,gBAAA,EAAkBA,CAAA,KAAM;MACtB,IAAIjB,OAAA,CAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzC;QACAC,OAAA,CAAQC,KAAK,CAAC;MAChB;MACA,OAAO;QAAEd,KAAA,EAAOK,cAAA;QAAgB,gBAAgB,CAAC;QAAG,cAAc,CAAC;QAAG,iBAAiB,CAAC;QAAGY,QAAA,EAAU;MAAS;IAChH;IACAM,YAAA,EAAc;IACd,IAAIrB,MAAA,EAAQ;MACV,IAAIQ,OAAA,CAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzC;QACAC,OAAA,CAAQC,KAAK,CAAC;MAChB;MACA,OAAO,CAAC;IACV;IACAO,KAAA,EAAO;EACT;AACF;AAEA;AACA,OAAO,UAAUc,6BACfC,SAAgC,EAChCN,aAAmC,EACnC;EACA,KAAK,IAAI5B,KAAA,GAAQ,GAAGmC,YAAA,GAAe,GAAGnC,KAAA,GAAQ4B,aAAA,CAAcC,IAAI,EAAE7B,KAAA,IAAS;IACzE,MAAMoC,IAAA,GAAOR,aAAA,CAAcE,UAAU,CAAC9B,KAAA;IACtC,IAAIqC,aAAA,CAAcD,IAAA,EAAMF,SAAA,EAAWN,aAAA,GAAgB;MACjDQ,IAAA,CAAKpC,KAAK,GAAGmC,YAAA;MACb,MAAMC,IAAA;IACR,OAAO;MACL;MACApC,KAAA,IAASoC,IAAA,CAAKf,YAAY;IAC5B;EACF;AACF;AAEA,SAASgB,cACPD,IAA8C,EAC9CF,SAAgC,EAChCN,aAAwD,EACxD;EACA,IAAIQ,IAAA,CAAKjB,KAAK,KAAK,GAAG;IACpB,OAAO,IAAI;EACb;EACA,OAAOiB,IAAA,CAAKlC,WAAW,IAAIkC,IAAA,CAAKlC,WAAW,KAAK0B,aAAA,CAAclC,IAAI,CAACI,KAAK,EAAE;IACxE,IAAI,CAACoC,SAAA,CAAUI,GAAG,CAACF,IAAA,CAAKlC,WAAW,GAAG;MACpC,OAAO,KAAK;IACd;IACA,MAAMqC,MAAA,GAASX,aAAA,CAAcrB,GAAG,CAAC6B,IAAA,CAAKlC,WAAW;IACjD,IAAI,CAACqC,MAAA,EAAQ;MACX,OAAO,KAAK;IACd;IACAH,IAAA,GAAOG,MAAA;EACT;EACA,OAAO,IAAI;AACb"}

package/lib/utils/flattenTree.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 let count = 1;
 function flattenTreeRecursive(items, parent, level = 1) {
   return items.reduce((acc, {
@@ -6,13 +5,14 @@ function flattenTreeRecursive(items, parent, level = 1) {
     ...item
   }, index) => {
     var _item_id;
+    const id = (_item_id = item.id) !== null && _item_id !== void 0 ? _item_id : `fui-FlatTreeItem-${count++}`;
+    var _item_value;
     const flatTreeItem = {
       'aria-level': level,
       'aria-posinset': index + 1,
       'aria-setsize': items.length,
-      parentId: parent === null || parent === void 0 ? void 0 : parent.id,
-      id: (_item_id = item.id) !== null && _item_id !== void 0 ? _item_id : `fui-FlatTreeItem-${count++}`,
-      leaf: subtree === undefined,
+      parentValue: parent === null || parent === void 0 ? void 0 : parent.value,
+      value: (_item_value = item.value) !== null && _item_value !== void 0 ? _item_value : id,
       ...item
     };
     acc.push(flatTreeItem);
@@ -63,29 +63,4 @@ function flattenTreeRecursive(items, parent, level = 1) {
  * ```
  */ // eslint-disable-next-line @typescript-eslint/naming-convention
 export const flattenTree_unstable = items => flattenTreeRecursive(items);
-/**
- * @internal
- */
-export const flattenTreeFromElement = (root, parent, level = 1) => {
-  const children = React.Children.toArray(root.props.children);
-  return children.reduce((acc, curr, index) => {
-    const [content, subtree] = React.Children.toArray(curr.props.children);
-    var _curr_props_id;
-    const flatTreeItem = {
-      'aria-level': level,
-      'aria-posinset': index + 1,
-      'aria-setsize': children.length,
-      parentId: parent === null || parent === void 0 ? void 0 : parent.id,
-      id: (_curr_props_id = curr.props.id) !== null && _curr_props_id !== void 0 ? _curr_props_id : `fui-FlatTreeItem-${count++}`,
-      leaf: subtree === undefined,
-      ...curr.props,
-      children: content
-    };
-    acc.push(flatTreeItem);
-    if (subtree !== undefined) {
-      acc.push(...flattenTreeFromElement(subtree, flatTreeItem, level + 1));
-    }
-    return acc;
-  }, []);
-};
 //# sourceMappingURL=flattenTree.js.map

package/lib/utils/flattenTree.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","count","flattenTreeRecursive","items","parent","level","reduce","acc","subtree","item","index","_item_id","flatTreeItem","length","parentId","id","leaf","undefined","push","flattenTree_unstable","flattenTreeFromElement","root","children","Children","toArray","props","curr","content","_curr_props_id"],"sources":["../../src/utils/flattenTree.ts"],"sourcesContent":["import * as React from 'react';\nimport { FlatTreeItemProps } from '../hooks/useFlatTree';\nimport { TreeItemProps } from '../TreeItem';\n\nexport type NestedTreeItem = Omit<TreeItemProps, 'subtree'> & {\n  subtree?: NestedTreeItem[];\n};\n\nlet count = 1;\nfunction flattenTreeRecursive(items: NestedTreeItem[], parent?: FlatTreeItemProps, level = 1): FlatTreeItemProps[] {\n  return items.reduce<FlatTreeItemProps[]>((acc, { subtree, ...item }, index) => {\n    const flatTreeItem: FlatTreeItemProps = {\n      'aria-level': level,\n      'aria-posinset': index + 1,\n      'aria-setsize': items.length,\n      parentId: parent?.id,\n      id: item.id ?? `fui-FlatTreeItem-${count++}`,\n      leaf: subtree === undefined,\n      ...item,\n    };\n    acc.push(flatTreeItem);\n    if (subtree !== undefined) {\n      acc.push(...flattenTreeRecursive(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 = (items: NestedTreeItem[]): FlatTreeItemProps[] => flattenTreeRecursive(items);\n\n/**\n * @internal\n */\nexport const flattenTreeFromElement = (\n  root: React.ReactElement<{\n    children?: React.ReactElement<TreeItemProps> | React.ReactElement<TreeItemProps>[];\n  }>,\n  parent?: FlatTreeItemProps,\n  level = 1,\n): FlatTreeItemProps[] => {\n  const children = React.Children.toArray(root.props.children) as React.ReactElement<TreeItemProps>[];\n  return children.reduce<FlatTreeItemProps[]>((acc, curr, index) => {\n    const [content, subtree] = React.Children.toArray(curr.props.children) as [\n      React.ReactNode,\n      typeof root | undefined,\n    ];\n    const flatTreeItem: FlatTreeItemProps = {\n      'aria-level': level,\n      'aria-posinset': index + 1,\n      'aria-setsize': children.length,\n      parentId: parent?.id,\n      id: curr.props.id ?? `fui-FlatTreeItem-${count++}`,\n      leaf: subtree === undefined,\n      ...curr.props,\n      children: content,\n    };\n    acc.push(flatTreeItem);\n    if (subtree !== undefined) {\n      acc.push(...flattenTreeFromElement(subtree, flatTreeItem, level + 1));\n    }\n    return acc;\n  }, []);\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AAQvB,IAAIC,KAAA,GAAQ;AACZ,SAASC,qBAAqBC,KAAuB,EAAEC,MAA0B,EAAEC,KAAA,GAAQ,CAAC,EAAuB;EACjH,OAAOF,KAAA,CAAMG,MAAM,CAAsB,CAACC,GAAA,EAAK;IAAEC,OAAA;IAAS,GAAGC;EAAA,CAAM,EAAEC,KAAA,KAAU;QAMvEC,QAAA;IALN,MAAMC,YAAA,GAAkC;MACtC,cAAcP,KAAA;MACd,iBAAiBK,KAAA,GAAQ;MACzB,gBAAgBP,KAAA,CAAMU,MAAM;MAC5BC,QAAA,EAAUV,MAAA,aAAAA,MAAA,uBAAAA,MAAA,CAAQW,EAAE;MACpBA,EAAA,EAAI,CAAAJ,QAAA,GAAAF,IAAA,CAAKM,EAAE,cAAPJ,QAAA,cAAAA,QAAA,GAAY,oBAAmBV,KAAA,EAAQ,EAAC;MAC5Ce,IAAA,EAAMR,OAAA,KAAYS,SAAA;MAClB,GAAGR;IACL;IACAF,GAAA,CAAIW,IAAI,CAACN,YAAA;IACT,IAAIJ,OAAA,KAAYS,SAAA,EAAW;MACzBV,GAAA,CAAIW,IAAI,IAAIhB,oBAAA,CAAqBM,OAAA,EAASI,YAAA,EAAcP,KAAA,GAAQ;IAClE;IACA,OAAOE,GAAA;EACT,GAAG,EAAE;AACP;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAAA,CAwCA;AACA,OAAO,MAAMY,oBAAA,GAAwBhB,KAAA,IAAiDD,oBAAA,CAAqBC,KAAA;AAE3G;;;AAGA,OAAO,MAAMiB,sBAAA,GAAyBA,CACpCC,IAAA,EAGAjB,MAAA,EACAC,KAAA,GAAQ,CAAC,KACe;EACxB,MAAMiB,QAAA,GAAWtB,KAAA,CAAMuB,QAAQ,CAACC,OAAO,CAACH,IAAA,CAAKI,KAAK,CAACH,QAAQ;EAC3D,OAAOA,QAAA,CAAShB,MAAM,CAAsB,CAACC,GAAA,EAAKmB,IAAA,EAAMhB,KAAA,KAAU;IAChE,MAAM,CAACiB,OAAA,EAASnB,OAAA,CAAQ,GAAGR,KAAA,CAAMuB,QAAQ,CAACC,OAAO,CAACE,IAAA,CAAKD,KAAK,CAACH,QAAQ;QAS/DM,cAAA;IALN,MAAMhB,YAAA,GAAkC;MACtC,cAAcP,KAAA;MACd,iBAAiBK,KAAA,GAAQ;MACzB,gBAAgBY,QAAA,CAAST,MAAM;MAC/BC,QAAA,EAAUV,MAAA,aAAAA,MAAA,uBAAAA,MAAA,CAAQW,EAAE;MACpBA,EAAA,EAAI,CAAAa,cAAA,GAAAF,IAAA,CAAKD,KAAK,CAACV,EAAE,cAAba,cAAA,cAAAA,cAAA,GAAkB,oBAAmB3B,KAAA,EAAQ,EAAC;MAClDe,IAAA,EAAMR,OAAA,KAAYS,SAAA;MAClB,GAAGS,IAAA,CAAKD,KAAK;MACbH,QAAA,EAAUK;IACZ;IACApB,GAAA,CAAIW,IAAI,CAACN,YAAA;IACT,IAAIJ,OAAA,KAAYS,SAAA,EAAW;MACzBV,GAAA,CAAIW,IAAI,IAAIE,sBAAA,CAAuBZ,OAAA,EAASI,YAAA,EAAcP,KAAA,GAAQ;IACpE;IACA,OAAOE,GAAA;EACT,GAAG,EAAE;AACP"}
+{"version":3,"names":["count","flattenTreeRecursive","items","parent","level","reduce","acc","subtree","item","index","_item_id","id","_item_value","flatTreeItem","length","parentValue","value","push","undefined","flattenTree_unstable"],"sources":["../../src/utils/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"],"mappings":"AAUA,IAAIA,KAAA,GAAQ;AACZ,SAASC,qBACPC,KAA8B,EAC9BC,MAAkD,EAClDC,KAAA,GAAQ,CAAC,EACmB;EAC5B,OAAOF,KAAA,CAAMG,MAAM,CAA6B,CAACC,GAAA,EAAK;IAAEC,OAAA;IAAS,GAAGC;EAAA,CAAM,EAAEC,KAAA,KAAU;QACzEC,QAAA;IAAX,MAAMC,EAAA,GAAK,CAAAD,QAAA,GAAAF,IAAA,CAAKG,EAAE,cAAPD,QAAA,cAAAA,QAAA,GAAY,oBAAmBV,KAAA,EAAQ,EAAC;QAM1CY,WAAA;IALT,MAAMC,YAAA,GAAe;MACnB,cAAcT,KAAA;MACd,iBAAiBK,KAAA,GAAQ;MACzB,gBAAgBP,KAAA,CAAMY,MAAM;MAC5BC,WAAA,EAAaZ,MAAA,aAAAA,MAAA,uBAAAA,MAAA,CAAQa,KAAK;MAC1BA,KAAA,EAAO,CAAAJ,WAAA,GAAAJ,IAAA,CAAKQ,KAAK,cAAVJ,WAAA,cAAAA,WAAA,GAAeD,EAAgC;MACtD,GAAGH;IACL;IACAF,GAAA,CAAIW,IAAI,CAACJ,YAAA;IACT,IAAIN,OAAA,KAAYW,SAAA,EAAW;MACzBZ,GAAA,CAAIW,IAAI,IAAIhB,oBAAA,CAA4BM,OAAA,EAASM,YAAA,EAAcT,KAAA,GAAQ;IACzE;IACA,OAAOE,GAAA;EACT,GAAG,EAAE;AACP;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAAA,CAwCA;AACA,OAAO,MAAMa,oBAAA,GACXjB,KAAA,IAC+BD,oBAAA,CAAqBC,KAAA"}

package/lib/utils/tokens.js

@@ -1,19 +1,19 @@
-import { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, End, Home } from '@fluentui/keyboard-keys';
+import { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, End, Home, Enter } from '@fluentui/keyboard-keys';
 export const treeItemLevelToken = '--fluent-TreeItem--level';
 export const treeAvatarSize = {
   medium: 32,
   small: 24
 };
 export const treeDataTypes = {
-  arrowLeft: ArrowLeft,
-  arrowRight: ArrowRight,
-  enter: 'Enter',
-  click: 'Click',
-  expandIconClick: 'ExpandIconClick',
-  end: End,
-  home: Home,
-  arrowUp: ArrowUp,
-  arrowDown: ArrowDown,
-  typeAhead: 'TypeAhead'
+  ArrowLeft,
+  ArrowRight,
+  Enter,
+  Click: 'Click',
+  ExpandIconClick: 'ExpandIconClick',
+  End,
+  Home,
+  ArrowUp,
+  ArrowDown,
+  TypeAhead: 'TypeAhead'
 };
 //# sourceMappingURL=tokens.js.map

package/lib/utils/tokens.js.map

@@ -1 +1 @@
-{"version":3,"names":["ArrowDown","ArrowLeft","ArrowRight","ArrowUp","End","Home","treeItemLevelToken","treeAvatarSize","medium","small","treeDataTypes","arrowLeft","arrowRight","enter","click","expandIconClick","end","home","arrowUp","arrowDown","typeAhead"],"sources":["../../src/utils/tokens.ts"],"sourcesContent":["import { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, End, Home } from '@fluentui/keyboard-keys';\nimport { TreeNavigationData_unstable, TreeOpenChangeData } from '../Tree';\n\nexport const treeItemLevelToken = '--fluent-TreeItem--level' as const;\n\nexport const treeAvatarSize = {\n  medium: 32,\n  small: 24,\n} as const;\n\nexport const treeDataTypes: {\n  readonly [K in Uncapitalize<TreeOpenChangeData['type'] | TreeNavigationData_unstable['type']>]: Capitalize<K>;\n} = {\n  arrowLeft: ArrowLeft,\n  arrowRight: ArrowRight,\n  enter: 'Enter',\n  click: 'Click',\n  expandIconClick: 'ExpandIconClick',\n  end: End,\n  home: Home,\n  arrowUp: ArrowUp,\n  arrowDown: ArrowDown,\n  typeAhead: 'TypeAhead',\n};\n"],"mappings":"AAAA,SAASA,SAAS,EAAEC,SAAS,EAAEC,UAAU,EAAEC,OAAO,EAAEC,GAAG,EAAEC,IAAI,QAAQ;AAGrE,OAAO,MAAMC,kBAAA,GAAqB;AAElC,OAAO,MAAMC,cAAA,GAAiB;EAC5BC,MAAA,EAAQ;EACRC,KAAA,EAAO;AACT;AAEA,OAAO,MAAMC,aAAA,GAET;EACFC,SAAA,EAAWV,SAAA;EACXW,UAAA,EAAYV,UAAA;EACZW,KAAA,EAAO;EACPC,KAAA,EAAO;EACPC,eAAA,EAAiB;EACjBC,GAAA,EAAKZ,GAAA;EACLa,IAAA,EAAMZ,IAAA;EACNa,OAAA,EAASf,OAAA;EACTgB,SAAA,EAAWnB,SAAA;EACXoB,SAAA,EAAW;AACb"}
+{"version":3,"names":["ArrowDown","ArrowLeft","ArrowRight","ArrowUp","End","Home","Enter","treeItemLevelToken","treeAvatarSize","medium","small","treeDataTypes","Click","ExpandIconClick","TypeAhead"],"sources":["../../src/utils/tokens.ts"],"sourcesContent":["import { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, End, Home, Enter } from '@fluentui/keyboard-keys';\nimport { TreeNavigationData_unstable, TreeOpenChangeData } from '../Tree';\n\nexport const treeItemLevelToken = '--fluent-TreeItem--level' as const;\n\nexport const treeAvatarSize = {\n  medium: 32,\n  small: 24,\n} as const;\n\nexport const treeDataTypes: {\n  readonly [K in TreeOpenChangeData['type'] | TreeNavigationData_unstable['type']]: K;\n} = {\n  ArrowLeft,\n  ArrowRight,\n  Enter,\n  Click: 'Click',\n  ExpandIconClick: 'ExpandIconClick',\n  End,\n  Home,\n  ArrowUp,\n  ArrowDown,\n  TypeAhead: 'TypeAhead',\n};\n"],"mappings":"AAAA,SAASA,SAAS,EAAEC,SAAS,EAAEC,UAAU,EAAEC,OAAO,EAAEC,GAAG,EAAEC,IAAI,EAAEC,KAAK,QAAQ;AAG5E,OAAO,MAAMC,kBAAA,GAAqB;AAElC,OAAO,MAAMC,cAAA,GAAiB;EAC5BC,MAAA,EAAQ;EACRC,KAAA,EAAO;AACT;AAEA,OAAO,MAAMC,aAAA,GAET;EACFV,SAAA;EACAC,UAAA;EACAI,KAAA;EACAM,KAAA,EAAO;EACPC,eAAA,EAAiB;EACjBT,GAAA;EACAC,IAAA;EACAF,OAAA;EACAH,SAAA;EACAc,SAAA,EAAW;AACb"}

package/lib-commonjs/TreeItemAside.js

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

package/lib-commonjs/TreeItemAside.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../lib/TreeItemAside.js"],"sourcesContent":["export * from './components/TreeItemAside/index';\n//# sourceMappingURL=TreeItemAside.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,yCAAyC"}

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

@@ -10,11 +10,11 @@ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildc
 const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
 const _useTree = require("./useTree");
 const _renderTree = require("./renderTree");
-const _useTreeStyles = require("./useTreeStyles");
+const _useTreeStylesStyles = require("./useTreeStyles.styles");
 const _useTreeContextValues = require("./useTreeContextValues");
 const Tree = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
     const state = (0, _useTree.useTree_unstable)(props, ref);
-    (0, _useTreeStyles.useTreeStyles_unstable)(state);
+    (0, _useTreeStylesStyles.useTreeStyles_unstable)(state);
     const contextValues = (0, _useTreeContextValues.useTreeContextValues_unstable)(state);
     return (0, _renderTree.renderTree_unstable)(state, contextValues);
 });

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/Tree/Tree.js"],"sourcesContent":["import * as React from 'react';\nimport { useTree_unstable } from './useTree';\nimport { renderTree_unstable } from './renderTree';\nimport { useTreeStyles_unstable } from './useTreeStyles';\nimport { useTreeContextValues_unstable } from './useTreeContextValues';\n/**\n * A tree view widget presents a hierarchical list.\n * Any item in the hierarchy may have child items,\n * and items that have children may be expanded or collapsed to show or hide the children.\n * For example, in a file system navigator that uses a tree view to display folders and files,\n * an item representing a folder can be expanded to reveal the contents of the folder,\n * which may be files, folders, or both.\n */\nexport const Tree = /*#__PURE__*/React.forwardRef((props, ref) => {\n  const state = useTree_unstable(props, ref);\n  useTreeStyles_unstable(state);\n  const contextValues = useTreeContextValues_unstable(state);\n  return renderTree_unstable(state, contextValues);\n});\nTree.displayName = 'Tree';\n//# sourceMappingURL=Tree.js.map"],"names":["Tree","React","forwardRef","props","ref","state","useTree_unstable","useTreeStyles_unstable","contextValues","useTreeContextValues_unstable","renderTree_unstable","displayName"],"mappings":";;;;+BAaaA;;aAAAA;;;6DAbU;yBACU;4BACG;+BACG;sCACO;AASvC,MAAMA,OAAO,WAAW,GAAEC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAQ;IAChE,MAAMC,QAAQC,IAAAA,yBAAgB,EAACH,OAAOC;IACtCG,IAAAA,qCAAsB,EAACF;IACvB,MAAMG,gBAAgBC,IAAAA,mDAA6B,EAACJ;IACpD,OAAOK,IAAAA,+BAAmB,EAACL,OAAOG;AACpC;AACAR,KAAKW,WAAW,GAAG,QACnB,gCAAgC"}
+{"version":3,"sources":["../../../lib/components/Tree/Tree.js"],"sourcesContent":["import * as React from 'react';\nimport { useTree_unstable } from './useTree';\nimport { renderTree_unstable } from './renderTree';\nimport { useTreeStyles_unstable } from './useTreeStyles.styles';\nimport { useTreeContextValues_unstable } from './useTreeContextValues';\n/**\n * A tree view widget presents a hierarchical list.\n * Any item in the hierarchy may have child items,\n * and items that have children may be expanded or collapsed to show or hide the children.\n * For example, in a file system navigator that uses a tree view to display folders and files,\n * an item representing a folder can be expanded to reveal the contents of the folder,\n * which may be files, folders, or both.\n */\nexport const Tree = /*#__PURE__*/React.forwardRef((props, ref) => {\n  const state = useTree_unstable(props, ref);\n  useTreeStyles_unstable(state);\n  const contextValues = useTreeContextValues_unstable(state);\n  return renderTree_unstable(state, contextValues);\n});\nTree.displayName = 'Tree';\n//# sourceMappingURL=Tree.js.map"],"names":["Tree","React","forwardRef","props","ref","state","useTree_unstable","useTreeStyles_unstable","contextValues","useTreeContextValues_unstable","renderTree_unstable","displayName"],"mappings":";;;;+BAaaA;;aAAAA;;;6DAbU;yBACU;4BACG;qCACG;sCACO;AASvC,MAAMA,OAAO,WAAW,GAAEC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAQ;IAChE,MAAMC,QAAQC,IAAAA,yBAAgB,EAACH,OAAOC;IACtCG,IAAAA,2CAAsB,EAACF;IACvB,MAAMG,gBAAgBC,IAAAA,mDAA6B,EAACJ;IACpD,OAAOK,IAAAA,+BAAmB,EAACL,OAAOG;AACpC;AACAR,KAAKW,WAAW,GAAG,QACnB,gCAAgC"}

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

@@ -7,7 +7,7 @@ _exportStar(require("./Tree"), exports);
 _exportStar(require("./Tree.types"), exports);
 _exportStar(require("./renderTree"), exports);
 _exportStar(require("./useTree"), exports);
-_exportStar(require("./useTreeStyles"), exports);
+_exportStar(require("./useTreeStyles.styles"), exports);
 _exportStar(require("./useTreeContextValues"), exports);
  //# sourceMappingURL=index.js.map
 

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

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

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

@@ -13,7 +13,7 @@ const renderTree_unstable = (state, contextValues)=>{
     const { slots , slotProps  } = (0, _reactUtilities.getSlotsNext)(state);
     return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_contexts.TreeProvider, {
         value: contextValues.tree
-    }, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root, slotProps.root.children));
+    }, state.open && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root, slotProps.root.children));
 }; //# sourceMappingURL=renderTree.js.map
 
 //# sourceMappingURL=renderTree.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/Tree/renderTree.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { TreeProvider } from '../../contexts';\nexport const renderTree_unstable = (state, contextValues) => {\n  const {\n    slots,\n    slotProps\n  } = getSlotsNext(state);\n  return /*#__PURE__*/createElement(TreeProvider, {\n    value: contextValues.tree\n  }, /*#__PURE__*/createElement(slots.root, slotProps.root, slotProps.root.children));\n};\n//# sourceMappingURL=renderTree.js.map"],"names":["renderTree_unstable","state","contextValues","slots","slotProps","getSlotsNext","createElement","TreeProvider","value","tree","root","children"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAGrCA;;aAAAA;;iCAHqE;gCACrD;0BACA;AACtB,MAAMA,sBAAsB,CAACC,OAAOC,gBAAkB;IAC3D,MAAM,EACJC,MAAK,EACLC,UAAS,EACV,GAAGC,IAAAA,4BAAY,EAACJ;IACjB,OAAO,WAAW,GAAEK,IAAAA,8BAAa,EAACC,sBAAY,EAAE;QAC9CC,OAAON,cAAcO,IAAI;IAC3B,GAAG,WAAW,GAAEH,IAAAA,8BAAa,EAACH,MAAMO,IAAI,EAAEN,UAAUM,IAAI,EAAEN,UAAUM,IAAI,CAACC,QAAQ;AACnF,GACA,sCAAsC"}
+{"version":3,"sources":["../../../lib/components/Tree/renderTree.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { TreeProvider } from '../../contexts';\nexport const renderTree_unstable = (state, contextValues) => {\n  const {\n    slots,\n    slotProps\n  } = getSlotsNext(state);\n  return /*#__PURE__*/createElement(TreeProvider, {\n    value: contextValues.tree\n  }, state.open && /*#__PURE__*/createElement(slots.root, slotProps.root, slotProps.root.children));\n};\n//# sourceMappingURL=renderTree.js.map"],"names":["renderTree_unstable","state","contextValues","slots","slotProps","getSlotsNext","createElement","TreeProvider","value","tree","open","root","children"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAGrCA;;aAAAA;;iCAHqE;gCACrD;0BACA;AACtB,MAAMA,sBAAsB,CAACC,OAAOC,gBAAkB;IAC3D,MAAM,EACJC,MAAK,EACLC,UAAS,EACV,GAAGC,IAAAA,4BAAY,EAACJ;IACjB,OAAO,WAAW,GAAEK,IAAAA,8BAAa,EAACC,sBAAY,EAAE;QAC9CC,OAAON,cAAcO,IAAI;IAC3B,GAAGR,MAAMS,IAAI,IAAI,WAAW,GAAEJ,IAAAA,8BAAa,EAACH,MAAMQ,IAAI,EAAEP,UAAUO,IAAI,EAAEP,UAAUO,IAAI,CAACC,QAAQ;AACjG,GACA,sCAAsC"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../lib/components/Tree/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 */\nexport function useRootTree(props, ref) {\n  warnIfNoProperPropsRootTree(props);\n  const {\n    appearance = 'subtle',\n    size = 'medium'\n  } = 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 = ({\n    event,\n    value,\n    itemType,\n    type\n  }) => {\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 = ({\n    event,\n    value,\n    type,\n    itemType\n  }) => {\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//# sourceMappingURL=useRootTree.js.map"],"names":["useRootTree","props","ref","warnIfNoProperPropsRootTree","appearance","size","openItems","updateOpenItems","useOpenItemsState","navigate","navigationRef","useNestedTreeNavigation","requestOpenChange","data","_props_onOpenChange","onOpenChange","call","event","isDefaultPrevented","requestNavigation","_props_onNavigation_unstable","onNavigation_unstable","type","treeDataTypes","ArrowDown","ArrowUp","preventDefault","handleTreeItemClick","value","itemType","ReactDOM","unstable_batchedUpdates","open","has","target","currentTarget","Click","handleTreeItemKeyDown","ArrowRight","Enter","ArrowLeft","End","Home","TypeAhead","requestTreeResponse","useEventCallback","request","components","root","level","getNativeElementProps","useMergedRefs","role","process","env","NODE_ENV","console","warn"],"mappings":"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"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../lib/components/Tree/useSubtree.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs } from '@fluentui/react-utilities';\nimport { useTreeContext_unstable, useTreeItemContext_unstable } from '../../contexts';\n/**\n * Create the state required to render a sub-level Tree.\n *\n * @param props - props from this instance of Tree\n * @param ref - reference to root HTMLElement of Tree\n */\nexport function useSubtree(props, ref) {\n  const contextAppearance = useTreeContext_unstable(ctx => ctx.appearance);\n  const contextSize = useTreeContext_unstable(ctx => ctx.size);\n  const subtreeRef = useTreeItemContext_unstable(ctx => ctx.subtreeRef);\n  const value = useTreeItemContext_unstable(ctx => ctx.value);\n  const {\n    appearance = contextAppearance !== null && contextAppearance !== void 0 ? contextAppearance : 'subtle',\n    size = contextSize !== null && contextSize !== void 0 ? contextSize : 'medium'\n  } = props;\n  const parentLevel = useTreeContext_unstable(ctx => ctx.level);\n  const openItems = useTreeContext_unstable(ctx => ctx.openItems);\n  const requestTreeResponse = useTreeContext_unstable(ctx => ctx.requestTreeResponse);\n  const open = openItems.has(value);\n  return {\n    open,\n    components: {\n      root: 'div'\n    },\n    appearance,\n    size,\n    level: parentLevel + 1,\n    root: getNativeElementProps('div', {\n      ref: useMergedRefs(ref, subtreeRef),\n      role: 'group',\n      ...props\n    }),\n    openItems,\n    requestTreeResponse\n  };\n}\n//# sourceMappingURL=useSubtree.js.map"],"names":["useSubtree","props","ref","contextAppearance","useTreeContext_unstable","ctx","appearance","contextSize","size","subtreeRef","useTreeItemContext_unstable","value","parentLevel","level","openItems","requestTreeResponse","open","has","components","root","getNativeElementProps","useMergedRefs","role"],"mappings":";;;;+BASgBA;;aAAAA;;;6DATO;gCAC8B;0BACgB;AAO9D,SAASA,WAAWC,KAAK,EAAEC,GAAG,EAAE;IACrC,MAAMC,oBAAoBC,IAAAA,iCAAuB,EAACC,CAAAA,MAAOA,IAAIC,UAAU;IACvE,MAAMC,cAAcH,IAAAA,iCAAuB,EAACC,CAAAA,MAAOA,IAAIG,IAAI;IAC3D,MAAMC,aAAaC,IAAAA,qCAA2B,EAACL,CAAAA,MAAOA,IAAII,UAAU;IACpE,MAAME,QAAQD,IAAAA,qCAA2B,EAACL,CAAAA,MAAOA,IAAIM,KAAK;IAC1D,MAAM,EACJL,YAAaH,sBAAsB,IAAI,IAAIA,sBAAsB,KAAK,IAAIA,oBAAoB,QAAQ,CAAA,EACtGK,MAAOD,gBAAgB,IAAI,IAAIA,gBAAgB,KAAK,IAAIA,cAAc,QAAQ,CAAA,EAC/E,GAAGN;IACJ,MAAMW,cAAcR,IAAAA,iCAAuB,EAACC,CAAAA,MAAOA,IAAIQ,KAAK;IAC5D,MAAMC,YAAYV,IAAAA,iCAAuB,EAACC,CAAAA,MAAOA,IAAIS,SAAS;IAC9D,MAAMC,sBAAsBX,IAAAA,iCAAuB,EAACC,CAAAA,MAAOA,IAAIU,mBAAmB;IAClF,MAAMC,OAAOF,UAAUG,GAAG,CAACN;IAC3B,OAAO;QACLK;QACAE,YAAY;YACVC,MAAM;QACR;QACAb;QACAE;QACAK,OAAOD,cAAc;QACrBO,MAAMC,IAAAA,qCAAqB,EAAC,OAAO;YACjClB,KAAKmB,IAAAA,6BAAa,EAACnB,KAAKO;YACxBa,MAAM;YACN,GAAGrB,KAAK;QACV;QACAa;QACAC;IACF;AACF,EACA,sCAAsC"}