aeico-components 0.1.7 → 0.1.8

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 (349) hide show
  1. package/dist/alert.cjs +637 -4
  2. package/dist/alert.cjs.map +7 -1
  3. package/dist/alert.js +575 -3
  4. package/dist/alert.js.map +7 -1
  5. package/dist/badge.cjs +573 -4
  6. package/dist/badge.cjs.map +7 -1
  7. package/dist/badge.js +510 -3
  8. package/dist/badge.js.map +7 -1
  9. package/dist/breadcrumb.cjs +709 -5
  10. package/dist/breadcrumb.cjs.map +7 -1
  11. package/dist/breadcrumb.js +644 -4
  12. package/dist/breadcrumb.js.map +7 -1
  13. package/dist/button-group.cjs +546 -4
  14. package/dist/button-group.cjs.map +7 -1
  15. package/dist/button-group.js +489 -3
  16. package/dist/button-group.js.map +7 -1
  17. package/dist/button.cjs +834 -4
  18. package/dist/button.cjs.map +7 -1
  19. package/dist/button.js +771 -3
  20. package/dist/button.js.map +7 -1
  21. package/dist/card.cjs +574 -4
  22. package/dist/card.cjs.map +7 -1
  23. package/dist/card.js +516 -3
  24. package/dist/card.js.map +7 -1
  25. package/dist/checkbox.cjs +867 -4
  26. package/dist/checkbox.cjs.map +7 -1
  27. package/dist/checkbox.js +794 -3
  28. package/dist/checkbox.js.map +7 -1
  29. package/dist/copy-button.cjs +1046 -4
  30. package/dist/copy-button.cjs.map +7 -1
  31. package/dist/copy-button.js +969 -3
  32. package/dist/copy-button.js.map +7 -1
  33. package/dist/detail-group.cjs +531 -4
  34. package/dist/detail-group.cjs.map +7 -1
  35. package/dist/detail-group.js +474 -3
  36. package/dist/detail-group.js.map +7 -1
  37. package/dist/detail.cjs +627 -4
  38. package/dist/detail.cjs.map +7 -1
  39. package/dist/detail.js +569 -3
  40. package/dist/detail.js.map +7 -1
  41. package/dist/dialog.cjs +738 -4
  42. package/dist/dialog.cjs.map +7 -1
  43. package/dist/dialog.js +665 -3
  44. package/dist/dialog.js.map +7 -1
  45. package/dist/divider.cjs +558 -4
  46. package/dist/divider.cjs.map +7 -1
  47. package/dist/divider.js +502 -3
  48. package/dist/divider.js.map +7 -1
  49. package/dist/drawer.cjs +818 -4
  50. package/dist/drawer.cjs.map +7 -1
  51. package/dist/drawer.js +749 -3
  52. package/dist/drawer.js.map +7 -1
  53. package/dist/dropdown.cjs +1396 -5
  54. package/dist/dropdown.cjs.map +7 -1
  55. package/dist/dropdown.js +1316 -4
  56. package/dist/dropdown.js.map +7 -1
  57. package/dist/icon-button.cjs +999 -4
  58. package/dist/icon-button.cjs.map +7 -1
  59. package/dist/icon-button.js +930 -3
  60. package/dist/icon-button.js.map +7 -1
  61. package/dist/icon.cjs +613 -4
  62. package/dist/icon.cjs.map +7 -1
  63. package/dist/icon.js +547 -3
  64. package/dist/icon.js.map +7 -1
  65. package/dist/index.cjs +6532 -74
  66. package/dist/index.cjs.map +7 -1
  67. package/dist/index.js +6183 -73
  68. package/dist/index.js.map +7 -1
  69. package/dist/menu.cjs +841 -4
  70. package/dist/menu.cjs.map +7 -1
  71. package/dist/menu.js +785 -3
  72. package/dist/menu.js.map +7 -1
  73. package/dist/navbar.cjs +622 -4
  74. package/dist/navbar.cjs.map +7 -1
  75. package/dist/navbar.js +564 -3
  76. package/dist/navbar.js.map +7 -1
  77. package/dist/number-input.cjs +885 -4
  78. package/dist/number-input.cjs.map +7 -1
  79. package/dist/number-input.js +817 -3
  80. package/dist/number-input.js.map +7 -1
  81. package/dist/pagination.cjs +1099 -4
  82. package/dist/pagination.cjs.map +7 -1
  83. package/dist/pagination.js +1029 -3
  84. package/dist/pagination.js.map +7 -1
  85. package/dist/progress-bar.cjs +581 -4
  86. package/dist/progress-bar.cjs.map +7 -1
  87. package/dist/progress-bar.js +525 -3
  88. package/dist/progress-bar.js.map +7 -1
  89. package/dist/radio-group.cjs +973 -5
  90. package/dist/radio-group.cjs.map +7 -1
  91. package/dist/radio-group.js +899 -4
  92. package/dist/radio-group.js.map +7 -1
  93. package/dist/select.cjs +1242 -45
  94. package/dist/select.cjs.map +7 -1
  95. package/dist/select.js +1159 -44
  96. package/dist/select.js.map +7 -1
  97. package/dist/slider.cjs +1420 -4
  98. package/dist/slider.cjs.map +7 -1
  99. package/dist/slider.js +1351 -3
  100. package/dist/slider.js.map +7 -1
  101. package/dist/spinner.cjs +587 -4
  102. package/dist/spinner.cjs.map +7 -1
  103. package/dist/spinner.js +528 -3
  104. package/dist/spinner.js.map +7 -1
  105. package/dist/styles/layout.cjs +1 -0
  106. package/dist/styles/layout.js +1 -0
  107. package/dist/styles/radius.cjs +1 -0
  108. package/dist/styles/radius.js +1 -0
  109. package/dist/styles/variables.cjs +1 -0
  110. package/dist/styles/variables.js +1 -0
  111. package/dist/switch.cjs +1092 -4
  112. package/dist/switch.cjs.map +7 -1
  113. package/dist/switch.js +1013 -3
  114. package/dist/switch.js.map +7 -1
  115. package/dist/tabs.cjs +660 -6
  116. package/dist/tabs.cjs.map +7 -1
  117. package/dist/tabs.js +591 -5
  118. package/dist/tabs.js.map +7 -1
  119. package/dist/tag.cjs +591 -3
  120. package/dist/tag.cjs.map +7 -1
  121. package/dist/tag.js +532 -2
  122. package/dist/tag.js.map +7 -1
  123. package/dist/text-input.cjs +829 -4
  124. package/dist/text-input.cjs.map +7 -1
  125. package/dist/text-input.js +761 -3
  126. package/dist/text-input.js.map +7 -1
  127. package/dist/textarea.cjs +914 -3
  128. package/dist/textarea.cjs.map +7 -1
  129. package/dist/textarea.js +854 -2
  130. package/dist/textarea.js.map +7 -1
  131. package/dist/tooltip.cjs +764 -4
  132. package/dist/tooltip.cjs.map +7 -1
  133. package/dist/tooltip.js +711 -3
  134. package/dist/tooltip.js.map +7 -1
  135. package/dist/tree.cjs +1059 -4
  136. package/dist/tree.cjs.map +7 -1
  137. package/dist/tree.js +985 -3
  138. package/dist/tree.js.map +7 -1
  139. package/dist/types/dialog/dialog.d.ts +1 -0
  140. package/dist/types/drawer/drawer.d.ts +2 -0
  141. package/dist/types/icon/defines.d.ts +2 -0
  142. package/dist/types/menu/defines.d.ts +1 -0
  143. package/dist/types/menu/menu-item.d.ts +1 -0
  144. package/dist/types/menu/menu.d.ts +1 -0
  145. package/dist/types/styles/layout.d.ts +2 -0
  146. package/dist/types/styles/radius.d.ts +2 -0
  147. package/dist/types/styles/variables.d.ts +2 -0
  148. package/package.json +31 -7
  149. package/src/alert/alert.ts +3 -3
  150. package/src/badge/badge.ts +4 -4
  151. package/src/breadcrumb/breadcrumb-item.ts +2 -2
  152. package/src/breadcrumb/breadcrumb.ts +3 -3
  153. package/src/button/button.ts +4 -4
  154. package/src/button-group/button-group.ts +8 -9
  155. package/src/card/card.ts +3 -3
  156. package/src/checkbox/checkbox.ts +6 -6
  157. package/src/copy-button/copy-button.ts +4 -4
  158. package/src/detail/detail.ts +3 -3
  159. package/src/detail-group/detail-group.ts +2 -2
  160. package/src/dialog/dialog.ts +15 -14
  161. package/src/divider/divider.ts +3 -3
  162. package/src/drawer/drawer.ts +28 -11
  163. package/src/dropdown/dropdown-item.ts +2 -2
  164. package/src/dropdown/dropdown.ts +2 -2
  165. package/src/icon/defines.ts +2 -0
  166. package/src/icon/icon.ts +4 -4
  167. package/src/menu/defines.ts +1 -0
  168. package/src/menu/menu-item.ts +14 -4
  169. package/src/menu/menu.ts +5 -2
  170. package/src/navbar/navbar.ts +3 -3
  171. package/src/number-input/number-input.ts +5 -5
  172. package/src/pagination/pagination.ts +3 -3
  173. package/src/progress-bar/progress-bar.ts +3 -3
  174. package/src/radio-group/radio-group.ts +12 -8
  175. package/src/select/select-option.ts +2 -2
  176. package/src/select/select.ts +5 -5
  177. package/src/slider/slider.ts +6 -6
  178. package/src/spinner/spinner.ts +4 -4
  179. package/src/styles/components/button-group.css +2 -0
  180. package/src/styles/components/card.css +42 -18
  181. package/src/styles/components/checkbox.css +16 -5
  182. package/src/styles/components/dialog.css +1 -1
  183. package/src/styles/components/drawer.css +50 -9
  184. package/src/styles/components/field-label.css +1 -1
  185. package/src/styles/components/menu-item.css +6 -0
  186. package/src/styles/components/navbar.css +7 -28
  187. package/src/styles/components/radio-group.css +19 -0
  188. package/src/styles/components/slider.css +30 -5
  189. package/src/styles/components/switch.css +16 -2
  190. package/src/styles/layout.css +5 -2
  191. package/src/styles/radius.css +15 -0
  192. package/src/switch/switch.ts +6 -6
  193. package/src/tabs/tab-panel.ts +1 -1
  194. package/src/tabs/tab.ts +1 -1
  195. package/src/tabs/tabs.ts +2 -2
  196. package/src/tag/tag.ts +4 -4
  197. package/src/text-input/text-input.ts +5 -5
  198. package/src/textarea/textarea.ts +5 -5
  199. package/src/tooltip/tooltip.ts +2 -2
  200. package/src/tree/tree-item.ts +2 -2
  201. package/src/tree/tree.ts +2 -2
  202. package/dist/chunks/action-button.cjs +0 -296
  203. package/dist/chunks/action-button.cjs.map +0 -1
  204. package/dist/chunks/action-button.js +0 -297
  205. package/dist/chunks/action-button.js.map +0 -1
  206. package/dist/chunks/aeico-component.cjs +0 -17
  207. package/dist/chunks/aeico-component.cjs.map +0 -1
  208. package/dist/chunks/aeico-component.js +0 -18
  209. package/dist/chunks/aeico-component.js.map +0 -1
  210. package/dist/chunks/alert.cjs +0 -164
  211. package/dist/chunks/alert.cjs.map +0 -1
  212. package/dist/chunks/alert.js +0 -165
  213. package/dist/chunks/alert.js.map +0 -1
  214. package/dist/chunks/badge.cjs +0 -85
  215. package/dist/chunks/badge.cjs.map +0 -1
  216. package/dist/chunks/badge.js +0 -86
  217. package/dist/chunks/badge.js.map +0 -1
  218. package/dist/chunks/breadcrumb-item.cjs +0 -261
  219. package/dist/chunks/breadcrumb-item.cjs.map +0 -1
  220. package/dist/chunks/breadcrumb-item.js +0 -262
  221. package/dist/chunks/breadcrumb-item.js.map +0 -1
  222. package/dist/chunks/button-group.cjs +0 -79
  223. package/dist/chunks/button-group.cjs.map +0 -1
  224. package/dist/chunks/button-group.js +0 -80
  225. package/dist/chunks/button-group.js.map +0 -1
  226. package/dist/chunks/button.cjs +0 -337
  227. package/dist/chunks/button.cjs.map +0 -1
  228. package/dist/chunks/button.js +0 -338
  229. package/dist/chunks/button.js.map +0 -1
  230. package/dist/chunks/card.cjs +0 -93
  231. package/dist/chunks/card.cjs.map +0 -1
  232. package/dist/chunks/card.js +0 -94
  233. package/dist/chunks/card.js.map +0 -1
  234. package/dist/chunks/checkbox.cjs +0 -86
  235. package/dist/chunks/checkbox.cjs.map +0 -1
  236. package/dist/chunks/checkbox.js +0 -87
  237. package/dist/chunks/checkbox.js.map +0 -1
  238. package/dist/chunks/color.cjs +0 -4
  239. package/dist/chunks/color.cjs.map +0 -1
  240. package/dist/chunks/color.js +0 -5
  241. package/dist/chunks/color.js.map +0 -1
  242. package/dist/chunks/copy-button.cjs +0 -171
  243. package/dist/chunks/copy-button.cjs.map +0 -1
  244. package/dist/chunks/copy-button.js +0 -172
  245. package/dist/chunks/copy-button.js.map +0 -1
  246. package/dist/chunks/detail-group.cjs +0 -65
  247. package/dist/chunks/detail-group.cjs.map +0 -1
  248. package/dist/chunks/detail-group.js +0 -66
  249. package/dist/chunks/detail-group.js.map +0 -1
  250. package/dist/chunks/detail.cjs +0 -146
  251. package/dist/chunks/detail.cjs.map +0 -1
  252. package/dist/chunks/detail.js +0 -147
  253. package/dist/chunks/detail.js.map +0 -1
  254. package/dist/chunks/dialog.cjs +0 -117
  255. package/dist/chunks/dialog.cjs.map +0 -1
  256. package/dist/chunks/dialog.js +0 -118
  257. package/dist/chunks/dialog.js.map +0 -1
  258. package/dist/chunks/divider.cjs +0 -80
  259. package/dist/chunks/divider.cjs.map +0 -1
  260. package/dist/chunks/divider.js +0 -81
  261. package/dist/chunks/divider.js.map +0 -1
  262. package/dist/chunks/drawer.cjs +0 -180
  263. package/dist/chunks/drawer.cjs.map +0 -1
  264. package/dist/chunks/drawer.js +0 -181
  265. package/dist/chunks/drawer.js.map +0 -1
  266. package/dist/chunks/dropdown-button.cjs +0 -533
  267. package/dist/chunks/dropdown-button.cjs.map +0 -1
  268. package/dist/chunks/dropdown-button.js +0 -534
  269. package/dist/chunks/dropdown-button.js.map +0 -1
  270. package/dist/chunks/icon-button.cjs +0 -35
  271. package/dist/chunks/icon-button.cjs.map +0 -1
  272. package/dist/chunks/icon-button.js +0 -36
  273. package/dist/chunks/icon-button.js.map +0 -1
  274. package/dist/chunks/icon.cjs +0 -124
  275. package/dist/chunks/icon.cjs.map +0 -1
  276. package/dist/chunks/icon.js +0 -125
  277. package/dist/chunks/icon.js.map +0 -1
  278. package/dist/chunks/menu.cjs +0 -396
  279. package/dist/chunks/menu.cjs.map +0 -1
  280. package/dist/chunks/menu.js +0 -397
  281. package/dist/chunks/menu.js.map +0 -1
  282. package/dist/chunks/navbar.cjs +0 -142
  283. package/dist/chunks/navbar.cjs.map +0 -1
  284. package/dist/chunks/navbar.js +0 -143
  285. package/dist/chunks/navbar.js.map +0 -1
  286. package/dist/chunks/number-input.cjs +0 -110
  287. package/dist/chunks/number-input.cjs.map +0 -1
  288. package/dist/chunks/number-input.js +0 -111
  289. package/dist/chunks/number-input.js.map +0 -1
  290. package/dist/chunks/pagination.cjs +0 -475
  291. package/dist/chunks/pagination.cjs.map +0 -1
  292. package/dist/chunks/pagination.js +0 -476
  293. package/dist/chunks/pagination.js.map +0 -1
  294. package/dist/chunks/progress-bar.cjs +0 -101
  295. package/dist/chunks/progress-bar.cjs.map +0 -1
  296. package/dist/chunks/progress-bar.js +0 -102
  297. package/dist/chunks/progress-bar.js.map +0 -1
  298. package/dist/chunks/radio.cjs +0 -185
  299. package/dist/chunks/radio.cjs.map +0 -1
  300. package/dist/chunks/radio.js +0 -186
  301. package/dist/chunks/radio.js.map +0 -1
  302. package/dist/chunks/select.cjs +0 -381
  303. package/dist/chunks/select.cjs.map +0 -1
  304. package/dist/chunks/select.js +0 -382
  305. package/dist/chunks/select.js.map +0 -1
  306. package/dist/chunks/size.cjs +0 -4
  307. package/dist/chunks/size.cjs.map +0 -1
  308. package/dist/chunks/size.js +0 -5
  309. package/dist/chunks/size.js.map +0 -1
  310. package/dist/chunks/slider.cjs +0 -608
  311. package/dist/chunks/slider.cjs.map +0 -1
  312. package/dist/chunks/slider.js +0 -609
  313. package/dist/chunks/slider.js.map +0 -1
  314. package/dist/chunks/spinner.cjs +0 -102
  315. package/dist/chunks/spinner.cjs.map +0 -1
  316. package/dist/chunks/spinner.js +0 -103
  317. package/dist/chunks/spinner.js.map +0 -1
  318. package/dist/chunks/switch.cjs +0 -167
  319. package/dist/chunks/switch.cjs.map +0 -1
  320. package/dist/chunks/switch.js +0 -168
  321. package/dist/chunks/switch.js.map +0 -1
  322. package/dist/chunks/tab-panel.cjs +0 -174
  323. package/dist/chunks/tab-panel.cjs.map +0 -1
  324. package/dist/chunks/tab-panel.js +0 -175
  325. package/dist/chunks/tab-panel.js.map +0 -1
  326. package/dist/chunks/tag.cjs +0 -108
  327. package/dist/chunks/tag.cjs.map +0 -1
  328. package/dist/chunks/tag.js +0 -109
  329. package/dist/chunks/tag.js.map +0 -1
  330. package/dist/chunks/text-input.cjs +0 -54
  331. package/dist/chunks/text-input.cjs.map +0 -1
  332. package/dist/chunks/text-input.js +0 -55
  333. package/dist/chunks/text-input.js.map +0 -1
  334. package/dist/chunks/textarea.cjs +0 -137
  335. package/dist/chunks/textarea.cjs.map +0 -1
  336. package/dist/chunks/textarea.js +0 -138
  337. package/dist/chunks/textarea.js.map +0 -1
  338. package/dist/chunks/tooltip.cjs +0 -292
  339. package/dist/chunks/tooltip.cjs.map +0 -1
  340. package/dist/chunks/tooltip.js +0 -293
  341. package/dist/chunks/tooltip.js.map +0 -1
  342. package/dist/chunks/tree.cjs +0 -468
  343. package/dist/chunks/tree.cjs.map +0 -1
  344. package/dist/chunks/tree.js +0 -469
  345. package/dist/chunks/tree.js.map +0 -1
  346. package/dist/chunks/variables.cjs +0 -396
  347. package/dist/chunks/variables.cjs.map +0 -1
  348. package/dist/chunks/variables.js +0 -397
  349. package/dist/chunks/variables.js.map +0 -1
@@ -1,397 +0,0 @@
1
- const variables = `:root,
2
- :host {
3
- --ae-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
4
- "Noto Sans", "Liberation Sans", Arial, sans-serif,
5
- "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
6
- --ae-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas,
7
- "Liberation Mono", "Courier New", monospace;
8
- font-family: var(--ae-font-sans-serif);
9
- --ae-blue: #0e639c;
10
- --ae-green: #28a745;
11
- --ae-red: #dc3545;
12
- --ae-yellow: #ffc107;
13
- --ae-cyan: #17a2b8;
14
- --ae-gray: #6e6e6e;
15
- --ae-slate: #64748b;
16
- --ae-dark: #343a40;
17
- --ae-light: #f8f9fa;
18
- }
19
-
20
- :root,
21
- :host {
22
- /* Blue */
23
- --ae-blue-100: color-mix(in srgb, var(--ae-blue) 20%, white);
24
- --ae-blue-200: color-mix(in srgb, var(--ae-blue) 40%, white);
25
- --ae-blue-300: color-mix(in srgb, var(--ae-blue) 60%, white);
26
- --ae-blue-400: color-mix(in srgb, var(--ae-blue) 80%, white);
27
- --ae-blue-500: var(--ae-blue);
28
- --ae-blue-600: color-mix(in srgb, var(--ae-blue) 80%, black);
29
- --ae-blue-700: color-mix(in srgb, var(--ae-blue) 60%, black);
30
- --ae-blue-800: color-mix(in srgb, var(--ae-blue) 40%, black);
31
- --ae-blue-900: color-mix(in srgb, var(--ae-blue) 20%, black);
32
-
33
- /* Green */
34
- --ae-green-100: color-mix(in srgb, var(--ae-green) 20%, white);
35
- --ae-green-200: color-mix(in srgb, var(--ae-green) 40%, white);
36
- --ae-green-300: color-mix(in srgb, var(--ae-green) 60%, white);
37
- --ae-green-400: color-mix(in srgb, var(--ae-green) 80%, white);
38
- --ae-green-500: var(--ae-green);
39
- --ae-green-600: color-mix(in srgb, var(--ae-green) 80%, black);
40
- --ae-green-700: color-mix(in srgb, var(--ae-green) 60%, black);
41
- --ae-green-800: color-mix(in srgb, var(--ae-green) 40%, black);
42
- --ae-green-900: color-mix(in srgb, var(--ae-green) 20%, black);
43
-
44
- /* Red */
45
- --ae-red-100: color-mix(in srgb, var(--ae-red) 20%, white);
46
- --ae-red-200: color-mix(in srgb, var(--ae-red) 40%, white);
47
- --ae-red-300: color-mix(in srgb, var(--ae-red) 60%, white);
48
- --ae-red-400: color-mix(in srgb, var(--ae-red) 80%, white);
49
- --ae-red-500: var(--ae-red);
50
- --ae-red-600: color-mix(in srgb, var(--ae-red) 80%, black);
51
- --ae-red-700: color-mix(in srgb, var(--ae-red) 60%, black);
52
- --ae-red-800: color-mix(in srgb, var(--ae-red) 40%, black);
53
- --ae-red-900: color-mix(in srgb, var(--ae-red) 20%, black);
54
-
55
- /* Yellow */
56
- --ae-yellow-100: color-mix(in srgb, var(--ae-yellow) 20%, white);
57
- --ae-yellow-200: color-mix(in srgb, var(--ae-yellow) 40%, white);
58
- --ae-yellow-300: color-mix(in srgb, var(--ae-yellow) 60%, white);
59
- --ae-yellow-400: color-mix(in srgb, var(--ae-yellow) 80%, white);
60
- --ae-yellow-500: var(--ae-yellow);
61
- --ae-yellow-600: color-mix(in srgb, var(--ae-yellow) 80%, black);
62
- --ae-yellow-700: color-mix(in srgb, var(--ae-yellow) 60%, black);
63
- --ae-yellow-800: color-mix(in srgb, var(--ae-yellow) 40%, black);
64
- --ae-yellow-900: color-mix(in srgb, var(--ae-yellow) 20%, black);
65
-
66
- /* Cyan */
67
- --ae-cyan-100: color-mix(in srgb, var(--ae-cyan) 20%, white);
68
- --ae-cyan-200: color-mix(in srgb, var(--ae-cyan) 40%, white);
69
- --ae-cyan-300: color-mix(in srgb, var(--ae-cyan) 60%, white);
70
- --ae-cyan-400: color-mix(in srgb, var(--ae-cyan) 80%, white);
71
- --ae-cyan-500: var(--ae-cyan);
72
- --ae-cyan-600: color-mix(in srgb, var(--ae-cyan) 80%, black);
73
- --ae-cyan-700: color-mix(in srgb, var(--ae-cyan) 60%, black);
74
- --ae-cyan-800: color-mix(in srgb, var(--ae-cyan) 40%, black);
75
- --ae-cyan-900: color-mix(in srgb, var(--ae-cyan) 20%, black);
76
-
77
- /* Gray (neutral — base #6e6e6e) */
78
- --ae-gray-100: color-mix(in srgb, var(--ae-gray) 20%, white);
79
- --ae-gray-200: color-mix(in srgb, var(--ae-gray) 40%, white);
80
- --ae-gray-300: color-mix(in srgb, var(--ae-gray) 60%, white);
81
- --ae-gray-400: color-mix(in srgb, var(--ae-gray) 80%, white);
82
- --ae-gray-500: var(--ae-gray);
83
- --ae-gray-600: color-mix(in srgb, var(--ae-gray) 80%, black);
84
- --ae-gray-700: color-mix(in srgb, var(--ae-gray) 60%, black);
85
- --ae-gray-800: color-mix(in srgb, var(--ae-gray) 40%, black);
86
- --ae-gray-900: color-mix(in srgb, var(--ae-gray) 20%, black);
87
-
88
- /* Slate (blue-gray — base #64748b, used for 'secondary') */
89
- --ae-slate-100: color-mix(in srgb, var(--ae-slate) 20%, white);
90
- --ae-slate-200: color-mix(in srgb, var(--ae-slate) 40%, white);
91
- --ae-slate-300: color-mix(in srgb, var(--ae-slate) 60%, white);
92
- --ae-slate-400: color-mix(in srgb, var(--ae-slate) 80%, white);
93
- --ae-slate-500: var(--ae-slate);
94
- --ae-slate-600: color-mix(in srgb, var(--ae-slate) 80%, black);
95
- --ae-slate-700: color-mix(in srgb, var(--ae-slate) 60%, black);
96
- --ae-slate-800: color-mix(in srgb, var(--ae-slate) 40%, black);
97
- --ae-slate-900: color-mix(in srgb, var(--ae-slate) 20%, black);
98
-
99
- /* Dark (base #343a40) */
100
- --ae-dark-100: color-mix(in srgb, var(--ae-dark) 20%, white);
101
- --ae-dark-200: color-mix(in srgb, var(--ae-dark) 40%, white);
102
- --ae-dark-300: color-mix(in srgb, var(--ae-dark) 60%, white);
103
- --ae-dark-400: color-mix(in srgb, var(--ae-dark) 80%, white);
104
- --ae-dark-500: var(--ae-dark);
105
- --ae-dark-600: color-mix(in srgb, var(--ae-dark) 80%, black);
106
- --ae-dark-700: color-mix(in srgb, var(--ae-dark) 60%, black);
107
- --ae-dark-800: color-mix(in srgb, var(--ae-dark) 40%, black);
108
- --ae-dark-900: color-mix(in srgb, var(--ae-dark) 20%, black);
109
-
110
- /* Light (base #f8f9fa) */
111
- --ae-light-100: color-mix(in srgb, var(--ae-light) 20%, white);
112
- --ae-light-200: color-mix(in srgb, var(--ae-light) 40%, white);
113
- --ae-light-300: color-mix(in srgb, var(--ae-light) 60%, white);
114
- --ae-light-400: color-mix(in srgb, var(--ae-light) 80%, white);
115
- --ae-light-500: var(--ae-light);
116
- --ae-light-600: color-mix(in srgb, var(--ae-light) 80%, black);
117
- --ae-light-700: color-mix(in srgb, var(--ae-light) 60%, black);
118
- --ae-light-800: color-mix(in srgb, var(--ae-light) 40%, black);
119
- --ae-light-900: color-mix(in srgb, var(--ae-light) 20%, black);
120
- }
121
-
122
- :root,
123
- :host {
124
- /* Hover / active mix (light default — overridden in § 6 dark) */
125
- --ae-color-mix-hover: black 10%;
126
- --ae-color-mix-active: black 20%;
127
-
128
- /* Primary (Blue) */
129
- --ae-color-primary: var(--ae-blue-500);
130
- --ae-color-primary-hover: color-mix(in srgb, var(--ae-color-primary), var(--ae-color-mix-hover));
131
- --ae-color-primary-active: color-mix(in srgb, var(--ae-color-primary), var(--ae-color-mix-active));
132
- --ae-color-primary-disabled: color-mix(in srgb, var(--ae-blue) 50%, var(--ae-gray-500));
133
-
134
- /* Success (Green) */
135
- --ae-color-success: var(--ae-green-500);
136
- --ae-color-success-hover: color-mix(in srgb, var(--ae-color-success), var(--ae-color-mix-hover));
137
- --ae-color-success-active: color-mix(in srgb, var(--ae-color-success), var(--ae-color-mix-active));
138
- --ae-color-success-disabled: color-mix(in srgb, var(--ae-green) 50%, var(--ae-gray-500));
139
-
140
- /* Danger (Red) */
141
- --ae-color-danger: var(--ae-red-500);
142
- --ae-color-danger-hover: color-mix(in srgb, var(--ae-color-danger), var(--ae-color-mix-hover));
143
- --ae-color-danger-active: color-mix(in srgb, var(--ae-color-danger), var(--ae-color-mix-active));
144
- --ae-color-danger-disabled: color-mix(in srgb, var(--ae-red) 50%, var(--ae-gray-500));
145
-
146
- /* Warning (Yellow) */
147
- --ae-color-warning: var(--ae-yellow-500);
148
- --ae-color-warning-hover: color-mix(in srgb, var(--ae-color-warning), var(--ae-color-mix-hover));
149
- --ae-color-warning-active: color-mix(in srgb, var(--ae-color-warning), var(--ae-color-mix-active));
150
- --ae-color-warning-disabled: color-mix(in srgb, var(--ae-yellow) 50%, var(--ae-gray-500));
151
-
152
- /* Info (Cyan) */
153
- --ae-color-info: var(--ae-cyan-500);
154
- --ae-color-info-hover: color-mix(in srgb, var(--ae-color-info), var(--ae-color-mix-hover));
155
- --ae-color-info-active: color-mix(in srgb, var(--ae-color-info), var(--ae-color-mix-active));
156
- --ae-color-info-disabled: color-mix(in srgb, var(--ae-cyan) 50%, var(--ae-gray-500));
157
-
158
- /* Secondary (Slate) — base differs per theme, overridden in § 6 dark */
159
- --ae-color-secondary: var(--ae-slate-500);
160
- --ae-color-secondary-hover: color-mix(in srgb, var(--ae-color-secondary), var(--ae-color-mix-hover));
161
- --ae-color-secondary-active: color-mix(in srgb, var(--ae-color-secondary), var(--ae-color-mix-active));
162
- --ae-color-secondary-text: var(--ae-slate-700);
163
- }
164
-
165
-
166
- .theme-light,
167
- :root[theme="light"],
168
- :host([theme="light"]),
169
- :host-context([theme="light"]),
170
- :where(:root),
171
- :host {
172
- color-scheme: light;
173
-
174
- /* Gray UI aliases — lighter palette steps for elements on white background */
175
- --ae-color-gray-dark: var(--ae-gray-400);
176
- --ae-color-gray: var(--ae-gray-300);
177
- --ae-color-gray-light: var(--ae-gray-200);
178
- --ae-color-gray-lighter: var(--ae-gray-100);
179
- --ae-color-gray-lightest: color-mix(in srgb, var(--ae-gray) 10%, white);
180
-
181
- /* Text */
182
- --ae-color-text-main: var(--ae-dark-700);
183
- --ae-color-text-muted: var(--ae-gray-600);
184
- --ae-color-text-disabled: var(--ae-gray-300);
185
- --ae-color-text-link: var(--ae-blue-500);
186
- --ae-color-text-link-hover: var(--ae-blue-700);
187
-
188
- /* Surfaces */
189
- --ae-surface-sunken: var(--ae-light-500);
190
- --ae-surface-base: white;
191
- --ae-surface-raised: var(--ae-light-500);
192
- --ae-surface-overlay: white;
193
- --ae-color-overlay: rgba(0, 0, 0, 0.4);
194
-
195
- /* Borders */
196
- --ae-border-subtle: rgba(0, 0, 0, 0.08);
197
- --ae-border-default: rgba(0, 0, 0, 0.15);
198
- --ae-border-hover: rgba(0, 0, 0, 0.25);
199
- --ae-border-focus: var(--ae-color-primary);
200
- --ae-border-disabled: rgba(0, 0, 0, 0.06);
201
-
202
- /* Focus ring */
203
- --ae-focus-ring: rgb(from var(--ae-blue) r g b / 0.30);
204
- --ae-focus-ring-sm: rgb(from var(--ae-blue) r g b / 0.15);
205
-
206
- /* Subtle intent tokens — light context */
207
- --ae-color-primary-bg-subtle: rgb(from var(--ae-blue) r g b / 0.08);
208
- --ae-color-primary-border-subtle: rgb(from var(--ae-blue) r g b / 0.40);
209
- --ae-color-primary-text-emphasis: var(--ae-blue-700);
210
-
211
- --ae-color-success-bg-subtle: rgb(from var(--ae-green) r g b / 0.08);
212
- --ae-color-success-border-subtle: rgb(from var(--ae-green) r g b / 0.40);
213
- --ae-color-success-text-emphasis: var(--ae-green-700);
214
-
215
- --ae-color-danger-bg-subtle: rgb(from var(--ae-red) r g b / 0.08);
216
- --ae-color-danger-border-subtle: rgb(from var(--ae-red) r g b / 0.40);
217
- --ae-color-danger-text-emphasis: var(--ae-red-700);
218
-
219
- --ae-color-warning-bg-subtle: rgb(from var(--ae-yellow) r g b / 0.08);
220
- --ae-color-warning-border-subtle: rgb(from var(--ae-yellow) r g b / 0.40);
221
- --ae-color-warning-text-emphasis: var(--ae-yellow-700);
222
-
223
- --ae-color-info-bg-subtle: rgb(from var(--ae-cyan) r g b / 0.08);
224
- --ae-color-info-border-subtle: rgb(from var(--ae-cyan) r g b / 0.40);
225
- --ae-color-info-text-emphasis: var(--ae-cyan-700);
226
-
227
- --ae-color-secondary-bg-subtle: rgb(from var(--ae-slate) r g b / 0.08);
228
- --ae-color-secondary-border-subtle: rgb(from var(--ae-slate) r g b / 0.40);
229
- --ae-color-secondary-text-emphasis: var(--ae-slate-700);
230
-
231
- --ae-color-light-bg-subtle: var(--ae-gray-100); /* opaque on white: ~#e2e2e2 */
232
- --ae-color-light-border-subtle: var(--ae-gray-200); /* opaque on white: ~#c4c4c4 */
233
-
234
- --ae-color-dark-bg-subtle: var(--ae-dark-100); /* opaque on white: ~#d6d8d9 */
235
- --ae-color-dark-border-subtle: var(--ae-dark-300); /* opaque on white: ~#85898c */
236
-
237
- /* Component tokens — light defaults */
238
- --ae-action-btn-bg: var(--ae-gray-200);
239
- --ae-action-btn-bg-hover: var(--ae-color-primary);
240
- --ae-action-btn-color: var(--ae-gray-600);
241
- --ae-action-btn-color-hover: white;
242
-
243
- --ae-clear-btn-bg-hover: var(--ae-color-danger);
244
- --ae-clear-btn-color-hover: white;
245
-
246
- --ae-reset-btn-border-radius: var(--ae-radius-xs);
247
- --ae-reset-btn-bg: var(--ae-action-btn-bg);
248
- --ae-reset-btn-bg-hover: var(--ae-action-btn-bg-hover);
249
- --ae-reset-btn-color: var(--ae-action-btn-color);
250
- --ae-reset-btn-color-hover: var(--ae-action-btn-color-hover);
251
- --ae-reset-btn-transition: all 0.12s;
252
-
253
- --ae-clear-btn-border-radius: var(--ae-radius-xs);
254
- --ae-clear-btn-bg: var(--ae-action-btn-bg);
255
- --ae-clear-btn-color: var(--ae-action-btn-color);
256
- --ae-clear-btn-transition: all 0.12s;
257
- }
258
-
259
- :root,
260
- :host {
261
- --ae-size-scale: 1;
262
- --ae-size-base: calc(1rem * var(--ae-size-scale)); /* 16px */
263
- --ae-size-xl: round(calc(var(--ae-size-l) * 1.125), 1px); /* 23px */
264
- --ae-size-l: round(calc(var(--ae-size-m) * 1.125 * 1.125), 1px); /* 20px */
265
- --ae-size-m: var(--ae-size-base); /* 16px */
266
- --ae-size-s: round(calc(var(--ae-size-m) / 1.125), 1px); /* 14px */
267
- --ae-size-xs: round(calc(var(--ae-size-s) / 1.125), 1px); /* 12px */
268
- --ae-size-2xs: round(calc(var(--ae-size-xs) / 1.125), 1px); /* 11px */
269
- --ae-size-3xs: round(calc(var(--ae-size-2xs) / 1.125), 1px); /* 10px */
270
- }
271
-
272
- /* Border-radius tokens — shared across all components */
273
- :root,
274
- :host {
275
- /**
276
- * Unified border-radius hook for all components.
277
- *
278
- * Not set by default — each component falls back to its own --ae-radius-*
279
- * token (e.g. button → sm, card → lg, input → xs).
280
- *
281
- * Usage:
282
- * :root { --ae-border-radius: 0; } // global: all components square
283
- * :root { --ae-border-radius: 999px; } // global: all components pill
284
- * ae-button { --ae-border-radius: 50%; } // scoped: only buttons circular
285
- * .sidebar { --ae-border-radius: 8px; } // scoped: everything inside .sidebar
286
- *
287
- * To restore a component to its own default:
288
- * ae-card { --ae-border-radius: initial; }
289
- */
290
-
291
- --ae-radius-square: 0;
292
- --ae-radius-xs: 2px;
293
- --ae-radius-sm: 4px;
294
- --ae-radius-md: 6px;
295
- --ae-radius-lg: 8px;
296
- --ae-radius-xl: 12px;
297
- --ae-radius-pill: 999px;
298
- --ae-radius-circle: 50%;
299
- }
300
-
301
- /* Layout tokens — defined on :root so all light DOM elements can use them */
302
- :root,
303
- :host {
304
- --container-max-width: 1280px;
305
- --container-padding-x: 1.5rem;
306
- }
307
-
308
- .theme-dark,
309
- :root[theme="dark"],
310
- :host([theme="dark"]),
311
- :host-context([theme="dark"]) {
312
- color-scheme: dark;
313
-
314
- /* Hover / active — slightly gentler on dark backgrounds */
315
- --ae-color-mix-hover: black 8%;
316
- --ae-color-mix-active: black 16%;
317
-
318
- /* Gray UI aliases — darker palette steps for elements on dark background */
319
- --ae-color-gray-dark: var(--ae-gray-800);
320
- --ae-color-gray: var(--ae-gray-700);
321
- --ae-color-gray-light: var(--ae-gray-600);
322
- --ae-color-gray-lighter: var(--ae-gray-500);
323
- --ae-color-gray-lightest: var(--ae-gray-400);
324
-
325
- /* Secondary — deeper base on dark background */
326
- --ae-color-secondary: var(--ae-slate-700);
327
- --ae-color-secondary-text: var(--ae-slate-300);
328
-
329
- /* Text */
330
- --ae-color-text-main: white;
331
- --ae-color-text-muted: var(--ae-gray-200);
332
- --ae-color-text-disabled: var(--ae-gray-500);
333
- --ae-color-text-link: var(--ae-blue-300);
334
- --ae-color-text-link-hover: var(--ae-blue-200);
335
-
336
- /* Surfaces */
337
- --ae-surface-sunken: var(--ae-gray-900);
338
- --ae-surface-base: color-mix(in srgb, var(--ae-gray) 27%, black);
339
- --ae-surface-raised: color-mix(in srgb, var(--ae-gray) 34%, black);
340
- --ae-surface-overlay: color-mix(in srgb, var(--ae-gray) 38%, black);
341
- --ae-color-overlay: rgba(0, 0, 0, 0.6);
342
-
343
- /* Borders */
344
- --ae-border-subtle: rgba(255, 255, 255, 0.08);
345
- --ae-border-default: rgba(255, 255, 255, 0.12);
346
- --ae-border-hover: rgba(255, 255, 255, 0.20);
347
- --ae-border-focus: var(--ae-color-primary);
348
- --ae-border-disabled: rgba(255, 255, 255, 0.06);
349
-
350
- /* Focus ring */
351
- --ae-focus-ring: rgb(from var(--ae-blue) r g b / 0.25);
352
- --ae-focus-ring-sm: rgb(from var(--ae-blue) r g b / 0.10);
353
-
354
- /* Subtle intent tokens — dark context (more alpha, lighter text-emphasis) */
355
- --ae-color-primary-bg-subtle: rgb(from var(--ae-blue) r g b / 0.10);
356
- --ae-color-primary-border-subtle: rgb(from var(--ae-blue) r g b / 0.30);
357
- --ae-color-primary-text-emphasis: var(--ae-blue-300);
358
-
359
- --ae-color-success-bg-subtle: rgb(from var(--ae-green) r g b / 0.10);
360
- --ae-color-success-border-subtle: rgb(from var(--ae-green) r g b / 0.30);
361
- --ae-color-success-text-emphasis: var(--ae-green-300);
362
-
363
- --ae-color-danger-bg-subtle: rgb(from var(--ae-red) r g b / 0.10);
364
- --ae-color-danger-border-subtle: rgb(from var(--ae-red) r g b / 0.30);
365
- --ae-color-danger-text-emphasis: var(--ae-red-300);
366
-
367
- --ae-color-warning-bg-subtle: rgb(from var(--ae-yellow) r g b / 0.10);
368
- --ae-color-warning-border-subtle: rgb(from var(--ae-yellow) r g b / 0.30);
369
- --ae-color-warning-text-emphasis: var(--ae-yellow-300);
370
-
371
- --ae-color-info-bg-subtle: rgb(from var(--ae-cyan) r g b / 0.10);
372
- --ae-color-info-border-subtle: rgb(from var(--ae-cyan) r g b / 0.30);
373
- --ae-color-info-text-emphasis: var(--ae-cyan-300);
374
-
375
- --ae-color-secondary-bg-subtle: rgb(from var(--ae-slate) r g b / 0.10);
376
- --ae-color-secondary-border-subtle: rgb(from var(--ae-slate) r g b / 0.30);
377
- --ae-color-secondary-text-emphasis: var(--ae-slate-300);
378
-
379
- --ae-color-light-bg-subtle: rgb(from var(--ae-light) r g b / 0.20);
380
- --ae-color-light-border-subtle: rgb(from var(--ae-light) r g b / 0.25);
381
-
382
- --ae-color-dark-bg-subtle: rgb(from var(--ae-dark) r g b / 0.30);
383
- --ae-color-dark-border-subtle: rgb(from var(--ae-dark) r g b / 0.50);
384
-
385
- /* Component tokens — dark overrides */
386
- --ae-action-btn-bg: var(--ae-color-gray);
387
- --ae-action-btn-bg-hover: color-mix(in srgb, var(--ae-blue) 25%, var(--ae-gray-800));
388
- --ae-action-btn-color: var(--ae-gray-400);
389
- --ae-action-btn-color-hover: var(--ae-cyan-300);
390
- --ae-clear-btn-bg-hover: color-mix(in srgb, var(--ae-red) 25%, var(--ae-gray-800));
391
- --ae-clear-btn-color-hover: var(--ae-red-300);
392
- }
393
- `;
394
- export {
395
- variables as v
396
- };
397
- //# sourceMappingURL=variables.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"variables.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}