@flowstack-ui/brick 0.1.6 → 0.1.11

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 (602) hide show
  1. package/README.md +13 -7
  2. package/dist/agents/accordion.json +17 -2
  3. package/dist/agents/accordion.md +5 -1
  4. package/dist/agents/alert-dialog.json +111 -0
  5. package/dist/agents/alert-dialog.md +53 -0
  6. package/dist/agents/app-bar.json +5 -4
  7. package/dist/agents/app-bar.md +4 -3
  8. package/dist/agents/aspect-ratio.json +80 -0
  9. package/dist/agents/aspect-ratio.md +45 -0
  10. package/dist/agents/avatar.json +92 -0
  11. package/dist/agents/avatar.md +49 -0
  12. package/dist/agents/badge.json +26 -8
  13. package/dist/agents/badge.md +11 -6
  14. package/dist/agents/bleed.json +54 -0
  15. package/dist/agents/bleed.md +39 -0
  16. package/dist/agents/button.json +7 -2
  17. package/dist/agents/button.md +1 -1
  18. package/dist/agents/card.json +21 -1
  19. package/dist/agents/card.md +7 -1
  20. package/dist/agents/checkbox-group.json +108 -0
  21. package/dist/agents/checkbox-group.md +56 -0
  22. package/dist/agents/checkbox.json +6 -1
  23. package/dist/agents/chip.json +73 -0
  24. package/dist/agents/chip.md +44 -0
  25. package/dist/agents/code-block.json +76 -0
  26. package/dist/agents/code-block.md +47 -0
  27. package/dist/agents/code.json +67 -0
  28. package/dist/agents/code.md +42 -0
  29. package/dist/agents/collapsible.json +34 -3
  30. package/dist/agents/collapsible.md +10 -3
  31. package/dist/agents/color-picker.json +78 -0
  32. package/dist/agents/color-picker.md +46 -0
  33. package/dist/agents/color-swatch.json +51 -0
  34. package/dist/agents/color-swatch.md +36 -0
  35. package/dist/agents/combobox.json +95 -0
  36. package/dist/agents/combobox.md +51 -0
  37. package/dist/agents/context-menu.json +109 -0
  38. package/dist/agents/context-menu.md +54 -0
  39. package/dist/agents/coverage.json +24579 -0
  40. package/dist/agents/data-grid.json +127 -0
  41. package/dist/agents/data-grid.md +61 -0
  42. package/dist/agents/data-list.json +63 -0
  43. package/dist/agents/data-list.md +41 -0
  44. package/dist/agents/dialog.json +112 -0
  45. package/dist/agents/dialog.md +53 -0
  46. package/dist/agents/dropdown-menu.json +112 -0
  47. package/dist/agents/dropdown-menu.md +56 -0
  48. package/dist/agents/feed.json +84 -0
  49. package/dist/agents/feed.md +48 -0
  50. package/dist/agents/field.json +6 -1
  51. package/dist/agents/fieldset.json +6 -1
  52. package/dist/agents/file-upload.json +93 -0
  53. package/dist/agents/file-upload.md +50 -0
  54. package/dist/agents/form.json +11 -2
  55. package/dist/agents/form.md +2 -1
  56. package/dist/agents/grid.json +18 -1
  57. package/dist/agents/grid.md +6 -0
  58. package/dist/agents/group.json +77 -0
  59. package/dist/agents/group.md +48 -0
  60. package/dist/agents/hide.json +14 -0
  61. package/dist/agents/hide.md +3 -0
  62. package/dist/agents/hover-card.json +94 -0
  63. package/dist/agents/hover-card.md +51 -0
  64. package/dist/agents/icon-button.json +23 -12
  65. package/dist/agents/icon-button.md +12 -8
  66. package/dist/agents/image.json +33 -7
  67. package/dist/agents/image.md +11 -4
  68. package/dist/agents/input.json +7 -2
  69. package/dist/agents/input.md +1 -1
  70. package/dist/agents/interface-composition.json +216 -17
  71. package/dist/agents/interface-composition.md +7 -0
  72. package/dist/agents/layer-selection.json +1174 -11
  73. package/dist/agents/layer-selection.md +84 -1
  74. package/dist/agents/link-box.json +97 -0
  75. package/dist/agents/link-box.md +53 -0
  76. package/dist/agents/link.json +34 -5
  77. package/dist/agents/link.md +12 -2
  78. package/dist/agents/list.json +1 -1
  79. package/dist/agents/list.md +1 -1
  80. package/dist/agents/manifest.json +291 -2
  81. package/dist/agents/menubar.json +109 -0
  82. package/dist/agents/menubar.md +54 -0
  83. package/dist/agents/multi-select.json +93 -0
  84. package/dist/agents/multi-select.md +49 -0
  85. package/dist/agents/nav-list.json +15 -5
  86. package/dist/agents/nav-list.md +6 -4
  87. package/dist/agents/notification-badge.json +88 -0
  88. package/dist/agents/notification-badge.md +49 -0
  89. package/dist/agents/number-input.json +89 -0
  90. package/dist/agents/number-input.md +50 -0
  91. package/dist/agents/otp-field.json +87 -0
  92. package/dist/agents/otp-field.md +48 -0
  93. package/dist/agents/pagination.json +26 -5
  94. package/dist/agents/pagination.md +11 -4
  95. package/dist/agents/password-toggle-field.json +87 -0
  96. package/dist/agents/password-toggle-field.md +48 -0
  97. package/dist/agents/popover.json +114 -0
  98. package/dist/agents/popover.md +56 -0
  99. package/dist/agents/progress-circle.json +85 -0
  100. package/dist/agents/progress-circle.md +46 -0
  101. package/dist/agents/progress.json +91 -0
  102. package/dist/agents/progress.md +48 -0
  103. package/dist/agents/radio-group.json +92 -0
  104. package/dist/agents/radio-group.md +49 -0
  105. package/dist/agents/rating.json +91 -0
  106. package/dist/agents/rating.md +49 -0
  107. package/dist/agents/reorderable-list.json +74 -0
  108. package/dist/agents/reorderable-list.md +45 -0
  109. package/dist/agents/segment-group.json +62 -0
  110. package/dist/agents/segment-group.md +43 -0
  111. package/dist/agents/select.json +95 -0
  112. package/dist/agents/select.md +51 -0
  113. package/dist/agents/show.json +14 -0
  114. package/dist/agents/show.md +3 -0
  115. package/dist/agents/sidebar.json +16 -3
  116. package/dist/agents/sidebar.md +6 -1
  117. package/dist/agents/skeleton.json +73 -0
  118. package/dist/agents/skeleton.md +43 -0
  119. package/dist/agents/slider.json +88 -0
  120. package/dist/agents/slider.md +48 -0
  121. package/dist/agents/stack.json +19 -1
  122. package/dist/agents/stack.md +7 -0
  123. package/dist/agents/status.json +59 -0
  124. package/dist/agents/status.md +40 -0
  125. package/dist/agents/surface.json +42 -3
  126. package/dist/agents/surface.md +12 -2
  127. package/dist/agents/swipeable-item.json +93 -0
  128. package/dist/agents/swipeable-item.md +50 -0
  129. package/dist/agents/switch.json +92 -0
  130. package/dist/agents/switch.md +49 -0
  131. package/dist/agents/table.json +113 -0
  132. package/dist/agents/table.md +59 -0
  133. package/dist/agents/tabs.json +9 -2
  134. package/dist/agents/tabs.md +4 -1
  135. package/dist/agents/text.json +23 -8
  136. package/dist/agents/text.md +10 -7
  137. package/dist/agents/textarea.json +6 -1
  138. package/dist/agents/toast.json +91 -0
  139. package/dist/agents/toast.md +48 -0
  140. package/dist/agents/toggle-group.json +89 -0
  141. package/dist/agents/toggle-group.md +49 -0
  142. package/dist/agents/toggle.json +82 -0
  143. package/dist/agents/toggle.md +47 -0
  144. package/dist/agents/toolbar.json +11 -1
  145. package/dist/agents/toolbar.md +3 -1
  146. package/dist/agents/tooltip.json +96 -0
  147. package/dist/agents/tooltip.md +49 -0
  148. package/dist/agents/tree-grid.json +98 -0
  149. package/dist/agents/tree-grid.md +51 -0
  150. package/dist/agents/tree.json +94 -0
  151. package/dist/agents/tree.md +51 -0
  152. package/dist/agents/visually-hidden.json +70 -0
  153. package/dist/agents/visually-hidden.md +42 -0
  154. package/dist/agents/z-stack.json +21 -1
  155. package/dist/agents/z-stack.md +5 -0
  156. package/dist/bleed.d.ts +2 -0
  157. package/dist/bleed.d.ts.map +1 -0
  158. package/dist/bleed.js +2 -0
  159. package/dist/bleed.js.map +1 -0
  160. package/dist/color-picker.d.ts +2 -0
  161. package/dist/color-picker.d.ts.map +1 -0
  162. package/dist/color-picker.js +2 -0
  163. package/dist/color-picker.js.map +1 -0
  164. package/dist/color-swatch.d.ts +2 -0
  165. package/dist/color-swatch.d.ts.map +1 -0
  166. package/dist/color-swatch.js +2 -0
  167. package/dist/color-swatch.js.map +1 -0
  168. package/dist/components/_responsive-value/ResponsiveValue.d.ts.map +1 -1
  169. package/dist/components/_responsive-value/ResponsiveValue.js +3 -1
  170. package/dist/components/_responsive-value/ResponsiveValue.js.map +1 -1
  171. package/dist/components/_spacing-value/SpacingValue.d.ts +8 -0
  172. package/dist/components/_spacing-value/SpacingValue.d.ts.map +1 -0
  173. package/dist/components/_spacing-value/SpacingValue.js +46 -0
  174. package/dist/components/_spacing-value/SpacingValue.js.map +1 -0
  175. package/dist/components/accordion/Accordion.js +1 -1
  176. package/dist/components/app-bar/AppBar.d.ts +7 -3
  177. package/dist/components/app-bar/AppBar.d.ts.map +1 -1
  178. package/dist/components/app-bar/AppBar.js +2 -2
  179. package/dist/components/app-bar/AppBar.js.map +1 -1
  180. package/dist/components/app-bar/index.d.ts +1 -1
  181. package/dist/components/app-bar/index.d.ts.map +1 -1
  182. package/dist/components/app-bar/index.js.map +1 -1
  183. package/dist/components/avatar/Avatar.d.ts +1 -1
  184. package/dist/components/avatar/Avatar.d.ts.map +1 -1
  185. package/dist/components/avatar/Avatar.js.map +1 -1
  186. package/dist/components/badge/Badge.d.ts +2 -2
  187. package/dist/components/badge/Badge.d.ts.map +1 -1
  188. package/dist/components/bleed/Bleed.d.ts +28 -0
  189. package/dist/components/bleed/Bleed.d.ts.map +1 -0
  190. package/dist/components/bleed/Bleed.js +92 -0
  191. package/dist/components/bleed/Bleed.js.map +1 -0
  192. package/dist/components/bleed/index.d.ts +2 -0
  193. package/dist/components/bleed/index.d.ts.map +1 -0
  194. package/dist/components/bleed/index.js +2 -0
  195. package/dist/components/bleed/index.js.map +1 -0
  196. package/dist/components/collapsible/Collapsible.d.ts +9 -3
  197. package/dist/components/collapsible/Collapsible.d.ts.map +1 -1
  198. package/dist/components/collapsible/Collapsible.js +3 -3
  199. package/dist/components/collapsible/Collapsible.js.map +1 -1
  200. package/dist/components/color-picker/ColorPicker.d.ts +42 -0
  201. package/dist/components/color-picker/ColorPicker.d.ts.map +1 -0
  202. package/dist/components/color-picker/ColorPicker.js +52 -0
  203. package/dist/components/color-picker/ColorPicker.js.map +1 -0
  204. package/dist/components/color-picker/index.d.ts +2 -0
  205. package/dist/components/color-picker/index.d.ts.map +1 -0
  206. package/dist/components/color-picker/index.js +2 -0
  207. package/dist/components/color-picker/index.js.map +1 -0
  208. package/dist/components/color-swatch/ColorSwatch.d.ts +21 -0
  209. package/dist/components/color-swatch/ColorSwatch.d.ts.map +1 -0
  210. package/dist/components/color-swatch/ColorSwatch.js +25 -0
  211. package/dist/components/color-swatch/ColorSwatch.js.map +1 -0
  212. package/dist/components/color-swatch/index.d.ts +2 -0
  213. package/dist/components/color-swatch/index.d.ts.map +1 -0
  214. package/dist/components/color-swatch/index.js +2 -0
  215. package/dist/components/color-swatch/index.js.map +1 -0
  216. package/dist/components/data-list/DataList.d.ts +48 -0
  217. package/dist/components/data-list/DataList.d.ts.map +1 -0
  218. package/dist/components/data-list/DataList.js +31 -0
  219. package/dist/components/data-list/DataList.js.map +1 -0
  220. package/dist/components/data-list/index.d.ts +2 -0
  221. package/dist/components/data-list/index.d.ts.map +1 -0
  222. package/dist/components/data-list/index.js +2 -0
  223. package/dist/components/data-list/index.js.map +1 -0
  224. package/dist/components/feed/Feed.d.ts +2 -0
  225. package/dist/components/feed/Feed.d.ts.map +1 -1
  226. package/dist/components/feed/Feed.js +2 -2
  227. package/dist/components/feed/Feed.js.map +1 -1
  228. package/dist/components/feed/index.d.ts +1 -1
  229. package/dist/components/feed/index.d.ts.map +1 -1
  230. package/dist/components/grid/Grid.d.ts +3 -1
  231. package/dist/components/grid/Grid.d.ts.map +1 -1
  232. package/dist/components/grid/Grid.js +11 -1
  233. package/dist/components/grid/Grid.js.map +1 -1
  234. package/dist/components/grid/index.d.ts +1 -1
  235. package/dist/components/grid/index.d.ts.map +1 -1
  236. package/dist/components/grid/index.js.map +1 -1
  237. package/dist/components/group/Group.d.ts +19 -0
  238. package/dist/components/group/Group.d.ts.map +1 -0
  239. package/dist/components/group/Group.js +23 -0
  240. package/dist/components/group/Group.js.map +1 -0
  241. package/dist/components/group/index.d.ts +2 -0
  242. package/dist/components/group/index.d.ts.map +1 -0
  243. package/dist/components/group/index.js +2 -0
  244. package/dist/components/group/index.js.map +1 -0
  245. package/dist/components/link/Link.d.ts +1 -1
  246. package/dist/components/link/Link.d.ts.map +1 -1
  247. package/dist/components/link/Link.js +1 -1
  248. package/dist/components/link/Link.js.map +1 -1
  249. package/dist/components/link-box/LinkBox.d.ts +22 -0
  250. package/dist/components/link-box/LinkBox.d.ts.map +1 -0
  251. package/dist/components/link-box/LinkBox.js +30 -0
  252. package/dist/components/link-box/LinkBox.js.map +1 -0
  253. package/dist/components/link-box/index.d.ts +2 -0
  254. package/dist/components/link-box/index.d.ts.map +1 -0
  255. package/dist/components/link-box/index.js +2 -0
  256. package/dist/components/link-box/index.js.map +1 -0
  257. package/dist/components/nav-list/NavList.d.ts +15 -2
  258. package/dist/components/nav-list/NavList.d.ts.map +1 -1
  259. package/dist/components/nav-list/NavList.js +4 -3
  260. package/dist/components/nav-list/NavList.js.map +1 -1
  261. package/dist/components/pagination/Pagination.d.ts +9 -6
  262. package/dist/components/pagination/Pagination.d.ts.map +1 -1
  263. package/dist/components/pagination/Pagination.js +2 -2
  264. package/dist/components/pagination/Pagination.js.map +1 -1
  265. package/dist/components/pagination/index.d.ts +1 -1
  266. package/dist/components/pagination/index.d.ts.map +1 -1
  267. package/dist/components/pagination/index.js.map +1 -1
  268. package/dist/components/popover/Popover.d.ts +3 -0
  269. package/dist/components/popover/Popover.d.ts.map +1 -1
  270. package/dist/components/popover/Popover.js +2 -2
  271. package/dist/components/popover/Popover.js.map +1 -1
  272. package/dist/components/popover/index.d.ts +1 -1
  273. package/dist/components/popover/index.d.ts.map +1 -1
  274. package/dist/components/popover/index.js.map +1 -1
  275. package/dist/components/rating/Rating.d.ts +37 -1
  276. package/dist/components/rating/Rating.d.ts.map +1 -1
  277. package/dist/components/rating/Rating.js +25 -2
  278. package/dist/components/rating/Rating.js.map +1 -1
  279. package/dist/components/rating/index.d.ts +1 -1
  280. package/dist/components/rating/index.d.ts.map +1 -1
  281. package/dist/components/rating/index.js +1 -1
  282. package/dist/components/rating/index.js.map +1 -1
  283. package/dist/components/reorderable-list/ReorderableList.d.ts +89 -0
  284. package/dist/components/reorderable-list/ReorderableList.d.ts.map +1 -0
  285. package/dist/components/reorderable-list/ReorderableList.js +54 -0
  286. package/dist/components/reorderable-list/ReorderableList.js.map +1 -0
  287. package/dist/components/reorderable-list/index.d.ts +2 -0
  288. package/dist/components/reorderable-list/index.d.ts.map +1 -0
  289. package/dist/components/reorderable-list/index.js +2 -0
  290. package/dist/components/reorderable-list/index.js.map +1 -0
  291. package/dist/components/segment-group/SegmentGroup.d.ts +30 -0
  292. package/dist/components/segment-group/SegmentGroup.d.ts.map +1 -0
  293. package/dist/components/segment-group/SegmentGroup.js +67 -0
  294. package/dist/components/segment-group/SegmentGroup.js.map +1 -0
  295. package/dist/components/segment-group/index.d.ts +2 -0
  296. package/dist/components/segment-group/index.d.ts.map +1 -0
  297. package/dist/components/segment-group/index.js +2 -0
  298. package/dist/components/segment-group/index.js.map +1 -0
  299. package/dist/components/show/Show.d.ts.map +1 -1
  300. package/dist/components/show/Show.js +7 -1
  301. package/dist/components/show/Show.js.map +1 -1
  302. package/dist/components/sidebar/Sidebar.d.ts +4 -0
  303. package/dist/components/sidebar/Sidebar.d.ts.map +1 -1
  304. package/dist/components/sidebar/Sidebar.js +3 -2
  305. package/dist/components/sidebar/Sidebar.js.map +1 -1
  306. package/dist/components/slider/Slider.d.ts.map +1 -1
  307. package/dist/components/slider/Slider.js +3 -1
  308. package/dist/components/slider/Slider.js.map +1 -1
  309. package/dist/components/stack/Stack.d.ts +3 -1
  310. package/dist/components/stack/Stack.d.ts.map +1 -1
  311. package/dist/components/stack/Stack.js +9 -1
  312. package/dist/components/stack/Stack.js.map +1 -1
  313. package/dist/components/stack/index.d.ts +1 -1
  314. package/dist/components/stack/index.d.ts.map +1 -1
  315. package/dist/components/stack/index.js.map +1 -1
  316. package/dist/components/status/Status.d.ts +22 -0
  317. package/dist/components/status/Status.d.ts.map +1 -0
  318. package/dist/components/status/Status.js +23 -0
  319. package/dist/components/status/Status.js.map +1 -0
  320. package/dist/components/status/index.d.ts +2 -0
  321. package/dist/components/status/index.d.ts.map +1 -0
  322. package/dist/components/status/index.js +2 -0
  323. package/dist/components/status/index.js.map +1 -0
  324. package/dist/components/surface/Surface.d.ts +5 -2
  325. package/dist/components/surface/Surface.d.ts.map +1 -1
  326. package/dist/components/surface/Surface.js +4 -2
  327. package/dist/components/surface/Surface.js.map +1 -1
  328. package/dist/components/surface/index.d.ts +1 -1
  329. package/dist/components/surface/index.d.ts.map +1 -1
  330. package/dist/components/surface/index.js.map +1 -1
  331. package/dist/components/text/Text.d.ts +25 -4
  332. package/dist/components/text/Text.d.ts.map +1 -1
  333. package/dist/components/text/Text.js +22 -3
  334. package/dist/components/text/Text.js.map +1 -1
  335. package/dist/components/text/index.d.ts +1 -1
  336. package/dist/components/text/index.d.ts.map +1 -1
  337. package/dist/components/text/index.js +1 -1
  338. package/dist/components/text/index.js.map +1 -1
  339. package/dist/components/toggle/Toggle.d.ts +5 -0
  340. package/dist/components/toggle/Toggle.d.ts.map +1 -1
  341. package/dist/components/toggle/Toggle.js +2 -2
  342. package/dist/components/toggle/Toggle.js.map +1 -1
  343. package/dist/components/toggle/index.d.ts +1 -1
  344. package/dist/components/toggle/index.d.ts.map +1 -1
  345. package/dist/components/toggle/index.js.map +1 -1
  346. package/dist/components/toggle-group/ToggleGroup.d.ts +3 -1
  347. package/dist/components/toggle-group/ToggleGroup.d.ts.map +1 -1
  348. package/dist/components/toggle-group/ToggleGroup.js +2 -1
  349. package/dist/components/toggle-group/ToggleGroup.js.map +1 -1
  350. package/dist/components/toolbar/Toolbar.d.ts +9 -2
  351. package/dist/components/toolbar/Toolbar.d.ts.map +1 -1
  352. package/dist/components/toolbar/Toolbar.js +2 -2
  353. package/dist/components/toolbar/Toolbar.js.map +1 -1
  354. package/dist/components/toolbar/index.d.ts +1 -1
  355. package/dist/components/toolbar/index.d.ts.map +1 -1
  356. package/dist/components/z-stack/ZStack.d.ts +7 -0
  357. package/dist/components/z-stack/ZStack.d.ts.map +1 -1
  358. package/dist/components/z-stack/ZStack.js +14 -3
  359. package/dist/components/z-stack/ZStack.js.map +1 -1
  360. package/dist/components/z-stack/index.d.ts +1 -1
  361. package/dist/components/z-stack/index.d.ts.map +1 -1
  362. package/dist/components/z-stack/index.js.map +1 -1
  363. package/dist/data-list.d.ts +2 -0
  364. package/dist/data-list.d.ts.map +1 -0
  365. package/dist/data-list.js +2 -0
  366. package/dist/data-list.js.map +1 -0
  367. package/dist/feed.d.ts +1 -1
  368. package/dist/feed.d.ts.map +1 -1
  369. package/dist/grid.d.ts +1 -1
  370. package/dist/grid.d.ts.map +1 -1
  371. package/dist/grid.js.map +1 -1
  372. package/dist/group.d.ts +2 -0
  373. package/dist/group.d.ts.map +1 -0
  374. package/dist/group.js +2 -0
  375. package/dist/group.js.map +1 -0
  376. package/dist/index.d.ts +18 -8
  377. package/dist/index.d.ts.map +1 -1
  378. package/dist/index.js +10 -1
  379. package/dist/index.js.map +1 -1
  380. package/dist/link-box.d.ts +2 -0
  381. package/dist/link-box.d.ts.map +1 -0
  382. package/dist/link-box.js +2 -0
  383. package/dist/link-box.js.map +1 -0
  384. package/dist/reorderable-list.d.ts +2 -0
  385. package/dist/reorderable-list.d.ts.map +1 -0
  386. package/dist/reorderable-list.js +2 -0
  387. package/dist/reorderable-list.js.map +1 -0
  388. package/dist/reset.css +1 -1
  389. package/dist/reset.css.map +1 -1
  390. package/dist/segment-group.d.ts +2 -0
  391. package/dist/segment-group.d.ts.map +1 -0
  392. package/dist/segment-group.js +2 -0
  393. package/dist/segment-group.js.map +1 -0
  394. package/dist/stack.d.ts +1 -1
  395. package/dist/stack.d.ts.map +1 -1
  396. package/dist/stack.js.map +1 -1
  397. package/dist/status.d.ts +2 -0
  398. package/dist/status.d.ts.map +1 -0
  399. package/dist/status.js +2 -0
  400. package/dist/status.js.map +1 -0
  401. package/dist/styles/accordion.css +1 -1
  402. package/dist/styles/accordion.css.map +1 -1
  403. package/dist/styles/alert-dialog.css +1 -1
  404. package/dist/styles/alert-dialog.css.map +1 -1
  405. package/dist/styles/app-bar.css +1 -1
  406. package/dist/styles/app-bar.css.map +1 -1
  407. package/dist/styles/appearance.css +1 -1
  408. package/dist/styles/appearance.css.map +1 -1
  409. package/dist/styles/aspect-ratio.css +1 -1
  410. package/dist/styles/aspect-ratio.css.map +1 -1
  411. package/dist/styles/avatar.css +1 -1
  412. package/dist/styles/avatar.css.map +1 -1
  413. package/dist/styles/badge.css +1 -1
  414. package/dist/styles/badge.css.map +1 -1
  415. package/dist/styles/bleed.css +2 -0
  416. package/dist/styles/bleed.css.map +1 -0
  417. package/dist/styles/bottom-navigation.css +1 -1
  418. package/dist/styles/bottom-navigation.css.map +1 -1
  419. package/dist/styles/breadcrumb.css +1 -1
  420. package/dist/styles/breadcrumb.css.map +1 -1
  421. package/dist/styles/button.css +1 -1
  422. package/dist/styles/button.css.map +1 -1
  423. package/dist/styles/card.css +1 -1
  424. package/dist/styles/card.css.map +1 -1
  425. package/dist/styles/carousel.css +1 -1
  426. package/dist/styles/carousel.css.map +1 -1
  427. package/dist/styles/checkbox-group.css +1 -1
  428. package/dist/styles/checkbox-group.css.map +1 -1
  429. package/dist/styles/checkbox.css +1 -1
  430. package/dist/styles/checkbox.css.map +1 -1
  431. package/dist/styles/chip.css +1 -1
  432. package/dist/styles/chip.css.map +1 -1
  433. package/dist/styles/code-block.css +1 -1
  434. package/dist/styles/code-block.css.map +1 -1
  435. package/dist/styles/code.css +1 -1
  436. package/dist/styles/code.css.map +1 -1
  437. package/dist/styles/collapsible.css +1 -1
  438. package/dist/styles/collapsible.css.map +1 -1
  439. package/dist/styles/color-picker.css +2 -0
  440. package/dist/styles/color-picker.css.map +1 -0
  441. package/dist/styles/color-swatch.css +2 -0
  442. package/dist/styles/color-swatch.css.map +1 -0
  443. package/dist/styles/combobox.css +1 -1
  444. package/dist/styles/combobox.css.map +1 -1
  445. package/dist/styles/container.css +1 -1
  446. package/dist/styles/container.css.map +1 -1
  447. package/dist/styles/context-menu.css +1 -1
  448. package/dist/styles/context-menu.css.map +1 -1
  449. package/dist/styles/core.css +1 -1
  450. package/dist/styles/core.css.map +1 -1
  451. package/dist/styles/data-grid.css +1 -1
  452. package/dist/styles/data-grid.css.map +1 -1
  453. package/dist/styles/data-list.css +2 -0
  454. package/dist/styles/data-list.css.map +1 -0
  455. package/dist/styles/dialog.css +1 -1
  456. package/dist/styles/dialog.css.map +1 -1
  457. package/dist/styles/divider.css +1 -1
  458. package/dist/styles/divider.css.map +1 -1
  459. package/dist/styles/drawer.css +1 -1
  460. package/dist/styles/drawer.css.map +1 -1
  461. package/dist/styles/dropdown-menu.css +1 -1
  462. package/dist/styles/dropdown-menu.css.map +1 -1
  463. package/dist/styles/feed.css +1 -1
  464. package/dist/styles/feed.css.map +1 -1
  465. package/dist/styles/field.css +1 -1
  466. package/dist/styles/field.css.map +1 -1
  467. package/dist/styles/fieldset.css +1 -1
  468. package/dist/styles/fieldset.css.map +1 -1
  469. package/dist/styles/file-upload.css +1 -1
  470. package/dist/styles/file-upload.css.map +1 -1
  471. package/dist/styles/form.css +1 -1
  472. package/dist/styles/form.css.map +1 -1
  473. package/dist/styles/frame.css +1 -1
  474. package/dist/styles/frame.css.map +1 -1
  475. package/dist/styles/grid.css +1 -1
  476. package/dist/styles/grid.css.map +1 -1
  477. package/dist/styles/group.css +2 -0
  478. package/dist/styles/group.css.map +1 -0
  479. package/dist/styles/hide.css +1 -1
  480. package/dist/styles/hide.css.map +1 -1
  481. package/dist/styles/hover-card.css +1 -1
  482. package/dist/styles/hover-card.css.map +1 -1
  483. package/dist/styles/icon-button.css +1 -1
  484. package/dist/styles/icon-button.css.map +1 -1
  485. package/dist/styles/icon.css +1 -1
  486. package/dist/styles/icon.css.map +1 -1
  487. package/dist/styles/image.css +1 -1
  488. package/dist/styles/image.css.map +1 -1
  489. package/dist/styles/input.css +1 -1
  490. package/dist/styles/input.css.map +1 -1
  491. package/dist/styles/link-box.css +2 -0
  492. package/dist/styles/link-box.css.map +1 -0
  493. package/dist/styles/link.css +1 -1
  494. package/dist/styles/link.css.map +1 -1
  495. package/dist/styles/list.css +1 -1
  496. package/dist/styles/list.css.map +1 -1
  497. package/dist/styles/menubar.css +1 -1
  498. package/dist/styles/menubar.css.map +1 -1
  499. package/dist/styles/multi-select.css +1 -1
  500. package/dist/styles/multi-select.css.map +1 -1
  501. package/dist/styles/nav-list.css +1 -1
  502. package/dist/styles/nav-list.css.map +1 -1
  503. package/dist/styles/navigation-menu.css +1 -1
  504. package/dist/styles/navigation-menu.css.map +1 -1
  505. package/dist/styles/number-input.css +1 -1
  506. package/dist/styles/number-input.css.map +1 -1
  507. package/dist/styles/otp-field.css +1 -1
  508. package/dist/styles/otp-field.css.map +1 -1
  509. package/dist/styles/pagination.css +1 -1
  510. package/dist/styles/pagination.css.map +1 -1
  511. package/dist/styles/password-toggle-field.css +1 -1
  512. package/dist/styles/password-toggle-field.css.map +1 -1
  513. package/dist/styles/popover.css +1 -1
  514. package/dist/styles/popover.css.map +1 -1
  515. package/dist/styles/progress-circle.css +1 -1
  516. package/dist/styles/progress-circle.css.map +1 -1
  517. package/dist/styles/progress.css +1 -1
  518. package/dist/styles/progress.css.map +1 -1
  519. package/dist/styles/radio-group.css +1 -1
  520. package/dist/styles/radio-group.css.map +1 -1
  521. package/dist/styles/rating.css +1 -1
  522. package/dist/styles/rating.css.map +1 -1
  523. package/dist/styles/reorderable-list.css +2 -0
  524. package/dist/styles/reorderable-list.css.map +1 -0
  525. package/dist/styles/scroll-area.css +1 -1
  526. package/dist/styles/scroll-area.css.map +1 -1
  527. package/dist/styles/section.css +1 -1
  528. package/dist/styles/section.css.map +1 -1
  529. package/dist/styles/segment-group.css +2 -0
  530. package/dist/styles/segment-group.css.map +1 -0
  531. package/dist/styles/select.css +1 -1
  532. package/dist/styles/select.css.map +1 -1
  533. package/dist/styles/show.css +1 -1
  534. package/dist/styles/show.css.map +1 -1
  535. package/dist/styles/sidebar.css +1 -1
  536. package/dist/styles/sidebar.css.map +1 -1
  537. package/dist/styles/skeleton.css +1 -1
  538. package/dist/styles/skeleton.css.map +1 -1
  539. package/dist/styles/skip-link.css +1 -1
  540. package/dist/styles/skip-link.css.map +1 -1
  541. package/dist/styles/slider.css +1 -1
  542. package/dist/styles/slider.css.map +1 -1
  543. package/dist/styles/stack.css +1 -1
  544. package/dist/styles/stack.css.map +1 -1
  545. package/dist/styles/status.css +2 -0
  546. package/dist/styles/status.css.map +1 -0
  547. package/dist/styles/surface.css +1 -1
  548. package/dist/styles/surface.css.map +1 -1
  549. package/dist/styles/swipeable-item.css +1 -1
  550. package/dist/styles/swipeable-item.css.map +1 -1
  551. package/dist/styles/switch.css +1 -1
  552. package/dist/styles/switch.css.map +1 -1
  553. package/dist/styles/table.css +1 -1
  554. package/dist/styles/table.css.map +1 -1
  555. package/dist/styles/tabs.css +1 -1
  556. package/dist/styles/tabs.css.map +1 -1
  557. package/dist/styles/text.css +1 -1
  558. package/dist/styles/text.css.map +1 -1
  559. package/dist/styles/textarea.css +1 -1
  560. package/dist/styles/textarea.css.map +1 -1
  561. package/dist/styles/toast.css +1 -1
  562. package/dist/styles/toast.css.map +1 -1
  563. package/dist/styles/toggle-group.css +1 -1
  564. package/dist/styles/toggle-group.css.map +1 -1
  565. package/dist/styles/toggle.css +1 -1
  566. package/dist/styles/toggle.css.map +1 -1
  567. package/dist/styles/toolbar.css +1 -1
  568. package/dist/styles/toolbar.css.map +1 -1
  569. package/dist/styles/tooltip.css +1 -1
  570. package/dist/styles/tooltip.css.map +1 -1
  571. package/dist/styles/tree-grid.css +1 -1
  572. package/dist/styles/tree-grid.css.map +1 -1
  573. package/dist/styles/tree.css +1 -1
  574. package/dist/styles/tree.css.map +1 -1
  575. package/dist/styles/visually-hidden.css +1 -1
  576. package/dist/styles/visually-hidden.css.map +1 -1
  577. package/dist/styles/z-stack.css +1 -1
  578. package/dist/styles/z-stack.css.map +1 -1
  579. package/dist/styles.css +1 -1
  580. package/dist/styles.css.map +1 -1
  581. package/dist/surface.d.ts +1 -1
  582. package/dist/surface.d.ts.map +1 -1
  583. package/dist/surface.js.map +1 -1
  584. package/dist/text.d.ts +1 -1
  585. package/dist/text.d.ts.map +1 -1
  586. package/dist/text.js +1 -1
  587. package/dist/text.js.map +1 -1
  588. package/dist/theme-contract.json +26846 -0
  589. package/dist/toggle.d.ts +1 -1
  590. package/dist/toggle.d.ts.map +1 -1
  591. package/dist/toggle.js.map +1 -1
  592. package/dist/tokens.css +1 -1
  593. package/dist/tokens.css.map +1 -1
  594. package/dist/toolbar.d.ts +1 -1
  595. package/dist/toolbar.d.ts.map +1 -1
  596. package/docs/guides/agent-knowledge.md +19 -0
  597. package/docs/guides/appearance-and-tokens.md +16 -5
  598. package/docs/guides/browser-support.md +21 -0
  599. package/docs/guides/control-sizing.md +55 -0
  600. package/docs/guides/installation.md +5 -2
  601. package/docs/guides/theme-contract.md +86 -0
  602. package/package.json +51 -7
package/dist/styles/checkbox.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":null,"mappings":"ACAA,sCAAA,wBCCE,63BAiBA,0vCAuCA,oIAQA,8GAQA,oPASA,w2BAqBA,2JAOA,qFAOA,8IAQA,mCAIA,+aAeA,6IAQA,8IAQA,6IAQA,8KAQA,yKAQA,sKAUA,kNASA,4IAQA,yQAQA,4PAOA,mTASA,wUASA,wCACE,qKAQA,wXAkBF,uCACE,gIAUF,8BACE,0HASA,kEAKA,8TAeA,qOAOA,wNAOA,0HDtUJ","sources":["home/runner/work/brick/brick/.brick-cache/production/checkbox.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/checkbox/checkbox.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/checkbox/checkbox.css\";","@layer brick.tokens, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n :where(.brick-checkbox, .brick-checkbox-group) {\n --brick-checkbox-control-size: 1.125rem;\n --brick-checkbox-target-min-size: var(--brick-control-target-min);\n --brick-checkbox-gap: var(--brick-space-2);\n --brick-checkbox-border-width: var(--brick-border-width);\n --brick-checkbox-radius: var(--brick-radius-subtle);\n --brick-checkbox-indicator-size: 0.875rem;\n --brick-checkbox-row-padding-inline: var(--brick-space-2);\n --brick-checkbox-label-foreground: var(--brick-color-text-primary);\n --brick-checkbox-description-foreground: var(--brick-color-text-secondary);\n --brick-checkbox-control-background: var(--brick-color-surface-raised);\n --brick-checkbox-control-border: var(--brick-color-border-strong);\n --brick-checkbox-control-checked-background: var(--brick-color-accent-solid);\n --brick-checkbox-control-checked-foreground: var(--brick-color-accent-on-solid);\n --brick-checkbox-invalid-foreground: var(--brick-color-danger-text);\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n ) {\n display: grid;\n box-sizing: border-box;\n min-inline-size: 0;\n max-inline-size: 100%;\n min-block-size: var(--brick-checkbox-target-min-size);\n grid-template-columns: var(--brick-checkbox-control-size) minmax(0, 1fr);\n grid-auto-rows: min-content;\n align-content: center;\n align-items: center;\n gap: 0 var(--brick-checkbox-gap);\n padding-block: var(--brick-space-1);\n padding-inline: var(--brick-checkbox-row-padding-inline);\n border: 0;\n border-radius: var(--brick-checkbox-radius);\n appearance: none;\n background: transparent;\n color: var(--brick-checkbox-label-foreground);\n font: inherit;\n font-family: var(--brick-typography-body-md-font-family);\n font-size: var(--brick-typography-body-md-font-size);\n font-weight: var(--brick-typography-body-md-font-weight);\n letter-spacing: var(--brick-typography-body-md-letter-spacing);\n line-height: var(--brick-typography-body-md-line-height);\n overflow-wrap: anywhere;\n text-align: start;\n text-decoration: none;\n user-select: none;\n vertical-align: middle;\n transition:\n background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n box-shadow var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n ):not([data-disabled], [data-readonly]) {\n cursor: pointer;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-readonly] {\n cursor: default;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n ):is(:focus-visible, [data-focus-visible]) {\n outline: var(--brick-border-focus-width) solid var(--brick-color-focus-ring);\n outline-offset: var(--brick-border-focus-offset);\n }\n\n .brick-checkbox-control {\n display: grid;\n box-sizing: border-box;\n inline-size: var(--brick-checkbox-control-size);\n block-size: var(--brick-checkbox-control-size);\n grid-column: 1;\n grid-row: 1 / span 2;\n place-items: center;\n align-self: start;\n margin-block-start: calc((var(--brick-font-size-md) * var(--brick-font-line-height-body) - var(--brick-checkbox-control-size)) / 2);\n border: var(--brick-checkbox-border-width) solid var(--brick-checkbox-control-border);\n border-radius: var(--brick-checkbox-radius);\n background: var(--brick-checkbox-control-background);\n color: transparent;\n transition:\n background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n transform var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);\n }\n\n .brick-checkbox-indicator {\n display: grid;\n inline-size: var(--brick-checkbox-indicator-size);\n block-size: var(--brick-checkbox-indicator-size);\n place-items: center;\n }\n\n .brick-checkbox-mark {\n display: block;\n inline-size: 100%;\n block-size: 100%;\n overflow: visible;\n }\n\n :where(.brick-checkbox-check, .brick-checkbox-mixed) {\n fill: none;\n stroke: currentColor;\n stroke-linecap: round;\n stroke-linejoin: round;\n stroke-width: 2;\n }\n\n .brick-checkbox-mixed {\n display: none;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-state=\"checked\"] .brick-checkbox-control,\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-state=\"indeterminate\"] .brick-checkbox-control {\n border-color: var(--brick-checkbox-control-checked-background);\n background: var(--brick-checkbox-control-checked-background);\n color: var(--brick-checkbox-control-checked-foreground);\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-state=\"indeterminate\"] .brick-checkbox-check {\n display: none;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-state=\"indeterminate\"] .brick-checkbox-mixed {\n display: block;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-state=\"unchecked\"] .brick-checkbox-mark {\n visibility: hidden;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n ):not([data-disabled], [data-readonly]):active {\n background: var(--brick-color-accent-soft-pressed);\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n ):not([data-disabled], [data-readonly]):active .brick-checkbox-control {\n transform: scale(0.94);\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-disabled] {\n color: var(--brick-color-text-secondary);\n cursor: not-allowed;\n opacity: 0.65;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-disabled] .brick-checkbox-control {\n border-color: var(--brick-color-border-subtle);\n background: var(--brick-color-surface-subtle);\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-readonly] {\n background: var(--brick-color-surface-subtle);\n }\n\n .brick-checkbox[data-invalid],\n .brick-checkbox-group:not([data-invalid])\n > :where(.brick-checkbox-group-item, .brick-checkbox-group-parent)[data-invalid] {\n border-inline-start: var(--brick-border-focus-width) solid\n var(--brick-checkbox-invalid-foreground);\n box-shadow: none;\n }\n\n .brick-checkbox[data-invalid] .brick-checkbox-control,\n .brick-checkbox-group:not([data-invalid])\n > :where(.brick-checkbox-group-item, .brick-checkbox-group-parent)[data-invalid]\n .brick-checkbox-control {\n border-color: var(--brick-checkbox-invalid-foreground);\n }\n\n :where(.brick-checkbox)[data-size=\"sm\"],\n :where(.brick-checkbox-group)[data-size=\"sm\"] {\n --brick-checkbox-control-size: 1rem;\n --brick-checkbox-target-min-size: var(--brick-control-target-min);\n --brick-checkbox-indicator-size: 0.75rem;\n --brick-checkbox-gap: 0.375rem;\n --brick-checkbox-row-padding-inline: var(--brick-space-1);\n }\n\n :where(.brick-checkbox)[data-size=\"lg\"],\n :where(.brick-checkbox-group)[data-size=\"lg\"] {\n --brick-checkbox-control-size: 1.25rem;\n --brick-checkbox-target-min-size: var(--brick-control-min-block-size-lg);\n --brick-checkbox-indicator-size: 1rem;\n --brick-checkbox-gap: var(--brick-space-3);\n --brick-checkbox-row-padding-inline: var(--brick-space-3);\n }\n\n @media (hover: hover) and (pointer: fine) {\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n ):not([data-disabled], [data-readonly]):hover {\n background: var(--brick-color-accent-soft);\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n ):not([data-disabled], [data-readonly], [data-invalid]):hover .brick-checkbox-control {\n border-color: var(--brick-color-accent-border);\n }\n\n .brick-checkbox-group[data-invalid]\n > :where(.brick-checkbox-group-item, .brick-checkbox-group-parent):not(\n [data-disabled],\n [data-readonly]\n ):hover\n .brick-checkbox-control {\n border-color: var(--brick-color-accent-border);\n }\n }\n\n @media (prefers-reduced-motion: reduce) {\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent,\n .brick-checkbox-control\n ) {\n transition-duration: 0ms;\n }\n }\n\n @media (forced-colors: active) {\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n ) {\n forced-color-adjust: none;\n color: ButtonText;\n }\n\n .brick-checkbox-control {\n border-color: ButtonText;\n background: Canvas;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-state=\"checked\"] .brick-checkbox-control,\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-state=\"indeterminate\"] .brick-checkbox-control {\n border-color: Highlight;\n background: Highlight;\n color: HighlightText;\n }\n\n .brick-checkbox[data-invalid],\n .brick-checkbox-group:not([data-invalid])\n > :where(.brick-checkbox-group-item, .brick-checkbox-group-parent)[data-invalid] {\n border-inline-start: var(--brick-border-focus-width) solid Mark;\n box-shadow: none;\n }\n\n .brick-checkbox[data-invalid] .brick-checkbox-control,\n .brick-checkbox-group:not([data-invalid])\n > :where(.brick-checkbox-group-item, .brick-checkbox-group-parent)[data-invalid]\n .brick-checkbox-control {\n border-color: Mark;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-disabled] {\n color: GrayText;\n opacity: 1;\n }\n }\n}\n"],"names":[]}
1
+ {"version":3,"sourceRoot":null,"mappings":"ACAA,sDAAA,wBCCE,63BAiBA,0vCAuCA,oIAQA,8GAQA,qIAQA,uTAUA,w2BAqBA,2JAOA,qFAOA,8IAQA,mCAIA,+aAeA,6IAQA,8IAQA,6IAQA,yKAQA,sKAUA,kNASA,4IAQA,yQAQA,4PAOA,mTASA,wUASA,wCACE,wXAkBF,uCACE,gIAUF,8BACE,0HASA,kEAKA,+LASA,8TAeA,qOAOA,wNAOA,0HDxUJ","sources":["home/runner/work/brick/brick/.brick-cache/production/checkbox.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/checkbox/checkbox.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/checkbox/checkbox.css\";","@layer brick.tokens, flowstack.theme, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n :where(.brick-checkbox, .brick-checkbox-group) {\n --brick-checkbox-control-size: 1.125rem;\n --brick-checkbox-target-min-size: var(--brick-control-target-min);\n --brick-checkbox-gap: var(--brick-space-2);\n --brick-checkbox-border-width: var(--brick-border-width);\n --brick-checkbox-radius: var(--brick-radius-subtle);\n --brick-checkbox-indicator-size: 0.875rem;\n --brick-checkbox-row-padding-inline: var(--brick-space-2);\n --brick-checkbox-label-foreground: var(--brick-color-text-primary);\n --brick-checkbox-description-foreground: var(--brick-color-text-secondary);\n --brick-checkbox-control-background: var(--brick-color-surface-raised);\n --brick-checkbox-control-border: var(--brick-color-border-strong);\n --brick-checkbox-control-checked-background: var(--brick-color-accent-solid);\n --brick-checkbox-control-checked-foreground: var(--brick-color-accent-on-solid);\n --brick-checkbox-invalid-foreground: var(--brick-color-danger-text);\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n ) {\n display: grid;\n box-sizing: border-box;\n min-inline-size: 0;\n max-inline-size: 100%;\n min-block-size: var(--brick-checkbox-target-min-size);\n grid-template-columns: var(--brick-checkbox-control-size) minmax(0, 1fr);\n grid-auto-rows: min-content;\n align-content: center;\n align-items: center;\n gap: 0 var(--brick-checkbox-gap);\n padding-block: var(--brick-space-1);\n padding-inline: var(--brick-checkbox-row-padding-inline);\n border: 0;\n border-radius: var(--brick-checkbox-radius);\n appearance: none;\n background: transparent;\n color: var(--brick-checkbox-label-foreground);\n font: inherit;\n font-family: var(--brick-typography-body-md-font-family);\n font-size: var(--brick-typography-body-md-font-size);\n font-weight: var(--brick-typography-body-md-font-weight);\n letter-spacing: var(--brick-typography-body-md-letter-spacing);\n line-height: var(--brick-typography-body-md-line-height);\n overflow-wrap: anywhere;\n text-align: start;\n text-decoration: none;\n user-select: none;\n vertical-align: middle;\n transition:\n background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n box-shadow var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n ):not([data-disabled], [data-readonly]) {\n cursor: pointer;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-readonly] {\n cursor: default;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n ):is(:focus-visible, [data-focus-visible]) {\n outline: none;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n ):is(:focus-visible, [data-focus-visible]) .brick-checkbox-control {\n border-color: var(--brick-color-focus-ring);\n outline: var(--brick-border-focus-width) solid var(--brick-color-focus-ring);\n outline-offset: var(--brick-border-focus-offset);\n }\n\n .brick-checkbox-control {\n display: grid;\n box-sizing: border-box;\n inline-size: var(--brick-checkbox-control-size);\n block-size: var(--brick-checkbox-control-size);\n grid-column: 1;\n grid-row: 1 / span 2;\n place-items: center;\n align-self: start;\n margin-block-start: calc((var(--brick-font-size-md) * var(--brick-font-line-height-body) - var(--brick-checkbox-control-size)) / 2);\n border: var(--brick-checkbox-border-width) solid var(--brick-checkbox-control-border);\n border-radius: var(--brick-checkbox-radius);\n background: var(--brick-checkbox-control-background);\n color: transparent;\n transition:\n background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n transform var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);\n }\n\n .brick-checkbox-indicator {\n display: grid;\n inline-size: var(--brick-checkbox-indicator-size);\n block-size: var(--brick-checkbox-indicator-size);\n place-items: center;\n }\n\n .brick-checkbox-mark {\n display: block;\n inline-size: 100%;\n block-size: 100%;\n overflow: visible;\n }\n\n :where(.brick-checkbox-check, .brick-checkbox-mixed) {\n fill: none;\n stroke: currentColor;\n stroke-linecap: round;\n stroke-linejoin: round;\n stroke-width: 2;\n }\n\n .brick-checkbox-mixed {\n display: none;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-state=\"checked\"] .brick-checkbox-control,\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-state=\"indeterminate\"] .brick-checkbox-control {\n border-color: var(--brick-checkbox-control-checked-background);\n background: var(--brick-checkbox-control-checked-background);\n color: var(--brick-checkbox-control-checked-foreground);\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-state=\"indeterminate\"] .brick-checkbox-check {\n display: none;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-state=\"indeterminate\"] .brick-checkbox-mixed {\n display: block;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-state=\"unchecked\"] .brick-checkbox-mark {\n visibility: hidden;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n ):not([data-disabled], [data-readonly]):active .brick-checkbox-control {\n transform: scale(0.94);\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-disabled] {\n color: var(--brick-color-text-secondary);\n cursor: not-allowed;\n opacity: 0.65;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-disabled] .brick-checkbox-control {\n border-color: var(--brick-color-border-subtle);\n background: var(--brick-color-surface-subtle);\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-readonly] {\n background: var(--brick-color-surface-subtle);\n }\n\n .brick-checkbox[data-invalid],\n .brick-checkbox-group:not([data-invalid])\n > :where(.brick-checkbox-group-item, .brick-checkbox-group-parent)[data-invalid] {\n border-inline-start: var(--brick-border-focus-width) solid\n var(--brick-checkbox-invalid-foreground);\n box-shadow: none;\n }\n\n .brick-checkbox[data-invalid] .brick-checkbox-control,\n .brick-checkbox-group:not([data-invalid])\n > :where(.brick-checkbox-group-item, .brick-checkbox-group-parent)[data-invalid]\n .brick-checkbox-control {\n border-color: var(--brick-checkbox-invalid-foreground);\n }\n\n :where(.brick-checkbox)[data-size=\"sm\"],\n :where(.brick-checkbox-group)[data-size=\"sm\"] {\n --brick-checkbox-control-size: 1rem;\n --brick-checkbox-target-min-size: var(--brick-control-target-min);\n --brick-checkbox-indicator-size: 0.75rem;\n --brick-checkbox-gap: 0.375rem;\n --brick-checkbox-row-padding-inline: var(--brick-space-1);\n }\n\n :where(.brick-checkbox)[data-size=\"lg\"],\n :where(.brick-checkbox-group)[data-size=\"lg\"] {\n --brick-checkbox-control-size: 1.25rem;\n --brick-checkbox-target-min-size: var(--brick-control-min-block-size-lg);\n --brick-checkbox-indicator-size: 1rem;\n --brick-checkbox-gap: var(--brick-space-3);\n --brick-checkbox-row-padding-inline: var(--brick-space-3);\n }\n\n @media (hover: hover) and (pointer: fine) {\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n ):not([data-disabled], [data-readonly], [data-invalid]):hover .brick-checkbox-control {\n border-color: var(--brick-color-accent-border);\n }\n\n .brick-checkbox-group[data-invalid]\n > :where(.brick-checkbox-group-item, .brick-checkbox-group-parent):not(\n [data-disabled],\n [data-readonly]\n ):hover\n .brick-checkbox-control {\n border-color: var(--brick-color-accent-border);\n }\n }\n\n @media (prefers-reduced-motion: reduce) {\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent,\n .brick-checkbox-control\n ) {\n transition-duration: 0ms;\n }\n }\n\n @media (forced-colors: active) {\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n ) {\n forced-color-adjust: none;\n color: ButtonText;\n }\n\n .brick-checkbox-control {\n border-color: ButtonText;\n background: Canvas;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n ):is(:focus-visible, [data-focus-visible]) .brick-checkbox-control {\n border-color: Highlight;\n outline-color: Highlight;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-state=\"checked\"] .brick-checkbox-control,\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-state=\"indeterminate\"] .brick-checkbox-control {\n border-color: Highlight;\n background: Highlight;\n color: HighlightText;\n }\n\n .brick-checkbox[data-invalid],\n .brick-checkbox-group:not([data-invalid])\n > :where(.brick-checkbox-group-item, .brick-checkbox-group-parent)[data-invalid] {\n border-inline-start: var(--brick-border-focus-width) solid Mark;\n box-shadow: none;\n }\n\n .brick-checkbox[data-invalid] .brick-checkbox-control,\n .brick-checkbox-group:not([data-invalid])\n > :where(.brick-checkbox-group-item, .brick-checkbox-group-parent)[data-invalid]\n .brick-checkbox-control {\n border-color: Mark;\n }\n\n :where(\n .brick-checkbox,\n .brick-checkbox-group-item,\n .brick-checkbox-group-parent\n )[data-disabled] {\n color: GrayText;\n opacity: 1;\n }\n }\n}\n"],"names":[]}
package/dist/styles/chip.css CHANGED
@@ -1,2 +1,2 @@
1
- @layer brick.tokens,brick.foundations;@layer brick.components{.brick-chip{--brick-chip-background:var(--brick-color-surface-subtle);--brick-chip-foreground:var(--brick-color-text-primary);--brick-chip-border-color:transparent;--brick-chip-radius:var(--brick-radius-full);--brick-chip-min-block-size:2rem;--brick-chip-padding-inline-start:.625rem;--brick-chip-padding-inline-end:.25rem;--brick-chip-gap:.375rem;--brick-chip-font-size:var(--brick-typography-control-sm-font-size);--brick-chip-leading-size:1.25rem;--brick-chip-remove-size:1.5rem;--brick-chip-remove-foreground:var(--brick-color-text-secondary);--brick-chip-remove-background:transparent;--brick-chip-remove-hover-background:var(--brick-color-surface-raised);--brick-chip-remove-active-background:var(--brick-color-surface-muted);box-sizing:border-box;min-inline-size:0;min-block-size:var(--brick-chip-min-block-size);align-items:center;gap:var(--brick-chip-gap);max-inline-size:100%;padding-block:0;padding-inline:var(--brick-chip-padding-inline-start) var(--brick-chip-padding-inline-end);border:var(--brick-border-width) solid var(--brick-chip-border-color);border-radius:var(--brick-chip-radius);background:var(--brick-chip-background);color:var(--brick-chip-foreground);font-family:var(--brick-typography-control-sm-font-family);font-size:var(--brick-chip-font-size);font-weight:var(--brick-typography-control-sm-font-weight);letter-spacing:var(--brick-typography-control-sm-letter-spacing);line-height:var(--brick-typography-control-sm-line-height);vertical-align:middle;display:inline-flex}.brick-chip:not(:has(.brick-chip__remove-trigger)){padding-inline-end:var(--brick-chip-padding-inline-start)}.brick-chip[data-tone=accent]{--brick-chip-background:var(--brick-color-accent-soft);--brick-chip-foreground:var(--brick-color-accent-on-soft);--brick-chip-border-color:var(--brick-color-accent-border);--brick-chip-remove-foreground:var(--brick-color-accent-text);--brick-chip-remove-hover-background:var(--brick-color-accent-subtle);--brick-chip-remove-active-background:var(--brick-color-accent-soft)}.brick-chip[data-variant=outline]{--brick-chip-background:transparent;--brick-chip-border-color:var(--brick-color-border-strong)}.brick-chip[data-shape=rounded]{--brick-chip-radius:var(--brick-radius-control)}.brick-chip[data-size=sm]{--brick-chip-min-block-size:1.75rem;--brick-chip-padding-inline-start:.5rem;--brick-chip-gap:.25rem;--brick-chip-font-size:var(--brick-typography-control-xs-font-size);--brick-chip-leading-size:1rem;--brick-chip-remove-size:1.5rem}.brick-chip[data-size=lg]{--brick-chip-min-block-size:2.25rem;--brick-chip-padding-inline-start:.75rem;--brick-chip-padding-inline-end:.375rem;--brick-chip-gap:.5rem;--brick-chip-font-size:var(--brick-typography-control-md-font-size);--brick-chip-leading-size:1.5rem;--brick-chip-remove-size:1.75rem}.brick-chip__label{text-overflow:ellipsis;white-space:nowrap;min-inline-size:0;overflow:hidden}.brick-chip>:where(svg,img,.brick-avatar,.brick-icon):not(.brick-chip__remove-trigger){inline-size:var(--brick-chip-leading-size);block-size:var(--brick-chip-leading-size);flex:none}.brick-chip__remove-trigger{box-sizing:border-box;inline-size:var(--brick-chip-remove-size);block-size:var(--brick-chip-remove-size);border-radius:var(--brick-radius-full);appearance:none;background:var(--brick-chip-remove-background);min-block-size:1.5rem;min-inline-size:1.5rem;color:var(--brick-chip-remove-foreground);cursor:pointer;border:0;flex:none;place-items:center;padding:0;display:inline-grid}.brick-chip__remove-trigger>svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:1.75px;block-size:.875rem;inline-size:.875rem}.brick-chip__remove-trigger:focus-visible{outline:var(--brick-border-focus-width) solid var(--brick-color-focus-ring);outline-offset:calc(-1 * var(--brick-border-focus-width))}.brick-chip__remove-trigger[data-disabled]{color:var(--brick-color-text-disabled);cursor:not-allowed}@media (hover:hover) and (pointer:fine){.brick-chip__remove-trigger:not([data-disabled]):hover{background:var(--brick-chip-remove-hover-background)}}.brick-chip__remove-trigger:not([data-disabled]):active{background:var(--brick-chip-remove-active-background)}@media (prefers-reduced-motion:reduce){.brick-chip__remove-trigger{transition:none}}@media (forced-colors:active){.brick-chip{border-color:canvastext}.brick-chip__remove-trigger{color:buttontext}.brick-chip__remove-trigger:focus-visible{outline-color:highlight}.brick-chip__remove-trigger[data-disabled]{color:graytext}}}@layer brick.utilities,brick.effects;
1
+ @layer brick.tokens,flowstack.theme,brick.foundations;@layer brick.components{.brick-chip{--brick-chip-background:var(--brick-color-surface-subtle);--brick-chip-foreground:var(--brick-color-text-primary);--brick-chip-border-color:transparent;--brick-chip-radius:var(--brick-radius-full);--brick-chip-min-block-size:2rem;--brick-chip-padding-inline-start:.625rem;--brick-chip-padding-inline-end:.25rem;--brick-chip-gap:.375rem;--brick-chip-font-size:var(--brick-typography-control-sm-font-size);--brick-chip-leading-size:1.25rem;--brick-chip-remove-size:1.5rem;--brick-chip-remove-foreground:var(--brick-color-text-secondary);--brick-chip-remove-background:transparent;--brick-chip-remove-hover-background:var(--brick-color-surface-raised);--brick-chip-remove-active-background:var(--brick-color-border-subtle);box-sizing:border-box;min-inline-size:0;min-block-size:var(--brick-chip-min-block-size);align-items:center;gap:var(--brick-chip-gap);max-inline-size:100%;padding-block:0;padding-inline:var(--brick-chip-padding-inline-start) var(--brick-chip-padding-inline-end);border:var(--brick-border-width) solid var(--brick-chip-border-color);border-radius:var(--brick-chip-radius);background:var(--brick-chip-background);color:var(--brick-chip-foreground);font-family:var(--brick-typography-control-sm-font-family);font-size:var(--brick-chip-font-size);font-weight:var(--brick-typography-control-sm-font-weight);letter-spacing:var(--brick-typography-control-sm-letter-spacing);line-height:var(--brick-typography-control-sm-line-height);vertical-align:middle;display:inline-flex}.brick-chip:not(:has(.brick-chip__remove-trigger)){padding-inline-end:var(--brick-chip-padding-inline-start)}.brick-chip[data-tone=accent]{--brick-chip-background:var(--brick-color-accent-soft);--brick-chip-foreground:var(--brick-color-accent-on-soft);--brick-chip-border-color:var(--brick-color-accent-border);--brick-chip-remove-foreground:var(--brick-color-accent-text);--brick-chip-remove-hover-background:var(--brick-color-accent-soft);--brick-chip-remove-active-background:var(--brick-color-accent-soft)}.brick-chip[data-variant=outline]{--brick-chip-background:transparent;--brick-chip-border-color:var(--brick-color-border-strong)}.brick-chip[data-shape=rounded]{--brick-chip-radius:var(--brick-radius-control)}.brick-chip[data-size=sm]{--brick-chip-min-block-size:1.75rem;--brick-chip-padding-inline-start:.5rem;--brick-chip-gap:.25rem;--brick-chip-font-size:var(--brick-typography-control-xs-font-size);--brick-chip-leading-size:1rem;--brick-chip-remove-size:1.5rem}.brick-chip[data-size=lg]{--brick-chip-min-block-size:2.25rem;--brick-chip-padding-inline-start:.75rem;--brick-chip-padding-inline-end:.375rem;--brick-chip-gap:.5rem;--brick-chip-font-size:var(--brick-typography-control-md-font-size);--brick-chip-leading-size:1.5rem;--brick-chip-remove-size:1.75rem}.brick-chip__label{text-overflow:ellipsis;white-space:nowrap;min-inline-size:0;overflow:hidden}.brick-chip>:where(svg,img,.brick-avatar,.brick-icon):not(.brick-chip__remove-trigger){inline-size:var(--brick-chip-leading-size);block-size:var(--brick-chip-leading-size);flex:none}.brick-chip__remove-trigger{box-sizing:border-box;inline-size:var(--brick-chip-remove-size);block-size:var(--brick-chip-remove-size);border-radius:var(--brick-radius-full);appearance:none;background:var(--brick-chip-remove-background);min-block-size:1.5rem;min-inline-size:1.5rem;color:var(--brick-chip-remove-foreground);cursor:pointer;border:0;flex:none;place-items:center;padding:0;display:inline-grid}.brick-chip__remove-trigger>svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:1.75px;block-size:.875rem;inline-size:.875rem}.brick-chip__remove-trigger:focus-visible{outline:var(--brick-border-focus-width) solid var(--brick-color-focus-ring);outline-offset:calc(-1 * var(--brick-border-focus-width))}.brick-chip__remove-trigger[data-disabled]{color:var(--brick-color-text-disabled);cursor:not-allowed}@media (hover:hover) and (pointer:fine){.brick-chip__remove-trigger:not([data-disabled]):hover{background:var(--brick-chip-remove-hover-background)}}.brick-chip__remove-trigger:not([data-disabled]):active{background:var(--brick-chip-remove-active-background)}@media (prefers-reduced-motion:reduce){.brick-chip__remove-trigger{transition:none}}@media (forced-colors:active){.brick-chip{border-color:canvastext}.brick-chip__remove-trigger{color:buttontext}.brick-chip__remove-trigger:focus-visible{outline-color:highlight}.brick-chip__remove-trigger[data-disabled]{color:graytext}}}@layer brick.utilities,brick.effects;
2
2
  /*# sourceMappingURL=chip.css.map */
package/dist/styles/chip.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":null,"mappings":"ACAA,sCAAA,wBCCE,29CAsCA,6GAIA,mZASA,iIAKA,gFAIA,iQASA,4SAUA,+FAOA,sLAMA,qZAkBA,8IASA,gLAKA,qGAKA,wCACE,6GAKF,8GAIA,uCACE,6CAGF,8BACE,oCACA,6CACA,kEACA,4DDpJJ","sources":["home/runner/work/brick/brick/.brick-cache/production/chip.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/chip/chip.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/chip/chip.css\";","@layer brick.tokens, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n .brick-chip {\n --brick-chip-background: var(--brick-color-surface-subtle);\n --brick-chip-foreground: var(--brick-color-text-primary);\n --brick-chip-border-color: transparent;\n --brick-chip-radius: var(--brick-radius-full);\n --brick-chip-min-block-size: 2rem;\n --brick-chip-padding-inline-start: 0.625rem;\n --brick-chip-padding-inline-end: 0.25rem;\n --brick-chip-gap: 0.375rem;\n --brick-chip-font-size: var(--brick-typography-control-sm-font-size);\n --brick-chip-leading-size: 1.25rem;\n --brick-chip-remove-size: 1.5rem;\n --brick-chip-remove-foreground: var(--brick-color-text-secondary);\n --brick-chip-remove-background: transparent;\n --brick-chip-remove-hover-background: var(--brick-color-surface-raised);\n --brick-chip-remove-active-background: var(--brick-color-surface-muted);\n\n display: inline-flex;\n box-sizing: border-box;\n min-inline-size: 0;\n min-block-size: var(--brick-chip-min-block-size);\n max-inline-size: 100%;\n align-items: center;\n gap: var(--brick-chip-gap);\n padding-block: 0;\n padding-inline: var(--brick-chip-padding-inline-start) var(--brick-chip-padding-inline-end);\n border: var(--brick-border-width) solid var(--brick-chip-border-color);\n border-radius: var(--brick-chip-radius);\n background: var(--brick-chip-background);\n color: var(--brick-chip-foreground);\n font-family: var(--brick-typography-control-sm-font-family);\n font-size: var(--brick-chip-font-size);\n font-weight: var(--brick-typography-control-sm-font-weight);\n letter-spacing: var(--brick-typography-control-sm-letter-spacing);\n line-height: var(--brick-typography-control-sm-line-height);\n vertical-align: middle;\n }\n\n .brick-chip:not(:has(.brick-chip__remove-trigger)) {\n padding-inline-end: var(--brick-chip-padding-inline-start);\n }\n\n .brick-chip[data-tone=\"accent\"] {\n --brick-chip-background: var(--brick-color-accent-soft);\n --brick-chip-foreground: var(--brick-color-accent-on-soft);\n --brick-chip-border-color: var(--brick-color-accent-border);\n --brick-chip-remove-foreground: var(--brick-color-accent-text);\n --brick-chip-remove-hover-background: var(--brick-color-accent-subtle);\n --brick-chip-remove-active-background: var(--brick-color-accent-soft);\n }\n\n .brick-chip[data-variant=\"outline\"] {\n --brick-chip-background: transparent;\n --brick-chip-border-color: var(--brick-color-border-strong);\n }\n\n .brick-chip[data-shape=\"rounded\"] {\n --brick-chip-radius: var(--brick-radius-control);\n }\n\n .brick-chip[data-size=\"sm\"] {\n --brick-chip-min-block-size: 1.75rem;\n --brick-chip-padding-inline-start: 0.5rem;\n --brick-chip-gap: 0.25rem;\n --brick-chip-font-size: var(--brick-typography-control-xs-font-size);\n --brick-chip-leading-size: 1rem;\n --brick-chip-remove-size: 1.5rem;\n }\n\n .brick-chip[data-size=\"lg\"] {\n --brick-chip-min-block-size: 2.25rem;\n --brick-chip-padding-inline-start: 0.75rem;\n --brick-chip-padding-inline-end: 0.375rem;\n --brick-chip-gap: 0.5rem;\n --brick-chip-font-size: var(--brick-typography-control-md-font-size);\n --brick-chip-leading-size: 1.5rem;\n --brick-chip-remove-size: 1.75rem;\n }\n\n .brick-chip__label {\n min-inline-size: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .brick-chip > :where(svg, img, .brick-avatar, .brick-icon):not(.brick-chip__remove-trigger) {\n inline-size: var(--brick-chip-leading-size);\n block-size: var(--brick-chip-leading-size);\n flex: none;\n }\n\n .brick-chip__remove-trigger {\n display: inline-grid;\n box-sizing: border-box;\n flex: none;\n inline-size: var(--brick-chip-remove-size);\n block-size: var(--brick-chip-remove-size);\n min-inline-size: 1.5rem;\n min-block-size: 1.5rem;\n place-items: center;\n padding: 0;\n border: 0;\n border-radius: var(--brick-radius-full);\n appearance: none;\n background: var(--brick-chip-remove-background);\n color: var(--brick-chip-remove-foreground);\n cursor: pointer;\n }\n\n .brick-chip__remove-trigger > svg {\n inline-size: 0.875rem;\n block-size: 0.875rem;\n fill: none;\n stroke: currentColor;\n stroke-linecap: round;\n stroke-width: 1.75;\n }\n\n .brick-chip__remove-trigger:focus-visible {\n outline: var(--brick-border-focus-width) solid var(--brick-color-focus-ring);\n outline-offset: calc(-1 * var(--brick-border-focus-width));\n }\n\n .brick-chip__remove-trigger[data-disabled] {\n color: var(--brick-color-text-disabled);\n cursor: not-allowed;\n }\n\n @media (hover: hover) and (pointer: fine) {\n .brick-chip__remove-trigger:not([data-disabled]):hover {\n background: var(--brick-chip-remove-hover-background);\n }\n }\n\n .brick-chip__remove-trigger:not([data-disabled]):active {\n background: var(--brick-chip-remove-active-background);\n }\n\n @media (prefers-reduced-motion: reduce) {\n .brick-chip__remove-trigger { transition: none; }\n }\n\n @media (forced-colors: active) {\n .brick-chip { border-color: CanvasText; }\n .brick-chip__remove-trigger { color: ButtonText; }\n .brick-chip__remove-trigger:focus-visible { outline-color: Highlight; }\n .brick-chip__remove-trigger[data-disabled] { color: GrayText; }\n }\n}\n"],"names":[]}
1
+ {"version":3,"sourceRoot":null,"mappings":"ACAA,sDAAA,wBCCE,29CAsCA,6GAIA,iZASA,iIAKA,gFAIA,iQASA,4SAUA,+FAOA,sLAMA,qZAkBA,8IASA,gLAKA,qGAKA,wCACE,6GAKF,8GAIA,uCACE,6CAGF,8BACE,oCACA,6CACA,kEACA,4DDpJJ","sources":["home/runner/work/brick/brick/.brick-cache/production/chip.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/chip/chip.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/chip/chip.css\";","@layer brick.tokens, flowstack.theme, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n .brick-chip {\n --brick-chip-background: var(--brick-color-surface-subtle);\n --brick-chip-foreground: var(--brick-color-text-primary);\n --brick-chip-border-color: transparent;\n --brick-chip-radius: var(--brick-radius-full);\n --brick-chip-min-block-size: 2rem;\n --brick-chip-padding-inline-start: 0.625rem;\n --brick-chip-padding-inline-end: 0.25rem;\n --brick-chip-gap: 0.375rem;\n --brick-chip-font-size: var(--brick-typography-control-sm-font-size);\n --brick-chip-leading-size: 1.25rem;\n --brick-chip-remove-size: 1.5rem;\n --brick-chip-remove-foreground: var(--brick-color-text-secondary);\n --brick-chip-remove-background: transparent;\n --brick-chip-remove-hover-background: var(--brick-color-surface-raised);\n --brick-chip-remove-active-background: var(--brick-color-border-subtle);\n\n display: inline-flex;\n box-sizing: border-box;\n min-inline-size: 0;\n min-block-size: var(--brick-chip-min-block-size);\n max-inline-size: 100%;\n align-items: center;\n gap: var(--brick-chip-gap);\n padding-block: 0;\n padding-inline: var(--brick-chip-padding-inline-start) var(--brick-chip-padding-inline-end);\n border: var(--brick-border-width) solid var(--brick-chip-border-color);\n border-radius: var(--brick-chip-radius);\n background: var(--brick-chip-background);\n color: var(--brick-chip-foreground);\n font-family: var(--brick-typography-control-sm-font-family);\n font-size: var(--brick-chip-font-size);\n font-weight: var(--brick-typography-control-sm-font-weight);\n letter-spacing: var(--brick-typography-control-sm-letter-spacing);\n line-height: var(--brick-typography-control-sm-line-height);\n vertical-align: middle;\n }\n\n .brick-chip:not(:has(.brick-chip__remove-trigger)) {\n padding-inline-end: var(--brick-chip-padding-inline-start);\n }\n\n .brick-chip[data-tone=\"accent\"] {\n --brick-chip-background: var(--brick-color-accent-soft);\n --brick-chip-foreground: var(--brick-color-accent-on-soft);\n --brick-chip-border-color: var(--brick-color-accent-border);\n --brick-chip-remove-foreground: var(--brick-color-accent-text);\n --brick-chip-remove-hover-background: var(--brick-color-accent-soft);\n --brick-chip-remove-active-background: var(--brick-color-accent-soft);\n }\n\n .brick-chip[data-variant=\"outline\"] {\n --brick-chip-background: transparent;\n --brick-chip-border-color: var(--brick-color-border-strong);\n }\n\n .brick-chip[data-shape=\"rounded\"] {\n --brick-chip-radius: var(--brick-radius-control);\n }\n\n .brick-chip[data-size=\"sm\"] {\n --brick-chip-min-block-size: 1.75rem;\n --brick-chip-padding-inline-start: 0.5rem;\n --brick-chip-gap: 0.25rem;\n --brick-chip-font-size: var(--brick-typography-control-xs-font-size);\n --brick-chip-leading-size: 1rem;\n --brick-chip-remove-size: 1.5rem;\n }\n\n .brick-chip[data-size=\"lg\"] {\n --brick-chip-min-block-size: 2.25rem;\n --brick-chip-padding-inline-start: 0.75rem;\n --brick-chip-padding-inline-end: 0.375rem;\n --brick-chip-gap: 0.5rem;\n --brick-chip-font-size: var(--brick-typography-control-md-font-size);\n --brick-chip-leading-size: 1.5rem;\n --brick-chip-remove-size: 1.75rem;\n }\n\n .brick-chip__label {\n min-inline-size: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .brick-chip > :where(svg, img, .brick-avatar, .brick-icon):not(.brick-chip__remove-trigger) {\n inline-size: var(--brick-chip-leading-size);\n block-size: var(--brick-chip-leading-size);\n flex: none;\n }\n\n .brick-chip__remove-trigger {\n display: inline-grid;\n box-sizing: border-box;\n flex: none;\n inline-size: var(--brick-chip-remove-size);\n block-size: var(--brick-chip-remove-size);\n min-inline-size: 1.5rem;\n min-block-size: 1.5rem;\n place-items: center;\n padding: 0;\n border: 0;\n border-radius: var(--brick-radius-full);\n appearance: none;\n background: var(--brick-chip-remove-background);\n color: var(--brick-chip-remove-foreground);\n cursor: pointer;\n }\n\n .brick-chip__remove-trigger > svg {\n inline-size: 0.875rem;\n block-size: 0.875rem;\n fill: none;\n stroke: currentColor;\n stroke-linecap: round;\n stroke-width: 1.75;\n }\n\n .brick-chip__remove-trigger:focus-visible {\n outline: var(--brick-border-focus-width) solid var(--brick-color-focus-ring);\n outline-offset: calc(-1 * var(--brick-border-focus-width));\n }\n\n .brick-chip__remove-trigger[data-disabled] {\n color: var(--brick-color-text-disabled);\n cursor: not-allowed;\n }\n\n @media (hover: hover) and (pointer: fine) {\n .brick-chip__remove-trigger:not([data-disabled]):hover {\n background: var(--brick-chip-remove-hover-background);\n }\n }\n\n .brick-chip__remove-trigger:not([data-disabled]):active {\n background: var(--brick-chip-remove-active-background);\n }\n\n @media (prefers-reduced-motion: reduce) {\n .brick-chip__remove-trigger { transition: none; }\n }\n\n @media (forced-colors: active) {\n .brick-chip { border-color: CanvasText; }\n .brick-chip__remove-trigger { color: ButtonText; }\n .brick-chip__remove-trigger:focus-visible { outline-color: Highlight; }\n .brick-chip__remove-trigger[data-disabled] { color: GrayText; }\n }\n}\n"],"names":[]}
package/dist/styles/code-block.css CHANGED
@@ -1,2 +1,2 @@
1
- @layer brick.tokens,brick.foundations;@layer brick.components{:where(.brick-button,.brick-icon-button)[data-loading]:after{inline-size:var(--brick-action-spinner-size);block-size:var(--brick-action-spinner-size);border:.125rem solid #0000;border-block-start-color:var(--brick-action-spinner-color);border-inline-end-color:var(--brick-action-spinner-color);border-radius:var(--brick-radius-full);content:"";animation:.7s linear infinite brick-action-spinner-spin;position:absolute;inset-block-start:50%;inset-inline-start:50%}:where([dir=rtl]) :where(.brick-button,.brick-icon-button)[data-loading]:after{animation-name:brick-action-spinner-spin-rtl}@media (prefers-reduced-motion:reduce){:where(.brick-button,.brick-icon-button)[data-loading]:after{animation-duration:1.4s}}@media (forced-colors:active){:where(.brick-button,.brick-icon-button)[data-loading]:after{border-block-start-color:buttontext;border-inline-end-color:buttontext}}@keyframes brick-action-spinner-spin{0%{transform:translate(-50%,-50%)rotate(0)}to{transform:translate(-50%,-50%)rotate(360deg)}}@keyframes brick-action-spinner-spin-rtl{0%{transform:translate(50%,-50%)rotate(0)}to{transform:translate(50%,-50%)rotate(360deg)}}.brick-button{--brick-button-background:var(--brick-button-tone-solid);--brick-button-background-hover:var(--brick-button-tone-solid-hover);--brick-button-background-pressed:var(--brick-button-tone-solid-pressed);--brick-button-foreground:var(--brick-button-tone-on-solid);--brick-button-border-color:var(--brick-button-background);--brick-button-focus-ring:var(--brick-color-focus-ring);--brick-button-min-block-size:var(--brick-control-min-block-size-md);--brick-button-padding-block:.5rem;--brick-button-padding-inline:1rem;--brick-button-gap:.5rem;--brick-button-radius:var(--brick-radius-control);--brick-button-font-family:var(--brick-typography-control-md-font-family);--brick-button-font-size:var(--brick-typography-control-md-font-size);--brick-button-font-weight:var(--brick-typography-control-md-font-weight);--brick-button-line-height:var(--brick-typography-control-md-line-height);--brick-button-letter-spacing:var(--brick-typography-control-md-letter-spacing);--brick-button-icon-size:1.125rem;--brick-action-spinner-size:1em;--brick-action-spinner-color:var(--brick-button-spinner-color,var(--brick-button-foreground));box-sizing:border-box;min-inline-size:0;max-inline-size:100%;min-block-size:var(--brick-button-min-block-size);justify-content:center;align-items:center;gap:var(--brick-button-gap);padding-block:var(--brick-button-padding-block);padding-inline:var(--brick-button-padding-inline);border:var(--brick-border-width) solid var(--brick-button-border-color);border-radius:var(--brick-button-radius);appearance:none;background:var(--brick-button-background);color:var(--brick-button-foreground);font-family:var(--brick-button-font-family);font-size:var(--brick-button-font-size);font-weight:var(--brick-button-font-weight);letter-spacing:var(--brick-button-letter-spacing);line-height:var(--brick-button-line-height);text-align:center;overflow-wrap:anywhere;-webkit-user-select:none;user-select:none;vertical-align:middle;transition:background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard), border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard), color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);text-decoration:none;display:inline-flex;position:relative}.brick-button:not([data-disabled],[data-loading]){cursor:pointer}.brick-button:focus-visible{outline:var(--brick-border-focus-width) solid var(--brick-button-focus-ring);outline-offset:var(--brick-border-focus-offset)}.brick-button:not([data-disabled],[data-loading]):active{background:var(--brick-button-background-pressed);border-color:var(--brick-button-background-pressed)}.brick-button[data-variant=soft]:not([data-disabled],[data-loading]):active,.brick-button[data-variant=outline]:not([data-disabled],[data-loading]):active{border-color:var(--brick-button-tone-border)}.brick-button[data-variant=ghost]:not([data-disabled],[data-loading]):active{border-color:#0000}.brick-button[data-disabled]{border-color:var(--brick-color-border-default);background:var(--brick-color-surface-subtle);color:var(--brick-color-text-secondary);cursor:not-allowed}.brick-button[data-loading]{cursor:progress;color:#0000}.brick-button[data-loading]>*{opacity:0}.brick-button[data-disabled][data-loading]{--brick-button-spinner-color:var(--brick-color-text-secondary)}.brick-button__content{min-inline-size:0}.brick-button__icon{flex:none;justify-content:center;align-items:center;display:inline-flex}.brick-button__icon>:where(svg,img){inline-size:var(--brick-button-icon-size);block-size:var(--brick-button-icon-size)}.brick-button[data-full-width]{inline-size:100%}.brick-button[data-shape=sharp]{--brick-button-radius:0}.brick-button[data-shape=pill]{--brick-button-radius:var(--brick-radius-full)}.brick-button[data-size=xs]{--brick-button-min-block-size:var(--brick-control-min-block-size-xs);--brick-button-padding-block:.25rem;--brick-button-padding-inline:.625rem;--brick-button-gap:.375rem;--brick-button-font-size:var(--brick-typography-control-xs-font-size);--brick-button-icon-size:.875rem}.brick-button[data-size=sm]{--brick-button-min-block-size:var(--brick-control-min-block-size-sm);--brick-button-padding-block:.375rem;--brick-button-padding-inline:.75rem;--brick-button-gap:.375rem;--brick-button-font-size:var(--brick-typography-control-sm-font-size);--brick-button-icon-size:1rem}.brick-button[data-size=lg]{--brick-button-min-block-size:var(--brick-control-min-block-size-lg);--brick-button-padding-block:.625rem;--brick-button-padding-inline:1.25rem;--brick-button-gap:.625rem;--brick-button-font-size:var(--brick-typography-control-lg-font-size);--brick-button-icon-size:1.25rem}.brick-button[data-size=xl]{--brick-button-min-block-size:var(--brick-control-min-block-size-xl);--brick-button-padding-block:.75rem;--brick-button-padding-inline:1.5rem;--brick-button-gap:.75rem;--brick-button-font-size:var(--brick-typography-control-xl-font-size);--brick-button-icon-size:1.5rem}.brick-button[data-tone=neutral]{--brick-button-tone-solid:var(--brick-color-text-primary);--brick-button-tone-solid-hover:var(--brick-color-text-secondary);--brick-button-tone-solid-pressed:color-mix(in srgb, var(--brick-color-text-primary), var(--brick-color-text-secondary) 35%);--brick-button-tone-on-solid:var(--brick-color-text-inverse);--brick-button-tone-soft:var(--brick-color-surface-subtle);--brick-button-tone-soft-hover:var(--brick-color-surface-base);--brick-button-tone-soft-pressed:var(--brick-color-border-subtle);--brick-button-tone-on-soft:var(--brick-color-text-primary);--brick-button-tone-border:var(--brick-color-border-strong);--brick-button-tone-text:var(--brick-color-text-primary)}.brick-button[data-tone=accent]{--brick-button-tone-solid:var(--brick-color-accent-solid);--brick-button-tone-solid-hover:var(--brick-color-accent-solid-hover);--brick-button-tone-solid-pressed:var(--brick-color-accent-solid-pressed);--brick-button-tone-on-solid:var(--brick-color-accent-on-solid);--brick-button-tone-soft:var(--brick-color-accent-soft);--brick-button-tone-soft-hover:var(--brick-color-accent-soft-hover);--brick-button-tone-soft-pressed:var(--brick-color-accent-soft-pressed);--brick-button-tone-on-soft:var(--brick-color-accent-on-soft);--brick-button-tone-border:var(--brick-color-accent-border);--brick-button-tone-text:var(--brick-color-accent-text)}.brick-button[data-tone=info]{--brick-button-tone-solid:var(--brick-color-info-solid);--brick-button-tone-solid-hover:var(--brick-color-info-solid-hover);--brick-button-tone-solid-pressed:var(--brick-color-info-solid-pressed);--brick-button-tone-on-solid:var(--brick-color-info-on-solid);--brick-button-tone-soft:var(--brick-color-info-soft);--brick-button-tone-soft-hover:var(--brick-color-info-soft-hover);--brick-button-tone-soft-pressed:var(--brick-color-info-soft-pressed);--brick-button-tone-on-soft:var(--brick-color-info-on-soft);--brick-button-tone-border:var(--brick-color-info-border);--brick-button-tone-text:var(--brick-color-info-text)}.brick-button[data-tone=success]{--brick-button-tone-solid:var(--brick-color-success-solid);--brick-button-tone-solid-hover:var(--brick-color-success-solid-hover);--brick-button-tone-solid-pressed:var(--brick-color-success-solid-pressed);--brick-button-tone-on-solid:var(--brick-color-success-on-solid);--brick-button-tone-soft:var(--brick-color-success-soft);--brick-button-tone-soft-hover:var(--brick-color-success-soft-hover);--brick-button-tone-soft-pressed:var(--brick-color-success-soft-pressed);--brick-button-tone-on-soft:var(--brick-color-success-on-soft);--brick-button-tone-border:var(--brick-color-success-border);--brick-button-tone-text:var(--brick-color-success-text)}.brick-button[data-tone=warning]{--brick-button-tone-solid:var(--brick-color-warning-solid);--brick-button-tone-solid-hover:var(--brick-color-warning-solid-hover);--brick-button-tone-solid-pressed:var(--brick-color-warning-solid-pressed);--brick-button-tone-on-solid:var(--brick-color-warning-on-solid);--brick-button-tone-soft:var(--brick-color-warning-soft);--brick-button-tone-soft-hover:var(--brick-color-warning-soft-hover);--brick-button-tone-soft-pressed:var(--brick-color-warning-soft-pressed);--brick-button-tone-on-soft:var(--brick-color-warning-on-soft);--brick-button-tone-border:var(--brick-color-warning-border);--brick-button-tone-text:var(--brick-color-warning-text)}.brick-button[data-tone=danger]{--brick-button-tone-solid:var(--brick-color-danger-solid);--brick-button-tone-solid-hover:var(--brick-color-danger-solid-hover);--brick-button-tone-solid-pressed:var(--brick-color-danger-solid-pressed);--brick-button-tone-on-solid:var(--brick-color-danger-on-solid);--brick-button-tone-soft:var(--brick-color-danger-soft);--brick-button-tone-soft-hover:var(--brick-color-danger-soft-hover);--brick-button-tone-soft-pressed:var(--brick-color-danger-soft-pressed);--brick-button-tone-on-soft:var(--brick-color-danger-on-soft);--brick-button-tone-border:var(--brick-color-danger-border);--brick-button-tone-text:var(--brick-color-danger-text)}.brick-button[data-variant=soft]{--brick-button-background:var(--brick-button-tone-soft);--brick-button-background-hover:var(--brick-button-tone-soft-hover);--brick-button-background-pressed:var(--brick-button-tone-soft-pressed);--brick-button-foreground:var(--brick-button-tone-on-soft);--brick-button-border-color:var(--brick-button-tone-border)}.brick-button[data-variant=outline]{--brick-button-background:transparent;--brick-button-background-hover:var(--brick-button-tone-soft);--brick-button-background-pressed:var(--brick-button-tone-soft-hover);--brick-button-foreground:var(--brick-button-tone-text);--brick-button-border-color:var(--brick-button-tone-border)}.brick-button[data-variant=ghost]{--brick-button-background:transparent;--brick-button-background-hover:var(--brick-button-tone-soft);--brick-button-background-pressed:var(--brick-button-tone-soft-hover);--brick-button-foreground:var(--brick-button-tone-text);--brick-button-border-color:transparent}@media (hover:hover) and (pointer:fine){.brick-button:not([data-disabled],[data-loading]):hover{background:var(--brick-button-background-hover);border-color:var(--brick-button-background-hover)}.brick-button[data-variant=soft]:not([data-disabled],[data-loading]):hover,.brick-button[data-variant=outline]:not([data-disabled],[data-loading]):hover{border-color:var(--brick-button-tone-border)}.brick-button[data-variant=ghost]:not([data-disabled],[data-loading]):hover{border-color:#0000}}@media (prefers-reduced-motion:reduce){.brick-button{transition-duration:0s}}@media (forced-colors:active){.brick-button{color:buttontext;background:buttonface;border-color:buttontext}.brick-button:focus-visible{outline-color:highlight}.brick-button[data-disabled]{color:graytext;opacity:1;border-color:graytext}}.brick-code{--brick-code-foreground:var(--brick-color-text-primary);--brick-code-background:var(--brick-color-surface-subtle);--brick-code-border-color:var(--brick-color-border-subtle);--brick-code-border-width:var(--brick-border-width);--brick-code-radius:var(--brick-radius-subtle);--brick-code-padding-block:.0625em;--brick-code-padding-inline:.3em;--brick-code-font-family:var(--brick-typography-code-inline-font-family);--brick-code-font-size:var(--brick-typography-code-inline-font-size);--brick-code-font-weight:var(--brick-typography-code-inline-font-weight);--brick-code-line-height:var(--brick-typography-code-inline-line-height);--brick-code-letter-spacing:var(--brick-typography-code-inline-letter-spacing);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:var(--brick-code-padding-block) var(--brick-code-padding-inline);border:var(--brick-code-border-width) solid var(--brick-code-border-color);border-radius:var(--brick-code-radius);background:var(--brick-code-background);color:var(--brick-code-foreground);font-family:var(--brick-code-font-family);font-size:var(--brick-code-font-size);font-weight:var(--brick-code-font-weight);letter-spacing:var(--brick-code-letter-spacing);line-height:var(--brick-code-line-height);overflow-wrap:anywhere;white-space:normal}.brick-code[data-variant=plain]{--brick-code-background:transparent;--brick-code-border-width:0rem;--brick-code-padding-block:0em;--brick-code-padding-inline:0em}.brick-code[data-tone=inherit]{--brick-code-foreground:currentColor}.brick-code[data-size=sm]{--brick-code-font-size:var(--brick-typography-body-sm-font-size);--brick-code-line-height:var(--brick-typography-body-sm-line-height)}.brick-code[data-size=md]{--brick-code-font-size:var(--brick-typography-body-md-font-size);--brick-code-line-height:var(--brick-typography-body-md-line-height)}@media (forced-colors:active){.brick-code{--brick-code-foreground:CanvasText;--brick-code-background:Canvas;--brick-code-border-color:CanvasText}}.brick-scroll-area{--brick-scroll-area-scrollbar-thumb:var(--brick-color-border-strong);--brick-scroll-area-scrollbar-track:transparent;min-block-size:0;min-inline-size:0}.brick-scroll-area-viewport{box-sizing:border-box;scrollbar-color:var(--brick-scroll-area-scrollbar-thumb) var(--brick-scroll-area-scrollbar-track);scrollbar-width:auto;block-size:100%;min-block-size:0;inline-size:100%;min-inline-size:0}.brick-scroll-area-viewport[data-orientation=vertical]{overflow:hidden auto}.brick-scroll-area-viewport[data-orientation=horizontal]{overflow:auto hidden}.brick-scroll-area-viewport[data-orientation=both]{overflow:auto}.brick-scroll-area[data-scrollbar-gutter=stable]>.brick-scroll-area-viewport{scrollbar-gutter:stable}.brick-scroll-area[data-scrollbar-visibility=always]>.brick-scroll-area-viewport[data-orientation=vertical]{overflow-y:scroll}.brick-scroll-area[data-scrollbar-visibility=always]>.brick-scroll-area-viewport[data-orientation=horizontal]{overflow-x:scroll}.brick-scroll-area[data-scrollbar-visibility=always]>.brick-scroll-area-viewport[data-orientation=both]{overflow:scroll}.brick-scroll-area[data-scrollbar-visibility=interaction]>.brick-scroll-area-viewport{scrollbar-color:transparent transparent}.brick-scroll-area[data-scrollbar-visibility=interaction]:is(:hover,:focus-within)>.brick-scroll-area-viewport{scrollbar-color:var(--brick-scroll-area-scrollbar-thumb) var(--brick-scroll-area-scrollbar-track)}.brick-scroll-area-viewport:focus-visible{outline:var(--brick-border-focus-width) solid var(--brick-color-focus-ring);outline-offset:calc(-1 * var(--brick-border-focus-width))}@media (forced-colors:active){.brick-scroll-area-viewport,.brick-scroll-area[data-scrollbar-visibility=interaction]>.brick-scroll-area-viewport{scrollbar-color:auto}.brick-scroll-area-viewport:focus-visible{outline-color:highlight}}.brick-code-block{--brick-code-block-background:var(--brick-color-surface-subtle);--brick-code-block-foreground:var(--brick-color-text-primary);--brick-code-block-border-color:var(--brick-color-border-subtle);--brick-code-block-border-width:0rem;--brick-code-block-radius:var(--brick-radius-surface);--brick-code-block-header-padding:var(--brick-space-3) var(--brick-space-4);--brick-code-block-content-padding:var(--brick-space-4);--brick-code-block-gap:var(--brick-space-2);--brick-code-block-font-family:var(--brick-typography-code-block-md-font-family);--brick-code-block-font-size:var(--brick-typography-code-block-md-font-size);--brick-code-block-font-weight:var(--brick-typography-code-block-md-font-weight);--brick-code-block-line-height:var(--brick-typography-code-block-md-line-height);--brick-code-block-letter-spacing:var(--brick-typography-code-block-md-letter-spacing);--brick-code-block-selection-background:var(--brick-color-accent-surface);--brick-code-block-selection-foreground:var(--brick-color-accent-text);box-sizing:border-box;border:var(--brick-code-block-border-width) solid var(--brick-code-block-border-color);border-radius:var(--brick-code-block-radius);background:var(--brick-code-block-background);min-inline-size:0;max-inline-size:100%;color:var(--brick-code-block-foreground);overflow:clip}.brick-code-block[data-variant=bordered]{--brick-code-block-background:var(--brick-color-surface-base);--brick-code-block-border-width:var(--brick-border-width)}.brick-code-block[data-variant=plain]{--brick-code-block-background:transparent;--brick-code-block-radius:0rem}.brick-code-block[data-size=sm]{--brick-code-block-header-padding:var(--brick-space-2) var(--brick-space-3);--brick-code-block-content-padding:var(--brick-space-3);--brick-code-block-font-family:var(--brick-typography-code-block-sm-font-family);--brick-code-block-font-size:var(--brick-typography-code-block-sm-font-size);--brick-code-block-font-weight:var(--brick-typography-code-block-sm-font-weight);--brick-code-block-line-height:var(--brick-typography-code-block-sm-line-height);--brick-code-block-letter-spacing:var(--brick-typography-code-block-sm-letter-spacing)}.brick-code-block-header{align-items:center;gap:var(--brick-code-block-gap);min-inline-size:0;padding:var(--brick-code-block-header-padding);border-block-end:var(--brick-border-width) solid var(--brick-code-block-border-color);display:flex}.brick-code-block-title{min-inline-size:0;color:var(--brick-color-text-primary);font:var(--brick-font-weight-medium) var(--brick-typography-body-sm-font-size) / var(--brick-typography-body-sm-line-height) var(--brick-font-family-body);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.brick-code-block-language{color:var(--brick-color-text-secondary);font:var(--brick-font-weight-medium) var(--brick-typography-caption-font-size) / var(--brick-typography-caption-line-height) var(--brick-font-family-mono)}.brick-code-block-actions{align-items:center;gap:var(--brick-space-1);margin-inline-start:auto;display:flex}.brick-code-block-scroll-area{max-inline-size:100%}.brick-code-block-content{max-inline-size:100%;padding:var(--brick-code-block-content-padding)}.brick-code-block-pre{-webkit-text-size-adjust:none;-moz-text-size-adjust:none;text-size-adjust:none;min-inline-size:max-content;font-family:var(--brick-code-block-font-family);font-size:var(--brick-code-block-font-size);font-weight:var(--brick-code-block-font-weight);letter-spacing:var(--brick-code-block-letter-spacing);line-height:var(--brick-code-block-line-height);tab-size:2;white-space:pre;margin:0}.brick-code-block-content[data-wrap=wrap] .brick-code-block-pre{white-space:pre-wrap;overflow-wrap:anywhere;min-inline-size:0}.brick-code-block-pre>.brick-code{font:inherit;letter-spacing:inherit;white-space:inherit}.brick-code-block-pre ::selection{background:var(--brick-code-block-selection-background);color:var(--brick-code-block-selection-foreground)}.brick-code-block-copy-status{padding-inline:var(--brick-space-4);color:var(--brick-color-text-secondary);font:var(--brick-typography-caption-font-weight) var(--brick-typography-caption-font-size) / var(--brick-typography-caption-line-height) var(--brick-typography-caption-font-family);display:block}.brick-code-block-copy-status:not(:empty){padding-block:var(--brick-space-2)}@media (forced-colors:active){.brick-code-block{--brick-code-block-background:Canvas;--brick-code-block-foreground:CanvasText;--brick-code-block-border-color:CanvasText;--brick-code-block-border-width:var(--brick-border-width);--brick-code-block-selection-background:Highlight;--brick-code-block-selection-foreground:HighlightText}}}@layer brick.utilities,brick.effects;
1
+ @layer brick.tokens,flowstack.theme,brick.foundations;@layer brick.components{:where(.brick-button,.brick-icon-button)[data-loading]:after{inline-size:var(--brick-action-spinner-size);block-size:var(--brick-action-spinner-size);border:.125rem solid #0000;border-block-start-color:var(--brick-action-spinner-color);border-inline-end-color:var(--brick-action-spinner-color);border-radius:var(--brick-radius-full);content:"";animation:.7s linear infinite brick-action-spinner-spin;position:absolute;inset-block-start:50%;inset-inline-start:50%}:where([dir=rtl]) :where(.brick-button,.brick-icon-button)[data-loading]:after{animation-name:brick-action-spinner-spin-rtl}@media (prefers-reduced-motion:reduce){:where(.brick-button,.brick-icon-button)[data-loading]:after{animation-duration:1.4s}}@media (forced-colors:active){:where(.brick-button,.brick-icon-button)[data-loading]:after{border-block-start-color:buttontext;border-inline-end-color:buttontext}}@keyframes brick-action-spinner-spin{0%{transform:translate(-50%,-50%)rotate(0)}to{transform:translate(-50%,-50%)rotate(360deg)}}@keyframes brick-action-spinner-spin-rtl{0%{transform:translate(50%,-50%)rotate(0)}to{transform:translate(50%,-50%)rotate(360deg)}}.brick-button{--brick-button-background:var(--brick-button-tone-solid);--brick-button-background-hover:var(--brick-button-tone-solid-hover);--brick-button-background-pressed:var(--brick-button-tone-solid-pressed);--brick-button-foreground:var(--brick-button-tone-on-solid);--brick-button-border-color:var(--brick-button-background);--brick-button-focus-ring:var(--brick-color-focus-ring);--brick-button-min-block-size:var(--brick-control-min-block-size-md);--brick-button-padding-block:.5rem;--brick-button-padding-inline:1rem;--brick-button-gap:.5rem;--brick-button-radius:var(--brick-radius-control);--brick-button-font-family:var(--brick-typography-control-md-font-family);--brick-button-font-size:var(--brick-typography-control-md-font-size);--brick-button-font-weight:var(--brick-typography-control-md-font-weight);--brick-button-line-height:var(--brick-typography-control-md-line-height);--brick-button-letter-spacing:var(--brick-typography-control-md-letter-spacing);--brick-button-icon-size:1.125rem;--brick-action-spinner-size:1em;--brick-action-spinner-color:var(--brick-button-spinner-color,var(--brick-button-foreground));box-sizing:border-box;min-inline-size:0;max-inline-size:100%;min-block-size:var(--brick-button-min-block-size);justify-content:center;align-items:center;gap:var(--brick-button-gap);padding-block:var(--brick-button-padding-block);padding-inline:var(--brick-button-padding-inline);border:var(--brick-border-width) solid var(--brick-button-border-color);border-radius:var(--brick-button-radius);appearance:none;background:var(--brick-button-background);color:var(--brick-button-foreground);font-family:var(--brick-button-font-family);font-size:var(--brick-button-font-size);font-weight:var(--brick-button-font-weight);letter-spacing:var(--brick-button-letter-spacing);line-height:var(--brick-button-line-height);text-align:center;overflow-wrap:anywhere;-webkit-user-select:none;user-select:none;vertical-align:middle;transition:background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard), border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard), color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);text-decoration:none;display:inline-flex;position:relative}.brick-button:not([data-disabled],[data-loading]){cursor:pointer}.brick-button:focus-visible{outline:var(--brick-border-focus-width) solid var(--brick-button-focus-ring);outline-offset:var(--brick-border-focus-offset)}.brick-button:not([data-disabled],[data-loading]):active{background:var(--brick-button-background-pressed);border-color:var(--brick-button-background-pressed)}.brick-button[data-variant=soft]:not([data-disabled],[data-loading]):active,.brick-button[data-variant=outline]:not([data-disabled],[data-loading]):active{border-color:var(--brick-button-tone-border)}.brick-button[data-variant=ghost]:not([data-disabled],[data-loading]):active{border-color:#0000}.brick-button[data-disabled]{color:var(--brick-color-text-disabled);cursor:not-allowed;opacity:1}.brick-button[data-disabled]:is([data-variant=solid],[data-variant=soft]){border-color:var(--brick-color-border-subtle);background:var(--brick-color-surface-subtle)}.brick-button[data-disabled][data-variant=outline]{border-color:var(--brick-color-border-subtle);background:0 0}.brick-button[data-disabled][data-variant=ghost]{background:0 0;border-color:#0000}.brick-button[data-loading]{cursor:progress;color:#0000}.brick-button[data-loading]>*{opacity:0}.brick-button[data-disabled][data-loading]{--brick-button-spinner-color:var(--brick-color-text-disabled)}.brick-button__content{min-inline-size:0}.brick-button__icon{flex:none;justify-content:center;align-items:center;display:inline-flex}.brick-button__icon>:where(svg,img){inline-size:var(--brick-button-icon-size);block-size:var(--brick-button-icon-size)}.brick-button[data-full-width]{inline-size:100%}.brick-button[data-shape=sharp]{--brick-button-radius:0}.brick-button[data-shape=pill]{--brick-button-radius:var(--brick-radius-full)}.brick-button[data-size=xs]{--brick-button-min-block-size:var(--brick-control-min-block-size-xs);--brick-button-padding-block:.25rem;--brick-button-padding-inline:.625rem;--brick-button-gap:.375rem;--brick-button-font-size:var(--brick-typography-control-xs-font-size);--brick-button-icon-size:.875rem}.brick-button[data-size=sm]{--brick-button-min-block-size:var(--brick-control-min-block-size-sm);--brick-button-padding-block:.375rem;--brick-button-padding-inline:.75rem;--brick-button-gap:.375rem;--brick-button-font-size:var(--brick-typography-control-sm-font-size);--brick-button-icon-size:1rem}.brick-button[data-size=lg]{--brick-button-min-block-size:var(--brick-control-min-block-size-lg);--brick-button-padding-block:.625rem;--brick-button-padding-inline:1.25rem;--brick-button-gap:.625rem;--brick-button-font-size:var(--brick-typography-control-lg-font-size);--brick-button-icon-size:1.25rem}.brick-button[data-size=xl]{--brick-button-min-block-size:var(--brick-control-min-block-size-xl);--brick-button-padding-block:.75rem;--brick-button-padding-inline:1.5rem;--brick-button-gap:.75rem;--brick-button-font-size:var(--brick-typography-control-xl-font-size);--brick-button-icon-size:1.5rem}.brick-button[data-tone=neutral]{--brick-button-tone-solid:color-mix(in srgb, var(--brick-color-surface-subtle), var(--brick-color-text-primary) 16%);--brick-button-tone-solid-hover:color-mix(in srgb, var(--brick-color-surface-subtle), var(--brick-color-text-primary) 22%);--brick-button-tone-solid-pressed:color-mix(in srgb, var(--brick-color-surface-subtle), var(--brick-color-text-primary) 28%);--brick-button-tone-on-solid:var(--brick-color-text-primary);--brick-button-tone-soft:var(--brick-color-surface-subtle);--brick-button-tone-soft-hover:var(--brick-color-surface-base);--brick-button-tone-soft-pressed:var(--brick-color-border-subtle);--brick-button-tone-on-soft:var(--brick-color-text-primary);--brick-button-tone-border:var(--brick-color-border-strong);--brick-button-tone-text:var(--brick-color-text-primary)}.brick-button[data-tone=accent]{--brick-button-tone-solid:var(--brick-color-accent-solid);--brick-button-tone-solid-hover:var(--brick-color-accent-solid-hover);--brick-button-tone-solid-pressed:var(--brick-color-accent-solid-pressed);--brick-button-tone-on-solid:var(--brick-color-accent-on-solid);--brick-button-tone-soft:var(--brick-color-accent-soft);--brick-button-tone-soft-hover:var(--brick-color-accent-soft-hover);--brick-button-tone-soft-pressed:var(--brick-color-accent-soft-pressed);--brick-button-tone-on-soft:var(--brick-color-accent-on-soft);--brick-button-tone-border:var(--brick-color-accent-border);--brick-button-tone-text:var(--brick-color-accent-text)}.brick-button[data-tone=info]{--brick-button-tone-solid:var(--brick-color-info-solid);--brick-button-tone-solid-hover:var(--brick-color-info-solid-hover);--brick-button-tone-solid-pressed:var(--brick-color-info-solid-pressed);--brick-button-tone-on-solid:var(--brick-color-info-on-solid);--brick-button-tone-soft:var(--brick-color-info-soft);--brick-button-tone-soft-hover:var(--brick-color-info-soft-hover);--brick-button-tone-soft-pressed:var(--brick-color-info-soft-pressed);--brick-button-tone-on-soft:var(--brick-color-info-on-soft);--brick-button-tone-border:var(--brick-color-info-border);--brick-button-tone-text:var(--brick-color-info-text)}.brick-button[data-tone=success]{--brick-button-tone-solid:var(--brick-color-success-solid);--brick-button-tone-solid-hover:var(--brick-color-success-solid-hover);--brick-button-tone-solid-pressed:var(--brick-color-success-solid-pressed);--brick-button-tone-on-solid:var(--brick-color-success-on-solid);--brick-button-tone-soft:var(--brick-color-success-soft);--brick-button-tone-soft-hover:var(--brick-color-success-soft-hover);--brick-button-tone-soft-pressed:var(--brick-color-success-soft-pressed);--brick-button-tone-on-soft:var(--brick-color-success-on-soft);--brick-button-tone-border:var(--brick-color-success-border);--brick-button-tone-text:var(--brick-color-success-text)}.brick-button[data-tone=warning]{--brick-button-tone-solid:var(--brick-color-warning-solid);--brick-button-tone-solid-hover:var(--brick-color-warning-solid-hover);--brick-button-tone-solid-pressed:var(--brick-color-warning-solid-pressed);--brick-button-tone-on-solid:var(--brick-color-warning-on-solid);--brick-button-tone-soft:var(--brick-color-warning-soft);--brick-button-tone-soft-hover:var(--brick-color-warning-soft-hover);--brick-button-tone-soft-pressed:var(--brick-color-warning-soft-pressed);--brick-button-tone-on-soft:var(--brick-color-warning-on-soft);--brick-button-tone-border:var(--brick-color-warning-border);--brick-button-tone-text:var(--brick-color-warning-text)}.brick-button[data-tone=danger]{--brick-button-tone-solid:var(--brick-color-danger-solid);--brick-button-tone-solid-hover:var(--brick-color-danger-solid-hover);--brick-button-tone-solid-pressed:var(--brick-color-danger-solid-pressed);--brick-button-tone-on-solid:var(--brick-color-danger-on-solid);--brick-button-tone-soft:var(--brick-color-danger-soft);--brick-button-tone-soft-hover:var(--brick-color-danger-soft-hover);--brick-button-tone-soft-pressed:var(--brick-color-danger-soft-pressed);--brick-button-tone-on-soft:var(--brick-color-danger-on-soft);--brick-button-tone-border:var(--brick-color-danger-border);--brick-button-tone-text:var(--brick-color-danger-text)}.brick-button[data-variant=soft]{--brick-button-background:var(--brick-button-tone-soft);--brick-button-background-hover:var(--brick-button-tone-soft-hover);--brick-button-background-pressed:var(--brick-button-tone-soft-pressed);--brick-button-foreground:var(--brick-button-tone-on-soft);--brick-button-border-color:var(--brick-button-tone-border)}.brick-button[data-variant=outline]{--brick-button-background:transparent;--brick-button-background-hover:var(--brick-button-tone-soft);--brick-button-background-pressed:var(--brick-button-tone-soft-hover);--brick-button-foreground:var(--brick-button-tone-text);--brick-button-border-color:var(--brick-button-tone-border)}.brick-button[data-variant=ghost]{--brick-button-background:transparent;--brick-button-background-hover:var(--brick-button-tone-soft);--brick-button-background-pressed:var(--brick-button-tone-soft-hover);--brick-button-foreground:var(--brick-button-tone-text);--brick-button-border-color:transparent}@media (hover:hover) and (pointer:fine){.brick-button:not([data-disabled],[data-loading]):hover{background:var(--brick-button-background-hover);border-color:var(--brick-button-background-hover)}.brick-button[data-variant=soft]:not([data-disabled],[data-loading]):hover,.brick-button[data-variant=outline]:not([data-disabled],[data-loading]):hover{border-color:var(--brick-button-tone-border)}.brick-button[data-variant=ghost]:not([data-disabled],[data-loading]):hover{border-color:#0000}}@media (prefers-reduced-motion:reduce){.brick-button{transition-duration:0s}}@media (forced-colors:active){.brick-button{color:buttontext;background:buttonface;border-color:buttontext}.brick-button:focus-visible{outline-color:highlight}.brick-button[data-disabled]{color:graytext;opacity:1;border-color:graytext}}.brick-code{--brick-code-foreground:var(--brick-color-text-primary);--brick-code-background:var(--brick-color-surface-subtle);--brick-code-border-color:var(--brick-color-border-subtle);--brick-code-border-width:var(--brick-border-width);--brick-code-radius:var(--brick-radius-subtle);--brick-code-padding-block:.0625em;--brick-code-padding-inline:.3em;--brick-code-font-family:var(--brick-typography-code-inline-font-family);--brick-code-font-size:var(--brick-typography-code-inline-font-size);--brick-code-font-weight:var(--brick-typography-code-inline-font-weight);--brick-code-line-height:var(--brick-typography-code-inline-line-height);--brick-code-letter-spacing:var(--brick-typography-code-inline-letter-spacing);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:var(--brick-code-padding-block) var(--brick-code-padding-inline);border:var(--brick-code-border-width) solid var(--brick-code-border-color);border-radius:var(--brick-code-radius);background:var(--brick-code-background);color:var(--brick-code-foreground);font-family:var(--brick-code-font-family);font-size:var(--brick-code-font-size);font-weight:var(--brick-code-font-weight);letter-spacing:var(--brick-code-letter-spacing);line-height:var(--brick-code-line-height);overflow-wrap:anywhere;white-space:normal}.brick-code[data-variant=plain]{--brick-code-background:transparent;--brick-code-border-width:0rem;--brick-code-padding-block:0em;--brick-code-padding-inline:0em}.brick-code[data-tone=inherit]{--brick-code-foreground:currentColor}.brick-code[data-size=sm]{--brick-code-font-size:var(--brick-typography-body-sm-font-size);--brick-code-line-height:var(--brick-typography-body-sm-line-height)}.brick-code[data-size=md]{--brick-code-font-size:var(--brick-typography-body-md-font-size);--brick-code-line-height:var(--brick-typography-body-md-line-height)}@media (forced-colors:active){.brick-code{--brick-code-foreground:CanvasText;--brick-code-background:Canvas;--brick-code-border-color:CanvasText}}.brick-scroll-area{--brick-scroll-area-scrollbar-thumb:var(--brick-color-border-strong);--brick-scroll-area-scrollbar-track:transparent;min-block-size:0;min-inline-size:0}.brick-scroll-area-viewport{box-sizing:border-box;scrollbar-color:var(--brick-scroll-area-scrollbar-thumb) var(--brick-scroll-area-scrollbar-track);scrollbar-width:auto;block-size:100%;min-block-size:0;inline-size:100%;min-inline-size:0}.brick-scroll-area-viewport[data-orientation=vertical]{overflow:hidden auto}.brick-scroll-area-viewport[data-orientation=horizontal]{overflow:auto hidden}.brick-scroll-area-viewport[data-orientation=both]{overflow:auto}.brick-scroll-area[data-scrollbar-gutter=stable]>.brick-scroll-area-viewport{scrollbar-gutter:stable}.brick-scroll-area[data-scrollbar-visibility=always]>.brick-scroll-area-viewport[data-orientation=vertical]{overflow-y:scroll}.brick-scroll-area[data-scrollbar-visibility=always]>.brick-scroll-area-viewport[data-orientation=horizontal]{overflow-x:scroll}.brick-scroll-area[data-scrollbar-visibility=always]>.brick-scroll-area-viewport[data-orientation=both]{overflow:scroll}.brick-scroll-area[data-scrollbar-visibility=interaction]>.brick-scroll-area-viewport{scrollbar-color:transparent transparent}.brick-scroll-area[data-scrollbar-visibility=interaction]:is(:hover,:focus-within)>.brick-scroll-area-viewport{scrollbar-color:var(--brick-scroll-area-scrollbar-thumb) var(--brick-scroll-area-scrollbar-track)}.brick-scroll-area-viewport:focus-visible{outline:var(--brick-border-focus-width) solid var(--brick-color-focus-ring);outline-offset:calc(-1 * var(--brick-border-focus-width))}@media (forced-colors:active){.brick-scroll-area-viewport,.brick-scroll-area[data-scrollbar-visibility=interaction]>.brick-scroll-area-viewport{scrollbar-color:auto}.brick-scroll-area-viewport:focus-visible{outline-color:highlight}}.brick-code-block{--brick-code-block-background:var(--brick-color-surface-subtle);--brick-code-block-foreground:var(--brick-color-text-primary);--brick-code-block-border-color:var(--brick-color-border-subtle);--brick-code-block-border-width:0rem;--brick-code-block-radius:var(--brick-radius-surface);--brick-code-block-header-padding:var(--brick-space-3) var(--brick-space-4);--brick-code-block-content-padding:var(--brick-space-4);--brick-code-block-gap:var(--brick-space-2);--brick-code-block-font-family:var(--brick-typography-code-block-md-font-family);--brick-code-block-font-size:var(--brick-typography-code-block-md-font-size);--brick-code-block-font-weight:var(--brick-typography-code-block-md-font-weight);--brick-code-block-line-height:var(--brick-typography-code-block-md-line-height);--brick-code-block-letter-spacing:var(--brick-typography-code-block-md-letter-spacing);--brick-code-block-selection-background:var(--brick-color-accent-soft);--brick-code-block-selection-foreground:var(--brick-color-accent-text);box-sizing:border-box;border:var(--brick-code-block-border-width) solid var(--brick-code-block-border-color);border-radius:var(--brick-code-block-radius);background:var(--brick-code-block-background);min-inline-size:0;max-inline-size:100%;color:var(--brick-code-block-foreground);overflow:clip}.brick-code-block[data-variant=bordered]{--brick-code-block-background:var(--brick-color-surface-base);--brick-code-block-border-width:var(--brick-border-width)}.brick-code-block[data-variant=plain]{--brick-code-block-background:transparent;--brick-code-block-radius:0rem}.brick-code-block[data-size=sm]{--brick-code-block-header-padding:var(--brick-space-2) var(--brick-space-3);--brick-code-block-content-padding:var(--brick-space-3);--brick-code-block-font-family:var(--brick-typography-code-block-sm-font-family);--brick-code-block-font-size:var(--brick-typography-code-block-sm-font-size);--brick-code-block-font-weight:var(--brick-typography-code-block-sm-font-weight);--brick-code-block-line-height:var(--brick-typography-code-block-sm-line-height);--brick-code-block-letter-spacing:var(--brick-typography-code-block-sm-letter-spacing)}.brick-code-block-header{align-items:center;gap:var(--brick-code-block-gap);min-inline-size:0;padding:var(--brick-code-block-header-padding);border-block-end:var(--brick-border-width) solid var(--brick-code-block-border-color);display:flex}.brick-code-block-title{min-inline-size:0;color:var(--brick-color-text-primary);font:var(--brick-font-weight-medium) var(--brick-typography-body-sm-font-size) / var(--brick-typography-body-sm-line-height) var(--brick-font-family-body);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.brick-code-block-language{color:var(--brick-color-text-secondary);font:var(--brick-font-weight-medium) var(--brick-typography-caption-font-size) / var(--brick-typography-caption-line-height) var(--brick-font-family-mono)}.brick-code-block-actions{align-items:center;gap:var(--brick-space-1);margin-inline-start:auto;display:flex}.brick-code-block-scroll-area{max-inline-size:100%}.brick-code-block-content{max-inline-size:100%;padding:var(--brick-code-block-content-padding)}.brick-code-block-pre{-webkit-text-size-adjust:none;-moz-text-size-adjust:none;text-size-adjust:none;min-inline-size:max-content;font-family:var(--brick-code-block-font-family);font-size:var(--brick-code-block-font-size);font-weight:var(--brick-code-block-font-weight);letter-spacing:var(--brick-code-block-letter-spacing);line-height:var(--brick-code-block-line-height);tab-size:2;white-space:pre;margin:0}.brick-code-block-content[data-wrap=wrap] .brick-code-block-pre{white-space:pre-wrap;overflow-wrap:anywhere;min-inline-size:0}.brick-code-block-pre>.brick-code{font:inherit;letter-spacing:inherit;white-space:inherit}.brick-code-block-pre ::selection{background:var(--brick-code-block-selection-background);color:var(--brick-code-block-selection-foreground)}.brick-code-block-copy-status{padding-inline:var(--brick-space-4);color:var(--brick-color-text-secondary);font:var(--brick-typography-caption-font-weight) var(--brick-typography-caption-font-size) / var(--brick-typography-caption-line-height) var(--brick-typography-caption-font-family);display:block}.brick-code-block-copy-status:not(:empty){padding-block:var(--brick-space-2)}@media (forced-colors:active){.brick-code-block{--brick-code-block-background:Canvas;--brick-code-block-foreground:CanvasText;--brick-code-block-border-color:CanvasText;--brick-code-block-border-width:var(--brick-border-width);--brick-code-block-selection-background:Highlight;--brick-code-block-selection-foreground:HighlightText}}}@layer brick.utilities,brick.effects;
2
2
  /*# sourceMappingURL=code-block.css.map */
package/dist/styles/code-block.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":null,"mappings":"ACAA,sCAAA,wBCCE,+cAcA,4HAKA,uCACE,sFAKF,8BACE,qIAMF,iIAUA,mIC1CA,0tEAwDA,iEAIA,yJAKA,+JAKA,wMAKA,gGAIA,oLAOA,wDAKA,wCAIA,0GAIA,yCAIA,4FAOA,uHAKA,gDAIA,wDAIA,8EAIA,6SASA,0SASA,8SASA,0SASA,osBAiBA,gqBAaA,0oBAaA,2qBAaA,2qBAaA,gqBAaA,4VAQA,kUAQA,4SAQA,wCACE,0JAKA,sMAKA,gGAKF,uCACE,sCAKF,8BACE,6EAMA,oDAIA,6EC9SF,ixCA8BA,kKAOA,oEACA,gKAIA,gKAKA,8BACE,oHChDF,2KAQA,6OAUA,4EACA,8EACA,iEAEA,qGACA,8HACA,gIACA,wHACA,8HACA,iNAIA,gLAKA,8BACE,uIAEA,mECvCF,0yCA2BA,iKAKA,+GAKA,2jBAUA,gPASA,qSASA,8NAKA,4GAOA,mDAEA,+FAKA,uZAcA,8HAMA,0FAMA,6IAKA,6SAOA,6EAEA,8BACE,+SL9HJ","sources":["home/runner/work/brick/brick/.brick-cache/production/code-block.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/_action-spinner/action-spinner.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/button/button.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/code/code.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/scroll-area/scroll-area.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/code-block/code-block.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/_action-spinner/action-spinner.css\";\n@import \"../../src/components/button/button.css\";\n@import \"../../src/components/code/code.css\";\n@import \"../../src/components/scroll-area/scroll-area.css\";\n@import \"../../src/components/code-block/code-block.css\";","@layer brick.tokens, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n :where(.brick-button, .brick-icon-button)[data-loading]::after {\n position: absolute;\n inset-block-start: 50%;\n inset-inline-start: 50%;\n inline-size: var(--brick-action-spinner-size);\n block-size: var(--brick-action-spinner-size);\n border: 0.125rem solid transparent;\n border-block-start-color: var(--brick-action-spinner-color);\n border-inline-end-color: var(--brick-action-spinner-color);\n border-radius: var(--brick-radius-full);\n content: \"\";\n animation: brick-action-spinner-spin 700ms linear infinite;\n }\n\n :where([dir=\"rtl\"])\n :where(.brick-button, .brick-icon-button)[data-loading]::after {\n animation-name: brick-action-spinner-spin-rtl;\n }\n\n @media (prefers-reduced-motion: reduce) {\n :where(.brick-button, .brick-icon-button)[data-loading]::after {\n animation-duration: 1400ms;\n }\n }\n\n @media (forced-colors: active) {\n :where(.brick-button, .brick-icon-button)[data-loading]::after {\n border-block-start-color: ButtonText;\n border-inline-end-color: ButtonText;\n }\n }\n\n @keyframes brick-action-spinner-spin {\n from {\n transform: translate(-50%, -50%) rotate(0deg);\n }\n\n to {\n transform: translate(-50%, -50%) rotate(360deg);\n }\n }\n\n @keyframes brick-action-spinner-spin-rtl {\n from {\n transform: translate(50%, -50%) rotate(0deg);\n }\n\n to {\n transform: translate(50%, -50%) rotate(360deg);\n }\n }\n}\n","@layer brick.components {\n .brick-button {\n --brick-button-background: var(--brick-button-tone-solid);\n --brick-button-background-hover: var(--brick-button-tone-solid-hover);\n --brick-button-background-pressed: var(--brick-button-tone-solid-pressed);\n --brick-button-foreground: var(--brick-button-tone-on-solid);\n --brick-button-border-color: var(--brick-button-background);\n --brick-button-focus-ring: var(--brick-color-focus-ring);\n --brick-button-min-block-size: var(--brick-control-min-block-size-md);\n --brick-button-padding-block: 0.5rem;\n --brick-button-padding-inline: 1rem;\n --brick-button-gap: 0.5rem;\n --brick-button-radius: var(--brick-radius-control);\n --brick-button-font-family: var(--brick-typography-control-md-font-family);\n --brick-button-font-size: var(--brick-typography-control-md-font-size);\n --brick-button-font-weight: var(--brick-typography-control-md-font-weight);\n --brick-button-line-height: var(--brick-typography-control-md-line-height);\n --brick-button-letter-spacing: var(--brick-typography-control-md-letter-spacing);\n --brick-button-icon-size: 1.125rem;\n --brick-action-spinner-size: 1em;\n --brick-action-spinner-color: var(\n --brick-button-spinner-color,\n var(--brick-button-foreground)\n );\n\n position: relative;\n display: inline-flex;\n box-sizing: border-box;\n min-inline-size: 0;\n max-inline-size: 100%;\n min-block-size: var(--brick-button-min-block-size);\n align-items: center;\n justify-content: center;\n gap: var(--brick-button-gap);\n padding-block: var(--brick-button-padding-block);\n padding-inline: var(--brick-button-padding-inline);\n border: var(--brick-border-width) solid var(--brick-button-border-color);\n border-radius: var(--brick-button-radius);\n appearance: none;\n background: var(--brick-button-background);\n color: var(--brick-button-foreground);\n font-family: var(--brick-button-font-family);\n font-size: var(--brick-button-font-size);\n font-weight: var(--brick-button-font-weight);\n letter-spacing: var(--brick-button-letter-spacing);\n line-height: var(--brick-button-line-height);\n text-align: center;\n text-decoration: none;\n overflow-wrap: anywhere;\n user-select: none;\n vertical-align: middle;\n transition:\n background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);\n }\n\n .brick-button:not([data-disabled], [data-loading]) {\n cursor: pointer;\n }\n\n .brick-button:focus-visible {\n outline: var(--brick-border-focus-width) solid var(--brick-button-focus-ring);\n outline-offset: var(--brick-border-focus-offset);\n }\n\n .brick-button:not([data-disabled], [data-loading]):active {\n background: var(--brick-button-background-pressed);\n border-color: var(--brick-button-background-pressed);\n }\n\n .brick-button[data-variant=\"soft\"]:not([data-disabled], [data-loading]):active,\n .brick-button[data-variant=\"outline\"]:not([data-disabled], [data-loading]):active {\n border-color: var(--brick-button-tone-border);\n }\n\n .brick-button[data-variant=\"ghost\"]:not([data-disabled], [data-loading]):active {\n border-color: transparent;\n }\n\n .brick-button[data-disabled] {\n border-color: var(--brick-color-border-default);\n background: var(--brick-color-surface-subtle);\n color: var(--brick-color-text-secondary);\n cursor: not-allowed;\n }\n\n .brick-button[data-loading] {\n cursor: progress;\n color: transparent;\n }\n\n .brick-button[data-loading] > * {\n opacity: 0;\n }\n\n .brick-button[data-disabled][data-loading] {\n --brick-button-spinner-color: var(--brick-color-text-secondary);\n }\n\n .brick-button__content {\n min-inline-size: 0;\n }\n\n .brick-button__icon {\n display: inline-flex;\n flex: 0 0 auto;\n align-items: center;\n justify-content: center;\n }\n\n .brick-button__icon > :where(svg, img) {\n inline-size: var(--brick-button-icon-size);\n block-size: var(--brick-button-icon-size);\n }\n\n .brick-button[data-full-width] {\n inline-size: 100%;\n }\n\n .brick-button[data-shape=\"sharp\"] {\n --brick-button-radius: 0;\n }\n\n .brick-button[data-shape=\"pill\"] {\n --brick-button-radius: var(--brick-radius-full);\n }\n\n .brick-button[data-size=\"xs\"] {\n --brick-button-min-block-size: var(--brick-control-min-block-size-xs);\n --brick-button-padding-block: 0.25rem;\n --brick-button-padding-inline: 0.625rem;\n --brick-button-gap: 0.375rem;\n --brick-button-font-size: var(--brick-typography-control-xs-font-size);\n --brick-button-icon-size: 0.875rem;\n }\n\n .brick-button[data-size=\"sm\"] {\n --brick-button-min-block-size: var(--brick-control-min-block-size-sm);\n --brick-button-padding-block: 0.375rem;\n --brick-button-padding-inline: 0.75rem;\n --brick-button-gap: 0.375rem;\n --brick-button-font-size: var(--brick-typography-control-sm-font-size);\n --brick-button-icon-size: 1rem;\n }\n\n .brick-button[data-size=\"lg\"] {\n --brick-button-min-block-size: var(--brick-control-min-block-size-lg);\n --brick-button-padding-block: 0.625rem;\n --brick-button-padding-inline: 1.25rem;\n --brick-button-gap: 0.625rem;\n --brick-button-font-size: var(--brick-typography-control-lg-font-size);\n --brick-button-icon-size: 1.25rem;\n }\n\n .brick-button[data-size=\"xl\"] {\n --brick-button-min-block-size: var(--brick-control-min-block-size-xl);\n --brick-button-padding-block: 0.75rem;\n --brick-button-padding-inline: 1.5rem;\n --brick-button-gap: 0.75rem;\n --brick-button-font-size: var(--brick-typography-control-xl-font-size);\n --brick-button-icon-size: 1.5rem;\n }\n\n .brick-button[data-tone=\"neutral\"] {\n --brick-button-tone-solid: var(--brick-color-text-primary);\n --brick-button-tone-solid-hover: var(--brick-color-text-secondary);\n --brick-button-tone-solid-pressed: color-mix(\n in srgb,\n var(--brick-color-text-primary),\n var(--brick-color-text-secondary) 35%\n );\n --brick-button-tone-on-solid: var(--brick-color-text-inverse);\n --brick-button-tone-soft: var(--brick-color-surface-subtle);\n --brick-button-tone-soft-hover: var(--brick-color-surface-base);\n --brick-button-tone-soft-pressed: var(--brick-color-border-subtle);\n --brick-button-tone-on-soft: var(--brick-color-text-primary);\n --brick-button-tone-border: var(--brick-color-border-strong);\n --brick-button-tone-text: var(--brick-color-text-primary);\n }\n\n .brick-button[data-tone=\"accent\"] {\n --brick-button-tone-solid: var(--brick-color-accent-solid);\n --brick-button-tone-solid-hover: var(--brick-color-accent-solid-hover);\n --brick-button-tone-solid-pressed: var(--brick-color-accent-solid-pressed);\n --brick-button-tone-on-solid: var(--brick-color-accent-on-solid);\n --brick-button-tone-soft: var(--brick-color-accent-soft);\n --brick-button-tone-soft-hover: var(--brick-color-accent-soft-hover);\n --brick-button-tone-soft-pressed: var(--brick-color-accent-soft-pressed);\n --brick-button-tone-on-soft: var(--brick-color-accent-on-soft);\n --brick-button-tone-border: var(--brick-color-accent-border);\n --brick-button-tone-text: var(--brick-color-accent-text);\n }\n\n .brick-button[data-tone=\"info\"] {\n --brick-button-tone-solid: var(--brick-color-info-solid);\n --brick-button-tone-solid-hover: var(--brick-color-info-solid-hover);\n --brick-button-tone-solid-pressed: var(--brick-color-info-solid-pressed);\n --brick-button-tone-on-solid: var(--brick-color-info-on-solid);\n --brick-button-tone-soft: var(--brick-color-info-soft);\n --brick-button-tone-soft-hover: var(--brick-color-info-soft-hover);\n --brick-button-tone-soft-pressed: var(--brick-color-info-soft-pressed);\n --brick-button-tone-on-soft: var(--brick-color-info-on-soft);\n --brick-button-tone-border: var(--brick-color-info-border);\n --brick-button-tone-text: var(--brick-color-info-text);\n }\n\n .brick-button[data-tone=\"success\"] {\n --brick-button-tone-solid: var(--brick-color-success-solid);\n --brick-button-tone-solid-hover: var(--brick-color-success-solid-hover);\n --brick-button-tone-solid-pressed: var(--brick-color-success-solid-pressed);\n --brick-button-tone-on-solid: var(--brick-color-success-on-solid);\n --brick-button-tone-soft: var(--brick-color-success-soft);\n --brick-button-tone-soft-hover: var(--brick-color-success-soft-hover);\n --brick-button-tone-soft-pressed: var(--brick-color-success-soft-pressed);\n --brick-button-tone-on-soft: var(--brick-color-success-on-soft);\n --brick-button-tone-border: var(--brick-color-success-border);\n --brick-button-tone-text: var(--brick-color-success-text);\n }\n\n .brick-button[data-tone=\"warning\"] {\n --brick-button-tone-solid: var(--brick-color-warning-solid);\n --brick-button-tone-solid-hover: var(--brick-color-warning-solid-hover);\n --brick-button-tone-solid-pressed: var(--brick-color-warning-solid-pressed);\n --brick-button-tone-on-solid: var(--brick-color-warning-on-solid);\n --brick-button-tone-soft: var(--brick-color-warning-soft);\n --brick-button-tone-soft-hover: var(--brick-color-warning-soft-hover);\n --brick-button-tone-soft-pressed: var(--brick-color-warning-soft-pressed);\n --brick-button-tone-on-soft: var(--brick-color-warning-on-soft);\n --brick-button-tone-border: var(--brick-color-warning-border);\n --brick-button-tone-text: var(--brick-color-warning-text);\n }\n\n .brick-button[data-tone=\"danger\"] {\n --brick-button-tone-solid: var(--brick-color-danger-solid);\n --brick-button-tone-solid-hover: var(--brick-color-danger-solid-hover);\n --brick-button-tone-solid-pressed: var(--brick-color-danger-solid-pressed);\n --brick-button-tone-on-solid: var(--brick-color-danger-on-solid);\n --brick-button-tone-soft: var(--brick-color-danger-soft);\n --brick-button-tone-soft-hover: var(--brick-color-danger-soft-hover);\n --brick-button-tone-soft-pressed: var(--brick-color-danger-soft-pressed);\n --brick-button-tone-on-soft: var(--brick-color-danger-on-soft);\n --brick-button-tone-border: var(--brick-color-danger-border);\n --brick-button-tone-text: var(--brick-color-danger-text);\n }\n\n .brick-button[data-variant=\"soft\"] {\n --brick-button-background: var(--brick-button-tone-soft);\n --brick-button-background-hover: var(--brick-button-tone-soft-hover);\n --brick-button-background-pressed: var(--brick-button-tone-soft-pressed);\n --brick-button-foreground: var(--brick-button-tone-on-soft);\n --brick-button-border-color: var(--brick-button-tone-border);\n }\n\n .brick-button[data-variant=\"outline\"] {\n --brick-button-background: transparent;\n --brick-button-background-hover: var(--brick-button-tone-soft);\n --brick-button-background-pressed: var(--brick-button-tone-soft-hover);\n --brick-button-foreground: var(--brick-button-tone-text);\n --brick-button-border-color: var(--brick-button-tone-border);\n }\n\n .brick-button[data-variant=\"ghost\"] {\n --brick-button-background: transparent;\n --brick-button-background-hover: var(--brick-button-tone-soft);\n --brick-button-background-pressed: var(--brick-button-tone-soft-hover);\n --brick-button-foreground: var(--brick-button-tone-text);\n --brick-button-border-color: transparent;\n }\n\n @media (hover: hover) and (pointer: fine) {\n .brick-button:not([data-disabled], [data-loading]):hover {\n background: var(--brick-button-background-hover);\n border-color: var(--brick-button-background-hover);\n }\n\n .brick-button[data-variant=\"soft\"]:not([data-disabled], [data-loading]):hover,\n .brick-button[data-variant=\"outline\"]:not([data-disabled], [data-loading]):hover {\n border-color: var(--brick-button-tone-border);\n }\n\n .brick-button[data-variant=\"ghost\"]:not([data-disabled], [data-loading]):hover {\n border-color: transparent;\n }\n }\n\n @media (prefers-reduced-motion: reduce) {\n .brick-button {\n transition-duration: 0ms;\n }\n }\n\n @media (forced-colors: active) {\n .brick-button {\n border-color: ButtonText;\n background: ButtonFace;\n color: ButtonText;\n }\n\n .brick-button:focus-visible {\n outline-color: Highlight;\n }\n\n .brick-button[data-disabled] {\n border-color: GrayText;\n color: GrayText;\n opacity: 1;\n }\n }\n}\n","@layer brick.components {\n .brick-code {\n --brick-code-foreground: var(--brick-color-text-primary);\n --brick-code-background: var(--brick-color-surface-subtle);\n --brick-code-border-color: var(--brick-color-border-subtle);\n --brick-code-border-width: var(--brick-border-width);\n --brick-code-radius: var(--brick-radius-subtle);\n --brick-code-padding-block: 0.0625em;\n --brick-code-padding-inline: 0.3em;\n --brick-code-font-family: var(--brick-typography-code-inline-font-family);\n --brick-code-font-size: var(--brick-typography-code-inline-font-size);\n --brick-code-font-weight: var(--brick-typography-code-inline-font-weight);\n --brick-code-line-height: var(--brick-typography-code-inline-line-height);\n --brick-code-letter-spacing: var(--brick-typography-code-inline-letter-spacing);\n\n box-decoration-break: clone;\n padding: var(--brick-code-padding-block) var(--brick-code-padding-inline);\n border: var(--brick-code-border-width) solid var(--brick-code-border-color);\n border-radius: var(--brick-code-radius);\n background: var(--brick-code-background);\n color: var(--brick-code-foreground);\n font-family: var(--brick-code-font-family);\n font-size: var(--brick-code-font-size);\n font-weight: var(--brick-code-font-weight);\n letter-spacing: var(--brick-code-letter-spacing);\n line-height: var(--brick-code-line-height);\n overflow-wrap: anywhere;\n white-space: normal;\n -webkit-box-decoration-break: clone;\n }\n\n .brick-code[data-variant=\"plain\"] {\n --brick-code-background: transparent;\n --brick-code-border-width: 0rem;\n --brick-code-padding-block: 0em;\n --brick-code-padding-inline: 0em;\n }\n\n .brick-code[data-tone=\"inherit\"] { --brick-code-foreground: currentColor; }\n .brick-code[data-size=\"sm\"] {\n --brick-code-font-size: var(--brick-typography-body-sm-font-size);\n --brick-code-line-height: var(--brick-typography-body-sm-line-height);\n }\n .brick-code[data-size=\"md\"] {\n --brick-code-font-size: var(--brick-typography-body-md-font-size);\n --brick-code-line-height: var(--brick-typography-body-md-line-height);\n }\n\n @media (forced-colors: active) {\n .brick-code {\n --brick-code-foreground: CanvasText;\n --brick-code-background: Canvas;\n --brick-code-border-color: CanvasText;\n }\n }\n}\n","@layer brick.components {\n .brick-scroll-area {\n --brick-scroll-area-scrollbar-thumb: var(--brick-color-border-strong);\n --brick-scroll-area-scrollbar-track: transparent;\n\n min-inline-size: 0;\n min-block-size: 0;\n }\n\n .brick-scroll-area-viewport {\n box-sizing: border-box;\n inline-size: 100%;\n block-size: 100%;\n min-inline-size: 0;\n min-block-size: 0;\n scrollbar-color: var(--brick-scroll-area-scrollbar-thumb) var(--brick-scroll-area-scrollbar-track);\n scrollbar-width: auto;\n }\n\n .brick-scroll-area-viewport[data-orientation=\"vertical\"] { overflow-x: hidden; overflow-y: auto; }\n .brick-scroll-area-viewport[data-orientation=\"horizontal\"] { overflow-x: auto; overflow-y: hidden; }\n .brick-scroll-area-viewport[data-orientation=\"both\"] { overflow: auto; }\n\n .brick-scroll-area[data-scrollbar-gutter=\"stable\"] > .brick-scroll-area-viewport { scrollbar-gutter: stable; }\n .brick-scroll-area[data-scrollbar-visibility=\"always\"] > .brick-scroll-area-viewport[data-orientation=\"vertical\"] { overflow-y: scroll; }\n .brick-scroll-area[data-scrollbar-visibility=\"always\"] > .brick-scroll-area-viewport[data-orientation=\"horizontal\"] { overflow-x: scroll; }\n .brick-scroll-area[data-scrollbar-visibility=\"always\"] > .brick-scroll-area-viewport[data-orientation=\"both\"] { overflow: scroll; }\n .brick-scroll-area[data-scrollbar-visibility=\"interaction\"] > .brick-scroll-area-viewport { scrollbar-color: transparent transparent; }\n .brick-scroll-area[data-scrollbar-visibility=\"interaction\"]:is(:hover, :focus-within) > .brick-scroll-area-viewport {\n scrollbar-color: var(--brick-scroll-area-scrollbar-thumb) var(--brick-scroll-area-scrollbar-track);\n }\n\n .brick-scroll-area-viewport:focus-visible {\n outline: var(--brick-border-focus-width) solid var(--brick-color-focus-ring);\n outline-offset: calc(-1 * var(--brick-border-focus-width));\n }\n\n @media (forced-colors: active) {\n .brick-scroll-area-viewport,\n .brick-scroll-area[data-scrollbar-visibility=\"interaction\"] > .brick-scroll-area-viewport { scrollbar-color: auto; }\n .brick-scroll-area-viewport:focus-visible { outline-color: Highlight; }\n }\n}\n","@layer brick.components {\n .brick-code-block {\n --brick-code-block-background: var(--brick-color-surface-subtle);\n --brick-code-block-foreground: var(--brick-color-text-primary);\n --brick-code-block-border-color: var(--brick-color-border-subtle);\n --brick-code-block-border-width: 0rem;\n --brick-code-block-radius: var(--brick-radius-surface);\n --brick-code-block-header-padding: var(--brick-space-3) var(--brick-space-4);\n --brick-code-block-content-padding: var(--brick-space-4);\n --brick-code-block-gap: var(--brick-space-2);\n --brick-code-block-font-family: var(--brick-typography-code-block-md-font-family);\n --brick-code-block-font-size: var(--brick-typography-code-block-md-font-size);\n --brick-code-block-font-weight: var(--brick-typography-code-block-md-font-weight);\n --brick-code-block-line-height: var(--brick-typography-code-block-md-line-height);\n --brick-code-block-letter-spacing: var(--brick-typography-code-block-md-letter-spacing);\n --brick-code-block-selection-background: var(--brick-color-accent-surface);\n --brick-code-block-selection-foreground: var(--brick-color-accent-text);\n\n box-sizing: border-box;\n min-inline-size: 0;\n max-inline-size: 100%;\n overflow: clip;\n border: var(--brick-code-block-border-width) solid var(--brick-code-block-border-color);\n border-radius: var(--brick-code-block-radius);\n background: var(--brick-code-block-background);\n color: var(--brick-code-block-foreground);\n }\n\n .brick-code-block[data-variant=\"bordered\"] {\n --brick-code-block-background: var(--brick-color-surface-base);\n --brick-code-block-border-width: var(--brick-border-width);\n }\n\n .brick-code-block[data-variant=\"plain\"] {\n --brick-code-block-background: transparent;\n --brick-code-block-radius: 0rem;\n }\n\n .brick-code-block[data-size=\"sm\"] {\n --brick-code-block-header-padding: var(--brick-space-2) var(--brick-space-3);\n --brick-code-block-content-padding: var(--brick-space-3);\n --brick-code-block-font-family: var(--brick-typography-code-block-sm-font-family);\n --brick-code-block-font-size: var(--brick-typography-code-block-sm-font-size);\n --brick-code-block-font-weight: var(--brick-typography-code-block-sm-font-weight);\n --brick-code-block-line-height: var(--brick-typography-code-block-sm-line-height);\n --brick-code-block-letter-spacing: var(--brick-typography-code-block-sm-letter-spacing);\n }\n\n .brick-code-block-header {\n display: flex;\n align-items: center;\n min-inline-size: 0;\n gap: var(--brick-code-block-gap);\n padding: var(--brick-code-block-header-padding);\n border-block-end: var(--brick-border-width) solid var(--brick-code-block-border-color);\n }\n\n .brick-code-block-title {\n min-inline-size: 0;\n overflow: hidden;\n color: var(--brick-color-text-primary);\n font: var(--brick-font-weight-medium) var(--brick-typography-body-sm-font-size) / var(--brick-typography-body-sm-line-height) var(--brick-font-family-body);\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .brick-code-block-language {\n color: var(--brick-color-text-secondary);\n font: var(--brick-font-weight-medium) var(--brick-typography-caption-font-size) / var(--brick-typography-caption-line-height) var(--brick-font-family-mono);\n }\n\n .brick-code-block-actions {\n display: flex;\n align-items: center;\n gap: var(--brick-space-1);\n margin-inline-start: auto;\n }\n\n .brick-code-block-scroll-area { max-inline-size: 100%; }\n\n .brick-code-block-content {\n max-inline-size: 100%;\n padding: var(--brick-code-block-content-padding);\n }\n\n .brick-code-block-pre {\n min-inline-size: max-content;\n margin: 0;\n -webkit-text-size-adjust: none;\n text-size-adjust: none;\n font-family: var(--brick-code-block-font-family);\n font-size: var(--brick-code-block-font-size);\n font-weight: var(--brick-code-block-font-weight);\n letter-spacing: var(--brick-code-block-letter-spacing);\n line-height: var(--brick-code-block-line-height);\n tab-size: 2;\n white-space: pre;\n }\n\n .brick-code-block-content[data-wrap=\"wrap\"] .brick-code-block-pre {\n min-inline-size: 0;\n white-space: pre-wrap;\n overflow-wrap: anywhere;\n }\n\n .brick-code-block-pre > .brick-code {\n font: inherit;\n letter-spacing: inherit;\n white-space: inherit;\n }\n\n .brick-code-block-pre ::selection {\n background: var(--brick-code-block-selection-background);\n color: var(--brick-code-block-selection-foreground);\n }\n\n .brick-code-block-copy-status {\n display: block;\n padding-inline: var(--brick-space-4);\n color: var(--brick-color-text-secondary);\n font: var(--brick-typography-caption-font-weight) var(--brick-typography-caption-font-size) / var(--brick-typography-caption-line-height) var(--brick-typography-caption-font-family);\n }\n\n .brick-code-block-copy-status:not(:empty) { padding-block: var(--brick-space-2); }\n\n @media (forced-colors: active) {\n .brick-code-block {\n --brick-code-block-background: Canvas;\n --brick-code-block-foreground: CanvasText;\n --brick-code-block-border-color: CanvasText;\n --brick-code-block-border-width: var(--brick-border-width);\n --brick-code-block-selection-background: Highlight;\n --brick-code-block-selection-foreground: HighlightText;\n }\n }\n}\n"],"names":[]}
1
+ {"version":3,"sourceRoot":null,"mappings":"ACAA,sDAAA,wBCCE,+cAcA,4HAKA,uCACE,sFAKF,8BACE,qIAMF,iIAUA,mIC1CA,0tEAwDA,iEAIA,yJAKA,+JAKA,wMAKA,gGAIA,iGAMA,qKAKA,gHAKA,mFAKA,wDAKA,wCAIA,yGAIA,yCAIA,4FAOA,uHAKA,gDAIA,wDAIA,8EAIA,6SASA,0SASA,8SASA,0SASA,wzBAyBA,gqBAaA,0oBAaA,2qBAaA,2qBAaA,gqBAaA,4VAQA,kUAQA,4SAQA,wCACE,0JAKA,sMAKA,gGAKF,uCACE,sCAKF,8BACE,6EAMA,oDAIA,6ECpUF,ixCA8BA,kKAOA,oEACA,gKAIA,gKAKA,8BACE,oHChDF,2KAQA,6OAUA,4EACA,8EACA,iEAEA,qGACA,8HACA,gIACA,wHACA,8HACA,iNAIA,gLAKA,8BACE,uIAEA,mECvCF,uyCA2BA,iKAKA,+GAKA,2jBAUA,gPASA,qSASA,8NAKA,4GAOA,mDAEA,+FAKA,uZAaA,8HAMA,0FAMA,6IAKA,6SAOA,6EAEA,8BACE,+SL7HJ","sources":["home/runner/work/brick/brick/.brick-cache/production/code-block.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/_action-spinner/action-spinner.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/button/button.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/code/code.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/scroll-area/scroll-area.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/code-block/code-block.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/_action-spinner/action-spinner.css\";\n@import \"../../src/components/button/button.css\";\n@import \"../../src/components/code/code.css\";\n@import \"../../src/components/scroll-area/scroll-area.css\";\n@import \"../../src/components/code-block/code-block.css\";","@layer brick.tokens, flowstack.theme, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n :where(.brick-button, .brick-icon-button)[data-loading]::after {\n position: absolute;\n inset-block-start: 50%;\n inset-inline-start: 50%;\n inline-size: var(--brick-action-spinner-size);\n block-size: var(--brick-action-spinner-size);\n border: 0.125rem solid transparent;\n border-block-start-color: var(--brick-action-spinner-color);\n border-inline-end-color: var(--brick-action-spinner-color);\n border-radius: var(--brick-radius-full);\n content: \"\";\n animation: brick-action-spinner-spin 700ms linear infinite;\n }\n\n :where([dir=\"rtl\"])\n :where(.brick-button, .brick-icon-button)[data-loading]::after {\n animation-name: brick-action-spinner-spin-rtl;\n }\n\n @media (prefers-reduced-motion: reduce) {\n :where(.brick-button, .brick-icon-button)[data-loading]::after {\n animation-duration: 1400ms;\n }\n }\n\n @media (forced-colors: active) {\n :where(.brick-button, .brick-icon-button)[data-loading]::after {\n border-block-start-color: ButtonText;\n border-inline-end-color: ButtonText;\n }\n }\n\n @keyframes brick-action-spinner-spin {\n from {\n transform: translate(-50%, -50%) rotate(0deg);\n }\n\n to {\n transform: translate(-50%, -50%) rotate(360deg);\n }\n }\n\n @keyframes brick-action-spinner-spin-rtl {\n from {\n transform: translate(50%, -50%) rotate(0deg);\n }\n\n to {\n transform: translate(50%, -50%) rotate(360deg);\n }\n }\n}\n","@layer brick.components {\n .brick-button {\n --brick-button-background: var(--brick-button-tone-solid);\n --brick-button-background-hover: var(--brick-button-tone-solid-hover);\n --brick-button-background-pressed: var(--brick-button-tone-solid-pressed);\n --brick-button-foreground: var(--brick-button-tone-on-solid);\n --brick-button-border-color: var(--brick-button-background);\n --brick-button-focus-ring: var(--brick-color-focus-ring);\n --brick-button-min-block-size: var(--brick-control-min-block-size-md);\n --brick-button-padding-block: 0.5rem;\n --brick-button-padding-inline: 1rem;\n --brick-button-gap: 0.5rem;\n --brick-button-radius: var(--brick-radius-control);\n --brick-button-font-family: var(--brick-typography-control-md-font-family);\n --brick-button-font-size: var(--brick-typography-control-md-font-size);\n --brick-button-font-weight: var(--brick-typography-control-md-font-weight);\n --brick-button-line-height: var(--brick-typography-control-md-line-height);\n --brick-button-letter-spacing: var(--brick-typography-control-md-letter-spacing);\n --brick-button-icon-size: 1.125rem;\n --brick-action-spinner-size: 1em;\n --brick-action-spinner-color: var(\n --brick-button-spinner-color,\n var(--brick-button-foreground)\n );\n\n position: relative;\n display: inline-flex;\n box-sizing: border-box;\n min-inline-size: 0;\n max-inline-size: 100%;\n min-block-size: var(--brick-button-min-block-size);\n align-items: center;\n justify-content: center;\n gap: var(--brick-button-gap);\n padding-block: var(--brick-button-padding-block);\n padding-inline: var(--brick-button-padding-inline);\n border: var(--brick-border-width) solid var(--brick-button-border-color);\n border-radius: var(--brick-button-radius);\n appearance: none;\n background: var(--brick-button-background);\n color: var(--brick-button-foreground);\n font-family: var(--brick-button-font-family);\n font-size: var(--brick-button-font-size);\n font-weight: var(--brick-button-font-weight);\n letter-spacing: var(--brick-button-letter-spacing);\n line-height: var(--brick-button-line-height);\n text-align: center;\n text-decoration: none;\n overflow-wrap: anywhere;\n user-select: none;\n vertical-align: middle;\n transition:\n background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);\n }\n\n .brick-button:not([data-disabled], [data-loading]) {\n cursor: pointer;\n }\n\n .brick-button:focus-visible {\n outline: var(--brick-border-focus-width) solid var(--brick-button-focus-ring);\n outline-offset: var(--brick-border-focus-offset);\n }\n\n .brick-button:not([data-disabled], [data-loading]):active {\n background: var(--brick-button-background-pressed);\n border-color: var(--brick-button-background-pressed);\n }\n\n .brick-button[data-variant=\"soft\"]:not([data-disabled], [data-loading]):active,\n .brick-button[data-variant=\"outline\"]:not([data-disabled], [data-loading]):active {\n border-color: var(--brick-button-tone-border);\n }\n\n .brick-button[data-variant=\"ghost\"]:not([data-disabled], [data-loading]):active {\n border-color: transparent;\n }\n\n .brick-button[data-disabled] {\n color: var(--brick-color-text-disabled);\n cursor: not-allowed;\n opacity: 1;\n }\n\n .brick-button[data-disabled]:is([data-variant=\"solid\"], [data-variant=\"soft\"]) {\n border-color: var(--brick-color-border-subtle);\n background: var(--brick-color-surface-subtle);\n }\n\n .brick-button[data-disabled][data-variant=\"outline\"] {\n border-color: var(--brick-color-border-subtle);\n background: transparent;\n }\n\n .brick-button[data-disabled][data-variant=\"ghost\"] {\n border-color: transparent;\n background: transparent;\n }\n\n .brick-button[data-loading] {\n cursor: progress;\n color: transparent;\n }\n\n .brick-button[data-loading] > * {\n opacity: 0;\n }\n\n .brick-button[data-disabled][data-loading] {\n --brick-button-spinner-color: var(--brick-color-text-disabled);\n }\n\n .brick-button__content {\n min-inline-size: 0;\n }\n\n .brick-button__icon {\n display: inline-flex;\n flex: 0 0 auto;\n align-items: center;\n justify-content: center;\n }\n\n .brick-button__icon > :where(svg, img) {\n inline-size: var(--brick-button-icon-size);\n block-size: var(--brick-button-icon-size);\n }\n\n .brick-button[data-full-width] {\n inline-size: 100%;\n }\n\n .brick-button[data-shape=\"sharp\"] {\n --brick-button-radius: 0;\n }\n\n .brick-button[data-shape=\"pill\"] {\n --brick-button-radius: var(--brick-radius-full);\n }\n\n .brick-button[data-size=\"xs\"] {\n --brick-button-min-block-size: var(--brick-control-min-block-size-xs);\n --brick-button-padding-block: 0.25rem;\n --brick-button-padding-inline: 0.625rem;\n --brick-button-gap: 0.375rem;\n --brick-button-font-size: var(--brick-typography-control-xs-font-size);\n --brick-button-icon-size: 0.875rem;\n }\n\n .brick-button[data-size=\"sm\"] {\n --brick-button-min-block-size: var(--brick-control-min-block-size-sm);\n --brick-button-padding-block: 0.375rem;\n --brick-button-padding-inline: 0.75rem;\n --brick-button-gap: 0.375rem;\n --brick-button-font-size: var(--brick-typography-control-sm-font-size);\n --brick-button-icon-size: 1rem;\n }\n\n .brick-button[data-size=\"lg\"] {\n --brick-button-min-block-size: var(--brick-control-min-block-size-lg);\n --brick-button-padding-block: 0.625rem;\n --brick-button-padding-inline: 1.25rem;\n --brick-button-gap: 0.625rem;\n --brick-button-font-size: var(--brick-typography-control-lg-font-size);\n --brick-button-icon-size: 1.25rem;\n }\n\n .brick-button[data-size=\"xl\"] {\n --brick-button-min-block-size: var(--brick-control-min-block-size-xl);\n --brick-button-padding-block: 0.75rem;\n --brick-button-padding-inline: 1.5rem;\n --brick-button-gap: 0.75rem;\n --brick-button-font-size: var(--brick-typography-control-xl-font-size);\n --brick-button-icon-size: 1.5rem;\n }\n\n .brick-button[data-tone=\"neutral\"] {\n --brick-button-tone-solid: color-mix(\n in srgb,\n var(--brick-color-surface-subtle),\n var(--brick-color-text-primary) 16%\n );\n --brick-button-tone-solid-hover: color-mix(\n in srgb,\n var(--brick-color-surface-subtle),\n var(--brick-color-text-primary) 22%\n );\n --brick-button-tone-solid-pressed: color-mix(\n in srgb,\n var(--brick-color-surface-subtle),\n var(--brick-color-text-primary) 28%\n );\n --brick-button-tone-on-solid: var(--brick-color-text-primary);\n --brick-button-tone-soft: var(--brick-color-surface-subtle);\n --brick-button-tone-soft-hover: var(--brick-color-surface-base);\n --brick-button-tone-soft-pressed: var(--brick-color-border-subtle);\n --brick-button-tone-on-soft: var(--brick-color-text-primary);\n --brick-button-tone-border: var(--brick-color-border-strong);\n --brick-button-tone-text: var(--brick-color-text-primary);\n }\n\n .brick-button[data-tone=\"accent\"] {\n --brick-button-tone-solid: var(--brick-color-accent-solid);\n --brick-button-tone-solid-hover: var(--brick-color-accent-solid-hover);\n --brick-button-tone-solid-pressed: var(--brick-color-accent-solid-pressed);\n --brick-button-tone-on-solid: var(--brick-color-accent-on-solid);\n --brick-button-tone-soft: var(--brick-color-accent-soft);\n --brick-button-tone-soft-hover: var(--brick-color-accent-soft-hover);\n --brick-button-tone-soft-pressed: var(--brick-color-accent-soft-pressed);\n --brick-button-tone-on-soft: var(--brick-color-accent-on-soft);\n --brick-button-tone-border: var(--brick-color-accent-border);\n --brick-button-tone-text: var(--brick-color-accent-text);\n }\n\n .brick-button[data-tone=\"info\"] {\n --brick-button-tone-solid: var(--brick-color-info-solid);\n --brick-button-tone-solid-hover: var(--brick-color-info-solid-hover);\n --brick-button-tone-solid-pressed: var(--brick-color-info-solid-pressed);\n --brick-button-tone-on-solid: var(--brick-color-info-on-solid);\n --brick-button-tone-soft: var(--brick-color-info-soft);\n --brick-button-tone-soft-hover: var(--brick-color-info-soft-hover);\n --brick-button-tone-soft-pressed: var(--brick-color-info-soft-pressed);\n --brick-button-tone-on-soft: var(--brick-color-info-on-soft);\n --brick-button-tone-border: var(--brick-color-info-border);\n --brick-button-tone-text: var(--brick-color-info-text);\n }\n\n .brick-button[data-tone=\"success\"] {\n --brick-button-tone-solid: var(--brick-color-success-solid);\n --brick-button-tone-solid-hover: var(--brick-color-success-solid-hover);\n --brick-button-tone-solid-pressed: var(--brick-color-success-solid-pressed);\n --brick-button-tone-on-solid: var(--brick-color-success-on-solid);\n --brick-button-tone-soft: var(--brick-color-success-soft);\n --brick-button-tone-soft-hover: var(--brick-color-success-soft-hover);\n --brick-button-tone-soft-pressed: var(--brick-color-success-soft-pressed);\n --brick-button-tone-on-soft: var(--brick-color-success-on-soft);\n --brick-button-tone-border: var(--brick-color-success-border);\n --brick-button-tone-text: var(--brick-color-success-text);\n }\n\n .brick-button[data-tone=\"warning\"] {\n --brick-button-tone-solid: var(--brick-color-warning-solid);\n --brick-button-tone-solid-hover: var(--brick-color-warning-solid-hover);\n --brick-button-tone-solid-pressed: var(--brick-color-warning-solid-pressed);\n --brick-button-tone-on-solid: var(--brick-color-warning-on-solid);\n --brick-button-tone-soft: var(--brick-color-warning-soft);\n --brick-button-tone-soft-hover: var(--brick-color-warning-soft-hover);\n --brick-button-tone-soft-pressed: var(--brick-color-warning-soft-pressed);\n --brick-button-tone-on-soft: var(--brick-color-warning-on-soft);\n --brick-button-tone-border: var(--brick-color-warning-border);\n --brick-button-tone-text: var(--brick-color-warning-text);\n }\n\n .brick-button[data-tone=\"danger\"] {\n --brick-button-tone-solid: var(--brick-color-danger-solid);\n --brick-button-tone-solid-hover: var(--brick-color-danger-solid-hover);\n --brick-button-tone-solid-pressed: var(--brick-color-danger-solid-pressed);\n --brick-button-tone-on-solid: var(--brick-color-danger-on-solid);\n --brick-button-tone-soft: var(--brick-color-danger-soft);\n --brick-button-tone-soft-hover: var(--brick-color-danger-soft-hover);\n --brick-button-tone-soft-pressed: var(--brick-color-danger-soft-pressed);\n --brick-button-tone-on-soft: var(--brick-color-danger-on-soft);\n --brick-button-tone-border: var(--brick-color-danger-border);\n --brick-button-tone-text: var(--brick-color-danger-text);\n }\n\n .brick-button[data-variant=\"soft\"] {\n --brick-button-background: var(--brick-button-tone-soft);\n --brick-button-background-hover: var(--brick-button-tone-soft-hover);\n --brick-button-background-pressed: var(--brick-button-tone-soft-pressed);\n --brick-button-foreground: var(--brick-button-tone-on-soft);\n --brick-button-border-color: var(--brick-button-tone-border);\n }\n\n .brick-button[data-variant=\"outline\"] {\n --brick-button-background: transparent;\n --brick-button-background-hover: var(--brick-button-tone-soft);\n --brick-button-background-pressed: var(--brick-button-tone-soft-hover);\n --brick-button-foreground: var(--brick-button-tone-text);\n --brick-button-border-color: var(--brick-button-tone-border);\n }\n\n .brick-button[data-variant=\"ghost\"] {\n --brick-button-background: transparent;\n --brick-button-background-hover: var(--brick-button-tone-soft);\n --brick-button-background-pressed: var(--brick-button-tone-soft-hover);\n --brick-button-foreground: var(--brick-button-tone-text);\n --brick-button-border-color: transparent;\n }\n\n @media (hover: hover) and (pointer: fine) {\n .brick-button:not([data-disabled], [data-loading]):hover {\n background: var(--brick-button-background-hover);\n border-color: var(--brick-button-background-hover);\n }\n\n .brick-button[data-variant=\"soft\"]:not([data-disabled], [data-loading]):hover,\n .brick-button[data-variant=\"outline\"]:not([data-disabled], [data-loading]):hover {\n border-color: var(--brick-button-tone-border);\n }\n\n .brick-button[data-variant=\"ghost\"]:not([data-disabled], [data-loading]):hover {\n border-color: transparent;\n }\n }\n\n @media (prefers-reduced-motion: reduce) {\n .brick-button {\n transition-duration: 0ms;\n }\n }\n\n @media (forced-colors: active) {\n .brick-button {\n border-color: ButtonText;\n background: ButtonFace;\n color: ButtonText;\n }\n\n .brick-button:focus-visible {\n outline-color: Highlight;\n }\n\n .brick-button[data-disabled] {\n border-color: GrayText;\n color: GrayText;\n opacity: 1;\n }\n }\n}\n","@layer brick.components {\n .brick-code {\n --brick-code-foreground: var(--brick-color-text-primary);\n --brick-code-background: var(--brick-color-surface-subtle);\n --brick-code-border-color: var(--brick-color-border-subtle);\n --brick-code-border-width: var(--brick-border-width);\n --brick-code-radius: var(--brick-radius-subtle);\n --brick-code-padding-block: 0.0625em;\n --brick-code-padding-inline: 0.3em;\n --brick-code-font-family: var(--brick-typography-code-inline-font-family);\n --brick-code-font-size: var(--brick-typography-code-inline-font-size);\n --brick-code-font-weight: var(--brick-typography-code-inline-font-weight);\n --brick-code-line-height: var(--brick-typography-code-inline-line-height);\n --brick-code-letter-spacing: var(--brick-typography-code-inline-letter-spacing);\n\n box-decoration-break: clone;\n padding: var(--brick-code-padding-block) var(--brick-code-padding-inline);\n border: var(--brick-code-border-width) solid var(--brick-code-border-color);\n border-radius: var(--brick-code-radius);\n background: var(--brick-code-background);\n color: var(--brick-code-foreground);\n font-family: var(--brick-code-font-family);\n font-size: var(--brick-code-font-size);\n font-weight: var(--brick-code-font-weight);\n letter-spacing: var(--brick-code-letter-spacing);\n line-height: var(--brick-code-line-height);\n overflow-wrap: anywhere;\n white-space: normal;\n -webkit-box-decoration-break: clone;\n }\n\n .brick-code[data-variant=\"plain\"] {\n --brick-code-background: transparent;\n --brick-code-border-width: 0rem;\n --brick-code-padding-block: 0em;\n --brick-code-padding-inline: 0em;\n }\n\n .brick-code[data-tone=\"inherit\"] { --brick-code-foreground: currentColor; }\n .brick-code[data-size=\"sm\"] {\n --brick-code-font-size: var(--brick-typography-body-sm-font-size);\n --brick-code-line-height: var(--brick-typography-body-sm-line-height);\n }\n .brick-code[data-size=\"md\"] {\n --brick-code-font-size: var(--brick-typography-body-md-font-size);\n --brick-code-line-height: var(--brick-typography-body-md-line-height);\n }\n\n @media (forced-colors: active) {\n .brick-code {\n --brick-code-foreground: CanvasText;\n --brick-code-background: Canvas;\n --brick-code-border-color: CanvasText;\n }\n }\n}\n","@layer brick.components {\n .brick-scroll-area {\n --brick-scroll-area-scrollbar-thumb: var(--brick-color-border-strong);\n --brick-scroll-area-scrollbar-track: transparent;\n\n min-inline-size: 0;\n min-block-size: 0;\n }\n\n .brick-scroll-area-viewport {\n box-sizing: border-box;\n inline-size: 100%;\n block-size: 100%;\n min-inline-size: 0;\n min-block-size: 0;\n scrollbar-color: var(--brick-scroll-area-scrollbar-thumb) var(--brick-scroll-area-scrollbar-track);\n scrollbar-width: auto;\n }\n\n .brick-scroll-area-viewport[data-orientation=\"vertical\"] { overflow-x: hidden; overflow-y: auto; }\n .brick-scroll-area-viewport[data-orientation=\"horizontal\"] { overflow-x: auto; overflow-y: hidden; }\n .brick-scroll-area-viewport[data-orientation=\"both\"] { overflow: auto; }\n\n .brick-scroll-area[data-scrollbar-gutter=\"stable\"] > .brick-scroll-area-viewport { scrollbar-gutter: stable; }\n .brick-scroll-area[data-scrollbar-visibility=\"always\"] > .brick-scroll-area-viewport[data-orientation=\"vertical\"] { overflow-y: scroll; }\n .brick-scroll-area[data-scrollbar-visibility=\"always\"] > .brick-scroll-area-viewport[data-orientation=\"horizontal\"] { overflow-x: scroll; }\n .brick-scroll-area[data-scrollbar-visibility=\"always\"] > .brick-scroll-area-viewport[data-orientation=\"both\"] { overflow: scroll; }\n .brick-scroll-area[data-scrollbar-visibility=\"interaction\"] > .brick-scroll-area-viewport { scrollbar-color: transparent transparent; }\n .brick-scroll-area[data-scrollbar-visibility=\"interaction\"]:is(:hover, :focus-within) > .brick-scroll-area-viewport {\n scrollbar-color: var(--brick-scroll-area-scrollbar-thumb) var(--brick-scroll-area-scrollbar-track);\n }\n\n .brick-scroll-area-viewport:focus-visible {\n outline: var(--brick-border-focus-width) solid var(--brick-color-focus-ring);\n outline-offset: calc(-1 * var(--brick-border-focus-width));\n }\n\n @media (forced-colors: active) {\n .brick-scroll-area-viewport,\n .brick-scroll-area[data-scrollbar-visibility=\"interaction\"] > .brick-scroll-area-viewport { scrollbar-color: auto; }\n .brick-scroll-area-viewport:focus-visible { outline-color: Highlight; }\n }\n}\n","@layer brick.components {\n .brick-code-block {\n --brick-code-block-background: var(--brick-color-surface-subtle);\n --brick-code-block-foreground: var(--brick-color-text-primary);\n --brick-code-block-border-color: var(--brick-color-border-subtle);\n --brick-code-block-border-width: 0rem;\n --brick-code-block-radius: var(--brick-radius-surface);\n --brick-code-block-header-padding: var(--brick-space-3) var(--brick-space-4);\n --brick-code-block-content-padding: var(--brick-space-4);\n --brick-code-block-gap: var(--brick-space-2);\n --brick-code-block-font-family: var(--brick-typography-code-block-md-font-family);\n --brick-code-block-font-size: var(--brick-typography-code-block-md-font-size);\n --brick-code-block-font-weight: var(--brick-typography-code-block-md-font-weight);\n --brick-code-block-line-height: var(--brick-typography-code-block-md-line-height);\n --brick-code-block-letter-spacing: var(--brick-typography-code-block-md-letter-spacing);\n --brick-code-block-selection-background: var(--brick-color-accent-soft);\n --brick-code-block-selection-foreground: var(--brick-color-accent-text);\n\n box-sizing: border-box;\n min-inline-size: 0;\n max-inline-size: 100%;\n overflow: clip;\n border: var(--brick-code-block-border-width) solid var(--brick-code-block-border-color);\n border-radius: var(--brick-code-block-radius);\n background: var(--brick-code-block-background);\n color: var(--brick-code-block-foreground);\n }\n\n .brick-code-block[data-variant=\"bordered\"] {\n --brick-code-block-background: var(--brick-color-surface-base);\n --brick-code-block-border-width: var(--brick-border-width);\n }\n\n .brick-code-block[data-variant=\"plain\"] {\n --brick-code-block-background: transparent;\n --brick-code-block-radius: 0rem;\n }\n\n .brick-code-block[data-size=\"sm\"] {\n --brick-code-block-header-padding: var(--brick-space-2) var(--brick-space-3);\n --brick-code-block-content-padding: var(--brick-space-3);\n --brick-code-block-font-family: var(--brick-typography-code-block-sm-font-family);\n --brick-code-block-font-size: var(--brick-typography-code-block-sm-font-size);\n --brick-code-block-font-weight: var(--brick-typography-code-block-sm-font-weight);\n --brick-code-block-line-height: var(--brick-typography-code-block-sm-line-height);\n --brick-code-block-letter-spacing: var(--brick-typography-code-block-sm-letter-spacing);\n }\n\n .brick-code-block-header {\n display: flex;\n align-items: center;\n min-inline-size: 0;\n gap: var(--brick-code-block-gap);\n padding: var(--brick-code-block-header-padding);\n border-block-end: var(--brick-border-width) solid var(--brick-code-block-border-color);\n }\n\n .brick-code-block-title {\n min-inline-size: 0;\n overflow: hidden;\n color: var(--brick-color-text-primary);\n font: var(--brick-font-weight-medium) var(--brick-typography-body-sm-font-size) / var(--brick-typography-body-sm-line-height) var(--brick-font-family-body);\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .brick-code-block-language {\n color: var(--brick-color-text-secondary);\n font: var(--brick-font-weight-medium) var(--brick-typography-caption-font-size) / var(--brick-typography-caption-line-height) var(--brick-font-family-mono);\n }\n\n .brick-code-block-actions {\n display: flex;\n align-items: center;\n gap: var(--brick-space-1);\n margin-inline-start: auto;\n }\n\n .brick-code-block-scroll-area { max-inline-size: 100%; }\n\n .brick-code-block-content {\n max-inline-size: 100%;\n padding: var(--brick-code-block-content-padding);\n }\n\n .brick-code-block-pre {\n min-inline-size: max-content;\n margin: 0;\n text-size-adjust: none;\n font-family: var(--brick-code-block-font-family);\n font-size: var(--brick-code-block-font-size);\n font-weight: var(--brick-code-block-font-weight);\n letter-spacing: var(--brick-code-block-letter-spacing);\n line-height: var(--brick-code-block-line-height);\n tab-size: 2;\n white-space: pre;\n }\n\n .brick-code-block-content[data-wrap=\"wrap\"] .brick-code-block-pre {\n min-inline-size: 0;\n white-space: pre-wrap;\n overflow-wrap: anywhere;\n }\n\n .brick-code-block-pre > .brick-code {\n font: inherit;\n letter-spacing: inherit;\n white-space: inherit;\n }\n\n .brick-code-block-pre ::selection {\n background: var(--brick-code-block-selection-background);\n color: var(--brick-code-block-selection-foreground);\n }\n\n .brick-code-block-copy-status {\n display: block;\n padding-inline: var(--brick-space-4);\n color: var(--brick-color-text-secondary);\n font: var(--brick-typography-caption-font-weight) var(--brick-typography-caption-font-size) / var(--brick-typography-caption-line-height) var(--brick-typography-caption-font-family);\n }\n\n .brick-code-block-copy-status:not(:empty) { padding-block: var(--brick-space-2); }\n\n @media (forced-colors: active) {\n .brick-code-block {\n --brick-code-block-background: Canvas;\n --brick-code-block-foreground: CanvasText;\n --brick-code-block-border-color: CanvasText;\n --brick-code-block-border-width: var(--brick-border-width);\n --brick-code-block-selection-background: Highlight;\n --brick-code-block-selection-foreground: HighlightText;\n }\n }\n}\n"],"names":[]}
package/dist/styles/code.css CHANGED
@@ -1,2 +1,2 @@
1
- @layer brick.tokens,brick.foundations;@layer brick.components{.brick-code{--brick-code-foreground:var(--brick-color-text-primary);--brick-code-background:var(--brick-color-surface-subtle);--brick-code-border-color:var(--brick-color-border-subtle);--brick-code-border-width:var(--brick-border-width);--brick-code-radius:var(--brick-radius-subtle);--brick-code-padding-block:.0625em;--brick-code-padding-inline:.3em;--brick-code-font-family:var(--brick-typography-code-inline-font-family);--brick-code-font-size:var(--brick-typography-code-inline-font-size);--brick-code-font-weight:var(--brick-typography-code-inline-font-weight);--brick-code-line-height:var(--brick-typography-code-inline-line-height);--brick-code-letter-spacing:var(--brick-typography-code-inline-letter-spacing);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:var(--brick-code-padding-block) var(--brick-code-padding-inline);border:var(--brick-code-border-width) solid var(--brick-code-border-color);border-radius:var(--brick-code-radius);background:var(--brick-code-background);color:var(--brick-code-foreground);font-family:var(--brick-code-font-family);font-size:var(--brick-code-font-size);font-weight:var(--brick-code-font-weight);letter-spacing:var(--brick-code-letter-spacing);line-height:var(--brick-code-line-height);overflow-wrap:anywhere;white-space:normal}.brick-code[data-variant=plain]{--brick-code-background:transparent;--brick-code-border-width:0rem;--brick-code-padding-block:0em;--brick-code-padding-inline:0em}.brick-code[data-tone=inherit]{--brick-code-foreground:currentColor}.brick-code[data-size=sm]{--brick-code-font-size:var(--brick-typography-body-sm-font-size);--brick-code-line-height:var(--brick-typography-body-sm-line-height)}.brick-code[data-size=md]{--brick-code-font-size:var(--brick-typography-body-md-font-size);--brick-code-line-height:var(--brick-typography-body-md-line-height)}@media (forced-colors:active){.brick-code{--brick-code-foreground:CanvasText;--brick-code-background:Canvas;--brick-code-border-color:CanvasText}}}@layer brick.utilities,brick.effects;
1
+ @layer brick.tokens,flowstack.theme,brick.foundations;@layer brick.components{.brick-code{--brick-code-foreground:var(--brick-color-text-primary);--brick-code-background:var(--brick-color-surface-subtle);--brick-code-border-color:var(--brick-color-border-subtle);--brick-code-border-width:var(--brick-border-width);--brick-code-radius:var(--brick-radius-subtle);--brick-code-padding-block:.0625em;--brick-code-padding-inline:.3em;--brick-code-font-family:var(--brick-typography-code-inline-font-family);--brick-code-font-size:var(--brick-typography-code-inline-font-size);--brick-code-font-weight:var(--brick-typography-code-inline-font-weight);--brick-code-line-height:var(--brick-typography-code-inline-line-height);--brick-code-letter-spacing:var(--brick-typography-code-inline-letter-spacing);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:var(--brick-code-padding-block) var(--brick-code-padding-inline);border:var(--brick-code-border-width) solid var(--brick-code-border-color);border-radius:var(--brick-code-radius);background:var(--brick-code-background);color:var(--brick-code-foreground);font-family:var(--brick-code-font-family);font-size:var(--brick-code-font-size);font-weight:var(--brick-code-font-weight);letter-spacing:var(--brick-code-letter-spacing);line-height:var(--brick-code-line-height);overflow-wrap:anywhere;white-space:normal}.brick-code[data-variant=plain]{--brick-code-background:transparent;--brick-code-border-width:0rem;--brick-code-padding-block:0em;--brick-code-padding-inline:0em}.brick-code[data-tone=inherit]{--brick-code-foreground:currentColor}.brick-code[data-size=sm]{--brick-code-font-size:var(--brick-typography-body-sm-font-size);--brick-code-line-height:var(--brick-typography-body-sm-line-height)}.brick-code[data-size=md]{--brick-code-font-size:var(--brick-typography-body-md-font-size);--brick-code-line-height:var(--brick-typography-body-md-line-height)}@media (forced-colors:active){.brick-code{--brick-code-foreground:CanvasText;--brick-code-background:Canvas;--brick-code-border-color:CanvasText}}}@layer brick.utilities,brick.effects;
2
2
  /*# sourceMappingURL=code.css.map */
package/dist/styles/code.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":null,"mappings":"ACAA,sCAAA,wBCCE,ixCA8BA,kKAOA,oEACA,gKAIA,gKAKA,8BACE,qHDjDJ","sources":["home/runner/work/brick/brick/.brick-cache/production/code.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/code/code.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/code/code.css\";","@layer brick.tokens, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n .brick-code {\n --brick-code-foreground: var(--brick-color-text-primary);\n --brick-code-background: var(--brick-color-surface-subtle);\n --brick-code-border-color: var(--brick-color-border-subtle);\n --brick-code-border-width: var(--brick-border-width);\n --brick-code-radius: var(--brick-radius-subtle);\n --brick-code-padding-block: 0.0625em;\n --brick-code-padding-inline: 0.3em;\n --brick-code-font-family: var(--brick-typography-code-inline-font-family);\n --brick-code-font-size: var(--brick-typography-code-inline-font-size);\n --brick-code-font-weight: var(--brick-typography-code-inline-font-weight);\n --brick-code-line-height: var(--brick-typography-code-inline-line-height);\n --brick-code-letter-spacing: var(--brick-typography-code-inline-letter-spacing);\n\n box-decoration-break: clone;\n padding: var(--brick-code-padding-block) var(--brick-code-padding-inline);\n border: var(--brick-code-border-width) solid var(--brick-code-border-color);\n border-radius: var(--brick-code-radius);\n background: var(--brick-code-background);\n color: var(--brick-code-foreground);\n font-family: var(--brick-code-font-family);\n font-size: var(--brick-code-font-size);\n font-weight: var(--brick-code-font-weight);\n letter-spacing: var(--brick-code-letter-spacing);\n line-height: var(--brick-code-line-height);\n overflow-wrap: anywhere;\n white-space: normal;\n -webkit-box-decoration-break: clone;\n }\n\n .brick-code[data-variant=\"plain\"] {\n --brick-code-background: transparent;\n --brick-code-border-width: 0rem;\n --brick-code-padding-block: 0em;\n --brick-code-padding-inline: 0em;\n }\n\n .brick-code[data-tone=\"inherit\"] { --brick-code-foreground: currentColor; }\n .brick-code[data-size=\"sm\"] {\n --brick-code-font-size: var(--brick-typography-body-sm-font-size);\n --brick-code-line-height: var(--brick-typography-body-sm-line-height);\n }\n .brick-code[data-size=\"md\"] {\n --brick-code-font-size: var(--brick-typography-body-md-font-size);\n --brick-code-line-height: var(--brick-typography-body-md-line-height);\n }\n\n @media (forced-colors: active) {\n .brick-code {\n --brick-code-foreground: CanvasText;\n --brick-code-background: Canvas;\n --brick-code-border-color: CanvasText;\n }\n }\n}\n"],"names":[]}
1
+ {"version":3,"sourceRoot":null,"mappings":"ACAA,sDAAA,wBCCE,ixCA8BA,kKAOA,oEACA,gKAIA,gKAKA,8BACE,qHDjDJ","sources":["home/runner/work/brick/brick/.brick-cache/production/code.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/code/code.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/code/code.css\";","@layer brick.tokens, flowstack.theme, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n .brick-code {\n --brick-code-foreground: var(--brick-color-text-primary);\n --brick-code-background: var(--brick-color-surface-subtle);\n --brick-code-border-color: var(--brick-color-border-subtle);\n --brick-code-border-width: var(--brick-border-width);\n --brick-code-radius: var(--brick-radius-subtle);\n --brick-code-padding-block: 0.0625em;\n --brick-code-padding-inline: 0.3em;\n --brick-code-font-family: var(--brick-typography-code-inline-font-family);\n --brick-code-font-size: var(--brick-typography-code-inline-font-size);\n --brick-code-font-weight: var(--brick-typography-code-inline-font-weight);\n --brick-code-line-height: var(--brick-typography-code-inline-line-height);\n --brick-code-letter-spacing: var(--brick-typography-code-inline-letter-spacing);\n\n box-decoration-break: clone;\n padding: var(--brick-code-padding-block) var(--brick-code-padding-inline);\n border: var(--brick-code-border-width) solid var(--brick-code-border-color);\n border-radius: var(--brick-code-radius);\n background: var(--brick-code-background);\n color: var(--brick-code-foreground);\n font-family: var(--brick-code-font-family);\n font-size: var(--brick-code-font-size);\n font-weight: var(--brick-code-font-weight);\n letter-spacing: var(--brick-code-letter-spacing);\n line-height: var(--brick-code-line-height);\n overflow-wrap: anywhere;\n white-space: normal;\n -webkit-box-decoration-break: clone;\n }\n\n .brick-code[data-variant=\"plain\"] {\n --brick-code-background: transparent;\n --brick-code-border-width: 0rem;\n --brick-code-padding-block: 0em;\n --brick-code-padding-inline: 0em;\n }\n\n .brick-code[data-tone=\"inherit\"] { --brick-code-foreground: currentColor; }\n .brick-code[data-size=\"sm\"] {\n --brick-code-font-size: var(--brick-typography-body-sm-font-size);\n --brick-code-line-height: var(--brick-typography-body-sm-line-height);\n }\n .brick-code[data-size=\"md\"] {\n --brick-code-font-size: var(--brick-typography-body-md-font-size);\n --brick-code-line-height: var(--brick-typography-body-md-line-height);\n }\n\n @media (forced-colors: active) {\n .brick-code {\n --brick-code-foreground: CanvasText;\n --brick-code-background: Canvas;\n --brick-code-border-color: CanvasText;\n }\n }\n}\n"],"names":[]}
package/dist/styles/collapsible.css CHANGED
@@ -1,2 +1,2 @@
1
- @layer brick.tokens,brick.foundations;@layer brick.components{.brick-collapsible{--brick-collapsible-background:transparent;--brick-collapsible-border-color:transparent;--brick-collapsible-trigger-background:transparent;--brick-collapsible-trigger-hover-background:var(--brick-color-surface-subtle);--brick-collapsible-trigger-open-background:var(--brick-color-surface-subtle);--brick-collapsible-foreground:var(--brick-color-text-primary);--brick-collapsible-content-foreground:var(--brick-color-text-secondary);--brick-collapsible-focus-ring:var(--brick-color-focus-ring);--brick-collapsible-radius:var(--brick-radius-control);--brick-collapsible-trigger-height:2.75rem;--brick-collapsible-trigger-padding-inline:var(--brick-space-3);--brick-collapsible-trigger-gap:var(--brick-space-2);--brick-collapsible-content-padding-block:var(--brick-space-3);--brick-collapsible-content-padding-inline:var(--brick-space-3);--brick-collapsible-indicator-size:1rem;--brick-collapsible-font-family:var(--brick-typography-control-md-font-family);--brick-collapsible-font-size:var(--brick-typography-control-md-font-size);--brick-collapsible-font-weight:var(--brick-typography-control-md-font-weight);--brick-collapsible-line-height:var(--brick-typography-control-md-line-height);box-sizing:border-box;border:var(--brick-border-width) solid var(--brick-collapsible-border-color);border-radius:var(--brick-collapsible-radius);background:var(--brick-collapsible-background);inline-size:100%;min-inline-size:0;overflow:clip}.brick-collapsible[data-variant=soft]{--brick-collapsible-background:var(--brick-color-surface-subtle);--brick-collapsible-trigger-hover-background:var(--brick-color-surface-raised);--brick-collapsible-trigger-open-background:var(--brick-color-surface-raised)}.brick-collapsible[data-variant=outline]{--brick-collapsible-border-color:var(--brick-color-border-default)}.brick-collapsible[data-size=sm]{--brick-collapsible-trigger-height:2.25rem;--brick-collapsible-trigger-padding-inline:var(--brick-space-2);--brick-collapsible-content-padding-block:var(--brick-space-2);--brick-collapsible-content-padding-inline:var(--brick-space-2);--brick-collapsible-indicator-size:.875rem;--brick-collapsible-font-family:var(--brick-typography-control-sm-font-family);--brick-collapsible-font-size:var(--brick-typography-control-sm-font-size);--brick-collapsible-font-weight:var(--brick-typography-control-sm-font-weight);--brick-collapsible-line-height:var(--brick-typography-control-sm-line-height)}.brick-collapsible[data-size=lg]{--brick-collapsible-trigger-height:3.25rem;--brick-collapsible-trigger-padding-inline:var(--brick-space-4);--brick-collapsible-content-padding-block:var(--brick-space-4);--brick-collapsible-content-padding-inline:var(--brick-space-4);--brick-collapsible-indicator-size:1.125rem;--brick-collapsible-font-family:var(--brick-typography-control-lg-font-family);--brick-collapsible-font-size:var(--brick-typography-control-lg-font-size);--brick-collapsible-font-weight:var(--brick-typography-control-lg-font-weight);--brick-collapsible-line-height:var(--brick-typography-control-lg-line-height)}.brick-collapsible[data-orientation=horizontal]{align-items:stretch;inline-size:max-content;max-inline-size:100%;display:flex;overflow:auto clip}.brick-collapsible[data-orientation=horizontal] .brick-collapsible-trigger{flex:none;inline-size:auto}.brick-collapsible-trigger{box-sizing:border-box;inline-size:100%;min-inline-size:0;min-block-size:var(--brick-collapsible-trigger-height);justify-content:flex-start;align-items:center;gap:var(--brick-collapsible-trigger-gap);padding-block:var(--brick-space-2);padding-inline:var(--brick-collapsible-trigger-padding-inline);border-radius:calc(var(--brick-collapsible-radius) - var(--brick-border-width));background:var(--brick-collapsible-trigger-background);color:var(--brick-collapsible-foreground);font-family:var(--brick-collapsible-font-family);font-size:var(--brick-collapsible-font-size);font-weight:var(--brick-collapsible-font-weight);line-height:var(--brick-collapsible-line-height);text-align:start;white-space:normal;cursor:pointer;touch-action:manipulation;border:0;display:flex}.brick-collapsible-trigger:hover:not(:disabled,[data-disabled]){background:var(--brick-collapsible-trigger-hover-background)}.brick-collapsible-trigger[data-state=open]{background:var(--brick-collapsible-trigger-open-background)}.brick-collapsible-trigger:focus-visible{outline:var(--brick-border-focus-width) solid var(--brick-collapsible-focus-ring);outline-offset:var(--brick-border-focus-offset)}.brick-collapsible-trigger:is(:disabled,[data-disabled]){opacity:.55;cursor:not-allowed}.brick-collapsible-indicator{inline-size:var(--brick-collapsible-indicator-size);block-size:var(--brick-collapsible-indicator-size);color:currentColor;transform-origin:50%;transition:transform var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);flex:none;justify-content:center;align-items:center;margin-inline-start:auto;display:inline-flex;transform:rotate(0)}.brick-collapsible-indicator>svg{block-size:100%;inline-size:100%;display:block}.brick-collapsible-trigger[data-state=open] .brick-collapsible-indicator{transform:rotate(90deg)}[dir=rtl] .brick-collapsible-trigger[data-state=closed] .brick-collapsible-indicator{transform:scaleX(-1)}[dir=rtl] .brick-collapsible-trigger[data-state=open] .brick-collapsible-indicator{transform:rotate(90deg)}.brick-collapsible-content{box-sizing:border-box;min-inline-size:0;color:var(--brick-collapsible-content-foreground);overflow:hidden}.brick-collapsible-content[data-state=open]{animation:brick-collapsible-open var(--brick-motion-duration-fast) var(--brick-motion-easing-enter) both}.brick-collapsible-content[data-state=closed]{animation:brick-collapsible-close var(--brick-motion-duration-fast) var(--brick-motion-easing-exit) both}.brick-collapsible-content-inner{box-sizing:border-box;min-inline-size:0;padding-block:var(--brick-collapsible-content-padding-block);padding-inline:var(--brick-collapsible-content-padding-inline)}.brick-collapsible[data-orientation=horizontal] .brick-collapsible-content{min-block-size:var(--brick-collapsible-trigger-height);flex:none}.brick-collapsible[data-orientation=horizontal] .brick-collapsible-content[data-state=open]{animation-name:brick-collapsible-open-horizontal}.brick-collapsible[data-orientation=horizontal] .brick-collapsible-content[data-state=closed]{animation-name:brick-collapsible-close-horizontal}.brick-collapsible-content[data-initial-open]{animation:none}.brick-collapsible[data-orientation=horizontal] .brick-collapsible-content-inner{inline-size:var(--content-width);min-block-size:var(--brick-collapsible-trigger-height)}@keyframes brick-collapsible-open{0%{block-size:0}to{block-size:var(--content-height)}}@keyframes brick-collapsible-close{0%{block-size:var(--content-height)}to{block-size:0}}@keyframes brick-collapsible-open-horizontal{0%{inline-size:0}to{inline-size:var(--content-width)}}@keyframes brick-collapsible-close-horizontal{0%{inline-size:var(--content-width)}to{inline-size:0}}@media (prefers-reduced-motion:reduce){.brick-collapsible-indicator{transition:none}.brick-collapsible-content{animation:none!important}}@media (forced-colors:active){.brick-collapsible{--brick-collapsible-border-color:CanvasText;forced-color-adjust:auto}.brick-collapsible[data-variant=plain],.brick-collapsible[data-variant=soft]{--brick-collapsible-border-color:transparent}.brick-collapsible-trigger{color:buttontext}.brick-collapsible-trigger:focus-visible{outline-color:highlight}}}@layer brick.utilities,brick.effects;
1
+ @layer brick.tokens,flowstack.theme,brick.foundations;@layer brick.components{.brick-collapsible{--brick-collapsible-background:transparent;--brick-collapsible-border-color:transparent;--brick-collapsible-trigger-background:transparent;--brick-collapsible-trigger-hover-background:var(--brick-color-surface-subtle);--brick-collapsible-trigger-open-background:var(--brick-color-surface-subtle);--brick-collapsible-foreground:var(--brick-color-text-primary);--brick-collapsible-content-foreground:var(--brick-color-text-secondary);--brick-collapsible-focus-ring:var(--brick-color-focus-ring);--brick-collapsible-radius:var(--brick-radius-control);--brick-collapsible-trigger-height:2.75rem;--brick-collapsible-trigger-padding-inline:var(--brick-space-3);--brick-collapsible-trigger-gap:var(--brick-space-2);--brick-collapsible-content-padding-block:var(--brick-space-3);--brick-collapsible-content-padding-inline:var(--brick-space-3);--brick-collapsible-indicator-size:1rem;--brick-collapsible-font-family:var(--brick-typography-control-md-font-family);--brick-collapsible-font-size:var(--brick-typography-control-md-font-size);--brick-collapsible-font-weight:var(--brick-typography-control-md-font-weight);--brick-collapsible-line-height:var(--brick-typography-control-md-line-height);box-sizing:border-box;border:var(--brick-border-width) solid var(--brick-collapsible-border-color);border-radius:var(--brick-collapsible-radius);background:var(--brick-collapsible-background);inline-size:100%;min-inline-size:0;overflow:visible}.brick-collapsible[data-variant=soft]{--brick-collapsible-background:var(--brick-color-surface-subtle);--brick-collapsible-trigger-hover-background:var(--brick-color-surface-raised);--brick-collapsible-trigger-open-background:var(--brick-color-surface-raised)}.brick-collapsible[data-variant=outline]{--brick-collapsible-border-color:var(--brick-color-border-default)}.brick-collapsible[data-size=sm]{--brick-collapsible-trigger-height:2.25rem;--brick-collapsible-trigger-padding-inline:var(--brick-space-2);--brick-collapsible-content-padding-block:var(--brick-space-2);--brick-collapsible-content-padding-inline:var(--brick-space-2);--brick-collapsible-indicator-size:.875rem;--brick-collapsible-font-family:var(--brick-typography-control-sm-font-family);--brick-collapsible-font-size:var(--brick-typography-control-sm-font-size);--brick-collapsible-font-weight:var(--brick-typography-control-sm-font-weight);--brick-collapsible-line-height:var(--brick-typography-control-sm-line-height)}.brick-collapsible[data-size=lg]{--brick-collapsible-trigger-height:3.25rem;--brick-collapsible-trigger-padding-inline:var(--brick-space-4);--brick-collapsible-content-padding-block:var(--brick-space-4);--brick-collapsible-content-padding-inline:var(--brick-space-4);--brick-collapsible-indicator-size:1.125rem;--brick-collapsible-font-family:var(--brick-typography-control-lg-font-family);--brick-collapsible-font-size:var(--brick-typography-control-lg-font-size);--brick-collapsible-font-weight:var(--brick-typography-control-lg-font-weight);--brick-collapsible-line-height:var(--brick-typography-control-lg-line-height)}.brick-collapsible[data-orientation=horizontal]{align-items:stretch;inline-size:max-content;max-inline-size:100%;display:flex;overflow:auto clip}.brick-collapsible[data-orientation=horizontal] .brick-collapsible-trigger{flex:none;inline-size:auto}.brick-collapsible[data-orientation=horizontal] .brick-collapsible-trigger:focus-visible{outline-offset:calc(-1 * var(--brick-border-focus-width))}.brick-collapsible-trigger{box-sizing:border-box;inline-size:100%;min-inline-size:0;min-block-size:var(--brick-collapsible-trigger-height);justify-content:flex-start;align-items:center;gap:var(--brick-collapsible-trigger-gap);padding-block:var(--brick-space-2);padding-inline:var(--brick-collapsible-trigger-padding-inline);border-radius:calc(var(--brick-collapsible-radius) - var(--brick-border-width));background:var(--brick-collapsible-trigger-background);color:var(--brick-collapsible-foreground);font-family:var(--brick-collapsible-font-family);font-size:var(--brick-collapsible-font-size);font-weight:var(--brick-collapsible-font-weight);line-height:var(--brick-collapsible-line-height);text-align:start;white-space:normal;cursor:pointer;touch-action:manipulation;border:0;display:flex}.brick-collapsible-trigger:hover:not(:disabled,[data-disabled]){background:var(--brick-collapsible-trigger-hover-background)}.brick-collapsible-trigger[data-state=open]{background:var(--brick-collapsible-trigger-open-background)}.brick-collapsible-trigger:focus-visible{outline:var(--brick-border-focus-width) solid var(--brick-collapsible-focus-ring);outline-offset:var(--brick-border-focus-offset)}.brick-collapsible-trigger:is(:disabled,[data-disabled]){opacity:.55;cursor:not-allowed}.brick-collapsible-trigger[data-icon-only]{inline-size:var(--brick-collapsible-trigger-height);min-inline-size:var(--brick-collapsible-trigger-height);block-size:var(--brick-collapsible-trigger-height);min-block-size:var(--brick-collapsible-trigger-height);flex:0 0 var(--brick-collapsible-trigger-height);text-align:center;justify-content:center;padding:0}.brick-collapsible-indicator{inline-size:var(--brick-collapsible-indicator-size);block-size:var(--brick-collapsible-indicator-size);color:currentColor;transform-origin:50%;transition:transform var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);flex:none;justify-content:center;align-items:center;margin-inline-start:auto;display:inline-flex;transform:rotate(0)}.brick-collapsible-indicator>svg{block-size:100%;inline-size:100%;display:block}.brick-collapsible-trigger[data-state=open] .brick-collapsible-indicator{transform:rotate(180deg)}.brick-collapsible-content{box-sizing:border-box;min-inline-size:0;color:var(--brick-collapsible-content-foreground);overflow:hidden}.brick-collapsible-content[data-state=open]{animation:brick-collapsible-open var(--brick-motion-duration-fast) var(--brick-motion-easing-enter) both}.brick-collapsible-content[data-state=closed]{animation:brick-collapsible-close var(--brick-motion-duration-fast) var(--brick-motion-easing-exit) both}.brick-collapsible-content-inner{box-sizing:border-box;min-inline-size:0;padding-block:var(--brick-collapsible-content-padding-block);padding-inline:var(--brick-collapsible-content-padding-inline)}.brick-collapsible[data-orientation=horizontal] .brick-collapsible-content{min-block-size:var(--brick-collapsible-trigger-height);flex:none}.brick-collapsible[data-orientation=horizontal] .brick-collapsible-content[data-state=open]{animation-name:brick-collapsible-open-horizontal}.brick-collapsible[data-orientation=horizontal] .brick-collapsible-content[data-state=closed]{animation-name:brick-collapsible-close-horizontal}.brick-collapsible-content[data-initial-open]{animation:none}.brick-collapsible[data-orientation=horizontal] .brick-collapsible-content-inner{inline-size:var(--content-width);min-block-size:var(--brick-collapsible-trigger-height)}@keyframes brick-collapsible-open{0%{block-size:0}to{block-size:var(--content-height)}}@keyframes brick-collapsible-close{0%{block-size:var(--content-height)}to{block-size:0}}@keyframes brick-collapsible-open-horizontal{0%{inline-size:0}to{inline-size:var(--content-width)}}@keyframes brick-collapsible-close-horizontal{0%{inline-size:var(--content-width)}to{inline-size:0}}@media (prefers-reduced-motion:reduce){.brick-collapsible-indicator{transition:none}.brick-collapsible-content{animation:none!important}}@media (forced-colors:active){.brick-collapsible{--brick-collapsible-border-color:CanvasText;forced-color-adjust:auto}.brick-collapsible[data-variant=plain],.brick-collapsible[data-variant=soft]{--brick-collapsible-border-color:transparent}.brick-collapsible-trigger{color:buttontext}.brick-collapsible-trigger:focus-visible{outline-color:highlight}}}@layer brick.utilities,brick.effects;
2
2
  /*# sourceMappingURL=collapsible.css.map */
package/dist/styles/collapsible.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":null,"mappings":"ACAA,sCAAA,wBCCE,u6CA8BA,oQAMA,4GAIA,8mBAYA,+mBAYA,iJASA,sGAKA,wxBAyBA,6HACA,wGACA,2KACA,wFAEA,4XAaA,gFACA,iGACA,0GACA,2GAEA,qIAMA,qJACA,uJACA,qMAEA,4IAIA,6IACA,gJACA,6DACA,yKAKA,uFACA,wFACA,mGACA,oGAEA,uCACE,6CACA,qDAGF,8BACE,wFACA,0HACA,4CACA,mEDnKJ","sources":["home/runner/work/brick/brick/.brick-cache/production/collapsible.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/collapsible/collapsible.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/collapsible/collapsible.css\";","@layer brick.tokens, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n .brick-collapsible {\n --brick-collapsible-background: transparent;\n --brick-collapsible-border-color: transparent;\n --brick-collapsible-trigger-background: transparent;\n --brick-collapsible-trigger-hover-background: var(--brick-color-surface-subtle);\n --brick-collapsible-trigger-open-background: var(--brick-color-surface-subtle);\n --brick-collapsible-foreground: var(--brick-color-text-primary);\n --brick-collapsible-content-foreground: var(--brick-color-text-secondary);\n --brick-collapsible-focus-ring: var(--brick-color-focus-ring);\n --brick-collapsible-radius: var(--brick-radius-control);\n --brick-collapsible-trigger-height: 2.75rem;\n --brick-collapsible-trigger-padding-inline: var(--brick-space-3);\n --brick-collapsible-trigger-gap: var(--brick-space-2);\n --brick-collapsible-content-padding-block: var(--brick-space-3);\n --brick-collapsible-content-padding-inline: var(--brick-space-3);\n --brick-collapsible-indicator-size: 1rem;\n --brick-collapsible-font-family: var(--brick-typography-control-md-font-family);\n --brick-collapsible-font-size: var(--brick-typography-control-md-font-size);\n --brick-collapsible-font-weight: var(--brick-typography-control-md-font-weight);\n --brick-collapsible-line-height: var(--brick-typography-control-md-line-height);\n\n box-sizing: border-box;\n inline-size: 100%;\n min-inline-size: 0;\n overflow: clip;\n border: var(--brick-border-width) solid var(--brick-collapsible-border-color);\n border-radius: var(--brick-collapsible-radius);\n background: var(--brick-collapsible-background);\n }\n\n .brick-collapsible[data-variant=\"soft\"] {\n --brick-collapsible-background: var(--brick-color-surface-subtle);\n --brick-collapsible-trigger-hover-background: var(--brick-color-surface-raised);\n --brick-collapsible-trigger-open-background: var(--brick-color-surface-raised);\n }\n\n .brick-collapsible[data-variant=\"outline\"] {\n --brick-collapsible-border-color: var(--brick-color-border-default);\n }\n\n .brick-collapsible[data-size=\"sm\"] {\n --brick-collapsible-trigger-height: 2.25rem;\n --brick-collapsible-trigger-padding-inline: var(--brick-space-2);\n --brick-collapsible-content-padding-block: var(--brick-space-2);\n --brick-collapsible-content-padding-inline: var(--brick-space-2);\n --brick-collapsible-indicator-size: 0.875rem;\n --brick-collapsible-font-family: var(--brick-typography-control-sm-font-family);\n --brick-collapsible-font-size: var(--brick-typography-control-sm-font-size);\n --brick-collapsible-font-weight: var(--brick-typography-control-sm-font-weight);\n --brick-collapsible-line-height: var(--brick-typography-control-sm-line-height);\n }\n\n .brick-collapsible[data-size=\"lg\"] {\n --brick-collapsible-trigger-height: 3.25rem;\n --brick-collapsible-trigger-padding-inline: var(--brick-space-4);\n --brick-collapsible-content-padding-block: var(--brick-space-4);\n --brick-collapsible-content-padding-inline: var(--brick-space-4);\n --brick-collapsible-indicator-size: 1.125rem;\n --brick-collapsible-font-family: var(--brick-typography-control-lg-font-family);\n --brick-collapsible-font-size: var(--brick-typography-control-lg-font-size);\n --brick-collapsible-font-weight: var(--brick-typography-control-lg-font-weight);\n --brick-collapsible-line-height: var(--brick-typography-control-lg-line-height);\n }\n\n .brick-collapsible[data-orientation=\"horizontal\"] {\n display: flex;\n inline-size: max-content;\n max-inline-size: 100%;\n align-items: stretch;\n overflow-x: auto;\n overflow-y: clip;\n }\n\n .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-trigger {\n inline-size: auto;\n flex: 0 0 auto;\n }\n\n .brick-collapsible-trigger {\n display: flex;\n box-sizing: border-box;\n inline-size: 100%;\n min-inline-size: 0;\n min-block-size: var(--brick-collapsible-trigger-height);\n align-items: center;\n justify-content: flex-start;\n gap: var(--brick-collapsible-trigger-gap);\n padding-block: var(--brick-space-2);\n padding-inline: var(--brick-collapsible-trigger-padding-inline);\n border: 0;\n border-radius: calc(var(--brick-collapsible-radius) - var(--brick-border-width));\n background: var(--brick-collapsible-trigger-background);\n color: var(--brick-collapsible-foreground);\n font-family: var(--brick-collapsible-font-family);\n font-size: var(--brick-collapsible-font-size);\n font-weight: var(--brick-collapsible-font-weight);\n line-height: var(--brick-collapsible-line-height);\n text-align: start;\n white-space: normal;\n cursor: pointer;\n touch-action: manipulation;\n }\n\n .brick-collapsible-trigger:hover:not(:disabled, [data-disabled]) { background: var(--brick-collapsible-trigger-hover-background); }\n .brick-collapsible-trigger[data-state=\"open\"] { background: var(--brick-collapsible-trigger-open-background); }\n .brick-collapsible-trigger:focus-visible { outline: var(--brick-border-focus-width) solid var(--brick-collapsible-focus-ring); outline-offset: var(--brick-border-focus-offset); }\n .brick-collapsible-trigger:is(:disabled, [data-disabled]) { opacity: 0.55; cursor: not-allowed; }\n\n .brick-collapsible-indicator {\n display: inline-flex;\n inline-size: var(--brick-collapsible-indicator-size);\n block-size: var(--brick-collapsible-indicator-size);\n flex: 0 0 auto;\n align-items: center;\n justify-content: center;\n margin-inline-start: auto;\n color: currentColor;\n transform: rotate(0deg);\n transform-origin: center;\n transition: transform var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);\n }\n .brick-collapsible-indicator > svg { display: block; inline-size: 100%; block-size: 100%; }\n .brick-collapsible-trigger[data-state=\"open\"] .brick-collapsible-indicator { transform: rotate(90deg); }\n [dir=\"rtl\"] .brick-collapsible-trigger[data-state=\"closed\"] .brick-collapsible-indicator { transform: scaleX(-1); }\n [dir=\"rtl\"] .brick-collapsible-trigger[data-state=\"open\"] .brick-collapsible-indicator { transform: rotate(90deg); }\n\n .brick-collapsible-content {\n box-sizing: border-box;\n min-inline-size: 0;\n overflow: hidden;\n color: var(--brick-collapsible-content-foreground);\n }\n .brick-collapsible-content[data-state=\"open\"] { animation: brick-collapsible-open var(--brick-motion-duration-fast) var(--brick-motion-easing-enter) both; }\n .brick-collapsible-content[data-state=\"closed\"] { animation: brick-collapsible-close var(--brick-motion-duration-fast) var(--brick-motion-easing-exit) both; }\n .brick-collapsible-content-inner { box-sizing: border-box; min-inline-size: 0; padding-block: var(--brick-collapsible-content-padding-block); padding-inline: var(--brick-collapsible-content-padding-inline); }\n\n .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-content {\n flex: 0 0 auto;\n min-block-size: var(--brick-collapsible-trigger-height);\n }\n .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-content[data-state=\"open\"] { animation-name: brick-collapsible-open-horizontal; }\n .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-content[data-state=\"closed\"] { animation-name: brick-collapsible-close-horizontal; }\n .brick-collapsible-content[data-initial-open] { animation: none; }\n .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-content-inner {\n inline-size: var(--content-width);\n min-block-size: var(--brick-collapsible-trigger-height);\n }\n\n @keyframes brick-collapsible-open { from { block-size: 0; } to { block-size: var(--content-height); } }\n @keyframes brick-collapsible-close { from { block-size: var(--content-height); } to { block-size: 0; } }\n @keyframes brick-collapsible-open-horizontal { from { inline-size: 0; } to { inline-size: var(--content-width); } }\n @keyframes brick-collapsible-close-horizontal { from { inline-size: var(--content-width); } to { inline-size: 0; } }\n\n @media (prefers-reduced-motion: reduce) {\n .brick-collapsible-indicator { transition: none; }\n .brick-collapsible-content { animation: none !important; }\n }\n\n @media (forced-colors: active) {\n .brick-collapsible { --brick-collapsible-border-color: CanvasText; forced-color-adjust: auto; }\n .brick-collapsible[data-variant=\"plain\"], .brick-collapsible[data-variant=\"soft\"] { --brick-collapsible-border-color: transparent; }\n .brick-collapsible-trigger { color: ButtonText; }\n .brick-collapsible-trigger:focus-visible { outline-color: Highlight; }\n }\n}\n"],"names":[]}
1
+ {"version":3,"sourceRoot":null,"mappings":"ACAA,sDAAA,wBCCE,06CA8BA,oQAMA,4GAIA,8mBAYA,+mBAYA,iJASA,sGAKA,mJAIA,wxBAyBA,6HACA,wGACA,2KACA,wFAEA,qWAWA,4XAaA,gFACA,kGAEA,qIAMA,qJACA,uJACA,qMAEA,4IAIA,6IACA,gJACA,6DACA,yKAKA,uFACA,wFACA,mGACA,oGAEA,uCACE,6CACA,qDAGF,8BACE,wFACA,0HACA,4CACA,mEDhLJ","sources":["home/runner/work/brick/brick/.brick-cache/production/collapsible.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/collapsible/collapsible.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/collapsible/collapsible.css\";","@layer brick.tokens, flowstack.theme, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n .brick-collapsible {\n --brick-collapsible-background: transparent;\n --brick-collapsible-border-color: transparent;\n --brick-collapsible-trigger-background: transparent;\n --brick-collapsible-trigger-hover-background: var(--brick-color-surface-subtle);\n --brick-collapsible-trigger-open-background: var(--brick-color-surface-subtle);\n --brick-collapsible-foreground: var(--brick-color-text-primary);\n --brick-collapsible-content-foreground: var(--brick-color-text-secondary);\n --brick-collapsible-focus-ring: var(--brick-color-focus-ring);\n --brick-collapsible-radius: var(--brick-radius-control);\n --brick-collapsible-trigger-height: 2.75rem;\n --brick-collapsible-trigger-padding-inline: var(--brick-space-3);\n --brick-collapsible-trigger-gap: var(--brick-space-2);\n --brick-collapsible-content-padding-block: var(--brick-space-3);\n --brick-collapsible-content-padding-inline: var(--brick-space-3);\n --brick-collapsible-indicator-size: 1rem;\n --brick-collapsible-font-family: var(--brick-typography-control-md-font-family);\n --brick-collapsible-font-size: var(--brick-typography-control-md-font-size);\n --brick-collapsible-font-weight: var(--brick-typography-control-md-font-weight);\n --brick-collapsible-line-height: var(--brick-typography-control-md-line-height);\n\n box-sizing: border-box;\n inline-size: 100%;\n min-inline-size: 0;\n overflow: visible;\n border: var(--brick-border-width) solid var(--brick-collapsible-border-color);\n border-radius: var(--brick-collapsible-radius);\n background: var(--brick-collapsible-background);\n }\n\n .brick-collapsible[data-variant=\"soft\"] {\n --brick-collapsible-background: var(--brick-color-surface-subtle);\n --brick-collapsible-trigger-hover-background: var(--brick-color-surface-raised);\n --brick-collapsible-trigger-open-background: var(--brick-color-surface-raised);\n }\n\n .brick-collapsible[data-variant=\"outline\"] {\n --brick-collapsible-border-color: var(--brick-color-border-default);\n }\n\n .brick-collapsible[data-size=\"sm\"] {\n --brick-collapsible-trigger-height: 2.25rem;\n --brick-collapsible-trigger-padding-inline: var(--brick-space-2);\n --brick-collapsible-content-padding-block: var(--brick-space-2);\n --brick-collapsible-content-padding-inline: var(--brick-space-2);\n --brick-collapsible-indicator-size: 0.875rem;\n --brick-collapsible-font-family: var(--brick-typography-control-sm-font-family);\n --brick-collapsible-font-size: var(--brick-typography-control-sm-font-size);\n --brick-collapsible-font-weight: var(--brick-typography-control-sm-font-weight);\n --brick-collapsible-line-height: var(--brick-typography-control-sm-line-height);\n }\n\n .brick-collapsible[data-size=\"lg\"] {\n --brick-collapsible-trigger-height: 3.25rem;\n --brick-collapsible-trigger-padding-inline: var(--brick-space-4);\n --brick-collapsible-content-padding-block: var(--brick-space-4);\n --brick-collapsible-content-padding-inline: var(--brick-space-4);\n --brick-collapsible-indicator-size: 1.125rem;\n --brick-collapsible-font-family: var(--brick-typography-control-lg-font-family);\n --brick-collapsible-font-size: var(--brick-typography-control-lg-font-size);\n --brick-collapsible-font-weight: var(--brick-typography-control-lg-font-weight);\n --brick-collapsible-line-height: var(--brick-typography-control-lg-line-height);\n }\n\n .brick-collapsible[data-orientation=\"horizontal\"] {\n display: flex;\n inline-size: max-content;\n max-inline-size: 100%;\n align-items: stretch;\n overflow-x: auto;\n overflow-y: clip;\n }\n\n .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-trigger {\n inline-size: auto;\n flex: 0 0 auto;\n }\n\n .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-trigger:focus-visible {\n outline-offset: calc(-1 * var(--brick-border-focus-width));\n }\n\n .brick-collapsible-trigger {\n display: flex;\n box-sizing: border-box;\n inline-size: 100%;\n min-inline-size: 0;\n min-block-size: var(--brick-collapsible-trigger-height);\n align-items: center;\n justify-content: flex-start;\n gap: var(--brick-collapsible-trigger-gap);\n padding-block: var(--brick-space-2);\n padding-inline: var(--brick-collapsible-trigger-padding-inline);\n border: 0;\n border-radius: calc(var(--brick-collapsible-radius) - var(--brick-border-width));\n background: var(--brick-collapsible-trigger-background);\n color: var(--brick-collapsible-foreground);\n font-family: var(--brick-collapsible-font-family);\n font-size: var(--brick-collapsible-font-size);\n font-weight: var(--brick-collapsible-font-weight);\n line-height: var(--brick-collapsible-line-height);\n text-align: start;\n white-space: normal;\n cursor: pointer;\n touch-action: manipulation;\n }\n\n .brick-collapsible-trigger:hover:not(:disabled, [data-disabled]) { background: var(--brick-collapsible-trigger-hover-background); }\n .brick-collapsible-trigger[data-state=\"open\"] { background: var(--brick-collapsible-trigger-open-background); }\n .brick-collapsible-trigger:focus-visible { outline: var(--brick-border-focus-width) solid var(--brick-collapsible-focus-ring); outline-offset: var(--brick-border-focus-offset); }\n .brick-collapsible-trigger:is(:disabled, [data-disabled]) { opacity: 0.55; cursor: not-allowed; }\n\n .brick-collapsible-trigger[data-icon-only] {\n inline-size: var(--brick-collapsible-trigger-height);\n min-inline-size: var(--brick-collapsible-trigger-height);\n block-size: var(--brick-collapsible-trigger-height);\n min-block-size: var(--brick-collapsible-trigger-height);\n flex: 0 0 var(--brick-collapsible-trigger-height);\n justify-content: center;\n padding: 0;\n text-align: center;\n }\n\n .brick-collapsible-indicator {\n display: inline-flex;\n inline-size: var(--brick-collapsible-indicator-size);\n block-size: var(--brick-collapsible-indicator-size);\n flex: 0 0 auto;\n align-items: center;\n justify-content: center;\n margin-inline-start: auto;\n color: currentColor;\n transform: rotate(0deg);\n transform-origin: center;\n transition: transform var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);\n }\n .brick-collapsible-indicator > svg { display: block; inline-size: 100%; block-size: 100%; }\n .brick-collapsible-trigger[data-state=\"open\"] .brick-collapsible-indicator { transform: rotate(180deg); }\n\n .brick-collapsible-content {\n box-sizing: border-box;\n min-inline-size: 0;\n overflow: hidden;\n color: var(--brick-collapsible-content-foreground);\n }\n .brick-collapsible-content[data-state=\"open\"] { animation: brick-collapsible-open var(--brick-motion-duration-fast) var(--brick-motion-easing-enter) both; }\n .brick-collapsible-content[data-state=\"closed\"] { animation: brick-collapsible-close var(--brick-motion-duration-fast) var(--brick-motion-easing-exit) both; }\n .brick-collapsible-content-inner { box-sizing: border-box; min-inline-size: 0; padding-block: var(--brick-collapsible-content-padding-block); padding-inline: var(--brick-collapsible-content-padding-inline); }\n\n .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-content {\n flex: 0 0 auto;\n min-block-size: var(--brick-collapsible-trigger-height);\n }\n .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-content[data-state=\"open\"] { animation-name: brick-collapsible-open-horizontal; }\n .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-content[data-state=\"closed\"] { animation-name: brick-collapsible-close-horizontal; }\n .brick-collapsible-content[data-initial-open] { animation: none; }\n .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-content-inner {\n inline-size: var(--content-width);\n min-block-size: var(--brick-collapsible-trigger-height);\n }\n\n @keyframes brick-collapsible-open { from { block-size: 0; } to { block-size: var(--content-height); } }\n @keyframes brick-collapsible-close { from { block-size: var(--content-height); } to { block-size: 0; } }\n @keyframes brick-collapsible-open-horizontal { from { inline-size: 0; } to { inline-size: var(--content-width); } }\n @keyframes brick-collapsible-close-horizontal { from { inline-size: var(--content-width); } to { inline-size: 0; } }\n\n @media (prefers-reduced-motion: reduce) {\n .brick-collapsible-indicator { transition: none; }\n .brick-collapsible-content { animation: none !important; }\n }\n\n @media (forced-colors: active) {\n .brick-collapsible { --brick-collapsible-border-color: CanvasText; forced-color-adjust: auto; }\n .brick-collapsible[data-variant=\"plain\"], .brick-collapsible[data-variant=\"soft\"] { --brick-collapsible-border-color: transparent; }\n .brick-collapsible-trigger { color: ButtonText; }\n .brick-collapsible-trigger:focus-visible { outline-color: Highlight; }\n }\n}\n"],"names":[]}
package/dist/styles/color-picker.css ADDED
@@ -0,0 +1,2 @@
1
+ @layer brick.tokens,flowstack.theme,brick.foundations;@layer brick.components{.brick-color-swatch{--brick-color-swatch-size:1.5rem;--brick-color-swatch-value:transparent;--brick-color-swatch-border-color:var(--brick-color-border-default);--brick-color-swatch-radius:var(--brick-radius-subtle);box-sizing:border-box;inline-size:var(--brick-color-swatch-size);block-size:var(--brick-color-swatch-size);border:var(--brick-border-width) solid var(--brick-color-swatch-border-color);border-radius:var(--brick-color-swatch-radius);background-color:var(--brick-color-surface-base);background-image:repeating-conic-gradient(var(--brick-color-surface-subtle) 0 25%, var(--brick-color-surface-raised) 0 50%);vertical-align:middle;background-position:0 0;background-size:.5rem .5rem;flex:none;display:inline-block;position:relative;overflow:hidden}.brick-color-swatch:after{background:var(--brick-color-swatch-value);content:"";position:absolute;inset:0}.brick-color-swatch[data-size=sm]{--brick-color-swatch-size:1rem}.brick-color-swatch[data-size=lg]{--brick-color-swatch-size:2rem}@media (forced-colors:active){.brick-color-swatch{forced-color-adjust:none;border-color:canvastext}}.brick-color-picker{--brick-color-picker-control-size:2.5rem;--brick-color-picker-gap:var(--brick-space-2);--brick-color-picker-background:transparent;--brick-color-picker-border-color:var(--brick-color-border-default);--brick-color-picker-focus-ring:var(--brick-color-focus-ring);--brick-color-picker-content-background:var(--brick-color-surface-overlay);--brick-color-picker-content-border-color:var(--brick-color-border-default);--brick-color-picker-content-radius:var(--brick-radius-overlay);--brick-color-picker-content-shadow:var(--brick-shadow-floating);gap:var(--brick-space-2);min-inline-size:0;color:var(--brick-color-text-primary);display:grid}.brick-color-picker[data-size=sm]{--brick-color-picker-control-size:2rem}.brick-color-picker[data-size=lg]{--brick-color-picker-control-size:3rem}.brick-color-picker[data-variant=soft]{--brick-color-picker-background:var(--brick-color-surface-subtle)}.brick-color-picker__label{inline-size:fit-content;color:var(--brick-color-text-primary);font-family:var(--brick-typography-label-md-font-family);font-size:var(--brick-typography-label-md-font-size);font-weight:var(--brick-typography-label-md-font-weight);letter-spacing:var(--brick-typography-label-md-letter-spacing);line-height:var(--brick-typography-label-md-line-height)}.brick-color-picker__control{align-items:stretch;gap:var(--brick-color-picker-gap);min-inline-size:0;display:flex}.brick-color-picker__input,.brick-color-picker__native-input,.brick-color-picker__trigger,.brick-color-picker__swatch-trigger{box-sizing:border-box;min-block-size:var(--brick-color-picker-control-size);border:var(--brick-border-width) solid var(--brick-color-picker-border-color);border-radius:var(--brick-radius-control);background:var(--brick-color-picker-background);color:var(--brick-color-text-primary);transition:border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard), box-shadow var(--brick-motion-duration-fast) var(--brick-motion-easing-standard), background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard)}.brick-color-picker__input{inline-size:9rem;min-inline-size:0;padding-inline:var(--brick-space-3);font:inherit;font-variant-numeric:tabular-nums}.brick-color-picker__native-input{inline-size:var(--brick-color-picker-control-size);padding:var(--brick-space-1);cursor:pointer;flex:none}.brick-color-picker__trigger{min-inline-size:var(--brick-color-picker-control-size);justify-content:center;align-items:center;gap:var(--brick-space-2);padding-inline:var(--brick-space-2);cursor:pointer;font:inherit;display:inline-flex}.brick-color-picker__swatch-trigger{min-inline-size:var(--brick-color-picker-control-size);justify-content:flex-start;align-items:center;gap:var(--brick-space-2);padding:var(--brick-space-2);cursor:pointer;font:inherit;display:inline-flex}.brick-color-picker__input:hover,.brick-color-picker__native-input:hover,.brick-color-picker__trigger:hover,.brick-color-picker__swatch-trigger:hover{border-color:var(--brick-color-border-strong);background-color:var(--brick-color-surface-hover,var(--brick-color-surface-subtle))}.brick-color-picker__input:focus-visible,.brick-color-picker__native-input:focus-visible,.brick-color-picker__trigger:focus-visible,.brick-color-picker__swatch-trigger:focus-visible{outline:var(--brick-border-focus-width) solid var(--brick-color-picker-focus-ring);outline-offset:var(--brick-border-focus-offset)}.brick-color-picker[data-invalid]{--brick-color-picker-border-color:var(--brick-color-danger-border);--brick-color-picker-focus-ring:var(--brick-color-danger-text)}.brick-color-picker[data-disabled] :where(.brick-color-picker__input,.brick-color-picker__native-input,.brick-color-picker__trigger,.brick-color-picker__swatch-trigger){cursor:not-allowed;color:var(--brick-color-text-disabled);opacity:.72}.brick-color-picker[data-readonly] :where(.brick-color-picker__input,.brick-color-picker__native-input,.brick-color-picker__swatch-trigger){cursor:not-allowed;background:var(--brick-color-surface-subtle)}.brick-color-picker__swatch-trigger[aria-pressed=true]{border-color:var(--brick-color-accent-border);box-shadow:inset 0 0 0 var(--brick-border-width) var(--brick-color-accent-border)}.brick-color-picker__content{z-index:calc(var(--brick-layer-overlay) - 1);box-sizing:border-box;inline-size:max-content;max-inline-size:min(22rem, calc(100dvi - 2rem - env(safe-area-inset-left) - env(safe-area-inset-right)));color:var(--brick-color-text-primary)}.brick-color-picker__content>[data-slot=popover-viewport]{gap:var(--brick-space-3);max-block-size:min(28rem,100dvb - 2rem);min-inline-size:min(18rem,100dvi - 2rem);padding:var(--brick-space-3);border:var(--brick-border-width) solid var(--brick-color-picker-content-border-color);border-radius:var(--brick-color-picker-content-radius);background:var(--brick-color-picker-content-background);box-shadow:var(--brick-color-picker-content-shadow);overscroll-behavior:contain;display:grid;overflow:auto}@supports not (height:100dvb){.brick-color-picker__content>[data-slot=popover-viewport]{max-block-size:min(28rem,100vh - 2rem)}}@media (prefers-reduced-motion:reduce){.brick-color-picker :where(.brick-color-picker__input,.brick-color-picker__native-input,.brick-color-picker__trigger,.brick-color-picker__swatch-trigger){transition-duration:1ms}}@media (forced-colors:active){.brick-color-picker{--brick-color-picker-background:Canvas;--brick-color-picker-border-color:CanvasText;--brick-color-picker-content-background:Canvas;--brick-color-picker-content-border-color:CanvasText;--brick-color-picker-content-shadow:none}.brick-color-picker__swatch-trigger[aria-pressed=true]{box-shadow:none;border-width:2px}}}@layer brick.utilities,brick.effects;
2
+ /*# sourceMappingURL=color-picker.css.map */
package/dist/styles/color-picker.css.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":null,"mappings":"ACAA,sDAAA,wBCCE,uvBAyBA,0GAOA,iEACA,iEAEA,8BACE,sECpCF,+oBAiBA,yEACA,yEACA,yGAEA,wXAUA,kHAOA,gqBAgBA,iJAQA,2IAOA,2OAWA,+OAWA,wRAQA,yTAQA,oKAKA,+OAMA,4MAKA,uLAKA,uQAQA,ifAcA,8BACE,kGAGF,uCACE,mLAGF,8BACE,qPAQA,0FFxKJ","sources":["home/runner/work/brick/brick/.brick-cache/production/color-picker.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/color-swatch/color-swatch.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/color-picker/color-picker.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/color-swatch/color-swatch.css\";\n@import \"../../src/components/color-picker/color-picker.css\";","@layer brick.tokens, flowstack.theme, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n .brick-color-swatch {\n --brick-color-swatch-size: 1.5rem;\n --brick-color-swatch-value: transparent;\n --brick-color-swatch-border-color: var(--brick-color-border-default);\n --brick-color-swatch-radius: var(--brick-radius-subtle);\n\n position: relative;\n display: inline-block;\n box-sizing: border-box;\n inline-size: var(--brick-color-swatch-size);\n block-size: var(--brick-color-swatch-size);\n flex: none;\n overflow: hidden;\n border: var(--brick-border-width) solid var(--brick-color-swatch-border-color);\n border-radius: var(--brick-color-swatch-radius);\n background-color: var(--brick-color-surface-base);\n background-image: repeating-conic-gradient(\n var(--brick-color-surface-subtle) 0 25%,\n var(--brick-color-surface-raised) 0 50%\n );\n background-position: 0 0;\n background-size: 0.5rem 0.5rem;\n vertical-align: middle;\n }\n\n .brick-color-swatch::after {\n position: absolute;\n inset: 0;\n background: var(--brick-color-swatch-value);\n content: \"\";\n }\n\n .brick-color-swatch[data-size=\"sm\"] { --brick-color-swatch-size: 1rem; }\n .brick-color-swatch[data-size=\"lg\"] { --brick-color-swatch-size: 2rem; }\n\n @media (forced-colors: active) {\n .brick-color-swatch {\n border-color: CanvasText;\n forced-color-adjust: none;\n }\n }\n}\n","@layer brick.components {\n .brick-color-picker {\n --brick-color-picker-control-size: 2.5rem;\n --brick-color-picker-gap: var(--brick-space-2);\n --brick-color-picker-background: transparent;\n --brick-color-picker-border-color: var(--brick-color-border-default);\n --brick-color-picker-focus-ring: var(--brick-color-focus-ring);\n --brick-color-picker-content-background: var(--brick-color-surface-overlay);\n --brick-color-picker-content-border-color: var(--brick-color-border-default);\n --brick-color-picker-content-radius: var(--brick-radius-overlay);\n --brick-color-picker-content-shadow: var(--brick-shadow-floating);\n\n display: grid;\n min-inline-size: 0;\n gap: var(--brick-space-2);\n color: var(--brick-color-text-primary);\n }\n\n .brick-color-picker[data-size=\"sm\"] { --brick-color-picker-control-size: 2rem; }\n .brick-color-picker[data-size=\"lg\"] { --brick-color-picker-control-size: 3rem; }\n .brick-color-picker[data-variant=\"soft\"] { --brick-color-picker-background: var(--brick-color-surface-subtle); }\n\n .brick-color-picker__label {\n inline-size: fit-content;\n color: var(--brick-color-text-primary);\n font-family: var(--brick-typography-label-md-font-family);\n font-size: var(--brick-typography-label-md-font-size);\n font-weight: var(--brick-typography-label-md-font-weight);\n letter-spacing: var(--brick-typography-label-md-letter-spacing);\n line-height: var(--brick-typography-label-md-line-height);\n }\n\n .brick-color-picker__control {\n display: flex;\n min-inline-size: 0;\n align-items: stretch;\n gap: var(--brick-color-picker-gap);\n }\n\n .brick-color-picker__input,\n .brick-color-picker__native-input,\n .brick-color-picker__trigger,\n .brick-color-picker__swatch-trigger {\n box-sizing: border-box;\n min-block-size: var(--brick-color-picker-control-size);\n border: var(--brick-border-width) solid var(--brick-color-picker-border-color);\n border-radius: var(--brick-radius-control);\n background: var(--brick-color-picker-background);\n color: var(--brick-color-text-primary);\n transition:\n border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n box-shadow var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);\n }\n\n .brick-color-picker__input {\n inline-size: 9rem;\n min-inline-size: 0;\n padding-inline: var(--brick-space-3);\n font: inherit;\n font-variant-numeric: tabular-nums;\n }\n\n .brick-color-picker__native-input {\n inline-size: var(--brick-color-picker-control-size);\n flex: none;\n padding: var(--brick-space-1);\n cursor: pointer;\n }\n\n .brick-color-picker__trigger {\n display: inline-flex;\n min-inline-size: var(--brick-color-picker-control-size);\n align-items: center;\n justify-content: center;\n gap: var(--brick-space-2);\n padding-inline: var(--brick-space-2);\n cursor: pointer;\n font: inherit;\n }\n\n .brick-color-picker__swatch-trigger {\n display: inline-flex;\n min-inline-size: var(--brick-color-picker-control-size);\n align-items: center;\n justify-content: flex-start;\n gap: var(--brick-space-2);\n padding: var(--brick-space-2);\n cursor: pointer;\n font: inherit;\n }\n\n .brick-color-picker__input:hover,\n .brick-color-picker__native-input:hover,\n .brick-color-picker__trigger:hover,\n .brick-color-picker__swatch-trigger:hover {\n border-color: var(--brick-color-border-strong);\n background-color: var(--brick-color-surface-hover, var(--brick-color-surface-subtle));\n }\n\n .brick-color-picker__input:focus-visible,\n .brick-color-picker__native-input:focus-visible,\n .brick-color-picker__trigger:focus-visible,\n .brick-color-picker__swatch-trigger:focus-visible {\n outline: var(--brick-border-focus-width) solid var(--brick-color-picker-focus-ring);\n outline-offset: var(--brick-border-focus-offset);\n }\n\n .brick-color-picker[data-invalid] {\n --brick-color-picker-border-color: var(--brick-color-danger-border);\n --brick-color-picker-focus-ring: var(--brick-color-danger-text);\n }\n\n .brick-color-picker[data-disabled] :where(.brick-color-picker__input, .brick-color-picker__native-input, .brick-color-picker__trigger, .brick-color-picker__swatch-trigger) {\n cursor: not-allowed;\n color: var(--brick-color-text-disabled);\n opacity: 0.72;\n }\n\n .brick-color-picker[data-readonly] :where(.brick-color-picker__input, .brick-color-picker__native-input, .brick-color-picker__swatch-trigger) {\n cursor: not-allowed;\n background: var(--brick-color-surface-subtle);\n }\n\n .brick-color-picker__swatch-trigger[aria-pressed=\"true\"] {\n border-color: var(--brick-color-accent-border);\n box-shadow: inset 0 0 0 var(--brick-border-width) var(--brick-color-accent-border);\n }\n\n .brick-color-picker__content {\n z-index: calc(var(--brick-layer-overlay) - 1);\n box-sizing: border-box;\n inline-size: max-content;\n max-inline-size: min(22rem, calc(100dvi - 2rem - env(safe-area-inset-left) - env(safe-area-inset-right)));\n color: var(--brick-color-text-primary);\n }\n\n .brick-color-picker__content > [data-slot=\"popover-viewport\"] {\n display: grid;\n min-inline-size: min(18rem, calc(100dvi - 2rem));\n max-block-size: min(28rem, calc(100dvb - 2rem));\n gap: var(--brick-space-3);\n padding: var(--brick-space-3);\n overflow: auto;\n border: var(--brick-border-width) solid var(--brick-color-picker-content-border-color);\n border-radius: var(--brick-color-picker-content-radius);\n background: var(--brick-color-picker-content-background);\n box-shadow: var(--brick-color-picker-content-shadow);\n overscroll-behavior: contain;\n }\n\n @supports not (height: 100dvb) {\n .brick-color-picker__content > [data-slot=\"popover-viewport\"] { max-block-size: min(28rem, calc(100vh - 2rem)); }\n }\n\n @media (prefers-reduced-motion: reduce) {\n .brick-color-picker :where(.brick-color-picker__input, .brick-color-picker__native-input, .brick-color-picker__trigger, .brick-color-picker__swatch-trigger) { transition-duration: 1ms; }\n }\n\n @media (forced-colors: active) {\n .brick-color-picker {\n --brick-color-picker-background: Canvas;\n --brick-color-picker-border-color: CanvasText;\n --brick-color-picker-content-background: Canvas;\n --brick-color-picker-content-border-color: CanvasText;\n --brick-color-picker-content-shadow: none;\n }\n\n .brick-color-picker__swatch-trigger[aria-pressed=\"true\"] { border-width: 2px; box-shadow: none; }\n }\n}\n"],"names":[]}
package/dist/styles/color-swatch.css ADDED
@@ -0,0 +1,2 @@
1
+ @layer brick.tokens,flowstack.theme,brick.foundations;@layer brick.components{.brick-color-swatch{--brick-color-swatch-size:1.5rem;--brick-color-swatch-value:transparent;--brick-color-swatch-border-color:var(--brick-color-border-default);--brick-color-swatch-radius:var(--brick-radius-subtle);box-sizing:border-box;inline-size:var(--brick-color-swatch-size);block-size:var(--brick-color-swatch-size);border:var(--brick-border-width) solid var(--brick-color-swatch-border-color);border-radius:var(--brick-color-swatch-radius);background-color:var(--brick-color-surface-base);background-image:repeating-conic-gradient(var(--brick-color-surface-subtle) 0 25%, var(--brick-color-surface-raised) 0 50%);vertical-align:middle;background-position:0 0;background-size:.5rem .5rem;flex:none;display:inline-block;position:relative;overflow:hidden}.brick-color-swatch:after{background:var(--brick-color-swatch-value);content:"";position:absolute;inset:0}.brick-color-swatch[data-size=sm]{--brick-color-swatch-size:1rem}.brick-color-swatch[data-size=lg]{--brick-color-swatch-size:2rem}@media (forced-colors:active){.brick-color-swatch{forced-color-adjust:none;border-color:canvastext}}}@layer brick.utilities,brick.effects;
2
+ /*# sourceMappingURL=color-swatch.css.map */
package/dist/styles/color-swatch.css.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":null,"mappings":"ACAA,sDAAA,wBCCE,uvBAyBA,0GAOA,iEACA,iEAEA,8BACE,uEDrCJ","sources":["home/runner/work/brick/brick/.brick-cache/production/color-swatch.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/color-swatch/color-swatch.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/color-swatch/color-swatch.css\";","@layer brick.tokens, flowstack.theme, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n .brick-color-swatch {\n --brick-color-swatch-size: 1.5rem;\n --brick-color-swatch-value: transparent;\n --brick-color-swatch-border-color: var(--brick-color-border-default);\n --brick-color-swatch-radius: var(--brick-radius-subtle);\n\n position: relative;\n display: inline-block;\n box-sizing: border-box;\n inline-size: var(--brick-color-swatch-size);\n block-size: var(--brick-color-swatch-size);\n flex: none;\n overflow: hidden;\n border: var(--brick-border-width) solid var(--brick-color-swatch-border-color);\n border-radius: var(--brick-color-swatch-radius);\n background-color: var(--brick-color-surface-base);\n background-image: repeating-conic-gradient(\n var(--brick-color-surface-subtle) 0 25%,\n var(--brick-color-surface-raised) 0 50%\n );\n background-position: 0 0;\n background-size: 0.5rem 0.5rem;\n vertical-align: middle;\n }\n\n .brick-color-swatch::after {\n position: absolute;\n inset: 0;\n background: var(--brick-color-swatch-value);\n content: \"\";\n }\n\n .brick-color-swatch[data-size=\"sm\"] { --brick-color-swatch-size: 1rem; }\n .brick-color-swatch[data-size=\"lg\"] { --brick-color-swatch-size: 2rem; }\n\n @media (forced-colors: active) {\n .brick-color-swatch {\n border-color: CanvasText;\n forced-color-adjust: none;\n }\n }\n}\n"],"names":[]}
package/dist/styles/combobox.css CHANGED
@@ -1,2 +1,2 @@
1
- @layer brick.tokens,brick.foundations;@layer brick.components{.brick-combobox-control{--brick-combobox-min-block-size:var(--brick-control-min-block-size-md);--brick-combobox-padding-inline:var(--brick-space-3);--brick-combobox-radius:var(--brick-radius-control);--brick-combobox-background:var(--brick-color-surface-raised);--brick-combobox-border:var(--brick-color-border-strong);--brick-combobox-foreground:var(--brick-color-text-primary);--brick-combobox-placeholder:var(--brick-color-text-muted);--brick-combobox-focus:var(--brick-color-focus-ring);--brick-combobox-invalid:var(--brick-color-danger-text);box-sizing:border-box;min-inline-size:0;max-inline-size:100%;min-block-size:var(--brick-combobox-min-block-size);align-items:center;gap:var(--brick-space-1);padding-inline:var(--brick-combobox-padding-inline);border:var(--brick-border-width) solid var(--brick-combobox-border);border-radius:var(--brick-combobox-radius);background:var(--brick-combobox-background);color:var(--brick-combobox-foreground);transition:border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),box-shadow var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);display:inline-flex}.brick-combobox-control[data-full-width]{inline-size:100%}.brick-combobox-control:not([data-full-width]){inline-size:fit-content}.brick-combobox-control[data-variant=soft]{--brick-combobox-background:var(--brick-color-surface-subtle);--brick-combobox-border:var(--brick-color-border-subtle)}.brick-combobox-control[data-variant=underline]{--brick-combobox-background:transparent;--brick-combobox-radius:0;border-width:0 0 var(--brick-border-width)}.brick-combobox-control[data-shape=sharp]{--brick-combobox-radius:0}.brick-combobox-control[data-shape=pill]{--brick-combobox-radius:var(--brick-radius-full)}.brick-combobox-control[data-size=sm]{--brick-combobox-min-block-size:var(--brick-control-min-block-size-sm);--brick-combobox-padding-inline:var(--brick-space-2)}.brick-combobox-control[data-size=lg]{--brick-combobox-min-block-size:var(--brick-control-min-block-size-lg);--brick-combobox-padding-inline:var(--brick-space-4)}.brick-combobox-input{box-sizing:border-box;inline-size:100%;min-inline-size:0;min-block-size:calc(var(--brick-combobox-min-block-size) - 2 * var(--brick-border-width));color:inherit;font:inherit;background:0 0;border:0;outline:0;padding:0}.brick-combobox-input::placeholder{color:var(--brick-combobox-placeholder)}.brick-combobox-control:has(.brick-combobox-input:focus-visible){border-color:var(--brick-combobox-focus);box-shadow:0 0 0 var(--brick-border-focus-width) var(--brick-combobox-focus)}.brick-combobox-control:has(.brick-combobox-input[data-invalid]){border-color:var(--brick-combobox-invalid)}.brick-combobox-control:has(.brick-combobox-input[data-disabled]){background:var(--brick-color-surface-subtle);color:var(--brick-color-text-secondary);cursor:not-allowed}.brick-combobox-control:has(.brick-combobox-input[data-readonly]){background:var(--brick-color-surface-subtle)}.brick-combobox-clear,.brick-combobox-trigger{border-radius:var(--brick-radius-sm);block-size:1.75rem;inline-size:1.75rem;color:var(--brick-color-text-secondary);cursor:pointer;background:0 0;border:0;flex:none;place-items:center;padding:0;display:inline-grid}.brick-combobox-indicator{place-items:center;display:inline-grid}.brick-combobox-clear[data-hidden]{display:none}.brick-combobox-clear:focus-visible,.brick-combobox-trigger:focus-visible{outline:var(--brick-border-focus-width) solid var(--brick-combobox-focus);outline-offset:1px}.brick-combobox-clear-artwork,.brick-combobox-indicator-artwork{stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.75px;block-size:1rem;inline-size:1rem}.brick-combobox-trigger[data-state=open] .brick-combobox-indicator{transform:rotate(180deg)}.brick-combobox-trigger:disabled{cursor:not-allowed}.brick-combobox-content{--brick-combobox-popup-radius:var(--brick-radius-control);--brick-combobox-item-min-block-size:var(--brick-control-min-block-size-md);box-sizing:border-box;max-inline-size:min(28rem,calc(100vw - 2 * var(--brick-space-3)));max-block-size:min(20rem,var(--available-height,20rem));border:var(--brick-border-width) solid var(--brick-color-border-subtle);border-radius:var(--brick-combobox-popup-radius);background:var(--brick-color-surface-raised);box-shadow:0 .75rem 2rem color-mix(in srgb,var(--brick-color-shadow),transparent 48%);color:var(--brick-color-text-primary);z-index:70;overflow:hidden}.brick-combobox-content[data-size=sm]{--brick-combobox-item-min-block-size:var(--brick-control-min-block-size-sm)}.brick-combobox-content[data-size=lg]{--brick-combobox-item-min-block-size:var(--brick-control-min-block-size-lg)}.brick-combobox-listbox{box-sizing:border-box;max-block-size:inherit;padding:var(--brick-space-1);overscroll-behavior:contain;scrollbar-width:thin;outline:0;overflow-y:auto}.brick-combobox-group+.brick-combobox-group{margin-block-start:var(--brick-space-1)}.brick-combobox-label{padding:var(--brick-space-2) var(--brick-space-3) var(--brick-space-1);color:var(--brick-color-text-secondary);font-size:var(--brick-typography-caption-font-size);font-weight:var(--brick-typography-label-md-font-weight);display:block}label.brick-combobox-label{color:var(--brick-color-text-primary);padding-inline:0}.brick-combobox-item{box-sizing:border-box;min-block-size:var(--brick-combobox-item-min-block-size);align-items:center;gap:var(--brick-space-2);padding-inline:var(--brick-space-3);border-radius:calc(var(--brick-combobox-popup-radius) - var(--brick-border-width));cursor:pointer;overflow-wrap:anywhere;outline:0;grid-template-columns:minmax(0,1fr) 1rem;display:grid}.brick-combobox-item:after{content:"";opacity:0;border-block-end:2px solid;border-inline-start:2px solid;block-size:.35rem;inline-size:.65rem;transform:rotate(-45deg)}.brick-combobox-item[data-state=checked]:after{opacity:1}.brick-combobox-item[data-highlighted]{background:var(--brick-color-accent-soft)}.brick-combobox-item[data-state=checked]{color:var(--brick-color-accent-text);font-weight:var(--brick-typography-label-md-font-weight)}.brick-combobox-item[data-disabled]{color:var(--brick-color-text-muted);cursor:not-allowed;opacity:.65}.brick-combobox-message{padding:var(--brick-space-3);color:var(--brick-color-text-secondary)}@media (hover:hover) and (pointer:fine){.brick-combobox-control:not([data-disabled],[data-readonly],[data-invalid]):hover{border-color:var(--brick-color-accent-border)}.brick-combobox-item:not([data-disabled]):hover{background:var(--brick-color-accent-soft)}}@media (prefers-reduced-motion:reduce){.brick-combobox-control,.brick-combobox-indicator{transition-duration:0s}}@media (forced-colors:active){.brick-combobox-control,.brick-combobox-content{color:canvastext;background:canvas;border-color:buttontext}.brick-combobox-control:has(.brick-combobox-input:focus-visible),.brick-combobox-item[data-highlighted]{outline:var(--brick-border-focus-width) solid Highlight;box-shadow:none}.brick-combobox-item[data-disabled]{color:graytext}.brick-combobox-item[data-state=checked]{color:highlight}}}@layer brick.utilities,brick.effects;
1
+ @layer brick.tokens,flowstack.theme,brick.foundations;@layer brick.components{.brick-combobox-control{--brick-combobox-min-block-size:var(--brick-control-min-block-size-md);--brick-combobox-padding-inline:var(--brick-space-3);--brick-combobox-radius:var(--brick-radius-control);--brick-combobox-background:var(--brick-color-surface-raised);--brick-combobox-border:var(--brick-color-border-strong);--brick-combobox-foreground:var(--brick-color-text-primary);--brick-combobox-placeholder:var(--brick-color-text-muted);--brick-combobox-focus:var(--brick-color-focus-ring);--brick-combobox-invalid:var(--brick-color-danger-text);box-sizing:border-box;min-inline-size:0;max-inline-size:100%;min-block-size:var(--brick-combobox-min-block-size);align-items:center;gap:var(--brick-space-1);padding-inline:var(--brick-combobox-padding-inline);border:var(--brick-border-width) solid var(--brick-combobox-border);border-radius:var(--brick-combobox-radius);background:var(--brick-combobox-background);color:var(--brick-combobox-foreground);transition:border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),box-shadow var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);display:inline-flex}.brick-combobox-control[data-full-width]{inline-size:100%}.brick-combobox-control:not([data-full-width]){inline-size:fit-content}.brick-combobox-control[data-variant=soft]{--brick-combobox-background:var(--brick-color-surface-subtle);--brick-combobox-border:var(--brick-color-border-subtle)}.brick-combobox-control[data-variant=underline]{--brick-combobox-background:transparent;--brick-combobox-radius:0;border-width:0 0 var(--brick-border-width)}.brick-combobox-control[data-shape=sharp]{--brick-combobox-radius:0}.brick-combobox-control[data-shape=pill]{--brick-combobox-radius:var(--brick-radius-full)}.brick-combobox-control[data-size=sm]{--brick-combobox-min-block-size:var(--brick-control-min-block-size-sm);--brick-combobox-padding-inline:var(--brick-space-2)}.brick-combobox-control[data-size=lg]{--brick-combobox-min-block-size:var(--brick-control-min-block-size-lg);--brick-combobox-padding-inline:var(--brick-space-4)}.brick-combobox-input{box-sizing:border-box;inline-size:100%;min-inline-size:0;min-block-size:calc(var(--brick-combobox-min-block-size) - 2 * var(--brick-border-width));color:inherit;font:inherit;background:0 0;border:0;outline:0;padding:0}.brick-combobox-input::placeholder{color:var(--brick-combobox-placeholder)}.brick-combobox-control:has(.brick-combobox-input:focus-visible){border-color:var(--brick-combobox-focus);box-shadow:0 0 0 var(--brick-border-focus-width) var(--brick-combobox-focus)}.brick-combobox-control:has(.brick-combobox-input[data-invalid]){border-color:var(--brick-combobox-invalid)}.brick-combobox-control:has(.brick-combobox-input[data-disabled]){background:var(--brick-color-surface-subtle);color:var(--brick-color-text-secondary);cursor:not-allowed}.brick-combobox-control:has(.brick-combobox-input[data-readonly]){background:var(--brick-color-surface-subtle)}.brick-combobox-clear,.brick-combobox-trigger{border-radius:var(--brick-radius-subtle);block-size:1.75rem;inline-size:1.75rem;color:var(--brick-color-text-secondary);cursor:pointer;background:0 0;border:0;flex:none;place-items:center;padding:0;display:inline-grid}.brick-combobox-indicator{place-items:center;display:inline-grid}.brick-combobox-clear[data-hidden]{display:none}.brick-combobox-clear:focus-visible,.brick-combobox-trigger:focus-visible{outline:var(--brick-border-focus-width) solid var(--brick-combobox-focus);outline-offset:1px}.brick-combobox-clear-artwork,.brick-combobox-indicator-artwork{stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.75px;block-size:1rem;inline-size:1rem}.brick-combobox-trigger[data-state=open] .brick-combobox-indicator{transform:rotate(180deg)}.brick-combobox-trigger:disabled{cursor:not-allowed}.brick-combobox-content{--brick-combobox-popup-radius:var(--brick-radius-control);--brick-combobox-item-min-block-size:var(--brick-control-min-block-size-md);box-sizing:border-box;max-inline-size:min(28rem,calc(100vw - 2 * var(--brick-space-3)));max-block-size:min(20rem,var(--available-height,20rem));border:var(--brick-border-width) solid var(--brick-color-border-subtle);border-radius:var(--brick-combobox-popup-radius);background:var(--brick-color-surface-raised);box-shadow:var(--brick-shadow-floating);color:var(--brick-color-text-primary);z-index:70;overflow:hidden}.brick-combobox-content[data-size=sm]{--brick-combobox-item-min-block-size:var(--brick-control-min-block-size-sm)}.brick-combobox-content[data-size=lg]{--brick-combobox-item-min-block-size:var(--brick-control-min-block-size-lg)}.brick-combobox-listbox{box-sizing:border-box;max-block-size:inherit;padding:var(--brick-space-1);overscroll-behavior:contain;scrollbar-width:thin;outline:0;overflow-y:auto}.brick-combobox-group+.brick-combobox-group{margin-block-start:var(--brick-space-1)}.brick-combobox-label{padding:var(--brick-space-2) var(--brick-space-3) var(--brick-space-1);color:var(--brick-color-text-secondary);font-size:var(--brick-typography-caption-font-size);font-weight:var(--brick-typography-label-md-font-weight);display:block}label.brick-combobox-label{color:var(--brick-color-text-primary);padding-inline:0}.brick-combobox-item{box-sizing:border-box;min-block-size:var(--brick-combobox-item-min-block-size);align-items:center;gap:var(--brick-space-2);padding-inline:var(--brick-space-3);border-radius:calc(var(--brick-combobox-popup-radius) - var(--brick-border-width));cursor:pointer;overflow-wrap:anywhere;outline:0;grid-template-columns:minmax(0,1fr) 1rem;display:grid}.brick-combobox-item:after{content:"";opacity:0;border-block-end:2px solid;border-inline-start:2px solid;block-size:.35rem;inline-size:.65rem;transform:rotate(-45deg)}.brick-combobox-item[data-state=checked]:after{opacity:1}.brick-combobox-item[data-highlighted]{background:var(--brick-color-accent-soft)}.brick-combobox-item[data-state=checked]{color:var(--brick-color-accent-text);font-weight:var(--brick-typography-label-md-font-weight)}.brick-combobox-item[data-disabled]{color:var(--brick-color-text-muted);cursor:not-allowed;opacity:.65}.brick-combobox-message{padding:var(--brick-space-3);color:var(--brick-color-text-secondary)}@media (hover:hover) and (pointer:fine){.brick-combobox-control:not([data-disabled],[data-readonly],[data-invalid]):hover{border-color:var(--brick-color-accent-border)}.brick-combobox-item:not([data-disabled]):hover{background:var(--brick-color-accent-soft)}}@media (prefers-reduced-motion:reduce){.brick-combobox-control,.brick-combobox-indicator{transition-duration:0s}}@media (forced-colors:active){.brick-combobox-control,.brick-combobox-content{color:canvastext;background:canvas;border-color:buttontext}.brick-combobox-control:has(.brick-combobox-input:focus-visible),.brick-combobox-item[data-highlighted]{outline:var(--brick-border-focus-width) solid Highlight;box-shadow:none}.brick-combobox-item[data-disabled]{color:graytext}.brick-combobox-item[data-state=checked]{color:highlight}}}@layer brick.utilities,brick.effects;
2
2
  /*# sourceMappingURL=combobox.css.map */