@react-spectrum/s2 3.0.0-nightly-d87cc4422-250109 → 3.0.0-nightly-e4497fdb6-250110

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 (119) hide show
  1. package/dist/ActionBar.cjs +2 -2
  2. package/dist/ActionBar.css +2 -2
  3. package/dist/ActionBar.mjs +2 -2
  4. package/dist/ActionButton.css +1 -1
  5. package/dist/Breadcrumbs.css +1 -1
  6. package/dist/Button.cjs +133 -98
  7. package/dist/Button.cjs.map +1 -1
  8. package/dist/Button.css +118 -37
  9. package/dist/Button.css.map +1 -1
  10. package/dist/Button.mjs +134 -99
  11. package/dist/Button.mjs.map +1 -1
  12. package/dist/Card.cjs +15 -15
  13. package/dist/Card.css +19 -19
  14. package/dist/Card.mjs +15 -15
  15. package/dist/Checkbox.cjs +1 -1
  16. package/dist/Checkbox.css +3 -3
  17. package/dist/Checkbox.mjs +1 -1
  18. package/dist/CheckboxGroup.cjs +12 -12
  19. package/dist/CheckboxGroup.css +12 -12
  20. package/dist/CheckboxGroup.mjs +12 -12
  21. package/dist/CloseButton.cjs +2 -0
  22. package/dist/CloseButton.cjs.map +1 -1
  23. package/dist/CloseButton.css +9 -1
  24. package/dist/CloseButton.css.map +1 -1
  25. package/dist/CloseButton.mjs +2 -0
  26. package/dist/CloseButton.mjs.map +1 -1
  27. package/dist/ColorField.cjs +8 -8
  28. package/dist/ColorField.css +8 -8
  29. package/dist/ColorField.mjs +8 -8
  30. package/dist/ColorSlider.cjs +10 -10
  31. package/dist/ColorSlider.css +10 -10
  32. package/dist/ColorSlider.mjs +10 -10
  33. package/dist/ComboBox.cjs +12 -12
  34. package/dist/ComboBox.css +13 -13
  35. package/dist/ComboBox.mjs +12 -12
  36. package/dist/Disclosure.css +1 -1
  37. package/dist/Field.cjs +12 -12
  38. package/dist/Field.css +13 -13
  39. package/dist/Field.mjs +12 -12
  40. package/dist/Form.cjs +2 -2
  41. package/dist/Form.css +2 -2
  42. package/dist/Form.mjs +2 -2
  43. package/dist/FullscreenDialog.cjs +5 -5
  44. package/dist/FullscreenDialog.css +22 -22
  45. package/dist/FullscreenDialog.mjs +5 -5
  46. package/dist/IllustratedMessage.cjs +19 -19
  47. package/dist/IllustratedMessage.css +22 -22
  48. package/dist/IllustratedMessage.mjs +19 -19
  49. package/dist/InlineAlert.cjs +13 -13
  50. package/dist/InlineAlert.css +15 -15
  51. package/dist/InlineAlert.mjs +13 -13
  52. package/dist/Link.css +1 -1
  53. package/dist/Menu.cjs +37 -37
  54. package/dist/Menu.css +38 -38
  55. package/dist/Menu.mjs +37 -37
  56. package/dist/Meter.cjs +12 -12
  57. package/dist/Meter.css +12 -12
  58. package/dist/Meter.mjs +12 -12
  59. package/dist/Modal.cjs +4 -4
  60. package/dist/Modal.css +2 -2
  61. package/dist/Modal.mjs +4 -4
  62. package/dist/NumberField.cjs +12 -12
  63. package/dist/NumberField.css +13 -13
  64. package/dist/NumberField.mjs +12 -12
  65. package/dist/Picker.cjs +16 -16
  66. package/dist/Picker.css +17 -17
  67. package/dist/Picker.mjs +16 -16
  68. package/dist/Popover.cjs +10 -10
  69. package/dist/Popover.css +5 -5
  70. package/dist/Popover.mjs +10 -10
  71. package/dist/ProgressBar.cjs +19 -19
  72. package/dist/ProgressBar.css +18 -18
  73. package/dist/ProgressBar.mjs +19 -19
  74. package/dist/Radio.cjs +1 -1
  75. package/dist/Radio.css +3 -3
  76. package/dist/Radio.mjs +1 -1
  77. package/dist/RadioGroup.cjs +12 -12
  78. package/dist/RadioGroup.css +12 -12
  79. package/dist/RadioGroup.mjs +12 -12
  80. package/dist/SearchField.cjs +8 -8
  81. package/dist/SearchField.css +8 -8
  82. package/dist/SearchField.mjs +8 -8
  83. package/dist/SegmentedControl.css +1 -1
  84. package/dist/Slider.cjs +27 -27
  85. package/dist/Slider.css +27 -27
  86. package/dist/Slider.mjs +27 -27
  87. package/dist/Switch.cjs +1 -1
  88. package/dist/Switch.css +3 -3
  89. package/dist/Switch.mjs +1 -1
  90. package/dist/Tabs.css +1 -1
  91. package/dist/TabsPicker.cjs +9 -9
  92. package/dist/TabsPicker.css +10 -10
  93. package/dist/TabsPicker.mjs +9 -9
  94. package/dist/TagGroup.cjs +16 -16
  95. package/dist/TagGroup.css +17 -17
  96. package/dist/TagGroup.mjs +16 -16
  97. package/dist/TextField.cjs +8 -8
  98. package/dist/TextField.css +8 -8
  99. package/dist/TextField.mjs +8 -8
  100. package/dist/Tooltip.cjs +5 -5
  101. package/dist/Tooltip.css +4 -4
  102. package/dist/Tooltip.mjs +5 -5
  103. package/dist/types.d.ts.map +1 -1
  104. package/package.json +19 -19
  105. package/src/Button.tsx +107 -75
  106. package/src/CloseButton.tsx +4 -0
  107. package/style/dist/spectrum-theme.cjs +42 -4
  108. package/style/dist/spectrum-theme.cjs.map +1 -1
  109. package/style/dist/spectrum-theme.mjs +42 -4
  110. package/style/dist/spectrum-theme.mjs.map +1 -1
  111. package/style/dist/style-macro.cjs +1 -1
  112. package/style/dist/style-macro.cjs.map +1 -1
  113. package/style/dist/style-macro.mjs +1 -1
  114. package/style/dist/style-macro.mjs.map +1 -1
  115. package/style/dist/types.d.ts +8 -3
  116. package/style/dist/types.d.ts.map +1 -1
  117. package/style/spectrum-theme.ts +57 -6
  118. package/style/style-macro.ts +3 -3
  119. package/style/types.ts +1 -1
package/dist/Card.css CHANGED
@@ -198,7 +198,7 @@
198
198
  }
199
199
 
200
200
  ._Pa {
201
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter;
201
+ transition-property: color, background-color, var(--gp), border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, translate, scale, rotate, filter, backdrop-filter;
202
202
  }
203
203
 
204
204
  ._R-375x7f {
@@ -277,19 +277,19 @@
277
277
  color: var(--lightningcss-light, #131313) var(--lightningcss-dark, #f2f2f2);
278
278
  }
279
279
 
280
- .__b-4k3jmv {
280
+ .__b-n3jmuj {
281
281
  grid-column-start: title;
282
282
  }
283
283
 
284
- .__c-4k3jmv {
284
+ .__c-n3jmuj {
285
285
  grid-column-end: title;
286
286
  }
287
287
 
288
- .__d-4k3jmv {
288
+ .__d-n3jmuj {
289
289
  grid-row-start: title;
290
290
  }
291
291
 
292
- .__e-4k3jmv {
292
+ .__e-n3jmuj {
293
293
  grid-row-end: title;
294
294
  }
295
295
 
@@ -334,27 +334,27 @@
334
334
  overflow: hidden;
335
335
  }
336
336
 
337
- .__b-14f9fux {
337
+ .__b-siegel {
338
338
  grid-column-start: description;
339
339
  }
340
340
 
341
- .__c-14f9fux {
341
+ .__c-siegel {
342
342
  grid-column-end: description;
343
343
  }
344
344
 
345
- .__d-14f9fux {
345
+ .__d-siegel {
346
346
  grid-row-start: description;
347
347
  }
348
348
 
349
- .__e-14f9fux {
349
+ .__e-siegel {
350
350
  grid-row-end: description;
351
351
  }
352
352
 
353
- .__i-375yi6 {
353
+ .__i-2wzs0i {
354
354
  grid-template-columns: 1fr;
355
355
  }
356
356
 
357
- .__k-1272nor {
357
+ .__k-zzcrsj {
358
358
  grid-template-areas: "title"
359
359
  "description";
360
360
  }
@@ -383,19 +383,19 @@
383
383
  padding-bottom: calc(var(--card-spacing) * 1.5 / 2);
384
384
  }
385
385
 
386
- .__b-ykmrkq {
386
+ .__b-qe0xa6 {
387
387
  grid-column-start: menu;
388
388
  }
389
389
 
390
- .__c-ykmrkq {
390
+ .__c-qe0xa6 {
391
391
  grid-column-end: menu;
392
392
  }
393
393
 
394
- .__d-ykmrkq {
394
+ .__d-qe0xa6 {
395
395
  grid-row-start: menu;
396
396
  }
397
397
 
398
- .__e-ykmrkq {
398
+ .__e-qe0xa6 {
399
399
  grid-row-end: menu;
400
400
  }
401
401
 
@@ -503,7 +503,7 @@
503
503
  display: grid;
504
504
  }
505
505
 
506
- .__i-1hkn3tr {
506
+ .__i-1ag8o0z {
507
507
  grid-template-columns: repeat(3, 1fr);
508
508
  }
509
509
 
@@ -716,11 +716,11 @@
716
716
  line-height: 1.7;
717
717
  }
718
718
 
719
- .__i-8mtrwf-ho9dum:has([data-slot="menu"]) {
719
+ .__i-8mtrwf-llayyu:has([data-slot="menu"]) {
720
720
  grid-template-columns: minmax(0, 1fr) auto;
721
721
  }
722
722
 
723
- .__k-8mtrwf-1h7qlgk:has([data-slot="menu"]) {
723
+ .__k-8mtrwf-1iiwk5o:has([data-slot="menu"]) {
724
724
  grid-template-areas: "title menu"
725
725
  "description description";
726
726
  }
@@ -737,7 +737,7 @@
737
737
  aspect-ratio: 3 / 2;
738
738
  }
739
739
 
740
- .__c-7ptyxf-7u9dhm:nth-last-child(4):first-child {
740
+ .__c-7ptyxf-yqnecu:nth-last-child(4):first-child {
741
741
  grid-column-end: span 3;
742
742
  }
743
743
 
package/dist/Card.mjs CHANGED
@@ -282,10 +282,10 @@ let $68e4e6fe083e22fd$var$title = function anonymous(props) {
282
282
  rules += ' _ga';
283
283
  rules += ' ao';
284
284
  rules += ' _o-3t20';
285
- rules += ' __b-4k3jmv';
286
- rules += ' __c-4k3jmv';
287
- rules += ' __d-4k3jmv';
288
- rules += ' __e-4k3jmv';
285
+ rules += ' __b-n3jmuj';
286
+ rules += ' __c-n3jmuj';
287
+ rules += ' __d-n3jmuj';
288
+ rules += ' __e-n3jmuj';
289
289
  return rules;
290
290
  };
291
291
  let $68e4e6fe083e22fd$var$description = function anonymous(props) {
@@ -319,19 +319,19 @@ let $68e4e6fe083e22fd$var$description = function anonymous(props) {
319
319
  rules += ' _gb';
320
320
  rules += ' an';
321
321
  rules += ' _o-3t20';
322
- rules += ' __b-14f9fux';
323
- rules += ' __c-14f9fux';
324
- rules += ' __d-14f9fux';
325
- rules += ' __e-14f9fux';
322
+ rules += ' __b-siegel';
323
+ rules += ' __c-siegel';
324
+ rules += ' __d-siegel';
325
+ rules += ' __e-siegel';
326
326
  return rules;
327
327
  };
328
328
  let $68e4e6fe083e22fd$var$content = function anonymous(props) {
329
329
  let rules = " .";
330
330
  rules += ' _0f';
331
- rules += ' __i-8mtrwf-ho9dum';
332
- rules += ' __i-375yi6';
333
- rules += ' __k-8mtrwf-1h7qlgk';
334
- rules += ' __k-1272nor';
331
+ rules += ' __i-8mtrwf-llayyu';
332
+ rules += ' __i-2wzs0i';
333
+ rules += ' __k-8mtrwf-1iiwk5o';
334
+ rules += ' __k-zzcrsj';
335
335
  rules += ' jc';
336
336
  rules += ' __a-3t1y';
337
337
  rules += ' _2d';
@@ -347,7 +347,7 @@ let $68e4e6fe083e22fd$var$content = function anonymous(props) {
347
347
  rules += ' F-sh5t6w';
348
348
  return rules;
349
349
  };
350
- let $68e4e6fe083e22fd$var$actionMenu = " . __b-ykmrkq __c-ykmrkq __d-ykmrkq __e-ykmrkq A-1rxwibp B-1rxwibp";
350
+ let $68e4e6fe083e22fd$var$actionMenu = " . __b-qe0xa6 __c-qe0xa6 __d-qe0xa6 __e-qe0xa6 A-1rxwibp B-1rxwibp";
351
351
  let $68e4e6fe083e22fd$var$footer = " . _0d _7a _2b _3e id jd E-sh5t6w";
352
352
  const $68e4e6fe083e22fd$export$cb658fed5fefe1d = /*#__PURE__*/ (0, $jzFZE$createContext)('div');
353
353
  const $68e4e6fe083e22fd$export$d0b2ee33ebf7d64 = /*#__PURE__*/ (0, $jzFZE$createContext)(null);
@@ -558,7 +558,7 @@ const $68e4e6fe083e22fd$export$115f017852a4bb7c = /*#__PURE__*/ (0, $jzFZE$forwa
558
558
  const $68e4e6fe083e22fd$var$collection = function anonymous(props) {
559
559
  let rules = " .";
560
560
  rules += ' _0f';
561
- rules += ' __i-1hkn3tr';
561
+ rules += ' __i-1ag8o0z';
562
562
  if (props.size === "S") rules += ' ib';
563
563
  else if (props.size === "XS") rules += ' ib';
564
564
  else rules += ' ic';
@@ -567,7 +567,7 @@ const $68e4e6fe083e22fd$var$collection = function anonymous(props) {
567
567
  else rules += ' jc';
568
568
  return rules;
569
569
  };
570
- const $68e4e6fe083e22fd$var$collectionImage = " . lb _cb _c-7ptyxf-375yqh __c-7ptyxf-7u9dhm __Ob __Ca __Ea";
570
+ const $68e4e6fe083e22fd$var$collectionImage = " . lb _cb _c-7ptyxf-375yqh __c-7ptyxf-yqnecu __Ob __Ca __Ea";
571
571
  const $68e4e6fe083e22fd$export$c368ea3e577b1b86 = /*#__PURE__*/ (0, $jzFZE$forwardRef)(function CollectionCardPreview(props, ref) {
572
572
  let { size: size } = (0, $jzFZE$useContext)($68e4e6fe083e22fd$var$InternalCardContext);
573
573
  return /*#__PURE__*/ (0, $jzFZE$jsx)($68e4e6fe083e22fd$export$115f017852a4bb7c, {
package/dist/Checkbox.cjs CHANGED
@@ -94,7 +94,7 @@ const $af04e099a53d3e85$var$wrapper = function anonymous(props, overrides) {
94
94
  rules += ' _R-375x7f';
95
95
  rules += ' _Sa';
96
96
  if (!$__b) {
97
- if (props.isInForm) rules += ' __b-4a7c5l';
97
+ if (props.isInForm) rules += ' __b-e10s0d';
98
98
  }
99
99
  rules += ' __S-yksgrp';
100
100
  return rules;
package/dist/Checkbox.css CHANGED
@@ -58,10 +58,10 @@
58
58
  }
59
59
 
60
60
  ._Pb {
61
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
61
+ transition-property: color, background-color, var(--gp), border-color, text-decoration-color, fill, stroke;
62
62
  }
63
63
 
64
- .__b-4a7c5l {
64
+ .__b-e10s0d {
65
65
  grid-column-start: field;
66
66
  }
67
67
 
@@ -178,7 +178,7 @@
178
178
  }
179
179
 
180
180
  ._Pa {
181
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter;
181
+ transition-property: color, background-color, var(--gp), border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, translate, scale, rotate, filter, backdrop-filter;
182
182
  }
183
183
 
184
184
  ._R-375x7f {
package/dist/Checkbox.mjs CHANGED
@@ -85,7 +85,7 @@ const $9b405e0f8095dce0$var$wrapper = function anonymous(props, overrides) {
85
85
  rules += ' _R-375x7f';
86
86
  rules += ' _Sa';
87
87
  if (!$__b) {
88
- if (props.isInForm) rules += ' __b-4a7c5l';
88
+ if (props.isInForm) rules += ' __b-e10s0d';
89
89
  }
90
90
  rules += ' __S-yksgrp';
91
91
  return rules;
@@ -60,18 +60,18 @@ const $883687908275b504$export$4aa08d5625cb8ead = /*#__PURE__*/ (0, $7mIZM$react
60
60
  }
61
61
  if (!$__c) {
62
62
  if (props.isInForm) {
63
- if (props.labelPosition === "side") rules += ' __c-7u9dhl';
63
+ if (props.labelPosition === "side") rules += ' __c-yqnebx';
64
64
  }
65
65
  }
66
- if (props.isInForm) rules += ' __i-1cwd7ud';
66
+ if (props.isInForm) rules += ' __i-1a97rzt';
67
67
  else {
68
- if (props.labelPosition === "side") rules += ' __i-jyg4vb';
69
- else if (props.labelPosition === "top") rules += ' __i-375yi6';
68
+ if (props.labelPosition === "side") rules += ' __i-ar5vcf';
69
+ else if (props.labelPosition === "top") rules += ' __i-2wzs0i';
70
70
  }
71
- if (props.labelPosition === "side") rules += ' __j-jyg4vb';
72
- else if (props.labelPosition === "top") rules += ' __j-fdenls';
73
- if (props.labelPosition === "side") rules += ' __k-5eez8j';
74
- else if (props.labelPosition === "top") rules += ' __k-xlaqir';
71
+ if (props.labelPosition === "side") rules += ' __j-ar5vcf';
72
+ else if (props.labelPosition === "top") rules += ' __j-1a6w430';
73
+ if (props.labelPosition === "side") rules += ' __k-18h2yqz';
74
+ else if (props.labelPosition === "top") rules += ' __k-1srn173';
75
75
  if (props.size === "XL") {
76
76
  rules += ' _ebj';
77
77
  rules += ' _ei';
@@ -120,10 +120,10 @@ const $883687908275b504$export$4aa08d5625cb8ead = /*#__PURE__*/ (0, $7mIZM$react
120
120
  /*#__PURE__*/ (0, $7mIZM$reactjsxruntime.jsx)("div", {
121
121
  className: function anonymous(props) {
122
122
  let rules = " .";
123
- rules += ' __b-4cfph1';
124
- rules += ' __c-4cfph1';
125
- rules += ' __d-4cfph1';
126
- rules += ' __e-4cfph1';
123
+ rules += ' __b-g2ozi1';
124
+ rules += ' __c-g2ozi1';
125
+ rules += ' __d-g2ozi1';
126
+ rules += ' __e-g2ozi1';
127
127
  rules += ' _0d';
128
128
  if (props.orientation === "horizontal") rules += ' _7a';
129
129
  else if (props.orientation === "vertical") rules += ' _7b';
@@ -7,37 +7,37 @@
7
7
  grid-column-start: 1;
8
8
  }
9
9
 
10
- .__c-7u9dhl {
10
+ .__c-yqnebx {
11
11
  grid-column-end: span 2;
12
12
  }
13
13
 
14
- .__i-375yi6 {
14
+ .__i-2wzs0i {
15
15
  grid-template-columns: 1fr;
16
16
  }
17
17
 
18
- .__i-jyg4vb {
18
+ .__i-ar5vcf {
19
19
  grid-template-columns: auto 1fr;
20
20
  }
21
21
 
22
- .__i-1cwd7ud {
22
+ .__i-1a97rzt {
23
23
  grid-template-columns: subgrid;
24
24
  }
25
25
 
26
- .__j-fdenls {
26
+ .__j-1a6w430 {
27
27
  grid-template-rows: auto 1fr auto;
28
28
  }
29
29
 
30
- .__j-jyg4vb {
30
+ .__j-ar5vcf {
31
31
  grid-template-rows: auto 1fr;
32
32
  }
33
33
 
34
- .__k-xlaqir {
34
+ .__k-1srn173 {
35
35
  grid-template-areas: "label"
36
36
  "input"
37
37
  "helptext";
38
38
  }
39
39
 
40
- .__k-5eez8j {
40
+ .__k-18h2yqz {
41
41
  grid-template-areas: "label input"
42
42
  "label helptext";
43
43
  }
@@ -98,19 +98,19 @@
98
98
  -webkit-tap-highlight-color: #0000;
99
99
  }
100
100
 
101
- .__b-4cfph1 {
101
+ .__b-g2ozi1 {
102
102
  grid-column-start: input;
103
103
  }
104
104
 
105
- .__c-4cfph1 {
105
+ .__c-g2ozi1 {
106
106
  grid-column-end: input;
107
107
  }
108
108
 
109
- .__d-4cfph1 {
109
+ .__d-g2ozi1 {
110
110
  grid-row-start: input;
111
111
  }
112
112
 
113
- .__e-4cfph1 {
113
+ .__e-g2ozi1 {
114
114
  grid-row-end: input;
115
115
  }
116
116
 
@@ -53,18 +53,18 @@ const $4f43ac2b11e2df05$export$4aa08d5625cb8ead = /*#__PURE__*/ (0, $2n9bC$forwa
53
53
  }
54
54
  if (!$__c) {
55
55
  if (props.isInForm) {
56
- if (props.labelPosition === "side") rules += ' __c-7u9dhl';
56
+ if (props.labelPosition === "side") rules += ' __c-yqnebx';
57
57
  }
58
58
  }
59
- if (props.isInForm) rules += ' __i-1cwd7ud';
59
+ if (props.isInForm) rules += ' __i-1a97rzt';
60
60
  else {
61
- if (props.labelPosition === "side") rules += ' __i-jyg4vb';
62
- else if (props.labelPosition === "top") rules += ' __i-375yi6';
61
+ if (props.labelPosition === "side") rules += ' __i-ar5vcf';
62
+ else if (props.labelPosition === "top") rules += ' __i-2wzs0i';
63
63
  }
64
- if (props.labelPosition === "side") rules += ' __j-jyg4vb';
65
- else if (props.labelPosition === "top") rules += ' __j-fdenls';
66
- if (props.labelPosition === "side") rules += ' __k-5eez8j';
67
- else if (props.labelPosition === "top") rules += ' __k-xlaqir';
64
+ if (props.labelPosition === "side") rules += ' __j-ar5vcf';
65
+ else if (props.labelPosition === "top") rules += ' __j-1a6w430';
66
+ if (props.labelPosition === "side") rules += ' __k-18h2yqz';
67
+ else if (props.labelPosition === "top") rules += ' __k-1srn173';
68
68
  if (props.size === "XL") {
69
69
  rules += ' _ebj';
70
70
  rules += ' _ei';
@@ -113,10 +113,10 @@ const $4f43ac2b11e2df05$export$4aa08d5625cb8ead = /*#__PURE__*/ (0, $2n9bC$forwa
113
113
  /*#__PURE__*/ (0, $2n9bC$jsx)("div", {
114
114
  className: function anonymous(props) {
115
115
  let rules = " .";
116
- rules += ' __b-4cfph1';
117
- rules += ' __c-4cfph1';
118
- rules += ' __d-4cfph1';
119
- rules += ' __e-4cfph1';
116
+ rules += ' __b-g2ozi1';
117
+ rules += ' __c-g2ozi1';
118
+ rules += ' __d-g2ozi1';
119
+ rules += ' __e-g2ozi1';
120
120
  rules += ' _0d';
121
121
  if (props.orientation === "horizontal") rules += ' _7a';
122
122
  else if (props.orientation === "vertical") rules += ' _7b';
@@ -99,6 +99,8 @@ const $2f907cb84c6e9e75$var$styles = function anonymous(props, overrides) {
99
99
  if (props.isStaticColor) rules += ' b_____y';
100
100
  else rules += ' bh';
101
101
  } else rules += ' ba';
102
+ if (props.isDisabled) rules += ' -rwx0fg_a-a_____O';
103
+ else rules += ' -rwx0fg_a-a_____K';
102
104
  if (props.isStaticColor) {
103
105
  if (props.isDisabled) rules += ' -rwx0fg_a-_____A';
104
106
  else {
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;AA0BD,MAAM,wCAAkB;IACtB,SAAS;IACT,eAAe;AACjB;AAEA,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCC,MAAM,0DAAqB,CAAA,GAAA,0BAAY,EAAwE;AAK/G,MAAM,0DAAc,CAAA,GAAA,uBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAAoC;IACtH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,gBAAC,YAAY,oBAAE,mBAAmB,IAAG,GAAG;IAC5C,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE;IAC7B,IAAI,kBAAkB,CAAA,GAAA,gDAA0B,EAAE,CAAA,GAAA,mDAAW,GAAG;IAChE,qBACE,gCAAC,CAAA,GAAA,iCAAK;QACH,GAAG,KAAK;QACT,KAAK;QACL,MAAK;QACL,cAAY,KAAK,CAAC,aAAa,IAAI,gBAAgB,MAAM,CAAC;QAC1D,OAAO,CAAA,GAAA,oCAAS,EAAE,QAAQ;QAC1B,WAAW,CAAA,cAAe,mBAAmB,6BAAO;gBAAC,GAAG,WAAW;gBAAE,aAAa,MAAM,WAAW;gBAAE,eAAe,CAAC,CAAC,MAAM,WAAW;YAAA,GAAG,MAAM,MAAM;kBACtJ,cAAA,gCAAC,CAAA,GAAA,iCAAQ;YAAE,MAAM,AAAC;gBAAC,GAAG;gBAAK,GAAG;gBAAM,GAAG;gBAAO,IAAI;YAAM,CAAW,CAAC,MAAM,IAAI,IAAI,IAAI;;;AAG5F","sources":["packages/@react-spectrum/s2/src/CloseButton.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 {baseColor, focusRing, style} from '../style' with {type: 'macro'};\nimport {Button, ButtonProps, ContextValue} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport CrossIcon from '../ui-icons/Cross';\nimport {FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, staticColor, StyleProps} from './style-utils' with {type: 'macro'};\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {pressScale} from './pressScale';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface CloseButtonProps extends Pick<ButtonProps, 'isDisabled' | 'onPress'>, StyleProps {\n /**\n * The size of the CloseButton.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /** The static color style to apply. Useful when the Button appears over a color background. */\n staticColor?: 'white' | 'black' | 'auto'\n}\n\nconst hoverBackground = {\n default: 'gray-200',\n isStaticColor: 'transparent-overlay-200'\n} as const;\n\nconst styles = style({\n ...focusRing(),\n ...staticColor(),\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n size: 'control',\n flexShrink: 0,\n borderRadius: 'full',\n padding: 0,\n borderStyle: 'none',\n transition: 'default',\n backgroundColor: {\n default: 'transparent',\n isHovered: hoverBackground,\n isFocusVisible: hoverBackground,\n isPressed: hoverBackground\n },\n '--iconPrimary': {\n type: 'color',\n value: {\n default: 'neutral',\n isDisabled: 'disabled',\n isStaticColor: {\n default: baseColor('transparent-overlay-800'),\n isDisabled: 'transparent-overlay-400'\n }\n }\n },\n outlineColor: {\n default: 'focus-ring',\n isStaticColor: 'transparent-overlay-1000',\n forcedColors: 'Highlight'\n }\n}, getAllowedOverrides());\n\nexport const CloseButtonContext = createContext<ContextValue<CloseButtonProps, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * A CloseButton allows a user to dismiss a dialog.\n */\nexport const CloseButton = forwardRef(function CloseButton(props: CloseButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, CloseButtonContext);\n let {UNSAFE_style, UNSAFE_className = ''} = props;\n let domRef = useFocusableRef(ref);\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n return (\n <Button\n {...props}\n ref={domRef}\n slot=\"close\"\n aria-label={props['aria-label'] || stringFormatter.format('dialog.dismiss')}\n style={pressScale(domRef, UNSAFE_style)}\n className={renderProps => UNSAFE_className + styles({...renderProps, staticColor: props.staticColor, isStaticColor: !!props.staticColor}, props.styles)}>\n <CrossIcon size={({S: 'L', M: 'XL', L: 'XXL', XL: 'XXXL'} as const)[props.size || 'M']} />\n </Button>\n );\n});\n"],"names":[],"version":3,"file":"CloseButton.cjs.map"}
1
+ {"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;AA0BD,MAAM,wCAAkB;IACtB,SAAS;IACT,eAAe;AACjB;AAEA,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCC,MAAM,0DAAqB,CAAA,GAAA,0BAAY,EAAwE;AAK/G,MAAM,0DAAc,CAAA,GAAA,uBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAAoC;IACtH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,gBAAC,YAAY,oBAAE,mBAAmB,IAAG,GAAG;IAC5C,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE;IAC7B,IAAI,kBAAkB,CAAA,GAAA,gDAA0B,EAAE,CAAA,GAAA,mDAAW,GAAG;IAChE,qBACE,gCAAC,CAAA,GAAA,iCAAK;QACH,GAAG,KAAK;QACT,KAAK;QACL,MAAK;QACL,cAAY,KAAK,CAAC,aAAa,IAAI,gBAAgB,MAAM,CAAC;QAC1D,OAAO,CAAA,GAAA,oCAAS,EAAE,QAAQ;QAC1B,WAAW,CAAA,cAAe,mBAAmB,6BAAO;gBAAC,GAAG,WAAW;gBAAE,aAAa,MAAM,WAAW;gBAAE,eAAe,CAAC,CAAC,MAAM,WAAW;YAAA,GAAG,MAAM,MAAM;kBACtJ,cAAA,gCAAC,CAAA,GAAA,iCAAQ;YAAE,MAAM,AAAC;gBAAC,GAAG;gBAAK,GAAG;gBAAM,GAAG;gBAAO,IAAI;YAAM,CAAW,CAAC,MAAM,IAAI,IAAI,IAAI;;;AAG5F","sources":["packages/@react-spectrum/s2/src/CloseButton.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 {baseColor, focusRing, style} from '../style' with {type: 'macro'};\nimport {Button, ButtonProps, ContextValue} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport CrossIcon from '../ui-icons/Cross';\nimport {FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, staticColor, StyleProps} from './style-utils' with {type: 'macro'};\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {pressScale} from './pressScale';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface CloseButtonProps extends Pick<ButtonProps, 'isDisabled' | 'onPress'>, StyleProps {\n /**\n * The size of the CloseButton.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /** The static color style to apply. Useful when the Button appears over a color background. */\n staticColor?: 'white' | 'black' | 'auto'\n}\n\nconst hoverBackground = {\n default: 'gray-200',\n isStaticColor: 'transparent-overlay-200'\n} as const;\n\nconst styles = style({\n ...focusRing(),\n ...staticColor(),\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n size: 'control',\n flexShrink: 0,\n borderRadius: 'full',\n padding: 0,\n borderStyle: 'none',\n transition: 'default',\n backgroundColor: {\n default: 'transparent',\n isHovered: hoverBackground,\n isFocusVisible: hoverBackground,\n isPressed: hoverBackground\n },\n '--iconPrimary': {\n type: 'color',\n value: {\n default: 'neutral',\n isDisabled: 'disabled',\n isStaticColor: {\n default: baseColor('transparent-overlay-800'),\n isDisabled: 'transparent-overlay-400'\n },\n forcedColors: {\n default: 'ButtonText',\n isDisabled: 'GrayText'\n }\n }\n },\n outlineColor: {\n default: 'focus-ring',\n isStaticColor: 'transparent-overlay-1000',\n forcedColors: 'Highlight'\n }\n}, getAllowedOverrides());\n\nexport const CloseButtonContext = createContext<ContextValue<CloseButtonProps, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * A CloseButton allows a user to dismiss a dialog.\n */\nexport const CloseButton = forwardRef(function CloseButton(props: CloseButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, CloseButtonContext);\n let {UNSAFE_style, UNSAFE_className = ''} = props;\n let domRef = useFocusableRef(ref);\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n return (\n <Button\n {...props}\n ref={domRef}\n slot=\"close\"\n aria-label={props['aria-label'] || stringFormatter.format('dialog.dismiss')}\n style={pressScale(domRef, UNSAFE_style)}\n className={renderProps => UNSAFE_className + styles({...renderProps, staticColor: props.staticColor, isStaticColor: !!props.staticColor}, props.styles)}>\n <CrossIcon size={({S: 'L', M: 'XL', L: 'XXL', XL: 'XXXL'} as const)[props.size || 'M']} />\n </Button>\n );\n});\n"],"names":[],"version":3,"file":"CloseButton.cjs.map"}
@@ -128,7 +128,7 @@
128
128
  }
129
129
 
130
130
  ._Pa {
131
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter;
131
+ transition-property: color, background-color, var(--gp), border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, translate, scale, rotate, filter, backdrop-filter;
132
132
  }
133
133
 
134
134
  ._R-375x7f {
@@ -183,6 +183,14 @@
183
183
  .da_____M {
184
184
  outline-color: highlight;
185
185
  }
186
+
187
+ .-rwx0fg_a-a_____K {
188
+ --iconPrimary: ButtonText;
189
+ }
190
+
191
+ .-rwx0fg_a-a_____O {
192
+ --iconPrimary: GrayText;
193
+ }
186
194
  }
187
195
  }
188
196
  /*# sourceMappingURL=CloseButton.css.map */
@@ -1 +1 @@
1
- {"mappings":"AAyCe;;;;AAAA;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA;;AAAA;EAAA;IAAA","sources":["packages/@react-spectrum/s2/src/CloseButton.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 {baseColor, focusRing, style} from '../style' with {type: 'macro'};\nimport {Button, ButtonProps, ContextValue} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport CrossIcon from '../ui-icons/Cross';\nimport {FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, staticColor, StyleProps} from './style-utils' with {type: 'macro'};\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {pressScale} from './pressScale';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface CloseButtonProps extends Pick<ButtonProps, 'isDisabled' | 'onPress'>, StyleProps {\n /**\n * The size of the CloseButton.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /** The static color style to apply. Useful when the Button appears over a color background. */\n staticColor?: 'white' | 'black' | 'auto'\n}\n\nconst hoverBackground = {\n default: 'gray-200',\n isStaticColor: 'transparent-overlay-200'\n} as const;\n\nconst styles = style({\n ...focusRing(),\n ...staticColor(),\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n size: 'control',\n flexShrink: 0,\n borderRadius: 'full',\n padding: 0,\n borderStyle: 'none',\n transition: 'default',\n backgroundColor: {\n default: 'transparent',\n isHovered: hoverBackground,\n isFocusVisible: hoverBackground,\n isPressed: hoverBackground\n },\n '--iconPrimary': {\n type: 'color',\n value: {\n default: 'neutral',\n isDisabled: 'disabled',\n isStaticColor: {\n default: baseColor('transparent-overlay-800'),\n isDisabled: 'transparent-overlay-400'\n }\n }\n },\n outlineColor: {\n default: 'focus-ring',\n isStaticColor: 'transparent-overlay-1000',\n forcedColors: 'Highlight'\n }\n}, getAllowedOverrides());\n\nexport const CloseButtonContext = createContext<ContextValue<CloseButtonProps, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * A CloseButton allows a user to dismiss a dialog.\n */\nexport const CloseButton = forwardRef(function CloseButton(props: CloseButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, CloseButtonContext);\n let {UNSAFE_style, UNSAFE_className = ''} = props;\n let domRef = useFocusableRef(ref);\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n return (\n <Button\n {...props}\n ref={domRef}\n slot=\"close\"\n aria-label={props['aria-label'] || stringFormatter.format('dialog.dismiss')}\n style={pressScale(domRef, UNSAFE_style)}\n className={renderProps => UNSAFE_className + styles({...renderProps, staticColor: props.staticColor, isStaticColor: !!props.staticColor}, props.styles)}>\n <CrossIcon size={({S: 'L', M: 'XL', L: 'XXL', XL: 'XXXL'} as const)[props.size || 'M']} />\n </Button>\n );\n});\n"],"names":[],"version":3,"file":"CloseButton.css.map"}
1
+ {"mappings":"AAyCe;;;;AAAA;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA","sources":["packages/@react-spectrum/s2/src/CloseButton.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 {baseColor, focusRing, style} from '../style' with {type: 'macro'};\nimport {Button, ButtonProps, ContextValue} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport CrossIcon from '../ui-icons/Cross';\nimport {FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, staticColor, StyleProps} from './style-utils' with {type: 'macro'};\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {pressScale} from './pressScale';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface CloseButtonProps extends Pick<ButtonProps, 'isDisabled' | 'onPress'>, StyleProps {\n /**\n * The size of the CloseButton.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /** The static color style to apply. Useful when the Button appears over a color background. */\n staticColor?: 'white' | 'black' | 'auto'\n}\n\nconst hoverBackground = {\n default: 'gray-200',\n isStaticColor: 'transparent-overlay-200'\n} as const;\n\nconst styles = style({\n ...focusRing(),\n ...staticColor(),\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n size: 'control',\n flexShrink: 0,\n borderRadius: 'full',\n padding: 0,\n borderStyle: 'none',\n transition: 'default',\n backgroundColor: {\n default: 'transparent',\n isHovered: hoverBackground,\n isFocusVisible: hoverBackground,\n isPressed: hoverBackground\n },\n '--iconPrimary': {\n type: 'color',\n value: {\n default: 'neutral',\n isDisabled: 'disabled',\n isStaticColor: {\n default: baseColor('transparent-overlay-800'),\n isDisabled: 'transparent-overlay-400'\n },\n forcedColors: {\n default: 'ButtonText',\n isDisabled: 'GrayText'\n }\n }\n },\n outlineColor: {\n default: 'focus-ring',\n isStaticColor: 'transparent-overlay-1000',\n forcedColors: 'Highlight'\n }\n}, getAllowedOverrides());\n\nexport const CloseButtonContext = createContext<ContextValue<CloseButtonProps, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * A CloseButton allows a user to dismiss a dialog.\n */\nexport const CloseButton = forwardRef(function CloseButton(props: CloseButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, CloseButtonContext);\n let {UNSAFE_style, UNSAFE_className = ''} = props;\n let domRef = useFocusableRef(ref);\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n return (\n <Button\n {...props}\n ref={domRef}\n slot=\"close\"\n aria-label={props['aria-label'] || stringFormatter.format('dialog.dismiss')}\n style={pressScale(domRef, UNSAFE_style)}\n className={renderProps => UNSAFE_className + styles({...renderProps, staticColor: props.staticColor, isStaticColor: !!props.staticColor}, props.styles)}>\n <CrossIcon size={({S: 'L', M: 'XL', L: 'XXL', XL: 'XXXL'} as const)[props.size || 'M']} />\n </Button>\n );\n});\n"],"names":[],"version":3,"file":"CloseButton.css.map"}
@@ -93,6 +93,8 @@ const $a9cda54c4f47ce52$var$styles = function anonymous(props, overrides) {
93
93
  if (props.isStaticColor) rules += ' b_____y';
94
94
  else rules += ' bh';
95
95
  } else rules += ' ba';
96
+ if (props.isDisabled) rules += ' -rwx0fg_a-a_____O';
97
+ else rules += ' -rwx0fg_a-a_____K';
96
98
  if (props.isStaticColor) {
97
99
  if (props.isDisabled) rules += ' -rwx0fg_a-_____A';
98
100
  else {
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;AA0BD,MAAM,wCAAkB;IACtB,SAAS;IACT,eAAe;AACjB;AAEA,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCC,MAAM,0DAAqB,CAAA,GAAA,oBAAY,EAAwE;AAK/G,MAAM,0DAAc,CAAA,GAAA,iBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAAoC;IACtH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,gBAAC,YAAY,oBAAE,mBAAmB,IAAG,GAAG;IAC5C,IAAI,SAAS,CAAA,GAAA,sBAAc,EAAE;IAC7B,IAAI,kBAAkB,CAAA,GAAA,kCAA0B,EAAE,CAAA,GAAA,+CAAW,GAAG;IAChE,qBACE,gBAAC,CAAA,GAAA,aAAK;QACH,GAAG,KAAK;QACT,KAAK;QACL,MAAK;QACL,cAAY,KAAK,CAAC,aAAa,IAAI,gBAAgB,MAAM,CAAC;QAC1D,OAAO,CAAA,GAAA,yCAAS,EAAE,QAAQ;QAC1B,WAAW,CAAA,cAAe,mBAAmB,6BAAO;gBAAC,GAAG,WAAW;gBAAE,aAAa,MAAM,WAAW;gBAAE,eAAe,CAAC,CAAC,MAAM,WAAW;YAAA,GAAG,MAAM,MAAM;kBACtJ,cAAA,gBAAC,CAAA,GAAA,wCAAQ;YAAE,MAAM,AAAC;gBAAC,GAAG;gBAAK,GAAG;gBAAM,GAAG;gBAAO,IAAI;YAAM,CAAW,CAAC,MAAM,IAAI,IAAI,IAAI;;;AAG5F","sources":["packages/@react-spectrum/s2/src/CloseButton.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 {baseColor, focusRing, style} from '../style' with {type: 'macro'};\nimport {Button, ButtonProps, ContextValue} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport CrossIcon from '../ui-icons/Cross';\nimport {FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, staticColor, StyleProps} from './style-utils' with {type: 'macro'};\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {pressScale} from './pressScale';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface CloseButtonProps extends Pick<ButtonProps, 'isDisabled' | 'onPress'>, StyleProps {\n /**\n * The size of the CloseButton.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /** The static color style to apply. Useful when the Button appears over a color background. */\n staticColor?: 'white' | 'black' | 'auto'\n}\n\nconst hoverBackground = {\n default: 'gray-200',\n isStaticColor: 'transparent-overlay-200'\n} as const;\n\nconst styles = style({\n ...focusRing(),\n ...staticColor(),\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n size: 'control',\n flexShrink: 0,\n borderRadius: 'full',\n padding: 0,\n borderStyle: 'none',\n transition: 'default',\n backgroundColor: {\n default: 'transparent',\n isHovered: hoverBackground,\n isFocusVisible: hoverBackground,\n isPressed: hoverBackground\n },\n '--iconPrimary': {\n type: 'color',\n value: {\n default: 'neutral',\n isDisabled: 'disabled',\n isStaticColor: {\n default: baseColor('transparent-overlay-800'),\n isDisabled: 'transparent-overlay-400'\n }\n }\n },\n outlineColor: {\n default: 'focus-ring',\n isStaticColor: 'transparent-overlay-1000',\n forcedColors: 'Highlight'\n }\n}, getAllowedOverrides());\n\nexport const CloseButtonContext = createContext<ContextValue<CloseButtonProps, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * A CloseButton allows a user to dismiss a dialog.\n */\nexport const CloseButton = forwardRef(function CloseButton(props: CloseButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, CloseButtonContext);\n let {UNSAFE_style, UNSAFE_className = ''} = props;\n let domRef = useFocusableRef(ref);\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n return (\n <Button\n {...props}\n ref={domRef}\n slot=\"close\"\n aria-label={props['aria-label'] || stringFormatter.format('dialog.dismiss')}\n style={pressScale(domRef, UNSAFE_style)}\n className={renderProps => UNSAFE_className + styles({...renderProps, staticColor: props.staticColor, isStaticColor: !!props.staticColor}, props.styles)}>\n <CrossIcon size={({S: 'L', M: 'XL', L: 'XXL', XL: 'XXXL'} as const)[props.size || 'M']} />\n </Button>\n );\n});\n"],"names":[],"version":3,"file":"CloseButton.mjs.map"}
1
+ {"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;AA0BD,MAAM,wCAAkB;IACtB,SAAS;IACT,eAAe;AACjB;AAEA,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCC,MAAM,0DAAqB,CAAA,GAAA,oBAAY,EAAwE;AAK/G,MAAM,0DAAc,CAAA,GAAA,iBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAAoC;IACtH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,gBAAC,YAAY,oBAAE,mBAAmB,IAAG,GAAG;IAC5C,IAAI,SAAS,CAAA,GAAA,sBAAc,EAAE;IAC7B,IAAI,kBAAkB,CAAA,GAAA,kCAA0B,EAAE,CAAA,GAAA,+CAAW,GAAG;IAChE,qBACE,gBAAC,CAAA,GAAA,aAAK;QACH,GAAG,KAAK;QACT,KAAK;QACL,MAAK;QACL,cAAY,KAAK,CAAC,aAAa,IAAI,gBAAgB,MAAM,CAAC;QAC1D,OAAO,CAAA,GAAA,yCAAS,EAAE,QAAQ;QAC1B,WAAW,CAAA,cAAe,mBAAmB,6BAAO;gBAAC,GAAG,WAAW;gBAAE,aAAa,MAAM,WAAW;gBAAE,eAAe,CAAC,CAAC,MAAM,WAAW;YAAA,GAAG,MAAM,MAAM;kBACtJ,cAAA,gBAAC,CAAA,GAAA,wCAAQ;YAAE,MAAM,AAAC;gBAAC,GAAG;gBAAK,GAAG;gBAAM,GAAG;gBAAO,IAAI;YAAM,CAAW,CAAC,MAAM,IAAI,IAAI,IAAI;;;AAG5F","sources":["packages/@react-spectrum/s2/src/CloseButton.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 {baseColor, focusRing, style} from '../style' with {type: 'macro'};\nimport {Button, ButtonProps, ContextValue} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport CrossIcon from '../ui-icons/Cross';\nimport {FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, staticColor, StyleProps} from './style-utils' with {type: 'macro'};\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {pressScale} from './pressScale';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface CloseButtonProps extends Pick<ButtonProps, 'isDisabled' | 'onPress'>, StyleProps {\n /**\n * The size of the CloseButton.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /** The static color style to apply. Useful when the Button appears over a color background. */\n staticColor?: 'white' | 'black' | 'auto'\n}\n\nconst hoverBackground = {\n default: 'gray-200',\n isStaticColor: 'transparent-overlay-200'\n} as const;\n\nconst styles = style({\n ...focusRing(),\n ...staticColor(),\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n size: 'control',\n flexShrink: 0,\n borderRadius: 'full',\n padding: 0,\n borderStyle: 'none',\n transition: 'default',\n backgroundColor: {\n default: 'transparent',\n isHovered: hoverBackground,\n isFocusVisible: hoverBackground,\n isPressed: hoverBackground\n },\n '--iconPrimary': {\n type: 'color',\n value: {\n default: 'neutral',\n isDisabled: 'disabled',\n isStaticColor: {\n default: baseColor('transparent-overlay-800'),\n isDisabled: 'transparent-overlay-400'\n },\n forcedColors: {\n default: 'ButtonText',\n isDisabled: 'GrayText'\n }\n }\n },\n outlineColor: {\n default: 'focus-ring',\n isStaticColor: 'transparent-overlay-1000',\n forcedColors: 'Highlight'\n }\n}, getAllowedOverrides());\n\nexport const CloseButtonContext = createContext<ContextValue<CloseButtonProps, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * A CloseButton allows a user to dismiss a dialog.\n */\nexport const CloseButton = forwardRef(function CloseButton(props: CloseButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, CloseButtonContext);\n let {UNSAFE_style, UNSAFE_className = ''} = props;\n let domRef = useFocusableRef(ref);\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n return (\n <Button\n {...props}\n ref={domRef}\n slot=\"close\"\n aria-label={props['aria-label'] || stringFormatter.format('dialog.dismiss')}\n style={pressScale(domRef, UNSAFE_style)}\n className={renderProps => UNSAFE_className + styles({...renderProps, staticColor: props.staticColor, isStaticColor: !!props.staticColor}, props.styles)}>\n <CrossIcon size={({S: 'L', M: 'XL', L: 'XXL', XL: 'XXXL'} as const)[props.size || 'M']} />\n </Button>\n );\n});\n"],"names":[],"version":3,"file":"CloseButton.mjs.map"}
@@ -69,18 +69,18 @@ const $c7ab41f1e9757931$export$b865d4358897bb17 = /*#__PURE__*/ (0, $4UooL$react
69
69
  }
70
70
  if (!$__c) {
71
71
  if (props.isInForm) {
72
- if (props.labelPosition === "side") rules += ' __c-7u9dhl';
72
+ if (props.labelPosition === "side") rules += ' __c-yqnebx';
73
73
  }
74
74
  }
75
- if (props.isInForm) rules += ' __i-1cwd7ud';
75
+ if (props.isInForm) rules += ' __i-1a97rzt';
76
76
  else {
77
- if (props.labelPosition === "side") rules += ' __i-jyg4vb';
78
- else if (props.labelPosition === "top") rules += ' __i-375yi6';
77
+ if (props.labelPosition === "side") rules += ' __i-ar5vcf';
78
+ else if (props.labelPosition === "top") rules += ' __i-2wzs0i';
79
79
  }
80
- if (props.labelPosition === "side") rules += ' __j-jyg4vb';
81
- else if (props.labelPosition === "top") rules += ' __j-fdenls';
82
- if (props.labelPosition === "side") rules += ' __k-5eez8j';
83
- else if (props.labelPosition === "top") rules += ' __k-xlaqir';
80
+ if (props.labelPosition === "side") rules += ' __j-ar5vcf';
81
+ else if (props.labelPosition === "top") rules += ' __j-1a6w430';
82
+ if (props.labelPosition === "side") rules += ' __k-18h2yqz';
83
+ else if (props.labelPosition === "top") rules += ' __k-1srn173';
84
84
  if (props.size === "XL") {
85
85
  rules += ' _ebj';
86
86
  rules += ' _ei';
@@ -11,37 +11,37 @@
11
11
  grid-column-start: 1;
12
12
  }
13
13
 
14
- .__c-7u9dhl {
14
+ .__c-yqnebx {
15
15
  grid-column-end: span 2;
16
16
  }
17
17
 
18
- .__i-375yi6 {
18
+ .__i-2wzs0i {
19
19
  grid-template-columns: 1fr;
20
20
  }
21
21
 
22
- .__i-jyg4vb {
22
+ .__i-ar5vcf {
23
23
  grid-template-columns: auto 1fr;
24
24
  }
25
25
 
26
- .__i-1cwd7ud {
26
+ .__i-1a97rzt {
27
27
  grid-template-columns: subgrid;
28
28
  }
29
29
 
30
- .__j-fdenls {
30
+ .__j-1a6w430 {
31
31
  grid-template-rows: auto 1fr auto;
32
32
  }
33
33
 
34
- .__j-jyg4vb {
34
+ .__j-ar5vcf {
35
35
  grid-template-rows: auto 1fr;
36
36
  }
37
37
 
38
- .__k-xlaqir {
38
+ .__k-1srn173 {
39
39
  grid-template-areas: "label"
40
40
  "input"
41
41
  "helptext";
42
42
  }
43
43
 
44
- .__k-5eez8j {
44
+ .__k-18h2yqz {
45
45
  grid-template-areas: "label input"
46
46
  "label helptext";
47
47
  }
@@ -62,18 +62,18 @@ const $9c5ed7ec0bc126af$export$b865d4358897bb17 = /*#__PURE__*/ (0, $Y0ll1$forwa
62
62
  }
63
63
  if (!$__c) {
64
64
  if (props.isInForm) {
65
- if (props.labelPosition === "side") rules += ' __c-7u9dhl';
65
+ if (props.labelPosition === "side") rules += ' __c-yqnebx';
66
66
  }
67
67
  }
68
- if (props.isInForm) rules += ' __i-1cwd7ud';
68
+ if (props.isInForm) rules += ' __i-1a97rzt';
69
69
  else {
70
- if (props.labelPosition === "side") rules += ' __i-jyg4vb';
71
- else if (props.labelPosition === "top") rules += ' __i-375yi6';
70
+ if (props.labelPosition === "side") rules += ' __i-ar5vcf';
71
+ else if (props.labelPosition === "top") rules += ' __i-2wzs0i';
72
72
  }
73
- if (props.labelPosition === "side") rules += ' __j-jyg4vb';
74
- else if (props.labelPosition === "top") rules += ' __j-fdenls';
75
- if (props.labelPosition === "side") rules += ' __k-5eez8j';
76
- else if (props.labelPosition === "top") rules += ' __k-xlaqir';
73
+ if (props.labelPosition === "side") rules += ' __j-ar5vcf';
74
+ else if (props.labelPosition === "top") rules += ' __j-1a6w430';
75
+ if (props.labelPosition === "side") rules += ' __k-18h2yqz';
76
+ else if (props.labelPosition === "top") rules += ' __k-1srn173';
77
77
  if (props.size === "XL") {
78
78
  rules += ' _ebj';
79
79
  rules += ' _ei';