@fluentui/react-tabster 9.17.4 → 9.18.0

package/CHANGELOG.md

@@ -1,12 +1,26 @@
 # Change Log - @fluentui/react-tabster
 
-This log was last generated on Tue, 23 Jan 2024 15:06:25 GMT and should not be manually modified.
+This log was last generated on Tue, 30 Jan 2024 23:12:34 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.18.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-tabster_v9.18.0)
+
+Tue, 30 Jan 2024 23:12:34 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tabster_v9.17.4..@fluentui/react-tabster_v9.18.0)
+
+### Minor changes
+
+- Optional ShadowDOM support. ([PR #30429](https://github.com/microsoft/fluentui/pull/30429) by marata@microsoft.com)
+- Bump @fluentui/react-utilities to v9.18.0 ([PR #30429](https://github.com/microsoft/fluentui/pull/30429) by beachball)
+
+### Patches
+
+- Tabster 5.3.0 and Keyborg 2.4.1. ([PR #30387](https://github.com/microsoft/fluentui/pull/30387) by marata@microsoft.com)
+
 ## [9.17.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-tabster_v9.17.4)
 
-Tue, 23 Jan 2024 15:06:25 GMT 
+Tue, 23 Jan 2024 15:11:00 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tabster_v9.17.3..@fluentui/react-tabster_v9.17.4)
 
 ### Patches

package/dist/index.d.ts

@@ -1,10 +1,12 @@
+import { dispatchGroupperMoveFocusEvent } from 'tabster';
+import { dispatchMoverMoveFocusEvent } from 'tabster';
 import type { GriffelStyle } from '@griffel/react';
 import { KEYBORG_FOCUSIN } from 'keyborg';
 import { KeyborgFocusInEvent } from 'keyborg';
 import { makeResetStyles } from '@griffel/react';
 import * as React_2 from 'react';
 import type { RefObject } from 'react';
-import { Types } from 'tabster';
+import { Types as TabsterTypes } from 'tabster';
 
 /**
  * @internal
@@ -82,6 +84,10 @@ export declare interface CreateFocusOutlineStyleOptions extends Omit<CreateCusto
     enableOutline?: boolean;
 }
 
+export { dispatchGroupperMoveFocusEvent }
+
+export { dispatchMoverMoveFocusEvent }
+
 export declare type FocusOutlineOffset = Record<'top' | 'bottom' | 'left' | 'right', string>;
 
 export declare type FocusOutlineStyleOptions = {
@@ -101,13 +107,15 @@ export { KEYBORG_FOCUSIN }
 
 export { KeyborgFocusInEvent }
 
-export declare type TabsterDOMAttribute = Types.TabsterDOMAttribute;
+export declare type TabsterDOMAttribute = TabsterTypes.TabsterDOMAttribute;
+
+export { TabsterTypes }
 
 /**
  * A hook that returns the necessary tabster attributes to support arrow key navigation
  * @param options - Options to configure keyboard navigation
  */
-export declare const useArrowNavigationGroup: (options?: UseArrowNavigationGroupOptions) => Types.TabsterDOMAttribute;
+export declare const useArrowNavigationGroup: (options?: UseArrowNavigationGroupOptions) => TabsterTypes.TabsterDOMAttribute;
 
 export declare interface UseArrowNavigationGroupOptions {
     /**
@@ -132,7 +140,7 @@ export declare interface UseArrowNavigationGroupOptions {
     /**
      * Tabster should ignore default handling of keydown events
      */
-    ignoreDefaultKeydown?: Types.FocusableProps['ignoreKeydown'];
+    ignoreDefaultKeydown?: TabsterTypes.FocusableProps['ignoreKeydown'];
     /**
      * The default focusable item in the group will be an element with Focusable.isDefault property.
      * Note that there is no way in \@fluentui/react-tabster to set default focusable element,
@@ -145,7 +153,7 @@ export declare interface UseArrowNavigationGroupOptions {
  * A hook that returns the necessary tabster attributes to support groupping.
  * @param options - Options to configure keyboard navigation
  */
-export declare const useFocusableGroup: (options?: UseFocusableGroupOptions) => Types.TabsterDOMAttribute;
+export declare const useFocusableGroup: (options?: UseFocusableGroupOptions) => TabsterTypes.TabsterDOMAttribute;
 
 export declare interface UseFocusableGroupOptions {
     /**
@@ -155,7 +163,7 @@ export declare interface UseFocusableGroupOptions {
     /**
      * Tabster can ignore default handling of keydown events
      */
-    ignoreDefaultKeydown?: Types.FocusableProps['ignoreKeydown'];
+    ignoreDefaultKeydown?: TabsterTypes.FocusableProps['ignoreKeydown'];
 }
 
 /**
@@ -165,8 +173,8 @@ export declare const useFocusFinders: () => {
     findAllFocusable: (container: HTMLElement, acceptCondition?: ((el: HTMLElement) => boolean) | undefined) => HTMLElement[];
     findFirstFocusable: (container: HTMLElement) => HTMLElement | null | undefined;
     findLastFocusable: (container: HTMLElement) => HTMLElement | null | undefined;
-    findNextFocusable: (currentElement: HTMLElement, options?: Pick<Partial<Types.FindNextProps>, 'container'>) => HTMLElement | null | undefined;
-    findPrevFocusable: (currentElement: HTMLElement, options?: Pick<Partial<Types.FindNextProps>, 'container'>) => HTMLElement | null | undefined;
+    findNextFocusable: (currentElement: HTMLElement, options?: Pick<Partial<TabsterTypes.FindNextProps>, 'container'>) => HTMLElement | null | undefined;
+    findPrevFocusable: (currentElement: HTMLElement, options?: Pick<Partial<TabsterTypes.FindNextProps>, 'container'>) => HTMLElement | null | undefined;
 };
 
 /**
@@ -174,7 +182,7 @@ export declare const useFocusFinders: () => {
  * @param name - The observed element to focus
  * @returns Function that will focus the
  */
-export declare function useFocusObserved(name: string, options?: UseFocusObservedOptions): () => Types.ObservedElementAsyncRequest<boolean>;
+export declare function useFocusObserved(name: string, options?: UseFocusObservedOptions): () => TabsterTypes.ObservedElementAsyncRequest<boolean>;
 
 declare interface UseFocusObservedOptions {
     /**
@@ -211,7 +219,7 @@ export declare function useKeyboardNavAttribute<E extends HTMLElement>(): RefObj
  * @param attributes - collection of tabster attributes from other react-tabster hooks
  * @returns single merged tabster attribute
  */
-export declare const useMergedTabsterAttributes_unstable: (...attributes: Types.TabsterDOMAttribute[]) => Types.TabsterDOMAttribute;
+export declare const useMergedTabsterAttributes_unstable: (...attributes: TabsterTypes.TabsterDOMAttribute[]) => TabsterTypes.TabsterDOMAttribute;
 
 /**
  * Applies modal dialog behaviour through DOM attributes
@@ -221,8 +229,8 @@ export declare const useMergedTabsterAttributes_unstable: (...attributes: Types.
  * @returns DOM attributes to apply to the modal element and its trigger
  */
 export declare const useModalAttributes: (options?: UseModalAttributesOptions) => {
-    modalAttributes: Types.TabsterDOMAttribute;
-    triggerAttributes: Types.TabsterDOMAttribute;
+    modalAttributes: TabsterTypes.TabsterDOMAttribute;
+    triggerAttributes: TabsterTypes.TabsterDOMAttribute;
 };
 
 export declare interface UseModalAttributesOptions {
@@ -250,7 +258,7 @@ export declare interface UseModalAttributesOptions {
     id?: string;
 }
 
-export declare function useObservedElement(name: string | string[]): Types.TabsterDOMAttribute;
+export declare function useObservedElement(name: string | string[]): TabsterTypes.TabsterDOMAttribute;
 
 /**
  * Instantiates [keyborg](https://github.com/microsoft/keyborg) and subscribes to changes
@@ -264,24 +272,24 @@ export declare function useOnKeyboardNavigationChange(callback: (isNavigatingWit
  * Focus will be restored to the most recent target element when it is lost from a source
  * @returns Attribute to apply to the element that might lose focus
  */
-export declare function useRestoreFocusSource(): Types.TabsterDOMAttribute;
+export declare function useRestoreFocusSource(): TabsterTypes.TabsterDOMAttribute;
 
 /**
  * Focus will be restored to the most recent target element when it is lost from a source
  * @returns Attribute to apply to the target element where focus is restored
  */
-export declare function useRestoreFocusTarget(): Types.TabsterDOMAttribute;
+export declare function useRestoreFocusTarget(): TabsterTypes.TabsterDOMAttribute;
 
 /**
  * @internal
  * Hook that returns tabster attributes while ensuring tabster exists
  */
-export declare const useTabsterAttributes: (props: Types.TabsterAttributeProps) => Types.TabsterDOMAttribute;
+export declare const useTabsterAttributes: (props: TabsterTypes.TabsterAttributeProps) => TabsterTypes.TabsterDOMAttribute;
 
 /**
  * Designates an area where tabster does not control focus
  * @returns Attribute to apply to the target element that should be uncontrolled by tabster
  */
-export declare function useUncontrolledFocus(): Types.TabsterDOMAttribute;
+export declare function useUncontrolledFocus(): TabsterTypes.TabsterDOMAttribute;
 
 export { }

package/lib/hooks/useTabster.js

@@ -11,6 +11,7 @@ import { useIsomorphicLayoutEffect, getParent } from '@fluentui/react-utilities'
  */ export const useTabster = ()=>{
     const { targetDocument } = useFluent();
     const defaultView = (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView) || undefined;
+    const shadowDOMAPI = defaultView === null || defaultView === void 0 ? void 0 : defaultView.__tabsterShadowDOMAPI;
     const tabster = React.useMemo(()=>{
         if (!defaultView) {
             return null;
@@ -22,10 +23,12 @@ import { useIsomorphicLayoutEffect, getParent } from '@fluentui/react-utilities'
             checkUncontrolledTrappingFocus: (element)=>{
                 var _element_firstElementChild;
                 return !!((_element_firstElementChild = element.firstElementChild) === null || _element_firstElementChild === void 0 ? void 0 : _element_firstElementChild.hasAttribute('data-is-focus-trap-zone-bumper'));
-            }
+            },
+            DOMAPI: shadowDOMAPI
         });
     }, [
-        defaultView
+        defaultView,
+        shadowDOMAPI
     ]);
     useIsomorphicLayoutEffect(()=>{
         return ()=>{

package/lib/hooks/useTabster.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTabster.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { createTabster, disposeTabster, Types as TabsterTypes } from 'tabster';\nimport { useIsomorphicLayoutEffect, getParent } from '@fluentui/react-utilities';\n\n/**\n * Tries to get a tabster instance on the current window or creates a new one\n * Since Tabster is single instance only, feel free to call this hook to ensure Tabster exists if necessary\n *\n * @internal\n * @returns Tabster core instance\n */\nexport const useTabster = (): TabsterTypes.TabsterCore | null => {\n  const { targetDocument } = useFluent();\n\n  const defaultView = targetDocument?.defaultView || undefined;\n  const tabster = React.useMemo(() => {\n    if (!defaultView) {\n      return null;\n    }\n\n    return createTabster(defaultView, {\n      autoRoot: {},\n      controlTab: false,\n      getParent,\n      checkUncontrolledTrappingFocus: element =>\n        !!element.firstElementChild?.hasAttribute('data-is-focus-trap-zone-bumper'),\n    });\n  }, [defaultView]);\n\n  useIsomorphicLayoutEffect(() => {\n    return () => {\n      if (tabster) {\n        disposeTabster(tabster);\n      }\n    };\n  }, [tabster]);\n\n  return tabster;\n};\n"],"names":["React","useFluent_unstable","useFluent","createTabster","disposeTabster","useIsomorphicLayoutEffect","getParent","useTabster","targetDocument","defaultView","undefined","tabster","useMemo","autoRoot","controlTab","checkUncontrolledTrappingFocus","element","firstElementChild","hasAttribute"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,aAAa,EAAEC,cAAc,QAA+B,UAAU;AAC/E,SAASC,yBAAyB,EAAEC,SAAS,QAAQ,4BAA4B;AAEjF;;;;;;CAMC,GACD,OAAO,MAAMC,aAAa;IACxB,MAAM,EAAEC,cAAc,EAAE,GAAGN;IAE3B,MAAMO,cAAcD,CAAAA,2BAAAA,qCAAAA,eAAgBC,WAAW,KAAIC;IACnD,MAAMC,UAAUX,MAAMY,OAAO,CAAC;QAC5B,IAAI,CAACH,aAAa;YAChB,OAAO;QACT;QAEA,OAAON,cAAcM,aAAa;YAChCI,UAAU,CAAC;YACXC,YAAY;YACZR;YACAS,gCAAgCC,CAAAA;oBAC5BA;uBAAF,CAAC,GAACA,6BAAAA,QAAQC,iBAAiB,cAAzBD,iDAAAA,2BAA2BE,YAAY,CAAC;;QAC9C;IACF,GAAG;QAACT;KAAY;IAEhBJ,0BAA0B;QACxB,OAAO;YACL,IAAIM,SAAS;gBACXP,eAAeO;YACjB;QACF;IACF,GAAG;QAACA;KAAQ;IAEZ,OAAOA;AACT,EAAE"}
+{"version":3,"sources":["useTabster.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { createTabster, disposeTabster, Types as TabsterTypes } from 'tabster';\nimport { useIsomorphicLayoutEffect, getParent } from '@fluentui/react-utilities';\n\ninterface WindowWithTabsterShadowDOMAPI extends Window {\n  __tabsterShadowDOMAPI?: TabsterTypes.DOMAPI;\n}\n\n/**\n * Tries to get a tabster instance on the current window or creates a new one\n * Since Tabster is single instance only, feel free to call this hook to ensure Tabster exists if necessary\n *\n * @internal\n * @returns Tabster core instance\n */\nexport const useTabster = (): TabsterTypes.TabsterCore | null => {\n  const { targetDocument } = useFluent();\n\n  const defaultView = targetDocument?.defaultView || undefined;\n\n  const shadowDOMAPI = (defaultView as WindowWithTabsterShadowDOMAPI | undefined)?.__tabsterShadowDOMAPI;\n\n  const tabster = React.useMemo(() => {\n    if (!defaultView) {\n      return null;\n    }\n\n    return createTabster(defaultView, {\n      autoRoot: {},\n      controlTab: false,\n      getParent,\n      checkUncontrolledTrappingFocus: element =>\n        !!element.firstElementChild?.hasAttribute('data-is-focus-trap-zone-bumper'),\n      DOMAPI: shadowDOMAPI,\n    });\n  }, [defaultView, shadowDOMAPI]);\n\n  useIsomorphicLayoutEffect(() => {\n    return () => {\n      if (tabster) {\n        disposeTabster(tabster);\n      }\n    };\n  }, [tabster]);\n\n  return tabster;\n};\n"],"names":["React","useFluent_unstable","useFluent","createTabster","disposeTabster","useIsomorphicLayoutEffect","getParent","useTabster","targetDocument","defaultView","undefined","shadowDOMAPI","__tabsterShadowDOMAPI","tabster","useMemo","autoRoot","controlTab","checkUncontrolledTrappingFocus","element","firstElementChild","hasAttribute","DOMAPI"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,aAAa,EAAEC,cAAc,QAA+B,UAAU;AAC/E,SAASC,yBAAyB,EAAEC,SAAS,QAAQ,4BAA4B;AAMjF;;;;;;CAMC,GACD,OAAO,MAAMC,aAAa;IACxB,MAAM,EAAEC,cAAc,EAAE,GAAGN;IAE3B,MAAMO,cAAcD,CAAAA,2BAAAA,qCAAAA,eAAgBC,WAAW,KAAIC;IAEnD,MAAMC,eAAgBF,wBAAAA,kCAAD,AAACA,YAA2DG,qBAAqB;IAEtG,MAAMC,UAAUb,MAAMc,OAAO,CAAC;QAC5B,IAAI,CAACL,aAAa;YAChB,OAAO;QACT;QAEA,OAAON,cAAcM,aAAa;YAChCM,UAAU,CAAC;YACXC,YAAY;YACZV;YACAW,gCAAgCC,CAAAA;oBAC5BA;uBAAF,CAAC,GAACA,6BAAAA,QAAQC,iBAAiB,cAAzBD,iDAAAA,2BAA2BE,YAAY,CAAC;;YAC5CC,QAAQV;QACV;IACF,GAAG;QAACF;QAAaE;KAAa;IAE9BN,0BAA0B;QACxB,OAAO;YACL,IAAIQ,SAAS;gBACXT,eAAeS;YACjB;QACF;IACF,GAAG;QAACA;KAAQ;IAEZ,OAAOA;AACT,EAAE"}

package/lib/index.js

@@ -1,4 +1,7 @@
 export { useArrowNavigationGroup, useFocusableGroup, useFocusFinders, useFocusVisible, useFocusWithin, useKeyboardNavAttribute, useModalAttributes, useTabsterAttributes, useObservedElement, useFocusObserved, useMergedTabsterAttributes_unstable, useRestoreFocusSource, useRestoreFocusTarget, useUncontrolledFocus, useOnKeyboardNavigationChange } from './hooks/index';
 export { createCustomFocusIndicatorStyle, createFocusOutlineStyle } from './focus/index';
 export { applyFocusVisiblePolyfill } from './focus/index';
+import { Types as TabsterTypes, dispatchGroupperMoveFocusEvent, dispatchMoverMoveFocusEvent } from 'tabster';
 export { KEYBORG_FOCUSIN } from 'keyborg';
+// @internal (undocumented)
+export { TabsterTypes, dispatchGroupperMoveFocusEvent, dispatchMoverMoveFocusEvent };

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export {\n  useArrowNavigationGroup,\n  useFocusableGroup,\n  useFocusFinders,\n  useFocusVisible,\n  useFocusWithin,\n  useKeyboardNavAttribute,\n  useModalAttributes,\n  useTabsterAttributes,\n  useObservedElement,\n  useFocusObserved,\n  useMergedTabsterAttributes_unstable,\n  useRestoreFocusSource,\n  useRestoreFocusTarget,\n  useUncontrolledFocus,\n  useOnKeyboardNavigationChange,\n} from './hooks/index';\nexport type {\n  UseArrowNavigationGroupOptions,\n  UseFocusableGroupOptions,\n  UseModalAttributesOptions,\n} from './hooks/index';\n\nexport { createCustomFocusIndicatorStyle, createFocusOutlineStyle } from './focus/index';\n\nexport type {\n  CreateCustomFocusIndicatorStyleOptions,\n  CreateFocusOutlineStyleOptions,\n  FocusOutlineOffset,\n  FocusOutlineStyleOptions,\n} from './focus/index';\n\nexport { applyFocusVisiblePolyfill } from './focus/index';\nimport { Types as TabsterTypes } from 'tabster';\n\nexport type TabsterDOMAttribute = TabsterTypes.TabsterDOMAttribute;\n\nexport type { KeyborgFocusInEvent } from 'keyborg';\nexport { KEYBORG_FOCUSIN } from 'keyborg';\n"],"names":["useArrowNavigationGroup","useFocusableGroup","useFocusFinders","useFocusVisible","useFocusWithin","useKeyboardNavAttribute","useModalAttributes","useTabsterAttributes","useObservedElement","useFocusObserved","useMergedTabsterAttributes_unstable","useRestoreFocusSource","useRestoreFocusTarget","useUncontrolledFocus","useOnKeyboardNavigationChange","createCustomFocusIndicatorStyle","createFocusOutlineStyle","applyFocusVisiblePolyfill","KEYBORG_FOCUSIN"],"mappings":"AAAA,SACEA,uBAAuB,EACvBC,iBAAiB,EACjBC,eAAe,EACfC,eAAe,EACfC,cAAc,EACdC,uBAAuB,EACvBC,kBAAkB,EAClBC,oBAAoB,EACpBC,kBAAkB,EAClBC,gBAAgB,EAChBC,mCAAmC,EACnCC,qBAAqB,EACrBC,qBAAqB,EACrBC,oBAAoB,EACpBC,6BAA6B,QACxB,gBAAgB;AAOvB,SAASC,+BAA+B,EAAEC,uBAAuB,QAAQ,gBAAgB;AASzF,SAASC,yBAAyB,QAAQ,gBAAgB;AAM1D,SAASC,eAAe,QAAQ,UAAU"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export {\n  useArrowNavigationGroup,\n  useFocusableGroup,\n  useFocusFinders,\n  useFocusVisible,\n  useFocusWithin,\n  useKeyboardNavAttribute,\n  useModalAttributes,\n  useTabsterAttributes,\n  useObservedElement,\n  useFocusObserved,\n  useMergedTabsterAttributes_unstable,\n  useRestoreFocusSource,\n  useRestoreFocusTarget,\n  useUncontrolledFocus,\n  useOnKeyboardNavigationChange,\n} from './hooks/index';\nexport type {\n  UseArrowNavigationGroupOptions,\n  UseFocusableGroupOptions,\n  UseModalAttributesOptions,\n} from './hooks/index';\n\nexport { createCustomFocusIndicatorStyle, createFocusOutlineStyle } from './focus/index';\n\nexport type {\n  CreateCustomFocusIndicatorStyleOptions,\n  CreateFocusOutlineStyleOptions,\n  FocusOutlineOffset,\n  FocusOutlineStyleOptions,\n} from './focus/index';\n\nexport { applyFocusVisiblePolyfill } from './focus/index';\nimport { Types as TabsterTypes, dispatchGroupperMoveFocusEvent, dispatchMoverMoveFocusEvent } from 'tabster';\n\nexport type TabsterDOMAttribute = TabsterTypes.TabsterDOMAttribute;\n\nexport type { KeyborgFocusInEvent } from 'keyborg';\nexport { KEYBORG_FOCUSIN } from 'keyborg';\n\n// @internal (undocumented)\nexport { TabsterTypes, dispatchGroupperMoveFocusEvent, dispatchMoverMoveFocusEvent };\n"],"names":["useArrowNavigationGroup","useFocusableGroup","useFocusFinders","useFocusVisible","useFocusWithin","useKeyboardNavAttribute","useModalAttributes","useTabsterAttributes","useObservedElement","useFocusObserved","useMergedTabsterAttributes_unstable","useRestoreFocusSource","useRestoreFocusTarget","useUncontrolledFocus","useOnKeyboardNavigationChange","createCustomFocusIndicatorStyle","createFocusOutlineStyle","applyFocusVisiblePolyfill","Types","TabsterTypes","dispatchGroupperMoveFocusEvent","dispatchMoverMoveFocusEvent","KEYBORG_FOCUSIN"],"mappings":"AAAA,SACEA,uBAAuB,EACvBC,iBAAiB,EACjBC,eAAe,EACfC,eAAe,EACfC,cAAc,EACdC,uBAAuB,EACvBC,kBAAkB,EAClBC,oBAAoB,EACpBC,kBAAkB,EAClBC,gBAAgB,EAChBC,mCAAmC,EACnCC,qBAAqB,EACrBC,qBAAqB,EACrBC,oBAAoB,EACpBC,6BAA6B,QACxB,gBAAgB;AAOvB,SAASC,+BAA+B,EAAEC,uBAAuB,QAAQ,gBAAgB;AASzF,SAASC,yBAAyB,QAAQ,gBAAgB;AAC1D,SAASC,SAASC,YAAY,EAAEC,8BAA8B,EAAEC,2BAA2B,QAAQ,UAAU;AAK7G,SAASC,eAAe,QAAQ,UAAU;AAE1C,2BAA2B;AAC3B,SAASH,YAAY,EAAEC,8BAA8B,EAAEC,2BAA2B,GAAG"}

package/lib-commonjs/hooks/useTabster.js

@@ -16,6 +16,7 @@ const _reactutilities = require("@fluentui/react-utilities");
 const useTabster = ()=>{
     const { targetDocument } = (0, _reactsharedcontexts.useFluent_unstable)();
     const defaultView = (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView) || undefined;
+    const shadowDOMAPI = defaultView === null || defaultView === void 0 ? void 0 : defaultView.__tabsterShadowDOMAPI;
     const tabster = _react.useMemo(()=>{
         if (!defaultView) {
             return null;
@@ -27,10 +28,12 @@ const useTabster = ()=>{
             checkUncontrolledTrappingFocus: (element)=>{
                 var _element_firstElementChild;
                 return !!((_element_firstElementChild = element.firstElementChild) === null || _element_firstElementChild === void 0 ? void 0 : _element_firstElementChild.hasAttribute('data-is-focus-trap-zone-bumper'));
-            }
+            },
+            DOMAPI: shadowDOMAPI
         });
     }, [
-        defaultView
+        defaultView,
+        shadowDOMAPI
     ]);
     (0, _reactutilities.useIsomorphicLayoutEffect)(()=>{
         return ()=>{

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

@@ -1 +1 @@
-{"version":3,"sources":["useTabster.js"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { createTabster, disposeTabster } from 'tabster';\nimport { useIsomorphicLayoutEffect, getParent } from '@fluentui/react-utilities';\n/**\n * Tries to get a tabster instance on the current window or creates a new one\n * Since Tabster is single instance only, feel free to call this hook to ensure Tabster exists if necessary\n *\n * @internal\n * @returns Tabster core instance\n */ export const useTabster = ()=>{\n    const { targetDocument } = useFluent();\n    const defaultView = (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView) || undefined;\n    const tabster = React.useMemo(()=>{\n        if (!defaultView) {\n            return null;\n        }\n        return createTabster(defaultView, {\n            autoRoot: {},\n            controlTab: false,\n            getParent,\n            checkUncontrolledTrappingFocus: (element)=>{\n                var _element_firstElementChild;\n                return !!((_element_firstElementChild = element.firstElementChild) === null || _element_firstElementChild === void 0 ? void 0 : _element_firstElementChild.hasAttribute('data-is-focus-trap-zone-bumper'));\n            }\n        });\n    }, [\n        defaultView\n    ]);\n    useIsomorphicLayoutEffect(()=>{\n        return ()=>{\n            if (tabster) {\n                disposeTabster(tabster);\n            }\n        };\n    }, [\n        tabster\n    ]);\n    return tabster;\n};\n"],"names":["useTabster","targetDocument","useFluent","defaultView","undefined","tabster","React","useMemo","createTabster","autoRoot","controlTab","getParent","checkUncontrolledTrappingFocus","element","_element_firstElementChild","firstElementChild","hasAttribute","useIsomorphicLayoutEffect","disposeTabster"],"mappings":";;;;+BAUiBA;;;eAAAA;;;;iEAVM;qCACyB;yBACF;gCACO;AAO1C,MAAMA,aAAa;IAC1B,MAAM,EAAEC,cAAc,EAAE,GAAGC,IAAAA,uCAAS;IACpC,MAAMC,cAAc,AAACF,CAAAA,mBAAmB,QAAQA,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeE,WAAW,AAAD,KAAMC;IACpH,MAAMC,UAAUC,OAAMC,OAAO,CAAC;QAC1B,IAAI,CAACJ,aAAa;YACd,OAAO;QACX;QACA,OAAOK,IAAAA,sBAAa,EAACL,aAAa;YAC9BM,UAAU,CAAC;YACXC,YAAY;YACZC,WAAAA,yBAAS;YACTC,gCAAgC,CAACC;gBAC7B,IAAIC;gBACJ,OAAO,CAAC,CAAE,CAAA,AAACA,CAAAA,6BAA6BD,QAAQE,iBAAiB,AAAD,MAAO,QAAQD,+BAA+B,KAAK,IAAI,KAAK,IAAIA,2BAA2BE,YAAY,CAAC,iCAAgC;YAC5M;QACJ;IACJ,GAAG;QACCb;KACH;IACDc,IAAAA,yCAAyB,EAAC;QACtB,OAAO;YACH,IAAIZ,SAAS;gBACTa,IAAAA,uBAAc,EAACb;YACnB;QACJ;IACJ,GAAG;QACCA;KACH;IACD,OAAOA;AACX"}
+{"version":3,"sources":["useTabster.js"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { createTabster, disposeTabster } from 'tabster';\nimport { useIsomorphicLayoutEffect, getParent } from '@fluentui/react-utilities';\n/**\n * Tries to get a tabster instance on the current window or creates a new one\n * Since Tabster is single instance only, feel free to call this hook to ensure Tabster exists if necessary\n *\n * @internal\n * @returns Tabster core instance\n */ export const useTabster = ()=>{\n    const { targetDocument } = useFluent();\n    const defaultView = (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView) || undefined;\n    const shadowDOMAPI = defaultView === null || defaultView === void 0 ? void 0 : defaultView.__tabsterShadowDOMAPI;\n    const tabster = React.useMemo(()=>{\n        if (!defaultView) {\n            return null;\n        }\n        return createTabster(defaultView, {\n            autoRoot: {},\n            controlTab: false,\n            getParent,\n            checkUncontrolledTrappingFocus: (element)=>{\n                var _element_firstElementChild;\n                return !!((_element_firstElementChild = element.firstElementChild) === null || _element_firstElementChild === void 0 ? void 0 : _element_firstElementChild.hasAttribute('data-is-focus-trap-zone-bumper'));\n            },\n            DOMAPI: shadowDOMAPI\n        });\n    }, [\n        defaultView,\n        shadowDOMAPI\n    ]);\n    useIsomorphicLayoutEffect(()=>{\n        return ()=>{\n            if (tabster) {\n                disposeTabster(tabster);\n            }\n        };\n    }, [\n        tabster\n    ]);\n    return tabster;\n};\n"],"names":["useTabster","targetDocument","useFluent","defaultView","undefined","shadowDOMAPI","__tabsterShadowDOMAPI","tabster","React","useMemo","createTabster","autoRoot","controlTab","getParent","checkUncontrolledTrappingFocus","element","_element_firstElementChild","firstElementChild","hasAttribute","DOMAPI","useIsomorphicLayoutEffect","disposeTabster"],"mappings":";;;;+BAUiBA;;;eAAAA;;;;iEAVM;qCACyB;yBACF;gCACO;AAO1C,MAAMA,aAAa;IAC1B,MAAM,EAAEC,cAAc,EAAE,GAAGC,IAAAA,uCAAS;IACpC,MAAMC,cAAc,AAACF,CAAAA,mBAAmB,QAAQA,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeE,WAAW,AAAD,KAAMC;IACpH,MAAMC,eAAeF,gBAAgB,QAAQA,gBAAgB,KAAK,IAAI,KAAK,IAAIA,YAAYG,qBAAqB;IAChH,MAAMC,UAAUC,OAAMC,OAAO,CAAC;QAC1B,IAAI,CAACN,aAAa;YACd,OAAO;QACX;QACA,OAAOO,IAAAA,sBAAa,EAACP,aAAa;YAC9BQ,UAAU,CAAC;YACXC,YAAY;YACZC,WAAAA,yBAAS;YACTC,gCAAgC,CAACC;gBAC7B,IAAIC;gBACJ,OAAO,CAAC,CAAE,CAAA,AAACA,CAAAA,6BAA6BD,QAAQE,iBAAiB,AAAD,MAAO,QAAQD,+BAA+B,KAAK,IAAI,KAAK,IAAIA,2BAA2BE,YAAY,CAAC,iCAAgC;YAC5M;YACAC,QAAQd;QACZ;IACJ,GAAG;QACCF;QACAE;KACH;IACDe,IAAAA,yCAAyB,EAAC;QACtB,OAAO;YACH,IAAIb,SAAS;gBACTc,IAAAA,uBAAc,EAACd;YACnB;QACJ;IACJ,GAAG;QACCA;KACH;IACD,OAAOA;AACX"}

package/lib-commonjs/index.js

@@ -65,8 +65,18 @@ _export(exports, {
     },
     KEYBORG_FOCUSIN: function() {
         return _keyborg.KEYBORG_FOCUSIN;
+    },
+    TabsterTypes: function() {
+        return _tabster.Types;
+    },
+    dispatchGroupperMoveFocusEvent: function() {
+        return _tabster.dispatchGroupperMoveFocusEvent;
+    },
+    dispatchMoverMoveFocusEvent: function() {
+        return _tabster.dispatchMoverMoveFocusEvent;
     }
 });
 const _index = require("./hooks/index");
 const _index1 = require("./focus/index");
+const _tabster = require("tabster");
 const _keyborg = require("keyborg");

package/lib-commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.js"],"sourcesContent":["export { useArrowNavigationGroup, useFocusableGroup, useFocusFinders, useFocusVisible, useFocusWithin, useKeyboardNavAttribute, useModalAttributes, useTabsterAttributes, useObservedElement, useFocusObserved, useMergedTabsterAttributes_unstable, useRestoreFocusSource, useRestoreFocusTarget, useUncontrolledFocus, useOnKeyboardNavigationChange } from './hooks/index';\nexport { createCustomFocusIndicatorStyle, createFocusOutlineStyle } from './focus/index';\nexport { applyFocusVisiblePolyfill } from './focus/index';\nexport { KEYBORG_FOCUSIN } from 'keyborg';\n"],"names":["useArrowNavigationGroup","useFocusableGroup","useFocusFinders","useFocusVisible","useFocusWithin","useKeyboardNavAttribute","useModalAttributes","useTabsterAttributes","useObservedElement","useFocusObserved","useMergedTabsterAttributes_unstable","useRestoreFocusSource","useRestoreFocusTarget","useUncontrolledFocus","useOnKeyboardNavigationChange","createCustomFocusIndicatorStyle","createFocusOutlineStyle","applyFocusVisiblePolyfill","KEYBORG_FOCUSIN"],"mappings":";;;;;;;;;;;IAASA,uBAAuB;eAAvBA,8BAAuB;;IAAEC,iBAAiB;eAAjBA,wBAAiB;;IAAEC,eAAe;eAAfA,sBAAe;;IAAEC,eAAe;eAAfA,sBAAe;;IAAEC,cAAc;eAAdA,qBAAc;;IAAEC,uBAAuB;eAAvBA,8BAAuB;;IAAEC,kBAAkB;eAAlBA,yBAAkB;;IAAEC,oBAAoB;eAApBA,2BAAoB;;IAAEC,kBAAkB;eAAlBA,yBAAkB;;IAAEC,gBAAgB;eAAhBA,uBAAgB;;IAAEC,mCAAmC;eAAnCA,0CAAmC;;IAAEC,qBAAqB;eAArBA,4BAAqB;;IAAEC,qBAAqB;eAArBA,4BAAqB;;IAAEC,oBAAoB;eAApBA,2BAAoB;;IAAEC,6BAA6B;eAA7BA,oCAA6B;;IAC7UC,+BAA+B;eAA/BA,uCAA+B;;IAAEC,uBAAuB;eAAvBA,+BAAuB;;IACxDC,yBAAyB;eAAzBA,iCAAyB;;IACzBC,eAAe;eAAfA,wBAAe;;;uBAHsU;wBACrR;yBAEzC"}
+{"version":3,"sources":["index.js"],"sourcesContent":["export { useArrowNavigationGroup, useFocusableGroup, useFocusFinders, useFocusVisible, useFocusWithin, useKeyboardNavAttribute, useModalAttributes, useTabsterAttributes, useObservedElement, useFocusObserved, useMergedTabsterAttributes_unstable, useRestoreFocusSource, useRestoreFocusTarget, useUncontrolledFocus, useOnKeyboardNavigationChange } from './hooks/index';\nexport { createCustomFocusIndicatorStyle, createFocusOutlineStyle } from './focus/index';\nexport { applyFocusVisiblePolyfill } from './focus/index';\nimport { Types as TabsterTypes, dispatchGroupperMoveFocusEvent, dispatchMoverMoveFocusEvent } from 'tabster';\nexport { KEYBORG_FOCUSIN } from 'keyborg';\n// @internal (undocumented)\nexport { TabsterTypes, dispatchGroupperMoveFocusEvent, dispatchMoverMoveFocusEvent };\n"],"names":["useArrowNavigationGroup","useFocusableGroup","useFocusFinders","useFocusVisible","useFocusWithin","useKeyboardNavAttribute","useModalAttributes","useTabsterAttributes","useObservedElement","useFocusObserved","useMergedTabsterAttributes_unstable","useRestoreFocusSource","useRestoreFocusTarget","useUncontrolledFocus","useOnKeyboardNavigationChange","createCustomFocusIndicatorStyle","createFocusOutlineStyle","applyFocusVisiblePolyfill","KEYBORG_FOCUSIN","TabsterTypes","dispatchGroupperMoveFocusEvent","dispatchMoverMoveFocusEvent"],"mappings":";;;;;;;;;;;IAASA,uBAAuB;eAAvBA,8BAAuB;;IAAEC,iBAAiB;eAAjBA,wBAAiB;;IAAEC,eAAe;eAAfA,sBAAe;;IAAEC,eAAe;eAAfA,sBAAe;;IAAEC,cAAc;eAAdA,qBAAc;;IAAEC,uBAAuB;eAAvBA,8BAAuB;;IAAEC,kBAAkB;eAAlBA,yBAAkB;;IAAEC,oBAAoB;eAApBA,2BAAoB;;IAAEC,kBAAkB;eAAlBA,yBAAkB;;IAAEC,gBAAgB;eAAhBA,uBAAgB;;IAAEC,mCAAmC;eAAnCA,0CAAmC;;IAAEC,qBAAqB;eAArBA,4BAAqB;;IAAEC,qBAAqB;eAArBA,4BAAqB;;IAAEC,oBAAoB;eAApBA,2BAAoB;;IAAEC,6BAA6B;eAA7BA,oCAA6B;;IAC7UC,+BAA+B;eAA/BA,uCAA+B;;IAAEC,uBAAuB;eAAvBA,+BAAuB;;IACxDC,yBAAyB;eAAzBA,iCAAyB;;IAEzBC,eAAe;eAAfA,wBAAe;;IAEfC,YAAY;eAAZA,cAAY;;IAAEC,8BAA8B;eAA9BA,uCAA8B;;IAAEC,2BAA2B;eAA3BA,oCAA2B;;;uBAN4Q;wBACrR;yBAE0B;yBACnE"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-tabster",
-  "version": "9.17.4",
+  "version": "9.18.0",
   "description": "Utilities for focus management and facade for tabster",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -33,11 +33,11 @@
   "dependencies": {
     "@fluentui/react-shared-contexts": "^9.14.0",
     "@fluentui/react-theme": "^9.1.16",
-    "@fluentui/react-utilities": "^9.17.0",
+    "@fluentui/react-utilities": "^9.18.0",
     "@griffel/react": "^1.5.14",
     "@swc/helpers": "^0.5.1",
-    "keyborg": "^2.3.0",
-    "tabster": "^5.0.1"
+    "keyborg": "^2.5.0",
+    "tabster": "^6.0.0"
   },
   "peerDependencies": {
     "@types/react": ">=16.14.0 <19.0.0",