aeico-components 0.1.8 → 0.1.10

package/dist/icon-button.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../src/aeico-component.ts", "../src/utils.ts", "../src/icon-button/icon-button.ts", "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/button.css", "../src/button/button.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"],
-  "sourcesContent": ["\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", "\uFEFFimport type { InferProps, Props } from 'aeico';\nimport AeicoComponent from '../aeico-component';\nimport { html } from 'aeico';\nimport type { IconColor } from '../icon/defines';\n// Ensure ae-button and ae-icon are registered\nimport '../button/button';\nimport '../icon/icon';\n\nexport type IconButtonVariant = 'filled' | 'outlined' | 'subtle' | 'text';\nexport type IconButtonSize = 'xs' | 'sm' | 'md' | 'lg';\n\n/**\n * @deprecated Use `<ae-button>` with an `<ae-icon>` slot instead.\n *\n * ```html\n * <ae-button color=\"primary\"><ae-icon name=\"star\"></ae-icon></ae-button>\n * ```\n */\nclass IconButton extends AeicoComponent {\n  static tagName = 'icon-button';\n\n  static props: Props = {\n    icon: { type: String },\n    size: { type: String },\n    color: { type: String },\n    variant: { type: String },\n    disabled: { type: Boolean },\n  };\n\n  declare icon?: string;\n  declare size?: IconButtonSize;\n  declare color?: IconColor;\n  declare variant?: IconButtonVariant;\n  declare disabled?: boolean;\n\n  protected static styles = [':host { display: contents; }'];\n\n  protected render() {\n    return html(({ aeButton, aeIcon }) => {\n      aeButton(\n        {\n          color: this.color,\n          variant: this.variant,\n          size: this.size,\n          disabled: this.disabled,\n        },\n        () => {\n          aeIcon({ name: this.icon });\n        },\n      );\n    });\n  }\n}\n\nIconButton.register();\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ae-icon-button': IconButton;\n  }\n}\n\nexport default IconButton;\nexport type IconButtonProps = InferProps<typeof IconButton>;\n", "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 1.071em;\\n  font-size: 1em;\\n  line-height: 1.5;\\n  border-radius: var(--ae-border-radius, var(--_btn-r-tl, var(--ae-radius-sm)) var(--_btn-r-tr, var(--ae-radius-sm)) var(--_btn-r-br, var(--ae-radius-sm)) var(--_btn-r-bl, var(--ae-radius-sm)));\\n  min-width: 4.571em;\\n  height: 2.286em;\\n  width: 100%;\\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:host([size=\\\"xs\\\"]) button { border-radius: var(--ae-border-radius, var(--_btn-r-tl, var(--ae-radius-xs)) var(--_btn-r-tr, var(--ae-radius-xs)) var(--_btn-r-br, var(--ae-radius-xs)) var(--_btn-r-bl, var(--ae-radius-xs))); }\\n:host([size=\\\"sm\\\"]) button { border-radius: var(--ae-border-radius, var(--_btn-r-tl, var(--ae-radius-xs)) var(--_btn-r-tr, var(--ae-radius-xs)) var(--_btn-r-br, var(--ae-radius-xs)) var(--_btn-r-bl, var(--ae-radius-xs))); }\\n\\n/* --- Variants --- */\\n\\n:host([variant=\\\"outlined\\\"]) button {\\n  background:   transparent;\\n  border-color: var(--ae-color-border);\\n  color:        var(--ae-color-accent);\\n}\\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=\\\"outlined\\\"]) button:active:not(:disabled) {\\n  background: var(--ae-color-subtle-hover);\\n}\\n\\n:host([variant=\\\"subtle\\\"]) button {\\n  background:   var(--ae-color-subtle);\\n  border-color: transparent;\\n  color:        var(--ae-color-accent);\\n}\\n\\n:host([variant=\\\"subtle\\\"]) 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:active:not(:disabled) {\\n  background: var(--ae-color-subtle-hover);\\n}\\n\\n:host([variant=\\\"faint\\\"]) button {\\n  background:   var(--ae-color-subtle);\\n  border-color: var(--ae-color-border);\\n  color:        var(--ae-color-accent);\\n}\\n\\n:host([variant=\\\"faint\\\"]) button:hover:not(:disabled) {\\n  background:   var(--ae-color-subtle-hover);\\n  border-color: var(--ae-color-border-hover);\\n  color:        var(--ae-color-accent-hover);\\n}\\n\\n:host([variant=\\\"faint\\\"]) button:active:not(:disabled) {\\n  background: var(--ae-color-subtle-hover);\\n}\\n\\n:host([variant=\\\"text\\\"]) button {\\n  background:   transparent;\\n  border-color: transparent;\\n  color:        var(--ae-color-accent);\\n  min-width:     auto;\\n  padding-left:  4px;\\n  padding-right: 4px;\\n}\\n\\n:host([variant=\\\"text\\\"]) button:hover:not(:disabled) {\\n  background: var(--ae-color-subtle);\\n  color:      var(--ae-color-accent-hover);\\n}\\n\\n:host([variant=\\\"text\\\"]) button:active:not(:disabled) {\\n  background: var(--ae-color-subtle-hover);\\n}\\n\\n/* Icon-only: single ae-icon child \u2192 square compact layout */\\n:host([icon-only]) {\\n  display: inline-flex;\\n}\\n\\n:host([icon-only]:not([size])) {\\n  font-size: var(--ae-size-m);\\n}\\n\\n:host([icon-only]) button {\\n  padding:   0;\\n  min-width: auto;\\n  width:     2.286em;\\n  height:    2.286em;\\n  line-height: 1;\\n}\\n\\n:host([icon-only]) ::slotted(ae-icon) {\\n  font-size: 1.5em;\\n}\\n\\n:host([active]) button {\\n  background:   var(--ae-color-solid-active);\\n  border-color: var(--ae-color-border-hover);\\n  color:        var(--ae-color-on-solid-hover, var(--ae-color-on-solid));\\n}\\n\\n.btn-icon {\\n  padding: 0;\\n  min-width: auto;\\n  width: 2.286em;\\n  height: 2.286em;\\n  display: inline-flex;\\n  align-items: center;\\n  justify-content: center;\\n  border-radius: var(--ae-radius-sm);\\n}\\n\\n.btn-icon.btn-lg {\\n  width: 2.857em;\\n  height: 2.857em;\\n}\\n\\n.btn-circle {\\n  border-radius: var(--ae-radius-circle);\\n}\\n\\n:host([block]) {\\n  display: block;\\n}\\n\\nbutton.btn-loading {\\n  position: relative;\\n  pointer-events: none;\\n  color: transparent;\\n}\\n\\nbutton.btn-loading::before {\\n  content: '';\\n  position: absolute;\\n  width: 1em;\\n  height: 1em;\\n  border: 2px solid currentColor;\\n  border-top-color: transparent;\\n  border-radius: var(--ae-radius-circle);\\n  animation: btn-spin 0.6s linear infinite;\\n  color: currentColor;\\n  opacity: 0.8;\\n}\\n\\n@keyframes btn-spin {\\n  to {\\n    transform: rotate(360deg);\\n  }\\n}\\n\\n.btn-icon-left {\\n  margin-right: -2px;\\n}\\n\\n.btn-icon-right {\\n  margin-left: -2px;\\n}\\n\\n\"", "\uFEFFimport type { InferProps } from 'aeico';\nimport styleVariables from '../styles/variables.css';\nimport sizeCSS from '../styles/size.css';\nimport colorCSS from '../styles/color.css';\nimport buttonStyle from '../styles/components/button.css';\nimport AeicoComponent from '../aeico-component';\nimport { html } from 'aeico';\nimport { ButtonColor, ButtonSize, ButtonVariant } from './defines';\nimport { prop } from 'aeico';\n\n/**\n * Button Component\n *\n * A customizable button component with multiple variants and sizes.\n * Supports theme and internationalization through mixins.\n *\n * @example\n * ```typescript\n * // Using the static create method\n * const button = Button.create({\n *   variant: 'primary',\n *   size: 'md'\n * })\n * ```\n *\n * @example\n * ```html\n * <!-- Using as Web Component -->\n * <ae-button variant=\"primary\" size=\"md\">Save</ae-button>\n * <ae-button variant=\"danger\" size=\"sm\">Delete</ae-button>\n * <ae-button variant=\"subtle\">Cancel</ae-button>\n * ```\n */\nclass Button extends AeicoComponent {\n  protected static styles = [styleVariables, sizeCSS, colorCSS, buttonStyle];\n\n  @prop({ type: String })\n  color?: ButtonColor;\n\n  @prop({ type: String })\n  variant?: ButtonVariant;\n\n  @prop({ type: String })\n  size?: ButtonSize;\n\n  @prop({ type: Boolean })\n  disabled?: boolean;\n\n  @prop({ type: String })\n  type?: 'button' | 'submit' | 'reset';\n\n  @prop({ type: Boolean })\n  active?: boolean;\n\n  @prop({ type: Boolean })\n  block?: boolean;\n\n  private _buttonElement: HTMLButtonElement | null = null;\n  private _slotElement: HTMLSlotElement | null = null;\n  private _autoAriaLabel = false;\n\n  protected onMounted() {\n    this._handleSlotChange();\n  }\n\n  private _handleSlotChange = () => {\n    const nodes = this._slotElement?.assignedNodes() ?? [];\n    // Icon-only: exactly one element (ae-icon) and no meaningful text nodes\n    const elements = nodes.filter((n): n is Element => n.nodeType === Node.ELEMENT_NODE);\n    const hasText = nodes.some(\n      (n) => n.nodeType === Node.TEXT_NODE && n.textContent!.trim() !== '',\n    );\n    const isIconOnly =\n      !hasText && elements.length === 1 && elements[0].tagName.toLowerCase() === 'ae-icon';\n\n    if (isIconOnly) {\n      this.setAttribute('icon-only', '');\n      if (!this.hasAttribute('aria-label') || this._autoAriaLabel) {\n        this.setAttribute('aria-label', elements[0].getAttribute('name') ?? '');\n        this._autoAriaLabel = true;\n      }\n    } else {\n      this.removeAttribute('icon-only');\n      if (this._autoAriaLabel) {\n        this.removeAttribute('aria-label');\n        this._autoAriaLabel = false;\n      }\n    }\n  };\n\n  protected render() {\n    return html(({ button, slot }) => {\n      this._buttonElement = button(\n        {\n          type: this.type || 'button',\n          disabled: this.disabled,\n          part: 'button',\n          'aria-pressed': this.active,\n          'aria-disabled': this.disabled,\n        },\n        () => {\n          this._slotElement = slot({ '@slotchange': this._handleSlotChange });\n        },\n      );\n    });\n  }\n\n  /**\n   * Programmatically click the button\n   */\n  click() {\n    if (!this.disabled && this._buttonElement) {\n      this._buttonElement.click();\n    }\n  }\n\n  /**\n   * Focus the button\n   */\n  focus() {\n    if (this._buttonElement) {\n      this._buttonElement.focus();\n    }\n  }\n\n  /**\n   * Blur the button\n   */\n  blur() {\n    if (this._buttonElement) {\n      this._buttonElement.blur();\n    }\n  }\n}\n\nButton.register();\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ae-button': Button;\n  }\n}\n\nexport default Button;\nexport type ButtonProps = InferProps<typeof Button>;\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"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAC,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;;;AEdf,SAAS,QAAAA,aAAY;;;ACFrB,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,eAA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",
+  "sources": ["../src/aeico-component.ts", "../src/icon-button/icon-button.ts", "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/button.css", "../src/button/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"],
+  "sourcesContent": ["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, Props } from 'aeico';\nimport AeicoComponent from '../aeico-component';\nimport { html } from 'aeico';\nimport type { IconColor } from '../icon/defines';\n// Ensure ae-button and ae-icon are registered\nimport '../button/button';\nimport '../icon/icon';\n\nexport type IconButtonVariant = 'filled' | 'outlined' | 'subtle' | 'text';\nexport type IconButtonSize = 'xs' | 'sm' | 'md' | 'lg';\n\n/**\n * @deprecated Use `<ae-button>` with an `<ae-icon>` slot instead.\n *\n * ```html\n * <ae-button color=\"primary\"><ae-icon name=\"star\"></ae-icon></ae-button>\n * ```\n */\nclass IconButton extends AeicoComponent {\n  static props: Props = {\n    icon: { type: String },\n    size: { type: String },\n    color: { type: String },\n    variant: { type: String },\n    disabled: { type: Boolean },\n  };\n\n  declare icon?: string;\n  declare size?: IconButtonSize;\n  declare color?: IconColor;\n  declare variant?: IconButtonVariant;\n  declare disabled?: boolean;\n\n  protected static styles = [':host { display: contents; }'];\n\n  protected render() {\n    return html(({ aeButton, aeIcon }) => {\n      aeButton(\n        {\n          color: this.color,\n          variant: this.variant,\n          size: this.size,\n          disabled: this.disabled,\n        },\n        () => {\n          aeIcon({ name: this.icon });\n        },\n      );\n    });\n  }\n}\n\nIconButton.define('icon-button');\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ae-icon-button': IconButton;\n  }\n}\n\nexport default IconButton;\nexport type IconButtonProps = InferProps<typeof IconButton>;\n", "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 1.071em;\\n  font-size: 1em;\\n  line-height: 1.5;\\n  border-radius: var(--ae-border-radius, var(--_btn-r-tl, var(--ae-radius-sm)) var(--_btn-r-tr, var(--ae-radius-sm)) var(--_btn-r-br, var(--ae-radius-sm)) var(--_btn-r-bl, var(--ae-radius-sm)));\\n  min-width: 4.571em;\\n  height: 2.286em;\\n  width: 100%;\\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:host([size=\\\"xs\\\"]) button { border-radius: var(--ae-border-radius, var(--_btn-r-tl, var(--ae-radius-xs)) var(--_btn-r-tr, var(--ae-radius-xs)) var(--_btn-r-br, var(--ae-radius-xs)) var(--_btn-r-bl, var(--ae-radius-xs))); }\\n:host([size=\\\"sm\\\"]) button { border-radius: var(--ae-border-radius, var(--_btn-r-tl, var(--ae-radius-xs)) var(--_btn-r-tr, var(--ae-radius-xs)) var(--_btn-r-br, var(--ae-radius-xs)) var(--_btn-r-bl, var(--ae-radius-xs))); }\\n\\n/* --- Variants --- */\\n\\n:host([variant=\\\"outlined\\\"]) button {\\n  background:   transparent;\\n  border-color: var(--ae-color-border);\\n  color:        var(--ae-color-accent);\\n}\\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=\\\"outlined\\\"]) button:active:not(:disabled) {\\n  background: var(--ae-color-subtle-hover);\\n}\\n\\n:host([variant=\\\"subtle\\\"]) button {\\n  background:   var(--ae-color-subtle);\\n  border-color: transparent;\\n  color:        var(--ae-color-accent);\\n}\\n\\n:host([variant=\\\"subtle\\\"]) 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:active:not(:disabled) {\\n  background: var(--ae-color-subtle-hover);\\n}\\n\\n:host([variant=\\\"faint\\\"]) button {\\n  background:   var(--ae-color-subtle);\\n  border-color: var(--ae-color-border);\\n  color:        var(--ae-color-accent);\\n}\\n\\n:host([variant=\\\"faint\\\"]) button:hover:not(:disabled) {\\n  background:   var(--ae-color-subtle-hover);\\n  border-color: var(--ae-color-border-hover);\\n  color:        var(--ae-color-accent-hover);\\n}\\n\\n:host([variant=\\\"faint\\\"]) button:active:not(:disabled) {\\n  background: var(--ae-color-subtle-hover);\\n}\\n\\n:host([variant=\\\"text\\\"]) button {\\n  background:   transparent;\\n  border-color: transparent;\\n  color:        var(--ae-color-accent);\\n  min-width:     auto;\\n  padding-left:  4px;\\n  padding-right: 4px;\\n}\\n\\n:host([variant=\\\"text\\\"]) button:hover:not(:disabled) {\\n  background: var(--ae-color-subtle);\\n  color:      var(--ae-color-accent-hover);\\n}\\n\\n:host([variant=\\\"text\\\"]) button:active:not(:disabled) {\\n  background: var(--ae-color-subtle-hover);\\n}\\n\\n:host([icon-only]) {\\n  display: inline-flex;\\n}\\n\\n:host([icon-only]:not([size])) {\\n  font-size: var(--ae-size-m);\\n}\\n\\n:host([icon-only]) button {\\n  padding:   0;\\n  min-width: auto;\\n  width:     2.286em;\\n  height:    2.286em;\\n  line-height: 1;\\n}\\n\\n:host([icon-only]) ::slotted(ae-icon) {\\n  font-size: 1.5em;\\n}\\n\\n:host([active]) button {\\n  background:   var(--ae-color-solid-active);\\n  border-color: var(--ae-color-border-hover);\\n  color:        var(--ae-color-on-solid-hover, var(--ae-color-on-solid));\\n}\\n\\n.btn-icon {\\n  padding: 0;\\n  min-width: auto;\\n  width: 2.286em;\\n  height: 2.286em;\\n  display: inline-flex;\\n  align-items: center;\\n  justify-content: center;\\n  border-radius: var(--ae-radius-sm);\\n}\\n\\n.btn-icon.btn-lg {\\n  width: 2.857em;\\n  height: 2.857em;\\n}\\n\\n.btn-circle {\\n  border-radius: var(--ae-radius-circle);\\n}\\n\\n:host([block]) {\\n  display: block;\\n}\\n\\nbutton.btn-loading {\\n  position: relative;\\n  pointer-events: none;\\n  color: transparent;\\n}\\n\\nbutton.btn-loading::before {\\n  content: '';\\n  position: absolute;\\n  width: 1em;\\n  height: 1em;\\n  border: 2px solid currentColor;\\n  border-top-color: transparent;\\n  border-radius: var(--ae-radius-circle);\\n  animation: btn-spin 0.6s linear infinite;\\n  color: currentColor;\\n  opacity: 0.8;\\n}\\n\\n@keyframes btn-spin {\\n  to {\\n    transform: rotate(360deg);\\n  }\\n}\\n\\n.btn-icon-left {\\n  margin-right: -2px;\\n}\\n\\n.btn-icon-right {\\n  margin-left: -2px;\\n}\\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 buttonStyle from '../styles/components/button.css';\nimport AeicoComponent from '../aeico-component';\nimport { html } from 'aeico';\nimport { ButtonColor, ButtonSize, ButtonVariant } from './defines';\nimport { prop } from 'aeico';\n\n/**\n * Button Component\n *\n * A customizable button component with multiple variants and sizes.\n * Supports theme and internationalization through mixins.\n *\n * @example\n * ```typescript\n * // Using the static create method\n * const button = Button.create({\n *   variant: 'primary',\n *   size: 'md'\n * })\n * ```\n *\n * @example\n * ```html\n * <!-- Using as Web Component -->\n * <ae-button variant=\"primary\" size=\"md\">Save</ae-button>\n * <ae-button variant=\"danger\" size=\"sm\">Delete</ae-button>\n * <ae-button variant=\"subtle\">Cancel</ae-button>\n * ```\n */\nclass Button extends AeicoComponent {\n  protected static styles = [styleVariables, sizeCSS, colorCSS, buttonStyle];\n\n  @prop({ type: String })\n  color?: ButtonColor;\n\n  @prop({ type: String })\n  variant?: ButtonVariant;\n\n  @prop({ type: String })\n  size?: ButtonSize;\n\n  @prop({ type: Boolean })\n  disabled?: boolean;\n\n  @prop({ type: String })\n  type?: 'button' | 'submit' | 'reset';\n\n  @prop({ type: Boolean })\n  active?: boolean;\n\n  @prop({ type: Boolean })\n  block?: boolean;\n\n  private _buttonElement: HTMLButtonElement | null = null;\n  private _slotElement: HTMLSlotElement | null = null;\n  private _autoAriaLabel = false;\n\n  protected onMounted() {\n    this._handleSlotChange();\n  }\n\n  private _handleSlotChange = () => {\n    const nodes = this._slotElement?.assignedNodes() ?? [];\n    // Icon-only: exactly one element (ae-icon) and no meaningful text nodes\n    const elements = nodes.filter((n): n is Element => n.nodeType === Node.ELEMENT_NODE);\n    const hasText = nodes.some(\n      (n) => n.nodeType === Node.TEXT_NODE && n.textContent!.trim() !== '',\n    );\n    const isIconOnly =\n      !hasText && elements.length === 1 && elements[0].tagName.toLowerCase() === 'ae-icon';\n\n    if (isIconOnly) {\n      this.setAttribute('icon-only', '');\n      if (!this.hasAttribute('aria-label') || this._autoAriaLabel) {\n        this.setAttribute('aria-label', elements[0].getAttribute('name') ?? '');\n        this._autoAriaLabel = true;\n      }\n    } else {\n      this.removeAttribute('icon-only');\n      if (this._autoAriaLabel) {\n        this.removeAttribute('aria-label');\n        this._autoAriaLabel = false;\n      }\n    }\n  };\n\n  protected render() {\n    return html(({ button, slot }) => {\n      this._buttonElement = button(\n        {\n          type: this.type || 'button',\n          disabled: this.disabled,\n          part: 'button',\n          'aria-pressed': this.active,\n          'aria-disabled': this.disabled,\n        },\n        () => {\n          this._slotElement = slot({ '@slotchange': this._handleSlotChange });\n        },\n      );\n    });\n  }\n\n  /**\n   * Programmatically click the button\n   */\n  click() {\n    if (!this.disabled && this._buttonElement) {\n      this._buttonElement.click();\n    }\n  }\n\n  /**\n   * Focus the button\n   */\n  focus() {\n    if (this._buttonElement) {\n      this._buttonElement.focus();\n    }\n  }\n\n  /**\n   * Blur the button\n   */\n  blur() {\n    if (this._buttonElement) {\n      this._buttonElement.blur();\n    }\n  }\n}\n\nButton.define('button');\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ae-button': Button;\n  }\n}\n\nexport default Button;\nexport type ButtonProps = InferProps<typeof Button>;\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"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAS,oBAAoB;AAE7B,IAAM,kBAAkB;AAKxB,IAAM,iBAAN,cAA6B,aAAa;AAAA,EACxC,OAAO,OAAO,MAAc;AAC1B,UAAM,SAAS,GAAG,eAAe;AAEjC,UAAM,UAAU,KAAK,WAAW,MAAM,IAAI,OAAO,GAAG,MAAM,GAAG,IAAI;AAEjE,UAAM,OAAO,OAAO;AAAA,EACtB;AACF;AAEA,IAAO,0BAAQ;;;ACff,SAAS,QAAAA,aAAY;;;ACFrB,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;;;ACAf,IAAO,eAAQ;;;ACAf,IAAO,gBAAQ;;;ACAf,IAAO,iBAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;A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",
   "names": ["html", "html", "html", "html"]
 }

package/dist/icon.cjs

@@ -113,7 +113,7 @@ var require_variables = __commonJS({
   --ae-cyan-800: color-mix(in srgb, var(--ae-cyan) 40%, black);
   --ae-cyan-900: color-mix(in srgb, var(--ae-cyan) 20%, black);
 
-  /* Gray  (neutral \u2014 base #6e6e6e) */
+  /* Gray  (neutral - base #6e6e6e) */
   --ae-gray-100: color-mix(in srgb, var(--ae-gray) 20%, white);
   --ae-gray-200: color-mix(in srgb, var(--ae-gray) 40%, white);
   --ae-gray-300: color-mix(in srgb, var(--ae-gray) 60%, white);
@@ -124,7 +124,7 @@ var require_variables = __commonJS({
   --ae-gray-800: color-mix(in srgb, var(--ae-gray) 40%, black);
   --ae-gray-900: color-mix(in srgb, var(--ae-gray) 20%, black);
 
-  /* Slate  (blue-gray \u2014 base #64748b, used for 'secondary') */
+  /* Slate  (blue-gray - base #64748b, used for 'secondary') */
   --ae-slate-100: color-mix(in srgb, var(--ae-slate) 20%, white);
   --ae-slate-200: color-mix(in srgb, var(--ae-slate) 40%, white);
   --ae-slate-300: color-mix(in srgb, var(--ae-slate) 60%, white);
@@ -160,7 +160,7 @@ var require_variables = __commonJS({
 
 :root,
 :host {
-  /* Hover / active mix (light default \u2014 overridden in \xA7 6 dark) */
+  /* Hover / active mix (light default - overridden in \xA7 6 dark) */
   --ae-color-mix-hover:  black 10%;
   --ae-color-mix-active: black 20%;
 
@@ -194,7 +194,7 @@ var require_variables = __commonJS({
   --ae-color-info-active:      color-mix(in srgb, var(--ae-color-info), var(--ae-color-mix-active));
   --ae-color-info-disabled:    color-mix(in srgb, var(--ae-cyan) 50%, var(--ae-gray-500));
 
-  /* Secondary (Slate) \u2014 base differs per theme, overridden in \xA7 6 dark */
+  /* Secondary (Slate) - base differs per theme, overridden in \xA7 6 dark */
   --ae-color-secondary:        var(--ae-slate-500);
   --ae-color-secondary-hover:  color-mix(in srgb, var(--ae-color-secondary), var(--ae-color-mix-hover));
   --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({
 :host {
   color-scheme: light;
 
-  /* Gray UI aliases \u2014 lighter palette steps for elements on white background */
+  /* Gray UI aliases - lighter palette steps for elements on white background */
   --ae-color-gray-dark:     var(--ae-gray-400);
   --ae-color-gray:          var(--ae-gray-300);
   --ae-color-gray-light:    var(--ae-gray-200);
@@ -242,7 +242,7 @@ var require_variables = __commonJS({
   --ae-focus-ring:    rgb(from var(--ae-blue) r g b / 0.30);
   --ae-focus-ring-sm: rgb(from var(--ae-blue) r g b / 0.15);
 
-  /* Subtle intent tokens \u2014 light context */
+  /* Subtle intent tokens - light context */
   --ae-color-primary-bg-subtle:       rgb(from var(--ae-blue) r g b / 0.08);
   --ae-color-primary-border-subtle:   rgb(from var(--ae-blue) r g b / 0.40);
   --ae-color-primary-text-emphasis:   var(--ae-blue-700);
@@ -273,7 +273,7 @@ var require_variables = __commonJS({
   --ae-color-dark-bg-subtle:          var(--ae-dark-100);   /* opaque on white: ~#d6d8d9 */
   --ae-color-dark-border-subtle:      var(--ae-dark-300);   /* opaque on white: ~#85898c */
 
-  /* Component tokens \u2014 light defaults */
+  /* Component tokens - light defaults */
   --ae-action-btn-bg:          var(--ae-gray-200);
   --ae-action-btn-bg-hover:    var(--ae-color-primary);
   --ae-action-btn-color:       var(--ae-gray-600);
@@ -308,14 +308,12 @@ var require_variables = __commonJS({
   --ae-size-3xs:   round(calc(var(--ae-size-2xs) / 1.125), 1px);         /* 10px */
 }
 
-/* Border-radius tokens \u2014 shared across all components */
+/* Border-radius tokens - shared across all components */
 :root,
 :host {
   /**
    * Unified border-radius hook for all components.
    *
-   * Not set by default \u2014 each component falls back to its own --ae-radius-*
-   * token (e.g. button \u2192 sm, card \u2192 lg, input \u2192 xs).
    *
    * Usage:
    *   :root { --ae-border-radius: 0; }       // global: all components square
@@ -337,7 +335,7 @@ var require_variables = __commonJS({
   --ae-radius-circle:  50%;
 }
 
-/* Layout tokens \u2014 defined on :root so all light DOM elements can use them */
+/* Layout tokens - defined on :root so all light DOM elements can use them */
 :root,
 :host {
   --container-max-width: 1280px;
@@ -350,18 +348,18 @@ var require_variables = __commonJS({
 :host-context([theme="dark"]) {
   color-scheme: dark;
 
-  /* Hover / active \u2014 slightly gentler on dark backgrounds */
+  /* Hover / active - slightly gentler on dark backgrounds */
   --ae-color-mix-hover:  black 8%;
   --ae-color-mix-active: black 16%;
 
-  /* Gray UI aliases \u2014 darker palette steps for elements on dark background */
+  /* Gray UI aliases - darker palette steps for elements on dark background */
   --ae-color-gray-dark:     var(--ae-gray-800);
   --ae-color-gray:          var(--ae-gray-700);
   --ae-color-gray-light:    var(--ae-gray-600);
   --ae-color-gray-lighter:  var(--ae-gray-500);
   --ae-color-gray-lightest: var(--ae-gray-400);
 
-  /* Secondary \u2014 deeper base on dark background */
+  /* Secondary - deeper base on dark background */
   --ae-color-secondary:      var(--ae-slate-700);
   --ae-color-secondary-text: var(--ae-slate-300);
 
@@ -390,7 +388,7 @@ var require_variables = __commonJS({
   --ae-focus-ring:    rgb(from var(--ae-blue) r g b / 0.25);
   --ae-focus-ring-sm: rgb(from var(--ae-blue) r g b / 0.10);
 
-  /* Subtle intent tokens \u2014 dark context (more alpha, lighter text-emphasis) */
+  /* Subtle intent tokens - dark context (more alpha, lighter text-emphasis) */
   --ae-color-primary-bg-subtle:       rgb(from var(--ae-blue) r g b / 0.10);
   --ae-color-primary-border-subtle:   rgb(from var(--ae-blue) r g b / 0.30);
   --ae-color-primary-text-emphasis:   var(--ae-blue-300);
@@ -421,7 +419,7 @@ var require_variables = __commonJS({
   --ae-color-dark-bg-subtle:          rgb(from var(--ae-dark) r g b / 0.30);
   --ae-color-dark-border-subtle:      rgb(from var(--ae-dark) r g b / 0.50);
 
-  /* Component tokens \u2014 dark overrides */
+  /* Component tokens - dark overrides */
   --ae-action-btn-bg:          var(--ae-color-gray);
   --ae-action-btn-bg-hover:    color-mix(in srgb, var(--ae-blue) 25%, var(--ae-gray-800));
   --ae-action-btn-color:       var(--ae-gray-400);
@@ -464,18 +462,15 @@ module.exports = __toCommonJS(icon_exports);
 
 // src/utils.ts
 var SVG_NS = "http://www.w3.org/2000/svg";
-function toKebab(str) {
-  const cleaned = str.replace(/^[_\d]+/, "");
-  return cleaned.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
-}
 
 // src/aeico-component.ts
 var import_aeico = require("aeico");
 var TAG_NAME_PREFIX = "ae";
 var AeicoComponent = class extends import_aeico.AeicoElement {
-  static register(name) {
-    const tagName = name || `${TAG_NAME_PREFIX}-${this.tagName || toKebab(this.name)}`;
-    super.register(tagName);
+  static define(name) {
+    const prefix = `${TAG_NAME_PREFIX}-`;
+    const tagName = name.startsWith(prefix) ? name : `${prefix}${name}`;
+    super.define(tagName);
   }
 };
 var aeico_component_default = AeicoComponent;
@@ -493,7 +488,7 @@ var defaultViewBox = "0 0 24 24";
 // src/icon/registry.ts
 var IconRegistry = class {
   static _icons = /* @__PURE__ */ new Map();
-  /** Names registered via addBuiltIn — can be overridden by user add() calls */
+  /** Names registered via addBuiltIn - can be overridden by user add() calls */
   static _builtInKeys = /* @__PURE__ */ new Set();
   /** Register user icons. Always takes priority over built-in icons. */
   static add(icons) {
@@ -545,7 +540,6 @@ registry_default.addBuiltIn({
 
 // src/icon/icon.ts
 var Icon = class extends aeico_component_default {
-  static tagName = "icon";
   static props = {
     name: { type: String },
     size: { type: String },
@@ -605,7 +599,7 @@ var Icon = class extends aeico_component_default {
     });
   }
 };
-Icon.register();
+Icon.define("icon");
 var icon_default = Icon;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {