@fluentui/react-tabster 9.2.0 → 9.3.0
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.json +93 -4
- package/CHANGELOG.md +33 -5
- package/README.md +1 -1
- package/dist/index.d.ts +2 -2
- package/lib/hooks/useArrowNavigationGroup.js +3 -0
- package/lib/hooks/useArrowNavigationGroup.js.map +1 -1
- package/lib/hooks/useFocusFinders.js.map +1 -1
- package/lib-commonjs/hooks/useArrowNavigationGroup.js +3 -0
- package/lib-commonjs/hooks/useArrowNavigationGroup.js.map +1 -1
- package/lib-commonjs/hooks/useFocusFinders.js.map +1 -1
- package/package.json +9 -8
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,96 @@
|
|
|
2
2
|
"name": "@fluentui/react-tabster",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
5
|
+
"date": "Fri, 11 Nov 2022 14:53:31 GMT",
|
|
6
|
+
"tag": "@fluentui/react-tabster_v9.3.0",
|
|
7
|
+
"version": "9.3.0",
|
|
8
|
+
"comments": {
|
|
9
|
+
"patch": [
|
|
10
|
+
{
|
|
11
|
+
"author": "martinhochel@microsoft.com",
|
|
12
|
+
"package": "@fluentui/react-tabster",
|
|
13
|
+
"commit": "b3907043bd8d7b650c55e8e7c3119b14f2606c38",
|
|
14
|
+
"comment": "fix: create valid export maps"
|
|
15
|
+
}
|
|
16
|
+
],
|
|
17
|
+
"minor": [
|
|
18
|
+
{
|
|
19
|
+
"author": "chassunc@microsoft.com",
|
|
20
|
+
"package": "@fluentui/react-tabster",
|
|
21
|
+
"commit": "65b289ef0e47b684365058f16b50587a5fae8633",
|
|
22
|
+
"comment": "Add both options to axis config"
|
|
23
|
+
},
|
|
24
|
+
{
|
|
25
|
+
"author": "beachball",
|
|
26
|
+
"package": "@fluentui/react-tabster",
|
|
27
|
+
"comment": "Bump @fluentui/react-shared-contexts to v9.1.1",
|
|
28
|
+
"commit": "b4c9a0ae8d7444bf746f1307ab01e2dc16310720"
|
|
29
|
+
},
|
|
30
|
+
{
|
|
31
|
+
"author": "beachball",
|
|
32
|
+
"package": "@fluentui/react-tabster",
|
|
33
|
+
"comment": "Bump @fluentui/react-theme to v9.1.2",
|
|
34
|
+
"commit": "b4c9a0ae8d7444bf746f1307ab01e2dc16310720"
|
|
35
|
+
},
|
|
36
|
+
{
|
|
37
|
+
"author": "beachball",
|
|
38
|
+
"package": "@fluentui/react-tabster",
|
|
39
|
+
"comment": "Bump @fluentui/react-utilities to v9.2.1",
|
|
40
|
+
"commit": "b4c9a0ae8d7444bf746f1307ab01e2dc16310720"
|
|
41
|
+
}
|
|
42
|
+
]
|
|
43
|
+
}
|
|
44
|
+
},
|
|
45
|
+
{
|
|
46
|
+
"date": "Wed, 02 Nov 2022 11:58:04 GMT",
|
|
47
|
+
"tag": "@fluentui/react-tabster_v9.2.1",
|
|
48
|
+
"version": "9.2.1",
|
|
49
|
+
"comments": {
|
|
50
|
+
"patch": [
|
|
51
|
+
{
|
|
52
|
+
"author": "marcosvmmoura@gmail.com",
|
|
53
|
+
"package": "@fluentui/react-tabster",
|
|
54
|
+
"commit": "dd1a128086fc22c5402f5e8ddbaeaad181803289",
|
|
55
|
+
"comment": "make allowCondition a optional parameter for findAllFocusable function"
|
|
56
|
+
},
|
|
57
|
+
{
|
|
58
|
+
"author": "olfedias@microsoft.com",
|
|
59
|
+
"package": "@fluentui/react-tabster",
|
|
60
|
+
"commit": "c619ba066f11a8654e95375314824ba6b81b003e",
|
|
61
|
+
"comment": "chore: Update Griffel to latest version"
|
|
62
|
+
},
|
|
63
|
+
{
|
|
64
|
+
"author": "beachball",
|
|
65
|
+
"package": "@fluentui/react-tabster",
|
|
66
|
+
"comment": "Bump @fluentui/react-shared-contexts to v9.1.0",
|
|
67
|
+
"commit": "393a7b169155997a97a6ce1ad36ee3eafc6f461b"
|
|
68
|
+
},
|
|
69
|
+
{
|
|
70
|
+
"author": "beachball",
|
|
71
|
+
"package": "@fluentui/react-tabster",
|
|
72
|
+
"comment": "Bump @fluentui/react-utilities to v9.2.0",
|
|
73
|
+
"commit": "393a7b169155997a97a6ce1ad36ee3eafc6f461b"
|
|
74
|
+
}
|
|
75
|
+
]
|
|
76
|
+
}
|
|
77
|
+
},
|
|
78
|
+
{
|
|
79
|
+
"date": "Tue, 25 Oct 2022 00:35:37 GMT",
|
|
80
|
+
"tag": "@fluentui/react-tabster_v9.2.0",
|
|
81
|
+
"version": "9.2.0",
|
|
82
|
+
"comments": {
|
|
83
|
+
"none": [
|
|
84
|
+
{
|
|
85
|
+
"author": "miroslav.stastny@microsoft.com",
|
|
86
|
+
"package": "@fluentui/react-tabster",
|
|
87
|
+
"commit": "6ced976a8d0e6a0e2e207da8fe0eb810e2bd19bc",
|
|
88
|
+
"comment": "Update package readme"
|
|
89
|
+
}
|
|
90
|
+
]
|
|
91
|
+
}
|
|
92
|
+
},
|
|
93
|
+
{
|
|
94
|
+
"date": "Thu, 20 Oct 2022 08:39:51 GMT",
|
|
6
95
|
"tag": "@fluentui/react-tabster_v9.2.0",
|
|
7
96
|
"version": "9.2.0",
|
|
8
97
|
"comments": {
|
|
@@ -37,19 +126,19 @@
|
|
|
37
126
|
"author": "beachball",
|
|
38
127
|
"package": "@fluentui/react-tabster",
|
|
39
128
|
"comment": "Bump @fluentui/react-shared-contexts to v9.0.2",
|
|
40
|
-
"commit": "
|
|
129
|
+
"commit": "5ea1372675d910d76cf1b9cbd74d05b7c4e8fcbc"
|
|
41
130
|
},
|
|
42
131
|
{
|
|
43
132
|
"author": "beachball",
|
|
44
133
|
"package": "@fluentui/react-tabster",
|
|
45
134
|
"comment": "Bump @fluentui/react-theme to v9.1.1",
|
|
46
|
-
"commit": "
|
|
135
|
+
"commit": "5ea1372675d910d76cf1b9cbd74d05b7c4e8fcbc"
|
|
47
136
|
},
|
|
48
137
|
{
|
|
49
138
|
"author": "beachball",
|
|
50
139
|
"package": "@fluentui/react-tabster",
|
|
51
140
|
"comment": "Bump @fluentui/react-utilities to v9.1.2",
|
|
52
|
-
"commit": "
|
|
141
|
+
"commit": "5ea1372675d910d76cf1b9cbd74d05b7c4e8fcbc"
|
|
53
142
|
}
|
|
54
143
|
]
|
|
55
144
|
}
|
package/CHANGELOG.md
CHANGED
|
@@ -1,20 +1,48 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-tabster
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Fri, 11 Nov 2022 14:53:31 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [9.3.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-tabster_v9.3.0)
|
|
8
|
+
|
|
9
|
+
Fri, 11 Nov 2022 14:53:31 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tabster_v9.2.1..@fluentui/react-tabster_v9.3.0)
|
|
11
|
+
|
|
12
|
+
### Minor changes
|
|
13
|
+
|
|
14
|
+
- Add both options to axis config ([PR #25568](https://github.com/microsoft/fluentui/pull/25568) by chassunc@microsoft.com)
|
|
15
|
+
- Bump @fluentui/react-shared-contexts to v9.1.1 ([PR #25615](https://github.com/microsoft/fluentui/pull/25615) by beachball)
|
|
16
|
+
- Bump @fluentui/react-theme to v9.1.2 ([PR #25615](https://github.com/microsoft/fluentui/pull/25615) by beachball)
|
|
17
|
+
- Bump @fluentui/react-utilities to v9.2.1 ([PR #25615](https://github.com/microsoft/fluentui/pull/25615) by beachball)
|
|
18
|
+
|
|
19
|
+
### Patches
|
|
20
|
+
|
|
21
|
+
- fix: create valid export maps ([PR #25558](https://github.com/microsoft/fluentui/pull/25558) by martinhochel@microsoft.com)
|
|
22
|
+
|
|
23
|
+
## [9.2.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-tabster_v9.2.1)
|
|
24
|
+
|
|
25
|
+
Wed, 02 Nov 2022 11:58:04 GMT
|
|
26
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tabster_v9.2.0..@fluentui/react-tabster_v9.2.1)
|
|
27
|
+
|
|
28
|
+
### Patches
|
|
29
|
+
|
|
30
|
+
- make allowCondition a optional parameter for findAllFocusable function ([PR #25416](https://github.com/microsoft/fluentui/pull/25416) by marcosvmmoura@gmail.com)
|
|
31
|
+
- chore: Update Griffel to latest version ([PR #25412](https://github.com/microsoft/fluentui/pull/25412) by olfedias@microsoft.com)
|
|
32
|
+
- Bump @fluentui/react-shared-contexts to v9.1.0 ([PR #25456](https://github.com/microsoft/fluentui/pull/25456) by beachball)
|
|
33
|
+
- Bump @fluentui/react-utilities to v9.2.0 ([PR #25456](https://github.com/microsoft/fluentui/pull/25456) by beachball)
|
|
34
|
+
|
|
7
35
|
## [9.2.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-tabster_v9.2.0)
|
|
8
36
|
|
|
9
|
-
Thu, 20 Oct 2022 08:
|
|
37
|
+
Thu, 20 Oct 2022 08:39:51 GMT
|
|
10
38
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tabster_v9.1.3..@fluentui/react-tabster_v9.2.0)
|
|
11
39
|
|
|
12
40
|
### Minor changes
|
|
13
41
|
|
|
14
42
|
- feat: Bump tabster to 3.0.4 ([PR #25294](https://github.com/microsoft/fluentui/pull/25294) by lingfangao@hotmail.com)
|
|
15
|
-
- Bump @fluentui/react-shared-contexts to v9.0.2 ([
|
|
16
|
-
- Bump @fluentui/react-theme to v9.1.1 ([
|
|
17
|
-
- Bump @fluentui/react-utilities to v9.1.2 ([
|
|
43
|
+
- Bump @fluentui/react-shared-contexts to v9.0.2 ([PR #25265](https://github.com/microsoft/fluentui/pull/25265) by beachball)
|
|
44
|
+
- Bump @fluentui/react-theme to v9.1.1 ([PR #25265](https://github.com/microsoft/fluentui/pull/25265) by beachball)
|
|
45
|
+
- Bump @fluentui/react-utilities to v9.1.2 ([PR #25265](https://github.com/microsoft/fluentui/pull/25265) by beachball)
|
|
18
46
|
|
|
19
47
|
### Patches
|
|
20
48
|
|
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# @fluentui/react-tabster
|
|
2
2
|
|
|
3
|
-
**Tabster components for [Fluent UI React](https://
|
|
3
|
+
**Tabster components for [Fluent UI React](https://react.fluentui.dev)**
|
|
4
4
|
|
|
5
5
|
Library for focus management that leverages [tabster](https://github.com/microsoft/tabster).
|
|
6
6
|
|
package/dist/index.d.ts
CHANGED
|
@@ -65,7 +65,7 @@ export declare interface UseArrowNavigationGroupOptions {
|
|
|
65
65
|
* Focus will navigate vertically, horizontally or in both directions (grid), defaults to horizontally
|
|
66
66
|
* @defaultValue vertical
|
|
67
67
|
*/
|
|
68
|
-
axis?: 'vertical' | 'horizontal' | 'grid';
|
|
68
|
+
axis?: 'vertical' | 'horizontal' | 'grid' | 'both';
|
|
69
69
|
/**
|
|
70
70
|
* Focus will cycle to the first/last elements of the group without stopping
|
|
71
71
|
*/
|
|
@@ -102,7 +102,7 @@ export declare interface UseFocusableGroupOptions {
|
|
|
102
102
|
* Returns a set of helper functions that will traverse focusable elements in the context of a root DOM element
|
|
103
103
|
*/
|
|
104
104
|
export declare const useFocusFinders: () => {
|
|
105
|
-
findAllFocusable: (container: HTMLElement, acceptCondition
|
|
105
|
+
findAllFocusable: (container: HTMLElement, acceptCondition?: ((el: HTMLElement) => boolean) | undefined) => HTMLElement[];
|
|
106
106
|
findFirstFocusable: (container: HTMLElement) => HTMLElement | null | undefined;
|
|
107
107
|
findLastFocusable: (container: HTMLElement) => HTMLElement | null | undefined;
|
|
108
108
|
findNextFocusable: (currentElement: HTMLElement, options?: Pick<Types.FindNextProps, 'container'>) => HTMLElement | null | undefined;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["hooks/useArrowNavigationGroup.ts"],"names":[],"mappings":"AAAA,SAAS,KAAT,EAAgB,QAAhB,QAAgC,SAAhC;AACA,SAAS,oBAAT,QAAqC,wBAArC;AACA,SAAS,UAAT,QAA2B,cAA3B;AA2BA;;;AAGG;;AACH,OAAO,MAAM,uBAAuB,GAAG,CAAC,OAAA,GAA0C,EAA3C,KAA4E;EACjH,MAAM;IAAE,QAAF;IAAY,IAAZ;IAAkB,eAAlB;IAAmC,QAAnC;IAA6C;EAA7C,IAAsE,OAA5E;EACA,MAAM,OAAO,GAAG,UAAU,EAA1B;;EAEA,IAAI,OAAJ,EAAa;IACX,QAAQ,CAAC,OAAD,CAAR;EACD;;EAED,OAAO,oBAAoB,CAAC;IAC1B,KAAK,EAAE;MACL,MAAM,EAAE,CAAC,CAAC,QADL;MAEL,SAAS,EAAE,oBAAoB,CAAC,IAAI,KAAA,IAAJ,IAAA,IAAI,KAAA,KAAA,CAAJ,GAAA,IAAA,GAAQ,UAAT,CAF1B;MAGL,eAAe,EAAE,eAHZ;MAIL,QAAQ,EAAE;IAJL,CADmB;IAO1B,IAAI,oBAAoB,IAAI;MAC1B,SAAS,EAAE;QACT,aAAa,EAAE;MADN;IADe,CAA5B;EAP0B,CAAD,CAA3B;AAaD,CArBM;;AAuBP,SAAS,oBAAT,CAA8B,IAA9B,EAA0E;EACxE,QAAQ,IAAR;IACE,KAAK,YAAL;MACE,OAAO,KAAK,CAAC,eAAN,CAAsB,UAA7B;;IACF,KAAK,MAAL;MACE,OAAO,KAAK,CAAC,eAAN,CAAsB,IAA7B;;IAEF,KAAK,UAAL;IACA;MACE,OAAO,KAAK,CAAC,eAAN,CAAsB,QAA7B;
|
|
1
|
+
{"version":3,"sources":["hooks/useArrowNavigationGroup.ts"],"names":[],"mappings":"AAAA,SAAS,KAAT,EAAgB,QAAhB,QAAgC,SAAhC;AACA,SAAS,oBAAT,QAAqC,wBAArC;AACA,SAAS,UAAT,QAA2B,cAA3B;AA2BA;;;AAGG;;AACH,OAAO,MAAM,uBAAuB,GAAG,CAAC,OAAA,GAA0C,EAA3C,KAA4E;EACjH,MAAM;IAAE,QAAF;IAAY,IAAZ;IAAkB,eAAlB;IAAmC,QAAnC;IAA6C;EAA7C,IAAsE,OAA5E;EACA,MAAM,OAAO,GAAG,UAAU,EAA1B;;EAEA,IAAI,OAAJ,EAAa;IACX,QAAQ,CAAC,OAAD,CAAR;EACD;;EAED,OAAO,oBAAoB,CAAC;IAC1B,KAAK,EAAE;MACL,MAAM,EAAE,CAAC,CAAC,QADL;MAEL,SAAS,EAAE,oBAAoB,CAAC,IAAI,KAAA,IAAJ,IAAA,IAAI,KAAA,KAAA,CAAJ,GAAA,IAAA,GAAQ,UAAT,CAF1B;MAGL,eAAe,EAAE,eAHZ;MAIL,QAAQ,EAAE;IAJL,CADmB;IAO1B,IAAI,oBAAoB,IAAI;MAC1B,SAAS,EAAE;QACT,aAAa,EAAE;MADN;IADe,CAA5B;EAP0B,CAAD,CAA3B;AAaD,CArBM;;AAuBP,SAAS,oBAAT,CAA8B,IAA9B,EAA0E;EACxE,QAAQ,IAAR;IACE,KAAK,YAAL;MACE,OAAO,KAAK,CAAC,eAAN,CAAsB,UAA7B;;IACF,KAAK,MAAL;MACE,OAAO,KAAK,CAAC,eAAN,CAAsB,IAA7B;;IACF,KAAK,MAAL;MACE,OAAO,KAAK,CAAC,eAAN,CAAsB,IAA7B;;IAEF,KAAK,UAAL;IACA;MACE,OAAO,KAAK,CAAC,eAAN,CAAsB,QAA7B;EAVJ;AAYD","sourcesContent":["import { Types, getMover } from 'tabster';\nimport { useTabsterAttributes } from './useTabsterAttributes';\nimport { useTabster } from './useTabster';\n\nexport interface UseArrowNavigationGroupOptions {\n /**\n * Focus will navigate vertically, horizontally or in both directions (grid), defaults to horizontally\n * @defaultValue vertical\n */\n axis?: 'vertical' | 'horizontal' | 'grid' | 'both';\n /**\n * Focus will cycle to the first/last elements of the group without stopping\n */\n circular?: boolean;\n /**\n * Last focused element in the group will be remembered and focused (if still\n * available) when tabbing from outside of the group\n */\n memorizeCurrent?: boolean;\n /**\n * Allow tabbing within the arrow navigation group items.\n */\n tabbable?: boolean;\n /**\n * Tabster should ignore default handling of keydown events\n */\n ignoreDefaultKeydown?: Types.FocusableProps['ignoreKeydown'];\n}\n\n/**\n * A hook that returns the necessary tabster attributes to support arrow key navigation\n * @param options - Options to configure keyboard navigation\n */\nexport const useArrowNavigationGroup = (options: UseArrowNavigationGroupOptions = {}): Types.TabsterDOMAttribute => {\n const { circular, axis, memorizeCurrent, tabbable, ignoreDefaultKeydown } = options;\n const tabster = useTabster();\n\n if (tabster) {\n getMover(tabster);\n }\n\n return useTabsterAttributes({\n mover: {\n cyclic: !!circular,\n direction: axisToMoverDirection(axis ?? 'vertical'),\n memorizeCurrent: memorizeCurrent,\n tabbable: tabbable,\n },\n ...(ignoreDefaultKeydown && {\n focusable: {\n ignoreKeydown: ignoreDefaultKeydown,\n },\n }),\n });\n};\n\nfunction axisToMoverDirection(axis: UseArrowNavigationGroupOptions['axis']): Types.MoverDirection {\n switch (axis) {\n case 'horizontal':\n return Types.MoverDirections.Horizontal;\n case 'grid':\n return Types.MoverDirections.Grid;\n case 'both':\n return Types.MoverDirections.Both;\n\n case 'vertical':\n default:\n return Types.MoverDirections.Vertical;\n }\n}\n"],"sourceRoot":"../src/"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["hooks/useFocusFinders.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAEA,SAAS,UAAT,QAA2B,cAA3B;AAEA;;AAEG;;AACH,OAAO,MAAM,eAAe,GAAG,MAAK;EAClC,MAAM,OAAO,GAAG,UAAU,EAA1B,CADkC,CAGlC;;EACA,MAAM,gBAAgB,GAAG,KAAK,CAAC,WAAN,CACvB,CAAC,SAAD,EAAyB,eAAzB,KACE,CAAA,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,OAAnB,CAA2B;IAAE,SAAF;IAAa;EAAb,CAA3B,CAAA,KAA8D,EAFzC,EAGvB,CAAC,OAAD,CAHuB,CAAzB;EAMA,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAN,CACxB,SAAD,IAA4B,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,SAAnB,CAA6B;IAAE;EAAF,CAA7B,CADH,EAEzB,CAAC,OAAD,CAFyB,CAA3B;EAKA,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAN,CAAmB,SAAD,IAA4B,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,QAAnB,CAA4B;IAAE;EAAF,CAA5B,CAA9C,EAA0F,CAClH,OADkH,CAA1F,CAA1B;EAIA,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAN,CACxB,CAAC,cAAD,EAA8B,OAAA,GAAyD,EAAvF,KACE,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,QAAnB,CAA4B;IAAE,cAAF;IAAkB,GAAG;EAArB,CAA5B,CAFsB,EAGxB,CAAC,OAAD,CAHwB,CAA1B;EAMA,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAN,CACxB,CAAC,cAAD,EAA8B,OAAA,GAAyD,EAAvF,KACE,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,QAAnB,CAA4B;IAAE,cAAF;IAAkB,GAAG;EAArB,CAA5B,CAFsB,EAGxB,CAAC,OAAD,CAHwB,CAA1B;EAMA,OAAO;IACL,gBADK;IAEL,kBAFK;IAGL,iBAHK;IAIL,iBAJK;IAKL;EALK,CAAP;AAOD,CAtCM","sourcesContent":["import * as React from 'react';\nimport { Types as TabsterTypes } from 'tabster';\nimport { useTabster } from './useTabster';\n\n/**\n * Returns a set of helper functions that will traverse focusable elements in the context of a root DOM element\n */\nexport const useFocusFinders = () => {\n const tabster = useTabster();\n\n // Narrow props for now and let need dictate additional props in the future\n const findAllFocusable = React.useCallback(\n (container: HTMLElement, acceptCondition
|
|
1
|
+
{"version":3,"sources":["hooks/useFocusFinders.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAEA,SAAS,UAAT,QAA2B,cAA3B;AAEA;;AAEG;;AACH,OAAO,MAAM,eAAe,GAAG,MAAK;EAClC,MAAM,OAAO,GAAG,UAAU,EAA1B,CADkC,CAGlC;;EACA,MAAM,gBAAgB,GAAG,KAAK,CAAC,WAAN,CACvB,CAAC,SAAD,EAAyB,eAAzB,KACE,CAAA,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,OAAnB,CAA2B;IAAE,SAAF;IAAa;EAAb,CAA3B,CAAA,KAA8D,EAFzC,EAGvB,CAAC,OAAD,CAHuB,CAAzB;EAMA,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAN,CACxB,SAAD,IAA4B,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,SAAnB,CAA6B;IAAE;EAAF,CAA7B,CADH,EAEzB,CAAC,OAAD,CAFyB,CAA3B;EAKA,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAN,CAAmB,SAAD,IAA4B,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,QAAnB,CAA4B;IAAE;EAAF,CAA5B,CAA9C,EAA0F,CAClH,OADkH,CAA1F,CAA1B;EAIA,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAN,CACxB,CAAC,cAAD,EAA8B,OAAA,GAAyD,EAAvF,KACE,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,QAAnB,CAA4B;IAAE,cAAF;IAAkB,GAAG;EAArB,CAA5B,CAFsB,EAGxB,CAAC,OAAD,CAHwB,CAA1B;EAMA,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAN,CACxB,CAAC,cAAD,EAA8B,OAAA,GAAyD,EAAvF,KACE,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,QAAnB,CAA4B;IAAE,cAAF;IAAkB,GAAG;EAArB,CAA5B,CAFsB,EAGxB,CAAC,OAAD,CAHwB,CAA1B;EAMA,OAAO;IACL,gBADK;IAEL,kBAFK;IAGL,iBAHK;IAIL,iBAJK;IAKL;EALK,CAAP;AAOD,CAtCM","sourcesContent":["import * as React from 'react';\nimport { Types as TabsterTypes } from 'tabster';\nimport { useTabster } from './useTabster';\n\n/**\n * Returns a set of helper functions that will traverse focusable elements in the context of a root DOM element\n */\nexport const useFocusFinders = () => {\n const tabster = useTabster();\n\n // Narrow props for now and let need dictate additional props in the future\n const findAllFocusable = React.useCallback(\n (container: HTMLElement, acceptCondition?: (el: HTMLElement) => boolean) =>\n tabster?.focusable.findAll({ container, acceptCondition }) || [],\n [tabster],\n );\n\n const findFirstFocusable = React.useCallback(\n (container: HTMLElement) => tabster?.focusable.findFirst({ container }),\n [tabster],\n );\n\n const findLastFocusable = React.useCallback((container: HTMLElement) => tabster?.focusable.findLast({ container }), [\n tabster,\n ]);\n\n const findNextFocusable = React.useCallback(\n (currentElement: HTMLElement, options: Pick<TabsterTypes.FindNextProps, 'container'> = {}) =>\n tabster?.focusable.findNext({ currentElement, ...options }),\n [tabster],\n );\n\n const findPrevFocusable = React.useCallback(\n (currentElement: HTMLElement, options: Pick<TabsterTypes.FindNextProps, 'container'> = {}) =>\n tabster?.focusable.findPrev({ currentElement, ...options }),\n [tabster],\n );\n\n return {\n findAllFocusable,\n findFirstFocusable,\n findLastFocusable,\n findNextFocusable,\n findPrevFocusable,\n };\n};\n"],"sourceRoot":"../src/"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["hooks/useArrowNavigationGroup.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,SAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AA2BA;;;AAGG;;;AACI,MAAM,uBAAuB,GAAG,CAAC,OAAA,GAA0C,EAA3C,KAA4E;EACjH,MAAM;IAAE,QAAF;IAAY,IAAZ;IAAkB,eAAlB;IAAmC,QAAnC;IAA6C;EAA7C,IAAsE,OAA5E;EACA,MAAM,OAAO,GAAG,YAAA,CAAA,UAAA,EAAhB;;EAEA,IAAI,OAAJ,EAAa;IACX,SAAA,CAAA,QAAA,CAAS,OAAT;EACD;;EAED,OAAO,sBAAA,CAAA,oBAAA,CAAqB;IAC1B,KAAK,EAAE;MACL,MAAM,EAAE,CAAC,CAAC,QADL;MAEL,SAAS,EAAE,oBAAoB,CAAC,IAAI,KAAA,IAAJ,IAAA,IAAI,KAAA,KAAA,CAAJ,GAAA,IAAA,GAAQ,UAAT,CAF1B;MAGL,eAAe,EAAE,eAHZ;MAIL,QAAQ,EAAE;IAJL,CADmB;IAO1B,IAAI,oBAAoB,IAAI;MAC1B,SAAS,EAAE;QACT,aAAa,EAAE;MADN;IADe,CAA5B;EAP0B,CAArB,CAAP;AAaD,CArBM;;AAAM,OAAA,CAAA,uBAAA,GAAuB,uBAAvB;;AAuBb,SAAS,oBAAT,CAA8B,IAA9B,EAA0E;EACxE,QAAQ,IAAR;IACE,KAAK,YAAL;MACE,OAAO,SAAA,CAAA,KAAA,CAAM,eAAN,CAAsB,UAA7B;;IACF,KAAK,MAAL;MACE,OAAO,SAAA,CAAA,KAAA,CAAM,eAAN,CAAsB,IAA7B;;IAEF,KAAK,UAAL;IACA;MACE,OAAO,SAAA,CAAA,KAAA,CAAM,eAAN,CAAsB,QAA7B;
|
|
1
|
+
{"version":3,"sources":["hooks/useArrowNavigationGroup.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,SAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AA2BA;;;AAGG;;;AACI,MAAM,uBAAuB,GAAG,CAAC,OAAA,GAA0C,EAA3C,KAA4E;EACjH,MAAM;IAAE,QAAF;IAAY,IAAZ;IAAkB,eAAlB;IAAmC,QAAnC;IAA6C;EAA7C,IAAsE,OAA5E;EACA,MAAM,OAAO,GAAG,YAAA,CAAA,UAAA,EAAhB;;EAEA,IAAI,OAAJ,EAAa;IACX,SAAA,CAAA,QAAA,CAAS,OAAT;EACD;;EAED,OAAO,sBAAA,CAAA,oBAAA,CAAqB;IAC1B,KAAK,EAAE;MACL,MAAM,EAAE,CAAC,CAAC,QADL;MAEL,SAAS,EAAE,oBAAoB,CAAC,IAAI,KAAA,IAAJ,IAAA,IAAI,KAAA,KAAA,CAAJ,GAAA,IAAA,GAAQ,UAAT,CAF1B;MAGL,eAAe,EAAE,eAHZ;MAIL,QAAQ,EAAE;IAJL,CADmB;IAO1B,IAAI,oBAAoB,IAAI;MAC1B,SAAS,EAAE;QACT,aAAa,EAAE;MADN;IADe,CAA5B;EAP0B,CAArB,CAAP;AAaD,CArBM;;AAAM,OAAA,CAAA,uBAAA,GAAuB,uBAAvB;;AAuBb,SAAS,oBAAT,CAA8B,IAA9B,EAA0E;EACxE,QAAQ,IAAR;IACE,KAAK,YAAL;MACE,OAAO,SAAA,CAAA,KAAA,CAAM,eAAN,CAAsB,UAA7B;;IACF,KAAK,MAAL;MACE,OAAO,SAAA,CAAA,KAAA,CAAM,eAAN,CAAsB,IAA7B;;IACF,KAAK,MAAL;MACE,OAAO,SAAA,CAAA,KAAA,CAAM,eAAN,CAAsB,IAA7B;;IAEF,KAAK,UAAL;IACA;MACE,OAAO,SAAA,CAAA,KAAA,CAAM,eAAN,CAAsB,QAA7B;EAVJ;AAYD","sourcesContent":["import { Types, getMover } from 'tabster';\nimport { useTabsterAttributes } from './useTabsterAttributes';\nimport { useTabster } from './useTabster';\n\nexport interface UseArrowNavigationGroupOptions {\n /**\n * Focus will navigate vertically, horizontally or in both directions (grid), defaults to horizontally\n * @defaultValue vertical\n */\n axis?: 'vertical' | 'horizontal' | 'grid' | 'both';\n /**\n * Focus will cycle to the first/last elements of the group without stopping\n */\n circular?: boolean;\n /**\n * Last focused element in the group will be remembered and focused (if still\n * available) when tabbing from outside of the group\n */\n memorizeCurrent?: boolean;\n /**\n * Allow tabbing within the arrow navigation group items.\n */\n tabbable?: boolean;\n /**\n * Tabster should ignore default handling of keydown events\n */\n ignoreDefaultKeydown?: Types.FocusableProps['ignoreKeydown'];\n}\n\n/**\n * A hook that returns the necessary tabster attributes to support arrow key navigation\n * @param options - Options to configure keyboard navigation\n */\nexport const useArrowNavigationGroup = (options: UseArrowNavigationGroupOptions = {}): Types.TabsterDOMAttribute => {\n const { circular, axis, memorizeCurrent, tabbable, ignoreDefaultKeydown } = options;\n const tabster = useTabster();\n\n if (tabster) {\n getMover(tabster);\n }\n\n return useTabsterAttributes({\n mover: {\n cyclic: !!circular,\n direction: axisToMoverDirection(axis ?? 'vertical'),\n memorizeCurrent: memorizeCurrent,\n tabbable: tabbable,\n },\n ...(ignoreDefaultKeydown && {\n focusable: {\n ignoreKeydown: ignoreDefaultKeydown,\n },\n }),\n });\n};\n\nfunction axisToMoverDirection(axis: UseArrowNavigationGroupOptions['axis']): Types.MoverDirection {\n switch (axis) {\n case 'horizontal':\n return Types.MoverDirections.Horizontal;\n case 'grid':\n return Types.MoverDirections.Grid;\n case 'both':\n return Types.MoverDirections.Both;\n\n case 'vertical':\n default:\n return Types.MoverDirections.Vertical;\n }\n}\n"],"sourceRoot":"../src/"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["hooks/useFocusFinders.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAEA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AAEA;;AAEG;;;AACI,MAAM,eAAe,GAAG,MAAK;EAClC,MAAM,OAAO,GAAG,YAAA,CAAA,UAAA,EAAhB,CADkC,CAGlC;;EACA,MAAM,gBAAgB,GAAG,KAAK,CAAC,WAAN,CACvB,CAAC,SAAD,EAAyB,eAAzB,KACE,CAAA,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,OAAnB,CAA2B;IAAE,SAAF;IAAa;EAAb,CAA3B,CAAA,KAA8D,EAFzC,EAGvB,CAAC,OAAD,CAHuB,CAAzB;EAMA,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAN,CACxB,SAAD,IAA4B,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,SAAnB,CAA6B;IAAE;EAAF,CAA7B,CADH,EAEzB,CAAC,OAAD,CAFyB,CAA3B;EAKA,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAN,CAAmB,SAAD,IAA4B,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,QAAnB,CAA4B;IAAE;EAAF,CAA5B,CAA9C,EAA0F,CAClH,OADkH,CAA1F,CAA1B;EAIA,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAN,CACxB,CAAC,cAAD,EAA8B,OAAA,GAAyD,EAAvF,KACE,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,QAAnB,CAA4B;IAAE,cAAF;IAAkB,GAAG;EAArB,CAA5B,CAFsB,EAGxB,CAAC,OAAD,CAHwB,CAA1B;EAMA,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAN,CACxB,CAAC,cAAD,EAA8B,OAAA,GAAyD,EAAvF,KACE,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,QAAnB,CAA4B;IAAE,cAAF;IAAkB,GAAG;EAArB,CAA5B,CAFsB,EAGxB,CAAC,OAAD,CAHwB,CAA1B;EAMA,OAAO;IACL,gBADK;IAEL,kBAFK;IAGL,iBAHK;IAIL,iBAJK;IAKL;EALK,CAAP;AAOD,CAtCM;;AAAM,OAAA,CAAA,eAAA,GAAe,eAAf","sourcesContent":["import * as React from 'react';\nimport { Types as TabsterTypes } from 'tabster';\nimport { useTabster } from './useTabster';\n\n/**\n * Returns a set of helper functions that will traverse focusable elements in the context of a root DOM element\n */\nexport const useFocusFinders = () => {\n const tabster = useTabster();\n\n // Narrow props for now and let need dictate additional props in the future\n const findAllFocusable = React.useCallback(\n (container: HTMLElement, acceptCondition
|
|
1
|
+
{"version":3,"sources":["hooks/useFocusFinders.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAEA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AAEA;;AAEG;;;AACI,MAAM,eAAe,GAAG,MAAK;EAClC,MAAM,OAAO,GAAG,YAAA,CAAA,UAAA,EAAhB,CADkC,CAGlC;;EACA,MAAM,gBAAgB,GAAG,KAAK,CAAC,WAAN,CACvB,CAAC,SAAD,EAAyB,eAAzB,KACE,CAAA,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,OAAnB,CAA2B;IAAE,SAAF;IAAa;EAAb,CAA3B,CAAA,KAA8D,EAFzC,EAGvB,CAAC,OAAD,CAHuB,CAAzB;EAMA,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAN,CACxB,SAAD,IAA4B,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,SAAnB,CAA6B;IAAE;EAAF,CAA7B,CADH,EAEzB,CAAC,OAAD,CAFyB,CAA3B;EAKA,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAN,CAAmB,SAAD,IAA4B,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,QAAnB,CAA4B;IAAE;EAAF,CAA5B,CAA9C,EAA0F,CAClH,OADkH,CAA1F,CAA1B;EAIA,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAN,CACxB,CAAC,cAAD,EAA8B,OAAA,GAAyD,EAAvF,KACE,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,QAAnB,CAA4B;IAAE,cAAF;IAAkB,GAAG;EAArB,CAA5B,CAFsB,EAGxB,CAAC,OAAD,CAHwB,CAA1B;EAMA,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAN,CACxB,CAAC,cAAD,EAA8B,OAAA,GAAyD,EAAvF,KACE,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,SAAT,CAAmB,QAAnB,CAA4B;IAAE,cAAF;IAAkB,GAAG;EAArB,CAA5B,CAFsB,EAGxB,CAAC,OAAD,CAHwB,CAA1B;EAMA,OAAO;IACL,gBADK;IAEL,kBAFK;IAGL,iBAHK;IAIL,iBAJK;IAKL;EALK,CAAP;AAOD,CAtCM;;AAAM,OAAA,CAAA,eAAA,GAAe,eAAf","sourcesContent":["import * as React from 'react';\nimport { Types as TabsterTypes } from 'tabster';\nimport { useTabster } from './useTabster';\n\n/**\n * Returns a set of helper functions that will traverse focusable elements in the context of a root DOM element\n */\nexport const useFocusFinders = () => {\n const tabster = useTabster();\n\n // Narrow props for now and let need dictate additional props in the future\n const findAllFocusable = React.useCallback(\n (container: HTMLElement, acceptCondition?: (el: HTMLElement) => boolean) =>\n tabster?.focusable.findAll({ container, acceptCondition }) || [],\n [tabster],\n );\n\n const findFirstFocusable = React.useCallback(\n (container: HTMLElement) => tabster?.focusable.findFirst({ container }),\n [tabster],\n );\n\n const findLastFocusable = React.useCallback((container: HTMLElement) => tabster?.focusable.findLast({ container }), [\n tabster,\n ]);\n\n const findNextFocusable = React.useCallback(\n (currentElement: HTMLElement, options: Pick<TabsterTypes.FindNextProps, 'container'> = {}) =>\n tabster?.focusable.findNext({ currentElement, ...options }),\n [tabster],\n );\n\n const findPrevFocusable = React.useCallback(\n (currentElement: HTMLElement, options: Pick<TabsterTypes.FindNextProps, 'container'> = {}) =>\n tabster?.focusable.findPrev({ currentElement, ...options }),\n [tabster],\n );\n\n return {\n findAllFocusable,\n findFirstFocusable,\n findLastFocusable,\n findNextFocusable,\n findPrevFocusable,\n };\n};\n"],"sourceRoot":"../src/"}
|
package/package.json
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-tabster",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.3.0",
|
|
4
4
|
"description": "Utilities for focus management and facade for tabster",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
7
|
-
"typings": "dist/index.d.ts",
|
|
7
|
+
"typings": "./dist/index.d.ts",
|
|
8
8
|
"sideEffects": false,
|
|
9
9
|
"repository": {
|
|
10
10
|
"type": "git",
|
|
@@ -31,10 +31,10 @@
|
|
|
31
31
|
"@fluentui/scripts": "^1.0.0"
|
|
32
32
|
},
|
|
33
33
|
"dependencies": {
|
|
34
|
-
"@griffel/react": "^1.4.
|
|
35
|
-
"@fluentui/react-shared-contexts": "^9.
|
|
36
|
-
"@fluentui/react-theme": "^9.1.
|
|
37
|
-
"@fluentui/react-utilities": "^9.1
|
|
34
|
+
"@griffel/react": "^1.4.2",
|
|
35
|
+
"@fluentui/react-shared-contexts": "^9.1.1",
|
|
36
|
+
"@fluentui/react-theme": "^9.1.2",
|
|
37
|
+
"@fluentui/react-utilities": "^9.2.1",
|
|
38
38
|
"keyborg": "^1.2.1",
|
|
39
39
|
"tabster": "^3.0.4",
|
|
40
40
|
"tslib": "^2.1.0"
|
|
@@ -53,9 +53,10 @@
|
|
|
53
53
|
},
|
|
54
54
|
"exports": {
|
|
55
55
|
".": {
|
|
56
|
-
"types": "./
|
|
56
|
+
"types": "./dist/index.d.ts",
|
|
57
57
|
"import": "./lib/index.js",
|
|
58
58
|
"require": "./lib-commonjs/index.js"
|
|
59
|
-
}
|
|
59
|
+
},
|
|
60
|
+
"./package.json": "./package.json"
|
|
60
61
|
}
|
|
61
62
|
}
|