@react-spectrum/s2 3.0.0-nightly-63d4359d6-250428 → 3.0.0-nightly-1dd65ffc5-250429

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 (365) hide show
  1. package/dist/Accordion.cjs +4 -5
  2. package/dist/Accordion.cjs.map +1 -1
  3. package/dist/Accordion.css +2 -4
  4. package/dist/Accordion.css.map +1 -1
  5. package/dist/Accordion.mjs +4 -5
  6. package/dist/Accordion.mjs.map +1 -1
  7. package/dist/ActionBar.cjs +72 -63
  8. package/dist/ActionBar.cjs.map +1 -1
  9. package/dist/ActionBar.css +70 -63
  10. package/dist/ActionBar.css.map +1 -1
  11. package/dist/ActionBar.mjs +72 -63
  12. package/dist/ActionBar.mjs.map +1 -1
  13. package/dist/ActionButton.cjs +161 -160
  14. package/dist/ActionButton.cjs.map +1 -1
  15. package/dist/ActionButton.css +174 -168
  16. package/dist/ActionButton.css.map +1 -1
  17. package/dist/ActionButton.mjs +161 -160
  18. package/dist/ActionButton.mjs.map +1 -1
  19. package/dist/ActionButtonGroup.cjs +17 -18
  20. package/dist/ActionButtonGroup.cjs.map +1 -1
  21. package/dist/ActionButtonGroup.css +9 -11
  22. package/dist/ActionButtonGroup.css.map +1 -1
  23. package/dist/ActionButtonGroup.mjs +17 -18
  24. package/dist/ActionButtonGroup.mjs.map +1 -1
  25. package/dist/AlertDialog.cjs +4 -4
  26. package/dist/AlertDialog.css +3 -5
  27. package/dist/AlertDialog.css.map +1 -1
  28. package/dist/AlertDialog.mjs +4 -4
  29. package/dist/Avatar.cjs +21 -21
  30. package/dist/Avatar.css +14 -16
  31. package/dist/Avatar.css.map +1 -1
  32. package/dist/Avatar.mjs +21 -21
  33. package/dist/AvatarGroup.cjs +131 -110
  34. package/dist/AvatarGroup.cjs.map +1 -1
  35. package/dist/AvatarGroup.css +43 -49
  36. package/dist/AvatarGroup.css.map +1 -1
  37. package/dist/AvatarGroup.mjs +131 -110
  38. package/dist/AvatarGroup.mjs.map +1 -1
  39. package/dist/Badge.cjs +150 -149
  40. package/dist/Badge.cjs.map +1 -1
  41. package/dist/Badge.css +140 -134
  42. package/dist/Badge.css.map +1 -1
  43. package/dist/Badge.mjs +150 -149
  44. package/dist/Badge.mjs.map +1 -1
  45. package/dist/Breadcrumbs.cjs +169 -154
  46. package/dist/Breadcrumbs.cjs.map +1 -1
  47. package/dist/Breadcrumbs.css +119 -105
  48. package/dist/Breadcrumbs.css.map +1 -1
  49. package/dist/Breadcrumbs.mjs +169 -154
  50. package/dist/Breadcrumbs.mjs.map +1 -1
  51. package/dist/Button.cjs +321 -275
  52. package/dist/Button.cjs.map +1 -1
  53. package/dist/Button.css +245 -215
  54. package/dist/Button.css.map +1 -1
  55. package/dist/Button.mjs +321 -275
  56. package/dist/Button.mjs.map +1 -1
  57. package/dist/ButtonGroup.cjs +27 -25
  58. package/dist/ButtonGroup.cjs.map +1 -1
  59. package/dist/ButtonGroup.css +15 -17
  60. package/dist/ButtonGroup.css.map +1 -1
  61. package/dist/ButtonGroup.mjs +27 -25
  62. package/dist/ButtonGroup.mjs.map +1 -1
  63. package/dist/Card.cjs +316 -299
  64. package/dist/Card.cjs.map +1 -1
  65. package/dist/Card.css +242 -215
  66. package/dist/Card.css.map +1 -1
  67. package/dist/Card.mjs +316 -299
  68. package/dist/Card.mjs.map +1 -1
  69. package/dist/CardView.cjs +29 -30
  70. package/dist/CardView.cjs.map +1 -1
  71. package/dist/CardView.css +19 -19
  72. package/dist/CardView.mjs +29 -30
  73. package/dist/CardView.mjs.map +1 -1
  74. package/dist/CenterBaseline.cjs +2 -2
  75. package/dist/CenterBaseline.css +3 -5
  76. package/dist/CenterBaseline.css.map +1 -1
  77. package/dist/CenterBaseline.mjs +2 -2
  78. package/dist/Checkbox.cjs +114 -112
  79. package/dist/Checkbox.cjs.map +1 -1
  80. package/dist/Checkbox.css +99 -93
  81. package/dist/Checkbox.css.map +1 -1
  82. package/dist/Checkbox.mjs +114 -112
  83. package/dist/Checkbox.mjs.map +1 -1
  84. package/dist/CheckboxGroup.cjs +54 -54
  85. package/dist/CheckboxGroup.css +42 -42
  86. package/dist/CheckboxGroup.mjs +54 -54
  87. package/dist/ClearButton.cjs +19 -19
  88. package/dist/ClearButton.css +19 -21
  89. package/dist/ClearButton.css.map +1 -1
  90. package/dist/ClearButton.mjs +19 -19
  91. package/dist/CloseButton.cjs +64 -62
  92. package/dist/CloseButton.cjs.map +1 -1
  93. package/dist/CloseButton.css +48 -48
  94. package/dist/CloseButton.mjs +64 -62
  95. package/dist/CloseButton.mjs.map +1 -1
  96. package/dist/ColorArea.cjs +28 -28
  97. package/dist/ColorArea.css +17 -17
  98. package/dist/ColorArea.mjs +28 -28
  99. package/dist/ColorField.cjs +41 -41
  100. package/dist/ColorField.css +33 -33
  101. package/dist/ColorField.mjs +41 -41
  102. package/dist/ColorHandle.cjs +29 -29
  103. package/dist/ColorHandle.css +45 -45
  104. package/dist/ColorHandle.mjs +29 -29
  105. package/dist/ColorSlider.cjs +68 -64
  106. package/dist/ColorSlider.cjs.map +1 -1
  107. package/dist/ColorSlider.css +64 -58
  108. package/dist/ColorSlider.css.map +1 -1
  109. package/dist/ColorSlider.mjs +68 -64
  110. package/dist/ColorSlider.mjs.map +1 -1
  111. package/dist/ColorSwatch.cjs +44 -38
  112. package/dist/ColorSwatch.cjs.map +1 -1
  113. package/dist/ColorSwatch.css +29 -31
  114. package/dist/ColorSwatch.css.map +1 -1
  115. package/dist/ColorSwatch.mjs +44 -38
  116. package/dist/ColorSwatch.mjs.map +1 -1
  117. package/dist/ColorSwatchPicker.cjs +31 -32
  118. package/dist/ColorSwatchPicker.cjs.map +1 -1
  119. package/dist/ColorSwatchPicker.css +48 -48
  120. package/dist/ColorSwatchPicker.css.map +1 -1
  121. package/dist/ColorSwatchPicker.mjs +31 -32
  122. package/dist/ColorSwatchPicker.mjs.map +1 -1
  123. package/dist/ColorWheel.cjs +28 -28
  124. package/dist/ColorWheel.css +18 -18
  125. package/dist/ColorWheel.mjs +28 -28
  126. package/dist/ComboBox.cjs +108 -108
  127. package/dist/ComboBox.css +101 -101
  128. package/dist/ComboBox.mjs +108 -108
  129. package/dist/ContextualHelp.cjs +5 -5
  130. package/dist/ContextualHelp.css +58 -44
  131. package/dist/ContextualHelp.css.map +1 -1
  132. package/dist/ContextualHelp.mjs +5 -5
  133. package/dist/CustomDialog.cjs +38 -38
  134. package/dist/CustomDialog.css +26 -26
  135. package/dist/CustomDialog.mjs +38 -38
  136. package/dist/Dialog.cjs +18 -18
  137. package/dist/Dialog.css +86 -72
  138. package/dist/Dialog.css.map +1 -1
  139. package/dist/Dialog.mjs +18 -18
  140. package/dist/Disclosure.cjs +139 -133
  141. package/dist/Disclosure.cjs.map +1 -1
  142. package/dist/Disclosure.css +144 -120
  143. package/dist/Disclosure.css.map +1 -1
  144. package/dist/Disclosure.mjs +139 -133
  145. package/dist/Disclosure.mjs.map +1 -1
  146. package/dist/Divider.cjs +47 -47
  147. package/dist/Divider.css +26 -26
  148. package/dist/Divider.mjs +47 -47
  149. package/dist/DropZone.cjs +68 -64
  150. package/dist/DropZone.cjs.map +1 -1
  151. package/dist/DropZone.css +66 -60
  152. package/dist/DropZone.css.map +1 -1
  153. package/dist/DropZone.mjs +68 -64
  154. package/dist/DropZone.mjs.map +1 -1
  155. package/dist/Field.cjs +192 -186
  156. package/dist/Field.cjs.map +1 -1
  157. package/dist/Field.css +167 -159
  158. package/dist/Field.css.map +1 -1
  159. package/dist/Field.mjs +192 -186
  160. package/dist/Field.mjs.map +1 -1
  161. package/dist/Form.cjs +11 -12
  162. package/dist/Form.cjs.map +1 -1
  163. package/dist/Form.css +9 -11
  164. package/dist/Form.css.map +1 -1
  165. package/dist/Form.mjs +11 -12
  166. package/dist/Form.mjs.map +1 -1
  167. package/dist/FullscreenDialog.cjs +5 -5
  168. package/dist/FullscreenDialog.css +94 -80
  169. package/dist/FullscreenDialog.css.map +1 -1
  170. package/dist/FullscreenDialog.mjs +5 -5
  171. package/dist/IllustratedMessage.cjs +185 -160
  172. package/dist/IllustratedMessage.cjs.map +1 -1
  173. package/dist/IllustratedMessage.css +93 -91
  174. package/dist/IllustratedMessage.css.map +1 -1
  175. package/dist/IllustratedMessage.mjs +185 -160
  176. package/dist/IllustratedMessage.mjs.map +1 -1
  177. package/dist/Image.cjs +14 -14
  178. package/dist/Image.css +14 -16
  179. package/dist/Image.css.map +1 -1
  180. package/dist/Image.mjs +14 -14
  181. package/dist/InlineAlert.cjs +130 -122
  182. package/dist/InlineAlert.cjs.map +1 -1
  183. package/dist/InlineAlert.css +109 -95
  184. package/dist/InlineAlert.css.map +1 -1
  185. package/dist/InlineAlert.mjs +130 -122
  186. package/dist/InlineAlert.mjs.map +1 -1
  187. package/dist/Link.cjs +57 -47
  188. package/dist/Link.cjs.map +1 -1
  189. package/dist/Link.css +52 -44
  190. package/dist/Link.css.map +1 -1
  191. package/dist/Link.mjs +57 -47
  192. package/dist/Link.mjs.map +1 -1
  193. package/dist/Menu.cjs +353 -325
  194. package/dist/Menu.cjs.map +1 -1
  195. package/dist/Menu.css +189 -189
  196. package/dist/Menu.css.map +1 -1
  197. package/dist/Menu.mjs +353 -325
  198. package/dist/Menu.mjs.map +1 -1
  199. package/dist/Meter.cjs +116 -114
  200. package/dist/Meter.cjs.map +1 -1
  201. package/dist/Meter.css +106 -104
  202. package/dist/Meter.css.map +1 -1
  203. package/dist/Meter.mjs +116 -114
  204. package/dist/Meter.mjs.map +1 -1
  205. package/dist/Modal.cjs +62 -59
  206. package/dist/Modal.cjs.map +1 -1
  207. package/dist/Modal.css +52 -51
  208. package/dist/Modal.css.map +1 -1
  209. package/dist/Modal.mjs +62 -59
  210. package/dist/Modal.mjs.map +1 -1
  211. package/dist/NotificationBadge.cjs +66 -62
  212. package/dist/NotificationBadge.cjs.map +1 -1
  213. package/dist/NotificationBadge.css +78 -72
  214. package/dist/NotificationBadge.css.map +1 -1
  215. package/dist/NotificationBadge.mjs +66 -62
  216. package/dist/NotificationBadge.mjs.map +1 -1
  217. package/dist/NumberField.cjs +133 -133
  218. package/dist/NumberField.css +120 -120
  219. package/dist/NumberField.mjs +133 -133
  220. package/dist/Picker.cjs +209 -207
  221. package/dist/Picker.cjs.map +1 -1
  222. package/dist/Picker.css +179 -173
  223. package/dist/Picker.css.map +1 -1
  224. package/dist/Picker.mjs +209 -207
  225. package/dist/Picker.mjs.map +1 -1
  226. package/dist/Popover.cjs +124 -93
  227. package/dist/Popover.cjs.map +1 -1
  228. package/dist/Popover.css +67 -83
  229. package/dist/Popover.css.map +1 -1
  230. package/dist/Popover.mjs +124 -93
  231. package/dist/Popover.mjs.map +1 -1
  232. package/dist/ProgressBar.cjs +132 -130
  233. package/dist/ProgressBar.cjs.map +1 -1
  234. package/dist/ProgressBar.css +119 -117
  235. package/dist/ProgressBar.css.map +1 -1
  236. package/dist/ProgressBar.mjs +132 -130
  237. package/dist/ProgressBar.mjs.map +1 -1
  238. package/dist/ProgressCircle.cjs +32 -32
  239. package/dist/ProgressCircle.css +20 -20
  240. package/dist/ProgressCircle.css.map +1 -1
  241. package/dist/ProgressCircle.mjs +32 -32
  242. package/dist/Provider.cjs +11 -11
  243. package/dist/Provider.css +9 -11
  244. package/dist/Provider.css.map +1 -1
  245. package/dist/Provider.mjs +11 -11
  246. package/dist/Radio.cjs +101 -99
  247. package/dist/Radio.cjs.map +1 -1
  248. package/dist/Radio.css +101 -95
  249. package/dist/Radio.css.map +1 -1
  250. package/dist/Radio.mjs +101 -99
  251. package/dist/Radio.mjs.map +1 -1
  252. package/dist/RadioGroup.cjs +52 -52
  253. package/dist/RadioGroup.css +42 -42
  254. package/dist/RadioGroup.mjs +52 -52
  255. package/dist/SearchField.cjs +52 -52
  256. package/dist/SearchField.css +54 -54
  257. package/dist/SearchField.mjs +52 -52
  258. package/dist/SegmentedControl.cjs +123 -119
  259. package/dist/SegmentedControl.cjs.map +1 -1
  260. package/dist/SegmentedControl.css +110 -104
  261. package/dist/SegmentedControl.css.map +1 -1
  262. package/dist/SegmentedControl.mjs +123 -119
  263. package/dist/SegmentedControl.mjs.map +1 -1
  264. package/dist/Slider.cjs +251 -248
  265. package/dist/Slider.cjs.map +1 -1
  266. package/dist/Slider.css +166 -157
  267. package/dist/Slider.css.map +1 -1
  268. package/dist/Slider.mjs +251 -248
  269. package/dist/Slider.mjs.map +1 -1
  270. package/dist/StatusLight.cjs +74 -70
  271. package/dist/StatusLight.cjs.map +1 -1
  272. package/dist/StatusLight.css +70 -64
  273. package/dist/StatusLight.css.map +1 -1
  274. package/dist/StatusLight.mjs +74 -70
  275. package/dist/StatusLight.mjs.map +1 -1
  276. package/dist/Switch.cjs +110 -108
  277. package/dist/Switch.cjs.map +1 -1
  278. package/dist/Switch.css +86 -80
  279. package/dist/Switch.css.map +1 -1
  280. package/dist/Switch.mjs +110 -108
  281. package/dist/Switch.mjs.map +1 -1
  282. package/dist/TableView.cjs +334 -329
  283. package/dist/TableView.cjs.map +1 -1
  284. package/dist/TableView.css +193 -193
  285. package/dist/TableView.css.map +1 -1
  286. package/dist/TableView.mjs +334 -329
  287. package/dist/TableView.mjs.map +1 -1
  288. package/dist/Tabs.cjs +153 -149
  289. package/dist/Tabs.cjs.map +1 -1
  290. package/dist/Tabs.css +102 -96
  291. package/dist/Tabs.css.map +1 -1
  292. package/dist/Tabs.mjs +153 -149
  293. package/dist/Tabs.mjs.map +1 -1
  294. package/dist/TabsPicker.cjs +131 -129
  295. package/dist/TabsPicker.cjs.map +1 -1
  296. package/dist/TabsPicker.css +132 -126
  297. package/dist/TabsPicker.css.map +1 -1
  298. package/dist/TabsPicker.mjs +131 -129
  299. package/dist/TabsPicker.mjs.map +1 -1
  300. package/dist/TagGroup.cjs +197 -193
  301. package/dist/TagGroup.cjs.map +1 -1
  302. package/dist/TagGroup.css +164 -158
  303. package/dist/TagGroup.css.map +1 -1
  304. package/dist/TagGroup.mjs +197 -193
  305. package/dist/TagGroup.mjs.map +1 -1
  306. package/dist/TextField.cjs +67 -65
  307. package/dist/TextField.cjs.map +1 -1
  308. package/dist/TextField.css +71 -65
  309. package/dist/TextField.css.map +1 -1
  310. package/dist/TextField.mjs +67 -65
  311. package/dist/TextField.mjs.map +1 -1
  312. package/dist/Toast.cjs +138 -136
  313. package/dist/Toast.cjs.map +1 -1
  314. package/dist/Toast.css +117 -111
  315. package/dist/Toast.css.map +1 -1
  316. package/dist/Toast.mjs +138 -136
  317. package/dist/Toast.mjs.map +1 -1
  318. package/dist/ToggleButton.cjs +3 -3
  319. package/dist/ToggleButton.css +12 -14
  320. package/dist/ToggleButton.css.map +1 -1
  321. package/dist/ToggleButton.mjs +3 -3
  322. package/dist/Tooltip.cjs +99 -72
  323. package/dist/Tooltip.cjs.map +1 -1
  324. package/dist/Tooltip.css +87 -87
  325. package/dist/Tooltip.css.map +1 -1
  326. package/dist/Tooltip.mjs +99 -72
  327. package/dist/Tooltip.mjs.map +1 -1
  328. package/dist/TreeView.cjs +169 -157
  329. package/dist/TreeView.cjs.map +1 -1
  330. package/dist/TreeView.css +155 -153
  331. package/dist/TreeView.css.map +1 -1
  332. package/dist/TreeView.mjs +169 -157
  333. package/dist/TreeView.mjs.map +1 -1
  334. package/dist/types.d.ts +1 -1
  335. package/dist/types.d.ts.map +1 -1
  336. package/icons/Skeleton.cjs +3 -3
  337. package/icons/Skeleton.cjs.map +1 -1
  338. package/icons/Skeleton.css +8 -10
  339. package/icons/Skeleton.css.map +1 -1
  340. package/icons/Skeleton.mjs +3 -3
  341. package/icons/Skeleton.mjs.map +1 -1
  342. package/package.json +22 -22
  343. package/src/Card.tsx +3 -3
  344. package/src/Disclosure.tsx +3 -3
  345. package/src/TableView.tsx +1 -4
  346. package/src/style-utils.ts +0 -2
  347. package/style/__tests__/style-macro.test.js +323 -27
  348. package/style/dist/properties.cjs +4 -0
  349. package/style/dist/properties.cjs.map +1 -0
  350. package/style/dist/properties.mjs +6 -0
  351. package/style/dist/properties.mjs.map +1 -0
  352. package/style/dist/spectrum-theme.cjs +123 -124
  353. package/style/dist/spectrum-theme.cjs.map +1 -1
  354. package/style/dist/spectrum-theme.mjs +124 -125
  355. package/style/dist/spectrum-theme.mjs.map +1 -1
  356. package/style/dist/style-macro.cjs +244 -263
  357. package/style/dist/style-macro.cjs.map +1 -1
  358. package/style/dist/style-macro.mjs +240 -259
  359. package/style/dist/style-macro.mjs.map +1 -1
  360. package/style/dist/types.d.ts +84 -80
  361. package/style/dist/types.d.ts.map +1 -1
  362. package/style/properties.json +2422 -0
  363. package/style/spectrum-theme.ts +101 -110
  364. package/style/style-macro.ts +319 -220
  365. package/style/types.ts +8 -4
@@ -1,40 +1,38 @@
1
1
  @layer _.a {
2
- ._0d {
2
+ .ma {
3
3
  display: flex;
4
4
  }
5
5
 
6
- ._7a {
6
+ ._Bb {
7
7
  flex-direction: row;
8
8
  }
9
9
 
10
- ._7b {
10
+ ._Ba {
11
11
  flex-direction: column;
12
12
  }
13
13
 
14
- .ib {
14
+ .pg {
15
15
  row-gap: .125rem;
16
16
  }
17
17
 
18
- .ic {
18
+ .pb {
19
19
  row-gap: .25rem;
20
20
  }
21
21
 
22
- .id {
22
+ .pa {
23
23
  row-gap: .5rem;
24
24
  }
25
25
 
26
- .jb {
26
+ .ki {
27
27
  column-gap: .125rem;
28
28
  }
29
29
 
30
- .jc {
30
+ .ke {
31
31
  column-gap: .25rem;
32
32
  }
33
33
 
34
- .jd {
34
+ .kd {
35
35
  column-gap: .5rem;
36
36
  }
37
37
  }
38
-
39
- @layer _.b;
40
38
  /*# sourceMappingURL=ActionButtonGroup.css.map */
@@ -1 +1 @@
1
- {"mappings":"AAiDgC;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA","sources":["packages/@react-spectrum/s2/src/ActionButtonGroup.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 {AriaLabelingProps} from '@react-types/shared';\nimport {ContextValue, SlotProps, Toolbar} from 'react-aria-components';\nimport {createContext, ForwardedRef, forwardRef, ReactNode} from 'react';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ActionButtonGroupProps extends AriaLabelingProps, UnsafeStyles, SlotProps {\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithHeight,\n /** The children of the group. */\n children: ReactNode,\n /**\n * Size of the buttons.\n * @default \"M\"\n */\n size?: 'XS' | 'S' | 'M' | 'L' | 'XL',\n /**\n * Spacing between the buttons.\n * @default \"regular\"\n */\n density?: 'compact' | 'regular',\n /** Whether the button should be displayed with a [quiet style](https://spectrum.adobe.com/page/action-button/#Quiet). */\n isQuiet?: boolean,\n /** Whether the buttons should divide the container width equally. */\n isJustified?: boolean,\n /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n staticColor?: 'white' | 'black' | 'auto',\n /**\n * The axis the group should align with.\n * @default 'horizontal'\n */\n orientation?: 'horizontal' | 'vertical',\n /** Whether the group is disabled. */\n isDisabled?: boolean\n}\n\nexport const actionGroupStyle = style({\n display: 'flex',\n flexDirection: {\n orientation: {\n horizontal: 'row',\n vertical: 'column'\n }\n },\n gap: {\n density: {\n compact: 2,\n regular: {\n size: {\n XS: 4,\n S: 4,\n M: 8,\n L: 8,\n XL: 8\n }\n }\n }\n }\n}, getAllowedOverrides({height: true}));\n\n\nexport const ActionButtonGroupContext = createContext<ContextValue<Partial<ActionButtonGroupProps>, HTMLDivElement>>(null);\n\n/**\n * An ActionButtonGroup is a grouping of related ActionButtons.\n */\nexport const ActionButtonGroup = forwardRef(function ActionButtonGroup(props: ActionButtonGroupProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ActionButtonGroupContext);\n let {\n density = 'regular',\n size = 'M',\n orientation = 'horizontal',\n isJustified,\n children,\n UNSAFE_className = '',\n UNSAFE_style,\n styles\n } = props;\n\n return (\n <Toolbar\n {...props}\n ref={ref}\n style={UNSAFE_style}\n className={UNSAFE_className + actionGroupStyle({size, density, orientation, isJustified}, styles)}>\n <ActionButtonGroupContext.Provider value={props}>\n {children}\n </ActionButtonGroupContext.Provider>\n </Toolbar>\n );\n});\n"],"names":[],"version":3,"file":"ActionButtonGroup.css.map"}
1
+ {"mappings":"AAiDgC;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA","sources":["packages/@react-spectrum/s2/src/ActionButtonGroup.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 {AriaLabelingProps} from '@react-types/shared';\nimport {ContextValue, SlotProps, Toolbar} from 'react-aria-components';\nimport {createContext, ForwardedRef, forwardRef, ReactNode} from 'react';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ActionButtonGroupProps extends AriaLabelingProps, UnsafeStyles, SlotProps {\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithHeight,\n /** The children of the group. */\n children: ReactNode,\n /**\n * Size of the buttons.\n * @default \"M\"\n */\n size?: 'XS' | 'S' | 'M' | 'L' | 'XL',\n /**\n * Spacing between the buttons.\n * @default \"regular\"\n */\n density?: 'compact' | 'regular',\n /** Whether the button should be displayed with a [quiet style](https://spectrum.adobe.com/page/action-button/#Quiet). */\n isQuiet?: boolean,\n /** Whether the buttons should divide the container width equally. */\n isJustified?: boolean,\n /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n staticColor?: 'white' | 'black' | 'auto',\n /**\n * The axis the group should align with.\n * @default 'horizontal'\n */\n orientation?: 'horizontal' | 'vertical',\n /** Whether the group is disabled. */\n isDisabled?: boolean\n}\n\nexport const actionGroupStyle = style({\n display: 'flex',\n flexDirection: {\n orientation: {\n horizontal: 'row',\n vertical: 'column'\n }\n },\n gap: {\n density: {\n compact: 2,\n regular: {\n size: {\n XS: 4,\n S: 4,\n M: 8,\n L: 8,\n XL: 8\n }\n }\n }\n }\n}, getAllowedOverrides({height: true}));\n\n\nexport const ActionButtonGroupContext = createContext<ContextValue<Partial<ActionButtonGroupProps>, HTMLDivElement>>(null);\n\n/**\n * An ActionButtonGroup is a grouping of related ActionButtons.\n */\nexport const ActionButtonGroup = forwardRef(function ActionButtonGroup(props: ActionButtonGroupProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ActionButtonGroupContext);\n let {\n density = 'regular',\n size = 'M',\n orientation = 'horizontal',\n isJustified,\n children,\n UNSAFE_className = '',\n UNSAFE_style,\n styles\n } = props;\n\n return (\n <Toolbar\n {...props}\n ref={ref}\n style={UNSAFE_style}\n className={UNSAFE_className + actionGroupStyle({size, density, orientation, isJustified}, styles)}>\n <ActionButtonGroupContext.Provider value={props}>\n {children}\n </ActionButtonGroupContext.Provider>\n </Toolbar>\n );\n});\n"],"names":[],"version":3,"file":"ActionButtonGroup.css.map"}
@@ -19,26 +19,25 @@ import {createContext as $aTsYn$createContext, forwardRef as $aTsYn$forwardRef}
19
19
 
20
20
 
21
21
  const $10401bdc118cbc90$export$641cbcd1f6f6802f = function anonymous(props, overrides) {
22
- let rules = " .";
23
- 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|k|o|p)[^\s]+/g) || [];
24
- rules += matches.join('');
25
- rules += ' _0d';
26
- if (props.orientation === "vertical") rules += ' _7b';
27
- else if (props.orientation === "horizontal") rules += ' _7a';
22
+ let rules = " ";
23
+ rules += ((overrides || '').match(/(?:^|\s)(j|l|h|i|_H|_r|M|__f|_X|_M|L|N|_f|_d|K|__B|H|G|J|I|f|u|_l|e|s|_w)[^\s]+/g) || []).join('');
24
+ rules += ' ma';
25
+ if (props.orientation === "vertical") rules += ' _Ba';
26
+ else if (props.orientation === "horizontal") rules += ' _Bb';
28
27
  if (props.density === "regular") {
29
- if (props.size === "XL") rules += ' id';
30
- else if (props.size === "L") rules += ' id';
31
- else if (props.size === "M") rules += ' id';
32
- else if (props.size === "S") rules += ' ic';
33
- else if (props.size === "XS") rules += ' ic';
34
- } else if (props.density === "compact") rules += ' ib';
28
+ if (props.size === "XL") rules += ' pa';
29
+ else if (props.size === "L") rules += ' pa';
30
+ else if (props.size === "M") rules += ' pa';
31
+ else if (props.size === "S") rules += ' pb';
32
+ else if (props.size === "XS") rules += ' pb';
33
+ } else if (props.density === "compact") rules += ' pg';
35
34
  if (props.density === "regular") {
36
- if (props.size === "XL") rules += ' jd';
37
- else if (props.size === "L") rules += ' jd';
38
- else if (props.size === "M") rules += ' jd';
39
- else if (props.size === "S") rules += ' jc';
40
- else if (props.size === "XS") rules += ' jc';
41
- } else if (props.density === "compact") rules += ' jb';
35
+ if (props.size === "XL") rules += ' kd';
36
+ else if (props.size === "L") rules += ' kd';
37
+ else if (props.size === "M") rules += ' kd';
38
+ else if (props.size === "S") rules += ' ke';
39
+ else if (props.size === "XS") rules += ' ke';
40
+ } else if (props.density === "compact") rules += ' ki';
42
41
  return rules;
43
42
  };
44
43
  const $10401bdc118cbc90$export$33f5f2f2cb85d743 = /*#__PURE__*/ (0, $aTsYn$createContext)(null);
@@ -1 +1 @@
1
- {"mappings":";;;;;;AAAA;;;;;;;;;;CAUC;;;;AAuCM,MAAM;;;;;;;;;;;;;;;;;;;;;;;AAyBN,MAAM,0DAA2B,CAAA,GAAA,oBAAY,EAAiE;AAK9G,MAAM,0DAAoB,CAAA,GAAA,iBAAS,EAAE,SAAS,kBAAkB,KAA6B,EAAE,GAAiC;IACrI,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,WACF,UAAU,iBACV,OAAO,kBACP,cAAc,2BACd,WAAW,YACX,QAAQ,oBACR,mBAAmB,kBACnB,YAAY,UACZ,MAAM,EACP,GAAG;IAEJ,qBACE,gBAAC,CAAA,GAAA,cAAM;QACJ,GAAG,KAAK;QACT,KAAK;QACL,OAAO;QACP,WAAW,mBAAmB,0CAAiB;kBAAC;qBAAM;yBAAS;yBAAa;QAAW,GAAG;kBAC1F,cAAA,gBAAC,0CAAyB,QAAQ;YAAC,OAAO;sBACvC;;;AAIT","sources":["packages/@react-spectrum/s2/src/ActionButtonGroup.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 {AriaLabelingProps} from '@react-types/shared';\nimport {ContextValue, SlotProps, Toolbar} from 'react-aria-components';\nimport {createContext, ForwardedRef, forwardRef, ReactNode} from 'react';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ActionButtonGroupProps extends AriaLabelingProps, UnsafeStyles, SlotProps {\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithHeight,\n /** The children of the group. */\n children: ReactNode,\n /**\n * Size of the buttons.\n * @default \"M\"\n */\n size?: 'XS' | 'S' | 'M' | 'L' | 'XL',\n /**\n * Spacing between the buttons.\n * @default \"regular\"\n */\n density?: 'compact' | 'regular',\n /** Whether the button should be displayed with a [quiet style](https://spectrum.adobe.com/page/action-button/#Quiet). */\n isQuiet?: boolean,\n /** Whether the buttons should divide the container width equally. */\n isJustified?: boolean,\n /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n staticColor?: 'white' | 'black' | 'auto',\n /**\n * The axis the group should align with.\n * @default 'horizontal'\n */\n orientation?: 'horizontal' | 'vertical',\n /** Whether the group is disabled. */\n isDisabled?: boolean\n}\n\nexport const actionGroupStyle = style({\n display: 'flex',\n flexDirection: {\n orientation: {\n horizontal: 'row',\n vertical: 'column'\n }\n },\n gap: {\n density: {\n compact: 2,\n regular: {\n size: {\n XS: 4,\n S: 4,\n M: 8,\n L: 8,\n XL: 8\n }\n }\n }\n }\n}, getAllowedOverrides({height: true}));\n\n\nexport const ActionButtonGroupContext = createContext<ContextValue<Partial<ActionButtonGroupProps>, HTMLDivElement>>(null);\n\n/**\n * An ActionButtonGroup is a grouping of related ActionButtons.\n */\nexport const ActionButtonGroup = forwardRef(function ActionButtonGroup(props: ActionButtonGroupProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ActionButtonGroupContext);\n let {\n density = 'regular',\n size = 'M',\n orientation = 'horizontal',\n isJustified,\n children,\n UNSAFE_className = '',\n UNSAFE_style,\n styles\n } = props;\n\n return (\n <Toolbar\n {...props}\n ref={ref}\n style={UNSAFE_style}\n className={UNSAFE_className + actionGroupStyle({size, density, orientation, isJustified}, styles)}>\n <ActionButtonGroupContext.Provider value={props}>\n {children}\n </ActionButtonGroupContext.Provider>\n </Toolbar>\n );\n});\n"],"names":[],"version":3,"file":"ActionButtonGroup.mjs.map"}
1
+ {"mappings":";;;;;;AAAA;;;;;;;;;;CAUC;;;;AAuCM,MAAM;;;;;;;;;;;;;;;;;;;;;;AAyBN,MAAM,0DAA2B,CAAA,GAAA,oBAAY,EAAiE;AAK9G,MAAM,0DAAoB,CAAA,GAAA,iBAAS,EAAE,SAAS,kBAAkB,KAA6B,EAAE,GAAiC;IACrI,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,WACF,UAAU,iBACV,OAAO,kBACP,cAAc,2BACd,WAAW,YACX,QAAQ,oBACR,mBAAmB,kBACnB,YAAY,UACZ,MAAM,EACP,GAAG;IAEJ,qBACE,gBAAC,CAAA,GAAA,cAAM;QACJ,GAAG,KAAK;QACT,KAAK;QACL,OAAO;QACP,WAAW,mBAAmB,0CAAiB;kBAAC;qBAAM;yBAAS;yBAAa;QAAW,GAAG;kBAC1F,cAAA,gBAAC,0CAAyB,QAAQ;YAAC,OAAO;sBACvC;;;AAIT","sources":["packages/@react-spectrum/s2/src/ActionButtonGroup.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 {AriaLabelingProps} from '@react-types/shared';\nimport {ContextValue, SlotProps, Toolbar} from 'react-aria-components';\nimport {createContext, ForwardedRef, forwardRef, ReactNode} from 'react';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ActionButtonGroupProps extends AriaLabelingProps, UnsafeStyles, SlotProps {\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithHeight,\n /** The children of the group. */\n children: ReactNode,\n /**\n * Size of the buttons.\n * @default \"M\"\n */\n size?: 'XS' | 'S' | 'M' | 'L' | 'XL',\n /**\n * Spacing between the buttons.\n * @default \"regular\"\n */\n density?: 'compact' | 'regular',\n /** Whether the button should be displayed with a [quiet style](https://spectrum.adobe.com/page/action-button/#Quiet). */\n isQuiet?: boolean,\n /** Whether the buttons should divide the container width equally. */\n isJustified?: boolean,\n /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n staticColor?: 'white' | 'black' | 'auto',\n /**\n * The axis the group should align with.\n * @default 'horizontal'\n */\n orientation?: 'horizontal' | 'vertical',\n /** Whether the group is disabled. */\n isDisabled?: boolean\n}\n\nexport const actionGroupStyle = style({\n display: 'flex',\n flexDirection: {\n orientation: {\n horizontal: 'row',\n vertical: 'column'\n }\n },\n gap: {\n density: {\n compact: 2,\n regular: {\n size: {\n XS: 4,\n S: 4,\n M: 8,\n L: 8,\n XL: 8\n }\n }\n }\n }\n}, getAllowedOverrides({height: true}));\n\n\nexport const ActionButtonGroupContext = createContext<ContextValue<Partial<ActionButtonGroupProps>, HTMLDivElement>>(null);\n\n/**\n * An ActionButtonGroup is a grouping of related ActionButtons.\n */\nexport const ActionButtonGroup = forwardRef(function ActionButtonGroup(props: ActionButtonGroupProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ActionButtonGroupContext);\n let {\n density = 'regular',\n size = 'M',\n orientation = 'horizontal',\n isJustified,\n children,\n UNSAFE_className = '',\n UNSAFE_style,\n styles\n } = props;\n\n return (\n <Toolbar\n {...props}\n ref={ref}\n style={UNSAFE_style}\n className={UNSAFE_className + actionGroupStyle({size, density, orientation, isJustified}, styles)}>\n <ActionButtonGroupContext.Provider value={props}>\n {children}\n </ActionButtonGroupContext.Provider>\n </Toolbar>\n );\n});\n"],"names":[],"version":3,"file":"ActionButtonGroup.mjs.map"}
@@ -49,10 +49,10 @@ $parcel$export(module.exports, "AlertDialog", () => $d67aa10f4fac9e2b$export$de4
49
49
 
50
50
 
51
51
  const $d67aa10f4fac9e2b$var$icon = function anonymous(props) {
52
- let rules = " .";
53
- rules += ' zd';
54
- if (props.variant === "warning") rules += ' -rwx0fg_e-g';
55
- else if (props.variant === "error") rules += ' -rwx0fg_e-e';
52
+ let rules = " ";
53
+ rules += ' if';
54
+ if (props.variant === "warning") rules += ' -_8sjo0b-Od';
55
+ else if (props.variant === "error") rules += ' -_8sjo0b-Ob';
56
56
  return rules;
57
57
  };
58
58
  const $d67aa10f4fac9e2b$export$de466dd8317b0b75 = /*#__PURE__*/ (0, $dZ5J1$react.forwardRef)(function AlertDialog(props, ref) {
@@ -1,16 +1,14 @@
1
1
  @layer _.a {
2
- .zd {
2
+ .if {
3
3
  margin-inline-end: .5rem;
4
4
  }
5
5
 
6
- .-rwx0fg_e-e {
6
+ .-_8sjo0b-Ob {
7
7
  --iconPrimary: var(--lightningcss-light, #f03823) var(--lightningcss-dark, #fc432e);
8
8
  }
9
9
 
10
- .-rwx0fg_e-g {
10
+ .-_8sjo0b-Od {
11
11
  --iconPrimary: var(--lightningcss-light, #d45b00) var(--lightningcss-dark, #e06400);
12
12
  }
13
13
  }
14
-
15
- @layer _.b;
16
14
  /*# sourceMappingURL=AlertDialog.css.map */
@@ -1 +1 @@
1
- {"mappings":"AA+Da;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA","sources":["packages/@react-spectrum/s2/src/AlertDialog.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 AlertTriangle from '../s2wf-icons/S2_Icon_AlertTriangle_20_N.svg';\nimport {Button} from './Button';\nimport {ButtonGroup} from './ButtonGroup';\nimport {CenterBaseline} from './CenterBaseline';\nimport {chain} from '@react-aria/utils';\nimport {Content, Heading} from './Content';\nimport {Dialog} from './Dialog';\nimport {DOMProps, DOMRef} from '@react-types/shared';\nimport {forwardRef, ReactNode} from 'react';\nimport {IconContext} from './Icon';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport NoticeSquare from '../s2wf-icons/S2_Icon_AlertDiamond_20_N.svg';\nimport {Provider} from 'react-aria-components';\nimport {style} from '../style' with {type: 'macro'};\nimport {UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\n\nexport interface AlertDialogProps extends DOMProps, UnsafeStyles {\n /** The [visual style](https://spectrum.adobe.com/page/alert-dialog/#Options) of the AlertDialog. */\n variant?: 'confirmation' | 'information' | 'destructive' | 'error' | 'warning',\n /** The title of the AlertDialog. */\n title: string,\n /** The contents of the AlertDialog. */\n children: ReactNode,\n /** The label to display within the cancel button. */\n cancelLabel?: string,\n /** The label to display within the confirm button. */\n primaryActionLabel: string,\n /** The label to display within the secondary button. */\n secondaryActionLabel?: string,\n /** Whether the primary button is disabled. */\n isPrimaryActionDisabled?: boolean,\n /** Whether the secondary button is disabled. */\n isSecondaryActionDisabled?: boolean,\n /** Handler that is called when the cancel button is pressed. */\n onCancel?: () => void,\n /** Handler that is called when the primary button is pressed. */\n onPrimaryAction?: () => void,\n /** Handler that is called when the secondary button is pressed. */\n onSecondaryAction?: () => void,\n /** Button to focus by default when the dialog opens. */\n autoFocusButton?: 'cancel' | 'primary' | 'secondary',\n /**\n * The size of the Dialog.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L'\n}\n\nconst icon = style({\n marginEnd: 8,\n '--iconPrimary': {\n type: 'fill',\n value: {\n variant: {\n error: 'negative',\n warning: 'notice'\n }\n }\n }\n});\n\n/**\n * AlertDialogs are a specific type of Dialog. They display important information that users need to acknowledge.\n */\nexport const AlertDialog = forwardRef(function AlertDialog(props: AlertDialogProps, ref: DOMRef) {\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n let {\n autoFocusButton,\n cancelLabel,\n secondaryActionLabel,\n primaryActionLabel,\n isSecondaryActionDisabled,\n isPrimaryActionDisabled,\n onCancel = () => {},\n onPrimaryAction = () => {},\n onSecondaryAction = () => {},\n title,\n children,\n variant = 'confirmation'\n } = props;\n\n let buttonVariant = 'primary';\n if (variant === 'confirmation') {\n buttonVariant = 'accent';\n } else if (variant === 'destructive') {\n buttonVariant = 'negative';\n }\n\n return (\n <Dialog\n role=\"alertdialog\"\n ref={ref}\n size={props.size}\n UNSAFE_style={props.UNSAFE_style}\n UNSAFE_className={(props.UNSAFE_className || '')}>\n {({close}) => (\n <>\n <Provider\n values={[\n [IconContext, {styles: icon({variant})}]\n ]}>\n <Heading slot=\"title\">\n <CenterBaseline>\n {variant === 'error' && <AlertTriangle aria-label={stringFormatter.format('dialog.alert')} />}\n {variant === 'warning' && <NoticeSquare aria-label={stringFormatter.format('dialog.alert')} />}\n {title}\n </CenterBaseline>\n </Heading>\n </Provider>\n <Content>{children}</Content>\n <ButtonGroup>\n {cancelLabel &&\n <Button\n onPress={() => chain(close(), onCancel())}\n variant=\"secondary\"\n fillStyle=\"outline\"\n autoFocus={autoFocusButton === 'cancel'}>\n {cancelLabel}\n </Button>\n }\n {secondaryActionLabel &&\n <Button\n onPress={() => chain(close(), onSecondaryAction())}\n variant=\"secondary\"\n isDisabled={isSecondaryActionDisabled}\n fillStyle=\"outline\"\n autoFocus={autoFocusButton === 'secondary'}>\n {secondaryActionLabel}\n </Button>\n }\n <Button\n variant={buttonVariant as 'primary' | 'accent' | 'negative'}\n isDisabled={isPrimaryActionDisabled}\n autoFocus={autoFocusButton === 'primary'}\n onPress={() => chain(close(), onPrimaryAction())}>\n {primaryActionLabel}\n </Button>\n </ButtonGroup>\n </>\n )}\n </Dialog>\n );\n});\n"],"names":[],"version":3,"file":"AlertDialog.css.map"}
1
+ {"mappings":"AA+Da;EAAA;;;;EAAA;;;;EAAA","sources":["packages/@react-spectrum/s2/src/AlertDialog.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 AlertTriangle from '../s2wf-icons/S2_Icon_AlertTriangle_20_N.svg';\nimport {Button} from './Button';\nimport {ButtonGroup} from './ButtonGroup';\nimport {CenterBaseline} from './CenterBaseline';\nimport {chain} from '@react-aria/utils';\nimport {Content, Heading} from './Content';\nimport {Dialog} from './Dialog';\nimport {DOMProps, DOMRef} from '@react-types/shared';\nimport {forwardRef, ReactNode} from 'react';\nimport {IconContext} from './Icon';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport NoticeSquare from '../s2wf-icons/S2_Icon_AlertDiamond_20_N.svg';\nimport {Provider} from 'react-aria-components';\nimport {style} from '../style' with {type: 'macro'};\nimport {UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\n\nexport interface AlertDialogProps extends DOMProps, UnsafeStyles {\n /** The [visual style](https://spectrum.adobe.com/page/alert-dialog/#Options) of the AlertDialog. */\n variant?: 'confirmation' | 'information' | 'destructive' | 'error' | 'warning',\n /** The title of the AlertDialog. */\n title: string,\n /** The contents of the AlertDialog. */\n children: ReactNode,\n /** The label to display within the cancel button. */\n cancelLabel?: string,\n /** The label to display within the confirm button. */\n primaryActionLabel: string,\n /** The label to display within the secondary button. */\n secondaryActionLabel?: string,\n /** Whether the primary button is disabled. */\n isPrimaryActionDisabled?: boolean,\n /** Whether the secondary button is disabled. */\n isSecondaryActionDisabled?: boolean,\n /** Handler that is called when the cancel button is pressed. */\n onCancel?: () => void,\n /** Handler that is called when the primary button is pressed. */\n onPrimaryAction?: () => void,\n /** Handler that is called when the secondary button is pressed. */\n onSecondaryAction?: () => void,\n /** Button to focus by default when the dialog opens. */\n autoFocusButton?: 'cancel' | 'primary' | 'secondary',\n /**\n * The size of the Dialog.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L'\n}\n\nconst icon = style({\n marginEnd: 8,\n '--iconPrimary': {\n type: 'fill',\n value: {\n variant: {\n error: 'negative',\n warning: 'notice'\n }\n }\n }\n});\n\n/**\n * AlertDialogs are a specific type of Dialog. They display important information that users need to acknowledge.\n */\nexport const AlertDialog = forwardRef(function AlertDialog(props: AlertDialogProps, ref: DOMRef) {\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n let {\n autoFocusButton,\n cancelLabel,\n secondaryActionLabel,\n primaryActionLabel,\n isSecondaryActionDisabled,\n isPrimaryActionDisabled,\n onCancel = () => {},\n onPrimaryAction = () => {},\n onSecondaryAction = () => {},\n title,\n children,\n variant = 'confirmation'\n } = props;\n\n let buttonVariant = 'primary';\n if (variant === 'confirmation') {\n buttonVariant = 'accent';\n } else if (variant === 'destructive') {\n buttonVariant = 'negative';\n }\n\n return (\n <Dialog\n role=\"alertdialog\"\n ref={ref}\n size={props.size}\n UNSAFE_style={props.UNSAFE_style}\n UNSAFE_className={(props.UNSAFE_className || '')}>\n {({close}) => (\n <>\n <Provider\n values={[\n [IconContext, {styles: icon({variant})}]\n ]}>\n <Heading slot=\"title\">\n <CenterBaseline>\n {variant === 'error' && <AlertTriangle aria-label={stringFormatter.format('dialog.alert')} />}\n {variant === 'warning' && <NoticeSquare aria-label={stringFormatter.format('dialog.alert')} />}\n {title}\n </CenterBaseline>\n </Heading>\n </Provider>\n <Content>{children}</Content>\n <ButtonGroup>\n {cancelLabel &&\n <Button\n onPress={() => chain(close(), onCancel())}\n variant=\"secondary\"\n fillStyle=\"outline\"\n autoFocus={autoFocusButton === 'cancel'}>\n {cancelLabel}\n </Button>\n }\n {secondaryActionLabel &&\n <Button\n onPress={() => chain(close(), onSecondaryAction())}\n variant=\"secondary\"\n isDisabled={isSecondaryActionDisabled}\n fillStyle=\"outline\"\n autoFocus={autoFocusButton === 'secondary'}>\n {secondaryActionLabel}\n </Button>\n }\n <Button\n variant={buttonVariant as 'primary' | 'accent' | 'negative'}\n isDisabled={isPrimaryActionDisabled}\n autoFocus={autoFocusButton === 'primary'}\n onPress={() => chain(close(), onPrimaryAction())}>\n {primaryActionLabel}\n </Button>\n </ButtonGroup>\n </>\n )}\n </Dialog>\n );\n});\n"],"names":[],"version":3,"file":"AlertDialog.css.map"}
@@ -43,10 +43,10 @@ function $parcel$interopDefault(a) {
43
43
 
44
44
 
45
45
  const $94a8ad475d9a330c$var$icon = function anonymous(props) {
46
- let rules = " .";
47
- rules += ' zd';
48
- if (props.variant === "warning") rules += ' -rwx0fg_e-g';
49
- else if (props.variant === "error") rules += ' -rwx0fg_e-e';
46
+ let rules = " ";
47
+ rules += ' if';
48
+ if (props.variant === "warning") rules += ' -_8sjo0b-Od';
49
+ else if (props.variant === "error") rules += ' -_8sjo0b-Ob';
50
50
  return rules;
51
51
  };
52
52
  const $94a8ad475d9a330c$export$de466dd8317b0b75 = /*#__PURE__*/ (0, $2iZqV$forwardRef)(function AlertDialog(props, ref) {
package/dist/Avatar.cjs CHANGED
@@ -30,29 +30,29 @@ $parcel$export(module.exports, "Avatar", () => $38071d9ce246d4cf$export$e2255cf6
30
30
 
31
31
 
32
32
  const $38071d9ce246d4cf$var$imageStyles = function anonymous(props, overrides) {
33
- let rules = " .";
34
- 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)[^\s]+/g) || [];
35
- rules += matches.join('');
36
- let $_9 = false;
37
- let $__a = false;
33
+ let rules = " ";
34
+ let flexShrink = false;
35
+ let flexGrow = false;
36
+ let matches = (overrides || '').matchAll(/(?:^|\s)(j|l|h|i|_H|_r|M|__f|_X|_M|L|N|_f|_d|K|__B|H|G|J|I)[^\s]+/g);
38
37
  for (let p of matches){
39
- if (/^\s*_9/.test(p)) $_9 = true;
40
- if (/^\s*__a/.test(p)) $__a = true;
38
+ if (p[1] === "_r") flexShrink = true;
39
+ if (p[1] === "_H") flexGrow = true;
40
+ rules += p[0];
41
41
  }
42
- rules += ' _wf';
43
- rules += ' _xf';
44
- rules += ' _yf';
45
- rules += ' _zf';
46
- rules += ' lI';
47
- rules += ' kI';
48
- if (!$_9) rules += ' _9-3t1x';
49
- if (!$__a) rules += ' __a-3t1x';
50
- rules += ' __S-yksgrp';
51
- if (props.isOverBackground) rules += ' _Mb';
52
- else rules += ' _Ma';
53
- rules += ' d-1de2x0q';
54
- if (props.isLarge) rules += ' _Oc';
55
- else rules += ' _Ob';
42
+ rules += ' za';
43
+ rules += ' xa';
44
+ rules += ' wa';
45
+ rules += ' ya';
46
+ rules += ' fb';
47
+ rules += ' ea';
48
+ if (!flexShrink) rules += ' _ra';
49
+ if (!flexGrow) rules += ' _Hb';
50
+ rules += ' _Ga';
51
+ if (props.isOverBackground) rules += ' tb';
52
+ else rules += ' ta';
53
+ rules += ' BEzkoQe';
54
+ if (props.isLarge) rules += ' _ga';
55
+ else rules += ' _gb';
56
56
  return rules;
57
57
  };
58
58
  const $38071d9ce246d4cf$export$a20dad690e1279e2 = /*#__PURE__*/ (0, $1YWJ0$react.createContext)(null);
package/dist/Avatar.css CHANGED
@@ -1,60 +1,58 @@
1
1
  @layer _.a {
2
- ._wf {
2
+ .za {
3
3
  border-start-start-radius: 9999px;
4
4
  }
5
5
 
6
- ._xf {
6
+ .xa {
7
7
  border-start-end-radius: 9999px;
8
8
  }
9
9
 
10
- ._yf {
10
+ .wa {
11
11
  border-end-start-radius: 9999px;
12
12
  }
13
13
 
14
- ._zf {
14
+ .ya {
15
15
  border-end-end-radius: 9999px;
16
16
  }
17
17
 
18
- .lI {
18
+ .fb {
19
19
  width: calc(1.25rem * var(--s2-scale));
20
20
  }
21
21
 
22
- .kI {
22
+ .ea {
23
23
  height: calc(1.25rem * var(--s2-scale));
24
24
  }
25
25
 
26
- ._9-3t1x {
26
+ ._ra {
27
27
  flex-shrink: 0;
28
28
  }
29
29
 
30
- .__a-3t1x {
30
+ ._Hb {
31
31
  flex-grow: 0;
32
32
  }
33
33
 
34
- .__S-yksgrp {
34
+ ._Ga {
35
35
  -webkit-tap-highlight-color: #0000;
36
36
  }
37
37
 
38
- ._Ma {
38
+ .ta {
39
39
  outline-style: none;
40
40
  }
41
41
 
42
- ._Mb {
42
+ .tb {
43
43
  outline-style: solid;
44
44
  }
45
45
 
46
- .d-1de2x0q {
46
+ .BEzkoQe {
47
47
  outline-color: var(--s2-container-bg);
48
48
  }
49
49
 
50
- ._Ob {
50
+ ._gb {
51
51
  outline-width: 1px;
52
52
  }
53
53
 
54
- ._Oc {
54
+ ._ga {
55
55
  outline-width: 2px;
56
56
  }
57
57
  }
58
-
59
- @layer _.b;
60
58
  /*# sourceMappingURL=Avatar.css.map */
@@ -1 +1 @@
1
- {"mappings":"AAsCoB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA","sources":["packages/@react-spectrum/s2/src/Avatar.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 {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {Image} from './Image';\nimport {style} from '../style' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarProps extends UnsafeStyles, DOMProps, SlotProps {\n /** Text description of the avatar. */\n alt?: string,\n /** The image URL for the avatar. */\n src?: string,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth,\n /**\n * The size of the avatar.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 80 | 96 | 112 | (number & {}),\n /** Whether the avatar is over a color background. */\n isOverBackground?: boolean\n}\n\nconst imageStyles = style({\n borderRadius: 'full',\n size: 20,\n flexShrink: 0,\n flexGrow: 0,\n disableTapHighlight: true,\n outlineStyle: {\n default: 'none',\n isOverBackground: 'solid'\n },\n outlineColor: '--s2-container-bg',\n outlineWidth: {\n default: 1,\n isLarge: 2\n }\n}, getAllowedOverrides({width: false}));\n\nexport const AvatarContext = createContext<ContextValue<Partial<AvatarProps>, DOMRefValue<HTMLImageElement>>>(null);\n\n/**\n * An avatar is a thumbnail representation of an entity, such as a user or an organization.\n */\nexport const Avatar = forwardRef(function Avatar(props: AvatarProps, ref: DOMRef<HTMLImageElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarContext);\n let domRef = useDOMRef(ref);\n let {\n alt = '',\n src,\n UNSAFE_style,\n UNSAFE_className = '',\n size = 24,\n isOverBackground,\n slot = 'avatar',\n ...otherProps\n } = props;\n const domProps = filterDOMProps(otherProps);\n\n let remSize = size / 16 + 'rem';\n let isLarge = size >= 64;\n return (\n <Image\n {...domProps}\n ref={domRef}\n slot={slot}\n alt={alt}\n UNSAFE_style={{\n ...UNSAFE_style,\n width: remSize,\n height: remSize\n }}\n UNSAFE_className={UNSAFE_className}\n styles={imageStyles({isOverBackground, isLarge}, props.styles)}\n src={src} />\n );\n});\n"],"names":[],"version":3,"file":"Avatar.css.map"}
1
+ {"mappings":"AAsCoB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA","sources":["packages/@react-spectrum/s2/src/Avatar.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 {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {Image} from './Image';\nimport {style} from '../style' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarProps extends UnsafeStyles, DOMProps, SlotProps {\n /** Text description of the avatar. */\n alt?: string,\n /** The image URL for the avatar. */\n src?: string,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth,\n /**\n * The size of the avatar.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 80 | 96 | 112 | (number & {}),\n /** Whether the avatar is over a color background. */\n isOverBackground?: boolean\n}\n\nconst imageStyles = style({\n borderRadius: 'full',\n size: 20,\n flexShrink: 0,\n flexGrow: 0,\n disableTapHighlight: true,\n outlineStyle: {\n default: 'none',\n isOverBackground: 'solid'\n },\n outlineColor: '--s2-container-bg',\n outlineWidth: {\n default: 1,\n isLarge: 2\n }\n}, getAllowedOverrides({width: false}));\n\nexport const AvatarContext = createContext<ContextValue<Partial<AvatarProps>, DOMRefValue<HTMLImageElement>>>(null);\n\n/**\n * An avatar is a thumbnail representation of an entity, such as a user or an organization.\n */\nexport const Avatar = forwardRef(function Avatar(props: AvatarProps, ref: DOMRef<HTMLImageElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarContext);\n let domRef = useDOMRef(ref);\n let {\n alt = '',\n src,\n UNSAFE_style,\n UNSAFE_className = '',\n size = 24,\n isOverBackground,\n slot = 'avatar',\n ...otherProps\n } = props;\n const domProps = filterDOMProps(otherProps);\n\n let remSize = size / 16 + 'rem';\n let isLarge = size >= 64;\n return (\n <Image\n {...domProps}\n ref={domRef}\n slot={slot}\n alt={alt}\n UNSAFE_style={{\n ...UNSAFE_style,\n width: remSize,\n height: remSize\n }}\n UNSAFE_className={UNSAFE_className}\n styles={imageStyles({isOverBackground, isLarge}, props.styles)}\n src={src} />\n );\n});\n"],"names":[],"version":3,"file":"Avatar.css.map"}
package/dist/Avatar.mjs CHANGED
@@ -23,29 +23,29 @@ import {useDOMRef as $lGIgj$useDOMRef} from "@react-spectrum/utils";
23
23
 
24
24
 
25
25
  const $3ffa2cd930156220$var$imageStyles = function anonymous(props, overrides) {
26
- let rules = " .";
27
- 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)[^\s]+/g) || [];
28
- rules += matches.join('');
29
- let $_9 = false;
30
- let $__a = false;
26
+ let rules = " ";
27
+ let flexShrink = false;
28
+ let flexGrow = false;
29
+ let matches = (overrides || '').matchAll(/(?:^|\s)(j|l|h|i|_H|_r|M|__f|_X|_M|L|N|_f|_d|K|__B|H|G|J|I)[^\s]+/g);
31
30
  for (let p of matches){
32
- if (/^\s*_9/.test(p)) $_9 = true;
33
- if (/^\s*__a/.test(p)) $__a = true;
31
+ if (p[1] === "_r") flexShrink = true;
32
+ if (p[1] === "_H") flexGrow = true;
33
+ rules += p[0];
34
34
  }
35
- rules += ' _wf';
36
- rules += ' _xf';
37
- rules += ' _yf';
38
- rules += ' _zf';
39
- rules += ' lI';
40
- rules += ' kI';
41
- if (!$_9) rules += ' _9-3t1x';
42
- if (!$__a) rules += ' __a-3t1x';
43
- rules += ' __S-yksgrp';
44
- if (props.isOverBackground) rules += ' _Mb';
45
- else rules += ' _Ma';
46
- rules += ' d-1de2x0q';
47
- if (props.isLarge) rules += ' _Oc';
48
- else rules += ' _Ob';
35
+ rules += ' za';
36
+ rules += ' xa';
37
+ rules += ' wa';
38
+ rules += ' ya';
39
+ rules += ' fb';
40
+ rules += ' ea';
41
+ if (!flexShrink) rules += ' _ra';
42
+ if (!flexGrow) rules += ' _Hb';
43
+ rules += ' _Ga';
44
+ if (props.isOverBackground) rules += ' tb';
45
+ else rules += ' ta';
46
+ rules += ' BEzkoQe';
47
+ if (props.isLarge) rules += ' _ga';
48
+ else rules += ' _gb';
49
49
  return rules;
50
50
  };
51
51
  const $3ffa2cd930156220$export$a20dad690e1279e2 = /*#__PURE__*/ (0, $lGIgj$createContext)(null);