@fluentui/react-tree 9.4.29 → 9.4.31

package/CHANGELOG.md

@@ -1,25 +1,58 @@
 # Change Log - @fluentui/react-tree
 
-This log was last generated on Tue, 30 Jan 2024 23:12:35 GMT and should not be manually modified.
+This log was last generated on Tue, 20 Feb 2024 14:15:32 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.4.31](https://github.com/microsoft/fluentui/tree/@fluentui/react-tree_v9.4.31)
+
+Tue, 20 Feb 2024 14:15:32 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tree_v9.4.30..@fluentui/react-tree_v9.4.31)
+
+### Patches
+
+- Bump @fluentui/react-aria to v9.9.0 ([PR #30543](https://github.com/microsoft/fluentui/pull/30543) by beachball)
+- Bump @fluentui/react-avatar to v9.6.15 ([PR #30543](https://github.com/microsoft/fluentui/pull/30543) by beachball)
+- Bump @fluentui/react-button to v9.3.69 ([PR #30543](https://github.com/microsoft/fluentui/pull/30543) by beachball)
+- Bump @fluentui/react-checkbox to v9.2.13 ([PR #30543](https://github.com/microsoft/fluentui/pull/30543) by beachball)
+- Bump @fluentui/react-context-selector to v9.1.52 ([PR #30543](https://github.com/microsoft/fluentui/pull/30543) by beachball)
+- Bump @fluentui/react-radio to v9.2.8 ([PR #30543](https://github.com/microsoft/fluentui/pull/30543) by beachball)
+- Bump @fluentui/react-tabster to v9.19.1 ([PR #30543](https://github.com/microsoft/fluentui/pull/30543) by beachball)
+- Bump @fluentui/react-utilities to v9.18.1 ([PR #30543](https://github.com/microsoft/fluentui/pull/30543) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.0.30 ([PR #30543](https://github.com/microsoft/fluentui/pull/30543) by beachball)
+
+## [9.4.30](https://github.com/microsoft/fluentui/tree/@fluentui/react-tree_v9.4.30)
+
+Tue, 06 Feb 2024 17:55:20 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tree_v9.4.29..@fluentui/react-tree_v9.4.30)
+
+### Patches
+
+- bugfix: regression fix for focus and blur events on TreeItem ([PR #30436](https://github.com/microsoft/fluentui/pull/30436) by bernardo.sunderhus@gmail.com)
+- bugfix: onOpenChange inconsistent between Tree and TreeItem ([PR #30050](https://github.com/microsoft/fluentui/pull/30050) by bernardo.sunderhus@gmail.com)
+- Bump @fluentui/react-aria to v9.8.2 ([PR #30392](https://github.com/microsoft/fluentui/pull/30392) by beachball)
+- Bump @fluentui/react-avatar to v9.6.14 ([PR #30392](https://github.com/microsoft/fluentui/pull/30392) by beachball)
+- Bump @fluentui/react-button to v9.3.68 ([PR #30392](https://github.com/microsoft/fluentui/pull/30392) by beachball)
+- Bump @fluentui/react-checkbox to v9.2.12 ([PR #30392](https://github.com/microsoft/fluentui/pull/30392) by beachball)
+- Bump @fluentui/react-radio to v9.2.7 ([PR #30392](https://github.com/microsoft/fluentui/pull/30392) by beachball)
+- Bump @fluentui/react-tabster to v9.19.0 ([PR #30392](https://github.com/microsoft/fluentui/pull/30392) by beachball)
+
 ## [9.4.29](https://github.com/microsoft/fluentui/tree/@fluentui/react-tree_v9.4.29)
 
-Tue, 30 Jan 2024 23:12:35 GMT 
+Tue, 30 Jan 2024 23:16:54 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tree_v9.4.28..@fluentui/react-tree_v9.4.29)
 
 ### Patches
 
-- Bump @fluentui/react-aria to v9.8.1 ([PR #30429](https://github.com/microsoft/fluentui/pull/30429) by beachball)
-- Bump @fluentui/react-avatar to v9.6.13 ([PR #30429](https://github.com/microsoft/fluentui/pull/30429) by beachball)
-- Bump @fluentui/react-button to v9.3.67 ([PR #30429](https://github.com/microsoft/fluentui/pull/30429) by beachball)
-- Bump @fluentui/react-checkbox to v9.2.11 ([PR #30429](https://github.com/microsoft/fluentui/pull/30429) by beachball)
-- Bump @fluentui/react-context-selector to v9.1.51 ([PR #30429](https://github.com/microsoft/fluentui/pull/30429) by beachball)
-- Bump @fluentui/react-radio to v9.2.6 ([PR #30429](https://github.com/microsoft/fluentui/pull/30429) by beachball)
-- Bump @fluentui/react-tabster to v9.18.0 ([PR #30429](https://github.com/microsoft/fluentui/pull/30429) by beachball)
-- Bump @fluentui/react-utilities to v9.18.0 ([PR #30429](https://github.com/microsoft/fluentui/pull/30429) by beachball)
-- Bump @fluentui/react-jsx-runtime to v9.0.29 ([PR #30429](https://github.com/microsoft/fluentui/pull/30429) by beachball)
+- Bump @fluentui/react-aria to v9.8.1 ([PR #29983](https://github.com/microsoft/fluentui/pull/29983) by beachball)
+- Bump @fluentui/react-avatar to v9.6.13 ([PR #29983](https://github.com/microsoft/fluentui/pull/29983) by beachball)
+- Bump @fluentui/react-button to v9.3.67 ([PR #29983](https://github.com/microsoft/fluentui/pull/29983) by beachball)
+- Bump @fluentui/react-checkbox to v9.2.11 ([PR #29983](https://github.com/microsoft/fluentui/pull/29983) by beachball)
+- Bump @fluentui/react-context-selector to v9.1.51 ([PR #29983](https://github.com/microsoft/fluentui/pull/29983) by beachball)
+- Bump @fluentui/react-radio to v9.2.6 ([PR #29983](https://github.com/microsoft/fluentui/pull/29983) by beachball)
+- Bump @fluentui/react-tabster to v9.18.0 ([PR #29983](https://github.com/microsoft/fluentui/pull/29983) by beachball)
+- Bump @fluentui/react-utilities to v9.18.0 ([PR #29983](https://github.com/microsoft/fluentui/pull/29983) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.0.29 ([PR #29983](https://github.com/microsoft/fluentui/pull/29983) by beachball)
 
 ## [9.4.28](https://github.com/microsoft/fluentui/tree/@fluentui/react-tree_v9.4.28)
 

package/dist/index.d.ts

@@ -647,7 +647,7 @@ export declare const TreeItemProvider: React_2.Provider<TreeItemContextValue | u
 
 declare type TreeItemRequest = {
     itemType: TreeItemType;
-} & ((DistributiveOmit<TreeOpenChangeData, 'open' | 'openItems'> & {
+} & ((DistributiveOmit<TreeOpenChangeData, 'openItems'> & {
     requestType: 'open';
 }) | (TreeNavigationData_unstable & {
     requestType: 'navigate';

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

@@ -1 +1 @@
-{"version":3,"sources":["TreeItem.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ArrowLeft, ArrowRight, Enter } from '@fluentui/keyboard-keys';\nimport type { ComponentProps, ComponentState, ExtractSlotProps, Slot } from '@fluentui/react-utilities';\nimport type { TreeItemContextValue } from '../../contexts';\nimport type { treeItemLevelToken } from '../../utils/tokens';\n\nexport type TreeItemCSSProperties = React.CSSProperties & { [treeItemLevelToken]?: string | number };\n\nexport type TreeItemType = 'leaf' | 'branch';\n\nexport type TreeItemSlots = {\n  root: Slot<ExtractSlotProps<Slot<'div'> & { style?: TreeItemCSSProperties }>>;\n};\n\nexport type TreeItemValue = string | number;\n\nexport type TreeItemContextValues = {\n  treeItem: TreeItemContextValue;\n};\n\nexport type TreeItemOpenChangeData = {\n  open: boolean;\n  value: TreeItemValue;\n  target: HTMLElement;\n} & (\n  | { event: React.MouseEvent<HTMLElement>; type: 'ExpandIconClick' }\n  | { event: React.MouseEvent<HTMLElement>; type: 'Click' }\n  | { event: React.KeyboardEvent<HTMLElement>; type: typeof Enter }\n  | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowRight }\n  | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowLeft }\n);\n\nexport type TreeItemOpenChangeEvent = TreeItemOpenChangeData['event'];\n\n/**\n * TreeItem Props\n */\nexport type TreeItemProps = ComponentProps<Partial<TreeItemSlots>> & {\n  /**\n   * A tree item can be a leaf or a branch\n   */\n  itemType: TreeItemType;\n  /**\n   * A tree item should have a well defined value, in case one is not provided by the user by this prop\n   * one will be inferred internally.\n   */\n  value?: TreeItemValue;\n  /**\n   * Whether the tree item is in an open state\n   *\n   * This overrides the open value provided by the root tree,\n   * and ensure control of the visibility of the tree item per tree item.\n   *\n   * NOTE: controlling the open state of a tree item will not affect the open state of its children\n   */\n  open?: boolean;\n  onOpenChange?: (e: TreeItemOpenChangeEvent, data: TreeItemOpenChangeData) => void;\n  /**\n   * This property is inferred through context on a nested tree, and required for a flat tree.\n   */\n  parentValue?: TreeItemValue;\n};\n\n/**\n * State used in rendering TreeItem\n */\nexport type TreeItemState = ComponentState<TreeItemSlots> &\n  TreeItemContextValue & {\n    level: number;\n    itemType: TreeItemType;\n  };\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
+{"version":3,"sources":["TreeItem.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ArrowLeft, ArrowRight, Enter } from '@fluentui/keyboard-keys';\nimport type { ComponentProps, ComponentState, ExtractSlotProps, Slot } from '@fluentui/react-utilities';\nimport type { TreeItemContextValue } from '../../contexts';\nimport type { treeItemLevelToken } from '../../utils/tokens';\n\nexport type TreeItemCSSProperties = React.CSSProperties & { [treeItemLevelToken]?: string | number };\n\nexport type TreeItemType = 'leaf' | 'branch';\n\nexport type TreeItemSlots = {\n  root: Slot<ExtractSlotProps<Slot<'div'> & { style?: TreeItemCSSProperties }>>;\n};\n\nexport type TreeItemValue = string | number;\n\nexport type TreeItemContextValues = {\n  treeItem: TreeItemContextValue;\n};\n\nexport type TreeItemOpenChangeData = {\n  open: boolean;\n  value: TreeItemValue;\n  target: HTMLElement;\n} & (\n  | { event: React.MouseEvent<HTMLElement>; type: 'ExpandIconClick' }\n  | { event: React.MouseEvent<HTMLElement>; type: 'Click' }\n  | { event: React.KeyboardEvent<HTMLElement>; type: typeof Enter }\n  | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowRight }\n  | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowLeft }\n);\n\nexport type TreeItemOpenChangeEvent = TreeItemOpenChangeData['event'];\n\n/**\n * TreeItem Props\n */\nexport type TreeItemProps = ComponentProps<Partial<TreeItemSlots>> & {\n  /**\n   * A tree item can be a leaf or a branch\n   */\n  itemType: TreeItemType;\n  /**\n   * A tree item should have a well defined value, in case one is not provided by the user by this prop\n   * one will be inferred internally.\n   */\n  value?: TreeItemValue;\n  /**\n   * Whether the tree item is in an open state\n   *\n   * This overrides the open value provided by the root tree,\n   * and ensure control of the visibility of the tree item per tree item.\n   *\n   * NOTE: controlling the open state of a tree item will not affect the open state of its children\n   */\n  open?: boolean;\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n  onOpenChange?: (e: TreeItemOpenChangeEvent, data: TreeItemOpenChangeData) => void;\n  /**\n   * This property is inferred through context on a nested tree, and required for a flat tree.\n   */\n  parentValue?: TreeItemValue;\n};\n\n/**\n * State used in rendering TreeItem\n */\nexport type TreeItemState = ComponentState<TreeItemSlots> &\n  TreeItemContextValue & {\n    level: number;\n    itemType: TreeItemType;\n  };\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}

package/lib/components/TreeItem/useTreeItem.js

@@ -29,7 +29,7 @@ import { dataTreeItemValueAttrName } from '../../utils/getTreeItemValueFromEleme
     const internalValue = useId('fuiTreeItemValue-');
     var _props_value;
     const value = (_props_value = props.value) !== null && _props_value !== void 0 ? _props_value : internalValue;
-    const { onClick, onKeyDown, onMouseOver, onFocus, onMouseOut, onBlur, onChange, as = 'div', itemType = 'leaf', 'aria-level': level = contextLevel, ...rest } = props;
+    const { onClick, onKeyDown, onChange, as = 'div', itemType = 'leaf', 'aria-level': level = contextLevel, ...rest } = props;
     const actionsRef = React.useRef(null);
     const expandIconRef = React.useRef(null);
     const layoutRef = React.useRef(null);
@@ -40,6 +40,7 @@ import { dataTreeItemValueAttrName } from '../../utils/getTreeItemValueFromEleme
         var _props_open;
         return (_props_open = props.open) !== null && _props_open !== void 0 ? _props_open : ctx.openItems.has(value);
     });
+    const getNextOpen = ()=>itemType === 'branch' ? !open : open;
     const selectionMode = useTreeContext_unstable((ctx)=>ctx.selectionMode);
     const checked = useTreeContext_unstable((ctx)=>{
         var _ctx_checkedItems_get;
@@ -68,7 +69,7 @@ import { dataTreeItemValueAttrName } from '../../utils/getTreeItemValueFromEleme
             const data = {
                 event,
                 value,
-                open: !open,
+                open: getNextOpen(),
                 target: event.currentTarget,
                 type: isEventFromExpandIcon ? treeDataTypes.ExpandIconClick : treeDataTypes.Click
             };
@@ -128,7 +129,7 @@ import { dataTreeItemValueAttrName } from '../../utils/getTreeItemValueFromEleme
                     const data = {
                         value,
                         event,
-                        open: !open,
+                        open: getNextOpen(),
                         type: event.key,
                         target: event.currentTarget
                     };
@@ -151,7 +152,7 @@ import { dataTreeItemValueAttrName } from '../../utils/getTreeItemValueFromEleme
                 const data = {
                     value,
                     event,
-                    open: !open,
+                    open: getNextOpen(),
                     type: event.key,
                     target: event.currentTarget
                 };

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

@@ -1 +1 @@
-{"version":3,"sources":["useTreeItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport {\n  getIntrinsicElementProps,\n  useId,\n  useEventCallback,\n  slot,\n  elementContains,\n  useMergedRefs,\n} from '@fluentui/react-utilities';\nimport type { TreeItemProps, TreeItemState, TreeItemValue } from './TreeItem.types';\nimport { Space } from '@fluentui/keyboard-keys';\nimport { treeDataTypes } from '../../utils/tokens';\nimport { useTreeContext_unstable, useSubtreeContext_unstable, useTreeItemContext_unstable } from '../../contexts';\nimport { dataTreeItemValueAttrName } from '../../utils/getTreeItemValueFromElement';\n\n/**\n * Create the state required to render TreeItem.\n *\n * The returned state can be modified with hooks such as useTreeItemStyles_unstable,\n * before being passed to renderTreeItem_unstable.\n *\n * @param props - props from this instance of TreeItem\n * @param ref - reference to root HTMLElement of TreeItem\n */\nexport function useTreeItem_unstable(props: TreeItemProps, ref: React.Ref<HTMLDivElement>): TreeItemState {\n  const treeType = useTreeContext_unstable(ctx => ctx.treeType);\n  if (treeType === 'flat') {\n    warnIfNoProperPropsFlatTreeItem(props);\n  }\n  const requestTreeResponse = useTreeContext_unstable(ctx => ctx.requestTreeResponse);\n  const { level: contextLevel } = useSubtreeContext_unstable();\n  const parentValue = useTreeItemContext_unstable(ctx => props.parentValue ?? ctx.value);\n\n  // note, if the value is not externally provided,\n  // then selection and expansion will not work properly\n  const internalValue = useId('fuiTreeItemValue-');\n  const value: TreeItemValue = props.value ?? internalValue;\n\n  const {\n    onClick,\n    onKeyDown,\n    onMouseOver,\n    onFocus,\n    onMouseOut,\n    onBlur,\n    onChange,\n    as = 'div',\n    itemType = 'leaf',\n    'aria-level': level = contextLevel,\n    ...rest\n  } = props;\n\n  const actionsRef = React.useRef<HTMLDivElement>(null);\n  const expandIconRef = React.useRef<HTMLDivElement>(null);\n  const layoutRef = React.useRef<HTMLDivElement>(null);\n  const subtreeRef = React.useRef<HTMLDivElement>(null);\n  const selectionRef = React.useRef<HTMLInputElement>(null);\n  const treeItemRef = React.useRef<HTMLDivElement>(null);\n\n  const open = useTreeContext_unstable(ctx => props.open ?? ctx.openItems.has(value));\n  const selectionMode = useTreeContext_unstable(ctx => ctx.selectionMode);\n  const checked = useTreeContext_unstable(ctx => ctx.checkedItems.get(value) ?? false);\n\n  const handleClick = useEventCallback((event: React.MouseEvent<HTMLDivElement>) => {\n    onClick?.(event);\n    if (event.isDefaultPrevented()) {\n      return;\n    }\n    const isEventFromActions = actionsRef.current && elementContains(actionsRef.current, event.target as Node);\n    if (isEventFromActions) {\n      return;\n    }\n    const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target as Node);\n    if (isEventFromSubtree) {\n      return;\n    }\n    const isEventFromSelection = selectionRef.current && elementContains(selectionRef.current, event.target as Node);\n    if (isEventFromSelection) {\n      return;\n    }\n    const isEventFromExpandIcon = expandIconRef.current && elementContains(expandIconRef.current, event.target as Node);\n\n    ReactDOM.unstable_batchedUpdates(() => {\n      const data = {\n        event,\n        value,\n        open: !open,\n        target: event.currentTarget,\n        type: isEventFromExpandIcon ? treeDataTypes.ExpandIconClick : treeDataTypes.Click,\n      } as const;\n      props.onOpenChange?.(event, data);\n      requestTreeResponse({\n        ...data,\n        itemType,\n        requestType: 'open',\n      });\n      requestTreeResponse({\n        ...data,\n        itemType,\n        parentValue,\n        requestType: 'navigate',\n        type: treeDataTypes.Click,\n      });\n    });\n  });\n\n  const handleKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLDivElement>) => {\n    onKeyDown?.(event);\n    // Ignore keyboard events that do not originate from the current tree item.\n    if (event.isDefaultPrevented() || event.currentTarget !== event.target) {\n      return;\n    }\n    switch (event.key) {\n      case Space:\n        if (selectionMode !== 'none') {\n          selectionRef.current?.click();\n          // Prevents the page from scrolling down when the spacebar is pressed\n          event.preventDefault();\n        }\n        return;\n      case treeDataTypes.Enter: {\n        return event.currentTarget.click();\n      }\n      case treeDataTypes.End:\n      case treeDataTypes.Home:\n      case treeDataTypes.ArrowUp:\n      case treeDataTypes.ArrowDown:\n        return requestTreeResponse({\n          requestType: 'navigate',\n          event,\n          value,\n          itemType,\n          parentValue,\n          type: event.key,\n          target: event.currentTarget,\n        });\n      case treeDataTypes.ArrowLeft: {\n        // do not navigate to parent if the item is on the top level\n        if (level === 1 && !open) {\n          return;\n        }\n        const data = {\n          value,\n          event,\n          open: !open,\n          type: event.key,\n          target: event.currentTarget,\n        } as const;\n        if (open) {\n          props.onOpenChange?.(event, data);\n        }\n        return requestTreeResponse({\n          ...data,\n          itemType,\n          parentValue,\n          requestType: open ? 'open' : 'navigate',\n        });\n      }\n      case treeDataTypes.ArrowRight:\n        // do not navigate or open if the item is a leaf\n        if (itemType === 'leaf') {\n          return;\n        }\n        const data = {\n          value,\n          event,\n          open: !open,\n          type: event.key,\n          target: event.currentTarget,\n        } as const;\n        if (!open) {\n          props.onOpenChange?.(event, data);\n        }\n        return requestTreeResponse({\n          ...data,\n          itemType,\n          parentValue,\n          requestType: open ? 'navigate' : 'open',\n        });\n    }\n    const isTypeAheadCharacter =\n      event.key.length === 1 && event.key.match(/\\w/) && !event.altKey && !event.ctrlKey && !event.metaKey;\n    if (isTypeAheadCharacter) {\n      requestTreeResponse({\n        requestType: 'navigate',\n        event,\n        target: event.currentTarget,\n        value,\n        itemType,\n        type: treeDataTypes.TypeAhead,\n        parentValue,\n      });\n    }\n  });\n\n  const handleChange = useEventCallback((event: React.ChangeEvent<HTMLInputElement>) => {\n    onChange?.(event);\n    if (event.isDefaultPrevented()) {\n      return;\n    }\n    const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target as Node);\n    if (isEventFromSubtree) {\n      return;\n    }\n    requestTreeResponse({\n      requestType: 'selection',\n      event,\n      value,\n      itemType,\n      type: 'Change',\n      target: event.currentTarget,\n      checked: checked === 'mixed' ? true : !checked,\n    });\n  });\n\n  return {\n    value,\n    open,\n    checked,\n    subtreeRef,\n    layoutRef,\n    selectionRef,\n    expandIconRef,\n    treeItemRef,\n    actionsRef,\n    itemType,\n    level,\n    components: {\n      root: 'div',\n    },\n    // FIXME: this property is not necessary anymore, but as removing it would be a breaking change, we need to keep it as false\n    isAsideVisible: false,\n    // FIXME: this property is not necessary anymore, but as removing it would be a breaking change, we need to keep it as false\n    isActionsVisible: false,\n    root: slot.always(\n      getIntrinsicElementProps(as, {\n        tabIndex: -1,\n        [dataTreeItemValueAttrName]: value,\n        ...rest,\n        ref: useMergedRefs(ref, treeItemRef),\n        role: 'treeitem',\n        'aria-level': level,\n        'aria-checked': selectionMode === 'multiselect' ? checked : undefined,\n        // aria-selected is required according to WAI-ARIA spec\n        // https://www.w3.org/TR/wai-aria-1.1/#treeitem\n        // Casting: when selectionMode is 'single', checked is a boolean\n        'aria-selected': selectionMode === 'single' ? (checked as boolean) : 'false',\n        'aria-expanded': itemType === 'branch' ? open : undefined,\n        onClick: handleClick,\n        onKeyDown: handleKeyDown,\n        onChange: handleChange,\n      } as const),\n      { elementType: 'div' },\n    ),\n  };\n}\n\nfunction warnIfNoProperPropsFlatTreeItem(\n  props: Pick<TreeItemProps, 'aria-setsize' | 'aria-posinset' | 'aria-level' | 'parentValue'>,\n) {\n  if (process.env.NODE_ENV !== 'production') {\n    if (\n      props['aria-posinset'] === undefined ||\n      props['aria-setsize'] === undefined ||\n      props['aria-level'] === undefined ||\n      (props.parentValue === undefined && props['aria-level'] !== 1)\n    ) {\n      // eslint-disable-next-line no-console\n      console.error(/** #__DE-INDENT__ */ `\n        @fluentui/react-tree [${useTreeItem_unstable.name}]:\n        A flat treeitem must have \"aria-posinset\", \"aria-setsize\", \"aria-level\"\n        and \"parentValue\" (if \"aria-level\" > 1) to ensure a11y and navigation.\n\n        - \"aria-posinset\": the position of this treeitem in the current level of the tree.\n        - \"aria-setsize\": the number of siblings in this level of the tree.\n        - \"aria-level\": the current level of the treeitem.\n        - \"parentValue\": the \"value\" property of the parent item of this item.\n      `);\n    }\n  }\n}\n"],"names":["React","ReactDOM","getIntrinsicElementProps","useId","useEventCallback","slot","elementContains","useMergedRefs","Space","treeDataTypes","useTreeContext_unstable","useSubtreeContext_unstable","useTreeItemContext_unstable","dataTreeItemValueAttrName","useTreeItem_unstable","props","ref","treeType","ctx","warnIfNoProperPropsFlatTreeItem","requestTreeResponse","level","contextLevel","parentValue","value","internalValue","onClick","onKeyDown","onMouseOver","onFocus","onMouseOut","onBlur","onChange","as","itemType","rest","actionsRef","useRef","expandIconRef","layoutRef","subtreeRef","selectionRef","treeItemRef","open","openItems","has","selectionMode","checked","checkedItems","get","handleClick","event","isDefaultPrevented","isEventFromActions","current","target","isEventFromSubtree","isEventFromSelection","isEventFromExpandIcon","unstable_batchedUpdates","data","currentTarget","type","ExpandIconClick","Click","onOpenChange","requestType","handleKeyDown","key","click","preventDefault","Enter","End","Home","ArrowUp","ArrowDown","ArrowLeft","ArrowRight","isTypeAheadCharacter","length","match","altKey","ctrlKey","metaKey","TypeAhead","handleChange","components","root","isAsideVisible","isActionsVisible","always","tabIndex","role","undefined","elementType","process","env","NODE_ENV","console","error","name"],"mappings":"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"}
+{"version":3,"sources":["useTreeItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport {\n  getIntrinsicElementProps,\n  useId,\n  useEventCallback,\n  slot,\n  elementContains,\n  useMergedRefs,\n} from '@fluentui/react-utilities';\nimport type { TreeItemProps, TreeItemState, TreeItemValue } from './TreeItem.types';\nimport { Space } from '@fluentui/keyboard-keys';\nimport { treeDataTypes } from '../../utils/tokens';\nimport { useTreeContext_unstable, useSubtreeContext_unstable, useTreeItemContext_unstable } from '../../contexts';\nimport { dataTreeItemValueAttrName } from '../../utils/getTreeItemValueFromElement';\n\n/**\n * Create the state required to render TreeItem.\n *\n * The returned state can be modified with hooks such as useTreeItemStyles_unstable,\n * before being passed to renderTreeItem_unstable.\n *\n * @param props - props from this instance of TreeItem\n * @param ref - reference to root HTMLElement of TreeItem\n */\nexport function useTreeItem_unstable(props: TreeItemProps, ref: React.Ref<HTMLDivElement>): TreeItemState {\n  const treeType = useTreeContext_unstable(ctx => ctx.treeType);\n  if (treeType === 'flat') {\n    warnIfNoProperPropsFlatTreeItem(props);\n  }\n  const requestTreeResponse = useTreeContext_unstable(ctx => ctx.requestTreeResponse);\n  const { level: contextLevel } = useSubtreeContext_unstable();\n  const parentValue = useTreeItemContext_unstable(ctx => props.parentValue ?? ctx.value);\n\n  // note, if the value is not externally provided,\n  // then selection and expansion will not work properly\n  const internalValue = useId('fuiTreeItemValue-');\n  const value: TreeItemValue = props.value ?? internalValue;\n\n  const {\n    onClick,\n    onKeyDown,\n    onChange,\n    as = 'div',\n    itemType = 'leaf',\n    'aria-level': level = contextLevel,\n    ...rest\n  } = props;\n\n  const actionsRef = React.useRef<HTMLDivElement>(null);\n  const expandIconRef = React.useRef<HTMLDivElement>(null);\n  const layoutRef = React.useRef<HTMLDivElement>(null);\n  const subtreeRef = React.useRef<HTMLDivElement>(null);\n  const selectionRef = React.useRef<HTMLInputElement>(null);\n  const treeItemRef = React.useRef<HTMLDivElement>(null);\n\n  const open = useTreeContext_unstable(ctx => props.open ?? ctx.openItems.has(value));\n  const getNextOpen = () => (itemType === 'branch' ? !open : open);\n  const selectionMode = useTreeContext_unstable(ctx => ctx.selectionMode);\n  const checked = useTreeContext_unstable(ctx => ctx.checkedItems.get(value) ?? false);\n\n  const handleClick = useEventCallback((event: React.MouseEvent<HTMLDivElement>) => {\n    onClick?.(event);\n    if (event.isDefaultPrevented()) {\n      return;\n    }\n    const isEventFromActions = actionsRef.current && elementContains(actionsRef.current, event.target as Node);\n    if (isEventFromActions) {\n      return;\n    }\n    const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target as Node);\n    if (isEventFromSubtree) {\n      return;\n    }\n    const isEventFromSelection = selectionRef.current && elementContains(selectionRef.current, event.target as Node);\n    if (isEventFromSelection) {\n      return;\n    }\n    const isEventFromExpandIcon = expandIconRef.current && elementContains(expandIconRef.current, event.target as Node);\n\n    ReactDOM.unstable_batchedUpdates(() => {\n      const data = {\n        event,\n        value,\n        open: getNextOpen(),\n        target: event.currentTarget,\n        type: isEventFromExpandIcon ? treeDataTypes.ExpandIconClick : treeDataTypes.Click,\n      } as const;\n      props.onOpenChange?.(event, data);\n      requestTreeResponse({\n        ...data,\n        itemType,\n        requestType: 'open',\n      });\n      requestTreeResponse({\n        ...data,\n        itemType,\n        parentValue,\n        requestType: 'navigate',\n        type: treeDataTypes.Click,\n      });\n    });\n  });\n\n  const handleKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLDivElement>) => {\n    onKeyDown?.(event);\n    // Ignore keyboard events that do not originate from the current tree item.\n    if (event.isDefaultPrevented() || event.currentTarget !== event.target) {\n      return;\n    }\n    switch (event.key) {\n      case Space:\n        if (selectionMode !== 'none') {\n          selectionRef.current?.click();\n          // Prevents the page from scrolling down when the spacebar is pressed\n          event.preventDefault();\n        }\n        return;\n      case treeDataTypes.Enter: {\n        return event.currentTarget.click();\n      }\n      case treeDataTypes.End:\n      case treeDataTypes.Home:\n      case treeDataTypes.ArrowUp:\n      case treeDataTypes.ArrowDown:\n        return requestTreeResponse({\n          requestType: 'navigate',\n          event,\n          value,\n          itemType,\n          parentValue,\n          type: event.key,\n          target: event.currentTarget,\n        });\n      case treeDataTypes.ArrowLeft: {\n        // do not navigate to parent if the item is on the top level\n        if (level === 1 && !open) {\n          return;\n        }\n        const data = {\n          value,\n          event,\n          open: getNextOpen(),\n          type: event.key,\n          target: event.currentTarget,\n        } as const;\n        if (open) {\n          props.onOpenChange?.(event, data);\n        }\n        return requestTreeResponse({\n          ...data,\n          itemType,\n          parentValue,\n          requestType: open ? 'open' : 'navigate',\n        });\n      }\n      case treeDataTypes.ArrowRight:\n        // do not navigate or open if the item is a leaf\n        if (itemType === 'leaf') {\n          return;\n        }\n        const data = {\n          value,\n          event,\n          open: getNextOpen(),\n          type: event.key,\n          target: event.currentTarget,\n        } as const;\n        if (!open) {\n          props.onOpenChange?.(event, data);\n        }\n        return requestTreeResponse({\n          ...data,\n          itemType,\n          parentValue,\n          requestType: open ? 'navigate' : 'open',\n        });\n    }\n    const isTypeAheadCharacter =\n      event.key.length === 1 && event.key.match(/\\w/) && !event.altKey && !event.ctrlKey && !event.metaKey;\n    if (isTypeAheadCharacter) {\n      requestTreeResponse({\n        requestType: 'navigate',\n        event,\n        target: event.currentTarget,\n        value,\n        itemType,\n        type: treeDataTypes.TypeAhead,\n        parentValue,\n      });\n    }\n  });\n\n  const handleChange = useEventCallback((event: React.ChangeEvent<HTMLInputElement>) => {\n    onChange?.(event);\n    if (event.isDefaultPrevented()) {\n      return;\n    }\n    const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target as Node);\n    if (isEventFromSubtree) {\n      return;\n    }\n    requestTreeResponse({\n      requestType: 'selection',\n      event,\n      value,\n      itemType,\n      type: 'Change',\n      target: event.currentTarget,\n      checked: checked === 'mixed' ? true : !checked,\n    });\n  });\n\n  return {\n    value,\n    open,\n    checked,\n    subtreeRef,\n    layoutRef,\n    selectionRef,\n    expandIconRef,\n    treeItemRef,\n    actionsRef,\n    itemType,\n    level,\n    components: {\n      root: 'div',\n    },\n    // FIXME: this property is not necessary anymore, but as removing it would be a breaking change, we need to keep it as false\n    isAsideVisible: false,\n    // FIXME: this property is not necessary anymore, but as removing it would be a breaking change, we need to keep it as false\n    isActionsVisible: false,\n    root: slot.always(\n      getIntrinsicElementProps(as, {\n        tabIndex: -1,\n        [dataTreeItemValueAttrName]: value,\n        ...rest,\n        ref: useMergedRefs(ref, treeItemRef),\n        role: 'treeitem',\n        'aria-level': level,\n        'aria-checked': selectionMode === 'multiselect' ? checked : undefined,\n        // aria-selected is required according to WAI-ARIA spec\n        // https://www.w3.org/TR/wai-aria-1.1/#treeitem\n        // Casting: when selectionMode is 'single', checked is a boolean\n        'aria-selected': selectionMode === 'single' ? (checked as boolean) : 'false',\n        'aria-expanded': itemType === 'branch' ? open : undefined,\n        onClick: handleClick,\n        onKeyDown: handleKeyDown,\n        onChange: handleChange,\n      } as const),\n      { elementType: 'div' },\n    ),\n  };\n}\n\nfunction warnIfNoProperPropsFlatTreeItem(\n  props: Pick<TreeItemProps, 'aria-setsize' | 'aria-posinset' | 'aria-level' | 'parentValue'>,\n) {\n  if (process.env.NODE_ENV !== 'production') {\n    if (\n      props['aria-posinset'] === undefined ||\n      props['aria-setsize'] === undefined ||\n      props['aria-level'] === undefined ||\n      (props.parentValue === undefined && props['aria-level'] !== 1)\n    ) {\n      // eslint-disable-next-line no-console\n      console.error(/** #__DE-INDENT__ */ `\n        @fluentui/react-tree [${useTreeItem_unstable.name}]:\n        A flat treeitem must have \"aria-posinset\", \"aria-setsize\", \"aria-level\"\n        and \"parentValue\" (if \"aria-level\" > 1) to ensure a11y and navigation.\n\n        - \"aria-posinset\": the position of this treeitem in the current level of the tree.\n        - \"aria-setsize\": the number of siblings in this level of the tree.\n        - \"aria-level\": the current level of the treeitem.\n        - \"parentValue\": the \"value\" property of the parent item of this item.\n      `);\n    }\n  }\n}\n"],"names":["React","ReactDOM","getIntrinsicElementProps","useId","useEventCallback","slot","elementContains","useMergedRefs","Space","treeDataTypes","useTreeContext_unstable","useSubtreeContext_unstable","useTreeItemContext_unstable","dataTreeItemValueAttrName","useTreeItem_unstable","props","ref","treeType","ctx","warnIfNoProperPropsFlatTreeItem","requestTreeResponse","level","contextLevel","parentValue","value","internalValue","onClick","onKeyDown","onChange","as","itemType","rest","actionsRef","useRef","expandIconRef","layoutRef","subtreeRef","selectionRef","treeItemRef","open","openItems","has","getNextOpen","selectionMode","checked","checkedItems","get","handleClick","event","isDefaultPrevented","isEventFromActions","current","target","isEventFromSubtree","isEventFromSelection","isEventFromExpandIcon","unstable_batchedUpdates","data","currentTarget","type","ExpandIconClick","Click","onOpenChange","requestType","handleKeyDown","key","click","preventDefault","Enter","End","Home","ArrowUp","ArrowDown","ArrowLeft","ArrowRight","isTypeAheadCharacter","length","match","altKey","ctrlKey","metaKey","TypeAhead","handleChange","components","root","isAsideVisible","isActionsVisible","always","tabIndex","role","undefined","elementType","process","env","NODE_ENV","console","error","name"],"mappings":"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"}

package/lib/contexts/treeContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["treeContext.ts"],"sourcesContent":["import { Context, ContextSelector, createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport { TreeItemType, TreeItemValue } from '../TreeItem';\nimport type { SelectionMode, DistributiveOmit } from '@fluentui/react-utilities';\nimport { ImmutableSet } from '../utils/ImmutableSet';\nimport { ImmutableMap } from '../utils/ImmutableMap';\nimport { TreeCheckedChangeData, TreeNavigationData_unstable, TreeOpenChangeData } from '../Tree';\n\nexport type TreeContextValue = {\n  contextType?: 'root';\n  level: number;\n  treeType: 'nested' | 'flat';\n  selectionMode: 'none' | SelectionMode;\n  appearance: 'subtle' | 'subtle-alpha' | 'transparent';\n  size: 'small' | 'medium';\n  openItems: ImmutableSet<TreeItemValue>;\n  checkedItems: ImmutableMap<TreeItemValue, 'mixed' | boolean>;\n  /**\n   * requests root Tree component to respond to some tree item event,\n   */\n  requestTreeResponse(request: TreeItemRequest): void;\n};\n\nexport type TreeItemRequest = { itemType: TreeItemType } & (\n  | (DistributiveOmit<TreeOpenChangeData, 'open' | 'openItems'> & { requestType: 'open' })\n  | (TreeNavigationData_unstable & { requestType: 'navigate' })\n  | (DistributiveOmit<TreeCheckedChangeData, 'selectionMode' | 'checkedItems'> & { requestType: 'selection' })\n);\n\n/**\n * @internal\n */\nconst defaultTreeContextValue: TreeContextValue = {\n  level: 0,\n  contextType: 'root',\n  treeType: 'nested',\n  selectionMode: 'none',\n  openItems: ImmutableSet.empty,\n  checkedItems: ImmutableMap.empty,\n  requestTreeResponse: noop,\n  appearance: 'subtle',\n  size: 'medium',\n};\n\nfunction noop() {\n  /* noop */\n}\n\n/**\n * @internal\n */\nexport const TreeContext: Context<TreeContextValue> = createContext<TreeContextValue | undefined>(\n  undefined,\n) as Context<TreeContextValue>;\n\nexport const useTreeContext_unstable = <T>(selector: ContextSelector<TreeContextValue, T>): T =>\n  useContextSelector(TreeContext, (ctx = defaultTreeContextValue) => selector(ctx));\n"],"names":["createContext","useContextSelector","ImmutableSet","ImmutableMap","defaultTreeContextValue","level","contextType","treeType","selectionMode","openItems","empty","checkedItems","requestTreeResponse","noop","appearance","size","TreeContext","undefined","useTreeContext_unstable","selector","ctx"],"mappings":"AAAA,SAAmCA,aAAa,EAAEC,kBAAkB,QAAQ,mCAAmC;AAG/G,SAASC,YAAY,QAAQ,wBAAwB;AACrD,SAASC,YAAY,QAAQ,wBAAwB;AAwBrD;;CAEC,GACD,MAAMC,0BAA4C;IAChDC,OAAO;IACPC,aAAa;IACbC,UAAU;IACVC,eAAe;IACfC,WAAWP,aAAaQ,KAAK;IAC7BC,cAAcR,aAAaO,KAAK;IAChCE,qBAAqBC;IACrBC,YAAY;IACZC,MAAM;AACR;AAEA,SAASF;AACP,QAAQ,GACV;AAEA;;CAEC,GACD,OAAO,MAAMG,cAAyChB,cACpDiB,WAC6B;AAE/B,OAAO,MAAMC,0BAA0B,CAAIC,WACzClB,mBAAmBe,aAAa,CAACI,MAAMhB,uBAAuB,GAAKe,SAASC,MAAM"}
+{"version":3,"sources":["treeContext.ts"],"sourcesContent":["import { Context, ContextSelector, createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport { TreeItemType, TreeItemValue } from '../TreeItem';\nimport type { SelectionMode, DistributiveOmit } from '@fluentui/react-utilities';\nimport { ImmutableSet } from '../utils/ImmutableSet';\nimport { ImmutableMap } from '../utils/ImmutableMap';\nimport { TreeCheckedChangeData, TreeNavigationData_unstable, TreeOpenChangeData } from '../Tree';\n\nexport type TreeContextValue = {\n  contextType?: 'root';\n  level: number;\n  treeType: 'nested' | 'flat';\n  selectionMode: 'none' | SelectionMode;\n  appearance: 'subtle' | 'subtle-alpha' | 'transparent';\n  size: 'small' | 'medium';\n  openItems: ImmutableSet<TreeItemValue>;\n  checkedItems: ImmutableMap<TreeItemValue, 'mixed' | boolean>;\n  /**\n   * requests root Tree component to respond to some tree item event,\n   */\n  requestTreeResponse(request: TreeItemRequest): void;\n};\n\nexport type TreeItemRequest = { itemType: TreeItemType } & (\n  | (DistributiveOmit<TreeOpenChangeData, 'openItems'> & { requestType: 'open' })\n  | (TreeNavigationData_unstable & { requestType: 'navigate' })\n  | (DistributiveOmit<TreeCheckedChangeData, 'selectionMode' | 'checkedItems'> & { requestType: 'selection' })\n);\n\n/**\n * @internal\n */\nconst defaultTreeContextValue: TreeContextValue = {\n  level: 0,\n  contextType: 'root',\n  treeType: 'nested',\n  selectionMode: 'none',\n  openItems: ImmutableSet.empty,\n  checkedItems: ImmutableMap.empty,\n  requestTreeResponse: noop,\n  appearance: 'subtle',\n  size: 'medium',\n};\n\nfunction noop() {\n  /* noop */\n}\n\n/**\n * @internal\n */\nexport const TreeContext: Context<TreeContextValue> = createContext<TreeContextValue | undefined>(\n  undefined,\n) as Context<TreeContextValue>;\n\nexport const useTreeContext_unstable = <T>(selector: ContextSelector<TreeContextValue, T>): T =>\n  useContextSelector(TreeContext, (ctx = defaultTreeContextValue) => selector(ctx));\n"],"names":["createContext","useContextSelector","ImmutableSet","ImmutableMap","defaultTreeContextValue","level","contextType","treeType","selectionMode","openItems","empty","checkedItems","requestTreeResponse","noop","appearance","size","TreeContext","undefined","useTreeContext_unstable","selector","ctx"],"mappings":"AAAA,SAAmCA,aAAa,EAAEC,kBAAkB,QAAQ,mCAAmC;AAG/G,SAASC,YAAY,QAAQ,wBAAwB;AACrD,SAASC,YAAY,QAAQ,wBAAwB;AAwBrD;;CAEC,GACD,MAAMC,0BAA4C;IAChDC,OAAO;IACPC,aAAa;IACbC,UAAU;IACVC,eAAe;IACfC,WAAWP,aAAaQ,KAAK;IAC7BC,cAAcR,aAAaO,KAAK;IAChCE,qBAAqBC;IACrBC,YAAY;IACZC,MAAM;AACR;AAEA,SAASF;AACP,QAAQ,GACV;AAEA;;CAEC,GACD,OAAO,MAAMG,cAAyChB,cACpDiB,WAC6B;AAE/B,OAAO,MAAMC,0BAA0B,CAAIC,WACzClB,mBAAmBe,aAAa,CAACI,MAAMhB,uBAAuB,GAAKe,SAASC,MAAM"}

package/lib/hooks/useRootTree.js

@@ -20,15 +20,9 @@ import { createNextOpenItems } from './useControllableOpenItems';
     ]);
     const requestOpenChange = (request)=>{
         var _props_onOpenChange;
-        const open = request.itemType === 'branch' && !openItems.has(request.value);
-        const nextOpenItems = createNextOpenItems({
-            value: request.value,
-            open
-        }, openItems);
         (_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 ? void 0 : _props_onOpenChange.call(props, request.event, {
             ...request,
-            open,
-            openItems: nextOpenItems.dangerouslyGetInternalSet_unstable()
+            openItems: createNextOpenItems(request, openItems).dangerouslyGetInternalSet_unstable()
         });
     };
     const requestCheckedChange = (request)=>{

package/lib/hooks/useRootTree.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useRootTree.ts"],"sourcesContent":["import { getIntrinsicElementProps, useEventCallback, slot } from '@fluentui/react-utilities';\nimport type { TreeCheckedChangeData, TreeProps, TreeState } from '../Tree';\nimport * as React from 'react';\nimport { TreeContextValue, TreeItemRequest } from '../contexts/treeContext';\nimport { createOpenItems } from '../utils/createOpenItems';\nimport { createCheckedItems } from '../utils/createCheckedItems';\nimport { treeDataTypes } from '../utils/tokens';\nimport { createNextOpenItems } from './useControllableOpenItems';\n\n/**\n * Create the state required to render the root level tree.\n *\n * @param props - props from this instance of tree\n * @param ref - reference to root HTMLElement of tree\n */\nexport function useRootTree(\n  props: TreeProps,\n  ref: React.Ref<HTMLElement>,\n): Omit<TreeState & TreeContextValue, 'treeType'> {\n  warnIfNoProperPropsRootTree(props);\n\n  const { appearance = 'subtle', size = 'medium', selectionMode = 'none' } = props;\n\n  const openItems = React.useMemo(() => createOpenItems(props.openItems), [props.openItems]);\n  const checkedItems = React.useMemo(() => createCheckedItems(props.checkedItems), [props.checkedItems]);\n\n  const requestOpenChange = (request: Extract<TreeItemRequest, { requestType: 'open' }>) => {\n    const open = request.itemType === 'branch' && !openItems.has(request.value);\n    const nextOpenItems = createNextOpenItems({ value: request.value, open }, openItems);\n    props.onOpenChange?.(request.event, {\n      ...request,\n      open,\n      openItems: nextOpenItems.dangerouslyGetInternalSet_unstable(),\n    });\n  };\n\n  const requestCheckedChange = (request: Extract<TreeItemRequest, { requestType: 'selection' }>) => {\n    if (selectionMode === 'none') {\n      return;\n    }\n    props.onCheckedChange?.(request.event, {\n      ...request,\n      selectionMode,\n      checkedItems: checkedItems.dangerouslyGetInternalMap_unstable(),\n      // Casting is required here due to selection | multiselection spreading the union problem\n    } as TreeCheckedChangeData);\n  };\n\n  const requestNavigation = (request: Extract<TreeItemRequest, { requestType: 'navigate' }>) => {\n    props.onNavigation?.(request.event, request);\n    switch (request.type) {\n      case treeDataTypes.ArrowDown:\n      case treeDataTypes.ArrowUp:\n      case treeDataTypes.Home:\n      case treeDataTypes.End:\n        // stop the default behavior of the event\n        // which is to scroll the page\n        request.event.preventDefault();\n    }\n  };\n\n  const requestTreeResponse = useEventCallback((request: TreeItemRequest) => {\n    switch (request.requestType) {\n      case 'navigate':\n        return requestNavigation(request);\n      case 'open':\n        return requestOpenChange(request);\n      case 'selection':\n        return requestCheckedChange(request);\n    }\n  });\n\n  return {\n    components: { root: 'div' },\n    contextType: 'root',\n    selectionMode,\n    open: true,\n    appearance,\n    size,\n    level: 1,\n    openItems,\n    checkedItems,\n    requestTreeResponse,\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        // FIXME:\n        // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n        // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n        ref: ref as React.Ref<HTMLDivElement>,\n        role: 'tree',\n        'aria-multiselectable': selectionMode === 'multiselect' ? true : undefined,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n  };\n}\n\nfunction warnIfNoProperPropsRootTree(props: Pick<TreeProps, 'aria-label' | 'aria-labelledby'>) {\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(/* #__DE-INDENT__ */ `\n        @fluentui/react-tree [useRootTree]:\n        Tree must have either a \\`aria-label\\` or \\`aria-labelledby\\` property defined\n      `);\n    }\n  }\n}\n"],"names":["getIntrinsicElementProps","useEventCallback","slot","React","createOpenItems","createCheckedItems","treeDataTypes","createNextOpenItems","useRootTree","props","ref","warnIfNoProperPropsRootTree","appearance","size","selectionMode","openItems","useMemo","checkedItems","requestOpenChange","request","open","itemType","has","value","nextOpenItems","onOpenChange","event","dangerouslyGetInternalSet_unstable","requestCheckedChange","onCheckedChange","dangerouslyGetInternalMap_unstable","requestNavigation","onNavigation","type","ArrowDown","ArrowUp","Home","End","preventDefault","requestTreeResponse","requestType","components","root","contextType","level","always","role","undefined","elementType","process","env","NODE_ENV","console","warn"],"mappings":"AAAA,SAASA,wBAAwB,EAAEC,gBAAgB,EAAEC,IAAI,QAAQ,4BAA4B;AAE7F,YAAYC,WAAW,QAAQ;AAE/B,SAASC,eAAe,QAAQ,2BAA2B;AAC3D,SAASC,kBAAkB,QAAQ,8BAA8B;AACjE,SAASC,aAAa,QAAQ,kBAAkB;AAChD,SAASC,mBAAmB,QAAQ,6BAA6B;AAEjE;;;;;CAKC,GACD,OAAO,SAASC,YACdC,KAAgB,EAChBC,GAA2B;IAE3BC,4BAA4BF;IAE5B,MAAM,EAAEG,aAAa,QAAQ,EAAEC,OAAO,QAAQ,EAAEC,gBAAgB,MAAM,EAAE,GAAGL;IAE3E,MAAMM,YAAYZ,MAAMa,OAAO,CAAC,IAAMZ,gBAAgBK,MAAMM,SAAS,GAAG;QAACN,MAAMM,SAAS;KAAC;IACzF,MAAME,eAAed,MAAMa,OAAO,CAAC,IAAMX,mBAAmBI,MAAMQ,YAAY,GAAG;QAACR,MAAMQ,YAAY;KAAC;IAErG,MAAMC,oBAAoB,CAACC;YAGzBV;QAFA,MAAMW,OAAOD,QAAQE,QAAQ,KAAK,YAAY,CAACN,UAAUO,GAAG,CAACH,QAAQI,KAAK;QAC1E,MAAMC,gBAAgBjB,oBAAoB;YAAEgB,OAAOJ,QAAQI,KAAK;YAAEH;QAAK,GAAGL;SAC1EN,sBAAAA,MAAMgB,YAAY,cAAlBhB,0CAAAA,yBAAAA,OAAqBU,QAAQO,KAAK,EAAE;YAClC,GAAGP,OAAO;YACVC;YACAL,WAAWS,cAAcG,kCAAkC;QAC7D;IACF;IAEA,MAAMC,uBAAuB,CAACT;YAI5BV;QAHA,IAAIK,kBAAkB,QAAQ;YAC5B;QACF;SACAL,yBAAAA,MAAMoB,eAAe,cAArBpB,6CAAAA,4BAAAA,OAAwBU,QAAQO,KAAK,EAAE;YACrC,GAAGP,OAAO;YACVL;YACAG,cAAcA,aAAaa,kCAAkC;QAE/D;IACF;IAEA,MAAMC,oBAAoB,CAACZ;YACzBV;SAAAA,sBAAAA,MAAMuB,YAAY,cAAlBvB,0CAAAA,yBAAAA,OAAqBU,QAAQO,KAAK,EAAEP;QACpC,OAAQA,QAAQc,IAAI;YAClB,KAAK3B,cAAc4B,SAAS;YAC5B,KAAK5B,cAAc6B,OAAO;YAC1B,KAAK7B,cAAc8B,IAAI;YACvB,KAAK9B,cAAc+B,GAAG;gBACpB,yCAAyC;gBACzC,8BAA8B;gBAC9BlB,QAAQO,KAAK,CAACY,cAAc;QAChC;IACF;IAEA,MAAMC,sBAAsBtC,iBAAiB,CAACkB;QAC5C,OAAQA,QAAQqB,WAAW;YACzB,KAAK;gBACH,OAAOT,kBAAkBZ;YAC3B,KAAK;gBACH,OAAOD,kBAAkBC;YAC3B,KAAK;gBACH,OAAOS,qBAAqBT;QAChC;IACF;IAEA,OAAO;QACLsB,YAAY;YAAEC,MAAM;QAAM;QAC1BC,aAAa;QACb7B;QACAM,MAAM;QACNR;QACAC;QACA+B,OAAO;QACP7B;QACAE;QACAsB;QACAG,MAAMxC,KAAK2C,MAAM,CACf7C,yBAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FU,KAAKA;YACLoC,MAAM;YACN,wBAAwBhC,kBAAkB,gBAAgB,OAAOiC;YACjE,GAAGtC,KAAK;QACV,IACA;YAAEuC,aAAa;QAAM;IAEzB;AACF;AAEA,SAASrC,4BAA4BF,KAAwD;IAC3F,IAAIwC,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1C,IAAI,CAAC1C,KAAK,CAAC,aAAa,IAAI,CAACA,KAAK,CAAC,kBAAkB,EAAE;YACrD,sCAAsC;YACtC2C,QAAQC,IAAI,CAAsB,CAAC;8EAGnC,CAAC;QACH;IACF;AACF"}
+{"version":3,"sources":["useRootTree.ts"],"sourcesContent":["import { getIntrinsicElementProps, useEventCallback, slot } from '@fluentui/react-utilities';\nimport type { TreeCheckedChangeData, TreeProps, TreeState } from '../Tree';\nimport * as React from 'react';\nimport { TreeContextValue, TreeItemRequest } from '../contexts/treeContext';\nimport { createOpenItems } from '../utils/createOpenItems';\nimport { createCheckedItems } from '../utils/createCheckedItems';\nimport { treeDataTypes } from '../utils/tokens';\nimport { createNextOpenItems } from './useControllableOpenItems';\n\n/**\n * Create the state required to render the root level tree.\n *\n * @param props - props from this instance of tree\n * @param ref - reference to root HTMLElement of tree\n */\nexport function useRootTree(\n  props: TreeProps,\n  ref: React.Ref<HTMLElement>,\n): Omit<TreeState & TreeContextValue, 'treeType'> {\n  warnIfNoProperPropsRootTree(props);\n\n  const { appearance = 'subtle', size = 'medium', selectionMode = 'none' } = props;\n\n  const openItems = React.useMemo(() => createOpenItems(props.openItems), [props.openItems]);\n  const checkedItems = React.useMemo(() => createCheckedItems(props.checkedItems), [props.checkedItems]);\n\n  const requestOpenChange = (request: Extract<TreeItemRequest, { requestType: 'open' }>) => {\n    props.onOpenChange?.(request.event, {\n      ...request,\n      openItems: createNextOpenItems(request, openItems).dangerouslyGetInternalSet_unstable(),\n    });\n  };\n\n  const requestCheckedChange = (request: Extract<TreeItemRequest, { requestType: 'selection' }>) => {\n    if (selectionMode === 'none') {\n      return;\n    }\n    props.onCheckedChange?.(request.event, {\n      ...request,\n      selectionMode,\n      checkedItems: checkedItems.dangerouslyGetInternalMap_unstable(),\n      // Casting is required here due to selection | multiselection spreading the union problem\n    } as TreeCheckedChangeData);\n  };\n\n  const requestNavigation = (request: Extract<TreeItemRequest, { requestType: 'navigate' }>) => {\n    props.onNavigation?.(request.event, request);\n    switch (request.type) {\n      case treeDataTypes.ArrowDown:\n      case treeDataTypes.ArrowUp:\n      case treeDataTypes.Home:\n      case treeDataTypes.End:\n        // stop the default behavior of the event\n        // which is to scroll the page\n        request.event.preventDefault();\n    }\n  };\n\n  const requestTreeResponse = useEventCallback((request: TreeItemRequest) => {\n    switch (request.requestType) {\n      case 'navigate':\n        return requestNavigation(request);\n      case 'open':\n        return requestOpenChange(request);\n      case 'selection':\n        return requestCheckedChange(request);\n    }\n  });\n\n  return {\n    components: { root: 'div' },\n    contextType: 'root',\n    selectionMode,\n    open: true,\n    appearance,\n    size,\n    level: 1,\n    openItems,\n    checkedItems,\n    requestTreeResponse,\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        // FIXME:\n        // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n        // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n        ref: ref as React.Ref<HTMLDivElement>,\n        role: 'tree',\n        'aria-multiselectable': selectionMode === 'multiselect' ? true : undefined,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n  };\n}\n\nfunction warnIfNoProperPropsRootTree(props: Pick<TreeProps, 'aria-label' | 'aria-labelledby'>) {\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(/* #__DE-INDENT__ */ `\n        @fluentui/react-tree [useRootTree]:\n        Tree must have either a \\`aria-label\\` or \\`aria-labelledby\\` property defined\n      `);\n    }\n  }\n}\n"],"names":["getIntrinsicElementProps","useEventCallback","slot","React","createOpenItems","createCheckedItems","treeDataTypes","createNextOpenItems","useRootTree","props","ref","warnIfNoProperPropsRootTree","appearance","size","selectionMode","openItems","useMemo","checkedItems","requestOpenChange","request","onOpenChange","event","dangerouslyGetInternalSet_unstable","requestCheckedChange","onCheckedChange","dangerouslyGetInternalMap_unstable","requestNavigation","onNavigation","type","ArrowDown","ArrowUp","Home","End","preventDefault","requestTreeResponse","requestType","components","root","contextType","open","level","always","role","undefined","elementType","process","env","NODE_ENV","console","warn"],"mappings":"AAAA,SAASA,wBAAwB,EAAEC,gBAAgB,EAAEC,IAAI,QAAQ,4BAA4B;AAE7F,YAAYC,WAAW,QAAQ;AAE/B,SAASC,eAAe,QAAQ,2BAA2B;AAC3D,SAASC,kBAAkB,QAAQ,8BAA8B;AACjE,SAASC,aAAa,QAAQ,kBAAkB;AAChD,SAASC,mBAAmB,QAAQ,6BAA6B;AAEjE;;;;;CAKC,GACD,OAAO,SAASC,YACdC,KAAgB,EAChBC,GAA2B;IAE3BC,4BAA4BF;IAE5B,MAAM,EAAEG,aAAa,QAAQ,EAAEC,OAAO,QAAQ,EAAEC,gBAAgB,MAAM,EAAE,GAAGL;IAE3E,MAAMM,YAAYZ,MAAMa,OAAO,CAAC,IAAMZ,gBAAgBK,MAAMM,SAAS,GAAG;QAACN,MAAMM,SAAS;KAAC;IACzF,MAAME,eAAed,MAAMa,OAAO,CAAC,IAAMX,mBAAmBI,MAAMQ,YAAY,GAAG;QAACR,MAAMQ,YAAY;KAAC;IAErG,MAAMC,oBAAoB,CAACC;YACzBV;SAAAA,sBAAAA,MAAMW,YAAY,cAAlBX,0CAAAA,yBAAAA,OAAqBU,QAAQE,KAAK,EAAE;YAClC,GAAGF,OAAO;YACVJ,WAAWR,oBAAoBY,SAASJ,WAAWO,kCAAkC;QACvF;IACF;IAEA,MAAMC,uBAAuB,CAACJ;YAI5BV;QAHA,IAAIK,kBAAkB,QAAQ;YAC5B;QACF;SACAL,yBAAAA,MAAMe,eAAe,cAArBf,6CAAAA,4BAAAA,OAAwBU,QAAQE,KAAK,EAAE;YACrC,GAAGF,OAAO;YACVL;YACAG,cAAcA,aAAaQ,kCAAkC;QAE/D;IACF;IAEA,MAAMC,oBAAoB,CAACP;YACzBV;SAAAA,sBAAAA,MAAMkB,YAAY,cAAlBlB,0CAAAA,yBAAAA,OAAqBU,QAAQE,KAAK,EAAEF;QACpC,OAAQA,QAAQS,IAAI;YAClB,KAAKtB,cAAcuB,SAAS;YAC5B,KAAKvB,cAAcwB,OAAO;YAC1B,KAAKxB,cAAcyB,IAAI;YACvB,KAAKzB,cAAc0B,GAAG;gBACpB,yCAAyC;gBACzC,8BAA8B;gBAC9Bb,QAAQE,KAAK,CAACY,cAAc;QAChC;IACF;IAEA,MAAMC,sBAAsBjC,iBAAiB,CAACkB;QAC5C,OAAQA,QAAQgB,WAAW;YACzB,KAAK;gBACH,OAAOT,kBAAkBP;YAC3B,KAAK;gBACH,OAAOD,kBAAkBC;YAC3B,KAAK;gBACH,OAAOI,qBAAqBJ;QAChC;IACF;IAEA,OAAO;QACLiB,YAAY;YAAEC,MAAM;QAAM;QAC1BC,aAAa;QACbxB;QACAyB,MAAM;QACN3B;QACAC;QACA2B,OAAO;QACPzB;QACAE;QACAiB;QACAG,MAAMnC,KAAKuC,MAAM,CACfzC,yBAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FU,KAAKA;YACLgC,MAAM;YACN,wBAAwB5B,kBAAkB,gBAAgB,OAAO6B;YACjE,GAAGlC,KAAK;QACV,IACA;YAAEmC,aAAa;QAAM;IAEzB;AACF;AAEA,SAASjC,4BAA4BF,KAAwD;IAC3F,IAAIoC,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1C,IAAI,CAACtC,KAAK,CAAC,aAAa,IAAI,CAACA,KAAK,CAAC,kBAAkB,EAAE;YACrD,sCAAsC;YACtCuC,QAAQC,IAAI,CAAsB,CAAC;8EAGnC,CAAC;QACH;IACF;AACF"}

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

@@ -32,7 +32,7 @@ function useTreeItem_unstable(props, ref) {
     const internalValue = (0, _reactutilities.useId)('fuiTreeItemValue-');
     var _props_value;
     const value = (_props_value = props.value) !== null && _props_value !== void 0 ? _props_value : internalValue;
-    const { onClick, onKeyDown, onMouseOver, onFocus, onMouseOut, onBlur, onChange, as = 'div', itemType = 'leaf', 'aria-level': level = contextLevel, ...rest } = props;
+    const { onClick, onKeyDown, onChange, as = 'div', itemType = 'leaf', 'aria-level': level = contextLevel, ...rest } = props;
     const actionsRef = _react.useRef(null);
     const expandIconRef = _react.useRef(null);
     const layoutRef = _react.useRef(null);
@@ -43,6 +43,7 @@ function useTreeItem_unstable(props, ref) {
         var _props_open;
         return (_props_open = props.open) !== null && _props_open !== void 0 ? _props_open : ctx.openItems.has(value);
     });
+    const getNextOpen = ()=>itemType === 'branch' ? !open : open;
     const selectionMode = (0, _contexts.useTreeContext_unstable)((ctx)=>ctx.selectionMode);
     const checked = (0, _contexts.useTreeContext_unstable)((ctx)=>{
         var _ctx_checkedItems_get;
@@ -71,7 +72,7 @@ function useTreeItem_unstable(props, ref) {
             const data = {
                 event,
                 value,
-                open: !open,
+                open: getNextOpen(),
                 target: event.currentTarget,
                 type: isEventFromExpandIcon ? _tokens.treeDataTypes.ExpandIconClick : _tokens.treeDataTypes.Click
             };
@@ -131,7 +132,7 @@ function useTreeItem_unstable(props, ref) {
                     const data = {
                         value,
                         event,
-                        open: !open,
+                        open: getNextOpen(),
                         type: event.key,
                         target: event.currentTarget
                     };
@@ -154,7 +155,7 @@ function useTreeItem_unstable(props, ref) {
                 const data = {
                     value,
                     event,
-                    open: !open,
+                    open: getNextOpen(),
                     type: event.key,
                     target: event.currentTarget
                 };

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

@@ -1 +1 @@
-{"version":3,"sources":["useTreeItem.js"],"sourcesContent":["import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { getIntrinsicElementProps, useId, useEventCallback, slot, elementContains, useMergedRefs } from '@fluentui/react-utilities';\nimport { Space } from '@fluentui/keyboard-keys';\nimport { treeDataTypes } from '../../utils/tokens';\nimport { useTreeContext_unstable, useSubtreeContext_unstable, useTreeItemContext_unstable } from '../../contexts';\nimport { dataTreeItemValueAttrName } from '../../utils/getTreeItemValueFromElement';\n/**\n * Create the state required to render TreeItem.\n *\n * The returned state can be modified with hooks such as useTreeItemStyles_unstable,\n * before being passed to renderTreeItem_unstable.\n *\n * @param props - props from this instance of TreeItem\n * @param ref - reference to root HTMLElement of TreeItem\n */ export function useTreeItem_unstable(props, ref) {\n    const treeType = useTreeContext_unstable((ctx)=>ctx.treeType);\n    if (treeType === 'flat') {\n        warnIfNoProperPropsFlatTreeItem(props);\n    }\n    const requestTreeResponse = useTreeContext_unstable((ctx)=>ctx.requestTreeResponse);\n    const { level: contextLevel } = useSubtreeContext_unstable();\n    const parentValue = useTreeItemContext_unstable((ctx)=>{\n        var _props_parentValue;\n        return (_props_parentValue = props.parentValue) !== null && _props_parentValue !== void 0 ? _props_parentValue : ctx.value;\n    });\n    // note, if the value is not externally provided,\n    // then selection and expansion will not work properly\n    const internalValue = useId('fuiTreeItemValue-');\n    var _props_value;\n    const value = (_props_value = props.value) !== null && _props_value !== void 0 ? _props_value : internalValue;\n    const { onClick, onKeyDown, onMouseOver, onFocus, onMouseOut, onBlur, onChange, as = 'div', itemType = 'leaf', 'aria-level': level = contextLevel, ...rest } = props;\n    const actionsRef = React.useRef(null);\n    const expandIconRef = React.useRef(null);\n    const layoutRef = React.useRef(null);\n    const subtreeRef = React.useRef(null);\n    const selectionRef = React.useRef(null);\n    const treeItemRef = React.useRef(null);\n    const open = useTreeContext_unstable((ctx)=>{\n        var _props_open;\n        return (_props_open = props.open) !== null && _props_open !== void 0 ? _props_open : ctx.openItems.has(value);\n    });\n    const selectionMode = useTreeContext_unstable((ctx)=>ctx.selectionMode);\n    const checked = useTreeContext_unstable((ctx)=>{\n        var _ctx_checkedItems_get;\n        return (_ctx_checkedItems_get = ctx.checkedItems.get(value)) !== null && _ctx_checkedItems_get !== void 0 ? _ctx_checkedItems_get : false;\n    });\n    const handleClick = useEventCallback((event)=>{\n        onClick === null || onClick === void 0 ? void 0 : onClick(event);\n        if (event.isDefaultPrevented()) {\n            return;\n        }\n        const isEventFromActions = actionsRef.current && elementContains(actionsRef.current, event.target);\n        if (isEventFromActions) {\n            return;\n        }\n        const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target);\n        if (isEventFromSubtree) {\n            return;\n        }\n        const isEventFromSelection = selectionRef.current && elementContains(selectionRef.current, event.target);\n        if (isEventFromSelection) {\n            return;\n        }\n        const isEventFromExpandIcon = expandIconRef.current && elementContains(expandIconRef.current, event.target);\n        ReactDOM.unstable_batchedUpdates(()=>{\n            var _props_onOpenChange;\n            const data = {\n                event,\n                value,\n                open: !open,\n                target: event.currentTarget,\n                type: isEventFromExpandIcon ? treeDataTypes.ExpandIconClick : treeDataTypes.Click\n            };\n            (_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 ? void 0 : _props_onOpenChange.call(props, event, data);\n            requestTreeResponse({\n                ...data,\n                itemType,\n                requestType: 'open'\n            });\n            requestTreeResponse({\n                ...data,\n                itemType,\n                parentValue,\n                requestType: 'navigate',\n                type: treeDataTypes.Click\n            });\n        });\n    });\n    const handleKeyDown = useEventCallback((event)=>{\n        onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);\n        // Ignore keyboard events that do not originate from the current tree item.\n        if (event.isDefaultPrevented() || event.currentTarget !== event.target) {\n            return;\n        }\n        switch(event.key){\n            case Space:\n                if (selectionMode !== 'none') {\n                    var _selectionRef_current;\n                    (_selectionRef_current = selectionRef.current) === null || _selectionRef_current === void 0 ? void 0 : _selectionRef_current.click();\n                    // Prevents the page from scrolling down when the spacebar is pressed\n                    event.preventDefault();\n                }\n                return;\n            case treeDataTypes.Enter:\n                {\n                    return event.currentTarget.click();\n                }\n            case treeDataTypes.End:\n            case treeDataTypes.Home:\n            case treeDataTypes.ArrowUp:\n            case treeDataTypes.ArrowDown:\n                return requestTreeResponse({\n                    requestType: 'navigate',\n                    event,\n                    value,\n                    itemType,\n                    parentValue,\n                    type: event.key,\n                    target: event.currentTarget\n                });\n            case treeDataTypes.ArrowLeft:\n                {\n                    // do not navigate to parent if the item is on the top level\n                    if (level === 1 && !open) {\n                        return;\n                    }\n                    const data = {\n                        value,\n                        event,\n                        open: !open,\n                        type: event.key,\n                        target: event.currentTarget\n                    };\n                    if (open) {\n                        var _props_onOpenChange;\n                        (_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 ? void 0 : _props_onOpenChange.call(props, event, data);\n                    }\n                    return requestTreeResponse({\n                        ...data,\n                        itemType,\n                        parentValue,\n                        requestType: open ? 'open' : 'navigate'\n                    });\n                }\n            case treeDataTypes.ArrowRight:\n                // do not navigate or open if the item is a leaf\n                if (itemType === 'leaf') {\n                    return;\n                }\n                const data = {\n                    value,\n                    event,\n                    open: !open,\n                    type: event.key,\n                    target: event.currentTarget\n                };\n                if (!open) {\n                    var _props_onOpenChange1;\n                    (_props_onOpenChange1 = props.onOpenChange) === null || _props_onOpenChange1 === void 0 ? void 0 : _props_onOpenChange1.call(props, event, data);\n                }\n                return requestTreeResponse({\n                    ...data,\n                    itemType,\n                    parentValue,\n                    requestType: open ? 'navigate' : 'open'\n                });\n        }\n        const isTypeAheadCharacter = event.key.length === 1 && event.key.match(/\\w/) && !event.altKey && !event.ctrlKey && !event.metaKey;\n        if (isTypeAheadCharacter) {\n            requestTreeResponse({\n                requestType: 'navigate',\n                event,\n                target: event.currentTarget,\n                value,\n                itemType,\n                type: treeDataTypes.TypeAhead,\n                parentValue\n            });\n        }\n    });\n    const handleChange = useEventCallback((event)=>{\n        onChange === null || onChange === void 0 ? void 0 : onChange(event);\n        if (event.isDefaultPrevented()) {\n            return;\n        }\n        const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target);\n        if (isEventFromSubtree) {\n            return;\n        }\n        requestTreeResponse({\n            requestType: 'selection',\n            event,\n            value,\n            itemType,\n            type: 'Change',\n            target: event.currentTarget,\n            checked: checked === 'mixed' ? true : !checked\n        });\n    });\n    return {\n        value,\n        open,\n        checked,\n        subtreeRef,\n        layoutRef,\n        selectionRef,\n        expandIconRef,\n        treeItemRef,\n        actionsRef,\n        itemType,\n        level,\n        components: {\n            root: 'div'\n        },\n        // FIXME: this property is not necessary anymore, but as removing it would be a breaking change, we need to keep it as false\n        isAsideVisible: false,\n        // FIXME: this property is not necessary anymore, but as removing it would be a breaking change, we need to keep it as false\n        isActionsVisible: false,\n        root: slot.always(getIntrinsicElementProps(as, {\n            tabIndex: -1,\n            [dataTreeItemValueAttrName]: value,\n            ...rest,\n            ref: useMergedRefs(ref, treeItemRef),\n            role: 'treeitem',\n            'aria-level': level,\n            'aria-checked': selectionMode === 'multiselect' ? checked : undefined,\n            // aria-selected is required according to WAI-ARIA spec\n            // https://www.w3.org/TR/wai-aria-1.1/#treeitem\n            // Casting: when selectionMode is 'single', checked is a boolean\n            'aria-selected': selectionMode === 'single' ? checked : 'false',\n            'aria-expanded': itemType === 'branch' ? open : undefined,\n            onClick: handleClick,\n            onKeyDown: handleKeyDown,\n            onChange: handleChange\n        }), {\n            elementType: 'div'\n        })\n    };\n}\nfunction warnIfNoProperPropsFlatTreeItem(props) {\n    if (process.env.NODE_ENV !== 'production') {\n        if (props['aria-posinset'] === undefined || props['aria-setsize'] === undefined || props['aria-level'] === undefined || props.parentValue === undefined && props['aria-level'] !== 1) {\n            // eslint-disable-next-line no-console\n            console.error(`@fluentui/react-tree [${useTreeItem_unstable.name}]:\nA flat treeitem must have \"aria-posinset\", \"aria-setsize\", \"aria-level\"\nand \"parentValue\" (if \"aria-level\" > 1) to ensure a11y and navigation.\n\n- \"aria-posinset\": the position of this treeitem in the current level of the tree.\n- \"aria-setsize\": the number of siblings in this level of the tree.\n- \"aria-level\": the current level of the treeitem.\n- \"parentValue\": the \"value\" property of the parent item of this item.`);\n        }\n    }\n}\n"],"names":["useTreeItem_unstable","props","ref","treeType","useTreeContext_unstable","ctx","warnIfNoProperPropsFlatTreeItem","requestTreeResponse","level","contextLevel","useSubtreeContext_unstable","parentValue","useTreeItemContext_unstable","_props_parentValue","value","internalValue","useId","_props_value","onClick","onKeyDown","onMouseOver","onFocus","onMouseOut","onBlur","onChange","as","itemType","rest","actionsRef","React","useRef","expandIconRef","layoutRef","subtreeRef","selectionRef","treeItemRef","open","_props_open","openItems","has","selectionMode","checked","_ctx_checkedItems_get","checkedItems","get","handleClick","useEventCallback","event","isDefaultPrevented","isEventFromActions","current","elementContains","target","isEventFromSubtree","isEventFromSelection","isEventFromExpandIcon","ReactDOM","unstable_batchedUpdates","_props_onOpenChange","data","currentTarget","type","treeDataTypes","ExpandIconClick","Click","onOpenChange","call","requestType","handleKeyDown","key","Space","_selectionRef_current","click","preventDefault","Enter","End","Home","ArrowUp","ArrowDown","ArrowLeft","ArrowRight","_props_onOpenChange1","isTypeAheadCharacter","length","match","altKey","ctrlKey","metaKey","TypeAhead","handleChange","components","root","isAsideVisible","isActionsVisible","slot","always","getIntrinsicElementProps","tabIndex","dataTreeItemValueAttrName","useMergedRefs","role","undefined","elementType","process","env","NODE_ENV","console","error","name"],"mappings":"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"}
+{"version":3,"sources":["useTreeItem.js"],"sourcesContent":["import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { getIntrinsicElementProps, useId, useEventCallback, slot, elementContains, useMergedRefs } from '@fluentui/react-utilities';\nimport { Space } from '@fluentui/keyboard-keys';\nimport { treeDataTypes } from '../../utils/tokens';\nimport { useTreeContext_unstable, useSubtreeContext_unstable, useTreeItemContext_unstable } from '../../contexts';\nimport { dataTreeItemValueAttrName } from '../../utils/getTreeItemValueFromElement';\n/**\n * Create the state required to render TreeItem.\n *\n * The returned state can be modified with hooks such as useTreeItemStyles_unstable,\n * before being passed to renderTreeItem_unstable.\n *\n * @param props - props from this instance of TreeItem\n * @param ref - reference to root HTMLElement of TreeItem\n */ export function useTreeItem_unstable(props, ref) {\n    const treeType = useTreeContext_unstable((ctx)=>ctx.treeType);\n    if (treeType === 'flat') {\n        warnIfNoProperPropsFlatTreeItem(props);\n    }\n    const requestTreeResponse = useTreeContext_unstable((ctx)=>ctx.requestTreeResponse);\n    const { level: contextLevel } = useSubtreeContext_unstable();\n    const parentValue = useTreeItemContext_unstable((ctx)=>{\n        var _props_parentValue;\n        return (_props_parentValue = props.parentValue) !== null && _props_parentValue !== void 0 ? _props_parentValue : ctx.value;\n    });\n    // note, if the value is not externally provided,\n    // then selection and expansion will not work properly\n    const internalValue = useId('fuiTreeItemValue-');\n    var _props_value;\n    const value = (_props_value = props.value) !== null && _props_value !== void 0 ? _props_value : internalValue;\n    const { onClick, onKeyDown, onChange, as = 'div', itemType = 'leaf', 'aria-level': level = contextLevel, ...rest } = props;\n    const actionsRef = React.useRef(null);\n    const expandIconRef = React.useRef(null);\n    const layoutRef = React.useRef(null);\n    const subtreeRef = React.useRef(null);\n    const selectionRef = React.useRef(null);\n    const treeItemRef = React.useRef(null);\n    const open = useTreeContext_unstable((ctx)=>{\n        var _props_open;\n        return (_props_open = props.open) !== null && _props_open !== void 0 ? _props_open : ctx.openItems.has(value);\n    });\n    const getNextOpen = ()=>itemType === 'branch' ? !open : open;\n    const selectionMode = useTreeContext_unstable((ctx)=>ctx.selectionMode);\n    const checked = useTreeContext_unstable((ctx)=>{\n        var _ctx_checkedItems_get;\n        return (_ctx_checkedItems_get = ctx.checkedItems.get(value)) !== null && _ctx_checkedItems_get !== void 0 ? _ctx_checkedItems_get : false;\n    });\n    const handleClick = useEventCallback((event)=>{\n        onClick === null || onClick === void 0 ? void 0 : onClick(event);\n        if (event.isDefaultPrevented()) {\n            return;\n        }\n        const isEventFromActions = actionsRef.current && elementContains(actionsRef.current, event.target);\n        if (isEventFromActions) {\n            return;\n        }\n        const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target);\n        if (isEventFromSubtree) {\n            return;\n        }\n        const isEventFromSelection = selectionRef.current && elementContains(selectionRef.current, event.target);\n        if (isEventFromSelection) {\n            return;\n        }\n        const isEventFromExpandIcon = expandIconRef.current && elementContains(expandIconRef.current, event.target);\n        ReactDOM.unstable_batchedUpdates(()=>{\n            var _props_onOpenChange;\n            const data = {\n                event,\n                value,\n                open: getNextOpen(),\n                target: event.currentTarget,\n                type: isEventFromExpandIcon ? treeDataTypes.ExpandIconClick : treeDataTypes.Click\n            };\n            (_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 ? void 0 : _props_onOpenChange.call(props, event, data);\n            requestTreeResponse({\n                ...data,\n                itemType,\n                requestType: 'open'\n            });\n            requestTreeResponse({\n                ...data,\n                itemType,\n                parentValue,\n                requestType: 'navigate',\n                type: treeDataTypes.Click\n            });\n        });\n    });\n    const handleKeyDown = useEventCallback((event)=>{\n        onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);\n        // Ignore keyboard events that do not originate from the current tree item.\n        if (event.isDefaultPrevented() || event.currentTarget !== event.target) {\n            return;\n        }\n        switch(event.key){\n            case Space:\n                if (selectionMode !== 'none') {\n                    var _selectionRef_current;\n                    (_selectionRef_current = selectionRef.current) === null || _selectionRef_current === void 0 ? void 0 : _selectionRef_current.click();\n                    // Prevents the page from scrolling down when the spacebar is pressed\n                    event.preventDefault();\n                }\n                return;\n            case treeDataTypes.Enter:\n                {\n                    return event.currentTarget.click();\n                }\n            case treeDataTypes.End:\n            case treeDataTypes.Home:\n            case treeDataTypes.ArrowUp:\n            case treeDataTypes.ArrowDown:\n                return requestTreeResponse({\n                    requestType: 'navigate',\n                    event,\n                    value,\n                    itemType,\n                    parentValue,\n                    type: event.key,\n                    target: event.currentTarget\n                });\n            case treeDataTypes.ArrowLeft:\n                {\n                    // do not navigate to parent if the item is on the top level\n                    if (level === 1 && !open) {\n                        return;\n                    }\n                    const data = {\n                        value,\n                        event,\n                        open: getNextOpen(),\n                        type: event.key,\n                        target: event.currentTarget\n                    };\n                    if (open) {\n                        var _props_onOpenChange;\n                        (_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 ? void 0 : _props_onOpenChange.call(props, event, data);\n                    }\n                    return requestTreeResponse({\n                        ...data,\n                        itemType,\n                        parentValue,\n                        requestType: open ? 'open' : 'navigate'\n                    });\n                }\n            case treeDataTypes.ArrowRight:\n                // do not navigate or open if the item is a leaf\n                if (itemType === 'leaf') {\n                    return;\n                }\n                const data = {\n                    value,\n                    event,\n                    open: getNextOpen(),\n                    type: event.key,\n                    target: event.currentTarget\n                };\n                if (!open) {\n                    var _props_onOpenChange1;\n                    (_props_onOpenChange1 = props.onOpenChange) === null || _props_onOpenChange1 === void 0 ? void 0 : _props_onOpenChange1.call(props, event, data);\n                }\n                return requestTreeResponse({\n                    ...data,\n                    itemType,\n                    parentValue,\n                    requestType: open ? 'navigate' : 'open'\n                });\n        }\n        const isTypeAheadCharacter = event.key.length === 1 && event.key.match(/\\w/) && !event.altKey && !event.ctrlKey && !event.metaKey;\n        if (isTypeAheadCharacter) {\n            requestTreeResponse({\n                requestType: 'navigate',\n                event,\n                target: event.currentTarget,\n                value,\n                itemType,\n                type: treeDataTypes.TypeAhead,\n                parentValue\n            });\n        }\n    });\n    const handleChange = useEventCallback((event)=>{\n        onChange === null || onChange === void 0 ? void 0 : onChange(event);\n        if (event.isDefaultPrevented()) {\n            return;\n        }\n        const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target);\n        if (isEventFromSubtree) {\n            return;\n        }\n        requestTreeResponse({\n            requestType: 'selection',\n            event,\n            value,\n            itemType,\n            type: 'Change',\n            target: event.currentTarget,\n            checked: checked === 'mixed' ? true : !checked\n        });\n    });\n    return {\n        value,\n        open,\n        checked,\n        subtreeRef,\n        layoutRef,\n        selectionRef,\n        expandIconRef,\n        treeItemRef,\n        actionsRef,\n        itemType,\n        level,\n        components: {\n            root: 'div'\n        },\n        // FIXME: this property is not necessary anymore, but as removing it would be a breaking change, we need to keep it as false\n        isAsideVisible: false,\n        // FIXME: this property is not necessary anymore, but as removing it would be a breaking change, we need to keep it as false\n        isActionsVisible: false,\n        root: slot.always(getIntrinsicElementProps(as, {\n            tabIndex: -1,\n            [dataTreeItemValueAttrName]: value,\n            ...rest,\n            ref: useMergedRefs(ref, treeItemRef),\n            role: 'treeitem',\n            'aria-level': level,\n            'aria-checked': selectionMode === 'multiselect' ? checked : undefined,\n            // aria-selected is required according to WAI-ARIA spec\n            // https://www.w3.org/TR/wai-aria-1.1/#treeitem\n            // Casting: when selectionMode is 'single', checked is a boolean\n            'aria-selected': selectionMode === 'single' ? checked : 'false',\n            'aria-expanded': itemType === 'branch' ? open : undefined,\n            onClick: handleClick,\n            onKeyDown: handleKeyDown,\n            onChange: handleChange\n        }), {\n            elementType: 'div'\n        })\n    };\n}\nfunction warnIfNoProperPropsFlatTreeItem(props) {\n    if (process.env.NODE_ENV !== 'production') {\n        if (props['aria-posinset'] === undefined || props['aria-setsize'] === undefined || props['aria-level'] === undefined || props.parentValue === undefined && props['aria-level'] !== 1) {\n            // eslint-disable-next-line no-console\n            console.error(`@fluentui/react-tree [${useTreeItem_unstable.name}]:\nA flat treeitem must have \"aria-posinset\", \"aria-setsize\", \"aria-level\"\nand \"parentValue\" (if \"aria-level\" > 1) to ensure a11y and navigation.\n\n- \"aria-posinset\": the position of this treeitem in the current level of the tree.\n- \"aria-setsize\": the number of siblings in this level of the tree.\n- \"aria-level\": the current level of the treeitem.\n- \"parentValue\": the \"value\" property of the parent item of this item.`);\n        }\n    }\n}\n"],"names":["useTreeItem_unstable","props","ref","treeType","useTreeContext_unstable","ctx","warnIfNoProperPropsFlatTreeItem","requestTreeResponse","level","contextLevel","useSubtreeContext_unstable","parentValue","useTreeItemContext_unstable","_props_parentValue","value","internalValue","useId","_props_value","onClick","onKeyDown","onChange","as","itemType","rest","actionsRef","React","useRef","expandIconRef","layoutRef","subtreeRef","selectionRef","treeItemRef","open","_props_open","openItems","has","getNextOpen","selectionMode","checked","_ctx_checkedItems_get","checkedItems","get","handleClick","useEventCallback","event","isDefaultPrevented","isEventFromActions","current","elementContains","target","isEventFromSubtree","isEventFromSelection","isEventFromExpandIcon","ReactDOM","unstable_batchedUpdates","_props_onOpenChange","data","currentTarget","type","treeDataTypes","ExpandIconClick","Click","onOpenChange","call","requestType","handleKeyDown","key","Space","_selectionRef_current","click","preventDefault","Enter","End","Home","ArrowUp","ArrowDown","ArrowLeft","ArrowRight","_props_onOpenChange1","isTypeAheadCharacter","length","match","altKey","ctrlKey","metaKey","TypeAhead","handleChange","components","root","isAsideVisible","isActionsVisible","slot","always","getIntrinsicElementProps","tabIndex","dataTreeItemValueAttrName","useMergedRefs","role","undefined","elementType","process","env","NODE_ENV","console","error","name"],"mappings":"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"}

package/lib-commonjs/hooks/useRootTree.js

@@ -26,15 +26,9 @@ function useRootTree(props, ref) {
     ]);
     const requestOpenChange = (request)=>{
         var _props_onOpenChange;
-        const open = request.itemType === 'branch' && !openItems.has(request.value);
-        const nextOpenItems = (0, _useControllableOpenItems.createNextOpenItems)({
-            value: request.value,
-            open
-        }, openItems);
         (_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 ? void 0 : _props_onOpenChange.call(props, request.event, {
             ...request,
-            open,
-            openItems: nextOpenItems.dangerouslyGetInternalSet_unstable()
+            openItems: (0, _useControllableOpenItems.createNextOpenItems)(request, openItems).dangerouslyGetInternalSet_unstable()
         });
     };
     const requestCheckedChange = (request)=>{

package/lib-commonjs/hooks/useRootTree.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useRootTree.js"],"sourcesContent":["import { getIntrinsicElementProps, useEventCallback, slot } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { createOpenItems } from '../utils/createOpenItems';\nimport { createCheckedItems } from '../utils/createCheckedItems';\nimport { treeDataTypes } from '../utils/tokens';\nimport { createNextOpenItems } from './useControllableOpenItems';\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 = React.useMemo(()=>createOpenItems(props.openItems), [\n        props.openItems\n    ]);\n    const checkedItems = React.useMemo(()=>createCheckedItems(props.checkedItems), [\n        props.checkedItems\n    ]);\n    const requestOpenChange = (request)=>{\n        var _props_onOpenChange;\n        const open = request.itemType === 'branch' && !openItems.has(request.value);\n        const nextOpenItems = createNextOpenItems({\n            value: request.value,\n            open\n        }, openItems);\n        (_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 ? void 0 : _props_onOpenChange.call(props, request.event, {\n            ...request,\n            open,\n            openItems: nextOpenItems.dangerouslyGetInternalSet_unstable()\n        });\n    };\n    const requestCheckedChange = (request)=>{\n        var _props_onCheckedChange;\n        if (selectionMode === 'none') {\n            return;\n        }\n        (_props_onCheckedChange = props.onCheckedChange) === null || _props_onCheckedChange === void 0 ? void 0 : _props_onCheckedChange.call(props, request.event, {\n            ...request,\n            selectionMode,\n            checkedItems: checkedItems.dangerouslyGetInternalMap_unstable()\n        });\n    };\n    const requestNavigation = (request)=>{\n        var _props_onNavigation;\n        (_props_onNavigation = props.onNavigation) === null || _props_onNavigation === void 0 ? void 0 : _props_onNavigation.call(props, request.event, request);\n        switch(request.type){\n            case treeDataTypes.ArrowDown:\n            case treeDataTypes.ArrowUp:\n            case treeDataTypes.Home:\n            case treeDataTypes.End:\n                // stop the default behavior of the event\n                // which is to scroll the page\n                request.event.preventDefault();\n        }\n    };\n    const requestTreeResponse = useEventCallback((request)=>{\n        switch(request.requestType){\n            case 'navigate':\n                return requestNavigation(request);\n            case 'open':\n                return requestOpenChange(request);\n            case 'selection':\n                return requestCheckedChange(request);\n        }\n    });\n    return {\n        components: {\n            root: 'div'\n        },\n        contextType: 'root',\n        selectionMode,\n        open: true,\n        appearance,\n        size,\n        level: 1,\n        openItems,\n        checkedItems,\n        requestTreeResponse,\n        root: slot.always(getIntrinsicElementProps('div', {\n            // FIXME:\n            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n            // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n            ref: ref,\n            role: 'tree',\n            'aria-multiselectable': selectionMode === 'multiselect' ? true : undefined,\n            ...props\n        }), {\n            elementType: 'div'\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(`@fluentui/react-tree [useRootTree]:\nTree must have either a \\`aria-label\\` or \\`aria-labelledby\\` property defined`);\n        }\n    }\n}\n"],"names":["useRootTree","props","ref","warnIfNoProperPropsRootTree","appearance","size","selectionMode","openItems","React","useMemo","createOpenItems","checkedItems","createCheckedItems","requestOpenChange","request","_props_onOpenChange","open","itemType","has","value","nextOpenItems","createNextOpenItems","onOpenChange","call","event","dangerouslyGetInternalSet_unstable","requestCheckedChange","_props_onCheckedChange","onCheckedChange","dangerouslyGetInternalMap_unstable","requestNavigation","_props_onNavigation","onNavigation","type","treeDataTypes","ArrowDown","ArrowUp","Home","End","preventDefault","requestTreeResponse","useEventCallback","requestType","components","root","contextType","level","slot","always","getIntrinsicElementProps","role","undefined","elementType","process","env","NODE_ENV","console","warn"],"mappings":"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"}
+{"version":3,"sources":["useRootTree.js"],"sourcesContent":["import { getIntrinsicElementProps, useEventCallback, slot } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { createOpenItems } from '../utils/createOpenItems';\nimport { createCheckedItems } from '../utils/createCheckedItems';\nimport { treeDataTypes } from '../utils/tokens';\nimport { createNextOpenItems } from './useControllableOpenItems';\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 = React.useMemo(()=>createOpenItems(props.openItems), [\n        props.openItems\n    ]);\n    const checkedItems = React.useMemo(()=>createCheckedItems(props.checkedItems), [\n        props.checkedItems\n    ]);\n    const requestOpenChange = (request)=>{\n        var _props_onOpenChange;\n        (_props_onOpenChange = props.onOpenChange) === null || _props_onOpenChange === void 0 ? void 0 : _props_onOpenChange.call(props, request.event, {\n            ...request,\n            openItems: createNextOpenItems(request, openItems).dangerouslyGetInternalSet_unstable()\n        });\n    };\n    const requestCheckedChange = (request)=>{\n        var _props_onCheckedChange;\n        if (selectionMode === 'none') {\n            return;\n        }\n        (_props_onCheckedChange = props.onCheckedChange) === null || _props_onCheckedChange === void 0 ? void 0 : _props_onCheckedChange.call(props, request.event, {\n            ...request,\n            selectionMode,\n            checkedItems: checkedItems.dangerouslyGetInternalMap_unstable()\n        });\n    };\n    const requestNavigation = (request)=>{\n        var _props_onNavigation;\n        (_props_onNavigation = props.onNavigation) === null || _props_onNavigation === void 0 ? void 0 : _props_onNavigation.call(props, request.event, request);\n        switch(request.type){\n            case treeDataTypes.ArrowDown:\n            case treeDataTypes.ArrowUp:\n            case treeDataTypes.Home:\n            case treeDataTypes.End:\n                // stop the default behavior of the event\n                // which is to scroll the page\n                request.event.preventDefault();\n        }\n    };\n    const requestTreeResponse = useEventCallback((request)=>{\n        switch(request.requestType){\n            case 'navigate':\n                return requestNavigation(request);\n            case 'open':\n                return requestOpenChange(request);\n            case 'selection':\n                return requestCheckedChange(request);\n        }\n    });\n    return {\n        components: {\n            root: 'div'\n        },\n        contextType: 'root',\n        selectionMode,\n        open: true,\n        appearance,\n        size,\n        level: 1,\n        openItems,\n        checkedItems,\n        requestTreeResponse,\n        root: slot.always(getIntrinsicElementProps('div', {\n            // FIXME:\n            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n            // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n            ref: ref,\n            role: 'tree',\n            'aria-multiselectable': selectionMode === 'multiselect' ? true : undefined,\n            ...props\n        }), {\n            elementType: 'div'\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(`@fluentui/react-tree [useRootTree]:\nTree must have either a \\`aria-label\\` or \\`aria-labelledby\\` property defined`);\n        }\n    }\n}\n"],"names":["useRootTree","props","ref","warnIfNoProperPropsRootTree","appearance","size","selectionMode","openItems","React","useMemo","createOpenItems","checkedItems","createCheckedItems","requestOpenChange","request","_props_onOpenChange","onOpenChange","call","event","createNextOpenItems","dangerouslyGetInternalSet_unstable","requestCheckedChange","_props_onCheckedChange","onCheckedChange","dangerouslyGetInternalMap_unstable","requestNavigation","_props_onNavigation","onNavigation","type","treeDataTypes","ArrowDown","ArrowUp","Home","End","preventDefault","requestTreeResponse","useEventCallback","requestType","components","root","contextType","open","level","slot","always","getIntrinsicElementProps","role","undefined","elementType","process","env","NODE_ENV","console","warn"],"mappings":";;;;+BAWoBA;;;eAAAA;;;;gCAX6C;iEAC1C;iCACS;oCACG;wBACL;0CACM;AAMzB,SAASA,YAAYC,KAAK,EAAEC,GAAG;IACtCC,4BAA4BF;IAC5B,MAAM,EAAEG,aAAa,QAAQ,EAAEC,OAAO,QAAQ,EAAEC,gBAAgB,MAAM,EAAE,GAAGL;IAC3E,MAAMM,YAAYC,OAAMC,OAAO,CAAC,IAAIC,IAAAA,gCAAe,EAACT,MAAMM,SAAS,GAAG;QAClEN,MAAMM,SAAS;KAClB;IACD,MAAMI,eAAeH,OAAMC,OAAO,CAAC,IAAIG,IAAAA,sCAAkB,EAACX,MAAMU,YAAY,GAAG;QAC3EV,MAAMU,YAAY;KACrB;IACD,MAAME,oBAAoB,CAACC;QACvB,IAAIC;QACHA,CAAAA,sBAAsBd,MAAMe,YAAY,AAAD,MAAO,QAAQD,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBE,IAAI,CAAChB,OAAOa,QAAQI,KAAK,EAAE;YAC5I,GAAGJ,OAAO;YACVP,WAAWY,IAAAA,6CAAmB,EAACL,SAASP,WAAWa,kCAAkC;QACzF;IACJ;IACA,MAAMC,uBAAuB,CAACP;QAC1B,IAAIQ;QACJ,IAAIhB,kBAAkB,QAAQ;YAC1B;QACJ;QACCgB,CAAAA,yBAAyBrB,MAAMsB,eAAe,AAAD,MAAO,QAAQD,2BAA2B,KAAK,IAAI,KAAK,IAAIA,uBAAuBL,IAAI,CAAChB,OAAOa,QAAQI,KAAK,EAAE;YACxJ,GAAGJ,OAAO;YACVR;YACAK,cAAcA,aAAaa,kCAAkC;QACjE;IACJ;IACA,MAAMC,oBAAoB,CAACX;QACvB,IAAIY;QACHA,CAAAA,sBAAsBzB,MAAM0B,YAAY,AAAD,MAAO,QAAQD,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBT,IAAI,CAAChB,OAAOa,QAAQI,KAAK,EAAEJ;QAChJ,OAAOA,QAAQc,IAAI;YACf,KAAKC,qBAAa,CAACC,SAAS;YAC5B,KAAKD,qBAAa,CAACE,OAAO;YAC1B,KAAKF,qBAAa,CAACG,IAAI;YACvB,KAAKH,qBAAa,CAACI,GAAG;gBAClB,yCAAyC;gBACzC,8BAA8B;gBAC9BnB,QAAQI,KAAK,CAACgB,cAAc;QACpC;IACJ;IACA,MAAMC,sBAAsBC,IAAAA,gCAAgB,EAAC,CAACtB;QAC1C,OAAOA,QAAQuB,WAAW;YACtB,KAAK;gBACD,OAAOZ,kBAAkBX;YAC7B,KAAK;gBACD,OAAOD,kBAAkBC;YAC7B,KAAK;gBACD,OAAOO,qBAAqBP;QACpC;IACJ;IACA,OAAO;QACHwB,YAAY;YACRC,MAAM;QACV;QACAC,aAAa;QACblC;QACAmC,MAAM;QACNrC;QACAC;QACAqC,OAAO;QACPnC;QACAI;QACAwB;QACAI,MAAMI,oBAAI,CAACC,MAAM,CAACC,IAAAA,wCAAwB,EAAC,OAAO;YAC9C,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5F3C,KAAKA;YACL4C,MAAM;YACN,wBAAwBxC,kBAAkB,gBAAgB,OAAOyC;YACjE,GAAG9C,KAAK;QACZ,IAAI;YACA+C,aAAa;QACjB;IACJ;AACJ;AACA,SAAS7C,4BAA4BF,KAAK;IACtC,IAAIgD,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QACxC,IAAI,CAAClD,KAAK,CAAC,aAAa,IAAI,CAACA,KAAK,CAAC,kBAAkB,EAAE;YACnD,sCAAsC;YACtCmD,QAAQC,IAAI,CAAC,CAAC;8EACoD,CAAC;QACvE;IACJ;AACJ"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-tree",
-  "version": "9.4.29",
+  "version": "9.4.31",
   "description": "Tree component for Fluent UI React",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -37,18 +37,18 @@
   },
   "dependencies": {
     "@fluentui/keyboard-keys": "^9.0.7",
-    "@fluentui/react-aria": "^9.8.1",
-    "@fluentui/react-avatar": "^9.6.13",
-    "@fluentui/react-button": "^9.3.67",
-    "@fluentui/react-checkbox": "^9.2.11",
-    "@fluentui/react-context-selector": "^9.1.51",
+    "@fluentui/react-aria": "^9.9.0",
+    "@fluentui/react-avatar": "^9.6.15",
+    "@fluentui/react-button": "^9.3.69",
+    "@fluentui/react-checkbox": "^9.2.13",
+    "@fluentui/react-context-selector": "^9.1.52",
     "@fluentui/react-icons": "^2.0.224",
-    "@fluentui/react-radio": "^9.2.6",
+    "@fluentui/react-radio": "^9.2.8",
     "@fluentui/react-shared-contexts": "^9.14.0",
-    "@fluentui/react-tabster": "^9.18.0",
+    "@fluentui/react-tabster": "^9.19.1",
     "@fluentui/react-theme": "^9.1.16",
-    "@fluentui/react-utilities": "^9.18.0",
-    "@fluentui/react-jsx-runtime": "^9.0.29",
+    "@fluentui/react-utilities": "^9.18.1",
+    "@fluentui/react-jsx-runtime": "^9.0.30",
     "@griffel/react": "^1.5.14",
     "@swc/helpers": "^0.5.1"
   },