@fluentui/react-tree 9.0.0-beta.24 → 9.0.0-beta.26

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 { 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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"}
+{"version":3,"sources":["createFlatTreeItems.ts"],"sourcesContent":["import type { FlatTreeItem, FlatTreeItemProps } from '../hooks/useFlatTree';\nimport { TreeItemValue } from '../TreeItem';\nimport { ImmutableSet } from './ImmutableSet';\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  getParent(key: TreeItemValue): FlatTreeItem<Props>;\n  getByIndex(index: number): FlatTreeItem<Props>;\n  subtree(key: TreeItemValue): IterableIterator<FlatTreeItem<Props>>;\n  children(key: TreeItemValue): IterableIterator<FlatTreeItem<Props>>;\n  visibleItems(openItems: ImmutableSet<TreeItemValue>): IterableIterator<FlatTreeItem<Props>>;\n  ancestors(key: TreeItemValue): IterableIterator<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\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.childrenValues.length,\n        itemType,\n      }),\n      level: currentLevel,\n      parentValue,\n      childrenValues: [],\n      index: -1,\n    };\n    const currentChildrenSize = currentParent.childrenValues.push(flatTreeItem.value);\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    getParent: key => itemsPerValue.get(itemsPerValue.get(key)?.parentValue ?? root.value) ?? root,\n    get: key => itemsPerValue.get(key),\n    subtree: key => FlatTreeSubtreeGenerator(key, flatTreeItems),\n    children: key => FlatTreeChildrenGenerator(key, flatTreeItems),\n    ancestors: key => FlatTreeAncestorsGenerator(key, flatTreeItems),\n    visibleItems: openItems => VisibleFlatTreeItemGenerator(openItems, flatTreeItems),\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    childrenValues: [],\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/**\n * Generator that returns all subtree of a given flat tree item\n * @param key the key of the item to get the subtree from\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* FlatTreeSubtreeGenerator<Props extends FlatTreeItemProps>(\n  key: TreeItemValue,\n  flatTreeItems: FlatTreeItems<Props>,\n) {\n  const item = flatTreeItems.get(key);\n  if (!item || item.childrenValues.length === 0) {\n    return [];\n  }\n  let counter = item.childrenValues.length;\n  let index = item.index;\n  while (counter > 0) {\n    const children = flatTreeItems.getByIndex(++index);\n    yield children;\n    counter += children.childrenValues.length - 1;\n  }\n}\n\n/**\n * Generator that returns all children of a given flat tree item\n * @param key the key of the item to get the children from\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* FlatTreeChildrenGenerator<Props extends FlatTreeItemProps>(\n  key: TreeItemValue,\n  flatTreeItems: FlatTreeItems<Props>,\n) {\n  const item = flatTreeItems.get(key);\n  if (!item || item.childrenValues.length === 0) {\n    return;\n  }\n  for (const childValue of item.childrenValues) {\n    yield flatTreeItems.get(childValue)!;\n  }\n}\n\n/**\n * Generator that returns all ancestors of a given flat tree item\n * @param key the key of the item to get the children from\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* FlatTreeAncestorsGenerator<Props extends FlatTreeItemProps>(\n  key: TreeItemValue,\n  flatTreeItems: FlatTreeItems<Props>,\n) {\n  let parent = flatTreeItems.getParent(key);\n  while (parent !== flatTreeItems.root) {\n    yield parent;\n    parent = flatTreeItems.getParent(parent.value);\n  }\n}\n\n/**\n * Generator that returns all visible items of a given flat tree\n * @param openItems the open items of the tree\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* VisibleFlatTreeItemGenerator<Props extends FlatTreeItemProps>(\n  openItems: ImmutableSet<TreeItemValue>,\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.childrenValues.length;\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","flatTreeItem","getTreeItemProps","currentChildrenSize","childrenValues","push","set","flatTreeItems","size","getByIndex","getParent","key","subtree","FlatTreeSubtreeGenerator","children","FlatTreeChildrenGenerator","ancestors","FlatTreeAncestorsGenerator","visibleItems","openItems","VisibleFlatTreeItemGenerator","id","item","counter","childValue","parent","visibleIndex","isItemVisible","has"],"mappings":"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"}

package/lib/utils/flattenTree.js

@@ -1,15 +1,10 @@
-let count = 1;
 function flattenTreeRecursive(items, parent, level = 1) {
     return items.reduce((acc, { subtree , ...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,
             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);

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> = 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"}
+{"version":3,"sources":["flattenTree.ts"],"sourcesContent":["import { FlatTreeItemProps } from '../hooks/useFlatTree';\nimport { TreeItemProps, TreeItemValue } from '../TreeItem';\n\nexport type NestedTreeItem<Props extends TreeItemProps> = Omit<Props, 'subtree' | 'itemType'> & {\n  value: TreeItemValue;\n  subtree?: NestedTreeItem<Props>[];\n};\n\nexport type FlattenedTreeItem<Props extends TreeItemProps> = FlatTreeItemProps & Props;\n\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 flatTreeItem = {\n      'aria-level': level,\n      'aria-posinset': index + 1,\n      'aria-setsize': items.length,\n      parentValue: parent?.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":["flattenTreeRecursive","items","parent","level","reduce","acc","subtree","item","index","flatTreeItem","length","parentValue","value","push","undefined","flattenTree_unstable"],"mappings":"AAUA,SAASA,qBACPC,KAA8B,EAC9BC,MAAkC,EAClCC,QAAQ,CAAC,EACmB;IAC5B,OAAOF,MAAMG,MAAM,CAA6B,CAACC,KAAK,EAAEC,QAAO,EAAE,GAAGC,MAAM,EAAEC,QAAU;QACpF,MAAMC,eAAe;YACnB,cAAcN;YACd,iBAAiBK,QAAQ;YACzB,gBAAgBP,MAAMS,MAAM;YAC5BC,aAAaT,mBAAAA,oBAAAA,KAAAA,IAAAA,OAAQU,KAAK;YAC1B,GAAGL,IAAI;QACT;QACAF,IAAIQ,IAAI,CAACJ;QACT,IAAIH,YAAYQ,WAAW;YACzBT,IAAIQ,IAAI,IAAIb,qBAA4BM,SAASG,cAAcN,QAAQ;QACzE,CAAC;QACD,OAAOE;IACT,GAAG,EAAE;AACP;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuCC,GACD,gEAAgE;AAChE,OAAO,MAAMU,uBAAuB,CAClCd,QAC+BD,qBAAqBC,OAAO"}

package/lib/utils/tokens.js

@@ -14,5 +14,6 @@ export const treeDataTypes = {
     Home,
     ArrowUp,
     ArrowDown,
-    TypeAhead: 'TypeAhead'
+    TypeAhead: 'TypeAhead',
+    Change: 'Change'
 };

package/lib/utils/tokens.js.map

@@ -1 +1 @@
-{"version":3,"sources":["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"],"names":["ArrowDown","ArrowLeft","ArrowRight","ArrowUp","End","Home","Enter","treeItemLevelToken","treeAvatarSize","medium","small","treeDataTypes","Click","ExpandIconClick","TypeAhead"],"mappings":"AAAA,SAASA,SAAS,EAAEC,SAAS,EAAEC,UAAU,EAAEC,OAAO,EAAEC,GAAG,EAAEC,IAAI,EAAEC,KAAK,QAAQ,0BAA0B;AAGtG,OAAO,MAAMC,qBAAqB,2BAAoC;AAEtE,OAAO,MAAMC,iBAAiB;IAC5BC,QAAQ;IACRC,OAAO;AACT,EAAW;AAEX,OAAO,MAAMC,gBAET;IACFV;IACAC;IACAI;IACAM,OAAO;IACPC,iBAAiB;IACjBT;IACAC;IACAF;IACAH;IACAc,WAAW;AACb,EAAE"}
+{"version":3,"sources":["tokens.ts"],"sourcesContent":["import { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, End, Home, Enter } from '@fluentui/keyboard-keys';\nimport { TreeCheckedChangeData, 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'] | TreeCheckedChangeData['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  Change: 'Change',\n};\n"],"names":["ArrowDown","ArrowLeft","ArrowRight","ArrowUp","End","Home","Enter","treeItemLevelToken","treeAvatarSize","medium","small","treeDataTypes","Click","ExpandIconClick","TypeAhead","Change"],"mappings":"AAAA,SAASA,SAAS,EAAEC,SAAS,EAAEC,UAAU,EAAEC,OAAO,EAAEC,GAAG,EAAEC,IAAI,EAAEC,KAAK,QAAQ,0BAA0B;AAGtG,OAAO,MAAMC,qBAAqB,2BAAoC;AAEtE,OAAO,MAAMC,iBAAiB;IAC5BC,QAAQ;IACRC,OAAO;AACT,EAAW;AAEX,OAAO,MAAMC,gBAET;IACFV;IACAC;IACAI;IACAM,OAAO;IACPC,iBAAiB;IACjBT;IACAC;IACAF;IACAH;IACAc,WAAW;IACXC,QAAQ;AACV,EAAE"}

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

@@ -2,5 +2,3 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));

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

@@ -1 +1 @@
-{"version":3,"sources":["Tree.types.js"],"sourcesContent":["import * as React from 'react';\n"],"names":[],"mappings":";;;;;6DAAuB"}
+{"version":3,"sources":[],"names":[],"mappings":""}

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

@@ -14,8 +14,9 @@ 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 { appearance ='subtle' , size ='medium' , selectionMode ='none'  } = props;
+    const [openItems, setOpenItems] = (0, _hooks.useControllableOpenItems)(props);
+    const [checkedItems] = (0, _hooks.useNestedControllableCheckedItems)(props);
     const [navigate, navigationRef] = (0, _hooks.useNestedTreeNavigation)();
     const requestOpenChange = (data)=>{
         var _props_onOpenChange;
@@ -23,7 +24,14 @@ function useRootTree(props, ref) {
         if (data.event.isDefaultPrevented()) {
             return;
         }
-        return updateOpenItems(data);
+        return setOpenItems((0, _hooks.createNextOpenItems)(data, openItems));
+    };
+    const requestCheckedChange = (data)=>{
+        var _props_onCheckedChange;
+        (_props_onCheckedChange = props.onCheckedChange) === null || _props_onCheckedChange === void 0 ? void 0 : _props_onCheckedChange.call(props, data.event, data);
+    // TODO:
+    // we should implement the logic for nested tree selection
+    // return setCheckedItems(checkedItems);
     };
     const requestNavigation = (data)=>{
         var _props_onNavigation_unstable;
@@ -36,105 +44,95 @@ function useRootTree(props, ref) {
             data.event.preventDefault();
         }
     };
-    const handleTreeItemClick = ({ event , value , itemType , type  })=>{
-        _reactDom.unstable_batchedUpdates(()=>{
-            requestOpenChange({
-                event,
-                value,
-                open: itemType === 'branch' && !openItems.has(value),
-                type,
-                target: event.currentTarget
-            });
-            requestNavigation({
-                event,
-                value,
-                target: event.currentTarget,
-                type: _tokens.treeDataTypes.Click
-            });
-        });
-    };
-    const handleTreeItemKeyDown = ({ event , type , value , itemType  })=>{
-        const open = openItems.has(value);
-        switch(type){
+    const requestTreeResponse = (0, _reactUtilities.useEventCallback)((request)=>{
+        switch(request.type){
+            case _tokens.treeDataTypes.Click:
+            case _tokens.treeDataTypes.ExpandIconClick:
+                {
+                    return _reactDom.unstable_batchedUpdates(()=>{
+                        requestOpenChange({
+                            ...request,
+                            open: request.itemType === 'branch' && !openItems.has(request.value)
+                        });
+                        requestNavigation({
+                            ...request,
+                            type: _tokens.treeDataTypes.Click
+                        });
+                    });
+                }
             case _tokens.treeDataTypes.ArrowRight:
-                if (itemType === 'leaf') {
-                    return;
+                {
+                    if (request.itemType === 'leaf') {
+                        return;
+                    }
+                    const open = openItems.has(request.value);
+                    if (!open) {
+                        return requestOpenChange({
+                            ...request,
+                            open: true
+                        });
+                    }
+                    return requestNavigation(request);
                 }
-                if (!open) {
+            case _tokens.treeDataTypes.Enter:
+                {
+                    const open = openItems.has(request.value);
                     return requestOpenChange({
-                        event,
-                        value,
-                        open: true,
-                        type: _tokens.treeDataTypes.ArrowRight,
-                        target: event.currentTarget
+                        ...request,
+                        open: request.itemType === 'branch' && !open
                     });
                 }
-                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
+                {
+                    const open = openItems.has(request.value);
+                    if (open && request.itemType === 'branch') {
+                        return requestOpenChange({
+                            ...request,
+                            open: false,
+                            type: _tokens.treeDataTypes.ArrowLeft
+                        });
+                    }
+                    return requestNavigation({
+                        ...request,
+                        type: _tokens.treeDataTypes.ArrowLeft
                     });
                 }
-                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
+                    ...request,
+                    target: request.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);
+            case _tokens.treeDataTypes.Change:
+                {
+                    const previousCheckedValue = checkedItems.get(request.value);
+                    return requestCheckedChange({
+                        ...request,
+                        selectionMode: selectionMode,
+                        checked: previousCheckedValue === 'mixed' ? true : !previousCheckedValue
+                    });
+                }
         }
     });
     return {
         components: {
             root: 'div'
         },
+        selectionMode,
         open: true,
         appearance,
         size,
         level: 1,
         openItems,
+        checkedItems,
         requestTreeResponse,
         root: (0, _reactUtilities.getNativeElementProps)('div', {
             ref: (0, _reactUtilities.useMergedRefs)(navigationRef, ref),
             role: 'tree',
+            'aria-multiselectable': selectionMode === 'multiselect' ? true : undefined,
             ...props
         })
     };

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 , type , value , itemType  })=>{\n        const open = openItems.has(value);\n        switch(type){\n            case treeDataTypes.ArrowRight:\n                if (itemType === 'leaf') {\n                    return;\n                }\n                if (!open) {\n                    return requestOpenChange({\n                        event,\n                        value,\n                        open: true,\n                        type: treeDataTypes.ArrowRight,\n                        target: event.currentTarget\n                    });\n                }\n                return requestNavigation({\n                    event,\n                    value,\n                    type,\n                    target: event.currentTarget\n                });\n            case treeDataTypes.Enter:\n                return requestOpenChange({\n                    event,\n                    value,\n                    open: itemType === 'branch' && !open,\n                    type: treeDataTypes.Enter,\n                    target: event.currentTarget\n                });\n            case treeDataTypes.ArrowLeft:\n                if (open && itemType === 'branch') {\n                    return requestOpenChange({\n                        event,\n                        value,\n                        open: false,\n                        type: treeDataTypes.ArrowLeft,\n                        target: event.currentTarget\n                    });\n                }\n                return requestNavigation({\n                    event,\n                    value,\n                    target: event.currentTarget,\n                    type: treeDataTypes.ArrowLeft\n                });\n            case treeDataTypes.End:\n            case treeDataTypes.Home:\n            case treeDataTypes.ArrowUp:\n            case treeDataTypes.ArrowDown:\n            case treeDataTypes.TypeAhead:\n                return requestNavigation({\n                    event,\n                    value,\n                    type,\n                    target: event.currentTarget\n                });\n        }\n    };\n    const requestTreeResponse = useEventCallback((request)=>{\n        switch(request.event.type){\n            case 'click':\n                // casting is required here as we're narrowing down the event to only click events\n                return handleTreeItemClick(request);\n            case 'keydown':\n                // casting is required here as we're narrowing down the event to only keyboard events\n                return handleTreeItemKeyDown(request);\n        }\n    });\n    return {\n        components: {\n            root: 'div'\n        },\n        open: true,\n        appearance,\n        size,\n        level: 1,\n        openItems,\n        requestTreeResponse,\n        root: getNativeElementProps('div', {\n            ref: useMergedRefs(navigationRef, ref),\n            role: 'tree',\n            ...props\n        })\n    };\n}\nfunction warnIfNoProperPropsRootTree(props) {\n    if (process.env.NODE_ENV === 'development') {\n        if (!props['aria-label'] && !props['aria-labelledby']) {\n            // eslint-disable-next-line no-console\n            console.warn('Tree must have either a `aria-label` or `aria-labelledby` property defined');\n        }\n    }\n}\n"],"names":["useRootTree","props","ref","warnIfNoProperPropsRootTree","appearance","size","openItems","updateOpenItems","useOpenItemsState","navigate","navigationRef","useNestedTreeNavigation","requestOpenChange","data","_props_onOpenChange","onOpenChange","call","event","isDefaultPrevented","requestNavigation","_props_onNavigation_unstable","onNavigation_unstable","type","treeDataTypes","ArrowDown","ArrowUp","preventDefault","handleTreeItemClick","value","itemType","ReactDOM","unstable_batchedUpdates","open","has","target","currentTarget","Click","handleTreeItemKeyDown","ArrowRight","Enter","ArrowLeft","End","Home","TypeAhead","requestTreeResponse","useEventCallback","request","components","root","level","getNativeElementProps","useMergedRefs","role","process","env","NODE_ENV","console","warn"],"mappings":"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"}
+{"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 { useControllableOpenItems, useNestedTreeNavigation, useNestedControllableCheckedItems, createNextOpenItems } 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' , selectionMode ='none'  } = props;\n    const [openItems, setOpenItems] = useControllableOpenItems(props);\n    const [checkedItems] = useNestedControllableCheckedItems(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 setOpenItems(createNextOpenItems(data, openItems));\n    };\n    const requestCheckedChange = (data)=>{\n        var _props_onCheckedChange;\n        (_props_onCheckedChange = props.onCheckedChange) === null || _props_onCheckedChange === void 0 ? void 0 : _props_onCheckedChange.call(props, data.event, data);\n    // TODO:\n    // we should implement the logic for nested tree selection\n    // return setCheckedItems(checkedItems);\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 requestTreeResponse = useEventCallback((request)=>{\n        switch(request.type){\n            case treeDataTypes.Click:\n            case treeDataTypes.ExpandIconClick:\n                {\n                    return ReactDOM.unstable_batchedUpdates(()=>{\n                        requestOpenChange({\n                            ...request,\n                            open: request.itemType === 'branch' && !openItems.has(request.value)\n                        });\n                        requestNavigation({\n                            ...request,\n                            type: treeDataTypes.Click\n                        });\n                    });\n                }\n            case treeDataTypes.ArrowRight:\n                {\n                    if (request.itemType === 'leaf') {\n                        return;\n                    }\n                    const open = openItems.has(request.value);\n                    if (!open) {\n                        return requestOpenChange({\n                            ...request,\n                            open: true\n                        });\n                    }\n                    return requestNavigation(request);\n                }\n            case treeDataTypes.Enter:\n                {\n                    const open = openItems.has(request.value);\n                    return requestOpenChange({\n                        ...request,\n                        open: request.itemType === 'branch' && !open\n                    });\n                }\n            case treeDataTypes.ArrowLeft:\n                {\n                    const open = openItems.has(request.value);\n                    if (open && request.itemType === 'branch') {\n                        return requestOpenChange({\n                            ...request,\n                            open: false,\n                            type: treeDataTypes.ArrowLeft\n                        });\n                    }\n                    return requestNavigation({\n                        ...request,\n                        type: treeDataTypes.ArrowLeft\n                    });\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                    ...request,\n                    target: request.event.currentTarget\n                });\n            case treeDataTypes.Change:\n                {\n                    const previousCheckedValue = checkedItems.get(request.value);\n                    return requestCheckedChange({\n                        ...request,\n                        selectionMode: selectionMode,\n                        checked: previousCheckedValue === 'mixed' ? true : !previousCheckedValue\n                    });\n                }\n        }\n    });\n    return {\n        components: {\n            root: 'div'\n        },\n        selectionMode,\n        open: true,\n        appearance,\n        size,\n        level: 1,\n        openItems,\n        checkedItems,\n        requestTreeResponse,\n        root: getNativeElementProps('div', {\n            ref: useMergedRefs(navigationRef, ref),\n            role: 'tree',\n            'aria-multiselectable': selectionMode === 'multiselect' ? true : undefined,\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","selectionMode","openItems","setOpenItems","useControllableOpenItems","checkedItems","useNestedControllableCheckedItems","navigate","navigationRef","useNestedTreeNavigation","requestOpenChange","data","_props_onOpenChange","onOpenChange","call","event","isDefaultPrevented","createNextOpenItems","requestCheckedChange","_props_onCheckedChange","onCheckedChange","requestNavigation","_props_onNavigation_unstable","onNavigation_unstable","type","treeDataTypes","ArrowDown","ArrowUp","preventDefault","requestTreeResponse","useEventCallback","request","Click","ExpandIconClick","ReactDOM","unstable_batchedUpdates","open","itemType","has","value","ArrowRight","Enter","ArrowLeft","End","Home","TypeAhead","target","currentTarget","Change","previousCheckedValue","get","checked","components","root","level","getNativeElementProps","useMergedRefs","role","undefined","process","env","NODE_ENV","console","warn"],"mappings":"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"}

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

@@ -17,7 +17,9 @@ function useSubtree(props, ref) {
     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 selectionMode = (0, _contexts.useTreeContext_unstable)((ctx)=>ctx.selectionMode);
     const openItems = (0, _contexts.useTreeContext_unstable)((ctx)=>ctx.openItems);
+    const checkedItems = (0, _contexts.useTreeContext_unstable)((ctx)=>ctx.checkedItems);
     const requestTreeResponse = (0, _contexts.useTreeContext_unstable)((ctx)=>ctx.requestTreeResponse);
     const open = openItems.has(value);
     return {
@@ -27,6 +29,7 @@ function useSubtree(props, ref) {
         },
         appearance,
         size,
+        selectionMode,
         level: parentLevel + 1,
         root: (0, _reactUtilities.getNativeElementProps)('div', {
             ref: (0, _reactUtilities.useMergedRefs)(ref, subtreeRef),
@@ -34,6 +37,7 @@ function useSubtree(props, ref) {
             ...props
         }),
         openItems,
+        checkedItems,
         requestTreeResponse
     };
 }

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

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

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

@@ -7,15 +7,17 @@ Object.defineProperty(exports, "useTreeContextValues_unstable", {
     get: ()=>useTreeContextValues_unstable
 });
 function useTreeContextValues_unstable(state) {
-    const { openItems , level , appearance , size , requestTreeResponse  } = state;
+    const { openItems , checkedItems , selectionMode , level , appearance , size , requestTreeResponse  } = state;
     /**
    * This context is created with "@fluentui/react-context-selector",
    * there is no sense to memoize it
    */ const tree = {
-        appearance,
         size,
         level,
         openItems,
+        appearance,
+        checkedItems,
+        selectionMode,
         requestTreeResponse
     };
     return {

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

@@ -1 +1 @@
-{"version":3,"sources":["useTreeContextValues.js"],"sourcesContent":["export function useTreeContextValues_unstable(state) {\n    const { openItems , level , appearance , size , requestTreeResponse  } = state;\n    /**\n   * This context is created with \"@fluentui/react-context-selector\",\n   * there is no sense to memoize it\n   */ const tree = {\n        appearance,\n        size,\n        level,\n        openItems,\n        requestTreeResponse\n    };\n    return {\n        tree\n    };\n}\n"],"names":["useTreeContextValues_unstable","state","openItems","level","appearance","size","requestTreeResponse","tree"],"mappings":";;;;+BAAgBA;;aAAAA;;AAAT,SAASA,8BAA8BC,KAAK,EAAE;IACjD,MAAM,EAAEC,UAAS,EAAGC,MAAK,EAAGC,WAAU,EAAGC,KAAI,EAAGC,oBAAmB,EAAG,GAAGL;IACzE;;;GAGD,GAAG,MAAMM,OAAO;QACXH;QACAC;QACAF;QACAD;QACAI;IACJ;IACA,OAAO;QACHC;IACJ;AACJ"}
+{"version":3,"sources":["useTreeContextValues.js"],"sourcesContent":["export function useTreeContextValues_unstable(state) {\n    const { openItems , checkedItems , selectionMode , level , appearance , size , requestTreeResponse  } = state;\n    /**\n   * This context is created with \"@fluentui/react-context-selector\",\n   * there is no sense to memoize it\n   */ const tree = {\n        size,\n        level,\n        openItems,\n        appearance,\n        checkedItems,\n        selectionMode,\n        requestTreeResponse\n    };\n    return {\n        tree\n    };\n}\n"],"names":["useTreeContextValues_unstable","state","openItems","checkedItems","selectionMode","level","appearance","size","requestTreeResponse","tree"],"mappings":";;;;+BAAgBA;;aAAAA;;AAAT,SAASA,8BAA8BC,KAAK,EAAE;IACjD,MAAM,EAAEC,UAAS,EAAGC,aAAY,EAAGC,cAAa,EAAGC,MAAK,EAAGC,WAAU,EAAGC,KAAI,EAAGC,oBAAmB,EAAG,GAAGP;IACxG;;;GAGD,GAAG,MAAMQ,OAAO;QACXF;QACAF;QACAH;QACAI;QACAH;QACAC;QACAI;IACJ;IACA,OAAO;QACHC;IACJ;AACJ"}

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

@@ -13,5 +13,7 @@ const renderTreeItem_unstable = (state, contextValues)=>{
     const { slots , slotProps  } = (0, _reactUtilities.getSlotsNext)(state);
     return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_contexts.TreeItemProvider, {
         value: contextValues.treeItem
-    }, slotProps.root.children));
+    }, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_contexts.TreeItemSlotsProvider, {
+        value: contextValues.treeItemSlots
+    }, slotProps.root.children)));
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["renderTreeItem.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { TreeItemProvider } from '../../contexts';\n/**\n * Render the final JSX of TreeItem\n */ export const renderTreeItem_unstable = (state, contextValues)=>{\n    const { slots , slotProps  } = getSlotsNext(state);\n    return /*#__PURE__*/ createElement(slots.root, slotProps.root, /*#__PURE__*/ createElement(TreeItemProvider, {\n        value: contextValues.treeItem\n    }, slotProps.root.children));\n};\n"],"names":["renderTreeItem_unstable","state","contextValues","slots","slotProps","getSlotsNext","createElement","root","TreeItemProvider","value","treeItem","children"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAKjCA;;aAAAA;;iCALkE;gCACtD;0BACI;AAGtB,MAAMA,0BAA0B,CAACC,OAAOC,gBAAgB;IAC/D,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,4BAAY,EAACJ;IAC5C,OAAO,WAAW,GAAGK,IAAAA,8BAAa,EAACH,MAAMI,IAAI,EAAEH,UAAUG,IAAI,EAAE,WAAW,GAAGD,IAAAA,8BAAa,EAACE,0BAAgB,EAAE;QACzGC,OAAOP,cAAcQ,QAAQ;IACjC,GAAGN,UAAUG,IAAI,CAACI,QAAQ;AAC9B"}
+{"version":3,"sources":["renderTreeItem.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { TreeItemProvider, TreeItemSlotsProvider } from '../../contexts';\n/**\n * Render the final JSX of TreeItem\n */ export const renderTreeItem_unstable = (state, contextValues)=>{\n    const { slots , slotProps  } = getSlotsNext(state);\n    return /*#__PURE__*/ createElement(slots.root, slotProps.root, /*#__PURE__*/ createElement(TreeItemProvider, {\n        value: contextValues.treeItem\n    }, /*#__PURE__*/ createElement(TreeItemSlotsProvider, {\n        value: contextValues.treeItemSlots\n    }, slotProps.root.children)));\n};\n"],"names":["renderTreeItem_unstable","state","contextValues","slots","slotProps","getSlotsNext","createElement","root","TreeItemProvider","value","treeItem","TreeItemSlotsProvider","treeItemSlots","children"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAKjCA;;aAAAA;;iCALkE;gCACtD;0BAC2B;AAG7C,MAAMA,0BAA0B,CAACC,OAAOC,gBAAgB;IAC/D,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,4BAAY,EAACJ;IAC5C,OAAO,WAAW,GAAGK,IAAAA,8BAAa,EAACH,MAAMI,IAAI,EAAEH,UAAUG,IAAI,EAAE,WAAW,GAAGD,IAAAA,8BAAa,EAACE,0BAAgB,EAAE;QACzGC,OAAOP,cAAcQ,QAAQ;IACjC,GAAG,WAAW,GAAGJ,IAAAA,8BAAa,EAACK,+BAAqB,EAAE;QAClDF,OAAOP,cAAcU,aAAa;IACtC,GAAGR,UAAUG,IAAI,CAACM,QAAQ;AAC9B"}