@fluentui/react-table 9.18.4 → 9.18.5

package/CHANGELOG.md

@@ -1,12 +1,30 @@
 # Change Log - @fluentui/react-table
 
-This log was last generated on Thu, 07 Aug 2025 09:59:08 GMT and should not be manually modified.
+This log was last generated on Thu, 21 Aug 2025 12:20:24 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.18.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-table_v9.18.5)
+
+Thu, 21 Aug 2025 12:20:24 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-table_v9.18.4..@fluentui/react-table_v9.18.5)
+
+### Patches
+
+- feat(react-table): Allow Left arrow to focus back to row in composite navigation ([PR #34984](https://github.com/microsoft/fluentui/pull/34984) by lingfangao@hotmail.com)
+- Bump @fluentui/react-aria to v9.16.4 ([PR #35055](https://github.com/microsoft/fluentui/pull/35055) by beachball)
+- Bump @fluentui/react-avatar to v9.9.5 ([PR #35055](https://github.com/microsoft/fluentui/pull/35055) by beachball)
+- Bump @fluentui/react-checkbox to v9.5.4 ([PR #35055](https://github.com/microsoft/fluentui/pull/35055) by beachball)
+- Bump @fluentui/react-context-selector to v9.2.6 ([PR #35055](https://github.com/microsoft/fluentui/pull/35055) by beachball)
+- Bump @fluentui/react-radio to v9.5.4 ([PR #35055](https://github.com/microsoft/fluentui/pull/35055) by beachball)
+- Bump @fluentui/react-shared-contexts to v9.25.0 ([PR #35055](https://github.com/microsoft/fluentui/pull/35055) by beachball)
+- Bump @fluentui/react-tabster to v9.26.4 ([PR #35055](https://github.com/microsoft/fluentui/pull/35055) by beachball)
+- Bump @fluentui/react-utilities to v9.24.0 ([PR #35055](https://github.com/microsoft/fluentui/pull/35055) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.1.6 ([PR #35055](https://github.com/microsoft/fluentui/pull/35055) by beachball)
+
 ## [9.18.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-table_v9.18.4)
 
-Thu, 07 Aug 2025 09:59:08 GMT 
+Thu, 07 Aug 2025 10:03:28 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-table_v9.18.3..@fluentui/react-table_v9.18.4)
 
 ### Patches

package/dist/index.d.ts

@@ -1,5 +1,3 @@
-/// <reference types="react" />
-
 import { ARIAButtonSlotProps } from '@fluentui/react-aria';
 import type { AvatarSize } from '@fluentui/react-avatar';
 import type { Checkbox } from '@fluentui/react-checkbox';

package/lib/hooks/useTableCompositeNavigation.js

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
-import { ArrowDown, ArrowRight, ArrowUp } from '@fluentui/keyboard-keys';
+import { ArrowDown, ArrowRight, ArrowUp, ArrowLeft } from '@fluentui/keyboard-keys';
 import { useArrowNavigationGroup, useFocusableGroup, useMergedTabsterAttributes_unstable, useFocusFinders, GroupperMoveFocusEvent, MoverMoveFocusEvent, GroupperMoveFocusActions, MoverKeys } from '@fluentui/react-tabster';
 import { isHTMLElement } from '@fluentui/react-utilities';
 export function useTableCompositeNavigation() {
@@ -44,7 +44,13 @@ export function useTableCompositeNavigation() {
             }
             return false;
         })();
-        // Escape groupper focus trap before arrow down
+        // Escape groupper focus trap before arrow left, arrow down or arrow up
+        if (e.key === ArrowLeft && isInCell) {
+            activeElement.dispatchEvent(new GroupperMoveFocusEvent({
+                action: GroupperMoveFocusActions.Escape
+            }));
+            return;
+        }
         if ((e.key === ArrowDown || e.key === ArrowUp) && isInCell) {
             activeElement.dispatchEvent(new GroupperMoveFocusEvent({
                 action: GroupperMoveFocusActions.Escape

package/lib/hooks/useTableCompositeNavigation.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/hooks/useTableCompositeNavigation.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { ArrowDown, ArrowRight, ArrowUp } from '@fluentui/keyboard-keys';\nimport {\n  useArrowNavigationGroup,\n  useFocusableGroup,\n  useMergedTabsterAttributes_unstable,\n  TabsterDOMAttribute,\n  useFocusFinders,\n  GroupperMoveFocusEvent,\n  MoverMoveFocusEvent,\n  GroupperMoveFocusActions,\n  MoverKeys,\n} from '@fluentui/react-tabster';\nimport { isHTMLElement } from '@fluentui/react-utilities';\n\nexport function useTableCompositeNavigation(): {\n  onTableKeyDown: React.KeyboardEventHandler;\n  tableTabsterAttribute: TabsterDOMAttribute;\n  tableRowTabsterAttribute: TabsterDOMAttribute;\n} {\n  const horizontalAttr = useArrowNavigationGroup({ axis: 'horizontal' });\n  const gridAttr = useArrowNavigationGroup({ axis: 'grid' });\n  const groupperAttr = useFocusableGroup({ tabBehavior: 'limited-trap-focus' });\n  const { findFirstFocusable } = useFocusFinders();\n  const { targetDocument } = useFluent();\n\n  const rowAttr = useMergedTabsterAttributes_unstable(horizontalAttr, groupperAttr);\n\n  const onKeyDown: React.KeyboardEventHandler = React.useCallback(\n    e => {\n      if (!targetDocument) {\n        return;\n      }\n\n      let activeElement = targetDocument.activeElement;\n      if (!activeElement || !e.currentTarget.contains(activeElement)) {\n        return;\n      }\n      const activeElementRole = activeElement.getAttribute('role');\n\n      // Enter groupper when in row focus mode to navigate cells\n      if (e.key === ArrowRight && activeElementRole === 'row' && isHTMLElement(activeElement)) {\n        findFirstFocusable(activeElement)?.focus();\n      }\n\n      if (activeElementRole === 'row') {\n        return;\n      }\n\n      const isInCell = (() => {\n        let cur = isHTMLElement(activeElement) ? activeElement : null;\n        while (cur) {\n          const curRole = cur.getAttribute('role');\n          if (curRole === 'cell' || curRole === 'gridcell') {\n            return true;\n          }\n\n          cur = cur.parentElement;\n        }\n\n        return false;\n      })();\n\n      // Escape groupper focus trap before arrow down\n      if ((e.key === ArrowDown || e.key === ArrowUp) && isInCell) {\n        activeElement.dispatchEvent(new GroupperMoveFocusEvent({ action: GroupperMoveFocusActions.Escape }));\n\n        activeElement = targetDocument.activeElement;\n\n        if (activeElement) {\n          activeElement.dispatchEvent(new MoverMoveFocusEvent({ key: MoverKeys[e.key] }));\n        }\n      }\n    },\n    [targetDocument, findFirstFocusable],\n  );\n\n  return {\n    onTableKeyDown: onKeyDown,\n    tableTabsterAttribute: gridAttr,\n    tableRowTabsterAttribute: rowAttr,\n  };\n}\n"],"names":["React","useFluent_unstable","useFluent","ArrowDown","ArrowRight","ArrowUp","useArrowNavigationGroup","useFocusableGroup","useMergedTabsterAttributes_unstable","useFocusFinders","GroupperMoveFocusEvent","MoverMoveFocusEvent","GroupperMoveFocusActions","MoverKeys","isHTMLElement","useTableCompositeNavigation","horizontalAttr","axis","gridAttr","groupperAttr","tabBehavior","findFirstFocusable","targetDocument","rowAttr","onKeyDown","useCallback","e","activeElement","currentTarget","contains","activeElementRole","getAttribute","key","focus","isInCell","cur","curRole","parentElement","dispatchEvent","action","Escape","onTableKeyDown","tableTabsterAttribute","tableRowTabsterAttribute"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,SAAS,EAAEC,UAAU,EAAEC,OAAO,QAAQ,0BAA0B;AACzE,SACEC,uBAAuB,EACvBC,iBAAiB,EACjBC,mCAAmC,EAEnCC,eAAe,EACfC,sBAAsB,EACtBC,mBAAmB,EACnBC,wBAAwB,EACxBC,SAAS,QACJ,0BAA0B;AACjC,SAASC,aAAa,QAAQ,4BAA4B;AAE1D,OAAO,SAASC;IAKd,MAAMC,iBAAiBV,wBAAwB;QAAEW,MAAM;IAAa;IACpE,MAAMC,WAAWZ,wBAAwB;QAAEW,MAAM;IAAO;IACxD,MAAME,eAAeZ,kBAAkB;QAAEa,aAAa;IAAqB;IAC3E,MAAM,EAAEC,kBAAkB,EAAE,GAAGZ;IAC/B,MAAM,EAAEa,cAAc,EAAE,GAAGpB;IAE3B,MAAMqB,UAAUf,oCAAoCQ,gBAAgBG;IAEpE,MAAMK,YAAwCxB,MAAMyB,WAAW,CAC7DC,CAAAA;QACE,IAAI,CAACJ,gBAAgB;YACnB;QACF;QAEA,IAAIK,gBAAgBL,eAAeK,aAAa;QAChD,IAAI,CAACA,iBAAiB,CAACD,EAAEE,aAAa,CAACC,QAAQ,CAACF,gBAAgB;YAC9D;QACF;QACA,MAAMG,oBAAoBH,cAAcI,YAAY,CAAC;QAErD,0DAA0D;QAC1D,IAAIL,EAAEM,GAAG,KAAK5B,cAAc0B,sBAAsB,SAAShB,cAAca,gBAAgB;gBACvFN;aAAAA,sBAAAA,mBAAmBM,4BAAnBN,0CAAAA,oBAAmCY,KAAK;QAC1C;QAEA,IAAIH,sBAAsB,OAAO;YAC/B;QACF;QAEA,MAAMI,WAAW,AAAC,CAAA;YAChB,IAAIC,MAAMrB,cAAca,iBAAiBA,gBAAgB;YACzD,MAAOQ,IAAK;gBACV,MAAMC,UAAUD,IAAIJ,YAAY,CAAC;gBACjC,IAAIK,YAAY,UAAUA,YAAY,YAAY;oBAChD,OAAO;gBACT;gBAEAD,MAAMA,IAAIE,aAAa;YACzB;YAEA,OAAO;QACT,CAAA;QAEA,+CAA+C;QAC/C,IAAI,AAACX,CAAAA,EAAEM,GAAG,KAAK7B,aAAauB,EAAEM,GAAG,KAAK3B,OAAM,KAAM6B,UAAU;YAC1DP,cAAcW,aAAa,CAAC,IAAI5B,uBAAuB;gBAAE6B,QAAQ3B,yBAAyB4B,MAAM;YAAC;YAEjGb,gBAAgBL,eAAeK,aAAa;YAE5C,IAAIA,eAAe;gBACjBA,cAAcW,aAAa,CAAC,IAAI3B,oBAAoB;oBAAEqB,KAAKnB,SAAS,CAACa,EAAEM,GAAG,CAAC;gBAAC;YAC9E;QACF;IACF,GACA;QAACV;QAAgBD;KAAmB;IAGtC,OAAO;QACLoB,gBAAgBjB;QAChBkB,uBAAuBxB;QACvByB,0BAA0BpB;IAC5B;AACF"}
+{"version":3,"sources":["../src/hooks/useTableCompositeNavigation.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { ArrowDown, ArrowRight, ArrowUp, ArrowLeft } from '@fluentui/keyboard-keys';\nimport {\n  useArrowNavigationGroup,\n  useFocusableGroup,\n  useMergedTabsterAttributes_unstable,\n  TabsterDOMAttribute,\n  useFocusFinders,\n  GroupperMoveFocusEvent,\n  MoverMoveFocusEvent,\n  GroupperMoveFocusActions,\n  MoverKeys,\n} from '@fluentui/react-tabster';\nimport { isHTMLElement } from '@fluentui/react-utilities';\n\nexport function useTableCompositeNavigation(): {\n  onTableKeyDown: React.KeyboardEventHandler;\n  tableTabsterAttribute: TabsterDOMAttribute;\n  tableRowTabsterAttribute: TabsterDOMAttribute;\n} {\n  const horizontalAttr = useArrowNavigationGroup({ axis: 'horizontal' });\n  const gridAttr = useArrowNavigationGroup({ axis: 'grid' });\n  const groupperAttr = useFocusableGroup({ tabBehavior: 'limited-trap-focus' });\n  const { findFirstFocusable } = useFocusFinders();\n  const { targetDocument } = useFluent();\n\n  const rowAttr = useMergedTabsterAttributes_unstable(horizontalAttr, groupperAttr);\n\n  const onKeyDown: React.KeyboardEventHandler = React.useCallback(\n    e => {\n      if (!targetDocument) {\n        return;\n      }\n\n      let activeElement = targetDocument.activeElement;\n      if (!activeElement || !e.currentTarget.contains(activeElement)) {\n        return;\n      }\n      const activeElementRole = activeElement.getAttribute('role');\n\n      // Enter groupper when in row focus mode to navigate cells\n      if (e.key === ArrowRight && activeElementRole === 'row' && isHTMLElement(activeElement)) {\n        findFirstFocusable(activeElement)?.focus();\n      }\n\n      if (activeElementRole === 'row') {\n        return;\n      }\n\n      const isInCell = (() => {\n        let cur = isHTMLElement(activeElement) ? activeElement : null;\n        while (cur) {\n          const curRole = cur.getAttribute('role');\n          if (curRole === 'cell' || curRole === 'gridcell') {\n            return true;\n          }\n\n          cur = cur.parentElement;\n        }\n\n        return false;\n      })();\n\n      // Escape groupper focus trap before arrow left, arrow down or arrow up\n      if (e.key === ArrowLeft && isInCell) {\n        activeElement.dispatchEvent(new GroupperMoveFocusEvent({ action: GroupperMoveFocusActions.Escape }));\n        return;\n      }\n      if ((e.key === ArrowDown || e.key === ArrowUp) && isInCell) {\n        activeElement.dispatchEvent(new GroupperMoveFocusEvent({ action: GroupperMoveFocusActions.Escape }));\n\n        activeElement = targetDocument.activeElement;\n\n        if (activeElement) {\n          activeElement.dispatchEvent(new MoverMoveFocusEvent({ key: MoverKeys[e.key] }));\n        }\n      }\n    },\n    [targetDocument, findFirstFocusable],\n  );\n\n  return {\n    onTableKeyDown: onKeyDown,\n    tableTabsterAttribute: gridAttr,\n    tableRowTabsterAttribute: rowAttr,\n  };\n}\n"],"names":["React","useFluent_unstable","useFluent","ArrowDown","ArrowRight","ArrowUp","ArrowLeft","useArrowNavigationGroup","useFocusableGroup","useMergedTabsterAttributes_unstable","useFocusFinders","GroupperMoveFocusEvent","MoverMoveFocusEvent","GroupperMoveFocusActions","MoverKeys","isHTMLElement","useTableCompositeNavigation","horizontalAttr","axis","gridAttr","groupperAttr","tabBehavior","findFirstFocusable","targetDocument","rowAttr","onKeyDown","useCallback","e","activeElement","currentTarget","contains","activeElementRole","getAttribute","key","focus","isInCell","cur","curRole","parentElement","dispatchEvent","action","Escape","onTableKeyDown","tableTabsterAttribute","tableRowTabsterAttribute"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,SAAS,EAAEC,UAAU,EAAEC,OAAO,EAAEC,SAAS,QAAQ,0BAA0B;AACpF,SACEC,uBAAuB,EACvBC,iBAAiB,EACjBC,mCAAmC,EAEnCC,eAAe,EACfC,sBAAsB,EACtBC,mBAAmB,EACnBC,wBAAwB,EACxBC,SAAS,QACJ,0BAA0B;AACjC,SAASC,aAAa,QAAQ,4BAA4B;AAE1D,OAAO,SAASC;IAKd,MAAMC,iBAAiBV,wBAAwB;QAAEW,MAAM;IAAa;IACpE,MAAMC,WAAWZ,wBAAwB;QAAEW,MAAM;IAAO;IACxD,MAAME,eAAeZ,kBAAkB;QAAEa,aAAa;IAAqB;IAC3E,MAAM,EAAEC,kBAAkB,EAAE,GAAGZ;IAC/B,MAAM,EAAEa,cAAc,EAAE,GAAGrB;IAE3B,MAAMsB,UAAUf,oCAAoCQ,gBAAgBG;IAEpE,MAAMK,YAAwCzB,MAAM0B,WAAW,CAC7DC,CAAAA;QACE,IAAI,CAACJ,gBAAgB;YACnB;QACF;QAEA,IAAIK,gBAAgBL,eAAeK,aAAa;QAChD,IAAI,CAACA,iBAAiB,CAACD,EAAEE,aAAa,CAACC,QAAQ,CAACF,gBAAgB;YAC9D;QACF;QACA,MAAMG,oBAAoBH,cAAcI,YAAY,CAAC;QAErD,0DAA0D;QAC1D,IAAIL,EAAEM,GAAG,KAAK7B,cAAc2B,sBAAsB,SAAShB,cAAca,gBAAgB;gBACvFN;aAAAA,sBAAAA,mBAAmBM,4BAAnBN,0CAAAA,oBAAmCY,KAAK;QAC1C;QAEA,IAAIH,sBAAsB,OAAO;YAC/B;QACF;QAEA,MAAMI,WAAW,AAAC,CAAA;YAChB,IAAIC,MAAMrB,cAAca,iBAAiBA,gBAAgB;YACzD,MAAOQ,IAAK;gBACV,MAAMC,UAAUD,IAAIJ,YAAY,CAAC;gBACjC,IAAIK,YAAY,UAAUA,YAAY,YAAY;oBAChD,OAAO;gBACT;gBAEAD,MAAMA,IAAIE,aAAa;YACzB;YAEA,OAAO;QACT,CAAA;QAEA,uEAAuE;QACvE,IAAIX,EAAEM,GAAG,KAAK3B,aAAa6B,UAAU;YACnCP,cAAcW,aAAa,CAAC,IAAI5B,uBAAuB;gBAAE6B,QAAQ3B,yBAAyB4B,MAAM;YAAC;YACjG;QACF;QACA,IAAI,AAACd,CAAAA,EAAEM,GAAG,KAAK9B,aAAawB,EAAEM,GAAG,KAAK5B,OAAM,KAAM8B,UAAU;YAC1DP,cAAcW,aAAa,CAAC,IAAI5B,uBAAuB;gBAAE6B,QAAQ3B,yBAAyB4B,MAAM;YAAC;YAEjGb,gBAAgBL,eAAeK,aAAa;YAE5C,IAAIA,eAAe;gBACjBA,cAAcW,aAAa,CAAC,IAAI3B,oBAAoB;oBAAEqB,KAAKnB,SAAS,CAACa,EAAEM,GAAG,CAAC;gBAAC;YAC9E;QACF;IACF,GACA;QAACV;QAAgBD;KAAmB;IAGtC,OAAO;QACLoB,gBAAgBjB;QAChBkB,uBAAuBxB;QACvByB,0BAA0BpB;IAC5B;AACF"}

package/lib-commonjs/hooks/useTableCompositeNavigation.js

@@ -55,7 +55,13 @@ function useTableCompositeNavigation() {
             }
             return false;
         })();
-        // Escape groupper focus trap before arrow down
+        // Escape groupper focus trap before arrow left, arrow down or arrow up
+        if (e.key === _keyboardkeys.ArrowLeft && isInCell) {
+            activeElement.dispatchEvent(new _reacttabster.GroupperMoveFocusEvent({
+                action: _reacttabster.GroupperMoveFocusActions.Escape
+            }));
+            return;
+        }
         if ((e.key === _keyboardkeys.ArrowDown || e.key === _keyboardkeys.ArrowUp) && isInCell) {
             activeElement.dispatchEvent(new _reacttabster.GroupperMoveFocusEvent({
                 action: _reacttabster.GroupperMoveFocusActions.Escape

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/hooks/useTableCompositeNavigation.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { ArrowDown, ArrowRight, ArrowUp } from '@fluentui/keyboard-keys';\nimport {\n  useArrowNavigationGroup,\n  useFocusableGroup,\n  useMergedTabsterAttributes_unstable,\n  TabsterDOMAttribute,\n  useFocusFinders,\n  GroupperMoveFocusEvent,\n  MoverMoveFocusEvent,\n  GroupperMoveFocusActions,\n  MoverKeys,\n} from '@fluentui/react-tabster';\nimport { isHTMLElement } from '@fluentui/react-utilities';\n\nexport function useTableCompositeNavigation(): {\n  onTableKeyDown: React.KeyboardEventHandler;\n  tableTabsterAttribute: TabsterDOMAttribute;\n  tableRowTabsterAttribute: TabsterDOMAttribute;\n} {\n  const horizontalAttr = useArrowNavigationGroup({ axis: 'horizontal' });\n  const gridAttr = useArrowNavigationGroup({ axis: 'grid' });\n  const groupperAttr = useFocusableGroup({ tabBehavior: 'limited-trap-focus' });\n  const { findFirstFocusable } = useFocusFinders();\n  const { targetDocument } = useFluent();\n\n  const rowAttr = useMergedTabsterAttributes_unstable(horizontalAttr, groupperAttr);\n\n  const onKeyDown: React.KeyboardEventHandler = React.useCallback(\n    e => {\n      if (!targetDocument) {\n        return;\n      }\n\n      let activeElement = targetDocument.activeElement;\n      if (!activeElement || !e.currentTarget.contains(activeElement)) {\n        return;\n      }\n      const activeElementRole = activeElement.getAttribute('role');\n\n      // Enter groupper when in row focus mode to navigate cells\n      if (e.key === ArrowRight && activeElementRole === 'row' && isHTMLElement(activeElement)) {\n        findFirstFocusable(activeElement)?.focus();\n      }\n\n      if (activeElementRole === 'row') {\n        return;\n      }\n\n      const isInCell = (() => {\n        let cur = isHTMLElement(activeElement) ? activeElement : null;\n        while (cur) {\n          const curRole = cur.getAttribute('role');\n          if (curRole === 'cell' || curRole === 'gridcell') {\n            return true;\n          }\n\n          cur = cur.parentElement;\n        }\n\n        return false;\n      })();\n\n      // Escape groupper focus trap before arrow down\n      if ((e.key === ArrowDown || e.key === ArrowUp) && isInCell) {\n        activeElement.dispatchEvent(new GroupperMoveFocusEvent({ action: GroupperMoveFocusActions.Escape }));\n\n        activeElement = targetDocument.activeElement;\n\n        if (activeElement) {\n          activeElement.dispatchEvent(new MoverMoveFocusEvent({ key: MoverKeys[e.key] }));\n        }\n      }\n    },\n    [targetDocument, findFirstFocusable],\n  );\n\n  return {\n    onTableKeyDown: onKeyDown,\n    tableTabsterAttribute: gridAttr,\n    tableRowTabsterAttribute: rowAttr,\n  };\n}\n"],"names":["React","useFluent_unstable","useFluent","ArrowDown","ArrowRight","ArrowUp","useArrowNavigationGroup","useFocusableGroup","useMergedTabsterAttributes_unstable","useFocusFinders","GroupperMoveFocusEvent","MoverMoveFocusEvent","GroupperMoveFocusActions","MoverKeys","isHTMLElement","useTableCompositeNavigation","horizontalAttr","axis","gridAttr","groupperAttr","tabBehavior","findFirstFocusable","targetDocument","rowAttr","onKeyDown","useCallback","e","activeElement","currentTarget","contains","activeElementRole","getAttribute","key","focus","isInCell","cur","curRole","parentElement","dispatchEvent","action","Escape","onTableKeyDown","tableTabsterAttribute","tableRowTabsterAttribute"],"mappings":";;;;+BAgBgBe;;;;;;;iEAhBO,QAAQ;qCACiB,kCAAkC;8BACnC,0BAA0B;8BAWlE,0BAA0B;gCACH,4BAA4B;AAEnD;IAKL,MAAMC,qBAAiBV,qCAAAA,EAAwB;QAAEW,MAAM;IAAa;IACpE,MAAMC,eAAWZ,qCAAAA,EAAwB;QAAEW,MAAM;IAAO;IACxD,MAAME,mBAAeZ,+BAAAA,EAAkB;QAAEa,aAAa;IAAqB;IAC3E,MAAM,EAAEC,kBAAkB,EAAE,GAAGZ,iCAAAA;IAC/B,MAAM,EAAEa,cAAc,EAAE,OAAGpB,uCAAAA;IAE3B,MAAMqB,cAAUf,iDAAAA,EAAoCQ,gBAAgBG;IAEpE,MAAMK,YAAwCxB,OAAMyB,WAAW,CAC7DC,CAAAA;QACE,IAAI,CAACJ,gBAAgB;YACnB;QACF;QAEA,IAAIK,gBAAgBL,eAAeK,aAAa;QAChD,IAAI,CAACA,iBAAiB,CAACD,EAAEE,aAAa,CAACC,QAAQ,CAACF,gBAAgB;YAC9D;QACF;QACA,MAAMG,oBAAoBH,cAAcI,YAAY,CAAC;QAErD,0DAA0D;QAC1D,IAAIL,EAAEM,GAAG,KAAK5B,wBAAAA,IAAc0B,sBAAsB,aAAShB,6BAAAA,EAAca,gBAAgB;gBACvFN;aAAAA,sBAAAA,mBAAmBM,cAAAA,MAAAA,QAAnBN,wBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,oBAAmCY,KAAK;QAC1C;QAEA,IAAIH,sBAAsB,OAAO;YAC/B;QACF;QAEA,MAAMI,WAAY,CAAA;YAChB,IAAIC,UAAMrB,6BAAAA,EAAca,iBAAiBA,gBAAgB;YACzD,MAAOQ,IAAK;gBACV,MAAMC,UAAUD,IAAIJ,YAAY,CAAC;gBACjC,IAAIK,YAAY,UAAUA,YAAY,YAAY;oBAChD,OAAO;gBACT;gBAEAD,MAAMA,IAAIE,aAAa;YACzB;YAEA,OAAO;SACT,CAAA;QAEA,+CAA+C;QAC/C,IAAKX,CAAAA,EAAEM,GAAG,KAAK7B,uBAAAA,IAAauB,EAAEM,GAAG,KAAK3B,qBAAAA,AAAM,KAAM6B,UAAU;YAC1DP,cAAcW,aAAa,CAAC,IAAI5B,oCAAAA,CAAuB;gBAAE6B,QAAQ3B,sCAAAA,CAAyB4B,MAAM;YAAC;YAEjGb,gBAAgBL,eAAeK,aAAa;YAE5C,IAAIA,eAAe;gBACjBA,cAAcW,aAAa,CAAC,IAAI3B,iCAAAA,CAAoB;oBAAEqB,KAAKnB,uBAAS,CAACa,EAAEM,GAAG,CAAC;gBAAC;YAC9E;QACF;IACF,GACA;QAACV;QAAgBD;KAAmB;IAGtC,OAAO;QACLoB,gBAAgBjB;QAChBkB,uBAAuBxB;QACvByB,0BAA0BpB;IAC5B;AACF"}
+{"version":3,"sources":["../src/hooks/useTableCompositeNavigation.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { ArrowDown, ArrowRight, ArrowUp, ArrowLeft } from '@fluentui/keyboard-keys';\nimport {\n  useArrowNavigationGroup,\n  useFocusableGroup,\n  useMergedTabsterAttributes_unstable,\n  TabsterDOMAttribute,\n  useFocusFinders,\n  GroupperMoveFocusEvent,\n  MoverMoveFocusEvent,\n  GroupperMoveFocusActions,\n  MoverKeys,\n} from '@fluentui/react-tabster';\nimport { isHTMLElement } from '@fluentui/react-utilities';\n\nexport function useTableCompositeNavigation(): {\n  onTableKeyDown: React.KeyboardEventHandler;\n  tableTabsterAttribute: TabsterDOMAttribute;\n  tableRowTabsterAttribute: TabsterDOMAttribute;\n} {\n  const horizontalAttr = useArrowNavigationGroup({ axis: 'horizontal' });\n  const gridAttr = useArrowNavigationGroup({ axis: 'grid' });\n  const groupperAttr = useFocusableGroup({ tabBehavior: 'limited-trap-focus' });\n  const { findFirstFocusable } = useFocusFinders();\n  const { targetDocument } = useFluent();\n\n  const rowAttr = useMergedTabsterAttributes_unstable(horizontalAttr, groupperAttr);\n\n  const onKeyDown: React.KeyboardEventHandler = React.useCallback(\n    e => {\n      if (!targetDocument) {\n        return;\n      }\n\n      let activeElement = targetDocument.activeElement;\n      if (!activeElement || !e.currentTarget.contains(activeElement)) {\n        return;\n      }\n      const activeElementRole = activeElement.getAttribute('role');\n\n      // Enter groupper when in row focus mode to navigate cells\n      if (e.key === ArrowRight && activeElementRole === 'row' && isHTMLElement(activeElement)) {\n        findFirstFocusable(activeElement)?.focus();\n      }\n\n      if (activeElementRole === 'row') {\n        return;\n      }\n\n      const isInCell = (() => {\n        let cur = isHTMLElement(activeElement) ? activeElement : null;\n        while (cur) {\n          const curRole = cur.getAttribute('role');\n          if (curRole === 'cell' || curRole === 'gridcell') {\n            return true;\n          }\n\n          cur = cur.parentElement;\n        }\n\n        return false;\n      })();\n\n      // Escape groupper focus trap before arrow left, arrow down or arrow up\n      if (e.key === ArrowLeft && isInCell) {\n        activeElement.dispatchEvent(new GroupperMoveFocusEvent({ action: GroupperMoveFocusActions.Escape }));\n        return;\n      }\n      if ((e.key === ArrowDown || e.key === ArrowUp) && isInCell) {\n        activeElement.dispatchEvent(new GroupperMoveFocusEvent({ action: GroupperMoveFocusActions.Escape }));\n\n        activeElement = targetDocument.activeElement;\n\n        if (activeElement) {\n          activeElement.dispatchEvent(new MoverMoveFocusEvent({ key: MoverKeys[e.key] }));\n        }\n      }\n    },\n    [targetDocument, findFirstFocusable],\n  );\n\n  return {\n    onTableKeyDown: onKeyDown,\n    tableTabsterAttribute: gridAttr,\n    tableRowTabsterAttribute: rowAttr,\n  };\n}\n"],"names":["React","useFluent_unstable","useFluent","ArrowDown","ArrowRight","ArrowUp","ArrowLeft","useArrowNavigationGroup","useFocusableGroup","useMergedTabsterAttributes_unstable","useFocusFinders","GroupperMoveFocusEvent","MoverMoveFocusEvent","GroupperMoveFocusActions","MoverKeys","isHTMLElement","useTableCompositeNavigation","horizontalAttr","axis","gridAttr","groupperAttr","tabBehavior","findFirstFocusable","targetDocument","rowAttr","onKeyDown","useCallback","e","activeElement","currentTarget","contains","activeElementRole","getAttribute","key","focus","isInCell","cur","curRole","parentElement","dispatchEvent","action","Escape","onTableKeyDown","tableTabsterAttribute","tableRowTabsterAttribute"],"mappings":";;;;+BAgBgBgB;;;;;;;iEAhBO,QAAQ;qCACiB,kCAAkC;8BACxB,0BAA0B;8BAW7E,0BAA0B;gCACH,4BAA4B;AAEnD;IAKL,MAAMC,qBAAiBV,qCAAAA,EAAwB;QAAEW,MAAM;IAAa;IACpE,MAAMC,eAAWZ,qCAAAA,EAAwB;QAAEW,MAAM;IAAO;IACxD,MAAME,mBAAeZ,+BAAAA,EAAkB;QAAEa,aAAa;IAAqB;IAC3E,MAAM,EAAEC,kBAAkB,EAAE,OAAGZ,6BAAAA;IAC/B,MAAM,EAAEa,cAAc,EAAE,GAAGrB,2CAAAA;IAE3B,MAAMsB,cAAUf,iDAAAA,EAAoCQ,gBAAgBG;IAEpE,MAAMK,YAAwCzB,OAAM0B,WAAW,CAC7DC,CAAAA;QACE,IAAI,CAACJ,gBAAgB;YACnB;QACF;QAEA,IAAIK,gBAAgBL,eAAeK,aAAa;QAChD,IAAI,CAACA,iBAAiB,CAACD,EAAEE,aAAa,CAACC,QAAQ,CAACF,gBAAgB;YAC9D;QACF;QACA,MAAMG,oBAAoBH,cAAcI,YAAY,CAAC;QAErD,0DAA0D;QAC1D,IAAIL,EAAEM,GAAG,KAAK7B,wBAAAA,IAAc2B,sBAAsB,aAAShB,6BAAAA,EAAca,gBAAgB;gBACvFN;aAAAA,sBAAAA,mBAAmBM,cAAAA,MAAAA,QAAnBN,wBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,oBAAmCY,KAAK;QAC1C;QAEA,IAAIH,sBAAsB,OAAO;YAC/B;QACF;QAEA,MAAMI,WAAY,CAAA;YAChB,IAAIC,UAAMrB,6BAAAA,EAAca,iBAAiBA,gBAAgB;YACzD,MAAOQ,IAAK;gBACV,MAAMC,UAAUD,IAAIJ,YAAY,CAAC;gBACjC,IAAIK,YAAY,UAAUA,YAAY,YAAY;oBAChD,OAAO;gBACT;gBAEAD,MAAMA,IAAIE,aAAa;YACzB;YAEA,OAAO;SACT,CAAA;QAEA,uEAAuE;QACvE,IAAIX,EAAEM,GAAG,KAAK3B,uBAAAA,IAAa6B,UAAU;YACnCP,cAAcW,aAAa,CAAC,IAAI5B,oCAAAA,CAAuB;gBAAE6B,QAAQ3B,sCAAAA,CAAyB4B,MAAM;YAAC;YACjG;QACF;QACA,IAAKd,CAAAA,EAAEM,GAAG,KAAK9B,uBAAAA,IAAawB,EAAEM,GAAG,KAAK5B,qBAAAA,AAAM,KAAM8B,UAAU;YAC1DP,cAAcW,aAAa,CAAC,IAAI5B,oCAAAA,CAAuB;gBAAE6B,QAAQ3B,sCAAAA,CAAyB4B,MAAM;YAAC;YAEjGb,gBAAgBL,eAAeK,aAAa;YAE5C,IAAIA,eAAe;gBACjBA,cAAcW,aAAa,CAAC,IAAI3B,iCAAAA,CAAoB;oBAAEqB,KAAKnB,uBAAS,CAACa,EAAEM,GAAG,CAAC;gBAAC;YAC9E;QACF;IACF,GACA;QAACV;QAAgBD;KAAmB;IAGtC,OAAO;QACLoB,gBAAgBjB;QAChBkB,uBAAuBxB;QACvByB,0BAA0BpB;IAC5B;AACF"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-table",
-  "version": "9.18.4",
+  "version": "9.18.5",
   "description": "React components for building web experiences",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -21,17 +21,17 @@
   },
   "dependencies": {
     "@fluentui/keyboard-keys": "^9.0.8",
-    "@fluentui/react-aria": "^9.16.3",
-    "@fluentui/react-avatar": "^9.9.4",
-    "@fluentui/react-checkbox": "^9.5.3",
-    "@fluentui/react-context-selector": "^9.2.5",
+    "@fluentui/react-aria": "^9.16.4",
+    "@fluentui/react-avatar": "^9.9.5",
+    "@fluentui/react-checkbox": "^9.5.4",
+    "@fluentui/react-context-selector": "^9.2.6",
     "@fluentui/react-icons": "^2.0.245",
-    "@fluentui/react-radio": "^9.5.3",
-    "@fluentui/react-shared-contexts": "^9.24.1",
-    "@fluentui/react-tabster": "^9.26.3",
+    "@fluentui/react-radio": "^9.5.4",
+    "@fluentui/react-shared-contexts": "^9.25.0",
+    "@fluentui/react-tabster": "^9.26.4",
     "@fluentui/react-theme": "^9.2.0",
-    "@fluentui/react-utilities": "^9.23.2",
-    "@fluentui/react-jsx-runtime": "^9.1.5",
+    "@fluentui/react-utilities": "^9.24.0",
+    "@fluentui/react-jsx-runtime": "^9.1.6",
     "@griffel/react": "^1.5.22",
     "@swc/helpers": "^0.5.1"
   },