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

package/lib/hooks/useFlatControllableCheckedItems.js

@@ -0,0 +1,76 @@
+import { useControllableState } from '@fluentui/react-utilities';
+import { ImmutableMap } from '../utils/ImmutableMap';
+import * as React from 'react';
+function initializeMap(iterable) {
+    const map = new Map();
+    if (iterable === undefined) {
+        return ImmutableMap.empty;
+    }
+    for (const item of iterable){
+        if (Array.isArray(item)) {
+            map.set(item[0], item[1]);
+        } else {
+            map.set(item, true);
+        }
+    }
+    return ImmutableMap.dangerouslyCreate_unstable(map);
+}
+export function useFlatControllableCheckedItems(props) {
+    const [checkedItems, setCheckedItems] = useControllableState({
+        initialState: ImmutableMap.empty,
+        state: React.useMemo(()=>props.checkedItems && initializeMap(props.checkedItems), [
+            props.checkedItems
+        ]),
+        defaultState: ()=>initializeMap(props.defaultCheckedItems)
+    });
+    return [
+        checkedItems,
+        setCheckedItems
+    ];
+}
+export function createNextFlatCheckedItems(data, previousCheckedItems, flatTreeItems) {
+    if (data.selectionMode === 'single') {
+        return ImmutableMap.create([
+            [
+                data.value,
+                data.checked
+            ]
+        ]);
+    }
+    const treeItem = flatTreeItems.get(data.value);
+    if (!treeItem) {
+        if (process.env.NODE_ENV !== 'production') {
+            // eslint-disable-next-line no-console
+            console.error(`useFlatTree: tree item ${data.value} not found`);
+        }
+        return previousCheckedItems;
+    }
+    const nextCheckedItems = new Map(previousCheckedItems);
+    for (const children of flatTreeItems.subtree(data.value)){
+        nextCheckedItems.set(children.value, data.checked);
+    }
+    nextCheckedItems.set(data.value, data.checked);
+    let isAncestorsMixed = false;
+    for (const parent of flatTreeItems.ancestors(treeItem.value)){
+        // if one parent is mixed, all ancestors are mixed
+        if (isAncestorsMixed) {
+            nextCheckedItems.set(parent.value, 'mixed');
+            continue;
+        }
+        const checkedChildren = [];
+        for (const child of flatTreeItems.children(parent.value)){
+            var _nextCheckedItems_get;
+            if (((_nextCheckedItems_get = nextCheckedItems.get(child.value)) !== null && _nextCheckedItems_get !== void 0 ? _nextCheckedItems_get : false) === data.checked) {
+                checkedChildren.push(child);
+            }
+        }
+        if (checkedChildren.length === parent.childrenValues.length) {
+            nextCheckedItems.set(parent.value, data.checked);
+        } else {
+            // if one parent is mixed, all ancestors are mixed
+            isAncestorsMixed = true;
+            nextCheckedItems.set(parent.value, 'mixed');
+        }
+    }
+    return ImmutableMap.dangerouslyCreate_unstable(nextCheckedItems);
+}

package/lib/hooks/useFlatControllableCheckedItems.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useFlatControllableCheckedItems.ts"],"sourcesContent":["import { useControllableState } from '@fluentui/react-utilities';\nimport type { TreeCheckedChangeData, TreeProps } from '../Tree';\nimport { TreeItemValue } from '../TreeItem';\nimport { ImmutableMap } from '../utils/ImmutableMap';\nimport * as React from 'react';\nimport type { FlatTreeItemProps } from './useFlatTree';\nimport { FlatTreeItems } from '../utils/createFlatTreeItems';\n\nfunction initializeMap(iterable?: Iterable<TreeItemValue | [TreeItemValue, 'mixed' | boolean]>) {\n  const map = new Map<TreeItemValue, 'mixed' | boolean>();\n  if (iterable === undefined) {\n    return ImmutableMap.empty;\n  }\n  for (const item of iterable) {\n    if (Array.isArray(item)) {\n      map.set(item[0], item[1]);\n    } else {\n      map.set(item, true);\n    }\n  }\n  return ImmutableMap.dangerouslyCreate_unstable(map);\n}\n\nexport function useFlatControllableCheckedItems(\n  props: Pick<TreeProps, 'checkedItems' | 'defaultCheckedItems' | 'selectionMode'>,\n) {\n  const [checkedItems, setCheckedItems] = useControllableState({\n    initialState: ImmutableMap.empty,\n    state: React.useMemo(() => props.checkedItems && initializeMap(props.checkedItems), [props.checkedItems]),\n    defaultState: () => initializeMap(props.defaultCheckedItems),\n  });\n\n  return [checkedItems, setCheckedItems] as const;\n}\n\nexport function createNextFlatCheckedItems<Props extends FlatTreeItemProps = FlatTreeItemProps>(\n  data: Pick<TreeCheckedChangeData, 'value' | 'checked' | 'selectionMode'>,\n  previousCheckedItems: ImmutableMap<TreeItemValue, 'mixed' | boolean>,\n  flatTreeItems: FlatTreeItems<Props>,\n): ImmutableMap<TreeItemValue, 'mixed' | boolean> {\n  if (data.selectionMode === 'single') {\n    return ImmutableMap.create([[data.value, data.checked]]);\n  }\n  const treeItem = flatTreeItems.get(data.value);\n  if (!treeItem) {\n    if (process.env.NODE_ENV !== 'production') {\n      // eslint-disable-next-line no-console\n      console.error(`useFlatTree: tree item ${data.value} not found`);\n    }\n    return previousCheckedItems;\n  }\n  const nextCheckedItems = new Map(previousCheckedItems);\n  for (const children of flatTreeItems.subtree(data.value)) {\n    nextCheckedItems.set(children.value, data.checked);\n  }\n  nextCheckedItems.set(data.value, data.checked);\n\n  let isAncestorsMixed = false;\n  for (const parent of flatTreeItems.ancestors(treeItem.value)) {\n    // if one parent is mixed, all ancestors are mixed\n    if (isAncestorsMixed) {\n      nextCheckedItems.set(parent.value, 'mixed');\n      continue;\n    }\n    const checkedChildren = [];\n    for (const child of flatTreeItems.children(parent.value)) {\n      if ((nextCheckedItems.get(child.value) ?? false) === data.checked) {\n        checkedChildren.push(child);\n      }\n    }\n    if (checkedChildren.length === parent.childrenValues.length) {\n      nextCheckedItems.set(parent.value, data.checked);\n    } else {\n      // if one parent is mixed, all ancestors are mixed\n      isAncestorsMixed = true;\n      nextCheckedItems.set(parent.value, 'mixed');\n    }\n  }\n  return ImmutableMap.dangerouslyCreate_unstable(nextCheckedItems);\n}\n"],"names":["useControllableState","ImmutableMap","React","initializeMap","iterable","map","Map","undefined","empty","item","Array","isArray","set","dangerouslyCreate_unstable","useFlatControllableCheckedItems","props","checkedItems","setCheckedItems","initialState","state","useMemo","defaultState","defaultCheckedItems","createNextFlatCheckedItems","data","previousCheckedItems","flatTreeItems","selectionMode","create","value","checked","treeItem","get","process","env","NODE_ENV","console","error","nextCheckedItems","children","subtree","isAncestorsMixed","parent","ancestors","checkedChildren","child","push","length","childrenValues"],"mappings":"AAAA,SAASA,oBAAoB,QAAQ,4BAA4B;AAGjE,SAASC,YAAY,QAAQ,wBAAwB;AACrD,YAAYC,WAAW,QAAQ;AAI/B,SAASC,cAAcC,QAAuE,EAAE;IAC9F,MAAMC,MAAM,IAAIC;IAChB,IAAIF,aAAaG,WAAW;QAC1B,OAAON,aAAaO,KAAK;IAC3B,CAAC;IACD,KAAK,MAAMC,QAAQL,SAAU;QAC3B,IAAIM,MAAMC,OAAO,CAACF,OAAO;YACvBJ,IAAIO,GAAG,CAACH,IAAI,CAAC,EAAE,EAAEA,IAAI,CAAC,EAAE;QAC1B,OAAO;YACLJ,IAAIO,GAAG,CAACH,MAAM,IAAI;QACpB,CAAC;IACH;IACA,OAAOR,aAAaY,0BAA0B,CAACR;AACjD;AAEA,OAAO,SAASS,gCACdC,KAAgF,EAChF;IACA,MAAM,CAACC,cAAcC,gBAAgB,GAAGjB,qBAAqB;QAC3DkB,cAAcjB,aAAaO,KAAK;QAChCW,OAAOjB,MAAMkB,OAAO,CAAC,IAAML,MAAMC,YAAY,IAAIb,cAAcY,MAAMC,YAAY,GAAG;YAACD,MAAMC,YAAY;SAAC;QACxGK,cAAc,IAAMlB,cAAcY,MAAMO,mBAAmB;IAC7D;IAEA,OAAO;QAACN;QAAcC;KAAgB;AACxC,CAAC;AAED,OAAO,SAASM,2BACdC,IAAwE,EACxEC,oBAAoE,EACpEC,aAAmC,EACa;IAChD,IAAIF,KAAKG,aAAa,KAAK,UAAU;QACnC,OAAO1B,aAAa2B,MAAM,CAAC;YAAC;gBAACJ,KAAKK,KAAK;gBAAEL,KAAKM,OAAO;aAAC;SAAC;IACzD,CAAC;IACD,MAAMC,WAAWL,cAAcM,GAAG,CAACR,KAAKK,KAAK;IAC7C,IAAI,CAACE,UAAU;QACb,IAAIE,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;YACzC,sCAAsC;YACtCC,QAAQC,KAAK,CAAC,CAAC,uBAAuB,EAAEb,KAAKK,KAAK,CAAC,UAAU,CAAC;QAChE,CAAC;QACD,OAAOJ;IACT,CAAC;IACD,MAAMa,mBAAmB,IAAIhC,IAAImB;IACjC,KAAK,MAAMc,YAAYb,cAAcc,OAAO,CAAChB,KAAKK,KAAK,EAAG;QACxDS,iBAAiB1B,GAAG,CAAC2B,SAASV,KAAK,EAAEL,KAAKM,OAAO;IACnD;IACAQ,iBAAiB1B,GAAG,CAACY,KAAKK,KAAK,EAAEL,KAAKM,OAAO;IAE7C,IAAIW,mBAAmB,KAAK;IAC5B,KAAK,MAAMC,UAAUhB,cAAciB,SAAS,CAACZ,SAASF,KAAK,EAAG;QAC5D,kDAAkD;QAClD,IAAIY,kBAAkB;YACpBH,iBAAiB1B,GAAG,CAAC8B,OAAOb,KAAK,EAAE;YACnC,QAAS;QACX,CAAC;QACD,MAAMe,kBAAkB,EAAE;QAC1B,KAAK,MAAMC,SAASnB,cAAca,QAAQ,CAACG,OAAOb,KAAK,EAAG;gBACnDS;YAAL,IAAI,AAACA,CAAAA,CAAAA,wBAAAA,iBAAiBN,GAAG,CAACa,MAAMhB,KAAK,eAAhCS,mCAAAA,wBAAqC,KAAK,AAAD,MAAOd,KAAKM,OAAO,EAAE;gBACjEc,gBAAgBE,IAAI,CAACD;YACvB,CAAC;QACH;QACA,IAAID,gBAAgBG,MAAM,KAAKL,OAAOM,cAAc,CAACD,MAAM,EAAE;YAC3DT,iBAAiB1B,GAAG,CAAC8B,OAAOb,KAAK,EAAEL,KAAKM,OAAO;QACjD,OAAO;YACL,kDAAkD;YAClDW,mBAAmB,IAAI;YACvBH,iBAAiB1B,GAAG,CAAC8B,OAAOb,KAAK,EAAE;QACrC,CAAC;IACH;IACA,OAAO5B,aAAaY,0BAA0B,CAACyB;AACjD,CAAC"}

package/lib/hooks/useFlatTree.js

@@ -1,10 +1,11 @@
 import { useEventCallback, useMergedRefs } from '@fluentui/react-utilities';
 import * as React from 'react';
-import { createFlatTreeItems, VisibleFlatTreeItemGenerator } from '../utils/createFlatTreeItems';
+import { createFlatTreeItems } from '../utils/createFlatTreeItems';
 import { treeDataTypes } from '../utils/tokens';
 import { useFlatTreeNavigation } from './useFlatTreeNavigation';
-import { useOpenItemsState } from './useOpenItemsState';
+import { createNextOpenItems, useControllableOpenItems } from './useControllableOpenItems';
 import { dataTreeItemValueAttrName } from '../utils/getTreeItemValueFromElement';
+import { createNextFlatCheckedItems, useFlatControllableCheckedItems } from './useFlatControllableCheckedItems';
 /**
  * this hook provides FlatTree API to manage all required mechanisms to convert a list of items into renderable TreeItems
  * in multiple scenarios including virtualization.
@@ -17,20 +18,26 @@ import { dataTreeItemValueAttrName } from '../utils/getTreeItemValueFromElement'
  * @param flatTreeItemProps - a list of tree items
  * @param options - in case control over the internal openItems is required
  */ export function useFlatTree_unstable(flatTreeItemProps, options = {}) {
-    const [openItems, updateOpenItems] = useOpenItemsState(options);
     const flatTreeItems = React.useMemo(()=>createFlatTreeItems(flatTreeItemProps), [
         flatTreeItemProps
     ]);
+    const [openItems, setOpenItems] = useControllableOpenItems(options);
+    const [checkedItems, setCheckedItems] = useFlatControllableCheckedItems(options);
     const [navigate, navigationRef] = useFlatTreeNavigation(flatTreeItems);
     const treeRef = React.useRef(null);
     const handleOpenChange = useEventCallback((event, data)=>{
         var _options_onOpenChange;
         (_options_onOpenChange = options.onOpenChange) === null || _options_onOpenChange === void 0 ? void 0 : _options_onOpenChange.call(options, event, data);
         if (!event.isDefaultPrevented()) {
-            updateOpenItems(data);
+            setOpenItems(createNextOpenItems(data, openItems));
         }
         event.preventDefault();
     });
+    const handleCheckedChange = useEventCallback((event, data)=>{
+        var _options_onCheckedChange;
+        (_options_onCheckedChange = options.onCheckedChange) === null || _options_onCheckedChange === void 0 ? void 0 : _options_onCheckedChange.call(options, event, data);
+        setCheckedItems(createNextFlatCheckedItems(data, checkedItems, flatTreeItems));
+    });
     const handleNavigation = useEventCallback((event, data)=>{
         var _options_onNavigation_unstable;
         (_options_onNavigation_unstable = options.onNavigation_unstable) === null || _options_onNavigation_unstable === void 0 ? void 0 : _options_onNavigation_unstable.call(options, event, data);
@@ -68,14 +75,18 @@ import { dataTreeItemValueAttrName } from '../utils/getTreeItemValueFromElement'
     const getTreeProps = React.useCallback(()=>({
             ref,
             openItems,
+            selectionMode: options.selectionMode,
+            checkedItems,
             onOpenChange: handleOpenChange,
+            onCheckedChange: handleCheckedChange,
             // eslint-disable-next-line @typescript-eslint/naming-convention
             onNavigation_unstable: handleNavigation
         }), // eslint-disable-next-line react-hooks/exhaustive-deps
     [
-        openItems
+        openItems,
+        checkedItems
     ]);
-    const items = React.useCallback(()=>VisibleFlatTreeItemGenerator(openItems, flatTreeItems), [
+    const items = React.useCallback(()=>flatTreeItems.visibleItems(openItems), [
         openItems,
         flatTreeItems
     ]);

package/lib/hooks/useFlatTree.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useFlatTree.ts"],"sourcesContent":["import { useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { createFlatTreeItems, VisibleFlatTreeItemGenerator } from '../utils/createFlatTreeItems';\nimport { treeDataTypes } from '../utils/tokens';\nimport { useFlatTreeNavigation } from './useFlatTreeNavigation';\nimport { useOpenItemsState } from './useOpenItemsState';\nimport type {\n  TreeNavigationData_unstable,\n  TreeNavigationEvent_unstable,\n  TreeOpenChangeData,\n  TreeOpenChangeEvent,\n  TreeProps,\n} from '../Tree';\nimport type { TreeItemProps, TreeItemValue } from '../TreeItem';\nimport { ImmutableSet } from '../utils/ImmutableSet';\nimport { dataTreeItemValueAttrName } from '../utils/getTreeItemValueFromElement';\n\nexport type FlatTreeItemProps = Omit<TreeItemProps, 'itemType'> &\n  Partial<Pick<TreeItemProps, 'itemType'>> & {\n    value: TreeItemValue;\n    parentValue?: TreeItemValue;\n  };\n\n/**\n * The item that is returned by `useFlatTree`, it represents a wrapper around the properties provided to\n * `useFlatTree` but with extra information that might be useful on flat tree scenarios\n */\nexport type FlatTreeItem<Props extends FlatTreeItemProps = FlatTreeItemProps> = {\n  index: number;\n  level: number;\n  childrenSize: number;\n  value: TreeItemValue;\n  parentValue: TreeItemValue | undefined;\n  getTreeItemProps(): Required<Pick<Props, 'value' | 'aria-setsize' | 'aria-level' | 'aria-posinset' | 'itemType'>> &\n    Omit<Props, 'parentId'>;\n};\n\nexport type FlatTreeProps = Required<Pick<TreeProps, 'openItems' | 'onOpenChange' | 'onNavigation_unstable'>> & {\n  ref: React.Ref<HTMLDivElement>;\n  openItems: ImmutableSet<string>;\n};\n\n/**\n * FlatTree API to manage all required mechanisms to convert a list of items into renderable TreeItems\n * in multiple scenarios including virtualization.\n *\n * !!A flat tree is an unofficial spec for tree!!\n *\n * It should be used on cases where more complex interactions with a Tree is required.\n *\n * On simple scenarios it is advised to simply use a nested structure instead.\n */\nexport type FlatTree<Props extends FlatTreeItemProps = FlatTreeItemProps> = {\n  /**\n   * returns the properties required for the Tree component to work properly.\n   * That includes:\n   * `openItems`, `onOpenChange`, `onNavigation_unstable` and `ref`\n   */\n  getTreeProps(): FlatTreeProps;\n  /**\n   * internal method used to react to an `onNavigation` event.\n   * This method ensures proper navigation on keyboard and mouse interaction.\n   * In case of virtualization it might be required to cancel default provided `onNavigation`\n   * event and then call this method manually.\n   *\n   * @example\n   * ```ts\n   * // react-window\n   * const handleNavigation = (event, data) => {\n   *   event.preventDefault();\n   *   const nextItem = tree.getNextNavigableItem(data);\n   *   // scroll to item using virtualization scroll mechanism\n   *   if (nextItem && tree.getElementFromItem(nextItem)) {\n   *     listRef.current.scrollToItem(nextItem.index);\n   *   }\n   *   // wait for scrolling to happen and then invoke navigate method\n   *   requestAnimationFrame(() => {\n   *     tree.navigate(data);\n   *   });\n   * };\n   *```\n   */\n  navigate(data: TreeNavigationData_unstable): void;\n  /**\n   * returns next item to be focused on a navigation.\n   * This method is provided to decouple the element that needs to be focused from\n   *  the action of focusing it itself.\n   *\n   * On the case of TypeAhead navigation this method returns the current item.\n   */\n  getNextNavigableItem(\n    visibleItems: FlatTreeItem<Props>[],\n    data: TreeNavigationData_unstable,\n  ): FlatTreeItem<Props> | undefined;\n  /**\n   * similar to getElementById but for FlatTreeItems\n   */\n  getElementFromItem(item: FlatTreeItem<Props>): HTMLElement | null;\n  /**\n   * an iterable containing all visually available flat tree items\n   */\n  items(): IterableIterator<FlatTreeItem<Props>>;\n};\n\ntype FlatTreeOptions = Pick<TreeProps, 'openItems' | 'defaultOpenItems' | 'onOpenChange' | 'onNavigation_unstable'>;\n\n/**\n * this hook provides FlatTree API to manage all required mechanisms to convert a list of items into renderable TreeItems\n * in multiple scenarios including virtualization.\n *\n * !!A flat tree is an unofficial spec for tree!!\n *\n * It should be used on cases where more complex interactions with a Tree is required.\n * On simple scenarios it is advised to simply use a nested structure instead.\n *\n * @param flatTreeItemProps - a list of tree items\n * @param options - in case control over the internal openItems is required\n */\nexport function useFlatTree_unstable<Props extends FlatTreeItemProps = FlatTreeItemProps>(\n  flatTreeItemProps: Props[],\n  options: FlatTreeOptions = {},\n): FlatTree<Props> {\n  const [openItems, updateOpenItems] = useOpenItemsState(options);\n  const flatTreeItems = React.useMemo(() => createFlatTreeItems(flatTreeItemProps), [flatTreeItemProps]);\n  const [navigate, navigationRef] = useFlatTreeNavigation(flatTreeItems);\n  const treeRef = React.useRef<HTMLDivElement>(null);\n\n  const handleOpenChange = useEventCallback((event: TreeOpenChangeEvent, data: TreeOpenChangeData) => {\n    options.onOpenChange?.(event, data);\n    if (!event.isDefaultPrevented()) {\n      updateOpenItems(data);\n    }\n    event.preventDefault();\n  });\n\n  const handleNavigation = useEventCallback(\n    (event: TreeNavigationEvent_unstable, data: TreeNavigationData_unstable) => {\n      options.onNavigation_unstable?.(event, data);\n      if (!event.isDefaultPrevented()) {\n        navigate(data);\n      }\n      event.preventDefault();\n    },\n  );\n\n  const getNextNavigableItem = useEventCallback(\n    (visibleItems: FlatTreeItem<Props>[], data: TreeNavigationData_unstable) => {\n      const item = flatTreeItems.get(data.value);\n      if (item) {\n        switch (data.type) {\n          case treeDataTypes.TypeAhead:\n            return item;\n          case treeDataTypes.ArrowLeft:\n            return flatTreeItems.get(item.parentValue!);\n          case treeDataTypes.ArrowRight:\n            return visibleItems[item.index + 1];\n          case treeDataTypes.End:\n            return visibleItems[visibleItems.length - 1];\n          case treeDataTypes.Home:\n            return visibleItems[0];\n          case treeDataTypes.ArrowDown:\n            return visibleItems[item.index + 1];\n          case treeDataTypes.ArrowUp:\n            return visibleItems[item.index - 1];\n        }\n      }\n    },\n  );\n\n  const getElementFromItem = React.useCallback((item: FlatTreeItem<Props>) => {\n    return treeRef.current?.querySelector(`[${dataTreeItemValueAttrName}=\"${item.value}\"]`) as HTMLElement | null;\n  }, []);\n\n  const ref = useMergedRefs(treeRef, navigationRef as React.Ref<HTMLDivElement>);\n\n  const getTreeProps = React.useCallback(\n    () => ({\n      ref,\n      openItems,\n      onOpenChange: handleOpenChange,\n      // eslint-disable-next-line @typescript-eslint/naming-convention\n      onNavigation_unstable: handleNavigation,\n    }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [openItems],\n  );\n\n  const items = React.useCallback(\n    () => VisibleFlatTreeItemGenerator(openItems, flatTreeItems),\n    [openItems, flatTreeItems],\n  );\n\n  return React.useMemo(\n    () => ({ navigate, getTreeProps, getNextNavigableItem, getElementFromItem, items }),\n    [navigate, getTreeProps, getNextNavigableItem, getElementFromItem, items],\n  );\n}\n"],"names":["useEventCallback","useMergedRefs","React","createFlatTreeItems","VisibleFlatTreeItemGenerator","treeDataTypes","useFlatTreeNavigation","useOpenItemsState","dataTreeItemValueAttrName","useFlatTree_unstable","flatTreeItemProps","options","openItems","updateOpenItems","flatTreeItems","useMemo","navigate","navigationRef","treeRef","useRef","handleOpenChange","event","data","onOpenChange","isDefaultPrevented","preventDefault","handleNavigation","onNavigation_unstable","getNextNavigableItem","visibleItems","item","get","value","type","TypeAhead","ArrowLeft","parentValue","ArrowRight","index","End","length","Home","ArrowDown","ArrowUp","getElementFromItem","useCallback","current","querySelector","ref","getTreeProps","items"],"mappings":"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"}
+{"version":3,"sources":["useFlatTree.ts"],"sourcesContent":["import { useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { createFlatTreeItems } from '../utils/createFlatTreeItems';\nimport { treeDataTypes } from '../utils/tokens';\nimport { useFlatTreeNavigation } from './useFlatTreeNavigation';\nimport { createNextOpenItems, useControllableOpenItems } from './useControllableOpenItems';\nimport type {\n  TreeCheckedChangeData,\n  TreeCheckedChangeEvent,\n  TreeNavigationData_unstable,\n  TreeNavigationEvent_unstable,\n  TreeOpenChangeData,\n  TreeOpenChangeEvent,\n  TreeProps,\n} from '../Tree';\nimport type { TreeItemProps, TreeItemValue } from '../TreeItem';\nimport { dataTreeItemValueAttrName } from '../utils/getTreeItemValueFromElement';\nimport { ImmutableSet } from '../utils/ImmutableSet';\nimport { createNextFlatCheckedItems, useFlatControllableCheckedItems } from './useFlatControllableCheckedItems';\n\nexport type FlatTreeItemProps = Omit<TreeItemProps, 'itemType' | 'value'> &\n  Partial<Pick<TreeItemProps, 'itemType'>> & {\n    value: TreeItemValue;\n    parentValue?: TreeItemValue;\n  };\n\n/**\n * The item that is returned by `useFlatTree`, it represents a wrapper around the properties provided to\n * `useFlatTree` but with extra information that might be useful on flat tree scenarios\n */\nexport type FlatTreeItem<Props extends FlatTreeItemProps = FlatTreeItemProps> = {\n  index: number;\n  level: number;\n  childrenValues: TreeItemValue[];\n  value: TreeItemValue;\n  parentValue: TreeItemValue | undefined;\n  getTreeItemProps(): Required<Pick<Props, 'value' | 'aria-setsize' | 'aria-level' | 'aria-posinset' | 'itemType'>> &\n    Omit<Props, 'parentId'>;\n};\n\nexport type FlatTreeProps = Required<\n  Pick<TreeProps, 'openItems' | 'onOpenChange' | 'onNavigation_unstable' | 'checkedItems' | 'onCheckedChange'>\n> & {\n  ref: React.Ref<HTMLDivElement>;\n  openItems: ImmutableSet<TreeItemValue>;\n};\n\n/**\n * FlatTree API to manage all required mechanisms to convert a list of items into renderable TreeItems\n * in multiple scenarios including virtualization.\n *\n * !!A flat tree is an unofficial spec for tree!!\n *\n * It should be used on cases where more complex interactions with a Tree is required.\n *\n * On simple scenarios it is advised to simply use a nested structure instead.\n */\nexport type FlatTree<Props extends FlatTreeItemProps = FlatTreeItemProps> = {\n  /**\n   * returns the properties required for the Tree component to work properly.\n   * That includes:\n   * `openItems`, `onOpenChange`, `onNavigation_unstable` and `ref`\n   */\n  getTreeProps(): FlatTreeProps;\n  /**\n   * internal method used to react to an `onNavigation` event.\n   * This method ensures proper navigation on keyboard and mouse interaction.\n   * In case of virtualization it might be required to cancel default provided `onNavigation`\n   * event and then call this method manually.\n   *\n   * @example\n   * ```ts\n   * // react-window\n   * const handleNavigation = (event, data) => {\n   *   event.preventDefault();\n   *   const nextItem = tree.getNextNavigableItem(data);\n   *   // scroll to item using virtualization scroll mechanism\n   *   if (nextItem && tree.getElementFromItem(nextItem)) {\n   *     listRef.current.scrollToItem(nextItem.index);\n   *   }\n   *   // wait for scrolling to happen and then invoke navigate method\n   *   requestAnimationFrame(() => {\n   *     tree.navigate(data);\n   *   });\n   * };\n   *```\n   */\n  navigate(data: TreeNavigationData_unstable): void;\n  /**\n   * returns next item to be focused on a navigation.\n   * This method is provided to decouple the element that needs to be focused from\n   *  the action of focusing it itself.\n   *\n   * On the case of TypeAhead navigation this method returns the current item.\n   */\n  getNextNavigableItem(\n    visibleItems: FlatTreeItem<Props>[],\n    data: TreeNavigationData_unstable,\n  ): FlatTreeItem<Props> | undefined;\n  /**\n   * similar to getElementById but for FlatTreeItems\n   */\n  getElementFromItem(item: FlatTreeItem<Props>): HTMLElement | null;\n  /**\n   * an iterable containing all visually available flat tree items\n   */\n  items(): IterableIterator<FlatTreeItem<Props>>;\n};\n\nexport type FlatTreeOptions = Pick<\n  TreeProps,\n  | 'openItems'\n  | 'defaultOpenItems'\n  | 'onOpenChange'\n  | 'onNavigation_unstable'\n  | 'selectionMode'\n  | 'checkedItems'\n  | 'defaultCheckedItems'\n  | 'onCheckedChange'\n>;\n\n/**\n * this hook provides FlatTree API to manage all required mechanisms to convert a list of items into renderable TreeItems\n * in multiple scenarios including virtualization.\n *\n * !!A flat tree is an unofficial spec for tree!!\n *\n * It should be used on cases where more complex interactions with a Tree is required.\n * On simple scenarios it is advised to simply use a nested structure instead.\n *\n * @param flatTreeItemProps - a list of tree items\n * @param options - in case control over the internal openItems is required\n */\nexport function useFlatTree_unstable<Props extends FlatTreeItemProps = FlatTreeItemProps>(\n  flatTreeItemProps: Props[],\n  options: FlatTreeOptions = {},\n): FlatTree<Props> {\n  const flatTreeItems = React.useMemo(() => createFlatTreeItems(flatTreeItemProps), [flatTreeItemProps]);\n  const [openItems, setOpenItems] = useControllableOpenItems(options);\n  const [checkedItems, setCheckedItems] = useFlatControllableCheckedItems(options);\n  const [navigate, navigationRef] = useFlatTreeNavigation(flatTreeItems);\n  const treeRef = React.useRef<HTMLDivElement>(null);\n  const handleOpenChange = useEventCallback((event: TreeOpenChangeEvent, data: TreeOpenChangeData) => {\n    options.onOpenChange?.(event, data);\n    if (!event.isDefaultPrevented()) {\n      setOpenItems(createNextOpenItems(data, openItems));\n    }\n    event.preventDefault();\n  });\n\n  const handleCheckedChange = useEventCallback((event: TreeCheckedChangeEvent, data: TreeCheckedChangeData) => {\n    options.onCheckedChange?.(event, data);\n    setCheckedItems(createNextFlatCheckedItems(data, checkedItems, flatTreeItems));\n  });\n\n  const handleNavigation = useEventCallback(\n    (event: TreeNavigationEvent_unstable, data: TreeNavigationData_unstable) => {\n      options.onNavigation_unstable?.(event, data);\n      if (!event.isDefaultPrevented()) {\n        navigate(data);\n      }\n      event.preventDefault();\n    },\n  );\n\n  const getNextNavigableItem = useEventCallback(\n    (visibleItems: FlatTreeItem<Props>[], data: TreeNavigationData_unstable) => {\n      const item = flatTreeItems.get(data.value);\n      if (item) {\n        switch (data.type) {\n          case treeDataTypes.TypeAhead:\n            return item;\n          case treeDataTypes.ArrowLeft:\n            return flatTreeItems.get(item.parentValue!);\n          case treeDataTypes.ArrowRight:\n            return visibleItems[item.index + 1];\n          case treeDataTypes.End:\n            return visibleItems[visibleItems.length - 1];\n          case treeDataTypes.Home:\n            return visibleItems[0];\n          case treeDataTypes.ArrowDown:\n            return visibleItems[item.index + 1];\n          case treeDataTypes.ArrowUp:\n            return visibleItems[item.index - 1];\n        }\n      }\n    },\n  );\n\n  const getElementFromItem = React.useCallback((item: FlatTreeItem<Props>) => {\n    return treeRef.current?.querySelector(`[${dataTreeItemValueAttrName}=\"${item.value}\"]`) as HTMLElement | null;\n  }, []);\n\n  const ref = useMergedRefs(treeRef, navigationRef as React.Ref<HTMLDivElement>);\n\n  const getTreeProps = React.useCallback(\n    () => ({\n      ref,\n      openItems,\n      selectionMode: options.selectionMode,\n      checkedItems,\n      onOpenChange: handleOpenChange,\n      onCheckedChange: handleCheckedChange,\n      // eslint-disable-next-line @typescript-eslint/naming-convention\n      onNavigation_unstable: handleNavigation,\n    }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [openItems, checkedItems],\n  );\n\n  const items = React.useCallback(() => flatTreeItems.visibleItems(openItems), [openItems, flatTreeItems]);\n\n  return React.useMemo(\n    () => ({ navigate, getTreeProps, getNextNavigableItem, getElementFromItem, items }),\n    [navigate, getTreeProps, getNextNavigableItem, getElementFromItem, items],\n  );\n}\n"],"names":["useEventCallback","useMergedRefs","React","createFlatTreeItems","treeDataTypes","useFlatTreeNavigation","createNextOpenItems","useControllableOpenItems","dataTreeItemValueAttrName","createNextFlatCheckedItems","useFlatControllableCheckedItems","useFlatTree_unstable","flatTreeItemProps","options","flatTreeItems","useMemo","openItems","setOpenItems","checkedItems","setCheckedItems","navigate","navigationRef","treeRef","useRef","handleOpenChange","event","data","onOpenChange","isDefaultPrevented","preventDefault","handleCheckedChange","onCheckedChange","handleNavigation","onNavigation_unstable","getNextNavigableItem","visibleItems","item","get","value","type","TypeAhead","ArrowLeft","parentValue","ArrowRight","index","End","length","Home","ArrowDown","ArrowUp","getElementFromItem","useCallback","current","querySelector","ref","getTreeProps","selectionMode","items"],"mappings":"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"}

package/lib/hooks/useNestedControllableCheckedItems.js

@@ -0,0 +1,107 @@
+import { useControllableState } from '@fluentui/react-utilities';
+import * as React from 'react';
+import { ImmutableMap } from '../utils/ImmutableMap';
+function initializeMap(iterable) {
+    const map = new Map();
+    if (iterable === undefined) {
+        return ImmutableMap.empty;
+    }
+    for (const item of iterable){
+        if (Array.isArray(item)) {
+            map.set(item[0], item[1]);
+        } else {
+            map.set(item, true);
+        }
+    }
+    return ImmutableMap.dangerouslyCreate_unstable(map);
+}
+export function useNestedControllableCheckedItems(props) {
+    return useControllableState({
+        initialState: ImmutableMap.empty,
+        state: React.useMemo(()=>props.checkedItems && initializeMap(props.checkedItems), [
+            props.checkedItems
+        ]),
+        defaultState: ()=>initializeMap(props.defaultCheckedItems)
+    });
+} // export function useCheckedItemsState(props: Pick<TreeProps, 'checkedItems' | 'defaultCheckedItems' | 'selectionMode'>) {
+ //   const [walkerRef, rootRef] = useHTMLElementWalkerRef(treeItemFilter);
+ //   const selections = React.useMemo(() => initializeSelection(props.checkedItems ?? []), [props.checkedItems]);
+ //   const defaultSelections = React.useMemo(
+ //     () => initializeSelection(props.defaultCheckedItems ?? []),
+ //     [props.defaultCheckedItems],
+ //   );
+ //   const [checkedSelection, checkedSelectionManager] = useSelection<TreeItemValue>({
+ //     selectionMode: props.selectionMode ?? 'single',
+ //     selectedItems: selections.checkedSelection,
+ //     defaultSelectedItems: defaultSelections.checkedSelection,
+ //   });
+ //   const [mixedSelection, setMixedSelection] = useControllableState({
+ //     initialState: ImmutableSet.empty,
+ //     defaultState: React.useMemo(
+ //       () => ImmutableSet.create(defaultSelections.mixedSelection),
+ //       [defaultSelections.mixedSelection],
+ //     ),
+ //     state: React.useMemo(() => ImmutableSet.create(selections.mixedSelection), [selections.mixedSelection]),
+ //   });
+ //   const updateCheckedItems = useEventCallback((data: TreeCheckedChangeData) => {
+ //     if (props.selectionMode === 'single') {
+ //       checkedSelectionManager.selectItem(data.value);
+ //       return;
+ //     }
+ //     if (walkerRef.current === null) {
+ //       return;
+ //     }
+ //     const nextSelectedState = !checkedSelectionManager.isSelected(data.value);
+ //     let treeItemValues = getAllSubTreeItemValues(data).add(data.value);
+ //     let mixedValues: ImmutableSet<TreeItemValue> = ImmutableSet.empty;
+ //     walkerRef.current.currentElement = data.event.currentTarget;
+ //     while (walkerRef.current.parentElement() !== null) {
+ //       const descendants = Array.from(
+ //         walkerRef.current.currentElement.querySelectorAll<HTMLElement>('[role="treeitem"]'),
+ //       ).filter(item => item.getAttribute(dataTreeItemValueAttrName) !== data.value);
+ //       const isAllSiblingsEqualSelectionState = descendants.every(item => {
+ //         return (
+ //           (item.getAttribute('aria-selected') === 'true') === nextSelectedState ||
+ //           treeItemValues.has(item.getAttribute(dataTreeItemValueAttrName) as TreeItemValue)
+ //         );
+ //       });
+ //       if (isAllSiblingsEqualSelectionState) {
+ //         treeItemValues = treeItemValues.add(
+ //           walkerRef.current.currentElement.getAttribute(dataTreeItemValueAttrName) as TreeItemValue,
+ //         );
+ //         mixedValues = mixedValues.delete(
+ //           walkerRef.current.currentElement.getAttribute(dataTreeItemValueAttrName) as TreeItemValue,
+ //         );
+ //       } else {
+ //         treeItemValues = treeItemValues
+ //           .delete(walkerRef.current.currentElement.getAttribute(dataTreeItemValueAttrName) as TreeItemValue)
+ //           .add(data.value);
+ //         mixedValues = mixedValues.add(
+ //           walkerRef.current.currentElement.getAttribute(dataTreeItemValueAttrName) as TreeItemValue,
+ //         );
+ //       }
+ //     }
+ //     unstable_batchedUpdates(() => {
+ //       nextSelectedState
+ //         ? checkedSelectionManager.selectItems(treeItemValues)
+ //         : checkedSelectionManager.deselectItems(treeItemValues);
+ //       let nextMixedSelection = ImmutableSet.create(mixedSelection);
+ //       for (const value of mixedValues) {
+ //         nextMixedSelection = nextMixedSelection.add(value);
+ //       }
+ //       for (const value of treeItemValues) {
+ //         nextMixedSelection = nextMixedSelection.delete(value);
+ //       }
+ //       setMixedSelection(nextMixedSelection);
+ //     });
+ //   });
+ //   return [checkedSelection, mixedSelection, updateCheckedItems, rootRef] as const;
+ // }
+ // function getAllSubTreeItemValues(data: TreeCheckedChangeData) {
+ //   const subTreeItems = Array.from(data.event.currentTarget.querySelectorAll('[role="treeitem"]'));
+ //   const values = new Set<TreeItemValue>();
+ //   for (const item of subTreeItems) {
+ //     values.add(item.getAttribute(dataTreeItemValueAttrName) as TreeItemValue);
+ //   }
+ //   return ImmutableSet.dangerouslyCreate(values);
+ // }

package/lib/hooks/useNestedControllableCheckedItems.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useNestedControllableCheckedItems.ts"],"sourcesContent":["import { useControllableState } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport type { TreeProps } from '../Tree';\nimport { TreeItemValue } from '../TreeItem';\nimport { ImmutableMap } from '../utils/ImmutableMap';\n\nfunction initializeMap(iterable?: Iterable<TreeItemValue | [TreeItemValue, 'mixed' | boolean]>) {\n  const map = new Map<TreeItemValue, 'mixed' | boolean>();\n  if (iterable === undefined) {\n    return ImmutableMap.empty;\n  }\n  for (const item of iterable) {\n    if (Array.isArray(item)) {\n      map.set(item[0], item[1]);\n    } else {\n      map.set(item, true);\n    }\n  }\n  return ImmutableMap.dangerouslyCreate_unstable(map);\n}\n\nexport function useNestedControllableCheckedItems(\n  props: Pick<TreeProps, 'checkedItems' | 'defaultCheckedItems' | 'selectionMode'>,\n) {\n  return useControllableState({\n    initialState: ImmutableMap.empty,\n    state: React.useMemo(() => props.checkedItems && initializeMap(props.checkedItems), [props.checkedItems]),\n    defaultState: () => initializeMap(props.defaultCheckedItems),\n  });\n}\n\n// export function useCheckedItemsState(props: Pick<TreeProps, 'checkedItems' | 'defaultCheckedItems' | 'selectionMode'>) {\n//   const [walkerRef, rootRef] = useHTMLElementWalkerRef(treeItemFilter);\n//   const selections = React.useMemo(() => initializeSelection(props.checkedItems ?? []), [props.checkedItems]);\n//   const defaultSelections = React.useMemo(\n//     () => initializeSelection(props.defaultCheckedItems ?? []),\n//     [props.defaultCheckedItems],\n//   );\n//   const [checkedSelection, checkedSelectionManager] = useSelection<TreeItemValue>({\n//     selectionMode: props.selectionMode ?? 'single',\n//     selectedItems: selections.checkedSelection,\n//     defaultSelectedItems: defaultSelections.checkedSelection,\n//   });\n//   const [mixedSelection, setMixedSelection] = useControllableState({\n//     initialState: ImmutableSet.empty,\n//     defaultState: React.useMemo(\n//       () => ImmutableSet.create(defaultSelections.mixedSelection),\n//       [defaultSelections.mixedSelection],\n//     ),\n//     state: React.useMemo(() => ImmutableSet.create(selections.mixedSelection), [selections.mixedSelection]),\n//   });\n\n//   const updateCheckedItems = useEventCallback((data: TreeCheckedChangeData) => {\n//     if (props.selectionMode === 'single') {\n//       checkedSelectionManager.selectItem(data.value);\n//       return;\n//     }\n//     if (walkerRef.current === null) {\n//       return;\n//     }\n//     const nextSelectedState = !checkedSelectionManager.isSelected(data.value);\n\n//     let treeItemValues = getAllSubTreeItemValues(data).add(data.value);\n\n//     let mixedValues: ImmutableSet<TreeItemValue> = ImmutableSet.empty;\n\n//     walkerRef.current.currentElement = data.event.currentTarget;\n//     while (walkerRef.current.parentElement() !== null) {\n//       const descendants = Array.from(\n//         walkerRef.current.currentElement.querySelectorAll<HTMLElement>('[role=\"treeitem\"]'),\n//       ).filter(item => item.getAttribute(dataTreeItemValueAttrName) !== data.value);\n//       const isAllSiblingsEqualSelectionState = descendants.every(item => {\n//         return (\n//           (item.getAttribute('aria-selected') === 'true') === nextSelectedState ||\n//           treeItemValues.has(item.getAttribute(dataTreeItemValueAttrName) as TreeItemValue)\n//         );\n//       });\n//       if (isAllSiblingsEqualSelectionState) {\n//         treeItemValues = treeItemValues.add(\n//           walkerRef.current.currentElement.getAttribute(dataTreeItemValueAttrName) as TreeItemValue,\n//         );\n//         mixedValues = mixedValues.delete(\n//           walkerRef.current.currentElement.getAttribute(dataTreeItemValueAttrName) as TreeItemValue,\n//         );\n//       } else {\n//         treeItemValues = treeItemValues\n//           .delete(walkerRef.current.currentElement.getAttribute(dataTreeItemValueAttrName) as TreeItemValue)\n//           .add(data.value);\n//         mixedValues = mixedValues.add(\n//           walkerRef.current.currentElement.getAttribute(dataTreeItemValueAttrName) as TreeItemValue,\n//         );\n//       }\n//     }\n//     unstable_batchedUpdates(() => {\n//       nextSelectedState\n//         ? checkedSelectionManager.selectItems(treeItemValues)\n//         : checkedSelectionManager.deselectItems(treeItemValues);\n//       let nextMixedSelection = ImmutableSet.create(mixedSelection);\n//       for (const value of mixedValues) {\n//         nextMixedSelection = nextMixedSelection.add(value);\n//       }\n//       for (const value of treeItemValues) {\n//         nextMixedSelection = nextMixedSelection.delete(value);\n//       }\n//       setMixedSelection(nextMixedSelection);\n//     });\n//   });\n//   return [checkedSelection, mixedSelection, updateCheckedItems, rootRef] as const;\n// }\n\n// function getAllSubTreeItemValues(data: TreeCheckedChangeData) {\n//   const subTreeItems = Array.from(data.event.currentTarget.querySelectorAll('[role=\"treeitem\"]'));\n//   const values = new Set<TreeItemValue>();\n//   for (const item of subTreeItems) {\n//     values.add(item.getAttribute(dataTreeItemValueAttrName) as TreeItemValue);\n//   }\n//   return ImmutableSet.dangerouslyCreate(values);\n// }\n"],"names":["useControllableState","React","ImmutableMap","initializeMap","iterable","map","Map","undefined","empty","item","Array","isArray","set","dangerouslyCreate_unstable","useNestedControllableCheckedItems","props","initialState","state","useMemo","checkedItems","defaultState","defaultCheckedItems"],"mappings":"AAAA,SAASA,oBAAoB,QAAQ,4BAA4B;AACjE,YAAYC,WAAW,QAAQ;AAG/B,SAASC,YAAY,QAAQ,wBAAwB;AAErD,SAASC,cAAcC,QAAuE,EAAE;IAC9F,MAAMC,MAAM,IAAIC;IAChB,IAAIF,aAAaG,WAAW;QAC1B,OAAOL,aAAaM,KAAK;IAC3B,CAAC;IACD,KAAK,MAAMC,QAAQL,SAAU;QAC3B,IAAIM,MAAMC,OAAO,CAACF,OAAO;YACvBJ,IAAIO,GAAG,CAACH,IAAI,CAAC,EAAE,EAAEA,IAAI,CAAC,EAAE;QAC1B,OAAO;YACLJ,IAAIO,GAAG,CAACH,MAAM,IAAI;QACpB,CAAC;IACH;IACA,OAAOP,aAAaW,0BAA0B,CAACR;AACjD;AAEA,OAAO,SAASS,kCACdC,KAAgF,EAChF;IACA,OAAOf,qBAAqB;QAC1BgB,cAAcd,aAAaM,KAAK;QAChCS,OAAOhB,MAAMiB,OAAO,CAAC,IAAMH,MAAMI,YAAY,IAAIhB,cAAcY,MAAMI,YAAY,GAAG;YAACJ,MAAMI,YAAY;SAAC;QACxGC,cAAc,IAAMjB,cAAcY,MAAMM,mBAAmB;IAC7D;AACF,CAAC,CAED,2HAA2H;CAC3H,0EAA0E;CAC1E,iHAAiH;CACjH,6CAA6C;CAC7C,kEAAkE;CAClE,mCAAmC;CACnC,OAAO;CACP,sFAAsF;CACtF,sDAAsD;CACtD,kDAAkD;CAClD,gEAAgE;CAChE,QAAQ;CACR,uEAAuE;CACvE,wCAAwC;CACxC,mCAAmC;CACnC,qEAAqE;CACrE,4CAA4C;CAC5C,SAAS;CACT,+GAA+G;CAC/G,QAAQ;CAER,mFAAmF;CACnF,8CAA8C;CAC9C,wDAAwD;CACxD,gBAAgB;CAChB,QAAQ;CACR,wCAAwC;CACxC,gBAAgB;CAChB,QAAQ;CACR,iFAAiF;CAEjF,0EAA0E;CAE1E,yEAAyE;CAEzE,mEAAmE;CACnE,2DAA2D;CAC3D,wCAAwC;CACxC,+FAA+F;CAC/F,uFAAuF;CACvF,6EAA6E;CAC7E,mBAAmB;CACnB,qFAAqF;CACrF,8FAA8F;CAC9F,aAAa;CACb,YAAY;CACZ,gDAAgD;CAChD,+CAA+C;CAC/C,uGAAuG;CACvG,aAAa;CACb,4CAA4C;CAC5C,uGAAuG;CACvG,aAAa;CACb,iBAAiB;CACjB,0CAA0C;CAC1C,+GAA+G;CAC/G,8BAA8B;CAC9B,yCAAyC;CACzC,uGAAuG;CACvG,aAAa;CACb,UAAU;CACV,QAAQ;CACR,sCAAsC;CACtC,0BAA0B;CAC1B,gEAAgE;CAChE,mEAAmE;CACnE,sEAAsE;CACtE,2CAA2C;CAC3C,8DAA8D;CAC9D,UAAU;CACV,8CAA8C;CAC9C,iEAAiE;CACjE,UAAU;CACV,+CAA+C;CAC/C,UAAU;CACV,QAAQ;CACR,qFAAqF;CACrF,IAAI;CAEJ,kEAAkE;CAClE,qGAAqG;CACrG,6CAA6C;CAC7C,uCAAuC;CACvC,iFAAiF;CACjF,MAAM;CACN,mDAAmD;CACnD,IAAI"}

package/lib/index.js.map

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

package/lib/utils/ImmutableMap.js

@@ -0,0 +1,37 @@
+const emptyImmutableMap = createImmutableMap();
+/**
+ * properly creates an ImmutableMap instance from an iterable
+ */ function createImmutableMap(iterable) {
+    const internalMap = new Map(iterable);
+    return dangerouslyCreateImmutableMap(internalMap);
+}
+/**
+ * Avoid using *dangerouslyCreateImmutableMap*, since this method will expose internally used set, use  createImmutableMap instead,
+ * @param internalMap - a set that is used internally to store values.
+ */ function dangerouslyCreateImmutableMap(internalMap) {
+    return {
+        size: internalMap.size,
+        set: (key, value)=>{
+            const nextSet = new Map(internalMap);
+            nextSet.set(key, value);
+            return dangerouslyCreateImmutableMap(nextSet);
+        },
+        get: (key)=>internalMap.get(key),
+        clear: ()=>emptyImmutableMap,
+        delete (value) {
+            const nextSet = new Map(internalMap);
+            nextSet.delete(value);
+            return dangerouslyCreateImmutableMap(nextSet);
+        },
+        has: (value)=>internalMap.has(value),
+        [Symbol.iterator]: ()=>internalMap[Symbol.iterator](),
+        // eslint-disable-next-line @typescript-eslint/naming-convention
+        dangerouslyGetInternalMap_unstable: ()=>internalMap
+    };
+}
+export const ImmutableMap = {
+    empty: emptyImmutableMap,
+    create: createImmutableMap,
+    // eslint-disable-next-line @typescript-eslint/naming-convention
+    dangerouslyCreate_unstable: dangerouslyCreateImmutableMap
+};

package/lib/utils/ImmutableMap.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ImmutableMap.ts"],"sourcesContent":["export interface ImmutableMap<Key, Value> {\n  clear(): ImmutableMap<Key, Value>;\n  delete(key: Key): ImmutableMap<Key, Value>;\n  /**\n   * Returns a specified element from the Map object. If the value that is associated to the provided key is an object, then you will get a reference to that object and any change made to that object will effectively modify it inside the Map.\n   * @returns Returns the element associated with the specified key. If no element is associated with the specified key, undefined is returned.\n   */\n  get(key: Key): Value | undefined;\n  /**\n   * @returns boolean indicating whether an element with the specified key exists or not.\n   */\n  has(key: Key): boolean;\n  /**\n   * Adds a new element with a specified key and value to the Map. If an element with the same key already exists, the element will be updated.\n   */\n  set(key: Key, value: Value): ImmutableMap<Key, Value>;\n  /**\n   * @returns the number of elements in the Map.\n   */\n  readonly size: number;\n  /** Iterates over entries in the Map. */\n  [Symbol.iterator](): IterableIterator<[Key, Value]>;\n  /**\n   * @internal\n   * Exposes the internal map used to store values.\n   * This is an internal API and should not be used directly.\n   */\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  dangerouslyGetInternalMap_unstable(): Map<Key, Value>;\n}\n\nconst emptyImmutableMap = createImmutableMap<never, never>();\n\n/**\n * properly creates an ImmutableMap instance from an iterable\n */\nfunction createImmutableMap<Key, Value>(iterable?: Iterable<[Key, Value]>): ImmutableMap<Key, Value> {\n  const internalMap = new Map(iterable);\n  return dangerouslyCreateImmutableMap(internalMap);\n}\n/**\n * Avoid using *dangerouslyCreateImmutableMap*, since this method will expose internally used set, use  createImmutableMap instead,\n * @param internalMap - a set that is used internally to store values.\n */\nfunction dangerouslyCreateImmutableMap<Key, Value>(internalMap: Map<Key, Value>): ImmutableMap<Key, Value> {\n  return {\n    size: internalMap.size,\n    set: (key, value) => {\n      const nextSet = new Map(internalMap);\n      nextSet.set(key, value);\n      return dangerouslyCreateImmutableMap(nextSet);\n    },\n    get: key => internalMap.get(key),\n    clear: () => emptyImmutableMap,\n    delete(value) {\n      const nextSet = new Map(internalMap);\n      nextSet.delete(value);\n      return dangerouslyCreateImmutableMap(nextSet);\n    },\n    has: value => internalMap.has(value),\n    [Symbol.iterator]: () => internalMap[Symbol.iterator](),\n    // eslint-disable-next-line @typescript-eslint/naming-convention\n    dangerouslyGetInternalMap_unstable: () => internalMap,\n  };\n}\n\nexport const ImmutableMap = {\n  empty: emptyImmutableMap,\n  create: createImmutableMap,\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  dangerouslyCreate_unstable: dangerouslyCreateImmutableMap,\n};\n"],"names":["emptyImmutableMap","createImmutableMap","iterable","internalMap","Map","dangerouslyCreateImmutableMap","size","set","key","value","nextSet","get","clear","delete","has","Symbol","iterator","dangerouslyGetInternalMap_unstable","ImmutableMap","empty","create","dangerouslyCreate_unstable"],"mappings":"AA+BA,MAAMA,oBAAoBC;AAE1B;;CAEC,GACD,SAASA,mBAA+BC,QAAiC,EAA4B;IACnG,MAAMC,cAAc,IAAIC,IAAIF;IAC5B,OAAOG,8BAA8BF;AACvC;AACA;;;CAGC,GACD,SAASE,8BAA0CF,WAA4B,EAA4B;IACzG,OAAO;QACLG,MAAMH,YAAYG,IAAI;QACtBC,KAAK,CAACC,KAAKC,QAAU;YACnB,MAAMC,UAAU,IAAIN,IAAID;YACxBO,QAAQH,GAAG,CAACC,KAAKC;YACjB,OAAOJ,8BAA8BK;QACvC;QACAC,KAAKH,CAAAA,MAAOL,YAAYQ,GAAG,CAACH;QAC5BI,OAAO,IAAMZ;QACba,QAAOJ,KAAK,EAAE;YACZ,MAAMC,UAAU,IAAIN,IAAID;YACxBO,QAAQG,MAAM,CAACJ;YACf,OAAOJ,8BAA8BK;QACvC;QACAI,KAAKL,CAAAA,QAASN,YAAYW,GAAG,CAACL;QAC9B,CAACM,OAAOC,QAAQ,CAAC,EAAE,IAAMb,WAAW,CAACY,OAAOC,QAAQ,CAAC;QACrD,gEAAgE;QAChEC,oCAAoC,IAAMd;IAC5C;AACF;AAEA,OAAO,MAAMe,eAAe;IAC1BC,OAAOnB;IACPoB,QAAQnB;IACR,gEAAgE;IAChEoB,4BAA4BhB;AAC9B,EAAE"}

package/lib/utils/ImmutableSet.js

@@ -1,14 +1,8 @@
-export const emptyImmutableSet = createImmutableSet();
-/**
- * properly creates an ImmutableSet instance from an iterable
- */ export function createImmutableSet(iterable) {
-    const internalSet = new Set(iterable);
-    return dangerouslyCreateImmutableSet(internalSet);
-}
+const emptyImmutableSet = createImmutableSet();
 /**
  * Avoid using *dangerouslyCreateImmutableSet*, since this method will expose internally used set, use  createImmutableSet instead,
  * @param internalSet - a set that is used internally to store values.
- */ export function dangerouslyCreateImmutableSet(internalSet) {
+ */ function dangerouslyCreateImmutableSet(internalSet) {
     return {
         size: internalSet.size,
         add (value) {
@@ -29,6 +23,20 @@ export const emptyImmutableSet = createImmutableSet();
         },
         [Symbol.iterator] () {
             return internalSet[Symbol.iterator]();
-        }
+        },
+        // eslint-disable-next-line @typescript-eslint/naming-convention
+        dangerouslyGetInternalSet_unstable: ()=>internalSet
     };
 }
+/**
+ * properly creates an ImmutableSet instance from an iterable
+ */ function createImmutableSet(iterable) {
+    const internalSet = new Set(iterable);
+    return dangerouslyCreateImmutableSet(internalSet);
+}
+export const ImmutableSet = {
+    empty: emptyImmutableSet,
+    create: createImmutableSet,
+    // eslint-disable-next-line @typescript-eslint/naming-convention
+    dangerouslyCreate_unstable: dangerouslyCreateImmutableSet
+};

package/lib/utils/ImmutableSet.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ImmutableSet.ts"],"sourcesContent":["export interface ImmutableSet<Value> {\n  /**\n   * The number of (unique) elements in a ImmutableSet.\n   */\n  readonly size: number;\n  /**\n   * Creates a new ImmutableSet containing all previous element plus the one provided as argument\n   * @param value - new value to be included in the new ImmutableSet instance\n   */\n  add(value: Value): ImmutableSet<Value>;\n  /**\n   * Returns a reference to ImmutableSet.emptySet\n   */\n  clear(): ImmutableSet<Value>;\n  /**\n   * Creates a new ImmutableSet with the original items and removes a specified value from the new ImmutableSet.\n   */\n  delete(value: Value): ImmutableSet<Value>;\n  /**\n   * @returns a boolean indicating whether an element with the specified value exists in the ImmutableSet or not.\n   */\n  has(value: Value): boolean;\n  /** Iterates over values in the ImmutableSet. */\n  [Symbol.iterator](): IterableIterator<Value>;\n}\n\nexport const emptyImmutableSet = createImmutableSet<never>();\n\n/**\n * properly creates an ImmutableSet instance from an iterable\n */\nexport function createImmutableSet<Value>(iterable?: Iterable<Value>): ImmutableSet<Value> {\n  const internalSet = new Set(iterable);\n  return dangerouslyCreateImmutableSet(internalSet);\n}\n/**\n * Avoid using *dangerouslyCreateImmutableSet*, since this method will expose internally used set, use  createImmutableSet instead,\n * @param internalSet - a set that is used internally to store values.\n */\nexport function dangerouslyCreateImmutableSet<Value>(internalSet: Set<Value>): ImmutableSet<Value> {\n  return {\n    size: internalSet.size,\n    add(value) {\n      const nextSet = new Set(internalSet);\n      nextSet.add(value);\n      return dangerouslyCreateImmutableSet(nextSet);\n    },\n    clear() {\n      return emptyImmutableSet;\n    },\n    delete(value) {\n      const nextSet = new Set(internalSet);\n      nextSet.delete(value);\n      return dangerouslyCreateImmutableSet(nextSet);\n    },\n    has(value) {\n      return internalSet.has(value);\n    },\n    [Symbol.iterator]() {\n      return internalSet[Symbol.iterator]();\n    },\n  };\n}\n"],"names":["emptyImmutableSet","createImmutableSet","iterable","internalSet","Set","dangerouslyCreateImmutableSet","size","add","value","nextSet","clear","delete","has","Symbol","iterator"],"mappings":"AA0BA,OAAO,MAAMA,oBAAoBC,qBAA4B;AAE7D;;CAEC,GACD,OAAO,SAASA,mBAA0BC,QAA0B,EAAuB;IACzF,MAAMC,cAAc,IAAIC,IAAIF;IAC5B,OAAOG,8BAA8BF;AACvC,CAAC;AACD;;;CAGC,GACD,OAAO,SAASE,8BAAqCF,WAAuB,EAAuB;IACjG,OAAO;QACLG,MAAMH,YAAYG,IAAI;QACtBC,KAAIC,KAAK,EAAE;YACT,MAAMC,UAAU,IAAIL,IAAID;YACxBM,QAAQF,GAAG,CAACC;YACZ,OAAOH,8BAA8BI;QACvC;QACAC,SAAQ;YACN,OAAOV;QACT;QACAW,QAAOH,KAAK,EAAE;YACZ,MAAMC,UAAU,IAAIL,IAAID;YACxBM,QAAQE,MAAM,CAACH;YACf,OAAOH,8BAA8BI;QACvC;QACAG,KAAIJ,KAAK,EAAE;YACT,OAAOL,YAAYS,GAAG,CAACJ;QACzB;QACA,CAACK,OAAOC,QAAQ,CAAC,IAAG;YAClB,OAAOX,WAAW,CAACU,OAAOC,QAAQ,CAAC;QACrC;IACF;AACF,CAAC"}
+{"version":3,"sources":["ImmutableSet.ts"],"sourcesContent":["export interface ImmutableSet<Value> {\n  /**\n   * The number of (unique) elements in a ImmutableSet.\n   */\n  readonly size: number;\n  /**\n   * Creates a new ImmutableSet containing all previous element plus the one provided as argument\n   * @param value - new value to be included in the new ImmutableSet instance\n   */\n  add(value: Value): ImmutableSet<Value>;\n  /**\n   * Returns a reference to ImmutableSet.emptySet\n   */\n  clear(): ImmutableSet<Value>;\n  /**\n   * Creates a new ImmutableSet with the original items and removes a specified value from the new ImmutableSet.\n   */\n  delete(value: Value): ImmutableSet<Value>;\n  /**\n   * @returns a boolean indicating whether an element with the specified value exists in the ImmutableSet or not.\n   */\n  has(value: Value): boolean;\n  /** Iterates over values in the ImmutableSet. */\n  [Symbol.iterator](): IterableIterator<Value>;\n  /**\n   * @internal\n   * Exposes the internal set used to store values.\n   * This is an internal API and should not be used directly.\n   */\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  dangerouslyGetInternalSet_unstable(): Set<Value>;\n}\n\nconst emptyImmutableSet = createImmutableSet<never>();\n\n/**\n * Avoid using *dangerouslyCreateImmutableSet*, since this method will expose internally used set, use  createImmutableSet instead,\n * @param internalSet - a set that is used internally to store values.\n */\nfunction dangerouslyCreateImmutableSet<Value>(internalSet: Set<Value>): ImmutableSet<Value> {\n  return {\n    size: internalSet.size,\n    add(value) {\n      const nextSet = new Set(internalSet);\n      nextSet.add(value);\n      return dangerouslyCreateImmutableSet(nextSet);\n    },\n    clear() {\n      return emptyImmutableSet;\n    },\n    delete(value) {\n      const nextSet = new Set(internalSet);\n      nextSet.delete(value);\n      return dangerouslyCreateImmutableSet(nextSet);\n    },\n    has(value) {\n      return internalSet.has(value);\n    },\n    [Symbol.iterator]() {\n      return internalSet[Symbol.iterator]();\n    },\n    // eslint-disable-next-line @typescript-eslint/naming-convention\n    dangerouslyGetInternalSet_unstable: () => internalSet,\n  };\n}\n\n/**\n * properly creates an ImmutableSet instance from an iterable\n */\nfunction createImmutableSet<Value>(iterable?: Iterable<Value>): ImmutableSet<Value> {\n  const internalSet = new Set(iterable);\n  return dangerouslyCreateImmutableSet(internalSet);\n}\n\nexport const ImmutableSet = {\n  empty: emptyImmutableSet,\n  create: createImmutableSet,\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  dangerouslyCreate_unstable: dangerouslyCreateImmutableSet,\n};\n"],"names":["emptyImmutableSet","createImmutableSet","dangerouslyCreateImmutableSet","internalSet","size","add","value","nextSet","Set","clear","delete","has","Symbol","iterator","dangerouslyGetInternalSet_unstable","iterable","ImmutableSet","empty","create","dangerouslyCreate_unstable"],"mappings":"AAiCA,MAAMA,oBAAoBC;AAE1B;;;CAGC,GACD,SAASC,8BAAqCC,WAAuB,EAAuB;IAC1F,OAAO;QACLC,MAAMD,YAAYC,IAAI;QACtBC,KAAIC,KAAK,EAAE;YACT,MAAMC,UAAU,IAAIC,IAAIL;YACxBI,QAAQF,GAAG,CAACC;YACZ,OAAOJ,8BAA8BK;QACvC;QACAE,SAAQ;YACN,OAAOT;QACT;QACAU,QAAOJ,KAAK,EAAE;YACZ,MAAMC,UAAU,IAAIC,IAAIL;YACxBI,QAAQG,MAAM,CAACJ;YACf,OAAOJ,8BAA8BK;QACvC;QACAI,KAAIL,KAAK,EAAE;YACT,OAAOH,YAAYQ,GAAG,CAACL;QACzB;QACA,CAACM,OAAOC,QAAQ,CAAC,IAAG;YAClB,OAAOV,WAAW,CAACS,OAAOC,QAAQ,CAAC;QACrC;QACA,gEAAgE;QAChEC,oCAAoC,IAAMX;IAC5C;AACF;AAEA;;CAEC,GACD,SAASF,mBAA0Bc,QAA0B,EAAuB;IAClF,MAAMZ,cAAc,IAAIK,IAAIO;IAC5B,OAAOb,8BAA8BC;AACvC;AAEA,OAAO,MAAMa,eAAe;IAC1BC,OAAOjB;IACPkB,QAAQjB;IACR,gEAAgE;IAChEkB,4BAA4BjB;AAC9B,EAAE"}

package/lib/utils/createFlatTreeItems.js

@@ -25,30 +25,38 @@
         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 flatTreeItem = {
             value: treeItemProps.value,
             getTreeItemProps: ()=>({
                     ...treeItemProps,
                     'aria-level': currentLevel,
                     'aria-posinset': currentChildrenSize,
-                    'aria-setsize': currentParent.childrenSize,
+                    'aria-setsize': currentParent.childrenValues.length,
                     itemType
                 }),
             level: currentLevel,
             parentValue,
-            childrenSize: 0,
+            childrenValues: [],
             index: -1
         };
+        const currentChildrenSize = currentParent.childrenValues.push(flatTreeItem.value);
         itemsPerValue.set(flatTreeItem.value, flatTreeItem);
         items.push(flatTreeItem);
     }
+    var _itemsPerValue_get_parentValue, _itemsPerValue_get;
     const flatTreeItems = {
         root,
         size: items.length,
         getByIndex: (index)=>items[index],
+        getParent: (key)=>{
+            var _itemsPerValue_get1;
+            return (_itemsPerValue_get = itemsPerValue.get((_itemsPerValue_get_parentValue = (_itemsPerValue_get1 = itemsPerValue.get(key)) === null || _itemsPerValue_get1 === void 0 ? void 0 : _itemsPerValue_get1.parentValue) !== null && _itemsPerValue_get_parentValue !== void 0 ? _itemsPerValue_get_parentValue : root.value)) !== null && _itemsPerValue_get !== void 0 ? _itemsPerValue_get : root;
+        },
         get: (key)=>itemsPerValue.get(key),
-        set: (key, value)=>itemsPerValue.set(key, value)
+        subtree: (key)=>FlatTreeSubtreeGenerator(key, flatTreeItems),
+        children: (key)=>FlatTreeChildrenGenerator(key, flatTreeItems),
+        ancestors: (key)=>FlatTreeAncestorsGenerator(key, flatTreeItems),
+        visibleItems: (openItems)=>VisibleFlatTreeItemGenerator(openItems, flatTreeItems)
     };
     return flatTreeItems;
 }
@@ -71,7 +79,7 @@ function createFlatTreeRootItem() {
                 itemType: 'branch'
             };
         },
-        childrenSize: 0,
+        childrenValues: [],
         get index () {
             if (process.env.NODE_ENV !== 'production') {
                 // eslint-disable-next-line no-console
@@ -82,8 +90,52 @@ function createFlatTreeRootItem() {
         level: 0
     };
 }
-// eslint-disable-next-line @typescript-eslint/naming-convention
-export function* VisibleFlatTreeItemGenerator(openItems, flatTreeItems) {
+/**
+ * Generator that returns all subtree of a given flat tree item
+ * @param key the key of the item to get the subtree from
+ */ // eslint-disable-next-line @typescript-eslint/naming-convention
+function* FlatTreeSubtreeGenerator(key, flatTreeItems) {
+    const item = flatTreeItems.get(key);
+    if (!item || item.childrenValues.length === 0) {
+        return [];
+    }
+    let counter = item.childrenValues.length;
+    let index = item.index;
+    while(counter > 0){
+        const children = flatTreeItems.getByIndex(++index);
+        yield children;
+        counter += children.childrenValues.length - 1;
+    }
+}
+/**
+ * Generator that returns all children of a given flat tree item
+ * @param key the key of the item to get the children from
+ */ // eslint-disable-next-line @typescript-eslint/naming-convention
+function* FlatTreeChildrenGenerator(key, flatTreeItems) {
+    const item = flatTreeItems.get(key);
+    if (!item || item.childrenValues.length === 0) {
+        return;
+    }
+    for (const childValue of item.childrenValues){
+        yield flatTreeItems.get(childValue);
+    }
+}
+/**
+ * Generator that returns all ancestors of a given flat tree item
+ * @param key the key of the item to get the children from
+ */ // eslint-disable-next-line @typescript-eslint/naming-convention
+function* FlatTreeAncestorsGenerator(key, flatTreeItems) {
+    let parent = flatTreeItems.getParent(key);
+    while(parent !== flatTreeItems.root){
+        yield parent;
+        parent = flatTreeItems.getParent(parent.value);
+    }
+}
+/**
+ * Generator that returns all visible items of a given flat tree
+ * @param openItems the open items of the tree
+ */ // eslint-disable-next-line @typescript-eslint/naming-convention
+function* VisibleFlatTreeItemGenerator(openItems, flatTreeItems) {
     for(let index = 0, visibleIndex = 0; index < flatTreeItems.size; index++){
         const item = flatTreeItems.getByIndex(index);
         if (isItemVisible(item, openItems, flatTreeItems)) {
@@ -91,7 +143,7 @@ export function* VisibleFlatTreeItemGenerator(openItems, flatTreeItems) {
             yield item;
         } else {
             // Jump the amount of children the current item has, since those items will also be hidden
-            index += item.childrenSize;
+            index += item.childrenValues.length;
         }
     }
 }