@react-spectrum/s2 3.0.0-nightly-101d0772b-250113 → 3.0.0-nightly-c53ab48ec-250115

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 (53) hide show
  1. package/dist/ActionBar.cjs +11 -9
  2. package/dist/ActionBar.cjs.map +1 -1
  3. package/dist/ActionBar.css +17 -34
  4. package/dist/ActionBar.css.map +1 -1
  5. package/dist/ActionBar.mjs +12 -10
  6. package/dist/ActionBar.mjs.map +1 -1
  7. package/dist/Modal.cjs +15 -21
  8. package/dist/Modal.cjs.map +1 -1
  9. package/dist/Modal.css +22 -46
  10. package/dist/Modal.css.map +1 -1
  11. package/dist/Modal.mjs +15 -21
  12. package/dist/Modal.mjs.map +1 -1
  13. package/dist/Popover.cjs +19 -37
  14. package/dist/Popover.cjs.map +1 -1
  15. package/dist/Popover.css +28 -99
  16. package/dist/Popover.css.map +1 -1
  17. package/dist/Popover.mjs +19 -37
  18. package/dist/Popover.mjs.map +1 -1
  19. package/dist/Tabs.cjs +177 -414
  20. package/dist/Tabs.cjs.map +1 -1
  21. package/dist/Tabs.css +120 -208
  22. package/dist/Tabs.css.map +1 -1
  23. package/dist/Tabs.mjs +179 -416
  24. package/dist/Tabs.mjs.map +1 -1
  25. package/dist/Tooltip.cjs +19 -16
  26. package/dist/Tooltip.cjs.map +1 -1
  27. package/dist/Tooltip.css +25 -40
  28. package/dist/Tooltip.css.map +1 -1
  29. package/dist/Tooltip.mjs +19 -16
  30. package/dist/Tooltip.mjs.map +1 -1
  31. package/dist/en-US.cjs +0 -1
  32. package/dist/en-US.cjs.map +1 -1
  33. package/dist/en-US.mjs +0 -1
  34. package/dist/en-US.mjs.map +1 -1
  35. package/dist/he-IL.cjs +0 -1
  36. package/dist/he-IL.cjs.map +1 -1
  37. package/dist/he-IL.mjs +0 -1
  38. package/dist/he-IL.mjs.map +1 -1
  39. package/dist/types.d.ts +7 -11
  40. package/dist/types.d.ts.map +1 -1
  41. package/package.json +19 -22
  42. package/src/ActionBar.tsx +14 -20
  43. package/src/Modal.tsx +17 -44
  44. package/src/Popover.tsx +21 -89
  45. package/src/Tabs.tsx +156 -427
  46. package/src/Tooltip.tsx +25 -42
  47. package/dist/TabsPicker.cjs +0 -388
  48. package/dist/TabsPicker.cjs.map +0 -1
  49. package/dist/TabsPicker.css +0 -440
  50. package/dist/TabsPicker.css.map +0 -1
  51. package/dist/TabsPicker.mjs +0 -382
  52. package/dist/TabsPicker.mjs.map +0 -1
  53. package/src/TabsPicker.tsx +0 -341
@@ -1,382 +0,0 @@
1
- import "./TabsPicker.css";
2
- import {centerBaseline as $1f4b04be3f24aae3$export$9d7e2342a7e53afa} from "./CenterBaseline.mjs";
3
- import {checkmark as $13afb0ea5f0ed767$export$292abbf31ed842a, description as $13afb0ea5f0ed767$export$6d59db4903f20f7d, icon as $13afb0ea5f0ed767$export$1ca1ec8b29a4ce27, label as $13afb0ea5f0ed767$export$1237798dc640739a, menuitem as $13afb0ea5f0ed767$export$f68e44d881264486, sectionHeader as $13afb0ea5f0ed767$export$562e61a0817eb32e, sectionHeading as $13afb0ea5f0ed767$export$300ac6f106ef584d} from "./Menu.mjs";
4
- import $81cf3d4588736e7d$export$2e2bcd8739ae039 from "./Checkmark.mjs";
5
- import $4b69f02ec06b9226$export$2e2bcd8739ae039 from "./Chevron.mjs";
6
- import {FieldLabel as $9afd80978c252040$export$1acdcf5a973a8414} from "./Field.mjs";
7
- import {HeaderContext as $8e847109a6ab556d$export$e0e4026c12a8bdbb, HeadingContext as $8e847109a6ab556d$export$d688439359537581, Text as $8e847109a6ab556d$export$5f1af8db9871e1d6, TextContext as $8e847109a6ab556d$export$9afb8bc826b033ea} from "./Content.mjs";
8
- import {IconContext as $ac8c32e6775ddd1f$export$a49f528ae1a4d0ed} from "../icons/Icon.mjs";
9
- import $vecDw$intlStringsmjs from "./intlStrings.mjs";
10
- import {PopoverBase as $88b746eba92c8d0d$export$fde1b04c590741a3} from "./Popover.mjs";
11
- import {pressScale as $10ea7662e51a285b$export$56e8cba416805d8d} from "./pressScale.mjs";
12
- import {useFormProps as $9b916426527cebe7$export$a6b5be5c6b451665} from "./Form.mjs";
13
- import {useSpectrumContextProps as $5ce63c423902f47d$export$764f6146fadd77f7} from "../icons/useSpectrumContextProps.mjs";
14
- import {jsx as $vecDw$jsx, jsxs as $vecDw$jsxs, Fragment as $vecDw$Fragment} from "react/jsx-runtime";
15
- import {Select as $vecDw$Select, Button as $vecDw$Button, SelectValue as $vecDw$SelectValue, Provider as $vecDw$Provider, DEFAULT_SLOT as $vecDw$DEFAULT_SLOT, ListBox as $vecDw$ListBox, ListBoxItem as $vecDw$ListBoxItem} from "react-aria-components";
16
- import {createContext as $vecDw$createContext, forwardRef as $vecDw$forwardRef, useRef as $vecDw$useRef, useContext as $vecDw$useContext} from "react";
17
- import {useFocusableRef as $vecDw$useFocusableRef} from "@react-spectrum/utils";
18
- import {useLocalizedStringFormatter as $vecDw$useLocalizedStringFormatter} from "@react-aria/i18n";
19
-
20
-
21
- function $parcel$interopDefault(a) {
22
- return a && a.__esModule ? a.default : a;
23
- }
24
- /*
25
- * Copyright 2024 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
-
36
-
37
-
38
-
39
-
40
-
41
-
42
-
43
-
44
-
45
-
46
-
47
-
48
-
49
-
50
-
51
- const $0067ea932a992b6a$export$b72b8dade9393cd5 = /*#__PURE__*/ (0, $vecDw$createContext)(null);
52
- const $0067ea932a992b6a$var$inputButton = function anonymous(props) {
53
- let rules = " .";
54
- if (props.isFocusVisible) rules += ' _Mb';
55
- else rules += ' _Ma';
56
- rules += ' da_____M';
57
- rules += ' dx';
58
- rules += ' _Oc';
59
- rules += ' _N-3t1z';
60
- rules += ' __b-g2ozi1';
61
- rules += ' __c-g2ozi1';
62
- rules += ' __d-g2ozi1';
63
- rules += ' __e-g2ozi1';
64
- if (props.size === "XL") rules += ' qj';
65
- else if (props.size === "L") rules += ' qi';
66
- else if (props.size === "S") rules += ' qh';
67
- else if (props.size === "XS") rules += ' qg';
68
- else rules += ' qf';
69
- if (props.isQuiet) rules += ' __na';
70
- else rules += ' __n-1s8glxue';
71
- if (props.size === "XL") rules += ' -usygro_l-____g';
72
- else if (props.size === "L") rules += ' -usygro_l-___0';
73
- else if (props.size === "S") rules += ' -usygro_l-___u';
74
- else rules += ' -usygro_l-___K';
75
- rules += ' m-rwozxi';
76
- rules += ' Vc';
77
- rules += ' _d-bc1l9oh';
78
- rules += ' _d-1uotwbwg';
79
- rules += ' _d-eo0c6sf';
80
- rules += ' _d-enzzrge';
81
- rules += ' _d-enzykdd';
82
- rules += ' _d-enzwzjc';
83
- rules += ' _d-enzrfpb';
84
- rules += ' _da';
85
- rules += ' _ebf';
86
- rules += ' _ee';
87
- rules += ' _fb';
88
- rules += ' _g-1x99dlob';
89
- rules += ' _ga';
90
- if (props.isDisabled) rules += ' aj';
91
- else {
92
- if (props.isPressed) rules += ' ao';
93
- else if (props.isFocusVisible) rules += ' ao';
94
- else if (props.isHovered) rules += ' ao';
95
- else rules += ' an';
96
- }
97
- rules += ' _0d';
98
- rules += ' _ka';
99
- rules += ' wf';
100
- rules += ' _wb';
101
- rules += ' _xb';
102
- rules += ' _yb';
103
- rules += ' _zb';
104
- rules += ' _2c';
105
- rules += ' _Pa';
106
- rules += ' _R-375x7f';
107
- rules += ' _Sa';
108
- rules += ' jbH';
109
- rules += ' jG';
110
- rules += ' C-375tnm';
111
- rules += ' D-375tnn';
112
- rules += ' ba';
113
- if (props.isQuiet) rules += ' rd';
114
- rules += ' __S-yksgrp';
115
- if (props.density === "compact") rules += ' kU';
116
- else rules += ' k_a';
117
- rules += ' __oa';
118
- rules += ' -_375tnm_C-a';
119
- rules += ' -_375tnn_D-a';
120
- return rules;
121
- };
122
- let $0067ea932a992b6a$export$b1e5508a851be14d = function anonymous(props) {
123
- let rules = " .";
124
- rules += ' _Ma';
125
- rules += ' _0f';
126
- rules += ' __i-n6rb9a';
127
- rules += ' __oa';
128
- rules += ' p-17zqamw';
129
- rules += ' __wa';
130
- rules += ' __xa';
131
- rules += ' Ed';
132
- rules += ' Fd';
133
- rules += ' Cd';
134
- rules += ' Dd';
135
- rules += ' _d-bc1l9oh';
136
- rules += ' _d-1uotwbwg';
137
- rules += ' _d-eo0c6sf';
138
- rules += ' _d-enzzrge';
139
- rules += ' _d-enzykdd';
140
- rules += ' _d-enzwzjc';
141
- rules += ' _d-enzrfpb';
142
- rules += ' _da';
143
- if (props.size === "XL") {
144
- rules += ' _ebj';
145
- rules += ' _ei';
146
- } else if (props.size === "L") {
147
- rules += ' _ebh';
148
- rules += ' _eg';
149
- } else if (props.size === "S") {
150
- rules += ' _ebd';
151
- rules += ' _ec';
152
- } else if (props.size === "XS") {
153
- rules += ' _ebb';
154
- rules += ' _ea';
155
- } else {
156
- rules += ' _ebf';
157
- rules += ' _ee';
158
- }
159
- return rules;
160
- };
161
- const $0067ea932a992b6a$var$valueStyles = " . __a-3t1x __wb __xb _na _qb _0d _2c kb";
162
- const $0067ea932a992b6a$var$iconStyles = " . _9-3t1x R-3hn0u -rwx0fg_e-b";
163
- const $0067ea932a992b6a$var$iconCenterWrapper = function anonymous(props) {
164
- let rules = " .";
165
- rules += ' _0d';
166
- rules += ' __b-qb5q8i';
167
- rules += ' __c-qb5q8i';
168
- rules += ' __d-qb5q8i';
169
- rules += ' __e-qb5q8i';
170
- if (props.labelBehavior === "hide") rules += ' C-ve8p9e';
171
- return rules;
172
- };
173
- let $0067ea932a992b6a$var$InsideSelectValueContext = /*#__PURE__*/ (0, $vecDw$createContext)(false);
174
- function $0067ea932a992b6a$var$Picker(props1, ref) {
175
- let stringFormatter = (0, $vecDw$useLocalizedStringFormatter)((0, ($parcel$interopDefault($vecDw$intlStringsmjs))), '@react-spectrum/s2');
176
- [props1, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props1, ref, $0067ea932a992b6a$export$b72b8dade9393cd5);
177
- let domRef = (0, $vecDw$useFocusableRef)(ref);
178
- props1 = (0, $9b916426527cebe7$export$a6b5be5c6b451665)(props1);
179
- let { direction: direction = 'bottom', align: align = 'start', shouldFlip: shouldFlip = true, children: children, items: items, placeholder: placeholder = stringFormatter.format('picker.placeholder'), density: density, labelBehavior: labelBehavior = 'show', ...pickerProps } = props1;
180
- let isQuiet = true;
181
- const menuOffset = 6;
182
- const size = 'M';
183
- return /*#__PURE__*/ (0, $vecDw$jsx)((0, $vecDw$Select), {
184
- ...pickerProps,
185
- placeholder: placeholder,
186
- children: ({ isOpen: isOpen })=>/*#__PURE__*/ (0, $vecDw$jsxs)((0, $vecDw$Fragment), {
187
- children: [
188
- /*#__PURE__*/ (0, $vecDw$jsx)((0, $9afd80978c252040$export$1acdcf5a973a8414), {
189
- isQuiet: isQuiet
190
- }),
191
- /*#__PURE__*/ (0, $vecDw$jsxs)((0, $vecDw$Button), {
192
- ref: domRef,
193
- style: (renderProps)=>(0, $10ea7662e51a285b$export$56e8cba416805d8d)(domRef)(renderProps),
194
- // Prevent press scale from sticking while Picker is open.
195
- // @ts-ignore
196
- isPressed: false,
197
- className: (renderProps)=>$0067ea932a992b6a$var$inputButton({
198
- ...renderProps,
199
- size: 'M',
200
- isOpen: isOpen,
201
- isQuiet: isQuiet,
202
- density: density
203
- }),
204
- children: [
205
- /*#__PURE__*/ (0, $vecDw$jsx)((0, $vecDw$SelectValue), {
206
- className: $0067ea932a992b6a$var$valueStyles + ' ' + "-u6zm92",
207
- children: ({ defaultChildren: defaultChildren })=>{
208
- return /*#__PURE__*/ (0, $vecDw$jsx)((0, $vecDw$Provider), {
209
- values: [
210
- [
211
- (0, $ac8c32e6775ddd1f$export$a49f528ae1a4d0ed),
212
- {
213
- slots: {
214
- icon: {
215
- render: (0, $1f4b04be3f24aae3$export$9d7e2342a7e53afa)({
216
- slot: 'icon',
217
- styles: $0067ea932a992b6a$var$iconCenterWrapper({
218
- labelBehavior: labelBehavior
219
- })
220
- }),
221
- styles: (0, $13afb0ea5f0ed767$export$1ca1ec8b29a4ce27)
222
- }
223
- }
224
- }
225
- ],
226
- [
227
- (0, $8e847109a6ab556d$export$9afb8bc826b033ea),
228
- {
229
- slots: {
230
- // Default slot is useful when converting other collections to PickerItems.
231
- [(0, $vecDw$DEFAULT_SLOT)]: {
232
- styles: function anonymous(props) {
233
- let rules = " .";
234
- if (props.labelBehavior === "hide") rules += ' _0j';
235
- else rules += ' _0a';
236
- rules += ' __a-3t1y';
237
- rules += ' __wb';
238
- rules += ' __xb';
239
- rules += ' _na';
240
- rules += ' _qb';
241
- return rules;
242
- }({
243
- labelBehavior: labelBehavior
244
- })
245
- }
246
- }
247
- }
248
- ],
249
- [
250
- $0067ea932a992b6a$var$InsideSelectValueContext,
251
- true
252
- ]
253
- ],
254
- children: defaultChildren
255
- });
256
- }
257
- }),
258
- /*#__PURE__*/ (0, $vecDw$jsx)((0, $4b69f02ec06b9226$export$2e2bcd8739ae039), {
259
- size: size,
260
- className: $0067ea932a992b6a$var$iconStyles
261
- })
262
- ]
263
- }),
264
- /*#__PURE__*/ (0, $vecDw$jsx)((0, $88b746eba92c8d0d$export$fde1b04c590741a3), {
265
- hideArrow: true,
266
- offset: menuOffset,
267
- placement: `${direction} ${align}`,
268
- shouldFlip: shouldFlip,
269
- styles: " . y-375tp4 q___u l-13f72lm -_375tp4_y-M",
270
- children: /*#__PURE__*/ (0, $vecDw$jsx)((0, $vecDw$Provider), {
271
- values: [
272
- [
273
- (0, $8e847109a6ab556d$export$e0e4026c12a8bdbb),
274
- {
275
- styles: (0, $13afb0ea5f0ed767$export$562e61a0817eb32e)({
276
- size: size
277
- })
278
- }
279
- ],
280
- [
281
- (0, $8e847109a6ab556d$export$d688439359537581),
282
- {
283
- styles: (0, $13afb0ea5f0ed767$export$300ac6f106ef584d)
284
- }
285
- ],
286
- [
287
- (0, $8e847109a6ab556d$export$9afb8bc826b033ea),
288
- {
289
- slots: {
290
- description: {
291
- styles: (0, $13afb0ea5f0ed767$export$6d59db4903f20f7d)({
292
- size: size
293
- })
294
- }
295
- }
296
- }
297
- ]
298
- ],
299
- children: /*#__PURE__*/ (0, $vecDw$jsx)((0, $vecDw$ListBox), {
300
- items: items,
301
- className: $0067ea932a992b6a$export$b1e5508a851be14d,
302
- children: children
303
- })
304
- })
305
- })
306
- ]
307
- })
308
- });
309
- }
310
- /**
311
- * Pickers allow users to choose a single option from a collapsible list of options when space is limited.
312
- */ let $0067ea932a992b6a$export$ba25329847403e11 = /*#__PURE__*/ (0, $vecDw$forwardRef)($0067ea932a992b6a$var$Picker);
313
- function $0067ea932a992b6a$export$d601881f38163e28(props) {
314
- let ref = (0, $vecDw$useRef)(null);
315
- let isLink = props.href != null;
316
- const size = 'M';
317
- return /*#__PURE__*/ (0, $vecDw$jsx)((0, $vecDw$ListBoxItem), {
318
- ...props,
319
- ref: ref,
320
- textValue: props.textValue || (typeof props.children === 'string' ? props.children : undefined),
321
- style: (0, $10ea7662e51a285b$export$56e8cba416805d8d)(ref, props.UNSAFE_style),
322
- className: (renderProps)=>(props.UNSAFE_className || '') + (0, $13afb0ea5f0ed767$export$f68e44d881264486)({
323
- ...renderProps,
324
- size: size,
325
- isLink: isLink
326
- }, props.styles),
327
- children: (renderProps)=>{
328
- let { children: children } = props;
329
- return /*#__PURE__*/ (0, $vecDw$jsx)($0067ea932a992b6a$var$DefaultProvider, {
330
- context: (0, $ac8c32e6775ddd1f$export$a49f528ae1a4d0ed),
331
- value: {
332
- slots: {
333
- icon: {
334
- render: (0, $1f4b04be3f24aae3$export$9d7e2342a7e53afa)({
335
- slot: 'icon',
336
- styles: $0067ea932a992b6a$var$iconCenterWrapper({})
337
- }),
338
- styles: (0, $13afb0ea5f0ed767$export$1ca1ec8b29a4ce27)
339
- }
340
- }
341
- },
342
- children: /*#__PURE__*/ (0, $vecDw$jsxs)($0067ea932a992b6a$var$DefaultProvider, {
343
- context: (0, $8e847109a6ab556d$export$9afb8bc826b033ea),
344
- value: {
345
- slots: {
346
- [(0, $vecDw$DEFAULT_SLOT)]: {
347
- styles: (0, $13afb0ea5f0ed767$export$1237798dc640739a)({
348
- size: size
349
- })
350
- }
351
- }
352
- },
353
- children: [
354
- !isLink && /*#__PURE__*/ (0, $vecDw$jsx)((0, $81cf3d4588736e7d$export$2e2bcd8739ae039), {
355
- size: size,
356
- className: (0, $13afb0ea5f0ed767$export$292abbf31ed842a)({
357
- ...renderProps,
358
- size: size
359
- })
360
- }),
361
- typeof children === 'string' ? /*#__PURE__*/ (0, $vecDw$jsx)((0, $8e847109a6ab556d$export$5f1af8db9871e1d6), {
362
- children: children
363
- }) : children
364
- ]
365
- })
366
- });
367
- }
368
- });
369
- }
370
- // A Context.Provider that only sets a value if not inside SelectValue.
371
- function $0067ea932a992b6a$var$DefaultProvider({ context: context, value: value, children: children }) {
372
- let inSelectValue = (0, $vecDw$useContext)($0067ea932a992b6a$var$InsideSelectValueContext);
373
- if (inSelectValue) return children;
374
- return /*#__PURE__*/ (0, $vecDw$jsx)(context.Provider, {
375
- value: value,
376
- children: children
377
- });
378
- }
379
-
380
-
381
- export {$0067ea932a992b6a$export$b72b8dade9393cd5 as PickerContext, $0067ea932a992b6a$export$b1e5508a851be14d as menu, $0067ea932a992b6a$export$ba25329847403e11 as Picker, $0067ea932a992b6a$export$d601881f38163e28 as PickerItem};
382
- //# sourceMappingURL=TabsPicker.mjs.map
@@ -1 +0,0 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/s2/src/TabsPicker.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 PopoverProps as AriaPopoverProps,\n Select as AriaSelect,\n SelectProps as AriaSelectProps,\n Button,\n ContextValue,\n DEFAULT_SLOT,\n ListBox,\n ListBoxItem,\n ListBoxItemProps,\n ListBoxProps,\n Provider,\n SelectValue\n} from 'react-aria-components';\nimport {centerBaseline} from './CenterBaseline';\nimport {\n checkmark,\n description,\n icon,\n label,\n menuitem,\n sectionHeader,\n sectionHeading\n} from './Menu';\nimport CheckmarkIcon from '../ui-icons/Checkmark';\nimport ChevronIcon from '../ui-icons/Chevron';\nimport {edgeToText, focusRing, size, style} from '../style' with {type: 'macro'};\nimport {fieldInput, StyleProps} from './style-utils' with {type: 'macro'};\nimport {\n FieldLabel\n} from './Field';\nimport {FocusableRef, FocusableRefValue, SpectrumLabelableProps} from '@react-types/shared';\nimport {forwardRefType} from './types';\nimport {HeaderContext, HeadingContext, Text, TextContext} from './Content';\nimport {IconContext} from './Icon';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {Placement} from 'react-aria';\nimport {PopoverBase} from './Popover';\nimport {pressScale} from './pressScale';\nimport {raw} from '../style/style-macro' with {type: 'macro'};\nimport React, {createContext, forwardRef, ReactNode, useContext, useRef} from 'react';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useFormProps} from './Form';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface PickerStyleProps {\n}\n\nexport interface PickerProps<T extends object> extends\n Omit<AriaSelectProps<T>, 'children' | 'style' | 'className'>,\n PickerStyleProps,\n StyleProps,\n SpectrumLabelableProps,\n Pick<ListBoxProps<T>, 'items'>,\n Pick<AriaPopoverProps, 'shouldFlip'> {\n /** The contents of the collection. */\n children: ReactNode | ((item: T) => ReactNode),\n /**\n * Direction the menu will render relative to the Picker.\n *\n * @default 'bottom'\n */\n direction?: 'bottom' | 'top',\n /**\n * Alignment of the menu relative to the input target.\n *\n * @default 'start'\n */\n align?: 'start' | 'end',\n /** Width of the menu. By default, matches width of the trigger. Note that the minimum width of the dropdown is always equal to the trigger's width. */\n menuWidth?: number,\n /** Density of the tabs, affects the height of the picker. */\n density: 'compact' | 'regular',\n /**\n * If the tab picker should only display icon and no text for the button label.\n * @default 'show\n */\n labelBehavior?: 'show' | 'hide'\n}\n\nexport const PickerContext = createContext<ContextValue<Partial<PickerProps<any>>, FocusableRefValue<HTMLButtonElement>>>(null);\n\nconst inputButton = style({\n ...focusRing(),\n ...fieldInput(),\n outlineStyle: {\n default: 'none',\n isFocusVisible: 'solid'\n },\n position: 'relative',\n font: 'ui',\n display: 'flex',\n textAlign: 'start',\n borderStyle: 'none',\n borderRadius: 'sm',\n alignItems: 'center',\n transition: 'default',\n columnGap: 'text-to-visual',\n paddingX: 0,\n backgroundColor: 'transparent',\n color: {\n default: 'neutral',\n isDisabled: 'disabled'\n },\n maxWidth: {\n isQuiet: 'max'\n },\n disableTapHighlight: true,\n height: {\n default: 48,\n density: {\n compact: 32\n }\n },\n boxSizing: 'border-box'\n});\n\nexport let menu = style({\n outlineStyle: 'none',\n display: 'grid',\n gridTemplateColumns: [edgeToText(32), 'auto', 'auto', 'minmax(0, 1fr)', 'auto', 'auto', 'auto', edgeToText(32)],\n boxSizing: 'border-box',\n maxHeight: '[inherit]',\n overflow: 'auto',\n padding: 8,\n fontFamily: 'sans',\n fontSize: 'control'\n});\n\nconst valueStyles = style({\n flexGrow: 0,\n truncate: true,\n display: 'flex',\n alignItems: 'center',\n height: 'full'\n});\n\nconst iconStyles = style({\n flexShrink: 0,\n rotate: 90,\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n});\n\nconst iconCenterWrapper = style({\n display: 'flex',\n gridArea: 'icon',\n paddingStart: {\n labelBehavior: {\n hide: size(6)\n }\n }\n});\n\nlet InsideSelectValueContext = createContext(false);\n\nfunction Picker<T extends object>(props: PickerProps<T>, ref: FocusableRef<HTMLButtonElement>) {\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n [props, ref] = useSpectrumContextProps(props, ref, PickerContext);\n let domRef = useFocusableRef(ref);\n props = useFormProps(props);\n let {\n direction = 'bottom',\n align = 'start',\n shouldFlip = true,\n children,\n items,\n placeholder = stringFormatter.format('picker.placeholder'),\n density,\n labelBehavior = 'show',\n ...pickerProps\n } = props;\n let isQuiet = true;\n\n const menuOffset: number = 6;\n const size = 'M';\n\n return (\n <AriaSelect\n {...pickerProps}\n placeholder={placeholder}>\n {({isOpen}) => (\n <>\n <FieldLabel isQuiet={isQuiet} />\n <Button\n ref={domRef}\n style={renderProps => pressScale(domRef)(renderProps)}\n // Prevent press scale from sticking while Picker is open.\n // @ts-ignore\n isPressed={false}\n className={renderProps => inputButton({\n ...renderProps,\n size: 'M',\n isOpen,\n isQuiet,\n density\n })}>\n <SelectValue className={valueStyles + ' ' + raw('&> * {display: none;}')}>\n {({defaultChildren}) => {\n return (\n <Provider\n values={[\n [IconContext, {\n slots: {\n icon: {\n render: centerBaseline({slot: 'icon', styles: iconCenterWrapper({labelBehavior})}),\n styles: icon\n }\n }\n }],\n [TextContext, {\n slots: {\n // Default slot is useful when converting other collections to PickerItems.\n [DEFAULT_SLOT]: {styles: style({\n display: {\n default: 'block',\n labelBehavior: {\n hide: 'none'\n }\n },\n flexGrow: 1,\n truncate: true\n })({labelBehavior})}\n }\n }],\n [InsideSelectValueContext, true]\n ]}>\n {defaultChildren}\n </Provider>\n );\n }}\n </SelectValue>\n <ChevronIcon\n size={size}\n className={iconStyles} />\n </Button>\n <PopoverBase\n hideArrow\n offset={menuOffset}\n placement={`${direction} ${align}` as Placement}\n shouldFlip={shouldFlip}\n styles={style({\n marginStart: -12,\n minWidth: 192,\n width: '[calc(var(--trigger-width) + (-2 * self(marginStart)))]'\n })}>\n <Provider\n values={[\n [HeaderContext, {styles: sectionHeader({size})}],\n [HeadingContext, {styles: sectionHeading}],\n [TextContext, {\n slots: {\n description: {styles: description({size})}\n }\n }]\n ]}>\n <ListBox\n items={items}\n className={menu}>\n {children}\n </ListBox>\n </Provider>\n </PopoverBase>\n </>\n )}\n </AriaSelect>\n );\n}\n\n/**\n * Pickers allow users to choose a single option from a collapsible list of options when space is limited.\n */\nlet _Picker = /*#__PURE__*/ (forwardRef as forwardRefType)(Picker);\nexport {_Picker as Picker};\n\nexport interface PickerItemProps extends Omit<ListBoxItemProps, 'children' | 'style' | 'className'>, StyleProps {\n children: ReactNode\n}\n\nexport function PickerItem(props: PickerItemProps) {\n let ref = useRef(null);\n let isLink = props.href != null;\n const size = 'M';\n return (\n <ListBoxItem\n {...props}\n ref={ref}\n textValue={props.textValue || (typeof props.children === 'string' ? props.children as string : undefined)}\n style={pressScale(ref, props.UNSAFE_style)}\n className={renderProps => (props.UNSAFE_className || '') + menuitem({...renderProps, size, isLink}, props.styles)}>\n {(renderProps) => {\n let {children} = props;\n return (\n <DefaultProvider\n context={IconContext}\n value={{slots: {\n icon: {render: centerBaseline({slot: 'icon', styles: iconCenterWrapper({})}), styles: icon}\n }}}>\n <DefaultProvider\n context={TextContext}\n value={{\n slots: {\n [DEFAULT_SLOT]: {styles: label({size})}\n }\n }}>\n {!isLink && <CheckmarkIcon size={size} className={checkmark({...renderProps, size})} />}\n {typeof children === 'string' ? <Text>{children}</Text> : children}\n </DefaultProvider>\n </DefaultProvider>\n );\n }}\n </ListBoxItem>\n );\n}\n\n// A Context.Provider that only sets a value if not inside SelectValue.\nfunction DefaultProvider({context, value, children}: {context: React.Context<any>, value: any, children: any}) {\n let inSelectValue = useContext(InsideSelectValueContext);\n if (inSelectValue) {\n return children;\n }\n\n return <context.Provider value={value}>{children}</context.Provider>;\n}\n"],"names":[],"version":3,"file":"TabsPicker.mjs.map"}