@react-aria/tabs 3.3.4-nightly.3599 → 3.3.4-nightly.3603
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/dist/main.js +102 -43
- package/dist/main.js.map +1 -1
- package/dist/module.mjs +102 -43
- package/dist/module.mjs.map +1 -1
- package/package.json +12 -12
package/dist/main.js
CHANGED
|
@@ -11,9 +11,39 @@ function $parcel$export(e, n, v, s) {
|
|
|
11
11
|
$parcel$export(module.exports, "useTab", () => $4eeea1c984cc0628$export$fdf4756d5b8ef90a);
|
|
12
12
|
$parcel$export(module.exports, "useTabPanel", () => $8db1928b18472a1f$export$fae0121b5afe572d);
|
|
13
13
|
$parcel$export(module.exports, "useTabList", () => $f2b4a4926440e901$export$773e389e644c5874);
|
|
14
|
-
|
|
14
|
+
/*
|
|
15
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
16
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
17
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
18
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
19
|
+
*
|
|
20
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
21
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
22
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
23
|
+
* governing permissions and limitations under the License.
|
|
24
|
+
*/ /*
|
|
25
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
26
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
27
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
28
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
29
|
+
*
|
|
30
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
31
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
32
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
33
|
+
* governing permissions and limitations under the License.
|
|
34
|
+
*/ /*
|
|
35
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
36
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
37
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
38
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
39
|
+
*
|
|
40
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
41
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
42
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
43
|
+
* governing permissions and limitations under the License.
|
|
44
|
+
*/ const $a217ebca77471970$export$c5f62239608282b6 = new WeakMap();
|
|
15
45
|
function $a217ebca77471970$export$567fc7097e064344(state, key, role) {
|
|
16
|
-
if (typeof key ===
|
|
46
|
+
if (typeof key === "string") key = key.replace(/\s+/g, "");
|
|
17
47
|
let baseId = $a217ebca77471970$export$c5f62239608282b6.get(state);
|
|
18
48
|
return `${baseId}-${role}-${key}`;
|
|
19
49
|
}
|
|
@@ -25,24 +55,24 @@ function $4eeea1c984cc0628$export$fdf4756d5b8ef90a(props, state, ref) {
|
|
|
25
55
|
let { selectionManager: manager , selectedKey: selectedKey } = state;
|
|
26
56
|
let isSelected = key === selectedKey;
|
|
27
57
|
let isDisabled = propsDisabled || state.isDisabled || state.disabledKeys.has(key);
|
|
28
|
-
let { itemProps: itemProps } = $1cJu1$reactariaselection.useSelectableItem({
|
|
58
|
+
let { itemProps: itemProps } = (0, $1cJu1$reactariaselection.useSelectableItem)({
|
|
29
59
|
selectionManager: manager,
|
|
30
60
|
key: key,
|
|
31
61
|
ref: ref,
|
|
32
62
|
isDisabled: isDisabled
|
|
33
63
|
});
|
|
34
|
-
let tabId = $a217ebca77471970$export$567fc7097e064344(state, key,
|
|
35
|
-
let tabPanelId = $a217ebca77471970$export$567fc7097e064344(state, key,
|
|
64
|
+
let tabId = (0, $a217ebca77471970$export$567fc7097e064344)(state, key, "tab");
|
|
65
|
+
let tabPanelId = (0, $a217ebca77471970$export$567fc7097e064344)(state, key, "tabpanel");
|
|
36
66
|
let { tabIndex: tabIndex } = itemProps;
|
|
37
67
|
return {
|
|
38
68
|
tabProps: {
|
|
39
69
|
...itemProps,
|
|
40
70
|
id: tabId,
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
71
|
+
"aria-selected": isSelected,
|
|
72
|
+
"aria-disabled": isDisabled || undefined,
|
|
73
|
+
"aria-controls": isSelected ? tabPanelId : undefined,
|
|
44
74
|
tabIndex: isDisabled ? undefined : tabIndex,
|
|
45
|
-
role:
|
|
75
|
+
role: "tab"
|
|
46
76
|
},
|
|
47
77
|
isSelected: isSelected,
|
|
48
78
|
isDisabled: isDisabled
|
|
@@ -50,20 +80,30 @@ function $4eeea1c984cc0628$export$fdf4756d5b8ef90a(props, state, ref) {
|
|
|
50
80
|
}
|
|
51
81
|
|
|
52
82
|
|
|
53
|
-
|
|
83
|
+
/*
|
|
84
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
85
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
86
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
87
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
88
|
+
*
|
|
89
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
90
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
91
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
92
|
+
* governing permissions and limitations under the License.
|
|
93
|
+
*/
|
|
54
94
|
|
|
55
95
|
|
|
56
96
|
|
|
57
97
|
function $8db1928b18472a1f$export$fae0121b5afe572d(props, state, ref) {
|
|
58
|
-
let [tabIndex, setTabIndex] = $1cJu1$react.useState(0);
|
|
98
|
+
let [tabIndex, setTabIndex] = (0, $1cJu1$react.useState)(0);
|
|
59
99
|
// The tabpanel should have tabIndex=0 when there are no tabbable elements within it.
|
|
60
100
|
// Otherwise, tabbing from the focused tab should go directly to the first tabbable element
|
|
61
101
|
// within the tabpanel.
|
|
62
|
-
$1cJu1$reactariautils.useLayoutEffect(()=>{
|
|
102
|
+
(0, $1cJu1$reactariautils.useLayoutEffect)(()=>{
|
|
63
103
|
if (ref === null || ref === void 0 ? void 0 : ref.current) {
|
|
64
104
|
let update = ()=>{
|
|
65
105
|
// Detect if there are any tabbable elements and update the tabIndex accordingly.
|
|
66
|
-
let walker = $1cJu1$reactariafocus.getFocusableTreeWalker(ref.current, {
|
|
106
|
+
let walker = (0, $1cJu1$reactariafocus.getFocusableTreeWalker)(ref.current, {
|
|
67
107
|
tabbable: true
|
|
68
108
|
});
|
|
69
109
|
setTabIndex(walker.nextNode() ? undefined : 0);
|
|
@@ -76,8 +116,8 @@ function $8db1928b18472a1f$export$fae0121b5afe572d(props, state, ref) {
|
|
|
76
116
|
childList: true,
|
|
77
117
|
attributes: true,
|
|
78
118
|
attributeFilter: [
|
|
79
|
-
|
|
80
|
-
|
|
119
|
+
"tabIndex",
|
|
120
|
+
"disabled"
|
|
81
121
|
]
|
|
82
122
|
});
|
|
83
123
|
return ()=>{
|
|
@@ -87,47 +127,67 @@ function $8db1928b18472a1f$export$fae0121b5afe572d(props, state, ref) {
|
|
|
87
127
|
}, [
|
|
88
128
|
ref
|
|
89
129
|
]);
|
|
90
|
-
const id = $a217ebca77471970$export$567fc7097e064344(state, state === null || state === void 0 ? void 0 : state.selectedKey,
|
|
91
|
-
const tabPanelProps = $1cJu1$reactariautils.useLabels({
|
|
130
|
+
const id = (0, $a217ebca77471970$export$567fc7097e064344)(state, state === null || state === void 0 ? void 0 : state.selectedKey, "tabpanel");
|
|
131
|
+
const tabPanelProps = (0, $1cJu1$reactariautils.useLabels)({
|
|
92
132
|
...props,
|
|
93
133
|
id: id,
|
|
94
|
-
|
|
134
|
+
"aria-labelledby": (0, $a217ebca77471970$export$567fc7097e064344)(state, state === null || state === void 0 ? void 0 : state.selectedKey, "tab")
|
|
95
135
|
});
|
|
96
136
|
return {
|
|
97
|
-
tabPanelProps: $1cJu1$reactariautils.mergeProps(tabPanelProps, {
|
|
137
|
+
tabPanelProps: (0, $1cJu1$reactariautils.mergeProps)(tabPanelProps, {
|
|
98
138
|
tabIndex: tabIndex,
|
|
99
|
-
role:
|
|
100
|
-
|
|
101
|
-
|
|
139
|
+
role: "tabpanel",
|
|
140
|
+
"aria-describedby": props["aria-describedby"],
|
|
141
|
+
"aria-details": props["aria-details"]
|
|
102
142
|
})
|
|
103
143
|
};
|
|
104
144
|
}
|
|
105
145
|
|
|
106
146
|
|
|
147
|
+
/*
|
|
148
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
149
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
150
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
151
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
152
|
+
*
|
|
153
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
154
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
155
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
156
|
+
* governing permissions and limitations under the License.
|
|
157
|
+
*/
|
|
107
158
|
|
|
108
159
|
|
|
109
|
-
|
|
110
|
-
|
|
160
|
+
/*
|
|
161
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
162
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
163
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
164
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
165
|
+
*
|
|
166
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
167
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
168
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
169
|
+
* governing permissions and limitations under the License.
|
|
170
|
+
*/ class $283e5d8830177ead$export$15010ca3c1abe90b {
|
|
111
171
|
getKeyLeftOf(key) {
|
|
112
172
|
if (this.flipDirection) return this.getNextKey(key);
|
|
113
173
|
else {
|
|
114
|
-
if (this.orientation ===
|
|
174
|
+
if (this.orientation === "horizontal") return this.getPreviousKey(key);
|
|
115
175
|
return null;
|
|
116
176
|
}
|
|
117
177
|
}
|
|
118
178
|
getKeyRightOf(key) {
|
|
119
179
|
if (this.flipDirection) return this.getPreviousKey(key);
|
|
120
180
|
else {
|
|
121
|
-
if (this.orientation ===
|
|
181
|
+
if (this.orientation === "horizontal") return this.getNextKey(key);
|
|
122
182
|
return null;
|
|
123
183
|
}
|
|
124
184
|
}
|
|
125
185
|
getKeyAbove(key) {
|
|
126
|
-
if (this.orientation ===
|
|
186
|
+
if (this.orientation === "vertical") return this.getPreviousKey(key);
|
|
127
187
|
return null;
|
|
128
188
|
}
|
|
129
189
|
getKeyBelow(key) {
|
|
130
|
-
if (this.orientation ===
|
|
190
|
+
if (this.orientation === "vertical") return this.getNextKey(key);
|
|
131
191
|
return null;
|
|
132
192
|
}
|
|
133
193
|
getFirstKey() {
|
|
@@ -144,19 +204,19 @@ class $283e5d8830177ead$export$15010ca3c1abe90b {
|
|
|
144
204
|
do {
|
|
145
205
|
key = this.collection.getKeyAfter(key);
|
|
146
206
|
if (key == null) key = this.collection.getFirstKey();
|
|
147
|
-
}while (this.disabledKeys.has(key))
|
|
207
|
+
}while (this.disabledKeys.has(key));
|
|
148
208
|
return key;
|
|
149
209
|
}
|
|
150
210
|
getPreviousKey(key) {
|
|
151
211
|
do {
|
|
152
212
|
key = this.collection.getKeyBefore(key);
|
|
153
213
|
if (key == null) key = this.collection.getLastKey();
|
|
154
|
-
}while (this.disabledKeys.has(key))
|
|
214
|
+
}while (this.disabledKeys.has(key));
|
|
155
215
|
return key;
|
|
156
216
|
}
|
|
157
217
|
constructor(collection, direction, orientation, disabledKeys = new Set()){
|
|
158
218
|
this.collection = collection;
|
|
159
|
-
this.flipDirection = direction ===
|
|
219
|
+
this.flipDirection = direction === "rtl" && orientation === "horizontal";
|
|
160
220
|
this.orientation = orientation;
|
|
161
221
|
this.disabledKeys = disabledKeys;
|
|
162
222
|
}
|
|
@@ -166,36 +226,35 @@ class $283e5d8830177ead$export$15010ca3c1abe90b {
|
|
|
166
226
|
|
|
167
227
|
|
|
168
228
|
function $f2b4a4926440e901$export$773e389e644c5874(props, state, ref) {
|
|
169
|
-
let { orientation: orientation =
|
|
229
|
+
let { orientation: orientation = "horizontal" , keyboardActivation: keyboardActivation = "automatic" } = props;
|
|
170
230
|
let { collection: collection , selectionManager: manager , disabledKeys: disabledKeys } = state;
|
|
171
|
-
let { direction: direction } = $1cJu1$reactariai18n.useLocale();
|
|
172
|
-
let delegate = $1cJu1$react.useMemo(()=>new $283e5d8830177ead$export$15010ca3c1abe90b(collection, direction, orientation, disabledKeys)
|
|
173
|
-
, [
|
|
231
|
+
let { direction: direction } = (0, $1cJu1$reactariai18n.useLocale)();
|
|
232
|
+
let delegate = (0, $1cJu1$react.useMemo)(()=>new (0, $283e5d8830177ead$export$15010ca3c1abe90b)(collection, direction, orientation, disabledKeys), [
|
|
174
233
|
collection,
|
|
175
234
|
disabledKeys,
|
|
176
235
|
orientation,
|
|
177
236
|
direction
|
|
178
237
|
]);
|
|
179
|
-
let { collectionProps: collectionProps } = $1cJu1$reactariaselection.useSelectableCollection({
|
|
238
|
+
let { collectionProps: collectionProps } = (0, $1cJu1$reactariaselection.useSelectableCollection)({
|
|
180
239
|
ref: ref,
|
|
181
240
|
selectionManager: manager,
|
|
182
241
|
keyboardDelegate: delegate,
|
|
183
|
-
selectOnFocus: keyboardActivation ===
|
|
242
|
+
selectOnFocus: keyboardActivation === "automatic",
|
|
184
243
|
disallowEmptySelection: true,
|
|
185
244
|
scrollRef: ref
|
|
186
245
|
});
|
|
187
246
|
// Compute base id for all tabs
|
|
188
|
-
let tabsId = $1cJu1$reactariautils.useId();
|
|
189
|
-
$a217ebca77471970$export$c5f62239608282b6.set(state, tabsId);
|
|
190
|
-
let tabListLabelProps = $1cJu1$reactariautils.useLabels({
|
|
247
|
+
let tabsId = (0, $1cJu1$reactariautils.useId)();
|
|
248
|
+
(0, $a217ebca77471970$export$c5f62239608282b6).set(state, tabsId);
|
|
249
|
+
let tabListLabelProps = (0, $1cJu1$reactariautils.useLabels)({
|
|
191
250
|
...props,
|
|
192
251
|
id: tabsId
|
|
193
252
|
});
|
|
194
253
|
return {
|
|
195
254
|
tabListProps: {
|
|
196
|
-
|
|
197
|
-
role:
|
|
198
|
-
|
|
255
|
+
...(0, $1cJu1$reactariautils.mergeProps)(collectionProps, tabListLabelProps),
|
|
256
|
+
role: "tablist",
|
|
257
|
+
"aria-orientation": orientation,
|
|
199
258
|
tabIndex: undefined
|
|
200
259
|
}
|
|
201
260
|
};
|
package/dist/main.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-aria/tabs/src/index.ts","packages/@react-aria/tabs/src/useTab.ts","packages/@react-aria/tabs/src/utils.ts","packages/@react-aria/tabs/src/useTabPanel.ts","packages/@react-aria/tabs/src/useTabList.ts","packages/@react-aria/tabs/src/TabsKeyboardDelegate.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nexport {useTab} from './useTab';\nexport {useTabPanel} from './useTabPanel';\nexport {useTabList} from './useTabList';\nexport type {AriaTabListProps, AriaTabPanelProps, AriaTabProps} from '@react-types/tabs';\nexport type {TabAria} from './useTab';\nexport type {TabPanelAria} from './useTabPanel';\nexport type {TabListAria} from './useTabList';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaTabProps} from '@react-types/tabs';\nimport {DOMAttributes, FocusableElement} from '@react-types/shared';\nimport {generateId} from './utils';\nimport {RefObject} from 'react';\nimport {TabListState} from '@react-stately/tabs';\nimport {useSelectableItem} from '@react-aria/selection';\n\nexport interface TabAria {\n /** Props for the tab element. */\n tabProps: DOMAttributes,\n /** Whether the tab is currently selected. */\n isSelected: boolean,\n /** Whether the tab is disabled. */\n isDisabled: boolean\n}\n\n/**\n * Provides the behavior and accessibility implementation for a tab.\n * When selected, the associated tab panel is shown.\n */\nexport function useTab<T>(\n props: AriaTabProps,\n state: TabListState<T>,\n ref: RefObject<FocusableElement>\n): TabAria {\n let {key, isDisabled: propsDisabled} = props;\n let {selectionManager: manager, selectedKey} = state;\n\n let isSelected = key === selectedKey;\n\n let isDisabled = propsDisabled || state.isDisabled || state.disabledKeys.has(key);\n let {itemProps} = useSelectableItem({\n selectionManager: manager,\n key,\n ref,\n isDisabled\n });\n\n let tabId = generateId(state, key, 'tab');\n let tabPanelId = generateId(state, key, 'tabpanel');\n let {tabIndex} = itemProps;\n\n return {\n tabProps: {\n ...itemProps,\n id: tabId,\n 'aria-selected': isSelected,\n 'aria-disabled': isDisabled || undefined,\n 'aria-controls': isSelected ? tabPanelId : undefined,\n tabIndex: isDisabled ? undefined : tabIndex,\n role: 'tab'\n },\n isSelected,\n isDisabled\n };\n}\n\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Key} from 'react';\nimport {TabListState} from '@react-stately/tabs';\n\nexport const tabsIds = new WeakMap<TabListState<unknown>, string>();\n\nexport function generateId<T>(state: TabListState<T>, key: Key, role: string) {\n if (typeof key === 'string') {\n key = key.replace(/\\s+/g, '');\n }\n\n let baseId = tabsIds.get(state);\n return `${baseId}-${role}-${key}`;\n}\n\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaTabPanelProps} from '@react-types/tabs';\nimport {DOMAttributes} from '@react-types/shared';\nimport {generateId} from './utils';\nimport {getFocusableTreeWalker} from '@react-aria/focus';\nimport {mergeProps, useLabels, useLayoutEffect} from '@react-aria/utils';\nimport {RefObject, useState} from 'react';\nimport {TabListState} from '@react-stately/tabs';\n\nexport interface TabPanelAria {\n /** Props for the tab panel element. */\n tabPanelProps: DOMAttributes\n}\n\n\n/**\n * Provides the behavior and accessibility implementation for a tab panel. A tab panel is a container for\n * the contents of a tab, and is shown when the tab is selected.\n */\nexport function useTabPanel<T>(props: AriaTabPanelProps, state: TabListState<T>, ref: RefObject<Element>): TabPanelAria {\n let [tabIndex, setTabIndex] = useState(0);\n\n // The tabpanel should have tabIndex=0 when there are no tabbable elements within it.\n // Otherwise, tabbing from the focused tab should go directly to the first tabbable element\n // within the tabpanel.\n useLayoutEffect(() => {\n if (ref?.current) {\n let update = () => {\n // Detect if there are any tabbable elements and update the tabIndex accordingly.\n let walker = getFocusableTreeWalker(ref.current, {tabbable: true});\n setTabIndex(walker.nextNode() ? undefined : 0);\n };\n\n update();\n\n // Update when new elements are inserted, or the tabIndex/disabled attribute updates.\n let observer = new MutationObserver(update);\n observer.observe(ref.current, {\n subtree: true,\n childList: true,\n attributes: true,\n attributeFilter: ['tabIndex', 'disabled']\n });\n\n return () => {\n observer.disconnect();\n };\n }\n }, [ref]);\n\n const id = generateId(state, state?.selectedKey, 'tabpanel');\n const tabPanelProps = useLabels({...props, id, 'aria-labelledby': generateId(state, state?.selectedKey, 'tab')});\n\n return {\n tabPanelProps: mergeProps(tabPanelProps, {\n tabIndex,\n role: 'tabpanel',\n 'aria-describedby': props['aria-describedby'],\n 'aria-details': props['aria-details']\n })\n };\n}\n","/*\n* Copyright 2020 Adobe. All rights reserved.\n* This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n* you may not use this file except in compliance with the License. You may obtain a copy\n* of the License at http://www.apache.org/licenses/LICENSE-2.0\n*\n* Unless required by applicable law or agreed to in writing, software distributed under\n* the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n* OF ANY KIND, either express or implied. See the License for the specific language\n* governing permissions and limitations under the License.\n*/\n\nimport {AriaTabListProps} from '@react-types/tabs';\nimport {DOMAttributes} from '@react-types/shared';\nimport {mergeProps, useId, useLabels} from '@react-aria/utils';\nimport {RefObject, useMemo} from 'react';\nimport {TabListState} from '@react-stately/tabs';\nimport {tabsIds} from './utils';\nimport {TabsKeyboardDelegate} from './TabsKeyboardDelegate';\nimport {useLocale} from '@react-aria/i18n';\nimport {useSelectableCollection} from '@react-aria/selection';\n\nexport interface TabListAria {\n /** Props for the tablist container. */\n tabListProps: DOMAttributes\n}\n\n\n/**\n * Provides the behavior and accessibility implementation for a tab list.\n * Tabs organize content into multiple sections and allow users to navigate between them.\n */\nexport function useTabList<T>(props: AriaTabListProps<T>, state: TabListState<T>, ref: RefObject<HTMLElement>): TabListAria {\n let {\n orientation = 'horizontal',\n keyboardActivation = 'automatic'\n } = props;\n let {\n collection,\n selectionManager: manager,\n disabledKeys\n } = state;\n let {direction} = useLocale();\n let delegate = useMemo(() => new TabsKeyboardDelegate(\n collection,\n direction,\n orientation,\n disabledKeys), [collection, disabledKeys, orientation, direction]);\n\n let {collectionProps} = useSelectableCollection({\n ref,\n selectionManager: manager,\n keyboardDelegate: delegate,\n selectOnFocus: keyboardActivation === 'automatic',\n disallowEmptySelection: true,\n scrollRef: ref\n });\n\n // Compute base id for all tabs\n let tabsId = useId();\n tabsIds.set(state, tabsId);\n\n let tabListLabelProps = useLabels({...props, id: tabsId});\n\n return {\n tabListProps: {\n ...mergeProps(collectionProps, tabListLabelProps),\n role: 'tablist',\n 'aria-orientation': orientation,\n tabIndex: undefined\n }\n };\n}\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Collection, Direction, KeyboardDelegate, Orientation} from '@react-types/shared';\nimport {Key} from 'react';\n\nexport class TabsKeyboardDelegate<T> implements KeyboardDelegate {\n private collection: Collection<T>;\n private flipDirection: boolean;\n private disabledKeys: Set<Key>;\n private orientation: Orientation;\n\n constructor(collection: Collection<T>, direction: Direction, orientation: Orientation, disabledKeys: Set<Key> = new Set()) {\n this.collection = collection;\n this.flipDirection = direction === 'rtl' && orientation === 'horizontal';\n this.orientation = orientation;\n this.disabledKeys = disabledKeys;\n }\n\n getKeyLeftOf(key: Key) {\n if (this.flipDirection) {\n return this.getNextKey(key);\n } else {\n if (this.orientation === 'horizontal') {\n return this.getPreviousKey(key);\n }\n return null;\n }\n }\n\n getKeyRightOf(key: Key) {\n if (this.flipDirection) {\n return this.getPreviousKey(key);\n } else {\n if (this.orientation === 'horizontal') {\n return this.getNextKey(key);\n }\n return null;\n }\n }\n\n getKeyAbove(key: Key) {\n if (this.orientation === 'vertical') {\n return this.getPreviousKey(key);\n }\n return null;\n }\n\n getKeyBelow(key: Key) {\n if (this.orientation === 'vertical') {\n return this.getNextKey(key);\n }\n return null;\n }\n\n getFirstKey() {\n let key = this.collection.getFirstKey();\n if (this.disabledKeys.has(key)) {\n key = this.getNextKey(key);\n }\n return key;\n }\n\n getLastKey() {\n let key = this.collection.getLastKey();\n if (this.disabledKeys.has(key)) {\n key = this.getPreviousKey(key);\n }\n return key;\n }\n\n getNextKey(key) {\n do {\n key = this.collection.getKeyAfter(key);\n if (key == null) {\n key = this.collection.getFirstKey();\n }\n } while (this.disabledKeys.has(key));\n return key;\n }\n\n getPreviousKey(key) {\n do {\n key = this.collection.getKeyBefore(key);\n if (key == null) {\n key = this.collection.getLastKey();\n }\n } while (this.disabledKeys.has(key));\n return key;\n }\n}\n"],"names":[],"version":3,"file":"main.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-aria/tabs/src/index.ts","packages/@react-aria/tabs/src/useTab.ts","packages/@react-aria/tabs/src/utils.ts","packages/@react-aria/tabs/src/useTabPanel.ts","packages/@react-aria/tabs/src/useTabList.ts","packages/@react-aria/tabs/src/TabsKeyboardDelegate.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nexport {useTab} from './useTab';\nexport {useTabPanel} from './useTabPanel';\nexport {useTabList} from './useTabList';\nexport type {AriaTabListProps, AriaTabPanelProps, AriaTabProps} from '@react-types/tabs';\nexport type {TabAria} from './useTab';\nexport type {TabPanelAria} from './useTabPanel';\nexport type {TabListAria} from './useTabList';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaTabProps} from '@react-types/tabs';\nimport {DOMAttributes, FocusableElement} from '@react-types/shared';\nimport {generateId} from './utils';\nimport {RefObject} from 'react';\nimport {TabListState} from '@react-stately/tabs';\nimport {useSelectableItem} from '@react-aria/selection';\n\nexport interface TabAria {\n /** Props for the tab element. */\n tabProps: DOMAttributes,\n /** Whether the tab is currently selected. */\n isSelected: boolean,\n /** Whether the tab is disabled. */\n isDisabled: boolean\n}\n\n/**\n * Provides the behavior and accessibility implementation for a tab.\n * When selected, the associated tab panel is shown.\n */\nexport function useTab<T>(\n props: AriaTabProps,\n state: TabListState<T>,\n ref: RefObject<FocusableElement>\n): TabAria {\n let {key, isDisabled: propsDisabled} = props;\n let {selectionManager: manager, selectedKey} = state;\n\n let isSelected = key === selectedKey;\n\n let isDisabled = propsDisabled || state.isDisabled || state.disabledKeys.has(key);\n let {itemProps} = useSelectableItem({\n selectionManager: manager,\n key,\n ref,\n isDisabled\n });\n\n let tabId = generateId(state, key, 'tab');\n let tabPanelId = generateId(state, key, 'tabpanel');\n let {tabIndex} = itemProps;\n\n return {\n tabProps: {\n ...itemProps,\n id: tabId,\n 'aria-selected': isSelected,\n 'aria-disabled': isDisabled || undefined,\n 'aria-controls': isSelected ? tabPanelId : undefined,\n tabIndex: isDisabled ? undefined : tabIndex,\n role: 'tab'\n },\n isSelected,\n isDisabled\n };\n}\n\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Key} from 'react';\nimport {TabListState} from '@react-stately/tabs';\n\nexport const tabsIds = new WeakMap<TabListState<unknown>, string>();\n\nexport function generateId<T>(state: TabListState<T>, key: Key, role: string) {\n if (typeof key === 'string') {\n key = key.replace(/\\s+/g, '');\n }\n\n let baseId = tabsIds.get(state);\n return `${baseId}-${role}-${key}`;\n}\n\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaTabPanelProps} from '@react-types/tabs';\nimport {DOMAttributes} from '@react-types/shared';\nimport {generateId} from './utils';\nimport {getFocusableTreeWalker} from '@react-aria/focus';\nimport {mergeProps, useLabels, useLayoutEffect} from '@react-aria/utils';\nimport {RefObject, useState} from 'react';\nimport {TabListState} from '@react-stately/tabs';\n\nexport interface TabPanelAria {\n /** Props for the tab panel element. */\n tabPanelProps: DOMAttributes\n}\n\n\n/**\n * Provides the behavior and accessibility implementation for a tab panel. A tab panel is a container for\n * the contents of a tab, and is shown when the tab is selected.\n */\nexport function useTabPanel<T>(props: AriaTabPanelProps, state: TabListState<T>, ref: RefObject<Element>): TabPanelAria {\n let [tabIndex, setTabIndex] = useState(0);\n\n // The tabpanel should have tabIndex=0 when there are no tabbable elements within it.\n // Otherwise, tabbing from the focused tab should go directly to the first tabbable element\n // within the tabpanel.\n useLayoutEffect(() => {\n if (ref?.current) {\n let update = () => {\n // Detect if there are any tabbable elements and update the tabIndex accordingly.\n let walker = getFocusableTreeWalker(ref.current, {tabbable: true});\n setTabIndex(walker.nextNode() ? undefined : 0);\n };\n\n update();\n\n // Update when new elements are inserted, or the tabIndex/disabled attribute updates.\n let observer = new MutationObserver(update);\n observer.observe(ref.current, {\n subtree: true,\n childList: true,\n attributes: true,\n attributeFilter: ['tabIndex', 'disabled']\n });\n\n return () => {\n observer.disconnect();\n };\n }\n }, [ref]);\n\n const id = generateId(state, state?.selectedKey, 'tabpanel');\n const tabPanelProps = useLabels({...props, id, 'aria-labelledby': generateId(state, state?.selectedKey, 'tab')});\n\n return {\n tabPanelProps: mergeProps(tabPanelProps, {\n tabIndex,\n role: 'tabpanel',\n 'aria-describedby': props['aria-describedby'],\n 'aria-details': props['aria-details']\n })\n };\n}\n","/*\n* Copyright 2020 Adobe. All rights reserved.\n* This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n* you may not use this file except in compliance with the License. You may obtain a copy\n* of the License at http://www.apache.org/licenses/LICENSE-2.0\n*\n* Unless required by applicable law or agreed to in writing, software distributed under\n* the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n* OF ANY KIND, either express or implied. See the License for the specific language\n* governing permissions and limitations under the License.\n*/\n\nimport {AriaTabListProps} from '@react-types/tabs';\nimport {DOMAttributes} from '@react-types/shared';\nimport {mergeProps, useId, useLabels} from '@react-aria/utils';\nimport {RefObject, useMemo} from 'react';\nimport {TabListState} from '@react-stately/tabs';\nimport {tabsIds} from './utils';\nimport {TabsKeyboardDelegate} from './TabsKeyboardDelegate';\nimport {useLocale} from '@react-aria/i18n';\nimport {useSelectableCollection} from '@react-aria/selection';\n\nexport interface TabListAria {\n /** Props for the tablist container. */\n tabListProps: DOMAttributes\n}\n\n\n/**\n * Provides the behavior and accessibility implementation for a tab list.\n * Tabs organize content into multiple sections and allow users to navigate between them.\n */\nexport function useTabList<T>(props: AriaTabListProps<T>, state: TabListState<T>, ref: RefObject<HTMLElement>): TabListAria {\n let {\n orientation = 'horizontal',\n keyboardActivation = 'automatic'\n } = props;\n let {\n collection,\n selectionManager: manager,\n disabledKeys\n } = state;\n let {direction} = useLocale();\n let delegate = useMemo(() => new TabsKeyboardDelegate(\n collection,\n direction,\n orientation,\n disabledKeys), [collection, disabledKeys, orientation, direction]);\n\n let {collectionProps} = useSelectableCollection({\n ref,\n selectionManager: manager,\n keyboardDelegate: delegate,\n selectOnFocus: keyboardActivation === 'automatic',\n disallowEmptySelection: true,\n scrollRef: ref\n });\n\n // Compute base id for all tabs\n let tabsId = useId();\n tabsIds.set(state, tabsId);\n\n let tabListLabelProps = useLabels({...props, id: tabsId});\n\n return {\n tabListProps: {\n ...mergeProps(collectionProps, tabListLabelProps),\n role: 'tablist',\n 'aria-orientation': orientation,\n tabIndex: undefined\n }\n };\n}\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Collection, Direction, KeyboardDelegate, Orientation} from '@react-types/shared';\nimport {Key} from 'react';\n\nexport class TabsKeyboardDelegate<T> implements KeyboardDelegate {\n private collection: Collection<T>;\n private flipDirection: boolean;\n private disabledKeys: Set<Key>;\n private orientation: Orientation;\n\n constructor(collection: Collection<T>, direction: Direction, orientation: Orientation, disabledKeys: Set<Key> = new Set()) {\n this.collection = collection;\n this.flipDirection = direction === 'rtl' && orientation === 'horizontal';\n this.orientation = orientation;\n this.disabledKeys = disabledKeys;\n }\n\n getKeyLeftOf(key: Key) {\n if (this.flipDirection) {\n return this.getNextKey(key);\n } else {\n if (this.orientation === 'horizontal') {\n return this.getPreviousKey(key);\n }\n return null;\n }\n }\n\n getKeyRightOf(key: Key) {\n if (this.flipDirection) {\n return this.getPreviousKey(key);\n } else {\n if (this.orientation === 'horizontal') {\n return this.getNextKey(key);\n }\n return null;\n }\n }\n\n getKeyAbove(key: Key) {\n if (this.orientation === 'vertical') {\n return this.getPreviousKey(key);\n }\n return null;\n }\n\n getKeyBelow(key: Key) {\n if (this.orientation === 'vertical') {\n return this.getNextKey(key);\n }\n return null;\n }\n\n getFirstKey() {\n let key = this.collection.getFirstKey();\n if (this.disabledKeys.has(key)) {\n key = this.getNextKey(key);\n }\n return key;\n }\n\n getLastKey() {\n let key = this.collection.getLastKey();\n if (this.disabledKeys.has(key)) {\n key = this.getPreviousKey(key);\n }\n return key;\n }\n\n getNextKey(key) {\n do {\n key = this.collection.getKeyAfter(key);\n if (key == null) {\n key = this.collection.getFirstKey();\n }\n } while (this.disabledKeys.has(key));\n return key;\n }\n\n getPreviousKey(key) {\n do {\n key = this.collection.getKeyBefore(key);\n if (key == null) {\n key = this.collection.getLastKey();\n }\n } while (this.disabledKeys.has(key));\n return key;\n }\n}\n"],"names":[],"version":3,"file":"main.js.map"}
|
package/dist/module.mjs
CHANGED
|
@@ -4,9 +4,39 @@ import {useLayoutEffect as $8kq0t$useLayoutEffect, useLabels as $8kq0t$useLabels
|
|
|
4
4
|
import {useState as $8kq0t$useState, useMemo as $8kq0t$useMemo} from "react";
|
|
5
5
|
import {useLocale as $8kq0t$useLocale} from "@react-aria/i18n";
|
|
6
6
|
|
|
7
|
-
|
|
7
|
+
/*
|
|
8
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
9
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
10
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
11
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
12
|
+
*
|
|
13
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
14
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
15
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
16
|
+
* governing permissions and limitations under the License.
|
|
17
|
+
*/ /*
|
|
18
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
19
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
20
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
21
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
22
|
+
*
|
|
23
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
24
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
25
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
26
|
+
* governing permissions and limitations under the License.
|
|
27
|
+
*/ /*
|
|
28
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
29
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
30
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
31
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
32
|
+
*
|
|
33
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
34
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
35
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
36
|
+
* governing permissions and limitations under the License.
|
|
37
|
+
*/ const $99b62ae3ff97ec45$export$c5f62239608282b6 = new WeakMap();
|
|
8
38
|
function $99b62ae3ff97ec45$export$567fc7097e064344(state, key, role) {
|
|
9
|
-
if (typeof key ===
|
|
39
|
+
if (typeof key === "string") key = key.replace(/\s+/g, "");
|
|
10
40
|
let baseId = $99b62ae3ff97ec45$export$c5f62239608282b6.get(state);
|
|
11
41
|
return `${baseId}-${role}-${key}`;
|
|
12
42
|
}
|
|
@@ -18,24 +48,24 @@ function $0175d55c2a017ebc$export$fdf4756d5b8ef90a(props, state, ref) {
|
|
|
18
48
|
let { selectionManager: manager , selectedKey: selectedKey } = state;
|
|
19
49
|
let isSelected = key === selectedKey;
|
|
20
50
|
let isDisabled = propsDisabled || state.isDisabled || state.disabledKeys.has(key);
|
|
21
|
-
let { itemProps: itemProps } = $8kq0t$useSelectableItem({
|
|
51
|
+
let { itemProps: itemProps } = (0, $8kq0t$useSelectableItem)({
|
|
22
52
|
selectionManager: manager,
|
|
23
53
|
key: key,
|
|
24
54
|
ref: ref,
|
|
25
55
|
isDisabled: isDisabled
|
|
26
56
|
});
|
|
27
|
-
let tabId = $99b62ae3ff97ec45$export$567fc7097e064344(state, key,
|
|
28
|
-
let tabPanelId = $99b62ae3ff97ec45$export$567fc7097e064344(state, key,
|
|
57
|
+
let tabId = (0, $99b62ae3ff97ec45$export$567fc7097e064344)(state, key, "tab");
|
|
58
|
+
let tabPanelId = (0, $99b62ae3ff97ec45$export$567fc7097e064344)(state, key, "tabpanel");
|
|
29
59
|
let { tabIndex: tabIndex } = itemProps;
|
|
30
60
|
return {
|
|
31
61
|
tabProps: {
|
|
32
62
|
...itemProps,
|
|
33
63
|
id: tabId,
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
64
|
+
"aria-selected": isSelected,
|
|
65
|
+
"aria-disabled": isDisabled || undefined,
|
|
66
|
+
"aria-controls": isSelected ? tabPanelId : undefined,
|
|
37
67
|
tabIndex: isDisabled ? undefined : tabIndex,
|
|
38
|
-
role:
|
|
68
|
+
role: "tab"
|
|
39
69
|
},
|
|
40
70
|
isSelected: isSelected,
|
|
41
71
|
isDisabled: isDisabled
|
|
@@ -43,20 +73,30 @@ function $0175d55c2a017ebc$export$fdf4756d5b8ef90a(props, state, ref) {
|
|
|
43
73
|
}
|
|
44
74
|
|
|
45
75
|
|
|
46
|
-
|
|
76
|
+
/*
|
|
77
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
78
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
79
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
80
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
81
|
+
*
|
|
82
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
83
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
84
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
85
|
+
* governing permissions and limitations under the License.
|
|
86
|
+
*/
|
|
47
87
|
|
|
48
88
|
|
|
49
89
|
|
|
50
90
|
function $34bce698202e07cb$export$fae0121b5afe572d(props, state, ref) {
|
|
51
|
-
let [tabIndex, setTabIndex] = $8kq0t$useState(0);
|
|
91
|
+
let [tabIndex, setTabIndex] = (0, $8kq0t$useState)(0);
|
|
52
92
|
// The tabpanel should have tabIndex=0 when there are no tabbable elements within it.
|
|
53
93
|
// Otherwise, tabbing from the focused tab should go directly to the first tabbable element
|
|
54
94
|
// within the tabpanel.
|
|
55
|
-
$8kq0t$useLayoutEffect(()=>{
|
|
95
|
+
(0, $8kq0t$useLayoutEffect)(()=>{
|
|
56
96
|
if (ref === null || ref === void 0 ? void 0 : ref.current) {
|
|
57
97
|
let update = ()=>{
|
|
58
98
|
// Detect if there are any tabbable elements and update the tabIndex accordingly.
|
|
59
|
-
let walker = $8kq0t$getFocusableTreeWalker(ref.current, {
|
|
99
|
+
let walker = (0, $8kq0t$getFocusableTreeWalker)(ref.current, {
|
|
60
100
|
tabbable: true
|
|
61
101
|
});
|
|
62
102
|
setTabIndex(walker.nextNode() ? undefined : 0);
|
|
@@ -69,8 +109,8 @@ function $34bce698202e07cb$export$fae0121b5afe572d(props, state, ref) {
|
|
|
69
109
|
childList: true,
|
|
70
110
|
attributes: true,
|
|
71
111
|
attributeFilter: [
|
|
72
|
-
|
|
73
|
-
|
|
112
|
+
"tabIndex",
|
|
113
|
+
"disabled"
|
|
74
114
|
]
|
|
75
115
|
});
|
|
76
116
|
return ()=>{
|
|
@@ -80,47 +120,67 @@ function $34bce698202e07cb$export$fae0121b5afe572d(props, state, ref) {
|
|
|
80
120
|
}, [
|
|
81
121
|
ref
|
|
82
122
|
]);
|
|
83
|
-
const id = $99b62ae3ff97ec45$export$567fc7097e064344(state, state === null || state === void 0 ? void 0 : state.selectedKey,
|
|
84
|
-
const tabPanelProps = $8kq0t$useLabels({
|
|
123
|
+
const id = (0, $99b62ae3ff97ec45$export$567fc7097e064344)(state, state === null || state === void 0 ? void 0 : state.selectedKey, "tabpanel");
|
|
124
|
+
const tabPanelProps = (0, $8kq0t$useLabels)({
|
|
85
125
|
...props,
|
|
86
126
|
id: id,
|
|
87
|
-
|
|
127
|
+
"aria-labelledby": (0, $99b62ae3ff97ec45$export$567fc7097e064344)(state, state === null || state === void 0 ? void 0 : state.selectedKey, "tab")
|
|
88
128
|
});
|
|
89
129
|
return {
|
|
90
|
-
tabPanelProps: $8kq0t$mergeProps(tabPanelProps, {
|
|
130
|
+
tabPanelProps: (0, $8kq0t$mergeProps)(tabPanelProps, {
|
|
91
131
|
tabIndex: tabIndex,
|
|
92
|
-
role:
|
|
93
|
-
|
|
94
|
-
|
|
132
|
+
role: "tabpanel",
|
|
133
|
+
"aria-describedby": props["aria-describedby"],
|
|
134
|
+
"aria-details": props["aria-details"]
|
|
95
135
|
})
|
|
96
136
|
};
|
|
97
137
|
}
|
|
98
138
|
|
|
99
139
|
|
|
140
|
+
/*
|
|
141
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
142
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
143
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
144
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
145
|
+
*
|
|
146
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
147
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
148
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
149
|
+
* governing permissions and limitations under the License.
|
|
150
|
+
*/
|
|
100
151
|
|
|
101
152
|
|
|
102
|
-
|
|
103
|
-
|
|
153
|
+
/*
|
|
154
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
155
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
156
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
157
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
158
|
+
*
|
|
159
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
160
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
161
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
162
|
+
* governing permissions and limitations under the License.
|
|
163
|
+
*/ class $bfc6f2d60b8a4c40$export$15010ca3c1abe90b {
|
|
104
164
|
getKeyLeftOf(key) {
|
|
105
165
|
if (this.flipDirection) return this.getNextKey(key);
|
|
106
166
|
else {
|
|
107
|
-
if (this.orientation ===
|
|
167
|
+
if (this.orientation === "horizontal") return this.getPreviousKey(key);
|
|
108
168
|
return null;
|
|
109
169
|
}
|
|
110
170
|
}
|
|
111
171
|
getKeyRightOf(key) {
|
|
112
172
|
if (this.flipDirection) return this.getPreviousKey(key);
|
|
113
173
|
else {
|
|
114
|
-
if (this.orientation ===
|
|
174
|
+
if (this.orientation === "horizontal") return this.getNextKey(key);
|
|
115
175
|
return null;
|
|
116
176
|
}
|
|
117
177
|
}
|
|
118
178
|
getKeyAbove(key) {
|
|
119
|
-
if (this.orientation ===
|
|
179
|
+
if (this.orientation === "vertical") return this.getPreviousKey(key);
|
|
120
180
|
return null;
|
|
121
181
|
}
|
|
122
182
|
getKeyBelow(key) {
|
|
123
|
-
if (this.orientation ===
|
|
183
|
+
if (this.orientation === "vertical") return this.getNextKey(key);
|
|
124
184
|
return null;
|
|
125
185
|
}
|
|
126
186
|
getFirstKey() {
|
|
@@ -137,19 +197,19 @@ class $bfc6f2d60b8a4c40$export$15010ca3c1abe90b {
|
|
|
137
197
|
do {
|
|
138
198
|
key = this.collection.getKeyAfter(key);
|
|
139
199
|
if (key == null) key = this.collection.getFirstKey();
|
|
140
|
-
}while (this.disabledKeys.has(key))
|
|
200
|
+
}while (this.disabledKeys.has(key));
|
|
141
201
|
return key;
|
|
142
202
|
}
|
|
143
203
|
getPreviousKey(key) {
|
|
144
204
|
do {
|
|
145
205
|
key = this.collection.getKeyBefore(key);
|
|
146
206
|
if (key == null) key = this.collection.getLastKey();
|
|
147
|
-
}while (this.disabledKeys.has(key))
|
|
207
|
+
}while (this.disabledKeys.has(key));
|
|
148
208
|
return key;
|
|
149
209
|
}
|
|
150
210
|
constructor(collection, direction, orientation, disabledKeys = new Set()){
|
|
151
211
|
this.collection = collection;
|
|
152
|
-
this.flipDirection = direction ===
|
|
212
|
+
this.flipDirection = direction === "rtl" && orientation === "horizontal";
|
|
153
213
|
this.orientation = orientation;
|
|
154
214
|
this.disabledKeys = disabledKeys;
|
|
155
215
|
}
|
|
@@ -159,36 +219,35 @@ class $bfc6f2d60b8a4c40$export$15010ca3c1abe90b {
|
|
|
159
219
|
|
|
160
220
|
|
|
161
221
|
function $58d314389b21fa3f$export$773e389e644c5874(props, state, ref) {
|
|
162
|
-
let { orientation: orientation =
|
|
222
|
+
let { orientation: orientation = "horizontal" , keyboardActivation: keyboardActivation = "automatic" } = props;
|
|
163
223
|
let { collection: collection , selectionManager: manager , disabledKeys: disabledKeys } = state;
|
|
164
|
-
let { direction: direction } = $8kq0t$useLocale();
|
|
165
|
-
let delegate = $8kq0t$useMemo(()=>new $bfc6f2d60b8a4c40$export$15010ca3c1abe90b(collection, direction, orientation, disabledKeys)
|
|
166
|
-
, [
|
|
224
|
+
let { direction: direction } = (0, $8kq0t$useLocale)();
|
|
225
|
+
let delegate = (0, $8kq0t$useMemo)(()=>new (0, $bfc6f2d60b8a4c40$export$15010ca3c1abe90b)(collection, direction, orientation, disabledKeys), [
|
|
167
226
|
collection,
|
|
168
227
|
disabledKeys,
|
|
169
228
|
orientation,
|
|
170
229
|
direction
|
|
171
230
|
]);
|
|
172
|
-
let { collectionProps: collectionProps } = $8kq0t$useSelectableCollection({
|
|
231
|
+
let { collectionProps: collectionProps } = (0, $8kq0t$useSelectableCollection)({
|
|
173
232
|
ref: ref,
|
|
174
233
|
selectionManager: manager,
|
|
175
234
|
keyboardDelegate: delegate,
|
|
176
|
-
selectOnFocus: keyboardActivation ===
|
|
235
|
+
selectOnFocus: keyboardActivation === "automatic",
|
|
177
236
|
disallowEmptySelection: true,
|
|
178
237
|
scrollRef: ref
|
|
179
238
|
});
|
|
180
239
|
// Compute base id for all tabs
|
|
181
|
-
let tabsId = $8kq0t$useId();
|
|
182
|
-
$99b62ae3ff97ec45$export$c5f62239608282b6.set(state, tabsId);
|
|
183
|
-
let tabListLabelProps = $8kq0t$useLabels({
|
|
240
|
+
let tabsId = (0, $8kq0t$useId)();
|
|
241
|
+
(0, $99b62ae3ff97ec45$export$c5f62239608282b6).set(state, tabsId);
|
|
242
|
+
let tabListLabelProps = (0, $8kq0t$useLabels)({
|
|
184
243
|
...props,
|
|
185
244
|
id: tabsId
|
|
186
245
|
});
|
|
187
246
|
return {
|
|
188
247
|
tabListProps: {
|
|
189
|
-
|
|
190
|
-
role:
|
|
191
|
-
|
|
248
|
+
...(0, $8kq0t$mergeProps)(collectionProps, tabListLabelProps),
|
|
249
|
+
role: "tablist",
|
|
250
|
+
"aria-orientation": orientation,
|
|
192
251
|
tabIndex: undefined
|
|
193
252
|
}
|
|
194
253
|
};
|
package/dist/module.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-aria/tabs/src/index.ts","packages/@react-aria/tabs/src/useTab.ts","packages/@react-aria/tabs/src/utils.ts","packages/@react-aria/tabs/src/useTabPanel.ts","packages/@react-aria/tabs/src/useTabList.ts","packages/@react-aria/tabs/src/TabsKeyboardDelegate.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nexport {useTab} from './useTab';\nexport {useTabPanel} from './useTabPanel';\nexport {useTabList} from './useTabList';\nexport type {AriaTabListProps, AriaTabPanelProps, AriaTabProps} from '@react-types/tabs';\nexport type {TabAria} from './useTab';\nexport type {TabPanelAria} from './useTabPanel';\nexport type {TabListAria} from './useTabList';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaTabProps} from '@react-types/tabs';\nimport {DOMAttributes, FocusableElement} from '@react-types/shared';\nimport {generateId} from './utils';\nimport {RefObject} from 'react';\nimport {TabListState} from '@react-stately/tabs';\nimport {useSelectableItem} from '@react-aria/selection';\n\nexport interface TabAria {\n /** Props for the tab element. */\n tabProps: DOMAttributes,\n /** Whether the tab is currently selected. */\n isSelected: boolean,\n /** Whether the tab is disabled. */\n isDisabled: boolean\n}\n\n/**\n * Provides the behavior and accessibility implementation for a tab.\n * When selected, the associated tab panel is shown.\n */\nexport function useTab<T>(\n props: AriaTabProps,\n state: TabListState<T>,\n ref: RefObject<FocusableElement>\n): TabAria {\n let {key, isDisabled: propsDisabled} = props;\n let {selectionManager: manager, selectedKey} = state;\n\n let isSelected = key === selectedKey;\n\n let isDisabled = propsDisabled || state.isDisabled || state.disabledKeys.has(key);\n let {itemProps} = useSelectableItem({\n selectionManager: manager,\n key,\n ref,\n isDisabled\n });\n\n let tabId = generateId(state, key, 'tab');\n let tabPanelId = generateId(state, key, 'tabpanel');\n let {tabIndex} = itemProps;\n\n return {\n tabProps: {\n ...itemProps,\n id: tabId,\n 'aria-selected': isSelected,\n 'aria-disabled': isDisabled || undefined,\n 'aria-controls': isSelected ? tabPanelId : undefined,\n tabIndex: isDisabled ? undefined : tabIndex,\n role: 'tab'\n },\n isSelected,\n isDisabled\n };\n}\n\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Key} from 'react';\nimport {TabListState} from '@react-stately/tabs';\n\nexport const tabsIds = new WeakMap<TabListState<unknown>, string>();\n\nexport function generateId<T>(state: TabListState<T>, key: Key, role: string) {\n if (typeof key === 'string') {\n key = key.replace(/\\s+/g, '');\n }\n\n let baseId = tabsIds.get(state);\n return `${baseId}-${role}-${key}`;\n}\n\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaTabPanelProps} from '@react-types/tabs';\nimport {DOMAttributes} from '@react-types/shared';\nimport {generateId} from './utils';\nimport {getFocusableTreeWalker} from '@react-aria/focus';\nimport {mergeProps, useLabels, useLayoutEffect} from '@react-aria/utils';\nimport {RefObject, useState} from 'react';\nimport {TabListState} from '@react-stately/tabs';\n\nexport interface TabPanelAria {\n /** Props for the tab panel element. */\n tabPanelProps: DOMAttributes\n}\n\n\n/**\n * Provides the behavior and accessibility implementation for a tab panel. A tab panel is a container for\n * the contents of a tab, and is shown when the tab is selected.\n */\nexport function useTabPanel<T>(props: AriaTabPanelProps, state: TabListState<T>, ref: RefObject<Element>): TabPanelAria {\n let [tabIndex, setTabIndex] = useState(0);\n\n // The tabpanel should have tabIndex=0 when there are no tabbable elements within it.\n // Otherwise, tabbing from the focused tab should go directly to the first tabbable element\n // within the tabpanel.\n useLayoutEffect(() => {\n if (ref?.current) {\n let update = () => {\n // Detect if there are any tabbable elements and update the tabIndex accordingly.\n let walker = getFocusableTreeWalker(ref.current, {tabbable: true});\n setTabIndex(walker.nextNode() ? undefined : 0);\n };\n\n update();\n\n // Update when new elements are inserted, or the tabIndex/disabled attribute updates.\n let observer = new MutationObserver(update);\n observer.observe(ref.current, {\n subtree: true,\n childList: true,\n attributes: true,\n attributeFilter: ['tabIndex', 'disabled']\n });\n\n return () => {\n observer.disconnect();\n };\n }\n }, [ref]);\n\n const id = generateId(state, state?.selectedKey, 'tabpanel');\n const tabPanelProps = useLabels({...props, id, 'aria-labelledby': generateId(state, state?.selectedKey, 'tab')});\n\n return {\n tabPanelProps: mergeProps(tabPanelProps, {\n tabIndex,\n role: 'tabpanel',\n 'aria-describedby': props['aria-describedby'],\n 'aria-details': props['aria-details']\n })\n };\n}\n","/*\n* Copyright 2020 Adobe. All rights reserved.\n* This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n* you may not use this file except in compliance with the License. You may obtain a copy\n* of the License at http://www.apache.org/licenses/LICENSE-2.0\n*\n* Unless required by applicable law or agreed to in writing, software distributed under\n* the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n* OF ANY KIND, either express or implied. See the License for the specific language\n* governing permissions and limitations under the License.\n*/\n\nimport {AriaTabListProps} from '@react-types/tabs';\nimport {DOMAttributes} from '@react-types/shared';\nimport {mergeProps, useId, useLabels} from '@react-aria/utils';\nimport {RefObject, useMemo} from 'react';\nimport {TabListState} from '@react-stately/tabs';\nimport {tabsIds} from './utils';\nimport {TabsKeyboardDelegate} from './TabsKeyboardDelegate';\nimport {useLocale} from '@react-aria/i18n';\nimport {useSelectableCollection} from '@react-aria/selection';\n\nexport interface TabListAria {\n /** Props for the tablist container. */\n tabListProps: DOMAttributes\n}\n\n\n/**\n * Provides the behavior and accessibility implementation for a tab list.\n * Tabs organize content into multiple sections and allow users to navigate between them.\n */\nexport function useTabList<T>(props: AriaTabListProps<T>, state: TabListState<T>, ref: RefObject<HTMLElement>): TabListAria {\n let {\n orientation = 'horizontal',\n keyboardActivation = 'automatic'\n } = props;\n let {\n collection,\n selectionManager: manager,\n disabledKeys\n } = state;\n let {direction} = useLocale();\n let delegate = useMemo(() => new TabsKeyboardDelegate(\n collection,\n direction,\n orientation,\n disabledKeys), [collection, disabledKeys, orientation, direction]);\n\n let {collectionProps} = useSelectableCollection({\n ref,\n selectionManager: manager,\n keyboardDelegate: delegate,\n selectOnFocus: keyboardActivation === 'automatic',\n disallowEmptySelection: true,\n scrollRef: ref\n });\n\n // Compute base id for all tabs\n let tabsId = useId();\n tabsIds.set(state, tabsId);\n\n let tabListLabelProps = useLabels({...props, id: tabsId});\n\n return {\n tabListProps: {\n ...mergeProps(collectionProps, tabListLabelProps),\n role: 'tablist',\n 'aria-orientation': orientation,\n tabIndex: undefined\n }\n };\n}\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Collection, Direction, KeyboardDelegate, Orientation} from '@react-types/shared';\nimport {Key} from 'react';\n\nexport class TabsKeyboardDelegate<T> implements KeyboardDelegate {\n private collection: Collection<T>;\n private flipDirection: boolean;\n private disabledKeys: Set<Key>;\n private orientation: Orientation;\n\n constructor(collection: Collection<T>, direction: Direction, orientation: Orientation, disabledKeys: Set<Key> = new Set()) {\n this.collection = collection;\n this.flipDirection = direction === 'rtl' && orientation === 'horizontal';\n this.orientation = orientation;\n this.disabledKeys = disabledKeys;\n }\n\n getKeyLeftOf(key: Key) {\n if (this.flipDirection) {\n return this.getNextKey(key);\n } else {\n if (this.orientation === 'horizontal') {\n return this.getPreviousKey(key);\n }\n return null;\n }\n }\n\n getKeyRightOf(key: Key) {\n if (this.flipDirection) {\n return this.getPreviousKey(key);\n } else {\n if (this.orientation === 'horizontal') {\n return this.getNextKey(key);\n }\n return null;\n }\n }\n\n getKeyAbove(key: Key) {\n if (this.orientation === 'vertical') {\n return this.getPreviousKey(key);\n }\n return null;\n }\n\n getKeyBelow(key: Key) {\n if (this.orientation === 'vertical') {\n return this.getNextKey(key);\n }\n return null;\n }\n\n getFirstKey() {\n let key = this.collection.getFirstKey();\n if (this.disabledKeys.has(key)) {\n key = this.getNextKey(key);\n }\n return key;\n }\n\n getLastKey() {\n let key = this.collection.getLastKey();\n if (this.disabledKeys.has(key)) {\n key = this.getPreviousKey(key);\n }\n return key;\n }\n\n getNextKey(key) {\n do {\n key = this.collection.getKeyAfter(key);\n if (key == null) {\n key = this.collection.getFirstKey();\n }\n } while (this.disabledKeys.has(key));\n return key;\n }\n\n getPreviousKey(key) {\n do {\n key = this.collection.getKeyBefore(key);\n if (key == null) {\n key = this.collection.getLastKey();\n }\n } while (this.disabledKeys.has(key));\n return key;\n }\n}\n"],"names":[],"version":3,"file":"module.mjs.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-aria/tabs/src/index.ts","packages/@react-aria/tabs/src/useTab.ts","packages/@react-aria/tabs/src/utils.ts","packages/@react-aria/tabs/src/useTabPanel.ts","packages/@react-aria/tabs/src/useTabList.ts","packages/@react-aria/tabs/src/TabsKeyboardDelegate.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nexport {useTab} from './useTab';\nexport {useTabPanel} from './useTabPanel';\nexport {useTabList} from './useTabList';\nexport type {AriaTabListProps, AriaTabPanelProps, AriaTabProps} from '@react-types/tabs';\nexport type {TabAria} from './useTab';\nexport type {TabPanelAria} from './useTabPanel';\nexport type {TabListAria} from './useTabList';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaTabProps} from '@react-types/tabs';\nimport {DOMAttributes, FocusableElement} from '@react-types/shared';\nimport {generateId} from './utils';\nimport {RefObject} from 'react';\nimport {TabListState} from '@react-stately/tabs';\nimport {useSelectableItem} from '@react-aria/selection';\n\nexport interface TabAria {\n /** Props for the tab element. */\n tabProps: DOMAttributes,\n /** Whether the tab is currently selected. */\n isSelected: boolean,\n /** Whether the tab is disabled. */\n isDisabled: boolean\n}\n\n/**\n * Provides the behavior and accessibility implementation for a tab.\n * When selected, the associated tab panel is shown.\n */\nexport function useTab<T>(\n props: AriaTabProps,\n state: TabListState<T>,\n ref: RefObject<FocusableElement>\n): TabAria {\n let {key, isDisabled: propsDisabled} = props;\n let {selectionManager: manager, selectedKey} = state;\n\n let isSelected = key === selectedKey;\n\n let isDisabled = propsDisabled || state.isDisabled || state.disabledKeys.has(key);\n let {itemProps} = useSelectableItem({\n selectionManager: manager,\n key,\n ref,\n isDisabled\n });\n\n let tabId = generateId(state, key, 'tab');\n let tabPanelId = generateId(state, key, 'tabpanel');\n let {tabIndex} = itemProps;\n\n return {\n tabProps: {\n ...itemProps,\n id: tabId,\n 'aria-selected': isSelected,\n 'aria-disabled': isDisabled || undefined,\n 'aria-controls': isSelected ? tabPanelId : undefined,\n tabIndex: isDisabled ? undefined : tabIndex,\n role: 'tab'\n },\n isSelected,\n isDisabled\n };\n}\n\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Key} from 'react';\nimport {TabListState} from '@react-stately/tabs';\n\nexport const tabsIds = new WeakMap<TabListState<unknown>, string>();\n\nexport function generateId<T>(state: TabListState<T>, key: Key, role: string) {\n if (typeof key === 'string') {\n key = key.replace(/\\s+/g, '');\n }\n\n let baseId = tabsIds.get(state);\n return `${baseId}-${role}-${key}`;\n}\n\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaTabPanelProps} from '@react-types/tabs';\nimport {DOMAttributes} from '@react-types/shared';\nimport {generateId} from './utils';\nimport {getFocusableTreeWalker} from '@react-aria/focus';\nimport {mergeProps, useLabels, useLayoutEffect} from '@react-aria/utils';\nimport {RefObject, useState} from 'react';\nimport {TabListState} from '@react-stately/tabs';\n\nexport interface TabPanelAria {\n /** Props for the tab panel element. */\n tabPanelProps: DOMAttributes\n}\n\n\n/**\n * Provides the behavior and accessibility implementation for a tab panel. A tab panel is a container for\n * the contents of a tab, and is shown when the tab is selected.\n */\nexport function useTabPanel<T>(props: AriaTabPanelProps, state: TabListState<T>, ref: RefObject<Element>): TabPanelAria {\n let [tabIndex, setTabIndex] = useState(0);\n\n // The tabpanel should have tabIndex=0 when there are no tabbable elements within it.\n // Otherwise, tabbing from the focused tab should go directly to the first tabbable element\n // within the tabpanel.\n useLayoutEffect(() => {\n if (ref?.current) {\n let update = () => {\n // Detect if there are any tabbable elements and update the tabIndex accordingly.\n let walker = getFocusableTreeWalker(ref.current, {tabbable: true});\n setTabIndex(walker.nextNode() ? undefined : 0);\n };\n\n update();\n\n // Update when new elements are inserted, or the tabIndex/disabled attribute updates.\n let observer = new MutationObserver(update);\n observer.observe(ref.current, {\n subtree: true,\n childList: true,\n attributes: true,\n attributeFilter: ['tabIndex', 'disabled']\n });\n\n return () => {\n observer.disconnect();\n };\n }\n }, [ref]);\n\n const id = generateId(state, state?.selectedKey, 'tabpanel');\n const tabPanelProps = useLabels({...props, id, 'aria-labelledby': generateId(state, state?.selectedKey, 'tab')});\n\n return {\n tabPanelProps: mergeProps(tabPanelProps, {\n tabIndex,\n role: 'tabpanel',\n 'aria-describedby': props['aria-describedby'],\n 'aria-details': props['aria-details']\n })\n };\n}\n","/*\n* Copyright 2020 Adobe. All rights reserved.\n* This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n* you may not use this file except in compliance with the License. You may obtain a copy\n* of the License at http://www.apache.org/licenses/LICENSE-2.0\n*\n* Unless required by applicable law or agreed to in writing, software distributed under\n* the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n* OF ANY KIND, either express or implied. See the License for the specific language\n* governing permissions and limitations under the License.\n*/\n\nimport {AriaTabListProps} from '@react-types/tabs';\nimport {DOMAttributes} from '@react-types/shared';\nimport {mergeProps, useId, useLabels} from '@react-aria/utils';\nimport {RefObject, useMemo} from 'react';\nimport {TabListState} from '@react-stately/tabs';\nimport {tabsIds} from './utils';\nimport {TabsKeyboardDelegate} from './TabsKeyboardDelegate';\nimport {useLocale} from '@react-aria/i18n';\nimport {useSelectableCollection} from '@react-aria/selection';\n\nexport interface TabListAria {\n /** Props for the tablist container. */\n tabListProps: DOMAttributes\n}\n\n\n/**\n * Provides the behavior and accessibility implementation for a tab list.\n * Tabs organize content into multiple sections and allow users to navigate between them.\n */\nexport function useTabList<T>(props: AriaTabListProps<T>, state: TabListState<T>, ref: RefObject<HTMLElement>): TabListAria {\n let {\n orientation = 'horizontal',\n keyboardActivation = 'automatic'\n } = props;\n let {\n collection,\n selectionManager: manager,\n disabledKeys\n } = state;\n let {direction} = useLocale();\n let delegate = useMemo(() => new TabsKeyboardDelegate(\n collection,\n direction,\n orientation,\n disabledKeys), [collection, disabledKeys, orientation, direction]);\n\n let {collectionProps} = useSelectableCollection({\n ref,\n selectionManager: manager,\n keyboardDelegate: delegate,\n selectOnFocus: keyboardActivation === 'automatic',\n disallowEmptySelection: true,\n scrollRef: ref\n });\n\n // Compute base id for all tabs\n let tabsId = useId();\n tabsIds.set(state, tabsId);\n\n let tabListLabelProps = useLabels({...props, id: tabsId});\n\n return {\n tabListProps: {\n ...mergeProps(collectionProps, tabListLabelProps),\n role: 'tablist',\n 'aria-orientation': orientation,\n tabIndex: undefined\n }\n };\n}\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Collection, Direction, KeyboardDelegate, Orientation} from '@react-types/shared';\nimport {Key} from 'react';\n\nexport class TabsKeyboardDelegate<T> implements KeyboardDelegate {\n private collection: Collection<T>;\n private flipDirection: boolean;\n private disabledKeys: Set<Key>;\n private orientation: Orientation;\n\n constructor(collection: Collection<T>, direction: Direction, orientation: Orientation, disabledKeys: Set<Key> = new Set()) {\n this.collection = collection;\n this.flipDirection = direction === 'rtl' && orientation === 'horizontal';\n this.orientation = orientation;\n this.disabledKeys = disabledKeys;\n }\n\n getKeyLeftOf(key: Key) {\n if (this.flipDirection) {\n return this.getNextKey(key);\n } else {\n if (this.orientation === 'horizontal') {\n return this.getPreviousKey(key);\n }\n return null;\n }\n }\n\n getKeyRightOf(key: Key) {\n if (this.flipDirection) {\n return this.getPreviousKey(key);\n } else {\n if (this.orientation === 'horizontal') {\n return this.getNextKey(key);\n }\n return null;\n }\n }\n\n getKeyAbove(key: Key) {\n if (this.orientation === 'vertical') {\n return this.getPreviousKey(key);\n }\n return null;\n }\n\n getKeyBelow(key: Key) {\n if (this.orientation === 'vertical') {\n return this.getNextKey(key);\n }\n return null;\n }\n\n getFirstKey() {\n let key = this.collection.getFirstKey();\n if (this.disabledKeys.has(key)) {\n key = this.getNextKey(key);\n }\n return key;\n }\n\n getLastKey() {\n let key = this.collection.getLastKey();\n if (this.disabledKeys.has(key)) {\n key = this.getPreviousKey(key);\n }\n return key;\n }\n\n getNextKey(key) {\n do {\n key = this.collection.getKeyAfter(key);\n if (key == null) {\n key = this.collection.getFirstKey();\n }\n } while (this.disabledKeys.has(key));\n return key;\n }\n\n getPreviousKey(key) {\n do {\n key = this.collection.getKeyBefore(key);\n if (key == null) {\n key = this.collection.getLastKey();\n }\n } while (this.disabledKeys.has(key));\n return key;\n }\n}\n"],"names":[],"version":3,"file":"module.mjs.map"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-aria/tabs",
|
|
3
|
-
"version": "3.3.4-nightly.
|
|
3
|
+
"version": "3.3.4-nightly.3603+22cb32d32",
|
|
4
4
|
"description": "Spectrum UI components in React",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"main": "dist/main.js",
|
|
@@ -22,16 +22,16 @@
|
|
|
22
22
|
"url": "https://github.com/adobe/react-spectrum"
|
|
23
23
|
},
|
|
24
24
|
"dependencies": {
|
|
25
|
-
"@
|
|
26
|
-
"@react-aria/
|
|
27
|
-
"@react-aria/
|
|
28
|
-
"@react-aria/
|
|
29
|
-
"@react-aria/
|
|
30
|
-
"@react-
|
|
31
|
-
"@react-stately/
|
|
32
|
-
"@react-
|
|
33
|
-
"@react-types/
|
|
34
|
-
"@
|
|
25
|
+
"@react-aria/focus": "3.0.0-nightly.1903+22cb32d32",
|
|
26
|
+
"@react-aria/i18n": "3.0.0-nightly.1903+22cb32d32",
|
|
27
|
+
"@react-aria/interactions": "3.0.0-nightly.1903+22cb32d32",
|
|
28
|
+
"@react-aria/selection": "3.0.0-nightly.1903+22cb32d32",
|
|
29
|
+
"@react-aria/utils": "3.0.0-nightly.1903+22cb32d32",
|
|
30
|
+
"@react-stately/list": "3.6.1-nightly.3603+22cb32d32",
|
|
31
|
+
"@react-stately/tabs": "3.0.0-nightly.1903+22cb32d32",
|
|
32
|
+
"@react-types/shared": "3.0.0-nightly.1903+22cb32d32",
|
|
33
|
+
"@react-types/tabs": "3.1.6-nightly.3603+22cb32d32",
|
|
34
|
+
"@swc/helpers": "^0.4.14"
|
|
35
35
|
},
|
|
36
36
|
"peerDependencies": {
|
|
37
37
|
"react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0"
|
|
@@ -39,5 +39,5 @@
|
|
|
39
39
|
"publishConfig": {
|
|
40
40
|
"access": "public"
|
|
41
41
|
},
|
|
42
|
-
"gitHead": "
|
|
42
|
+
"gitHead": "22cb32d329e66c60f55d4fc4025d1d44bb015d71"
|
|
43
43
|
}
|