@askrjs/themes 0.0.9 → 0.0.10

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 (472) hide show
  1. package/README.md +19 -13
  2. package/THEMING.md +24 -18
  3. package/dist/components/_internal/block-layout.d.ts +49 -0
  4. package/dist/components/_internal/block-layout.js +210 -0
  5. package/dist/components/_internal/block-layout.js.map +1 -0
  6. package/dist/components/alert/alert.js +2 -2
  7. package/dist/components/alert/alert.js.map +1 -1
  8. package/dist/components/alert/alert.types.d.ts +0 -1
  9. package/dist/components/aside/aside.d.ts +7 -0
  10. package/dist/components/aside/aside.js +16 -0
  11. package/dist/components/aside/aside.js.map +1 -0
  12. package/dist/components/aside/aside.types.d.ts +6 -0
  13. package/dist/components/aside/index.d.ts +2 -0
  14. package/dist/components/aspect-ratio/aspect-ratio.js +1 -1
  15. package/dist/components/aspect-ratio/aspect-ratio.js.map +1 -1
  16. package/dist/components/badge/index.d.ts +1 -2
  17. package/dist/components/block/block.d.ts +2 -3
  18. package/dist/components/block/block.js +16 -46
  19. package/dist/components/block/block.js.map +1 -1
  20. package/dist/components/block/block.types.d.ts +13 -23
  21. package/dist/components/block/index.d.ts +3 -3
  22. package/dist/components/brand/brand.d.ts +9 -0
  23. package/dist/components/brand/brand.js +49 -0
  24. package/dist/components/brand/brand.js.map +1 -0
  25. package/dist/components/brand/brand.types.d.ts +31 -0
  26. package/dist/components/brand/index.d.ts +2 -0
  27. package/dist/components/card/card.d.ts +3 -3
  28. package/dist/components/card/card.js +6 -11
  29. package/dist/components/card/card.js.map +1 -1
  30. package/dist/components/card/card.types.d.ts +10 -12
  31. package/dist/components/card/index.d.ts +2 -2
  32. package/dist/components/catalog.d.ts +156 -0
  33. package/dist/components/catalog.js +723 -0
  34. package/dist/components/catalog.js.map +1 -0
  35. package/dist/components/container/container.d.ts +2 -3
  36. package/dist/components/container/container.js +8 -71
  37. package/dist/components/container/container.js.map +1 -1
  38. package/dist/components/container/container.types.d.ts +5 -24
  39. package/dist/components/container/index.d.ts +2 -3
  40. package/dist/components/empty-state/empty-state.js +34 -28
  41. package/dist/components/empty-state/empty-state.js.map +1 -1
  42. package/dist/components/empty-state/empty-state.types.d.ts +3 -6
  43. package/dist/components/field/field.js +4 -2
  44. package/dist/components/field/field.js.map +1 -1
  45. package/dist/components/field/field.types.d.ts +1 -0
  46. package/dist/components/footer/footer.d.ts +13 -0
  47. package/dist/components/footer/footer.js +86 -0
  48. package/dist/components/footer/footer.js.map +1 -0
  49. package/dist/components/footer/footer.types.d.ts +37 -0
  50. package/dist/components/footer/index.d.ts +2 -0
  51. package/dist/components/grid/grid.d.ts +7 -0
  52. package/dist/components/grid/grid.js +76 -0
  53. package/dist/components/grid/grid.js.map +1 -0
  54. package/dist/components/grid/grid.types.d.ts +19 -0
  55. package/dist/components/grid/index.d.ts +2 -0
  56. package/dist/components/header/header.js +9 -6
  57. package/dist/components/header/header.js.map +1 -1
  58. package/dist/components/header/header.types.d.ts +5 -5
  59. package/dist/components/header/index.d.ts +2 -0
  60. package/dist/components/main/index.d.ts +2 -0
  61. package/dist/components/main/main.d.ts +7 -0
  62. package/dist/components/main/main.js +17 -0
  63. package/dist/components/main/main.js.map +1 -0
  64. package/dist/components/main/main.types.d.ts +6 -0
  65. package/dist/components/nav/index.d.ts +2 -2
  66. package/dist/components/nav/nav.d.ts +8 -6
  67. package/dist/components/nav/nav.js +93 -58
  68. package/dist/components/nav/nav.js.map +1 -1
  69. package/dist/components/nav/nav.types.d.ts +16 -20
  70. package/dist/components/navbar/index.d.ts +4 -5
  71. package/dist/components/navbar/navbar.d.ts +3 -38
  72. package/dist/components/navbar/navbar.js +103 -210
  73. package/dist/components/navbar/navbar.js.map +1 -1
  74. package/dist/components/navbar/navbar.types.d.ts +14 -24
  75. package/dist/components/page/index.d.ts +2 -0
  76. package/dist/components/page/page.d.ts +7 -0
  77. package/dist/components/page/page.js +22 -0
  78. package/dist/components/page/page.js.map +1 -0
  79. package/dist/components/page/page.types.d.ts +6 -0
  80. package/dist/components/page-header/index.d.ts +2 -0
  81. package/dist/components/page-header/page-header.d.ts +7 -0
  82. package/dist/components/page-header/page-header.js +37 -0
  83. package/dist/components/page-header/page-header.js.map +1 -0
  84. package/dist/components/page-header/page-header.types.d.ts +10 -0
  85. package/dist/components/section/index.d.ts +2 -3
  86. package/dist/components/section/section.d.ts +2 -3
  87. package/dist/components/section/section.js +7 -30
  88. package/dist/components/section/section.js.map +1 -1
  89. package/dist/components/section/section.types.d.ts +3 -20
  90. package/dist/components/separator/index.d.ts +1 -2
  91. package/dist/components/sidebar/index.d.ts +2 -0
  92. package/dist/components/sidebar/sidebar.d.ts +17 -2
  93. package/dist/components/sidebar/sidebar.js +115 -225
  94. package/dist/components/sidebar/sidebar.js.map +1 -1
  95. package/dist/components/sidebar/sidebar.types.d.ts +21 -23
  96. package/dist/components/skeleton/index.d.ts +1 -2
  97. package/dist/components/skeleton/skeleton.js +12 -1
  98. package/dist/components/skeleton/skeleton.js.map +1 -1
  99. package/dist/components/skeleton/skeleton.types.d.ts +2 -0
  100. package/dist/components/spinner/index.d.ts +1 -1
  101. package/dist/components/spinner/spinner.js +6 -3
  102. package/dist/components/spinner/spinner.js.map +1 -1
  103. package/dist/components/spinner/spinner.types.d.ts +3 -1
  104. package/dist/components/stat/index.d.ts +2 -0
  105. package/dist/components/stat/stat.d.ts +10 -0
  106. package/dist/components/stat/stat.js +52 -0
  107. package/dist/components/stat/stat.js.map +1 -0
  108. package/dist/components/stat/stat.types.d.ts +24 -0
  109. package/dist/components/text/index.d.ts +2 -0
  110. package/dist/components/text/text.d.ts +7 -0
  111. package/dist/components/text/text.js +28 -0
  112. package/dist/components/text/text.js.map +1 -0
  113. package/dist/components/text/text.types.d.ts +26 -0
  114. package/dist/components/theme/theme.js +50 -8
  115. package/dist/components/theme/theme.js.map +1 -1
  116. package/dist/components/toolbar/index.d.ts +2 -0
  117. package/dist/components/toolbar/toolbar.d.ts +7 -0
  118. package/dist/components/toolbar/toolbar.js +30 -0
  119. package/dist/components/toolbar/toolbar.js.map +1 -0
  120. package/dist/components/toolbar/toolbar.types.d.ts +9 -0
  121. package/dist/components.d.ts +60 -0
  122. package/dist/components.js +35 -0
  123. package/dist/controls.d.ts +2 -2
  124. package/dist/controls.js +3 -3
  125. package/dist/core.d.ts +36 -0
  126. package/dist/core.js +19 -0
  127. package/dist/navs.d.ts +3 -15
  128. package/dist/navs.js +2 -8
  129. package/dist/overlays.d.ts +2 -2
  130. package/dist/overlays.js +2 -2
  131. package/dist/surfaces.d.ts +10 -8
  132. package/dist/surfaces.js +6 -4
  133. package/dist/themes/default/index.css +3661 -3945
  134. package/package.json +235 -69
  135. package/src/components/_internal/block-layout.ts +354 -0
  136. package/src/components/alert/alert.tsx +1 -2
  137. package/src/components/alert/alert.types.ts +0 -1
  138. package/src/components/aside/aside.tsx +12 -0
  139. package/src/components/aside/aside.types.ts +3 -0
  140. package/src/components/aside/index.ts +2 -0
  141. package/src/components/aspect-ratio/aspect-ratio.tsx +1 -1
  142. package/src/components/badge/index.ts +0 -1
  143. package/src/components/block/block.a11y.ts +0 -6
  144. package/src/components/block/block.tsx +40 -56
  145. package/src/components/block/block.types.ts +59 -41
  146. package/src/components/block/index.ts +1 -10
  147. package/src/components/brand/brand.tsx +61 -0
  148. package/src/components/brand/brand.types.ts +39 -0
  149. package/src/components/brand/index.ts +2 -0
  150. package/src/components/card/card.tsx +6 -18
  151. package/src/components/card/card.types.ts +9 -11
  152. package/src/components/card/index.ts +2 -3
  153. package/src/components/catalog.tsx +713 -0
  154. package/src/components/container/container.a11y.ts +0 -5
  155. package/src/components/container/container.tsx +18 -128
  156. package/src/components/container/container.types.ts +3 -32
  157. package/src/components/container/index.ts +1 -8
  158. package/src/components/empty-state/empty-state.tsx +17 -35
  159. package/src/components/empty-state/empty-state.types.ts +3 -5
  160. package/src/components/field/field.tsx +3 -1
  161. package/src/components/field/field.types.ts +1 -0
  162. package/src/components/footer/footer.tsx +88 -0
  163. package/src/components/footer/footer.types.ts +40 -0
  164. package/src/components/footer/index.ts +10 -0
  165. package/src/components/grid/grid.tsx +113 -0
  166. package/src/components/grid/grid.types.ts +20 -0
  167. package/src/components/grid/index.ts +2 -0
  168. package/src/components/header/header.tsx +10 -7
  169. package/src/components/header/header.types.ts +4 -4
  170. package/src/components/header/index.ts +1 -2
  171. package/src/components/main/index.ts +2 -0
  172. package/src/components/main/main.tsx +12 -0
  173. package/src/components/main/main.types.ts +3 -0
  174. package/src/components/nav/index.ts +7 -9
  175. package/src/components/nav/nav.tsx +153 -110
  176. package/src/components/nav/nav.types.ts +26 -27
  177. package/src/components/navbar/index.ts +4 -11
  178. package/src/components/navbar/navbar.tsx +103 -265
  179. package/src/components/navbar/navbar.types.ts +16 -42
  180. package/src/components/page/index.ts +2 -0
  181. package/src/components/page/page.tsx +17 -0
  182. package/src/components/page/page.types.ts +3 -0
  183. package/src/components/page-header/index.ts +2 -0
  184. package/src/components/page-header/page-header.tsx +29 -0
  185. package/src/components/page-header/page-header.types.ts +7 -0
  186. package/src/components/section/index.ts +1 -7
  187. package/src/components/section/section.a11y.ts +0 -1
  188. package/src/components/section/section.tsx +9 -35
  189. package/src/components/section/section.types.ts +2 -22
  190. package/src/components/separator/index.ts +4 -9
  191. package/src/components/sidebar/index.ts +27 -5
  192. package/src/components/sidebar/sidebar.tsx +146 -336
  193. package/src/components/sidebar/sidebar.types.ts +21 -28
  194. package/src/components/skeleton/index.ts +1 -2
  195. package/src/components/skeleton/skeleton.tsx +33 -1
  196. package/src/components/skeleton/skeleton.types.ts +2 -0
  197. package/src/components/spinner/index.ts +1 -1
  198. package/src/components/spinner/spinner.tsx +7 -2
  199. package/src/components/spinner/spinner.types.ts +3 -0
  200. package/src/components/stat/index.ts +2 -0
  201. package/src/components/stat/stat.tsx +47 -0
  202. package/src/components/stat/stat.types.ts +24 -0
  203. package/src/components/text/index.ts +2 -0
  204. package/src/components/text/text.tsx +39 -0
  205. package/src/components/text/text.types.ts +35 -0
  206. package/src/components/theme/theme.tsx +83 -9
  207. package/src/components/toolbar/index.ts +2 -0
  208. package/src/components/toolbar/toolbar.tsx +24 -0
  209. package/src/components/toolbar/toolbar.types.ts +6 -0
  210. package/src/components.ts +289 -0
  211. package/src/controls.ts +69 -2
  212. package/src/core.ts +42 -0
  213. package/src/navs.ts +9 -24
  214. package/src/overlays.ts +101 -59
  215. package/src/parity.ts +125 -0
  216. package/src/surfaces.ts +60 -13
  217. package/src/themes/default/index.css +11 -14
  218. package/src/themes/default/styles/actions/button-group.css +6 -6
  219. package/src/themes/default/styles/actions/button.css +98 -60
  220. package/src/themes/default/styles/actions/toggle-group.css +61 -25
  221. package/src/themes/default/styles/base/text.css +87 -0
  222. package/src/themes/default/styles/base/typography.css +24 -117
  223. package/src/themes/default/styles/base/utilities.css +0 -250
  224. package/src/themes/default/styles/disclosure/accordion.css +35 -28
  225. package/src/themes/default/styles/display/alert.css +7 -7
  226. package/src/themes/default/styles/display/badge.css +8 -9
  227. package/src/themes/default/styles/display/card.css +10 -47
  228. package/src/themes/default/styles/display/catalog.css +753 -0
  229. package/src/themes/default/styles/display/coverage.css +30 -305
  230. package/src/themes/default/styles/display/progress-circle.css +2 -0
  231. package/src/themes/default/styles/display/scroll-area.css +29 -24
  232. package/src/themes/default/styles/display/spinner.css +38 -1
  233. package/src/themes/default/styles/display/stat.css +21 -0
  234. package/src/themes/default/styles/display/table.css +37 -12
  235. package/src/themes/default/styles/display/virtual-list.css +24 -13
  236. package/src/themes/default/styles/display/virtual-table.css +58 -36
  237. package/src/themes/default/styles/forms/checkbox.css +12 -21
  238. package/src/themes/default/styles/forms/input-group.css +2 -1
  239. package/src/themes/default/styles/forms/input.css +11 -12
  240. package/src/themes/default/styles/forms/radio-group.css +44 -27
  241. package/src/themes/default/styles/forms/select.css +27 -35
  242. package/src/themes/default/styles/forms/slider.css +61 -47
  243. package/src/themes/default/styles/forms/switch.css +18 -23
  244. package/src/themes/default/styles/forms/textarea.css +12 -12
  245. package/src/themes/default/styles/layout/block.css +96 -12
  246. package/src/themes/default/styles/layout/grid.css +78 -0
  247. package/src/themes/default/styles/layout/layout.css +502 -772
  248. package/src/themes/default/styles/layout/patterns.css +0 -155
  249. package/src/themes/default/styles/navigation/nav.css +104 -154
  250. package/src/themes/default/styles/overlays/alert-dialog.css +2 -2
  251. package/src/themes/default/styles/overlays/dialog.css +76 -22
  252. package/src/themes/default/styles/overlays/dropdown.css +108 -31
  253. package/src/themes/default/styles/overlays/hover-card.css +39 -17
  254. package/src/themes/default/styles/overlays/menubar.css +223 -0
  255. package/src/themes/default/styles/overlays/popover.css +69 -23
  256. package/src/themes/default/styles/overlays/toast.css +91 -33
  257. package/src/themes/default/styles/overlays/tooltip.css +88 -14
  258. package/src/themes/default/styles/shell/brand.css +48 -0
  259. package/src/themes/default/styles/shell/footer.css +72 -0
  260. package/src/themes/default/styles/shell/header.css +7 -50
  261. package/src/themes/default/styles/shell/navbar.css +226 -454
  262. package/src/themes/default/styles/shell/sidebar.css +243 -829
  263. package/src/themes/default/tokens.css +145 -98
  264. package/templates/theme/index.css +11 -14
  265. package/templates/theme/styles/actions/button-group.css +6 -6
  266. package/templates/theme/styles/actions/button.css +98 -60
  267. package/templates/theme/styles/actions/toggle-group.css +61 -25
  268. package/templates/theme/styles/base/text.css +87 -0
  269. package/templates/theme/styles/base/typography.css +24 -117
  270. package/templates/theme/styles/disclosure/accordion.css +35 -28
  271. package/templates/theme/styles/display/alert.css +7 -7
  272. package/templates/theme/styles/display/badge.css +8 -9
  273. package/templates/theme/styles/display/card.css +10 -47
  274. package/templates/theme/styles/display/catalog.css +753 -0
  275. package/templates/theme/styles/display/coverage.css +30 -305
  276. package/templates/theme/styles/display/scroll-area.css +29 -24
  277. package/templates/theme/styles/display/spinner.css +38 -1
  278. package/templates/theme/styles/display/stat.css +21 -0
  279. package/templates/theme/styles/display/table.css +37 -12
  280. package/templates/theme/styles/display/virtual-list.css +24 -13
  281. package/templates/theme/styles/display/virtual-table.css +58 -36
  282. package/templates/theme/styles/forms/checkbox.css +12 -21
  283. package/templates/theme/styles/forms/input.css +11 -12
  284. package/templates/theme/styles/forms/radio-group.css +44 -27
  285. package/templates/theme/styles/forms/select.css +27 -35
  286. package/templates/theme/styles/forms/slider.css +61 -47
  287. package/templates/theme/styles/forms/switch.css +18 -23
  288. package/templates/theme/styles/forms/textarea.css +12 -12
  289. package/templates/theme/styles/layout/block.css +96 -12
  290. package/templates/theme/styles/layout/grid.css +78 -0
  291. package/templates/theme/styles/layout/layout.css +676 -1
  292. package/templates/theme/styles/layout/patterns.css +0 -155
  293. package/templates/theme/styles/navigation/nav.css +104 -154
  294. package/templates/theme/styles/overlays/alert-dialog.css +2 -2
  295. package/templates/theme/styles/overlays/dialog.css +76 -22
  296. package/templates/theme/styles/overlays/dropdown.css +108 -31
  297. package/templates/theme/styles/overlays/hover-card.css +39 -17
  298. package/templates/theme/styles/overlays/menubar.css +223 -0
  299. package/templates/theme/styles/overlays/popover.css +69 -23
  300. package/templates/theme/styles/overlays/toast.css +80 -33
  301. package/templates/theme/styles/overlays/tooltip.css +88 -14
  302. package/templates/theme/styles/shell/brand.css +48 -0
  303. package/templates/theme/styles/shell/footer.css +72 -0
  304. package/templates/theme/styles/shell/header.css +7 -50
  305. package/templates/theme/styles/shell/navbar.css +226 -454
  306. package/templates/theme/styles/shell/sidebar.css +197 -779
  307. package/templates/theme/tokens.css +145 -98
  308. package/dist/components/_internal/box-layout.js +0 -116
  309. package/dist/components/_internal/box-layout.js.map +0 -1
  310. package/dist/components/_internal/layout.d.ts +0 -9
  311. package/dist/components/_internal/layout.js +0 -142
  312. package/dist/components/_internal/layout.js.map +0 -1
  313. package/dist/components/badge/badge.a11y.d.ts +0 -17
  314. package/dist/components/block/block.a11y.d.ts +0 -20
  315. package/dist/components/box/box.a11y.d.ts +0 -14
  316. package/dist/components/box/box.d.ts +0 -9
  317. package/dist/components/box/box.js +0 -36
  318. package/dist/components/box/box.js.map +0 -1
  319. package/dist/components/box/box.types.d.ts +0 -72
  320. package/dist/components/box/index.d.ts +0 -3
  321. package/dist/components/breadcrumb/breadcrumb.a11y.d.ts +0 -17
  322. package/dist/components/breadcrumb/breadcrumb.a11y.js +0 -15
  323. package/dist/components/breadcrumb/breadcrumb.a11y.js.map +0 -1
  324. package/dist/components/breadcrumb/breadcrumb.d.ts +0 -18
  325. package/dist/components/breadcrumb/breadcrumb.js +0 -113
  326. package/dist/components/breadcrumb/breadcrumb.js.map +0 -1
  327. package/dist/components/breadcrumb/breadcrumb.types.d.ts +0 -65
  328. package/dist/components/breadcrumb/index.d.ts +0 -3
  329. package/dist/components/container/container.a11y.d.ts +0 -19
  330. package/dist/components/flex/flex.a11y.d.ts +0 -22
  331. package/dist/components/flex/flex.d.ts +0 -9
  332. package/dist/components/flex/flex.js +0 -115
  333. package/dist/components/flex/flex.js.map +0 -1
  334. package/dist/components/flex/flex.types.d.ts +0 -42
  335. package/dist/components/flex/index.d.ts +0 -3
  336. package/dist/components/header/header.a11y.d.ts +0 -14
  337. package/dist/components/header/header.a11y.js +0 -12
  338. package/dist/components/header/header.a11y.js.map +0 -1
  339. package/dist/components/inline/index.d.ts +0 -8
  340. package/dist/components/inline/index.js +0 -13
  341. package/dist/components/inline/index.js.map +0 -1
  342. package/dist/components/list-group/index.d.ts +0 -2
  343. package/dist/components/list-group/list-group.d.ts +0 -9
  344. package/dist/components/list-group/list-group.js +0 -43
  345. package/dist/components/list-group/list-group.js.map +0 -1
  346. package/dist/components/list-group/list-group.types.d.ts +0 -32
  347. package/dist/components/navbar/navbar-panel.js +0 -42
  348. package/dist/components/navbar/navbar-panel.js.map +0 -1
  349. package/dist/components/navbar/navbar.context.js +0 -13
  350. package/dist/components/navbar/navbar.context.js.map +0 -1
  351. package/dist/components/navbar/navbar.render.js +0 -26
  352. package/dist/components/navbar/navbar.render.js.map +0 -1
  353. package/dist/components/navbar/navbar.shared.js +0 -18
  354. package/dist/components/navbar/navbar.shared.js.map +0 -1
  355. package/dist/components/pagination/index.d.ts +0 -2
  356. package/dist/components/pagination/pagination.d.ts +0 -11
  357. package/dist/components/pagination/pagination.js +0 -95
  358. package/dist/components/pagination/pagination.js.map +0 -1
  359. package/dist/components/pagination/pagination.types.d.ts +0 -40
  360. package/dist/components/section/section.a11y.d.ts +0 -15
  361. package/dist/components/separator/separator.a11y.d.ts +0 -17
  362. package/dist/components/separator/separator.a11y.js +0 -15
  363. package/dist/components/separator/separator.a11y.js.map +0 -1
  364. package/dist/components/shell/index.d.ts +0 -3
  365. package/dist/components/shell/shell-nav.types.d.ts +0 -7
  366. package/dist/components/shell/shell-panel.js +0 -54
  367. package/dist/components/shell/shell-panel.js.map +0 -1
  368. package/dist/components/shell/shell-responsive.js +0 -141
  369. package/dist/components/shell/shell-responsive.js.map +0 -1
  370. package/dist/components/shell/shell.a11y.d.ts +0 -23
  371. package/dist/components/shell/shell.a11y.js +0 -23
  372. package/dist/components/shell/shell.a11y.js.map +0 -1
  373. package/dist/components/shell/shell.d.ts +0 -13
  374. package/dist/components/shell/shell.js +0 -69
  375. package/dist/components/shell/shell.js.map +0 -1
  376. package/dist/components/shell/shell.types.d.ts +0 -58
  377. package/dist/components/sidebar/sidebar-panel.d.ts +0 -7
  378. package/dist/components/sidebar/sidebar-panel.js +0 -49
  379. package/dist/components/sidebar/sidebar-panel.js.map +0 -1
  380. package/dist/components/sidebar/sidebar-toggle.d.ts +0 -7
  381. package/dist/components/sidebar/sidebar-toggle.js +0 -8
  382. package/dist/components/sidebar/sidebar-toggle.js.map +0 -1
  383. package/dist/components/sidebar/sidebar.context.js +0 -21
  384. package/dist/components/sidebar/sidebar.context.js.map +0 -1
  385. package/dist/components/sidebar/sidebar.shared.js +0 -12
  386. package/dist/components/sidebar/sidebar.shared.js.map +0 -1
  387. package/dist/components/skeleton/skeleton.a11y.d.ts +0 -16
  388. package/dist/components/spacer/index.d.ts +0 -3
  389. package/dist/components/spacer/spacer.a11y.d.ts +0 -17
  390. package/dist/components/spacer/spacer.d.ts +0 -8
  391. package/dist/components/spacer/spacer.js +0 -49
  392. package/dist/components/spacer/spacer.js.map +0 -1
  393. package/dist/components/spacer/spacer.types.d.ts +0 -26
  394. package/dist/components/stack/index.d.ts +0 -3
  395. package/dist/components/stack/stack.a11y.d.ts +0 -18
  396. package/dist/components/stack/stack.d.ts +0 -8
  397. package/dist/components/stack/stack.js +0 -16
  398. package/dist/components/stack/stack.js.map +0 -1
  399. package/dist/components/stack/stack.types.d.ts +0 -22
  400. package/dist/feedback.d.ts +0 -5
  401. package/dist/feedback.js +0 -4
  402. package/dist/layouts.d.ts +0 -25
  403. package/dist/layouts.js +0 -11
  404. package/dist/shells.d.ts +0 -16
  405. package/dist/shells.js +0 -11
  406. package/src/components/_internal/box-layout.ts +0 -164
  407. package/src/components/_internal/layout.ts +0 -202
  408. package/src/components/box/box.a11y.ts +0 -11
  409. package/src/components/box/box.tsx +0 -38
  410. package/src/components/box/box.types.ts +0 -76
  411. package/src/components/box/index.ts +0 -11
  412. package/src/components/breadcrumb/breadcrumb.a11y.ts +0 -15
  413. package/src/components/breadcrumb/breadcrumb.tsx +0 -123
  414. package/src/components/breadcrumb/breadcrumb.types.ts +0 -74
  415. package/src/components/breadcrumb/index.ts +0 -24
  416. package/src/components/flex/flex.a11y.ts +0 -19
  417. package/src/components/flex/flex.tsx +0 -162
  418. package/src/components/flex/flex.types.ts +0 -51
  419. package/src/components/flex/index.ts +0 -16
  420. package/src/components/inline/index.tsx +0 -28
  421. package/src/components/list-group/index.ts +0 -7
  422. package/src/components/list-group/list-group.tsx +0 -74
  423. package/src/components/list-group/list-group.types.ts +0 -32
  424. package/src/components/navbar/navbar-panel.tsx +0 -62
  425. package/src/components/navbar/navbar.context.ts +0 -22
  426. package/src/components/navbar/navbar.render.tsx +0 -32
  427. package/src/components/navbar/navbar.shared.ts +0 -21
  428. package/src/components/pagination/index.ts +0 -8
  429. package/src/components/pagination/pagination.tsx +0 -158
  430. package/src/components/pagination/pagination.types.ts +0 -41
  431. package/src/components/shell/index.ts +0 -16
  432. package/src/components/shell/shell-nav.types.ts +0 -3
  433. package/src/components/shell/shell-panel.tsx +0 -85
  434. package/src/components/shell/shell-responsive.tsx +0 -262
  435. package/src/components/shell/shell.a11y.ts +0 -20
  436. package/src/components/shell/shell.tsx +0 -74
  437. package/src/components/shell/shell.types.ts +0 -71
  438. package/src/components/sidebar/sidebar-panel.tsx +0 -67
  439. package/src/components/sidebar/sidebar-toggle.tsx +0 -5
  440. package/src/components/sidebar/sidebar.context.ts +0 -40
  441. package/src/components/sidebar/sidebar.shared.ts +0 -12
  442. package/src/components/spacer/index.ts +0 -9
  443. package/src/components/spacer/spacer.a11y.ts +0 -14
  444. package/src/components/spacer/spacer.tsx +0 -61
  445. package/src/components/spacer/spacer.types.ts +0 -31
  446. package/src/components/stack/index.ts +0 -3
  447. package/src/components/stack/stack.a11y.ts +0 -15
  448. package/src/components/stack/stack.tsx +0 -13
  449. package/src/components/stack/stack.types.ts +0 -22
  450. package/src/feedback.ts +0 -6
  451. package/src/layouts.ts +0 -19
  452. package/src/shells.ts +0 -13
  453. package/src/themes/default/styles/actions/toggle.css +0 -50
  454. package/src/themes/default/styles/disclosure/collapsible.css +0 -58
  455. package/src/themes/default/styles/display/list-group.css +0 -84
  456. package/src/themes/default/styles/forms/form.css +0 -5
  457. package/src/themes/default/styles/layout/responsive-layout.css +0 -230
  458. package/src/themes/default/styles/navigation/breadcrumb.css +0 -45
  459. package/src/themes/default/styles/navigation/menu.css +0 -203
  460. package/src/themes/default/styles/navigation/menubar.css +0 -255
  461. package/src/themes/default/styles/navigation/pagination.css +0 -91
  462. package/src/themes/default/styles/shell/theme.css +0 -37
  463. package/templates/theme/styles/actions/toggle.css +0 -50
  464. package/templates/theme/styles/disclosure/collapsible.css +0 -58
  465. package/templates/theme/styles/display/list-group.css +0 -84
  466. package/templates/theme/styles/forms/form.css +0 -5
  467. package/templates/theme/styles/layout/responsive-layout.css +0 -230
  468. package/templates/theme/styles/navigation/breadcrumb.css +0 -45
  469. package/templates/theme/styles/navigation/menu.css +0 -203
  470. package/templates/theme/styles/navigation/menubar.css +0 -255
  471. package/templates/theme/styles/navigation/pagination.css +0 -91
  472. package/templates/theme/styles/shell/theme.css +0 -37
package/templates/theme/styles/layout/layout.css CHANGED
@@ -1 +1,676 @@
1
- /* Layout primitive contract placeholders for generated themes. */
1
+ :where([data-ak-layout="true"]) {
2
+ --ak-display-base: flex;
3
+ --ak-display-sm: var(--ak-display-base);
4
+ --ak-display-md: var(--ak-display-sm);
5
+ --ak-display-lg: var(--ak-display-md);
6
+ --ak-display-xl: var(--ak-display-lg);
7
+ --ak-flex-direction-base: column;
8
+ --ak-flex-direction-sm: var(--ak-flex-direction-base);
9
+ --ak-flex-direction-md: var(--ak-flex-direction-sm);
10
+ --ak-flex-direction-lg: var(--ak-flex-direction-md);
11
+ --ak-flex-direction-xl: var(--ak-flex-direction-lg);
12
+ --ak-flex-wrap-base: nowrap;
13
+ --ak-flex-wrap-sm: var(--ak-flex-wrap-base);
14
+ --ak-align-items-base: stretch;
15
+ --ak-align-items-sm: var(--ak-align-items-base);
16
+ --ak-align-items-md: var(--ak-align-items-sm);
17
+ --ak-align-items-lg: var(--ak-align-items-md);
18
+ --ak-align-items-xl: var(--ak-align-items-lg);
19
+ --ak-justify-content-base: flex-start;
20
+ --ak-justify-content-sm: var(--ak-justify-content-base);
21
+ --ak-justify-content-md: var(--ak-justify-content-sm);
22
+ --ak-justify-content-lg: var(--ak-justify-content-md);
23
+ --ak-justify-content-xl: var(--ak-justify-content-lg);
24
+ --ak-gap-base: 0;
25
+ --ak-gap-sm: var(--ak-gap-base);
26
+ --ak-gap-md: var(--ak-gap-sm);
27
+ --ak-gap-lg: var(--ak-gap-md);
28
+ --ak-gap-xl: var(--ak-gap-lg);
29
+ --ak-flex-grow-base: 0;
30
+ --ak-flex-grow-sm: var(--ak-flex-grow-base);
31
+ --ak-flex-grow-md: var(--ak-flex-grow-sm);
32
+ --ak-flex-grow-lg: var(--ak-flex-grow-md);
33
+ --ak-flex-shrink-base: 1;
34
+ --ak-flex-shrink-sm: var(--ak-flex-shrink-base);
35
+ --ak-flex-shrink-md: var(--ak-flex-shrink-sm);
36
+ --ak-flex-shrink-lg: var(--ak-flex-shrink-md);
37
+ --ak-flex-basis-base: auto;
38
+ --ak-flex-basis-sm: var(--ak-flex-basis-base);
39
+ --ak-flex-basis-md: var(--ak-flex-basis-sm);
40
+ --ak-flex-basis-lg: var(--ak-flex-basis-md);
41
+ --ak-min-width-base: 0;
42
+ --ak-min-width-sm: var(--ak-min-width-base);
43
+ --ak-min-width-md: var(--ak-min-width-sm);
44
+ --ak-min-width-lg: var(--ak-min-width-md);
45
+ --ak-max-width-base: none;
46
+ --ak-max-width-sm: var(--ak-max-width-base);
47
+ --ak-max-width-md: var(--ak-max-width-sm);
48
+ --ak-max-width-lg: var(--ak-max-width-md);
49
+ --ak-width-base: auto;
50
+ --ak-width-sm: var(--ak-width-base);
51
+ --ak-width-md: var(--ak-width-sm);
52
+ --ak-width-lg: var(--ak-width-md);
53
+ --ak-min-height-base: auto;
54
+ --ak-min-height-sm: var(--ak-min-height-base);
55
+ --ak-min-height-md: var(--ak-min-height-sm);
56
+ --ak-min-height-lg: var(--ak-min-height-md);
57
+ --ak-max-height-base: none;
58
+ --ak-max-height-sm: var(--ak-max-height-base);
59
+ --ak-height-base: auto;
60
+ --ak-height-sm: var(--ak-height-base);
61
+ --ak-height-md: var(--ak-height-sm);
62
+ --ak-height-lg: var(--ak-height-md);
63
+ --ak-m-base: 0;
64
+ --ak-m-sm: var(--ak-m-base);
65
+ --ak-m-md: var(--ak-m-sm);
66
+ --ak-m-lg: var(--ak-m-md);
67
+ --ak-mx-base: var(--ak-m-base);
68
+ --ak-mx-sm: var(--ak-mx-base);
69
+ --ak-mx-md: var(--ak-mx-sm);
70
+ --ak-mx-lg: var(--ak-mx-md);
71
+ --ak-my-base: var(--ak-m-base);
72
+ --ak-my-sm: var(--ak-my-base);
73
+ --ak-my-md: var(--ak-my-sm);
74
+ --ak-my-lg: var(--ak-my-md);
75
+ --ak-p-base: 0;
76
+ --ak-p-sm: var(--ak-p-base);
77
+ --ak-p-md: var(--ak-p-sm);
78
+ --ak-p-lg: var(--ak-p-md);
79
+ --ak-px-base: var(--ak-p-base);
80
+ --ak-px-sm: var(--ak-px-base);
81
+ --ak-px-md: var(--ak-px-sm);
82
+ --ak-px-lg: var(--ak-px-md);
83
+ --ak-py-base: var(--ak-p-base);
84
+ --ak-py-sm: var(--ak-py-base);
85
+ --ak-py-md: var(--ak-py-sm);
86
+ --ak-py-lg: var(--ak-py-md);
87
+ --ak-position-base: static;
88
+ --ak-position-sm: var(--ak-position-base);
89
+ --ak-position-md: var(--ak-position-sm);
90
+ --ak-position-lg: var(--ak-position-md);
91
+ --ak-inset-base: auto;
92
+ --ak-inset-sm: var(--ak-inset-base);
93
+ --ak-top-base: auto;
94
+ --ak-top-sm: var(--ak-top-base);
95
+ --ak-top-md: var(--ak-top-sm);
96
+ --ak-top-lg: var(--ak-top-md);
97
+ --ak-right-base: auto;
98
+ --ak-right-sm: var(--ak-right-base);
99
+ --ak-bottom-base: auto;
100
+ --ak-bottom-sm: var(--ak-bottom-base);
101
+ --ak-left-base: auto;
102
+ --ak-left-sm: var(--ak-left-base);
103
+ --ak-z-index-base: auto;
104
+ --ak-z-index-sm: var(--ak-z-index-base);
105
+ --ak-z-index-md: var(--ak-z-index-sm);
106
+ --ak-z-index-lg: var(--ak-z-index-md);
107
+ --ak-overflow-base: visible;
108
+ --ak-overflow-sm: var(--ak-overflow-base);
109
+ --ak-overflow-x-base: var(--ak-overflow-base);
110
+ --ak-overflow-x-sm: var(--ak-overflow-x-base);
111
+ --ak-overflow-y-base: var(--ak-overflow-base);
112
+ --ak-overflow-y-sm: var(--ak-overflow-y-base);
113
+ --ak-border-base: 0 solid transparent;
114
+ --ak-border-sm: var(--ak-border-base);
115
+ --ak-border-md: var(--ak-border-sm);
116
+ --ak-border-lg: var(--ak-border-md);
117
+ --ak-border-bottom-base: var(--ak-border-base);
118
+ --ak-border-bottom-sm: var(--ak-border-bottom-base);
119
+ --ak-border-bottom-md: var(--ak-border-bottom-sm);
120
+ --ak-border-bottom-lg: var(--ak-border-bottom-md);
121
+ --ak-border-right-base: var(--ak-border-base);
122
+ --ak-border-right-sm: var(--ak-border-right-base);
123
+ --ak-border-right-md: var(--ak-border-right-sm);
124
+ --ak-border-right-lg: var(--ak-border-right-md);
125
+ --ak-border-radius-base: 0;
126
+ --ak-border-radius-sm: var(--ak-border-radius-base);
127
+ --ak-border-radius-md: var(--ak-border-radius-sm);
128
+ --ak-border-radius-lg: var(--ak-border-radius-md);
129
+ --ak-background-base: transparent;
130
+ --ak-background-sm: var(--ak-background-base);
131
+ --ak-background-md: var(--ak-background-sm);
132
+ --ak-background-lg: var(--ak-background-md);
133
+ --ak-box-shadow-base: none;
134
+ --ak-box-shadow-sm: var(--ak-box-shadow-base);
135
+ --ak-box-shadow-md: var(--ak-box-shadow-sm);
136
+ --ak-box-shadow-lg: var(--ak-box-shadow-md);
137
+
138
+ box-sizing: border-box;
139
+ display: var(--ak-display-base, flex);
140
+ flex-direction: var(--ak-flex-direction-base, column);
141
+ flex-wrap: var(--ak-flex-wrap-base, nowrap);
142
+ align-items: var(--ak-align-items-base, stretch);
143
+ justify-content: var(--ak-justify-content-base, flex-start);
144
+ gap: var(--ak-gap-base, 0);
145
+ flex-grow: var(--ak-flex-grow-base, 0);
146
+ flex-shrink: var(--ak-flex-shrink-base, 1);
147
+ flex-basis: var(--ak-flex-basis-base, auto);
148
+ min-width: var(--ak-min-width-base, 0);
149
+ max-width: var(--ak-max-width-base, none);
150
+ width: var(--ak-width-base, auto);
151
+ min-height: var(--ak-min-height-base, auto);
152
+ max-height: var(--ak-max-height-base, none);
153
+ height: var(--ak-height-base, auto);
154
+ margin: var(--ak-m-base, 0);
155
+ margin-inline: var(--ak-mx-base, var(--ak-m-base, 0));
156
+ margin-block: var(--ak-my-base, var(--ak-m-base, 0));
157
+ padding: var(--ak-p-base, 0);
158
+ padding-inline: var(--ak-px-base, var(--ak-p-base, 0));
159
+ padding-block: var(--ak-py-base, var(--ak-p-base, 0));
160
+ position: var(--ak-position-base, static);
161
+ inset: var(--ak-inset-base, auto);
162
+ top: var(--ak-top-base, auto);
163
+ right: var(--ak-right-base, auto);
164
+ bottom: var(--ak-bottom-base, auto);
165
+ left: var(--ak-left-base, auto);
166
+ z-index: var(--ak-z-index-base, auto);
167
+ overflow: var(--ak-overflow-base, visible);
168
+ overflow-x: var(--ak-overflow-x-base, var(--ak-overflow-base, visible));
169
+ overflow-y: var(--ak-overflow-y-base, var(--ak-overflow-base, visible));
170
+ border: var(--ak-border-base, 0 solid transparent);
171
+ border-bottom: var(--ak-border-bottom-base, var(--ak-border-base, 0 solid transparent));
172
+ border-right: var(--ak-border-right-base, var(--ak-border-base, 0 solid transparent));
173
+ border-radius: var(--ak-border-radius-base, 0);
174
+ background: var(--ak-background-base, transparent);
175
+ box-shadow: var(--ak-box-shadow-base, none);
176
+ }
177
+
178
+ @media (min-width: 40rem) {
179
+ :where([data-ak-layout="true"]) {
180
+ display: var(--ak-display-sm, var(--ak-display-base, flex));
181
+ flex-direction: var(--ak-flex-direction-sm, var(--ak-flex-direction-base, column));
182
+ flex-wrap: var(--ak-flex-wrap-sm, var(--ak-flex-wrap-base, nowrap));
183
+ align-items: var(--ak-align-items-sm, var(--ak-align-items-base, stretch));
184
+ justify-content: var(--ak-justify-content-sm, var(--ak-justify-content-base, flex-start));
185
+ gap: var(--ak-gap-sm, var(--ak-gap-base, 0));
186
+ flex-grow: var(--ak-flex-grow-sm, var(--ak-flex-grow-base, 0));
187
+ flex-shrink: var(--ak-flex-shrink-sm, var(--ak-flex-shrink-base, 1));
188
+ flex-basis: var(--ak-flex-basis-sm, var(--ak-flex-basis-base, auto));
189
+ min-width: var(--ak-min-width-sm, var(--ak-min-width-base, 0));
190
+ max-width: var(--ak-max-width-sm, var(--ak-max-width-base, none));
191
+ width: var(--ak-width-sm, var(--ak-width-base, auto));
192
+ min-height: var(--ak-min-height-sm, var(--ak-min-height-base, auto));
193
+ max-height: var(--ak-max-height-sm, var(--ak-max-height-base, none));
194
+ height: var(--ak-height-sm, var(--ak-height-base, auto));
195
+ margin: var(--ak-m-sm, var(--ak-m-base, 0));
196
+ margin-inline: var(--ak-mx-sm, var(--ak-mx-base, var(--ak-m-sm, var(--ak-m-base, 0))));
197
+ margin-block: var(--ak-my-sm, var(--ak-my-base, var(--ak-m-sm, var(--ak-m-base, 0))));
198
+ padding: var(--ak-p-sm, var(--ak-p-base, 0));
199
+ padding-inline: var(--ak-px-sm, var(--ak-px-base, var(--ak-p-sm, var(--ak-p-base, 0))));
200
+ padding-block: var(--ak-py-sm, var(--ak-py-base, var(--ak-p-sm, var(--ak-p-base, 0))));
201
+ position: var(--ak-position-sm, var(--ak-position-base, static));
202
+ inset: var(--ak-inset-sm, var(--ak-inset-base, auto));
203
+ top: var(--ak-top-sm, var(--ak-top-base, auto));
204
+ right: var(--ak-right-sm, var(--ak-right-base, auto));
205
+ bottom: var(--ak-bottom-sm, var(--ak-bottom-base, auto));
206
+ left: var(--ak-left-sm, var(--ak-left-base, auto));
207
+ z-index: var(--ak-z-index-sm, var(--ak-z-index-base, auto));
208
+ overflow: var(--ak-overflow-sm, var(--ak-overflow-base, visible));
209
+ overflow-x: var(
210
+ --ak-overflow-x-sm,
211
+ var(--ak-overflow-x-base, var(--ak-overflow-sm, var(--ak-overflow-base, visible)))
212
+ );
213
+ overflow-y: var(
214
+ --ak-overflow-y-sm,
215
+ var(--ak-overflow-y-base, var(--ak-overflow-sm, var(--ak-overflow-base, visible)))
216
+ );
217
+ border: var(--ak-border-sm, var(--ak-border-base, 0 solid transparent));
218
+ border-bottom: var(
219
+ --ak-border-bottom-sm,
220
+ var(--ak-border-bottom-base, var(--ak-border-sm, var(--ak-border-base, 0 solid transparent)))
221
+ );
222
+ border-right: var(
223
+ --ak-border-right-sm,
224
+ var(--ak-border-right-base, var(--ak-border-sm, var(--ak-border-base, 0 solid transparent)))
225
+ );
226
+ border-radius: var(--ak-border-radius-sm, var(--ak-border-radius-base, 0));
227
+ background: var(--ak-background-sm, var(--ak-background-base, transparent));
228
+ box-shadow: var(--ak-box-shadow-sm, var(--ak-box-shadow-base, none));
229
+ }
230
+ }
231
+
232
+ @media (min-width: 48rem) {
233
+ :where([data-ak-layout="true"]) {
234
+ display: var(--ak-display-md, var(--ak-display-sm, var(--ak-display-base, flex)));
235
+ flex-direction: var(
236
+ --ak-flex-direction-md,
237
+ var(--ak-flex-direction-sm, var(--ak-flex-direction-base, column))
238
+ );
239
+ align-items: var(
240
+ --ak-align-items-md,
241
+ var(--ak-align-items-sm, var(--ak-align-items-base, stretch))
242
+ );
243
+ justify-content: var(
244
+ --ak-justify-content-md,
245
+ var(--ak-justify-content-sm, var(--ak-justify-content-base, flex-start))
246
+ );
247
+ gap: var(--ak-gap-md, var(--ak-gap-sm, var(--ak-gap-base, 0)));
248
+ flex-grow: var(--ak-flex-grow-md, var(--ak-flex-grow-sm, var(--ak-flex-grow-base, 0)));
249
+ flex-shrink: var(--ak-flex-shrink-md, var(--ak-flex-shrink-sm, var(--ak-flex-shrink-base, 1)));
250
+ min-width: var(--ak-min-width-md, var(--ak-min-width-sm, var(--ak-min-width-base, 0)));
251
+ max-width: var(--ak-max-width-md, var(--ak-max-width-sm, var(--ak-max-width-base, none)));
252
+ width: var(--ak-width-md, var(--ak-width-sm, var(--ak-width-base, auto)));
253
+ min-height: var(--ak-min-height-md, var(--ak-min-height-sm, var(--ak-min-height-base, auto)));
254
+ height: var(--ak-height-md, var(--ak-height-sm, var(--ak-height-base, auto)));
255
+ margin: var(--ak-m-md, var(--ak-m-sm, var(--ak-m-base, 0)));
256
+ margin-inline: var(
257
+ --ak-mx-md,
258
+ var(--ak-mx-sm, var(--ak-mx-base, var(--ak-m-md, var(--ak-m-sm, var(--ak-m-base, 0)))))
259
+ );
260
+ margin-block: var(
261
+ --ak-my-md,
262
+ var(--ak-my-sm, var(--ak-my-base, var(--ak-m-md, var(--ak-m-sm, var(--ak-m-base, 0)))))
263
+ );
264
+ padding: var(--ak-p-md, var(--ak-p-sm, var(--ak-p-base, 0)));
265
+ padding-inline: var(
266
+ --ak-px-md,
267
+ var(--ak-px-sm, var(--ak-px-base, var(--ak-p-md, var(--ak-p-sm, var(--ak-p-base, 0)))))
268
+ );
269
+ padding-block: var(
270
+ --ak-py-md,
271
+ var(--ak-py-sm, var(--ak-py-base, var(--ak-p-md, var(--ak-p-sm, var(--ak-p-base, 0)))))
272
+ );
273
+ position: var(--ak-position-md, var(--ak-position-sm, var(--ak-position-base, static)));
274
+ top: var(--ak-top-md, var(--ak-top-sm, var(--ak-top-base, auto)));
275
+ z-index: var(--ak-z-index-md, var(--ak-z-index-sm, var(--ak-z-index-base, auto)));
276
+ border: var(--ak-border-md, var(--ak-border-sm, var(--ak-border-base, 0 solid transparent)));
277
+ border-bottom: var(
278
+ --ak-border-bottom-md,
279
+ var(
280
+ --ak-border-bottom-sm,
281
+ var(
282
+ --ak-border-bottom-base,
283
+ var(--ak-border-md, var(--ak-border-sm, var(--ak-border-base, 0 solid transparent)))
284
+ )
285
+ )
286
+ );
287
+ border-right: var(
288
+ --ak-border-right-md,
289
+ var(
290
+ --ak-border-right-sm,
291
+ var(
292
+ --ak-border-right-base,
293
+ var(--ak-border-md, var(--ak-border-sm, var(--ak-border-base, 0 solid transparent)))
294
+ )
295
+ )
296
+ );
297
+ border-radius: var(
298
+ --ak-border-radius-md,
299
+ var(--ak-border-radius-sm, var(--ak-border-radius-base, 0))
300
+ );
301
+ background: var(
302
+ --ak-background-md,
303
+ var(--ak-background-sm, var(--ak-background-base, transparent))
304
+ );
305
+ box-shadow: var(--ak-box-shadow-md, var(--ak-box-shadow-sm, var(--ak-box-shadow-base, none)));
306
+ }
307
+ }
308
+
309
+ @media (min-width: 64rem) {
310
+ :where([data-ak-layout="true"]) {
311
+ display: var(
312
+ --ak-display-lg,
313
+ var(--ak-display-md, var(--ak-display-sm, var(--ak-display-base, flex)))
314
+ );
315
+ flex-direction: var(
316
+ --ak-flex-direction-lg,
317
+ var(
318
+ --ak-flex-direction-md,
319
+ var(--ak-flex-direction-sm, var(--ak-flex-direction-base, column))
320
+ )
321
+ );
322
+ align-items: var(
323
+ --ak-align-items-lg,
324
+ var(--ak-align-items-md, var(--ak-align-items-sm, var(--ak-align-items-base, stretch)))
325
+ );
326
+ justify-content: var(
327
+ --ak-justify-content-lg,
328
+ var(
329
+ --ak-justify-content-md,
330
+ var(--ak-justify-content-sm, var(--ak-justify-content-base, flex-start))
331
+ )
332
+ );
333
+ gap: var(--ak-gap-lg, var(--ak-gap-md, var(--ak-gap-sm, var(--ak-gap-base, 0))));
334
+ flex-grow: var(
335
+ --ak-flex-grow-lg,
336
+ var(--ak-flex-grow-md, var(--ak-flex-grow-sm, var(--ak-flex-grow-base, 0)))
337
+ );
338
+ flex-shrink: var(
339
+ --ak-flex-shrink-lg,
340
+ var(--ak-flex-shrink-md, var(--ak-flex-shrink-sm, var(--ak-flex-shrink-base, 1)))
341
+ );
342
+ min-width: var(
343
+ --ak-min-width-lg,
344
+ var(--ak-min-width-md, var(--ak-min-width-sm, var(--ak-min-width-base, 0)))
345
+ );
346
+ max-width: var(
347
+ --ak-max-width-lg,
348
+ var(--ak-max-width-md, var(--ak-max-width-sm, var(--ak-max-width-base, none)))
349
+ );
350
+ width: var(--ak-width-lg, var(--ak-width-md, var(--ak-width-sm, var(--ak-width-base, auto))));
351
+ min-height: var(
352
+ --ak-min-height-lg,
353
+ var(--ak-min-height-md, var(--ak-min-height-sm, var(--ak-min-height-base, auto)))
354
+ );
355
+ height: var(
356
+ --ak-height-lg,
357
+ var(--ak-height-md, var(--ak-height-sm, var(--ak-height-base, auto)))
358
+ );
359
+ margin: var(--ak-m-lg, var(--ak-m-md, var(--ak-m-sm, var(--ak-m-base, 0))));
360
+ margin-inline: var(
361
+ --ak-mx-lg,
362
+ var(
363
+ --ak-mx-md,
364
+ var(
365
+ --ak-mx-sm,
366
+ var(--ak-mx-base, var(--ak-m-lg, var(--ak-m-md, var(--ak-m-sm, var(--ak-m-base, 0)))))
367
+ )
368
+ )
369
+ );
370
+ margin-block: var(
371
+ --ak-my-lg,
372
+ var(
373
+ --ak-my-md,
374
+ var(
375
+ --ak-my-sm,
376
+ var(--ak-my-base, var(--ak-m-lg, var(--ak-m-md, var(--ak-m-sm, var(--ak-m-base, 0)))))
377
+ )
378
+ )
379
+ );
380
+ padding: var(--ak-p-lg, var(--ak-p-md, var(--ak-p-sm, var(--ak-p-base, 0))));
381
+ padding-inline: var(
382
+ --ak-px-lg,
383
+ var(
384
+ --ak-px-md,
385
+ var(
386
+ --ak-px-sm,
387
+ var(--ak-px-base, var(--ak-p-lg, var(--ak-p-md, var(--ak-p-sm, var(--ak-p-base, 0)))))
388
+ )
389
+ )
390
+ );
391
+ padding-block: var(
392
+ --ak-py-lg,
393
+ var(
394
+ --ak-py-md,
395
+ var(
396
+ --ak-py-sm,
397
+ var(--ak-py-base, var(--ak-p-lg, var(--ak-p-md, var(--ak-p-sm, var(--ak-p-base, 0)))))
398
+ )
399
+ )
400
+ );
401
+ position: var(
402
+ --ak-position-lg,
403
+ var(--ak-position-md, var(--ak-position-sm, var(--ak-position-base, static)))
404
+ );
405
+ top: var(--ak-top-lg, var(--ak-top-md, var(--ak-top-sm, var(--ak-top-base, auto))));
406
+ z-index: var(
407
+ --ak-z-index-lg,
408
+ var(--ak-z-index-md, var(--ak-z-index-sm, var(--ak-z-index-base, auto)))
409
+ );
410
+ border: var(
411
+ --ak-border-lg,
412
+ var(--ak-border-md, var(--ak-border-sm, var(--ak-border-base, 0 solid transparent)))
413
+ );
414
+ border-bottom: var(
415
+ --ak-border-bottom-lg,
416
+ var(
417
+ --ak-border-bottom-md,
418
+ var(
419
+ --ak-border-bottom-sm,
420
+ var(
421
+ --ak-border-bottom-base,
422
+ var(
423
+ --ak-border-lg,
424
+ var(--ak-border-md, var(--ak-border-sm, var(--ak-border-base, 0 solid transparent)))
425
+ )
426
+ )
427
+ )
428
+ )
429
+ );
430
+ border-right: var(
431
+ --ak-border-right-lg,
432
+ var(
433
+ --ak-border-right-md,
434
+ var(
435
+ --ak-border-right-sm,
436
+ var(
437
+ --ak-border-right-base,
438
+ var(
439
+ --ak-border-lg,
440
+ var(--ak-border-md, var(--ak-border-sm, var(--ak-border-base, 0 solid transparent)))
441
+ )
442
+ )
443
+ )
444
+ )
445
+ );
446
+ border-radius: var(
447
+ --ak-border-radius-lg,
448
+ var(--ak-border-radius-md, var(--ak-border-radius-sm, var(--ak-border-radius-base, 0)))
449
+ );
450
+ background: var(
451
+ --ak-background-lg,
452
+ var(--ak-background-md, var(--ak-background-sm, var(--ak-background-base, transparent)))
453
+ );
454
+ box-shadow: var(
455
+ --ak-box-shadow-lg,
456
+ var(--ak-box-shadow-md, var(--ak-box-shadow-sm, var(--ak-box-shadow-base, none)))
457
+ );
458
+ }
459
+ }
460
+
461
+ @media (min-width: 80rem) {
462
+ :where([data-ak-layout="true"]) {
463
+ display: var(
464
+ --ak-display-xl,
465
+ var(--ak-display-lg, var(--ak-display-md, var(--ak-display-sm, var(--ak-display-base, flex))))
466
+ );
467
+ flex-direction: var(
468
+ --ak-flex-direction-xl,
469
+ var(
470
+ --ak-flex-direction-lg,
471
+ var(
472
+ --ak-flex-direction-md,
473
+ var(--ak-flex-direction-sm, var(--ak-flex-direction-base, column))
474
+ )
475
+ )
476
+ );
477
+ align-items: var(
478
+ --ak-align-items-xl,
479
+ var(
480
+ --ak-align-items-lg,
481
+ var(--ak-align-items-md, var(--ak-align-items-sm, var(--ak-align-items-base, stretch)))
482
+ )
483
+ );
484
+ justify-content: var(
485
+ --ak-justify-content-xl,
486
+ var(
487
+ --ak-justify-content-lg,
488
+ var(
489
+ --ak-justify-content-md,
490
+ var(--ak-justify-content-sm, var(--ak-justify-content-base, flex-start))
491
+ )
492
+ )
493
+ );
494
+ gap: var(
495
+ --ak-gap-xl,
496
+ var(--ak-gap-lg, var(--ak-gap-md, var(--ak-gap-sm, var(--ak-gap-base, 0))))
497
+ );
498
+ width: var(
499
+ --ak-width-xl,
500
+ var(--ak-width-lg, var(--ak-width-md, var(--ak-width-sm, var(--ak-width-base, auto))))
501
+ );
502
+ max-width: var(
503
+ --ak-max-width-xl,
504
+ var(
505
+ --ak-max-width-lg,
506
+ var(--ak-max-width-md, var(--ak-max-width-sm, var(--ak-max-width-base, none)))
507
+ )
508
+ );
509
+ min-height: var(
510
+ --ak-min-height-xl,
511
+ var(
512
+ --ak-min-height-lg,
513
+ var(--ak-min-height-md, var(--ak-min-height-sm, var(--ak-min-height-base, auto)))
514
+ )
515
+ );
516
+ margin: var(--ak-m-xl, var(--ak-m-lg, var(--ak-m-md, var(--ak-m-sm, var(--ak-m-base, 0)))));
517
+ margin-inline: var(
518
+ --ak-mx-xl,
519
+ var(
520
+ --ak-mx-lg,
521
+ var(
522
+ --ak-mx-md,
523
+ var(
524
+ --ak-mx-sm,
525
+ var(
526
+ --ak-mx-base,
527
+ var(--ak-m-xl, var(--ak-m-lg, var(--ak-m-md, var(--ak-m-sm, var(--ak-m-base, 0)))))
528
+ )
529
+ )
530
+ )
531
+ )
532
+ );
533
+ margin-block: var(
534
+ --ak-my-xl,
535
+ var(
536
+ --ak-my-lg,
537
+ var(
538
+ --ak-my-md,
539
+ var(
540
+ --ak-my-sm,
541
+ var(
542
+ --ak-my-base,
543
+ var(--ak-m-xl, var(--ak-m-lg, var(--ak-m-md, var(--ak-m-sm, var(--ak-m-base, 0)))))
544
+ )
545
+ )
546
+ )
547
+ )
548
+ );
549
+ padding: var(--ak-p-xl, var(--ak-p-lg, var(--ak-p-md, var(--ak-p-sm, var(--ak-p-base, 0)))));
550
+ padding-inline: var(
551
+ --ak-px-xl,
552
+ var(
553
+ --ak-px-lg,
554
+ var(
555
+ --ak-px-md,
556
+ var(
557
+ --ak-px-sm,
558
+ var(
559
+ --ak-px-base,
560
+ var(--ak-p-xl, var(--ak-p-lg, var(--ak-p-md, var(--ak-p-sm, var(--ak-p-base, 0)))))
561
+ )
562
+ )
563
+ )
564
+ )
565
+ );
566
+ padding-block: var(
567
+ --ak-py-xl,
568
+ var(
569
+ --ak-py-lg,
570
+ var(
571
+ --ak-py-md,
572
+ var(
573
+ --ak-py-sm,
574
+ var(
575
+ --ak-py-base,
576
+ var(--ak-p-xl, var(--ak-p-lg, var(--ak-p-md, var(--ak-p-sm, var(--ak-p-base, 0)))))
577
+ )
578
+ )
579
+ )
580
+ )
581
+ );
582
+ position: var(
583
+ --ak-position-xl,
584
+ var(
585
+ --ak-position-lg,
586
+ var(--ak-position-md, var(--ak-position-sm, var(--ak-position-base, static)))
587
+ )
588
+ );
589
+ top: var(
590
+ --ak-top-xl,
591
+ var(--ak-top-lg, var(--ak-top-md, var(--ak-top-sm, var(--ak-top-base, auto))))
592
+ );
593
+ z-index: var(
594
+ --ak-z-index-xl,
595
+ var(--ak-z-index-lg, var(--ak-z-index-md, var(--ak-z-index-sm, var(--ak-z-index-base, auto))))
596
+ );
597
+ border: var(
598
+ --ak-border-xl,
599
+ var(
600
+ --ak-border-lg,
601
+ var(--ak-border-md, var(--ak-border-sm, var(--ak-border-base, 0 solid transparent)))
602
+ )
603
+ );
604
+ border-bottom: var(
605
+ --ak-border-bottom-xl,
606
+ var(
607
+ --ak-border-bottom-lg,
608
+ var(
609
+ --ak-border-bottom-md,
610
+ var(
611
+ --ak-border-bottom-sm,
612
+ var(
613
+ --ak-border-bottom-base,
614
+ var(
615
+ --ak-border-xl,
616
+ var(
617
+ --ak-border-lg,
618
+ var(
619
+ --ak-border-md,
620
+ var(--ak-border-sm, var(--ak-border-base, 0 solid transparent))
621
+ )
622
+ )
623
+ )
624
+ )
625
+ )
626
+ )
627
+ )
628
+ );
629
+ border-right: var(
630
+ --ak-border-right-xl,
631
+ var(
632
+ --ak-border-right-lg,
633
+ var(
634
+ --ak-border-right-md,
635
+ var(
636
+ --ak-border-right-sm,
637
+ var(
638
+ --ak-border-right-base,
639
+ var(
640
+ --ak-border-xl,
641
+ var(
642
+ --ak-border-lg,
643
+ var(
644
+ --ak-border-md,
645
+ var(--ak-border-sm, var(--ak-border-base, 0 solid transparent))
646
+ )
647
+ )
648
+ )
649
+ )
650
+ )
651
+ )
652
+ )
653
+ );
654
+ border-radius: var(
655
+ --ak-border-radius-xl,
656
+ var(
657
+ --ak-border-radius-lg,
658
+ var(--ak-border-radius-md, var(--ak-border-radius-sm, var(--ak-border-radius-base, 0)))
659
+ )
660
+ );
661
+ background: var(
662
+ --ak-background-xl,
663
+ var(
664
+ --ak-background-lg,
665
+ var(--ak-background-md, var(--ak-background-sm, var(--ak-background-base, transparent)))
666
+ )
667
+ );
668
+ box-shadow: var(
669
+ --ak-box-shadow-xl,
670
+ var(
671
+ --ak-box-shadow-lg,
672
+ var(--ak-box-shadow-md, var(--ak-box-shadow-sm, var(--ak-box-shadow-base, none)))
673
+ )
674
+ );
675
+ }
676
+ }