@react-spectrum/s2 3.0.0-nightly-fd7075c5f-250128 → 3.0.0-nightly-e3ed3c7f6-250130

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 (268) hide show
  1. package/dist/Accordion.cjs +3 -3
  2. package/dist/Accordion.css +2 -2
  3. package/dist/Accordion.mjs +3 -3
  4. package/dist/ActionBar.cjs +47 -47
  5. package/dist/ActionBar.css +51 -51
  6. package/dist/ActionBar.mjs +47 -47
  7. package/dist/ActionButton.cjs +97 -97
  8. package/dist/ActionButton.css +96 -96
  9. package/dist/ActionButton.mjs +97 -97
  10. package/dist/ActionButtonGroup.cjs +11 -11
  11. package/dist/ActionButtonGroup.css +9 -9
  12. package/dist/ActionButtonGroup.mjs +11 -11
  13. package/dist/AlertDialog.cjs +3 -3
  14. package/dist/AlertDialog.css +3 -3
  15. package/dist/AlertDialog.mjs +3 -3
  16. package/dist/Avatar.cjs +17 -17
  17. package/dist/Avatar.css +14 -14
  18. package/dist/Avatar.mjs +17 -17
  19. package/dist/AvatarGroup.cjs +100 -100
  20. package/dist/AvatarGroup.css +34 -34
  21. package/dist/AvatarGroup.mjs +100 -100
  22. package/dist/Badge.cjs +91 -67
  23. package/dist/Badge.cjs.map +1 -1
  24. package/dist/Badge.css +163 -91
  25. package/dist/Badge.css.map +1 -1
  26. package/dist/Badge.mjs +91 -67
  27. package/dist/Badge.mjs.map +1 -1
  28. package/dist/Breadcrumbs.cjs +115 -115
  29. package/dist/Breadcrumbs.css +89 -89
  30. package/dist/Breadcrumbs.mjs +115 -115
  31. package/dist/Button.cjs +236 -152
  32. package/dist/Button.cjs.map +1 -1
  33. package/dist/Button.css +309 -165
  34. package/dist/Button.css.map +1 -1
  35. package/dist/Button.mjs +236 -152
  36. package/dist/Button.mjs.map +1 -1
  37. package/dist/ButtonGroup.cjs +19 -19
  38. package/dist/ButtonGroup.css +15 -15
  39. package/dist/ButtonGroup.mjs +19 -19
  40. package/dist/Card.cjs +264 -261
  41. package/dist/Card.cjs.map +1 -1
  42. package/dist/Card.css +210 -198
  43. package/dist/Card.css.map +1 -1
  44. package/dist/Card.mjs +264 -261
  45. package/dist/Card.mjs.map +1 -1
  46. package/dist/CardView.cjs +15 -15
  47. package/dist/CardView.css +18 -18
  48. package/dist/CardView.mjs +15 -15
  49. package/dist/CenterBaseline.cjs +1 -1
  50. package/dist/CenterBaseline.css +2 -2
  51. package/dist/CenterBaseline.mjs +1 -1
  52. package/dist/Checkbox.cjs +124 -73
  53. package/dist/Checkbox.cjs.map +1 -1
  54. package/dist/Checkbox.css +201 -81
  55. package/dist/Checkbox.css.map +1 -1
  56. package/dist/Checkbox.mjs +124 -73
  57. package/dist/Checkbox.mjs.map +1 -1
  58. package/dist/CheckboxGroup.cjs +49 -49
  59. package/dist/CheckboxGroup.css +41 -41
  60. package/dist/CheckboxGroup.mjs +49 -49
  61. package/dist/ClearButton.cjs +15 -15
  62. package/dist/ClearButton.css +17 -17
  63. package/dist/ClearButton.mjs +15 -15
  64. package/dist/CloseButton.cjs +35 -35
  65. package/dist/CloseButton.css +33 -33
  66. package/dist/CloseButton.mjs +35 -35
  67. package/dist/ColorArea.cjs +22 -22
  68. package/dist/ColorArea.css +15 -15
  69. package/dist/ColorArea.mjs +22 -22
  70. package/dist/ColorField.cjs +38 -38
  71. package/dist/ColorField.css +32 -32
  72. package/dist/ColorField.mjs +38 -38
  73. package/dist/ColorHandle.cjs +27 -21
  74. package/dist/ColorHandle.cjs.map +1 -1
  75. package/dist/ColorHandle.css +93 -45
  76. package/dist/ColorHandle.css.map +1 -1
  77. package/dist/ColorHandle.mjs +27 -21
  78. package/dist/ColorHandle.mjs.map +1 -1
  79. package/dist/ColorSlider.cjs +52 -52
  80. package/dist/ColorSlider.css +51 -51
  81. package/dist/ColorSlider.mjs +52 -52
  82. package/dist/ColorSwatch.cjs +27 -24
  83. package/dist/ColorSwatch.cjs.map +1 -1
  84. package/dist/ColorSwatch.css +41 -29
  85. package/dist/ColorSwatch.css.map +1 -1
  86. package/dist/ColorSwatch.mjs +27 -24
  87. package/dist/ColorSwatch.mjs.map +1 -1
  88. package/dist/ColorSwatchPicker.cjs +23 -23
  89. package/dist/ColorSwatchPicker.css +60 -48
  90. package/dist/ColorSwatchPicker.css.map +1 -1
  91. package/dist/ColorSwatchPicker.mjs +23 -23
  92. package/dist/ColorWheel.cjs +22 -22
  93. package/dist/ColorWheel.css +16 -16
  94. package/dist/ColorWheel.mjs +22 -22
  95. package/dist/ComboBox.cjs +80 -80
  96. package/dist/ComboBox.css +88 -88
  97. package/dist/ComboBox.mjs +80 -80
  98. package/dist/ContextualHelp.cjs +5 -5
  99. package/dist/ContextualHelp.css +38 -38
  100. package/dist/ContextualHelp.mjs +5 -5
  101. package/dist/CustomDialog.cjs +31 -31
  102. package/dist/CustomDialog.css +25 -25
  103. package/dist/CustomDialog.mjs +31 -31
  104. package/dist/Dialog.cjs +17 -17
  105. package/dist/Dialog.css +64 -64
  106. package/dist/Dialog.mjs +17 -17
  107. package/dist/Disclosure.cjs +111 -108
  108. package/dist/Disclosure.cjs.map +1 -1
  109. package/dist/Disclosure.css +124 -112
  110. package/dist/Disclosure.css.map +1 -1
  111. package/dist/Disclosure.mjs +111 -108
  112. package/dist/Disclosure.mjs.map +1 -1
  113. package/dist/Divider.cjs +26 -26
  114. package/dist/Divider.css +16 -16
  115. package/dist/Divider.mjs +26 -26
  116. package/dist/DropZone.cjs +56 -47
  117. package/dist/DropZone.cjs.map +1 -1
  118. package/dist/DropZone.css +80 -56
  119. package/dist/DropZone.css.map +1 -1
  120. package/dist/DropZone.mjs +56 -47
  121. package/dist/DropZone.mjs.map +1 -1
  122. package/dist/Field.cjs +204 -150
  123. package/dist/Field.cjs.map +1 -1
  124. package/dist/Field.css +246 -150
  125. package/dist/Field.css.map +1 -1
  126. package/dist/Field.mjs +204 -150
  127. package/dist/Field.mjs.map +1 -1
  128. package/dist/Form.cjs +10 -10
  129. package/dist/Form.css +9 -9
  130. package/dist/Form.mjs +10 -10
  131. package/dist/FullscreenDialog.cjs +5 -5
  132. package/dist/FullscreenDialog.css +72 -72
  133. package/dist/FullscreenDialog.mjs +5 -5
  134. package/dist/IllustratedMessage.cjs +134 -134
  135. package/dist/IllustratedMessage.css +69 -69
  136. package/dist/IllustratedMessage.mjs +134 -134
  137. package/dist/Image.cjs +12 -12
  138. package/dist/Image.css +13 -13
  139. package/dist/Image.mjs +12 -12
  140. package/dist/InlineAlert.cjs +104 -77
  141. package/dist/InlineAlert.cjs.map +1 -1
  142. package/dist/InlineAlert.css +149 -77
  143. package/dist/InlineAlert.css.map +1 -1
  144. package/dist/InlineAlert.mjs +104 -77
  145. package/dist/InlineAlert.mjs.map +1 -1
  146. package/dist/Link.cjs +31 -31
  147. package/dist/Link.css +30 -30
  148. package/dist/Link.mjs +31 -31
  149. package/dist/Menu.cjs +269 -264
  150. package/dist/Menu.cjs.map +1 -1
  151. package/dist/Menu.css +152 -152
  152. package/dist/Menu.css.map +1 -1
  153. package/dist/Menu.mjs +270 -265
  154. package/dist/Menu.mjs.map +1 -1
  155. package/dist/Meter.cjs +85 -85
  156. package/dist/Meter.css +81 -81
  157. package/dist/Meter.mjs +85 -85
  158. package/dist/Modal.cjs +48 -48
  159. package/dist/Modal.css +46 -46
  160. package/dist/Modal.mjs +48 -48
  161. package/dist/NumberField.cjs +115 -115
  162. package/dist/NumberField.css +114 -114
  163. package/dist/NumberField.mjs +115 -115
  164. package/dist/Picker.cjs +193 -175
  165. package/dist/Picker.cjs.map +1 -1
  166. package/dist/Picker.css +223 -163
  167. package/dist/Picker.css.map +1 -1
  168. package/dist/Picker.mjs +193 -175
  169. package/dist/Picker.mjs.map +1 -1
  170. package/dist/Popover.cjs +84 -78
  171. package/dist/Popover.cjs.map +1 -1
  172. package/dist/Popover.css +89 -65
  173. package/dist/Popover.css.map +1 -1
  174. package/dist/Popover.mjs +84 -78
  175. package/dist/Popover.mjs.map +1 -1
  176. package/dist/ProgressBar.cjs +98 -98
  177. package/dist/ProgressBar.css +92 -92
  178. package/dist/ProgressBar.mjs +98 -98
  179. package/dist/ProgressCircle.cjs +17 -17
  180. package/dist/ProgressCircle.css +15 -15
  181. package/dist/ProgressCircle.mjs +17 -17
  182. package/dist/Provider.cjs +4 -4
  183. package/dist/Provider.css +5 -5
  184. package/dist/Provider.mjs +4 -4
  185. package/dist/Radio.cjs +152 -80
  186. package/dist/Radio.cjs.map +1 -1
  187. package/dist/Radio.css +240 -96
  188. package/dist/Radio.css.map +1 -1
  189. package/dist/Radio.mjs +152 -80
  190. package/dist/Radio.mjs.map +1 -1
  191. package/dist/RadioGroup.cjs +47 -47
  192. package/dist/RadioGroup.css +41 -41
  193. package/dist/RadioGroup.mjs +47 -47
  194. package/dist/SearchField.cjs +42 -42
  195. package/dist/SearchField.css +47 -47
  196. package/dist/SearchField.mjs +42 -42
  197. package/dist/SegmentedControl.cjs +101 -89
  198. package/dist/SegmentedControl.cjs.map +1 -1
  199. package/dist/SegmentedControl.css +140 -92
  200. package/dist/SegmentedControl.css.map +1 -1
  201. package/dist/SegmentedControl.mjs +101 -89
  202. package/dist/SegmentedControl.mjs.map +1 -1
  203. package/dist/Slider.cjs +229 -196
  204. package/dist/Slider.cjs.map +1 -1
  205. package/dist/Slider.css +221 -149
  206. package/dist/Slider.css.map +1 -1
  207. package/dist/Slider.mjs +229 -196
  208. package/dist/Slider.mjs.map +1 -1
  209. package/dist/StatusLight.cjs +56 -56
  210. package/dist/StatusLight.css +59 -59
  211. package/dist/StatusLight.mjs +56 -56
  212. package/dist/Switch.cjs +107 -74
  213. package/dist/Switch.cjs.map +1 -1
  214. package/dist/Switch.css +141 -69
  215. package/dist/Switch.css.map +1 -1
  216. package/dist/Switch.mjs +107 -74
  217. package/dist/Switch.mjs.map +1 -1
  218. package/dist/TableView.cjs +280 -253
  219. package/dist/TableView.cjs.map +1 -1
  220. package/dist/TableView.css +199 -163
  221. package/dist/TableView.css.map +1 -1
  222. package/dist/TableView.mjs +280 -253
  223. package/dist/TableView.mjs.map +1 -1
  224. package/dist/Tabs.cjs +83 -83
  225. package/dist/Tabs.css +58 -58
  226. package/dist/Tabs.mjs +83 -83
  227. package/dist/TagGroup.cjs +148 -148
  228. package/dist/TagGroup.css +134 -134
  229. package/dist/TagGroup.mjs +148 -148
  230. package/dist/TextField.cjs +59 -59
  231. package/dist/TextField.css +62 -62
  232. package/dist/TextField.mjs +59 -59
  233. package/dist/ToggleButton.cjs +3 -3
  234. package/dist/ToggleButton.css +12 -12
  235. package/dist/ToggleButton.mjs +3 -3
  236. package/dist/Tooltip.cjs +60 -57
  237. package/dist/Tooltip.cjs.map +1 -1
  238. package/dist/Tooltip.css +83 -71
  239. package/dist/Tooltip.css.map +1 -1
  240. package/dist/Tooltip.mjs +60 -57
  241. package/dist/Tooltip.mjs.map +1 -1
  242. package/dist/TreeView.cjs +465 -0
  243. package/dist/TreeView.cjs.map +1 -0
  244. package/dist/TreeView.css +632 -0
  245. package/dist/TreeView.css.map +1 -0
  246. package/dist/TreeView.mjs +455 -0
  247. package/dist/TreeView.mjs.map +1 -0
  248. package/dist/main.cjs +4 -0
  249. package/dist/main.cjs.map +1 -1
  250. package/dist/module.mjs +3 -1
  251. package/dist/module.mjs.map +1 -1
  252. package/dist/types.d.ts +21 -1
  253. package/dist/types.d.ts.map +1 -1
  254. package/icons/Skeleton.cjs +2 -2
  255. package/icons/Skeleton.css +5 -5
  256. package/icons/Skeleton.mjs +2 -2
  257. package/package.json +20 -19
  258. package/src/Menu.tsx +2 -0
  259. package/src/TreeView.tsx +497 -0
  260. package/src/index.ts +2 -0
  261. package/style/__tests__/style-macro.test.js +18 -18
  262. package/style/dist/spectrum-theme.cjs +20 -10
  263. package/style/dist/spectrum-theme.cjs.map +1 -1
  264. package/style/dist/spectrum-theme.mjs +20 -10
  265. package/style/dist/spectrum-theme.mjs.map +1 -1
  266. package/style/dist/types.d.ts +4 -0
  267. package/style/dist/types.d.ts.map +1 -1
  268. package/style/spectrum-theme.ts +18 -11
package/dist/Button.cjs CHANGED
@@ -56,60 +56,60 @@ const $25d06cf8d4e72761$export$1c1a176f3b9e48d3 = /*#__PURE__*/ (0, $8owBJ$react
56
56
  const $25d06cf8d4e72761$var$iconOnly = ':has([slot=icon]):not(:has([data-rsp-slot=text]))';
57
57
  const $25d06cf8d4e72761$var$button = function anonymous(props, overrides) {
58
58
  let rules = " .";
59
- let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|__a|_9|h|_6|_5|__B|__d|__e|__b|__c|V|__R|Y|_a|W|X|l|q|r)[^\s]+/g) || [];
59
+ let matches = (overrides || '').match(/(?:^|\s)(?:B|C|D|E|__d|__c|g|_9|_8|__E|__g|__h|__e|__f|Y|__U|_b|_d|Z|_a|k|p|q)[^\s]+/g) || [];
60
60
  rules += matches.join('');
61
- let $V = false;
62
- let $q = false;
63
- let $l = false;
61
+ let $Y = false;
62
+ let $p = false;
63
+ let $k = false;
64
64
  for (let p of matches){
65
- if (/^\s*V/.test(p)) $V = true;
66
- if (/^\s*q/.test(p)) $q = true;
67
- if (/^\s*l/.test(p)) $l = true;
65
+ if (/^\s*Y/.test(p)) $Y = true;
66
+ if (/^\s*p/.test(p)) $p = true;
67
+ if (/^\s*k/.test(p)) $k = true;
68
68
  }
69
- if (props.isFocusVisible) rules += ' _Mb';
70
- else rules += ' _Ma';
71
- rules += ' da_____M';
72
- if (props.isStaticColor) rules += ' d_____G';
73
- else rules += ' dx';
74
- rules += ' _Oc';
75
- rules += ' _N-3t1z';
69
+ if (props.isFocusVisible) rules += ' _Pb';
70
+ else rules += ' _Pa';
71
+ rules += ' ca_____M';
72
+ if (props.isStaticColor) rules += ' c_____G';
73
+ else rules += ' cx';
74
+ rules += ' _Rc';
75
+ rules += ' _Q-3t1z';
76
76
  if (props.staticColor === "white") rules += ' -_1de2x0q_b-b';
77
77
  else if (props.staticColor === "black") rules += ' -_1de2x0q_b-c';
78
- if (!$V) rules += ' Vc';
79
- rules += ' _0d';
80
- rules += ' _2-soocicc';
81
- rules += ' _2d';
78
+ if (!$Y) rules += ' Yc';
82
79
  rules += ' _3d';
83
- rules += ' _ka';
84
- rules += ' jbH';
85
- rules += ' jG';
86
- rules += ' _d-bc1l9oh';
87
- rules += ' _d-1uotwbwg';
88
- rules += ' _d-eo0c6sf';
89
- rules += ' _d-enzzrge';
90
- rules += ' _d-enzykdd';
91
- rules += ' _d-enzwzjc';
92
- rules += ' _d-enzrfpb';
93
- rules += ' _da';
80
+ rules += ' _5-soocicc';
81
+ rules += ' _5d';
82
+ rules += ' _6d';
83
+ rules += ' _na';
84
+ rules += ' ibH';
85
+ rules += ' iG';
86
+ rules += ' _g-bc1l9oh';
87
+ rules += ' _g-1uotwbwg';
88
+ rules += ' _g-eo0c6sf';
89
+ rules += ' _g-enzzrge';
90
+ rules += ' _g-enzykdd';
91
+ rules += ' _g-enzwzjc';
92
+ rules += ' _g-enzrfpb';
93
+ rules += ' _ga';
94
94
  if (props.size === "XL") {
95
- rules += ' _ebj';
96
- rules += ' _ei';
95
+ rules += ' _hbj';
96
+ rules += ' _hi';
97
97
  } else if (props.size === "L") {
98
- rules += ' _ebh';
99
- rules += ' _eg';
98
+ rules += ' _hbh';
99
+ rules += ' _hg';
100
100
  } else if (props.size === "S") {
101
- rules += ' _ebd';
102
- rules += ' _ec';
101
+ rules += ' _hbd';
102
+ rules += ' _hc';
103
103
  } else if (props.size === "XS") {
104
- rules += ' _ebb';
105
- rules += ' _ea';
104
+ rules += ' _hbb';
105
+ rules += ' _ha';
106
106
  } else {
107
- rules += ' _ebf';
108
- rules += ' _ee';
107
+ rules += ' _hbf';
108
+ rules += ' _he';
109
109
  }
110
- rules += ' _fd';
111
- rules += ' _g-1x99dlob';
112
- rules += ' _ga';
110
+ rules += ' _id';
111
+ rules += ' _j-1x99dlob';
112
+ rules += ' _ja';
113
113
  if (props.fillStyle === "outline") {
114
114
  if (props.isDisabled) rules += ' aa_____O';
115
115
  else rules += ' aa_____K';
@@ -161,91 +161,175 @@ const $25d06cf8d4e72761$var$button = function anonymous(props, overrides) {
161
161
  else rules += ' an';
162
162
  } else if (props.variant === "primary") rules += ' ad';
163
163
  }
164
- rules += ' __Ea';
165
- rules += ' o-375tou';
166
- if (!$q) {
167
- if (props.size === "XL") rules += ' q-soocicj';
168
- else if (props.size === "L") rules += ' q-soocici';
169
- else if (props.size === "S") rules += ' q-soocich';
170
- else if (props.size === "XS") rules += ' q-soocicg';
171
- else rules += ' q-soocicf';
164
+ rules += ' __Ha';
165
+ rules += ' n-375tot';
166
+ if (!$p) {
167
+ if (props.size === "XL") rules += ' p-soocicj';
168
+ else if (props.size === "L") rules += ' p-soocici';
169
+ else if (props.size === "S") rules += ' p-soocich';
170
+ else if (props.size === "XS") rules += ' p-soocicg';
171
+ else rules += ' p-soocicf';
172
172
  }
173
- rules += ' _wg';
174
- rules += ' _xg';
175
- rules += ' _yg';
176
173
  rules += ' _zg';
177
- rules += ' __oa';
178
- if (!$l) rules += ' le';
179
- rules += ' _md';
180
- rules += ' C-soocica';
181
- rules += ' CJ';
182
- rules += ' D-soocica';
183
- rules += ' DJ';
184
- rules += ' Ea';
185
- rules += ' Fa';
186
- rules += ' _c-soocicb';
187
- rules += ' _Pa';
188
- rules += ' _R-375x7f';
174
+ rules += ' _Ag';
175
+ rules += ' _Bg';
176
+ rules += ' _Cg';
177
+ rules += ' __ra';
178
+ if (!$k) rules += ' ke';
179
+ rules += ' _pd';
180
+ rules += ' F-soocica';
181
+ rules += ' FJ';
182
+ rules += ' G-soocica';
183
+ rules += ' GJ';
184
+ rules += ' Ha';
185
+ rules += ' Ia';
186
+ rules += ' _f-soocicb';
189
187
  rules += ' _Sa';
190
- rules += ' wa';
188
+ rules += ' _U-375x7f';
189
+ rules += ' _Va';
190
+ rules += ' za';
191
+ rules += ' t-375toz';
191
192
  rules += ' u-375tp0';
192
- rules += ' v-375tp1';
193
+ if (props.variant === "genai") rules += ' ra';
194
+ else if (props.variant === "premium") rules += ' ra';
195
+ else if (props.fillStyle === "outline") rules += ' rc';
196
+ else if (props.fillStyle === "fill") rules += ' ra';
193
197
  if (props.variant === "genai") rules += ' sa';
194
198
  else if (props.variant === "premium") rules += ' sa';
195
199
  else if (props.fillStyle === "outline") rules += ' sc';
196
200
  else if (props.fillStyle === "fill") rules += ' sa';
197
- if (props.variant === "genai") rules += ' ta';
198
- else if (props.variant === "premium") rules += ' ta';
199
- else if (props.fillStyle === "outline") rules += ' tc';
200
- else if (props.fillStyle === "fill") rules += ' ta';
201
- rules += ' -_1gogtue_E--1dbqcch';
202
- rules += ' -oelgqu_A--soocica';
203
- rules += ' -oelgqu_A--177861o';
204
- if (props.isDisabled) rules += ' ca_____O';
205
- else if (props.isHovered) rules += ' ca_____M';
206
- else rules += ' ca_____I';
201
+ rules += ' -_1gogtue_H--1dbqcch';
202
+ rules += ' -oelgqu_D--soocica';
203
+ rules += ' -oelgqu_D--177861o';
204
+ if (props.isDisabled) rules += ' xa_____O';
205
+ else if (props.isHovered) rules += ' xa_____M';
206
+ else rules += ' xa_____I';
207
207
  if (props.isStaticColor) {
208
- if (props.isDisabled) rules += ' c_____z';
208
+ if (props.isDisabled) rules += ' x_____z';
209
209
  else if (props.variant === "secondary") {
210
- if (props.isPressed) rules += ' c_____A';
211
- else if (props.isFocusVisible) rules += ' c_____A';
212
- else if (props.isHovered) rules += ' c_____A';
213
- else rules += ' c_____z';
210
+ if (props.isPressed) rules += ' x_____A';
211
+ else if (props.isFocusVisible) rules += ' x_____A';
212
+ else if (props.isHovered) rules += ' x_____A';
213
+ else rules += ' x_____z';
214
214
  } else if (props.variant === "primary") {
215
- if (props.isPressed) rules += ' c_____F';
216
- else if (props.isFocusVisible) rules += ' c_____F';
217
- else if (props.isHovered) rules += ' c_____F';
218
- else rules += ' c_____E';
215
+ if (props.isPressed) rules += ' x_____F';
216
+ else if (props.isFocusVisible) rules += ' x_____F';
217
+ else if (props.isHovered) rules += ' x_____F';
218
+ else rules += ' x_____E';
219
219
  }
220
- } else if (props.isDisabled) rules += ' ci';
220
+ } else if (props.isDisabled) rules += ' xi';
221
221
  else if (props.variant === "secondary") {
222
- if (props.isPressed) rules += ' cj';
223
- else if (props.isFocusVisible) rules += ' cj';
224
- else if (props.isHovered) rules += ' cj';
225
- else rules += ' ci';
222
+ if (props.isPressed) rules += ' xj';
223
+ else if (props.isFocusVisible) rules += ' xj';
224
+ else if (props.isHovered) rules += ' xj';
225
+ else rules += ' xi';
226
226
  } else if (props.variant === "primary") {
227
- if (props.isPressed) rules += ' co';
228
- else if (props.isFocusVisible) rules += ' co';
229
- else if (props.isHovered) rules += ' co';
230
- else rules += ' cn';
227
+ if (props.isPressed) rules += ' xo';
228
+ else if (props.isFocusVisible) rules += ' xo';
229
+ else if (props.isHovered) rules += ' xo';
230
+ else rules += ' xn';
231
+ }
232
+ if (props.isDisabled) rules += ' ya_____O';
233
+ else if (props.isHovered) rules += ' ya_____M';
234
+ else rules += ' ya_____I';
235
+ if (props.isStaticColor) {
236
+ if (props.isDisabled) rules += ' y_____z';
237
+ else if (props.variant === "secondary") {
238
+ if (props.isPressed) rules += ' y_____A';
239
+ else if (props.isFocusVisible) rules += ' y_____A';
240
+ else if (props.isHovered) rules += ' y_____A';
241
+ else rules += ' y_____z';
242
+ } else if (props.variant === "primary") {
243
+ if (props.isPressed) rules += ' y_____F';
244
+ else if (props.isFocusVisible) rules += ' y_____F';
245
+ else if (props.isHovered) rules += ' y_____F';
246
+ else rules += ' y_____E';
247
+ }
248
+ } else if (props.isDisabled) rules += ' yi';
249
+ else if (props.variant === "secondary") {
250
+ if (props.isPressed) rules += ' yj';
251
+ else if (props.isFocusVisible) rules += ' yj';
252
+ else if (props.isHovered) rules += ' yj';
253
+ else rules += ' yi';
254
+ } else if (props.variant === "primary") {
255
+ if (props.isPressed) rules += ' yo';
256
+ else if (props.isFocusVisible) rules += ' yo';
257
+ else if (props.isHovered) rules += ' yo';
258
+ else rules += ' yn';
259
+ }
260
+ if (props.isDisabled) rules += ' va_____O';
261
+ else if (props.isHovered) rules += ' va_____M';
262
+ else rules += ' va_____I';
263
+ if (props.isStaticColor) {
264
+ if (props.isDisabled) rules += ' v_____z';
265
+ else if (props.variant === "secondary") {
266
+ if (props.isPressed) rules += ' v_____A';
267
+ else if (props.isFocusVisible) rules += ' v_____A';
268
+ else if (props.isHovered) rules += ' v_____A';
269
+ else rules += ' v_____z';
270
+ } else if (props.variant === "primary") {
271
+ if (props.isPressed) rules += ' v_____F';
272
+ else if (props.isFocusVisible) rules += ' v_____F';
273
+ else if (props.isHovered) rules += ' v_____F';
274
+ else rules += ' v_____E';
275
+ }
276
+ } else if (props.isDisabled) rules += ' vi';
277
+ else if (props.variant === "secondary") {
278
+ if (props.isPressed) rules += ' vj';
279
+ else if (props.isFocusVisible) rules += ' vj';
280
+ else if (props.isHovered) rules += ' vj';
281
+ else rules += ' vi';
282
+ } else if (props.variant === "primary") {
283
+ if (props.isPressed) rules += ' vo';
284
+ else if (props.isFocusVisible) rules += ' vo';
285
+ else if (props.isHovered) rules += ' vo';
286
+ else rules += ' vn';
287
+ }
288
+ if (props.isDisabled) rules += ' wa_____O';
289
+ else if (props.isHovered) rules += ' wa_____M';
290
+ else rules += ' wa_____I';
291
+ if (props.isStaticColor) {
292
+ if (props.isDisabled) rules += ' w_____z';
293
+ else if (props.variant === "secondary") {
294
+ if (props.isPressed) rules += ' w_____A';
295
+ else if (props.isFocusVisible) rules += ' w_____A';
296
+ else if (props.isHovered) rules += ' w_____A';
297
+ else rules += ' w_____z';
298
+ } else if (props.variant === "primary") {
299
+ if (props.isPressed) rules += ' w_____F';
300
+ else if (props.isFocusVisible) rules += ' w_____F';
301
+ else if (props.isHovered) rules += ' w_____F';
302
+ else rules += ' w_____E';
303
+ }
304
+ } else if (props.isDisabled) rules += ' wi';
305
+ else if (props.variant === "secondary") {
306
+ if (props.isPressed) rules += ' wj';
307
+ else if (props.isFocusVisible) rules += ' wj';
308
+ else if (props.isHovered) rules += ' wj';
309
+ else rules += ' wi';
310
+ } else if (props.variant === "primary") {
311
+ if (props.isPressed) rules += ' wo';
312
+ else if (props.isFocusVisible) rules += ' wo';
313
+ else if (props.isHovered) rules += ' wo';
314
+ else rules += ' wn';
231
315
  }
232
316
  rules += ' b-375toh';
233
- rules += ' -rwx0fg_e-b';
234
- rules += ' _Ab';
235
- rules += ' __S-yksgrp';
236
- if (props.size === "XL") rules += ' -_375tou_o-j';
237
- else if (props.size === "L") rules += ' -_375tou_o-i';
238
- else if (props.size === "S") rules += ' -_375tou_o-h';
239
- else if (props.size === "XS") rules += ' -_375tou_o-g';
240
- else rules += ' -_375tou_o-f';
317
+ rules += ' -rwx0fg_d-b';
318
+ rules += ' _Db';
319
+ rules += ' __V-yksgrp';
320
+ if (props.size === "XL") rules += ' -_375tot_n-j';
321
+ else if (props.size === "L") rules += ' -_375tot_n-i';
322
+ else if (props.size === "S") rules += ' -_375tot_n-h';
323
+ else if (props.size === "XS") rules += ' -_375tot_n-g';
324
+ else rules += ' -_375tot_n-f';
325
+ if (props.variant === "genai") rules += ' -_375toz_t-a';
326
+ else if (props.variant === "premium") rules += ' -_375toz_t-a';
327
+ else if (props.fillStyle === "outline") rules += ' -_375toz_t-c';
328
+ else if (props.fillStyle === "fill") rules += ' -_375toz_t-a';
241
329
  if (props.variant === "genai") rules += ' -_375tp0_u-a';
242
330
  else if (props.variant === "premium") rules += ' -_375tp0_u-a';
243
331
  else if (props.fillStyle === "outline") rules += ' -_375tp0_u-c';
244
332
  else if (props.fillStyle === "fill") rules += ' -_375tp0_u-a';
245
- if (props.variant === "genai") rules += ' -_375tp1_v-a';
246
- else if (props.variant === "premium") rules += ' -_375tp1_v-a';
247
- else if (props.fillStyle === "outline") rules += ' -_375tp1_v-c';
248
- else if (props.fillStyle === "fill") rules += ' -_375tp1_v-a';
249
333
  if (props.fillStyle === "outline") rules += ' -_375toh_b-a_____J';
250
334
  else if (props.fillStyle === "fill") {
251
335
  if (props.isDisabled) rules += ' -_375toh_b-a_____O';
@@ -324,34 +408,34 @@ const $25d06cf8d4e72761$var$button = function anonymous(props, overrides) {
324
408
  // https://bugs.webkit.org/show_bug.cgi?id=285622
325
409
  const $25d06cf8d4e72761$var$gradient = function anonymous(props) {
326
410
  let rules = " .";
327
- rules += ' Va';
328
411
  rules += ' Ya';
412
+ rules += ' _ba';
413
+ rules += ' _da';
414
+ rules += ' Za';
329
415
  rules += ' _aa';
330
- rules += ' Wa';
331
- rules += ' Xa';
332
- rules += ' __R-3hmpv';
333
- rules += ' _Pa';
334
- rules += ' _R-375x7f';
416
+ rules += ' __U-3hmpv';
335
417
  rules += ' _Sa';
336
- rules += ' _w-17zqamw';
337
- rules += ' _x-17zqamw';
338
- rules += ' _y-17zqamw';
418
+ rules += ' _U-375x7f';
419
+ rules += ' _Va';
339
420
  rules += ' _z-17zqamw';
340
- rules += ' _Ca-qey189';
341
- if (props.isDisabled) rules += ' _C-qey189';
421
+ rules += ' _A-17zqamw';
422
+ rules += ' _B-17zqamw';
423
+ rules += ' _C-17zqamw';
424
+ rules += ' _Fa-qey189';
425
+ if (props.isDisabled) rules += ' _F-qey189';
342
426
  else if (props.variant === "genai") {
343
- if (props.isFocusVisible) rules += ' _C-x40uwg';
344
- else if (props.isPressed) rules += ' _C-x40uwg';
345
- else if (props.isHovered) rules += ' _C-x40uwg';
346
- else rules += ' _C-17z6g7s';
427
+ if (props.isFocusVisible) rules += ' _F-x40uwg';
428
+ else if (props.isPressed) rules += ' _F-x40uwg';
429
+ else if (props.isHovered) rules += ' _F-x40uwg';
430
+ else rules += ' _F-17z6g7s';
347
431
  } else if (props.variant === "premium") {
348
- if (props.isFocusVisible) rules += ' _C-zh0yy1';
349
- else if (props.isPressed) rules += ' _C-zh0yy1';
350
- else if (props.isHovered) rules += ' _C-zh0yy1';
351
- else rules += ' _C-1bwg29';
432
+ if (props.isFocusVisible) rules += ' _F-zh0yy1';
433
+ else if (props.isPressed) rules += ' _F-zh0yy1';
434
+ else if (props.isHovered) rules += ' _F-zh0yy1';
435
+ else rules += ' _F-1bwg29';
352
436
  }
353
- if (props.variant === "genai") rules += ' _Ba';
354
- else if (props.variant === "premium") rules += ' _Ba';
437
+ if (props.variant === "genai") rules += ' _Ea';
438
+ else if (props.variant === "premium") rules += ' _Ea';
355
439
  return rules;
356
440
  };
357
441
  const $25d06cf8d4e72761$export$353f5b6fc5456de1 = /*#__PURE__*/ (0, $8owBJ$react.forwardRef)(function Button(props1, ref) {
@@ -414,11 +498,11 @@ const $25d06cf8d4e72761$export$353f5b6fc5456de1 = /*#__PURE__*/ (0, $8owBJ$react
414
498
  {
415
499
  styles: function anonymous(props) {
416
500
  let rules = " .";
417
- rules += ' E-1gogtue';
418
- rules += ' F-1gogtue';
419
- rules += ' __B-3t1y';
420
- if (props.isProgressVisible) rules += ' _L-3t1x';
421
- else rules += ' _L-3t1y';
501
+ rules += ' H-1gogtue';
502
+ rules += ' I-1gogtue';
503
+ rules += ' __E-3t1y';
504
+ if (props.isProgressVisible) rules += ' _O-3t1x';
505
+ else rules += ' _O-3t1y';
422
506
  return rules;
423
507
  }({
424
508
  isProgressVisible: isProgressVisible
@@ -432,16 +516,16 @@ const $25d06cf8d4e72761$export$353f5b6fc5456de1 = /*#__PURE__*/ (0, $8owBJ$react
432
516
  {
433
517
  render: (0, $e991cbcdf82ced71$exports.centerBaseline)({
434
518
  slot: 'icon',
435
- styles: " __B-3t1x"
519
+ styles: " __E-3t1x"
436
520
  }),
437
521
  styles: function anonymous(props) {
438
522
  let rules = " .";
439
- rules += ' l-1sthc3k';
440
523
  rules += ' k-1sthc3k';
441
- rules += ' y-oelgqu';
442
- rules += ' _9-3t1x';
443
- if (props.isProgressVisible) rules += ' _L-3t1x';
444
- else rules += ' _L-3t1y';
524
+ rules += ' j-1sthc3k';
525
+ rules += ' B-oelgqu';
526
+ rules += ' __c-3t1x';
527
+ if (props.isProgressVisible) rules += ' _O-3t1x';
528
+ else rules += ' _O-3t1y';
445
529
  return rules;
446
530
  }({
447
531
  isProgressVisible: isProgressVisible
@@ -456,12 +540,12 @@ const $25d06cf8d4e72761$export$353f5b6fc5456de1 = /*#__PURE__*/ (0, $8owBJ$react
456
540
  isPending && /*#__PURE__*/ (0, $8owBJ$reactjsxruntime.jsx)("div", {
457
541
  className: function anonymous(props) {
458
542
  let rules = " .";
459
- rules += ' Va';
460
- rules += ' Y-3760fj';
461
- rules += ' Z-3760fj';
462
- rules += ' U-1uu3e5e';
463
- if (props.isProgressVisible) rules += ' _L-3t1y';
464
- else rules += ' _L-3t1x';
543
+ rules += ' Ya';
544
+ rules += ' _b-3760fj';
545
+ rules += ' _c-3760fj';
546
+ rules += ' X-1uu3e5e';
547
+ if (props.isProgressVisible) rules += ' _O-3t1y';
548
+ else rules += ' _O-3t1x';
465
549
  return rules;
466
550
  }({
467
551
  isProgressVisible: isProgressVisible,
@@ -474,14 +558,14 @@ const $25d06cf8d4e72761$export$353f5b6fc5456de1 = /*#__PURE__*/ (0, $8owBJ$react
474
558
  staticColor: staticColor,
475
559
  styles: function anonymous(props) {
476
560
  let rules = " .";
477
- if (props.size === "XL") rules += ' lM';
478
- else if (props.size === "L") rules += ' lI';
479
- else if (props.size === "M") rules += ' lG';
480
- else if (props.size === "S") rules += ' lC';
481
561
  if (props.size === "XL") rules += ' kM';
482
562
  else if (props.size === "L") rules += ' kI';
483
563
  else if (props.size === "M") rules += ' kG';
484
564
  else if (props.size === "S") rules += ' kC';
565
+ if (props.size === "XL") rules += ' jM';
566
+ else if (props.size === "L") rules += ' jI';
567
+ else if (props.size === "M") rules += ' jG';
568
+ else if (props.size === "S") rules += ' jC';
485
569
  return rules;
486
570
  }({
487
571
  size: size
@@ -523,7 +607,7 @@ const $25d06cf8d4e72761$export$29d11c0fe2fc51d8 = /*#__PURE__*/ (0, $8owBJ$react
523
607
  [
524
608
  (0, $6367bc87eb7d24ad$exports.TextContext),
525
609
  {
526
- styles: " E-1gogtue F-1gogtue __B-3t1y",
610
+ styles: " H-1gogtue I-1gogtue __E-3t1y",
527
611
  // @ts-ignore data-attributes allowed on all JSX elements, but adding to DOMProps has been problematic in the past
528
612
  'data-rsp-slot': 'text'
529
613
  }
@@ -533,9 +617,9 @@ const $25d06cf8d4e72761$export$29d11c0fe2fc51d8 = /*#__PURE__*/ (0, $8owBJ$react
533
617
  {
534
618
  render: (0, $e991cbcdf82ced71$exports.centerBaseline)({
535
619
  slot: 'icon',
536
- styles: " __B-3t1x"
620
+ styles: " __E-3t1x"
537
621
  }),
538
- styles: " l-1sthc3k k-1sthc3k y-oelgqu _9-3t1x"
622
+ styles: " k-1sthc3k j-1sthc3k B-oelgqu __c-3t1x"
539
623
  }
540
624
  ]
541
625
  ],
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/s2/src/Button.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, fontRelative, linearGradient, style} from '../style' with {type: 'macro'};\nimport {ButtonRenderProps, ContextValue, Link, LinkProps, OverlayTriggerStateContext, Provider, Button as RACButton, ButtonProps as RACButtonProps} from 'react-aria-components';\nimport {centerBaseline} from './CenterBaseline';\nimport {centerPadding, getAllowedOverrides, staticColor, StyleProps} from './style-utils' with {type: 'macro'};\nimport {createContext, forwardRef, ReactNode, useContext, useEffect, useState} from 'react';\nimport {FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {IconContext} from './Icon';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {pressScale} from './pressScale';\nimport {ProgressCircle} from './ProgressCircle';\nimport {SkeletonContext} from './Skeleton';\nimport {Text, TextContext} from './Content';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useFormProps} from './Form';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\ninterface ButtonStyleProps {\n /**\n * The [visual style](https://spectrum.adobe.com/page/button/#Options) of the button.\n *\n * @default 'primary'\n */\n variant?: 'primary' | 'secondary' | 'accent' | 'negative' | 'premium' | 'genai',\n /**\n * The background style of the Button.\n *\n * @default 'fill'\n */\n fillStyle?: 'fill' | 'outline',\n /**\n * The size of the Button.\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\nexport interface ButtonProps extends Omit<RACButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, StyleProps, ButtonStyleProps {\n /** The content to display in the Button. */\n children?: ReactNode\n}\n\nexport interface LinkButtonProps extends Omit<LinkProps, 'className' | 'style' | 'children'>, StyleProps, ButtonStyleProps {\n /** The content to display in the Button. */\n children?: ReactNode\n}\n\nexport const ButtonContext = createContext<ContextValue<ButtonProps, FocusableRefValue<HTMLButtonElement>>>(null);\nexport const LinkButtonContext = createContext<ContextValue<ButtonProps, FocusableRefValue<HTMLAnchorElement>>>(null);\n\nconst iconOnly = ':has([slot=icon]):not(:has([data-rsp-slot=text]))';\nconst button = style<ButtonRenderProps & ButtonStyleProps & {isStaticColor: boolean}>({\n ...focusRing(),\n ...staticColor(),\n position: 'relative',\n display: 'flex',\n alignItems: {\n default: 'baseline',\n [iconOnly]: 'center'\n },\n justifyContent: 'center',\n textAlign: 'start',\n columnGap: 'text-to-visual',\n font: 'control',\n fontWeight: 'bold',\n userSelect: 'none',\n minHeight: 'control',\n minWidth: {\n [iconOnly]: 'control'\n },\n borderRadius: 'pill',\n boxSizing: 'border-box',\n width: 'fit',\n textDecoration: 'none', // for link buttons\n paddingX: {\n default: 'pill',\n [iconOnly]: 0\n },\n paddingY: 0,\n aspectRatio: {\n [iconOnly]: 'square'\n },\n transition: 'default',\n borderStyle: 'solid',\n borderWidth: {\n fillStyle: {\n fill: 0,\n outline: 2\n },\n variant: {\n premium: 0,\n genai: 0\n }\n },\n '--labelPadding': {\n type: 'paddingTop',\n value: centerPadding()\n },\n '--iconMargin': {\n type: 'marginTop',\n value: {\n default: fontRelative(-2),\n [iconOnly]: 0\n }\n },\n borderColor: {\n variant: {\n primary: baseColor('gray-800'),\n secondary: baseColor('gray-300')\n },\n isDisabled: 'disabled',\n isStaticColor: {\n variant: {\n primary: baseColor('transparent-overlay-800'),\n secondary: baseColor('transparent-overlay-300')\n },\n isDisabled: 'transparent-overlay-300'\n },\n forcedColors: {\n default: 'ButtonBorder',\n isHovered: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n backgroundColor: {\n fillStyle: {\n fill: {\n variant: {\n primary: 'neutral',\n secondary: baseColor('gray-100'),\n accent: 'accent',\n negative: 'negative',\n premium: 'gray-100',\n genai: 'gray-100'\n },\n isDisabled: 'disabled'\n },\n outline: {\n variant: {\n premium: 'gray-100',\n genai: 'gray-100'\n },\n default: 'transparent',\n isHovered: 'gray-100',\n isPressed: 'gray-100',\n isFocusVisible: 'gray-100',\n isDisabled: {\n default: 'transparent',\n variant: {\n premium: 'gray-100',\n genai: 'gray-100'\n }\n }\n }\n },\n isStaticColor: {\n fillStyle: {\n fill: {\n variant: {\n primary: baseColor('transparent-overlay-800'),\n secondary: baseColor('transparent-overlay-100'),\n premium: 'transparent-overlay-100',\n genai: 'transparent-overlay-100'\n },\n isDisabled: 'transparent-overlay-100'\n },\n outline: {\n variant: {\n premium: 'transparent-overlay-100',\n genai: 'transparent-overlay-100'\n },\n default: 'transparent',\n isHovered: 'transparent-overlay-100',\n isPressed: 'transparent-overlay-100',\n isFocusVisible: 'transparent-overlay-100',\n isDisabled: {\n default: 'transparent',\n variant: {\n premium: 'transparent-overlay-100',\n genai: 'transparent-overlay-100'\n }\n }\n }\n }\n },\n forcedColors: {\n fillStyle: {\n fill: {\n default: 'ButtonText',\n isHovered: 'Highlight',\n isDisabled: 'GrayText'\n },\n outline: 'ButtonFace'\n }\n }\n },\n color: {\n fillStyle: {\n fill: {\n variant: {\n primary: 'gray-25',\n secondary: 'neutral',\n accent: 'white',\n negative: 'white',\n premium: 'white',\n genai: 'white'\n },\n isDisabled: 'disabled'\n },\n outline: {\n default: 'neutral',\n variant: {\n premium: 'white',\n genai: 'white'\n },\n isDisabled: 'disabled'\n }\n },\n isStaticColor: {\n fillStyle: {\n fill: {\n variant: {\n primary: 'auto',\n secondary: baseColor('transparent-overlay-800'),\n premium: 'white',\n genai: 'white'\n }\n },\n outline: {\n variant: {\n premium: 'white',\n genai: 'white'\n },\n default: baseColor('transparent-overlay-800')\n }\n },\n isDisabled: 'transparent-overlay-400'\n },\n forcedColors: {\n fillStyle: {\n fill: {\n default: 'ButtonFace',\n isDisabled: 'HighlightText'\n },\n outline: {\n default: 'ButtonText',\n isDisabled: 'GrayText'\n }\n }\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n },\n outlineColor: {\n default: 'focus-ring',\n isStaticColor: 'transparent-overlay-1000',\n forcedColors: 'Highlight'\n },\n forcedColorAdjust: 'none',\n disableTapHighlight: true\n}, getAllowedOverrides());\n\n// Put the gradient background on a separate element from the button to work around a Safari\n// bug where transitions of custom properties cause layout flickering if any properties use rems. 🤣\n// https://bugs.webkit.org/show_bug.cgi?id=285622\nconst gradient = style({\n position: 'absolute',\n inset: 0,\n zIndex: -1,\n transition: 'default',\n borderRadius: '[inherit]',\n backgroundImage: {\n variant: {\n premium: {\n default: linearGradient('to bottom right', ['fuchsia-900', 0], ['indigo-900', 66], ['blue-900', 100]),\n isHovered: linearGradient('to bottom right', ['fuchsia-1000', 0], ['indigo-1000', 66], ['blue-1000', 100]),\n isPressed: linearGradient('to bottom right', ['fuchsia-1000', 0], ['indigo-1000', 66], ['blue-1000', 100]),\n isFocusVisible: linearGradient('to bottom right', ['fuchsia-1000', 0], ['indigo-1000', 66], ['blue-1000', 100])\n },\n genai: {\n default: linearGradient('to bottom right', ['red-900', 0], ['magenta-900', 33], ['indigo-900', 100]),\n isHovered: linearGradient('to bottom right', ['red-1000', 0], ['magenta-1000', 33], ['indigo-1000', 100]),\n isPressed: linearGradient('to bottom right', ['red-1000', 0], ['magenta-1000', 33], ['indigo-1000', 100]),\n isFocusVisible: linearGradient('to bottom right', ['red-1000', 0], ['magenta-1000', 33], ['indigo-1000', 100])\n }\n },\n isDisabled: 'none',\n forcedColors: 'none'\n },\n // Force gradient colors to remain static between light and dark theme.\n colorScheme: {\n variant: {\n premium: 'light',\n genai: 'light'\n }\n }\n});\n\n/**\n * Buttons allow users to perform an action.\n * They have multiple styles for various needs, and are ideal for calling attention to\n * where a user needs to do something in order to move forward in a flow.\n */\nexport const Button = forwardRef(function Button(props: ButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ButtonContext);\n props = useFormProps(props);\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n let {\n isPending,\n variant = 'primary',\n fillStyle = 'fill',\n size = 'M',\n staticColor\n } = props;\n let domRef = useFocusableRef(ref);\n let overlayTriggerState = useContext(OverlayTriggerStateContext);\n\n let [isProgressVisible, setIsProgressVisible] = useState(false);\n useEffect(() => {\n let timeout: ReturnType<typeof setTimeout>;\n\n if (isPending) {\n // Start timer when isPending is set to true.\n timeout = setTimeout(() => {\n setIsProgressVisible(true);\n }, 1000);\n } else {\n // Exit loading state when isPending is set to false. */\n setIsProgressVisible(false);\n }\n return () => {\n // Clean up on unmount or when user removes isPending prop before entering loading state.\n clearTimeout(timeout);\n };\n }, [isPending]);\n\n return (\n <RACButton\n {...props}\n ref={domRef}\n style={pressScale(domRef, props.UNSAFE_style)}\n className={renderProps => (props.UNSAFE_className || '') + button({\n ...renderProps,\n // Retain hover styles when an overlay is open.\n isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,\n isDisabled: renderProps.isDisabled || isProgressVisible,\n variant,\n fillStyle,\n size,\n staticColor,\n isStaticColor: !!staticColor\n }, props.styles)}>\n {(renderProps) => (<>\n {variant === 'genai' || variant === 'premium' \n ? (\n <span\n className={gradient({\n ...renderProps,\n // Retain hover styles when an overlay is open.\n isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,\n isDisabled: renderProps.isDisabled || isProgressVisible,\n variant\n })} />\n )\n : null}\n <Provider\n values={[\n [SkeletonContext, null],\n [TextContext, {\n styles: style({\n paddingY: '--labelPadding',\n order: 1,\n opacity: {\n default: 1,\n isProgressVisible: 0\n }\n })({isProgressVisible}),\n // @ts-ignore data-attributes allowed on all JSX elements, but adding to DOMProps has been problematic in the past\n 'data-rsp-slot': 'text'\n }],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n styles: style({\n size: fontRelative(20),\n marginStart: '--iconMargin',\n flexShrink: 0,\n opacity: {\n default: 1,\n isProgressVisible: 0\n }\n })({isProgressVisible})\n }]\n ]}>\n {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n {isPending &&\n <div\n className={style({\n position: 'absolute',\n top: '[50%]',\n left: '[50%]',\n transform: 'translate(-50%, -50%)',\n opacity: {\n default: 0,\n isProgressVisible: 1\n }\n })({isProgressVisible, isPending})}>\n <ProgressCircle\n isIndeterminate\n aria-label={stringFormatter.format('button.pending')}\n size=\"S\"\n staticColor={staticColor}\n styles={style({\n size: {\n size: {\n S: 14,\n M: 18,\n L: 20,\n XL: 24\n }\n }\n })({size})} />\n </div>\n }\n </Provider>\n </>)}\n </RACButton>\n );\n});\n\n/**\n * A LinkButton combines the functionality of a link with the appearance of a button. Useful for allowing users to navigate to another page.\n */\nexport const LinkButton = forwardRef(function LinkButton(props: LinkButtonProps, ref: FocusableRef<HTMLAnchorElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, LinkButtonContext);\n props = useFormProps(props);\n let domRef = useFocusableRef(ref);\n let overlayTriggerState = useContext(OverlayTriggerStateContext);\n\n return (\n <Link\n {...props}\n ref={domRef}\n style={pressScale(domRef, props.UNSAFE_style)}\n className={renderProps => (props.UNSAFE_className || '') + button({\n ...renderProps,\n // Retain hover styles when an overlay is open.\n isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,\n variant: props.variant || 'primary',\n fillStyle: props.fillStyle || 'fill',\n size: props.size || 'M',\n staticColor: props.staticColor,\n isStaticColor: !!props.staticColor,\n isPending: false\n }, props.styles)}>\n <Provider\n values={[\n [SkeletonContext, null],\n [TextContext, {\n styles: style({paddingY: '--labelPadding', order: 1}),\n // @ts-ignore data-attributes allowed on all JSX elements, but adding to DOMProps has been problematic in the past\n 'data-rsp-slot': 'text'\n }],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n }]\n ]}>\n {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n </Provider>\n </Link>\n );\n});\n"],"names":[],"version":3,"file":"Button.cjs.map"}
1
+ {"mappings":"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","sources":["packages/@react-spectrum/s2/src/Button.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, fontRelative, linearGradient, style} from '../style' with {type: 'macro'};\nimport {ButtonRenderProps, ContextValue, Link, LinkProps, OverlayTriggerStateContext, Provider, Button as RACButton, ButtonProps as RACButtonProps} from 'react-aria-components';\nimport {centerBaseline} from './CenterBaseline';\nimport {centerPadding, getAllowedOverrides, staticColor, StyleProps} from './style-utils' with {type: 'macro'};\nimport {createContext, forwardRef, ReactNode, useContext, useEffect, useState} from 'react';\nimport {FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {IconContext} from './Icon';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {pressScale} from './pressScale';\nimport {ProgressCircle} from './ProgressCircle';\nimport {SkeletonContext} from './Skeleton';\nimport {Text, TextContext} from './Content';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useFormProps} from './Form';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\ninterface ButtonStyleProps {\n /**\n * The [visual style](https://spectrum.adobe.com/page/button/#Options) of the button.\n *\n * @default 'primary'\n */\n variant?: 'primary' | 'secondary' | 'accent' | 'negative' | 'premium' | 'genai',\n /**\n * The background style of the Button.\n *\n * @default 'fill'\n */\n fillStyle?: 'fill' | 'outline',\n /**\n * The size of the Button.\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\nexport interface ButtonProps extends Omit<RACButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, StyleProps, ButtonStyleProps {\n /** The content to display in the Button. */\n children?: ReactNode\n}\n\nexport interface LinkButtonProps extends Omit<LinkProps, 'className' | 'style' | 'children'>, StyleProps, ButtonStyleProps {\n /** The content to display in the Button. */\n children?: ReactNode\n}\n\nexport const ButtonContext = createContext<ContextValue<ButtonProps, FocusableRefValue<HTMLButtonElement>>>(null);\nexport const LinkButtonContext = createContext<ContextValue<ButtonProps, FocusableRefValue<HTMLAnchorElement>>>(null);\n\nconst iconOnly = ':has([slot=icon]):not(:has([data-rsp-slot=text]))';\nconst button = style<ButtonRenderProps & ButtonStyleProps & {isStaticColor: boolean}>({\n ...focusRing(),\n ...staticColor(),\n position: 'relative',\n display: 'flex',\n alignItems: {\n default: 'baseline',\n [iconOnly]: 'center'\n },\n justifyContent: 'center',\n textAlign: 'start',\n columnGap: 'text-to-visual',\n font: 'control',\n fontWeight: 'bold',\n userSelect: 'none',\n minHeight: 'control',\n minWidth: {\n [iconOnly]: 'control'\n },\n borderRadius: 'pill',\n boxSizing: 'border-box',\n width: 'fit',\n textDecoration: 'none', // for link buttons\n paddingX: {\n default: 'pill',\n [iconOnly]: 0\n },\n paddingY: 0,\n aspectRatio: {\n [iconOnly]: 'square'\n },\n transition: 'default',\n borderStyle: 'solid',\n borderWidth: {\n fillStyle: {\n fill: 0,\n outline: 2\n },\n variant: {\n premium: 0,\n genai: 0\n }\n },\n '--labelPadding': {\n type: 'paddingTop',\n value: centerPadding()\n },\n '--iconMargin': {\n type: 'marginTop',\n value: {\n default: fontRelative(-2),\n [iconOnly]: 0\n }\n },\n borderColor: {\n variant: {\n primary: baseColor('gray-800'),\n secondary: baseColor('gray-300')\n },\n isDisabled: 'disabled',\n isStaticColor: {\n variant: {\n primary: baseColor('transparent-overlay-800'),\n secondary: baseColor('transparent-overlay-300')\n },\n isDisabled: 'transparent-overlay-300'\n },\n forcedColors: {\n default: 'ButtonBorder',\n isHovered: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n backgroundColor: {\n fillStyle: {\n fill: {\n variant: {\n primary: 'neutral',\n secondary: baseColor('gray-100'),\n accent: 'accent',\n negative: 'negative',\n premium: 'gray-100',\n genai: 'gray-100'\n },\n isDisabled: 'disabled'\n },\n outline: {\n variant: {\n premium: 'gray-100',\n genai: 'gray-100'\n },\n default: 'transparent',\n isHovered: 'gray-100',\n isPressed: 'gray-100',\n isFocusVisible: 'gray-100',\n isDisabled: {\n default: 'transparent',\n variant: {\n premium: 'gray-100',\n genai: 'gray-100'\n }\n }\n }\n },\n isStaticColor: {\n fillStyle: {\n fill: {\n variant: {\n primary: baseColor('transparent-overlay-800'),\n secondary: baseColor('transparent-overlay-100'),\n premium: 'transparent-overlay-100',\n genai: 'transparent-overlay-100'\n },\n isDisabled: 'transparent-overlay-100'\n },\n outline: {\n variant: {\n premium: 'transparent-overlay-100',\n genai: 'transparent-overlay-100'\n },\n default: 'transparent',\n isHovered: 'transparent-overlay-100',\n isPressed: 'transparent-overlay-100',\n isFocusVisible: 'transparent-overlay-100',\n isDisabled: {\n default: 'transparent',\n variant: {\n premium: 'transparent-overlay-100',\n genai: 'transparent-overlay-100'\n }\n }\n }\n }\n },\n forcedColors: {\n fillStyle: {\n fill: {\n default: 'ButtonText',\n isHovered: 'Highlight',\n isDisabled: 'GrayText'\n },\n outline: 'ButtonFace'\n }\n }\n },\n color: {\n fillStyle: {\n fill: {\n variant: {\n primary: 'gray-25',\n secondary: 'neutral',\n accent: 'white',\n negative: 'white',\n premium: 'white',\n genai: 'white'\n },\n isDisabled: 'disabled'\n },\n outline: {\n default: 'neutral',\n variant: {\n premium: 'white',\n genai: 'white'\n },\n isDisabled: 'disabled'\n }\n },\n isStaticColor: {\n fillStyle: {\n fill: {\n variant: {\n primary: 'auto',\n secondary: baseColor('transparent-overlay-800'),\n premium: 'white',\n genai: 'white'\n }\n },\n outline: {\n variant: {\n premium: 'white',\n genai: 'white'\n },\n default: baseColor('transparent-overlay-800')\n }\n },\n isDisabled: 'transparent-overlay-400'\n },\n forcedColors: {\n fillStyle: {\n fill: {\n default: 'ButtonFace',\n isDisabled: 'HighlightText'\n },\n outline: {\n default: 'ButtonText',\n isDisabled: 'GrayText'\n }\n }\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n },\n outlineColor: {\n default: 'focus-ring',\n isStaticColor: 'transparent-overlay-1000',\n forcedColors: 'Highlight'\n },\n forcedColorAdjust: 'none',\n disableTapHighlight: true\n}, getAllowedOverrides());\n\n// Put the gradient background on a separate element from the button to work around a Safari\n// bug where transitions of custom properties cause layout flickering if any properties use rems. 🤣\n// https://bugs.webkit.org/show_bug.cgi?id=285622\nconst gradient = style({\n position: 'absolute',\n inset: 0,\n zIndex: -1,\n transition: 'default',\n borderRadius: '[inherit]',\n backgroundImage: {\n variant: {\n premium: {\n default: linearGradient('to bottom right', ['fuchsia-900', 0], ['indigo-900', 66], ['blue-900', 100]),\n isHovered: linearGradient('to bottom right', ['fuchsia-1000', 0], ['indigo-1000', 66], ['blue-1000', 100]),\n isPressed: linearGradient('to bottom right', ['fuchsia-1000', 0], ['indigo-1000', 66], ['blue-1000', 100]),\n isFocusVisible: linearGradient('to bottom right', ['fuchsia-1000', 0], ['indigo-1000', 66], ['blue-1000', 100])\n },\n genai: {\n default: linearGradient('to bottom right', ['red-900', 0], ['magenta-900', 33], ['indigo-900', 100]),\n isHovered: linearGradient('to bottom right', ['red-1000', 0], ['magenta-1000', 33], ['indigo-1000', 100]),\n isPressed: linearGradient('to bottom right', ['red-1000', 0], ['magenta-1000', 33], ['indigo-1000', 100]),\n isFocusVisible: linearGradient('to bottom right', ['red-1000', 0], ['magenta-1000', 33], ['indigo-1000', 100])\n }\n },\n isDisabled: 'none',\n forcedColors: 'none'\n },\n // Force gradient colors to remain static between light and dark theme.\n colorScheme: {\n variant: {\n premium: 'light',\n genai: 'light'\n }\n }\n});\n\n/**\n * Buttons allow users to perform an action.\n * They have multiple styles for various needs, and are ideal for calling attention to\n * where a user needs to do something in order to move forward in a flow.\n */\nexport const Button = forwardRef(function Button(props: ButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ButtonContext);\n props = useFormProps(props);\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n let {\n isPending,\n variant = 'primary',\n fillStyle = 'fill',\n size = 'M',\n staticColor\n } = props;\n let domRef = useFocusableRef(ref);\n let overlayTriggerState = useContext(OverlayTriggerStateContext);\n\n let [isProgressVisible, setIsProgressVisible] = useState(false);\n useEffect(() => {\n let timeout: ReturnType<typeof setTimeout>;\n\n if (isPending) {\n // Start timer when isPending is set to true.\n timeout = setTimeout(() => {\n setIsProgressVisible(true);\n }, 1000);\n } else {\n // Exit loading state when isPending is set to false. */\n setIsProgressVisible(false);\n }\n return () => {\n // Clean up on unmount or when user removes isPending prop before entering loading state.\n clearTimeout(timeout);\n };\n }, [isPending]);\n\n return (\n <RACButton\n {...props}\n ref={domRef}\n style={pressScale(domRef, props.UNSAFE_style)}\n className={renderProps => (props.UNSAFE_className || '') + button({\n ...renderProps,\n // Retain hover styles when an overlay is open.\n isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,\n isDisabled: renderProps.isDisabled || isProgressVisible,\n variant,\n fillStyle,\n size,\n staticColor,\n isStaticColor: !!staticColor\n }, props.styles)}>\n {(renderProps) => (<>\n {variant === 'genai' || variant === 'premium' \n ? (\n <span\n className={gradient({\n ...renderProps,\n // Retain hover styles when an overlay is open.\n isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,\n isDisabled: renderProps.isDisabled || isProgressVisible,\n variant\n })} />\n )\n : null}\n <Provider\n values={[\n [SkeletonContext, null],\n [TextContext, {\n styles: style({\n paddingY: '--labelPadding',\n order: 1,\n opacity: {\n default: 1,\n isProgressVisible: 0\n }\n })({isProgressVisible}),\n // @ts-ignore data-attributes allowed on all JSX elements, but adding to DOMProps has been problematic in the past\n 'data-rsp-slot': 'text'\n }],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n styles: style({\n size: fontRelative(20),\n marginStart: '--iconMargin',\n flexShrink: 0,\n opacity: {\n default: 1,\n isProgressVisible: 0\n }\n })({isProgressVisible})\n }]\n ]}>\n {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n {isPending &&\n <div\n className={style({\n position: 'absolute',\n top: '[50%]',\n left: '[50%]',\n transform: 'translate(-50%, -50%)',\n opacity: {\n default: 0,\n isProgressVisible: 1\n }\n })({isProgressVisible, isPending})}>\n <ProgressCircle\n isIndeterminate\n aria-label={stringFormatter.format('button.pending')}\n size=\"S\"\n staticColor={staticColor}\n styles={style({\n size: {\n size: {\n S: 14,\n M: 18,\n L: 20,\n XL: 24\n }\n }\n })({size})} />\n </div>\n }\n </Provider>\n </>)}\n </RACButton>\n );\n});\n\n/**\n * A LinkButton combines the functionality of a link with the appearance of a button. Useful for allowing users to navigate to another page.\n */\nexport const LinkButton = forwardRef(function LinkButton(props: LinkButtonProps, ref: FocusableRef<HTMLAnchorElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, LinkButtonContext);\n props = useFormProps(props);\n let domRef = useFocusableRef(ref);\n let overlayTriggerState = useContext(OverlayTriggerStateContext);\n\n return (\n <Link\n {...props}\n ref={domRef}\n style={pressScale(domRef, props.UNSAFE_style)}\n className={renderProps => (props.UNSAFE_className || '') + button({\n ...renderProps,\n // Retain hover styles when an overlay is open.\n isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,\n variant: props.variant || 'primary',\n fillStyle: props.fillStyle || 'fill',\n size: props.size || 'M',\n staticColor: props.staticColor,\n isStaticColor: !!props.staticColor,\n isPending: false\n }, props.styles)}>\n <Provider\n values={[\n [SkeletonContext, null],\n [TextContext, {\n styles: style({paddingY: '--labelPadding', order: 1}),\n // @ts-ignore data-attributes allowed on all JSX elements, but adding to DOMProps has been problematic in the past\n 'data-rsp-slot': 'text'\n }],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n }]\n ]}>\n {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n </Provider>\n </Link>\n );\n});\n"],"names":[],"version":3,"file":"Button.cjs.map"}