@react-spectrum/s2 0.9.0 → 0.9.2

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.
Files changed (272) hide show
  1. package/dist/Accordion.cjs +2 -2
  2. package/dist/Accordion.css +2 -2
  3. package/dist/Accordion.mjs +2 -2
  4. package/dist/ActionBar.cjs +60 -60
  5. package/dist/ActionBar.css +59 -59
  6. package/dist/ActionBar.mjs +60 -60
  7. package/dist/ActionButton.cjs +187 -187
  8. package/dist/ActionButton.cjs.map +1 -1
  9. package/dist/ActionButton.css +134 -134
  10. package/dist/ActionButton.css.map +1 -1
  11. package/dist/ActionButton.mjs +187 -187
  12. package/dist/ActionButton.mjs.map +1 -1
  13. package/dist/ActionButtonGroup.cjs +15 -15
  14. package/dist/ActionButtonGroup.css +9 -9
  15. package/dist/ActionButtonGroup.mjs +15 -15
  16. package/dist/Add.cjs +10 -10
  17. package/dist/Add.css +6 -6
  18. package/dist/Add.mjs +10 -10
  19. package/dist/AlertDialog.cjs +3 -3
  20. package/dist/AlertDialog.css +3 -3
  21. package/dist/AlertDialog.mjs +3 -3
  22. package/dist/Asterisk.cjs +6 -6
  23. package/dist/Asterisk.css +4 -4
  24. package/dist/Asterisk.mjs +6 -6
  25. package/dist/Avatar.cjs +14 -14
  26. package/dist/Avatar.css +14 -14
  27. package/dist/Avatar.mjs +14 -14
  28. package/dist/AvatarGroup.cjs +120 -120
  29. package/dist/AvatarGroup.css +37 -37
  30. package/dist/AvatarGroup.mjs +120 -120
  31. package/dist/Badge.cjs +196 -196
  32. package/dist/Badge.css +129 -129
  33. package/dist/Badge.mjs +196 -196
  34. package/dist/Breadcrumbs.cjs +231 -231
  35. package/dist/Breadcrumbs.css +102 -102
  36. package/dist/Breadcrumbs.mjs +231 -231
  37. package/dist/Button.cjs +328 -328
  38. package/dist/Button.cjs.map +1 -1
  39. package/dist/Button.css +176 -176
  40. package/dist/Button.css.map +1 -1
  41. package/dist/Button.mjs +328 -328
  42. package/dist/Button.mjs.map +1 -1
  43. package/dist/ButtonGroup.cjs +20 -20
  44. package/dist/ButtonGroup.css +15 -15
  45. package/dist/ButtonGroup.mjs +20 -20
  46. package/dist/Card.cjs +294 -294
  47. package/dist/Card.css +205 -205
  48. package/dist/Card.mjs +294 -294
  49. package/dist/CardView.cjs +17 -17
  50. package/dist/CardView.css +17 -17
  51. package/dist/CardView.mjs +17 -17
  52. package/dist/CenterBaseline.cjs +1 -1
  53. package/dist/CenterBaseline.css +2 -2
  54. package/dist/CenterBaseline.mjs +1 -1
  55. package/dist/Checkbox.cjs +160 -160
  56. package/dist/Checkbox.css +94 -94
  57. package/dist/Checkbox.mjs +160 -160
  58. package/dist/CheckboxGroup.cjs +43 -43
  59. package/dist/CheckboxGroup.css +41 -41
  60. package/dist/CheckboxGroup.mjs +43 -43
  61. package/dist/Checkmark.cjs +12 -12
  62. package/dist/Checkmark.css +8 -8
  63. package/dist/Checkmark.mjs +12 -12
  64. package/dist/Chevron.cjs +12 -12
  65. package/dist/Chevron.css +10 -10
  66. package/dist/Chevron.mjs +12 -12
  67. package/dist/ClearButton.cjs +29 -29
  68. package/dist/ClearButton.css +29 -29
  69. package/dist/ClearButton.mjs +29 -29
  70. package/dist/CloseButton.cjs +54 -54
  71. package/dist/CloseButton.css +46 -46
  72. package/dist/CloseButton.mjs +54 -54
  73. package/dist/ColorArea.cjs +16 -16
  74. package/dist/ColorArea.css +16 -16
  75. package/dist/ColorArea.mjs +16 -16
  76. package/dist/ColorField.cjs +31 -31
  77. package/dist/ColorField.css +31 -31
  78. package/dist/ColorField.mjs +31 -31
  79. package/dist/ColorHandle.cjs +27 -27
  80. package/dist/ColorHandle.css +42 -42
  81. package/dist/ColorHandle.mjs +27 -27
  82. package/dist/ColorSlider.cjs +108 -108
  83. package/dist/ColorSlider.css +56 -56
  84. package/dist/ColorSlider.mjs +108 -108
  85. package/dist/ColorSwatch.cjs +29 -29
  86. package/dist/ColorSwatch.css +29 -29
  87. package/dist/ColorSwatch.mjs +29 -29
  88. package/dist/ColorSwatchPicker.cjs +27 -27
  89. package/dist/ColorSwatchPicker.css +46 -46
  90. package/dist/ColorSwatchPicker.mjs +27 -27
  91. package/dist/ColorWheel.cjs +26 -26
  92. package/dist/ColorWheel.css +17 -17
  93. package/dist/ColorWheel.mjs +26 -26
  94. package/dist/ComboBox.cjs +378 -376
  95. package/dist/ComboBox.cjs.map +1 -1
  96. package/dist/ComboBox.css +179 -179
  97. package/dist/ComboBox.css.map +1 -1
  98. package/dist/ComboBox.mjs +378 -376
  99. package/dist/ComboBox.mjs.map +1 -1
  100. package/dist/ContextualHelp.cjs +5 -5
  101. package/dist/ContextualHelp.cjs.map +1 -1
  102. package/dist/ContextualHelp.css +49 -49
  103. package/dist/ContextualHelp.css.map +1 -1
  104. package/dist/ContextualHelp.mjs +5 -5
  105. package/dist/ContextualHelp.mjs.map +1 -1
  106. package/dist/Cross.cjs +14 -14
  107. package/dist/Cross.css +10 -10
  108. package/dist/Cross.mjs +14 -14
  109. package/dist/CustomDialog.cjs +25 -25
  110. package/dist/CustomDialog.css +25 -25
  111. package/dist/CustomDialog.mjs +25 -25
  112. package/dist/Dash.cjs +10 -10
  113. package/dist/Dash.css +6 -6
  114. package/dist/Dash.mjs +10 -10
  115. package/dist/Dialog.cjs +17 -17
  116. package/dist/Dialog.css +70 -70
  117. package/dist/Dialog.mjs +17 -17
  118. package/dist/Disclosure.cjs +129 -129
  119. package/dist/Disclosure.css +104 -104
  120. package/dist/Disclosure.mjs +129 -129
  121. package/dist/Divider.cjs +25 -25
  122. package/dist/Divider.css +25 -25
  123. package/dist/Divider.mjs +25 -25
  124. package/dist/DropZone.cjs +58 -58
  125. package/dist/DropZone.css +54 -54
  126. package/dist/DropZone.mjs +58 -58
  127. package/dist/Field.cjs +340 -340
  128. package/dist/Field.cjs.map +1 -1
  129. package/dist/Field.css +144 -144
  130. package/dist/Field.mjs +340 -340
  131. package/dist/Field.mjs.map +1 -1
  132. package/dist/Form.cjs +9 -9
  133. package/dist/Form.css +9 -9
  134. package/dist/Form.mjs +9 -9
  135. package/dist/FullscreenDialog.cjs +5 -5
  136. package/dist/FullscreenDialog.css +79 -79
  137. package/dist/FullscreenDialog.mjs +5 -5
  138. package/dist/IllustratedMessage.cjs +219 -219
  139. package/dist/IllustratedMessage.css +74 -74
  140. package/dist/IllustratedMessage.mjs +219 -219
  141. package/dist/Image.cjs +14 -14
  142. package/dist/Image.cjs.map +1 -1
  143. package/dist/Image.css +14 -14
  144. package/dist/Image.css.map +1 -1
  145. package/dist/Image.mjs +14 -14
  146. package/dist/Image.mjs.map +1 -1
  147. package/dist/InlineAlert.cjs +108 -108
  148. package/dist/InlineAlert.css +90 -90
  149. package/dist/InlineAlert.mjs +108 -108
  150. package/dist/Link.cjs +49 -49
  151. package/dist/Link.css +41 -41
  152. package/dist/Link.mjs +49 -49
  153. package/dist/LinkOut.cjs +8 -8
  154. package/dist/LinkOut.css +8 -8
  155. package/dist/LinkOut.mjs +8 -8
  156. package/dist/Menu.cjs +422 -422
  157. package/dist/Menu.css +180 -180
  158. package/dist/Menu.mjs +422 -422
  159. package/dist/Meter.cjs +153 -153
  160. package/dist/Meter.css +95 -95
  161. package/dist/Meter.mjs +153 -153
  162. package/dist/Modal.cjs +58 -58
  163. package/dist/Modal.css +50 -50
  164. package/dist/Modal.mjs +58 -58
  165. package/dist/NotificationBadge.cjs +56 -56
  166. package/dist/NotificationBadge.css +51 -51
  167. package/dist/NotificationBadge.mjs +56 -56
  168. package/dist/NumberField.cjs +114 -118
  169. package/dist/NumberField.cjs.map +1 -1
  170. package/dist/NumberField.css +103 -103
  171. package/dist/NumberField.css.map +1 -1
  172. package/dist/NumberField.mjs +115 -119
  173. package/dist/NumberField.mjs.map +1 -1
  174. package/dist/Picker.cjs +273 -271
  175. package/dist/Picker.cjs.map +1 -1
  176. package/dist/Picker.css +169 -169
  177. package/dist/Picker.css.map +1 -1
  178. package/dist/Picker.mjs +273 -271
  179. package/dist/Picker.mjs.map +1 -1
  180. package/dist/Popover.cjs +85 -85
  181. package/dist/Popover.css +66 -66
  182. package/dist/Popover.mjs +85 -85
  183. package/dist/ProgressBar.cjs +163 -163
  184. package/dist/ProgressBar.css +103 -103
  185. package/dist/ProgressBar.mjs +163 -163
  186. package/dist/ProgressCircle.cjs +17 -17
  187. package/dist/ProgressCircle.css +17 -17
  188. package/dist/ProgressCircle.mjs +17 -17
  189. package/dist/Provider.cjs +10 -10
  190. package/dist/Provider.css +9 -9
  191. package/dist/Provider.mjs +10 -10
  192. package/dist/Radio.cjs +144 -144
  193. package/dist/Radio.css +81 -81
  194. package/dist/Radio.mjs +144 -144
  195. package/dist/RadioGroup.cjs +41 -41
  196. package/dist/RadioGroup.css +41 -41
  197. package/dist/RadioGroup.mjs +41 -41
  198. package/dist/SearchField.cjs +41 -41
  199. package/dist/SearchField.css +49 -49
  200. package/dist/SearchField.mjs +41 -41
  201. package/dist/SegmentedControl.cjs +171 -171
  202. package/dist/SegmentedControl.css +120 -120
  203. package/dist/SegmentedControl.mjs +171 -171
  204. package/dist/Slider.cjs +288 -288
  205. package/dist/Slider.css +152 -152
  206. package/dist/Slider.mjs +288 -288
  207. package/dist/StatusLight.cjs +115 -115
  208. package/dist/StatusLight.css +63 -63
  209. package/dist/StatusLight.mjs +115 -115
  210. package/dist/Switch.cjs +152 -152
  211. package/dist/Switch.css +76 -76
  212. package/dist/Switch.mjs +152 -152
  213. package/dist/TableView.cjs +310 -310
  214. package/dist/TableView.css +172 -172
  215. package/dist/TableView.mjs +310 -310
  216. package/dist/Tabs.cjs +113 -110
  217. package/dist/Tabs.cjs.map +1 -1
  218. package/dist/Tabs.css +92 -92
  219. package/dist/Tabs.css.map +1 -1
  220. package/dist/Tabs.mjs +113 -110
  221. package/dist/Tabs.mjs.map +1 -1
  222. package/dist/TabsPicker.cjs +123 -123
  223. package/dist/TabsPicker.css +112 -112
  224. package/dist/TabsPicker.mjs +123 -123
  225. package/dist/TagGroup.cjs +202 -202
  226. package/dist/TagGroup.cjs.map +1 -1
  227. package/dist/TagGroup.css +147 -147
  228. package/dist/TagGroup.css.map +1 -1
  229. package/dist/TagGroup.mjs +202 -202
  230. package/dist/TagGroup.mjs.map +1 -1
  231. package/dist/TextField.cjs +57 -57
  232. package/dist/TextField.css +57 -57
  233. package/dist/TextField.mjs +57 -57
  234. package/dist/Toast.cjs +118 -118
  235. package/dist/Toast.css +105 -105
  236. package/dist/Toast.mjs +118 -118
  237. package/dist/ToggleButton.cjs +3 -3
  238. package/dist/ToggleButton.css +12 -12
  239. package/dist/ToggleButton.mjs +3 -3
  240. package/dist/Tooltip.cjs +81 -81
  241. package/dist/Tooltip.css +68 -68
  242. package/dist/Tooltip.mjs +81 -81
  243. package/dist/TreeView.cjs +143 -149
  244. package/dist/TreeView.cjs.map +1 -1
  245. package/dist/TreeView.css +143 -143
  246. package/dist/TreeView.css.map +1 -1
  247. package/dist/TreeView.mjs +143 -149
  248. package/dist/TreeView.mjs.map +1 -1
  249. package/dist/types.d.ts +2 -2
  250. package/dist/types.d.ts.map +1 -1
  251. package/icons/Icon.cjs +10 -10
  252. package/icons/Icon.css +9 -9
  253. package/icons/Icon.mjs +10 -10
  254. package/icons/Skeleton.cjs +4 -3
  255. package/icons/Skeleton.cjs.map +1 -1
  256. package/icons/Skeleton.css +6 -6
  257. package/icons/Skeleton.css.map +1 -1
  258. package/icons/Skeleton.mjs +4 -3
  259. package/icons/Skeleton.mjs.map +1 -1
  260. package/package.json +45 -26
  261. package/src/ActionButton.tsx +1 -1
  262. package/src/Button.tsx +3 -3
  263. package/src/ComboBox.tsx +3 -2
  264. package/src/ContextualHelp.tsx +2 -2
  265. package/src/Image.tsx +1 -1
  266. package/src/NumberField.tsx +0 -2
  267. package/src/Picker.tsx +3 -2
  268. package/src/Skeleton.tsx +2 -1
  269. package/src/Tabs.tsx +7 -5
  270. package/src/TagGroup.tsx +1 -1
  271. package/src/TreeView.tsx +1 -6
  272. package/style/__tests__/style-macro.test.js +56 -56
package/dist/Tabs.mjs CHANGED
@@ -55,26 +55,26 @@ const $79e2b4a1b34d1592$var$tabs = function anonymous(props, overrides) {
55
55
  if (p[1] === "_v") flexShrink = true;
56
56
  rules += p[0];
57
57
  }
58
- if (!position) rules += ' _Pc9';
59
- rules += ' sd9';
60
- if (!flexShrink) rules += ' _va9';
61
- rules += ' ug9';
62
- rules += ' uch9';
63
- rules += ' udi9';
64
- rules += ' uea9';
65
- rules += ' ugb9';
66
- rules += ' uhd9';
67
- rules += ' uje9';
68
- rules += ' uic9';
69
- rules += ' vd9';
70
- rules += ' vsf9';
71
- rules += ' wb9';
72
- rules += ' xb9';
73
- rules += ' _xa9';
74
- rules += ' _Fa9';
75
- rules += ' _Ffb9';
76
- rules += ' pt9';
77
- if (props.orientation === "horizontal") rules += ' _ta9';
58
+ if (!position) rules += ' _Pc91';
59
+ rules += ' sd91';
60
+ if (!flexShrink) rules += ' _va91';
61
+ rules += ' ug91';
62
+ rules += ' uch91';
63
+ rules += ' udi91';
64
+ rules += ' uea91';
65
+ rules += ' ugb91';
66
+ rules += ' uhd91';
67
+ rules += ' uje91';
68
+ rules += ' uic91';
69
+ rules += ' vd91';
70
+ rules += ' vsf91';
71
+ rules += ' wb91';
72
+ rules += ' xb91';
73
+ rules += ' _xa91';
74
+ rules += ' _Fa91';
75
+ rules += ' _Ffb91';
76
+ rules += ' pt91';
77
+ if (props.orientation === "horizontal") rules += ' _ta91';
78
78
  return rules;
79
79
  };
80
80
  const $79e2b4a1b34d1592$export$b2539bed5023c21c = /*#__PURE__*/ (0, $8bRfI$forwardRef)(function Tabs(props, ref) {
@@ -114,26 +114,26 @@ const $79e2b4a1b34d1592$export$b2539bed5023c21c = /*#__PURE__*/ (0, $8bRfI$forwa
114
114
  });
115
115
  const $79e2b4a1b34d1592$var$tablist = function anonymous(props) {
116
116
  let rules = " ";
117
- rules += ' sd9';
117
+ rules += ' sd91';
118
118
  if (props.orientation === "horizontal") {
119
119
  if (props.labelBehavior === "hide") {
120
- if (props.density === "regular") rules += ' Uj9';
121
- else if (props.density === "compact") rules += ' Ul9';
122
- } else if (props.density === "regular") rules += ' Up9';
123
- else if (props.density === "compact") rules += ' Uj9';
120
+ if (props.density === "regular") rules += ' Uj91';
121
+ else if (props.density === "compact") rules += ' Ul91';
122
+ } else if (props.density === "regular") rules += ' Up91';
123
+ else if (props.density === "compact") rules += ' Uj91';
124
124
  }
125
125
  if (props.orientation === "horizontal") {
126
126
  if (props.labelBehavior === "hide") {
127
- if (props.density === "regular") rules += ' qj9';
128
- else if (props.density === "compact") rules += ' ql9';
129
- } else if (props.density === "regular") rules += ' qp9';
130
- else if (props.density === "compact") rules += ' qj9';
127
+ if (props.density === "regular") rules += ' qj91';
128
+ else if (props.density === "compact") rules += ' ql91';
129
+ } else if (props.density === "regular") rules += ' qp91';
130
+ else if (props.density === "compact") rules += ' qj91';
131
131
  }
132
- if (props.orientation === "vertical") rules += ' _ta9';
133
- if (props.orientation === "vertical") rules += ' Hz9';
134
- if (props.orientation === "vertical") rules += ' Ix9';
135
- rules += ' _va9';
136
- rules += ' _sa9';
132
+ if (props.orientation === "vertical") rules += ' _ta91';
133
+ if (props.orientation === "vertical") rules += ' Hz91';
134
+ if (props.orientation === "vertical") rules += ' Ix91';
135
+ rules += ' _va91';
136
+ rules += ' _sa91';
137
137
  return rules;
138
138
  };
139
139
  function $79e2b4a1b34d1592$export$e51a686c67fdaa2d(props) {
@@ -167,7 +167,7 @@ function $79e2b4a1b34d1592$var$TabListInner(props1) {
167
167
  if (p[1] === "_P") position = true;
168
168
  rules += p[0];
169
169
  }
170
- if (!position) rules += ' _Pc9';
170
+ if (!position) rules += ' _Pc91';
171
171
  return rules;
172
172
  }(null, props1.styles),
173
173
  children: [
@@ -176,6 +176,7 @@ function $79e2b4a1b34d1592$var$TabListInner(props1) {
176
176
  isDisabled: isDisabled,
177
177
  selectedTab: selectedTab,
178
178
  orientation: orientation,
179
+ tabList: props1,
179
180
  density: density
180
181
  }),
181
182
  /*#__PURE__*/ (0, $8bRfI$jsx)((0, $8bRfI$TabList), {
@@ -194,6 +195,7 @@ function $79e2b4a1b34d1592$var$TabListInner(props1) {
194
195
  isDisabled: isDisabled,
195
196
  selectedTab: selectedTab,
196
197
  orientation: orientation,
198
+ tabList: props1,
197
199
  density: density
198
200
  })
199
201
  ]
@@ -201,25 +203,25 @@ function $79e2b4a1b34d1592$var$TabListInner(props1) {
201
203
  }
202
204
  const $79e2b4a1b34d1592$var$selectedIndicator = function anonymous(props) {
203
205
  let rules = " ";
204
- rules += ' _Pa9';
205
- if (props.isDisabled) rules += ' gH9';
206
- else rules += ' g09';
207
- if (props.isDisabled) rules += ' gld9';
208
- else rules += ' gle9';
209
- if (props.orientation === "horizontal") rules += ' FLvNfn9';
210
- if (props.orientation === "vertical") rules += ' ZLvNfn9';
211
- if (props.orientation === "horizontal") rules += ' _lr9';
212
- rules += ' _je9';
213
- rules += ' og9';
214
- rules += ' ng9';
215
- rules += ' kg9';
216
- rules += ' jg9';
217
- rules += ' Xa9';
218
- rules += ' _2b9';
206
+ rules += ' _Pa91';
207
+ if (props.isDisabled) rules += ' gH91';
208
+ else rules += ' g091';
209
+ if (props.isDisabled) rules += ' gld91';
210
+ else rules += ' gle91';
211
+ if (props.orientation === "horizontal") rules += ' FLvNfn91';
212
+ if (props.orientation === "vertical") rules += ' ZLvNfn91';
213
+ if (props.orientation === "horizontal") rules += ' _lr91';
214
+ rules += ' _je91';
215
+ rules += ' og91';
216
+ rules += ' ng91';
217
+ rules += ' kg91';
218
+ rules += ' jg91';
219
+ rules += ' Xa91';
220
+ rules += ' _2b91';
219
221
  return rules;
220
222
  };
221
223
  function $79e2b4a1b34d1592$var$TabLine(props) {
222
- let { disabledKeys: disabledKeys, isDisabled: isTabsDisabled, selectedTab: selectedTab, orientation: orientation, density: density } = props;
224
+ let { disabledKeys: disabledKeys, isDisabled: isTabsDisabled, selectedTab: selectedTab, orientation: orientation, tabList: tabList, density: density } = props;
223
225
  let { direction: direction } = (0, $8bRfI$useLocale)();
224
226
  let state = (0, $8bRfI$useContext)((0, $8bRfI$TabListStateContext));
225
227
  // We want to add disabled styling to the selection indicator only if all the Tabs are disabled
@@ -265,7 +267,8 @@ function $79e2b4a1b34d1592$var$TabLine(props) {
265
267
  state?.selectedItem?.key,
266
268
  density,
267
269
  direction,
268
- orientation
270
+ orientation,
271
+ tabList
269
272
  ]);
270
273
  return /*#__PURE__*/ (0, $8bRfI$jsx)("div", {
271
274
  style: {
@@ -287,49 +290,49 @@ const $79e2b4a1b34d1592$var$tab = function anonymous(props, overrides) {
287
290
  if (p[1] === "_v") flexShrink = true;
288
291
  rules += p[0];
289
292
  }
290
- if (props.isFocusVisible) rules += ' _Lf9';
291
- else rules += ' _Le9';
292
- rules += ' Oh9';
293
- rules += ' _Mc9';
294
- rules += ' _Kd9';
295
- rules += ' sd9';
296
- if (props.isDisabled) rules += ' pp9';
293
+ if (props.isFocusVisible) rules += ' _Lf91';
294
+ else rules += ' _Le91';
295
+ rules += ' Oh91';
296
+ rules += ' _Mc91';
297
+ rules += ' _Kd91';
298
+ rules += ' sd91';
299
+ if (props.isDisabled) rules += ' pp91';
297
300
  else if (props.isSelected) {
298
- if (props.isPressed) rules += ' po9';
299
- else if (props.isFocusVisible) rules += ' po9';
300
- else if (props.isHovered) rules += ' po9';
301
- else rules += ' pt9';
301
+ if (props.isPressed) rules += ' po91';
302
+ else if (props.isFocusVisible) rules += ' po91';
303
+ else if (props.isHovered) rules += ' po91';
304
+ else rules += ' pt91';
302
305
  } else {
303
- if (props.isPressed) rules += ' pt9';
304
- else if (props.isFocusVisible) rules += ' pt9';
305
- else if (props.isHovered) rules += ' pt9';
306
- else rules += ' pv9';
306
+ if (props.isPressed) rules += ' pt91';
307
+ else if (props.isFocusVisible) rules += ' pt91';
308
+ else if (props.isHovered) rules += ' pt91';
309
+ else rules += ' pv91';
307
310
  }
308
- if (props.isDisabled) rules += ' plc9';
309
- else if (props.isSelected) rules += ' pld9';
310
- rules += ' oa9';
311
- rules += ' na9';
312
- rules += ' ka9';
313
- rules += ' ja9';
314
- rules += ' Uc9';
315
- rules += ' Usd9';
316
- rules += ' qc9';
317
- rules += ' qsd9';
318
- if (props.density === "regular") rules += ' Fz9';
319
- else if (props.density === "compact") rules += ' Fx9';
320
- rules += ' eb9';
321
- if (!position) rules += ' _Pc9';
322
- rules += ' ri9';
323
- if (!flexShrink) rules += ' _va9';
324
- rules += ' Yd9';
325
- rules += ' Xb9';
326
- rules += ' _2b9';
327
- if (props.labelBehavior === "hide") rules += ' SssxDec9';
328
- if (props.labelBehavior === "hide") rules += ' RssxDec9';
329
- rules += ' __ca9';
311
+ if (props.isDisabled) rules += ' plc91';
312
+ else if (props.isSelected) rules += ' pld91';
313
+ rules += ' oa91';
314
+ rules += ' na91';
315
+ rules += ' ka91';
316
+ rules += ' ja91';
317
+ rules += ' Uc91';
318
+ rules += ' Usd91';
319
+ rules += ' qc91';
320
+ rules += ' qsd91';
321
+ if (props.density === "regular") rules += ' Fz91';
322
+ else if (props.density === "compact") rules += ' Fx91';
323
+ rules += ' eb91';
324
+ if (!position) rules += ' _Pc91';
325
+ rules += ' ri91';
326
+ if (!flexShrink) rules += ' _va91';
327
+ rules += ' Yd91';
328
+ rules += ' Xb91';
329
+ rules += ' _2b91';
330
+ if (props.labelBehavior === "hide") rules += ' SssxDec91';
331
+ if (props.labelBehavior === "hide") rules += ' RssxDec91';
332
+ rules += ' __ca91';
330
333
  return rules;
331
334
  };
332
- const $79e2b4a1b34d1592$var$icon = " sb9 _va9 -_8sjo0b-t5ZbAob9";
335
+ const $79e2b4a1b34d1592$var$icon = " sb91 _va91 -_8sjo0b-t5ZbAob91";
333
336
  function $79e2b4a1b34d1592$export$3e41faf802a29e71(props1) {
334
337
  let { density: density, labelBehavior: labelBehavior } = (0, $8bRfI$useContext)($79e2b4a1b34d1592$var$InternalTabsContext) ?? {};
335
338
  let contentId = (0, $8bRfI$useId)();
@@ -356,8 +359,8 @@ function $79e2b4a1b34d1592$export$3e41faf802a29e71(props1) {
356
359
  id: contentId,
357
360
  styles: function anonymous(props) {
358
361
  let rules = " ";
359
- rules += ' _Jb9';
360
- if (props.labelBehavior === "hide") rules += ' sk9';
362
+ rules += ' _Jb91';
363
+ if (props.labelBehavior === "hide") rules += ' sk91';
361
364
  return rules;
362
365
  }({
363
366
  labelBehavior: labelBehavior
@@ -369,7 +372,7 @@ function $79e2b4a1b34d1592$export$3e41faf802a29e71(props1) {
369
372
  {
370
373
  render: (0, $1f4b04be3f24aae3$export$9d7e2342a7e53afa)({
371
374
  slot: 'icon',
372
- styles: " _Ja9"
375
+ styles: " _Ja91"
373
376
  }),
374
377
  styles: $79e2b4a1b34d1592$var$icon
375
378
  }
@@ -398,17 +401,17 @@ const $79e2b4a1b34d1592$var$tabPanel = function anonymous(props, overrides) {
398
401
  if (p[1] === "N") minWidth = true;
399
402
  rules += p[0];
400
403
  }
401
- if (props.isFocusVisible) rules += ' _Lf9';
402
- else rules += ' _Le9';
403
- rules += ' Oh9';
404
- rules += ' _Mc9';
405
- rules += ' _Kd9';
406
- if (!marginTop) rules += ' Js9';
407
- rules += ' pt9';
408
- if (!flexGrow) rules += ' _ub9';
409
- if (!flexBasis) rules += ' _sa9';
410
- if (!minHeight) rules += ' Ma9';
411
- if (!minWidth) rules += ' Na9';
404
+ if (props.isFocusVisible) rules += ' _Lf91';
405
+ else rules += ' _Le91';
406
+ rules += ' Oh91';
407
+ rules += ' _Mc91';
408
+ rules += ' _Kd91';
409
+ if (!marginTop) rules += ' Js91';
410
+ rules += ' pt91';
411
+ if (!flexGrow) rules += ' _ub91';
412
+ if (!flexBasis) rules += ' _sa91';
413
+ if (!minHeight) rules += ' Ma91';
414
+ if (!minWidth) rules += ' Na91';
412
415
  return rules;
413
416
  };
414
417
  function $79e2b4a1b34d1592$export$3d96ec278d3efce4(props) {
@@ -459,7 +462,7 @@ let $79e2b4a1b34d1592$var$HiddenTabs = function(props) {
459
462
  // @ts-ignore
460
463
  inert: (0, $8bRfI$inertValue)(true),
461
464
  ref: listRef,
462
- className: " s40ub4c9 _t40ub4c9 U40ub4c9 q40ub4c9 _w40ub4c9 _Pa9 Wr9 _lr9 _Ar9 _zr9 _6b9 _Nc9 Pc9 _Ia9",
465
+ className: " s40ub4c91 _t40ub4c91 U40ub4c91 q40ub4c91 _w40ub4c91 _Pa91 Wr91 _lr91 _Ar91 _zr91 _6b91 _Nc91 Pc91 _Ia91",
463
466
  children: items.map((item)=>{
464
467
  // pull off individual props as an allow list, don't want refs or other props getting through
465
468
  return /*#__PURE__*/ (0, $8bRfI$jsx)("div", {
@@ -500,11 +503,11 @@ let $79e2b4a1b34d1592$var$TabsMenu = (props1)=>{
500
503
  return /*#__PURE__*/ (0, $8bRfI$jsx)("div", {
501
504
  className: function anonymous(props) {
502
505
  let rules = " ";
503
- rules += ' sd9';
504
- rules += ' _va9';
505
- rules += ' eb9';
506
- if (props.density === "regular") rules += ' Fz9';
507
- else if (props.density === "compact") rules += ' Fx9';
506
+ rules += ' sd91';
507
+ rules += ' _va91';
508
+ rules += ' eb91';
509
+ if (props.density === "regular") rules += ' Fz91';
510
+ else if (props.density === "compact") rules += ' Fx91';
508
511
  return rules;
509
512
  }({
510
513
  density: density
package/dist/Tabs.mjs.map CHANGED
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/s2/src/Tabs.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 {\n TabListProps as AriaTabListProps,\n TabPanel as AriaTabPanel,\n TabPanelProps as AriaTabPanelProps,\n TabProps as AriaTabProps,\n TabsProps as AriaTabsProps,\n ContextValue,\n Group,\n Provider,\n Tab as RACTab,\n TabList as RACTabList,\n Tabs as RACTabs,\n TabListStateContext,\n TabRenderProps\n} from 'react-aria-components';\nimport {baseColor, focusRing, size, style} from '../style' with {type: 'macro'};\nimport {centerBaseline} from './CenterBaseline';\nimport {Collection, DOMRef, DOMRefValue, Key, Node, Orientation, RefObject} from '@react-types/shared';\nimport {CollectionBuilder} from '@react-aria/collections';\nimport {createContext, forwardRef, ReactNode, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';\nimport {getAllowedOverrides, StyleProps, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {inertValue, useEffectEvent, useId, useLabels, useLayoutEffect, useResizeObserver} from '@react-aria/utils';\nimport {Picker, PickerItem} from './TabsPicker';\nimport {Text, TextContext} from './Content';\nimport {useControlledState} from '@react-stately/utils';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useHasTabbableChild} from '@react-aria/focus';\nimport {useLocale} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface TabsProps extends Omit<AriaTabsProps, 'className' | 'style' | 'children'>, UnsafeStyles {\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithHeight,\n /** The content to display in the tabs. */\n children: ReactNode,\n /**\n * The amount of space between the tabs.\n * @default 'regular'\n */\n density?: 'compact' | 'regular',\n /**\n * Defines if the text within the tabs should be hidden and only the icon should be shown.\n * The text is always visible when the item is collapsed into a picker.\n * @default 'show'\n */\n labelBehavior?: 'show' | 'hide'\n}\n\nexport interface TabProps extends Omit<AriaTabProps, 'children' | 'style' | 'className'>, StyleProps {\n /** The content to display in the tab. */\n children: ReactNode\n}\n\nexport interface TabListProps<T> extends Omit<AriaTabListProps<T>, 'style' | 'className' | 'aria-label' | 'aria-labelledby'>, StyleProps {\n /** The content to display in the tablist. */\n children: ReactNode | ((item: T) => ReactNode)\n}\n\nexport interface TabPanelProps extends Omit<AriaTabPanelProps, 'children' | 'style' | 'className'>, UnsafeStyles {\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithHeight,\n /** The content to display in the tab panels. */\n children: ReactNode\n}\n\nexport const TabsContext = createContext<ContextValue<Partial<TabsProps>, DOMRefValue<HTMLDivElement>>>(null);\nconst InternalTabsContext = createContext<Partial<TabsProps>>({});\nconst CollapseContext = createContext({\n showTabs: true,\n menuId: '',\n valueId: ''\n});\n\nconst tabs = style({\n position: 'relative',\n display: 'flex',\n flexShrink: 0,\n font: 'ui',\n flexDirection: {\n orientation: {\n horizontal: 'column'\n }\n }\n}, getAllowedOverrides({height: true}));\n\n/**\n * Tabs organize content into multiple sections and allow users to navigate between them. The content under the set of tabs should be related and form a coherent unit.\n */\nexport const Tabs = forwardRef(function Tabs(props: TabsProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, TabsContext);\n let {\n density = 'regular',\n isDisabled,\n disabledKeys,\n orientation = 'horizontal',\n labelBehavior = 'show'\n } = props;\n let domRef = useDOMRef(ref);\n let [value, setValue] = useControlledState(props.selectedKey, props.defaultSelectedKey ?? null!, props.onSelectionChange);\n\n if (!props['aria-label'] && !props['aria-labelledby']) {\n throw new Error('An aria-label or aria-labelledby prop is required on Tabs for accessibility.');\n }\n\n return (\n <Provider\n values={[\n [InternalTabsContext, {\n density,\n isDisabled,\n orientation,\n disabledKeys,\n selectedKey: value,\n onSelectionChange: setValue,\n labelBehavior,\n 'aria-label': props['aria-label'],\n 'aria-labelledby': props['aria-labelledby']\n }]\n ]}>\n <CollectionBuilder content={props.children}>\n {collection => (\n <CollapsingTabs\n {...props}\n selectedKey={value}\n onSelectionChange={setValue}\n collection={collection}\n containerRef={domRef} />\n )}\n </CollectionBuilder>\n </Provider>\n );\n});\n\nconst tablist = style({\n display: 'flex',\n gap: {\n orientation: {\n horizontal: {\n density: {\n compact: 24,\n regular: 32\n },\n labelBehavior: {\n hide: {\n density: {\n compact: 16,\n regular: 24\n }\n }\n }\n }\n }\n },\n flexDirection: {\n orientation: {\n vertical: 'column'\n }\n },\n marginEnd: {\n orientation: {\n vertical: 20\n }\n },\n marginStart: {\n orientation: {\n vertical: 12\n }\n },\n flexShrink: 0,\n flexBasis: '0%'\n});\n\nexport function TabList<T extends object>(props: TabListProps<T>): ReactNode | null {\n let {showTabs} = useContext(CollapseContext) ?? {};\n\n if (showTabs) {\n return <TabListInner {...props} />;\n }\n return null;\n}\n\nfunction TabListInner<T extends object>(props: TabListProps<T>) {\n let {density, isDisabled, disabledKeys, orientation, labelBehavior, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy} = useContext(InternalTabsContext) ?? {};\n let state = useContext(TabListStateContext);\n let [selectedTab, setSelectedTab] = useState<HTMLElement | undefined>(undefined);\n let tablistRef = useRef<HTMLDivElement>(null);\n\n useLayoutEffect(() => {\n if (tablistRef?.current) {\n let tab: HTMLElement | null = tablistRef.current.querySelector('[role=tab][data-selected=true]');\n\n if (tab != null) {\n setSelectedTab(tab);\n }\n }\n }, [tablistRef, state?.selectedItem?.key]);\n\n return (\n <div\n style={props.UNSAFE_style}\n className={(props.UNSAFE_className || '') + style({position: 'relative'}, getAllowedOverrides())(null, props.styles)}>\n {orientation === 'vertical' &&\n <TabLine disabledKeys={disabledKeys} isDisabled={isDisabled} selectedTab={selectedTab} orientation={orientation} density={density} />}\n <RACTabList\n {...props}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n ref={tablistRef}\n className={renderProps => tablist({...renderProps, labelBehavior, density})} />\n {orientation === 'horizontal' &&\n <TabLine disabledKeys={disabledKeys} isDisabled={isDisabled} selectedTab={selectedTab} orientation={orientation} density={density} />}\n </div>\n );\n}\n\ninterface TabLineProps {\n disabledKeys: Iterable<Key> | undefined,\n isDisabled: boolean | undefined,\n selectedTab: HTMLElement | undefined,\n orientation?: Orientation,\n density?: 'compact' | 'regular'\n}\n\nconst selectedIndicator = style<{isDisabled: boolean, orientation?: Orientation}>({\n position: 'absolute',\n backgroundColor: {\n default: 'neutral',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n height: {\n orientation: {\n horizontal: '[2px]'\n }\n },\n width: {\n orientation: {\n vertical: '[2px]'\n }\n },\n bottom: {\n orientation: {\n horizontal: 0\n }\n },\n borderStyle: 'none',\n borderRadius: 'full',\n transitionDuration: 130,\n transitionTimingFunction: 'in-out'\n});\n\nfunction TabLine(props: TabLineProps) {\n let {\n disabledKeys,\n isDisabled: isTabsDisabled,\n selectedTab,\n orientation,\n density\n } = props;\n let {direction} = useLocale();\n let state = useContext(TabListStateContext);\n\n // We want to add disabled styling to the selection indicator only if all the Tabs are disabled\n let [isDisabled, setIsDisabled] = useState<boolean>(false);\n useEffect(() => {\n let isDisabled = isTabsDisabled || isAllTabsDisabled(state?.collection, disabledKeys ? new Set(disabledKeys) : new Set(null));\n setIsDisabled(isDisabled);\n }, [state?.collection, disabledKeys, isTabsDisabled, setIsDisabled]);\n\n let [style, setStyle] = useState<{transform: string | undefined, width: string | undefined, height: string | undefined}>({\n transform: undefined,\n width: undefined,\n height: undefined\n });\n\n let onResize = useCallback(() => {\n if (selectedTab) {\n let styleObj: { transform: string | undefined, width: string | undefined, height: string | undefined } = {\n transform: undefined,\n width: undefined,\n height: undefined\n };\n\n // In RTL, calculate the transform from the right edge of the tablist so that resizing the window doesn't break the Tabline position due to offsetLeft changes\n let offset = direction === 'rtl' ? -1 * ((selectedTab.offsetParent as HTMLElement)?.offsetWidth - selectedTab.offsetWidth - selectedTab.offsetLeft) : selectedTab.offsetLeft;\n styleObj.transform = orientation === 'vertical'\n ? `translateY(${selectedTab.offsetTop}px)`\n : `translateX(${offset}px)`;\n\n if (orientation === 'horizontal') {\n styleObj.width = `${selectedTab.offsetWidth}px`;\n } else {\n styleObj.height = `${selectedTab.offsetHeight}px`;\n }\n setStyle(styleObj);\n }\n }, [direction, setStyle, selectedTab, orientation]);\n\n useLayoutEffect(() => {\n onResize();\n }, [onResize, state?.selectedItem?.key, density, direction, orientation]);\n\n return (\n <div style={{...style}} className={selectedIndicator({isDisabled, orientation})} />\n );\n}\n\nconst tab = style<TabRenderProps & {density?: 'compact' | 'regular', labelBehavior?: 'show' | 'hide'}>({\n ...focusRing(),\n display: 'flex',\n color: {\n default: baseColor('neutral-subdued'),\n isSelected: baseColor('neutral'),\n isDisabled: 'disabled',\n forcedColors: {\n isSelected: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n borderRadius: 'sm',\n gap: 'text-to-visual',\n height: {\n density: {\n compact: 32,\n regular: 48\n }\n },\n alignItems: 'center',\n position: 'relative',\n cursor: 'default',\n flexShrink: 0,\n transition: 'default',\n paddingX: {\n labelBehavior: {\n hide: size(6)\n }\n },\n disableTapHighlight: true\n}, getAllowedOverrides());\n\nconst icon = style({\n display: 'block',\n flexShrink: 0,\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n});\n\nexport function Tab(props: TabProps): ReactNode {\n let {density, labelBehavior} = useContext(InternalTabsContext) ?? {};\n\n let contentId = useId();\n let ariaLabelledBy = props['aria-labelledby'] || '';\n return (\n <RACTab\n {...props}\n // @ts-ignore\n originalProps={props}\n aria-labelledby={`${labelBehavior === 'hide' ? contentId : ''} ${ariaLabelledBy}`}\n style={props.UNSAFE_style}\n className={renderProps => (props.UNSAFE_className || '') + tab({...renderProps, density, labelBehavior}, props.styles)}>\n {({\n // @ts-ignore\n isMenu\n }) => {\n if (isMenu) {\n return props.children;\n } else {\n return (\n <Provider\n values={[\n [TextContext, {\n id: contentId,\n styles:\n style({\n order: 1,\n display: {\n labelBehavior: {\n hide: 'none'\n }\n }\n })({labelBehavior})\n }],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n styles: icon\n }]\n ]}>\n {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n </Provider>\n );\n }\n }}\n </RACTab>\n );\n}\n\nconst tabPanel = style({\n ...focusRing(),\n marginTop: 4,\n color: 'gray-800',\n flexGrow: 1,\n flexBasis: '0%',\n minHeight: 0,\n minWidth: 0\n}, getAllowedOverrides({height: true}));\n\nexport function TabPanel(props: TabPanelProps): ReactNode | null {\n let {showTabs} = useContext(CollapseContext);\n let {selectedKey} = useContext(InternalTabsContext);\n if (showTabs) {\n return (\n <AriaTabPanel\n {...props}\n style={props.UNSAFE_style}\n className={renderProps => (props.UNSAFE_className ?? '') + tabPanel(renderProps, props.styles)} />\n );\n }\n\n if (props.id !== selectedKey) {\n return null;\n }\n\n return <CollapsedTabPanel {...props} />;\n}\n\nfunction CollapsedTabPanel(props: TabPanelProps) {\n let {UNSAFE_style, UNSAFE_className = '', ...otherProps} = props;\n let {menuId, valueId} = useContext(CollapseContext);\n let ref = useRef(null);\n let tabIndex = useHasTabbableChild(ref) ? undefined : 0;\n\n return (\n <Group\n {...otherProps}\n ref={ref}\n aria-labelledby={menuId + ' ' + valueId}\n tabIndex={tabIndex}\n style={UNSAFE_style}\n className={renderProps => UNSAFE_className + tabPanel(renderProps, props.styles)} />\n );\n}\n\nfunction isAllTabsDisabled<T>(collection: Collection<Node<T>> | undefined, disabledKeys: Set<Key>) {\n let testKey: Key | null = null;\n if (collection && collection.size > 0) {\n testKey = collection.getFirstKey();\n\n let index = 0;\n while (testKey && index < collection.size) {\n // We have to check if the item in the collection has a key in disabledKeys or has the isDisabled prop set directly on it\n if (!disabledKeys.has(testKey) && !collection.getItem(testKey)?.props?.isDisabled) {\n return false;\n }\n\n testKey = collection.getKeyAfter(testKey);\n index++;\n }\n return true;\n }\n return false;\n}\n\nlet HiddenTabs = function (props: {\n listRef: RefObject<HTMLDivElement | null>,\n items: Array<Node<any>>,\n size?: string,\n density?: 'compact' | 'regular'\n}) {\n let {listRef, items, size, density} = props;\n\n return (\n <div\n // @ts-ignore\n inert={inertValue(true)}\n ref={listRef}\n className={style({\n display: 'inherit',\n flexDirection: 'inherit',\n gap: 'inherit',\n flexWrap: 'inherit',\n position: 'absolute',\n inset: 0,\n visibility: 'hidden',\n overflow: 'hidden',\n opacity: 0\n })}>\n {items.map((item) => {\n // pull off individual props as an allow list, don't want refs or other props getting through\n return (\n <div\n data-hidden-tab\n style={item.props.UNSAFE_style}\n key={item.key}\n className={item.props.className({size, density})}>\n {item.props.children({size, density})}\n </div>\n );\n })}\n </div>\n );\n};\n\nlet TabsMenu = (props: {valueId: string, items: Array<Node<any>>, onSelectionChange: TabsProps['onSelectionChange']} & Omit<TabsProps, 'children'>) => {\n let {id, items, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, valueId} = props;\n let {density, onSelectionChange: _onSelectionChange, selectedKey, isDisabled, disabledKeys, labelBehavior} = useContext(InternalTabsContext);\n let onSelectionChange = useCallback((key: Key | null) => {\n if (key != null) {\n _onSelectionChange?.(key);\n }\n }, [_onSelectionChange]);\n let state = useContext(TabListStateContext);\n let allKeysDisabled = useMemo(() => {\n return isAllTabsDisabled(state?.collection, disabledKeys ? new Set(disabledKeys) : new Set());\n }, [state?.collection, disabledKeys]);\n let labelProps = useLabels({\n id,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy\n });\n\n return (\n <div\n className={style({\n display: 'flex',\n flexShrink: 0,\n alignItems: 'center',\n height: {\n density: {\n compact: 32,\n regular: 48\n }\n }})({density})}>\n <Picker\n id={id}\n valueId={valueId}\n {...labelProps}\n aria-describedby={props['aria-describedby']}\n aria-details={props['aria-details']}\n isDisabled={isDisabled || allKeysDisabled}\n density={density!}\n labelBehavior={labelBehavior}\n items={items}\n disabledKeys={disabledKeys}\n selectedKey={selectedKey}\n onSelectionChange={onSelectionChange}>\n {(item: Node<any>) => {\n return (\n <PickerItem\n {...item.props.originalProps}\n isDisabled={isDisabled || allKeysDisabled}\n key={item.key}>\n {item.props.children({density, isMenu: true})}\n </PickerItem>\n );\n }}\n </Picker>\n </div>\n );\n};\n\nlet CollapsingTabs = ({collection, containerRef, ...props}: {collection: Collection<Node<unknown>>, containerRef: any} & TabsProps) => {\n let {density = 'regular', orientation = 'horizontal', labelBehavior = 'show', onSelectionChange} = props;\n let [showItems, _setShowItems] = useState(true);\n showItems = orientation === 'vertical' ? true : showItems;\n let setShowItems = useCallback((value: boolean) => {\n if (orientation === 'vertical') {\n // if orientation is vertical, we always show the items\n _setShowItems(true);\n } else {\n _setShowItems(value);\n }\n }, [orientation]);\n\n let {direction} = useLocale();\n\n let children = useMemo(() => [...collection], [collection]);\n\n let listRef = useRef<HTMLDivElement | null>(null);\n let updateOverflow = useEffectEvent(() => {\n if (orientation === 'vertical' || !listRef.current || !containerRef?.current) {\n return;\n }\n let container = listRef.current;\n let containerRect = container.getBoundingClientRect();\n let tabs = container.querySelectorAll('[data-hidden-tab]');\n let lastTab = tabs[tabs.length - 1];\n let lastTabRect = lastTab.getBoundingClientRect();\n if (direction === 'ltr') {\n setShowItems?.(lastTabRect.right <= containerRect.right);\n } else {\n setShowItems?.(lastTabRect.left >= containerRect.left);\n }\n });\n\n useResizeObserver({ref: containerRef, onResize: updateOverflow});\n\n useLayoutEffect(() => {\n if (collection.size > 0) {\n queueMicrotask(updateOverflow);\n }\n }, [collection.size, updateOverflow]);\n\n // start with null so that the first render won't have a flicker\n let prevOrientation = useRef<Orientation | null>(null);\n useLayoutEffect(() => {\n if (collection.size > 0 && prevOrientation.current !== orientation) {\n updateOverflow();\n }\n prevOrientation.current = orientation;\n }, [collection.size, updateOverflow, orientation]);\n\n useEffect(() => {\n // Recalculate visible tags when fonts are loaded.\n document.fonts?.ready.then(() => updateOverflow());\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n let menuId = useId();\n let valueId = useId();\n\n let contents: ReactNode;\n if (showItems) {\n contents = (\n <RACTabs\n {...props}\n style={{display: 'contents'}}>\n {props.children}\n </RACTabs>\n );\n } else {\n contents = (\n <>\n <TabsMenu\n id={menuId}\n valueId={valueId}\n items={children}\n onSelectionChange={onSelectionChange}\n aria-label={props['aria-label']}\n aria-describedby={props['aria-labelledby']} />\n <CollapseContext.Provider value={{showTabs: false, menuId, valueId}}>\n {props.children}\n </CollapseContext.Provider>\n </>\n );\n }\n\n return (\n <div style={props.UNSAFE_style} className={(props.UNSAFE_className || '') + tabs({orientation}, props.styles)} ref={containerRef}>\n <div className={tablist({orientation, labelBehavior, density})}>\n <HiddenTabs items={children} density={density} listRef={listRef} />\n </div>\n <CollapseContext.Provider value={{showTabs: true, menuId, valueId}}>\n {contents}\n </CollapseContext.Provider>\n </div>\n );\n};\n"],"names":[],"version":3,"file":"Tabs.mjs.map"}
1
+ {"mappings":"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","sources":["packages/@react-spectrum/s2/src/Tabs.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 {\n TabListProps as AriaTabListProps,\n TabPanel as AriaTabPanel,\n TabPanelProps as AriaTabPanelProps,\n TabProps as AriaTabProps,\n TabsProps as AriaTabsProps,\n ContextValue,\n Group,\n Provider,\n Tab as RACTab,\n TabList as RACTabList,\n Tabs as RACTabs,\n TabListStateContext,\n TabRenderProps\n} from 'react-aria-components';\nimport {baseColor, focusRing, size, style} from '../style' with {type: 'macro'};\nimport {centerBaseline} from './CenterBaseline';\nimport {Collection, DOMRef, DOMRefValue, Key, Node, Orientation, RefObject} from '@react-types/shared';\nimport {CollectionBuilder} from '@react-aria/collections';\nimport {createContext, forwardRef, ReactNode, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';\nimport {getAllowedOverrides, StyleProps, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {inertValue, useEffectEvent, useId, useLabels, useLayoutEffect, useResizeObserver} from '@react-aria/utils';\nimport {Picker, PickerItem} from './TabsPicker';\nimport {Text, TextContext} from './Content';\nimport {useControlledState} from '@react-stately/utils';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useHasTabbableChild} from '@react-aria/focus';\nimport {useLocale} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface TabsProps extends Omit<AriaTabsProps, 'className' | 'style' | 'children'>, UnsafeStyles {\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithHeight,\n /** The content to display in the tabs. */\n children: ReactNode,\n /**\n * The amount of space between the tabs.\n * @default 'regular'\n */\n density?: 'compact' | 'regular',\n /**\n * Defines if the text within the tabs should be hidden and only the icon should be shown.\n * The text is always visible when the item is collapsed into a picker.\n * @default 'show'\n */\n labelBehavior?: 'show' | 'hide'\n}\n\nexport interface TabProps extends Omit<AriaTabProps, 'children' | 'style' | 'className'>, StyleProps {\n /** The content to display in the tab. */\n children: ReactNode\n}\n\nexport interface TabListProps<T> extends Omit<AriaTabListProps<T>, 'style' | 'className' | 'aria-label' | 'aria-labelledby'>, StyleProps {\n /** The content to display in the tablist. */\n children: ReactNode | ((item: T) => ReactNode)\n}\n\nexport interface TabPanelProps extends Omit<AriaTabPanelProps, 'children' | 'style' | 'className'>, UnsafeStyles {\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithHeight,\n /** The content to display in the tab panels. */\n children: ReactNode\n}\n\nexport const TabsContext = createContext<ContextValue<Partial<TabsProps>, DOMRefValue<HTMLDivElement>>>(null);\nconst InternalTabsContext = createContext<Partial<TabsProps>>({});\nconst CollapseContext = createContext({\n showTabs: true,\n menuId: '',\n valueId: ''\n});\n\nconst tabs = style({\n position: 'relative',\n display: 'flex',\n flexShrink: 0,\n font: 'ui',\n flexDirection: {\n orientation: {\n horizontal: 'column'\n }\n }\n}, getAllowedOverrides({height: true}));\n\n/**\n * Tabs organize content into multiple sections and allow users to navigate between them. The content under the set of tabs should be related and form a coherent unit.\n */\nexport const Tabs = forwardRef(function Tabs(props: TabsProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, TabsContext);\n let {\n density = 'regular',\n isDisabled,\n disabledKeys,\n orientation = 'horizontal',\n labelBehavior = 'show'\n } = props;\n let domRef = useDOMRef(ref);\n let [value, setValue] = useControlledState(props.selectedKey, props.defaultSelectedKey ?? null!, props.onSelectionChange);\n\n if (!props['aria-label'] && !props['aria-labelledby']) {\n throw new Error('An aria-label or aria-labelledby prop is required on Tabs for accessibility.');\n }\n\n return (\n <Provider\n values={[\n [InternalTabsContext, {\n density,\n isDisabled,\n orientation,\n disabledKeys,\n selectedKey: value,\n onSelectionChange: setValue,\n labelBehavior,\n 'aria-label': props['aria-label'],\n 'aria-labelledby': props['aria-labelledby']\n }]\n ]}>\n <CollectionBuilder content={props.children}>\n {collection => (\n <CollapsingTabs\n {...props}\n selectedKey={value}\n onSelectionChange={setValue}\n collection={collection}\n containerRef={domRef} />\n )}\n </CollectionBuilder>\n </Provider>\n );\n});\n\nconst tablist = style({\n display: 'flex',\n gap: {\n orientation: {\n horizontal: {\n density: {\n compact: 24,\n regular: 32\n },\n labelBehavior: {\n hide: {\n density: {\n compact: 16,\n regular: 24\n }\n }\n }\n }\n }\n },\n flexDirection: {\n orientation: {\n vertical: 'column'\n }\n },\n marginEnd: {\n orientation: {\n vertical: 20\n }\n },\n marginStart: {\n orientation: {\n vertical: 12\n }\n },\n flexShrink: 0,\n flexBasis: '0%'\n});\n\nexport function TabList<T extends object>(props: TabListProps<T>): ReactNode | null {\n let {showTabs} = useContext(CollapseContext) ?? {};\n\n if (showTabs) {\n return <TabListInner {...props} />;\n }\n return null;\n}\n\nfunction TabListInner<T extends object>(props: TabListProps<T>) {\n let {density, isDisabled, disabledKeys, orientation, labelBehavior, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy} = useContext(InternalTabsContext) ?? {};\n let state = useContext(TabListStateContext);\n let [selectedTab, setSelectedTab] = useState<HTMLElement | undefined>(undefined);\n let tablistRef = useRef<HTMLDivElement>(null);\n\n useLayoutEffect(() => {\n if (tablistRef?.current) {\n let tab: HTMLElement | null = tablistRef.current.querySelector('[role=tab][data-selected=true]');\n\n if (tab != null) {\n setSelectedTab(tab);\n }\n }\n }, [tablistRef, state?.selectedItem?.key]);\n\n return (\n <div\n style={props.UNSAFE_style}\n className={(props.UNSAFE_className || '') + style({position: 'relative'}, getAllowedOverrides())(null, props.styles)}>\n {orientation === 'vertical' &&\n <TabLine disabledKeys={disabledKeys} isDisabled={isDisabled} selectedTab={selectedTab} orientation={orientation} tabList={props} density={density} />}\n <RACTabList\n {...props}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n ref={tablistRef}\n className={renderProps => tablist({...renderProps, labelBehavior, density})} />\n {orientation === 'horizontal' &&\n <TabLine disabledKeys={disabledKeys} isDisabled={isDisabled} selectedTab={selectedTab} orientation={orientation} tabList={props} density={density} />}\n </div>\n );\n}\n\ninterface TabLineProps<T extends object> {\n disabledKeys: Iterable<Key> | undefined,\n isDisabled: boolean | undefined,\n selectedTab: HTMLElement | undefined,\n orientation?: Orientation,\n tabList: TabListProps<T>,\n density?: 'compact' | 'regular'\n}\n\nconst selectedIndicator = style<{isDisabled: boolean, orientation?: Orientation}>({\n position: 'absolute',\n backgroundColor: {\n default: 'neutral',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n height: {\n orientation: {\n horizontal: '[2px]'\n }\n },\n width: {\n orientation: {\n vertical: '[2px]'\n }\n },\n bottom: {\n orientation: {\n horizontal: 0\n }\n },\n borderStyle: 'none',\n borderRadius: 'full',\n transitionDuration: 130,\n transitionTimingFunction: 'in-out'\n});\n\nfunction TabLine<T extends object>(props: TabLineProps<T>) {\n let {\n disabledKeys,\n isDisabled: isTabsDisabled,\n selectedTab,\n orientation,\n tabList,\n density\n } = props;\n let {direction} = useLocale();\n let state = useContext(TabListStateContext);\n\n // We want to add disabled styling to the selection indicator only if all the Tabs are disabled\n let [isDisabled, setIsDisabled] = useState<boolean>(false);\n useEffect(() => {\n let isDisabled = isTabsDisabled || isAllTabsDisabled(state?.collection, disabledKeys ? new Set(disabledKeys) : new Set(null));\n setIsDisabled(isDisabled);\n }, [state?.collection, disabledKeys, isTabsDisabled, setIsDisabled]);\n\n let [style, setStyle] = useState<{transform: string | undefined, width: string | undefined, height: string | undefined}>({\n transform: undefined,\n width: undefined,\n height: undefined\n });\n\n let onResize = useCallback(() => {\n if (selectedTab) {\n let styleObj: { transform: string | undefined, width: string | undefined, height: string | undefined } = {\n transform: undefined,\n width: undefined,\n height: undefined\n };\n\n // In RTL, calculate the transform from the right edge of the tablist so that resizing the window doesn't break the Tabline position due to offsetLeft changes\n let offset = direction === 'rtl' ? -1 * ((selectedTab.offsetParent as HTMLElement)?.offsetWidth - selectedTab.offsetWidth - selectedTab.offsetLeft) : selectedTab.offsetLeft;\n styleObj.transform = orientation === 'vertical'\n ? `translateY(${selectedTab.offsetTop}px)`\n : `translateX(${offset}px)`;\n\n if (orientation === 'horizontal') {\n styleObj.width = `${selectedTab.offsetWidth}px`;\n } else {\n styleObj.height = `${selectedTab.offsetHeight}px`;\n }\n setStyle(styleObj);\n }\n }, [direction, setStyle, selectedTab, orientation]);\n\n useLayoutEffect(() => {\n onResize();\n }, [onResize, state?.selectedItem?.key, density, direction, orientation, tabList]);\n\n return (\n <div style={{...style}} className={selectedIndicator({isDisabled, orientation})} />\n );\n}\n\nconst tab = style<TabRenderProps & {density?: 'compact' | 'regular', labelBehavior?: 'show' | 'hide'}>({\n ...focusRing(),\n display: 'flex',\n color: {\n default: baseColor('neutral-subdued'),\n isSelected: baseColor('neutral'),\n isDisabled: 'disabled',\n forcedColors: {\n isSelected: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n borderRadius: 'sm',\n gap: 'text-to-visual',\n height: {\n density: {\n compact: 32,\n regular: 48\n }\n },\n alignItems: 'center',\n position: 'relative',\n cursor: 'default',\n flexShrink: 0,\n transition: 'default',\n paddingX: {\n labelBehavior: {\n hide: size(6)\n }\n },\n disableTapHighlight: true\n}, getAllowedOverrides());\n\nconst icon = style({\n display: 'block',\n flexShrink: 0,\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n});\n\nexport function Tab(props: TabProps): ReactNode {\n let {density, labelBehavior} = useContext(InternalTabsContext) ?? {};\n\n let contentId = useId();\n let ariaLabelledBy = props['aria-labelledby'] || '';\n return (\n <RACTab\n {...props}\n // @ts-ignore\n originalProps={props}\n aria-labelledby={`${labelBehavior === 'hide' ? contentId : ''} ${ariaLabelledBy}`}\n style={props.UNSAFE_style}\n className={renderProps => (props.UNSAFE_className || '') + tab({...renderProps, density, labelBehavior}, props.styles)}>\n {({\n // @ts-ignore\n isMenu\n }) => {\n if (isMenu) {\n return props.children;\n } else {\n return (\n <Provider\n values={[\n [TextContext, {\n id: contentId,\n styles:\n style({\n order: 1,\n display: {\n labelBehavior: {\n hide: 'none'\n }\n }\n })({labelBehavior})\n }],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n styles: icon\n }]\n ]}>\n {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n </Provider>\n );\n }\n }}\n </RACTab>\n );\n}\n\nconst tabPanel = style({\n ...focusRing(),\n marginTop: 4,\n color: 'gray-800',\n flexGrow: 1,\n flexBasis: '0%',\n minHeight: 0,\n minWidth: 0\n}, getAllowedOverrides({height: true}));\n\nexport function TabPanel(props: TabPanelProps): ReactNode | null {\n let {showTabs} = useContext(CollapseContext);\n let {selectedKey} = useContext(InternalTabsContext);\n if (showTabs) {\n return (\n <AriaTabPanel\n {...props}\n style={props.UNSAFE_style}\n className={renderProps => (props.UNSAFE_className ?? '') + tabPanel(renderProps, props.styles)} />\n );\n }\n\n if (props.id !== selectedKey) {\n return null;\n }\n\n return <CollapsedTabPanel {...props} />;\n}\n\nfunction CollapsedTabPanel(props: TabPanelProps) {\n let {UNSAFE_style, UNSAFE_className = '', ...otherProps} = props;\n let {menuId, valueId} = useContext(CollapseContext);\n let ref = useRef(null);\n let tabIndex = useHasTabbableChild(ref) ? undefined : 0;\n\n return (\n <Group\n {...otherProps}\n ref={ref}\n aria-labelledby={menuId + ' ' + valueId}\n tabIndex={tabIndex}\n style={UNSAFE_style}\n className={renderProps => UNSAFE_className + tabPanel(renderProps, props.styles)} />\n );\n}\n\nfunction isAllTabsDisabled<T>(collection: Collection<Node<T>> | undefined, disabledKeys: Set<Key>) {\n let testKey: Key | null = null;\n if (collection && collection.size > 0) {\n testKey = collection.getFirstKey();\n\n let index = 0;\n while (testKey && index < collection.size) {\n // We have to check if the item in the collection has a key in disabledKeys or has the isDisabled prop set directly on it\n if (!disabledKeys.has(testKey) && !collection.getItem(testKey)?.props?.isDisabled) {\n return false;\n }\n\n testKey = collection.getKeyAfter(testKey);\n index++;\n }\n return true;\n }\n return false;\n}\n\nlet HiddenTabs = function (props: {\n listRef: RefObject<HTMLDivElement | null>,\n items: Array<Node<any>>,\n size?: string,\n density?: 'compact' | 'regular'\n}) {\n let {listRef, items, size, density} = props;\n\n return (\n <div\n // @ts-ignore\n inert={inertValue(true)}\n ref={listRef}\n className={style({\n display: 'inherit',\n flexDirection: 'inherit',\n gap: 'inherit',\n flexWrap: 'inherit',\n position: 'absolute',\n inset: 0,\n visibility: 'hidden',\n overflow: 'hidden',\n opacity: 0\n })}>\n {items.map((item) => {\n // pull off individual props as an allow list, don't want refs or other props getting through\n return (\n <div\n data-hidden-tab\n style={item.props.UNSAFE_style}\n key={item.key}\n className={item.props.className({size, density})}>\n {item.props.children({size, density})}\n </div>\n );\n })}\n </div>\n );\n};\n\nlet TabsMenu = (props: {valueId: string, items: Array<Node<any>>, onSelectionChange: TabsProps['onSelectionChange']} & Omit<TabsProps, 'children'>) => {\n let {id, items, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, valueId} = props;\n let {density, onSelectionChange: _onSelectionChange, selectedKey, isDisabled, disabledKeys, labelBehavior} = useContext(InternalTabsContext);\n let onSelectionChange = useCallback((key: Key | null) => {\n if (key != null) {\n _onSelectionChange?.(key);\n }\n }, [_onSelectionChange]);\n let state = useContext(TabListStateContext);\n let allKeysDisabled = useMemo(() => {\n return isAllTabsDisabled(state?.collection, disabledKeys ? new Set(disabledKeys) : new Set());\n }, [state?.collection, disabledKeys]);\n let labelProps = useLabels({\n id,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy\n });\n\n return (\n <div\n className={style({\n display: 'flex',\n flexShrink: 0,\n alignItems: 'center',\n height: {\n density: {\n compact: 32,\n regular: 48\n }\n }})({density})}>\n <Picker\n id={id}\n valueId={valueId}\n {...labelProps}\n aria-describedby={props['aria-describedby']}\n aria-details={props['aria-details']}\n isDisabled={isDisabled || allKeysDisabled}\n density={density!}\n labelBehavior={labelBehavior}\n items={items}\n disabledKeys={disabledKeys}\n selectedKey={selectedKey}\n onSelectionChange={onSelectionChange}>\n {(item: Node<any>) => {\n return (\n <PickerItem\n {...item.props.originalProps}\n isDisabled={isDisabled || allKeysDisabled}\n key={item.key}>\n {item.props.children({density, isMenu: true})}\n </PickerItem>\n );\n }}\n </Picker>\n </div>\n );\n};\n\nlet CollapsingTabs = ({collection, containerRef, ...props}: {collection: Collection<Node<unknown>>, containerRef: any} & TabsProps) => {\n let {density = 'regular', orientation = 'horizontal', labelBehavior = 'show', onSelectionChange} = props;\n let [showItems, _setShowItems] = useState(true);\n showItems = orientation === 'vertical' ? true : showItems;\n let setShowItems = useCallback((value: boolean) => {\n if (orientation === 'vertical') {\n // if orientation is vertical, we always show the items\n _setShowItems(true);\n } else {\n _setShowItems(value);\n }\n }, [orientation]);\n\n let {direction} = useLocale();\n\n let children = useMemo(() => [...collection], [collection]);\n\n let listRef = useRef<HTMLDivElement | null>(null);\n let updateOverflow = useEffectEvent(() => {\n if (orientation === 'vertical' || !listRef.current || !containerRef?.current) {\n return;\n }\n let container = listRef.current;\n let containerRect = container.getBoundingClientRect();\n let tabs = container.querySelectorAll('[data-hidden-tab]');\n let lastTab = tabs[tabs.length - 1];\n let lastTabRect = lastTab.getBoundingClientRect();\n if (direction === 'ltr') {\n setShowItems?.(lastTabRect.right <= containerRect.right);\n } else {\n setShowItems?.(lastTabRect.left >= containerRect.left);\n }\n });\n\n useResizeObserver({ref: containerRef, onResize: updateOverflow});\n\n useLayoutEffect(() => {\n if (collection.size > 0) {\n queueMicrotask(updateOverflow);\n }\n }, [collection.size, updateOverflow]);\n\n // start with null so that the first render won't have a flicker\n let prevOrientation = useRef<Orientation | null>(null);\n useLayoutEffect(() => {\n if (collection.size > 0 && prevOrientation.current !== orientation) {\n updateOverflow();\n }\n prevOrientation.current = orientation;\n }, [collection.size, updateOverflow, orientation]);\n\n useEffect(() => {\n // Recalculate visible tags when fonts are loaded.\n document.fonts?.ready.then(() => updateOverflow());\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n let menuId = useId();\n let valueId = useId();\n\n let contents: ReactNode;\n if (showItems) {\n contents = (\n <RACTabs\n {...props}\n style={{display: 'contents'}}>\n {props.children}\n </RACTabs>\n );\n } else {\n contents = (\n <>\n <TabsMenu\n id={menuId}\n valueId={valueId}\n items={children}\n onSelectionChange={onSelectionChange}\n aria-label={props['aria-label']}\n aria-describedby={props['aria-labelledby']} />\n <CollapseContext.Provider value={{showTabs: false, menuId, valueId}}>\n {props.children}\n </CollapseContext.Provider>\n </>\n );\n }\n\n return (\n <div style={props.UNSAFE_style} className={(props.UNSAFE_className || '') + tabs({orientation}, props.styles)} ref={containerRef}>\n <div className={tablist({orientation, labelBehavior, density})}>\n <HiddenTabs items={children} density={density} listRef={listRef} />\n </div>\n <CollapseContext.Provider value={{showTabs: true, menuId, valueId}}>\n {contents}\n </CollapseContext.Provider>\n </div>\n );\n};\n"],"names":[],"version":3,"file":"Tabs.mjs.map"}