aeico-components 0.1.6 → 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 (380) hide show
  1. package/README.md +0 -0
  2. package/dist/alert.cjs +637 -4
  3. package/dist/alert.cjs.map +7 -1
  4. package/dist/alert.js +575 -3
  5. package/dist/alert.js.map +7 -1
  6. package/dist/badge.cjs +573 -4
  7. package/dist/badge.cjs.map +7 -1
  8. package/dist/badge.js +510 -3
  9. package/dist/badge.js.map +7 -1
  10. package/dist/breadcrumb.cjs +709 -5
  11. package/dist/breadcrumb.cjs.map +7 -1
  12. package/dist/breadcrumb.js +644 -4
  13. package/dist/breadcrumb.js.map +7 -1
  14. package/dist/button-group.cjs +546 -4
  15. package/dist/button-group.cjs.map +7 -1
  16. package/dist/button-group.js +489 -3
  17. package/dist/button-group.js.map +7 -1
  18. package/dist/button.cjs +834 -4
  19. package/dist/button.cjs.map +7 -1
  20. package/dist/button.js +771 -3
  21. package/dist/button.js.map +7 -1
  22. package/dist/card.cjs +574 -4
  23. package/dist/card.cjs.map +7 -1
  24. package/dist/card.js +516 -3
  25. package/dist/card.js.map +7 -1
  26. package/dist/checkbox.cjs +867 -4
  27. package/dist/checkbox.cjs.map +7 -1
  28. package/dist/checkbox.js +794 -3
  29. package/dist/checkbox.js.map +7 -1
  30. package/dist/copy-button.cjs +1046 -4
  31. package/dist/copy-button.cjs.map +7 -1
  32. package/dist/copy-button.js +969 -3
  33. package/dist/copy-button.js.map +7 -1
  34. package/dist/detail-group.cjs +533 -0
  35. package/dist/detail-group.cjs.map +7 -0
  36. package/dist/detail-group.js +477 -0
  37. package/dist/detail-group.js.map +7 -0
  38. package/dist/detail.cjs +627 -4
  39. package/dist/detail.cjs.map +7 -1
  40. package/dist/detail.js +569 -3
  41. package/dist/detail.js.map +7 -1
  42. package/dist/dialog.cjs +738 -4
  43. package/dist/dialog.cjs.map +7 -1
  44. package/dist/dialog.js +665 -3
  45. package/dist/dialog.js.map +7 -1
  46. package/dist/divider.cjs +558 -4
  47. package/dist/divider.cjs.map +7 -1
  48. package/dist/divider.js +502 -3
  49. package/dist/divider.js.map +7 -1
  50. package/dist/drawer.cjs +818 -4
  51. package/dist/drawer.cjs.map +7 -1
  52. package/dist/drawer.js +749 -3
  53. package/dist/drawer.js.map +7 -1
  54. package/dist/dropdown.cjs +1396 -5
  55. package/dist/dropdown.cjs.map +7 -1
  56. package/dist/dropdown.js +1316 -4
  57. package/dist/dropdown.js.map +7 -1
  58. package/dist/icon-button.cjs +999 -4
  59. package/dist/icon-button.cjs.map +7 -1
  60. package/dist/icon-button.js +930 -3
  61. package/dist/icon-button.js.map +7 -1
  62. package/dist/icon.cjs +613 -4
  63. package/dist/icon.cjs.map +7 -1
  64. package/dist/icon.js +547 -3
  65. package/dist/icon.js.map +7 -1
  66. package/dist/index.cjs +6484 -188
  67. package/dist/index.cjs.map +7 -1
  68. package/dist/index.js +6095 -147
  69. package/dist/index.js.map +7 -1
  70. package/dist/menu.cjs +841 -4
  71. package/dist/menu.cjs.map +7 -1
  72. package/dist/menu.js +785 -3
  73. package/dist/menu.js.map +7 -1
  74. package/dist/navbar.cjs +622 -4
  75. package/dist/navbar.cjs.map +7 -1
  76. package/dist/navbar.js +564 -3
  77. package/dist/navbar.js.map +7 -1
  78. package/dist/number-input.cjs +887 -0
  79. package/dist/number-input.cjs.map +7 -0
  80. package/dist/number-input.js +820 -0
  81. package/dist/number-input.js.map +7 -0
  82. package/dist/pagination.cjs +1099 -4
  83. package/dist/pagination.cjs.map +7 -1
  84. package/dist/pagination.js +1029 -3
  85. package/dist/pagination.js.map +7 -1
  86. package/dist/progress-bar.cjs +581 -4
  87. package/dist/progress-bar.cjs.map +7 -1
  88. package/dist/progress-bar.js +525 -3
  89. package/dist/progress-bar.js.map +7 -1
  90. package/dist/radio-group.cjs +973 -5
  91. package/dist/radio-group.cjs.map +7 -1
  92. package/dist/radio-group.js +899 -4
  93. package/dist/radio-group.js.map +7 -1
  94. package/dist/select.cjs +1242 -45
  95. package/dist/select.cjs.map +7 -1
  96. package/dist/select.js +1159 -44
  97. package/dist/select.js.map +7 -1
  98. package/dist/slider.cjs +1420 -4
  99. package/dist/slider.cjs.map +7 -1
  100. package/dist/slider.js +1351 -3
  101. package/dist/slider.js.map +7 -1
  102. package/dist/spinner.cjs +587 -4
  103. package/dist/spinner.cjs.map +7 -1
  104. package/dist/spinner.js +528 -3
  105. package/dist/spinner.js.map +7 -1
  106. package/dist/styles/layout.cjs +1 -0
  107. package/dist/styles/layout.js +1 -0
  108. package/dist/styles/radius.cjs +1 -0
  109. package/dist/styles/radius.js +1 -0
  110. package/dist/styles/variables.cjs +1 -0
  111. package/dist/styles/variables.js +1 -0
  112. package/dist/switch.cjs +1092 -4
  113. package/dist/switch.cjs.map +7 -1
  114. package/dist/switch.js +1013 -3
  115. package/dist/switch.js.map +7 -1
  116. package/dist/tabs.cjs +660 -6
  117. package/dist/tabs.cjs.map +7 -1
  118. package/dist/tabs.js +591 -5
  119. package/dist/tabs.js.map +7 -1
  120. package/dist/tag.cjs +591 -3
  121. package/dist/tag.cjs.map +7 -1
  122. package/dist/tag.js +532 -2
  123. package/dist/tag.js.map +7 -1
  124. package/dist/text-input.cjs +829 -4
  125. package/dist/text-input.cjs.map +7 -1
  126. package/dist/text-input.js +761 -3
  127. package/dist/text-input.js.map +7 -1
  128. package/dist/textarea.cjs +914 -3
  129. package/dist/textarea.cjs.map +7 -1
  130. package/dist/textarea.js +854 -2
  131. package/dist/textarea.js.map +7 -1
  132. package/dist/tooltip.cjs +764 -4
  133. package/dist/tooltip.cjs.map +7 -1
  134. package/dist/tooltip.js +711 -3
  135. package/dist/tooltip.js.map +7 -1
  136. package/dist/tree.cjs +1059 -4
  137. package/dist/tree.cjs.map +7 -1
  138. package/dist/tree.js +985 -3
  139. package/dist/tree.js.map +7 -1
  140. package/dist/types/card/defines.d.ts +1 -1
  141. package/dist/types/detail/defines.d.ts +1 -1
  142. package/dist/types/dialog/dialog.d.ts +1 -0
  143. package/dist/types/drawer/drawer.d.ts +2 -0
  144. package/dist/types/icon/defines.d.ts +7 -1
  145. package/dist/types/icon/index.d.ts +1 -1
  146. package/dist/types/menu/defines.d.ts +1 -0
  147. package/dist/types/menu/menu-item.d.ts +1 -0
  148. package/dist/types/menu/menu.d.ts +1 -0
  149. package/dist/types/styles/layout.d.ts +2 -0
  150. package/dist/types/styles/radius.d.ts +2 -0
  151. package/dist/types/styles/variables.d.ts +2 -0
  152. package/dist/types/tabs/defines.d.ts +1 -0
  153. package/dist/types/tabs/tabs.d.ts +3 -0
  154. package/package.json +31 -7
  155. package/src/alert/alert.ts +3 -3
  156. package/src/badge/badge.ts +4 -4
  157. package/src/breadcrumb/breadcrumb-item.ts +2 -2
  158. package/src/breadcrumb/breadcrumb.ts +3 -3
  159. package/src/button/button.ts +4 -4
  160. package/src/button-group/button-group.ts +8 -9
  161. package/src/card/card.ts +3 -3
  162. package/src/card/defines.ts +1 -1
  163. package/src/checkbox/checkbox.ts +6 -6
  164. package/src/copy-button/copy-button.ts +13 -9
  165. package/src/detail/defines.ts +1 -1
  166. package/src/detail/detail.ts +3 -3
  167. package/src/detail-group/detail-group.ts +2 -2
  168. package/src/dialog/dialog.ts +15 -14
  169. package/src/divider/divider.ts +3 -3
  170. package/src/drawer/drawer.ts +28 -11
  171. package/src/dropdown/dropdown-item.ts +2 -2
  172. package/src/dropdown/dropdown.ts +2 -2
  173. package/src/icon/defines.ts +8 -1
  174. package/src/icon/icon.ts +32 -14
  175. package/src/icon/index.ts +1 -1
  176. package/src/icon/registry.ts +2 -2
  177. package/src/menu/defines.ts +1 -0
  178. package/src/menu/menu-item.ts +14 -4
  179. package/src/menu/menu.ts +5 -2
  180. package/src/navbar/navbar.ts +3 -3
  181. package/src/number-input/number-input.ts +5 -5
  182. package/src/pagination/pagination.ts +3 -3
  183. package/src/progress-bar/progress-bar.ts +3 -3
  184. package/src/radio-group/radio-group.ts +12 -8
  185. package/src/select/select-option.ts +2 -2
  186. package/src/select/select.ts +5 -5
  187. package/src/slider/slider.ts +6 -6
  188. package/src/spinner/spinner.ts +4 -4
  189. package/src/styles/color.css +91 -91
  190. package/src/styles/components/action-button.css +12 -12
  191. package/src/styles/components/alert.css +22 -28
  192. package/src/styles/components/badge.css +13 -20
  193. package/src/styles/components/breadcrumb-item.css +7 -7
  194. package/src/styles/components/button-group.css +2 -0
  195. package/src/styles/components/button.css +39 -50
  196. package/src/styles/components/card.css +69 -30
  197. package/src/styles/components/checkbox.css +22 -16
  198. package/src/styles/components/copy-button.css +22 -33
  199. package/src/styles/components/detail.css +51 -39
  200. package/src/styles/components/dialog.css +11 -11
  201. package/src/styles/components/divider.css +3 -3
  202. package/src/styles/components/drawer.css +59 -27
  203. package/src/styles/components/dropdown-item.css +7 -8
  204. package/src/styles/components/dropdown.css +3 -4
  205. package/src/styles/components/field-label.css +13 -13
  206. package/src/styles/components/icon-button.css +25 -36
  207. package/src/styles/components/icon.css +1 -1
  208. package/src/styles/components/menu-item.css +13 -8
  209. package/src/styles/components/navbar.css +23 -44
  210. package/src/styles/components/number-input.css +27 -36
  211. package/src/styles/components/pagination.css +31 -31
  212. package/src/styles/components/progress-bar.css +2 -3
  213. package/src/styles/components/radio-group.css +88 -83
  214. package/src/styles/components/select-option.css +5 -5
  215. package/src/styles/components/select.css +21 -33
  216. package/src/styles/components/slider.css +56 -34
  217. package/src/styles/components/spinner.css +7 -9
  218. package/src/styles/components/switch.css +21 -19
  219. package/src/styles/components/tab.css +4 -5
  220. package/src/styles/components/tabs.css +48 -1
  221. package/src/styles/components/tag.css +14 -21
  222. package/src/styles/components/text-input.css +13 -22
  223. package/src/styles/components/textarea.css +12 -21
  224. package/src/styles/components/tooltip.css +4 -5
  225. package/src/styles/components/tree-item.css +12 -12
  226. package/src/styles/layout.css +5 -2
  227. package/src/styles/radius.css +25 -0
  228. package/src/styles/size.css +7 -7
  229. package/src/styles/variables.css +271 -247
  230. package/src/switch/switch.ts +6 -6
  231. package/src/tabs/defines.ts +1 -0
  232. package/src/tabs/tab-panel.ts +1 -1
  233. package/src/tabs/tab.ts +1 -1
  234. package/src/tabs/tabs.ts +14 -2
  235. package/src/tag/tag.ts +4 -4
  236. package/src/text-input/text-input.ts +5 -5
  237. package/src/textarea/textarea.ts +5 -5
  238. package/src/tooltip/tooltip.ts +2 -2
  239. package/src/tree/tree-item.ts +2 -2
  240. package/src/tree/tree.ts +2 -2
  241. package/dist/chunks/action-button.cjs +0 -296
  242. package/dist/chunks/action-button.cjs.map +0 -1
  243. package/dist/chunks/action-button.js +0 -297
  244. package/dist/chunks/action-button.js.map +0 -1
  245. package/dist/chunks/aeico-component.cjs +0 -17
  246. package/dist/chunks/aeico-component.cjs.map +0 -1
  247. package/dist/chunks/aeico-component.js +0 -18
  248. package/dist/chunks/aeico-component.js.map +0 -1
  249. package/dist/chunks/alert.cjs +0 -170
  250. package/dist/chunks/alert.cjs.map +0 -1
  251. package/dist/chunks/alert.js +0 -171
  252. package/dist/chunks/alert.js.map +0 -1
  253. package/dist/chunks/badge.cjs +0 -85
  254. package/dist/chunks/badge.cjs.map +0 -1
  255. package/dist/chunks/badge.js +0 -86
  256. package/dist/chunks/badge.js.map +0 -1
  257. package/dist/chunks/breadcrumb-item.cjs +0 -261
  258. package/dist/chunks/breadcrumb-item.cjs.map +0 -1
  259. package/dist/chunks/breadcrumb-item.js +0 -262
  260. package/dist/chunks/breadcrumb-item.js.map +0 -1
  261. package/dist/chunks/button-group.cjs +0 -79
  262. package/dist/chunks/button-group.cjs.map +0 -1
  263. package/dist/chunks/button-group.js +0 -80
  264. package/dist/chunks/button-group.js.map +0 -1
  265. package/dist/chunks/button.cjs +0 -348
  266. package/dist/chunks/button.cjs.map +0 -1
  267. package/dist/chunks/button.js +0 -349
  268. package/dist/chunks/button.js.map +0 -1
  269. package/dist/chunks/card.cjs +0 -93
  270. package/dist/chunks/card.cjs.map +0 -1
  271. package/dist/chunks/card.js +0 -94
  272. package/dist/chunks/card.js.map +0 -1
  273. package/dist/chunks/checkbox.cjs +0 -86
  274. package/dist/chunks/checkbox.cjs.map +0 -1
  275. package/dist/chunks/checkbox.js +0 -87
  276. package/dist/chunks/checkbox.js.map +0 -1
  277. package/dist/chunks/color.cjs +0 -4
  278. package/dist/chunks/color.cjs.map +0 -1
  279. package/dist/chunks/color.js +0 -5
  280. package/dist/chunks/color.js.map +0 -1
  281. package/dist/chunks/copy-button.cjs +0 -168
  282. package/dist/chunks/copy-button.cjs.map +0 -1
  283. package/dist/chunks/copy-button.js +0 -169
  284. package/dist/chunks/copy-button.js.map +0 -1
  285. package/dist/chunks/detail.cjs +0 -146
  286. package/dist/chunks/detail.cjs.map +0 -1
  287. package/dist/chunks/detail.js +0 -147
  288. package/dist/chunks/detail.js.map +0 -1
  289. package/dist/chunks/dialog.cjs +0 -117
  290. package/dist/chunks/dialog.cjs.map +0 -1
  291. package/dist/chunks/dialog.js +0 -118
  292. package/dist/chunks/dialog.js.map +0 -1
  293. package/dist/chunks/divider.cjs +0 -80
  294. package/dist/chunks/divider.cjs.map +0 -1
  295. package/dist/chunks/divider.js +0 -81
  296. package/dist/chunks/divider.js.map +0 -1
  297. package/dist/chunks/drawer.cjs +0 -180
  298. package/dist/chunks/drawer.cjs.map +0 -1
  299. package/dist/chunks/drawer.js +0 -181
  300. package/dist/chunks/drawer.js.map +0 -1
  301. package/dist/chunks/dropdown-button.cjs +0 -534
  302. package/dist/chunks/dropdown-button.cjs.map +0 -1
  303. package/dist/chunks/dropdown-button.js +0 -535
  304. package/dist/chunks/dropdown-button.js.map +0 -1
  305. package/dist/chunks/icon-button.cjs +0 -35
  306. package/dist/chunks/icon-button.cjs.map +0 -1
  307. package/dist/chunks/icon-button.js +0 -36
  308. package/dist/chunks/icon-button.js.map +0 -1
  309. package/dist/chunks/icon.cjs +0 -108
  310. package/dist/chunks/icon.cjs.map +0 -1
  311. package/dist/chunks/icon.js +0 -109
  312. package/dist/chunks/icon.js.map +0 -1
  313. package/dist/chunks/menu.cjs +0 -396
  314. package/dist/chunks/menu.cjs.map +0 -1
  315. package/dist/chunks/menu.js +0 -397
  316. package/dist/chunks/menu.js.map +0 -1
  317. package/dist/chunks/navbar.cjs +0 -142
  318. package/dist/chunks/navbar.cjs.map +0 -1
  319. package/dist/chunks/navbar.js +0 -143
  320. package/dist/chunks/navbar.js.map +0 -1
  321. package/dist/chunks/pagination.cjs +0 -475
  322. package/dist/chunks/pagination.cjs.map +0 -1
  323. package/dist/chunks/pagination.js +0 -476
  324. package/dist/chunks/pagination.js.map +0 -1
  325. package/dist/chunks/progress-bar.cjs +0 -101
  326. package/dist/chunks/progress-bar.cjs.map +0 -1
  327. package/dist/chunks/progress-bar.js +0 -102
  328. package/dist/chunks/progress-bar.js.map +0 -1
  329. package/dist/chunks/radio.cjs +0 -185
  330. package/dist/chunks/radio.cjs.map +0 -1
  331. package/dist/chunks/radio.js +0 -186
  332. package/dist/chunks/radio.js.map +0 -1
  333. package/dist/chunks/select.cjs +0 -381
  334. package/dist/chunks/select.cjs.map +0 -1
  335. package/dist/chunks/select.js +0 -382
  336. package/dist/chunks/select.js.map +0 -1
  337. package/dist/chunks/size.cjs +0 -4
  338. package/dist/chunks/size.cjs.map +0 -1
  339. package/dist/chunks/size.js +0 -5
  340. package/dist/chunks/size.js.map +0 -1
  341. package/dist/chunks/slider.cjs +0 -611
  342. package/dist/chunks/slider.cjs.map +0 -1
  343. package/dist/chunks/slider.js +0 -612
  344. package/dist/chunks/slider.js.map +0 -1
  345. package/dist/chunks/spinner.cjs +0 -102
  346. package/dist/chunks/spinner.cjs.map +0 -1
  347. package/dist/chunks/spinner.js +0 -103
  348. package/dist/chunks/spinner.js.map +0 -1
  349. package/dist/chunks/switch.cjs +0 -167
  350. package/dist/chunks/switch.cjs.map +0 -1
  351. package/dist/chunks/switch.js +0 -168
  352. package/dist/chunks/switch.js.map +0 -1
  353. package/dist/chunks/tab-panel.cjs +0 -165
  354. package/dist/chunks/tab-panel.cjs.map +0 -1
  355. package/dist/chunks/tab-panel.js +0 -166
  356. package/dist/chunks/tab-panel.js.map +0 -1
  357. package/dist/chunks/tag.cjs +0 -108
  358. package/dist/chunks/tag.cjs.map +0 -1
  359. package/dist/chunks/tag.js +0 -109
  360. package/dist/chunks/tag.js.map +0 -1
  361. package/dist/chunks/text-input.cjs +0 -54
  362. package/dist/chunks/text-input.cjs.map +0 -1
  363. package/dist/chunks/text-input.js +0 -55
  364. package/dist/chunks/text-input.js.map +0 -1
  365. package/dist/chunks/textarea.cjs +0 -137
  366. package/dist/chunks/textarea.cjs.map +0 -1
  367. package/dist/chunks/textarea.js +0 -138
  368. package/dist/chunks/textarea.js.map +0 -1
  369. package/dist/chunks/tooltip.cjs +0 -293
  370. package/dist/chunks/tooltip.cjs.map +0 -1
  371. package/dist/chunks/tooltip.js +0 -294
  372. package/dist/chunks/tooltip.js.map +0 -1
  373. package/dist/chunks/tree.cjs +0 -468
  374. package/dist/chunks/tree.cjs.map +0 -1
  375. package/dist/chunks/tree.js +0 -469
  376. package/dist/chunks/tree.js.map +0 -1
  377. package/dist/chunks/variables.cjs +0 -372
  378. package/dist/chunks/variables.cjs.map +0 -1
  379. package/dist/chunks/variables.js +0 -373
  380. package/dist/chunks/variables.js.map +0 -1
@@ -1,171 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
4
- import { v as variables } from "./variables.js";
5
- import { c as colorCSS } from "./color.js";
6
- import { A as AeicoComponent } from "./aeico-component.js";
7
- import { html } from "aeico";
8
- const alertStyle = `.alert {
9
- position: relative;
10
- padding: 12px 16px;
11
- margin-bottom: 12px;
12
- border-radius: 4px;
13
- font-size: 12px;
14
- line-height: 1.6;
15
- background-color: var(--alert-solid-bg);
16
- color: var(--alert-solid-color);
17
- border: 1px solid var(--alert-solid-bg);
18
- }
19
-
20
- .alert:last-child {
21
- margin-bottom: 0;
22
- }
23
-
24
- :host {
25
- --color-solid: var(--color-primary);
26
- --color-on-solid: var(--color-text-main);
27
- --color-border: var(--color-primary);
28
- --color-bg-subtle: var(--color-primary-bg-subtle);
29
- --color-text-subtle: var(--color-primary-text-emphasis);
30
- --color-border-subtle: var(--color-primary-border-subtle);
31
-
32
- --alert-solid-bg: var(--color-solid);
33
- --alert-solid-color: var(--color-on-solid);
34
- --alert-border: var(--color-border);
35
- --alert-subtle-bg: var(--color-bg-subtle);
36
- --alert-subtle-color: var(--color-text-subtle);
37
- --alert-subtle-border:var(--color-border-subtle);
38
- }
39
-
40
-
41
- :host([variant="faint"]) .alert {
42
- background-color: var(--alert-subtle-bg);
43
- color: var(--alert-subtle-color);
44
- border-color: var(--alert-subtle-border);
45
- }
46
-
47
- :host([variant="subtle"]) .alert {
48
- background-color: var(--alert-subtle-bg);
49
- color: var(--alert-subtle-color);
50
- border-color: transparent;
51
- }
52
-
53
- :host([variant="filled"]) .alert {
54
- background-color: var(--alert-solid-bg);
55
- color: var(--alert-solid-color);
56
- border-color: var(--alert-solid-bg);
57
- }
58
-
59
- :host([variant="outlined"]) .alert {
60
- background-color: transparent;
61
- color: var(--alert-subtle-color);
62
- border-color: var(--alert-border);
63
- }
64
-
65
- :host([dismissible]) .alert {
66
- padding-right: 40px;
67
- }
68
-
69
- :host([icon]) .alert {
70
- display: flex;
71
- align-items: flex-start;
72
- gap: 10px;
73
- }
74
-
75
- :host([icon]) .alert::before {
76
- content: '';
77
- flex-shrink: 0;
78
- width: 16px;
79
- height: 16px;
80
- margin-top: 2px;
81
- }
82
-
83
- .alert-close {
84
- position: absolute;
85
- top: 50%;
86
- right: 12px;
87
- transform: translateY(-50%);
88
- background: transparent;
89
- border: none;
90
- color: inherit;
91
- opacity: 0.6;
92
- cursor: pointer;
93
- padding: 4px;
94
- font-size: 18px;
95
- line-height: 1;
96
- transition: opacity 0.15s;
97
- }
98
-
99
- .alert-close:hover {
100
- opacity: 1;
101
- }
102
-
103
- :host([size="sm"]) .alert {
104
- padding: 8px 12px;
105
- font-size: 11px;
106
- }
107
-
108
- :host([size="lg"]) .alert {
109
- padding: 16px 20px;
110
- font-size: 13px;
111
- }
112
- `;
113
- class Alert extends AeicoComponent {
114
- constructor() {
115
- super(...arguments);
116
- __publicField(this, "_handleClose", () => {
117
- this.emit("alert-close", { detail: { target: this } });
118
- this.remove();
119
- });
120
- }
121
- render() {
122
- return html(({ div, slot, button, span }) => {
123
- div(
124
- {
125
- className: "alert",
126
- role: "alert",
127
- part: "alert",
128
- style: { display: this.invisible ? "none" : "" }
129
- },
130
- () => {
131
- slot();
132
- if (this.dismissible) {
133
- button(
134
- {
135
- className: "alert-close",
136
- "@click": () => this._handleClose(),
137
- title: this.closeText || "Close alert"
138
- },
139
- () => {
140
- span({ "aria-hidden": "true", textContent: "×" });
141
- }
142
- );
143
- }
144
- }
145
- );
146
- });
147
- }
148
- show() {
149
- if (this.invisible) {
150
- this.invisible = false;
151
- }
152
- }
153
- hide() {
154
- this.invisible = true;
155
- }
156
- }
157
- __publicField(Alert, "props", {
158
- color: { type: String },
159
- variant: { type: String },
160
- size: { type: String },
161
- dismissible: { type: Boolean },
162
- invisible: { type: Boolean },
163
- closeText: { type: String }
164
- });
165
- __publicField(Alert, "useStyles", ["alert"]);
166
- __publicField(Alert, "styles", [variables, colorCSS, alertStyle]);
167
- Alert.register();
168
- export {
169
- Alert as A
170
- };
171
- //# sourceMappingURL=alert.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"alert.js","sources":["../../src/alert/alert.ts"],"sourcesContent":["import type { InferProps, Props } from 'aeico';\nimport styleVariables from '../styles/variables.css?inline';\nimport colorCSS from '../styles/color.css?inline';\nimport alertStyle from '../styles/components/alert.css?inline';\nimport AeicoComponent from '../aeico-component';\nimport { html } from 'aeico';\nimport type { AlertColor, AlertSize, AlertVariant } from './defines';\n\n/**\n * Alert Component\n *\n * A customizable alert/notification component with multiple variants and sizes.\n * Supports dismissible alerts and icon display.\n *\n * @example\n * ```typescript\n * // Using the static create method\n * const alert = Alert.create({\n * variant: 'info',\n * dismissible: true\n * })\n * alert.textContent = 'This is an informational message'\n * document.body.appendChild(alert)\n * ```\n *\n * @example\n * ```html\n * <!-- Using as Web Component -->\n * <ae-alert variant=\"info\">Information message</ae-alert>\n * <ae-alert variant=\"success\" dismissible>Operation successful!</ae-alert>\n * <ae-alert variant=\"warning\" size=\"sm\">Small warning</ae-alert>\n * ```\n */\nclass Alert extends AeicoComponent {\n static props: Props = {\n color: { type: String },\n variant: { type: String },\n size: { type: String },\n dismissible: { type: Boolean },\n invisible: { type: Boolean },\n closeText: { type: String },\n };\n\n protected static useStyles = ['alert'];\n protected static styles = [styleVariables, colorCSS, alertStyle];\n\n declare color?: AlertColor;\n declare variant?: AlertVariant;\n declare size?: AlertSize;\n declare dismissible?: boolean;\n declare invisible?: boolean;\n declare closeText?: string;\n\n protected render() {\n return html(({ div, slot, button, span }) => {\n div(\n {\n className: 'alert',\n role: 'alert',\n part: 'alert',\n style: { display: this.invisible ? 'none' : '' },\n },\n () => {\n slot();\n\n if (this.dismissible) {\n button(\n {\n className: 'alert-close',\n '@click': () => this._handleClose(),\n title: this.closeText || 'Close alert',\n },\n () => {\n span({ 'aria-hidden': 'true', textContent: '\\u00d7' });\n },\n );\n }\n },\n );\n });\n }\n\n show() {\n if (this.invisible) {\n this.invisible = false;\n }\n }\n\n hide() {\n this.invisible = true;\n }\n\n private _handleClose = () => {\n this.emit('alert-close', { detail: { target: this } });\n this.remove();\n };\n}\n\nAlert.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-alert': Alert;\n }\n}\n\nexport default Alert;\nexport type AlertProps = InferProps<typeof Alert>;\n"],"names":["styleVariables"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCA,MAAM,cAAc,eAAe;AAAA,EAAnC;AAAA;AA2DU,wCAAe,MAAM;AAC3B,WAAK,KAAK,eAAe,EAAE,QAAQ,EAAE,QAAQ,KAAA,GAAQ;AACrD,WAAK,OAAA;AAAA,IACP;AAAA;AAAA,EA1CU,SAAS;AACjB,WAAO,KAAK,CAAC,EAAE,KAAK,MAAM,QAAQ,WAAW;AAC3C;AAAA,QACE;AAAA,UACE,WAAW;AAAA,UACX,MAAM;AAAA,UACN,MAAM;AAAA,UACN,OAAO,EAAE,SAAS,KAAK,YAAY,SAAS,GAAA;AAAA,QAAG;AAAA,QAEjD,MAAM;AACJ,eAAA;AAEA,cAAI,KAAK,aAAa;AACpB;AAAA,cACE;AAAA,gBACE,WAAW;AAAA,gBACX,UAAU,MAAM,KAAK,aAAA;AAAA,gBACrB,OAAO,KAAK,aAAa;AAAA,cAAA;AAAA,cAE3B,MAAM;AACJ,qBAAK,EAAE,eAAe,QAAQ,aAAa,KAAU;AAAA,cACvD;AAAA,YAAA;AAAA,UAEJ;AAAA,QACF;AAAA,MAAA;AAAA,IAEJ,CAAC;AAAA,EACH;AAAA,EAEA,OAAO;AACL,QAAI,KAAK,WAAW;AAClB,WAAK,YAAY;AAAA,IACnB;AAAA,EACF;AAAA,EAEA,OAAO;AACL,SAAK,YAAY;AAAA,EACnB;AAMF;AA9DE,cADI,OACG,SAAe;AAAA,EACpB,OAAO,EAAE,MAAM,OAAA;AAAA,EACf,SAAS,EAAE,MAAM,OAAA;AAAA,EACjB,MAAM,EAAE,MAAM,OAAA;AAAA,EACd,aAAa,EAAE,MAAM,QAAA;AAAA,EACrB,WAAW,EAAE,MAAM,QAAA;AAAA,EACnB,WAAW,EAAE,MAAM,OAAA;AAAO;AAG5B,cAVI,OAUa,aAAY,CAAC,OAAO;AACrC,cAXI,OAWa,UAAS,CAACA,WAAgB,UAAU,UAAU;AAsDjE,MAAM,SAAA;"}
@@ -1,85 +0,0 @@
1
- "use strict";
2
- const variables = require("./variables.cjs");
3
- const size = require("./size.cjs");
4
- const color = require("./color.cjs");
5
- const aeicoComponent = require("./aeico-component.cjs");
6
- const aeico = require("aeico");
7
- const badgeStyle = ':host {\n display: inline-flex;\n align-items: center;\n --badge-solid-bg: var(--color-solid);\n --badge-solid-color: var(--color-on-solid);\n --badge-border: var(--color-border);\n --badge-accent: var(--color-accent);\n --badge-subtle-bg: var(--color-bg-subtle);\n --badge-subtle-color: var(--color-text-subtle);\n --badge-subtle-border: var(--color-border-subtle);\n}\n\n.badge {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n font-family: inherit;\n font-weight: 500;\n white-space: nowrap;\n vertical-align: middle;\n line-height: 1.2;\n font-size: 1em;\n padding: 0.15em 0.6em;\n border-radius: 4px;\n border: 1px solid var(--badge-solid-bg);\n background: var(--badge-solid-bg);\n color: var(--badge-solid-color);\n}\n\n/* Default (no [variant]) = filled */\n\n/* --- Variants --- */\n\n:host([variant="outlined"]) .badge {\n background: transparent;\n border-color: var(--badge-border);\n color: var(--badge-accent);\n}\n\n:host([variant="faint"]) .badge {\n background: var(--badge-subtle-bg);\n border-color: var(--badge-subtle-border);\n color: var(--badge-subtle-color);\n}\n\n:host([variant="subtle"]) .badge {\n background: var(--badge-subtle-bg);\n border-color: transparent;\n color: var(--badge-subtle-color);\n}\n\n:host([variant="text"]) .badge {\n background: transparent;\n border-color: transparent;\n color: var(--badge-accent);\n padding-left: 0;\n padding-right: 0;\n}\n\n:host([pill]) .badge {\n border-radius: 999px;\n}\n\n/* Icon slots */\n::slotted(ae-icon) {\n font-size: 1.1em;\n}\n';
8
- var __create = Object.create;
9
- var __defProp = Object.defineProperty;
10
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
11
- var __knownSymbol = (name, symbol) => (symbol = Symbol[name]) ? symbol : Symbol.for("Symbol." + name);
12
- var __typeError = (msg) => {
13
- throw TypeError(msg);
14
- };
15
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
16
- var __decoratorStart = (base) => [, , , __create((base == null ? void 0 : base[__knownSymbol("metadata")]) ?? null)];
17
- var __decoratorStrings = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"];
18
- var __expectFn = (fn) => fn !== void 0 && typeof fn !== "function" ? __typeError("Function expected") : fn;
19
- var __decoratorContext = (kind, name, done, metadata, fns) => ({ kind: __decoratorStrings[kind], name, metadata, addInitializer: (fn) => done._ ? __typeError("Already initialized") : fns.push(__expectFn(fn || null)) });
20
- var __decoratorMetadata = (array, target) => __defNormalProp(target, __knownSymbol("metadata"), array[3]);
21
- var __runInitializers = (array, flags, self, value) => {
22
- for (var i = 0, fns = array[flags >> 1], n = fns && fns.length; i < n; i++) flags & 1 ? fns[i].call(self) : value = fns[i].call(self, value);
23
- return value;
24
- };
25
- var __decorateElement = (array, flags, name, decorators, target, extra) => {
26
- var fn, it, done, ctx, access, k = flags & 7, s = false, p = false;
27
- var j = array.length + 1, key = __decoratorStrings[k + 5];
28
- var initializers = array[j - 1] = [], extraInitializers = array[j] || (array[j] = []);
29
- var desc = (target = target.prototype, __getOwnPropDesc({ get [name]() {
30
- return __privateGet(this, extra);
31
- }, set [name](x) {
32
- return __privateSet(this, extra, x);
33
- } }, name));
34
- for (var i = decorators.length - 1; i >= 0; i--) {
35
- ctx = __decoratorContext(k, name, done = {}, array[3], extraInitializers);
36
- {
37
- ctx.static = s, ctx.private = p, access = ctx.access = { has: (x) => name in x };
38
- access.get = (x) => x[name];
39
- access.set = (x, y) => x[name] = y;
40
- }
41
- it = (0, decorators[i])({ get: desc.get, set: desc.set }, ctx), done._ = 1;
42
- if (it === void 0) __expectFn(it) && (desc[key] = it);
43
- else if (typeof it !== "object" || it === null) __typeError("Object expected");
44
- else __expectFn(fn = it.get) && (desc.get = fn), __expectFn(fn = it.set) && (desc.set = fn), __expectFn(fn = it.init) && initializers.unshift(fn);
45
- }
46
- return desc && __defProp(target, name, desc), target;
47
- };
48
- var __publicField = (obj, key, value) => __defNormalProp(obj, key + "", value);
49
- var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
50
- var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), member.get(obj));
51
- var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
52
- var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
53
- var _pill_dec, _size_dec, _variant_dec, _color_dec, _a, _init, _color, _variant, _size, _pill;
54
- class Badge extends (_a = aeicoComponent.AeicoComponent, _color_dec = [aeico.prop({ type: String })], _variant_dec = [aeico.prop({ type: String })], _size_dec = [aeico.prop({ type: String })], _pill_dec = [aeico.prop({ type: Boolean })], _a) {
55
- constructor() {
56
- super(...arguments);
57
- __privateAdd(this, _color, __runInitializers(_init, 8, this, "default")), __runInitializers(_init, 11, this);
58
- __privateAdd(this, _variant, __runInitializers(_init, 12, this, "filled")), __runInitializers(_init, 15, this);
59
- __privateAdd(this, _size, __runInitializers(_init, 16, this, "md")), __runInitializers(_init, 19, this);
60
- __privateAdd(this, _pill, __runInitializers(_init, 20, this, false)), __runInitializers(_init, 23, this);
61
- }
62
- render() {
63
- return aeico.html(({ span, slot }) => {
64
- span({ part: "badge", className: "badge" }, () => {
65
- slot({ name: "start" });
66
- slot();
67
- slot({ name: "end" });
68
- });
69
- });
70
- }
71
- }
72
- _init = __decoratorStart(_a);
73
- _color = /* @__PURE__ */ new WeakMap();
74
- _variant = /* @__PURE__ */ new WeakMap();
75
- _size = /* @__PURE__ */ new WeakMap();
76
- _pill = /* @__PURE__ */ new WeakMap();
77
- __decorateElement(_init, 4, "color", _color_dec, Badge, _color);
78
- __decorateElement(_init, 4, "variant", _variant_dec, Badge, _variant);
79
- __decorateElement(_init, 4, "size", _size_dec, Badge, _size);
80
- __decorateElement(_init, 4, "pill", _pill_dec, Badge, _pill);
81
- __decoratorMetadata(_init, Badge);
82
- __publicField(Badge, "styles", [variables.variables, size.sizeCSS, color.colorCSS, badgeStyle]);
83
- Badge.register();
84
- exports.Badge = Badge;
85
- //# sourceMappingURL=badge.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"badge.cjs","sources":["../../src/badge/badge.ts"],"sourcesContent":["import type { InferProps } from 'aeico';\nimport styleVariables from '../styles/variables.css?inline';\nimport sizeCSS from '../styles/size.css?inline';\nimport colorCSS from '../styles/color.css?inline';\nimport badgeStyle from '../styles/components/badge.css?inline';\nimport AeicoComponent from '../aeico-component';\nimport { html } from 'aeico';\nimport type { BadgeColor, BadgeSize, BadgeVariant } from './defines';\nimport { prop } from 'aeico';\n\n/**\n * Badge Component\n *\n * A small inline label for status, category, or count indicators.\n * Supports color, variant, size, and an optional leading/trailing ae-icon slot.\n *\n * @example\n * ```html\n * <ae-badge color=\"primary\">New</ae-badge>\n * <ae-badge variant=\"outlined\" color=\"success\">Active</ae-badge>\n * <ae-badge variant=\"subtle\" color=\"danger\" size=\"sm\">\n * <ae-icon slot=\"start\" name=\"warning\"></ae-icon>\n * Error\n * </ae-badge>\n * ```\n */\nclass Badge extends AeicoComponent {\n protected static styles = [styleVariables, sizeCSS, colorCSS, badgeStyle];\n\n @prop({ type: String })\n accessor color: BadgeColor = 'default';\n\n @prop({ type: String })\n accessor variant: BadgeVariant = 'filled';\n\n @prop({ type: String })\n accessor size: BadgeSize = 'md';\n\n @prop({ type: Boolean })\n accessor pill: boolean = false;\n\n protected render() {\n return html(({ span, slot }) => {\n span({ part: 'badge', className: 'badge' }, () => {\n slot({ name: 'start' });\n slot();\n slot({ name: 'end' });\n });\n });\n }\n}\n\nBadge.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-badge': Badge;\n }\n}\n\nexport default Badge;\nexport type BadgeProps = InferProps<typeof Badge>;\n"],"names":["AeicoComponent","prop","html","styleVariables","sizeCSS","colorCSS"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAA,WAAA,WAAA,cAAA,YAAA,IAAA,OAAA,QAAA,UAAA,OAAA;AA0BA,MAAM,eAAc,KAAAA,eAAAA,gBAGlB,aAAA,CAACC,MAAAA,KAAK,EAAE,MAAM,OAAA,CAAQ,CAAA,GAGtB,eAAA,CAACA,MAAAA,KAAK,EAAE,MAAM,OAAA,CAAQ,CAAA,GAGtB,YAAA,CAACA,MAAAA,KAAK,EAAE,MAAM,OAAA,CAAQ,CAAA,GAGtB,YAAA,CAACA,MAAAA,KAAK,EAAE,MAAM,QAAA,CAAS,IAZL,IAAe;AAAA,EAAnC,cAAA;AAAA,UAAA,GAAA,SAAA;AAIE,iBAAA,MAAS,QAAoB,kBAA7B,OAAA,GAAA,MAA6B,SAAA,CAAA,GAA7B,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,UAAwB,kBAAjC,OAAA,IAAA,MAAiC,QAAA,CAAA,GAAjC,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,OAAkB,kBAA3B,OAAA,IAAA,MAA2B,IAAA,CAAA,GAA3B,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,OAAgB,kBAAzB,OAAA,IAAA,MAAyB,KAAA,CAAA,GAAzB,kBAAA,OAAA,IAAA,IAAA;AAAA,EAAA;AAAA,EAEU,SAAS;AACjB,WAAOC,WAAK,CAAC,EAAE,MAAM,WAAW;AAC9B,WAAK,EAAE,MAAM,SAAS,WAAW,QAAA,GAAW,MAAM;AAChD,aAAK,EAAE,MAAM,SAAS;AACtB,aAAA;AACA,aAAK,EAAE,MAAM,OAAO;AAAA,MACtB,CAAC;AAAA,IACH,CAAC;AAAA,EACH;AACF;AAxBA,QAAA,iBAAA,EAAA;AAIW,SAAA,oBAAA,QAAA;AAGA,WAAA,oBAAA,QAAA;AAGA,QAAA,oBAAA,QAAA;AAGA,QAAA,oBAAA,QAAA;AATT,kBAAA,OAAA,GAAS,SADT,YAHI,OAIK,MAAA;AAGT,kBAAA,OAAA,GAAS,WADT,cANI,OAOK,QAAA;AAGT,kBAAA,OAAA,GAAS,QADT,WATI,OAUK,KAAA;AAGT,kBAAA,OAAA,GAAS,QADT,WAZI,OAaK,KAAA;AAbX,oBAAA,OAAM,KAAA;AACJ,cADI,OACa,UAAS,CAACC,UAAAA,WAAgBC,KAAAA,SAASC,MAAAA,UAAU,UAAU,CAAA;AAyB1E,MAAM,SAAA;;"}
@@ -1,86 +0,0 @@
1
- import { v as variables } from "./variables.js";
2
- import { s as sizeCSS } from "./size.js";
3
- import { c as colorCSS } from "./color.js";
4
- import { A as AeicoComponent } from "./aeico-component.js";
5
- import { prop, html } from "aeico";
6
- const badgeStyle = ':host {\n display: inline-flex;\n align-items: center;\n --badge-solid-bg: var(--color-solid);\n --badge-solid-color: var(--color-on-solid);\n --badge-border: var(--color-border);\n --badge-accent: var(--color-accent);\n --badge-subtle-bg: var(--color-bg-subtle);\n --badge-subtle-color: var(--color-text-subtle);\n --badge-subtle-border: var(--color-border-subtle);\n}\n\n.badge {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n font-family: inherit;\n font-weight: 500;\n white-space: nowrap;\n vertical-align: middle;\n line-height: 1.2;\n font-size: 1em;\n padding: 0.15em 0.6em;\n border-radius: 4px;\n border: 1px solid var(--badge-solid-bg);\n background: var(--badge-solid-bg);\n color: var(--badge-solid-color);\n}\n\n/* Default (no [variant]) = filled */\n\n/* --- Variants --- */\n\n:host([variant="outlined"]) .badge {\n background: transparent;\n border-color: var(--badge-border);\n color: var(--badge-accent);\n}\n\n:host([variant="faint"]) .badge {\n background: var(--badge-subtle-bg);\n border-color: var(--badge-subtle-border);\n color: var(--badge-subtle-color);\n}\n\n:host([variant="subtle"]) .badge {\n background: var(--badge-subtle-bg);\n border-color: transparent;\n color: var(--badge-subtle-color);\n}\n\n:host([variant="text"]) .badge {\n background: transparent;\n border-color: transparent;\n color: var(--badge-accent);\n padding-left: 0;\n padding-right: 0;\n}\n\n:host([pill]) .badge {\n border-radius: 999px;\n}\n\n/* Icon slots */\n::slotted(ae-icon) {\n font-size: 1.1em;\n}\n';
7
- var __create = Object.create;
8
- var __defProp = Object.defineProperty;
9
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
10
- var __knownSymbol = (name, symbol) => (symbol = Symbol[name]) ? symbol : Symbol.for("Symbol." + name);
11
- var __typeError = (msg) => {
12
- throw TypeError(msg);
13
- };
14
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
15
- var __decoratorStart = (base) => [, , , __create((base == null ? void 0 : base[__knownSymbol("metadata")]) ?? null)];
16
- var __decoratorStrings = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"];
17
- var __expectFn = (fn) => fn !== void 0 && typeof fn !== "function" ? __typeError("Function expected") : fn;
18
- var __decoratorContext = (kind, name, done, metadata, fns) => ({ kind: __decoratorStrings[kind], name, metadata, addInitializer: (fn) => done._ ? __typeError("Already initialized") : fns.push(__expectFn(fn || null)) });
19
- var __decoratorMetadata = (array, target) => __defNormalProp(target, __knownSymbol("metadata"), array[3]);
20
- var __runInitializers = (array, flags, self, value) => {
21
- for (var i = 0, fns = array[flags >> 1], n = fns && fns.length; i < n; i++) flags & 1 ? fns[i].call(self) : value = fns[i].call(self, value);
22
- return value;
23
- };
24
- var __decorateElement = (array, flags, name, decorators, target, extra) => {
25
- var fn, it, done, ctx, access, k = flags & 7, s = false, p = false;
26
- var j = array.length + 1, key = __decoratorStrings[k + 5];
27
- var initializers = array[j - 1] = [], extraInitializers = array[j] || (array[j] = []);
28
- var desc = (target = target.prototype, __getOwnPropDesc({ get [name]() {
29
- return __privateGet(this, extra);
30
- }, set [name](x) {
31
- return __privateSet(this, extra, x);
32
- } }, name));
33
- for (var i = decorators.length - 1; i >= 0; i--) {
34
- ctx = __decoratorContext(k, name, done = {}, array[3], extraInitializers);
35
- {
36
- ctx.static = s, ctx.private = p, access = ctx.access = { has: (x) => name in x };
37
- access.get = (x) => x[name];
38
- access.set = (x, y) => x[name] = y;
39
- }
40
- it = (0, decorators[i])({ get: desc.get, set: desc.set }, ctx), done._ = 1;
41
- if (it === void 0) __expectFn(it) && (desc[key] = it);
42
- else if (typeof it !== "object" || it === null) __typeError("Object expected");
43
- else __expectFn(fn = it.get) && (desc.get = fn), __expectFn(fn = it.set) && (desc.set = fn), __expectFn(fn = it.init) && initializers.unshift(fn);
44
- }
45
- return desc && __defProp(target, name, desc), target;
46
- };
47
- var __publicField = (obj, key, value) => __defNormalProp(obj, key + "", value);
48
- var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
49
- var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), member.get(obj));
50
- var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
51
- var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
52
- var _pill_dec, _size_dec, _variant_dec, _color_dec, _a, _init, _color, _variant, _size, _pill;
53
- class Badge extends (_a = AeicoComponent, _color_dec = [prop({ type: String })], _variant_dec = [prop({ type: String })], _size_dec = [prop({ type: String })], _pill_dec = [prop({ type: Boolean })], _a) {
54
- constructor() {
55
- super(...arguments);
56
- __privateAdd(this, _color, __runInitializers(_init, 8, this, "default")), __runInitializers(_init, 11, this);
57
- __privateAdd(this, _variant, __runInitializers(_init, 12, this, "filled")), __runInitializers(_init, 15, this);
58
- __privateAdd(this, _size, __runInitializers(_init, 16, this, "md")), __runInitializers(_init, 19, this);
59
- __privateAdd(this, _pill, __runInitializers(_init, 20, this, false)), __runInitializers(_init, 23, this);
60
- }
61
- render() {
62
- return html(({ span, slot }) => {
63
- span({ part: "badge", className: "badge" }, () => {
64
- slot({ name: "start" });
65
- slot();
66
- slot({ name: "end" });
67
- });
68
- });
69
- }
70
- }
71
- _init = __decoratorStart(_a);
72
- _color = /* @__PURE__ */ new WeakMap();
73
- _variant = /* @__PURE__ */ new WeakMap();
74
- _size = /* @__PURE__ */ new WeakMap();
75
- _pill = /* @__PURE__ */ new WeakMap();
76
- __decorateElement(_init, 4, "color", _color_dec, Badge, _color);
77
- __decorateElement(_init, 4, "variant", _variant_dec, Badge, _variant);
78
- __decorateElement(_init, 4, "size", _size_dec, Badge, _size);
79
- __decorateElement(_init, 4, "pill", _pill_dec, Badge, _pill);
80
- __decoratorMetadata(_init, Badge);
81
- __publicField(Badge, "styles", [variables, sizeCSS, colorCSS, badgeStyle]);
82
- Badge.register();
83
- export {
84
- Badge as B
85
- };
86
- //# sourceMappingURL=badge.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"badge.js","sources":["../../src/badge/badge.ts"],"sourcesContent":["import type { InferProps } from 'aeico';\nimport styleVariables from '../styles/variables.css?inline';\nimport sizeCSS from '../styles/size.css?inline';\nimport colorCSS from '../styles/color.css?inline';\nimport badgeStyle from '../styles/components/badge.css?inline';\nimport AeicoComponent from '../aeico-component';\nimport { html } from 'aeico';\nimport type { BadgeColor, BadgeSize, BadgeVariant } from './defines';\nimport { prop } from 'aeico';\n\n/**\n * Badge Component\n *\n * A small inline label for status, category, or count indicators.\n * Supports color, variant, size, and an optional leading/trailing ae-icon slot.\n *\n * @example\n * ```html\n * <ae-badge color=\"primary\">New</ae-badge>\n * <ae-badge variant=\"outlined\" color=\"success\">Active</ae-badge>\n * <ae-badge variant=\"subtle\" color=\"danger\" size=\"sm\">\n * <ae-icon slot=\"start\" name=\"warning\"></ae-icon>\n * Error\n * </ae-badge>\n * ```\n */\nclass Badge extends AeicoComponent {\n protected static styles = [styleVariables, sizeCSS, colorCSS, badgeStyle];\n\n @prop({ type: String })\n accessor color: BadgeColor = 'default';\n\n @prop({ type: String })\n accessor variant: BadgeVariant = 'filled';\n\n @prop({ type: String })\n accessor size: BadgeSize = 'md';\n\n @prop({ type: Boolean })\n accessor pill: boolean = false;\n\n protected render() {\n return html(({ span, slot }) => {\n span({ part: 'badge', className: 'badge' }, () => {\n slot({ name: 'start' });\n slot();\n slot({ name: 'end' });\n });\n });\n }\n}\n\nBadge.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-badge': Badge;\n }\n}\n\nexport default Badge;\nexport type BadgeProps = InferProps<typeof Badge>;\n"],"names":["styleVariables"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAA,WAAA,WAAA,cAAA,YAAA,IAAA,OAAA,QAAA,UAAA,OAAA;AA0BA,MAAM,eAAc,KAAA,gBAGlB,aAAA,CAAC,KAAK,EAAE,MAAM,OAAA,CAAQ,CAAA,GAGtB,eAAA,CAAC,KAAK,EAAE,MAAM,OAAA,CAAQ,CAAA,GAGtB,YAAA,CAAC,KAAK,EAAE,MAAM,OAAA,CAAQ,CAAA,GAGtB,YAAA,CAAC,KAAK,EAAE,MAAM,QAAA,CAAS,IAZL,IAAe;AAAA,EAAnC,cAAA;AAAA,UAAA,GAAA,SAAA;AAIE,iBAAA,MAAS,QAAoB,kBAA7B,OAAA,GAAA,MAA6B,SAAA,CAAA,GAA7B,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,UAAwB,kBAAjC,OAAA,IAAA,MAAiC,QAAA,CAAA,GAAjC,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,OAAkB,kBAA3B,OAAA,IAAA,MAA2B,IAAA,CAAA,GAA3B,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,OAAgB,kBAAzB,OAAA,IAAA,MAAyB,KAAA,CAAA,GAAzB,kBAAA,OAAA,IAAA,IAAA;AAAA,EAAA;AAAA,EAEU,SAAS;AACjB,WAAO,KAAK,CAAC,EAAE,MAAM,WAAW;AAC9B,WAAK,EAAE,MAAM,SAAS,WAAW,QAAA,GAAW,MAAM;AAChD,aAAK,EAAE,MAAM,SAAS;AACtB,aAAA;AACA,aAAK,EAAE,MAAM,OAAO;AAAA,MACtB,CAAC;AAAA,IACH,CAAC;AAAA,EACH;AACF;AAxBA,QAAA,iBAAA,EAAA;AAIW,SAAA,oBAAA,QAAA;AAGA,WAAA,oBAAA,QAAA;AAGA,QAAA,oBAAA,QAAA;AAGA,QAAA,oBAAA,QAAA;AATT,kBAAA,OAAA,GAAS,SADT,YAHI,OAIK,MAAA;AAGT,kBAAA,OAAA,GAAS,WADT,cANI,OAOK,QAAA;AAGT,kBAAA,OAAA,GAAS,QADT,WATI,OAUK,KAAA;AAGT,kBAAA,OAAA,GAAS,QADT,WAZI,OAaK,KAAA;AAbX,oBAAA,OAAM,KAAA;AACJ,cADI,OACa,UAAS,CAACA,WAAgB,SAAS,UAAU,UAAU,CAAA;AAyB1E,MAAM,SAAA;"}
@@ -1,261 +0,0 @@
1
- "use strict";
2
- const variables = require("./variables.cjs");
3
- const color = require("./color.cjs");
4
- const aeicoComponent = require("./aeico-component.cjs");
5
- const aeico = require("aeico");
6
- const style$1 = ":host {\n display: block;\n}\n\n/* Hide the separator template slot visually */\n.sep-template {\n display: none !important;\n}\n\n.list {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n list-style: none;\n margin: 0;\n padding: 0;\n font-size: inherit;\n line-height: 1.5;\n}\n";
7
- var __create$1 = Object.create;
8
- var __defProp$1 = Object.defineProperty;
9
- var __getOwnPropDesc$1 = Object.getOwnPropertyDescriptor;
10
- var __knownSymbol$1 = (name, symbol) => (symbol = Symbol[name]) ? symbol : Symbol.for("Symbol." + name);
11
- var __typeError$1 = (msg) => {
12
- throw TypeError(msg);
13
- };
14
- var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
15
- var __decoratorStart$1 = (base) => [, , , __create$1((base == null ? void 0 : base[__knownSymbol$1("metadata")]) ?? null)];
16
- var __decoratorStrings$1 = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"];
17
- var __expectFn$1 = (fn) => fn !== void 0 && typeof fn !== "function" ? __typeError$1("Function expected") : fn;
18
- var __decoratorContext$1 = (kind, name, done, metadata, fns) => ({ kind: __decoratorStrings$1[kind], name, metadata, addInitializer: (fn) => done._ ? __typeError$1("Already initialized") : fns.push(__expectFn$1(fn || null)) });
19
- var __decoratorMetadata$1 = (array, target) => __defNormalProp$1(target, __knownSymbol$1("metadata"), array[3]);
20
- var __runInitializers$1 = (array, flags, self, value) => {
21
- for (var i = 0, fns = array[flags >> 1], n = fns && fns.length; i < n; i++) flags & 1 ? fns[i].call(self) : value = fns[i].call(self, value);
22
- return value;
23
- };
24
- var __decorateElement$1 = (array, flags, name, decorators, target, extra) => {
25
- var fn, it, done, ctx, access, k = flags & 7, s = false, p = false;
26
- var j = array.length + 1, key = __decoratorStrings$1[k + 5];
27
- var initializers = array[j - 1] = [], extraInitializers = array[j] || (array[j] = []);
28
- var desc = (target = target.prototype, __getOwnPropDesc$1({ get [name]() {
29
- return __privateGet$1(this, extra);
30
- }, set [name](x) {
31
- return __privateSet$1(this, extra, x);
32
- } }, name));
33
- for (var i = decorators.length - 1; i >= 0; i--) {
34
- ctx = __decoratorContext$1(k, name, done = {}, array[3], extraInitializers);
35
- {
36
- ctx.static = s, ctx.private = p, access = ctx.access = { has: (x) => name in x };
37
- access.get = (x) => x[name];
38
- access.set = (x, y) => x[name] = y;
39
- }
40
- it = (0, decorators[i])({ get: desc.get, set: desc.set }, ctx), done._ = 1;
41
- if (it === void 0) __expectFn$1(it) && (desc[key] = it);
42
- else if (typeof it !== "object" || it === null) __typeError$1("Object expected");
43
- else __expectFn$1(fn = it.get) && (desc.get = fn), __expectFn$1(fn = it.set) && (desc.set = fn), __expectFn$1(fn = it.init) && initializers.unshift(fn);
44
- }
45
- return desc && __defProp$1(target, name, desc), target;
46
- };
47
- var __publicField$1 = (obj, key, value) => __defNormalProp$1(obj, typeof key !== "symbol" ? key + "" : key, value);
48
- var __accessCheck$1 = (obj, member, msg) => member.has(obj) || __typeError$1("Cannot " + msg);
49
- var __privateGet$1 = (obj, member, getter) => (__accessCheck$1(obj, member, "read from private field"), member.get(obj));
50
- var __privateAdd$1 = (obj, member, value) => member.has(obj) ? __typeError$1("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
51
- var __privateSet$1 = (obj, member, value, setter) => (__accessCheck$1(obj, member, "write to private field"), member.set(obj, value), value);
52
- var _color_dec, _separator_dec, _a$1, _init$1, _separator, _color;
53
- class Breadcrumb extends (_a$1 = aeicoComponent.AeicoComponent, _separator_dec = [aeico.prop({ type: String })], _color_dec = [aeico.prop({ type: String })], _a$1) {
54
- constructor() {
55
- super(...arguments);
56
- __privateAdd$1(this, _separator, __runInitializers$1(_init$1, 8, this, "/")), __runInitializers$1(_init$1, 11, this);
57
- __privateAdd$1(this, _color, __runInitializers$1(_init$1, 12, this)), __runInitializers$1(_init$1, 15, this);
58
- __publicField$1(this, "_itemsSlot", null);
59
- __publicField$1(this, "_sepSlot", null);
60
- __publicField$1(this, "_syncSeparators", () => {
61
- const items = this._getItems();
62
- const sepEl = this._getSepElement();
63
- items.forEach((item, i) => {
64
- item.querySelectorAll("[data-ae-sep]").forEach((n) => n.remove());
65
- const isLast = i === items.length - 1;
66
- if (isLast) {
67
- item.setAttribute("aria-current", "page");
68
- } else {
69
- item.removeAttribute("aria-current");
70
- }
71
- if (i === 0) return;
72
- const wrapper = document.createElement("span");
73
- wrapper.setAttribute("slot", "separator");
74
- wrapper.setAttribute("data-ae-sep", "");
75
- wrapper.setAttribute("aria-hidden", "true");
76
- if (sepEl) {
77
- wrapper.appendChild(sepEl.cloneNode(true));
78
- } else {
79
- wrapper.textContent = this.separator;
80
- }
81
- item.prepend(wrapper);
82
- });
83
- });
84
- }
85
- render() {
86
- return aeico.html(({ nav, ol, slot }) => {
87
- nav({ "aria-label": "breadcrumb", part: "nav" }, () => {
88
- ol({ part: "list", className: "list" }, () => {
89
- this._itemsSlot = slot({
90
- "@slotchange": () => this._syncSeparators()
91
- });
92
- });
93
- });
94
- this._sepSlot = slot({
95
- name: "separator",
96
- className: "sep-template",
97
- "@slotchange": () => this._syncSeparators()
98
- });
99
- });
100
- }
101
- onUpdated() {
102
- this._syncSeparators();
103
- }
104
- _getItems() {
105
- var _a2;
106
- return ((_a2 = this._itemsSlot) == null ? void 0 : _a2.assignedElements()) ?? [];
107
- }
108
- _getSepElement() {
109
- var _a2;
110
- return ((_a2 = this._sepSlot) == null ? void 0 : _a2.assignedElements()[0]) ?? null;
111
- }
112
- }
113
- _init$1 = __decoratorStart$1(_a$1);
114
- _separator = /* @__PURE__ */ new WeakMap();
115
- _color = /* @__PURE__ */ new WeakMap();
116
- __decorateElement$1(_init$1, 4, "separator", _separator_dec, Breadcrumb, _separator);
117
- __decorateElement$1(_init$1, 4, "color", _color_dec, Breadcrumb, _color);
118
- __decoratorMetadata$1(_init$1, Breadcrumb);
119
- __publicField$1(Breadcrumb, "tagName", "breadcrumb");
120
- __publicField$1(Breadcrumb, "styles", [variables.variables, color.colorCSS, style$1]);
121
- Breadcrumb.register();
122
- const style = `:host {
123
- display: contents;
124
- }
125
-
126
- .item {
127
- display: inline-flex;
128
- align-items: center;
129
- list-style: none;
130
- white-space: nowrap;
131
- }
132
-
133
- /* Separator — uses a fixed muted color that does NOT follow the breadcrumb's color prop */
134
- .sep {
135
- display: inline-flex;
136
- align-items: center;
137
- color: var(--color-text-muted);
138
- padding: 0 0.35em;
139
- user-select: none;
140
- pointer-events: none;
141
- flex-shrink: 0;
142
- font-size: 0.85em;
143
- }
144
-
145
- /* Hide separator on the first item */
146
- :host(:first-child) .sep,
147
- :host(:first-of-type) .sep {
148
- display: none;
149
- }
150
-
151
- .label {
152
- display: inline-flex;
153
- align-items: center;
154
- color: var(--color-text-muted);
155
- }
156
-
157
- /* Current page — last item */
158
- :host([aria-current="page"]) .label {
159
- color: var(--color-text-main);
160
- font-weight: 500;
161
- cursor: default;
162
- }
163
-
164
- /* Link items */
165
- .label a {
166
- color: var(--color-accent, var(--color-text-link));
167
- text-decoration: none;
168
- outline: none;
169
- }
170
-
171
- .label a:hover {
172
- color: var(--color-accent-hover, var(--color-text-link-hover));
173
- text-decoration: underline;
174
- }
175
-
176
- .label a:focus-visible {
177
- outline: 2px solid var(--color-accent, var(--focus-ring-color));
178
- outline-offset: 2px;
179
- border-radius: 2px;
180
- }
181
- `;
182
- var __create = Object.create;
183
- var __defProp = Object.defineProperty;
184
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
185
- var __knownSymbol = (name, symbol) => (symbol = Symbol[name]) ? symbol : Symbol.for("Symbol." + name);
186
- var __typeError = (msg) => {
187
- throw TypeError(msg);
188
- };
189
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
190
- var __decoratorStart = (base) => [, , , __create((base == null ? void 0 : base[__knownSymbol("metadata")]) ?? null)];
191
- var __decoratorStrings = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"];
192
- var __expectFn = (fn) => fn !== void 0 && typeof fn !== "function" ? __typeError("Function expected") : fn;
193
- var __decoratorContext = (kind, name, done, metadata, fns) => ({ kind: __decoratorStrings[kind], name, metadata, addInitializer: (fn) => done._ ? __typeError("Already initialized") : fns.push(__expectFn(fn || null)) });
194
- var __decoratorMetadata = (array, target) => __defNormalProp(target, __knownSymbol("metadata"), array[3]);
195
- var __runInitializers = (array, flags, self, value) => {
196
- for (var i = 0, fns = array[flags >> 1], n = fns && fns.length; i < n; i++) flags & 1 ? fns[i].call(self) : value = fns[i].call(self, value);
197
- return value;
198
- };
199
- var __decorateElement = (array, flags, name, decorators, target, extra) => {
200
- var fn, it, done, ctx, access, k = flags & 7, s = false, p = false;
201
- var j = array.length + 1, key = __decoratorStrings[k + 5];
202
- var initializers = array[j - 1] = [], extraInitializers = array[j] || (array[j] = []);
203
- var desc = (target = target.prototype, __getOwnPropDesc({ get [name]() {
204
- return __privateGet(this, extra);
205
- }, set [name](x) {
206
- return __privateSet(this, extra, x);
207
- } }, name));
208
- for (var i = decorators.length - 1; i >= 0; i--) {
209
- ctx = __decoratorContext(k, name, done = {}, array[3], extraInitializers);
210
- {
211
- ctx.static = s, ctx.private = p, access = ctx.access = { has: (x) => name in x };
212
- access.get = (x) => x[name];
213
- access.set = (x, y) => x[name] = y;
214
- }
215
- it = (0, decorators[i])({ get: desc.get, set: desc.set }, ctx), done._ = 1;
216
- if (it === void 0) __expectFn(it) && (desc[key] = it);
217
- else if (typeof it !== "object" || it === null) __typeError("Object expected");
218
- else __expectFn(fn = it.get) && (desc.get = fn), __expectFn(fn = it.set) && (desc.set = fn), __expectFn(fn = it.init) && initializers.unshift(fn);
219
- }
220
- return desc && __defProp(target, name, desc), target;
221
- };
222
- var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
223
- var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
224
- var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), member.get(obj));
225
- var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
226
- var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
227
- var _href_dec, _a, _init, _href;
228
- class BreadcrumbItem extends (_a = aeicoComponent.AeicoComponent, _href_dec = [aeico.prop({ type: String })], _a) {
229
- constructor() {
230
- super(...arguments);
231
- __privateAdd(this, _href, __runInitializers(_init, 8, this)), __runInitializers(_init, 11, this);
232
- }
233
- render() {
234
- return aeico.html(({ li, span, slot, a }) => {
235
- li({ part: "item", className: "item" }, () => {
236
- span({ part: "separator", className: "sep", "aria-hidden": "true" }, () => {
237
- slot({ name: "separator" });
238
- });
239
- span({ part: "label", className: "label" }, () => {
240
- if (this.href) {
241
- a({ href: this.href, part: "link" }, () => {
242
- slot();
243
- });
244
- } else {
245
- slot();
246
- }
247
- });
248
- });
249
- });
250
- }
251
- }
252
- _init = __decoratorStart(_a);
253
- _href = /* @__PURE__ */ new WeakMap();
254
- __decorateElement(_init, 4, "href", _href_dec, BreadcrumbItem, _href);
255
- __decoratorMetadata(_init, BreadcrumbItem);
256
- __publicField(BreadcrumbItem, "tagName", "breadcrumb-item");
257
- __publicField(BreadcrumbItem, "styles", [variables.variables, style]);
258
- BreadcrumbItem.register();
259
- exports.Breadcrumb = Breadcrumb;
260
- exports.BreadcrumbItem = BreadcrumbItem;
261
- //# sourceMappingURL=breadcrumb-item.cjs.map