@react-spectrum/s2 1.0.0 → 1.1.0

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 (477) hide show
  1. package/dist/Accordion.cjs +3 -3
  2. package/dist/Accordion.cjs.map +1 -1
  3. package/dist/Accordion.css +2 -2
  4. package/dist/Accordion.css.map +1 -1
  5. package/dist/Accordion.mjs +3 -3
  6. package/dist/Accordion.mjs.map +1 -1
  7. package/dist/ActionBar.cjs +62 -61
  8. package/dist/ActionBar.cjs.map +1 -1
  9. package/dist/ActionBar.css +58 -58
  10. package/dist/ActionBar.css.map +1 -1
  11. package/dist/ActionBar.mjs +62 -61
  12. package/dist/ActionBar.mjs.map +1 -1
  13. package/dist/ActionButton.cjs +234 -234
  14. package/dist/ActionButton.cjs.map +1 -1
  15. package/dist/ActionButton.css +160 -160
  16. package/dist/ActionButton.css.map +1 -1
  17. package/dist/ActionButton.mjs +234 -234
  18. package/dist/ActionButton.mjs.map +1 -1
  19. package/dist/ActionButtonGroup.cjs +16 -16
  20. package/dist/ActionButtonGroup.css +9 -9
  21. package/dist/ActionButtonGroup.mjs +16 -16
  22. package/dist/Add.cjs +10 -10
  23. package/dist/Add.css +6 -6
  24. package/dist/Add.mjs +10 -10
  25. package/dist/AlertDialog.cjs +3 -3
  26. package/dist/AlertDialog.css +3 -3
  27. package/dist/AlertDialog.mjs +3 -3
  28. package/dist/Asterisk.cjs +6 -6
  29. package/dist/Asterisk.css +4 -4
  30. package/dist/Asterisk.mjs +6 -6
  31. package/dist/Avatar.cjs +17 -17
  32. package/dist/Avatar.css +16 -16
  33. package/dist/Avatar.mjs +17 -17
  34. package/dist/AvatarGroup.cjs +121 -121
  35. package/dist/AvatarGroup.css +31 -31
  36. package/dist/AvatarGroup.mjs +121 -121
  37. package/dist/Badge.cjs +197 -197
  38. package/dist/Badge.css +125 -125
  39. package/dist/Badge.mjs +197 -197
  40. package/dist/Breadcrumbs.cjs +235 -235
  41. package/dist/Breadcrumbs.cjs.map +1 -1
  42. package/dist/Breadcrumbs.css +100 -100
  43. package/dist/Breadcrumbs.css.map +1 -1
  44. package/dist/Breadcrumbs.mjs +235 -235
  45. package/dist/Breadcrumbs.mjs.map +1 -1
  46. package/dist/Button.cjs +333 -333
  47. package/dist/Button.cjs.map +1 -1
  48. package/dist/Button.css +174 -174
  49. package/dist/Button.css.map +1 -1
  50. package/dist/Button.mjs +333 -333
  51. package/dist/Button.mjs.map +1 -1
  52. package/dist/ButtonGroup.cjs +21 -21
  53. package/dist/ButtonGroup.css +15 -15
  54. package/dist/ButtonGroup.mjs +21 -21
  55. package/dist/Calendar.cjs +169 -169
  56. package/dist/Calendar.cjs.map +1 -1
  57. package/dist/Calendar.css +134 -134
  58. package/dist/Calendar.css.map +1 -1
  59. package/dist/Calendar.mjs +169 -169
  60. package/dist/Calendar.mjs.map +1 -1
  61. package/dist/Card.cjs +310 -310
  62. package/dist/Card.cjs.map +1 -1
  63. package/dist/Card.css +206 -206
  64. package/dist/Card.css.map +1 -1
  65. package/dist/Card.mjs +310 -310
  66. package/dist/Card.mjs.map +1 -1
  67. package/dist/CardView.cjs +19 -19
  68. package/dist/CardView.cjs.map +1 -1
  69. package/dist/CardView.css +17 -17
  70. package/dist/CardView.css.map +1 -1
  71. package/dist/CardView.mjs +19 -19
  72. package/dist/CardView.mjs.map +1 -1
  73. package/dist/CenterBaseline.cjs +1 -1
  74. package/dist/CenterBaseline.css +2 -2
  75. package/dist/CenterBaseline.mjs +1 -1
  76. package/dist/Checkbox.cjs +162 -162
  77. package/dist/Checkbox.cjs.map +1 -1
  78. package/dist/Checkbox.css +95 -91
  79. package/dist/Checkbox.css.map +1 -1
  80. package/dist/Checkbox.mjs +162 -162
  81. package/dist/Checkbox.mjs.map +1 -1
  82. package/dist/CheckboxGroup.cjs +44 -44
  83. package/dist/CheckboxGroup.cjs.map +1 -1
  84. package/dist/CheckboxGroup.css +37 -37
  85. package/dist/CheckboxGroup.css.map +1 -1
  86. package/dist/CheckboxGroup.mjs +44 -44
  87. package/dist/CheckboxGroup.mjs.map +1 -1
  88. package/dist/Checkmark.cjs +12 -12
  89. package/dist/Checkmark.css +8 -8
  90. package/dist/Checkmark.mjs +12 -12
  91. package/dist/Chevron.cjs +12 -12
  92. package/dist/Chevron.css +10 -10
  93. package/dist/Chevron.mjs +12 -12
  94. package/dist/ClearButton.cjs +30 -30
  95. package/dist/ClearButton.css +30 -30
  96. package/dist/ClearButton.mjs +30 -30
  97. package/dist/CloseButton.cjs +56 -56
  98. package/dist/CloseButton.css +47 -47
  99. package/dist/CloseButton.mjs +56 -56
  100. package/dist/ColorArea.cjs +17 -17
  101. package/dist/ColorArea.cjs.map +1 -1
  102. package/dist/ColorArea.css +16 -16
  103. package/dist/ColorArea.css.map +1 -1
  104. package/dist/ColorArea.mjs +17 -17
  105. package/dist/ColorArea.mjs.map +1 -1
  106. package/dist/ColorField.cjs +32 -32
  107. package/dist/ColorField.cjs.map +1 -1
  108. package/dist/ColorField.css +27 -27
  109. package/dist/ColorField.css.map +1 -1
  110. package/dist/ColorField.mjs +32 -32
  111. package/dist/ColorField.mjs.map +1 -1
  112. package/dist/ColorHandle.cjs +27 -27
  113. package/dist/ColorHandle.css +42 -42
  114. package/dist/ColorHandle.mjs +27 -27
  115. package/dist/ColorSlider.cjs +109 -109
  116. package/dist/ColorSlider.cjs.map +1 -1
  117. package/dist/ColorSlider.css +52 -52
  118. package/dist/ColorSlider.css.map +1 -1
  119. package/dist/ColorSlider.mjs +109 -109
  120. package/dist/ColorSlider.mjs.map +1 -1
  121. package/dist/ColorSwatch.cjs +30 -30
  122. package/dist/ColorSwatch.cjs.map +1 -1
  123. package/dist/ColorSwatch.css +29 -29
  124. package/dist/ColorSwatch.css.map +1 -1
  125. package/dist/ColorSwatch.mjs +30 -30
  126. package/dist/ColorSwatch.mjs.map +1 -1
  127. package/dist/ColorSwatchPicker.cjs +30 -30
  128. package/dist/ColorSwatchPicker.css +48 -48
  129. package/dist/ColorSwatchPicker.mjs +30 -30
  130. package/dist/ColorWheel.cjs +31 -27
  131. package/dist/ColorWheel.cjs.map +1 -1
  132. package/dist/ColorWheel.css +17 -17
  133. package/dist/ColorWheel.css.map +1 -1
  134. package/dist/ColorWheel.mjs +31 -27
  135. package/dist/ColorWheel.mjs.map +1 -1
  136. package/dist/ComboBox.cjs +383 -383
  137. package/dist/ComboBox.cjs.map +1 -1
  138. package/dist/ComboBox.css +187 -187
  139. package/dist/ComboBox.css.map +1 -1
  140. package/dist/ComboBox.mjs +383 -383
  141. package/dist/ComboBox.mjs.map +1 -1
  142. package/dist/ContextualHelp.cjs +5 -5
  143. package/dist/ContextualHelp.css +50 -50
  144. package/dist/ContextualHelp.mjs +5 -5
  145. package/dist/Cross.cjs +14 -14
  146. package/dist/Cross.css +10 -10
  147. package/dist/Cross.mjs +14 -14
  148. package/dist/CustomDialog.cjs +26 -26
  149. package/dist/CustomDialog.cjs.map +1 -1
  150. package/dist/CustomDialog.css +25 -25
  151. package/dist/CustomDialog.css.map +1 -1
  152. package/dist/CustomDialog.mjs +26 -26
  153. package/dist/CustomDialog.mjs.map +1 -1
  154. package/dist/Dash.cjs +10 -10
  155. package/dist/Dash.css +6 -6
  156. package/dist/Dash.mjs +10 -10
  157. package/dist/DateField.cjs +74 -74
  158. package/dist/DateField.cjs.map +1 -1
  159. package/dist/DateField.css +77 -77
  160. package/dist/DateField.css.map +1 -1
  161. package/dist/DateField.mjs +74 -74
  162. package/dist/DateField.mjs.map +1 -1
  163. package/dist/DatePicker.cjs +173 -173
  164. package/dist/DatePicker.cjs.map +1 -1
  165. package/dist/DatePicker.css +128 -128
  166. package/dist/DatePicker.css.map +1 -1
  167. package/dist/DatePicker.mjs +173 -173
  168. package/dist/DatePicker.mjs.map +1 -1
  169. package/dist/DateRangePicker.cjs +56 -56
  170. package/dist/DateRangePicker.cjs.map +1 -1
  171. package/dist/DateRangePicker.css +59 -59
  172. package/dist/DateRangePicker.css.map +1 -1
  173. package/dist/DateRangePicker.mjs +56 -56
  174. package/dist/DateRangePicker.mjs.map +1 -1
  175. package/dist/Dialog.cjs +17 -17
  176. package/dist/Dialog.cjs.map +1 -1
  177. package/dist/Dialog.css +70 -70
  178. package/dist/Dialog.css.map +1 -1
  179. package/dist/Dialog.mjs +17 -17
  180. package/dist/Dialog.mjs.map +1 -1
  181. package/dist/Disclosure.cjs +120 -120
  182. package/dist/Disclosure.cjs.map +1 -1
  183. package/dist/Disclosure.css +112 -112
  184. package/dist/Disclosure.css.map +1 -1
  185. package/dist/Disclosure.mjs +120 -120
  186. package/dist/Disclosure.mjs.map +1 -1
  187. package/dist/Divider.cjs +26 -26
  188. package/dist/Divider.cjs.map +1 -1
  189. package/dist/Divider.css +25 -25
  190. package/dist/Divider.css.map +1 -1
  191. package/dist/Divider.mjs +26 -26
  192. package/dist/Divider.mjs.map +1 -1
  193. package/dist/DropZone.cjs +62 -62
  194. package/dist/DropZone.cjs.map +1 -1
  195. package/dist/DropZone.css +57 -57
  196. package/dist/DropZone.css.map +1 -1
  197. package/dist/DropZone.mjs +62 -62
  198. package/dist/DropZone.mjs.map +1 -1
  199. package/dist/Field.cjs +348 -348
  200. package/dist/Field.cjs.map +1 -1
  201. package/dist/Field.css +147 -147
  202. package/dist/Field.css.map +1 -1
  203. package/dist/Field.mjs +348 -348
  204. package/dist/Field.mjs.map +1 -1
  205. package/dist/Form.cjs +10 -10
  206. package/dist/Form.cjs.map +1 -1
  207. package/dist/Form.css +9 -9
  208. package/dist/Form.css.map +1 -1
  209. package/dist/Form.mjs +10 -10
  210. package/dist/Form.mjs.map +1 -1
  211. package/dist/FullscreenDialog.cjs +5 -5
  212. package/dist/FullscreenDialog.cjs.map +1 -1
  213. package/dist/FullscreenDialog.css +78 -78
  214. package/dist/FullscreenDialog.css.map +1 -1
  215. package/dist/FullscreenDialog.mjs +5 -5
  216. package/dist/FullscreenDialog.mjs.map +1 -1
  217. package/dist/IllustratedMessage.cjs +229 -229
  218. package/dist/IllustratedMessage.css +72 -72
  219. package/dist/IllustratedMessage.mjs +229 -229
  220. package/dist/Image.cjs +14 -14
  221. package/dist/Image.css +14 -14
  222. package/dist/Image.mjs +14 -14
  223. package/dist/InlineAlert.cjs +101 -101
  224. package/dist/InlineAlert.css +76 -76
  225. package/dist/InlineAlert.mjs +101 -101
  226. package/dist/Link.cjs +50 -50
  227. package/dist/Link.cjs.map +1 -1
  228. package/dist/Link.css +41 -41
  229. package/dist/Link.css.map +1 -1
  230. package/dist/Link.mjs +50 -50
  231. package/dist/Link.mjs.map +1 -1
  232. package/dist/LinkOut.cjs +8 -8
  233. package/dist/LinkOut.css +8 -8
  234. package/dist/LinkOut.mjs +8 -8
  235. package/dist/Menu.cjs +446 -443
  236. package/dist/Menu.cjs.map +1 -1
  237. package/dist/Menu.css +184 -184
  238. package/dist/Menu.css.map +1 -1
  239. package/dist/Menu.mjs +446 -443
  240. package/dist/Menu.mjs.map +1 -1
  241. package/dist/Meter.cjs +154 -154
  242. package/dist/Meter.cjs.map +1 -1
  243. package/dist/Meter.css +91 -91
  244. package/dist/Meter.css.map +1 -1
  245. package/dist/Meter.mjs +154 -154
  246. package/dist/Meter.mjs.map +1 -1
  247. package/dist/Modal.cjs +66 -66
  248. package/dist/Modal.cjs.map +1 -1
  249. package/dist/Modal.css +54 -54
  250. package/dist/Modal.css.map +1 -1
  251. package/dist/Modal.mjs +66 -66
  252. package/dist/Modal.mjs.map +1 -1
  253. package/dist/NotificationBadge.cjs +57 -57
  254. package/dist/NotificationBadge.css +49 -49
  255. package/dist/NotificationBadge.mjs +57 -57
  256. package/dist/NumberField.cjs +115 -115
  257. package/dist/NumberField.cjs.map +1 -1
  258. package/dist/NumberField.css +99 -99
  259. package/dist/NumberField.css.map +1 -1
  260. package/dist/NumberField.mjs +115 -115
  261. package/dist/NumberField.mjs.map +1 -1
  262. package/dist/Picker.cjs +275 -275
  263. package/dist/Picker.cjs.map +1 -1
  264. package/dist/Picker.css +173 -173
  265. package/dist/Picker.css.map +1 -1
  266. package/dist/Picker.mjs +275 -275
  267. package/dist/Picker.mjs.map +1 -1
  268. package/dist/Popover.cjs +89 -89
  269. package/dist/Popover.cjs.map +1 -1
  270. package/dist/Popover.css +70 -70
  271. package/dist/Popover.css.map +1 -1
  272. package/dist/Popover.mjs +89 -89
  273. package/dist/Popover.mjs.map +1 -1
  274. package/dist/ProgressBar.cjs +164 -164
  275. package/dist/ProgressBar.cjs.map +1 -1
  276. package/dist/ProgressBar.css +99 -99
  277. package/dist/ProgressBar.css.map +1 -1
  278. package/dist/ProgressBar.mjs +164 -164
  279. package/dist/ProgressBar.mjs.map +1 -1
  280. package/dist/ProgressCircle.cjs +32 -32
  281. package/dist/ProgressCircle.cjs.map +1 -1
  282. package/dist/ProgressCircle.css +24 -24
  283. package/dist/ProgressCircle.css.map +1 -1
  284. package/dist/ProgressCircle.mjs +32 -32
  285. package/dist/ProgressCircle.mjs.map +1 -1
  286. package/dist/Provider.cjs +11 -11
  287. package/dist/Provider.css +10 -10
  288. package/dist/Provider.mjs +11 -11
  289. package/dist/Radio.cjs +146 -146
  290. package/dist/Radio.cjs.map +1 -1
  291. package/dist/Radio.css +78 -78
  292. package/dist/Radio.css.map +1 -1
  293. package/dist/Radio.mjs +146 -146
  294. package/dist/Radio.mjs.map +1 -1
  295. package/dist/RadioGroup.cjs +42 -42
  296. package/dist/RadioGroup.cjs.map +1 -1
  297. package/dist/RadioGroup.css +37 -37
  298. package/dist/RadioGroup.css.map +1 -1
  299. package/dist/RadioGroup.mjs +42 -42
  300. package/dist/RadioGroup.mjs.map +1 -1
  301. package/dist/RangeCalendar.cjs +8 -8
  302. package/dist/RangeCalendar.cjs.map +1 -1
  303. package/dist/RangeCalendar.css +10 -10
  304. package/dist/RangeCalendar.css.map +1 -1
  305. package/dist/RangeCalendar.mjs +8 -8
  306. package/dist/RangeCalendar.mjs.map +1 -1
  307. package/dist/SearchField.cjs +42 -42
  308. package/dist/SearchField.cjs.map +1 -1
  309. package/dist/SearchField.css +45 -45
  310. package/dist/SearchField.css.map +1 -1
  311. package/dist/SearchField.mjs +42 -42
  312. package/dist/SearchField.mjs.map +1 -1
  313. package/dist/SegmentedControl.cjs +180 -180
  314. package/dist/SegmentedControl.css +123 -123
  315. package/dist/SegmentedControl.mjs +180 -180
  316. package/dist/SelectBoxGroup.cjs +144 -144
  317. package/dist/SelectBoxGroup.cjs.map +1 -1
  318. package/dist/SelectBoxGroup.css +120 -120
  319. package/dist/SelectBoxGroup.css.map +1 -1
  320. package/dist/SelectBoxGroup.mjs +144 -144
  321. package/dist/SelectBoxGroup.mjs.map +1 -1
  322. package/dist/Slider.cjs +295 -295
  323. package/dist/Slider.cjs.map +1 -1
  324. package/dist/Slider.css +154 -154
  325. package/dist/Slider.css.map +1 -1
  326. package/dist/Slider.mjs +295 -295
  327. package/dist/Slider.mjs.map +1 -1
  328. package/dist/StatusLight.cjs +116 -116
  329. package/dist/StatusLight.css +59 -59
  330. package/dist/StatusLight.mjs +116 -116
  331. package/dist/Switch.cjs +155 -155
  332. package/dist/Switch.cjs.map +1 -1
  333. package/dist/Switch.css +74 -74
  334. package/dist/Switch.css.map +1 -1
  335. package/dist/Switch.mjs +155 -155
  336. package/dist/Switch.mjs.map +1 -1
  337. package/dist/TableView.cjs +415 -415
  338. package/dist/TableView.cjs.map +1 -1
  339. package/dist/TableView.css +199 -199
  340. package/dist/TableView.css.map +1 -1
  341. package/dist/TableView.mjs +416 -416
  342. package/dist/TableView.mjs.map +1 -1
  343. package/dist/Tabs.cjs +127 -127
  344. package/dist/Tabs.cjs.map +1 -1
  345. package/dist/Tabs.css +105 -105
  346. package/dist/Tabs.css.map +1 -1
  347. package/dist/Tabs.mjs +127 -127
  348. package/dist/Tabs.mjs.map +1 -1
  349. package/dist/TabsPicker.cjs +127 -127
  350. package/dist/TabsPicker.cjs.map +1 -1
  351. package/dist/TabsPicker.css +108 -108
  352. package/dist/TabsPicker.css.map +1 -1
  353. package/dist/TabsPicker.mjs +127 -127
  354. package/dist/TabsPicker.mjs.map +1 -1
  355. package/dist/TagGroup.cjs +204 -204
  356. package/dist/TagGroup.cjs.map +1 -1
  357. package/dist/TagGroup.css +146 -146
  358. package/dist/TagGroup.css.map +1 -1
  359. package/dist/TagGroup.mjs +204 -204
  360. package/dist/TagGroup.mjs.map +1 -1
  361. package/dist/TextField.cjs +59 -59
  362. package/dist/TextField.cjs.map +1 -1
  363. package/dist/TextField.css +54 -54
  364. package/dist/TextField.css.map +1 -1
  365. package/dist/TextField.mjs +59 -59
  366. package/dist/TextField.mjs.map +1 -1
  367. package/dist/TimeField.cjs +52 -52
  368. package/dist/TimeField.cjs.map +1 -1
  369. package/dist/TimeField.css +47 -47
  370. package/dist/TimeField.css.map +1 -1
  371. package/dist/TimeField.mjs +52 -52
  372. package/dist/TimeField.mjs.map +1 -1
  373. package/dist/Toast.cjs +120 -120
  374. package/dist/Toast.cjs.map +1 -1
  375. package/dist/Toast.css +110 -110
  376. package/dist/Toast.css.map +1 -1
  377. package/dist/Toast.mjs +120 -120
  378. package/dist/Toast.mjs.map +1 -1
  379. package/dist/ToggleButton.cjs +3 -3
  380. package/dist/ToggleButton.cjs.map +1 -1
  381. package/dist/ToggleButton.css +12 -12
  382. package/dist/ToggleButton.css.map +1 -1
  383. package/dist/ToggleButton.mjs +3 -3
  384. package/dist/ToggleButton.mjs.map +1 -1
  385. package/dist/ToggleButtonGroup.cjs.map +1 -1
  386. package/dist/ToggleButtonGroup.mjs.map +1 -1
  387. package/dist/Tooltip.cjs +78 -78
  388. package/dist/Tooltip.cjs.map +1 -1
  389. package/dist/Tooltip.css +65 -65
  390. package/dist/Tooltip.css.map +1 -1
  391. package/dist/Tooltip.mjs +78 -78
  392. package/dist/Tooltip.mjs.map +1 -1
  393. package/dist/TreeView.cjs +144 -128
  394. package/dist/TreeView.cjs.map +1 -1
  395. package/dist/TreeView.css +131 -127
  396. package/dist/TreeView.css.map +1 -1
  397. package/dist/TreeView.mjs +144 -128
  398. package/dist/TreeView.mjs.map +1 -1
  399. package/dist/types.d.ts +68 -72
  400. package/dist/types.d.ts.map +1 -1
  401. package/icons/Icon.cjs +12 -12
  402. package/icons/Icon.css +9 -9
  403. package/icons/Icon.mjs +12 -12
  404. package/icons/Skeleton.cjs +2 -2
  405. package/icons/Skeleton.cjs.map +1 -1
  406. package/icons/Skeleton.css +6 -6
  407. package/icons/Skeleton.mjs +2 -2
  408. package/icons/Skeleton.mjs.map +1 -1
  409. package/icons/runtime.cjs +16 -3
  410. package/icons/runtime.cjs.map +1 -1
  411. package/icons/runtime.mjs +16 -3
  412. package/icons/runtime.mjs.map +1 -1
  413. package/package.json +21 -21
  414. package/src/Accordion.tsx +1 -1
  415. package/src/ActionBar.tsx +2 -2
  416. package/src/ActionButton.tsx +1 -1
  417. package/src/Breadcrumbs.tsx +2 -2
  418. package/src/Button.tsx +2 -2
  419. package/src/Calendar.tsx +1 -1
  420. package/src/Card.tsx +1 -1
  421. package/src/CardView.tsx +1 -1
  422. package/src/Checkbox.tsx +2 -1
  423. package/src/CheckboxGroup.tsx +1 -1
  424. package/src/CoachMark.tsx +1 -1
  425. package/src/ColorArea.tsx +1 -1
  426. package/src/ColorField.tsx +1 -1
  427. package/src/ColorSlider.tsx +1 -1
  428. package/src/ColorSwatch.tsx +1 -1
  429. package/src/ColorWheel.tsx +2 -2
  430. package/src/ComboBox.tsx +2 -2
  431. package/src/CustomDialog.tsx +1 -1
  432. package/src/DateField.tsx +1 -1
  433. package/src/DatePicker.tsx +1 -1
  434. package/src/DateRangePicker.tsx +1 -1
  435. package/src/Dialog.tsx +1 -1
  436. package/src/Disclosure.tsx +2 -2
  437. package/src/Divider.tsx +1 -1
  438. package/src/DropZone.tsx +1 -1
  439. package/src/Field.tsx +3 -3
  440. package/src/Form.tsx +1 -1
  441. package/src/FullscreenDialog.tsx +1 -1
  442. package/src/Link.tsx +1 -1
  443. package/src/Menu.tsx +11 -13
  444. package/src/Meter.tsx +1 -1
  445. package/src/Modal.tsx +1 -1
  446. package/src/NumberField.tsx +1 -1
  447. package/src/Picker.tsx +3 -3
  448. package/src/Popover.tsx +2 -1
  449. package/src/ProgressBar.tsx +1 -1
  450. package/src/ProgressCircle.tsx +1 -1
  451. package/src/Radio.tsx +1 -1
  452. package/src/RadioGroup.tsx +1 -1
  453. package/src/RangeCalendar.tsx +1 -1
  454. package/src/SearchField.tsx +1 -1
  455. package/src/SelectBoxGroup.tsx +1 -1
  456. package/src/Slider.tsx +1 -1
  457. package/src/Switch.tsx +1 -1
  458. package/src/TableView.tsx +9 -9
  459. package/src/Tabs.tsx +4 -4
  460. package/src/TabsPicker.tsx +2 -2
  461. package/src/TagGroup.tsx +2 -2
  462. package/src/TextField.tsx +1 -1
  463. package/src/TimeField.tsx +1 -1
  464. package/src/Toast.tsx +1 -1
  465. package/src/ToggleButton.tsx +1 -1
  466. package/src/ToggleButtonGroup.tsx +1 -1
  467. package/src/Tooltip.tsx +1 -1
  468. package/src/TreeView.tsx +10 -6
  469. package/style/__tests__/mergeStyles.test.ts +68 -0
  470. package/style/__tests__/style-macro.test.js +79 -59
  471. package/style/dist/style-macro.cjs +65 -14
  472. package/style/dist/style-macro.cjs.map +1 -1
  473. package/style/dist/style-macro.mjs +65 -14
  474. package/style/dist/style-macro.mjs.map +1 -1
  475. package/style/runtime.ts +21 -5
  476. package/style/style-macro.ts +81 -16
  477. package/style/__tests__/mergeStyles.test.js +0 -32
package/dist/Toast.mjs CHANGED
@@ -115,147 +115,147 @@ const $6e462db325878d1a$export$f1f8569633bbbec4 = {
115
115
  };
116
116
  const $6e462db325878d1a$var$toastRegion = function anonymous(props) {
117
117
  let rules = " ";
118
- if (props.isFocusVisible) rules += ' _Lf1';
119
- else rules += ' _Le1';
120
- rules += ' Oh1';
121
- rules += ' Olc1';
122
- rules += ' _Mc1';
123
- rules += ' _Kd1';
124
- rules += ' sd1';
125
- if (props.placement === "bottom") rules += ' _tb1';
126
- else if (props.placement === "top") rules += ' _ta1';
127
- rules += ' _Pb1';
128
- rules += ' _Ar1';
129
- rules += ' _zr1';
130
- rules += ' ZJ1';
118
+ if (props.isFocusVisible) rules += ' _Lf11';
119
+ else rules += ' _Le11';
120
+ rules += ' Oh11';
121
+ rules += ' Olc11';
122
+ rules += ' _Mc11';
123
+ rules += ' _Kd11';
124
+ rules += ' sd11';
125
+ if (props.placement === "bottom") rules += ' _tb11';
126
+ else if (props.placement === "top") rules += ' _ta11';
127
+ rules += ' _Pb11';
128
+ rules += ' _Ar11';
129
+ rules += ' _zr11';
130
+ rules += ' ZJ11';
131
131
  if (props.placement === "top") {
132
- if (props.isExpanded) rules += ' Wr1';
133
- else rules += ' Wu1';
132
+ if (props.isExpanded) rules += ' Wr11';
133
+ else rules += ' Wu11';
134
134
  }
135
135
  if (props.placement === "bottom") {
136
- if (props.isExpanded) rules += ' _lr1';
137
- else rules += ' _lu1';
136
+ if (props.isExpanded) rules += ' _lr11';
137
+ else rules += ' _lu11';
138
138
  }
139
- if (props.align === "end") rules += ' IM1';
140
- else if (props.align === "center") rules += ' IM1';
141
- else if (props.align === "start") rules += ' IC1';
142
- if (props.align === "end") rules += ' HC1';
143
- else if (props.align === "center") rules += ' HM1';
144
- else if (props.align === "start") rules += ' HM1';
145
- rules += ' _oa1';
146
- rules += ' Ka1';
147
- rules += ' oc1';
148
- rules += ' nc1';
149
- rules += ' kc1';
150
- rules += ' jc1';
139
+ if (props.align === "end") rules += ' IM11';
140
+ else if (props.align === "center") rules += ' IM11';
141
+ else if (props.align === "start") rules += ' IC11';
142
+ if (props.align === "end") rules += ' HC11';
143
+ else if (props.align === "center") rules += ' HM11';
144
+ else if (props.align === "start") rules += ' HM11';
145
+ rules += ' _oa11';
146
+ rules += ' Ka11';
147
+ rules += ' oc11';
148
+ rules += ' nc11';
149
+ rules += ' kc11';
150
+ rules += ' jc11';
151
151
  return rules;
152
152
  };
153
153
  const $6e462db325878d1a$var$toastList = function anonymous(props) {
154
154
  let rules = " ";
155
- rules += ' _Pc1';
156
- rules += ' _ub1';
157
- rules += ' sd1';
158
- rules += ' Ue1';
159
- rules += ' qe1';
160
- if (props.placement === "bottom") rules += ' _tb1';
161
- else if (props.placement === "top") rules += ' _ta1';
162
- rules += ' _oa1';
163
- rules += ' Jy1';
164
- rules += ' Gy1';
155
+ rules += ' _Pc11';
156
+ rules += ' _ub11';
157
+ rules += ' sd11';
158
+ rules += ' Ue11';
159
+ rules += ' qe11';
160
+ if (props.placement === "bottom") rules += ' _tb11';
161
+ else if (props.placement === "top") rules += ' _ta11';
162
+ rules += ' _oa11';
163
+ rules += ' Jy11';
164
+ rules += ' Gy11';
165
165
  if (props.isExpanded) {
166
- if (props.placement === "bottom") rules += ' Tt1';
167
- else if (props.placement === "top") rules += ' Tf1';
166
+ if (props.placement === "bottom") rules += ' Tt11';
167
+ else if (props.placement === "top") rules += ' Tf11';
168
168
  }
169
169
  if (props.isExpanded) {
170
- if (props.placement === "bottom") rules += ' Qf1';
171
- else if (props.placement === "top") rules += ' Qt1';
170
+ if (props.placement === "bottom") rules += ' Qf11';
171
+ else if (props.placement === "top") rules += ' Qt11';
172
172
  }
173
- if (props.isExpanded) rules += ' St1';
174
- else rules += ' Sd1';
175
- if (props.isExpanded) rules += ' Rt1';
176
- else rules += ' Rd1';
177
- if (props.isExpanded) rules += ' Ic1';
178
- else rules += ' Iy1';
179
- if (props.isExpanded) rules += ' Hc1';
180
- else rules += ' Hy1';
181
- if (props.isExpanded) rules += ' _Na1';
182
- if (props.isExpanded) rules += ' Pa1';
173
+ if (props.isExpanded) rules += ' St11';
174
+ else rules += ' Sd11';
175
+ if (props.isExpanded) rules += ' Rt11';
176
+ else rules += ' Rd11';
177
+ if (props.isExpanded) rules += ' Ic11';
178
+ else rules += ' Iy11';
179
+ if (props.isExpanded) rules += ' Hc11';
180
+ else rules += ' Hy11';
181
+ if (props.isExpanded) rules += ' _Na11';
182
+ if (props.isExpanded) rules += ' Pa11';
183
183
  return rules;
184
184
  };
185
185
  const $6e462db325878d1a$var$toastStyle = function anonymous(props) {
186
186
  let rules = " ";
187
- if (props.isFocusVisible) rules += ' _Lf1';
188
- else rules += ' _Le1';
189
- if (props.isExpanded) rules += ' Ok1';
190
- else rules += ' Oh1';
191
- rules += ' _Mc1';
192
- rules += ' _Kd1';
193
- rules += ' sd1';
194
- rules += ' Ul1';
195
- rules += ' ql1';
196
- rules += ' Sf1';
197
- rules += ' Rt1';
198
- rules += ' Te1';
199
- rules += ' Qe1';
200
- rules += ' oc1';
201
- rules += ' nc1';
202
- rules += ' kc1';
203
- rules += ' jc1';
204
- rules += ' Mj1';
205
- rules += ' -Zn3gsb-L0uB6Qb1';
206
- rules += ' LksArhc1';
207
- rules += ' _oa1';
208
- rules += ' _va1';
209
- rules += ' uk1';
210
- rules += ' ucJ9TBTb1';
211
- rules += ' ud3Euai1';
212
- rules += ' uea1';
213
- rules += ' ugb1';
214
- rules += ' uhd1';
215
- rules += ' uje1';
216
- rules += ' u2NhKxcl1';
217
- rules += ' uic1';
218
- rules += ' -_6BNtrc-c1';
219
- rules += ' vx1';
220
- rules += ' xb1';
221
- rules += ' _xa1';
222
- rules += ' _Fd1';
223
- rules += ' _FnuYUweb1';
224
- rules += ' px1';
225
- if (props.variant === "negative") rules += ' gB1';
226
- else if (props.variant === "positive") rules += ' g11';
227
- else if (props.variant === "info") rules += ' g21';
228
- else if (props.variant === "neutral") rules += ' g61';
229
- rules += ' -_8sjo0b-t5ZbAob1';
230
- if (props.isExpanded) rules += ' _nd1';
231
- else rules += ' _nLeasBb1';
232
- rules += ' _8d1';
187
+ if (props.isFocusVisible) rules += ' _Lf11';
188
+ else rules += ' _Le11';
189
+ if (props.isExpanded) rules += ' Ok11';
190
+ else rules += ' Oh11';
191
+ rules += ' _Mc11';
192
+ rules += ' _Kd11';
193
+ rules += ' sd11';
194
+ rules += ' Ul11';
195
+ rules += ' ql11';
196
+ rules += ' Sf11';
197
+ rules += ' Rt11';
198
+ rules += ' Te11';
199
+ rules += ' Qe11';
200
+ rules += ' oc11';
201
+ rules += ' nc11';
202
+ rules += ' kc11';
203
+ rules += ' jc11';
204
+ rules += ' Mj11';
205
+ rules += ' -Zn3gsb-L0uB6Qb11';
206
+ rules += ' LksArhc11';
207
+ rules += ' _oa11';
208
+ rules += ' _va11';
209
+ rules += ' uk11';
210
+ rules += ' ucJ9TBTb11';
211
+ rules += ' ud3Euai11';
212
+ rules += ' uea11';
213
+ rules += ' ugb11';
214
+ rules += ' uhd11';
215
+ rules += ' uje11';
216
+ rules += ' u2NhKxcl11';
217
+ rules += ' uic11';
218
+ rules += ' -_6BNtrc-c11';
219
+ rules += ' vx11';
220
+ rules += ' xb11';
221
+ rules += ' _xa11';
222
+ rules += ' _Fd11';
223
+ rules += ' _FnuYUweb11';
224
+ rules += ' px11';
225
+ if (props.variant === "negative") rules += ' gB11';
226
+ else if (props.variant === "positive") rules += ' g111';
227
+ else if (props.variant === "info") rules += ' g211';
228
+ else if (props.variant === "neutral") rules += ' g611';
229
+ rules += ' -_8sjo0b-t5ZbAob11';
230
+ if (props.isExpanded) rules += ' _nd11';
231
+ else rules += ' _nLeasBb11';
232
+ rules += ' _8d11';
233
233
  return rules;
234
234
  };
235
235
  const $6e462db325878d1a$var$toastBody = function anonymous(props) {
236
236
  let rules = " ";
237
- if (props.isSingle) rules += ' sd1';
238
- else rules += ' se1';
239
- rules += ' D4w1sLc1';
240
- rules += ' CWLL0Xb1';
241
- rules += ' _ub1';
242
- rules += ' _wb1';
243
- rules += ' eb1';
244
- rules += ' qj1';
245
- rules += ' Ue1';
237
+ if (props.isSingle) rules += ' sd11';
238
+ else rules += ' se11';
239
+ rules += ' D4w1sLc11';
240
+ rules += ' CWLL0Xb11';
241
+ rules += ' _ub11';
242
+ rules += ' _wb11';
243
+ rules += ' eb11';
244
+ rules += ' qj11';
245
+ rules += ' Ue11';
246
246
  return rules;
247
247
  };
248
- const $6e462db325878d1a$var$toastContent = " sd1 Ue1 qe1 ea1 zk52g2d1 yk52g2d1 Bk52g2d1 Ak52g2d1 ri1 ZJ1 -nTSCV-LTAEPe1 __ZLTAEPe1 Na1";
248
+ const $6e462db325878d1a$var$toastContent = " sd11 Ue11 qe11 ea11 zk52g2d11 yk52g2d11 Bk52g2d11 Ak52g2d11 ri11 ZJ11 -nTSCV-LTAEPe11 __ZLTAEPe11 Na11";
249
249
  const $6e462db325878d1a$var$controls = function anonymous(props) {
250
250
  let rules = " ";
251
- rules += ' _pb1';
252
- if (props.isExpanded) rules += ' sd1';
253
- else rules += ' sk1';
254
- rules += ' _Cb1';
255
- rules += ' Ue1';
256
- rules += ' qe1';
257
- if (props.isExpanded) rules += ' _Ib1';
258
- else rules += ' _Ia1';
251
+ rules += ' _pb11';
252
+ if (props.isExpanded) rules += ' sd11';
253
+ else rules += ' sk11';
254
+ rules += ' _Cb11';
255
+ rules += ' Ue11';
256
+ rules += ' qe11';
257
+ if (props.isExpanded) rules += ' _Ib11';
258
+ else rules += ' _Ia11';
259
259
  return rules;
260
260
  };
261
261
  const $6e462db325878d1a$var$ICONS = {
@@ -332,7 +332,7 @@ function $6e462db325878d1a$export$f2815235e76a62b9(props) {
332
332
  children: [
333
333
  isExpanded && // eslint-disable-next-line
334
334
  /*#__PURE__*/ (0, $jeXmD$jsx)("div", {
335
- className: (0, ($parcel$interopDefault($jeXmD$Toast_modulemjs)))['toast-background'] + " _Pb1 Wr1 _lr1 _Ar1 _zr1 g81",
335
+ className: (0, ($parcel$interopDefault($jeXmD$Toast_modulemjs)))['toast-background'] + " _Pb11 Wr11 _lr11 _Ar11 _zr11 g811",
336
336
  onClick: collapse
337
337
  }),
338
338
  /*#__PURE__*/ (0, $jeXmD$jsx)($6e462db325878d1a$var$SpectrumToastList, {
@@ -484,7 +484,7 @@ function $6e462db325878d1a$export$f9b1e1c88454fa08(props) {
484
484
  !isExpanded && visibleToasts.length > 1 && /*#__PURE__*/ (0, $jeXmD$jsxs)((0, $da878a05ab4a403e$export$cfc7921d29ef7b80), {
485
485
  isQuiet: true,
486
486
  staticColor: "white",
487
- styles: " zPgKvMe1 yPgKvMe1 BPgKvMe1 APgKvMe1",
487
+ styles: " zPgKvMe11 yPgKvMe11 BPgKvMe11 APgKvMe11",
488
488
  // Make the chevron line up with the toast text, even though there is padding within the button.
489
489
  UNSAFE_style: {
490
490
  marginInlineStart: variant === 'neutral' ? -10 : 14
@@ -515,7 +515,7 @@ function $6e462db325878d1a$export$f9b1e1c88454fa08(props) {
515
515
  if (toast.content.shouldCloseOnAction) state.close(toast.key);
516
516
  },
517
517
  UNSAFE_className: ctx && isMain ? (0, ($parcel$interopDefault($jeXmD$Toast_modulemjs)))['toast-action'] : undefined,
518
- styles: " IM1 zzz3eAe1 yzz3eAe1 Bzz3eAe1 Azz3eAe1",
518
+ styles: " IM11 zzz3eAe11 yzz3eAe11 Bzz3eAe11 Azz3eAe11",
519
519
  children: toast.content.actionLabel
520
520
  })
521
521
  ]
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/s2/src/Toast.tsx"],"sourcesContent":["/*\n * Copyright 2025 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 {ActionButton} from './ActionButton';\nimport AlertIcon from '../s2wf-icons/S2_Icon_AlertTriangle_20_N.svg';\nimport {Button} from './Button';\nimport {CenterBaseline} from './CenterBaseline';\nimport CheckmarkIcon from '../s2wf-icons/S2_Icon_CheckmarkCircle_20_N.svg';\nimport Chevron from '../s2wf-icons/S2_Icon_ChevronDown_20_N.svg';\nimport {CloseButton} from './CloseButton';\nimport {createContext, ReactNode, useContext, useEffect, useMemo, useRef} from 'react';\nimport {DOMProps} from '@react-types/shared';\nimport {filterDOMProps, isWebKit, useEvent} from '@react-aria/utils';\nimport {flushSync} from 'react-dom';\nimport {focusRing, style} from '../style' with {type: 'macro'};\nimport {FocusScope, useModalOverlay} from 'react-aria';\nimport InfoIcon from '../s2wf-icons/S2_Icon_InfoCircle_20_N.svg';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ToastOptions as RACToastOptions, UNSTABLE_Toast as Toast, UNSTABLE_ToastContent as ToastContent, UNSTABLE_ToastList as ToastList, ToastProps, UNSTABLE_ToastQueue as ToastQueue, UNSTABLE_ToastRegion as ToastRegion, ToastRegionProps, UNSTABLE_ToastStateContext as ToastStateContext} from 'react-aria-components';\nimport {Text} from './Content';\nimport toastCss from './Toast.module.css';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useMediaQuery} from '@react-spectrum/utils';\nimport {useOverlayTriggerState} from 'react-stately';\n\nexport type ToastPlacement = 'top' | 'top end' | 'bottom' | 'bottom end';\nexport interface ToastContainerProps extends Omit<ToastRegionProps<SpectrumToastValue>, 'queue' | 'children' | 'style' | 'className'> {\n /**\n * Placement of the toast container on the page.\n * @default \"bottom\"\n */\n placement?: ToastPlacement\n}\n\nexport interface ToastOptions extends Omit<RACToastOptions, 'priority'>, DOMProps {\n /** A label for the action button within the toast. */\n actionLabel?: string,\n /** Handler that is called when the action button is pressed. */\n onAction?: () => void,\n /** Whether the toast should automatically close when an action is performed. */\n shouldCloseOnAction?: boolean\n}\n\nexport interface SpectrumToastValue extends DOMProps {\n /** The content of the toast. */\n children: string,\n /** The variant (i.e. color) of the toast. */\n variant: 'positive' | 'negative' | 'info' | 'neutral',\n /** A label for the action button within the toast. */\n actionLabel?: string,\n /** Handler that is called when the action button is pressed. */\n onAction?: () => void,\n /** Whether the toast should automatically close when an action is performed. */\n shouldCloseOnAction?: boolean\n}\n\nlet globalReduceMotion = false;\nfunction startViewTransition(fn: () => void, type: string) {\n if ('startViewTransition' in document) {\n // Safari doesn't support :active-view-transition-type() yet, so we fall back to a class on the html element.\n document.documentElement.classList.add(toastCss[type]);\n if (globalReduceMotion) {\n document.documentElement.classList.add(toastCss.reduceMotion);\n }\n\n let viewTransition = document.startViewTransition(() => flushSync(fn));\n\n viewTransition.ready.catch(() => {});\n viewTransition.finished.then(() => {\n document.documentElement.classList.remove(toastCss[type], toastCss.reduceMotion);\n });\n } else {\n fn();\n }\n}\n\n// There is a single global toast queue instance for the whole app, initialized lazily.\nlet globalToastQueue: ToastQueue<SpectrumToastValue> | null = null;\nfunction getGlobalToastQueue() {\n if (!globalToastQueue) {\n globalToastQueue = new ToastQueue({\n maxVisibleToasts: Infinity,\n wrapUpdate(fn, action) {\n startViewTransition(fn, `toast-${action}`);\n }\n });\n }\n\n return globalToastQueue;\n}\n\nfunction addToast(children: string, variant: SpectrumToastValue['variant'], options: ToastOptions = {}) {\n let value = {\n children,\n variant,\n actionLabel: options.actionLabel,\n onAction: options.onAction,\n shouldCloseOnAction: options.shouldCloseOnAction,\n ...filterDOMProps(options)\n };\n\n // Minimum time of 5s from https://spectrum.adobe.com/page/toast/#Auto-dismissible\n // Actionable toasts cannot be auto dismissed. That would fail WCAG SC 2.2.1.\n // It is debatable whether non-actionable toasts would also fail.\n let timeout = options.timeout && !options.actionLabel ? Math.max(options.timeout, 5000) : undefined;\n let queue = getGlobalToastQueue();\n let key = queue.add(value, {timeout, onClose: options.onClose});\n return () => queue.close(key);\n}\n\ntype CloseFunction = () => void;\n\nconst SpectrumToastQueue = {\n /** Queues a neutral toast. */\n neutral(children: string, options: ToastOptions = {}): CloseFunction {\n return addToast(children, 'neutral', options);\n },\n /** Queues a positive toast. */\n positive(children: string, options: ToastOptions = {}): CloseFunction {\n return addToast(children, 'positive', options);\n },\n /** Queues a negative toast. */\n negative(children: string, options: ToastOptions = {}): CloseFunction {\n return addToast(children, 'negative', options);\n },\n /** Queues an informational toast. */\n info(children: string, options: ToastOptions = {}): CloseFunction {\n return addToast(children, 'info', options);\n }\n};\n\nexport {SpectrumToastQueue as ToastQueue};\n\nconst toastRegion = style({\n ...focusRing(),\n display: 'flex',\n flexDirection: {\n placement: {\n top: 'column',\n bottom: 'column-reverse'\n }\n },\n position: 'fixed',\n insetX: 0,\n width: 'fit',\n top: {\n placement: {\n top: {\n default: 16,\n isExpanded: 0\n }\n }\n },\n bottom: {\n placement: {\n bottom: {\n default: 16,\n isExpanded: 0\n }\n }\n },\n marginStart: {\n align: {\n start: 16,\n center: 'auto',\n end: 'auto'\n }\n },\n marginEnd: {\n align: {\n start: 'auto',\n center: 'auto',\n end: 16\n }\n },\n boxSizing: 'border-box',\n maxHeight: 'full',\n borderRadius: 'lg'\n});\n\nconst toastList = style({\n position: 'relative',\n flexGrow: 1,\n display: 'flex',\n gap: 8,\n flexDirection: {\n placement: {\n top: 'column',\n bottom: 'column-reverse'\n }\n },\n boxSizing: 'border-box',\n marginY: 0,\n padding: {\n default: 0,\n // Add padding when expanded to account for focus ring.\n isExpanded: 8\n },\n paddingBottom: {\n isExpanded: {\n placement: {\n top: 8,\n bottom: 16\n }\n }\n },\n paddingTop: {\n isExpanded: {\n placement: {\n top: 16,\n bottom: 8\n }\n }\n },\n margin: 0,\n marginX: {\n default: 0,\n // Undo padding for focus ring.\n isExpanded: -8\n },\n overflow: {\n isExpanded: 'auto'\n }\n});\n\nconst toastStyle = style({\n ...focusRing(),\n outlineColor: {\n default: 'focus-ring',\n isExpanded: 'white'\n },\n display: 'flex',\n gap: 16,\n paddingStart: 16,\n paddingEnd: 8,\n paddingY: 12,\n borderRadius: 'lg',\n minHeight: 56,\n '--maxWidth': {\n type: 'maxWidth',\n value: 336\n },\n maxWidth: 'min(var(--maxWidth), 90vw)',\n boxSizing: 'border-box',\n flexShrink: 0,\n font: 'ui',\n color: 'white',\n backgroundColor: {\n variant: {\n neutral: 'neutral-subdued',\n info: 'informative',\n positive: 'positive',\n negative: 'negative'\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n },\n boxShadow: {\n default: 'elevated',\n isExpanded: 'none'\n },\n willChange: 'transform'\n});\n\nconst toastBody = style({\n // The top toast in a non-expanded stack has the expand button, so it is rendered as a grid.\n // Otherwise it uses flex so the content can wrap when needed.\n display: {\n default: 'grid',\n isSingle: 'flex'\n },\n gridTemplateColumns: ['auto', '1fr', 'auto'],\n gridTemplateAreas: [\n 'content content content',\n 'expand . action'\n ],\n flexGrow: 1,\n flexWrap: 'wrap',\n alignItems: 'center',\n columnGap: 24,\n rowGap: 8\n});\n\nconst toastContent = style({\n display: 'flex',\n gap: 8,\n alignItems: 'baseline',\n gridArea: 'content',\n cursor: 'default',\n width: 'fit',\n overflowWrap: 'break-word',\n wordBreak: 'break-word',\n minWidth: 0\n});\n\nconst controls = style({\n colorScheme: 'light',\n display: {\n default: 'none',\n isExpanded: 'flex'\n },\n justifyContent: 'end',\n gap: 8,\n opacity: {\n default: 0,\n isExpanded: 1\n }\n});\n\nconst ICONS = {\n info: InfoIcon,\n negative: AlertIcon,\n positive: CheckmarkIcon\n};\n\ninterface ToastContainerContextValue {\n isExpanded: boolean,\n toggleExpanded: () => void\n}\n\nconst ToastContainerContext = createContext<ToastContainerContextValue | null>(null);\n\n/**\n * A ToastContainer renders the queued toasts in an application. It should be placed\n * at the root of the app.\n */\nexport function ToastContainer(props: ToastContainerProps): ReactNode {\n let {\n placement = 'bottom'\n } = props;\n let queue = getGlobalToastQueue();\n let align = 'center';\n [placement, align = 'center'] = placement.split(' ') as any;\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n let regionRef = useRef<HTMLDivElement | null>(null);\n\n let state = useOverlayTriggerState({});\n let {isOpen: isExpanded, close, toggle} = state;\n let ctx = useMemo(() => ({\n isExpanded,\n toggleExpanded() {\n if (!isExpanded && queue.visibleToasts.length <= 1) {\n return;\n }\n\n startViewTransition(\n () => toggle(),\n isExpanded ? 'toast-collapse' : 'toast-expand'\n );\n }\n }), [isExpanded, toggle, queue]);\n\n // Set the state to collapsed whenever the queue is emptied.\n useEffect(() => {\n return queue.subscribe(() => {\n if (queue.visibleToasts.length === 0 && isExpanded) {\n close();\n }\n });\n }, [queue, isExpanded, close]);\n\n let collapse = () => {\n regionRef.current?.focus();\n ctx.toggleExpanded();\n };\n\n // Prevent scroll, aria hide outside, and contain focus when expanded, since we take over the whole screen.\n // Attach event handler to the ref since ToastRegion doesn't pass through onKeyDown.\n useModalOverlay({}, state, regionRef);\n useEvent(regionRef, 'keydown', isExpanded ? (e) => {\n if (e.key === 'Escape') {\n collapse();\n }\n } : undefined);\n\n let prefersReducedMotion = useMediaQuery('(prefers-reduced-motion)');\n let reduceMotion = props['PRIVATE_forceReducedMotion'] ?? prefersReducedMotion;\n useEffect(() => {\n let oldGlobalReduceMotion = globalReduceMotion;\n globalReduceMotion = reduceMotion;\n return () => {\n globalReduceMotion = oldGlobalReduceMotion;\n };\n }, [reduceMotion]);\n\n return (\n <ToastRegion\n {...props}\n ref={regionRef}\n queue={queue}\n className={renderProps => toastRegion({\n ...renderProps,\n placement,\n align,\n isExpanded\n })}>\n <FocusScope contain={isExpanded}>\n <ToastContainerContext.Provider value={ctx}>\n {isExpanded && (\n // eslint-disable-next-line\n <div\n className={toastCss['toast-background'] + style({position: 'fixed', inset: 0, backgroundColor: 'transparent-black-500'})}\n onClick={collapse} />\n )}\n <SpectrumToastList\n placement={placement}\n align={align}\n reduceMotion={reduceMotion} />\n <div className={toastCss['toast-controls'] + controls({isExpanded})}>\n <ActionButton\n size=\"S\"\n onPress={() => queue.clear()}\n // Default focus ring does not have enough contrast against gray background.\n UNSAFE_style={{outlineColor: 'white'}}>\n {stringFormatter.format('toast.clearAll')}\n </ActionButton>\n <ActionButton\n size=\"S\"\n onPress={collapse}\n UNSAFE_style={{outlineColor: 'white'}}>\n {stringFormatter.format('toast.collapse')}\n </ActionButton>\n </div>\n </ToastContainerContext.Provider>\n </FocusScope>\n </ToastRegion>\n );\n}\n\nfunction SpectrumToastList({placement, align, reduceMotion}) {\n let {isExpanded, toggleExpanded} = useContext(ToastContainerContext)!;\n\n // Attach click handler to ref since ToastList doesn't pass through onClick/onPress.\n let toastListRef = useRef(null);\n useEvent(toastListRef, 'click', (e) => {\n // Have to check if this is a button because stopPropagation in react events doesn't affect native events.\n if (!isExpanded && !(e.target as Element)?.closest('button')) {\n toggleExpanded();\n }\n });\n\n return (\n <ToastList<SpectrumToastValue>\n ref={toastListRef}\n style={({isHovered}) => {\n let origin = isHovered ? 95 : 55;\n return {\n perspective: 80,\n perspectiveOrigin: 'center ' + (placement === 'top' ? `calc(100% + ${origin}px)` : `${-origin}px`),\n transition: 'perspective-origin 400ms'\n };\n }}\n className={toastCss[isExpanded ? 'toast-list-expanded' : 'toast-list-collapsed'] + toastList({placement, align, isExpanded})}>\n {({toast}) => (\n <SpectrumToast\n toast={toast}\n placement={placement}\n align={align}\n reduceMotion={reduceMotion} />\n )}\n </ToastList>\n );\n}\n\ninterface SpectrumToastProps extends ToastProps<SpectrumToastValue> {\n placement?: 'top' | 'bottom',\n align?: 'start' | 'center' | 'end',\n reduceMotion?: boolean\n}\n\n// Exported locally for stories.\nexport function SpectrumToast(props: SpectrumToastProps): ReactNode {\n let {toast, placement = 'bottom', align = 'center'} = props;\n let variant = toast.content.variant || 'info';\n let Icon = ICONS[variant];\n let state = useContext(ToastStateContext)!;\n let visibleToasts = state.visibleToasts;\n let index = visibleToasts.indexOf(toast);\n let isMain = index <= 0;\n let ctx = useContext(ToastContainerContext);\n let isExpanded = ctx?.isExpanded || false;\n let toastRef = useRef<HTMLDivElement | null>(null);\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n\n // When not expanded, use a presentational div for the toasts behind the top one.\n // The content is invisible, all we show is the background color.\n if (!isMain && ctx && !ctx.isExpanded) {\n return (\n <div\n role=\"presentation\"\n style={{\n position: 'absolute',\n [placement === 'top' ? 'bottom' : 'top']: 0,\n left: 0,\n width: '100%',\n translate: `0 0 ${(-12 * index) / 16}rem`,\n // Only 3 toasts are visible in the stack at once, but all toasts are in the DOM.\n // This allows view transitions to smoothly animate them from where they would be\n // in the collapsed stack to their final position in the expanded list.\n opacity: index >= 3 ? 0 : 1,\n zIndex: visibleToasts.length - index - 1,\n // When reduced motion is enabled, use append index to view-transition-name\n // so that adding/removing a toast cross fades instead of transitioning the position.\n // This works because the toasts are seen as separate elements instead of the same one when their index changes.\n viewTransitionName: toast.key + (props.reduceMotion ? '-' + index : ''),\n viewTransitionClass: [toastCss.toast, toastCss['background-toast']].map(c => CSS.escape(c)).join(' ')\n }}\n className={toastCss.toast + toastStyle({variant: toast.content.variant || 'info', index, isExpanded})}\n ref={fixSafariTransform} />\n );\n }\n\n return (\n <Toast\n ref={toastRef}\n toast={toast}\n style={{\n zIndex: visibleToasts.length - index - 1,\n viewTransitionName: toast.key,\n viewTransitionClass: [toastCss.toast, !isMain ? toastCss['background-toast'] : '', toastCss[placement], toastCss[align]].filter(Boolean).map(c => CSS.escape(c)).join(' ')\n }}\n className={renderProps => toastCss.toast + toastStyle({\n ...renderProps,\n variant: toast.content.variant || 'info',\n index,\n isExpanded\n })}>\n <div role=\"presentation\" className={toastBody({isSingle: !isMain || visibleToasts.length <= 1 || isExpanded})}>\n <ToastContent className={toastContent + (ctx && isMain ? ` ${toastCss['toast-content']}` : null)}>\n {Icon &&\n <CenterBaseline>\n <Icon />\n </CenterBaseline>\n }\n <Text slot=\"title\">{toast.content.children}</Text>\n </ToastContent>\n {!isExpanded && visibleToasts.length > 1 &&\n <ActionButton\n isQuiet\n staticColor=\"white\"\n styles={style({gridArea: 'expand'})}\n // Make the chevron line up with the toast text, even though there is padding within the button.\n UNSAFE_style={{marginInlineStart: variant === 'neutral' ? -10 : 14}}\n UNSAFE_className={ctx && isMain ? toastCss['toast-expand'] : undefined}\n onPress={() => {\n // This button disappears when clicked, so move focus to the toast.\n toastRef.current?.focus();\n ctx?.toggleExpanded();\n }}>\n <Text>{stringFormatter.format('toast.showAll')}</Text>\n {/* @ts-ignore */}\n <Chevron UNSAFE_style={{rotate: placement === 'bottom' ? '180deg' : undefined}} />\n </ActionButton>\n }\n {toast.content.actionLabel &&\n <Button\n variant=\"secondary\"\n fillStyle=\"outline\"\n staticColor=\"white\"\n onPress={() => {\n toast.content.onAction?.();\n if (toast.content.shouldCloseOnAction) {\n state.close(toast.key);\n }\n }}\n UNSAFE_className={ctx && isMain ? toastCss['toast-action'] : undefined}\n styles={style({marginStart: 'auto', gridArea: 'action'})}>\n {toast.content.actionLabel}\n </Button>\n }\n </div>\n <CloseButton\n staticColor=\"white\"\n UNSAFE_className={ctx && isMain ? toastCss['toast-close'] : undefined} />\n </Toast>\n );\n}\n\nfunction fixSafariTransform(el: HTMLDivElement | null) {\n // Safari has a bug where the toasts display in the wrong position (CSS transform is not applied correctly).\n // Work around this by removing it, forcing a reflow, and re-applying.\n if (el && isWebKit()) {\n let translate = el.style.translate;\n el.style.translate = '';\n el.offsetHeight;\n el.style.translate = translate;\n }\n}\n"],"names":[],"version":3,"file":"Toast.mjs.map"}
1
+ {"mappings":"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","sources":["packages/@react-spectrum/s2/src/Toast.tsx"],"sourcesContent":["/*\n * Copyright 2025 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 {ActionButton} from './ActionButton';\nimport AlertIcon from '../s2wf-icons/S2_Icon_AlertTriangle_20_N.svg';\nimport {Button} from './Button';\nimport {CenterBaseline} from './CenterBaseline';\nimport CheckmarkIcon from '../s2wf-icons/S2_Icon_CheckmarkCircle_20_N.svg';\nimport Chevron from '../s2wf-icons/S2_Icon_ChevronDown_20_N.svg';\nimport {CloseButton} from './CloseButton';\nimport {createContext, ReactNode, useContext, useEffect, useMemo, useRef} from 'react';\nimport {DOMProps} from '@react-types/shared';\nimport {filterDOMProps, isWebKit, useEvent} from '@react-aria/utils';\nimport {flushSync} from 'react-dom';\nimport {focusRing, style} from '../style' with {type: 'macro'};\nimport {FocusScope, useModalOverlay} from 'react-aria';\nimport InfoIcon from '../s2wf-icons/S2_Icon_InfoCircle_20_N.svg';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ToastOptions as RACToastOptions, UNSTABLE_Toast as Toast, UNSTABLE_ToastContent as ToastContent, UNSTABLE_ToastList as ToastList, ToastProps, UNSTABLE_ToastQueue as ToastQueue, UNSTABLE_ToastRegion as ToastRegion, ToastRegionProps, UNSTABLE_ToastStateContext as ToastStateContext} from 'react-aria-components';\nimport {Text} from './Content';\nimport toastCss from './Toast.module.css';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useMediaQuery} from '@react-spectrum/utils';\nimport {useOverlayTriggerState} from 'react-stately';\n\nexport type ToastPlacement = 'top' | 'top end' | 'bottom' | 'bottom end';\nexport interface ToastContainerProps extends Omit<ToastRegionProps<SpectrumToastValue>, 'queue' | 'children' | 'style' | 'className' | 'render'> {\n /**\n * Placement of the toast container on the page.\n * @default \"bottom\"\n */\n placement?: ToastPlacement\n}\n\nexport interface ToastOptions extends Omit<RACToastOptions, 'priority'>, DOMProps {\n /** A label for the action button within the toast. */\n actionLabel?: string,\n /** Handler that is called when the action button is pressed. */\n onAction?: () => void,\n /** Whether the toast should automatically close when an action is performed. */\n shouldCloseOnAction?: boolean\n}\n\nexport interface SpectrumToastValue extends DOMProps {\n /** The content of the toast. */\n children: string,\n /** The variant (i.e. color) of the toast. */\n variant: 'positive' | 'negative' | 'info' | 'neutral',\n /** A label for the action button within the toast. */\n actionLabel?: string,\n /** Handler that is called when the action button is pressed. */\n onAction?: () => void,\n /** Whether the toast should automatically close when an action is performed. */\n shouldCloseOnAction?: boolean\n}\n\nlet globalReduceMotion = false;\nfunction startViewTransition(fn: () => void, type: string) {\n if ('startViewTransition' in document) {\n // Safari doesn't support :active-view-transition-type() yet, so we fall back to a class on the html element.\n document.documentElement.classList.add(toastCss[type]);\n if (globalReduceMotion) {\n document.documentElement.classList.add(toastCss.reduceMotion);\n }\n\n let viewTransition = document.startViewTransition(() => flushSync(fn));\n\n viewTransition.ready.catch(() => {});\n viewTransition.finished.then(() => {\n document.documentElement.classList.remove(toastCss[type], toastCss.reduceMotion);\n });\n } else {\n fn();\n }\n}\n\n// There is a single global toast queue instance for the whole app, initialized lazily.\nlet globalToastQueue: ToastQueue<SpectrumToastValue> | null = null;\nfunction getGlobalToastQueue() {\n if (!globalToastQueue) {\n globalToastQueue = new ToastQueue({\n maxVisibleToasts: Infinity,\n wrapUpdate(fn, action) {\n startViewTransition(fn, `toast-${action}`);\n }\n });\n }\n\n return globalToastQueue;\n}\n\nfunction addToast(children: string, variant: SpectrumToastValue['variant'], options: ToastOptions = {}) {\n let value = {\n children,\n variant,\n actionLabel: options.actionLabel,\n onAction: options.onAction,\n shouldCloseOnAction: options.shouldCloseOnAction,\n ...filterDOMProps(options)\n };\n\n // Minimum time of 5s from https://spectrum.adobe.com/page/toast/#Auto-dismissible\n // Actionable toasts cannot be auto dismissed. That would fail WCAG SC 2.2.1.\n // It is debatable whether non-actionable toasts would also fail.\n let timeout = options.timeout && !options.actionLabel ? Math.max(options.timeout, 5000) : undefined;\n let queue = getGlobalToastQueue();\n let key = queue.add(value, {timeout, onClose: options.onClose});\n return () => queue.close(key);\n}\n\ntype CloseFunction = () => void;\n\nconst SpectrumToastQueue = {\n /** Queues a neutral toast. */\n neutral(children: string, options: ToastOptions = {}): CloseFunction {\n return addToast(children, 'neutral', options);\n },\n /** Queues a positive toast. */\n positive(children: string, options: ToastOptions = {}): CloseFunction {\n return addToast(children, 'positive', options);\n },\n /** Queues a negative toast. */\n negative(children: string, options: ToastOptions = {}): CloseFunction {\n return addToast(children, 'negative', options);\n },\n /** Queues an informational toast. */\n info(children: string, options: ToastOptions = {}): CloseFunction {\n return addToast(children, 'info', options);\n }\n};\n\nexport {SpectrumToastQueue as ToastQueue};\n\nconst toastRegion = style({\n ...focusRing(),\n display: 'flex',\n flexDirection: {\n placement: {\n top: 'column',\n bottom: 'column-reverse'\n }\n },\n position: 'fixed',\n insetX: 0,\n width: 'fit',\n top: {\n placement: {\n top: {\n default: 16,\n isExpanded: 0\n }\n }\n },\n bottom: {\n placement: {\n bottom: {\n default: 16,\n isExpanded: 0\n }\n }\n },\n marginStart: {\n align: {\n start: 16,\n center: 'auto',\n end: 'auto'\n }\n },\n marginEnd: {\n align: {\n start: 'auto',\n center: 'auto',\n end: 16\n }\n },\n boxSizing: 'border-box',\n maxHeight: 'full',\n borderRadius: 'lg'\n});\n\nconst toastList = style({\n position: 'relative',\n flexGrow: 1,\n display: 'flex',\n gap: 8,\n flexDirection: {\n placement: {\n top: 'column',\n bottom: 'column-reverse'\n }\n },\n boxSizing: 'border-box',\n marginY: 0,\n padding: {\n default: 0,\n // Add padding when expanded to account for focus ring.\n isExpanded: 8\n },\n paddingBottom: {\n isExpanded: {\n placement: {\n top: 8,\n bottom: 16\n }\n }\n },\n paddingTop: {\n isExpanded: {\n placement: {\n top: 16,\n bottom: 8\n }\n }\n },\n margin: 0,\n marginX: {\n default: 0,\n // Undo padding for focus ring.\n isExpanded: -8\n },\n overflow: {\n isExpanded: 'auto'\n }\n});\n\nconst toastStyle = style({\n ...focusRing(),\n outlineColor: {\n default: 'focus-ring',\n isExpanded: 'white'\n },\n display: 'flex',\n gap: 16,\n paddingStart: 16,\n paddingEnd: 8,\n paddingY: 12,\n borderRadius: 'lg',\n minHeight: 56,\n '--maxWidth': {\n type: 'maxWidth',\n value: 336\n },\n maxWidth: 'min(var(--maxWidth), 90vw)',\n boxSizing: 'border-box',\n flexShrink: 0,\n font: 'ui',\n color: 'white',\n backgroundColor: {\n variant: {\n neutral: 'neutral-subdued',\n info: 'informative',\n positive: 'positive',\n negative: 'negative'\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n },\n boxShadow: {\n default: 'elevated',\n isExpanded: 'none'\n },\n willChange: 'transform'\n});\n\nconst toastBody = style({\n // The top toast in a non-expanded stack has the expand button, so it is rendered as a grid.\n // Otherwise it uses flex so the content can wrap when needed.\n display: {\n default: 'grid',\n isSingle: 'flex'\n },\n gridTemplateColumns: ['auto', '1fr', 'auto'],\n gridTemplateAreas: [\n 'content content content',\n 'expand . action'\n ],\n flexGrow: 1,\n flexWrap: 'wrap',\n alignItems: 'center',\n columnGap: 24,\n rowGap: 8\n});\n\nconst toastContent = style({\n display: 'flex',\n gap: 8,\n alignItems: 'baseline',\n gridArea: 'content',\n cursor: 'default',\n width: 'fit',\n overflowWrap: 'break-word',\n wordBreak: 'break-word',\n minWidth: 0\n});\n\nconst controls = style({\n colorScheme: 'light',\n display: {\n default: 'none',\n isExpanded: 'flex'\n },\n justifyContent: 'end',\n gap: 8,\n opacity: {\n default: 0,\n isExpanded: 1\n }\n});\n\nconst ICONS = {\n info: InfoIcon,\n negative: AlertIcon,\n positive: CheckmarkIcon\n};\n\ninterface ToastContainerContextValue {\n isExpanded: boolean,\n toggleExpanded: () => void\n}\n\nconst ToastContainerContext = createContext<ToastContainerContextValue | null>(null);\n\n/**\n * A ToastContainer renders the queued toasts in an application. It should be placed\n * at the root of the app.\n */\nexport function ToastContainer(props: ToastContainerProps): ReactNode {\n let {\n placement = 'bottom'\n } = props;\n let queue = getGlobalToastQueue();\n let align = 'center';\n [placement, align = 'center'] = placement.split(' ') as any;\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n let regionRef = useRef<HTMLDivElement | null>(null);\n\n let state = useOverlayTriggerState({});\n let {isOpen: isExpanded, close, toggle} = state;\n let ctx = useMemo(() => ({\n isExpanded,\n toggleExpanded() {\n if (!isExpanded && queue.visibleToasts.length <= 1) {\n return;\n }\n\n startViewTransition(\n () => toggle(),\n isExpanded ? 'toast-collapse' : 'toast-expand'\n );\n }\n }), [isExpanded, toggle, queue]);\n\n // Set the state to collapsed whenever the queue is emptied.\n useEffect(() => {\n return queue.subscribe(() => {\n if (queue.visibleToasts.length === 0 && isExpanded) {\n close();\n }\n });\n }, [queue, isExpanded, close]);\n\n let collapse = () => {\n regionRef.current?.focus();\n ctx.toggleExpanded();\n };\n\n // Prevent scroll, aria hide outside, and contain focus when expanded, since we take over the whole screen.\n // Attach event handler to the ref since ToastRegion doesn't pass through onKeyDown.\n useModalOverlay({}, state, regionRef);\n useEvent(regionRef, 'keydown', isExpanded ? (e) => {\n if (e.key === 'Escape') {\n collapse();\n }\n } : undefined);\n\n let prefersReducedMotion = useMediaQuery('(prefers-reduced-motion)');\n let reduceMotion = props['PRIVATE_forceReducedMotion'] ?? prefersReducedMotion;\n useEffect(() => {\n let oldGlobalReduceMotion = globalReduceMotion;\n globalReduceMotion = reduceMotion;\n return () => {\n globalReduceMotion = oldGlobalReduceMotion;\n };\n }, [reduceMotion]);\n\n return (\n <ToastRegion\n {...props}\n ref={regionRef}\n queue={queue}\n className={renderProps => toastRegion({\n ...renderProps,\n placement,\n align,\n isExpanded\n })}>\n <FocusScope contain={isExpanded}>\n <ToastContainerContext.Provider value={ctx}>\n {isExpanded && (\n // eslint-disable-next-line\n <div\n className={toastCss['toast-background'] + style({position: 'fixed', inset: 0, backgroundColor: 'transparent-black-500'})}\n onClick={collapse} />\n )}\n <SpectrumToastList\n placement={placement}\n align={align}\n reduceMotion={reduceMotion} />\n <div className={toastCss['toast-controls'] + controls({isExpanded})}>\n <ActionButton\n size=\"S\"\n onPress={() => queue.clear()}\n // Default focus ring does not have enough contrast against gray background.\n UNSAFE_style={{outlineColor: 'white'}}>\n {stringFormatter.format('toast.clearAll')}\n </ActionButton>\n <ActionButton\n size=\"S\"\n onPress={collapse}\n UNSAFE_style={{outlineColor: 'white'}}>\n {stringFormatter.format('toast.collapse')}\n </ActionButton>\n </div>\n </ToastContainerContext.Provider>\n </FocusScope>\n </ToastRegion>\n );\n}\n\nfunction SpectrumToastList({placement, align, reduceMotion}) {\n let {isExpanded, toggleExpanded} = useContext(ToastContainerContext)!;\n\n // Attach click handler to ref since ToastList doesn't pass through onClick/onPress.\n let toastListRef = useRef(null);\n useEvent(toastListRef, 'click', (e) => {\n // Have to check if this is a button because stopPropagation in react events doesn't affect native events.\n if (!isExpanded && !(e.target as Element)?.closest('button')) {\n toggleExpanded();\n }\n });\n\n return (\n <ToastList<SpectrumToastValue>\n ref={toastListRef}\n style={({isHovered}) => {\n let origin = isHovered ? 95 : 55;\n return {\n perspective: 80,\n perspectiveOrigin: 'center ' + (placement === 'top' ? `calc(100% + ${origin}px)` : `${-origin}px`),\n transition: 'perspective-origin 400ms'\n };\n }}\n className={toastCss[isExpanded ? 'toast-list-expanded' : 'toast-list-collapsed'] + toastList({placement, align, isExpanded})}>\n {({toast}) => (\n <SpectrumToast\n toast={toast}\n placement={placement}\n align={align}\n reduceMotion={reduceMotion} />\n )}\n </ToastList>\n );\n}\n\ninterface SpectrumToastProps extends ToastProps<SpectrumToastValue> {\n placement?: 'top' | 'bottom',\n align?: 'start' | 'center' | 'end',\n reduceMotion?: boolean\n}\n\n// Exported locally for stories.\nexport function SpectrumToast(props: SpectrumToastProps): ReactNode {\n let {toast, placement = 'bottom', align = 'center'} = props;\n let variant = toast.content.variant || 'info';\n let Icon = ICONS[variant];\n let state = useContext(ToastStateContext)!;\n let visibleToasts = state.visibleToasts;\n let index = visibleToasts.indexOf(toast);\n let isMain = index <= 0;\n let ctx = useContext(ToastContainerContext);\n let isExpanded = ctx?.isExpanded || false;\n let toastRef = useRef<HTMLDivElement | null>(null);\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n\n // When not expanded, use a presentational div for the toasts behind the top one.\n // The content is invisible, all we show is the background color.\n if (!isMain && ctx && !ctx.isExpanded) {\n return (\n <div\n role=\"presentation\"\n style={{\n position: 'absolute',\n [placement === 'top' ? 'bottom' : 'top']: 0,\n left: 0,\n width: '100%',\n translate: `0 0 ${(-12 * index) / 16}rem`,\n // Only 3 toasts are visible in the stack at once, but all toasts are in the DOM.\n // This allows view transitions to smoothly animate them from where they would be\n // in the collapsed stack to their final position in the expanded list.\n opacity: index >= 3 ? 0 : 1,\n zIndex: visibleToasts.length - index - 1,\n // When reduced motion is enabled, use append index to view-transition-name\n // so that adding/removing a toast cross fades instead of transitioning the position.\n // This works because the toasts are seen as separate elements instead of the same one when their index changes.\n viewTransitionName: toast.key + (props.reduceMotion ? '-' + index : ''),\n viewTransitionClass: [toastCss.toast, toastCss['background-toast']].map(c => CSS.escape(c)).join(' ')\n }}\n className={toastCss.toast + toastStyle({variant: toast.content.variant || 'info', index, isExpanded})}\n ref={fixSafariTransform} />\n );\n }\n\n return (\n <Toast\n ref={toastRef}\n toast={toast}\n style={{\n zIndex: visibleToasts.length - index - 1,\n viewTransitionName: toast.key,\n viewTransitionClass: [toastCss.toast, !isMain ? toastCss['background-toast'] : '', toastCss[placement], toastCss[align]].filter(Boolean).map(c => CSS.escape(c)).join(' ')\n }}\n className={renderProps => toastCss.toast + toastStyle({\n ...renderProps,\n variant: toast.content.variant || 'info',\n index,\n isExpanded\n })}>\n <div role=\"presentation\" className={toastBody({isSingle: !isMain || visibleToasts.length <= 1 || isExpanded})}>\n <ToastContent className={toastContent + (ctx && isMain ? ` ${toastCss['toast-content']}` : null)}>\n {Icon &&\n <CenterBaseline>\n <Icon />\n </CenterBaseline>\n }\n <Text slot=\"title\">{toast.content.children}</Text>\n </ToastContent>\n {!isExpanded && visibleToasts.length > 1 &&\n <ActionButton\n isQuiet\n staticColor=\"white\"\n styles={style({gridArea: 'expand'})}\n // Make the chevron line up with the toast text, even though there is padding within the button.\n UNSAFE_style={{marginInlineStart: variant === 'neutral' ? -10 : 14}}\n UNSAFE_className={ctx && isMain ? toastCss['toast-expand'] : undefined}\n onPress={() => {\n // This button disappears when clicked, so move focus to the toast.\n toastRef.current?.focus();\n ctx?.toggleExpanded();\n }}>\n <Text>{stringFormatter.format('toast.showAll')}</Text>\n {/* @ts-ignore */}\n <Chevron UNSAFE_style={{rotate: placement === 'bottom' ? '180deg' : undefined}} />\n </ActionButton>\n }\n {toast.content.actionLabel &&\n <Button\n variant=\"secondary\"\n fillStyle=\"outline\"\n staticColor=\"white\"\n onPress={() => {\n toast.content.onAction?.();\n if (toast.content.shouldCloseOnAction) {\n state.close(toast.key);\n }\n }}\n UNSAFE_className={ctx && isMain ? toastCss['toast-action'] : undefined}\n styles={style({marginStart: 'auto', gridArea: 'action'})}>\n {toast.content.actionLabel}\n </Button>\n }\n </div>\n <CloseButton\n staticColor=\"white\"\n UNSAFE_className={ctx && isMain ? toastCss['toast-close'] : undefined} />\n </Toast>\n );\n}\n\nfunction fixSafariTransform(el: HTMLDivElement | null) {\n // Safari has a bug where the toasts display in the wrong position (CSS transform is not applied correctly).\n // Work around this by removing it, forcing a reflow, and re-applying.\n if (el && isWebKit()) {\n let translate = el.style.translate;\n el.style.translate = '';\n el.offsetHeight;\n el.style.translate = translate;\n }\n}\n"],"names":[],"version":3,"file":"Toast.mjs.map"}
@@ -78,7 +78,7 @@ const $d16e5203405a91b7$export$d2b052e7b4be1756 = /*#__PURE__*/ (0, $kyLWK$react
78
78
  [
79
79
  (0, $6367bc87eb7d24ad$exports.TextContext),
80
80
  {
81
- styles: " TAzEcG1 QAzEcG1 _Jb1 _Nc1 Pc1 _Yb1 _7c1"
81
+ styles: " TAzEcG11 QAzEcG11 _Jb11 _Nc11 Pc11 _Yb11 _7c11"
82
82
  }
83
83
  ],
84
84
  [
@@ -86,9 +86,9 @@ const $d16e5203405a91b7$export$d2b052e7b4be1756 = /*#__PURE__*/ (0, $kyLWK$react
86
86
  {
87
87
  render: (0, $e991cbcdf82ced71$exports.centerBaseline)({
88
88
  slot: 'icon',
89
- styles: " _Ja1"
89
+ styles: " _Ja11"
90
90
  }),
91
- styles: " ZuUmpre1 FuUmpre1 I67logd1 _va1"
91
+ styles: " ZuUmpre11 FuUmpre11 I67logd11 _va11"
92
92
  }
93
93
  ]
94
94
  ],
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;AAyBM,MAAM,0DAAsB,CAAA,GAAA,0BAAY,EAAkF;AAM1H,MAAM,0DAAe,CAAA,GAAA,uBAAS,EAAE,SAAS,aAAa,KAAwB,EAAE,GAAoC;IACzH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,QAAQ,CAAA,GAAA,sCAAW,EAAE;IACrB,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE;IAC7B,IAAI,MAAM,CAAA,GAAA,4CAAgB,EAAE,CAAA,GAAA,kDAAuB;IACnD,IAAI,YAAY,CAAC,CAAC;IAClB,IAAI,WACF,UAAU,wBACV,WAAW,eACX,cAAc,2BACd,cAAc,MAAM,WAAW,WAC/B,UAAU,MAAM,OAAO,gBACvB,eAAe,MAAM,YAAY,QACjC,OAAO,MAAM,IAAI,IAAI,iBACrB,aAAa,MAAM,UAAU,EAC9B,GAAG,OAAO,CAAC;IAEZ,qBACE,gCAAC,CAAA,GAAA,uCAAc;QACZ,GAAG,KAAK;QACT,YAAY;QACZ,KAAK;QACL,OAAO,CAAA,GAAA,oCAAS,EAAE,QAAQ,MAAM,YAAY;QAC5C,WAAW,CAAA,cAAe,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,CAAA,GAAA,mCAAQ,EAAE;gBACnE,GAAG,WAAW;6BACd;gBACA,eAAe,CAAC,CAAC;sBACjB;yBACA;8BACA;gBACA,WAAW;yBACX;6BACA;6BACA;2BACA;YACF,GAAG,MAAM,MAAM;kBACf,cAAA,gCAAC,CAAA,GAAA,mCAAO;YACN,QAAQ;gBACN;oBAAC,CAAA,GAAA,yCAAc;oBAAG;iBAAK;gBACvB;oBAAC,CAAA,GAAA,qCAAU;oBAAG;wBAAC,MAAM;oBAA+D;iBAAE;gBACtF;oBAAC,CAAA,GAAA,qCAAU;oBAAG;wBACZ,QAAQ,CAAA,GAAA,wCAAa,EAAE;4BAAC,MAAM;4BAAQ,MAAM;wBAAmB;wBAC/D,MAAM;oBACR;iBAAE;aACH;sBACA,OAAO,MAAM,QAAQ,KAAK,yBAAW,gCAAC,CAAA,GAAA,8BAAG;0BAAG,MAAM,QAAQ;iBAAW,MAAM,QAAQ;;;AAI5F","sources":["packages/@react-spectrum/s2/src/ToggleButton.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 {ActionButtonStyleProps, btnStyles} from './ActionButton';\nimport {centerBaseline} from './CenterBaseline';\nimport {ContextValue, Provider, ToggleButton as RACToggleButton, ToggleButtonProps as RACToggleButtonProps, useSlottedContext} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {FocusableRef, FocusableRefValue, GlobalDOMAttributes} from '@react-types/shared';\nimport {fontRelative, style} from '../style' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {pressScale} from './pressScale';\nimport {SkeletonContext} from './Skeleton';\nimport {StyleProps} from './style-utils';\nimport {Text, TextContext} from './Content';\nimport {ToggleButtonGroupContext} from './ToggleButtonGroup';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useFormProps} from './Form';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ToggleButtonProps extends Omit<RACToggleButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange' | 'onClick' | keyof GlobalDOMAttributes>, StyleProps, ActionButtonStyleProps {\n /** The content to display in the button. */\n children: ReactNode,\n /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n isEmphasized?: boolean\n}\n\nexport const ToggleButtonContext = createContext<ContextValue<Partial<ToggleButtonProps>, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * ToggleButtons allow users to toggle a selection on or off, for example\n * switching between two states or modes.\n */\nexport const ToggleButton = forwardRef(function ToggleButton(props: ToggleButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ToggleButtonContext);\n props = useFormProps(props as any);\n let domRef = useFocusableRef(ref);\n let ctx = useSlottedContext(ToggleButtonGroupContext);\n let isInGroup = !!ctx;\n let {\n density = 'regular',\n isJustified,\n orientation = 'horizontal',\n staticColor = props.staticColor,\n isQuiet = props.isQuiet,\n isEmphasized = props.isEmphasized,\n size = props.size || 'M',\n isDisabled = props.isDisabled\n } = ctx || {};\n\n return (\n <RACToggleButton\n {...props}\n isDisabled={isDisabled}\n ref={domRef}\n style={pressScale(domRef, props.UNSAFE_style)}\n className={renderProps => (props.UNSAFE_className || '') + btnStyles({\n ...renderProps,\n staticColor,\n isStaticColor: !!staticColor,\n size,\n isQuiet,\n isEmphasized,\n isPending: false,\n density,\n isJustified,\n orientation,\n isInGroup\n }, props.styles)}>\n <Provider\n values={[\n [SkeletonContext, null],\n [TextContext, {styles: style({paddingY: '--labelPadding', order: 1, truncate: true})}],\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 </RACToggleButton>\n );\n});\n"],"names":[],"version":3,"file":"ToggleButton.cjs.map"}
1
+ {"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;AAyBM,MAAM,0DAAsB,CAAA,GAAA,0BAAY,EAAkF;AAM1H,MAAM,0DAAe,CAAA,GAAA,uBAAS,EAAE,SAAS,aAAa,KAAwB,EAAE,GAAoC;IACzH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,QAAQ,CAAA,GAAA,sCAAW,EAAE;IACrB,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE;IAC7B,IAAI,MAAM,CAAA,GAAA,4CAAgB,EAAE,CAAA,GAAA,kDAAuB;IACnD,IAAI,YAAY,CAAC,CAAC;IAClB,IAAI,WACF,UAAU,wBACV,WAAW,eACX,cAAc,2BACd,cAAc,MAAM,WAAW,WAC/B,UAAU,MAAM,OAAO,gBACvB,eAAe,MAAM,YAAY,QACjC,OAAO,MAAM,IAAI,IAAI,iBACrB,aAAa,MAAM,UAAU,EAC9B,GAAG,OAAO,CAAC;IAEZ,qBACE,gCAAC,CAAA,GAAA,uCAAc;QACZ,GAAG,KAAK;QACT,YAAY;QACZ,KAAK;QACL,OAAO,CAAA,GAAA,oCAAS,EAAE,QAAQ,MAAM,YAAY;QAC5C,WAAW,CAAA,cAAe,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,CAAA,GAAA,mCAAQ,EAAE;gBACnE,GAAG,WAAW;6BACd;gBACA,eAAe,CAAC,CAAC;sBACjB;yBACA;8BACA;gBACA,WAAW;yBACX;6BACA;6BACA;2BACA;YACF,GAAG,MAAM,MAAM;kBACf,cAAA,gCAAC,CAAA,GAAA,mCAAO;YACN,QAAQ;gBACN;oBAAC,CAAA,GAAA,yCAAc;oBAAG;iBAAK;gBACvB;oBAAC,CAAA,GAAA,qCAAU;oBAAG;wBAAC,MAAM;oBAA+D;iBAAE;gBACtF;oBAAC,CAAA,GAAA,qCAAU;oBAAG;wBACZ,QAAQ,CAAA,GAAA,wCAAa,EAAE;4BAAC,MAAM;4BAAQ,MAAM;wBAAmB;wBAC/D,MAAM;oBACR;iBAAE;aACH;sBACA,OAAO,MAAM,QAAQ,KAAK,yBAAW,gCAAC,CAAA,GAAA,8BAAG;0BAAG,MAAM,QAAQ;iBAAW,MAAM,QAAQ;;;AAI5F","sources":["packages/@react-spectrum/s2/src/ToggleButton.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 {ActionButtonStyleProps, btnStyles} from './ActionButton';\nimport {centerBaseline} from './CenterBaseline';\nimport {ContextValue, Provider, ToggleButton as RACToggleButton, ToggleButtonProps as RACToggleButtonProps, useSlottedContext} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {FocusableRef, FocusableRefValue, GlobalDOMAttributes} from '@react-types/shared';\nimport {fontRelative, style} from '../style' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {pressScale} from './pressScale';\nimport {SkeletonContext} from './Skeleton';\nimport {StyleProps} from './style-utils';\nimport {Text, TextContext} from './Content';\nimport {ToggleButtonGroupContext} from './ToggleButtonGroup';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useFormProps} from './Form';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ToggleButtonProps extends Omit<RACToggleButtonProps, 'className' | 'style' | 'render' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange' | 'onClick' | keyof GlobalDOMAttributes>, StyleProps, ActionButtonStyleProps {\n /** The content to display in the button. */\n children: ReactNode,\n /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n isEmphasized?: boolean\n}\n\nexport const ToggleButtonContext = createContext<ContextValue<Partial<ToggleButtonProps>, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * ToggleButtons allow users to toggle a selection on or off, for example\n * switching between two states or modes.\n */\nexport const ToggleButton = forwardRef(function ToggleButton(props: ToggleButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ToggleButtonContext);\n props = useFormProps(props as any);\n let domRef = useFocusableRef(ref);\n let ctx = useSlottedContext(ToggleButtonGroupContext);\n let isInGroup = !!ctx;\n let {\n density = 'regular',\n isJustified,\n orientation = 'horizontal',\n staticColor = props.staticColor,\n isQuiet = props.isQuiet,\n isEmphasized = props.isEmphasized,\n size = props.size || 'M',\n isDisabled = props.isDisabled\n } = ctx || {};\n\n return (\n <RACToggleButton\n {...props}\n isDisabled={isDisabled}\n ref={domRef}\n style={pressScale(domRef, props.UNSAFE_style)}\n className={renderProps => (props.UNSAFE_className || '') + btnStyles({\n ...renderProps,\n staticColor,\n isStaticColor: !!staticColor,\n size,\n isQuiet,\n isEmphasized,\n isPending: false,\n density,\n isJustified,\n orientation,\n isInGroup\n }, props.styles)}>\n <Provider\n values={[\n [SkeletonContext, null],\n [TextContext, {styles: style({paddingY: '--labelPadding', order: 1, truncate: true})}],\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 </RACToggleButton>\n );\n});\n"],"names":[],"version":3,"file":"ToggleButton.cjs.map"}
@@ -1,49 +1,49 @@
1
1
  @layer _.a {
2
- .TAzEcG1 {
2
+ .TAzEcG11 {
3
3
  padding-top: var(--labelPadding);
4
4
  }
5
5
 
6
- .QAzEcG1 {
6
+ .QAzEcG11 {
7
7
  padding-bottom: var(--labelPadding);
8
8
  }
9
9
 
10
- ._Jb1 {
10
+ ._Jb11 {
11
11
  order: 1;
12
12
  }
13
13
 
14
- ._Nc1 {
14
+ ._Nc11 {
15
15
  overflow-x: hidden;
16
16
  }
17
17
 
18
- .Pc1 {
18
+ .Pc11 {
19
19
  overflow-y: hidden;
20
20
  }
21
21
 
22
- ._Yb1 {
22
+ ._Yb11 {
23
23
  text-overflow: ellipsis;
24
24
  }
25
25
 
26
- ._7c1 {
26
+ ._7c11 {
27
27
  white-space: nowrap;
28
28
  }
29
29
 
30
- ._Ja1 {
30
+ ._Ja11 {
31
31
  order: 0;
32
32
  }
33
33
 
34
- .ZuUmpre1 {
34
+ .ZuUmpre11 {
35
35
  width: 1.42857em;
36
36
  }
37
37
 
38
- .FuUmpre1 {
38
+ .FuUmpre11 {
39
39
  height: 1.42857em;
40
40
  }
41
41
 
42
- .I67logd1 {
42
+ .I67logd11 {
43
43
  margin-inline-start: var(--iconMargin);
44
44
  }
45
45
 
46
- ._va1 {
46
+ ._va11 {
47
47
  flex-shrink: 0;
48
48
  }
49
49
  }
@@ -1 +1 @@
1
- {"mappings":"ACgFiC;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAEyB;;;;EACtC;;;;EAAA;;;;EAAA;;;;EAAA","sources":["bc1013d4d937a6f8","packages/@react-spectrum/s2/src/ToggleButton.tsx"],"sourcesContent":["@import \"2356498b79989caa\";\n@import \"00644bdfe594b970\";\n@import \"2645bae9c4681078\";\n","/*\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 {ActionButtonStyleProps, btnStyles} from './ActionButton';\nimport {centerBaseline} from './CenterBaseline';\nimport {ContextValue, Provider, ToggleButton as RACToggleButton, ToggleButtonProps as RACToggleButtonProps, useSlottedContext} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {FocusableRef, FocusableRefValue, GlobalDOMAttributes} from '@react-types/shared';\nimport {fontRelative, style} from '../style' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {pressScale} from './pressScale';\nimport {SkeletonContext} from './Skeleton';\nimport {StyleProps} from './style-utils';\nimport {Text, TextContext} from './Content';\nimport {ToggleButtonGroupContext} from './ToggleButtonGroup';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useFormProps} from './Form';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ToggleButtonProps extends Omit<RACToggleButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange' | 'onClick' | keyof GlobalDOMAttributes>, StyleProps, ActionButtonStyleProps {\n /** The content to display in the button. */\n children: ReactNode,\n /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n isEmphasized?: boolean\n}\n\nexport const ToggleButtonContext = createContext<ContextValue<Partial<ToggleButtonProps>, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * ToggleButtons allow users to toggle a selection on or off, for example\n * switching between two states or modes.\n */\nexport const ToggleButton = forwardRef(function ToggleButton(props: ToggleButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ToggleButtonContext);\n props = useFormProps(props as any);\n let domRef = useFocusableRef(ref);\n let ctx = useSlottedContext(ToggleButtonGroupContext);\n let isInGroup = !!ctx;\n let {\n density = 'regular',\n isJustified,\n orientation = 'horizontal',\n staticColor = props.staticColor,\n isQuiet = props.isQuiet,\n isEmphasized = props.isEmphasized,\n size = props.size || 'M',\n isDisabled = props.isDisabled\n } = ctx || {};\n\n return (\n <RACToggleButton\n {...props}\n isDisabled={isDisabled}\n ref={domRef}\n style={pressScale(domRef, props.UNSAFE_style)}\n className={renderProps => (props.UNSAFE_className || '') + btnStyles({\n ...renderProps,\n staticColor,\n isStaticColor: !!staticColor,\n size,\n isQuiet,\n isEmphasized,\n isPending: false,\n density,\n isJustified,\n orientation,\n isInGroup\n }, props.styles)}>\n <Provider\n values={[\n [SkeletonContext, null],\n [TextContext, {styles: style({paddingY: '--labelPadding', order: 1, truncate: true})}],\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 </RACToggleButton>\n );\n});\n"],"names":[],"version":3,"file":"ToggleButton.css.map"}
1
+ {"mappings":"ACgFiC;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAEyB;;;;EACtC;;;;EAAA;;;;EAAA;;;;EAAA","sources":["bc1013d4d937a6f8","packages/@react-spectrum/s2/src/ToggleButton.tsx"],"sourcesContent":["@import \"2356498b79989caa\";\n@import \"00644bdfe594b970\";\n@import \"2645bae9c4681078\";\n","/*\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 {ActionButtonStyleProps, btnStyles} from './ActionButton';\nimport {centerBaseline} from './CenterBaseline';\nimport {ContextValue, Provider, ToggleButton as RACToggleButton, ToggleButtonProps as RACToggleButtonProps, useSlottedContext} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {FocusableRef, FocusableRefValue, GlobalDOMAttributes} from '@react-types/shared';\nimport {fontRelative, style} from '../style' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {pressScale} from './pressScale';\nimport {SkeletonContext} from './Skeleton';\nimport {StyleProps} from './style-utils';\nimport {Text, TextContext} from './Content';\nimport {ToggleButtonGroupContext} from './ToggleButtonGroup';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useFormProps} from './Form';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ToggleButtonProps extends Omit<RACToggleButtonProps, 'className' | 'style' | 'render' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange' | 'onClick' | keyof GlobalDOMAttributes>, StyleProps, ActionButtonStyleProps {\n /** The content to display in the button. */\n children: ReactNode,\n /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n isEmphasized?: boolean\n}\n\nexport const ToggleButtonContext = createContext<ContextValue<Partial<ToggleButtonProps>, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * ToggleButtons allow users to toggle a selection on or off, for example\n * switching between two states or modes.\n */\nexport const ToggleButton = forwardRef(function ToggleButton(props: ToggleButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ToggleButtonContext);\n props = useFormProps(props as any);\n let domRef = useFocusableRef(ref);\n let ctx = useSlottedContext(ToggleButtonGroupContext);\n let isInGroup = !!ctx;\n let {\n density = 'regular',\n isJustified,\n orientation = 'horizontal',\n staticColor = props.staticColor,\n isQuiet = props.isQuiet,\n isEmphasized = props.isEmphasized,\n size = props.size || 'M',\n isDisabled = props.isDisabled\n } = ctx || {};\n\n return (\n <RACToggleButton\n {...props}\n isDisabled={isDisabled}\n ref={domRef}\n style={pressScale(domRef, props.UNSAFE_style)}\n className={renderProps => (props.UNSAFE_className || '') + btnStyles({\n ...renderProps,\n staticColor,\n isStaticColor: !!staticColor,\n size,\n isQuiet,\n isEmphasized,\n isPending: false,\n density,\n isJustified,\n orientation,\n isInGroup\n }, props.styles)}>\n <Provider\n values={[\n [SkeletonContext, null],\n [TextContext, {styles: style({paddingY: '--labelPadding', order: 1, truncate: true})}],\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 </RACToggleButton>\n );\n});\n"],"names":[],"version":3,"file":"ToggleButton.css.map"}
@@ -71,7 +71,7 @@ const $fe4c9df7420c3c9f$export$d2b052e7b4be1756 = /*#__PURE__*/ (0, $fpet3$forwa
71
71
  [
72
72
  (0, $8e847109a6ab556d$export$9afb8bc826b033ea),
73
73
  {
74
- styles: " TAzEcG1 QAzEcG1 _Jb1 _Nc1 Pc1 _Yb1 _7c1"
74
+ styles: " TAzEcG11 QAzEcG11 _Jb11 _Nc11 Pc11 _Yb11 _7c11"
75
75
  }
76
76
  ],
77
77
  [
@@ -79,9 +79,9 @@ const $fe4c9df7420c3c9f$export$d2b052e7b4be1756 = /*#__PURE__*/ (0, $fpet3$forwa
79
79
  {
80
80
  render: (0, $1f4b04be3f24aae3$export$9d7e2342a7e53afa)({
81
81
  slot: 'icon',
82
- styles: " _Ja1"
82
+ styles: " _Ja11"
83
83
  }),
84
- styles: " ZuUmpre1 FuUmpre1 I67logd1 _va1"
84
+ styles: " ZuUmpre11 FuUmpre11 I67logd11 _va11"
85
85
  }
86
86
  ]
87
87
  ],
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;AAyBM,MAAM,0DAAsB,CAAA,GAAA,oBAAY,EAAkF;AAM1H,MAAM,0DAAe,CAAA,GAAA,iBAAS,EAAE,SAAS,aAAa,KAAwB,EAAE,GAAoC;IACzH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,QAAQ,CAAA,GAAA,yCAAW,EAAE;IACrB,IAAI,SAAS,CAAA,GAAA,sBAAc,EAAE;IAC7B,IAAI,MAAM,CAAA,GAAA,wBAAgB,EAAE,CAAA,GAAA,yCAAuB;IACnD,IAAI,YAAY,CAAC,CAAC;IAClB,IAAI,WACF,UAAU,wBACV,WAAW,eACX,cAAc,2BACd,cAAc,MAAM,WAAW,WAC/B,UAAU,MAAM,OAAO,gBACvB,eAAe,MAAM,YAAY,QACjC,OAAO,MAAM,IAAI,IAAI,iBACrB,aAAa,MAAM,UAAU,EAC9B,GAAG,OAAO,CAAC;IAEZ,qBACE,gBAAC,CAAA,GAAA,mBAAc;QACZ,GAAG,KAAK;QACT,YAAY;QACZ,KAAK;QACL,OAAO,CAAA,GAAA,yCAAS,EAAE,QAAQ,MAAM,YAAY;QAC5C,WAAW,CAAA,cAAe,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,CAAA,GAAA,yCAAQ,EAAE;gBACnE,GAAG,WAAW;6BACd;gBACA,eAAe,CAAC,CAAC;sBACjB;yBACA;8BACA;gBACA,WAAW;yBACX;6BACA;6BACA;2BACA;YACF,GAAG,MAAM,MAAM;kBACf,cAAA,gBAAC,CAAA,GAAA,eAAO;YACN,QAAQ;gBACN;oBAAC,CAAA,GAAA,yCAAc;oBAAG;iBAAK;gBACvB;oBAAC,CAAA,GAAA,yCAAU;oBAAG;wBAAC,MAAM;oBAA+D;iBAAE;gBACtF;oBAAC,CAAA,GAAA,yCAAU;oBAAG;wBACZ,QAAQ,CAAA,GAAA,yCAAa,EAAE;4BAAC,MAAM;4BAAQ,MAAM;wBAAmB;wBAC/D,MAAM;oBACR;iBAAE;aACH;sBACA,OAAO,MAAM,QAAQ,KAAK,yBAAW,gBAAC,CAAA,GAAA,yCAAG;0BAAG,MAAM,QAAQ;iBAAW,MAAM,QAAQ;;;AAI5F","sources":["packages/@react-spectrum/s2/src/ToggleButton.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 {ActionButtonStyleProps, btnStyles} from './ActionButton';\nimport {centerBaseline} from './CenterBaseline';\nimport {ContextValue, Provider, ToggleButton as RACToggleButton, ToggleButtonProps as RACToggleButtonProps, useSlottedContext} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {FocusableRef, FocusableRefValue, GlobalDOMAttributes} from '@react-types/shared';\nimport {fontRelative, style} from '../style' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {pressScale} from './pressScale';\nimport {SkeletonContext} from './Skeleton';\nimport {StyleProps} from './style-utils';\nimport {Text, TextContext} from './Content';\nimport {ToggleButtonGroupContext} from './ToggleButtonGroup';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useFormProps} from './Form';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ToggleButtonProps extends Omit<RACToggleButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange' | 'onClick' | keyof GlobalDOMAttributes>, StyleProps, ActionButtonStyleProps {\n /** The content to display in the button. */\n children: ReactNode,\n /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n isEmphasized?: boolean\n}\n\nexport const ToggleButtonContext = createContext<ContextValue<Partial<ToggleButtonProps>, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * ToggleButtons allow users to toggle a selection on or off, for example\n * switching between two states or modes.\n */\nexport const ToggleButton = forwardRef(function ToggleButton(props: ToggleButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ToggleButtonContext);\n props = useFormProps(props as any);\n let domRef = useFocusableRef(ref);\n let ctx = useSlottedContext(ToggleButtonGroupContext);\n let isInGroup = !!ctx;\n let {\n density = 'regular',\n isJustified,\n orientation = 'horizontal',\n staticColor = props.staticColor,\n isQuiet = props.isQuiet,\n isEmphasized = props.isEmphasized,\n size = props.size || 'M',\n isDisabled = props.isDisabled\n } = ctx || {};\n\n return (\n <RACToggleButton\n {...props}\n isDisabled={isDisabled}\n ref={domRef}\n style={pressScale(domRef, props.UNSAFE_style)}\n className={renderProps => (props.UNSAFE_className || '') + btnStyles({\n ...renderProps,\n staticColor,\n isStaticColor: !!staticColor,\n size,\n isQuiet,\n isEmphasized,\n isPending: false,\n density,\n isJustified,\n orientation,\n isInGroup\n }, props.styles)}>\n <Provider\n values={[\n [SkeletonContext, null],\n [TextContext, {styles: style({paddingY: '--labelPadding', order: 1, truncate: true})}],\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 </RACToggleButton>\n );\n});\n"],"names":[],"version":3,"file":"ToggleButton.mjs.map"}
1
+ {"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;AAyBM,MAAM,0DAAsB,CAAA,GAAA,oBAAY,EAAkF;AAM1H,MAAM,0DAAe,CAAA,GAAA,iBAAS,EAAE,SAAS,aAAa,KAAwB,EAAE,GAAoC;IACzH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,QAAQ,CAAA,GAAA,yCAAW,EAAE;IACrB,IAAI,SAAS,CAAA,GAAA,sBAAc,EAAE;IAC7B,IAAI,MAAM,CAAA,GAAA,wBAAgB,EAAE,CAAA,GAAA,yCAAuB;IACnD,IAAI,YAAY,CAAC,CAAC;IAClB,IAAI,WACF,UAAU,wBACV,WAAW,eACX,cAAc,2BACd,cAAc,MAAM,WAAW,WAC/B,UAAU,MAAM,OAAO,gBACvB,eAAe,MAAM,YAAY,QACjC,OAAO,MAAM,IAAI,IAAI,iBACrB,aAAa,MAAM,UAAU,EAC9B,GAAG,OAAO,CAAC;IAEZ,qBACE,gBAAC,CAAA,GAAA,mBAAc;QACZ,GAAG,KAAK;QACT,YAAY;QACZ,KAAK;QACL,OAAO,CAAA,GAAA,yCAAS,EAAE,QAAQ,MAAM,YAAY;QAC5C,WAAW,CAAA,cAAe,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,CAAA,GAAA,yCAAQ,EAAE;gBACnE,GAAG,WAAW;6BACd;gBACA,eAAe,CAAC,CAAC;sBACjB;yBACA;8BACA;gBACA,WAAW;yBACX;6BACA;6BACA;2BACA;YACF,GAAG,MAAM,MAAM;kBACf,cAAA,gBAAC,CAAA,GAAA,eAAO;YACN,QAAQ;gBACN;oBAAC,CAAA,GAAA,yCAAc;oBAAG;iBAAK;gBACvB;oBAAC,CAAA,GAAA,yCAAU;oBAAG;wBAAC,MAAM;oBAA+D;iBAAE;gBACtF;oBAAC,CAAA,GAAA,yCAAU;oBAAG;wBACZ,QAAQ,CAAA,GAAA,yCAAa,EAAE;4BAAC,MAAM;4BAAQ,MAAM;wBAAmB;wBAC/D,MAAM;oBACR;iBAAE;aACH;sBACA,OAAO,MAAM,QAAQ,KAAK,yBAAW,gBAAC,CAAA,GAAA,yCAAG;0BAAG,MAAM,QAAQ;iBAAW,MAAM,QAAQ;;;AAI5F","sources":["packages/@react-spectrum/s2/src/ToggleButton.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 {ActionButtonStyleProps, btnStyles} from './ActionButton';\nimport {centerBaseline} from './CenterBaseline';\nimport {ContextValue, Provider, ToggleButton as RACToggleButton, ToggleButtonProps as RACToggleButtonProps, useSlottedContext} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {FocusableRef, FocusableRefValue, GlobalDOMAttributes} from '@react-types/shared';\nimport {fontRelative, style} from '../style' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {pressScale} from './pressScale';\nimport {SkeletonContext} from './Skeleton';\nimport {StyleProps} from './style-utils';\nimport {Text, TextContext} from './Content';\nimport {ToggleButtonGroupContext} from './ToggleButtonGroup';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useFormProps} from './Form';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ToggleButtonProps extends Omit<RACToggleButtonProps, 'className' | 'style' | 'render' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange' | 'onClick' | keyof GlobalDOMAttributes>, StyleProps, ActionButtonStyleProps {\n /** The content to display in the button. */\n children: ReactNode,\n /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n isEmphasized?: boolean\n}\n\nexport const ToggleButtonContext = createContext<ContextValue<Partial<ToggleButtonProps>, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * ToggleButtons allow users to toggle a selection on or off, for example\n * switching between two states or modes.\n */\nexport const ToggleButton = forwardRef(function ToggleButton(props: ToggleButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ToggleButtonContext);\n props = useFormProps(props as any);\n let domRef = useFocusableRef(ref);\n let ctx = useSlottedContext(ToggleButtonGroupContext);\n let isInGroup = !!ctx;\n let {\n density = 'regular',\n isJustified,\n orientation = 'horizontal',\n staticColor = props.staticColor,\n isQuiet = props.isQuiet,\n isEmphasized = props.isEmphasized,\n size = props.size || 'M',\n isDisabled = props.isDisabled\n } = ctx || {};\n\n return (\n <RACToggleButton\n {...props}\n isDisabled={isDisabled}\n ref={domRef}\n style={pressScale(domRef, props.UNSAFE_style)}\n className={renderProps => (props.UNSAFE_className || '') + btnStyles({\n ...renderProps,\n staticColor,\n isStaticColor: !!staticColor,\n size,\n isQuiet,\n isEmphasized,\n isPending: false,\n density,\n isJustified,\n orientation,\n isInGroup\n }, props.styles)}>\n <Provider\n values={[\n [SkeletonContext, null],\n [TextContext, {styles: style({paddingY: '--labelPadding', order: 1, truncate: true})}],\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 </RACToggleButton>\n );\n});\n"],"names":[],"version":3,"file":"ToggleButton.mjs.map"}