aeico-components 0.1.8 → 0.1.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +0 -0
- package/dist/alert.cjs +20 -29
- package/dist/alert.cjs.map +3 -3
- package/dist/alert.js +20 -29
- package/dist/alert.js.map +3 -3
- package/dist/badge.cjs +19 -28
- package/dist/badge.cjs.map +3 -3
- package/dist/badge.js +19 -28
- package/dist/badge.js.map +3 -3
- package/dist/breadcrumb.cjs +22 -33
- package/dist/breadcrumb.cjs.map +3 -3
- package/dist/breadcrumb.js +22 -33
- package/dist/breadcrumb.js.map +3 -3
- package/dist/button-group.cjs +19 -28
- package/dist/button-group.cjs.map +3 -3
- package/dist/button-group.js +19 -28
- package/dist/button-group.js.map +3 -3
- package/dist/button.cjs +19 -29
- package/dist/button.cjs.map +3 -3
- package/dist/button.js +19 -29
- package/dist/button.js.map +3 -3
- package/dist/card.cjs +19 -29
- package/dist/card.cjs.map +3 -3
- package/dist/card.js +19 -29
- package/dist/card.js.map +3 -3
- package/dist/checkbox.cjs +21 -31
- package/dist/checkbox.cjs.map +3 -3
- package/dist/checkbox.js +21 -31
- package/dist/checkbox.js.map +3 -3
- package/dist/copy-button.cjs +25 -33
- package/dist/copy-button.cjs.map +2 -2
- package/dist/copy-button.js +25 -33
- package/dist/copy-button.js.map +3 -3
- package/dist/detail-group.cjs +19 -29
- package/dist/detail-group.cjs.map +3 -3
- package/dist/detail-group.js +19 -29
- package/dist/detail-group.js.map +3 -3
- package/dist/detail.cjs +19 -29
- package/dist/detail.cjs.map +3 -3
- package/dist/detail.js +19 -29
- package/dist/detail.js.map +3 -3
- package/dist/dialog.cjs +24 -32
- package/dist/dialog.cjs.map +2 -2
- package/dist/dialog.js +24 -32
- package/dist/dialog.js.map +3 -3
- package/dist/divider.cjs +20 -30
- package/dist/divider.cjs.map +3 -3
- package/dist/divider.js +20 -30
- package/dist/divider.js.map +3 -3
- package/dist/drawer.cjs +24 -32
- package/dist/drawer.cjs.map +2 -2
- package/dist/drawer.js +24 -32
- package/dist/drawer.js.map +3 -3
- package/dist/dropdown.cjs +31 -43
- package/dist/dropdown.cjs.map +3 -3
- package/dist/dropdown.js +31 -43
- package/dist/dropdown.js.map +3 -3
- package/dist/icon-button.cjs +25 -35
- package/dist/icon-button.cjs.map +3 -3
- package/dist/icon-button.js +25 -35
- package/dist/icon-button.js.map +3 -3
- package/dist/icon.cjs +20 -26
- package/dist/icon.cjs.map +2 -2
- package/dist/icon.js +20 -26
- package/dist/icon.js.map +2 -2
- package/dist/index.cjs +75 -113
- package/dist/index.cjs.map +3 -3
- package/dist/index.js +75 -113
- package/dist/index.js.map +3 -3
- package/dist/menu.cjs +20 -31
- package/dist/menu.cjs.map +3 -3
- package/dist/menu.js +20 -31
- package/dist/menu.js.map +3 -3
- package/dist/navbar.cjs +19 -29
- package/dist/navbar.cjs.map +3 -3
- package/dist/navbar.js +19 -29
- package/dist/navbar.js.map +3 -3
- package/dist/number-input.cjs +21 -31
- package/dist/number-input.cjs.map +3 -3
- package/dist/number-input.js +21 -31
- package/dist/number-input.js.map +3 -3
- package/dist/pagination.cjs +24 -33
- package/dist/pagination.cjs.map +2 -2
- package/dist/pagination.js +24 -33
- package/dist/pagination.js.map +3 -3
- package/dist/progress-bar.cjs +19 -29
- package/dist/progress-bar.cjs.map +3 -3
- package/dist/progress-bar.js +19 -29
- package/dist/progress-bar.js.map +3 -3
- package/dist/radio-group.cjs +24 -35
- package/dist/radio-group.cjs.map +3 -3
- package/dist/radio-group.js +24 -35
- package/dist/radio-group.js.map +3 -3
- package/dist/select.cjs +23 -34
- package/dist/select.cjs.map +3 -3
- package/dist/select.js +23 -34
- package/dist/select.js.map +3 -3
- package/dist/slider.cjs +21 -32
- package/dist/slider.cjs.map +3 -3
- package/dist/slider.js +21 -32
- package/dist/slider.js.map +3 -3
- package/dist/spinner.cjs +19 -29
- package/dist/spinner.cjs.map +3 -3
- package/dist/spinner.js +19 -29
- package/dist/spinner.js.map +3 -3
- package/dist/styles/layout.cjs +1 -1
- package/dist/styles/layout.js +1 -1
- package/dist/styles/radius.cjs +1 -1
- package/dist/styles/radius.js +1 -1
- package/dist/styles/variables.cjs +1 -1
- package/dist/styles/variables.js +1 -1
- package/dist/switch.cjs +26 -35
- package/dist/switch.cjs.map +3 -3
- package/dist/switch.js +26 -35
- package/dist/switch.js.map +3 -3
- package/dist/tabs.cjs +21 -30
- package/dist/tabs.cjs.map +3 -3
- package/dist/tabs.js +21 -30
- package/dist/tabs.js.map +3 -3
- package/dist/tag.cjs +19 -28
- package/dist/tag.cjs.map +3 -3
- package/dist/tag.js +19 -28
- package/dist/tag.js.map +3 -3
- package/dist/text-input.cjs +21 -31
- package/dist/text-input.cjs.map +3 -3
- package/dist/text-input.js +21 -31
- package/dist/text-input.js.map +3 -3
- package/dist/textarea.cjs +21 -31
- package/dist/textarea.cjs.map +3 -3
- package/dist/textarea.js +21 -31
- package/dist/textarea.js.map +3 -3
- package/dist/tooltip.cjs +19 -28
- package/dist/tooltip.cjs.map +3 -3
- package/dist/tooltip.js +19 -28
- package/dist/tooltip.js.map +3 -3
- package/dist/tree.cjs +25 -35
- package/dist/tree.cjs.map +3 -3
- package/dist/tree.js +25 -35
- package/dist/tree.js.map +3 -3
- package/dist/types/aeico-component.d.ts +1 -1
- package/dist/types/aeico-field.d.ts +1 -1
- package/dist/types/breadcrumb/breadcrumb-item.d.ts +0 -1
- package/dist/types/breadcrumb/breadcrumb.d.ts +2 -3
- package/dist/types/button-group/button-group.d.ts +1 -1
- package/dist/types/card/card.d.ts +0 -1
- package/dist/types/checkbox/checkbox.d.ts +0 -1
- package/dist/types/detail/detail.d.ts +0 -1
- package/dist/types/detail-group/detail-group.d.ts +1 -2
- package/dist/types/divider/divider.d.ts +0 -1
- package/dist/types/dropdown/dropdown-button.d.ts +4 -5
- package/dist/types/dropdown/dropdown-item.d.ts +3 -4
- package/dist/types/dropdown/dropdown.d.ts +4 -5
- package/dist/types/icon/icon.d.ts +0 -1
- package/dist/types/icon/registry.d.ts +1 -1
- package/dist/types/icon-button/icon-button.d.ts +0 -1
- package/dist/types/index.d.ts +4 -4
- package/dist/types/menu/menu-item.d.ts +3 -4
- package/dist/types/menu/menu.d.ts +3 -4
- package/dist/types/navbar/navbar.d.ts +5 -6
- package/dist/types/number-input/number-input.d.ts +0 -1
- package/dist/types/pagination/pagination.d.ts +0 -1
- package/dist/types/progress-bar/progress-bar.d.ts +0 -1
- package/dist/types/radio-group/radio-group.d.ts +0 -1
- package/dist/types/radio-group/radio.d.ts +6 -7
- package/dist/types/select/select-option.d.ts +0 -1
- package/dist/types/select/select.d.ts +0 -1
- package/dist/types/slider/defines.d.ts +5 -5
- package/dist/types/slider/slider.d.ts +0 -1
- package/dist/types/spinner/spinner.d.ts +1 -2
- package/dist/types/switch/switch.d.ts +0 -1
- package/dist/types/text-input/text-input.d.ts +0 -1
- package/dist/types/textarea/textarea.d.ts +0 -1
- package/dist/types/tree/tree-item.d.ts +1 -2
- package/dist/types/tree/tree.d.ts +0 -1
- package/package.json +5 -3
- package/src/aeico-component.ts +6 -5
- package/src/aeico-field.ts +2 -2
- package/src/alert/alert.ts +2 -2
- package/src/badge/badge.ts +2 -2
- package/src/breadcrumb/breadcrumb-item.ts +2 -4
- package/src/breadcrumb/breadcrumb.ts +4 -6
- package/src/button/button.ts +2 -2
- package/src/button-group/button-group.ts +3 -3
- package/src/card/card.ts +2 -4
- package/src/card/defines.ts +1 -1
- package/src/card/index.ts +1 -1
- package/src/checkbox/checkbox.ts +2 -4
- package/src/copy-button/copy-button.ts +1 -1
- package/src/detail/detail.ts +2 -4
- package/src/detail-group/detail-group.ts +2 -4
- package/src/dialog/dialog.ts +2 -2
- package/src/divider/divider.ts +2 -4
- package/src/drawer/drawer.ts +2 -2
- package/src/dropdown/dropdown-button.ts +6 -8
- package/src/dropdown/dropdown-item.ts +5 -7
- package/src/dropdown/dropdown.ts +7 -9
- package/src/icon/icon.ts +2 -4
- package/src/icon/registry.ts +1 -1
- package/src/icon-button/icon-button.ts +2 -4
- package/src/index.ts +4 -4
- package/src/menu/menu-item.ts +5 -7
- package/src/menu/menu.ts +4 -6
- package/src/navbar/navbar.ts +7 -9
- package/src/number-input/number-input.ts +1 -3
- package/src/pagination/pagination.ts +1 -3
- package/src/progress-bar/progress-bar.ts +1 -2
- package/src/radio-group/radio-group.ts +5 -7
- package/src/radio-group/radio.ts +8 -10
- package/src/select/select-option.ts +2 -4
- package/src/select/select.ts +4 -6
- package/src/slider/defines.ts +5 -5
- package/src/slider/slider.ts +5 -8
- package/src/spinner/spinner.ts +2 -4
- package/src/styles/components/action-button.css +1 -1
- package/src/styles/components/alert.css +1 -1
- package/src/styles/components/breadcrumb-item.css +2 -2
- package/src/styles/components/button.css +0 -1
- package/src/styles/components/divider.css +1 -1
- package/src/styles/components/dropdown-item.css +2 -2
- package/src/styles/components/dropdown.css +1 -1
- package/src/styles/layout.css +14 -14
- package/src/styles/radius.css +1 -1
- package/src/styles/variables.css +14 -16
- package/src/switch/switch.ts +2 -4
- package/src/tabs/tab-panel.ts +2 -2
- package/src/tabs/tab.ts +2 -2
- package/src/tabs/tabs.ts +2 -2
- package/src/tag/tag.ts +2 -2
- package/src/text-input/text-input.ts +2 -4
- package/src/textarea/textarea.ts +1 -3
- package/src/tooltip/tooltip.ts +1 -1
- package/src/tree/tree-item.ts +3 -5
- package/src/tree/tree.ts +2 -4
package/dist/copy-button.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["css-inline:/home/runner/work/aeico-components/aeico-components/src/styles/variables.css", "css-inline:/home/runner/work/aeico-components/aeico-components/src/styles/size.css", "css-inline:/home/runner/work/aeico-components/aeico-components/src/styles/color.css", "css-inline:/home/runner/work/aeico-components/aeico-components/src/styles/components/copy-button.css", "../src/aeico-component.ts", "../src/
|
|
4
|
-
"sourcesContent": ["export default \":root,\\n:host {\\n --ae-font-sans-serif: system-ui, -apple-system, \\\"Segoe UI\\\", Roboto, \\\"Helvetica Neue\\\",\\n \\\"Noto Sans\\\", \\\"Liberation Sans\\\", Arial, sans-serif,\\n \\\"Apple Color Emoji\\\", \\\"Segoe UI Emoji\\\", \\\"Segoe UI Symbol\\\", \\\"Noto Color Emoji\\\";\\n --ae-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas,\\n \\\"Liberation Mono\\\", \\\"Courier New\\\", monospace;\\n font-family: var(--ae-font-sans-serif);\\n --ae-blue: #0e639c;\\n --ae-green: #28a745;\\n --ae-red: #dc3545;\\n --ae-yellow: #ffc107;\\n --ae-cyan: #17a2b8;\\n --ae-gray: #6e6e6e;\\n --ae-slate: #64748b;\\n --ae-dark: #343a40;\\n --ae-light: #f8f9fa;\\n}\\n\\n:root,\\n:host {\\n /* Blue */\\n --ae-blue-100: color-mix(in srgb, var(--ae-blue) 20%, white);\\n --ae-blue-200: color-mix(in srgb, var(--ae-blue) 40%, white);\\n --ae-blue-300: color-mix(in srgb, var(--ae-blue) 60%, white);\\n --ae-blue-400: color-mix(in srgb, var(--ae-blue) 80%, white);\\n --ae-blue-500: var(--ae-blue);\\n --ae-blue-600: color-mix(in srgb, var(--ae-blue) 80%, black);\\n --ae-blue-700: color-mix(in srgb, var(--ae-blue) 60%, black);\\n --ae-blue-800: color-mix(in srgb, var(--ae-blue) 40%, black);\\n --ae-blue-900: color-mix(in srgb, var(--ae-blue) 20%, black);\\n\\n /* Green */\\n --ae-green-100: color-mix(in srgb, var(--ae-green) 20%, white);\\n --ae-green-200: color-mix(in srgb, var(--ae-green) 40%, white);\\n --ae-green-300: color-mix(in srgb, var(--ae-green) 60%, white);\\n --ae-green-400: color-mix(in srgb, var(--ae-green) 80%, white);\\n --ae-green-500: var(--ae-green);\\n --ae-green-600: color-mix(in srgb, var(--ae-green) 80%, black);\\n --ae-green-700: color-mix(in srgb, var(--ae-green) 60%, black);\\n --ae-green-800: color-mix(in srgb, var(--ae-green) 40%, black);\\n --ae-green-900: color-mix(in srgb, var(--ae-green) 20%, black);\\n\\n /* Red */\\n --ae-red-100: color-mix(in srgb, var(--ae-red) 20%, white);\\n --ae-red-200: color-mix(in srgb, var(--ae-red) 40%, white);\\n --ae-red-300: color-mix(in srgb, var(--ae-red) 60%, white);\\n --ae-red-400: color-mix(in srgb, var(--ae-red) 80%, white);\\n --ae-red-500: var(--ae-red);\\n --ae-red-600: color-mix(in srgb, var(--ae-red) 80%, black);\\n --ae-red-700: color-mix(in srgb, var(--ae-red) 60%, black);\\n --ae-red-800: color-mix(in srgb, var(--ae-red) 40%, black);\\n --ae-red-900: color-mix(in srgb, var(--ae-red) 20%, black);\\n\\n /* Yellow */\\n --ae-yellow-100: color-mix(in srgb, var(--ae-yellow) 20%, white);\\n --ae-yellow-200: color-mix(in srgb, var(--ae-yellow) 40%, white);\\n --ae-yellow-300: color-mix(in srgb, var(--ae-yellow) 60%, white);\\n --ae-yellow-400: color-mix(in srgb, var(--ae-yellow) 80%, white);\\n --ae-yellow-500: var(--ae-yellow);\\n --ae-yellow-600: color-mix(in srgb, var(--ae-yellow) 80%, black);\\n --ae-yellow-700: color-mix(in srgb, var(--ae-yellow) 60%, black);\\n --ae-yellow-800: color-mix(in srgb, var(--ae-yellow) 40%, black);\\n --ae-yellow-900: color-mix(in srgb, var(--ae-yellow) 20%, black);\\n\\n /* Cyan */\\n --ae-cyan-100: color-mix(in srgb, var(--ae-cyan) 20%, white);\\n --ae-cyan-200: color-mix(in srgb, var(--ae-cyan) 40%, white);\\n --ae-cyan-300: color-mix(in srgb, var(--ae-cyan) 60%, white);\\n --ae-cyan-400: color-mix(in srgb, var(--ae-cyan) 80%, white);\\n --ae-cyan-500: var(--ae-cyan);\\n --ae-cyan-600: color-mix(in srgb, var(--ae-cyan) 80%, black);\\n --ae-cyan-700: color-mix(in srgb, var(--ae-cyan) 60%, black);\\n --ae-cyan-800: color-mix(in srgb, var(--ae-cyan) 40%, black);\\n --ae-cyan-900: color-mix(in srgb, var(--ae-cyan) 20%, black);\\n\\n /* Gray (neutral \u2014 base #6e6e6e) */\\n --ae-gray-100: color-mix(in srgb, var(--ae-gray) 20%, white);\\n --ae-gray-200: color-mix(in srgb, var(--ae-gray) 40%, white);\\n --ae-gray-300: color-mix(in srgb, var(--ae-gray) 60%, white);\\n --ae-gray-400: color-mix(in srgb, var(--ae-gray) 80%, white);\\n --ae-gray-500: var(--ae-gray);\\n --ae-gray-600: color-mix(in srgb, var(--ae-gray) 80%, black);\\n --ae-gray-700: color-mix(in srgb, var(--ae-gray) 60%, black);\\n --ae-gray-800: color-mix(in srgb, var(--ae-gray) 40%, black);\\n --ae-gray-900: color-mix(in srgb, var(--ae-gray) 20%, black);\\n\\n /* Slate (blue-gray \u2014 base #64748b, used for 'secondary') */\\n --ae-slate-100: color-mix(in srgb, var(--ae-slate) 20%, white);\\n --ae-slate-200: color-mix(in srgb, var(--ae-slate) 40%, white);\\n --ae-slate-300: color-mix(in srgb, var(--ae-slate) 60%, white);\\n --ae-slate-400: color-mix(in srgb, var(--ae-slate) 80%, white);\\n --ae-slate-500: var(--ae-slate);\\n --ae-slate-600: color-mix(in srgb, var(--ae-slate) 80%, black);\\n --ae-slate-700: color-mix(in srgb, var(--ae-slate) 60%, black);\\n --ae-slate-800: color-mix(in srgb, var(--ae-slate) 40%, black);\\n --ae-slate-900: color-mix(in srgb, var(--ae-slate) 20%, black);\\n\\n /* Dark (base #343a40) */\\n --ae-dark-100: color-mix(in srgb, var(--ae-dark) 20%, white);\\n --ae-dark-200: color-mix(in srgb, var(--ae-dark) 40%, white);\\n --ae-dark-300: color-mix(in srgb, var(--ae-dark) 60%, white);\\n --ae-dark-400: color-mix(in srgb, var(--ae-dark) 80%, white);\\n --ae-dark-500: var(--ae-dark);\\n --ae-dark-600: color-mix(in srgb, var(--ae-dark) 80%, black);\\n --ae-dark-700: color-mix(in srgb, var(--ae-dark) 60%, black);\\n --ae-dark-800: color-mix(in srgb, var(--ae-dark) 40%, black);\\n --ae-dark-900: color-mix(in srgb, var(--ae-dark) 20%, black);\\n\\n /* Light (base #f8f9fa) */\\n --ae-light-100: color-mix(in srgb, var(--ae-light) 20%, white);\\n --ae-light-200: color-mix(in srgb, var(--ae-light) 40%, white);\\n --ae-light-300: color-mix(in srgb, var(--ae-light) 60%, white);\\n --ae-light-400: color-mix(in srgb, var(--ae-light) 80%, white);\\n --ae-light-500: var(--ae-light);\\n --ae-light-600: color-mix(in srgb, var(--ae-light) 80%, black);\\n --ae-light-700: color-mix(in srgb, var(--ae-light) 60%, black);\\n --ae-light-800: color-mix(in srgb, var(--ae-light) 40%, black);\\n --ae-light-900: color-mix(in srgb, var(--ae-light) 20%, black);\\n}\\n\\n:root,\\n:host {\\n /* Hover / active mix (light default \u2014 overridden in \u00A7 6 dark) */\\n --ae-color-mix-hover: black 10%;\\n --ae-color-mix-active: black 20%;\\n\\n /* Primary (Blue) */\\n --ae-color-primary: var(--ae-blue-500);\\n --ae-color-primary-hover: color-mix(in srgb, var(--ae-color-primary), var(--ae-color-mix-hover));\\n --ae-color-primary-active: color-mix(in srgb, var(--ae-color-primary), var(--ae-color-mix-active));\\n --ae-color-primary-disabled: color-mix(in srgb, var(--ae-blue) 50%, var(--ae-gray-500));\\n\\n /* Success (Green) */\\n --ae-color-success: var(--ae-green-500);\\n --ae-color-success-hover: color-mix(in srgb, var(--ae-color-success), var(--ae-color-mix-hover));\\n --ae-color-success-active: color-mix(in srgb, var(--ae-color-success), var(--ae-color-mix-active));\\n --ae-color-success-disabled: color-mix(in srgb, var(--ae-green) 50%, var(--ae-gray-500));\\n\\n /* Danger (Red) */\\n --ae-color-danger: var(--ae-red-500);\\n --ae-color-danger-hover: color-mix(in srgb, var(--ae-color-danger), var(--ae-color-mix-hover));\\n --ae-color-danger-active: color-mix(in srgb, var(--ae-color-danger), var(--ae-color-mix-active));\\n --ae-color-danger-disabled: color-mix(in srgb, var(--ae-red) 50%, var(--ae-gray-500));\\n\\n /* Warning (Yellow) */\\n --ae-color-warning: var(--ae-yellow-500);\\n --ae-color-warning-hover: color-mix(in srgb, var(--ae-color-warning), var(--ae-color-mix-hover));\\n --ae-color-warning-active: color-mix(in srgb, var(--ae-color-warning), var(--ae-color-mix-active));\\n --ae-color-warning-disabled: color-mix(in srgb, var(--ae-yellow) 50%, var(--ae-gray-500));\\n\\n /* Info (Cyan) */\\n --ae-color-info: var(--ae-cyan-500);\\n --ae-color-info-hover: color-mix(in srgb, var(--ae-color-info), var(--ae-color-mix-hover));\\n --ae-color-info-active: color-mix(in srgb, var(--ae-color-info), var(--ae-color-mix-active));\\n --ae-color-info-disabled: color-mix(in srgb, var(--ae-cyan) 50%, var(--ae-gray-500));\\n\\n /* Secondary (Slate) \u2014 base differs per theme, overridden in \u00A7 6 dark */\\n --ae-color-secondary: var(--ae-slate-500);\\n --ae-color-secondary-hover: color-mix(in srgb, var(--ae-color-secondary), var(--ae-color-mix-hover));\\n --ae-color-secondary-active: color-mix(in srgb, var(--ae-color-secondary), var(--ae-color-mix-active));\\n --ae-color-secondary-text: var(--ae-slate-700);\\n}\\n\\n\\n.theme-light,\\n:root[theme=\\\"light\\\"],\\n:host([theme=\\\"light\\\"]),\\n:host-context([theme=\\\"light\\\"]),\\n:where(:root),\\n:host {\\n color-scheme: light;\\n\\n /* Gray UI aliases \u2014 lighter palette steps for elements on white background */\\n --ae-color-gray-dark: var(--ae-gray-400);\\n --ae-color-gray: var(--ae-gray-300);\\n --ae-color-gray-light: var(--ae-gray-200);\\n --ae-color-gray-lighter: var(--ae-gray-100);\\n --ae-color-gray-lightest: color-mix(in srgb, var(--ae-gray) 10%, white);\\n\\n /* Text */\\n --ae-color-text-main: var(--ae-dark-700);\\n --ae-color-text-muted: var(--ae-gray-600);\\n --ae-color-text-disabled: var(--ae-gray-300);\\n --ae-color-text-link: var(--ae-blue-500);\\n --ae-color-text-link-hover: var(--ae-blue-700);\\n\\n /* Surfaces */\\n --ae-surface-sunken: var(--ae-light-500);\\n --ae-surface-base: white;\\n --ae-surface-raised: var(--ae-light-500);\\n --ae-surface-overlay: white;\\n --ae-color-overlay: rgba(0, 0, 0, 0.4);\\n\\n /* Borders */\\n --ae-border-subtle: rgba(0, 0, 0, 0.08);\\n --ae-border-default: rgba(0, 0, 0, 0.15);\\n --ae-border-hover: rgba(0, 0, 0, 0.25);\\n --ae-border-focus: var(--ae-color-primary);\\n --ae-border-disabled: rgba(0, 0, 0, 0.06);\\n\\n /* Focus ring */\\n --ae-focus-ring: rgb(from var(--ae-blue) r g b / 0.30);\\n --ae-focus-ring-sm: rgb(from var(--ae-blue) r g b / 0.15);\\n\\n /* Subtle intent tokens \u2014 light context */\\n --ae-color-primary-bg-subtle: rgb(from var(--ae-blue) r g b / 0.08);\\n --ae-color-primary-border-subtle: rgb(from var(--ae-blue) r g b / 0.40);\\n --ae-color-primary-text-emphasis: var(--ae-blue-700);\\n\\n --ae-color-success-bg-subtle: rgb(from var(--ae-green) r g b / 0.08);\\n --ae-color-success-border-subtle: rgb(from var(--ae-green) r g b / 0.40);\\n --ae-color-success-text-emphasis: var(--ae-green-700);\\n\\n --ae-color-danger-bg-subtle: rgb(from var(--ae-red) r g b / 0.08);\\n --ae-color-danger-border-subtle: rgb(from var(--ae-red) r g b / 0.40);\\n --ae-color-danger-text-emphasis: var(--ae-red-700);\\n\\n --ae-color-warning-bg-subtle: rgb(from var(--ae-yellow) r g b / 0.08);\\n --ae-color-warning-border-subtle: rgb(from var(--ae-yellow) r g b / 0.40);\\n --ae-color-warning-text-emphasis: var(--ae-yellow-700);\\n\\n --ae-color-info-bg-subtle: rgb(from var(--ae-cyan) r g b / 0.08);\\n --ae-color-info-border-subtle: rgb(from var(--ae-cyan) r g b / 0.40);\\n --ae-color-info-text-emphasis: var(--ae-cyan-700);\\n\\n --ae-color-secondary-bg-subtle: rgb(from var(--ae-slate) r g b / 0.08);\\n --ae-color-secondary-border-subtle: rgb(from var(--ae-slate) r g b / 0.40);\\n --ae-color-secondary-text-emphasis: var(--ae-slate-700);\\n\\n --ae-color-light-bg-subtle: var(--ae-gray-100); /* opaque on white: ~#e2e2e2 */\\n --ae-color-light-border-subtle: var(--ae-gray-200); /* opaque on white: ~#c4c4c4 */\\n\\n --ae-color-dark-bg-subtle: var(--ae-dark-100); /* opaque on white: ~#d6d8d9 */\\n --ae-color-dark-border-subtle: var(--ae-dark-300); /* opaque on white: ~#85898c */\\n\\n /* Component tokens \u2014 light defaults */\\n --ae-action-btn-bg: var(--ae-gray-200);\\n --ae-action-btn-bg-hover: var(--ae-color-primary);\\n --ae-action-btn-color: var(--ae-gray-600);\\n --ae-action-btn-color-hover: white;\\n\\n --ae-clear-btn-bg-hover: var(--ae-color-danger);\\n --ae-clear-btn-color-hover: white;\\n\\n --ae-reset-btn-border-radius: var(--ae-radius-xs);\\n --ae-reset-btn-bg: var(--ae-action-btn-bg);\\n --ae-reset-btn-bg-hover: var(--ae-action-btn-bg-hover);\\n --ae-reset-btn-color: var(--ae-action-btn-color);\\n --ae-reset-btn-color-hover: var(--ae-action-btn-color-hover);\\n --ae-reset-btn-transition: all 0.12s;\\n\\n --ae-clear-btn-border-radius: var(--ae-radius-xs);\\n --ae-clear-btn-bg: var(--ae-action-btn-bg);\\n --ae-clear-btn-color: var(--ae-action-btn-color);\\n --ae-clear-btn-transition: all 0.12s;\\n}\\n\\n:root,\\n:host {\\n --ae-size-scale: 1;\\n --ae-size-base: calc(1rem * var(--ae-size-scale)); /* 16px */\\n --ae-size-xl: round(calc(var(--ae-size-l) * 1.125), 1px); /* 23px */\\n --ae-size-l: round(calc(var(--ae-size-m) * 1.125 * 1.125), 1px); /* 20px */\\n --ae-size-m: var(--ae-size-base); /* 16px */\\n --ae-size-s: round(calc(var(--ae-size-m) / 1.125), 1px); /* 14px */\\n --ae-size-xs: round(calc(var(--ae-size-s) / 1.125), 1px); /* 12px */\\n --ae-size-2xs: round(calc(var(--ae-size-xs) / 1.125), 1px); /* 11px */\\n --ae-size-3xs: round(calc(var(--ae-size-2xs) / 1.125), 1px); /* 10px */\\n}\\n\\n/* Border-radius tokens \u2014 shared across all components */\\n:root,\\n:host {\\n /**\\n * Unified border-radius hook for all components.\\n *\\n * Not set by default \u2014 each component falls back to its own --ae-radius-*\\n * token (e.g. button \u2192 sm, card \u2192 lg, input \u2192 xs).\\n *\\n * Usage:\\n * :root { --ae-border-radius: 0; } // global: all components square\\n * :root { --ae-border-radius: 999px; } // global: all components pill\\n * ae-button { --ae-border-radius: 50%; } // scoped: only buttons circular\\n * .sidebar { --ae-border-radius: 8px; } // scoped: everything inside .sidebar\\n *\\n * To restore a component to its own default:\\n * ae-card { --ae-border-radius: initial; }\\n */\\n\\n --ae-radius-square: 0;\\n --ae-radius-xs: 2px;\\n --ae-radius-sm: 4px;\\n --ae-radius-md: 6px;\\n --ae-radius-lg: 8px;\\n --ae-radius-xl: 12px;\\n --ae-radius-pill: 999px;\\n --ae-radius-circle: 50%;\\n}\\n\\n/* Layout tokens \u2014 defined on :root so all light DOM elements can use them */\\n:root,\\n:host {\\n --container-max-width: 1280px;\\n --container-padding-x: 1.5rem;\\n}\\n\\n.theme-dark,\\n:root[theme=\\\"dark\\\"],\\n:host([theme=\\\"dark\\\"]),\\n:host-context([theme=\\\"dark\\\"]) {\\n color-scheme: dark;\\n\\n /* Hover / active \u2014 slightly gentler on dark backgrounds */\\n --ae-color-mix-hover: black 8%;\\n --ae-color-mix-active: black 16%;\\n\\n /* Gray UI aliases \u2014 darker palette steps for elements on dark background */\\n --ae-color-gray-dark: var(--ae-gray-800);\\n --ae-color-gray: var(--ae-gray-700);\\n --ae-color-gray-light: var(--ae-gray-600);\\n --ae-color-gray-lighter: var(--ae-gray-500);\\n --ae-color-gray-lightest: var(--ae-gray-400);\\n\\n /* Secondary \u2014 deeper base on dark background */\\n --ae-color-secondary: var(--ae-slate-700);\\n --ae-color-secondary-text: var(--ae-slate-300);\\n\\n /* Text */\\n --ae-color-text-main: white;\\n --ae-color-text-muted: var(--ae-gray-200);\\n --ae-color-text-disabled: var(--ae-gray-500);\\n --ae-color-text-link: var(--ae-blue-300);\\n --ae-color-text-link-hover: var(--ae-blue-200);\\n\\n /* Surfaces */\\n --ae-surface-sunken: var(--ae-gray-900);\\n --ae-surface-base: color-mix(in srgb, var(--ae-gray) 27%, black);\\n --ae-surface-raised: color-mix(in srgb, var(--ae-gray) 34%, black);\\n --ae-surface-overlay: color-mix(in srgb, var(--ae-gray) 38%, black);\\n --ae-color-overlay: rgba(0, 0, 0, 0.6);\\n\\n /* Borders */\\n --ae-border-subtle: rgba(255, 255, 255, 0.08);\\n --ae-border-default: rgba(255, 255, 255, 0.12);\\n --ae-border-hover: rgba(255, 255, 255, 0.20);\\n --ae-border-focus: var(--ae-color-primary);\\n --ae-border-disabled: rgba(255, 255, 255, 0.06);\\n\\n /* Focus ring */\\n --ae-focus-ring: rgb(from var(--ae-blue) r g b / 0.25);\\n --ae-focus-ring-sm: rgb(from var(--ae-blue) r g b / 0.10);\\n\\n /* Subtle intent tokens \u2014 dark context (more alpha, lighter text-emphasis) */\\n --ae-color-primary-bg-subtle: rgb(from var(--ae-blue) r g b / 0.10);\\n --ae-color-primary-border-subtle: rgb(from var(--ae-blue) r g b / 0.30);\\n --ae-color-primary-text-emphasis: var(--ae-blue-300);\\n\\n --ae-color-success-bg-subtle: rgb(from var(--ae-green) r g b / 0.10);\\n --ae-color-success-border-subtle: rgb(from var(--ae-green) r g b / 0.30);\\n --ae-color-success-text-emphasis: var(--ae-green-300);\\n\\n --ae-color-danger-bg-subtle: rgb(from var(--ae-red) r g b / 0.10);\\n --ae-color-danger-border-subtle: rgb(from var(--ae-red) r g b / 0.30);\\n --ae-color-danger-text-emphasis: var(--ae-red-300);\\n\\n --ae-color-warning-bg-subtle: rgb(from var(--ae-yellow) r g b / 0.10);\\n --ae-color-warning-border-subtle: rgb(from var(--ae-yellow) r g b / 0.30);\\n --ae-color-warning-text-emphasis: var(--ae-yellow-300);\\n\\n --ae-color-info-bg-subtle: rgb(from var(--ae-cyan) r g b / 0.10);\\n --ae-color-info-border-subtle: rgb(from var(--ae-cyan) r g b / 0.30);\\n --ae-color-info-text-emphasis: var(--ae-cyan-300);\\n\\n --ae-color-secondary-bg-subtle: rgb(from var(--ae-slate) r g b / 0.10);\\n --ae-color-secondary-border-subtle: rgb(from var(--ae-slate) r g b / 0.30);\\n --ae-color-secondary-text-emphasis: var(--ae-slate-300);\\n\\n --ae-color-light-bg-subtle: rgb(from var(--ae-light) r g b / 0.20);\\n --ae-color-light-border-subtle: rgb(from var(--ae-light) r g b / 0.25);\\n\\n --ae-color-dark-bg-subtle: rgb(from var(--ae-dark) r g b / 0.30);\\n --ae-color-dark-border-subtle: rgb(from var(--ae-dark) r g b / 0.50);\\n\\n /* Component tokens \u2014 dark overrides */\\n --ae-action-btn-bg: var(--ae-color-gray);\\n --ae-action-btn-bg-hover: color-mix(in srgb, var(--ae-blue) 25%, var(--ae-gray-800));\\n --ae-action-btn-color: var(--ae-gray-400);\\n --ae-action-btn-color-hover: var(--ae-cyan-300);\\n --ae-clear-btn-bg-hover: color-mix(in srgb, var(--ae-red) 25%, var(--ae-gray-800));\\n --ae-clear-btn-color-hover: var(--ae-red-300);\\n}\\n\"", "export default \":host([size=\\\"xs\\\"]) { font-size: var(--ae-size-xs); }\\n:host([size=\\\"sm\\\"]) { font-size: var(--ae-size-s); }\\n:host([size=\\\"md\\\"]) { font-size: var(--ae-size-m); }\\n:host([size=\\\"lg\\\"]) { font-size: var(--ae-size-l); }\\n:host([size=\\\"xl\\\"]) { font-size: var(--ae-size-xl); }\\n:host([size=\\\"3xs\\\"]) { font-size: var(--ae-size-3xs); }\\n:host([size=\\\"2xs\\\"]) { font-size: var(--ae-size-2xs); }\\n\"", "export default \":host {\\n --ae-color-solid: var(--ae-color-gray);\\n --ae-color-solid-hover: color-mix(in srgb, var(--ae-color-solid), var(--ae-color-mix-hover));\\n --ae-color-solid-active: color-mix(in srgb, var(--ae-color-solid), var(--ae-color-mix-active));\\n --ae-color-on-solid: var(--ae-color-text-main);\\n --ae-color-border: var(--ae-color-gray);\\n --ae-color-border-hover: color-mix(in srgb, var(--ae-color-border), var(--ae-color-mix-hover));\\n --ae-color-accent: var(--ae-color-text-muted);\\n --ae-color-accent-hover: var(--ae-color-text-main);\\n --ae-color-subtle: var(--ae-border-subtle);\\n --ae-color-subtle-hover: var(--ae-border-default);\\n --ae-color-bg-subtle: var(--ae-border-subtle);\\n --ae-color-text-subtle: var(--ae-color-text-muted);\\n --ae-color-border-subtle: var(--ae-border-default);\\n}\\n\\n:host([color=\\\"primary\\\"]) {\\n --ae-color-solid: var(--ae-color-primary);\\n --ae-color-on-solid: white;\\n --ae-color-border: var(--ae-color-primary);\\n --ae-color-accent: var(--ae-color-text-link);\\n --ae-color-accent-hover: var(--ae-color-text-link-hover);\\n --ae-color-subtle: var(--ae-color-primary-bg-subtle);\\n --ae-color-subtle-hover: rgb(from var(--ae-blue) r g b / 0.15);\\n --ae-color-bg-subtle: var(--ae-color-primary-bg-subtle);\\n --ae-color-text-subtle: var(--ae-color-primary-text-emphasis);\\n --ae-color-border-subtle: var(--ae-color-primary-border-subtle);\\n}\\n\\n:host([color=\\\"secondary\\\"]) {\\n --ae-color-solid: var(--ae-color-secondary);\\n --ae-color-on-solid: white;\\n --ae-color-border: var(--ae-color-secondary-hover);\\n --ae-color-accent: var(--ae-color-secondary-text-emphasis);\\n --ae-color-accent-hover: var(--ae-color-text-main);\\n --ae-color-subtle: rgb(from var(--ae-slate) r g b / 0.06);\\n --ae-color-subtle-hover: rgb(from var(--ae-slate) r g b / 0.12);\\n --ae-color-bg-subtle: var(--ae-color-secondary-bg-subtle);\\n --ae-color-text-subtle: var(--ae-color-secondary-text-emphasis);\\n --ae-color-border-subtle: var(--ae-color-secondary-border-subtle);\\n}\\n\\n:host([color=\\\"success\\\"]) {\\n --ae-color-solid: var(--ae-color-success);\\n --ae-color-on-solid: white;\\n --ae-color-border: var(--ae-color-success);\\n --ae-color-accent: var(--ae-color-success-text-emphasis);\\n --ae-color-accent-hover: var(--ae-color-success-hover);\\n --ae-color-subtle: var(--ae-color-success-bg-subtle);\\n --ae-color-subtle-hover: rgb(from var(--ae-green) r g b / 0.15);\\n --ae-color-bg-subtle: var(--ae-color-success-bg-subtle);\\n --ae-color-text-subtle: var(--ae-color-success-text-emphasis);\\n --ae-color-border-subtle: var(--ae-color-success-border-subtle);\\n}\\n\\n:host([color=\\\"danger\\\"]) {\\n --ae-color-solid: var(--ae-color-danger);\\n --ae-color-on-solid: white;\\n --ae-color-border: var(--ae-color-danger);\\n --ae-color-accent: var(--ae-color-danger-text-emphasis);\\n --ae-color-accent-hover: var(--ae-color-danger-hover);\\n --ae-color-subtle: var(--ae-color-danger-bg-subtle);\\n --ae-color-subtle-hover: rgb(from var(--ae-red) r g b / 0.15);\\n --ae-color-bg-subtle: var(--ae-color-danger-bg-subtle);\\n --ae-color-text-subtle: var(--ae-color-danger-text-emphasis);\\n --ae-color-border-subtle: var(--ae-color-danger-border-subtle);\\n}\\n\\n:host([color=\\\"warning\\\"]) {\\n --ae-color-solid: var(--ae-color-warning);\\n --ae-color-on-solid: var(--ae-gray-900);\\n --ae-color-border: var(--ae-color-warning);\\n --ae-color-accent: var(--ae-color-warning-text-emphasis);\\n --ae-color-accent-hover: var(--ae-color-warning-hover);\\n --ae-color-subtle: var(--ae-color-warning-bg-subtle);\\n --ae-color-subtle-hover: rgb(from var(--ae-yellow) r g b / 0.15);\\n --ae-color-bg-subtle: var(--ae-color-warning-bg-subtle);\\n --ae-color-text-subtle: var(--ae-color-warning-text-emphasis);\\n --ae-color-border-subtle: var(--ae-color-warning-border-subtle);\\n}\\n\\n:host([color=\\\"info\\\"]) {\\n --ae-color-solid: var(--ae-color-info);\\n --ae-color-on-solid: white;\\n --ae-color-border: var(--ae-color-info);\\n --ae-color-accent: var(--ae-color-info-text-emphasis);\\n --ae-color-accent-hover: var(--ae-color-info-hover);\\n --ae-color-subtle: var(--ae-color-info-bg-subtle);\\n --ae-color-subtle-hover: rgb(from var(--ae-cyan) r g b / 0.15);\\n --ae-color-bg-subtle: var(--ae-color-info-bg-subtle);\\n --ae-color-text-subtle: var(--ae-color-info-text-emphasis);\\n --ae-color-border-subtle: var(--ae-color-info-border-subtle);\\n}\\n\\n:host([color=\\\"light\\\"]) {\\n --ae-color-solid: var(--ae-light);\\n --ae-color-on-solid: var(--ae-gray-900);\\n --ae-color-border: var(--ae-border-hover);\\n --ae-color-subtle: var(--ae-color-light-bg-subtle);\\n --ae-color-subtle-hover: var(--ae-color-light-border-subtle);\\n --ae-color-bg-subtle: var(--ae-color-light-bg-subtle);\\n --ae-color-text-subtle: var(--ae-color-text-muted);\\n --ae-color-border-subtle: var(--ae-color-light-border-subtle);\\n}\\n\\n:host([color=\\\"dark\\\"]) {\\n --ae-color-solid: var(--ae-dark-500);\\n --ae-color-on-solid: white;\\n --ae-color-border: var(--ae-dark-500);\\n --ae-color-accent: var(--ae-color-text-main);\\n --ae-color-accent-hover: var(--ae-color-text-main);\\n --ae-color-subtle: var(--ae-color-dark-bg-subtle);\\n --ae-color-subtle-hover: var(--ae-color-dark-border-subtle);\\n --ae-color-bg-subtle: var(--ae-color-dark-bg-subtle);\\n --ae-color-text-subtle: var(--ae-color-text-main);\\n --ae-color-border-subtle: var(--ae-color-dark-border-subtle);\\n}\\n\"", "export default \":host {\\n display: inline-block;\\n}\\n\\nbutton {\\n display: inline-flex;\\n align-items: center;\\n justify-content: center;\\n gap: 6px;\\n font-family: inherit;\\n font-weight: 400;\\n text-align: center;\\n white-space: nowrap;\\n vertical-align: middle;\\n user-select: none;\\n cursor: pointer;\\n transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);\\n outline: none;\\n position: relative;\\n padding: 0.429em 0.571em;\\n font-size: 1em;\\n line-height: 1.5;\\n border-radius: var(--ae-border-radius, var(--ae-radius-sm));\\n height: 2.286em;\\n width: 2.286em;\\n min-width: unset;\\n\\n background: var(--ae-color-solid);\\n border: 1px solid var(--ae-color-solid);\\n color: var(--ae-color-on-solid);\\n}\\n\\nbutton:focus { outline: none; }\\nbutton:active { transform: translateY(1px); }\\n\\nbutton:hover:not(:disabled) {\\n background: var(--ae-color-solid-hover);\\n border-color: var(--ae-color-border-hover);\\n color: var(--ae-color-on-solid-hover, var(--ae-color-on-solid));\\n}\\n\\nbutton:active:not(:disabled) { background: var(--ae-color-solid-active); }\\n\\nbutton:disabled {\\n opacity: 0.5;\\n cursor: not-allowed;\\n}\\n\\n/* Hide the fallback-text slot */\\nslot { display: none; }\\n\\n/* Icon visibility */\\n.icon-copy,\\n.icon-check {\\n position: absolute;\\n inset: 0;\\n display: flex;\\n align-items: center;\\n justify-content: center;\\n transition: opacity 0.15s ease, transform 0.15s ease;\\n}\\n\\n.icon-copy { opacity: 1; transform: scale(1); }\\n.icon-check { opacity: 0; transform: scale(0.6); }\\n\\n:host([copied]) .icon-copy { opacity: 0; transform: scale(0.6); }\\n:host([copied]) .icon-check { opacity: 1; transform: scale(1); }\\n\\n/* Variants */\\n:host([variant=\\\"outlined\\\"]) button {\\n background: transparent;\\n border-color: var(--ae-color-border);\\n color: var(--ae-color-accent);\\n}\\n:host([variant=\\\"outlined\\\"]) button:hover:not(:disabled) {\\n background: var(--ae-color-subtle);\\n border-color: var(--ae-color-border-hover);\\n color: var(--ae-color-accent-hover);\\n}\\n\\n:host([variant=\\\"faint\\\"]) button {\\n background: var(--ae-color-subtle);\\n border-color: transparent;\\n color: var(--ae-color-accent);\\n}\\n:host([variant=\\\"faint\\\"]) button:hover:not(:disabled) {\\n background: var(--ae-color-subtle-hover);\\n color: var(--ae-color-accent-hover);\\n}\\n\\n:host([variant=\\\"subtle\\\"]) button {\\n background: transparent;\\n border-color: transparent;\\n color: var(--ae-color-accent);\\n}\\n:host([variant=\\\"subtle\\\"]) button:hover:not(:disabled) {\\n background: var(--ae-color-subtle);\\n color: var(--ae-color-accent-hover);\\n}\\n\\n:host([variant=\\\"text\\\"]) button {\\n background: transparent;\\n border-color: transparent;\\n color: var(--ae-color-accent);\\n}\\n:host([variant=\\\"text\\\"]) button:hover:not(:disabled) {\\n color: var(--ae-color-accent-hover);\\n}\\n\"", "\uFEFFimport { AeicoElement } from 'aeico';\nimport { toKebab } from './utils';\n\nconst TAG_NAME_PREFIX = 'ae';\n\n/**\n * AeicoComponent is the base class for all built-in Aeico components.\n */\nclass AeicoComponent extends AeicoElement {\n static register(name?: string) {\n const tagName = name || `${TAG_NAME_PREFIX}-${this.tagName || toKebab(this.name)}`;\n\n super.register(tagName);\n }\n}\n\nexport default AeicoComponent;\n", "export const SVG_NS = 'http://www.w3.org/2000/svg';\n\nexport function toKebab(str: string): string {\n const cleaned = str.replace(/^[_\\d]+/, '');\n\n return cleaned.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();\n}\n", "import type { InferProps } from 'aeico';\nimport styleVariables from '../styles/variables.css';\nimport sizeCSS from '../styles/size.css';\nimport colorCSS from '../styles/color.css';\nimport copyButtonStyle from '../styles/components/copy-button.css';\nimport AeicoComponent from '../aeico-component';\nimport { html } from 'aeico';\nimport { prop } from 'aeico';\n// Ensure ae-icon and ae-tooltip are registered\nimport '../icon/icon';\nimport '../tooltip/tooltip';\nimport type Tooltip from '../tooltip/tooltip';\nimport type { TooltipPlacement } from '../tooltip/defines';\nimport type { CopyButtonColor, CopyButtonSize, CopyButtonVariant } from './defines';\n\nclass CopyButton extends AeicoComponent {\n protected static styles = [styleVariables, sizeCSS, colorCSS, copyButtonStyle];\n\n @prop({ type: String })\n accessor text: string | undefined;\n\n @prop({ type: String })\n accessor color: CopyButtonColor | undefined;\n\n @prop({ type: String })\n accessor variant: CopyButtonVariant | undefined;\n\n @prop({ type: String })\n accessor size: CopyButtonSize | undefined;\n\n @prop({ type: Boolean })\n accessor disabled: boolean | undefined;\n\n @prop({ type: Number })\n accessor duration: number | undefined;\n\n @prop({ type: String })\n accessor tooltip: string = 'Copy';\n\n @prop({ type: String })\n accessor tooltipCopied: string = 'Copied!';\n\n @prop({ type: String })\n accessor tooltipPlacement: TooltipPlacement = 'top';\n\n private _slotElement: HTMLSlotElement | null = null;\n private _tooltipEl: Tooltip | null = null;\n private _resetTimer: ReturnType<typeof setTimeout> | null = null;\n\n private _getTextToCopy(): string {\n if (this.text != null) return this.text;\n\n const nodes = this._slotElement?.assignedNodes({ flatten: true }) ?? [];\n\n return nodes\n .reduce<string>((text, n) => {\n if (n.nodeType === Node.TEXT_NODE) return text + (n.textContent ?? '');\n\n return text;\n }, '')\n .trim();\n }\n\n private _handleClick = () => {\n if (this.disabled) return;\n\n const textToCopy = this._getTextToCopy();\n\n void navigator.clipboard.writeText(textToCopy).then(() => {\n this.setAttribute('copied', '');\n\n if (this._tooltipEl) {\n this._tooltipEl.content = this.tooltipCopied;\n this._tooltipEl.open = true;\n }\n\n if (this._resetTimer !== null) {\n clearTimeout(this._resetTimer);\n }\n const duration = this.duration ?? 2000;\n this._resetTimer = setTimeout(() => {\n this.removeAttribute('copied');\n if (this._tooltipEl) {\n this._tooltipEl.content = this.tooltip;\n this._tooltipEl.open = false;\n }\n this._resetTimer = null;\n }, duration);\n\n this.dispatchEvent(\n new CustomEvent('copy', {\n bubbles: true,\n composed: true,\n detail: { text: textToCopy },\n }),\n );\n });\n };\n\n protected onUnmounted() {\n if (this._resetTimer !== null) {\n clearTimeout(this._resetTimer);\n this._resetTimer = null;\n }\n }\n\n protected render() {\n return html(({ aeTooltip, button, span, slot, aeIcon }) => {\n this._tooltipEl = aeTooltip(\n {\n content: this.tooltip,\n placement: this.tooltipPlacement,\n disabled: this.disabled,\n },\n () => {\n button(\n {\n type: 'button',\n disabled: this.disabled,\n part: 'button',\n 'aria-label': this.tooltip,\n 'aria-disabled': this.disabled,\n '@click': this._handleClick,\n },\n () => {\n span({ className: 'icon-copy' }, () => {\n aeIcon({ name: 'copy', size: this.size });\n });\n span({ className: 'icon-check' }, () => {\n aeIcon({ name: 'check', size: this.size });\n });\n this._slotElement = slot();\n },\n );\n },\n );\n });\n }\n}\n\nCopyButton.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-copy-button': CopyButton;\n }\n}\n\nexport default CopyButton;\nexport type CopyButtonProps = InferProps<typeof CopyButton>;\n", "\uFEFFimport type { InferProps, Props } from 'aeico';\nimport { SVG_NS } from '../utils';\nimport AeicoComponent from '../aeico-component';\nimport { html } from 'aeico';\nimport styleVariables from '../styles/variables.css';\nimport sizeCSS from '../styles/size.css';\nimport colorCSS from '../styles/color.css';\nimport style from '../styles/components/icon.css';\nimport type { IconSize, IconColor } from './defines';\nimport { defaultViewBox } from './defines';\nimport IconRegistry from './registry';\nimport './built-in-icons';\n\nclass Icon extends AeicoComponent {\n static tagName = 'icon';\n\n static props: Props = {\n name: { type: String },\n size: { type: String },\n color: { type: String },\n stroke: { type: Boolean },\n strokeWidth: { type: Number },\n };\n\n declare name?: string;\n declare size?: IconSize;\n declare color?: IconColor;\n declare stroke?: boolean;\n declare strokeWidth?: number;\n\n protected static styles = [styleVariables, sizeCSS, colorCSS, style];\n\n protected render() {\n const def = this.name ? IconRegistry.get(this.name) : undefined;\n\n // Numeric size: set font-size directly (string sizes are handled by size.css)\n const numericSize = Number(this.size);\n if (this.size !== undefined && !isNaN(numericSize) && numericSize > 0) {\n this.style.setProperty('font-size', `${numericSize}px`);\n } else {\n this.style.removeProperty('font-size');\n }\n\n if (!def) return;\n\n const { paths } = def;\n const isMultiPath = Array.isArray(paths);\n\n // Stroke CSS variables only apply in single-path mode (component props)\n if (!isMultiPath) {\n const useStroke =\n this.stroke ?? (this.strokeWidth !== undefined ? true : (def.stroke ?? false));\n const useStrokeWidth = this.strokeWidth ?? def.strokeWidth ?? 2;\n\n if (useStroke) {\n this.style.setProperty('--icon-fill', 'none');\n this.style.setProperty('--icon-stroke', 'currentColor');\n this.style.setProperty('--icon-stroke-width', String(useStrokeWidth));\n } else {\n this.style.removeProperty('--icon-fill');\n this.style.removeProperty('--icon-stroke');\n this.style.removeProperty('--icon-stroke-width');\n }\n } else {\n this.style.removeProperty('--icon-fill');\n this.style.removeProperty('--icon-stroke');\n this.style.removeProperty('--icon-stroke-width');\n }\n\n return html(({ svg, path }) => {\n svg(\n {\n className: 'icon-svg',\n viewBox: def.viewBox ?? defaultViewBox,\n 'aria-hidden': 'true',\n xmlns: SVG_NS,\n },\n () => {\n if (typeof paths === 'string') {\n path({ d: paths });\n } else {\n for (const p of paths) {\n const attrs: Record<string, unknown> = { d: p.d };\n if (p.fill) attrs.style = { fill: p.fill };\n path(attrs);\n }\n }\n },\n );\n });\n }\n}\n\nIcon.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-icon': Icon;\n }\n}\n\nexport default Icon;\nexport type IconProps = InferProps<typeof Icon>;\n", "export default \":host {\\n display: inline-flex;\\n align-items: center;\\n justify-content: center;\\n font-size: 20px;\\n width: 1em;\\n height: 1em;\\n color: inherit;\\n flex-shrink: 0;\\n line-height: 0;\\n vertical-align: middle;\\n}\\n\\n:host([color]) {\\n color: var(--ae-color-solid);\\n}\\n\\n.icon-svg {\\n display: block;\\n width: 100%;\\n height: 100%;\\n fill: var(--icon-fill, currentColor);\\n stroke: var(--icon-stroke, none);\\n stroke-width: var(--icon-stroke-width, 2);\\n stroke-linecap: var(--icon-stroke-linecap, round);\\n stroke-linejoin: var(--icon-stroke-linejoin, round);\\n pointer-events: none;\\n overflow: visible;\\n}\\n\"", "export type IconSize = '3xs' | '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | number;\n\nexport type IconColor =\n | 'default'\n | 'primary'\n | 'secondary'\n | 'success'\n | 'danger'\n | 'warning'\n | 'info';\n\nexport interface IconPathDef {\n d: string;\n fill?: string;\n stroke?: boolean;\n strokeWidth?: number;\n}\n\nexport interface IconDefinition {\n paths: string | IconPathDef[];\n viewBox?: string;\n stroke?: boolean;\n strokeWidth?: number;\n}\n\nexport const defaultViewBox = '0 0 24 24';\n\nexport type IconRegistryData = Record<string, string | IconDefinition>;\n", "import { IconDefinition, IconRegistryData, defaultViewBox } from './defines';\n\nclass IconRegistry {\n private static _icons: Map<string, IconDefinition> = new Map();\n /** Names registered via addBuiltIn \u2014 can be overridden by user add() calls */\n private static _builtInKeys: Set<string> = new Set();\n\n /** Register user icons. Always takes priority over built-in icons. */\n static add(icons: IconRegistryData) {\n for (const [name, data] of Object.entries(icons)) {\n if (typeof data === 'string') {\n this._icons.set(name, { paths: data, viewBox: defaultViewBox });\n } else {\n this._icons.set(name, data);\n }\n // Mark as user-defined (removes built-in status)\n this._builtInKeys.delete(name);\n }\n }\n\n /**\n * Register built-in icons provided by the library.\n * A built-in icon will NOT overwrite an icon already registered by the user.\n */\n static addBuiltIn(icons: IconRegistryData) {\n for (const [name, data] of Object.entries(icons)) {\n // Skip if the user has already registered this icon\n if (this._icons.has(name) && !this._builtInKeys.has(name)) continue;\n if (typeof data === 'string') {\n this._icons.set(name, { paths: data, viewBox: defaultViewBox });\n } else {\n this._icons.set(name, data);\n }\n this._builtInKeys.add(name);\n }\n }\n\n static get(name: string): IconDefinition | undefined {\n return this._icons.get(name);\n }\n\n static has(name: string): boolean {\n return this._icons.has(name);\n }\n}\n\nexport default IconRegistry;\n", "/**\n * Built-in system icons used internally by aeico components.\n * These are pre-registered so components work out of the box.\n * Users can override any of them by calling IconRegistry.add({ 'name': '...' }).\n *\n * All paths use the Material Design 24\u00D724 viewBox.\n */\nimport IconRegistry from './registry';\n\nIconRegistry.addBuiltIn({\n copy: 'M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z',\n check: 'M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z',\n 'chevron-left': 'M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z',\n 'chevron-right': 'M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z',\n 'chevron-up': 'M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z',\n 'chevron-down': 'M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z',\n 'chevrons-left': 'M18.41 16.59L13.82 12l4.59-4.59L17 6l-6 6 6 6zM6 6h2v12H6z',\n 'chevrons-right': 'M5.59 7.41L10.18 12l-4.59 4.59L7 18l6-6-6-6zM16 6h2v12h-2z',\n close:\n 'M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z',\n});\n", "export default \":host {\\n display: inline-flex;\\n position: relative;\\n vertical-align: middle;\\n\\n --ae-tooltip-z-index: 1000;\\n --ae-tooltip-bg: var(--ae-dark, #343a40);\\n --ae-tooltip-color: #fff;\\n --ae-tooltip-padding: 0.3125rem 0.625rem;\\n --ae-tooltip-font-size: 0.8125rem;\\n --ae-tooltip-arrow-size: 5px;\\n --ae-tooltip-gap: 6px;\\n --ae-tooltip-max-width: 20rem;\\n}\\n\\n:host-context([theme=\\\"dark\\\"]) {\\n --ae-tooltip-bg: var(--ae-light, #f8f9fa);\\n --ae-tooltip-color: var(--ae-dark, #343a40);\\n}\\n\\n.tooltip-panel {\\n display: none;\\n position: fixed;\\n z-index: var(--ae-tooltip-z-index);\\n background: var(--ae-tooltip-bg);\\n color: var(--ae-tooltip-color);\\n padding: var(--ae-tooltip-padding);\\n font-size: var(--ae-tooltip-font-size);\\n font-family: inherit;\\n border-radius: var(--ae-border-radius, var(--ae-radius-sm));\\n line-height: 1.4;\\n white-space: nowrap;\\n max-width: var(--ae-tooltip-max-width);\\n pointer-events: none;\\n box-sizing: border-box;\\n}\\n\\n:host([open]) .tooltip-panel {\\n display: block;\\n}\\n\\n/* Arrow */\\n.tooltip-panel::after {\\n content: '';\\n position: absolute;\\n border: var(--ae-tooltip-arrow-size) solid transparent;\\n pointer-events: none;\\n}\\n\\n.placement-top::after,\\n.placement-top-start::after,\\n.placement-top-end::after {\\n top: 100%;\\n border-top-color: var(--ae-tooltip-bg);\\n}\\n\\n.placement-top::after {\\n left: 50%;\\n transform: translateX(-50%);\\n}\\n\\n.placement-top-start::after {\\n left: calc(var(--ae-tooltip-arrow-size) * 2);\\n}\\n\\n.placement-top-end::after {\\n right: calc(var(--ae-tooltip-arrow-size) * 2);\\n}\\n\\n.placement-bottom::after,\\n.placement-bottom-start::after,\\n.placement-bottom-end::after {\\n bottom: 100%;\\n border-bottom-color: var(--ae-tooltip-bg);\\n}\\n\\n.placement-bottom::after {\\n left: 50%;\\n transform: translateX(-50%);\\n}\\n\\n.placement-bottom-start::after {\\n left: calc(var(--ae-tooltip-arrow-size) * 2);\\n}\\n\\n.placement-bottom-end::after {\\n right: calc(var(--ae-tooltip-arrow-size) * 2);\\n}\\n\\n.placement-left::after {\\n left: 100%;\\n top: 50%;\\n transform: translateY(-50%);\\n border-left-color: var(--ae-tooltip-bg);\\n}\\n\\n.placement-right::after {\\n right: 100%;\\n top: 50%;\\n transform: translateY(-50%);\\n border-right-color: var(--ae-tooltip-bg);\\n}\\n\"", "import type { InferProps } from 'aeico';\nimport styleVariables from '../styles/variables.css';\nimport tooltipStyle from '../styles/components/tooltip.css';\nimport AeicoComponent from '../aeico-component';\nimport { html, prop } from 'aeico';\nimport type { TooltipPlacement, TooltipTrigger } from './defines';\n\n/**\n * Tooltip Component\n *\n * A floating label that appears on hover or focus around its trigger content.\n * Wrap any element in `<ae-tooltip>` and provide content via the `content`\n * attribute (plain text) or the `tooltip` named slot (rich HTML).\n *\n * @example\n * ```html\n * <ae-tooltip content=\"Save file\">\n * <ae-button>Save</ae-button>\n * </ae-tooltip>\n *\n * <ae-tooltip placement=\"bottom-start\">\n * <span slot=\"tooltip\"><strong>Bold</strong> tip</span>\n * <ae-icon-button name=\"info\"></ae-icon-button>\n * </ae-tooltip>\n * ```\n */\nclass Tooltip extends AeicoComponent {\n protected static styles = [styleVariables, tooltipStyle];\n\n @prop({ type: String })\n accessor content: string | undefined;\n\n @prop({ type: String })\n accessor placement: TooltipPlacement = 'top';\n\n @prop({ type: Boolean })\n accessor disabled: boolean = false;\n\n @prop({ type: String })\n accessor trigger: TooltipTrigger = 'hover';\n\n @prop({ type: Boolean })\n accessor open: boolean = false;\n\n private _outsideClickHandler: ((e: MouseEvent) => void) | null = null;\n\n connectedCallback() {\n super.connectedCallback();\n this.listen('mouseenter', this._handleMouseEnter);\n this.listen('mouseleave', this._handleMouseLeave);\n this.listen('focusin', this._handleFocusin);\n this.listen('focusout', this._handleFocusout);\n this.listen('click', this._handleClick);\n\n this._outsideClickHandler = (e: MouseEvent) => {\n if (!this.open) return;\n if (!e.composedPath().includes(this)) this.open = false;\n };\n document.addEventListener('click', this._outsideClickHandler);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n if (this._outsideClickHandler) {\n document.removeEventListener('click', this._outsideClickHandler);\n this._outsideClickHandler = null;\n }\n }\n\n private _handleMouseEnter = () => {\n if (this.trigger !== 'hover') return;\n if (this.disabled) return;\n this.open = true;\n };\n\n private _handleMouseLeave = () => {\n if (this.trigger !== 'hover') return;\n this.open = false;\n };\n\n private _handleFocusin = () => {\n if (this.trigger !== 'hover') return;\n if (this.disabled) return;\n this.open = true;\n };\n\n private _handleFocusout = () => {\n if (this.trigger !== 'hover') return;\n this.open = false;\n };\n\n private _handleClick = () => {\n if (this.trigger !== 'click') return;\n if (this.disabled) return;\n this.open = !this.open;\n };\n\n private _updatePosition() {\n const panel = this.shadowRoot?.querySelector<HTMLElement>('.tooltip-panel');\n if (!panel) return;\n\n const host = this.getBoundingClientRect();\n const panelRect = panel.getBoundingClientRect();\n const gap = 6; // Match --ae-tooltip-gap: 6px\n const pw = panelRect.width;\n const ph = panelRect.height;\n\n let top: number;\n let left: number;\n\n switch (this.placement) {\n case 'top-start':\n top = host.top - ph - gap;\n left = host.left;\n break;\n case 'top-end':\n top = host.top - ph - gap;\n left = host.right - pw;\n break;\n case 'bottom':\n top = host.bottom + gap;\n left = host.left + host.width / 2 - pw / 2;\n break;\n case 'bottom-start':\n top = host.bottom + gap;\n left = host.left;\n break;\n case 'bottom-end':\n top = host.bottom + gap;\n left = host.right - pw;\n break;\n case 'left':\n top = host.top + host.height / 2 - ph / 2;\n left = host.left - pw - gap;\n break;\n case 'right':\n top = host.top + host.height / 2 - ph / 2;\n left = host.right + gap;\n break;\n default: // 'top'\n top = host.top - ph - gap;\n left = host.left + host.width / 2 - pw / 2;\n }\n\n panel.style.top = `${top}px`;\n panel.style.left = `${left}px`;\n }\n\n protected onUpdated(changedProps: Map<string, unknown>) {\n if (changedProps.has('open') && this.open) {\n this._updatePosition();\n }\n }\n\n protected render() {\n return html(({ div, span, slot }) => {\n slot();\n div(\n {\n className: `tooltip-panel placement-${this.placement ?? 'top'}`,\n role: 'tooltip',\n 'aria-hidden': String(!this.open),\n },\n () => {\n slot({ name: 'tooltip' }, () => {\n span({ textContent: this.content ?? '' });\n });\n },\n );\n });\n }\n}\n\nTooltip.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-tooltip': Tooltip;\n }\n}\n\nexport type TooltipProps = InferProps<typeof Tooltip>;\nexport default Tooltip;\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAO,oBAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAf,IAAO,eAAQ;;;ACAf,IAAO,gBAAQ;;;ACAf,IAAO,sBAAQ;;;ACAd,SAAS,oBAAoB;;;ACAvB,IAAM,SAAS;AAEf,SAAS,QAAQ,KAAqB;AAC3C,QAAM,UAAU,IAAI,QAAQ,WAAW,EAAE;AAEzC,SAAO,QAAQ,QAAQ,mBAAmB,OAAO,EAAE,YAAY;AACjE;;;ADHA,IAAM,kBAAkB;AAKxB,IAAM,iBAAN,cAA6B,aAAa;AAAA,EACxC,OAAO,SAAS,MAAe;AAC7B,UAAM,UAAU,QAAQ,GAAG,eAAe,IAAI,KAAK,WAAW,QAAQ,KAAK,IAAI,CAAC;AAEhF,UAAM,SAAS,OAAO;AAAA,EACxB;AACF;AAEA,IAAO,0BAAQ;;;AEVf,SAAS,QAAAA,aAAY;AACrB,SAAS,QAAAC,aAAY;;;ACJrB,SAAS,YAAY;;;ACHrB,IAAO,eAAQ;;;ACyBR,IAAM,iBAAiB;;;ACvB9B,IAAM,eAAN,MAAmB;AAAA,EACjB,OAAe,SAAsC,oBAAI,IAAI;AAAA;AAAA,EAE7D,OAAe,eAA4B,oBAAI,IAAI;AAAA;AAAA,EAGnD,OAAO,IAAI,OAAyB;AAClC,eAAW,CAAC,MAAM,IAAI,KAAK,OAAO,QAAQ,KAAK,GAAG;AAChD,UAAI,OAAO,SAAS,UAAU;AAC5B,aAAK,OAAO,IAAI,MAAM,EAAE,OAAO,MAAM,SAAS,eAAe,CAAC;AAAA,MAChE,OAAO;AACL,aAAK,OAAO,IAAI,MAAM,IAAI;AAAA,MAC5B;AAEA,WAAK,aAAa,OAAO,IAAI;AAAA,IAC/B;AAAA,EACF;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,OAAO,WAAW,OAAyB;AACzC,eAAW,CAAC,MAAM,IAAI,KAAK,OAAO,QAAQ,KAAK,GAAG;AAEhD,UAAI,KAAK,OAAO,IAAI,IAAI,KAAK,CAAC,KAAK,aAAa,IAAI,IAAI,EAAG;AAC3D,UAAI,OAAO,SAAS,UAAU;AAC5B,aAAK,OAAO,IAAI,MAAM,EAAE,OAAO,MAAM,SAAS,eAAe,CAAC;AAAA,MAChE,OAAO;AACL,aAAK,OAAO,IAAI,MAAM,IAAI;AAAA,MAC5B;AACA,WAAK,aAAa,IAAI,IAAI;AAAA,IAC5B;AAAA,EACF;AAAA,EAEA,OAAO,IAAI,MAA0C;AACnD,WAAO,KAAK,OAAO,IAAI,IAAI;AAAA,EAC7B;AAAA,EAEA,OAAO,IAAI,MAAuB;AAChC,WAAO,KAAK,OAAO,IAAI,IAAI;AAAA,EAC7B;AACF;AAEA,IAAO,mBAAQ;;;ACrCf,iBAAa,WAAW;AAAA,EACtB,MAAM;AAAA,EACN,OAAO;AAAA,EACP,gBAAgB;AAAA,EAChB,iBAAiB;AAAA,EACjB,cAAc;AAAA,EACd,gBAAgB;AAAA,EAChB,iBAAiB;AAAA,EACjB,kBAAkB;AAAA,EAClB,OACE;AACJ,CAAC;;;AJPD,IAAM,OAAN,cAAmB,wBAAe;AAAA,EAChC,OAAO,UAAU;AAAA,EAEjB,OAAO,QAAe;AAAA,IACpB,MAAM,EAAE,MAAM,OAAO;AAAA,IACrB,MAAM,EAAE,MAAM,OAAO;AAAA,IACrB,OAAO,EAAE,MAAM,OAAO;AAAA,IACtB,QAAQ,EAAE,MAAM,QAAQ;AAAA,IACxB,aAAa,EAAE,MAAM,OAAO;AAAA,EAC9B;AAAA,EAQA,OAAiB,SAAS,CAAC,mBAAgB,cAAS,eAAU,YAAK;AAAA,EAEzD,SAAS;AACjB,UAAM,MAAM,KAAK,OAAO,iBAAa,IAAI,KAAK,IAAI,IAAI;AAGtD,UAAM,cAAc,OAAO,KAAK,IAAI;AACpC,QAAI,KAAK,SAAS,UAAa,CAAC,MAAM,WAAW,KAAK,cAAc,GAAG;AACrE,WAAK,MAAM,YAAY,aAAa,GAAG,WAAW,IAAI;AAAA,IACxD,OAAO;AACL,WAAK,MAAM,eAAe,WAAW;AAAA,IACvC;AAEA,QAAI,CAAC,IAAK;AAEV,UAAM,EAAE,MAAM,IAAI;AAClB,UAAM,cAAc,MAAM,QAAQ,KAAK;AAGvC,QAAI,CAAC,aAAa;AAChB,YAAM,YACJ,KAAK,WAAW,KAAK,gBAAgB,SAAY,OAAQ,IAAI,UAAU;AACzE,YAAM,iBAAiB,KAAK,eAAe,IAAI,eAAe;AAE9D,UAAI,WAAW;AACb,aAAK,MAAM,YAAY,eAAe,MAAM;AAC5C,aAAK,MAAM,YAAY,iBAAiB,cAAc;AACtD,aAAK,MAAM,YAAY,uBAAuB,OAAO,cAAc,CAAC;AAAA,MACtE,OAAO;AACL,aAAK,MAAM,eAAe,aAAa;AACvC,aAAK,MAAM,eAAe,eAAe;AACzC,aAAK,MAAM,eAAe,qBAAqB;AAAA,MACjD;AAAA,IACF,OAAO;AACL,WAAK,MAAM,eAAe,aAAa;AACvC,WAAK,MAAM,eAAe,eAAe;AACzC,WAAK,MAAM,eAAe,qBAAqB;AAAA,IACjD;AAEA,WAAO,KAAK,CAAC,EAAE,KAAK,KAAK,MAAM;AAC7B;AAAA,QACE;AAAA,UACE,WAAW;AAAA,UACX,SAAS,IAAI,WAAW;AAAA,UACxB,eAAe;AAAA,UACf,OAAO;AAAA,QACT;AAAA,QACA,MAAM;AACJ,cAAI,OAAO,UAAU,UAAU;AAC7B,iBAAK,EAAE,GAAG,MAAM,CAAC;AAAA,UACnB,OAAO;AACL,uBAAW,KAAK,OAAO;AACrB,oBAAM,QAAiC,EAAE,GAAG,EAAE,EAAE;AAChD,kBAAI,EAAE,KAAM,OAAM,QAAQ,EAAE,MAAM,EAAE,KAAK;AACzC,mBAAK,KAAK;AAAA,YACZ;AAAA,UACF;AAAA,QACF;AAAA,MACF;AAAA,IACF,CAAC;AAAA,EACH;AACF;AAEA,KAAK,SAAS;;;AK7Fd,IAAO,kBAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACIf,SAAS,QAAAC,OAAM,YAAY;AAJ3B;AA0BA,IAAM,UAAN,eAAsB,8BAGpB,gBAAC,KAAK,EAAE,MAAM,OAAO,CAAC,IAGtB,kBAAC,KAAK,EAAE,MAAM,OAAO,CAAC,IAGtB,iBAAC,KAAK,EAAE,MAAM,QAAQ,CAAC,IAGvB,gBAAC,KAAK,EAAE,MAAM,OAAO,CAAC,IAGtB,aAAC,KAAK,EAAE,MAAM,QAAQ,CAAC,IAfH,IAAe;AAAA,EAArC;AAAA;AAIE,uBAAS,UAAT;AAGA,uBAAS,YAA8B,kBAAvC,iBAAuC,SAAvC;AAGA,uBAAS,WAAoB,kBAA7B,iBAA6B,SAA7B;AAGA,uBAAS,UAA0B,kBAAnC,iBAAmC,WAAnC;AAGA,uBAAS,OAAgB,kBAAzB,iBAAyB,SAAzB;AAEA,wBAAQ,wBAAyD;AAyBjE,wBAAQ,qBAAoB,MAAM;AAChC,UAAI,KAAK,YAAY,QAAS;AAC9B,UAAI,KAAK,SAAU;AACnB,WAAK,OAAO;AAAA,IACd;AAEA,wBAAQ,qBAAoB,MAAM;AAChC,UAAI,KAAK,YAAY,QAAS;AAC9B,WAAK,OAAO;AAAA,IACd;AAEA,wBAAQ,kBAAiB,MAAM;AAC7B,UAAI,KAAK,YAAY,QAAS;AAC9B,UAAI,KAAK,SAAU;AACnB,WAAK,OAAO;AAAA,IACd;AAEA,wBAAQ,mBAAkB,MAAM;AAC9B,UAAI,KAAK,YAAY,QAAS;AAC9B,WAAK,OAAO;AAAA,IACd;AAEA,wBAAQ,gBAAe,MAAM;AAC3B,UAAI,KAAK,YAAY,QAAS;AAC9B,UAAI,KAAK,SAAU;AACnB,WAAK,OAAO,CAAC,KAAK;AAAA,IACpB;AAAA;AAAA,EAjDA,oBAAoB;AAClB,UAAM,kBAAkB;AACxB,SAAK,OAAO,cAAc,KAAK,iBAAiB;AAChD,SAAK,OAAO,cAAc,KAAK,iBAAiB;AAChD,SAAK,OAAO,WAAW,KAAK,cAAc;AAC1C,SAAK,OAAO,YAAY,KAAK,eAAe;AAC5C,SAAK,OAAO,SAAS,KAAK,YAAY;AAEtC,SAAK,uBAAuB,CAAC,MAAkB;AAC7C,UAAI,CAAC,KAAK,KAAM;AAChB,UAAI,CAAC,EAAE,aAAa,EAAE,SAAS,IAAI,EAAG,MAAK,OAAO;AAAA,IACpD;AACA,aAAS,iBAAiB,SAAS,KAAK,oBAAoB;AAAA,EAC9D;AAAA,EAEA,uBAAuB;AACrB,UAAM,qBAAqB;AAC3B,QAAI,KAAK,sBAAsB;AAC7B,eAAS,oBAAoB,SAAS,KAAK,oBAAoB;AAC/D,WAAK,uBAAuB;AAAA,IAC9B;AAAA,EACF;AAAA,EA8BQ,kBAAkB;AACxB,UAAM,QAAQ,KAAK,YAAY,cAA2B,gBAAgB;AAC1E,QAAI,CAAC,MAAO;AAEZ,UAAM,OAAO,KAAK,sBAAsB;AACxC,UAAM,YAAY,MAAM,sBAAsB;AAC9C,UAAM,MAAM;AACZ,UAAM,KAAK,UAAU;AACrB,UAAM,KAAK,UAAU;AAErB,QAAI;AACJ,QAAI;AAEJ,YAAQ,KAAK,WAAW;AAAA,MACtB,KAAK;AACH,cAAM,KAAK,MAAM,KAAK;AACtB,eAAO,KAAK;AACZ;AAAA,MACF,KAAK;AACH,cAAM,KAAK,MAAM,KAAK;AACtB,eAAO,KAAK,QAAQ;AACpB;AAAA,MACF,KAAK;AACH,cAAM,KAAK,SAAS;AACpB,eAAO,KAAK,OAAO,KAAK,QAAQ,IAAI,KAAK;AACzC;AAAA,MACF,KAAK;AACH,cAAM,KAAK,SAAS;AACpB,eAAO,KAAK;AACZ;AAAA,MACF,KAAK;AACH,cAAM,KAAK,SAAS;AACpB,eAAO,KAAK,QAAQ;AACpB;AAAA,MACF,KAAK;AACH,cAAM,KAAK,MAAM,KAAK,SAAS,IAAI,KAAK;AACxC,eAAO,KAAK,OAAO,KAAK;AACxB;AAAA,MACF,KAAK;AACH,cAAM,KAAK,MAAM,KAAK,SAAS,IAAI,KAAK;AACxC,eAAO,KAAK,QAAQ;AACpB;AAAA,MACF;AACE,cAAM,KAAK,MAAM,KAAK;AACtB,eAAO,KAAK,OAAO,KAAK,QAAQ,IAAI,KAAK;AAAA,IAC7C;AAEA,UAAM,MAAM,MAAM,GAAG,GAAG;AACxB,UAAM,MAAM,OAAO,GAAG,IAAI;AAAA,EAC5B;AAAA,EAEU,UAAU,cAAoC;AACtD,QAAI,aAAa,IAAI,MAAM,KAAK,KAAK,MAAM;AACzC,WAAK,gBAAgB;AAAA,IACvB;AAAA,EACF;AAAA,EAEU,SAAS;AACjB,WAAOC,MAAK,CAAC,EAAE,KAAK,MAAM,KAAK,MAAM;AACnC,WAAK;AACL;AAAA,QACE;AAAA,UACE,WAAW,2BAA2B,KAAK,aAAa,KAAK;AAAA,UAC7D,MAAM;AAAA,UACN,eAAe,OAAO,CAAC,KAAK,IAAI;AAAA,QAClC;AAAA,QACA,MAAM;AACJ,eAAK,EAAE,MAAM,UAAU,GAAG,MAAM;AAC9B,iBAAK,EAAE,aAAa,KAAK,WAAW,GAAG,CAAC;AAAA,UAC1C,CAAC;AAAA,QACH;AAAA,MACF;AAAA,IACF,CAAC;AAAA,EACH;AACF;AAjJA;AAIW;AAGA;AAGA;AAGA;AAGA;AAZT,4BAAS,WADT,cAHI,SAIK;AAGT,4BAAS,aADT,gBANI,SAOK;AAGT,4BAAS,YADT,eATI,SAUK;AAGT,4BAAS,WADT,cAZI,SAaK;AAGT,4BAAS,QADT,WAfI,SAgBK;AAhBX,2BAAM;AACJ,cADI,SACa,UAAS,CAAC,mBAAgB,eAAY;AAkJzD,QAAQ,SAAS;;;AP7KjB,4EAAAC,gBAAA,gDAAAC,KAAAC,QAAA,gCAAAC,YAAA;AAeA,IAAM,aAAN,eAAyBF,MAAA,yBAGvB,aAACG,MAAK,EAAE,MAAM,OAAO,CAAC,IAGtB,cAACA,MAAK,EAAE,MAAM,OAAO,CAAC,IAGtB,gBAACA,MAAK,EAAE,MAAM,OAAO,CAAC,IAGtB,aAACA,MAAK,EAAE,MAAM,OAAO,CAAC,IAGtBJ,iBAAA,CAACI,MAAK,EAAE,MAAM,QAAQ,CAAC,IAGvB,iBAACA,MAAK,EAAE,MAAM,OAAO,CAAC,IAGtB,gBAACA,MAAK,EAAE,MAAM,OAAO,CAAC,IAGtB,sBAACA,MAAK,EAAE,MAAM,OAAO,CAAC,IAGtB,yBAACA,MAAK,EAAE,MAAM,OAAO,CAAC,IA3BCH,KAAe;AAAA,EAAxC;AAAA;AAIE,uBAAS,OAAT,kBAAAC,QAAA,6BAAAA,QAAA;AAGA,uBAAS,QAAT,kBAAAA,QAAA,8BAAAA,QAAA;AAGA,uBAAS,UAAT,kBAAAA,QAAA,8BAAAA,QAAA;AAGA,uBAAS,OAAT,kBAAAA,QAAA,8BAAAA,QAAA;AAGA,uBAASC,YAAT,kBAAAD,QAAA,8BAAAA,QAAA;AAGA,uBAAS,WAAT,kBAAAA,QAAA,8BAAAA,QAAA;AAGA,uBAAS,UAAkB,kBAA3BA,QAAA,UAA2B,UAA3B,kBAAAA,QAAA;AAGA,uBAAS,gBAAwB,kBAAjCA,QAAA,UAAiC,aAAjC,kBAAAA,QAAA;AAGA,uBAAS,mBAAqC,kBAA9CA,QAAA,UAA8C,SAA9C,kBAAAA,QAAA;AAEA,wBAAQ,gBAAuC;AAC/C,wBAAQ,cAA6B;AACrC,wBAAQ,eAAoD;AAgB5D,wBAAQ,gBAAe,MAAM;AAC3B,UAAI,KAAK,SAAU;AAEnB,YAAM,aAAa,KAAK,eAAe;AAEvC,WAAK,UAAU,UAAU,UAAU,UAAU,EAAE,KAAK,MAAM;AACxD,aAAK,aAAa,UAAU,EAAE;AAE9B,YAAI,KAAK,YAAY;AACnB,eAAK,WAAW,UAAU,KAAK;AAC/B,eAAK,WAAW,OAAO;AAAA,QACzB;AAEA,YAAI,KAAK,gBAAgB,MAAM;AAC7B,uBAAa,KAAK,WAAW;AAAA,QAC/B;AACA,cAAM,WAAW,KAAK,YAAY;AAClC,aAAK,cAAc,WAAW,MAAM;AAClC,eAAK,gBAAgB,QAAQ;AAC7B,cAAI,KAAK,YAAY;AACnB,iBAAK,WAAW,UAAU,KAAK;AAC/B,iBAAK,WAAW,OAAO;AAAA,UACzB;AACA,eAAK,cAAc;AAAA,QACrB,GAAG,QAAQ;AAEX,aAAK;AAAA,UACH,IAAI,YAAY,QAAQ;AAAA,YACtB,SAAS;AAAA,YACT,UAAU;AAAA,YACV,QAAQ,EAAE,MAAM,WAAW;AAAA,UAC7B,CAAC;AAAA,QACH;AAAA,MACF,CAAC;AAAA,IACH;AAAA;AAAA,EAhDQ,iBAAyB;AAC/B,QAAI,KAAK,QAAQ,KAAM,QAAO,KAAK;AAEnC,UAAM,QAAQ,KAAK,cAAc,cAAc,EAAE,SAAS,KAAK,CAAC,KAAK,CAAC;AAEtE,WAAO,MACJ,OAAe,CAAC,MAAM,MAAM;AAC3B,UAAI,EAAE,aAAa,KAAK,UAAW,QAAO,QAAQ,EAAE,eAAe;AAEnE,aAAO;AAAA,IACT,GAAG,EAAE,EACJ,KAAK;AAAA,EACV;AAAA,EAsCU,cAAc;AACtB,QAAI,KAAK,gBAAgB,MAAM;AAC7B,mBAAa,KAAK,WAAW;AAC7B,WAAK,cAAc;AAAA,IACrB;AAAA,EACF;AAAA,EAEU,SAAS;AACjB,WAAOG,MAAK,CAAC,EAAE,WAAW,QAAQ,MAAM,MAAM,OAAO,MAAM;AACzD,WAAK,aAAa;AAAA,QAChB;AAAA,UACE,SAAS,KAAK;AAAA,UACd,WAAW,KAAK;AAAA,UAChB,UAAU,KAAK;AAAA,QACjB;AAAA,QACA,MAAM;AACJ;AAAA,YACE;AAAA,cACE,MAAM;AAAA,cACN,UAAU,KAAK;AAAA,cACf,MAAM;AAAA,cACN,cAAc,KAAK;AAAA,cACnB,iBAAiB,KAAK;AAAA,cACtB,UAAU,KAAK;AAAA,YACjB;AAAA,YACA,MAAM;AACJ,mBAAK,EAAE,WAAW,YAAY,GAAG,MAAM;AACrC,uBAAO,EAAE,MAAM,QAAQ,MAAM,KAAK,KAAK,CAAC;AAAA,cAC1C,CAAC;AACD,mBAAK,EAAE,WAAW,aAAa,GAAG,MAAM;AACtC,uBAAO,EAAE,MAAM,SAAS,MAAM,KAAK,KAAK,CAAC;AAAA,cAC3C,CAAC;AACD,mBAAK,eAAe,KAAK;AAAA,YAC3B;AAAA,UACF;AAAA,QACF;AAAA,MACF;AAAA,IACF,CAAC;AAAA,EACH;AACF;AA3HAH,SAAA,iBAAAD;AAIW;AAGA;AAGA;AAGA;AAGAE,aAAA;AAGA;AAGA;AAGA;AAGA;AAxBT,kBAAAD,QAAA,GAAS,QADT,WAHI,YAIK;AAGT,kBAAAA,QAAA,GAAS,SADT,YANI,YAOK;AAGT,kBAAAA,QAAA,GAAS,WADT,cATI,YAUK;AAGT,kBAAAA,QAAA,GAAS,QADT,WAZI,YAaK;AAGT,kBAAAA,QAAA,GAAS,YADTF,gBAfI,YAgBKG;AAGT,kBAAAD,QAAA,GAAS,YADT,eAlBI,YAmBK;AAGT,kBAAAA,QAAA,GAAS,WADT,cArBI,YAsBK;AAGT,kBAAAA,QAAA,GAAS,iBADT,oBAxBI,YAyBK;AAGT,kBAAAA,QAAA,GAAS,oBADT,uBA3BI,YA4BK;AA5BX,oBAAAA,QAAM;AACJ,cADI,YACa,UAAS,CAAC,mBAAgB,cAAS,eAAU,mBAAe;AA4H/E,WAAW,SAAS;AAQpB,IAAOI,uBAAQ;",
|
|
3
|
+
"sources": ["css-inline:/home/runner/work/aeico-components/aeico-components/src/styles/variables.css", "css-inline:/home/runner/work/aeico-components/aeico-components/src/styles/size.css", "css-inline:/home/runner/work/aeico-components/aeico-components/src/styles/color.css", "css-inline:/home/runner/work/aeico-components/aeico-components/src/styles/components/copy-button.css", "../src/aeico-component.ts", "../src/copy-button/copy-button.ts", "../src/utils.ts", "../src/icon/icon.ts", "css-inline:/home/runner/work/aeico-components/aeico-components/src/styles/components/icon.css", "../src/icon/defines.ts", "../src/icon/registry.ts", "../src/icon/built-in-icons.ts", "css-inline:/home/runner/work/aeico-components/aeico-components/src/styles/components/tooltip.css", "../src/tooltip/tooltip.ts"],
|
|
4
|
+
"sourcesContent": ["export default \":root,\\n:host {\\n --ae-font-sans-serif: system-ui, -apple-system, \\\"Segoe UI\\\", Roboto, \\\"Helvetica Neue\\\",\\n \\\"Noto Sans\\\", \\\"Liberation Sans\\\", Arial, sans-serif,\\n \\\"Apple Color Emoji\\\", \\\"Segoe UI Emoji\\\", \\\"Segoe UI Symbol\\\", \\\"Noto Color Emoji\\\";\\n --ae-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas,\\n \\\"Liberation Mono\\\", \\\"Courier New\\\", monospace;\\n font-family: var(--ae-font-sans-serif);\\n --ae-blue: #0e639c;\\n --ae-green: #28a745;\\n --ae-red: #dc3545;\\n --ae-yellow: #ffc107;\\n --ae-cyan: #17a2b8;\\n --ae-gray: #6e6e6e;\\n --ae-slate: #64748b;\\n --ae-dark: #343a40;\\n --ae-light: #f8f9fa;\\n}\\n\\n:root,\\n:host {\\n /* Blue */\\n --ae-blue-100: color-mix(in srgb, var(--ae-blue) 20%, white);\\n --ae-blue-200: color-mix(in srgb, var(--ae-blue) 40%, white);\\n --ae-blue-300: color-mix(in srgb, var(--ae-blue) 60%, white);\\n --ae-blue-400: color-mix(in srgb, var(--ae-blue) 80%, white);\\n --ae-blue-500: var(--ae-blue);\\n --ae-blue-600: color-mix(in srgb, var(--ae-blue) 80%, black);\\n --ae-blue-700: color-mix(in srgb, var(--ae-blue) 60%, black);\\n --ae-blue-800: color-mix(in srgb, var(--ae-blue) 40%, black);\\n --ae-blue-900: color-mix(in srgb, var(--ae-blue) 20%, black);\\n\\n /* Green */\\n --ae-green-100: color-mix(in srgb, var(--ae-green) 20%, white);\\n --ae-green-200: color-mix(in srgb, var(--ae-green) 40%, white);\\n --ae-green-300: color-mix(in srgb, var(--ae-green) 60%, white);\\n --ae-green-400: color-mix(in srgb, var(--ae-green) 80%, white);\\n --ae-green-500: var(--ae-green);\\n --ae-green-600: color-mix(in srgb, var(--ae-green) 80%, black);\\n --ae-green-700: color-mix(in srgb, var(--ae-green) 60%, black);\\n --ae-green-800: color-mix(in srgb, var(--ae-green) 40%, black);\\n --ae-green-900: color-mix(in srgb, var(--ae-green) 20%, black);\\n\\n /* Red */\\n --ae-red-100: color-mix(in srgb, var(--ae-red) 20%, white);\\n --ae-red-200: color-mix(in srgb, var(--ae-red) 40%, white);\\n --ae-red-300: color-mix(in srgb, var(--ae-red) 60%, white);\\n --ae-red-400: color-mix(in srgb, var(--ae-red) 80%, white);\\n --ae-red-500: var(--ae-red);\\n --ae-red-600: color-mix(in srgb, var(--ae-red) 80%, black);\\n --ae-red-700: color-mix(in srgb, var(--ae-red) 60%, black);\\n --ae-red-800: color-mix(in srgb, var(--ae-red) 40%, black);\\n --ae-red-900: color-mix(in srgb, var(--ae-red) 20%, black);\\n\\n /* Yellow */\\n --ae-yellow-100: color-mix(in srgb, var(--ae-yellow) 20%, white);\\n --ae-yellow-200: color-mix(in srgb, var(--ae-yellow) 40%, white);\\n --ae-yellow-300: color-mix(in srgb, var(--ae-yellow) 60%, white);\\n --ae-yellow-400: color-mix(in srgb, var(--ae-yellow) 80%, white);\\n --ae-yellow-500: var(--ae-yellow);\\n --ae-yellow-600: color-mix(in srgb, var(--ae-yellow) 80%, black);\\n --ae-yellow-700: color-mix(in srgb, var(--ae-yellow) 60%, black);\\n --ae-yellow-800: color-mix(in srgb, var(--ae-yellow) 40%, black);\\n --ae-yellow-900: color-mix(in srgb, var(--ae-yellow) 20%, black);\\n\\n /* Cyan */\\n --ae-cyan-100: color-mix(in srgb, var(--ae-cyan) 20%, white);\\n --ae-cyan-200: color-mix(in srgb, var(--ae-cyan) 40%, white);\\n --ae-cyan-300: color-mix(in srgb, var(--ae-cyan) 60%, white);\\n --ae-cyan-400: color-mix(in srgb, var(--ae-cyan) 80%, white);\\n --ae-cyan-500: var(--ae-cyan);\\n --ae-cyan-600: color-mix(in srgb, var(--ae-cyan) 80%, black);\\n --ae-cyan-700: color-mix(in srgb, var(--ae-cyan) 60%, black);\\n --ae-cyan-800: color-mix(in srgb, var(--ae-cyan) 40%, black);\\n --ae-cyan-900: color-mix(in srgb, var(--ae-cyan) 20%, black);\\n\\n /* Gray (neutral - base #6e6e6e) */\\n --ae-gray-100: color-mix(in srgb, var(--ae-gray) 20%, white);\\n --ae-gray-200: color-mix(in srgb, var(--ae-gray) 40%, white);\\n --ae-gray-300: color-mix(in srgb, var(--ae-gray) 60%, white);\\n --ae-gray-400: color-mix(in srgb, var(--ae-gray) 80%, white);\\n --ae-gray-500: var(--ae-gray);\\n --ae-gray-600: color-mix(in srgb, var(--ae-gray) 80%, black);\\n --ae-gray-700: color-mix(in srgb, var(--ae-gray) 60%, black);\\n --ae-gray-800: color-mix(in srgb, var(--ae-gray) 40%, black);\\n --ae-gray-900: color-mix(in srgb, var(--ae-gray) 20%, black);\\n\\n /* Slate (blue-gray - base #64748b, used for 'secondary') */\\n --ae-slate-100: color-mix(in srgb, var(--ae-slate) 20%, white);\\n --ae-slate-200: color-mix(in srgb, var(--ae-slate) 40%, white);\\n --ae-slate-300: color-mix(in srgb, var(--ae-slate) 60%, white);\\n --ae-slate-400: color-mix(in srgb, var(--ae-slate) 80%, white);\\n --ae-slate-500: var(--ae-slate);\\n --ae-slate-600: color-mix(in srgb, var(--ae-slate) 80%, black);\\n --ae-slate-700: color-mix(in srgb, var(--ae-slate) 60%, black);\\n --ae-slate-800: color-mix(in srgb, var(--ae-slate) 40%, black);\\n --ae-slate-900: color-mix(in srgb, var(--ae-slate) 20%, black);\\n\\n /* Dark (base #343a40) */\\n --ae-dark-100: color-mix(in srgb, var(--ae-dark) 20%, white);\\n --ae-dark-200: color-mix(in srgb, var(--ae-dark) 40%, white);\\n --ae-dark-300: color-mix(in srgb, var(--ae-dark) 60%, white);\\n --ae-dark-400: color-mix(in srgb, var(--ae-dark) 80%, white);\\n --ae-dark-500: var(--ae-dark);\\n --ae-dark-600: color-mix(in srgb, var(--ae-dark) 80%, black);\\n --ae-dark-700: color-mix(in srgb, var(--ae-dark) 60%, black);\\n --ae-dark-800: color-mix(in srgb, var(--ae-dark) 40%, black);\\n --ae-dark-900: color-mix(in srgb, var(--ae-dark) 20%, black);\\n\\n /* Light (base #f8f9fa) */\\n --ae-light-100: color-mix(in srgb, var(--ae-light) 20%, white);\\n --ae-light-200: color-mix(in srgb, var(--ae-light) 40%, white);\\n --ae-light-300: color-mix(in srgb, var(--ae-light) 60%, white);\\n --ae-light-400: color-mix(in srgb, var(--ae-light) 80%, white);\\n --ae-light-500: var(--ae-light);\\n --ae-light-600: color-mix(in srgb, var(--ae-light) 80%, black);\\n --ae-light-700: color-mix(in srgb, var(--ae-light) 60%, black);\\n --ae-light-800: color-mix(in srgb, var(--ae-light) 40%, black);\\n --ae-light-900: color-mix(in srgb, var(--ae-light) 20%, black);\\n}\\n\\n:root,\\n:host {\\n /* Hover / active mix (light default - overridden in \u00A7 6 dark) */\\n --ae-color-mix-hover: black 10%;\\n --ae-color-mix-active: black 20%;\\n\\n /* Primary (Blue) */\\n --ae-color-primary: var(--ae-blue-500);\\n --ae-color-primary-hover: color-mix(in srgb, var(--ae-color-primary), var(--ae-color-mix-hover));\\n --ae-color-primary-active: color-mix(in srgb, var(--ae-color-primary), var(--ae-color-mix-active));\\n --ae-color-primary-disabled: color-mix(in srgb, var(--ae-blue) 50%, var(--ae-gray-500));\\n\\n /* Success (Green) */\\n --ae-color-success: var(--ae-green-500);\\n --ae-color-success-hover: color-mix(in srgb, var(--ae-color-success), var(--ae-color-mix-hover));\\n --ae-color-success-active: color-mix(in srgb, var(--ae-color-success), var(--ae-color-mix-active));\\n --ae-color-success-disabled: color-mix(in srgb, var(--ae-green) 50%, var(--ae-gray-500));\\n\\n /* Danger (Red) */\\n --ae-color-danger: var(--ae-red-500);\\n --ae-color-danger-hover: color-mix(in srgb, var(--ae-color-danger), var(--ae-color-mix-hover));\\n --ae-color-danger-active: color-mix(in srgb, var(--ae-color-danger), var(--ae-color-mix-active));\\n --ae-color-danger-disabled: color-mix(in srgb, var(--ae-red) 50%, var(--ae-gray-500));\\n\\n /* Warning (Yellow) */\\n --ae-color-warning: var(--ae-yellow-500);\\n --ae-color-warning-hover: color-mix(in srgb, var(--ae-color-warning), var(--ae-color-mix-hover));\\n --ae-color-warning-active: color-mix(in srgb, var(--ae-color-warning), var(--ae-color-mix-active));\\n --ae-color-warning-disabled: color-mix(in srgb, var(--ae-yellow) 50%, var(--ae-gray-500));\\n\\n /* Info (Cyan) */\\n --ae-color-info: var(--ae-cyan-500);\\n --ae-color-info-hover: color-mix(in srgb, var(--ae-color-info), var(--ae-color-mix-hover));\\n --ae-color-info-active: color-mix(in srgb, var(--ae-color-info), var(--ae-color-mix-active));\\n --ae-color-info-disabled: color-mix(in srgb, var(--ae-cyan) 50%, var(--ae-gray-500));\\n\\n /* Secondary (Slate) - base differs per theme, overridden in \u00A7 6 dark */\\n --ae-color-secondary: var(--ae-slate-500);\\n --ae-color-secondary-hover: color-mix(in srgb, var(--ae-color-secondary), var(--ae-color-mix-hover));\\n --ae-color-secondary-active: color-mix(in srgb, var(--ae-color-secondary), var(--ae-color-mix-active));\\n --ae-color-secondary-text: var(--ae-slate-700);\\n}\\n\\n\\n.theme-light,\\n:root[theme=\\\"light\\\"],\\n:host([theme=\\\"light\\\"]),\\n:host-context([theme=\\\"light\\\"]),\\n:where(:root),\\n:host {\\n color-scheme: light;\\n\\n /* Gray UI aliases - lighter palette steps for elements on white background */\\n --ae-color-gray-dark: var(--ae-gray-400);\\n --ae-color-gray: var(--ae-gray-300);\\n --ae-color-gray-light: var(--ae-gray-200);\\n --ae-color-gray-lighter: var(--ae-gray-100);\\n --ae-color-gray-lightest: color-mix(in srgb, var(--ae-gray) 10%, white);\\n\\n /* Text */\\n --ae-color-text-main: var(--ae-dark-700);\\n --ae-color-text-muted: var(--ae-gray-600);\\n --ae-color-text-disabled: var(--ae-gray-300);\\n --ae-color-text-link: var(--ae-blue-500);\\n --ae-color-text-link-hover: var(--ae-blue-700);\\n\\n /* Surfaces */\\n --ae-surface-sunken: var(--ae-light-500);\\n --ae-surface-base: white;\\n --ae-surface-raised: var(--ae-light-500);\\n --ae-surface-overlay: white;\\n --ae-color-overlay: rgba(0, 0, 0, 0.4);\\n\\n /* Borders */\\n --ae-border-subtle: rgba(0, 0, 0, 0.08);\\n --ae-border-default: rgba(0, 0, 0, 0.15);\\n --ae-border-hover: rgba(0, 0, 0, 0.25);\\n --ae-border-focus: var(--ae-color-primary);\\n --ae-border-disabled: rgba(0, 0, 0, 0.06);\\n\\n /* Focus ring */\\n --ae-focus-ring: rgb(from var(--ae-blue) r g b / 0.30);\\n --ae-focus-ring-sm: rgb(from var(--ae-blue) r g b / 0.15);\\n\\n /* Subtle intent tokens - light context */\\n --ae-color-primary-bg-subtle: rgb(from var(--ae-blue) r g b / 0.08);\\n --ae-color-primary-border-subtle: rgb(from var(--ae-blue) r g b / 0.40);\\n --ae-color-primary-text-emphasis: var(--ae-blue-700);\\n\\n --ae-color-success-bg-subtle: rgb(from var(--ae-green) r g b / 0.08);\\n --ae-color-success-border-subtle: rgb(from var(--ae-green) r g b / 0.40);\\n --ae-color-success-text-emphasis: var(--ae-green-700);\\n\\n --ae-color-danger-bg-subtle: rgb(from var(--ae-red) r g b / 0.08);\\n --ae-color-danger-border-subtle: rgb(from var(--ae-red) r g b / 0.40);\\n --ae-color-danger-text-emphasis: var(--ae-red-700);\\n\\n --ae-color-warning-bg-subtle: rgb(from var(--ae-yellow) r g b / 0.08);\\n --ae-color-warning-border-subtle: rgb(from var(--ae-yellow) r g b / 0.40);\\n --ae-color-warning-text-emphasis: var(--ae-yellow-700);\\n\\n --ae-color-info-bg-subtle: rgb(from var(--ae-cyan) r g b / 0.08);\\n --ae-color-info-border-subtle: rgb(from var(--ae-cyan) r g b / 0.40);\\n --ae-color-info-text-emphasis: var(--ae-cyan-700);\\n\\n --ae-color-secondary-bg-subtle: rgb(from var(--ae-slate) r g b / 0.08);\\n --ae-color-secondary-border-subtle: rgb(from var(--ae-slate) r g b / 0.40);\\n --ae-color-secondary-text-emphasis: var(--ae-slate-700);\\n\\n --ae-color-light-bg-subtle: var(--ae-gray-100); /* opaque on white: ~#e2e2e2 */\\n --ae-color-light-border-subtle: var(--ae-gray-200); /* opaque on white: ~#c4c4c4 */\\n\\n --ae-color-dark-bg-subtle: var(--ae-dark-100); /* opaque on white: ~#d6d8d9 */\\n --ae-color-dark-border-subtle: var(--ae-dark-300); /* opaque on white: ~#85898c */\\n\\n /* Component tokens - light defaults */\\n --ae-action-btn-bg: var(--ae-gray-200);\\n --ae-action-btn-bg-hover: var(--ae-color-primary);\\n --ae-action-btn-color: var(--ae-gray-600);\\n --ae-action-btn-color-hover: white;\\n\\n --ae-clear-btn-bg-hover: var(--ae-color-danger);\\n --ae-clear-btn-color-hover: white;\\n\\n --ae-reset-btn-border-radius: var(--ae-radius-xs);\\n --ae-reset-btn-bg: var(--ae-action-btn-bg);\\n --ae-reset-btn-bg-hover: var(--ae-action-btn-bg-hover);\\n --ae-reset-btn-color: var(--ae-action-btn-color);\\n --ae-reset-btn-color-hover: var(--ae-action-btn-color-hover);\\n --ae-reset-btn-transition: all 0.12s;\\n\\n --ae-clear-btn-border-radius: var(--ae-radius-xs);\\n --ae-clear-btn-bg: var(--ae-action-btn-bg);\\n --ae-clear-btn-color: var(--ae-action-btn-color);\\n --ae-clear-btn-transition: all 0.12s;\\n}\\n\\n:root,\\n:host {\\n --ae-size-scale: 1;\\n --ae-size-base: calc(1rem * var(--ae-size-scale)); /* 16px */\\n --ae-size-xl: round(calc(var(--ae-size-l) * 1.125), 1px); /* 23px */\\n --ae-size-l: round(calc(var(--ae-size-m) * 1.125 * 1.125), 1px); /* 20px */\\n --ae-size-m: var(--ae-size-base); /* 16px */\\n --ae-size-s: round(calc(var(--ae-size-m) / 1.125), 1px); /* 14px */\\n --ae-size-xs: round(calc(var(--ae-size-s) / 1.125), 1px); /* 12px */\\n --ae-size-2xs: round(calc(var(--ae-size-xs) / 1.125), 1px); /* 11px */\\n --ae-size-3xs: round(calc(var(--ae-size-2xs) / 1.125), 1px); /* 10px */\\n}\\n\\n/* Border-radius tokens - shared across all components */\\n:root,\\n:host {\\n /**\\n * Unified border-radius hook for all components.\\n *\\n *\\n * Usage:\\n * :root { --ae-border-radius: 0; } // global: all components square\\n * :root { --ae-border-radius: 999px; } // global: all components pill\\n * ae-button { --ae-border-radius: 50%; } // scoped: only buttons circular\\n * .sidebar { --ae-border-radius: 8px; } // scoped: everything inside .sidebar\\n *\\n * To restore a component to its own default:\\n * ae-card { --ae-border-radius: initial; }\\n */\\n\\n --ae-radius-square: 0;\\n --ae-radius-xs: 2px;\\n --ae-radius-sm: 4px;\\n --ae-radius-md: 6px;\\n --ae-radius-lg: 8px;\\n --ae-radius-xl: 12px;\\n --ae-radius-pill: 999px;\\n --ae-radius-circle: 50%;\\n}\\n\\n/* Layout tokens - defined on :root so all light DOM elements can use them */\\n:root,\\n:host {\\n --container-max-width: 1280px;\\n --container-padding-x: 1.5rem;\\n}\\n\\n.theme-dark,\\n:root[theme=\\\"dark\\\"],\\n:host([theme=\\\"dark\\\"]),\\n:host-context([theme=\\\"dark\\\"]) {\\n color-scheme: dark;\\n\\n /* Hover / active - slightly gentler on dark backgrounds */\\n --ae-color-mix-hover: black 8%;\\n --ae-color-mix-active: black 16%;\\n\\n /* Gray UI aliases - darker palette steps for elements on dark background */\\n --ae-color-gray-dark: var(--ae-gray-800);\\n --ae-color-gray: var(--ae-gray-700);\\n --ae-color-gray-light: var(--ae-gray-600);\\n --ae-color-gray-lighter: var(--ae-gray-500);\\n --ae-color-gray-lightest: var(--ae-gray-400);\\n\\n /* Secondary - deeper base on dark background */\\n --ae-color-secondary: var(--ae-slate-700);\\n --ae-color-secondary-text: var(--ae-slate-300);\\n\\n /* Text */\\n --ae-color-text-main: white;\\n --ae-color-text-muted: var(--ae-gray-200);\\n --ae-color-text-disabled: var(--ae-gray-500);\\n --ae-color-text-link: var(--ae-blue-300);\\n --ae-color-text-link-hover: var(--ae-blue-200);\\n\\n /* Surfaces */\\n --ae-surface-sunken: var(--ae-gray-900);\\n --ae-surface-base: color-mix(in srgb, var(--ae-gray) 27%, black);\\n --ae-surface-raised: color-mix(in srgb, var(--ae-gray) 34%, black);\\n --ae-surface-overlay: color-mix(in srgb, var(--ae-gray) 38%, black);\\n --ae-color-overlay: rgba(0, 0, 0, 0.6);\\n\\n /* Borders */\\n --ae-border-subtle: rgba(255, 255, 255, 0.08);\\n --ae-border-default: rgba(255, 255, 255, 0.12);\\n --ae-border-hover: rgba(255, 255, 255, 0.20);\\n --ae-border-focus: var(--ae-color-primary);\\n --ae-border-disabled: rgba(255, 255, 255, 0.06);\\n\\n /* Focus ring */\\n --ae-focus-ring: rgb(from var(--ae-blue) r g b / 0.25);\\n --ae-focus-ring-sm: rgb(from var(--ae-blue) r g b / 0.10);\\n\\n /* Subtle intent tokens - dark context (more alpha, lighter text-emphasis) */\\n --ae-color-primary-bg-subtle: rgb(from var(--ae-blue) r g b / 0.10);\\n --ae-color-primary-border-subtle: rgb(from var(--ae-blue) r g b / 0.30);\\n --ae-color-primary-text-emphasis: var(--ae-blue-300);\\n\\n --ae-color-success-bg-subtle: rgb(from var(--ae-green) r g b / 0.10);\\n --ae-color-success-border-subtle: rgb(from var(--ae-green) r g b / 0.30);\\n --ae-color-success-text-emphasis: var(--ae-green-300);\\n\\n --ae-color-danger-bg-subtle: rgb(from var(--ae-red) r g b / 0.10);\\n --ae-color-danger-border-subtle: rgb(from var(--ae-red) r g b / 0.30);\\n --ae-color-danger-text-emphasis: var(--ae-red-300);\\n\\n --ae-color-warning-bg-subtle: rgb(from var(--ae-yellow) r g b / 0.10);\\n --ae-color-warning-border-subtle: rgb(from var(--ae-yellow) r g b / 0.30);\\n --ae-color-warning-text-emphasis: var(--ae-yellow-300);\\n\\n --ae-color-info-bg-subtle: rgb(from var(--ae-cyan) r g b / 0.10);\\n --ae-color-info-border-subtle: rgb(from var(--ae-cyan) r g b / 0.30);\\n --ae-color-info-text-emphasis: var(--ae-cyan-300);\\n\\n --ae-color-secondary-bg-subtle: rgb(from var(--ae-slate) r g b / 0.10);\\n --ae-color-secondary-border-subtle: rgb(from var(--ae-slate) r g b / 0.30);\\n --ae-color-secondary-text-emphasis: var(--ae-slate-300);\\n\\n --ae-color-light-bg-subtle: rgb(from var(--ae-light) r g b / 0.20);\\n --ae-color-light-border-subtle: rgb(from var(--ae-light) r g b / 0.25);\\n\\n --ae-color-dark-bg-subtle: rgb(from var(--ae-dark) r g b / 0.30);\\n --ae-color-dark-border-subtle: rgb(from var(--ae-dark) r g b / 0.50);\\n\\n /* Component tokens - dark overrides */\\n --ae-action-btn-bg: var(--ae-color-gray);\\n --ae-action-btn-bg-hover: color-mix(in srgb, var(--ae-blue) 25%, var(--ae-gray-800));\\n --ae-action-btn-color: var(--ae-gray-400);\\n --ae-action-btn-color-hover: var(--ae-cyan-300);\\n --ae-clear-btn-bg-hover: color-mix(in srgb, var(--ae-red) 25%, var(--ae-gray-800));\\n --ae-clear-btn-color-hover: var(--ae-red-300);\\n}\\n\"", "export default \":host([size=\\\"xs\\\"]) { font-size: var(--ae-size-xs); }\\n:host([size=\\\"sm\\\"]) { font-size: var(--ae-size-s); }\\n:host([size=\\\"md\\\"]) { font-size: var(--ae-size-m); }\\n:host([size=\\\"lg\\\"]) { font-size: var(--ae-size-l); }\\n:host([size=\\\"xl\\\"]) { font-size: var(--ae-size-xl); }\\n:host([size=\\\"3xs\\\"]) { font-size: var(--ae-size-3xs); }\\n:host([size=\\\"2xs\\\"]) { font-size: var(--ae-size-2xs); }\\n\"", "export default \":host {\\n --ae-color-solid: var(--ae-color-gray);\\n --ae-color-solid-hover: color-mix(in srgb, var(--ae-color-solid), var(--ae-color-mix-hover));\\n --ae-color-solid-active: color-mix(in srgb, var(--ae-color-solid), var(--ae-color-mix-active));\\n --ae-color-on-solid: var(--ae-color-text-main);\\n --ae-color-border: var(--ae-color-gray);\\n --ae-color-border-hover: color-mix(in srgb, var(--ae-color-border), var(--ae-color-mix-hover));\\n --ae-color-accent: var(--ae-color-text-muted);\\n --ae-color-accent-hover: var(--ae-color-text-main);\\n --ae-color-subtle: var(--ae-border-subtle);\\n --ae-color-subtle-hover: var(--ae-border-default);\\n --ae-color-bg-subtle: var(--ae-border-subtle);\\n --ae-color-text-subtle: var(--ae-color-text-muted);\\n --ae-color-border-subtle: var(--ae-border-default);\\n}\\n\\n:host([color=\\\"primary\\\"]) {\\n --ae-color-solid: var(--ae-color-primary);\\n --ae-color-on-solid: white;\\n --ae-color-border: var(--ae-color-primary);\\n --ae-color-accent: var(--ae-color-text-link);\\n --ae-color-accent-hover: var(--ae-color-text-link-hover);\\n --ae-color-subtle: var(--ae-color-primary-bg-subtle);\\n --ae-color-subtle-hover: rgb(from var(--ae-blue) r g b / 0.15);\\n --ae-color-bg-subtle: var(--ae-color-primary-bg-subtle);\\n --ae-color-text-subtle: var(--ae-color-primary-text-emphasis);\\n --ae-color-border-subtle: var(--ae-color-primary-border-subtle);\\n}\\n\\n:host([color=\\\"secondary\\\"]) {\\n --ae-color-solid: var(--ae-color-secondary);\\n --ae-color-on-solid: white;\\n --ae-color-border: var(--ae-color-secondary-hover);\\n --ae-color-accent: var(--ae-color-secondary-text-emphasis);\\n --ae-color-accent-hover: var(--ae-color-text-main);\\n --ae-color-subtle: rgb(from var(--ae-slate) r g b / 0.06);\\n --ae-color-subtle-hover: rgb(from var(--ae-slate) r g b / 0.12);\\n --ae-color-bg-subtle: var(--ae-color-secondary-bg-subtle);\\n --ae-color-text-subtle: var(--ae-color-secondary-text-emphasis);\\n --ae-color-border-subtle: var(--ae-color-secondary-border-subtle);\\n}\\n\\n:host([color=\\\"success\\\"]) {\\n --ae-color-solid: var(--ae-color-success);\\n --ae-color-on-solid: white;\\n --ae-color-border: var(--ae-color-success);\\n --ae-color-accent: var(--ae-color-success-text-emphasis);\\n --ae-color-accent-hover: var(--ae-color-success-hover);\\n --ae-color-subtle: var(--ae-color-success-bg-subtle);\\n --ae-color-subtle-hover: rgb(from var(--ae-green) r g b / 0.15);\\n --ae-color-bg-subtle: var(--ae-color-success-bg-subtle);\\n --ae-color-text-subtle: var(--ae-color-success-text-emphasis);\\n --ae-color-border-subtle: var(--ae-color-success-border-subtle);\\n}\\n\\n:host([color=\\\"danger\\\"]) {\\n --ae-color-solid: var(--ae-color-danger);\\n --ae-color-on-solid: white;\\n --ae-color-border: var(--ae-color-danger);\\n --ae-color-accent: var(--ae-color-danger-text-emphasis);\\n --ae-color-accent-hover: var(--ae-color-danger-hover);\\n --ae-color-subtle: var(--ae-color-danger-bg-subtle);\\n --ae-color-subtle-hover: rgb(from var(--ae-red) r g b / 0.15);\\n --ae-color-bg-subtle: var(--ae-color-danger-bg-subtle);\\n --ae-color-text-subtle: var(--ae-color-danger-text-emphasis);\\n --ae-color-border-subtle: var(--ae-color-danger-border-subtle);\\n}\\n\\n:host([color=\\\"warning\\\"]) {\\n --ae-color-solid: var(--ae-color-warning);\\n --ae-color-on-solid: var(--ae-gray-900);\\n --ae-color-border: var(--ae-color-warning);\\n --ae-color-accent: var(--ae-color-warning-text-emphasis);\\n --ae-color-accent-hover: var(--ae-color-warning-hover);\\n --ae-color-subtle: var(--ae-color-warning-bg-subtle);\\n --ae-color-subtle-hover: rgb(from var(--ae-yellow) r g b / 0.15);\\n --ae-color-bg-subtle: var(--ae-color-warning-bg-subtle);\\n --ae-color-text-subtle: var(--ae-color-warning-text-emphasis);\\n --ae-color-border-subtle: var(--ae-color-warning-border-subtle);\\n}\\n\\n:host([color=\\\"info\\\"]) {\\n --ae-color-solid: var(--ae-color-info);\\n --ae-color-on-solid: white;\\n --ae-color-border: var(--ae-color-info);\\n --ae-color-accent: var(--ae-color-info-text-emphasis);\\n --ae-color-accent-hover: var(--ae-color-info-hover);\\n --ae-color-subtle: var(--ae-color-info-bg-subtle);\\n --ae-color-subtle-hover: rgb(from var(--ae-cyan) r g b / 0.15);\\n --ae-color-bg-subtle: var(--ae-color-info-bg-subtle);\\n --ae-color-text-subtle: var(--ae-color-info-text-emphasis);\\n --ae-color-border-subtle: var(--ae-color-info-border-subtle);\\n}\\n\\n:host([color=\\\"light\\\"]) {\\n --ae-color-solid: var(--ae-light);\\n --ae-color-on-solid: var(--ae-gray-900);\\n --ae-color-border: var(--ae-border-hover);\\n --ae-color-subtle: var(--ae-color-light-bg-subtle);\\n --ae-color-subtle-hover: var(--ae-color-light-border-subtle);\\n --ae-color-bg-subtle: var(--ae-color-light-bg-subtle);\\n --ae-color-text-subtle: var(--ae-color-text-muted);\\n --ae-color-border-subtle: var(--ae-color-light-border-subtle);\\n}\\n\\n:host([color=\\\"dark\\\"]) {\\n --ae-color-solid: var(--ae-dark-500);\\n --ae-color-on-solid: white;\\n --ae-color-border: var(--ae-dark-500);\\n --ae-color-accent: var(--ae-color-text-main);\\n --ae-color-accent-hover: var(--ae-color-text-main);\\n --ae-color-subtle: var(--ae-color-dark-bg-subtle);\\n --ae-color-subtle-hover: var(--ae-color-dark-border-subtle);\\n --ae-color-bg-subtle: var(--ae-color-dark-bg-subtle);\\n --ae-color-text-subtle: var(--ae-color-text-main);\\n --ae-color-border-subtle: var(--ae-color-dark-border-subtle);\\n}\\n\"", "export default \":host {\\n display: inline-block;\\n}\\n\\nbutton {\\n display: inline-flex;\\n align-items: center;\\n justify-content: center;\\n gap: 6px;\\n font-family: inherit;\\n font-weight: 400;\\n text-align: center;\\n white-space: nowrap;\\n vertical-align: middle;\\n user-select: none;\\n cursor: pointer;\\n transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);\\n outline: none;\\n position: relative;\\n padding: 0.429em 0.571em;\\n font-size: 1em;\\n line-height: 1.5;\\n border-radius: var(--ae-border-radius, var(--ae-radius-sm));\\n height: 2.286em;\\n width: 2.286em;\\n min-width: unset;\\n\\n background: var(--ae-color-solid);\\n border: 1px solid var(--ae-color-solid);\\n color: var(--ae-color-on-solid);\\n}\\n\\nbutton:focus { outline: none; }\\nbutton:active { transform: translateY(1px); }\\n\\nbutton:hover:not(:disabled) {\\n background: var(--ae-color-solid-hover);\\n border-color: var(--ae-color-border-hover);\\n color: var(--ae-color-on-solid-hover, var(--ae-color-on-solid));\\n}\\n\\nbutton:active:not(:disabled) { background: var(--ae-color-solid-active); }\\n\\nbutton:disabled {\\n opacity: 0.5;\\n cursor: not-allowed;\\n}\\n\\n/* Hide the fallback-text slot */\\nslot { display: none; }\\n\\n/* Icon visibility */\\n.icon-copy,\\n.icon-check {\\n position: absolute;\\n inset: 0;\\n display: flex;\\n align-items: center;\\n justify-content: center;\\n transition: opacity 0.15s ease, transform 0.15s ease;\\n}\\n\\n.icon-copy { opacity: 1; transform: scale(1); }\\n.icon-check { opacity: 0; transform: scale(0.6); }\\n\\n:host([copied]) .icon-copy { opacity: 0; transform: scale(0.6); }\\n:host([copied]) .icon-check { opacity: 1; transform: scale(1); }\\n\\n/* Variants */\\n:host([variant=\\\"outlined\\\"]) button {\\n background: transparent;\\n border-color: var(--ae-color-border);\\n color: var(--ae-color-accent);\\n}\\n:host([variant=\\\"outlined\\\"]) button:hover:not(:disabled) {\\n background: var(--ae-color-subtle);\\n border-color: var(--ae-color-border-hover);\\n color: var(--ae-color-accent-hover);\\n}\\n\\n:host([variant=\\\"faint\\\"]) button {\\n background: var(--ae-color-subtle);\\n border-color: transparent;\\n color: var(--ae-color-accent);\\n}\\n:host([variant=\\\"faint\\\"]) button:hover:not(:disabled) {\\n background: var(--ae-color-subtle-hover);\\n color: var(--ae-color-accent-hover);\\n}\\n\\n:host([variant=\\\"subtle\\\"]) button {\\n background: transparent;\\n border-color: transparent;\\n color: var(--ae-color-accent);\\n}\\n:host([variant=\\\"subtle\\\"]) button:hover:not(:disabled) {\\n background: var(--ae-color-subtle);\\n color: var(--ae-color-accent-hover);\\n}\\n\\n:host([variant=\\\"text\\\"]) button {\\n background: transparent;\\n border-color: transparent;\\n color: var(--ae-color-accent);\\n}\\n:host([variant=\\\"text\\\"]) button:hover:not(:disabled) {\\n color: var(--ae-color-accent-hover);\\n}\\n\"", "import { AeicoElement } from 'aeico';\n\nconst TAG_NAME_PREFIX = 'ae';\n\n/**\n * AeicoComponent is the base class for all built-in Aeico components.\n */\nclass AeicoComponent extends AeicoElement {\n static define(name: string) {\n const prefix = `${TAG_NAME_PREFIX}-`;\n\n const tagName = name.startsWith(prefix) ? name : `${prefix}${name}`;\n\n super.define(tagName);\n }\n}\n\nexport default AeicoComponent;\n", "import type { InferProps } from 'aeico';\nimport styleVariables from '../styles/variables.css';\nimport sizeCSS from '../styles/size.css';\nimport colorCSS from '../styles/color.css';\nimport copyButtonStyle from '../styles/components/copy-button.css';\nimport AeicoComponent from '../aeico-component';\nimport { html } from 'aeico';\nimport { prop } from 'aeico';\n// Ensure ae-icon and ae-tooltip are registered\nimport '../icon/icon';\nimport '../tooltip/tooltip';\nimport type Tooltip from '../tooltip/tooltip';\nimport type { TooltipPlacement } from '../tooltip/defines';\nimport type { CopyButtonColor, CopyButtonSize, CopyButtonVariant } from './defines';\n\nclass CopyButton extends AeicoComponent {\n protected static styles = [styleVariables, sizeCSS, colorCSS, copyButtonStyle];\n\n @prop({ type: String })\n accessor text: string | undefined;\n\n @prop({ type: String })\n accessor color: CopyButtonColor | undefined;\n\n @prop({ type: String })\n accessor variant: CopyButtonVariant | undefined;\n\n @prop({ type: String })\n accessor size: CopyButtonSize | undefined;\n\n @prop({ type: Boolean })\n accessor disabled: boolean | undefined;\n\n @prop({ type: Number })\n accessor duration: number | undefined;\n\n @prop({ type: String })\n accessor tooltip: string = 'Copy';\n\n @prop({ type: String })\n accessor tooltipCopied: string = 'Copied!';\n\n @prop({ type: String })\n accessor tooltipPlacement: TooltipPlacement = 'top';\n\n private _slotElement: HTMLSlotElement | null = null;\n private _tooltipEl: Tooltip | null = null;\n private _resetTimer: ReturnType<typeof setTimeout> | null = null;\n\n private _getTextToCopy(): string {\n if (this.text != null) return this.text;\n\n const nodes = this._slotElement?.assignedNodes({ flatten: true }) ?? [];\n\n return nodes\n .reduce<string>((text, n) => {\n if (n.nodeType === Node.TEXT_NODE) return text + (n.textContent ?? '');\n\n return text;\n }, '')\n .trim();\n }\n\n private _handleClick = () => {\n if (this.disabled) return;\n\n const textToCopy = this._getTextToCopy();\n\n void navigator.clipboard.writeText(textToCopy).then(() => {\n this.setAttribute('copied', '');\n\n if (this._tooltipEl) {\n this._tooltipEl.content = this.tooltipCopied;\n this._tooltipEl.open = true;\n }\n\n if (this._resetTimer !== null) {\n clearTimeout(this._resetTimer);\n }\n const duration = this.duration ?? 2000;\n this._resetTimer = setTimeout(() => {\n this.removeAttribute('copied');\n if (this._tooltipEl) {\n this._tooltipEl.content = this.tooltip;\n this._tooltipEl.open = false;\n }\n this._resetTimer = null;\n }, duration);\n\n this.dispatchEvent(\n new CustomEvent('copy', {\n bubbles: true,\n composed: true,\n detail: { text: textToCopy },\n }),\n );\n });\n };\n\n protected onUnmounted() {\n if (this._resetTimer !== null) {\n clearTimeout(this._resetTimer);\n this._resetTimer = null;\n }\n }\n\n protected render() {\n return html(({ aeTooltip, button, span, slot, aeIcon }) => {\n this._tooltipEl = aeTooltip(\n {\n content: this.tooltip,\n placement: this.tooltipPlacement,\n disabled: this.disabled,\n },\n () => {\n button(\n {\n type: 'button',\n disabled: this.disabled,\n part: 'button',\n 'aria-label': this.tooltip,\n 'aria-disabled': this.disabled,\n '@click': this._handleClick,\n },\n () => {\n span({ className: 'icon-copy' }, () => {\n aeIcon({ name: 'copy', size: this.size });\n });\n span({ className: 'icon-check' }, () => {\n aeIcon({ name: 'check', size: this.size });\n });\n this._slotElement = slot();\n },\n );\n },\n );\n });\n }\n}\n\nCopyButton.define('copy-button');\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-copy-button': CopyButton;\n }\n}\n\nexport default CopyButton;\nexport type CopyButtonProps = InferProps<typeof CopyButton>;\n", "export const SVG_NS = 'http://www.w3.org/2000/svg';\n\nexport function toKebab(str: string): string {\n const cleaned = str.replace(/^[_\\d]+/, '');\n\n return cleaned.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();\n}\n", "import type { InferProps, Props } from 'aeico';\nimport { SVG_NS } from '../utils';\nimport AeicoComponent from '../aeico-component';\nimport { html } from 'aeico';\nimport styleVariables from '../styles/variables.css';\nimport sizeCSS from '../styles/size.css';\nimport colorCSS from '../styles/color.css';\nimport style from '../styles/components/icon.css';\nimport type { IconSize, IconColor } from './defines';\nimport { defaultViewBox } from './defines';\nimport IconRegistry from './registry';\nimport './built-in-icons';\n\nclass Icon extends AeicoComponent {\n static props: Props = {\n name: { type: String },\n size: { type: String },\n color: { type: String },\n stroke: { type: Boolean },\n strokeWidth: { type: Number },\n };\n\n declare name?: string;\n declare size?: IconSize;\n declare color?: IconColor;\n declare stroke?: boolean;\n declare strokeWidth?: number;\n\n protected static styles = [styleVariables, sizeCSS, colorCSS, style];\n\n protected render() {\n const def = this.name ? IconRegistry.get(this.name) : undefined;\n\n // Numeric size: set font-size directly (string sizes are handled by size.css)\n const numericSize = Number(this.size);\n if (this.size !== undefined && !isNaN(numericSize) && numericSize > 0) {\n this.style.setProperty('font-size', `${numericSize}px`);\n } else {\n this.style.removeProperty('font-size');\n }\n\n if (!def) return;\n\n const { paths } = def;\n const isMultiPath = Array.isArray(paths);\n\n // Stroke CSS variables only apply in single-path mode (component props)\n if (!isMultiPath) {\n const useStroke =\n this.stroke ?? (this.strokeWidth !== undefined ? true : (def.stroke ?? false));\n const useStrokeWidth = this.strokeWidth ?? def.strokeWidth ?? 2;\n\n if (useStroke) {\n this.style.setProperty('--icon-fill', 'none');\n this.style.setProperty('--icon-stroke', 'currentColor');\n this.style.setProperty('--icon-stroke-width', String(useStrokeWidth));\n } else {\n this.style.removeProperty('--icon-fill');\n this.style.removeProperty('--icon-stroke');\n this.style.removeProperty('--icon-stroke-width');\n }\n } else {\n this.style.removeProperty('--icon-fill');\n this.style.removeProperty('--icon-stroke');\n this.style.removeProperty('--icon-stroke-width');\n }\n\n return html(({ svg, path }) => {\n svg(\n {\n className: 'icon-svg',\n viewBox: def.viewBox ?? defaultViewBox,\n 'aria-hidden': 'true',\n xmlns: SVG_NS,\n },\n () => {\n if (typeof paths === 'string') {\n path({ d: paths });\n } else {\n for (const p of paths) {\n const attrs: Record<string, unknown> = { d: p.d };\n if (p.fill) attrs.style = { fill: p.fill };\n path(attrs);\n }\n }\n },\n );\n });\n }\n}\n\nIcon.define('icon');\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-icon': Icon;\n }\n}\n\nexport default Icon;\nexport type IconProps = InferProps<typeof Icon>;\n", "export default \":host {\\n display: inline-flex;\\n align-items: center;\\n justify-content: center;\\n font-size: 20px;\\n width: 1em;\\n height: 1em;\\n color: inherit;\\n flex-shrink: 0;\\n line-height: 0;\\n vertical-align: middle;\\n}\\n\\n:host([color]) {\\n color: var(--ae-color-solid);\\n}\\n\\n.icon-svg {\\n display: block;\\n width: 100%;\\n height: 100%;\\n fill: var(--icon-fill, currentColor);\\n stroke: var(--icon-stroke, none);\\n stroke-width: var(--icon-stroke-width, 2);\\n stroke-linecap: var(--icon-stroke-linecap, round);\\n stroke-linejoin: var(--icon-stroke-linejoin, round);\\n pointer-events: none;\\n overflow: visible;\\n}\\n\"", "export type IconSize = '3xs' | '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | number;\n\nexport type IconColor =\n | 'default'\n | 'primary'\n | 'secondary'\n | 'success'\n | 'danger'\n | 'warning'\n | 'info';\n\nexport interface IconPathDef {\n d: string;\n fill?: string;\n stroke?: boolean;\n strokeWidth?: number;\n}\n\nexport interface IconDefinition {\n paths: string | IconPathDef[];\n viewBox?: string;\n stroke?: boolean;\n strokeWidth?: number;\n}\n\nexport const defaultViewBox = '0 0 24 24';\n\nexport type IconRegistryData = Record<string, string | IconDefinition>;\n", "import { IconDefinition, IconRegistryData, defaultViewBox } from './defines';\n\nclass IconRegistry {\n private static _icons: Map<string, IconDefinition> = new Map();\n /** Names registered via addBuiltIn - can be overridden by user add() calls */\n private static _builtInKeys: Set<string> = new Set();\n\n /** Register user icons. Always takes priority over built-in icons. */\n static add(icons: IconRegistryData) {\n for (const [name, data] of Object.entries(icons)) {\n if (typeof data === 'string') {\n this._icons.set(name, { paths: data, viewBox: defaultViewBox });\n } else {\n this._icons.set(name, data);\n }\n // Mark as user-defined (removes built-in status)\n this._builtInKeys.delete(name);\n }\n }\n\n /**\n * Register built-in icons provided by the library.\n * A built-in icon will NOT overwrite an icon already registered by the user.\n */\n static addBuiltIn(icons: IconRegistryData) {\n for (const [name, data] of Object.entries(icons)) {\n // Skip if the user has already registered this icon\n if (this._icons.has(name) && !this._builtInKeys.has(name)) continue;\n if (typeof data === 'string') {\n this._icons.set(name, { paths: data, viewBox: defaultViewBox });\n } else {\n this._icons.set(name, data);\n }\n this._builtInKeys.add(name);\n }\n }\n\n static get(name: string): IconDefinition | undefined {\n return this._icons.get(name);\n }\n\n static has(name: string): boolean {\n return this._icons.has(name);\n }\n}\n\nexport default IconRegistry;\n", "/**\n * Built-in system icons used internally by aeico components.\n * These are pre-registered so components work out of the box.\n * Users can override any of them by calling IconRegistry.add({ 'name': '...' }).\n *\n * All paths use the Material Design 24\u00D724 viewBox.\n */\nimport IconRegistry from './registry';\n\nIconRegistry.addBuiltIn({\n copy: 'M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z',\n check: 'M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z',\n 'chevron-left': 'M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z',\n 'chevron-right': 'M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z',\n 'chevron-up': 'M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z',\n 'chevron-down': 'M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z',\n 'chevrons-left': 'M18.41 16.59L13.82 12l4.59-4.59L17 6l-6 6 6 6zM6 6h2v12H6z',\n 'chevrons-right': 'M5.59 7.41L10.18 12l-4.59 4.59L7 18l6-6-6-6zM16 6h2v12h-2z',\n close:\n 'M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z',\n});\n", "export default \":host {\\n display: inline-flex;\\n position: relative;\\n vertical-align: middle;\\n\\n --ae-tooltip-z-index: 1000;\\n --ae-tooltip-bg: var(--ae-dark, #343a40);\\n --ae-tooltip-color: #fff;\\n --ae-tooltip-padding: 0.3125rem 0.625rem;\\n --ae-tooltip-font-size: 0.8125rem;\\n --ae-tooltip-arrow-size: 5px;\\n --ae-tooltip-gap: 6px;\\n --ae-tooltip-max-width: 20rem;\\n}\\n\\n:host-context([theme=\\\"dark\\\"]) {\\n --ae-tooltip-bg: var(--ae-light, #f8f9fa);\\n --ae-tooltip-color: var(--ae-dark, #343a40);\\n}\\n\\n.tooltip-panel {\\n display: none;\\n position: fixed;\\n z-index: var(--ae-tooltip-z-index);\\n background: var(--ae-tooltip-bg);\\n color: var(--ae-tooltip-color);\\n padding: var(--ae-tooltip-padding);\\n font-size: var(--ae-tooltip-font-size);\\n font-family: inherit;\\n border-radius: var(--ae-border-radius, var(--ae-radius-sm));\\n line-height: 1.4;\\n white-space: nowrap;\\n max-width: var(--ae-tooltip-max-width);\\n pointer-events: none;\\n box-sizing: border-box;\\n}\\n\\n:host([open]) .tooltip-panel {\\n display: block;\\n}\\n\\n/* Arrow */\\n.tooltip-panel::after {\\n content: '';\\n position: absolute;\\n border: var(--ae-tooltip-arrow-size) solid transparent;\\n pointer-events: none;\\n}\\n\\n.placement-top::after,\\n.placement-top-start::after,\\n.placement-top-end::after {\\n top: 100%;\\n border-top-color: var(--ae-tooltip-bg);\\n}\\n\\n.placement-top::after {\\n left: 50%;\\n transform: translateX(-50%);\\n}\\n\\n.placement-top-start::after {\\n left: calc(var(--ae-tooltip-arrow-size) * 2);\\n}\\n\\n.placement-top-end::after {\\n right: calc(var(--ae-tooltip-arrow-size) * 2);\\n}\\n\\n.placement-bottom::after,\\n.placement-bottom-start::after,\\n.placement-bottom-end::after {\\n bottom: 100%;\\n border-bottom-color: var(--ae-tooltip-bg);\\n}\\n\\n.placement-bottom::after {\\n left: 50%;\\n transform: translateX(-50%);\\n}\\n\\n.placement-bottom-start::after {\\n left: calc(var(--ae-tooltip-arrow-size) * 2);\\n}\\n\\n.placement-bottom-end::after {\\n right: calc(var(--ae-tooltip-arrow-size) * 2);\\n}\\n\\n.placement-left::after {\\n left: 100%;\\n top: 50%;\\n transform: translateY(-50%);\\n border-left-color: var(--ae-tooltip-bg);\\n}\\n\\n.placement-right::after {\\n right: 100%;\\n top: 50%;\\n transform: translateY(-50%);\\n border-right-color: var(--ae-tooltip-bg);\\n}\\n\"", "import type { InferProps } from 'aeico';\nimport styleVariables from '../styles/variables.css';\nimport tooltipStyle from '../styles/components/tooltip.css';\nimport AeicoComponent from '../aeico-component';\nimport { html, prop } from 'aeico';\nimport type { TooltipPlacement, TooltipTrigger } from './defines';\n\n/**\n * Tooltip Component\n *\n * A floating label that appears on hover or focus around its trigger content.\n * Wrap any element in `<ae-tooltip>` and provide content via the `content`\n * attribute (plain text) or the `tooltip` named slot (rich HTML).\n *\n * @example\n * ```html\n * <ae-tooltip content=\"Save file\">\n * <ae-button>Save</ae-button>\n * </ae-tooltip>\n *\n * <ae-tooltip placement=\"bottom-start\">\n * <span slot=\"tooltip\"><strong>Bold</strong> tip</span>\n * <ae-icon-button name=\"info\"></ae-icon-button>\n * </ae-tooltip>\n * ```\n */\nclass Tooltip extends AeicoComponent {\n protected static styles = [styleVariables, tooltipStyle];\n\n @prop({ type: String })\n accessor content: string | undefined;\n\n @prop({ type: String })\n accessor placement: TooltipPlacement = 'top';\n\n @prop({ type: Boolean })\n accessor disabled: boolean = false;\n\n @prop({ type: String })\n accessor trigger: TooltipTrigger = 'hover';\n\n @prop({ type: Boolean })\n accessor open: boolean = false;\n\n private _outsideClickHandler: ((e: MouseEvent) => void) | null = null;\n\n connectedCallback() {\n super.connectedCallback();\n this.listen('mouseenter', this._handleMouseEnter);\n this.listen('mouseleave', this._handleMouseLeave);\n this.listen('focusin', this._handleFocusin);\n this.listen('focusout', this._handleFocusout);\n this.listen('click', this._handleClick);\n\n this._outsideClickHandler = (e: MouseEvent) => {\n if (!this.open) return;\n if (!e.composedPath().includes(this)) this.open = false;\n };\n document.addEventListener('click', this._outsideClickHandler);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n if (this._outsideClickHandler) {\n document.removeEventListener('click', this._outsideClickHandler);\n this._outsideClickHandler = null;\n }\n }\n\n private _handleMouseEnter = () => {\n if (this.trigger !== 'hover') return;\n if (this.disabled) return;\n this.open = true;\n };\n\n private _handleMouseLeave = () => {\n if (this.trigger !== 'hover') return;\n this.open = false;\n };\n\n private _handleFocusin = () => {\n if (this.trigger !== 'hover') return;\n if (this.disabled) return;\n this.open = true;\n };\n\n private _handleFocusout = () => {\n if (this.trigger !== 'hover') return;\n this.open = false;\n };\n\n private _handleClick = () => {\n if (this.trigger !== 'click') return;\n if (this.disabled) return;\n this.open = !this.open;\n };\n\n private _updatePosition() {\n const panel = this.shadowRoot?.querySelector<HTMLElement>('.tooltip-panel');\n if (!panel) return;\n\n const host = this.getBoundingClientRect();\n const panelRect = panel.getBoundingClientRect();\n const gap = 6; // Match --ae-tooltip-gap: 6px\n const pw = panelRect.width;\n const ph = panelRect.height;\n\n let top: number;\n let left: number;\n\n switch (this.placement) {\n case 'top-start':\n top = host.top - ph - gap;\n left = host.left;\n break;\n case 'top-end':\n top = host.top - ph - gap;\n left = host.right - pw;\n break;\n case 'bottom':\n top = host.bottom + gap;\n left = host.left + host.width / 2 - pw / 2;\n break;\n case 'bottom-start':\n top = host.bottom + gap;\n left = host.left;\n break;\n case 'bottom-end':\n top = host.bottom + gap;\n left = host.right - pw;\n break;\n case 'left':\n top = host.top + host.height / 2 - ph / 2;\n left = host.left - pw - gap;\n break;\n case 'right':\n top = host.top + host.height / 2 - ph / 2;\n left = host.right + gap;\n break;\n default: // 'top'\n top = host.top - ph - gap;\n left = host.left + host.width / 2 - pw / 2;\n }\n\n panel.style.top = `${top}px`;\n panel.style.left = `${left}px`;\n }\n\n protected onUpdated(changedProps: Map<string, unknown>) {\n if (changedProps.has('open') && this.open) {\n this._updatePosition();\n }\n }\n\n protected render() {\n return html(({ div, span, slot }) => {\n slot();\n div(\n {\n className: `tooltip-panel placement-${this.placement ?? 'top'}`,\n role: 'tooltip',\n 'aria-hidden': String(!this.open),\n },\n () => {\n slot({ name: 'tooltip' }, () => {\n span({ textContent: this.content ?? '' });\n });\n },\n );\n });\n }\n}\n\nTooltip.define('tooltip');\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-tooltip': Tooltip;\n }\n}\n\nexport type TooltipProps = InferProps<typeof Tooltip>;\nexport default Tooltip;\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAO,oBAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAA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",
|
|
6
6
|
"names": ["html", "prop", "html", "html", "_disabled_dec", "_a", "_init", "_disabled", "prop", "html", "copy_button_default"]
|
|
7
7
|
}
|
package/dist/detail-group.cjs
CHANGED
|
@@ -113,7 +113,7 @@ var require_variables = __commonJS({
|
|
|
113
113
|
--ae-cyan-800: color-mix(in srgb, var(--ae-cyan) 40%, black);
|
|
114
114
|
--ae-cyan-900: color-mix(in srgb, var(--ae-cyan) 20%, black);
|
|
115
115
|
|
|
116
|
-
/* Gray (neutral
|
|
116
|
+
/* Gray (neutral - base #6e6e6e) */
|
|
117
117
|
--ae-gray-100: color-mix(in srgb, var(--ae-gray) 20%, white);
|
|
118
118
|
--ae-gray-200: color-mix(in srgb, var(--ae-gray) 40%, white);
|
|
119
119
|
--ae-gray-300: color-mix(in srgb, var(--ae-gray) 60%, white);
|
|
@@ -124,7 +124,7 @@ var require_variables = __commonJS({
|
|
|
124
124
|
--ae-gray-800: color-mix(in srgb, var(--ae-gray) 40%, black);
|
|
125
125
|
--ae-gray-900: color-mix(in srgb, var(--ae-gray) 20%, black);
|
|
126
126
|
|
|
127
|
-
/* Slate (blue-gray
|
|
127
|
+
/* Slate (blue-gray - base #64748b, used for 'secondary') */
|
|
128
128
|
--ae-slate-100: color-mix(in srgb, var(--ae-slate) 20%, white);
|
|
129
129
|
--ae-slate-200: color-mix(in srgb, var(--ae-slate) 40%, white);
|
|
130
130
|
--ae-slate-300: color-mix(in srgb, var(--ae-slate) 60%, white);
|
|
@@ -160,7 +160,7 @@ var require_variables = __commonJS({
|
|
|
160
160
|
|
|
161
161
|
:root,
|
|
162
162
|
:host {
|
|
163
|
-
/* Hover / active mix (light default
|
|
163
|
+
/* Hover / active mix (light default - overridden in \xA7 6 dark) */
|
|
164
164
|
--ae-color-mix-hover: black 10%;
|
|
165
165
|
--ae-color-mix-active: black 20%;
|
|
166
166
|
|
|
@@ -194,7 +194,7 @@ var require_variables = __commonJS({
|
|
|
194
194
|
--ae-color-info-active: color-mix(in srgb, var(--ae-color-info), var(--ae-color-mix-active));
|
|
195
195
|
--ae-color-info-disabled: color-mix(in srgb, var(--ae-cyan) 50%, var(--ae-gray-500));
|
|
196
196
|
|
|
197
|
-
/* Secondary (Slate)
|
|
197
|
+
/* Secondary (Slate) - base differs per theme, overridden in \xA7 6 dark */
|
|
198
198
|
--ae-color-secondary: var(--ae-slate-500);
|
|
199
199
|
--ae-color-secondary-hover: color-mix(in srgb, var(--ae-color-secondary), var(--ae-color-mix-hover));
|
|
200
200
|
--ae-color-secondary-active: color-mix(in srgb, var(--ae-color-secondary), var(--ae-color-mix-active));
|
|
@@ -210,7 +210,7 @@ var require_variables = __commonJS({
|
|
|
210
210
|
:host {
|
|
211
211
|
color-scheme: light;
|
|
212
212
|
|
|
213
|
-
/* Gray UI aliases
|
|
213
|
+
/* Gray UI aliases - lighter palette steps for elements on white background */
|
|
214
214
|
--ae-color-gray-dark: var(--ae-gray-400);
|
|
215
215
|
--ae-color-gray: var(--ae-gray-300);
|
|
216
216
|
--ae-color-gray-light: var(--ae-gray-200);
|
|
@@ -242,7 +242,7 @@ var require_variables = __commonJS({
|
|
|
242
242
|
--ae-focus-ring: rgb(from var(--ae-blue) r g b / 0.30);
|
|
243
243
|
--ae-focus-ring-sm: rgb(from var(--ae-blue) r g b / 0.15);
|
|
244
244
|
|
|
245
|
-
/* Subtle intent tokens
|
|
245
|
+
/* Subtle intent tokens - light context */
|
|
246
246
|
--ae-color-primary-bg-subtle: rgb(from var(--ae-blue) r g b / 0.08);
|
|
247
247
|
--ae-color-primary-border-subtle: rgb(from var(--ae-blue) r g b / 0.40);
|
|
248
248
|
--ae-color-primary-text-emphasis: var(--ae-blue-700);
|
|
@@ -273,7 +273,7 @@ var require_variables = __commonJS({
|
|
|
273
273
|
--ae-color-dark-bg-subtle: var(--ae-dark-100); /* opaque on white: ~#d6d8d9 */
|
|
274
274
|
--ae-color-dark-border-subtle: var(--ae-dark-300); /* opaque on white: ~#85898c */
|
|
275
275
|
|
|
276
|
-
/* Component tokens
|
|
276
|
+
/* Component tokens - light defaults */
|
|
277
277
|
--ae-action-btn-bg: var(--ae-gray-200);
|
|
278
278
|
--ae-action-btn-bg-hover: var(--ae-color-primary);
|
|
279
279
|
--ae-action-btn-color: var(--ae-gray-600);
|
|
@@ -308,14 +308,12 @@ var require_variables = __commonJS({
|
|
|
308
308
|
--ae-size-3xs: round(calc(var(--ae-size-2xs) / 1.125), 1px); /* 10px */
|
|
309
309
|
}
|
|
310
310
|
|
|
311
|
-
/* Border-radius tokens
|
|
311
|
+
/* Border-radius tokens - shared across all components */
|
|
312
312
|
:root,
|
|
313
313
|
:host {
|
|
314
314
|
/**
|
|
315
315
|
* Unified border-radius hook for all components.
|
|
316
316
|
*
|
|
317
|
-
* Not set by default \u2014 each component falls back to its own --ae-radius-*
|
|
318
|
-
* token (e.g. button \u2192 sm, card \u2192 lg, input \u2192 xs).
|
|
319
317
|
*
|
|
320
318
|
* Usage:
|
|
321
319
|
* :root { --ae-border-radius: 0; } // global: all components square
|
|
@@ -337,7 +335,7 @@ var require_variables = __commonJS({
|
|
|
337
335
|
--ae-radius-circle: 50%;
|
|
338
336
|
}
|
|
339
337
|
|
|
340
|
-
/* Layout tokens
|
|
338
|
+
/* Layout tokens - defined on :root so all light DOM elements can use them */
|
|
341
339
|
:root,
|
|
342
340
|
:host {
|
|
343
341
|
--container-max-width: 1280px;
|
|
@@ -350,18 +348,18 @@ var require_variables = __commonJS({
|
|
|
350
348
|
:host-context([theme="dark"]) {
|
|
351
349
|
color-scheme: dark;
|
|
352
350
|
|
|
353
|
-
/* Hover / active
|
|
351
|
+
/* Hover / active - slightly gentler on dark backgrounds */
|
|
354
352
|
--ae-color-mix-hover: black 8%;
|
|
355
353
|
--ae-color-mix-active: black 16%;
|
|
356
354
|
|
|
357
|
-
/* Gray UI aliases
|
|
355
|
+
/* Gray UI aliases - darker palette steps for elements on dark background */
|
|
358
356
|
--ae-color-gray-dark: var(--ae-gray-800);
|
|
359
357
|
--ae-color-gray: var(--ae-gray-700);
|
|
360
358
|
--ae-color-gray-light: var(--ae-gray-600);
|
|
361
359
|
--ae-color-gray-lighter: var(--ae-gray-500);
|
|
362
360
|
--ae-color-gray-lightest: var(--ae-gray-400);
|
|
363
361
|
|
|
364
|
-
/* Secondary
|
|
362
|
+
/* Secondary - deeper base on dark background */
|
|
365
363
|
--ae-color-secondary: var(--ae-slate-700);
|
|
366
364
|
--ae-color-secondary-text: var(--ae-slate-300);
|
|
367
365
|
|
|
@@ -390,7 +388,7 @@ var require_variables = __commonJS({
|
|
|
390
388
|
--ae-focus-ring: rgb(from var(--ae-blue) r g b / 0.25);
|
|
391
389
|
--ae-focus-ring-sm: rgb(from var(--ae-blue) r g b / 0.10);
|
|
392
390
|
|
|
393
|
-
/* Subtle intent tokens
|
|
391
|
+
/* Subtle intent tokens - dark context (more alpha, lighter text-emphasis) */
|
|
394
392
|
--ae-color-primary-bg-subtle: rgb(from var(--ae-blue) r g b / 0.10);
|
|
395
393
|
--ae-color-primary-border-subtle: rgb(from var(--ae-blue) r g b / 0.30);
|
|
396
394
|
--ae-color-primary-text-emphasis: var(--ae-blue-300);
|
|
@@ -421,7 +419,7 @@ var require_variables = __commonJS({
|
|
|
421
419
|
--ae-color-dark-bg-subtle: rgb(from var(--ae-dark) r g b / 0.30);
|
|
422
420
|
--ae-color-dark-border-subtle: rgb(from var(--ae-dark) r g b / 0.50);
|
|
423
421
|
|
|
424
|
-
/* Component tokens
|
|
422
|
+
/* Component tokens - dark overrides */
|
|
425
423
|
--ae-action-btn-bg: var(--ae-color-gray);
|
|
426
424
|
--ae-action-btn-bg-hover: color-mix(in srgb, var(--ae-blue) 25%, var(--ae-gray-800));
|
|
427
425
|
--ae-action-btn-color: var(--ae-gray-400);
|
|
@@ -454,19 +452,12 @@ var import_detail_group = __toESM(require_detail_group(), 1);
|
|
|
454
452
|
|
|
455
453
|
// src/aeico-component.ts
|
|
456
454
|
var import_aeico = require("aeico");
|
|
457
|
-
|
|
458
|
-
// src/utils.ts
|
|
459
|
-
function toKebab(str) {
|
|
460
|
-
const cleaned = str.replace(/^[_\d]+/, "");
|
|
461
|
-
return cleaned.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
|
|
462
|
-
}
|
|
463
|
-
|
|
464
|
-
// src/aeico-component.ts
|
|
465
455
|
var TAG_NAME_PREFIX = "ae";
|
|
466
456
|
var AeicoComponent = class extends import_aeico.AeicoElement {
|
|
467
|
-
static
|
|
468
|
-
const
|
|
469
|
-
|
|
457
|
+
static define(name) {
|
|
458
|
+
const prefix = `${TAG_NAME_PREFIX}-`;
|
|
459
|
+
const tagName = name.startsWith(prefix) ? name : `${prefix}${name}`;
|
|
460
|
+
super.define(tagName);
|
|
470
461
|
}
|
|
471
462
|
};
|
|
472
463
|
var aeico_component_default = AeicoComponent;
|
|
@@ -474,7 +465,6 @@ var aeico_component_default = AeicoComponent;
|
|
|
474
465
|
// src/detail-group/detail-group.ts
|
|
475
466
|
var import_aeico2 = require("aeico");
|
|
476
467
|
var DetailGroup = class extends aeico_component_default {
|
|
477
|
-
static tagName = "detail-group";
|
|
478
468
|
static props = {
|
|
479
469
|
multiple: { type: Boolean },
|
|
480
470
|
variant: { type: String },
|
|
@@ -524,7 +514,7 @@ var DetailGroup = class extends aeico_component_default {
|
|
|
524
514
|
});
|
|
525
515
|
}
|
|
526
516
|
};
|
|
527
|
-
DetailGroup.
|
|
517
|
+
DetailGroup.define("detail-group");
|
|
528
518
|
var detail_group_default = DetailGroup;
|
|
529
519
|
// Annotate the CommonJS export names for ESM import in node:
|
|
530
520
|
0 && (module.exports = {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["css-inline:/home/runner/work/aeico-components/aeico-components/src/styles/variables.css", "css-inline:/home/runner/work/aeico-components/aeico-components/src/styles/components/detail-group.css", "../src/detail-group/index.ts", "../src/detail-group/detail-group.ts", "../src/aeico-component.ts"
|
|
4
|
-
"sourcesContent": ["module.exports = \":root,\\n:host {\\n --ae-font-sans-serif: system-ui, -apple-system, \\\"Segoe UI\\\", Roboto, \\\"Helvetica Neue\\\",\\n \\\"Noto Sans\\\", \\\"Liberation Sans\\\", Arial, sans-serif,\\n \\\"Apple Color Emoji\\\", \\\"Segoe UI Emoji\\\", \\\"Segoe UI Symbol\\\", \\\"Noto Color Emoji\\\";\\n --ae-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas,\\n \\\"Liberation Mono\\\", \\\"Courier New\\\", monospace;\\n font-family: var(--ae-font-sans-serif);\\n --ae-blue: #0e639c;\\n --ae-green: #28a745;\\n --ae-red: #dc3545;\\n --ae-yellow: #ffc107;\\n --ae-cyan: #17a2b8;\\n --ae-gray: #6e6e6e;\\n --ae-slate: #64748b;\\n --ae-dark: #343a40;\\n --ae-light: #f8f9fa;\\n}\\n\\n:root,\\n:host {\\n /* Blue */\\n --ae-blue-100: color-mix(in srgb, var(--ae-blue) 20%, white);\\n --ae-blue-200: color-mix(in srgb, var(--ae-blue) 40%, white);\\n --ae-blue-300: color-mix(in srgb, var(--ae-blue) 60%, white);\\n --ae-blue-400: color-mix(in srgb, var(--ae-blue) 80%, white);\\n --ae-blue-500: var(--ae-blue);\\n --ae-blue-600: color-mix(in srgb, var(--ae-blue) 80%, black);\\n --ae-blue-700: color-mix(in srgb, var(--ae-blue) 60%, black);\\n --ae-blue-800: color-mix(in srgb, var(--ae-blue) 40%, black);\\n --ae-blue-900: color-mix(in srgb, var(--ae-blue) 20%, black);\\n\\n /* Green */\\n --ae-green-100: color-mix(in srgb, var(--ae-green) 20%, white);\\n --ae-green-200: color-mix(in srgb, var(--ae-green) 40%, white);\\n --ae-green-300: color-mix(in srgb, var(--ae-green) 60%, white);\\n --ae-green-400: color-mix(in srgb, var(--ae-green) 80%, white);\\n --ae-green-500: var(--ae-green);\\n --ae-green-600: color-mix(in srgb, var(--ae-green) 80%, black);\\n --ae-green-700: color-mix(in srgb, var(--ae-green) 60%, black);\\n --ae-green-800: color-mix(in srgb, var(--ae-green) 40%, black);\\n --ae-green-900: color-mix(in srgb, var(--ae-green) 20%, black);\\n\\n /* Red */\\n --ae-red-100: color-mix(in srgb, var(--ae-red) 20%, white);\\n --ae-red-200: color-mix(in srgb, var(--ae-red) 40%, white);\\n --ae-red-300: color-mix(in srgb, var(--ae-red) 60%, white);\\n --ae-red-400: color-mix(in srgb, var(--ae-red) 80%, white);\\n --ae-red-500: var(--ae-red);\\n --ae-red-600: color-mix(in srgb, var(--ae-red) 80%, black);\\n --ae-red-700: color-mix(in srgb, var(--ae-red) 60%, black);\\n --ae-red-800: color-mix(in srgb, var(--ae-red) 40%, black);\\n --ae-red-900: color-mix(in srgb, var(--ae-red) 20%, black);\\n\\n /* Yellow */\\n --ae-yellow-100: color-mix(in srgb, var(--ae-yellow) 20%, white);\\n --ae-yellow-200: color-mix(in srgb, var(--ae-yellow) 40%, white);\\n --ae-yellow-300: color-mix(in srgb, var(--ae-yellow) 60%, white);\\n --ae-yellow-400: color-mix(in srgb, var(--ae-yellow) 80%, white);\\n --ae-yellow-500: var(--ae-yellow);\\n --ae-yellow-600: color-mix(in srgb, var(--ae-yellow) 80%, black);\\n --ae-yellow-700: color-mix(in srgb, var(--ae-yellow) 60%, black);\\n --ae-yellow-800: color-mix(in srgb, var(--ae-yellow) 40%, black);\\n --ae-yellow-900: color-mix(in srgb, var(--ae-yellow) 20%, black);\\n\\n /* Cyan */\\n --ae-cyan-100: color-mix(in srgb, var(--ae-cyan) 20%, white);\\n --ae-cyan-200: color-mix(in srgb, var(--ae-cyan) 40%, white);\\n --ae-cyan-300: color-mix(in srgb, var(--ae-cyan) 60%, white);\\n --ae-cyan-400: color-mix(in srgb, var(--ae-cyan) 80%, white);\\n --ae-cyan-500: var(--ae-cyan);\\n --ae-cyan-600: color-mix(in srgb, var(--ae-cyan) 80%, black);\\n --ae-cyan-700: color-mix(in srgb, var(--ae-cyan) 60%, black);\\n --ae-cyan-800: color-mix(in srgb, var(--ae-cyan) 40%, black);\\n --ae-cyan-900: color-mix(in srgb, var(--ae-cyan) 20%, black);\\n\\n /* Gray (neutral \u2014 base #6e6e6e) */\\n --ae-gray-100: color-mix(in srgb, var(--ae-gray) 20%, white);\\n --ae-gray-200: color-mix(in srgb, var(--ae-gray) 40%, white);\\n --ae-gray-300: color-mix(in srgb, var(--ae-gray) 60%, white);\\n --ae-gray-400: color-mix(in srgb, var(--ae-gray) 80%, white);\\n --ae-gray-500: var(--ae-gray);\\n --ae-gray-600: color-mix(in srgb, var(--ae-gray) 80%, black);\\n --ae-gray-700: color-mix(in srgb, var(--ae-gray) 60%, black);\\n --ae-gray-800: color-mix(in srgb, var(--ae-gray) 40%, black);\\n --ae-gray-900: color-mix(in srgb, var(--ae-gray) 20%, black);\\n\\n /* Slate (blue-gray \u2014 base #64748b, used for 'secondary') */\\n --ae-slate-100: color-mix(in srgb, var(--ae-slate) 20%, white);\\n --ae-slate-200: color-mix(in srgb, var(--ae-slate) 40%, white);\\n --ae-slate-300: color-mix(in srgb, var(--ae-slate) 60%, white);\\n --ae-slate-400: color-mix(in srgb, var(--ae-slate) 80%, white);\\n --ae-slate-500: var(--ae-slate);\\n --ae-slate-600: color-mix(in srgb, var(--ae-slate) 80%, black);\\n --ae-slate-700: color-mix(in srgb, var(--ae-slate) 60%, black);\\n --ae-slate-800: color-mix(in srgb, var(--ae-slate) 40%, black);\\n --ae-slate-900: color-mix(in srgb, var(--ae-slate) 20%, black);\\n\\n /* Dark (base #343a40) */\\n --ae-dark-100: color-mix(in srgb, var(--ae-dark) 20%, white);\\n --ae-dark-200: color-mix(in srgb, var(--ae-dark) 40%, white);\\n --ae-dark-300: color-mix(in srgb, var(--ae-dark) 60%, white);\\n --ae-dark-400: color-mix(in srgb, var(--ae-dark) 80%, white);\\n --ae-dark-500: var(--ae-dark);\\n --ae-dark-600: color-mix(in srgb, var(--ae-dark) 80%, black);\\n --ae-dark-700: color-mix(in srgb, var(--ae-dark) 60%, black);\\n --ae-dark-800: color-mix(in srgb, var(--ae-dark) 40%, black);\\n --ae-dark-900: color-mix(in srgb, var(--ae-dark) 20%, black);\\n\\n /* Light (base #f8f9fa) */\\n --ae-light-100: color-mix(in srgb, var(--ae-light) 20%, white);\\n --ae-light-200: color-mix(in srgb, var(--ae-light) 40%, white);\\n --ae-light-300: color-mix(in srgb, var(--ae-light) 60%, white);\\n --ae-light-400: color-mix(in srgb, var(--ae-light) 80%, white);\\n --ae-light-500: var(--ae-light);\\n --ae-light-600: color-mix(in srgb, var(--ae-light) 80%, black);\\n --ae-light-700: color-mix(in srgb, var(--ae-light) 60%, black);\\n --ae-light-800: color-mix(in srgb, var(--ae-light) 40%, black);\\n --ae-light-900: color-mix(in srgb, var(--ae-light) 20%, black);\\n}\\n\\n:root,\\n:host {\\n /* Hover / active mix (light default \u2014 overridden in \u00A7 6 dark) */\\n --ae-color-mix-hover: black 10%;\\n --ae-color-mix-active: black 20%;\\n\\n /* Primary (Blue) */\\n --ae-color-primary: var(--ae-blue-500);\\n --ae-color-primary-hover: color-mix(in srgb, var(--ae-color-primary), var(--ae-color-mix-hover));\\n --ae-color-primary-active: color-mix(in srgb, var(--ae-color-primary), var(--ae-color-mix-active));\\n --ae-color-primary-disabled: color-mix(in srgb, var(--ae-blue) 50%, var(--ae-gray-500));\\n\\n /* Success (Green) */\\n --ae-color-success: var(--ae-green-500);\\n --ae-color-success-hover: color-mix(in srgb, var(--ae-color-success), var(--ae-color-mix-hover));\\n --ae-color-success-active: color-mix(in srgb, var(--ae-color-success), var(--ae-color-mix-active));\\n --ae-color-success-disabled: color-mix(in srgb, var(--ae-green) 50%, var(--ae-gray-500));\\n\\n /* Danger (Red) */\\n --ae-color-danger: var(--ae-red-500);\\n --ae-color-danger-hover: color-mix(in srgb, var(--ae-color-danger), var(--ae-color-mix-hover));\\n --ae-color-danger-active: color-mix(in srgb, var(--ae-color-danger), var(--ae-color-mix-active));\\n --ae-color-danger-disabled: color-mix(in srgb, var(--ae-red) 50%, var(--ae-gray-500));\\n\\n /* Warning (Yellow) */\\n --ae-color-warning: var(--ae-yellow-500);\\n --ae-color-warning-hover: color-mix(in srgb, var(--ae-color-warning), var(--ae-color-mix-hover));\\n --ae-color-warning-active: color-mix(in srgb, var(--ae-color-warning), var(--ae-color-mix-active));\\n --ae-color-warning-disabled: color-mix(in srgb, var(--ae-yellow) 50%, var(--ae-gray-500));\\n\\n /* Info (Cyan) */\\n --ae-color-info: var(--ae-cyan-500);\\n --ae-color-info-hover: color-mix(in srgb, var(--ae-color-info), var(--ae-color-mix-hover));\\n --ae-color-info-active: color-mix(in srgb, var(--ae-color-info), var(--ae-color-mix-active));\\n --ae-color-info-disabled: color-mix(in srgb, var(--ae-cyan) 50%, var(--ae-gray-500));\\n\\n /* Secondary (Slate) \u2014 base differs per theme, overridden in \u00A7 6 dark */\\n --ae-color-secondary: var(--ae-slate-500);\\n --ae-color-secondary-hover: color-mix(in srgb, var(--ae-color-secondary), var(--ae-color-mix-hover));\\n --ae-color-secondary-active: color-mix(in srgb, var(--ae-color-secondary), var(--ae-color-mix-active));\\n --ae-color-secondary-text: var(--ae-slate-700);\\n}\\n\\n\\n.theme-light,\\n:root[theme=\\\"light\\\"],\\n:host([theme=\\\"light\\\"]),\\n:host-context([theme=\\\"light\\\"]),\\n:where(:root),\\n:host {\\n color-scheme: light;\\n\\n /* Gray UI aliases \u2014 lighter palette steps for elements on white background */\\n --ae-color-gray-dark: var(--ae-gray-400);\\n --ae-color-gray: var(--ae-gray-300);\\n --ae-color-gray-light: var(--ae-gray-200);\\n --ae-color-gray-lighter: var(--ae-gray-100);\\n --ae-color-gray-lightest: color-mix(in srgb, var(--ae-gray) 10%, white);\\n\\n /* Text */\\n --ae-color-text-main: var(--ae-dark-700);\\n --ae-color-text-muted: var(--ae-gray-600);\\n --ae-color-text-disabled: var(--ae-gray-300);\\n --ae-color-text-link: var(--ae-blue-500);\\n --ae-color-text-link-hover: var(--ae-blue-700);\\n\\n /* Surfaces */\\n --ae-surface-sunken: var(--ae-light-500);\\n --ae-surface-base: white;\\n --ae-surface-raised: var(--ae-light-500);\\n --ae-surface-overlay: white;\\n --ae-color-overlay: rgba(0, 0, 0, 0.4);\\n\\n /* Borders */\\n --ae-border-subtle: rgba(0, 0, 0, 0.08);\\n --ae-border-default: rgba(0, 0, 0, 0.15);\\n --ae-border-hover: rgba(0, 0, 0, 0.25);\\n --ae-border-focus: var(--ae-color-primary);\\n --ae-border-disabled: rgba(0, 0, 0, 0.06);\\n\\n /* Focus ring */\\n --ae-focus-ring: rgb(from var(--ae-blue) r g b / 0.30);\\n --ae-focus-ring-sm: rgb(from var(--ae-blue) r g b / 0.15);\\n\\n /* Subtle intent tokens \u2014 light context */\\n --ae-color-primary-bg-subtle: rgb(from var(--ae-blue) r g b / 0.08);\\n --ae-color-primary-border-subtle: rgb(from var(--ae-blue) r g b / 0.40);\\n --ae-color-primary-text-emphasis: var(--ae-blue-700);\\n\\n --ae-color-success-bg-subtle: rgb(from var(--ae-green) r g b / 0.08);\\n --ae-color-success-border-subtle: rgb(from var(--ae-green) r g b / 0.40);\\n --ae-color-success-text-emphasis: var(--ae-green-700);\\n\\n --ae-color-danger-bg-subtle: rgb(from var(--ae-red) r g b / 0.08);\\n --ae-color-danger-border-subtle: rgb(from var(--ae-red) r g b / 0.40);\\n --ae-color-danger-text-emphasis: var(--ae-red-700);\\n\\n --ae-color-warning-bg-subtle: rgb(from var(--ae-yellow) r g b / 0.08);\\n --ae-color-warning-border-subtle: rgb(from var(--ae-yellow) r g b / 0.40);\\n --ae-color-warning-text-emphasis: var(--ae-yellow-700);\\n\\n --ae-color-info-bg-subtle: rgb(from var(--ae-cyan) r g b / 0.08);\\n --ae-color-info-border-subtle: rgb(from var(--ae-cyan) r g b / 0.40);\\n --ae-color-info-text-emphasis: var(--ae-cyan-700);\\n\\n --ae-color-secondary-bg-subtle: rgb(from var(--ae-slate) r g b / 0.08);\\n --ae-color-secondary-border-subtle: rgb(from var(--ae-slate) r g b / 0.40);\\n --ae-color-secondary-text-emphasis: var(--ae-slate-700);\\n\\n --ae-color-light-bg-subtle: var(--ae-gray-100); /* opaque on white: ~#e2e2e2 */\\n --ae-color-light-border-subtle: var(--ae-gray-200); /* opaque on white: ~#c4c4c4 */\\n\\n --ae-color-dark-bg-subtle: var(--ae-dark-100); /* opaque on white: ~#d6d8d9 */\\n --ae-color-dark-border-subtle: var(--ae-dark-300); /* opaque on white: ~#85898c */\\n\\n /* Component tokens \u2014 light defaults */\\n --ae-action-btn-bg: var(--ae-gray-200);\\n --ae-action-btn-bg-hover: var(--ae-color-primary);\\n --ae-action-btn-color: var(--ae-gray-600);\\n --ae-action-btn-color-hover: white;\\n\\n --ae-clear-btn-bg-hover: var(--ae-color-danger);\\n --ae-clear-btn-color-hover: white;\\n\\n --ae-reset-btn-border-radius: var(--ae-radius-xs);\\n --ae-reset-btn-bg: var(--ae-action-btn-bg);\\n --ae-reset-btn-bg-hover: var(--ae-action-btn-bg-hover);\\n --ae-reset-btn-color: var(--ae-action-btn-color);\\n --ae-reset-btn-color-hover: var(--ae-action-btn-color-hover);\\n --ae-reset-btn-transition: all 0.12s;\\n\\n --ae-clear-btn-border-radius: var(--ae-radius-xs);\\n --ae-clear-btn-bg: var(--ae-action-btn-bg);\\n --ae-clear-btn-color: var(--ae-action-btn-color);\\n --ae-clear-btn-transition: all 0.12s;\\n}\\n\\n:root,\\n:host {\\n --ae-size-scale: 1;\\n --ae-size-base: calc(1rem * var(--ae-size-scale)); /* 16px */\\n --ae-size-xl: round(calc(var(--ae-size-l) * 1.125), 1px); /* 23px */\\n --ae-size-l: round(calc(var(--ae-size-m) * 1.125 * 1.125), 1px); /* 20px */\\n --ae-size-m: var(--ae-size-base); /* 16px */\\n --ae-size-s: round(calc(var(--ae-size-m) / 1.125), 1px); /* 14px */\\n --ae-size-xs: round(calc(var(--ae-size-s) / 1.125), 1px); /* 12px */\\n --ae-size-2xs: round(calc(var(--ae-size-xs) / 1.125), 1px); /* 11px */\\n --ae-size-3xs: round(calc(var(--ae-size-2xs) / 1.125), 1px); /* 10px */\\n}\\n\\n/* Border-radius tokens \u2014 shared across all components */\\n:root,\\n:host {\\n /**\\n * Unified border-radius hook for all components.\\n *\\n * Not set by default \u2014 each component falls back to its own --ae-radius-*\\n * token (e.g. button \u2192 sm, card \u2192 lg, input \u2192 xs).\\n *\\n * Usage:\\n * :root { --ae-border-radius: 0; } // global: all components square\\n * :root { --ae-border-radius: 999px; } // global: all components pill\\n * ae-button { --ae-border-radius: 50%; } // scoped: only buttons circular\\n * .sidebar { --ae-border-radius: 8px; } // scoped: everything inside .sidebar\\n *\\n * To restore a component to its own default:\\n * ae-card { --ae-border-radius: initial; }\\n */\\n\\n --ae-radius-square: 0;\\n --ae-radius-xs: 2px;\\n --ae-radius-sm: 4px;\\n --ae-radius-md: 6px;\\n --ae-radius-lg: 8px;\\n --ae-radius-xl: 12px;\\n --ae-radius-pill: 999px;\\n --ae-radius-circle: 50%;\\n}\\n\\n/* Layout tokens \u2014 defined on :root so all light DOM elements can use them */\\n:root,\\n:host {\\n --container-max-width: 1280px;\\n --container-padding-x: 1.5rem;\\n}\\n\\n.theme-dark,\\n:root[theme=\\\"dark\\\"],\\n:host([theme=\\\"dark\\\"]),\\n:host-context([theme=\\\"dark\\\"]) {\\n color-scheme: dark;\\n\\n /* Hover / active \u2014 slightly gentler on dark backgrounds */\\n --ae-color-mix-hover: black 8%;\\n --ae-color-mix-active: black 16%;\\n\\n /* Gray UI aliases \u2014 darker palette steps for elements on dark background */\\n --ae-color-gray-dark: var(--ae-gray-800);\\n --ae-color-gray: var(--ae-gray-700);\\n --ae-color-gray-light: var(--ae-gray-600);\\n --ae-color-gray-lighter: var(--ae-gray-500);\\n --ae-color-gray-lightest: var(--ae-gray-400);\\n\\n /* Secondary \u2014 deeper base on dark background */\\n --ae-color-secondary: var(--ae-slate-700);\\n --ae-color-secondary-text: var(--ae-slate-300);\\n\\n /* Text */\\n --ae-color-text-main: white;\\n --ae-color-text-muted: var(--ae-gray-200);\\n --ae-color-text-disabled: var(--ae-gray-500);\\n --ae-color-text-link: var(--ae-blue-300);\\n --ae-color-text-link-hover: var(--ae-blue-200);\\n\\n /* Surfaces */\\n --ae-surface-sunken: var(--ae-gray-900);\\n --ae-surface-base: color-mix(in srgb, var(--ae-gray) 27%, black);\\n --ae-surface-raised: color-mix(in srgb, var(--ae-gray) 34%, black);\\n --ae-surface-overlay: color-mix(in srgb, var(--ae-gray) 38%, black);\\n --ae-color-overlay: rgba(0, 0, 0, 0.6);\\n\\n /* Borders */\\n --ae-border-subtle: rgba(255, 255, 255, 0.08);\\n --ae-border-default: rgba(255, 255, 255, 0.12);\\n --ae-border-hover: rgba(255, 255, 255, 0.20);\\n --ae-border-focus: var(--ae-color-primary);\\n --ae-border-disabled: rgba(255, 255, 255, 0.06);\\n\\n /* Focus ring */\\n --ae-focus-ring: rgb(from var(--ae-blue) r g b / 0.25);\\n --ae-focus-ring-sm: rgb(from var(--ae-blue) r g b / 0.10);\\n\\n /* Subtle intent tokens \u2014 dark context (more alpha, lighter text-emphasis) */\\n --ae-color-primary-bg-subtle: rgb(from var(--ae-blue) r g b / 0.10);\\n --ae-color-primary-border-subtle: rgb(from var(--ae-blue) r g b / 0.30);\\n --ae-color-primary-text-emphasis: var(--ae-blue-300);\\n\\n --ae-color-success-bg-subtle: rgb(from var(--ae-green) r g b / 0.10);\\n --ae-color-success-border-subtle: rgb(from var(--ae-green) r g b / 0.30);\\n --ae-color-success-text-emphasis: var(--ae-green-300);\\n\\n --ae-color-danger-bg-subtle: rgb(from var(--ae-red) r g b / 0.10);\\n --ae-color-danger-border-subtle: rgb(from var(--ae-red) r g b / 0.30);\\n --ae-color-danger-text-emphasis: var(--ae-red-300);\\n\\n --ae-color-warning-bg-subtle: rgb(from var(--ae-yellow) r g b / 0.10);\\n --ae-color-warning-border-subtle: rgb(from var(--ae-yellow) r g b / 0.30);\\n --ae-color-warning-text-emphasis: var(--ae-yellow-300);\\n\\n --ae-color-info-bg-subtle: rgb(from var(--ae-cyan) r g b / 0.10);\\n --ae-color-info-border-subtle: rgb(from var(--ae-cyan) r g b / 0.30);\\n --ae-color-info-text-emphasis: var(--ae-cyan-300);\\n\\n --ae-color-secondary-bg-subtle: rgb(from var(--ae-slate) r g b / 0.10);\\n --ae-color-secondary-border-subtle: rgb(from var(--ae-slate) r g b / 0.30);\\n --ae-color-secondary-text-emphasis: var(--ae-slate-300);\\n\\n --ae-color-light-bg-subtle: rgb(from var(--ae-light) r g b / 0.20);\\n --ae-color-light-border-subtle: rgb(from var(--ae-light) r g b / 0.25);\\n\\n --ae-color-dark-bg-subtle: rgb(from var(--ae-dark) r g b / 0.30);\\n --ae-color-dark-border-subtle: rgb(from var(--ae-dark) r g b / 0.50);\\n\\n /* Component tokens \u2014 dark overrides */\\n --ae-action-btn-bg: var(--ae-color-gray);\\n --ae-action-btn-bg-hover: color-mix(in srgb, var(--ae-blue) 25%, var(--ae-gray-800));\\n --ae-action-btn-color: var(--ae-gray-400);\\n --ae-action-btn-color-hover: var(--ae-cyan-300);\\n --ae-clear-btn-bg-hover: color-mix(in srgb, var(--ae-red) 25%, var(--ae-gray-800));\\n --ae-clear-btn-color-hover: var(--ae-red-300);\\n}\\n\"", "module.exports = \":host {\\n display: block;\\n}\\n\\n/* Raise hovered/focused item so its border shows above neighbours */\\n::slotted(ae-detail:hover),\\n::slotted(ae-detail:focus-within) {\\n position: relative;\\n z-index: 1;\\n}\\n\"", "export { default, default as DetailGroup } from './detail-group';\nexport type { DetailGroupProps } from './detail-group';\n", "import type { InferProps, Props } from 'aeico';\nimport styleVariables from '../styles/variables.css';\nimport detailGroupStyle from '../styles/components/detail-group.css';\nimport AeicoComponent from '../aeico-component';\nimport { html } from 'aeico';\nimport type Detail from '../detail/detail';\nimport type { DetailColor, DetailVariant } from '../detail/defines';\n\n/**\n * DetailGroup component \u2014 wraps multiple `ae-detail` elements into an\n * accordion-style group. By default only one item can be open at a time;\n * set `multiple` to allow several items open simultaneously.\n *\n * @example\n * ```html\n * <ae-detail-group>\n * <ae-detail summary=\"Section 1\">Content 1</ae-detail>\n * <ae-detail summary=\"Section 2\">Content 2</ae-detail>\n * <ae-detail summary=\"Section 3\">Content 3</ae-detail>\n * </ae-detail-group>\n * ```\n */\nclass DetailGroup extends AeicoComponent {\n static tagName = 'detail-group';\n\n static props: Props = {\n multiple: { type: Boolean },\n variant: { type: String },\n color: { type: String },\n };\n\n protected static styles = [styleVariables, detailGroupStyle];\n\n declare multiple?: boolean;\n declare variant?: DetailVariant;\n declare color?: DetailColor;\n\n private slotEl: HTMLSlotElement | null = null;\n\n private readonly DETAIL_RADIUS = 6;\n\n connectedCallback() {\n super.connectedCallback();\n this.listen('open', this._handleOpen);\n }\n\n private _getDetails(): Detail[] {\n if (!this.slotEl) return [];\n return (this.slotEl.assignedElements({ flatten: true }) as Detail[]).filter(\n (el) => el.tagName.toLowerCase() === 'ae-detail',\n );\n }\n\n private _syncChildren(): void {\n const details = this._getDetails();\n const r = this.DETAIL_RADIUS;\n\n details.forEach((detail, i) => {\n const isFirst = i === 0;\n const isLast = i === details.length - 1;\n\n // Collapse borders between adjacent items\n detail.style.marginTop = isFirst ? '' : '-1px';\n\n // Adjust per-corner radius so only the outer edges of the group keep it\n detail.style.setProperty('--detail-r-tl', isFirst ? `${r}px` : '0');\n detail.style.setProperty('--detail-r-tr', isFirst ? `${r}px` : '0');\n detail.style.setProperty('--detail-r-br', isLast ? `${r}px` : '0');\n detail.style.setProperty('--detail-r-bl', isLast ? `${r}px` : '0');\n\n // Propagate variant / color only when explicitly set on the group\n if (this.variant !== undefined) detail.variant = this.variant;\n if (this.color !== undefined) detail.color = this.color;\n });\n }\n\n private _handleOpen = (event: Event): void => {\n if (this.multiple) return;\n const opened = event.target as Element;\n this._getDetails().forEach((detail) => {\n if (detail !== opened) detail.close();\n });\n };\n\n protected render() {\n return html(({ slot }) => {\n this.slotEl = slot({\n '@slotchange': () => this._syncChildren(),\n });\n this._syncChildren();\n });\n }\n}\n\nDetailGroup.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-detail-group': DetailGroup;\n }\n}\n\nexport default DetailGroup;\nexport type DetailGroupProps = InferProps<typeof DetailGroup>;\n", "\uFEFFimport { AeicoElement } from 'aeico';\nimport { toKebab } from './utils';\n\nconst TAG_NAME_PREFIX = 'ae';\n\n/**\n * AeicoComponent is the base class for all built-in Aeico components.\n */\nclass AeicoComponent extends AeicoElement {\n static register(name?: string) {\n const tagName = name || `${TAG_NAME_PREFIX}-${this.tagName || toKebab(this.name)}`;\n\n super.register(tagName);\n }\n}\n\nexport default AeicoComponent;\n", "export const SVG_NS = 'http://www.w3.org/2000/svg';\n\nexport function toKebab(str: string): string {\n const cleaned = str.replace(/^[_\\d]+/, '');\n\n return cleaned.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA,4FAAAA,UAAAC,SAAA;AAAA,IAAAA,QAAO,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA
|
|
3
|
+
"sources": ["css-inline:/home/runner/work/aeico-components/aeico-components/src/styles/variables.css", "css-inline:/home/runner/work/aeico-components/aeico-components/src/styles/components/detail-group.css", "../src/detail-group/index.ts", "../src/detail-group/detail-group.ts", "../src/aeico-component.ts"],
|
|
4
|
+
"sourcesContent": ["module.exports = \":root,\\n:host {\\n --ae-font-sans-serif: system-ui, -apple-system, \\\"Segoe UI\\\", Roboto, \\\"Helvetica Neue\\\",\\n \\\"Noto Sans\\\", \\\"Liberation Sans\\\", Arial, sans-serif,\\n \\\"Apple Color Emoji\\\", \\\"Segoe UI Emoji\\\", \\\"Segoe UI Symbol\\\", \\\"Noto Color Emoji\\\";\\n --ae-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas,\\n \\\"Liberation Mono\\\", \\\"Courier New\\\", monospace;\\n font-family: var(--ae-font-sans-serif);\\n --ae-blue: #0e639c;\\n --ae-green: #28a745;\\n --ae-red: #dc3545;\\n --ae-yellow: #ffc107;\\n --ae-cyan: #17a2b8;\\n --ae-gray: #6e6e6e;\\n --ae-slate: #64748b;\\n --ae-dark: #343a40;\\n --ae-light: #f8f9fa;\\n}\\n\\n:root,\\n:host {\\n /* Blue */\\n --ae-blue-100: color-mix(in srgb, var(--ae-blue) 20%, white);\\n --ae-blue-200: color-mix(in srgb, var(--ae-blue) 40%, white);\\n --ae-blue-300: color-mix(in srgb, var(--ae-blue) 60%, white);\\n --ae-blue-400: color-mix(in srgb, var(--ae-blue) 80%, white);\\n --ae-blue-500: var(--ae-blue);\\n --ae-blue-600: color-mix(in srgb, var(--ae-blue) 80%, black);\\n --ae-blue-700: color-mix(in srgb, var(--ae-blue) 60%, black);\\n --ae-blue-800: color-mix(in srgb, var(--ae-blue) 40%, black);\\n --ae-blue-900: color-mix(in srgb, var(--ae-blue) 20%, black);\\n\\n /* Green */\\n --ae-green-100: color-mix(in srgb, var(--ae-green) 20%, white);\\n --ae-green-200: color-mix(in srgb, var(--ae-green) 40%, white);\\n --ae-green-300: color-mix(in srgb, var(--ae-green) 60%, white);\\n --ae-green-400: color-mix(in srgb, var(--ae-green) 80%, white);\\n --ae-green-500: var(--ae-green);\\n --ae-green-600: color-mix(in srgb, var(--ae-green) 80%, black);\\n --ae-green-700: color-mix(in srgb, var(--ae-green) 60%, black);\\n --ae-green-800: color-mix(in srgb, var(--ae-green) 40%, black);\\n --ae-green-900: color-mix(in srgb, var(--ae-green) 20%, black);\\n\\n /* Red */\\n --ae-red-100: color-mix(in srgb, var(--ae-red) 20%, white);\\n --ae-red-200: color-mix(in srgb, var(--ae-red) 40%, white);\\n --ae-red-300: color-mix(in srgb, var(--ae-red) 60%, white);\\n --ae-red-400: color-mix(in srgb, var(--ae-red) 80%, white);\\n --ae-red-500: var(--ae-red);\\n --ae-red-600: color-mix(in srgb, var(--ae-red) 80%, black);\\n --ae-red-700: color-mix(in srgb, var(--ae-red) 60%, black);\\n --ae-red-800: color-mix(in srgb, var(--ae-red) 40%, black);\\n --ae-red-900: color-mix(in srgb, var(--ae-red) 20%, black);\\n\\n /* Yellow */\\n --ae-yellow-100: color-mix(in srgb, var(--ae-yellow) 20%, white);\\n --ae-yellow-200: color-mix(in srgb, var(--ae-yellow) 40%, white);\\n --ae-yellow-300: color-mix(in srgb, var(--ae-yellow) 60%, white);\\n --ae-yellow-400: color-mix(in srgb, var(--ae-yellow) 80%, white);\\n --ae-yellow-500: var(--ae-yellow);\\n --ae-yellow-600: color-mix(in srgb, var(--ae-yellow) 80%, black);\\n --ae-yellow-700: color-mix(in srgb, var(--ae-yellow) 60%, black);\\n --ae-yellow-800: color-mix(in srgb, var(--ae-yellow) 40%, black);\\n --ae-yellow-900: color-mix(in srgb, var(--ae-yellow) 20%, black);\\n\\n /* Cyan */\\n --ae-cyan-100: color-mix(in srgb, var(--ae-cyan) 20%, white);\\n --ae-cyan-200: color-mix(in srgb, var(--ae-cyan) 40%, white);\\n --ae-cyan-300: color-mix(in srgb, var(--ae-cyan) 60%, white);\\n --ae-cyan-400: color-mix(in srgb, var(--ae-cyan) 80%, white);\\n --ae-cyan-500: var(--ae-cyan);\\n --ae-cyan-600: color-mix(in srgb, var(--ae-cyan) 80%, black);\\n --ae-cyan-700: color-mix(in srgb, var(--ae-cyan) 60%, black);\\n --ae-cyan-800: color-mix(in srgb, var(--ae-cyan) 40%, black);\\n --ae-cyan-900: color-mix(in srgb, var(--ae-cyan) 20%, black);\\n\\n /* Gray (neutral - base #6e6e6e) */\\n --ae-gray-100: color-mix(in srgb, var(--ae-gray) 20%, white);\\n --ae-gray-200: color-mix(in srgb, var(--ae-gray) 40%, white);\\n --ae-gray-300: color-mix(in srgb, var(--ae-gray) 60%, white);\\n --ae-gray-400: color-mix(in srgb, var(--ae-gray) 80%, white);\\n --ae-gray-500: var(--ae-gray);\\n --ae-gray-600: color-mix(in srgb, var(--ae-gray) 80%, black);\\n --ae-gray-700: color-mix(in srgb, var(--ae-gray) 60%, black);\\n --ae-gray-800: color-mix(in srgb, var(--ae-gray) 40%, black);\\n --ae-gray-900: color-mix(in srgb, var(--ae-gray) 20%, black);\\n\\n /* Slate (blue-gray - base #64748b, used for 'secondary') */\\n --ae-slate-100: color-mix(in srgb, var(--ae-slate) 20%, white);\\n --ae-slate-200: color-mix(in srgb, var(--ae-slate) 40%, white);\\n --ae-slate-300: color-mix(in srgb, var(--ae-slate) 60%, white);\\n --ae-slate-400: color-mix(in srgb, var(--ae-slate) 80%, white);\\n --ae-slate-500: var(--ae-slate);\\n --ae-slate-600: color-mix(in srgb, var(--ae-slate) 80%, black);\\n --ae-slate-700: color-mix(in srgb, var(--ae-slate) 60%, black);\\n --ae-slate-800: color-mix(in srgb, var(--ae-slate) 40%, black);\\n --ae-slate-900: color-mix(in srgb, var(--ae-slate) 20%, black);\\n\\n /* Dark (base #343a40) */\\n --ae-dark-100: color-mix(in srgb, var(--ae-dark) 20%, white);\\n --ae-dark-200: color-mix(in srgb, var(--ae-dark) 40%, white);\\n --ae-dark-300: color-mix(in srgb, var(--ae-dark) 60%, white);\\n --ae-dark-400: color-mix(in srgb, var(--ae-dark) 80%, white);\\n --ae-dark-500: var(--ae-dark);\\n --ae-dark-600: color-mix(in srgb, var(--ae-dark) 80%, black);\\n --ae-dark-700: color-mix(in srgb, var(--ae-dark) 60%, black);\\n --ae-dark-800: color-mix(in srgb, var(--ae-dark) 40%, black);\\n --ae-dark-900: color-mix(in srgb, var(--ae-dark) 20%, black);\\n\\n /* Light (base #f8f9fa) */\\n --ae-light-100: color-mix(in srgb, var(--ae-light) 20%, white);\\n --ae-light-200: color-mix(in srgb, var(--ae-light) 40%, white);\\n --ae-light-300: color-mix(in srgb, var(--ae-light) 60%, white);\\n --ae-light-400: color-mix(in srgb, var(--ae-light) 80%, white);\\n --ae-light-500: var(--ae-light);\\n --ae-light-600: color-mix(in srgb, var(--ae-light) 80%, black);\\n --ae-light-700: color-mix(in srgb, var(--ae-light) 60%, black);\\n --ae-light-800: color-mix(in srgb, var(--ae-light) 40%, black);\\n --ae-light-900: color-mix(in srgb, var(--ae-light) 20%, black);\\n}\\n\\n:root,\\n:host {\\n /* Hover / active mix (light default - overridden in \u00A7 6 dark) */\\n --ae-color-mix-hover: black 10%;\\n --ae-color-mix-active: black 20%;\\n\\n /* Primary (Blue) */\\n --ae-color-primary: var(--ae-blue-500);\\n --ae-color-primary-hover: color-mix(in srgb, var(--ae-color-primary), var(--ae-color-mix-hover));\\n --ae-color-primary-active: color-mix(in srgb, var(--ae-color-primary), var(--ae-color-mix-active));\\n --ae-color-primary-disabled: color-mix(in srgb, var(--ae-blue) 50%, var(--ae-gray-500));\\n\\n /* Success (Green) */\\n --ae-color-success: var(--ae-green-500);\\n --ae-color-success-hover: color-mix(in srgb, var(--ae-color-success), var(--ae-color-mix-hover));\\n --ae-color-success-active: color-mix(in srgb, var(--ae-color-success), var(--ae-color-mix-active));\\n --ae-color-success-disabled: color-mix(in srgb, var(--ae-green) 50%, var(--ae-gray-500));\\n\\n /* Danger (Red) */\\n --ae-color-danger: var(--ae-red-500);\\n --ae-color-danger-hover: color-mix(in srgb, var(--ae-color-danger), var(--ae-color-mix-hover));\\n --ae-color-danger-active: color-mix(in srgb, var(--ae-color-danger), var(--ae-color-mix-active));\\n --ae-color-danger-disabled: color-mix(in srgb, var(--ae-red) 50%, var(--ae-gray-500));\\n\\n /* Warning (Yellow) */\\n --ae-color-warning: var(--ae-yellow-500);\\n --ae-color-warning-hover: color-mix(in srgb, var(--ae-color-warning), var(--ae-color-mix-hover));\\n --ae-color-warning-active: color-mix(in srgb, var(--ae-color-warning), var(--ae-color-mix-active));\\n --ae-color-warning-disabled: color-mix(in srgb, var(--ae-yellow) 50%, var(--ae-gray-500));\\n\\n /* Info (Cyan) */\\n --ae-color-info: var(--ae-cyan-500);\\n --ae-color-info-hover: color-mix(in srgb, var(--ae-color-info), var(--ae-color-mix-hover));\\n --ae-color-info-active: color-mix(in srgb, var(--ae-color-info), var(--ae-color-mix-active));\\n --ae-color-info-disabled: color-mix(in srgb, var(--ae-cyan) 50%, var(--ae-gray-500));\\n\\n /* Secondary (Slate) - base differs per theme, overridden in \u00A7 6 dark */\\n --ae-color-secondary: var(--ae-slate-500);\\n --ae-color-secondary-hover: color-mix(in srgb, var(--ae-color-secondary), var(--ae-color-mix-hover));\\n --ae-color-secondary-active: color-mix(in srgb, var(--ae-color-secondary), var(--ae-color-mix-active));\\n --ae-color-secondary-text: var(--ae-slate-700);\\n}\\n\\n\\n.theme-light,\\n:root[theme=\\\"light\\\"],\\n:host([theme=\\\"light\\\"]),\\n:host-context([theme=\\\"light\\\"]),\\n:where(:root),\\n:host {\\n color-scheme: light;\\n\\n /* Gray UI aliases - lighter palette steps for elements on white background */\\n --ae-color-gray-dark: var(--ae-gray-400);\\n --ae-color-gray: var(--ae-gray-300);\\n --ae-color-gray-light: var(--ae-gray-200);\\n --ae-color-gray-lighter: var(--ae-gray-100);\\n --ae-color-gray-lightest: color-mix(in srgb, var(--ae-gray) 10%, white);\\n\\n /* Text */\\n --ae-color-text-main: var(--ae-dark-700);\\n --ae-color-text-muted: var(--ae-gray-600);\\n --ae-color-text-disabled: var(--ae-gray-300);\\n --ae-color-text-link: var(--ae-blue-500);\\n --ae-color-text-link-hover: var(--ae-blue-700);\\n\\n /* Surfaces */\\n --ae-surface-sunken: var(--ae-light-500);\\n --ae-surface-base: white;\\n --ae-surface-raised: var(--ae-light-500);\\n --ae-surface-overlay: white;\\n --ae-color-overlay: rgba(0, 0, 0, 0.4);\\n\\n /* Borders */\\n --ae-border-subtle: rgba(0, 0, 0, 0.08);\\n --ae-border-default: rgba(0, 0, 0, 0.15);\\n --ae-border-hover: rgba(0, 0, 0, 0.25);\\n --ae-border-focus: var(--ae-color-primary);\\n --ae-border-disabled: rgba(0, 0, 0, 0.06);\\n\\n /* Focus ring */\\n --ae-focus-ring: rgb(from var(--ae-blue) r g b / 0.30);\\n --ae-focus-ring-sm: rgb(from var(--ae-blue) r g b / 0.15);\\n\\n /* Subtle intent tokens - light context */\\n --ae-color-primary-bg-subtle: rgb(from var(--ae-blue) r g b / 0.08);\\n --ae-color-primary-border-subtle: rgb(from var(--ae-blue) r g b / 0.40);\\n --ae-color-primary-text-emphasis: var(--ae-blue-700);\\n\\n --ae-color-success-bg-subtle: rgb(from var(--ae-green) r g b / 0.08);\\n --ae-color-success-border-subtle: rgb(from var(--ae-green) r g b / 0.40);\\n --ae-color-success-text-emphasis: var(--ae-green-700);\\n\\n --ae-color-danger-bg-subtle: rgb(from var(--ae-red) r g b / 0.08);\\n --ae-color-danger-border-subtle: rgb(from var(--ae-red) r g b / 0.40);\\n --ae-color-danger-text-emphasis: var(--ae-red-700);\\n\\n --ae-color-warning-bg-subtle: rgb(from var(--ae-yellow) r g b / 0.08);\\n --ae-color-warning-border-subtle: rgb(from var(--ae-yellow) r g b / 0.40);\\n --ae-color-warning-text-emphasis: var(--ae-yellow-700);\\n\\n --ae-color-info-bg-subtle: rgb(from var(--ae-cyan) r g b / 0.08);\\n --ae-color-info-border-subtle: rgb(from var(--ae-cyan) r g b / 0.40);\\n --ae-color-info-text-emphasis: var(--ae-cyan-700);\\n\\n --ae-color-secondary-bg-subtle: rgb(from var(--ae-slate) r g b / 0.08);\\n --ae-color-secondary-border-subtle: rgb(from var(--ae-slate) r g b / 0.40);\\n --ae-color-secondary-text-emphasis: var(--ae-slate-700);\\n\\n --ae-color-light-bg-subtle: var(--ae-gray-100); /* opaque on white: ~#e2e2e2 */\\n --ae-color-light-border-subtle: var(--ae-gray-200); /* opaque on white: ~#c4c4c4 */\\n\\n --ae-color-dark-bg-subtle: var(--ae-dark-100); /* opaque on white: ~#d6d8d9 */\\n --ae-color-dark-border-subtle: var(--ae-dark-300); /* opaque on white: ~#85898c */\\n\\n /* Component tokens - light defaults */\\n --ae-action-btn-bg: var(--ae-gray-200);\\n --ae-action-btn-bg-hover: var(--ae-color-primary);\\n --ae-action-btn-color: var(--ae-gray-600);\\n --ae-action-btn-color-hover: white;\\n\\n --ae-clear-btn-bg-hover: var(--ae-color-danger);\\n --ae-clear-btn-color-hover: white;\\n\\n --ae-reset-btn-border-radius: var(--ae-radius-xs);\\n --ae-reset-btn-bg: var(--ae-action-btn-bg);\\n --ae-reset-btn-bg-hover: var(--ae-action-btn-bg-hover);\\n --ae-reset-btn-color: var(--ae-action-btn-color);\\n --ae-reset-btn-color-hover: var(--ae-action-btn-color-hover);\\n --ae-reset-btn-transition: all 0.12s;\\n\\n --ae-clear-btn-border-radius: var(--ae-radius-xs);\\n --ae-clear-btn-bg: var(--ae-action-btn-bg);\\n --ae-clear-btn-color: var(--ae-action-btn-color);\\n --ae-clear-btn-transition: all 0.12s;\\n}\\n\\n:root,\\n:host {\\n --ae-size-scale: 1;\\n --ae-size-base: calc(1rem * var(--ae-size-scale)); /* 16px */\\n --ae-size-xl: round(calc(var(--ae-size-l) * 1.125), 1px); /* 23px */\\n --ae-size-l: round(calc(var(--ae-size-m) * 1.125 * 1.125), 1px); /* 20px */\\n --ae-size-m: var(--ae-size-base); /* 16px */\\n --ae-size-s: round(calc(var(--ae-size-m) / 1.125), 1px); /* 14px */\\n --ae-size-xs: round(calc(var(--ae-size-s) / 1.125), 1px); /* 12px */\\n --ae-size-2xs: round(calc(var(--ae-size-xs) / 1.125), 1px); /* 11px */\\n --ae-size-3xs: round(calc(var(--ae-size-2xs) / 1.125), 1px); /* 10px */\\n}\\n\\n/* Border-radius tokens - shared across all components */\\n:root,\\n:host {\\n /**\\n * Unified border-radius hook for all components.\\n *\\n *\\n * Usage:\\n * :root { --ae-border-radius: 0; } // global: all components square\\n * :root { --ae-border-radius: 999px; } // global: all components pill\\n * ae-button { --ae-border-radius: 50%; } // scoped: only buttons circular\\n * .sidebar { --ae-border-radius: 8px; } // scoped: everything inside .sidebar\\n *\\n * To restore a component to its own default:\\n * ae-card { --ae-border-radius: initial; }\\n */\\n\\n --ae-radius-square: 0;\\n --ae-radius-xs: 2px;\\n --ae-radius-sm: 4px;\\n --ae-radius-md: 6px;\\n --ae-radius-lg: 8px;\\n --ae-radius-xl: 12px;\\n --ae-radius-pill: 999px;\\n --ae-radius-circle: 50%;\\n}\\n\\n/* Layout tokens - defined on :root so all light DOM elements can use them */\\n:root,\\n:host {\\n --container-max-width: 1280px;\\n --container-padding-x: 1.5rem;\\n}\\n\\n.theme-dark,\\n:root[theme=\\\"dark\\\"],\\n:host([theme=\\\"dark\\\"]),\\n:host-context([theme=\\\"dark\\\"]) {\\n color-scheme: dark;\\n\\n /* Hover / active - slightly gentler on dark backgrounds */\\n --ae-color-mix-hover: black 8%;\\n --ae-color-mix-active: black 16%;\\n\\n /* Gray UI aliases - darker palette steps for elements on dark background */\\n --ae-color-gray-dark: var(--ae-gray-800);\\n --ae-color-gray: var(--ae-gray-700);\\n --ae-color-gray-light: var(--ae-gray-600);\\n --ae-color-gray-lighter: var(--ae-gray-500);\\n --ae-color-gray-lightest: var(--ae-gray-400);\\n\\n /* Secondary - deeper base on dark background */\\n --ae-color-secondary: var(--ae-slate-700);\\n --ae-color-secondary-text: var(--ae-slate-300);\\n\\n /* Text */\\n --ae-color-text-main: white;\\n --ae-color-text-muted: var(--ae-gray-200);\\n --ae-color-text-disabled: var(--ae-gray-500);\\n --ae-color-text-link: var(--ae-blue-300);\\n --ae-color-text-link-hover: var(--ae-blue-200);\\n\\n /* Surfaces */\\n --ae-surface-sunken: var(--ae-gray-900);\\n --ae-surface-base: color-mix(in srgb, var(--ae-gray) 27%, black);\\n --ae-surface-raised: color-mix(in srgb, var(--ae-gray) 34%, black);\\n --ae-surface-overlay: color-mix(in srgb, var(--ae-gray) 38%, black);\\n --ae-color-overlay: rgba(0, 0, 0, 0.6);\\n\\n /* Borders */\\n --ae-border-subtle: rgba(255, 255, 255, 0.08);\\n --ae-border-default: rgba(255, 255, 255, 0.12);\\n --ae-border-hover: rgba(255, 255, 255, 0.20);\\n --ae-border-focus: var(--ae-color-primary);\\n --ae-border-disabled: rgba(255, 255, 255, 0.06);\\n\\n /* Focus ring */\\n --ae-focus-ring: rgb(from var(--ae-blue) r g b / 0.25);\\n --ae-focus-ring-sm: rgb(from var(--ae-blue) r g b / 0.10);\\n\\n /* Subtle intent tokens - dark context (more alpha, lighter text-emphasis) */\\n --ae-color-primary-bg-subtle: rgb(from var(--ae-blue) r g b / 0.10);\\n --ae-color-primary-border-subtle: rgb(from var(--ae-blue) r g b / 0.30);\\n --ae-color-primary-text-emphasis: var(--ae-blue-300);\\n\\n --ae-color-success-bg-subtle: rgb(from var(--ae-green) r g b / 0.10);\\n --ae-color-success-border-subtle: rgb(from var(--ae-green) r g b / 0.30);\\n --ae-color-success-text-emphasis: var(--ae-green-300);\\n\\n --ae-color-danger-bg-subtle: rgb(from var(--ae-red) r g b / 0.10);\\n --ae-color-danger-border-subtle: rgb(from var(--ae-red) r g b / 0.30);\\n --ae-color-danger-text-emphasis: var(--ae-red-300);\\n\\n --ae-color-warning-bg-subtle: rgb(from var(--ae-yellow) r g b / 0.10);\\n --ae-color-warning-border-subtle: rgb(from var(--ae-yellow) r g b / 0.30);\\n --ae-color-warning-text-emphasis: var(--ae-yellow-300);\\n\\n --ae-color-info-bg-subtle: rgb(from var(--ae-cyan) r g b / 0.10);\\n --ae-color-info-border-subtle: rgb(from var(--ae-cyan) r g b / 0.30);\\n --ae-color-info-text-emphasis: var(--ae-cyan-300);\\n\\n --ae-color-secondary-bg-subtle: rgb(from var(--ae-slate) r g b / 0.10);\\n --ae-color-secondary-border-subtle: rgb(from var(--ae-slate) r g b / 0.30);\\n --ae-color-secondary-text-emphasis: var(--ae-slate-300);\\n\\n --ae-color-light-bg-subtle: rgb(from var(--ae-light) r g b / 0.20);\\n --ae-color-light-border-subtle: rgb(from var(--ae-light) r g b / 0.25);\\n\\n --ae-color-dark-bg-subtle: rgb(from var(--ae-dark) r g b / 0.30);\\n --ae-color-dark-border-subtle: rgb(from var(--ae-dark) r g b / 0.50);\\n\\n /* Component tokens - dark overrides */\\n --ae-action-btn-bg: var(--ae-color-gray);\\n --ae-action-btn-bg-hover: color-mix(in srgb, var(--ae-blue) 25%, var(--ae-gray-800));\\n --ae-action-btn-color: var(--ae-gray-400);\\n --ae-action-btn-color-hover: var(--ae-cyan-300);\\n --ae-clear-btn-bg-hover: color-mix(in srgb, var(--ae-red) 25%, var(--ae-gray-800));\\n --ae-clear-btn-color-hover: var(--ae-red-300);\\n}\\n\"", "module.exports = \":host {\\n display: block;\\n}\\n\\n/* Raise hovered/focused item so its border shows above neighbours */\\n::slotted(ae-detail:hover),\\n::slotted(ae-detail:focus-within) {\\n position: relative;\\n z-index: 1;\\n}\\n\"", "export { default, default as DetailGroup } from './detail-group';\nexport type { DetailGroupProps } from './detail-group';\n", "import type { InferProps, Props } from 'aeico';\nimport styleVariables from '../styles/variables.css';\nimport detailGroupStyle from '../styles/components/detail-group.css';\nimport AeicoComponent from '../aeico-component';\nimport { html } from 'aeico';\nimport type Detail from '../detail/detail';\nimport type { DetailColor, DetailVariant } from '../detail/defines';\n\n/**\n * DetailGroup component - wraps multiple `ae-detail` elements into an\n * accordion-style group. By default only one item can be open at a time;\n * set `multiple` to allow several items open simultaneously.\n *\n * @example\n * ```html\n * <ae-detail-group>\n * <ae-detail summary=\"Section 1\">Content 1</ae-detail>\n * <ae-detail summary=\"Section 2\">Content 2</ae-detail>\n * <ae-detail summary=\"Section 3\">Content 3</ae-detail>\n * </ae-detail-group>\n * ```\n */\nclass DetailGroup extends AeicoComponent {\n static props: Props = {\n multiple: { type: Boolean },\n variant: { type: String },\n color: { type: String },\n };\n\n protected static styles = [styleVariables, detailGroupStyle];\n\n declare multiple?: boolean;\n declare variant?: DetailVariant;\n declare color?: DetailColor;\n\n private slotEl: HTMLSlotElement | null = null;\n\n private readonly DETAIL_RADIUS = 6;\n\n connectedCallback() {\n super.connectedCallback();\n this.listen('open', this._handleOpen);\n }\n\n private _getDetails(): Detail[] {\n if (!this.slotEl) return [];\n return (this.slotEl.assignedElements({ flatten: true }) as Detail[]).filter(\n (el) => el.tagName.toLowerCase() === 'ae-detail',\n );\n }\n\n private _syncChildren(): void {\n const details = this._getDetails();\n const r = this.DETAIL_RADIUS;\n\n details.forEach((detail, i) => {\n const isFirst = i === 0;\n const isLast = i === details.length - 1;\n\n // Collapse borders between adjacent items\n detail.style.marginTop = isFirst ? '' : '-1px';\n\n // Adjust per-corner radius so only the outer edges of the group keep it\n detail.style.setProperty('--detail-r-tl', isFirst ? `${r}px` : '0');\n detail.style.setProperty('--detail-r-tr', isFirst ? `${r}px` : '0');\n detail.style.setProperty('--detail-r-br', isLast ? `${r}px` : '0');\n detail.style.setProperty('--detail-r-bl', isLast ? `${r}px` : '0');\n\n // Propagate variant / color only when explicitly set on the group\n if (this.variant !== undefined) detail.variant = this.variant;\n if (this.color !== undefined) detail.color = this.color;\n });\n }\n\n private _handleOpen = (event: Event): void => {\n if (this.multiple) return;\n const opened = event.target as Element;\n this._getDetails().forEach((detail) => {\n if (detail !== opened) detail.close();\n });\n };\n\n protected render() {\n return html(({ slot }) => {\n this.slotEl = slot({\n '@slotchange': () => this._syncChildren(),\n });\n this._syncChildren();\n });\n }\n}\n\nDetailGroup.define('detail-group');\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-detail-group': DetailGroup;\n }\n}\n\nexport default DetailGroup;\nexport type DetailGroupProps = InferProps<typeof DetailGroup>;\n", "import { AeicoElement } from 'aeico';\n\nconst TAG_NAME_PREFIX = 'ae';\n\n/**\n * AeicoComponent is the base class for all built-in Aeico components.\n */\nclass AeicoComponent extends AeicoElement {\n static define(name: string) {\n const prefix = `${TAG_NAME_PREFIX}-`;\n\n const tagName = name.startsWith(prefix) ? name : `${prefix}${name}`;\n\n super.define(tagName);\n }\n}\n\nexport default AeicoComponent;\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA,4FAAAA,UAAAC,SAAA;AAAA,IAAAA,QAAO,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA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",
|
|
6
6
|
"names": ["exports", "module", "exports", "module", "import_aeico", "styleVariables", "detailGroupStyle"]
|
|
7
7
|
}
|