@fluentui/react-tabster 0.0.0-nightly-20250424-0405.1 → 0.0.0-nightly-20250425-0406.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md
CHANGED
|
@@ -1,20 +1,29 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-tabster
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Fri, 25 Apr 2025 04:22:35 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
-
## [0.0.0-nightly-
|
|
7
|
+
## [0.0.0-nightly-20250425-0406.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-tabster_v0.0.0-nightly-20250425-0406.1)
|
|
8
8
|
|
|
9
|
-
|
|
10
|
-
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tabster_v9.24.
|
|
9
|
+
Fri, 25 Apr 2025 04:22:35 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tabster_v9.24.6..@fluentui/react-tabster_v0.0.0-nightly-20250425-0406.1)
|
|
11
11
|
|
|
12
12
|
### Changes
|
|
13
13
|
|
|
14
14
|
- Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/not available) by fluentui-internal@service.microsoft.com)
|
|
15
|
-
- Bump @fluentui/react-shared-contexts to v0.0.0-nightly-
|
|
16
|
-
- Bump @fluentui/react-theme to v0.0.0-nightly-
|
|
17
|
-
- Bump @fluentui/react-utilities to v0.0.0-nightly-
|
|
15
|
+
- Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20250425-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/8015b8f5bf07b1672470d7e95ca3923fa002c4f7) by beachball)
|
|
16
|
+
- Bump @fluentui/react-theme to v0.0.0-nightly-20250425-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/8015b8f5bf07b1672470d7e95ca3923fa002c4f7) by beachball)
|
|
17
|
+
- Bump @fluentui/react-utilities to v0.0.0-nightly-20250425-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/8015b8f5bf07b1672470d7e95ca3923fa002c4f7) by beachball)
|
|
18
|
+
|
|
19
|
+
## [9.24.6](https://github.com/microsoft/fluentui/tree/@fluentui/react-tabster_v9.24.6)
|
|
20
|
+
|
|
21
|
+
Thu, 24 Apr 2025 09:59:45 GMT
|
|
22
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tabster_v9.24.5..@fluentui/react-tabster_v9.24.6)
|
|
23
|
+
|
|
24
|
+
### Patches
|
|
25
|
+
|
|
26
|
+
- fix: use useLayoutEffect() for Tabster creation ([PR #34315](https://github.com/microsoft/fluentui/pull/34315) by olfedias@microsoft.com)
|
|
18
27
|
|
|
19
28
|
## [9.24.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-tabster_v9.24.5)
|
|
20
29
|
|
package/lib/hooks/useTabster.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { createTabster, disposeTabster } from 'tabster';
|
|
3
3
|
import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
|
|
4
|
-
import { getParent, usePrevious } from '@fluentui/react-utilities';
|
|
4
|
+
import { getParent, useIsomorphicLayoutEffect, usePrevious } from '@fluentui/react-utilities';
|
|
5
5
|
const DEFAULT_FACTORY = (tabster)=>{
|
|
6
6
|
return tabster;
|
|
7
7
|
};
|
|
@@ -29,7 +29,7 @@ const DEFAULT_FACTORY = (tabster)=>{
|
|
|
29
29
|
export function useTabster(factory = DEFAULT_FACTORY) {
|
|
30
30
|
const { targetDocument } = useFluent();
|
|
31
31
|
const factoryResultRef = React.useRef(null);
|
|
32
|
-
|
|
32
|
+
useIsomorphicLayoutEffect(()=>{
|
|
33
33
|
const tabster = createTabsterWithConfig(targetDocument);
|
|
34
34
|
if (tabster) {
|
|
35
35
|
factoryResultRef.current = factory(tabster);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/hooks/useTabster.ts"],"sourcesContent":["import * as React from 'react';\nimport { createTabster, disposeTabster, Types as TabsterTypes } from 'tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { getParent, usePrevious } from '@fluentui/react-utilities';\n\ninterface WindowWithTabsterShadowDOMAPI extends Window {\n __tabsterShadowDOMAPI?: TabsterTypes.DOMAPI;\n}\n\ntype UseTabsterFactory<FactoryResult> = (tabster: TabsterTypes.TabsterCore) => FactoryResult;\n\nconst DEFAULT_FACTORY: UseTabsterFactory<TabsterTypes.TabsterCore> = tabster => {\n return tabster;\n};\n\n/**\n * Creates a tabster instance with the provided configuration\n *\n * @internal\n * @param targetDocument\n */\nexport function createTabsterWithConfig(targetDocument: Document | undefined): TabsterTypes.TabsterCore | undefined {\n const defaultView = targetDocument?.defaultView || undefined;\n const shadowDOMAPI = (defaultView as WindowWithTabsterShadowDOMAPI | undefined)?.__tabsterShadowDOMAPI;\n\n if (defaultView) {\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 }\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 a ref to core instance or a factory result\n */\nexport function useTabster(): React.RefObject<TabsterTypes.TabsterCore | null>;\nexport function useTabster<FactoryResult>(\n factory: UseTabsterFactory<FactoryResult>,\n): React.RefObject<FactoryResult | null>;\n\nexport function useTabster<FactoryResult>(factory = DEFAULT_FACTORY) {\n const { targetDocument } = useFluent();\n const factoryResultRef = React.useRef<FactoryResult | null>(null);\n\n
|
|
1
|
+
{"version":3,"sources":["../src/hooks/useTabster.ts"],"sourcesContent":["import * as React from 'react';\nimport { createTabster, disposeTabster, Types as TabsterTypes } from 'tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { getParent, useIsomorphicLayoutEffect, usePrevious } from '@fluentui/react-utilities';\n\ninterface WindowWithTabsterShadowDOMAPI extends Window {\n __tabsterShadowDOMAPI?: TabsterTypes.DOMAPI;\n}\n\ntype UseTabsterFactory<FactoryResult> = (tabster: TabsterTypes.TabsterCore) => FactoryResult;\n\nconst DEFAULT_FACTORY: UseTabsterFactory<TabsterTypes.TabsterCore> = tabster => {\n return tabster;\n};\n\n/**\n * Creates a tabster instance with the provided configuration\n *\n * @internal\n * @param targetDocument\n */\nexport function createTabsterWithConfig(targetDocument: Document | undefined): TabsterTypes.TabsterCore | undefined {\n const defaultView = targetDocument?.defaultView || undefined;\n const shadowDOMAPI = (defaultView as WindowWithTabsterShadowDOMAPI | undefined)?.__tabsterShadowDOMAPI;\n\n if (defaultView) {\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 }\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 a ref to core instance or a factory result\n */\nexport function useTabster(): React.RefObject<TabsterTypes.TabsterCore | null>;\nexport function useTabster<FactoryResult>(\n factory: UseTabsterFactory<FactoryResult>,\n): React.RefObject<FactoryResult | null>;\n\nexport function useTabster<FactoryResult>(factory = DEFAULT_FACTORY) {\n const { targetDocument } = useFluent();\n const factoryResultRef = React.useRef<FactoryResult | null>(null);\n\n useIsomorphicLayoutEffect(() => {\n const tabster = createTabsterWithConfig(targetDocument);\n\n if (tabster) {\n factoryResultRef.current = factory(tabster) as FactoryResult;\n\n return () => {\n disposeTabster(tabster);\n factoryResultRef.current = null;\n };\n }\n }, [targetDocument, factory]);\n\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line\n const previousFactory = usePrevious(factory);\n\n if (previousFactory !== null && previousFactory !== factory) {\n throw new Error(\n [\n '@fluentui/react-tabster: ',\n 'The factory function passed to useTabster has changed. This should not ever happen.',\n ].join('\\n'),\n );\n }\n }\n\n return factoryResultRef;\n}\n"],"names":["React","createTabster","disposeTabster","useFluent_unstable","useFluent","getParent","useIsomorphicLayoutEffect","usePrevious","DEFAULT_FACTORY","tabster","createTabsterWithConfig","targetDocument","defaultView","undefined","shadowDOMAPI","__tabsterShadowDOMAPI","autoRoot","controlTab","checkUncontrolledTrappingFocus","element","firstElementChild","hasAttribute","DOMAPI","useTabster","factory","factoryResultRef","useRef","current","process","env","NODE_ENV","previousFactory","Error","join"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,EAAEC,cAAc,QAA+B,UAAU;AAC/E,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,SAAS,EAAEC,yBAAyB,EAAEC,WAAW,QAAQ,4BAA4B;AAQ9F,MAAMC,kBAA+DC,CAAAA;IACnE,OAAOA;AACT;AAEA;;;;;CAKC,GACD,OAAO,SAASC,wBAAwBC,cAAoC;IAC1E,MAAMC,cAAcD,CAAAA,2BAAAA,qCAAAA,eAAgBC,WAAW,KAAIC;IACnD,MAAMC,eAAgBF,wBAAAA,kCAAD,AAACA,YAA2DG,qBAAqB;IAEtG,IAAIH,aAAa;QACf,OAAOX,cAAcW,aAAa;YAChCI,UAAU,CAAC;YACXC,YAAY;YACZZ;YACAa,gCAAgCC,CAAAA;oBAC5BA;uBAAF,CAAC,GAACA,6BAAAA,QAAQC,iBAAiB,cAAzBD,iDAAAA,2BAA2BE,YAAY,CAAC;;YAC5CC,QAAQR;QACV;IACF;AACF;AAcA,OAAO,SAASS,WAA0BC,UAAUhB,eAAe;IACjE,MAAM,EAAEG,cAAc,EAAE,GAAGP;IAC3B,MAAMqB,mBAAmBzB,MAAM0B,MAAM,CAAuB;IAE5DpB,0BAA0B;QACxB,MAAMG,UAAUC,wBAAwBC;QAExC,IAAIF,SAAS;YACXgB,iBAAiBE,OAAO,GAAGH,QAAQf;YAEnC,OAAO;gBACLP,eAAeO;gBACfgB,iBAAiBE,OAAO,GAAG;YAC7B;QACF;IACF,GAAG;QAAChB;QAAgBa;KAAQ;IAE5B,IAAII,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzC,2BAA2B;QAC3B,MAAMC,kBAAkBxB,YAAYiB;QAEpC,IAAIO,oBAAoB,QAAQA,oBAAoBP,SAAS;YAC3D,MAAM,IAAIQ,MACR;gBACE;gBACA;aACD,CAACC,IAAI,CAAC;QAEX;IACF;IAEA,OAAOR;AACT"}
|
|
@@ -43,7 +43,7 @@ function createTabsterWithConfig(targetDocument) {
|
|
|
43
43
|
function useTabster(factory = DEFAULT_FACTORY) {
|
|
44
44
|
const { targetDocument } = (0, _reactsharedcontexts.useFluent_unstable)();
|
|
45
45
|
const factoryResultRef = _react.useRef(null);
|
|
46
|
-
|
|
46
|
+
(0, _reactutilities.useIsomorphicLayoutEffect)(()=>{
|
|
47
47
|
const tabster = createTabsterWithConfig(targetDocument);
|
|
48
48
|
if (tabster) {
|
|
49
49
|
factoryResultRef.current = factory(tabster);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/hooks/useTabster.ts"],"sourcesContent":["import * as React from 'react';\nimport { createTabster, disposeTabster, Types as TabsterTypes } from 'tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { getParent, usePrevious } from '@fluentui/react-utilities';\n\ninterface WindowWithTabsterShadowDOMAPI extends Window {\n __tabsterShadowDOMAPI?: TabsterTypes.DOMAPI;\n}\n\ntype UseTabsterFactory<FactoryResult> = (tabster: TabsterTypes.TabsterCore) => FactoryResult;\n\nconst DEFAULT_FACTORY: UseTabsterFactory<TabsterTypes.TabsterCore> = tabster => {\n return tabster;\n};\n\n/**\n * Creates a tabster instance with the provided configuration\n *\n * @internal\n * @param targetDocument\n */\nexport function createTabsterWithConfig(targetDocument: Document | undefined): TabsterTypes.TabsterCore | undefined {\n const defaultView = targetDocument?.defaultView || undefined;\n const shadowDOMAPI = (defaultView as WindowWithTabsterShadowDOMAPI | undefined)?.__tabsterShadowDOMAPI;\n\n if (defaultView) {\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 }\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 a ref to core instance or a factory result\n */\nexport function useTabster(): React.RefObject<TabsterTypes.TabsterCore | null>;\nexport function useTabster<FactoryResult>(\n factory: UseTabsterFactory<FactoryResult>,\n): React.RefObject<FactoryResult | null>;\n\nexport function useTabster<FactoryResult>(factory = DEFAULT_FACTORY) {\n const { targetDocument } = useFluent();\n const factoryResultRef = React.useRef<FactoryResult | null>(null);\n\n
|
|
1
|
+
{"version":3,"sources":["../src/hooks/useTabster.ts"],"sourcesContent":["import * as React from 'react';\nimport { createTabster, disposeTabster, Types as TabsterTypes } from 'tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { getParent, useIsomorphicLayoutEffect, usePrevious } from '@fluentui/react-utilities';\n\ninterface WindowWithTabsterShadowDOMAPI extends Window {\n __tabsterShadowDOMAPI?: TabsterTypes.DOMAPI;\n}\n\ntype UseTabsterFactory<FactoryResult> = (tabster: TabsterTypes.TabsterCore) => FactoryResult;\n\nconst DEFAULT_FACTORY: UseTabsterFactory<TabsterTypes.TabsterCore> = tabster => {\n return tabster;\n};\n\n/**\n * Creates a tabster instance with the provided configuration\n *\n * @internal\n * @param targetDocument\n */\nexport function createTabsterWithConfig(targetDocument: Document | undefined): TabsterTypes.TabsterCore | undefined {\n const defaultView = targetDocument?.defaultView || undefined;\n const shadowDOMAPI = (defaultView as WindowWithTabsterShadowDOMAPI | undefined)?.__tabsterShadowDOMAPI;\n\n if (defaultView) {\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 }\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 a ref to core instance or a factory result\n */\nexport function useTabster(): React.RefObject<TabsterTypes.TabsterCore | null>;\nexport function useTabster<FactoryResult>(\n factory: UseTabsterFactory<FactoryResult>,\n): React.RefObject<FactoryResult | null>;\n\nexport function useTabster<FactoryResult>(factory = DEFAULT_FACTORY) {\n const { targetDocument } = useFluent();\n const factoryResultRef = React.useRef<FactoryResult | null>(null);\n\n useIsomorphicLayoutEffect(() => {\n const tabster = createTabsterWithConfig(targetDocument);\n\n if (tabster) {\n factoryResultRef.current = factory(tabster) as FactoryResult;\n\n return () => {\n disposeTabster(tabster);\n factoryResultRef.current = null;\n };\n }\n }, [targetDocument, factory]);\n\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line\n const previousFactory = usePrevious(factory);\n\n if (previousFactory !== null && previousFactory !== factory) {\n throw new Error(\n [\n '@fluentui/react-tabster: ',\n 'The factory function passed to useTabster has changed. This should not ever happen.',\n ].join('\\n'),\n );\n }\n }\n\n return factoryResultRef;\n}\n"],"names":["createTabsterWithConfig","useTabster","DEFAULT_FACTORY","tabster","targetDocument","defaultView","undefined","shadowDOMAPI","__tabsterShadowDOMAPI","createTabster","autoRoot","controlTab","getParent","checkUncontrolledTrappingFocus","element","firstElementChild","hasAttribute","DOMAPI","factory","useFluent","factoryResultRef","React","useRef","useIsomorphicLayoutEffect","current","disposeTabster","process","env","NODE_ENV","previousFactory","usePrevious","Error","join"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAqBgBA,uBAAuB;eAAvBA;;IA4BAC,UAAU;eAAVA;;;;iEAjDO;yBAC8C;qCACrB;gCACkB;AAQlE,MAAMC,kBAA+DC,CAAAA;IACnE,OAAOA;AACT;AAQO,SAASH,wBAAwBI,cAAoC;IAC1E,MAAMC,cAAcD,CAAAA,2BAAAA,qCAAAA,eAAgBC,WAAW,KAAIC;IACnD,MAAMC,eAAgBF,wBAAAA,kCAAD,AAACA,YAA2DG,qBAAqB;IAEtG,IAAIH,aAAa;QACf,OAAOI,IAAAA,sBAAa,EAACJ,aAAa;YAChCK,UAAU,CAAC;YACXC,YAAY;YACZC,WAAAA,yBAAS;YACTC,gCAAgCC,CAAAA;oBAC5BA;uBAAF,CAAC,GAACA,6BAAAA,QAAQC,iBAAiB,cAAzBD,iDAAAA,2BAA2BE,YAAY,CAAC;;YAC5CC,QAAQV;QACV;IACF;AACF;AAcO,SAASN,WAA0BiB,UAAUhB,eAAe;IACjE,MAAM,EAAEE,cAAc,EAAE,GAAGe,IAAAA,uCAAS;IACpC,MAAMC,mBAAmBC,OAAMC,MAAM,CAAuB;IAE5DC,IAAAA,yCAAyB,EAAC;QACxB,MAAMpB,UAAUH,wBAAwBI;QAExC,IAAID,SAAS;YACXiB,iBAAiBI,OAAO,GAAGN,QAAQf;YAEnC,OAAO;gBACLsB,IAAAA,uBAAc,EAACtB;gBACfiB,iBAAiBI,OAAO,GAAG;YAC7B;QACF;IACF,GAAG;QAACpB;QAAgBc;KAAQ;IAE5B,IAAIQ,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzC,2BAA2B;QAC3B,MAAMC,kBAAkBC,IAAAA,2BAAW,EAACZ;QAEpC,IAAIW,oBAAoB,QAAQA,oBAAoBX,SAAS;YAC3D,MAAM,IAAIa,MACR;gBACE;gBACA;aACD,CAACC,IAAI,CAAC;QAEX;IACF;IAEA,OAAOZ;AACT"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-tabster",
|
|
3
|
-
"version": "0.0.0-nightly-
|
|
3
|
+
"version": "0.0.0-nightly-20250425-0406.1",
|
|
4
4
|
"description": "Utilities for focus management and facade for tabster",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -17,9 +17,9 @@
|
|
|
17
17
|
"@fluentui/scripts-cypress": "*"
|
|
18
18
|
},
|
|
19
19
|
"dependencies": {
|
|
20
|
-
"@fluentui/react-shared-contexts": "0.0.0-nightly-
|
|
21
|
-
"@fluentui/react-theme": "0.0.0-nightly-
|
|
22
|
-
"@fluentui/react-utilities": "0.0.0-nightly-
|
|
20
|
+
"@fluentui/react-shared-contexts": "0.0.0-nightly-20250425-0406.1",
|
|
21
|
+
"@fluentui/react-theme": "0.0.0-nightly-20250425-0406.1",
|
|
22
|
+
"@fluentui/react-utilities": "0.0.0-nightly-20250425-0406.1",
|
|
23
23
|
"@griffel/react": "^1.5.22",
|
|
24
24
|
"@swc/helpers": "^0.5.1",
|
|
25
25
|
"keyborg": "^2.6.0",
|