@react-spectrum/s2 0.6.0 → 0.7.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 (767) hide show
  1. package/dist/Accordion.cjs.map +1 -1
  2. package/dist/Accordion.css +1 -5
  3. package/dist/Accordion.css.map +1 -1
  4. package/dist/Accordion.mjs.map +1 -1
  5. package/dist/ActionBar.cjs +2 -2
  6. package/dist/ActionBar.css +0 -6
  7. package/dist/ActionBar.css.map +1 -1
  8. package/dist/ActionBar.mjs +2 -2
  9. package/dist/ActionButton.cjs +4 -4
  10. package/dist/ActionButton.cjs.map +1 -1
  11. package/dist/ActionButton.css +0 -6
  12. package/dist/ActionButton.css.map +1 -1
  13. package/dist/ActionButton.mjs +4 -4
  14. package/dist/ActionButton.mjs.map +1 -1
  15. package/dist/ActionButtonGroup.css +1 -5
  16. package/dist/ActionButtonGroup.css.map +1 -1
  17. package/dist/ActionMenu.cjs.map +1 -1
  18. package/dist/ActionMenu.mjs.map +1 -1
  19. package/dist/AlertDialog.css +1 -5
  20. package/dist/AlertDialog.css.map +1 -1
  21. package/dist/Avatar.cjs.map +1 -1
  22. package/dist/Avatar.css +1 -5
  23. package/dist/Avatar.css.map +1 -1
  24. package/dist/Avatar.mjs.map +1 -1
  25. package/dist/AvatarGroup.cjs +1 -1
  26. package/dist/AvatarGroup.cjs.map +1 -1
  27. package/dist/AvatarGroup.css +0 -6
  28. package/dist/AvatarGroup.css.map +1 -1
  29. package/dist/AvatarGroup.mjs +1 -1
  30. package/dist/AvatarGroup.mjs.map +1 -1
  31. package/dist/Badge.cjs +32 -14
  32. package/dist/Badge.cjs.map +1 -1
  33. package/dist/Badge.css +26 -8
  34. package/dist/Badge.css.map +1 -1
  35. package/dist/Badge.mjs +33 -15
  36. package/dist/Badge.mjs.map +1 -1
  37. package/dist/Breadcrumbs.cjs +7 -7
  38. package/dist/Breadcrumbs.cjs.map +1 -1
  39. package/dist/Breadcrumbs.css +0 -6
  40. package/dist/Breadcrumbs.css.map +1 -1
  41. package/dist/Breadcrumbs.mjs +8 -8
  42. package/dist/Breadcrumbs.mjs.map +1 -1
  43. package/dist/Button.cjs +4 -4
  44. package/dist/Button.cjs.map +1 -1
  45. package/dist/Button.css +0 -6
  46. package/dist/Button.css.map +1 -1
  47. package/dist/Button.mjs +4 -4
  48. package/dist/Button.mjs.map +1 -1
  49. package/dist/ButtonGroup.cjs +1 -1
  50. package/dist/ButtonGroup.cjs.map +1 -1
  51. package/dist/ButtonGroup.css +1 -5
  52. package/dist/ButtonGroup.css.map +1 -1
  53. package/dist/ButtonGroup.mjs +1 -1
  54. package/dist/ButtonGroup.mjs.map +1 -1
  55. package/dist/Card.cjs +15 -15
  56. package/dist/Card.cjs.map +1 -1
  57. package/dist/Card.css +0 -6
  58. package/dist/Card.css.map +1 -1
  59. package/dist/Card.mjs +16 -16
  60. package/dist/Card.mjs.map +1 -1
  61. package/dist/CardView.cjs +71 -309
  62. package/dist/CardView.cjs.map +1 -1
  63. package/dist/CardView.css +1 -5
  64. package/dist/CardView.css.map +1 -1
  65. package/dist/CardView.mjs +28 -266
  66. package/dist/CardView.mjs.map +1 -1
  67. package/dist/CenterBaseline.cjs +1 -1
  68. package/dist/CenterBaseline.css +1 -5
  69. package/dist/CenterBaseline.css.map +1 -1
  70. package/dist/CenterBaseline.mjs +1 -1
  71. package/dist/Checkbox.cjs +1 -1
  72. package/dist/Checkbox.cjs.map +1 -1
  73. package/dist/Checkbox.css +0 -6
  74. package/dist/Checkbox.css.map +1 -1
  75. package/dist/Checkbox.mjs +1 -1
  76. package/dist/Checkbox.mjs.map +1 -1
  77. package/dist/CheckboxGroup.cjs.map +1 -1
  78. package/dist/CheckboxGroup.css +0 -6
  79. package/dist/CheckboxGroup.css.map +1 -1
  80. package/dist/CheckboxGroup.mjs.map +1 -1
  81. package/dist/ClearButton.css +1 -5
  82. package/dist/ClearButton.css.map +1 -1
  83. package/dist/CloseButton.cjs.map +1 -1
  84. package/dist/CloseButton.css +1 -5
  85. package/dist/CloseButton.css.map +1 -1
  86. package/dist/CloseButton.mjs.map +1 -1
  87. package/dist/ColorArea.cjs.map +1 -1
  88. package/dist/ColorArea.css +1 -5
  89. package/dist/ColorArea.css.map +1 -1
  90. package/dist/ColorArea.mjs.map +1 -1
  91. package/dist/ColorField.cjs.map +1 -1
  92. package/dist/ColorField.css +0 -6
  93. package/dist/ColorField.css.map +1 -1
  94. package/dist/ColorField.mjs.map +1 -1
  95. package/dist/ColorHandle.cjs +3 -3
  96. package/dist/ColorHandle.css +1 -5
  97. package/dist/ColorHandle.css.map +1 -1
  98. package/dist/ColorHandle.mjs +3 -3
  99. package/dist/ColorSlider.cjs.map +1 -1
  100. package/dist/ColorSlider.css +0 -6
  101. package/dist/ColorSlider.css.map +1 -1
  102. package/dist/ColorSlider.mjs.map +1 -1
  103. package/dist/ColorSwatch.cjs.map +1 -1
  104. package/dist/ColorSwatch.css +1 -5
  105. package/dist/ColorSwatch.css.map +1 -1
  106. package/dist/ColorSwatch.mjs.map +1 -1
  107. package/dist/ColorSwatchPicker.cjs +1 -1
  108. package/dist/ColorSwatchPicker.cjs.map +1 -1
  109. package/dist/ColorSwatchPicker.css +1 -5
  110. package/dist/ColorSwatchPicker.css.map +1 -1
  111. package/dist/ColorSwatchPicker.mjs +1 -1
  112. package/dist/ColorSwatchPicker.mjs.map +1 -1
  113. package/dist/ColorWheel.cjs.map +1 -1
  114. package/dist/ColorWheel.css +1 -5
  115. package/dist/ColorWheel.css.map +1 -1
  116. package/dist/ColorWheel.mjs.map +1 -1
  117. package/dist/ComboBox.cjs +2 -2
  118. package/dist/ComboBox.css +0 -6
  119. package/dist/ComboBox.css.map +1 -1
  120. package/dist/ComboBox.mjs +2 -2
  121. package/dist/Content.cjs +3 -1
  122. package/dist/Content.cjs.map +1 -1
  123. package/dist/Content.mjs +3 -1
  124. package/dist/Content.mjs.map +1 -1
  125. package/dist/ContextualHelp.cjs +5 -5
  126. package/dist/ContextualHelp.cjs.map +1 -1
  127. package/dist/ContextualHelp.css +0 -6
  128. package/dist/ContextualHelp.css.map +1 -1
  129. package/dist/ContextualHelp.mjs +5 -5
  130. package/dist/ContextualHelp.mjs.map +1 -1
  131. package/dist/CustomDialog.css +1 -5
  132. package/dist/CustomDialog.css.map +1 -1
  133. package/dist/Dialog.cjs +10 -10
  134. package/dist/Dialog.css +0 -6
  135. package/dist/Dialog.css.map +1 -1
  136. package/dist/Dialog.mjs +10 -10
  137. package/dist/Disclosure.cjs +2 -2
  138. package/dist/Disclosure.cjs.map +1 -1
  139. package/dist/Disclosure.css +0 -6
  140. package/dist/Disclosure.css.map +1 -1
  141. package/dist/Disclosure.mjs +2 -2
  142. package/dist/Disclosure.mjs.map +1 -1
  143. package/dist/Divider.cjs.map +1 -1
  144. package/dist/Divider.css +1 -5
  145. package/dist/Divider.css.map +1 -1
  146. package/dist/Divider.mjs.map +1 -1
  147. package/dist/DropZone.cjs.map +1 -1
  148. package/dist/DropZone.css +0 -6
  149. package/dist/DropZone.css.map +1 -1
  150. package/dist/DropZone.mjs.map +1 -1
  151. package/dist/Field.cjs +7 -7
  152. package/dist/Field.cjs.map +1 -1
  153. package/dist/Field.css +0 -6
  154. package/dist/Field.css.map +1 -1
  155. package/dist/Field.mjs +7 -7
  156. package/dist/Field.mjs.map +1 -1
  157. package/dist/Form.cjs.map +1 -1
  158. package/dist/Form.css +1 -5
  159. package/dist/Form.css.map +1 -1
  160. package/dist/Form.mjs.map +1 -1
  161. package/dist/FullscreenDialog.cjs +5 -5
  162. package/dist/FullscreenDialog.css +0 -6
  163. package/dist/FullscreenDialog.css.map +1 -1
  164. package/dist/FullscreenDialog.mjs +5 -5
  165. package/dist/IllustratedMessage.cjs +1 -1
  166. package/dist/IllustratedMessage.cjs.map +1 -1
  167. package/dist/IllustratedMessage.css +0 -6
  168. package/dist/IllustratedMessage.css.map +1 -1
  169. package/dist/IllustratedMessage.mjs +1 -1
  170. package/dist/IllustratedMessage.mjs.map +1 -1
  171. package/dist/Image.cjs +14 -2
  172. package/dist/Image.cjs.map +1 -1
  173. package/dist/Image.css +1 -5
  174. package/dist/Image.css.map +1 -1
  175. package/dist/Image.mjs +15 -3
  176. package/dist/Image.mjs.map +1 -1
  177. package/dist/InlineAlert.cjs +1 -1
  178. package/dist/InlineAlert.css +0 -6
  179. package/dist/InlineAlert.css.map +1 -1
  180. package/dist/InlineAlert.mjs +1 -1
  181. package/dist/Link.cjs.map +1 -1
  182. package/dist/Link.css +0 -6
  183. package/dist/Link.css.map +1 -1
  184. package/dist/Link.mjs.map +1 -1
  185. package/dist/Menu.cjs +20 -8
  186. package/dist/Menu.cjs.map +1 -1
  187. package/dist/Menu.css +12 -6
  188. package/dist/Menu.css.map +1 -1
  189. package/dist/Menu.mjs +21 -9
  190. package/dist/Menu.mjs.map +1 -1
  191. package/dist/Meter.cjs.map +1 -1
  192. package/dist/Meter.css +0 -6
  193. package/dist/Meter.css.map +1 -1
  194. package/dist/Meter.mjs.map +1 -1
  195. package/dist/Modal.css +1 -5
  196. package/dist/Modal.css.map +1 -1
  197. package/dist/NumberField.cjs.map +1 -1
  198. package/dist/NumberField.css +0 -6
  199. package/dist/NumberField.css.map +1 -1
  200. package/dist/NumberField.mjs.map +1 -1
  201. package/dist/Picker.cjs +95 -70
  202. package/dist/Picker.cjs.map +1 -1
  203. package/dist/Picker.css +8 -10
  204. package/dist/Picker.css.map +1 -1
  205. package/dist/Picker.mjs +96 -71
  206. package/dist/Picker.mjs.map +1 -1
  207. package/dist/Popover.cjs +1 -3
  208. package/dist/Popover.cjs.map +1 -1
  209. package/dist/Popover.css +5 -9
  210. package/dist/Popover.css.map +1 -1
  211. package/dist/Popover.mjs +1 -3
  212. package/dist/Popover.mjs.map +1 -1
  213. package/dist/ProgressBar.cjs.map +1 -1
  214. package/dist/ProgressBar.css +0 -6
  215. package/dist/ProgressBar.css.map +1 -1
  216. package/dist/ProgressBar.mjs.map +1 -1
  217. package/dist/ProgressCircle.cjs.map +1 -1
  218. package/dist/ProgressCircle.css +1 -5
  219. package/dist/ProgressCircle.css.map +1 -1
  220. package/dist/ProgressCircle.mjs.map +1 -1
  221. package/dist/Provider.css +1 -5
  222. package/dist/Provider.css.map +1 -1
  223. package/dist/Radio.css +0 -6
  224. package/dist/Radio.css.map +1 -1
  225. package/dist/RadioGroup.cjs.map +1 -1
  226. package/dist/RadioGroup.css +0 -6
  227. package/dist/RadioGroup.css.map +1 -1
  228. package/dist/RadioGroup.mjs.map +1 -1
  229. package/dist/RangeSlider.cjs.map +1 -1
  230. package/dist/RangeSlider.mjs.map +1 -1
  231. package/dist/SearchField.cjs +3 -3
  232. package/dist/SearchField.cjs.map +1 -1
  233. package/dist/SearchField.css +0 -6
  234. package/dist/SearchField.css.map +1 -1
  235. package/dist/SearchField.mjs +3 -3
  236. package/dist/SearchField.mjs.map +1 -1
  237. package/dist/SegmentedControl.cjs +7 -7
  238. package/dist/SegmentedControl.cjs.map +1 -1
  239. package/dist/SegmentedControl.css +0 -6
  240. package/dist/SegmentedControl.css.map +1 -1
  241. package/dist/SegmentedControl.mjs +8 -8
  242. package/dist/SegmentedControl.mjs.map +1 -1
  243. package/dist/Slider.cjs.map +1 -1
  244. package/dist/Slider.css +0 -6
  245. package/dist/Slider.css.map +1 -1
  246. package/dist/Slider.mjs.map +1 -1
  247. package/dist/StatusLight.cjs.map +1 -1
  248. package/dist/StatusLight.css +0 -6
  249. package/dist/StatusLight.css.map +1 -1
  250. package/dist/StatusLight.mjs.map +1 -1
  251. package/dist/Switch.cjs.map +1 -1
  252. package/dist/Switch.css +0 -6
  253. package/dist/Switch.css.map +1 -1
  254. package/dist/Switch.mjs.map +1 -1
  255. package/dist/TableView.cjs +75 -92
  256. package/dist/TableView.cjs.map +1 -1
  257. package/dist/TableView.css +10 -8
  258. package/dist/TableView.css.map +1 -1
  259. package/dist/TableView.mjs +76 -93
  260. package/dist/TableView.mjs.map +1 -1
  261. package/dist/Tabs.cjs +451 -167
  262. package/dist/Tabs.cjs.map +1 -1
  263. package/dist/Tabs.css +208 -122
  264. package/dist/Tabs.css.map +1 -1
  265. package/dist/Tabs.mjs +451 -167
  266. package/dist/Tabs.mjs.map +1 -1
  267. package/dist/TabsPicker.cjs +415 -0
  268. package/dist/TabsPicker.cjs.map +1 -0
  269. package/dist/TabsPicker.css +482 -0
  270. package/dist/TabsPicker.css.map +1 -0
  271. package/dist/TabsPicker.mjs +409 -0
  272. package/dist/TabsPicker.mjs.map +1 -0
  273. package/dist/TagGroup.cjs +13 -13
  274. package/dist/TagGroup.cjs.map +1 -1
  275. package/dist/TagGroup.css +0 -6
  276. package/dist/TagGroup.css.map +1 -1
  277. package/dist/TagGroup.mjs +13 -13
  278. package/dist/TagGroup.mjs.map +1 -1
  279. package/dist/TextField.cjs +1 -1
  280. package/dist/TextField.cjs.map +1 -1
  281. package/dist/TextField.css +0 -6
  282. package/dist/TextField.css.map +1 -1
  283. package/dist/TextField.mjs +1 -1
  284. package/dist/TextField.mjs.map +1 -1
  285. package/dist/ToggleButton.cjs +3 -3
  286. package/dist/ToggleButton.cjs.map +1 -1
  287. package/dist/ToggleButton.css +1 -5
  288. package/dist/ToggleButton.css.map +1 -1
  289. package/dist/ToggleButton.mjs +3 -3
  290. package/dist/ToggleButton.mjs.map +1 -1
  291. package/dist/ToggleButtonGroup.cjs.map +1 -1
  292. package/dist/ToggleButtonGroup.mjs.map +1 -1
  293. package/dist/Tooltip.cjs +1 -1
  294. package/dist/Tooltip.cjs.map +1 -1
  295. package/dist/Tooltip.css +0 -6
  296. package/dist/Tooltip.css.map +1 -1
  297. package/dist/Tooltip.mjs +1 -1
  298. package/dist/Tooltip.mjs.map +1 -1
  299. package/dist/TreeView.cjs +439 -0
  300. package/dist/TreeView.cjs.map +1 -0
  301. package/dist/TreeView.css +608 -0
  302. package/dist/TreeView.css.map +1 -0
  303. package/dist/TreeView.mjs +432 -0
  304. package/dist/TreeView.mjs.map +1 -0
  305. package/dist/main.cjs +5 -0
  306. package/dist/main.cjs.map +1 -1
  307. package/dist/module.mjs +3 -1
  308. package/dist/module.mjs.map +1 -1
  309. package/dist/types.d.ts +120 -81
  310. package/dist/types.d.ts.map +1 -1
  311. package/icons/3DMaterial.cjs.map +1 -1
  312. package/icons/3DMaterial.mjs.map +1 -1
  313. package/icons/ABC.cjs +36 -0
  314. package/icons/ABC.cjs.map +1 -0
  315. package/icons/ABC.mjs +25 -0
  316. package/icons/ABC.mjs.map +1 -0
  317. package/icons/AlertDiamond.cjs.map +1 -1
  318. package/icons/AlertDiamond.mjs.map +1 -1
  319. package/icons/Animation.cjs.map +1 -1
  320. package/icons/Animation.mjs.map +1 -1
  321. package/icons/AnimationNo.cjs.map +1 -1
  322. package/icons/AnimationNo.mjs.map +1 -1
  323. package/icons/App.cjs +42 -0
  324. package/icons/App.cjs.map +1 -0
  325. package/icons/App.mjs +31 -0
  326. package/icons/App.mjs.map +1 -0
  327. package/icons/AspectRatio.cjs.map +1 -1
  328. package/icons/AspectRatio.mjs.map +1 -1
  329. package/icons/Asset.cjs +1 -5
  330. package/icons/Asset.cjs.map +1 -1
  331. package/icons/Asset.mjs +1 -5
  332. package/icons/Asset.mjs.map +1 -1
  333. package/icons/AudioWave.cjs.map +1 -1
  334. package/icons/AudioWave.mjs.map +1 -1
  335. package/icons/BadgeVerified.cjs.map +1 -1
  336. package/icons/BadgeVerified.mjs.map +1 -1
  337. package/icons/Bell.cjs.map +1 -1
  338. package/icons/Bell.mjs.map +1 -1
  339. package/icons/Bookmark.cjs +36 -0
  340. package/icons/Bookmark.cjs.map +1 -0
  341. package/icons/Bookmark.mjs +25 -0
  342. package/icons/Bookmark.mjs.map +1 -0
  343. package/icons/Brand.cjs.map +1 -1
  344. package/icons/Brand.mjs.map +1 -1
  345. package/icons/Building.cjs +62 -0
  346. package/icons/Building.cjs.map +1 -0
  347. package/icons/Building.mjs +51 -0
  348. package/icons/Building.mjs.map +1 -0
  349. package/icons/CalendarEdit.cjs.map +1 -1
  350. package/icons/CalendarEdit.mjs.map +1 -1
  351. package/icons/CallCenter.cjs +36 -0
  352. package/icons/CallCenter.cjs.map +1 -0
  353. package/icons/CallCenter.mjs +25 -0
  354. package/icons/CallCenter.mjs.map +1 -0
  355. package/icons/CameraProperties.cjs.map +1 -1
  356. package/icons/CameraProperties.mjs.map +1 -1
  357. package/icons/Channel.cjs.map +1 -1
  358. package/icons/Channel.mjs.map +1 -1
  359. package/icons/ChartBarVert.cjs +36 -0
  360. package/icons/ChartBarVert.cjs.map +1 -0
  361. package/icons/ChartBarVert.mjs +25 -0
  362. package/icons/ChartBarVert.mjs.map +1 -0
  363. package/icons/ChartPie.cjs +36 -0
  364. package/icons/ChartPie.cjs.map +1 -0
  365. package/icons/ChartPie.mjs +25 -0
  366. package/icons/ChartPie.mjs.map +1 -0
  367. package/icons/ChartTrend.cjs +36 -0
  368. package/icons/ChartTrend.cjs.map +1 -0
  369. package/icons/ChartTrend.mjs +25 -0
  370. package/icons/ChartTrend.mjs.map +1 -0
  371. package/icons/Chat.cjs +36 -0
  372. package/icons/Chat.cjs.map +1 -0
  373. package/icons/Chat.mjs +25 -0
  374. package/icons/Chat.mjs.map +1 -0
  375. package/icons/CheckBox.cjs.map +1 -1
  376. package/icons/CheckBox.mjs.map +1 -1
  377. package/icons/Checkmark.cjs +8 -8
  378. package/icons/Checkmark.cjs.map +1 -1
  379. package/icons/Checkmark.mjs +8 -8
  380. package/icons/Checkmark.mjs.map +1 -1
  381. package/icons/ChevronDoubleLeft.cjs +42 -0
  382. package/icons/ChevronDoubleLeft.cjs.map +1 -0
  383. package/icons/ChevronDoubleLeft.d.ts +5 -0
  384. package/icons/ChevronDoubleLeft.mjs +31 -0
  385. package/icons/ChevronDoubleLeft.mjs.map +1 -0
  386. package/icons/ChevronDoubleRight.cjs +42 -0
  387. package/icons/ChevronDoubleRight.cjs.map +1 -0
  388. package/icons/ChevronDoubleRight.d.ts +5 -0
  389. package/icons/ChevronDoubleRight.mjs +31 -0
  390. package/icons/ChevronDoubleRight.mjs.map +1 -0
  391. package/icons/ChevronDown.cjs +8 -8
  392. package/icons/ChevronDown.cjs.map +1 -1
  393. package/icons/ChevronDown.mjs +8 -8
  394. package/icons/ChevronDown.mjs.map +1 -1
  395. package/icons/ChevronLeft.cjs.map +1 -1
  396. package/icons/ChevronLeft.mjs.map +1 -1
  397. package/icons/ChevronRight.cjs.map +1 -1
  398. package/icons/ChevronRight.mjs.map +1 -1
  399. package/icons/ChevronUp.cjs +36 -0
  400. package/icons/ChevronUp.cjs.map +1 -0
  401. package/icons/ChevronUp.d.ts +5 -0
  402. package/icons/ChevronUp.mjs +25 -0
  403. package/icons/ChevronUp.mjs.map +1 -0
  404. package/icons/Circle.cjs.map +1 -1
  405. package/icons/Circle.mjs.map +1 -1
  406. package/icons/Close.cjs.map +1 -1
  407. package/icons/Close.mjs.map +1 -1
  408. package/icons/CloseCaptions.cjs.map +1 -1
  409. package/icons/CloseCaptions.mjs.map +1 -1
  410. package/icons/Code.cjs +36 -0
  411. package/icons/Code.cjs.map +1 -0
  412. package/icons/Code.d.ts +5 -0
  413. package/icons/Code.mjs +25 -0
  414. package/icons/Code.mjs.map +1 -0
  415. package/icons/Collection.cjs.map +1 -1
  416. package/icons/Collection.mjs.map +1 -1
  417. package/icons/ColorHarmony.cjs.map +1 -1
  418. package/icons/ColorHarmony.mjs.map +1 -1
  419. package/icons/CommentCheckmark.cjs.map +1 -1
  420. package/icons/CommentCheckmark.mjs.map +1 -1
  421. package/icons/CommentHide.cjs.map +1 -1
  422. package/icons/CommentHide.mjs.map +1 -1
  423. package/icons/CommentRemove.cjs.map +1 -1
  424. package/icons/CommentRemove.mjs.map +1 -1
  425. package/icons/Compare.cjs +42 -0
  426. package/icons/Compare.cjs.map +1 -0
  427. package/icons/Compare.d.ts +5 -0
  428. package/icons/Compare.mjs +31 -0
  429. package/icons/Compare.mjs.map +1 -0
  430. package/icons/ContextualTaskBar.cjs.map +1 -1
  431. package/icons/ContextualTaskBar.mjs.map +1 -1
  432. package/icons/CornerRadiusBottomLeft.cjs.map +1 -1
  433. package/icons/CornerRadiusBottomLeft.mjs.map +1 -1
  434. package/icons/CornerRadiusBottomRight.cjs.map +1 -1
  435. package/icons/CornerRadiusBottomRight.mjs.map +1 -1
  436. package/icons/CornerRadiusTopLeft.cjs.map +1 -1
  437. package/icons/CornerRadiusTopLeft.mjs.map +1 -1
  438. package/icons/CornerRadiusTopRight.cjs.map +1 -1
  439. package/icons/CornerRadiusTopRight.mjs.map +1 -1
  440. package/icons/CursorClick.cjs.map +1 -1
  441. package/icons/CursorClick.mjs.map +1 -1
  442. package/icons/Data.cjs +1 -1
  443. package/icons/Data.cjs.map +1 -1
  444. package/icons/Data.mjs +1 -1
  445. package/icons/Data.mjs.map +1 -1
  446. package/icons/DataAdd.cjs.map +1 -1
  447. package/icons/DataAdd.mjs.map +1 -1
  448. package/icons/DataRefresh.cjs +42 -0
  449. package/icons/DataRefresh.cjs.map +1 -0
  450. package/icons/DataRefresh.d.ts +5 -0
  451. package/icons/DataRefresh.mjs +31 -0
  452. package/icons/DataRefresh.mjs.map +1 -0
  453. package/icons/DataSettings.cjs +2 -2
  454. package/icons/DataSettings.cjs.map +1 -1
  455. package/icons/DataSettings.mjs +2 -2
  456. package/icons/DataSettings.mjs.map +1 -1
  457. package/icons/DataUpload.cjs +2 -2
  458. package/icons/DataUpload.cjs.map +1 -1
  459. package/icons/DataUpload.mjs +2 -2
  460. package/icons/DataUpload.mjs.map +1 -1
  461. package/icons/DeviceTablet.cjs.map +1 -1
  462. package/icons/DeviceTablet.mjs.map +1 -1
  463. package/icons/Draw.cjs.map +1 -1
  464. package/icons/Draw.mjs.map +1 -1
  465. package/icons/Edit.cjs.map +1 -1
  466. package/icons/Edit.mjs.map +1 -1
  467. package/icons/EditNo.cjs.map +1 -1
  468. package/icons/EditNo.mjs.map +1 -1
  469. package/icons/Email.cjs.map +1 -1
  470. package/icons/Email.mjs.map +1 -1
  471. package/icons/Enterprise.cjs +46 -0
  472. package/icons/Enterprise.cjs.map +1 -0
  473. package/icons/Enterprise.d.ts +5 -0
  474. package/icons/Enterprise.mjs +35 -0
  475. package/icons/Enterprise.mjs.map +1 -0
  476. package/icons/Export.cjs +42 -0
  477. package/icons/Export.cjs.map +1 -0
  478. package/icons/Export.d.ts +5 -0
  479. package/icons/Export.mjs +31 -0
  480. package/icons/Export.mjs.map +1 -0
  481. package/icons/Filter.cjs.map +1 -1
  482. package/icons/Filter.mjs.map +1 -1
  483. package/icons/FlipHorizontal.cjs +1 -21
  484. package/icons/FlipHorizontal.cjs.map +1 -1
  485. package/icons/FlipHorizontal.mjs +1 -21
  486. package/icons/FlipHorizontal.mjs.map +1 -1
  487. package/icons/FlipVertical.cjs +1 -21
  488. package/icons/FlipVertical.cjs.map +1 -1
  489. package/icons/FlipVertical.mjs +1 -21
  490. package/icons/FlipVertical.mjs.map +1 -1
  491. package/icons/FolderMoveTo.cjs.map +1 -1
  492. package/icons/FolderMoveTo.mjs.map +1 -1
  493. package/icons/FolderSearch.cjs +42 -0
  494. package/icons/FolderSearch.cjs.map +1 -0
  495. package/icons/FolderSearch.d.ts +5 -0
  496. package/icons/FolderSearch.mjs +31 -0
  497. package/icons/FolderSearch.mjs.map +1 -0
  498. package/icons/FontPicker.cjs.map +1 -1
  499. package/icons/FontPicker.mjs.map +1 -1
  500. package/icons/GlobeGrid.cjs.map +1 -1
  501. package/icons/GlobeGrid.mjs.map +1 -1
  502. package/icons/GradientHorizontal.cjs.map +1 -1
  503. package/icons/GradientHorizontal.mjs.map +1 -1
  504. package/icons/GridsAndRulers.cjs.map +1 -1
  505. package/icons/GridsAndRulers.mjs.map +1 -1
  506. package/icons/Icon.cjs.map +1 -1
  507. package/icons/Icon.mjs.map +1 -1
  508. package/icons/Image.cjs.map +1 -1
  509. package/icons/Image.mjs.map +1 -1
  510. package/icons/ImageAdd.cjs +1 -5
  511. package/icons/ImageAdd.cjs.map +1 -1
  512. package/icons/ImageAdd.mjs +1 -5
  513. package/icons/ImageAdd.mjs.map +1 -1
  514. package/icons/ImageBackgroundRemove.cjs.map +1 -1
  515. package/icons/ImageBackgroundRemove.mjs.map +1 -1
  516. package/icons/Images.cjs.map +1 -1
  517. package/icons/Images.mjs.map +1 -1
  518. package/icons/Import.cjs +42 -0
  519. package/icons/Import.cjs.map +1 -0
  520. package/icons/Import.d.ts +5 -0
  521. package/icons/Import.mjs +31 -0
  522. package/icons/Import.mjs.map +1 -0
  523. package/icons/Key.cjs +36 -0
  524. package/icons/Key.cjs.map +1 -0
  525. package/icons/Key.d.ts +5 -0
  526. package/icons/Key.mjs +25 -0
  527. package/icons/Key.mjs.map +1 -0
  528. package/icons/ListMultiSelect.cjs.map +1 -1
  529. package/icons/ListMultiSelect.mjs.map +1 -1
  530. package/icons/ListNumbered.cjs.map +1 -1
  531. package/icons/ListNumbered.mjs.map +1 -1
  532. package/icons/Logo.cjs.map +1 -1
  533. package/icons/Logo.mjs.map +1 -1
  534. package/icons/Market.cjs.map +1 -1
  535. package/icons/Market.mjs.map +1 -1
  536. package/icons/Microphone.cjs.map +1 -1
  537. package/icons/Microphone.mjs.map +1 -1
  538. package/icons/MicrophoneOff.cjs.map +1 -1
  539. package/icons/MicrophoneOff.mjs.map +1 -1
  540. package/icons/MusicNote.cjs.map +1 -1
  541. package/icons/MusicNote.mjs.map +1 -1
  542. package/icons/OrientationPortrait.cjs.map +1 -1
  543. package/icons/OrientationPortrait.mjs.map +1 -1
  544. package/icons/Pause.cjs.map +1 -1
  545. package/icons/Pause.mjs.map +1 -1
  546. package/icons/PauseCircle.cjs.map +1 -1
  547. package/icons/PauseCircle.mjs.map +1 -1
  548. package/icons/PeopleGroup.cjs +36 -0
  549. package/icons/PeopleGroup.cjs.map +1 -0
  550. package/icons/PeopleGroup.d.ts +5 -0
  551. package/icons/PeopleGroup.mjs +25 -0
  552. package/icons/PeopleGroup.mjs.map +1 -0
  553. package/icons/Percentage.cjs.map +1 -1
  554. package/icons/Percentage.mjs.map +1 -1
  555. package/icons/PinOff.cjs.map +1 -1
  556. package/icons/PinOff.mjs.map +1 -1
  557. package/icons/PinOn.cjs.map +1 -1
  558. package/icons/PinOn.mjs.map +1 -1
  559. package/icons/Play.cjs.map +1 -1
  560. package/icons/Play.mjs.map +1 -1
  561. package/icons/PluginGear.cjs.map +1 -1
  562. package/icons/PluginGear.mjs.map +1 -1
  563. package/icons/Polygon6.cjs.map +1 -1
  564. package/icons/Polygon6.mjs.map +1 -1
  565. package/icons/Publish.cjs.map +1 -1
  566. package/icons/Publish.mjs.map +1 -1
  567. package/icons/PublishNo.cjs.map +1 -1
  568. package/icons/PublishNo.mjs.map +1 -1
  569. package/icons/RadioButton.cjs.map +1 -1
  570. package/icons/RadioButton.mjs.map +1 -1
  571. package/icons/RectangleHoriz.cjs.map +1 -1
  572. package/icons/RectangleHoriz.mjs.map +1 -1
  573. package/icons/RocketQuickActions.cjs.map +1 -1
  574. package/icons/RocketQuickActions.mjs.map +1 -1
  575. package/icons/RotateCW.cjs.map +1 -1
  576. package/icons/RotateCW.mjs.map +1 -1
  577. package/icons/Ruler.cjs.map +1 -1
  578. package/icons/Ruler.mjs.map +1 -1
  579. package/icons/SaveFloppy.cjs +36 -0
  580. package/icons/SaveFloppy.cjs.map +1 -0
  581. package/icons/SaveFloppy.d.ts +5 -0
  582. package/icons/SaveFloppy.mjs +25 -0
  583. package/icons/SaveFloppy.mjs.map +1 -0
  584. package/icons/Select.cjs.map +1 -1
  585. package/icons/Select.mjs.map +1 -1
  586. package/icons/Send.cjs.map +1 -1
  587. package/icons/Send.mjs.map +1 -1
  588. package/icons/Shuffle.cjs.map +1 -1
  589. package/icons/Shuffle.mjs.map +1 -1
  590. package/icons/Skeleton.cjs +8 -6
  591. package/icons/Skeleton.cjs.map +1 -1
  592. package/icons/Skeleton.css +3 -5
  593. package/icons/Skeleton.css.map +1 -1
  594. package/icons/Skeleton.mjs +9 -7
  595. package/icons/Skeleton.mjs.map +1 -1
  596. package/icons/SlowConnectionCircle.cjs.map +1 -1
  597. package/icons/SlowConnectionCircle.mjs.map +1 -1
  598. package/icons/SpeedFast.cjs +36 -0
  599. package/icons/SpeedFast.cjs.map +1 -0
  600. package/icons/SpeedFast.d.ts +5 -0
  601. package/icons/SpeedFast.mjs +25 -0
  602. package/icons/SpeedFast.mjs.map +1 -0
  603. package/icons/StepBackward.cjs.map +1 -1
  604. package/icons/StepBackward.mjs.map +1 -1
  605. package/icons/StepForward.cjs.map +1 -1
  606. package/icons/StepForward.mjs.map +1 -1
  607. package/icons/Table.cjs.map +1 -1
  608. package/icons/Table.mjs.map +1 -1
  609. package/icons/Tag.cjs.map +1 -1
  610. package/icons/Tag.mjs.map +1 -1
  611. package/icons/Target.cjs.map +1 -1
  612. package/icons/Target.mjs.map +1 -1
  613. package/icons/TextBold.cjs.map +1 -1
  614. package/icons/TextBold.mjs.map +1 -1
  615. package/icons/TextHighlight.cjs.map +1 -1
  616. package/icons/TextHighlight.mjs.map +1 -1
  617. package/icons/TextIncrease.cjs.map +1 -1
  618. package/icons/TextIncrease.mjs.map +1 -1
  619. package/icons/TextNumbers.cjs.map +1 -1
  620. package/icons/TextNumbers.mjs.map +1 -1
  621. package/icons/TextParagraph.cjs.map +1 -1
  622. package/icons/TextParagraph.mjs.map +1 -1
  623. package/icons/TextReplaceComment.cjs.map +1 -1
  624. package/icons/TextReplaceComment.mjs.map +1 -1
  625. package/icons/Tools.cjs.map +1 -1
  626. package/icons/Tools.mjs.map +1 -1
  627. package/icons/TouchOneFingerSwipeLeftRight.cjs.map +1 -1
  628. package/icons/TouchOneFingerSwipeLeftRight.mjs.map +1 -1
  629. package/icons/Transcript.cjs.map +1 -1
  630. package/icons/Transcript.mjs.map +1 -1
  631. package/icons/Translate.cjs.map +1 -1
  632. package/icons/Translate.mjs.map +1 -1
  633. package/icons/UserAvatarCursor.cjs.map +1 -1
  634. package/icons/UserAvatarCursor.mjs.map +1 -1
  635. package/icons/UserEdit.cjs.map +1 -1
  636. package/icons/UserEdit.mjs.map +1 -1
  637. package/icons/UserGroup.cjs.map +1 -1
  638. package/icons/UserGroup.mjs.map +1 -1
  639. package/icons/UserSettings.cjs +44 -0
  640. package/icons/UserSettings.cjs.map +1 -0
  641. package/icons/UserSettings.d.ts +5 -0
  642. package/icons/UserSettings.mjs +33 -0
  643. package/icons/UserSettings.mjs.map +1 -0
  644. package/icons/VectorDraw.cjs.map +1 -1
  645. package/icons/VectorDraw.mjs.map +1 -1
  646. package/icons/ViewGridFluid.cjs +36 -0
  647. package/icons/ViewGridFluid.cjs.map +1 -0
  648. package/icons/ViewGridFluid.d.ts +5 -0
  649. package/icons/ViewGridFluid.mjs +25 -0
  650. package/icons/ViewGridFluid.mjs.map +1 -0
  651. package/icons/ZoomIn.cjs.map +1 -1
  652. package/icons/ZoomIn.mjs.map +1 -1
  653. package/icons/ZoomOut.cjs.map +1 -1
  654. package/icons/ZoomOut.mjs.map +1 -1
  655. package/package.json +17 -18
  656. package/src/Accordion.tsx +1 -1
  657. package/src/ActionButton.tsx +2 -2
  658. package/src/ActionMenu.tsx +1 -1
  659. package/src/Avatar.tsx +1 -1
  660. package/src/AvatarGroup.tsx +1 -1
  661. package/src/Badge.tsx +27 -8
  662. package/src/Breadcrumbs.tsx +13 -13
  663. package/src/Button.tsx +4 -4
  664. package/src/ButtonGroup.tsx +1 -1
  665. package/src/Card.tsx +2 -2
  666. package/src/CardView.tsx +18 -366
  667. package/src/Checkbox.tsx +1 -1
  668. package/src/CheckboxGroup.tsx +2 -2
  669. package/src/CloseButton.tsx +1 -1
  670. package/src/ColorArea.tsx +1 -1
  671. package/src/ColorField.tsx +1 -1
  672. package/src/ColorSlider.tsx +1 -1
  673. package/src/ColorSwatch.tsx +2 -2
  674. package/src/ColorSwatchPicker.tsx +1 -2
  675. package/src/ColorWheel.tsx +1 -1
  676. package/src/Content.tsx +11 -9
  677. package/src/ContextualHelp.tsx +2 -2
  678. package/src/Disclosure.tsx +1 -1
  679. package/src/Divider.tsx +1 -1
  680. package/src/DropZone.tsx +2 -2
  681. package/src/Field.tsx +1 -1
  682. package/src/Form.tsx +2 -2
  683. package/src/Icon.tsx +2 -2
  684. package/src/IllustratedMessage.tsx +1 -1
  685. package/src/Image.tsx +19 -5
  686. package/src/Link.tsx +2 -2
  687. package/src/Menu.tsx +9 -4
  688. package/src/Meter.tsx +1 -1
  689. package/src/NumberField.tsx +1 -1
  690. package/src/Picker.tsx +81 -60
  691. package/src/Popover.tsx +2 -1
  692. package/src/ProgressBar.tsx +1 -1
  693. package/src/ProgressCircle.tsx +1 -1
  694. package/src/RadioGroup.tsx +2 -2
  695. package/src/RangeSlider.tsx +1 -1
  696. package/src/SearchField.tsx +1 -1
  697. package/src/SegmentedControl.tsx +6 -9
  698. package/src/Skeleton.tsx +6 -8
  699. package/src/Slider.tsx +1 -1
  700. package/src/StatusLight.tsx +1 -1
  701. package/src/Switch.tsx +1 -1
  702. package/src/TableView.tsx +67 -71
  703. package/src/Tabs.tsx +451 -145
  704. package/src/TabsPicker.tsx +350 -0
  705. package/src/TagGroup.tsx +4 -4
  706. package/src/TextField.tsx +2 -2
  707. package/src/ToggleButton.tsx +2 -2
  708. package/src/ToggleButtonGroup.tsx +1 -1
  709. package/src/Tooltip.tsx +4 -4
  710. package/src/TreeView.tsx +450 -0
  711. package/src/index.ts +2 -0
  712. package/src/style-utils.ts +0 -1
  713. package/style/__tests__/style-macro.test.js +3 -7
  714. package/style/dist/spectrum-theme.cjs.map +1 -1
  715. package/style/dist/spectrum-theme.mjs.map +1 -1
  716. package/style/dist/style-macro.cjs +5 -3
  717. package/style/dist/style-macro.cjs.map +1 -1
  718. package/style/dist/style-macro.mjs +5 -3
  719. package/style/dist/style-macro.mjs.map +1 -1
  720. package/style/dist/types.d.ts.map +1 -1
  721. package/style/spectrum-theme.ts +0 -1
  722. package/style/style-macro.ts +9 -3
  723. package/icons/CloudStateDefault.cjs +0 -36
  724. package/icons/CloudStateDefault.cjs.map +0 -1
  725. package/icons/CloudStateDefault.mjs +0 -25
  726. package/icons/CloudStateDefault.mjs.map +0 -1
  727. package/icons/CloudStateDisconnected.cjs +0 -36
  728. package/icons/CloudStateDisconnected.cjs.map +0 -1
  729. package/icons/CloudStateDisconnected.mjs +0 -25
  730. package/icons/CloudStateDisconnected.mjs.map +0 -1
  731. package/icons/CloudStateError.cjs +0 -36
  732. package/icons/CloudStateError.cjs.map +0 -1
  733. package/icons/CloudStateError.mjs +0 -25
  734. package/icons/CloudStateError.mjs.map +0 -1
  735. package/icons/CloudStateErrorRed.cjs +0 -46
  736. package/icons/CloudStateErrorRed.cjs.map +0 -1
  737. package/icons/CloudStateErrorRed.mjs +0 -35
  738. package/icons/CloudStateErrorRed.mjs.map +0 -1
  739. package/icons/CloudStateInProgress.cjs +0 -36
  740. package/icons/CloudStateInProgress.cjs.map +0 -1
  741. package/icons/CloudStateInProgress.mjs +0 -25
  742. package/icons/CloudStateInProgress.mjs.map +0 -1
  743. package/icons/CloudStateOnline.cjs +0 -50
  744. package/icons/CloudStateOnline.cjs.map +0 -1
  745. package/icons/CloudStateOnline.mjs +0 -39
  746. package/icons/CloudStateOnline.mjs.map +0 -1
  747. package/icons/CloudStatePaused.cjs +0 -36
  748. package/icons/CloudStatePaused.cjs.map +0 -1
  749. package/icons/CloudStatePaused.mjs +0 -25
  750. package/icons/CloudStatePaused.mjs.map +0 -1
  751. package/icons/CloudStatePending.cjs +0 -42
  752. package/icons/CloudStatePending.cjs.map +0 -1
  753. package/icons/CloudStatePending.mjs +0 -31
  754. package/icons/CloudStatePending.mjs.map +0 -1
  755. package/icons/CloudStateSlowConnection.cjs +0 -36
  756. package/icons/CloudStateSlowConnection.cjs.map +0 -1
  757. package/icons/CloudStateSlowConnection.mjs +0 -25
  758. package/icons/CloudStateSlowConnection.mjs.map +0 -1
  759. /package/icons/{CloudStateDefault.d.ts → ABC.d.ts} +0 -0
  760. /package/icons/{CloudStateDisconnected.d.ts → App.d.ts} +0 -0
  761. /package/icons/{CloudStateError.d.ts → Bookmark.d.ts} +0 -0
  762. /package/icons/{CloudStateErrorRed.d.ts → Building.d.ts} +0 -0
  763. /package/icons/{CloudStateInProgress.d.ts → CallCenter.d.ts} +0 -0
  764. /package/icons/{CloudStateOnline.d.ts → ChartBarVert.d.ts} +0 -0
  765. /package/icons/{CloudStatePaused.d.ts → ChartPie.d.ts} +0 -0
  766. /package/icons/{CloudStatePending.d.ts → ChartTrend.d.ts} +0 -0
  767. /package/icons/{CloudStateSlowConnection.d.ts → Chat.d.ts} +0 -0
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AA4BD,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBC,MAAM,0DAAgB,CAAA,GAAA,0BAAY,EAA4D;AAK9F,MAAM,0DAAS,CAAA,GAAA,uBAAS,EAAE,SAAS,OAAO,KAAkB,EAAE,GAA6B;IAChG,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,OACF,MAAM,SACN,GAAG,gBACH,YAAY,oBACZ,mBAAmB,UACnB,OAAO,sBACP,gBAAgB,QAChB,OAAO,UACP,GAAG,YACJ,GAAG;IACJ,MAAM,WAAW,CAAA,GAAA,oCAAa,EAAE;IAEhC,IAAI,UAAU,OAAO,KAAK;IAC1B,IAAI,UAAU,QAAQ;IACtB,qBACE,gCAAC,CAAA,GAAA,+BAAI;QACF,GAAG,QAAQ;QACZ,KAAK;QACL,MAAM;QACN,KAAK;QACL,cAAc;YACZ,GAAG,YAAY;YACf,OAAO;YACP,QAAQ;QACV;QACA,kBAAkB;QAClB,QAAQ,kCAAY;8BAAC;qBAAkB;QAAO,GAAG,MAAM,MAAM;QAC7D,KAAK;;AAEX","sources":["packages/@react-spectrum/s2/src/Avatar.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {Image} from './Image';\nimport {style} from '../style' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarProps extends UnsafeStyles, DOMProps, SlotProps {\n /** Text description of the avatar. */\n alt?: string,\n /** The image URL for the avatar. */\n src?: string,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth,\n /**\n * The size of the avatar.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 80 | 96 | 112 | (number & {}),\n /** Whether the avatar is over a color background. */\n isOverBackground?: boolean\n}\n\nconst imageStyles = style({\n borderRadius: 'full',\n size: 20,\n flexShrink: 0,\n flexGrow: 0,\n disableTapHighlight: true,\n outlineStyle: {\n default: 'none',\n isOverBackground: 'solid'\n },\n outlineColor: '--s2-container-bg',\n outlineWidth: {\n default: 1,\n isLarge: 2\n }\n}, getAllowedOverrides({width: false}));\n\nexport const AvatarContext = createContext<ContextValue<AvatarProps, DOMRefValue<HTMLImageElement>>>(null);\n\n/**\n * An avatar is a thumbnail representation of an entity, such as a user or an organization.\n */\nexport const Avatar = forwardRef(function Avatar(props: AvatarProps, ref: DOMRef<HTMLImageElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarContext);\n let domRef = useDOMRef(ref);\n let {\n alt = '',\n src,\n UNSAFE_style,\n UNSAFE_className = '',\n size = 24,\n isOverBackground,\n slot = 'avatar',\n ...otherProps\n } = props;\n const domProps = filterDOMProps(otherProps);\n\n let remSize = size / 16 + 'rem';\n let isLarge = size >= 64;\n return (\n <Image\n {...domProps}\n ref={domRef}\n slot={slot}\n alt={alt}\n UNSAFE_style={{\n ...UNSAFE_style,\n width: remSize,\n height: remSize\n }}\n UNSAFE_className={UNSAFE_className}\n styles={imageStyles({isOverBackground, isLarge}, props.styles)}\n src={src} />\n );\n});\n"],"names":[],"version":3,"file":"Avatar.cjs.map"}
1
+ {"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AA4BD,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBC,MAAM,0DAAgB,CAAA,GAAA,0BAAY,EAAqE;AAKvG,MAAM,0DAAS,CAAA,GAAA,uBAAS,EAAE,SAAS,OAAO,KAAkB,EAAE,GAA6B;IAChG,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,OACF,MAAM,SACN,GAAG,gBACH,YAAY,oBACZ,mBAAmB,UACnB,OAAO,sBACP,gBAAgB,QAChB,OAAO,UACP,GAAG,YACJ,GAAG;IACJ,MAAM,WAAW,CAAA,GAAA,oCAAa,EAAE;IAEhC,IAAI,UAAU,OAAO,KAAK;IAC1B,IAAI,UAAU,QAAQ;IACtB,qBACE,gCAAC,CAAA,GAAA,+BAAI;QACF,GAAG,QAAQ;QACZ,KAAK;QACL,MAAM;QACN,KAAK;QACL,cAAc;YACZ,GAAG,YAAY;YACf,OAAO;YACP,QAAQ;QACV;QACA,kBAAkB;QAClB,QAAQ,kCAAY;8BAAC;qBAAkB;QAAO,GAAG,MAAM,MAAM;QAC7D,KAAK;;AAEX","sources":["packages/@react-spectrum/s2/src/Avatar.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {Image} from './Image';\nimport {style} from '../style' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarProps extends UnsafeStyles, DOMProps, SlotProps {\n /** Text description of the avatar. */\n alt?: string,\n /** The image URL for the avatar. */\n src?: string,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth,\n /**\n * The size of the avatar.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 80 | 96 | 112 | (number & {}),\n /** Whether the avatar is over a color background. */\n isOverBackground?: boolean\n}\n\nconst imageStyles = style({\n borderRadius: 'full',\n size: 20,\n flexShrink: 0,\n flexGrow: 0,\n disableTapHighlight: true,\n outlineStyle: {\n default: 'none',\n isOverBackground: 'solid'\n },\n outlineColor: '--s2-container-bg',\n outlineWidth: {\n default: 1,\n isLarge: 2\n }\n}, getAllowedOverrides({width: false}));\n\nexport const AvatarContext = createContext<ContextValue<Partial<AvatarProps>, DOMRefValue<HTMLImageElement>>>(null);\n\n/**\n * An avatar is a thumbnail representation of an entity, such as a user or an organization.\n */\nexport const Avatar = forwardRef(function Avatar(props: AvatarProps, ref: DOMRef<HTMLImageElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarContext);\n let domRef = useDOMRef(ref);\n let {\n alt = '',\n src,\n UNSAFE_style,\n UNSAFE_className = '',\n size = 24,\n isOverBackground,\n slot = 'avatar',\n ...otherProps\n } = props;\n const domProps = filterDOMProps(otherProps);\n\n let remSize = size / 16 + 'rem';\n let isLarge = size >= 64;\n return (\n <Image\n {...domProps}\n ref={domRef}\n slot={slot}\n alt={alt}\n UNSAFE_style={{\n ...UNSAFE_style,\n width: remSize,\n height: remSize\n }}\n UNSAFE_className={UNSAFE_className}\n styles={imageStyles({isOverBackground, isLarge}, props.styles)}\n src={src} />\n );\n});\n"],"names":[],"version":3,"file":"Avatar.cjs.map"}
package/dist/Avatar.css CHANGED
@@ -1,7 +1,3 @@
1
- .\.:not(#a#b) {
2
- all: revert-layer;
3
- }
4
-
5
1
  @layer _.a {
6
2
  ._wf {
7
3
  border-start-start-radius: 9999px;
@@ -60,5 +56,5 @@
60
56
  }
61
57
  }
62
58
 
63
- @layer _.b, UNSAFE_overrides;
59
+ @layer _.b;
64
60
  /*# sourceMappingURL=Avatar.css.map */
@@ -1 +1 @@
1
- {"mappings":"AAsCoB;;;;AAAA;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA","sources":["packages/@react-spectrum/s2/src/Avatar.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {Image} from './Image';\nimport {style} from '../style' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarProps extends UnsafeStyles, DOMProps, SlotProps {\n /** Text description of the avatar. */\n alt?: string,\n /** The image URL for the avatar. */\n src?: string,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth,\n /**\n * The size of the avatar.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 80 | 96 | 112 | (number & {}),\n /** Whether the avatar is over a color background. */\n isOverBackground?: boolean\n}\n\nconst imageStyles = style({\n borderRadius: 'full',\n size: 20,\n flexShrink: 0,\n flexGrow: 0,\n disableTapHighlight: true,\n outlineStyle: {\n default: 'none',\n isOverBackground: 'solid'\n },\n outlineColor: '--s2-container-bg',\n outlineWidth: {\n default: 1,\n isLarge: 2\n }\n}, getAllowedOverrides({width: false}));\n\nexport const AvatarContext = createContext<ContextValue<AvatarProps, DOMRefValue<HTMLImageElement>>>(null);\n\n/**\n * An avatar is a thumbnail representation of an entity, such as a user or an organization.\n */\nexport const Avatar = forwardRef(function Avatar(props: AvatarProps, ref: DOMRef<HTMLImageElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarContext);\n let domRef = useDOMRef(ref);\n let {\n alt = '',\n src,\n UNSAFE_style,\n UNSAFE_className = '',\n size = 24,\n isOverBackground,\n slot = 'avatar',\n ...otherProps\n } = props;\n const domProps = filterDOMProps(otherProps);\n\n let remSize = size / 16 + 'rem';\n let isLarge = size >= 64;\n return (\n <Image\n {...domProps}\n ref={domRef}\n slot={slot}\n alt={alt}\n UNSAFE_style={{\n ...UNSAFE_style,\n width: remSize,\n height: remSize\n }}\n UNSAFE_className={UNSAFE_className}\n styles={imageStyles({isOverBackground, isLarge}, props.styles)}\n src={src} />\n );\n});\n"],"names":[],"version":3,"file":"Avatar.css.map"}
1
+ {"mappings":"AAsCoB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA","sources":["packages/@react-spectrum/s2/src/Avatar.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {Image} from './Image';\nimport {style} from '../style' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarProps extends UnsafeStyles, DOMProps, SlotProps {\n /** Text description of the avatar. */\n alt?: string,\n /** The image URL for the avatar. */\n src?: string,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth,\n /**\n * The size of the avatar.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 80 | 96 | 112 | (number & {}),\n /** Whether the avatar is over a color background. */\n isOverBackground?: boolean\n}\n\nconst imageStyles = style({\n borderRadius: 'full',\n size: 20,\n flexShrink: 0,\n flexGrow: 0,\n disableTapHighlight: true,\n outlineStyle: {\n default: 'none',\n isOverBackground: 'solid'\n },\n outlineColor: '--s2-container-bg',\n outlineWidth: {\n default: 1,\n isLarge: 2\n }\n}, getAllowedOverrides({width: false}));\n\nexport const AvatarContext = createContext<ContextValue<Partial<AvatarProps>, DOMRefValue<HTMLImageElement>>>(null);\n\n/**\n * An avatar is a thumbnail representation of an entity, such as a user or an organization.\n */\nexport const Avatar = forwardRef(function Avatar(props: AvatarProps, ref: DOMRef<HTMLImageElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarContext);\n let domRef = useDOMRef(ref);\n let {\n alt = '',\n src,\n UNSAFE_style,\n UNSAFE_className = '',\n size = 24,\n isOverBackground,\n slot = 'avatar',\n ...otherProps\n } = props;\n const domProps = filterDOMProps(otherProps);\n\n let remSize = size / 16 + 'rem';\n let isLarge = size >= 64;\n return (\n <Image\n {...domProps}\n ref={domRef}\n slot={slot}\n alt={alt}\n UNSAFE_style={{\n ...UNSAFE_style,\n width: remSize,\n height: remSize\n }}\n UNSAFE_className={UNSAFE_className}\n styles={imageStyles({isOverBackground, isLarge}, props.styles)}\n src={src} />\n );\n});\n"],"names":[],"version":3,"file":"Avatar.css.map"}
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AA4BD,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBC,MAAM,0DAAgB,CAAA,GAAA,oBAAY,EAA4D;AAK9F,MAAM,0DAAS,CAAA,GAAA,iBAAS,EAAE,SAAS,OAAO,KAAkB,EAAE,GAA6B;IAChG,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IACvB,IAAI,OACF,MAAM,SACN,GAAG,gBACH,YAAY,oBACZ,mBAAmB,UACnB,OAAO,sBACP,gBAAgB,QAChB,OAAO,UACP,GAAG,YACJ,GAAG;IACJ,MAAM,WAAW,CAAA,GAAA,qBAAa,EAAE;IAEhC,IAAI,UAAU,OAAO,KAAK;IAC1B,IAAI,UAAU,QAAQ;IACtB,qBACE,gBAAC,CAAA,GAAA,yCAAI;QACF,GAAG,QAAQ;QACZ,KAAK;QACL,MAAM;QACN,KAAK;QACL,cAAc;YACZ,GAAG,YAAY;YACf,OAAO;YACP,QAAQ;QACV;QACA,kBAAkB;QAClB,QAAQ,kCAAY;8BAAC;qBAAkB;QAAO,GAAG,MAAM,MAAM;QAC7D,KAAK;;AAEX","sources":["packages/@react-spectrum/s2/src/Avatar.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {Image} from './Image';\nimport {style} from '../style' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarProps extends UnsafeStyles, DOMProps, SlotProps {\n /** Text description of the avatar. */\n alt?: string,\n /** The image URL for the avatar. */\n src?: string,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth,\n /**\n * The size of the avatar.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 80 | 96 | 112 | (number & {}),\n /** Whether the avatar is over a color background. */\n isOverBackground?: boolean\n}\n\nconst imageStyles = style({\n borderRadius: 'full',\n size: 20,\n flexShrink: 0,\n flexGrow: 0,\n disableTapHighlight: true,\n outlineStyle: {\n default: 'none',\n isOverBackground: 'solid'\n },\n outlineColor: '--s2-container-bg',\n outlineWidth: {\n default: 1,\n isLarge: 2\n }\n}, getAllowedOverrides({width: false}));\n\nexport const AvatarContext = createContext<ContextValue<AvatarProps, DOMRefValue<HTMLImageElement>>>(null);\n\n/**\n * An avatar is a thumbnail representation of an entity, such as a user or an organization.\n */\nexport const Avatar = forwardRef(function Avatar(props: AvatarProps, ref: DOMRef<HTMLImageElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarContext);\n let domRef = useDOMRef(ref);\n let {\n alt = '',\n src,\n UNSAFE_style,\n UNSAFE_className = '',\n size = 24,\n isOverBackground,\n slot = 'avatar',\n ...otherProps\n } = props;\n const domProps = filterDOMProps(otherProps);\n\n let remSize = size / 16 + 'rem';\n let isLarge = size >= 64;\n return (\n <Image\n {...domProps}\n ref={domRef}\n slot={slot}\n alt={alt}\n UNSAFE_style={{\n ...UNSAFE_style,\n width: remSize,\n height: remSize\n }}\n UNSAFE_className={UNSAFE_className}\n styles={imageStyles({isOverBackground, isLarge}, props.styles)}\n src={src} />\n );\n});\n"],"names":[],"version":3,"file":"Avatar.mjs.map"}
1
+ {"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AA4BD,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBC,MAAM,0DAAgB,CAAA,GAAA,oBAAY,EAAqE;AAKvG,MAAM,0DAAS,CAAA,GAAA,iBAAS,EAAE,SAAS,OAAO,KAAkB,EAAE,GAA6B;IAChG,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IACvB,IAAI,OACF,MAAM,SACN,GAAG,gBACH,YAAY,oBACZ,mBAAmB,UACnB,OAAO,sBACP,gBAAgB,QAChB,OAAO,UACP,GAAG,YACJ,GAAG;IACJ,MAAM,WAAW,CAAA,GAAA,qBAAa,EAAE;IAEhC,IAAI,UAAU,OAAO,KAAK;IAC1B,IAAI,UAAU,QAAQ;IACtB,qBACE,gBAAC,CAAA,GAAA,yCAAI;QACF,GAAG,QAAQ;QACZ,KAAK;QACL,MAAM;QACN,KAAK;QACL,cAAc;YACZ,GAAG,YAAY;YACf,OAAO;YACP,QAAQ;QACV;QACA,kBAAkB;QAClB,QAAQ,kCAAY;8BAAC;qBAAkB;QAAO,GAAG,MAAM,MAAM;QAC7D,KAAK;;AAEX","sources":["packages/@react-spectrum/s2/src/Avatar.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {Image} from './Image';\nimport {style} from '../style' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarProps extends UnsafeStyles, DOMProps, SlotProps {\n /** Text description of the avatar. */\n alt?: string,\n /** The image URL for the avatar. */\n src?: string,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth,\n /**\n * The size of the avatar.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 56 | 64 | 80 | 96 | 112 | (number & {}),\n /** Whether the avatar is over a color background. */\n isOverBackground?: boolean\n}\n\nconst imageStyles = style({\n borderRadius: 'full',\n size: 20,\n flexShrink: 0,\n flexGrow: 0,\n disableTapHighlight: true,\n outlineStyle: {\n default: 'none',\n isOverBackground: 'solid'\n },\n outlineColor: '--s2-container-bg',\n outlineWidth: {\n default: 1,\n isLarge: 2\n }\n}, getAllowedOverrides({width: false}));\n\nexport const AvatarContext = createContext<ContextValue<Partial<AvatarProps>, DOMRefValue<HTMLImageElement>>>(null);\n\n/**\n * An avatar is a thumbnail representation of an entity, such as a user or an organization.\n */\nexport const Avatar = forwardRef(function Avatar(props: AvatarProps, ref: DOMRef<HTMLImageElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarContext);\n let domRef = useDOMRef(ref);\n let {\n alt = '',\n src,\n UNSAFE_style,\n UNSAFE_className = '',\n size = 24,\n isOverBackground,\n slot = 'avatar',\n ...otherProps\n } = props;\n const domProps = filterDOMProps(otherProps);\n\n let remSize = size / 16 + 'rem';\n let isLarge = size >= 64;\n return (\n <Image\n {...domProps}\n ref={domRef}\n slot={slot}\n alt={alt}\n UNSAFE_style={{\n ...UNSAFE_style,\n width: remSize,\n height: remSize\n }}\n UNSAFE_className={UNSAFE_className}\n styles={imageStyles({isOverBackground, isLarge}, props.styles)}\n src={src} />\n );\n});\n"],"names":[],"version":3,"file":"Avatar.mjs.map"}
@@ -32,7 +32,7 @@ $parcel$export(module.exports, "AvatarGroup", () => $5b7eb34c05dfeb90$export$5b2
32
32
 
33
33
 
34
34
  const $5b7eb34c05dfeb90$export$4f18251748129091 = /*#__PURE__*/ (0, $6mB16$react.createContext)(null);
35
- const $5b7eb34c05dfeb90$var$avatar = " . y-1oavdfs y-13alit4a";
35
+ const $5b7eb34c05dfeb90$var$avatar = " y-1oavdfs y-13alit4a";
36
36
  const $5b7eb34c05dfeb90$var$text = function anonymous(props) {
37
37
  let rules = " .";
38
38
  rules += ' yd';
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AA2BM,MAAM,0DAAqB,CAAA,GAAA,0BAAY,EAA+D;AAE7G,MAAM;AAON,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBN,MAAM;;;;;;;;AAQC,MAAM,0DAAc,CAAA,GAAA,uBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAA2B;IAC7G,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,YAAC,QAAQ,SAAE,KAAK,QAAE,OAAO,YAAI,MAAM,gBAAE,YAAY,oBAAE,gBAAgB,EAAE,GAAG,YAAW,GAAG;IAC1F,IAAI,cAAC,UAAU,cAAE,UAAU,EAAC,GAAG,CAAA,GAAA,yBAAO,EAAE;QACtC,GAAG,KAAK;QACR,kBAAkB;IACpB;IAEA,qBACE,gCAAC,CAAA,GAAA,uCAAY,EAAE,QAAQ;QAAC,OAAO;YAAC,QAAQ;kBAAQ;YAAM,kBAAkB;QAAI;kBAC1E,cAAA,iCAAC;YACC,KAAK;YACJ,GAAG,CAAA,GAAA,oCAAa,EAAE,WAAW;YAC7B,GAAG,UAAU;YACd,MAAK;YACL,WAAW,AAAC,CAAA,oBAAoB,EAAC,IAAK,gCAAU,MAAM;YACtD,OAAO;gBACL,GAAG,YAAY;gBACf,UAAU,OAAO,KAAK;YACxB;;gBACC;gBACA,uBAAS,gCAAC;oBAAM,GAAG,UAAU;oBAAE,WAAW,2BAAK;wBAAC,MAAM,OAAO;oBAAK;8BAAK;;;;;AAIhF","sources":["packages/@react-spectrum/s2/src/AvatarGroup.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {AvatarContext} from './Avatar';\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, CSSProperties, forwardRef, ReactNode} from 'react';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLabel} from 'react-aria';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarGroupProps extends UnsafeStyles, DOMProps, AriaLabelingProps, SlotProps {\n /** Avatar children of the avatar group. */\n children: ReactNode,\n /** The label for the avatar group. */\n label?: string,\n /**\n * The size of the avatar group.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth\n}\n\nexport const AvatarGroupContext = createContext<ContextValue<AvatarGroupProps, DOMRefValue<HTMLDivElement>>>(null);\n\nconst avatar = style({\n marginStart: {\n default: '[calc(var(--size) / -4)]',\n ':first-child': 0\n }\n});\n\nconst text = style({\n marginStart: 8,\n truncate: true,\n font: {\n size: {\n 16: 'ui-xs',\n 20: 'ui-sm',\n 24: 'ui',\n 28: 'ui-lg',\n 32: 'ui-xl',\n 36: 'ui-2xl',\n 40: 'ui-3xl'\n }\n }\n});\n\nconst container = style({\n display: 'flex',\n alignItems: 'center'\n}, getAllowedOverrides({width: false}));\n\n/**\n * An avatar group is a grouping of avatars that are related to each other.\n */\nexport const AvatarGroup = forwardRef(function AvatarGroup(props: AvatarGroupProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarGroupContext);\n let domRef = useDOMRef(ref);\n let {children, label, size = 24, styles, UNSAFE_style, UNSAFE_className, ...otherProps} = props;\n let {labelProps, fieldProps} = useLabel({\n ...props,\n labelElementType: 'span'\n });\n\n return (\n <AvatarContext.Provider value={{styles: avatar, size, isOverBackground: true}}>\n <div\n ref={domRef}\n {...filterDOMProps(otherProps)}\n {...fieldProps}\n role=\"group\"\n className={(UNSAFE_className ?? '') + container(null, styles)}\n style={{\n ...UNSAFE_style,\n '--size': size / 16 + 'rem'\n } as CSSProperties}>\n {children}\n {label && <span {...labelProps} className={text({size: String(size)})}>{label}</span>}\n </div>\n </AvatarContext.Provider>\n );\n});\n"],"names":[],"version":3,"file":"AvatarGroup.cjs.map"}
1
+ {"mappings":";;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AA2BM,MAAM,0DAAqB,CAAA,GAAA,0BAAY,EAAwE;AAEtH,MAAM;AAON,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBN,MAAM;;;;;;;;AAQC,MAAM,0DAAc,CAAA,GAAA,uBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAA2B;IAC7G,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,YAAC,QAAQ,SAAE,KAAK,QAAE,OAAO,YAAI,MAAM,gBAAE,YAAY,oBAAE,gBAAgB,EAAE,GAAG,YAAW,GAAG;IAC1F,IAAI,cAAC,UAAU,cAAE,UAAU,EAAC,GAAG,CAAA,GAAA,yBAAO,EAAE;QACtC,GAAG,KAAK;QACR,kBAAkB;IACpB;IAEA,qBACE,gCAAC,CAAA,GAAA,uCAAY,EAAE,QAAQ;QAAC,OAAO;YAAC,QAAQ;kBAAQ;YAAM,kBAAkB;QAAI;kBAC1E,cAAA,iCAAC;YACC,KAAK;YACJ,GAAG,CAAA,GAAA,oCAAa,EAAE,WAAW;YAC7B,GAAG,UAAU;YACd,MAAK;YACL,WAAW,AAAC,CAAA,oBAAoB,EAAC,IAAK,gCAAU,MAAM;YACtD,OAAO;gBACL,GAAG,YAAY;gBACf,UAAU,OAAO,KAAK;YACxB;;gBACC;gBACA,uBAAS,gCAAC;oBAAM,GAAG,UAAU;oBAAE,WAAW,2BAAK;wBAAC,MAAM,OAAO;oBAAK;8BAAK;;;;;AAIhF","sources":["packages/@react-spectrum/s2/src/AvatarGroup.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {AvatarContext} from './Avatar';\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, CSSProperties, forwardRef, ReactNode} from 'react';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLabel} from 'react-aria';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarGroupProps extends UnsafeStyles, DOMProps, AriaLabelingProps, SlotProps {\n /** Avatar children of the avatar group. */\n children: ReactNode,\n /** The label for the avatar group. */\n label?: string,\n /**\n * The size of the avatar group.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth\n}\n\nexport const AvatarGroupContext = createContext<ContextValue<Partial<AvatarGroupProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst avatar = style({\n marginStart: {\n default: '[calc(var(--size) / -4)]',\n ':first-child': 0\n }\n});\n\nconst text = style({\n marginStart: 8,\n truncate: true,\n font: {\n size: {\n 16: 'ui-xs',\n 20: 'ui-sm',\n 24: 'ui',\n 28: 'ui-lg',\n 32: 'ui-xl',\n 36: 'ui-2xl',\n 40: 'ui-3xl'\n }\n }\n});\n\nconst container = style({\n display: 'flex',\n alignItems: 'center'\n}, getAllowedOverrides({width: false}));\n\n/**\n * An avatar group is a grouping of avatars that are related to each other.\n */\nexport const AvatarGroup = forwardRef(function AvatarGroup(props: AvatarGroupProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarGroupContext);\n let domRef = useDOMRef(ref);\n let {children, label, size = 24, styles, UNSAFE_style, UNSAFE_className, ...otherProps} = props;\n let {labelProps, fieldProps} = useLabel({\n ...props,\n labelElementType: 'span'\n });\n\n return (\n <AvatarContext.Provider value={{styles: avatar, size, isOverBackground: true}}>\n <div\n ref={domRef}\n {...filterDOMProps(otherProps)}\n {...fieldProps}\n role=\"group\"\n className={(UNSAFE_className ?? '') + container(null, styles)}\n style={{\n ...UNSAFE_style,\n '--size': size / 16 + 'rem'\n } as CSSProperties}>\n {children}\n {label && <span {...labelProps} className={text({size: String(size)})}>{label}</span>}\n </div>\n </AvatarContext.Provider>\n );\n});\n"],"names":[],"version":3,"file":"AvatarGroup.cjs.map"}
@@ -104,8 +104,6 @@
104
104
  }
105
105
  }
106
106
 
107
- @layer UNSAFE_overrides;
108
-
109
107
  @layer _.c {
110
108
  ._d-enzwzjc:lang(he) {
111
109
  font-family: myriad-hebrew, ui-sans-serif, system-ui, sans-serif;
@@ -173,8 +171,4 @@
173
171
  }
174
172
  }
175
173
  }
176
-
177
- .\.:not(#a#b) {
178
- all: revert-layer;
179
- }
180
174
  /*# sourceMappingURL=AvatarGroup.css.map */
@@ -1 +1 @@
1
- {"mappings":"ACuCe;EAAA;;;;EAOF;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;;;;;;;;;;;;;EAAA;;;;EAAA;;;;EAgBK;;;;EAAA;;;;;AAvBH;EAAA;;;;EAOF;;;;EAAA;;;;;AAPE;;AAOF;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAgBK","sources":["0a4c7ff616b39f15","packages/@react-spectrum/s2/src/AvatarGroup.tsx"],"sourcesContent":["@import \"4466692f07e15352\";\n@import \"a5389b273a848c34\";\n@import \"443fa43b7b24f112\";\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 {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {AvatarContext} from './Avatar';\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, CSSProperties, forwardRef, ReactNode} from 'react';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLabel} from 'react-aria';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarGroupProps extends UnsafeStyles, DOMProps, AriaLabelingProps, SlotProps {\n /** Avatar children of the avatar group. */\n children: ReactNode,\n /** The label for the avatar group. */\n label?: string,\n /**\n * The size of the avatar group.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth\n}\n\nexport const AvatarGroupContext = createContext<ContextValue<AvatarGroupProps, DOMRefValue<HTMLDivElement>>>(null);\n\nconst avatar = style({\n marginStart: {\n default: '[calc(var(--size) / -4)]',\n ':first-child': 0\n }\n});\n\nconst text = style({\n marginStart: 8,\n truncate: true,\n font: {\n size: {\n 16: 'ui-xs',\n 20: 'ui-sm',\n 24: 'ui',\n 28: 'ui-lg',\n 32: 'ui-xl',\n 36: 'ui-2xl',\n 40: 'ui-3xl'\n }\n }\n});\n\nconst container = style({\n display: 'flex',\n alignItems: 'center'\n}, getAllowedOverrides({width: false}));\n\n/**\n * An avatar group is a grouping of avatars that are related to each other.\n */\nexport const AvatarGroup = forwardRef(function AvatarGroup(props: AvatarGroupProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarGroupContext);\n let domRef = useDOMRef(ref);\n let {children, label, size = 24, styles, UNSAFE_style, UNSAFE_className, ...otherProps} = props;\n let {labelProps, fieldProps} = useLabel({\n ...props,\n labelElementType: 'span'\n });\n\n return (\n <AvatarContext.Provider value={{styles: avatar, size, isOverBackground: true}}>\n <div\n ref={domRef}\n {...filterDOMProps(otherProps)}\n {...fieldProps}\n role=\"group\"\n className={(UNSAFE_className ?? '') + container(null, styles)}\n style={{\n ...UNSAFE_style,\n '--size': size / 16 + 'rem'\n } as CSSProperties}>\n {children}\n {label && <span {...labelProps} className={text({size: String(size)})}>{label}</span>}\n </div>\n </AvatarContext.Provider>\n );\n});\n"],"names":[],"version":3,"file":"AvatarGroup.css.map"}
1
+ {"mappings":"ACuCe;EAAA;;;;EAOF;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;;;;;;;;;;;;;EAAA;;;;EAAA;;;;EAgBK;;;;EAAA;;;;;AAvBH;EAAA;;;;EAOF;;;;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA","sources":["0a4c7ff616b39f15","packages/@react-spectrum/s2/src/AvatarGroup.tsx"],"sourcesContent":["@import \"4466692f07e15352\";\n@import \"a5389b273a848c34\";\n@import \"443fa43b7b24f112\";\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 {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {AvatarContext} from './Avatar';\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, CSSProperties, forwardRef, ReactNode} from 'react';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLabel} from 'react-aria';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarGroupProps extends UnsafeStyles, DOMProps, AriaLabelingProps, SlotProps {\n /** Avatar children of the avatar group. */\n children: ReactNode,\n /** The label for the avatar group. */\n label?: string,\n /**\n * The size of the avatar group.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth\n}\n\nexport const AvatarGroupContext = createContext<ContextValue<Partial<AvatarGroupProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst avatar = style({\n marginStart: {\n default: '[calc(var(--size) / -4)]',\n ':first-child': 0\n }\n});\n\nconst text = style({\n marginStart: 8,\n truncate: true,\n font: {\n size: {\n 16: 'ui-xs',\n 20: 'ui-sm',\n 24: 'ui',\n 28: 'ui-lg',\n 32: 'ui-xl',\n 36: 'ui-2xl',\n 40: 'ui-3xl'\n }\n }\n});\n\nconst container = style({\n display: 'flex',\n alignItems: 'center'\n}, getAllowedOverrides({width: false}));\n\n/**\n * An avatar group is a grouping of avatars that are related to each other.\n */\nexport const AvatarGroup = forwardRef(function AvatarGroup(props: AvatarGroupProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarGroupContext);\n let domRef = useDOMRef(ref);\n let {children, label, size = 24, styles, UNSAFE_style, UNSAFE_className, ...otherProps} = props;\n let {labelProps, fieldProps} = useLabel({\n ...props,\n labelElementType: 'span'\n });\n\n return (\n <AvatarContext.Provider value={{styles: avatar, size, isOverBackground: true}}>\n <div\n ref={domRef}\n {...filterDOMProps(otherProps)}\n {...fieldProps}\n role=\"group\"\n className={(UNSAFE_className ?? '') + container(null, styles)}\n style={{\n ...UNSAFE_style,\n '--size': size / 16 + 'rem'\n } as CSSProperties}>\n {children}\n {label && <span {...labelProps} className={text({size: String(size)})}>{label}</span>}\n </div>\n </AvatarContext.Provider>\n );\n});\n"],"names":[],"version":3,"file":"AvatarGroup.css.map"}
@@ -25,7 +25,7 @@ import {useLabel as $6MvCt$useLabel} from "react-aria";
25
25
 
26
26
 
27
27
  const $85e1de65a7290f4a$export$4f18251748129091 = /*#__PURE__*/ (0, $6MvCt$createContext)(null);
28
- const $85e1de65a7290f4a$var$avatar = " . y-1oavdfs y-13alit4a";
28
+ const $85e1de65a7290f4a$var$avatar = " y-1oavdfs y-13alit4a";
29
29
  const $85e1de65a7290f4a$var$text = function anonymous(props) {
30
30
  let rules = " .";
31
31
  rules += ' yd';
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AA2BM,MAAM,0DAAqB,CAAA,GAAA,oBAAY,EAA+D;AAE7G,MAAM;AAON,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBN,MAAM;;;;;;;;AAQC,MAAM,0DAAc,CAAA,GAAA,iBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAA2B;IAC7G,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IACvB,IAAI,YAAC,QAAQ,SAAE,KAAK,QAAE,OAAO,YAAI,MAAM,gBAAE,YAAY,oBAAE,gBAAgB,EAAE,GAAG,YAAW,GAAG;IAC1F,IAAI,cAAC,UAAU,cAAE,UAAU,EAAC,GAAG,CAAA,GAAA,eAAO,EAAE;QACtC,GAAG,KAAK;QACR,kBAAkB;IACpB;IAEA,qBACE,gBAAC,CAAA,GAAA,yCAAY,EAAE,QAAQ;QAAC,OAAO;YAAC,QAAQ;kBAAQ;YAAM,kBAAkB;QAAI;kBAC1E,cAAA,iBAAC;YACC,KAAK;YACJ,GAAG,CAAA,GAAA,qBAAa,EAAE,WAAW;YAC7B,GAAG,UAAU;YACd,MAAK;YACL,WAAW,AAAC,CAAA,oBAAoB,EAAC,IAAK,gCAAU,MAAM;YACtD,OAAO;gBACL,GAAG,YAAY;gBACf,UAAU,OAAO,KAAK;YACxB;;gBACC;gBACA,uBAAS,gBAAC;oBAAM,GAAG,UAAU;oBAAE,WAAW,2BAAK;wBAAC,MAAM,OAAO;oBAAK;8BAAK;;;;;AAIhF","sources":["packages/@react-spectrum/s2/src/AvatarGroup.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {AvatarContext} from './Avatar';\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, CSSProperties, forwardRef, ReactNode} from 'react';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLabel} from 'react-aria';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarGroupProps extends UnsafeStyles, DOMProps, AriaLabelingProps, SlotProps {\n /** Avatar children of the avatar group. */\n children: ReactNode,\n /** The label for the avatar group. */\n label?: string,\n /**\n * The size of the avatar group.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth\n}\n\nexport const AvatarGroupContext = createContext<ContextValue<AvatarGroupProps, DOMRefValue<HTMLDivElement>>>(null);\n\nconst avatar = style({\n marginStart: {\n default: '[calc(var(--size) / -4)]',\n ':first-child': 0\n }\n});\n\nconst text = style({\n marginStart: 8,\n truncate: true,\n font: {\n size: {\n 16: 'ui-xs',\n 20: 'ui-sm',\n 24: 'ui',\n 28: 'ui-lg',\n 32: 'ui-xl',\n 36: 'ui-2xl',\n 40: 'ui-3xl'\n }\n }\n});\n\nconst container = style({\n display: 'flex',\n alignItems: 'center'\n}, getAllowedOverrides({width: false}));\n\n/**\n * An avatar group is a grouping of avatars that are related to each other.\n */\nexport const AvatarGroup = forwardRef(function AvatarGroup(props: AvatarGroupProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarGroupContext);\n let domRef = useDOMRef(ref);\n let {children, label, size = 24, styles, UNSAFE_style, UNSAFE_className, ...otherProps} = props;\n let {labelProps, fieldProps} = useLabel({\n ...props,\n labelElementType: 'span'\n });\n\n return (\n <AvatarContext.Provider value={{styles: avatar, size, isOverBackground: true}}>\n <div\n ref={domRef}\n {...filterDOMProps(otherProps)}\n {...fieldProps}\n role=\"group\"\n className={(UNSAFE_className ?? '') + container(null, styles)}\n style={{\n ...UNSAFE_style,\n '--size': size / 16 + 'rem'\n } as CSSProperties}>\n {children}\n {label && <span {...labelProps} className={text({size: String(size)})}>{label}</span>}\n </div>\n </AvatarContext.Provider>\n );\n});\n"],"names":[],"version":3,"file":"AvatarGroup.mjs.map"}
1
+ {"mappings":";;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AA2BM,MAAM,0DAAqB,CAAA,GAAA,oBAAY,EAAwE;AAEtH,MAAM;AAON,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBN,MAAM;;;;;;;;AAQC,MAAM,0DAAc,CAAA,GAAA,iBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAA2B;IAC7G,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IACvB,IAAI,YAAC,QAAQ,SAAE,KAAK,QAAE,OAAO,YAAI,MAAM,gBAAE,YAAY,oBAAE,gBAAgB,EAAE,GAAG,YAAW,GAAG;IAC1F,IAAI,cAAC,UAAU,cAAE,UAAU,EAAC,GAAG,CAAA,GAAA,eAAO,EAAE;QACtC,GAAG,KAAK;QACR,kBAAkB;IACpB;IAEA,qBACE,gBAAC,CAAA,GAAA,yCAAY,EAAE,QAAQ;QAAC,OAAO;YAAC,QAAQ;kBAAQ;YAAM,kBAAkB;QAAI;kBAC1E,cAAA,iBAAC;YACC,KAAK;YACJ,GAAG,CAAA,GAAA,qBAAa,EAAE,WAAW;YAC7B,GAAG,UAAU;YACd,MAAK;YACL,WAAW,AAAC,CAAA,oBAAoB,EAAC,IAAK,gCAAU,MAAM;YACtD,OAAO;gBACL,GAAG,YAAY;gBACf,UAAU,OAAO,KAAK;YACxB;;gBACC;gBACA,uBAAS,gBAAC;oBAAM,GAAG,UAAU;oBAAE,WAAW,2BAAK;wBAAC,MAAM,OAAO;oBAAK;8BAAK;;;;;AAIhF","sources":["packages/@react-spectrum/s2/src/AvatarGroup.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {AvatarContext} from './Avatar';\nimport {ContextValue, SlotProps} from 'react-aria-components';\nimport {createContext, CSSProperties, forwardRef, ReactNode} from 'react';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {getAllowedOverrides, StylesPropWithoutWidth, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLabel} from 'react-aria';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AvatarGroupProps extends UnsafeStyles, DOMProps, AriaLabelingProps, SlotProps {\n /** Avatar children of the avatar group. */\n children: ReactNode,\n /** The label for the avatar group. */\n label?: string,\n /**\n * The size of the avatar group.\n * @default 24\n */\n size?: 16 | 20 | 24 | 28 | 32 | 36 | 40,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithoutWidth\n}\n\nexport const AvatarGroupContext = createContext<ContextValue<Partial<AvatarGroupProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst avatar = style({\n marginStart: {\n default: '[calc(var(--size) / -4)]',\n ':first-child': 0\n }\n});\n\nconst text = style({\n marginStart: 8,\n truncate: true,\n font: {\n size: {\n 16: 'ui-xs',\n 20: 'ui-sm',\n 24: 'ui',\n 28: 'ui-lg',\n 32: 'ui-xl',\n 36: 'ui-2xl',\n 40: 'ui-3xl'\n }\n }\n});\n\nconst container = style({\n display: 'flex',\n alignItems: 'center'\n}, getAllowedOverrides({width: false}));\n\n/**\n * An avatar group is a grouping of avatars that are related to each other.\n */\nexport const AvatarGroup = forwardRef(function AvatarGroup(props: AvatarGroupProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AvatarGroupContext);\n let domRef = useDOMRef(ref);\n let {children, label, size = 24, styles, UNSAFE_style, UNSAFE_className, ...otherProps} = props;\n let {labelProps, fieldProps} = useLabel({\n ...props,\n labelElementType: 'span'\n });\n\n return (\n <AvatarContext.Provider value={{styles: avatar, size, isOverBackground: true}}>\n <div\n ref={domRef}\n {...filterDOMProps(otherProps)}\n {...fieldProps}\n role=\"group\"\n className={(UNSAFE_className ?? '') + container(null, styles)}\n style={{\n ...UNSAFE_style,\n '--size': size / 16 + 'rem'\n } as CSSProperties}>\n {children}\n {label && <span {...labelProps} className={text({size: String(size)})}>{label}</span>}\n </div>\n </AvatarContext.Provider>\n );\n});\n"],"names":[],"version":3,"file":"AvatarGroup.mjs.map"}
package/dist/Badge.cjs CHANGED
@@ -78,14 +78,15 @@ const $660a621e3a266afc$var$badge = function anonymous(props, overrides) {
78
78
  else if (props.fillStyle === "subtle") rules += ' ap';
79
79
  else if (props.fillStyle === "bold") {
80
80
  if (props.variant === "celery") rules += ' ab';
81
- else if (props.variant === "charteuse") rules += ' ab';
81
+ else if (props.variant === "chartreuse") rules += ' ab';
82
82
  else if (props.variant === "yellow") rules += ' ab';
83
83
  else if (props.variant === "orange") rules += ' ab';
84
84
  else if (props.variant === "notice") rules += ' ab';
85
85
  else rules += ' ac';
86
86
  }
87
87
  rules += ' _3d';
88
- rules += ' _2c';
88
+ rules += ' _2-1dz4pg9c';
89
+ rules += ' _2d';
89
90
  rules += ' _wh';
90
91
  rules += ' _xh';
91
92
  rules += ' _yh';
@@ -117,7 +118,7 @@ const $660a621e3a266afc$var$badge = function anonymous(props, overrides) {
117
118
  else if (props.variant === "seafoam") rules += ' b______c';
118
119
  else if (props.variant === "green") rules += ' b_____2';
119
120
  else if (props.variant === "celery") rules += ' b______a';
120
- else if (props.variant === "charteuse") rules += ' b_____8';
121
+ else if (props.variant === "chartreuse") rules += ' b_____8';
121
122
  else if (props.variant === "yellow") rules += ' b_____6';
122
123
  else if (props.variant === "orange") rules += ' b_____4';
123
124
  else if (props.variant === "red") rules += ' b_____Z';
@@ -143,7 +144,7 @@ const $660a621e3a266afc$var$badge = function anonymous(props, overrides) {
143
144
  else if (props.variant === "seafoam") rules += ' b______b';
144
145
  else if (props.variant === "green") rules += ' b_____0';
145
146
  else if (props.variant === "celery") rules += ' b_____9';
146
- else if (props.variant === "charteuse") rules += ' b_____7';
147
+ else if (props.variant === "chartreuse") rules += ' b_____7';
147
148
  else if (props.variant === "yellow") rules += ' b_____5';
148
149
  else if (props.variant === "orange") rules += ' b_____3';
149
150
  else if (props.variant === "red") rules += ' b_____X';
@@ -200,27 +201,44 @@ const $660a621e3a266afc$var$badge = function anonymous(props, overrides) {
200
201
  rules += ' -_375tp1_v-c';
201
202
  return rules;
202
203
  };
203
- const $660a621e3a266afc$export$37acb3580601e69a = /*#__PURE__*/ (0, $26Nq1$react.forwardRef)(function Badge(props, ref) {
204
- [props, ref] = (0, $ac757a4c2bd72aee$exports.useSpectrumContextProps)(props, ref, $660a621e3a266afc$export$1d4627584e49159a);
205
- let { children: children, variant: variant = 'neutral', size: size = 'S', fillStyle: fillStyle = 'bold', ...otherProps } = props; // useProviderProps(props) in v3
204
+ const $660a621e3a266afc$export$37acb3580601e69a = /*#__PURE__*/ (0, $26Nq1$react.forwardRef)(function Badge(props1, ref) {
205
+ [props1, ref] = (0, $ac757a4c2bd72aee$exports.useSpectrumContextProps)(props1, ref, $660a621e3a266afc$export$1d4627584e49159a);
206
+ let { children: children, variant: variant = 'neutral', size: size = 'S', fillStyle: fillStyle = 'bold', overflowMode: overflowMode = 'wrap', ...otherProps } = props1; // useProviderProps(props) in v3
206
207
  let domRef = (0, $26Nq1$reactspectrumutils.useDOMRef)(ref);
207
- let isTextOnly = (0, ($parcel$interopDefault($26Nq1$react))).Children.toArray(props.children).every((c)=>!/*#__PURE__*/ (0, ($parcel$interopDefault($26Nq1$react))).isValidElement(c));
208
+ let isTextOnly = (0, ($parcel$interopDefault($26Nq1$react))).Children.toArray(props1.children).every((c)=>!/*#__PURE__*/ (0, ($parcel$interopDefault($26Nq1$react))).isValidElement(c));
208
209
  return /*#__PURE__*/ (0, $26Nq1$reactjsxruntime.jsx)((0, $26Nq1$reactariacomponents.Provider), {
209
210
  values: [
210
211
  [
211
212
  (0, $6367bc87eb7d24ad$exports.TextContext),
212
213
  {
213
- styles: " . E-1gogtue F-1gogtue __B-3t1y"
214
+ styles: function anonymous(props) {
215
+ let rules = " .";
216
+ rules += ' E-1gogtue';
217
+ rules += ' F-1gogtue';
218
+ rules += ' __B-3t1y';
219
+ rules += ' __wb';
220
+ rules += ' __xb';
221
+ rules += ' _na';
222
+ if (props.overflowMode === "wrap") rules += ' _qa';
223
+ else if (props.overflowMode === "truncate") rules += ' _qb';
224
+ return rules;
225
+ }({
226
+ overflowMode: overflowMode
227
+ })
214
228
  }
215
229
  ],
230
+ [
231
+ (0, $26Nq1$reactariacomponents.TextContext),
232
+ {}
233
+ ],
216
234
  [
217
235
  (0, $bde97c91243ed164$exports.IconContext),
218
236
  {
219
237
  render: (0, $e991cbcdf82ced71$exports.centerBaseline)({
220
238
  slot: 'icon',
221
- styles: " . __B-3t1x"
239
+ styles: " __B-3t1x"
222
240
  }),
223
- styles: " . l-1sthc3k k-1sthc3k y-oelgqu _9-3t1x"
241
+ styles: " l-1sthc3k k-1sthc3k y-oelgqu _9-3t1x"
224
242
  }
225
243
  ]
226
244
  ],
@@ -228,12 +246,12 @@ const $660a621e3a266afc$export$37acb3580601e69a = /*#__PURE__*/ (0, $26Nq1$react
228
246
  children: /*#__PURE__*/ (0, $26Nq1$reactjsxruntime.jsx)("span", {
229
247
  ...(0, $26Nq1$reactariautils.filterDOMProps)(otherProps),
230
248
  role: "presentation",
231
- className: (props.UNSAFE_className || '') + $660a621e3a266afc$var$badge({
249
+ className: (props1.UNSAFE_className || '') + $660a621e3a266afc$var$badge({
232
250
  variant: variant,
233
251
  size: size,
234
252
  fillStyle: fillStyle
235
- }, props.styles),
236
- style: props.UNSAFE_style,
253
+ }, props1.styles),
254
+ style: props1.UNSAFE_style,
237
255
  ref: domRef,
238
256
  children: typeof children === 'string' || isTextOnly ? /*#__PURE__*/ (0, $26Nq1$reactjsxruntime.jsx)((0, $6367bc87eb7d24ad$exports.Text), {
239
257
  children: children
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;AA0CM,MAAM,0DAAe,CAAA,GAAA,0BAAY,EAAkE;AAE1G,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoIC,MAAM,0DAAQ,CAAA,GAAA,uBAAS,EAAE,SAAS,MAAM,KAAiB,EAAE,GAA2B;IAC3F,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,YACF,QAAQ,WACR,UAAU,iBACV,OAAO,gBACP,YAAY,QACZ,GAAG,YACJ,GAAG,OAAO,gCAAgC;IAC3C,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,aAAa,CAAA,GAAA,sCAAI,EAAE,QAAQ,CAAC,OAAO,CAAC,MAAM,QAAQ,EAAE,KAAK,CAAC,CAAA,IAAK,eAAC,CAAA,GAAA,sCAAI,EAAE,cAAc,CAAC;IAEzF,qBACE,gCAAC,CAAA,GAAA,mCAAO;QACN,QAAQ;YACN;gBAAC,CAAA,GAAA,qCAAU;gBAAG;oBAAC,MAAM;gBAA+C;aAAE;YACtE;gBAAC,CAAA,GAAA,qCAAU;gBAAG;oBACZ,QAAQ,CAAA,GAAA,wCAAa,EAAE;wBAAC,MAAM;wBAAQ,MAAM;oBAAmB;oBAC/D,MAAM;gBACR;aAAE;SACH;kBACD,cAAA,gCAAC,CAAA,GAAA,yCAAc;sBACb,cAAA,gCAAC;gBACE,GAAG,CAAA,GAAA,oCAAa,EAAE,WAAW;gBAC9B,MAAK;gBACL,WAAW,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,4BAAM;6BAAC;0BAAS;+BAAM;gBAAS,GAAG,MAAM,MAAM;gBAC1F,OAAO,MAAM,YAAY;gBACzB,KAAK;0BAEH,OAAO,aAAa,YAAY,2BAC5B,gCAAC,CAAA,GAAA,8BAAG;8BAAG;qBACP;;;;AAMhB","sources":["packages/@react-spectrum/s2/src/Badge.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {centerBaseline} from './CenterBaseline';\nimport {centerPadding, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {ContextValue, Provider, SlotProps} from 'react-aria-components';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {fontRelative, lightDark, style} from '../style' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport React, {createContext, forwardRef, ReactNode} from 'react';\nimport {SkeletonWrapper} from './Skeleton';\nimport {Text, TextContext} from './Content';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface BadgeStyleProps {\n /**\n * The size of the badge.\n *\n * @default 'S'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /**\n * The variant changes the background color of the badge. When badge has a semantic meaning, they should use the variant for semantic colors.\n *\n * @default 'neutral'\n */\n variant?: 'accent' | 'informative' | 'neutral' | 'positive' | 'notice' | 'negative' | 'gray' | 'red' | 'orange' | 'yellow' | 'charteuse' | 'celery' | 'green' | 'seafoam' | 'cyan' | 'blue' | 'indigo' | 'purple' | 'fuchsia' | 'magenta' | 'pink' | 'turquoise' | 'brown' | 'cinnamon' | 'silver',\n /**\n * The fill of the badge.\n * @default 'bold'\n */\n fillStyle?: 'bold' | 'subtle' | 'outline'\n}\n\nexport interface BadgeProps extends DOMProps, AriaLabelingProps, StyleProps, BadgeStyleProps, SlotProps {\n /**\n * The content to display in the badge.\n */\n children: ReactNode\n}\n\nexport const BadgeContext = createContext<ContextValue<Partial<BadgeProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst badge = style<BadgeStyleProps>({\n display: 'flex',\n font: 'control',\n justifyContent: 'center',\n alignItems: 'center',\n borderRadius: 'control',\n minHeight: 'control',\n paddingX: {\n default: 'edge-to-text',\n ':has([slot=icon]:only-child)': 0\n },\n '--labelPadding': {\n type: 'paddingTop',\n value: centerPadding()\n },\n aspectRatio: {\n ':has([slot=icon]:only-child)': 'square'\n },\n '--iconMargin': {\n type: 'marginTop',\n value: {\n default: fontRelative(-2),\n ':has([slot=icon]:only-child)': 0\n }\n },\n columnGap: 'text-to-visual',\n color: {\n fillStyle: {\n bold: {\n default: 'white',\n variant: {\n notice: 'black',\n orange: 'black',\n yellow: 'black',\n charteuse: 'black',\n celery: 'black'\n }\n },\n subtle: 'gray-1000',\n outline: 'gray-1000'\n }\n },\n backgroundColor: {\n fillStyle: {\n bold: {\n variant: {\n accent: 'accent',\n informative: 'informative',\n neutral: 'neutral-subdued',\n positive: 'positive',\n notice: 'notice',\n negative: 'negative',\n gray: 'gray',\n red: 'red',\n orange: 'orange',\n yellow: 'yellow',\n charteuse: 'chartreuse',\n celery: 'celery',\n green: 'green',\n seafoam: 'seafoam',\n cyan: 'cyan',\n blue: 'blue',\n indigo: 'indigo',\n purple: 'purple',\n fuchsia: 'fuchsia',\n magenta: 'magenta',\n pink: 'pink',\n turquoise: 'turquoise',\n brown: 'brown',\n cinnamon: 'cinnamon',\n silver: 'silver'\n }\n },\n subtle: {\n variant: {\n accent: 'accent-subtle',\n informative: 'informative-subtle',\n neutral: 'neutral-subtle',\n positive: 'positive-subtle',\n notice: 'notice-subtle',\n negative: 'negative-subtle',\n gray: 'gray-subtle',\n red: 'red-subtle',\n orange: 'orange-subtle',\n yellow: 'yellow-subtle',\n charteuse: 'chartreuse-subtle',\n celery: 'celery-subtle',\n green: 'green-subtle',\n seafoam: 'seafoam-subtle',\n cyan: 'cyan-subtle',\n blue: 'blue-subtle',\n indigo: 'indigo-subtle',\n purple: 'purple-subtle',\n fuchsia: 'fuchsia-subtle',\n magenta: 'magenta-subtle',\n pink: 'pink-subtle',\n turquoise: 'turquoise-subtle',\n brown: 'brown-subtle',\n cinnamon: 'cinnamon-subtle',\n silver: 'silver-subtle'\n }\n },\n outline: 'layer-2'\n }\n },\n borderStyle: 'solid',\n boxSizing: 'border-box',\n borderWidth: 2,\n borderColor: {\n default: 'transparent',\n fillStyle: {\n outline: {\n variant: {\n accent: lightDark('accent-800', 'accent-900'), // accent-visual-color\n informative: lightDark('informative-800', 'informative-900'), // informative-visual-color\n neutral: lightDark('gray-500', 'gray-600'), // neutral-visual-color\n positive: lightDark('positive-800', 'positive-900'), // positive-visual-color\n notice: lightDark('notice-800', 'notice-900'), // notice-visual-color\n negative: lightDark('negative-800', 'negative-900') // negative-visual-color\n }\n }\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n}, getAllowedOverrides());\n\n/**\n * Badges are used for showing a small amount of color-categorized metadata, ideal for getting a user's attention.\n */\nexport const Badge = forwardRef(function Badge(props: BadgeProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, BadgeContext);\n let {\n children,\n variant = 'neutral',\n size = 'S',\n fillStyle = 'bold',\n ...otherProps\n } = props; // useProviderProps(props) in v3\n let domRef = useDOMRef(ref);\n let isTextOnly = React.Children.toArray(props.children).every(c => !React.isValidElement(c));\n\n return (\n <Provider\n values={[\n [TextContext, {styles: style({paddingY: '--labelPadding', order: 1})}],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n }]\n ]}>\n <SkeletonWrapper>\n <span\n {...filterDOMProps(otherProps)}\n role=\"presentation\"\n className={(props.UNSAFE_className || '') + badge({variant, size, fillStyle}, props.styles)}\n style={props.UNSAFE_style}\n ref={domRef}>\n {\n typeof children === 'string' || isTextOnly\n ? <Text>{children}</Text>\n : children\n }\n </span>\n </SkeletonWrapper>\n </Provider>\n );\n});\n"],"names":[],"version":3,"file":"Badge.cjs.map"}
1
+ {"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;AA+CM,MAAM,0DAAe,CAAA,GAAA,0BAAY,EAAkE;AAE1G,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuIC,MAAM,0DAAQ,CAAA,GAAA,uBAAS,EAAE,SAAS,MAAM,MAAiB,EAAE,GAA2B;IAC3F,CAAC,QAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,QAAO,KAAK;IACnD,IAAI,YACF,QAAQ,WACR,UAAU,iBACV,OAAO,gBACP,YAAY,sBACZ,eAAe,QACf,GAAG,YACJ,GAAG,QAAO,gCAAgC;IAC3C,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,aAAa,CAAA,GAAA,sCAAI,EAAE,QAAQ,CAAC,OAAO,CAAC,OAAM,QAAQ,EAAE,KAAK,CAAC,CAAA,IAAK,eAAC,CAAA,GAAA,sCAAI,EAAE,cAAc,CAAC;IAEzF,qBACE,gCAAC,CAAA,GAAA,mCAAO;QACN,QAAQ;YACN;gBAAC,CAAA,GAAA,qCAAU;gBAAG;oBACZ,QAAQ;;;;;;;;;;;sBAOL;sCAAC;oBAAY;gBAClB;aAAE;YACF;gBAAC,CAAA,GAAA,sCAAa;gBAAG,CAAC;aAAE;YACpB;gBAAC,CAAA,GAAA,qCAAU;gBAAG;oBACZ,QAAQ,CAAA,GAAA,wCAAa,EAAE;wBAAC,MAAM;wBAAQ,MAAM;oBAAmB;oBAC/D,MAAM;gBACR;aAAE;SACH;kBACD,cAAA,gCAAC,CAAA,GAAA,yCAAc;sBACb,cAAA,gCAAC;gBACE,GAAG,CAAA,GAAA,oCAAa,EAAE,WAAW;gBAC9B,MAAK;gBACL,WAAW,AAAC,CAAA,OAAM,gBAAgB,IAAI,EAAC,IAAK,4BAAM;6BAAC;0BAAS;+BAAM;gBAAS,GAAG,OAAM,MAAM;gBAC1F,OAAO,OAAM,YAAY;gBACzB,KAAK;0BAEH,OAAO,aAAa,YAAY,2BAC5B,gCAAC,CAAA,GAAA,8BAAG;8BAAG;qBACP;;;;AAMhB","sources":["packages/@react-spectrum/s2/src/Badge.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {centerBaseline} from './CenterBaseline';\nimport {centerPadding, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {ContextValue, Provider, TextContext as RACTextContext, SlotProps} from 'react-aria-components';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {fontRelative, lightDark, style} from '../style' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport React, {createContext, forwardRef, ReactNode} from 'react';\nimport {SkeletonWrapper} from './Skeleton';\nimport {Text, TextContext} from './Content';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface BadgeStyleProps {\n /**\n * The size of the badge.\n *\n * @default 'S'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /**\n * The variant changes the background color of the badge. When badge has a semantic meaning, they should use the variant for semantic colors.\n *\n * @default 'neutral'\n */\n variant?: 'accent' | 'informative' | 'neutral' | 'positive' | 'notice' | 'negative' | 'gray' | 'red' | 'orange' | 'yellow' | 'chartreuse' | 'celery' | 'green' | 'seafoam' | 'cyan' | 'blue' | 'indigo' | 'purple' | 'fuchsia' | 'magenta' | 'pink' | 'turquoise' | 'brown' | 'cinnamon' | 'silver',\n /**\n * The fill of the badge.\n * @default 'bold'\n */\n fillStyle?: 'bold' | 'subtle' | 'outline',\n /**\n * Sets the text behavior for the contents.\n * @default 'wrap'\n */\n overflowMode?: 'wrap' | 'truncate'\n}\n\nexport interface BadgeProps extends DOMProps, AriaLabelingProps, StyleProps, BadgeStyleProps, SlotProps {\n /**\n * The content to display in the badge.\n */\n children: ReactNode\n}\n\nexport const BadgeContext = createContext<ContextValue<Partial<BadgeProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst badge = style<BadgeStyleProps>({\n display: 'flex',\n font: 'control',\n justifyContent: 'center',\n alignItems: {\n default: 'baseline',\n ':has([slot=icon]:only-child)': 'center'\n },\n borderRadius: 'control',\n minHeight: 'control',\n paddingX: {\n default: 'edge-to-text',\n ':has([slot=icon]:only-child)': 0\n },\n '--labelPadding': {\n type: 'paddingTop',\n value: centerPadding()\n },\n aspectRatio: {\n ':has([slot=icon]:only-child)': 'square'\n },\n '--iconMargin': {\n type: 'marginTop',\n value: {\n default: fontRelative(-2),\n ':has([slot=icon]:only-child)': 0\n }\n },\n columnGap: 'text-to-visual',\n color: {\n fillStyle: {\n bold: {\n default: 'white',\n variant: {\n notice: 'black',\n orange: 'black',\n yellow: 'black',\n chartreuse: 'black',\n celery: 'black'\n }\n },\n subtle: 'gray-1000',\n outline: 'gray-1000'\n }\n },\n backgroundColor: {\n fillStyle: {\n bold: {\n variant: {\n accent: 'accent',\n informative: 'informative',\n neutral: 'neutral-subdued',\n positive: 'positive',\n notice: 'notice',\n negative: 'negative',\n gray: 'gray',\n red: 'red',\n orange: 'orange',\n yellow: 'yellow',\n chartreuse: 'chartreuse',\n celery: 'celery',\n green: 'green',\n seafoam: 'seafoam',\n cyan: 'cyan',\n blue: 'blue',\n indigo: 'indigo',\n purple: 'purple',\n fuchsia: 'fuchsia',\n magenta: 'magenta',\n pink: 'pink',\n turquoise: 'turquoise',\n brown: 'brown',\n cinnamon: 'cinnamon',\n silver: 'silver'\n }\n },\n subtle: {\n variant: {\n accent: 'accent-subtle',\n informative: 'informative-subtle',\n neutral: 'neutral-subtle',\n positive: 'positive-subtle',\n notice: 'notice-subtle',\n negative: 'negative-subtle',\n gray: 'gray-subtle',\n red: 'red-subtle',\n orange: 'orange-subtle',\n yellow: 'yellow-subtle',\n chartreuse: 'chartreuse-subtle',\n celery: 'celery-subtle',\n green: 'green-subtle',\n seafoam: 'seafoam-subtle',\n cyan: 'cyan-subtle',\n blue: 'blue-subtle',\n indigo: 'indigo-subtle',\n purple: 'purple-subtle',\n fuchsia: 'fuchsia-subtle',\n magenta: 'magenta-subtle',\n pink: 'pink-subtle',\n turquoise: 'turquoise-subtle',\n brown: 'brown-subtle',\n cinnamon: 'cinnamon-subtle',\n silver: 'silver-subtle'\n }\n },\n outline: 'layer-2'\n }\n },\n borderStyle: 'solid',\n boxSizing: 'border-box',\n borderWidth: 2,\n borderColor: {\n default: 'transparent',\n fillStyle: {\n outline: {\n variant: {\n accent: lightDark('accent-800', 'accent-900'), // accent-visual-color\n informative: lightDark('informative-800', 'informative-900'), // informative-visual-color\n neutral: lightDark('gray-500', 'gray-600'), // neutral-visual-color\n positive: lightDark('positive-800', 'positive-900'), // positive-visual-color\n notice: lightDark('notice-800', 'notice-900'), // notice-visual-color\n negative: lightDark('negative-800', 'negative-900') // negative-visual-color\n }\n }\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n}, getAllowedOverrides());\n\n/**\n * Badges are used for showing a small amount of color-categorized metadata, ideal for getting a user's attention.\n */\nexport const Badge = forwardRef(function Badge(props: BadgeProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, BadgeContext);\n let {\n children,\n variant = 'neutral',\n size = 'S',\n fillStyle = 'bold',\n overflowMode = 'wrap',\n ...otherProps\n } = props; // useProviderProps(props) in v3\n let domRef = useDOMRef(ref);\n let isTextOnly = React.Children.toArray(props.children).every(c => !React.isValidElement(c));\n\n return (\n <Provider\n values={[\n [TextContext, {\n styles: style({\n paddingY: '--labelPadding',\n order: 1,\n overflowX: 'hidden',\n overflowY: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: {overflowMode: {truncate: 'nowrap', wrap: 'normal'}}\n })({overflowMode})\n }],\n [RACTextContext, {}],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n }]\n ]}>\n <SkeletonWrapper>\n <span\n {...filterDOMProps(otherProps)}\n role=\"presentation\"\n className={(props.UNSAFE_className || '') + badge({variant, size, fillStyle}, props.styles)}\n style={props.UNSAFE_style}\n ref={domRef}>\n {\n typeof children === 'string' || isTextOnly\n ? <Text>{children}</Text>\n : children\n }\n </span>\n </SkeletonWrapper>\n </Provider>\n );\n});\n"],"names":[],"version":3,"file":"Badge.cjs.map"}
package/dist/Badge.css CHANGED
@@ -53,8 +53,8 @@
53
53
  justify-content: center;
54
54
  }
55
55
 
56
- ._2c {
57
- align-items: center;
56
+ ._2d {
57
+ align-items: baseline;
58
58
  }
59
59
 
60
60
  ._wh {
@@ -361,6 +361,26 @@
361
361
  order: 1;
362
362
  }
363
363
 
364
+ .__wb {
365
+ overflow-x: hidden;
366
+ }
367
+
368
+ .__xb {
369
+ overflow-y: hidden;
370
+ }
371
+
372
+ ._na {
373
+ text-overflow: ellipsis;
374
+ }
375
+
376
+ ._qb {
377
+ white-space: nowrap;
378
+ }
379
+
380
+ ._qa {
381
+ white-space: normal;
382
+ }
383
+
364
384
  .__B-3t1x {
365
385
  order: 0;
366
386
  }
@@ -391,6 +411,10 @@
391
411
  line-height: 1.5;
392
412
  }
393
413
 
414
+ ._2-1dz4pg9c:has([slot="icon"]:only-child) {
415
+ align-items: center;
416
+ }
417
+
394
418
  .C-1dz4pg9a:has([slot="icon"]:only-child) {
395
419
  padding-inline-start: 0;
396
420
  }
@@ -444,8 +468,6 @@
444
468
  }
445
469
  }
446
470
 
447
- @layer UNSAFE_overrides;
448
-
449
471
  @layer _.b.b {
450
472
  @media not ((hover: hover) and (pointer: fine)) {
451
473
  ._ebf {
@@ -473,8 +495,4 @@
473
495
  }
474
496
  }
475
497
  }
476
-
477
- .\.:not(#a#b) {
478
- all: revert-layer;
479
- }
480
498
  /*# sourceMappingURL=Badge.css.map */
@@ -1 +1 @@
1
- {"mappings":"ACsDc;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAmJiB;;;;EAAA;;;;EAAA;;;;EAEyB;;;;EACtC;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAtJJ;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAmJiB","sources":["31052c90be0d94da","packages/@react-spectrum/s2/src/Badge.tsx"],"sourcesContent":["@import \"08c4d7ffd2baa021\";\n@import \"1aad76937c73131b\";\n@import \"7989dc282effbbd8\";\n@import \"a50d3ac159f93c2b\";\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 {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {centerBaseline} from './CenterBaseline';\nimport {centerPadding, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {ContextValue, Provider, SlotProps} from 'react-aria-components';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {fontRelative, lightDark, style} from '../style' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport React, {createContext, forwardRef, ReactNode} from 'react';\nimport {SkeletonWrapper} from './Skeleton';\nimport {Text, TextContext} from './Content';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface BadgeStyleProps {\n /**\n * The size of the badge.\n *\n * @default 'S'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /**\n * The variant changes the background color of the badge. When badge has a semantic meaning, they should use the variant for semantic colors.\n *\n * @default 'neutral'\n */\n variant?: 'accent' | 'informative' | 'neutral' | 'positive' | 'notice' | 'negative' | 'gray' | 'red' | 'orange' | 'yellow' | 'charteuse' | 'celery' | 'green' | 'seafoam' | 'cyan' | 'blue' | 'indigo' | 'purple' | 'fuchsia' | 'magenta' | 'pink' | 'turquoise' | 'brown' | 'cinnamon' | 'silver',\n /**\n * The fill of the badge.\n * @default 'bold'\n */\n fillStyle?: 'bold' | 'subtle' | 'outline'\n}\n\nexport interface BadgeProps extends DOMProps, AriaLabelingProps, StyleProps, BadgeStyleProps, SlotProps {\n /**\n * The content to display in the badge.\n */\n children: ReactNode\n}\n\nexport const BadgeContext = createContext<ContextValue<Partial<BadgeProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst badge = style<BadgeStyleProps>({\n display: 'flex',\n font: 'control',\n justifyContent: 'center',\n alignItems: 'center',\n borderRadius: 'control',\n minHeight: 'control',\n paddingX: {\n default: 'edge-to-text',\n ':has([slot=icon]:only-child)': 0\n },\n '--labelPadding': {\n type: 'paddingTop',\n value: centerPadding()\n },\n aspectRatio: {\n ':has([slot=icon]:only-child)': 'square'\n },\n '--iconMargin': {\n type: 'marginTop',\n value: {\n default: fontRelative(-2),\n ':has([slot=icon]:only-child)': 0\n }\n },\n columnGap: 'text-to-visual',\n color: {\n fillStyle: {\n bold: {\n default: 'white',\n variant: {\n notice: 'black',\n orange: 'black',\n yellow: 'black',\n charteuse: 'black',\n celery: 'black'\n }\n },\n subtle: 'gray-1000',\n outline: 'gray-1000'\n }\n },\n backgroundColor: {\n fillStyle: {\n bold: {\n variant: {\n accent: 'accent',\n informative: 'informative',\n neutral: 'neutral-subdued',\n positive: 'positive',\n notice: 'notice',\n negative: 'negative',\n gray: 'gray',\n red: 'red',\n orange: 'orange',\n yellow: 'yellow',\n charteuse: 'chartreuse',\n celery: 'celery',\n green: 'green',\n seafoam: 'seafoam',\n cyan: 'cyan',\n blue: 'blue',\n indigo: 'indigo',\n purple: 'purple',\n fuchsia: 'fuchsia',\n magenta: 'magenta',\n pink: 'pink',\n turquoise: 'turquoise',\n brown: 'brown',\n cinnamon: 'cinnamon',\n silver: 'silver'\n }\n },\n subtle: {\n variant: {\n accent: 'accent-subtle',\n informative: 'informative-subtle',\n neutral: 'neutral-subtle',\n positive: 'positive-subtle',\n notice: 'notice-subtle',\n negative: 'negative-subtle',\n gray: 'gray-subtle',\n red: 'red-subtle',\n orange: 'orange-subtle',\n yellow: 'yellow-subtle',\n charteuse: 'chartreuse-subtle',\n celery: 'celery-subtle',\n green: 'green-subtle',\n seafoam: 'seafoam-subtle',\n cyan: 'cyan-subtle',\n blue: 'blue-subtle',\n indigo: 'indigo-subtle',\n purple: 'purple-subtle',\n fuchsia: 'fuchsia-subtle',\n magenta: 'magenta-subtle',\n pink: 'pink-subtle',\n turquoise: 'turquoise-subtle',\n brown: 'brown-subtle',\n cinnamon: 'cinnamon-subtle',\n silver: 'silver-subtle'\n }\n },\n outline: 'layer-2'\n }\n },\n borderStyle: 'solid',\n boxSizing: 'border-box',\n borderWidth: 2,\n borderColor: {\n default: 'transparent',\n fillStyle: {\n outline: {\n variant: {\n accent: lightDark('accent-800', 'accent-900'), // accent-visual-color\n informative: lightDark('informative-800', 'informative-900'), // informative-visual-color\n neutral: lightDark('gray-500', 'gray-600'), // neutral-visual-color\n positive: lightDark('positive-800', 'positive-900'), // positive-visual-color\n notice: lightDark('notice-800', 'notice-900'), // notice-visual-color\n negative: lightDark('negative-800', 'negative-900') // negative-visual-color\n }\n }\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n}, getAllowedOverrides());\n\n/**\n * Badges are used for showing a small amount of color-categorized metadata, ideal for getting a user's attention.\n */\nexport const Badge = forwardRef(function Badge(props: BadgeProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, BadgeContext);\n let {\n children,\n variant = 'neutral',\n size = 'S',\n fillStyle = 'bold',\n ...otherProps\n } = props; // useProviderProps(props) in v3\n let domRef = useDOMRef(ref);\n let isTextOnly = React.Children.toArray(props.children).every(c => !React.isValidElement(c));\n\n return (\n <Provider\n values={[\n [TextContext, {styles: style({paddingY: '--labelPadding', order: 1})}],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n }]\n ]}>\n <SkeletonWrapper>\n <span\n {...filterDOMProps(otherProps)}\n role=\"presentation\"\n className={(props.UNSAFE_className || '') + badge({variant, size, fillStyle}, props.styles)}\n style={props.UNSAFE_style}\n ref={domRef}>\n {\n typeof children === 'string' || isTextOnly\n ? <Text>{children}</Text>\n : children\n }\n </span>\n </SkeletonWrapper>\n </Provider>\n );\n});\n"],"names":[],"version":3,"file":"Badge.css.map"}
1
+ {"mappings":"AC2Dc;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAwJI;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAWsC;;;;EACtC;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AApKJ;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA","sources":["31052c90be0d94da","packages/@react-spectrum/s2/src/Badge.tsx"],"sourcesContent":["@import \"08c4d7ffd2baa021\";\n@import \"1aad76937c73131b\";\n@import \"7989dc282effbbd8\";\n@import \"a50d3ac159f93c2b\";\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 {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {centerBaseline} from './CenterBaseline';\nimport {centerPadding, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {ContextValue, Provider, TextContext as RACTextContext, SlotProps} from 'react-aria-components';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {fontRelative, lightDark, style} from '../style' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport React, {createContext, forwardRef, ReactNode} from 'react';\nimport {SkeletonWrapper} from './Skeleton';\nimport {Text, TextContext} from './Content';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface BadgeStyleProps {\n /**\n * The size of the badge.\n *\n * @default 'S'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /**\n * The variant changes the background color of the badge. When badge has a semantic meaning, they should use the variant for semantic colors.\n *\n * @default 'neutral'\n */\n variant?: 'accent' | 'informative' | 'neutral' | 'positive' | 'notice' | 'negative' | 'gray' | 'red' | 'orange' | 'yellow' | 'chartreuse' | 'celery' | 'green' | 'seafoam' | 'cyan' | 'blue' | 'indigo' | 'purple' | 'fuchsia' | 'magenta' | 'pink' | 'turquoise' | 'brown' | 'cinnamon' | 'silver',\n /**\n * The fill of the badge.\n * @default 'bold'\n */\n fillStyle?: 'bold' | 'subtle' | 'outline',\n /**\n * Sets the text behavior for the contents.\n * @default 'wrap'\n */\n overflowMode?: 'wrap' | 'truncate'\n}\n\nexport interface BadgeProps extends DOMProps, AriaLabelingProps, StyleProps, BadgeStyleProps, SlotProps {\n /**\n * The content to display in the badge.\n */\n children: ReactNode\n}\n\nexport const BadgeContext = createContext<ContextValue<Partial<BadgeProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst badge = style<BadgeStyleProps>({\n display: 'flex',\n font: 'control',\n justifyContent: 'center',\n alignItems: {\n default: 'baseline',\n ':has([slot=icon]:only-child)': 'center'\n },\n borderRadius: 'control',\n minHeight: 'control',\n paddingX: {\n default: 'edge-to-text',\n ':has([slot=icon]:only-child)': 0\n },\n '--labelPadding': {\n type: 'paddingTop',\n value: centerPadding()\n },\n aspectRatio: {\n ':has([slot=icon]:only-child)': 'square'\n },\n '--iconMargin': {\n type: 'marginTop',\n value: {\n default: fontRelative(-2),\n ':has([slot=icon]:only-child)': 0\n }\n },\n columnGap: 'text-to-visual',\n color: {\n fillStyle: {\n bold: {\n default: 'white',\n variant: {\n notice: 'black',\n orange: 'black',\n yellow: 'black',\n chartreuse: 'black',\n celery: 'black'\n }\n },\n subtle: 'gray-1000',\n outline: 'gray-1000'\n }\n },\n backgroundColor: {\n fillStyle: {\n bold: {\n variant: {\n accent: 'accent',\n informative: 'informative',\n neutral: 'neutral-subdued',\n positive: 'positive',\n notice: 'notice',\n negative: 'negative',\n gray: 'gray',\n red: 'red',\n orange: 'orange',\n yellow: 'yellow',\n chartreuse: 'chartreuse',\n celery: 'celery',\n green: 'green',\n seafoam: 'seafoam',\n cyan: 'cyan',\n blue: 'blue',\n indigo: 'indigo',\n purple: 'purple',\n fuchsia: 'fuchsia',\n magenta: 'magenta',\n pink: 'pink',\n turquoise: 'turquoise',\n brown: 'brown',\n cinnamon: 'cinnamon',\n silver: 'silver'\n }\n },\n subtle: {\n variant: {\n accent: 'accent-subtle',\n informative: 'informative-subtle',\n neutral: 'neutral-subtle',\n positive: 'positive-subtle',\n notice: 'notice-subtle',\n negative: 'negative-subtle',\n gray: 'gray-subtle',\n red: 'red-subtle',\n orange: 'orange-subtle',\n yellow: 'yellow-subtle',\n chartreuse: 'chartreuse-subtle',\n celery: 'celery-subtle',\n green: 'green-subtle',\n seafoam: 'seafoam-subtle',\n cyan: 'cyan-subtle',\n blue: 'blue-subtle',\n indigo: 'indigo-subtle',\n purple: 'purple-subtle',\n fuchsia: 'fuchsia-subtle',\n magenta: 'magenta-subtle',\n pink: 'pink-subtle',\n turquoise: 'turquoise-subtle',\n brown: 'brown-subtle',\n cinnamon: 'cinnamon-subtle',\n silver: 'silver-subtle'\n }\n },\n outline: 'layer-2'\n }\n },\n borderStyle: 'solid',\n boxSizing: 'border-box',\n borderWidth: 2,\n borderColor: {\n default: 'transparent',\n fillStyle: {\n outline: {\n variant: {\n accent: lightDark('accent-800', 'accent-900'), // accent-visual-color\n informative: lightDark('informative-800', 'informative-900'), // informative-visual-color\n neutral: lightDark('gray-500', 'gray-600'), // neutral-visual-color\n positive: lightDark('positive-800', 'positive-900'), // positive-visual-color\n notice: lightDark('notice-800', 'notice-900'), // notice-visual-color\n negative: lightDark('negative-800', 'negative-900') // negative-visual-color\n }\n }\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n}, getAllowedOverrides());\n\n/**\n * Badges are used for showing a small amount of color-categorized metadata, ideal for getting a user's attention.\n */\nexport const Badge = forwardRef(function Badge(props: BadgeProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, BadgeContext);\n let {\n children,\n variant = 'neutral',\n size = 'S',\n fillStyle = 'bold',\n overflowMode = 'wrap',\n ...otherProps\n } = props; // useProviderProps(props) in v3\n let domRef = useDOMRef(ref);\n let isTextOnly = React.Children.toArray(props.children).every(c => !React.isValidElement(c));\n\n return (\n <Provider\n values={[\n [TextContext, {\n styles: style({\n paddingY: '--labelPadding',\n order: 1,\n overflowX: 'hidden',\n overflowY: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: {overflowMode: {truncate: 'nowrap', wrap: 'normal'}}\n })({overflowMode})\n }],\n [RACTextContext, {}],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n }]\n ]}>\n <SkeletonWrapper>\n <span\n {...filterDOMProps(otherProps)}\n role=\"presentation\"\n className={(props.UNSAFE_className || '') + badge({variant, size, fillStyle}, props.styles)}\n style={props.UNSAFE_style}\n ref={domRef}>\n {\n typeof children === 'string' || isTextOnly\n ? <Text>{children}</Text>\n : children\n }\n </span>\n </SkeletonWrapper>\n </Provider>\n );\n});\n"],"names":[],"version":3,"file":"Badge.css.map"}
package/dist/Badge.mjs CHANGED
@@ -5,7 +5,7 @@ import {SkeletonWrapper as $5ad421ec19460c48$export$6069cbe61f690103} from "../i
5
5
  import {Text as $8e847109a6ab556d$export$5f1af8db9871e1d6, TextContext as $8e847109a6ab556d$export$9afb8bc826b033ea} from "./Content.mjs";
6
6
  import {useSpectrumContextProps as $5ce63c423902f47d$export$764f6146fadd77f7} from "../icons/useSpectrumContextProps.mjs";
7
7
  import {jsx as $22gMo$jsx} from "react/jsx-runtime";
8
- import {Provider as $22gMo$Provider} from "react-aria-components";
8
+ import {Provider as $22gMo$Provider, TextContext as $22gMo$TextContext} from "react-aria-components";
9
9
  import {filterDOMProps as $22gMo$filterDOMProps} from "@react-aria/utils";
10
10
  import $22gMo$react, {createContext as $22gMo$createContext, forwardRef as $22gMo$forwardRef} from "react";
11
11
  import {useDOMRef as $22gMo$useDOMRef} from "@react-spectrum/utils";
@@ -67,14 +67,15 @@ const $6357025487dea614$var$badge = function anonymous(props, overrides) {
67
67
  else if (props.fillStyle === "subtle") rules += ' ap';
68
68
  else if (props.fillStyle === "bold") {
69
69
  if (props.variant === "celery") rules += ' ab';
70
- else if (props.variant === "charteuse") rules += ' ab';
70
+ else if (props.variant === "chartreuse") rules += ' ab';
71
71
  else if (props.variant === "yellow") rules += ' ab';
72
72
  else if (props.variant === "orange") rules += ' ab';
73
73
  else if (props.variant === "notice") rules += ' ab';
74
74
  else rules += ' ac';
75
75
  }
76
76
  rules += ' _3d';
77
- rules += ' _2c';
77
+ rules += ' _2-1dz4pg9c';
78
+ rules += ' _2d';
78
79
  rules += ' _wh';
79
80
  rules += ' _xh';
80
81
  rules += ' _yh';
@@ -106,7 +107,7 @@ const $6357025487dea614$var$badge = function anonymous(props, overrides) {
106
107
  else if (props.variant === "seafoam") rules += ' b______c';
107
108
  else if (props.variant === "green") rules += ' b_____2';
108
109
  else if (props.variant === "celery") rules += ' b______a';
109
- else if (props.variant === "charteuse") rules += ' b_____8';
110
+ else if (props.variant === "chartreuse") rules += ' b_____8';
110
111
  else if (props.variant === "yellow") rules += ' b_____6';
111
112
  else if (props.variant === "orange") rules += ' b_____4';
112
113
  else if (props.variant === "red") rules += ' b_____Z';
@@ -132,7 +133,7 @@ const $6357025487dea614$var$badge = function anonymous(props, overrides) {
132
133
  else if (props.variant === "seafoam") rules += ' b______b';
133
134
  else if (props.variant === "green") rules += ' b_____0';
134
135
  else if (props.variant === "celery") rules += ' b_____9';
135
- else if (props.variant === "charteuse") rules += ' b_____7';
136
+ else if (props.variant === "chartreuse") rules += ' b_____7';
136
137
  else if (props.variant === "yellow") rules += ' b_____5';
137
138
  else if (props.variant === "orange") rules += ' b_____3';
138
139
  else if (props.variant === "red") rules += ' b_____X';
@@ -189,27 +190,44 @@ const $6357025487dea614$var$badge = function anonymous(props, overrides) {
189
190
  rules += ' -_375tp1_v-c';
190
191
  return rules;
191
192
  };
192
- const $6357025487dea614$export$37acb3580601e69a = /*#__PURE__*/ (0, $22gMo$forwardRef)(function Badge(props, ref) {
193
- [props, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props, ref, $6357025487dea614$export$1d4627584e49159a);
194
- let { children: children, variant: variant = 'neutral', size: size = 'S', fillStyle: fillStyle = 'bold', ...otherProps } = props; // useProviderProps(props) in v3
193
+ const $6357025487dea614$export$37acb3580601e69a = /*#__PURE__*/ (0, $22gMo$forwardRef)(function Badge(props1, ref) {
194
+ [props1, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props1, ref, $6357025487dea614$export$1d4627584e49159a);
195
+ let { children: children, variant: variant = 'neutral', size: size = 'S', fillStyle: fillStyle = 'bold', overflowMode: overflowMode = 'wrap', ...otherProps } = props1; // useProviderProps(props) in v3
195
196
  let domRef = (0, $22gMo$useDOMRef)(ref);
196
- let isTextOnly = (0, $22gMo$react).Children.toArray(props.children).every((c)=>!/*#__PURE__*/ (0, $22gMo$react).isValidElement(c));
197
+ let isTextOnly = (0, $22gMo$react).Children.toArray(props1.children).every((c)=>!/*#__PURE__*/ (0, $22gMo$react).isValidElement(c));
197
198
  return /*#__PURE__*/ (0, $22gMo$jsx)((0, $22gMo$Provider), {
198
199
  values: [
199
200
  [
200
201
  (0, $8e847109a6ab556d$export$9afb8bc826b033ea),
201
202
  {
202
- styles: " . E-1gogtue F-1gogtue __B-3t1y"
203
+ styles: function anonymous(props) {
204
+ let rules = " .";
205
+ rules += ' E-1gogtue';
206
+ rules += ' F-1gogtue';
207
+ rules += ' __B-3t1y';
208
+ rules += ' __wb';
209
+ rules += ' __xb';
210
+ rules += ' _na';
211
+ if (props.overflowMode === "wrap") rules += ' _qa';
212
+ else if (props.overflowMode === "truncate") rules += ' _qb';
213
+ return rules;
214
+ }({
215
+ overflowMode: overflowMode
216
+ })
203
217
  }
204
218
  ],
219
+ [
220
+ (0, $22gMo$TextContext),
221
+ {}
222
+ ],
205
223
  [
206
224
  (0, $ac8c32e6775ddd1f$export$a49f528ae1a4d0ed),
207
225
  {
208
226
  render: (0, $1f4b04be3f24aae3$export$9d7e2342a7e53afa)({
209
227
  slot: 'icon',
210
- styles: " . __B-3t1x"
228
+ styles: " __B-3t1x"
211
229
  }),
212
- styles: " . l-1sthc3k k-1sthc3k y-oelgqu _9-3t1x"
230
+ styles: " l-1sthc3k k-1sthc3k y-oelgqu _9-3t1x"
213
231
  }
214
232
  ]
215
233
  ],
@@ -217,12 +235,12 @@ const $6357025487dea614$export$37acb3580601e69a = /*#__PURE__*/ (0, $22gMo$forwa
217
235
  children: /*#__PURE__*/ (0, $22gMo$jsx)("span", {
218
236
  ...(0, $22gMo$filterDOMProps)(otherProps),
219
237
  role: "presentation",
220
- className: (props.UNSAFE_className || '') + $6357025487dea614$var$badge({
238
+ className: (props1.UNSAFE_className || '') + $6357025487dea614$var$badge({
221
239
  variant: variant,
222
240
  size: size,
223
241
  fillStyle: fillStyle
224
- }, props.styles),
225
- style: props.UNSAFE_style,
242
+ }, props1.styles),
243
+ style: props1.UNSAFE_style,
226
244
  ref: domRef,
227
245
  children: typeof children === 'string' || isTextOnly ? /*#__PURE__*/ (0, $22gMo$jsx)((0, $8e847109a6ab556d$export$5f1af8db9871e1d6), {
228
246
  children: children