@fluentui/react-tree 9.4.39 → 9.4.40

package/CHANGELOG.md

@@ -1,12 +1,29 @@
 # Change Log - @fluentui/react-tree
 
-This log was last generated on Tue, 23 Apr 2024 08:12:12 GMT and should not be manually modified.
+This log was last generated on Thu, 02 May 2024 11:31:36 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.4.40](https://github.com/microsoft/fluentui/tree/@fluentui/react-tree_v9.4.40)
+
+Thu, 02 May 2024 11:31:36 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tree_v9.4.39..@fluentui/react-tree_v9.4.40)
+
+### Patches
+
+- chore: updates roving tab indexes to ensure Tree is focusable ([PR #31231](https://github.com/microsoft/fluentui/pull/31231) by bernardo.sunderhus@gmail.com)
+- fix: Apply aria-selected prop to aria-selected instead of aria-expanded. ([PR #31117](https://github.com/microsoft/fluentui/pull/31117) by estebanmu@microsoft.com)
+-  chore: upgrade @fluentui/react-icons to 2.0.237. ([PR #31139](https://github.com/microsoft/fluentui/pull/31139) by ololubek@microsoft.com)
+- Bump @fluentui/react-aria to v9.11.0 ([PR #31231](https://github.com/microsoft/fluentui/pull/31231) by beachball)
+- Bump @fluentui/react-avatar to v9.6.23 ([PR #31231](https://github.com/microsoft/fluentui/pull/31231) by beachball)
+- Bump @fluentui/react-button to v9.3.77 ([PR #31231](https://github.com/microsoft/fluentui/pull/31231) by beachball)
+- Bump @fluentui/react-checkbox to v9.2.22 ([PR #31231](https://github.com/microsoft/fluentui/pull/31231) by beachball)
+- Bump @fluentui/react-radio to v9.2.17 ([PR #31231](https://github.com/microsoft/fluentui/pull/31231) by beachball)
+- Bump @fluentui/react-tabster to v9.21.0 ([PR #31231](https://github.com/microsoft/fluentui/pull/31231) by beachball)
+
 ## [9.4.39](https://github.com/microsoft/fluentui/tree/@fluentui/react-tree_v9.4.39)
 
-Tue, 23 Apr 2024 08:12:12 GMT 
+Tue, 23 Apr 2024 08:17:49 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tree_v9.4.38..@fluentui/react-tree_v9.4.39)
 
 ### Patches

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, onChange, as = 'div', itemType = 'leaf', 'aria-level': level = contextLevel, 'aria-selected': ariaSelected, ...rest } = props;
+    const { onClick, onKeyDown, onChange, as = 'div', itemType = 'leaf', 'aria-level': level = contextLevel, 'aria-selected': ariaSelected, 'aria-expanded': ariaExpanded, ...rest } = props;
     const actionsRef = React.useRef(null);
     const expandIconRef = React.useRef(null);
     const layoutRef = React.useRef(null);
@@ -227,8 +227,8 @@ import { dataTreeItemValueAttrName } from '../../utils/getTreeItemValueFromEleme
             'aria-level': level,
             'aria-checked': selectionMode === 'multiselect' ? checked : undefined,
             // Casting: when selectionMode is 'single', checked is a boolean
-            'aria-selected': selectionMode === 'single' ? !!checked : undefined,
-            'aria-expanded': ariaSelected !== undefined ? ariaSelected : itemType === 'branch' ? open : undefined,
+            'aria-selected': ariaSelected !== undefined ? ariaSelected : selectionMode === 'single' ? !!checked : undefined,
+            'aria-expanded': ariaExpanded !== undefined ? ariaExpanded : itemType === 'branch' ? open : undefined,
             onClick: handleClick,
             onKeyDown: handleKeyDown,
             onChange: handleChange

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    onChange,\n    as = 'div',\n    itemType = 'leaf',\n    'aria-level': level = contextLevel,\n    'aria-selected': ariaSelected,\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        // Casting: when selectionMode is 'single', checked is a boolean\n        'aria-selected': selectionMode === 'single' ? !!checked : undefined,\n        'aria-expanded': ariaSelected !== undefined ? ariaSelected : 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","ariaSelected","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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"}
+{"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    'aria-selected': ariaSelected,\n    'aria-expanded': ariaExpanded,\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        // Casting: when selectionMode is 'single', checked is a boolean\n        'aria-selected': ariaSelected !== undefined ? ariaSelected : selectionMode === 'single' ? !!checked : undefined,\n        'aria-expanded': ariaExpanded !== undefined ? ariaExpanded : 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","ariaSelected","ariaExpanded","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":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,YAAYC,cAAc,YAAY;AACtC,SACEC,wBAAwB,EACxBC,KAAK,EACLC,gBAAgB,EAChBC,IAAI,EACJC,eAAe,EACfC,aAAa,QACR,4BAA4B;AAEnC,SAASC,KAAK,QAAQ,0BAA0B;AAChD,SAASC,aAAa,QAAQ,qBAAqB;AACnD,SAASC,uBAAuB,EAAEC,0BAA0B,EAAEC,2BAA2B,QAAQ,iBAAiB;AAClH,SAASC,yBAAyB,QAAQ,0CAA0C;AAEpF;;;;;;;;CAQC,GACD,OAAO,SAASC,qBAAqBC,KAAoB,EAAEC,GAA8B;IACvF,MAAMC,WAAWP,wBAAwBQ,CAAAA,MAAOA,IAAID,QAAQ;IAC5D,IAAIA,aAAa,QAAQ;QACvBE,gCAAgCJ;IAClC;IACA,MAAMK,sBAAsBV,wBAAwBQ,CAAAA,MAAOA,IAAIE,mBAAmB;IAClF,MAAM,EAAEC,OAAOC,YAAY,EAAE,GAAGX;IAChC,MAAMY,cAAcX,4BAA4BM,CAAAA;YAAOH;eAAAA,CAAAA,qBAAAA,MAAMQ,WAAW,cAAjBR,gCAAAA,qBAAqBG,IAAIM,KAAK;IAAD;IAEpF,iDAAiD;IACjD,sDAAsD;IACtD,MAAMC,gBAAgBtB,MAAM;QACCY;IAA7B,MAAMS,QAAuBT,CAAAA,eAAAA,MAAMS,KAAK,cAAXT,0BAAAA,eAAeU;IAE5C,MAAM,EACJC,OAAO,EACPC,SAAS,EACTC,QAAQ,EACRC,KAAK,KAAK,EACVC,WAAW,MAAM,EACjB,cAAcT,QAAQC,YAAY,EAClC,iBAAiBS,YAAY,EAC7B,iBAAiBC,YAAY,EAC7B,GAAGC,MACJ,GAAGlB;IAEJ,MAAMmB,aAAalC,MAAMmC,MAAM,CAAiB;IAChD,MAAMC,gBAAgBpC,MAAMmC,MAAM,CAAiB;IACnD,MAAME,YAAYrC,MAAMmC,MAAM,CAAiB;IAC/C,MAAMG,aAAatC,MAAMmC,MAAM,CAAiB;IAChD,MAAMI,eAAevC,MAAMmC,MAAM,CAAmB;IACpD,MAAMK,cAAcxC,MAAMmC,MAAM,CAAiB;IAEjD,MAAMM,OAAO/B,wBAAwBQ,CAAAA;YAAOH;eAAAA,CAAAA,cAAAA,MAAM0B,IAAI,cAAV1B,yBAAAA,cAAcG,IAAIwB,SAAS,CAACC,GAAG,CAACnB;IAAK;IACjF,MAAMoB,cAAc,IAAOd,aAAa,WAAW,CAACW,OAAOA;IAC3D,MAAMI,gBAAgBnC,wBAAwBQ,CAAAA,MAAOA,IAAI2B,aAAa;IACtE,MAAMC,UAAUpC,wBAAwBQ,CAAAA;YAAOA;eAAAA,CAAAA,wBAAAA,IAAI6B,YAAY,CAACC,GAAG,CAACxB,oBAArBN,mCAAAA,wBAA+B;IAAI;IAElF,MAAM+B,cAAc7C,iBAAiB,CAAC8C;QACpCxB,oBAAAA,8BAAAA,QAAUwB;QACV,IAAIA,MAAMC,kBAAkB,IAAI;YAC9B;QACF;QACA,MAAMC,qBAAqBlB,WAAWmB,OAAO,IAAI/C,gBAAgB4B,WAAWmB,OAAO,EAAEH,MAAMI,MAAM;QACjG,IAAIF,oBAAoB;YACtB;QACF;QACA,MAAMG,qBAAqBjB,WAAWe,OAAO,IAAI/C,gBAAgBgC,WAAWe,OAAO,EAAEH,MAAMI,MAAM;QACjG,IAAIC,oBAAoB;YACtB;QACF;QACA,MAAMC,uBAAuBjB,aAAac,OAAO,IAAI/C,gBAAgBiC,aAAac,OAAO,EAAEH,MAAMI,MAAM;QACvG,IAAIE,sBAAsB;YACxB;QACF;QACA,MAAMC,wBAAwBrB,cAAciB,OAAO,IAAI/C,gBAAgB8B,cAAciB,OAAO,EAAEH,MAAMI,MAAM;QAE1GrD,SAASyD,uBAAuB,CAAC;gBAQ/B3C;YAPA,MAAM4C,OAAO;gBACXT;gBACA1B;gBACAiB,MAAMG;gBACNU,QAAQJ,MAAMU,aAAa;gBAC3BC,MAAMJ,wBAAwBhD,cAAcqD,eAAe,GAAGrD,cAAcsD,KAAK;YACnF;aACAhD,sBAAAA,MAAMiD,YAAY,cAAlBjD,0CAAAA,yBAAAA,OAAqBmC,OAAOS;YAC5BvC,oBAAoB;gBAClB,GAAGuC,IAAI;gBACP7B;gBACAmC,aAAa;YACf;YACA7C,oBAAoB;gBAClB,GAAGuC,IAAI;gBACP7B;gBACAP;gBACA0C,aAAa;gBACbJ,MAAMpD,cAAcsD,KAAK;YAC3B;QACF;IACF;IAEA,MAAMG,gBAAgB9D,iBAAiB,CAAC8C;QACtCvB,sBAAAA,gCAAAA,UAAYuB;QACZ,2EAA2E;QAC3E,IAAIA,MAAMC,kBAAkB,MAAMD,MAAMU,aAAa,KAAKV,MAAMI,MAAM,EAAE;YACtE;QACF;QACA,OAAQJ,MAAMiB,GAAG;YACf,KAAK3D;gBACH,IAAIqC,kBAAkB,QAAQ;wBAC5BN;qBAAAA,wBAAAA,aAAac,OAAO,cAApBd,4CAAAA,sBAAsB6B,KAAK;oBAC3B,qEAAqE;oBACrElB,MAAMmB,cAAc;gBACtB;gBACA;YACF,KAAK5D,cAAc6D,KAAK;gBAAE;oBACxB,OAAOpB,MAAMU,aAAa,CAACQ,KAAK;gBAClC;YACA,KAAK3D,cAAc8D,GAAG;YACtB,KAAK9D,cAAc+D,IAAI;YACvB,KAAK/D,cAAcgE,OAAO;YAC1B,KAAKhE,cAAciE,SAAS;gBAC1B,OAAOtD,oBAAoB;oBACzB6C,aAAa;oBACbf;oBACA1B;oBACAM;oBACAP;oBACAsC,MAAMX,MAAMiB,GAAG;oBACfb,QAAQJ,MAAMU,aAAa;gBAC7B;YACF,KAAKnD,cAAckE,SAAS;gBAAE;oBAC5B,4DAA4D;oBAC5D,IAAItD,UAAU,KAAK,CAACoB,MAAM;wBACxB;oBACF;oBACA,MAAMkB,OAAO;wBACXnC;wBACA0B;wBACAT,MAAMG;wBACNiB,MAAMX,MAAMiB,GAAG;wBACfb,QAAQJ,MAAMU,aAAa;oBAC7B;oBACA,IAAInB,MAAM;4BACR1B;yBAAAA,sBAAAA,MAAMiD,YAAY,cAAlBjD,0CAAAA,yBAAAA,OAAqBmC,OAAOS;oBAC9B;oBACA,OAAOvC,oBAAoB;wBACzB,GAAGuC,IAAI;wBACP7B;wBACAP;wBACA0C,aAAaxB,OAAO,SAAS;oBAC/B;gBACF;YACA,KAAKhC,cAAcmE,UAAU;gBAC3B,gDAAgD;gBAChD,IAAI9C,aAAa,QAAQ;oBACvB;gBACF;gBACA,MAAM6B,OAAO;oBACXnC;oBACA0B;oBACAT,MAAMG;oBACNiB,MAAMX,MAAMiB,GAAG;oBACfb,QAAQJ,MAAMU,aAAa;gBAC7B;gBACA,IAAI,CAACnB,MAAM;wBACT1B;qBAAAA,uBAAAA,MAAMiD,YAAY,cAAlBjD,2CAAAA,0BAAAA,OAAqBmC,OAAOS;gBAC9B;gBACA,OAAOvC,oBAAoB;oBACzB,GAAGuC,IAAI;oBACP7B;oBACAP;oBACA0C,aAAaxB,OAAO,aAAa;gBACnC;QACJ;QACA,MAAMoC,uBACJ3B,MAAMiB,GAAG,CAACW,MAAM,KAAK,KAAK5B,MAAMiB,GAAG,CAACY,KAAK,CAAC,SAAS,CAAC7B,MAAM8B,MAAM,IAAI,CAAC9B,MAAM+B,OAAO,IAAI,CAAC/B,MAAMgC,OAAO;QACtG,IAAIL,sBAAsB;YACxBzD,oBAAoB;gBAClB6C,aAAa;gBACbf;gBACAI,QAAQJ,MAAMU,aAAa;gBAC3BpC;gBACAM;gBACA+B,MAAMpD,cAAc0E,SAAS;gBAC7B5D;YACF;QACF;IACF;IAEA,MAAM6D,eAAehF,iBAAiB,CAAC8C;QACrCtB,qBAAAA,+BAAAA,SAAWsB;QACX,IAAIA,MAAMC,kBAAkB,IAAI;YAC9B;QACF;QACA,MAAMI,qBAAqBjB,WAAWe,OAAO,IAAI/C,gBAAgBgC,WAAWe,OAAO,EAAEH,MAAMI,MAAM;QACjG,IAAIC,oBAAoB;YACtB;QACF;QACAnC,oBAAoB;YAClB6C,aAAa;YACbf;YACA1B;YACAM;YACA+B,MAAM;YACNP,QAAQJ,MAAMU,aAAa;YAC3Bd,SAASA,YAAY,UAAU,OAAO,CAACA;QACzC;IACF;IAEA,OAAO;QACLtB;QACAiB;QACAK;QACAR;QACAD;QACAE;QACAH;QACAI;QACAN;QACAJ;QACAT;QACAgE,YAAY;YACVC,MAAM;QACR;QACA,4HAA4H;QAC5HC,gBAAgB;QAChB,4HAA4H;QAC5HC,kBAAkB;QAClBF,MAAMjF,KAAKoF,MAAM,CACfvF,yBAAyB2B,IAAI;YAC3B6D,UAAU,CAAC;YACX,CAAC7E,0BAA0B,EAAEW;YAC7B,GAAGS,IAAI;YACPjB,KAAKT,cAAcS,KAAKwB;YACxBmD,MAAM;YACN,cAActE;YACd,gBAAgBwB,kBAAkB,gBAAgBC,UAAU8C;YAC5D,gEAAgE;YAChE,iBAAiB7D,iBAAiB6D,YAAY7D,eAAec,kBAAkB,WAAW,CAAC,CAACC,UAAU8C;YACtG,iBAAiB5D,iBAAiB4D,YAAY5D,eAAeF,aAAa,WAAWW,OAAOmD;YAC5FlE,SAASuB;YACTtB,WAAWuC;YACXtC,UAAUwD;QACZ,IACA;YAAES,aAAa;QAAM;IAEzB;AACF;AAEA,SAAS1E,gCACPJ,KAA2F;IAE3F,IAAI+E,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzC,IACEjF,KAAK,CAAC,gBAAgB,KAAK6E,aAC3B7E,KAAK,CAAC,eAAe,KAAK6E,aAC1B7E,KAAK,CAAC,aAAa,KAAK6E,aACvB7E,MAAMQ,WAAW,KAAKqE,aAAa7E,KAAK,CAAC,aAAa,KAAK,GAC5D;YACA,sCAAsC;YACtCkF,QAAQC,KAAK,CAAuB,CAAC,sBACb,EAAEpF,qBAAqBqF,IAAI,CAAC;;;;;;;sEAQpD,CAAC;QACH;IACF;AACF"}

package/lib/hooks/useRovingTabIndexes.js

@@ -1,9 +1,18 @@
 import * as React from 'react';
+import { useFocusedElementChange } from '@fluentui/react-tabster';
+import { elementContains } from '@fluentui/react-utilities';
 /**
  * https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex
  */ export function useRovingTabIndex() {
     const currentElementRef = React.useRef();
+    const walkerRef = React.useRef(null);
+    useFocusedElementChange((element)=>{
+        if ((element === null || element === void 0 ? void 0 : element.getAttribute('role')) === 'treeitem' && walkerRef.current && elementContains(walkerRef.current.root, element)) {
+            rove(element);
+        }
+    });
     const initialize = React.useCallback((walker)=>{
+        walkerRef.current = walker;
         walker.currentElement = walker.root;
         let tabbableChild = walker.firstChild((element)=>element.tabIndex === 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP);
         walker.currentElement = walker.root;

package/lib/hooks/useRovingTabIndexes.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useRovingTabIndexes.ts"],"sourcesContent":["import * as React from 'react';\nimport { HTMLElementWalker } from '../utils/createHTMLElementWalker';\n\n/**\n * https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex\n */\nexport function useRovingTabIndex() {\n  const currentElementRef = React.useRef<HTMLElement>();\n\n  const initialize = React.useCallback((walker: HTMLElementWalker) => {\n    walker.currentElement = walker.root;\n    let tabbableChild = walker.firstChild(element =>\n      element.tabIndex === 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP,\n    );\n    walker.currentElement = walker.root;\n    tabbableChild ??= walker.firstChild();\n    if (!tabbableChild) {\n      return;\n    }\n    tabbableChild.tabIndex = 0;\n    currentElementRef.current = tabbableChild;\n    let nextElement: HTMLElement | null = null;\n    while ((nextElement = walker.nextElement()) && nextElement !== tabbableChild) {\n      nextElement.tabIndex = -1;\n    }\n  }, []);\n  const rove = React.useCallback((nextElement: HTMLElement) => {\n    if (!currentElementRef.current) {\n      return;\n    }\n    currentElementRef.current.tabIndex = -1;\n    nextElement.tabIndex = 0;\n    nextElement.focus();\n    currentElementRef.current = nextElement;\n  }, []);\n\n  return {\n    rove,\n    initialize,\n  };\n}\n"],"names":["React","useRovingTabIndex","currentElementRef","useRef","initialize","useCallback","walker","currentElement","root","tabbableChild","firstChild","element","tabIndex","NodeFilter","FILTER_ACCEPT","FILTER_SKIP","current","nextElement","rove","focus"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B;;CAEC,GACD,OAAO,SAASC;IACd,MAAMC,oBAAoBF,MAAMG,MAAM;IAEtC,MAAMC,aAAaJ,MAAMK,WAAW,CAAC,CAACC;QACpCA,OAAOC,cAAc,GAAGD,OAAOE,IAAI;QACnC,IAAIC,gBAAgBH,OAAOI,UAAU,CAACC,CAAAA,UACpCA,QAAQC,QAAQ,KAAK,IAAIC,WAAWC,aAAa,GAAGD,WAAWE,WAAW;QAE5ET,OAAOC,cAAc,GAAGD,OAAOE,IAAI;QACnCC,0BAAAA,2BAAAA,gBAAAA,gBAAkBH,OAAOI,UAAU;QACnC,IAAI,CAACD,eAAe;YAClB;QACF;QACAA,cAAcG,QAAQ,GAAG;QACzBV,kBAAkBc,OAAO,GAAGP;QAC5B,IAAIQ,cAAkC;QACtC,MAAO,AAACA,CAAAA,cAAcX,OAAOW,WAAW,EAAC,KAAMA,gBAAgBR,cAAe;YAC5EQ,YAAYL,QAAQ,GAAG,CAAC;QAC1B;IACF,GAAG,EAAE;IACL,MAAMM,OAAOlB,MAAMK,WAAW,CAAC,CAACY;QAC9B,IAAI,CAACf,kBAAkBc,OAAO,EAAE;YAC9B;QACF;QACAd,kBAAkBc,OAAO,CAACJ,QAAQ,GAAG,CAAC;QACtCK,YAAYL,QAAQ,GAAG;QACvBK,YAAYE,KAAK;QACjBjB,kBAAkBc,OAAO,GAAGC;IAC9B,GAAG,EAAE;IAEL,OAAO;QACLC;QACAd;IACF;AACF"}
+{"version":3,"sources":["useRovingTabIndexes.ts"],"sourcesContent":["import * as React from 'react';\nimport { HTMLElementWalker } from '../utils/createHTMLElementWalker';\nimport { useFocusedElementChange } from '@fluentui/react-tabster';\nimport { elementContains } from '@fluentui/react-utilities';\n\n/**\n * https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex\n */\nexport function useRovingTabIndex() {\n  const currentElementRef = React.useRef<HTMLElement>();\n  const walkerRef = React.useRef<HTMLElementWalker | null>(null);\n  useFocusedElementChange(element => {\n    if (\n      element?.getAttribute('role') === 'treeitem' &&\n      walkerRef.current &&\n      elementContains(walkerRef.current.root, element)\n    ) {\n      rove(element);\n    }\n  });\n\n  const initialize = React.useCallback((walker: HTMLElementWalker) => {\n    walkerRef.current = walker;\n    walker.currentElement = walker.root;\n    let tabbableChild = walker.firstChild(element =>\n      element.tabIndex === 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP,\n    );\n    walker.currentElement = walker.root;\n    tabbableChild ??= walker.firstChild();\n    if (!tabbableChild) {\n      return;\n    }\n    tabbableChild.tabIndex = 0;\n    currentElementRef.current = tabbableChild;\n    let nextElement: HTMLElement | null = null;\n    while ((nextElement = walker.nextElement()) && nextElement !== tabbableChild) {\n      nextElement.tabIndex = -1;\n    }\n  }, []);\n  const rove = React.useCallback((nextElement: HTMLElement) => {\n    if (!currentElementRef.current) {\n      return;\n    }\n    currentElementRef.current.tabIndex = -1;\n    nextElement.tabIndex = 0;\n    nextElement.focus();\n    currentElementRef.current = nextElement;\n  }, []);\n\n  return {\n    rove,\n    initialize,\n  };\n}\n"],"names":["React","useFocusedElementChange","elementContains","useRovingTabIndex","currentElementRef","useRef","walkerRef","element","getAttribute","current","root","rove","initialize","useCallback","walker","currentElement","tabbableChild","firstChild","tabIndex","NodeFilter","FILTER_ACCEPT","FILTER_SKIP","nextElement","focus"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,uBAAuB,QAAQ,0BAA0B;AAClE,SAASC,eAAe,QAAQ,4BAA4B;AAE5D;;CAEC,GACD,OAAO,SAASC;IACd,MAAMC,oBAAoBJ,MAAMK,MAAM;IACtC,MAAMC,YAAYN,MAAMK,MAAM,CAA2B;IACzDJ,wBAAwBM,CAAAA;QACtB,IACEA,CAAAA,oBAAAA,8BAAAA,QAASC,YAAY,CAAC,aAAY,cAClCF,UAAUG,OAAO,IACjBP,gBAAgBI,UAAUG,OAAO,CAACC,IAAI,EAAEH,UACxC;YACAI,KAAKJ;QACP;IACF;IAEA,MAAMK,aAAaZ,MAAMa,WAAW,CAAC,CAACC;QACpCR,UAAUG,OAAO,GAAGK;QACpBA,OAAOC,cAAc,GAAGD,OAAOJ,IAAI;QACnC,IAAIM,gBAAgBF,OAAOG,UAAU,CAACV,CAAAA,UACpCA,QAAQW,QAAQ,KAAK,IAAIC,WAAWC,aAAa,GAAGD,WAAWE,WAAW;QAE5EP,OAAOC,cAAc,GAAGD,OAAOJ,IAAI;QACnCM,0BAAAA,2BAAAA,gBAAAA,gBAAkBF,OAAOG,UAAU;QACnC,IAAI,CAACD,eAAe;YAClB;QACF;QACAA,cAAcE,QAAQ,GAAG;QACzBd,kBAAkBK,OAAO,GAAGO;QAC5B,IAAIM,cAAkC;QACtC,MAAO,AAACA,CAAAA,cAAcR,OAAOQ,WAAW,EAAC,KAAMA,gBAAgBN,cAAe;YAC5EM,YAAYJ,QAAQ,GAAG,CAAC;QAC1B;IACF,GAAG,EAAE;IACL,MAAMP,OAAOX,MAAMa,WAAW,CAAC,CAACS;QAC9B,IAAI,CAAClB,kBAAkBK,OAAO,EAAE;YAC9B;QACF;QACAL,kBAAkBK,OAAO,CAACS,QAAQ,GAAG,CAAC;QACtCI,YAAYJ,QAAQ,GAAG;QACvBI,YAAYC,KAAK;QACjBnB,kBAAkBK,OAAO,GAAGa;IAC9B,GAAG,EAAE;IAEL,OAAO;QACLX;QACAC;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, onChange, as = 'div', itemType = 'leaf', 'aria-level': level = contextLevel, 'aria-selected': ariaSelected, ...rest } = props;
+    const { onClick, onKeyDown, onChange, as = 'div', itemType = 'leaf', 'aria-level': level = contextLevel, 'aria-selected': ariaSelected, 'aria-expanded': ariaExpanded, ...rest } = props;
     const actionsRef = _react.useRef(null);
     const expandIconRef = _react.useRef(null);
     const layoutRef = _react.useRef(null);
@@ -230,8 +230,8 @@ function useTreeItem_unstable(props, ref) {
             'aria-level': level,
             'aria-checked': selectionMode === 'multiselect' ? checked : undefined,
             // Casting: when selectionMode is 'single', checked is a boolean
-            'aria-selected': selectionMode === 'single' ? !!checked : undefined,
-            'aria-expanded': ariaSelected !== undefined ? ariaSelected : itemType === 'branch' ? open : undefined,
+            'aria-selected': ariaSelected !== undefined ? ariaSelected : selectionMode === 'single' ? !!checked : undefined,
+            'aria-expanded': ariaExpanded !== undefined ? ariaExpanded : itemType === 'branch' ? open : undefined,
             onClick: handleClick,
             onKeyDown: handleKeyDown,
             onChange: handleChange

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, onChange, as = 'div', itemType = 'leaf', 'aria-level': level = contextLevel, 'aria-selected': ariaSelected, ...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            // Casting: when selectionMode is 'single', checked is a boolean\n            'aria-selected': selectionMode === 'single' ? !!checked : undefined,\n            'aria-expanded': ariaSelected !== undefined ? ariaSelected : 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","ariaSelected","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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"}
+{"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, 'aria-selected': ariaSelected, 'aria-expanded': ariaExpanded, ...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            // Casting: when selectionMode is 'single', checked is a boolean\n            'aria-selected': ariaSelected !== undefined ? ariaSelected : selectionMode === 'single' ? !!checked : undefined,\n            'aria-expanded': ariaExpanded !== undefined ? ariaExpanded : 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","ariaSelected","ariaExpanded","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/useRovingTabIndexes.js

@@ -10,9 +10,18 @@ Object.defineProperty(exports, "useRovingTabIndex", {
 });
 const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
 const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _reacttabster = require("@fluentui/react-tabster");
+const _reactutilities = require("@fluentui/react-utilities");
 function useRovingTabIndex() {
     const currentElementRef = _react.useRef();
+    const walkerRef = _react.useRef(null);
+    (0, _reacttabster.useFocusedElementChange)((element)=>{
+        if ((element === null || element === void 0 ? void 0 : element.getAttribute('role')) === 'treeitem' && walkerRef.current && (0, _reactutilities.elementContains)(walkerRef.current.root, element)) {
+            rove(element);
+        }
+    });
     const initialize = _react.useCallback((walker)=>{
+        walkerRef.current = walker;
         walker.currentElement = walker.root;
         let tabbableChild = walker.firstChild((element)=>element.tabIndex === 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP);
         walker.currentElement = walker.root;

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

@@ -1 +1 @@
-{"version":3,"sources":["useRovingTabIndexes.js"],"sourcesContent":["import * as React from 'react';\n/**\n * https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex\n */ export function useRovingTabIndex() {\n    const currentElementRef = React.useRef();\n    const initialize = React.useCallback((walker)=>{\n        walker.currentElement = walker.root;\n        let tabbableChild = walker.firstChild((element)=>element.tabIndex === 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP);\n        walker.currentElement = walker.root;\n        tabbableChild !== null && tabbableChild !== void 0 ? tabbableChild : tabbableChild = walker.firstChild();\n        if (!tabbableChild) {\n            return;\n        }\n        tabbableChild.tabIndex = 0;\n        currentElementRef.current = tabbableChild;\n        let nextElement = null;\n        while((nextElement = walker.nextElement()) && nextElement !== tabbableChild){\n            nextElement.tabIndex = -1;\n        }\n    }, []);\n    const rove = React.useCallback((nextElement)=>{\n        if (!currentElementRef.current) {\n            return;\n        }\n        currentElementRef.current.tabIndex = -1;\n        nextElement.tabIndex = 0;\n        nextElement.focus();\n        currentElementRef.current = nextElement;\n    }, []);\n    return {\n        rove,\n        initialize\n    };\n}\n"],"names":["useRovingTabIndex","currentElementRef","React","useRef","initialize","useCallback","walker","currentElement","root","tabbableChild","firstChild","element","tabIndex","NodeFilter","FILTER_ACCEPT","FILTER_SKIP","current","nextElement","rove","focus"],"mappings":";;;;+BAGoBA;;;eAAAA;;;;iEAHG;AAGZ,SAASA;IAChB,MAAMC,oBAAoBC,OAAMC,MAAM;IACtC,MAAMC,aAAaF,OAAMG,WAAW,CAAC,CAACC;QAClCA,OAAOC,cAAc,GAAGD,OAAOE,IAAI;QACnC,IAAIC,gBAAgBH,OAAOI,UAAU,CAAC,CAACC,UAAUA,QAAQC,QAAQ,KAAK,IAAIC,WAAWC,aAAa,GAAGD,WAAWE,WAAW;QAC3HT,OAAOC,cAAc,GAAGD,OAAOE,IAAI;QACnCC,kBAAkB,QAAQA,kBAAkB,KAAK,IAAIA,gBAAgBA,gBAAgBH,OAAOI,UAAU;QACtG,IAAI,CAACD,eAAe;YAChB;QACJ;QACAA,cAAcG,QAAQ,GAAG;QACzBX,kBAAkBe,OAAO,GAAGP;QAC5B,IAAIQ,cAAc;QAClB,MAAM,AAACA,CAAAA,cAAcX,OAAOW,WAAW,EAAC,KAAMA,gBAAgBR,cAAc;YACxEQ,YAAYL,QAAQ,GAAG,CAAC;QAC5B;IACJ,GAAG,EAAE;IACL,MAAMM,OAAOhB,OAAMG,WAAW,CAAC,CAACY;QAC5B,IAAI,CAAChB,kBAAkBe,OAAO,EAAE;YAC5B;QACJ;QACAf,kBAAkBe,OAAO,CAACJ,QAAQ,GAAG,CAAC;QACtCK,YAAYL,QAAQ,GAAG;QACvBK,YAAYE,KAAK;QACjBlB,kBAAkBe,OAAO,GAAGC;IAChC,GAAG,EAAE;IACL,OAAO;QACHC;QACAd;IACJ;AACJ"}
+{"version":3,"sources":["useRovingTabIndexes.js"],"sourcesContent":["import * as React from 'react';\nimport { useFocusedElementChange } from '@fluentui/react-tabster';\nimport { elementContains } from '@fluentui/react-utilities';\n/**\n * https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex\n */ export function useRovingTabIndex() {\n    const currentElementRef = React.useRef();\n    const walkerRef = React.useRef(null);\n    useFocusedElementChange((element)=>{\n        if ((element === null || element === void 0 ? void 0 : element.getAttribute('role')) === 'treeitem' && walkerRef.current && elementContains(walkerRef.current.root, element)) {\n            rove(element);\n        }\n    });\n    const initialize = React.useCallback((walker)=>{\n        walkerRef.current = walker;\n        walker.currentElement = walker.root;\n        let tabbableChild = walker.firstChild((element)=>element.tabIndex === 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP);\n        walker.currentElement = walker.root;\n        tabbableChild !== null && tabbableChild !== void 0 ? tabbableChild : tabbableChild = walker.firstChild();\n        if (!tabbableChild) {\n            return;\n        }\n        tabbableChild.tabIndex = 0;\n        currentElementRef.current = tabbableChild;\n        let nextElement = null;\n        while((nextElement = walker.nextElement()) && nextElement !== tabbableChild){\n            nextElement.tabIndex = -1;\n        }\n    }, []);\n    const rove = React.useCallback((nextElement)=>{\n        if (!currentElementRef.current) {\n            return;\n        }\n        currentElementRef.current.tabIndex = -1;\n        nextElement.tabIndex = 0;\n        nextElement.focus();\n        currentElementRef.current = nextElement;\n    }, []);\n    return {\n        rove,\n        initialize\n    };\n}\n"],"names":["useRovingTabIndex","currentElementRef","React","useRef","walkerRef","useFocusedElementChange","element","getAttribute","current","elementContains","root","rove","initialize","useCallback","walker","currentElement","tabbableChild","firstChild","tabIndex","NodeFilter","FILTER_ACCEPT","FILTER_SKIP","nextElement","focus"],"mappings":";;;;+BAKoBA;;;eAAAA;;;;iEALG;8BACiB;gCACR;AAGrB,SAASA;IAChB,MAAMC,oBAAoBC,OAAMC,MAAM;IACtC,MAAMC,YAAYF,OAAMC,MAAM,CAAC;IAC/BE,IAAAA,qCAAuB,EAAC,CAACC;QACrB,IAAI,AAACA,CAAAA,YAAY,QAAQA,YAAY,KAAK,IAAI,KAAK,IAAIA,QAAQC,YAAY,CAAC,OAAM,MAAO,cAAcH,UAAUI,OAAO,IAAIC,IAAAA,+BAAe,EAACL,UAAUI,OAAO,CAACE,IAAI,EAAEJ,UAAU;YAC1KK,KAAKL;QACT;IACJ;IACA,MAAMM,aAAaV,OAAMW,WAAW,CAAC,CAACC;QAClCV,UAAUI,OAAO,GAAGM;QACpBA,OAAOC,cAAc,GAAGD,OAAOJ,IAAI;QACnC,IAAIM,gBAAgBF,OAAOG,UAAU,CAAC,CAACX,UAAUA,QAAQY,QAAQ,KAAK,IAAIC,WAAWC,aAAa,GAAGD,WAAWE,WAAW;QAC3HP,OAAOC,cAAc,GAAGD,OAAOJ,IAAI;QACnCM,kBAAkB,QAAQA,kBAAkB,KAAK,IAAIA,gBAAgBA,gBAAgBF,OAAOG,UAAU;QACtG,IAAI,CAACD,eAAe;YAChB;QACJ;QACAA,cAAcE,QAAQ,GAAG;QACzBjB,kBAAkBO,OAAO,GAAGQ;QAC5B,IAAIM,cAAc;QAClB,MAAM,AAACA,CAAAA,cAAcR,OAAOQ,WAAW,EAAC,KAAMA,gBAAgBN,cAAc;YACxEM,YAAYJ,QAAQ,GAAG,CAAC;QAC5B;IACJ,GAAG,EAAE;IACL,MAAMP,OAAOT,OAAMW,WAAW,CAAC,CAACS;QAC5B,IAAI,CAACrB,kBAAkBO,OAAO,EAAE;YAC5B;QACJ;QACAP,kBAAkBO,OAAO,CAACU,QAAQ,GAAG,CAAC;QACtCI,YAAYJ,QAAQ,GAAG;QACvBI,YAAYC,KAAK;QACjBtB,kBAAkBO,OAAO,GAAGc;IAChC,GAAG,EAAE;IACL,OAAO;QACHX;QACAC;IACJ;AACJ"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-tree",
-  "version": "9.4.39",
+  "version": "9.4.40",
   "description": "Tree component for Fluent UI React",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -37,15 +37,15 @@
   },
   "dependencies": {
     "@fluentui/keyboard-keys": "^9.0.7",
-    "@fluentui/react-aria": "^9.10.5",
-    "@fluentui/react-avatar": "^9.6.22",
-    "@fluentui/react-button": "^9.3.76",
-    "@fluentui/react-checkbox": "^9.2.21",
+    "@fluentui/react-aria": "^9.11.0",
+    "@fluentui/react-avatar": "^9.6.23",
+    "@fluentui/react-button": "^9.3.77",
+    "@fluentui/react-checkbox": "^9.2.22",
     "@fluentui/react-context-selector": "^9.1.58",
-    "@fluentui/react-icons": "^2.0.235",
-    "@fluentui/react-radio": "^9.2.16",
+    "@fluentui/react-icons": "^2.0.237",
+    "@fluentui/react-radio": "^9.2.17",
     "@fluentui/react-shared-contexts": "^9.17.0",
-    "@fluentui/react-tabster": "^9.20.1",
+    "@fluentui/react-tabster": "^9.21.0",
     "@fluentui/react-theme": "^9.1.19",
     "@fluentui/react-utilities": "^9.18.7",
     "@fluentui/react-jsx-runtime": "^9.0.36",