@eagami/ui 5.67.0 → 5.68.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/fesm2022/eagami-ui.mjs +42 -10
  2. package/fesm2022/eagami-ui.mjs.map +1 -1
  3. package/package.json +1 -1
  4. package/src/styles/_reset.scss +2 -0
  5. package/types/eagami-ui.d.ts +7 -0
package/fesm2022/eagami-ui.mjs CHANGED
@@ -11573,7 +11573,7 @@ var CheckboxComponent = class CheckboxComponent {
11573
11573
  }],
11574
11574
  ngImport: i0,
11575
11575
  template: "<div\n class=\"ea-checkbox-field ea-checkbox-field--{{ size() }}\"\n [class.ea-checkbox-field--truncate]=\"truncate()\">\n <label\n class=\"ea-checkbox\"\n [ngClass]=\"hostClasses()\"\n [for]=\"id()\">\n <input\n #inputEl\n type=\"checkbox\"\n class=\"ea-checkbox__input\"\n [id]=\"id()\"\n [checked]=\"checked()\"\n [disabled]=\"isDisabled()\"\n [required]=\"required()\"\n [indeterminate]=\"indeterminate()\"\n [attr.aria-checked]=\"indeterminate() ? 'mixed' : checked()\"\n [attr.aria-label]=\"!label() ? (ariaLabel() ?? null) : null\"\n [attr.aria-required]=\"required() || null\"\n [attr.aria-invalid]=\"hasError() || null\"\n [attr.aria-describedby]=\"\n showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n \"\n (change)=\"handleChange()\"\n (keydown)=\"handleKeydown($event)\" />\n\n <span\n class=\"ea-checkbox__box\"\n aria-hidden=\"true\">\n @if (indeterminate()) {\n <svg\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M4 8h8\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\" />\n </svg>\n } @else if (checked()) {\n <svg\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M3.5 8.5L6.5 11.5L12.5 4.5\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n }\n </span>\n\n @if (label()) {\n <span\n class=\"ea-checkbox__label\"\n [class.ea-checkbox__label--required]=\"required()\"\n [eaTooltip]=\"clampedText()\"\n [whenClipped]=\"true\">\n {{ label() }}\n @if (count() !== undefined && count() !== null) {\n <span class=\"ea-checkbox__count\">{{ count() }}</span>\n }\n </span>\n }\n </label>\n\n <ea-field-messages\n [id]=\"id()\"\n [error]=\"errorText()\"\n [hint]=\"showHint() ? hint() : null\" />\n</div>\n",
11576
- styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}:host(.ea-checkbox-host--truncate){max-width:100%}.ea-checkbox-field{display:inline-flex;flex-direction:column;gap:.375em}.ea-checkbox-field--truncate{min-width:0}.ea-checkbox-field{--ea-field-messages-size: .8125em}.ea-checkbox-field--2xs{font-size:var(--font-size-2xs)}.ea-checkbox-field--xs{font-size:var(--font-size-xs)}.ea-checkbox-field--sm{font-size:var(--font-size-sm)}.ea-checkbox-field--md{font-size:var(--font-size-md)}.ea-checkbox-field--lg{font-size:var(--font-size-lg)}.ea-checkbox-field--xl{font-size:var(--font-size-xl)}.ea-checkbox{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans);color:var(--color-text-primary)}.ea-checkbox--disabled{opacity:.45;cursor:default}.ea-checkbox--checked .ea-checkbox__box,.ea-checkbox--indeterminate .ea-checkbox__box{background-color:var(--color-brand-default);border-color:var(--color-brand-default);color:var(--color-text-inverse)}@media(forced-colors:active){.ea-checkbox--checked .ea-checkbox__box,.ea-checkbox--indeterminate .ea-checkbox__box{background-color:Highlight;border-color:Highlight;color:HighlightText}}.ea-checkbox:hover:not(.ea-checkbox--disabled,.ea-checkbox--checked,.ea-checkbox--indeterminate,.ea-checkbox--error) .ea-checkbox__box{border-color:var(--color-border-emphasis)}.ea-checkbox__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ea-checkbox__input:focus-visible+.ea-checkbox__box{outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:2px}@media(forced-colors:active){.ea-checkbox__input:focus-visible+.ea-checkbox__box{outline:2px solid Highlight;outline-offset:2px}}.ea-checkbox__box{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-sizing:border-box;width:1.25em;height:1.25em;border:var(--border-width-thin) solid var(--color-border-strong);border-radius:var(--radius-sm);background-color:var(--color-bg-base);transition:var(--transition-colors),var(--transition-shadow)}.ea-checkbox__box svg{position:absolute;width:65%;height:65%}.ea-checkbox--truncate{min-width:0}.ea-checkbox--truncate .ea-checkbox__label{overflow:hidden;min-width:0;white-space:nowrap;text-overflow:ellipsis}.ea-checkbox__label{font-weight:var(--font-weight-regular);color:var(--ea-checkbox-label-color, inherit);transition:color var(--duration-fast) var(--ease-out)}.ea-checkbox__label--required:after{color:var(--color-error-text);content:\" *\"}.ea-checkbox__count{margin-inline-start:.25em;color:var(--ea-checkbox-count-color, var(--color-text-tertiary));transition:color var(--duration-fast) var(--ease-out)}.ea-checkbox--error .ea-checkbox__box{border-color:var(--color-error-default)}\n"],
11576
+ styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}:host(.ea-checkbox-host--truncate){max-width:100%}.ea-checkbox-field{display:inline-flex;flex-direction:column;gap:.375em}.ea-checkbox-field--truncate{min-width:0}.ea-checkbox-field{--ea-field-messages-size: .8125em}.ea-checkbox-field--2xs{font-size:var(--font-size-2xs)}.ea-checkbox-field--xs{font-size:var(--font-size-xs)}.ea-checkbox-field--sm{font-size:var(--font-size-sm)}.ea-checkbox-field--md{font-size:var(--font-size-md)}.ea-checkbox-field--lg{font-size:var(--font-size-lg)}.ea-checkbox-field--xl{font-size:var(--font-size-xl)}.ea-checkbox{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans);color:var(--color-text-primary)}.ea-checkbox:has(.ea-checkbox__label){align-items:flex-start}.ea-checkbox:has(.ea-checkbox__label) .ea-checkbox__box{margin-top:calc((var(--line-height-normal) * 1em - 1.25em) / 2)}.ea-checkbox--disabled{opacity:.45;cursor:default}.ea-checkbox--checked .ea-checkbox__box,.ea-checkbox--indeterminate .ea-checkbox__box{background-color:var(--color-brand-default);border-color:var(--color-brand-default);color:var(--color-text-inverse)}@media(forced-colors:active){.ea-checkbox--checked .ea-checkbox__box,.ea-checkbox--indeterminate .ea-checkbox__box{background-color:Highlight;border-color:Highlight;color:HighlightText}}.ea-checkbox:hover:not(.ea-checkbox--disabled,.ea-checkbox--checked,.ea-checkbox--indeterminate,.ea-checkbox--error) .ea-checkbox__box{border-color:var(--color-border-emphasis)}.ea-checkbox__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ea-checkbox__input:focus-visible+.ea-checkbox__box{outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:2px}@media(forced-colors:active){.ea-checkbox__input:focus-visible+.ea-checkbox__box{outline:2px solid Highlight;outline-offset:2px}}.ea-checkbox__box{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-sizing:border-box;width:1.25em;height:1.25em;border:var(--border-width-thin) solid var(--color-border-strong);border-radius:var(--radius-sm);background-color:var(--color-bg-base);transition:var(--transition-colors),var(--transition-shadow)}.ea-checkbox__box svg{position:absolute;width:65%;height:65%}.ea-checkbox--truncate{min-width:0}.ea-checkbox--truncate .ea-checkbox__label{overflow:hidden;min-width:0;white-space:nowrap;text-overflow:ellipsis}.ea-checkbox__label{font-weight:var(--font-weight-regular);line-height:var(--line-height-normal);color:var(--ea-checkbox-label-color, inherit);transition:color var(--duration-fast) var(--ease-out)}.ea-checkbox__label--required:after{color:var(--color-error-text);content:\" *\"}.ea-checkbox__count{margin-inline-start:.25em;color:var(--ea-checkbox-count-color, var(--color-text-tertiary));transition:color var(--duration-fast) var(--ease-out)}.ea-checkbox--error .ea-checkbox__box{border-color:var(--color-error-default)}\n"],
11577
11577
  dependencies: [
11578
11578
  {
11579
11579
  kind: "component",
@@ -11632,7 +11632,7 @@ i0.ɵɵngDeclareClassMetadata({
11632
11632
  multi: true
11633
11633
  }],
11634
11634
  template: "<div\n class=\"ea-checkbox-field ea-checkbox-field--{{ size() }}\"\n [class.ea-checkbox-field--truncate]=\"truncate()\">\n <label\n class=\"ea-checkbox\"\n [ngClass]=\"hostClasses()\"\n [for]=\"id()\">\n <input\n #inputEl\n type=\"checkbox\"\n class=\"ea-checkbox__input\"\n [id]=\"id()\"\n [checked]=\"checked()\"\n [disabled]=\"isDisabled()\"\n [required]=\"required()\"\n [indeterminate]=\"indeterminate()\"\n [attr.aria-checked]=\"indeterminate() ? 'mixed' : checked()\"\n [attr.aria-label]=\"!label() ? (ariaLabel() ?? null) : null\"\n [attr.aria-required]=\"required() || null\"\n [attr.aria-invalid]=\"hasError() || null\"\n [attr.aria-describedby]=\"\n showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n \"\n (change)=\"handleChange()\"\n (keydown)=\"handleKeydown($event)\" />\n\n <span\n class=\"ea-checkbox__box\"\n aria-hidden=\"true\">\n @if (indeterminate()) {\n <svg\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M4 8h8\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\" />\n </svg>\n } @else if (checked()) {\n <svg\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M3.5 8.5L6.5 11.5L12.5 4.5\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n }\n </span>\n\n @if (label()) {\n <span\n class=\"ea-checkbox__label\"\n [class.ea-checkbox__label--required]=\"required()\"\n [eaTooltip]=\"clampedText()\"\n [whenClipped]=\"true\">\n {{ label() }}\n @if (count() !== undefined && count() !== null) {\n <span class=\"ea-checkbox__count\">{{ count() }}</span>\n }\n </span>\n }\n </label>\n\n <ea-field-messages\n [id]=\"id()\"\n [error]=\"errorText()\"\n [hint]=\"showHint() ? hint() : null\" />\n</div>\n",
11635
- styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}:host(.ea-checkbox-host--truncate){max-width:100%}.ea-checkbox-field{display:inline-flex;flex-direction:column;gap:.375em}.ea-checkbox-field--truncate{min-width:0}.ea-checkbox-field{--ea-field-messages-size: .8125em}.ea-checkbox-field--2xs{font-size:var(--font-size-2xs)}.ea-checkbox-field--xs{font-size:var(--font-size-xs)}.ea-checkbox-field--sm{font-size:var(--font-size-sm)}.ea-checkbox-field--md{font-size:var(--font-size-md)}.ea-checkbox-field--lg{font-size:var(--font-size-lg)}.ea-checkbox-field--xl{font-size:var(--font-size-xl)}.ea-checkbox{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans);color:var(--color-text-primary)}.ea-checkbox--disabled{opacity:.45;cursor:default}.ea-checkbox--checked .ea-checkbox__box,.ea-checkbox--indeterminate .ea-checkbox__box{background-color:var(--color-brand-default);border-color:var(--color-brand-default);color:var(--color-text-inverse)}@media(forced-colors:active){.ea-checkbox--checked .ea-checkbox__box,.ea-checkbox--indeterminate .ea-checkbox__box{background-color:Highlight;border-color:Highlight;color:HighlightText}}.ea-checkbox:hover:not(.ea-checkbox--disabled,.ea-checkbox--checked,.ea-checkbox--indeterminate,.ea-checkbox--error) .ea-checkbox__box{border-color:var(--color-border-emphasis)}.ea-checkbox__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ea-checkbox__input:focus-visible+.ea-checkbox__box{outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:2px}@media(forced-colors:active){.ea-checkbox__input:focus-visible+.ea-checkbox__box{outline:2px solid Highlight;outline-offset:2px}}.ea-checkbox__box{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-sizing:border-box;width:1.25em;height:1.25em;border:var(--border-width-thin) solid var(--color-border-strong);border-radius:var(--radius-sm);background-color:var(--color-bg-base);transition:var(--transition-colors),var(--transition-shadow)}.ea-checkbox__box svg{position:absolute;width:65%;height:65%}.ea-checkbox--truncate{min-width:0}.ea-checkbox--truncate .ea-checkbox__label{overflow:hidden;min-width:0;white-space:nowrap;text-overflow:ellipsis}.ea-checkbox__label{font-weight:var(--font-weight-regular);color:var(--ea-checkbox-label-color, inherit);transition:color var(--duration-fast) var(--ease-out)}.ea-checkbox__label--required:after{color:var(--color-error-text);content:\" *\"}.ea-checkbox__count{margin-inline-start:.25em;color:var(--ea-checkbox-count-color, var(--color-text-tertiary));transition:color var(--duration-fast) var(--ease-out)}.ea-checkbox--error .ea-checkbox__box{border-color:var(--color-error-default)}\n"]
11635
+ styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}:host(.ea-checkbox-host--truncate){max-width:100%}.ea-checkbox-field{display:inline-flex;flex-direction:column;gap:.375em}.ea-checkbox-field--truncate{min-width:0}.ea-checkbox-field{--ea-field-messages-size: .8125em}.ea-checkbox-field--2xs{font-size:var(--font-size-2xs)}.ea-checkbox-field--xs{font-size:var(--font-size-xs)}.ea-checkbox-field--sm{font-size:var(--font-size-sm)}.ea-checkbox-field--md{font-size:var(--font-size-md)}.ea-checkbox-field--lg{font-size:var(--font-size-lg)}.ea-checkbox-field--xl{font-size:var(--font-size-xl)}.ea-checkbox{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans);color:var(--color-text-primary)}.ea-checkbox:has(.ea-checkbox__label){align-items:flex-start}.ea-checkbox:has(.ea-checkbox__label) .ea-checkbox__box{margin-top:calc((var(--line-height-normal) * 1em - 1.25em) / 2)}.ea-checkbox--disabled{opacity:.45;cursor:default}.ea-checkbox--checked .ea-checkbox__box,.ea-checkbox--indeterminate .ea-checkbox__box{background-color:var(--color-brand-default);border-color:var(--color-brand-default);color:var(--color-text-inverse)}@media(forced-colors:active){.ea-checkbox--checked .ea-checkbox__box,.ea-checkbox--indeterminate .ea-checkbox__box{background-color:Highlight;border-color:Highlight;color:HighlightText}}.ea-checkbox:hover:not(.ea-checkbox--disabled,.ea-checkbox--checked,.ea-checkbox--indeterminate,.ea-checkbox--error) .ea-checkbox__box{border-color:var(--color-border-emphasis)}.ea-checkbox__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ea-checkbox__input:focus-visible+.ea-checkbox__box{outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:2px}@media(forced-colors:active){.ea-checkbox__input:focus-visible+.ea-checkbox__box{outline:2px solid Highlight;outline-offset:2px}}.ea-checkbox__box{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-sizing:border-box;width:1.25em;height:1.25em;border:var(--border-width-thin) solid var(--color-border-strong);border-radius:var(--radius-sm);background-color:var(--color-bg-base);transition:var(--transition-colors),var(--transition-shadow)}.ea-checkbox__box svg{position:absolute;width:65%;height:65%}.ea-checkbox--truncate{min-width:0}.ea-checkbox--truncate .ea-checkbox__label{overflow:hidden;min-width:0;white-space:nowrap;text-overflow:ellipsis}.ea-checkbox__label{font-weight:var(--font-weight-regular);line-height:var(--line-height-normal);color:var(--ea-checkbox-label-color, inherit);transition:color var(--duration-fast) var(--ease-out)}.ea-checkbox__label--required:after{color:var(--color-error-text);content:\" *\"}.ea-checkbox__count{margin-inline-start:.25em;color:var(--ea-checkbox-count-color, var(--color-text-tertiary));transition:color var(--duration-fast) var(--ease-out)}.ea-checkbox--error .ea-checkbox__box{border-color:var(--color-error-default)}\n"]
11636
11636
  }]
11637
11637
  }],
11638
11638
  propDecorators: {
@@ -19679,7 +19679,7 @@ var EagamiWordmarkComponent = class EagamiWordmarkComponent {
19679
19679
  },
19680
19680
  ngImport: i0,
19681
19681
  template: "@if (linked()) {\n <a\n class=\"ea-eagami-wordmark\"\n [class.ea-eagami-wordmark--inline]=\"layout() === 'inline'\"\n [class.ea-eagami-wordmark--tagline]=\"showTagline()\"\n href=\"https://eagami.com\"\n target=\"_blank\"\n rel=\"noopener\"\n [attr.aria-label]=\"ariaLabel()\">\n <ng-container [ngTemplateOutlet]=\"lockup\" />\n </a>\n} @else {\n <span\n class=\"ea-eagami-wordmark\"\n [class.ea-eagami-wordmark--inline]=\"layout() === 'inline'\"\n [class.ea-eagami-wordmark--tagline]=\"showTagline()\">\n <ng-container [ngTemplateOutlet]=\"lockup\" />\n </span>\n}\n\n<ng-template #lockup>\n <ea-icon-eagami\n class=\"ea-eagami-wordmark__logo\"\n aria-hidden=\"true\" />\n\n <span class=\"ea-eagami-wordmark__text\">\n @if (showOverline()) {\n <span class=\"ea-eagami-wordmark__overline\">\n {{ i18n.messages().wordmark.overline }}\n </span>\n }\n <span class=\"ea-eagami-wordmark__brand\">{{ brandText() }}</span>\n @if (showTagline()) {\n @if (layout() === 'inline') {\n <span\n class=\"ea-eagami-wordmark__separator\"\n aria-hidden=\"true\">\n —\n </span>\n }\n <span class=\"ea-eagami-wordmark__tagline\">\n {{ i18n.messages().wordmark.tagline }}\n </span>\n }\n </span>\n</ng-template>\n",
19682
- styles: ["@import\"https://fonts.googleapis.com/css2?family=Syne:wght@400;500&display=swap\";:host{display:inline-flex;line-height:var(--line-height-none)}.ea-eagami-wordmark{display:inline-flex;align-items:center;gap:.125em;border-radius:var(--radius-sm);color:var(--ea-eagami-wordmark-color, var(--color-text-primary));text-decoration:none;transition:var(--transition-opacity)}.ea-eagami-wordmark:any-link:hover{opacity:.75}.ea-eagami-wordmark:any-link:focus-visible{outline:none;outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:2px}@media(forced-colors:active){.ea-eagami-wordmark:any-link:focus-visible{outline:2px solid Highlight;outline-offset:2px}}.ea-eagami-wordmark__logo{flex-shrink:0;font-size:1.5em;forced-color-adjust:none}.ea-eagami-wordmark__text{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;line-height:var(--line-height-tight)}.ea-eagami-wordmark__overline,.ea-eagami-wordmark__brand,.ea-eagami-wordmark__tagline{white-space:nowrap;text-transform:lowercase}.ea-eagami-wordmark__overline,.ea-eagami-wordmark__separator,.ea-eagami-wordmark__tagline{font-size:.4em;font-weight:var(--font-weight-regular);letter-spacing:var(--letter-spacing-wide);font-family:var(--font-family-sans);color:var(--color-text-secondary)}.ea-eagami-wordmark__overline{margin-bottom:-.375em;color:var(--ea-eagami-wordmark-overline-color, var(--color-text-secondary))}.ea-eagami-wordmark__brand{font-size:1em;font-weight:var(--font-weight-medium);letter-spacing:var(--letter-spacing-wide);font-family:var(--font-family-brand)}.ea-eagami-wordmark--tagline .ea-eagami-wordmark__text{transform:translateY(-.125em)}.ea-eagami-wordmark--inline .ea-eagami-wordmark__text{flex-direction:row;align-items:baseline;gap:.4em;transform:none}.ea-eagami-wordmark--inline .ea-eagami-wordmark__overline,.ea-eagami-wordmark--inline .ea-eagami-wordmark__separator,.ea-eagami-wordmark--inline .ea-eagami-wordmark__tagline{margin-bottom:0;font-size:1em}\n"],
19682
+ styles: ["@import\"https://fonts.googleapis.com/css2?family=Syne:wght@400;500&display=swap\";:host{display:inline-flex;line-height:var(--line-height-none)}.ea-eagami-wordmark{display:inline-flex;align-items:center;gap:.125em;border-radius:var(--radius-sm);color:var(--ea-eagami-wordmark-color, var(--color-text-primary));text-decoration:none;transition:var(--transition-opacity)}.ea-eagami-wordmark:any-link:hover{opacity:.75}.ea-eagami-wordmark:any-link:focus-visible{outline:none;outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:2px}@media(forced-colors:active){.ea-eagami-wordmark:any-link:focus-visible{outline:2px solid Highlight;outline-offset:2px}}.ea-eagami-wordmark__logo{flex-shrink:0;font-size:1.5em;forced-color-adjust:none}.ea-eagami-wordmark__text{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;line-height:var(--line-height-tight)}.ea-eagami-wordmark__overline,.ea-eagami-wordmark__brand,.ea-eagami-wordmark__tagline{white-space:nowrap;text-transform:lowercase}.ea-eagami-wordmark__overline,.ea-eagami-wordmark__separator,.ea-eagami-wordmark__tagline{font-size:.4em;font-weight:var(--font-weight-regular);letter-spacing:var(--letter-spacing-wide);font-family:var(--font-family-sans);color:var(--color-text-secondary)}.ea-eagami-wordmark__overline{margin-bottom:-.375em;color:var(--ea-eagami-wordmark-overline-color, var(--color-text-secondary))}.ea-eagami-wordmark__brand{font-size:1em;font-weight:var(--font-weight-medium);letter-spacing:var(--letter-spacing-wide);font-family:Syne,Syne Fallback,system-ui,sans-serif}.ea-eagami-wordmark--tagline .ea-eagami-wordmark__text{transform:translateY(-.125em)}.ea-eagami-wordmark--inline .ea-eagami-wordmark__text{flex-direction:row;align-items:baseline;gap:.4em;transform:none}.ea-eagami-wordmark--inline .ea-eagami-wordmark__overline,.ea-eagami-wordmark--inline .ea-eagami-wordmark__separator,.ea-eagami-wordmark--inline .ea-eagami-wordmark__tagline{margin-bottom:0;font-size:1em}\n"],
19683
19683
  dependencies: [{
19684
19684
  kind: "component",
19685
19685
  type: EagamiIconComponent,
@@ -19714,7 +19714,7 @@ i0.ɵɵngDeclareClassMetadata({
19714
19714
  "[style.font-size]": "resolvedSize()"
19715
19715
  },
19716
19716
  template: "@if (linked()) {\n <a\n class=\"ea-eagami-wordmark\"\n [class.ea-eagami-wordmark--inline]=\"layout() === 'inline'\"\n [class.ea-eagami-wordmark--tagline]=\"showTagline()\"\n href=\"https://eagami.com\"\n target=\"_blank\"\n rel=\"noopener\"\n [attr.aria-label]=\"ariaLabel()\">\n <ng-container [ngTemplateOutlet]=\"lockup\" />\n </a>\n} @else {\n <span\n class=\"ea-eagami-wordmark\"\n [class.ea-eagami-wordmark--inline]=\"layout() === 'inline'\"\n [class.ea-eagami-wordmark--tagline]=\"showTagline()\">\n <ng-container [ngTemplateOutlet]=\"lockup\" />\n </span>\n}\n\n<ng-template #lockup>\n <ea-icon-eagami\n class=\"ea-eagami-wordmark__logo\"\n aria-hidden=\"true\" />\n\n <span class=\"ea-eagami-wordmark__text\">\n @if (showOverline()) {\n <span class=\"ea-eagami-wordmark__overline\">\n {{ i18n.messages().wordmark.overline }}\n </span>\n }\n <span class=\"ea-eagami-wordmark__brand\">{{ brandText() }}</span>\n @if (showTagline()) {\n @if (layout() === 'inline') {\n <span\n class=\"ea-eagami-wordmark__separator\"\n aria-hidden=\"true\">\n —\n </span>\n }\n <span class=\"ea-eagami-wordmark__tagline\">\n {{ i18n.messages().wordmark.tagline }}\n </span>\n }\n </span>\n</ng-template>\n",
19717
- styles: ["@import\"https://fonts.googleapis.com/css2?family=Syne:wght@400;500&display=swap\";:host{display:inline-flex;line-height:var(--line-height-none)}.ea-eagami-wordmark{display:inline-flex;align-items:center;gap:.125em;border-radius:var(--radius-sm);color:var(--ea-eagami-wordmark-color, var(--color-text-primary));text-decoration:none;transition:var(--transition-opacity)}.ea-eagami-wordmark:any-link:hover{opacity:.75}.ea-eagami-wordmark:any-link:focus-visible{outline:none;outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:2px}@media(forced-colors:active){.ea-eagami-wordmark:any-link:focus-visible{outline:2px solid Highlight;outline-offset:2px}}.ea-eagami-wordmark__logo{flex-shrink:0;font-size:1.5em;forced-color-adjust:none}.ea-eagami-wordmark__text{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;line-height:var(--line-height-tight)}.ea-eagami-wordmark__overline,.ea-eagami-wordmark__brand,.ea-eagami-wordmark__tagline{white-space:nowrap;text-transform:lowercase}.ea-eagami-wordmark__overline,.ea-eagami-wordmark__separator,.ea-eagami-wordmark__tagline{font-size:.4em;font-weight:var(--font-weight-regular);letter-spacing:var(--letter-spacing-wide);font-family:var(--font-family-sans);color:var(--color-text-secondary)}.ea-eagami-wordmark__overline{margin-bottom:-.375em;color:var(--ea-eagami-wordmark-overline-color, var(--color-text-secondary))}.ea-eagami-wordmark__brand{font-size:1em;font-weight:var(--font-weight-medium);letter-spacing:var(--letter-spacing-wide);font-family:var(--font-family-brand)}.ea-eagami-wordmark--tagline .ea-eagami-wordmark__text{transform:translateY(-.125em)}.ea-eagami-wordmark--inline .ea-eagami-wordmark__text{flex-direction:row;align-items:baseline;gap:.4em;transform:none}.ea-eagami-wordmark--inline .ea-eagami-wordmark__overline,.ea-eagami-wordmark--inline .ea-eagami-wordmark__separator,.ea-eagami-wordmark--inline .ea-eagami-wordmark__tagline{margin-bottom:0;font-size:1em}\n"]
19717
+ styles: ["@import\"https://fonts.googleapis.com/css2?family=Syne:wght@400;500&display=swap\";:host{display:inline-flex;line-height:var(--line-height-none)}.ea-eagami-wordmark{display:inline-flex;align-items:center;gap:.125em;border-radius:var(--radius-sm);color:var(--ea-eagami-wordmark-color, var(--color-text-primary));text-decoration:none;transition:var(--transition-opacity)}.ea-eagami-wordmark:any-link:hover{opacity:.75}.ea-eagami-wordmark:any-link:focus-visible{outline:none;outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:2px}@media(forced-colors:active){.ea-eagami-wordmark:any-link:focus-visible{outline:2px solid Highlight;outline-offset:2px}}.ea-eagami-wordmark__logo{flex-shrink:0;font-size:1.5em;forced-color-adjust:none}.ea-eagami-wordmark__text{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;line-height:var(--line-height-tight)}.ea-eagami-wordmark__overline,.ea-eagami-wordmark__brand,.ea-eagami-wordmark__tagline{white-space:nowrap;text-transform:lowercase}.ea-eagami-wordmark__overline,.ea-eagami-wordmark__separator,.ea-eagami-wordmark__tagline{font-size:.4em;font-weight:var(--font-weight-regular);letter-spacing:var(--letter-spacing-wide);font-family:var(--font-family-sans);color:var(--color-text-secondary)}.ea-eagami-wordmark__overline{margin-bottom:-.375em;color:var(--ea-eagami-wordmark-overline-color, var(--color-text-secondary))}.ea-eagami-wordmark__brand{font-size:1em;font-weight:var(--font-weight-medium);letter-spacing:var(--letter-spacing-wide);font-family:Syne,Syne Fallback,system-ui,sans-serif}.ea-eagami-wordmark--tagline .ea-eagami-wordmark__text{transform:translateY(-.125em)}.ea-eagami-wordmark--inline .ea-eagami-wordmark__text{flex-direction:row;align-items:baseline;gap:.4em;transform:none}.ea-eagami-wordmark--inline .ea-eagami-wordmark__overline,.ea-eagami-wordmark--inline .ea-eagami-wordmark__separator,.ea-eagami-wordmark--inline .ea-eagami-wordmark__tagline{margin-bottom:0;font-size:1em}\n"]
19718
19718
  }]
19719
19719
  }],
19720
19720
  propDecorators: {
@@ -23090,6 +23090,7 @@ var TagComponent = class TagComponent {
23090
23090
  labelEl = viewChild("labelEl", ...ngDevMode ? [{ debugName: "labelEl" }] : /* istanbul ignore next */ []);
23091
23091
  variant = input("default", ...ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []);
23092
23092
  size = input("md", ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
23093
+ icon = input(void 0, ...ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []);
23093
23094
  removable = input(false, ...ngDevMode ? [{ debugName: "removable" }] : /* istanbul ignore next */ []);
23094
23095
  disabled = input(false, ...ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []);
23095
23096
  removeLabel = input(void 0, ...ngDevMode ? [{ debugName: "removeLabel" }] : /* istanbul ignore next */ []);
@@ -23180,6 +23181,13 @@ var TagComponent = class TagComponent {
23180
23181
  isRequired: false,
23181
23182
  transformFunction: null
23182
23183
  },
23184
+ icon: {
23185
+ classPropertyName: "icon",
23186
+ publicName: "icon",
23187
+ isSignal: true,
23188
+ isRequired: false,
23189
+ transformFunction: null
23190
+ },
23183
23191
  removable: {
23184
23192
  classPropertyName: "removable",
23185
23193
  publicName: "removable",
@@ -23253,8 +23261,8 @@ var TagComponent = class TagComponent {
23253
23261
  isSignal: true
23254
23262
  }],
23255
23263
  ngImport: i0,
23256
- template: "<span\n class=\"ea-tag\"\n [ngClass]=\"hostClasses()\"\n [style.--ea-tag-max-width]=\"resolvedMaxWidth()\"\n [style.--ea-tag-color]=\"resolvedColor()\"\n [style.--ea-tag-ink]=\"resolvedInk()\"\n [eaTooltip]=\"labelTooltip()\"\n [tooltipPosition]=\"tooltipPosition()\">\n <span\n #labelEl\n class=\"ea-tag__label\">\n <ng-content />\n </span>\n @if (removable()) {\n <button\n type=\"button\"\n class=\"ea-tag__remove\"\n [disabled]=\"disabled() || null\"\n [attr.tabindex]=\"removeTabbable() ? null : -1\"\n [attr.aria-label]=\"resolvedRemoveLabel()\"\n (click)=\"onRemove($event)\">\n <ea-icon-x />\n </button>\n }\n</span>\n",
23257
- styles: ["ea-tag{display:inline-flex;vertical-align:middle;min-width:0;line-height:1}.ea-tag{display:inline-flex;align-items:center;gap:.25em;max-width:var(--ea-tag-max-width, none);padding:var(--ea-tag-padding-block, .25em) .5em;font-weight:var(--font-weight-medium);line-height:var(--line-height-none);white-space:nowrap;font-family:var(--font-family-sans);border:var(--border-width-thin) solid var(--ea-tag-color, var(--color-border-default));border-radius:var(--radius-lg);background-color:var(--ea-tag-color, var(--color-bg-subtle));color:var(--ea-tag-ink, var(--color-text-secondary));forced-color-adjust:none}.ea-tag--2xs{font-size:var(--font-size-2xs)}.ea-tag--xs{font-size:var(--font-size-xs)}.ea-tag--sm{font-size:var(--font-size-sm)}.ea-tag--md{font-size:var(--font-size-md)}.ea-tag--lg{font-size:var(--font-size-lg)}.ea-tag--xl{font-size:var(--font-size-xl)}.ea-tag--success{border-color:var(--ea-tag-color, var(--color-success-muted));background-color:var(--ea-tag-color, var(--color-success-subtle));color:var(--ea-tag-ink, var(--color-success-text))}.ea-tag--warning{border-color:var(--ea-tag-color, var(--color-warning-muted));background-color:var(--ea-tag-color, var(--color-warning-subtle));color:var(--ea-tag-ink, var(--color-warning-text))}.ea-tag--error{border-color:var(--ea-tag-color, var(--color-error-muted));background-color:var(--ea-tag-color, var(--color-error-subtle));color:var(--ea-tag-ink, var(--color-error-text))}.ea-tag--info{border-color:var(--ea-tag-color, var(--color-info-muted));background-color:var(--ea-tag-color, var(--color-info-subtle));color:var(--ea-tag-ink, var(--color-info-text))}.ea-tag--disabled{opacity:.6;cursor:default}.ea-tag--uppercase{text-transform:uppercase}.ea-tag__label{overflow:hidden;min-width:0;padding-block:.25em;margin-block:-.25em;text-overflow:ellipsis;white-space:nowrap}.ea-tag__remove{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ea-icon-button-size, 1.75em);height:var(--ea-icon-button-size, 1.75em);padding:0;border:none;border-radius:var(--radius-sm);background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-tag__remove>*{font-size:1.25em}.ea-tag__remove:after{content:\"\";position:absolute;top:50%;left:50%;width:max(100%,var(--ea-icon-button-target, 24px));height:max(100%,var(--ea-icon-button-target, 24px));transform:translate(-50%,-50%)}.ea-tag__remove:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-tag__remove:focus-visible{outline:none;outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:2px}@media(forced-colors:active){.ea-tag__remove:focus-visible{outline:2px solid Highlight;outline-offset:2px}}.ea-tag__remove:disabled{cursor:default;opacity:.5}.ea-tag__remove,.ea-tag__remove:hover{color:inherit}.ea-tag__remove ea-icon-x{pointer-events:none}\n"],
23264
+ template: "<span\n class=\"ea-tag\"\n [ngClass]=\"hostClasses()\"\n [style.--ea-tag-max-width]=\"resolvedMaxWidth()\"\n [style.--ea-tag-color]=\"resolvedColor()\"\n [style.--ea-tag-ink]=\"resolvedInk()\"\n [eaTooltip]=\"labelTooltip()\"\n [tooltipPosition]=\"tooltipPosition()\">\n @if (icon(); as iconComponent) {\n <span\n class=\"ea-tag__icon\"\n aria-hidden=\"true\">\n <ng-container *ngComponentOutlet=\"iconComponent\" />\n </span>\n }\n <span\n #labelEl\n class=\"ea-tag__label\">\n <ng-content />\n </span>\n @if (removable()) {\n <button\n type=\"button\"\n class=\"ea-tag__remove\"\n [disabled]=\"disabled() || null\"\n [attr.tabindex]=\"removeTabbable() ? null : -1\"\n [attr.aria-label]=\"resolvedRemoveLabel()\"\n (click)=\"onRemove($event)\">\n <ea-icon-x />\n </button>\n }\n</span>\n",
23265
+ styles: ["ea-tag{display:inline-flex;vertical-align:middle;min-width:0;line-height:1}.ea-tag{display:inline-flex;align-items:center;gap:.25em;max-width:var(--ea-tag-max-width, none);padding:var(--ea-tag-padding-block, .25em) .5em;font-weight:var(--font-weight-medium);line-height:var(--line-height-none);white-space:nowrap;font-family:var(--font-family-sans);border:var(--border-width-thin) solid var(--ea-tag-color, var(--color-border-default));border-radius:var(--radius-lg);background-color:var(--ea-tag-color, var(--color-bg-subtle));color:var(--ea-tag-ink, var(--color-text-secondary));forced-color-adjust:none}.ea-tag--2xs{font-size:var(--font-size-2xs)}.ea-tag--xs{font-size:var(--font-size-xs)}.ea-tag--sm{font-size:var(--font-size-sm)}.ea-tag--md{font-size:var(--font-size-md)}.ea-tag--lg{font-size:var(--font-size-lg)}.ea-tag--xl{font-size:var(--font-size-xl)}.ea-tag--success{border-color:var(--ea-tag-color, var(--color-success-muted));background-color:var(--ea-tag-color, var(--color-success-subtle));color:var(--ea-tag-ink, var(--color-success-text))}.ea-tag--warning{border-color:var(--ea-tag-color, var(--color-warning-muted));background-color:var(--ea-tag-color, var(--color-warning-subtle));color:var(--ea-tag-ink, var(--color-warning-text))}.ea-tag--error{border-color:var(--ea-tag-color, var(--color-error-muted));background-color:var(--ea-tag-color, var(--color-error-subtle));color:var(--ea-tag-ink, var(--color-error-text))}.ea-tag--info{border-color:var(--ea-tag-color, var(--color-info-muted));background-color:var(--ea-tag-color, var(--color-info-subtle));color:var(--ea-tag-ink, var(--color-info-text))}.ea-tag--disabled{opacity:.6;cursor:default}.ea-tag--uppercase{text-transform:uppercase}.ea-tag__icon{display:inline-flex;flex-shrink:0}.ea-tag__label{overflow:hidden;min-width:0;padding-block:.25em;margin-block:-.25em;text-overflow:ellipsis;white-space:nowrap}.ea-tag__remove{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ea-icon-button-size, 1.75em);height:var(--ea-icon-button-size, 1.75em);padding:0;border:none;border-radius:var(--radius-sm);background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-tag__remove>*{font-size:1.25em}.ea-tag__remove:after{content:\"\";position:absolute;top:50%;left:50%;width:max(100%,var(--ea-icon-button-target, 24px));height:max(100%,var(--ea-icon-button-target, 24px));transform:translate(-50%,-50%)}.ea-tag__remove:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-tag__remove:focus-visible{outline:none;outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:2px}@media(forced-colors:active){.ea-tag__remove:focus-visible{outline:2px solid Highlight;outline-offset:2px}}.ea-tag__remove:disabled{cursor:default;opacity:.5}.ea-tag__remove,.ea-tag__remove:hover{color:inherit}.ea-tag__remove ea-icon-x{pointer-events:none}\n"],
23258
23266
  dependencies: [
23259
23267
  {
23260
23268
  kind: "directive",
@@ -23262,6 +23270,20 @@ var TagComponent = class TagComponent {
23262
23270
  selector: "[ngClass]",
23263
23271
  inputs: ["class", "ngClass"]
23264
23272
  },
23273
+ {
23274
+ kind: "directive",
23275
+ type: NgComponentOutlet,
23276
+ selector: "[ngComponentOutlet]",
23277
+ inputs: [
23278
+ "ngComponentOutlet",
23279
+ "ngComponentOutletInputs",
23280
+ "ngComponentOutletInjector",
23281
+ "ngComponentOutletEnvironmentInjector",
23282
+ "ngComponentOutletContent",
23283
+ "ngComponentOutletNgModule"
23284
+ ],
23285
+ exportAs: ["ngComponentOutlet"]
23286
+ },
23265
23287
  {
23266
23288
  kind: "directive",
23267
23289
  type: TooltipDirective,
@@ -23298,13 +23320,14 @@ i0.ɵɵngDeclareClassMetadata({
23298
23320
  selector: "ea-tag",
23299
23321
  imports: [
23300
23322
  NgClass,
23323
+ NgComponentOutlet,
23301
23324
  TooltipDirective,
23302
23325
  XIconComponent
23303
23326
  ],
23304
23327
  changeDetection: ChangeDetectionStrategy.OnPush,
23305
23328
  encapsulation: ViewEncapsulation.None,
23306
- template: "<span\n class=\"ea-tag\"\n [ngClass]=\"hostClasses()\"\n [style.--ea-tag-max-width]=\"resolvedMaxWidth()\"\n [style.--ea-tag-color]=\"resolvedColor()\"\n [style.--ea-tag-ink]=\"resolvedInk()\"\n [eaTooltip]=\"labelTooltip()\"\n [tooltipPosition]=\"tooltipPosition()\">\n <span\n #labelEl\n class=\"ea-tag__label\">\n <ng-content />\n </span>\n @if (removable()) {\n <button\n type=\"button\"\n class=\"ea-tag__remove\"\n [disabled]=\"disabled() || null\"\n [attr.tabindex]=\"removeTabbable() ? null : -1\"\n [attr.aria-label]=\"resolvedRemoveLabel()\"\n (click)=\"onRemove($event)\">\n <ea-icon-x />\n </button>\n }\n</span>\n",
23307
- styles: ["ea-tag{display:inline-flex;vertical-align:middle;min-width:0;line-height:1}.ea-tag{display:inline-flex;align-items:center;gap:.25em;max-width:var(--ea-tag-max-width, none);padding:var(--ea-tag-padding-block, .25em) .5em;font-weight:var(--font-weight-medium);line-height:var(--line-height-none);white-space:nowrap;font-family:var(--font-family-sans);border:var(--border-width-thin) solid var(--ea-tag-color, var(--color-border-default));border-radius:var(--radius-lg);background-color:var(--ea-tag-color, var(--color-bg-subtle));color:var(--ea-tag-ink, var(--color-text-secondary));forced-color-adjust:none}.ea-tag--2xs{font-size:var(--font-size-2xs)}.ea-tag--xs{font-size:var(--font-size-xs)}.ea-tag--sm{font-size:var(--font-size-sm)}.ea-tag--md{font-size:var(--font-size-md)}.ea-tag--lg{font-size:var(--font-size-lg)}.ea-tag--xl{font-size:var(--font-size-xl)}.ea-tag--success{border-color:var(--ea-tag-color, var(--color-success-muted));background-color:var(--ea-tag-color, var(--color-success-subtle));color:var(--ea-tag-ink, var(--color-success-text))}.ea-tag--warning{border-color:var(--ea-tag-color, var(--color-warning-muted));background-color:var(--ea-tag-color, var(--color-warning-subtle));color:var(--ea-tag-ink, var(--color-warning-text))}.ea-tag--error{border-color:var(--ea-tag-color, var(--color-error-muted));background-color:var(--ea-tag-color, var(--color-error-subtle));color:var(--ea-tag-ink, var(--color-error-text))}.ea-tag--info{border-color:var(--ea-tag-color, var(--color-info-muted));background-color:var(--ea-tag-color, var(--color-info-subtle));color:var(--ea-tag-ink, var(--color-info-text))}.ea-tag--disabled{opacity:.6;cursor:default}.ea-tag--uppercase{text-transform:uppercase}.ea-tag__label{overflow:hidden;min-width:0;padding-block:.25em;margin-block:-.25em;text-overflow:ellipsis;white-space:nowrap}.ea-tag__remove{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ea-icon-button-size, 1.75em);height:var(--ea-icon-button-size, 1.75em);padding:0;border:none;border-radius:var(--radius-sm);background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-tag__remove>*{font-size:1.25em}.ea-tag__remove:after{content:\"\";position:absolute;top:50%;left:50%;width:max(100%,var(--ea-icon-button-target, 24px));height:max(100%,var(--ea-icon-button-target, 24px));transform:translate(-50%,-50%)}.ea-tag__remove:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-tag__remove:focus-visible{outline:none;outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:2px}@media(forced-colors:active){.ea-tag__remove:focus-visible{outline:2px solid Highlight;outline-offset:2px}}.ea-tag__remove:disabled{cursor:default;opacity:.5}.ea-tag__remove,.ea-tag__remove:hover{color:inherit}.ea-tag__remove ea-icon-x{pointer-events:none}\n"]
23329
+ template: "<span\n class=\"ea-tag\"\n [ngClass]=\"hostClasses()\"\n [style.--ea-tag-max-width]=\"resolvedMaxWidth()\"\n [style.--ea-tag-color]=\"resolvedColor()\"\n [style.--ea-tag-ink]=\"resolvedInk()\"\n [eaTooltip]=\"labelTooltip()\"\n [tooltipPosition]=\"tooltipPosition()\">\n @if (icon(); as iconComponent) {\n <span\n class=\"ea-tag__icon\"\n aria-hidden=\"true\">\n <ng-container *ngComponentOutlet=\"iconComponent\" />\n </span>\n }\n <span\n #labelEl\n class=\"ea-tag__label\">\n <ng-content />\n </span>\n @if (removable()) {\n <button\n type=\"button\"\n class=\"ea-tag__remove\"\n [disabled]=\"disabled() || null\"\n [attr.tabindex]=\"removeTabbable() ? null : -1\"\n [attr.aria-label]=\"resolvedRemoveLabel()\"\n (click)=\"onRemove($event)\">\n <ea-icon-x />\n </button>\n }\n</span>\n",
23330
+ styles: ["ea-tag{display:inline-flex;vertical-align:middle;min-width:0;line-height:1}.ea-tag{display:inline-flex;align-items:center;gap:.25em;max-width:var(--ea-tag-max-width, none);padding:var(--ea-tag-padding-block, .25em) .5em;font-weight:var(--font-weight-medium);line-height:var(--line-height-none);white-space:nowrap;font-family:var(--font-family-sans);border:var(--border-width-thin) solid var(--ea-tag-color, var(--color-border-default));border-radius:var(--radius-lg);background-color:var(--ea-tag-color, var(--color-bg-subtle));color:var(--ea-tag-ink, var(--color-text-secondary));forced-color-adjust:none}.ea-tag--2xs{font-size:var(--font-size-2xs)}.ea-tag--xs{font-size:var(--font-size-xs)}.ea-tag--sm{font-size:var(--font-size-sm)}.ea-tag--md{font-size:var(--font-size-md)}.ea-tag--lg{font-size:var(--font-size-lg)}.ea-tag--xl{font-size:var(--font-size-xl)}.ea-tag--success{border-color:var(--ea-tag-color, var(--color-success-muted));background-color:var(--ea-tag-color, var(--color-success-subtle));color:var(--ea-tag-ink, var(--color-success-text))}.ea-tag--warning{border-color:var(--ea-tag-color, var(--color-warning-muted));background-color:var(--ea-tag-color, var(--color-warning-subtle));color:var(--ea-tag-ink, var(--color-warning-text))}.ea-tag--error{border-color:var(--ea-tag-color, var(--color-error-muted));background-color:var(--ea-tag-color, var(--color-error-subtle));color:var(--ea-tag-ink, var(--color-error-text))}.ea-tag--info{border-color:var(--ea-tag-color, var(--color-info-muted));background-color:var(--ea-tag-color, var(--color-info-subtle));color:var(--ea-tag-ink, var(--color-info-text))}.ea-tag--disabled{opacity:.6;cursor:default}.ea-tag--uppercase{text-transform:uppercase}.ea-tag__icon{display:inline-flex;flex-shrink:0}.ea-tag__label{overflow:hidden;min-width:0;padding-block:.25em;margin-block:-.25em;text-overflow:ellipsis;white-space:nowrap}.ea-tag__remove{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ea-icon-button-size, 1.75em);height:var(--ea-icon-button-size, 1.75em);padding:0;border:none;border-radius:var(--radius-sm);background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-tag__remove>*{font-size:1.25em}.ea-tag__remove:after{content:\"\";position:absolute;top:50%;left:50%;width:max(100%,var(--ea-icon-button-target, 24px));height:max(100%,var(--ea-icon-button-target, 24px));transform:translate(-50%,-50%)}.ea-tag__remove:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-tag__remove:focus-visible{outline:none;outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:2px}@media(forced-colors:active){.ea-tag__remove:focus-visible{outline:2px solid Highlight;outline-offset:2px}}.ea-tag__remove:disabled{cursor:default;opacity:.5}.ea-tag__remove,.ea-tag__remove:hover{color:inherit}.ea-tag__remove ea-icon-x{pointer-events:none}\n"]
23308
23331
  }]
23309
23332
  }],
23310
23333
  ctorParameters: () => [],
@@ -23329,6 +23352,14 @@ i0.ɵɵngDeclareClassMetadata({
23329
23352
  required: false
23330
23353
  }]
23331
23354
  }],
23355
+ icon: [{
23356
+ type: i0.Input,
23357
+ args: [{
23358
+ isSignal: true,
23359
+ alias: "icon",
23360
+ required: false
23361
+ }]
23362
+ }],
23332
23363
  removable: [{
23333
23364
  type: i0.Input,
23334
23365
  args: [{
@@ -24076,6 +24107,7 @@ var MultiSelectComponent = class MultiSelectComponent {
24076
24107
  inputs: [
24077
24108
  "variant",
24078
24109
  "size",
24110
+ "icon",
24079
24111
  "removable",
24080
24112
  "disabled",
24081
24113
  "removeLabel",
@@ -26340,7 +26372,7 @@ var RadioComponent = class RadioComponent {
26340
26372
  },
26341
26373
  ngImport: i0,
26342
26374
  template: "<label\n class=\"ea-radio\"\n [ngClass]=\"hostClasses()\"\n [for]=\"id()\">\n <input\n type=\"radio\"\n class=\"ea-radio__input\"\n [id]=\"id()\"\n [name]=\"name()\"\n [value]=\"value()\"\n [checked]=\"isChecked()\"\n [disabled]=\"isDisabled()\"\n (change)=\"handleChange()\" />\n\n <span\n class=\"ea-radio__circle\"\n aria-hidden=\"true\">\n </span>\n\n @if (label()) {\n <span class=\"ea-radio__label\">{{ label() }}</span>\n }\n</label>\n",
26343
- styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}.ea-radio{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans);color:var(--color-text-primary)}.ea-radio--2xs{font-size:var(--font-size-2xs)}.ea-radio--xs{font-size:var(--font-size-xs)}.ea-radio--sm{font-size:var(--font-size-sm)}.ea-radio--md{font-size:var(--font-size-md)}.ea-radio--lg{font-size:var(--font-size-lg)}.ea-radio--xl{font-size:var(--font-size-xl)}.ea-radio--disabled{opacity:.45;cursor:default}.ea-radio--checked .ea-radio__circle{border-color:var(--color-brand-default)}.ea-radio--checked .ea-radio__circle:after{transform:scale(1)}@media(forced-colors:active){.ea-radio--checked .ea-radio__circle{border-color:Highlight}.ea-radio--checked .ea-radio__circle:after{background-color:Highlight}}.ea-radio:hover:not(.ea-radio--disabled,.ea-radio--checked) .ea-radio__circle{border-color:var(--color-border-emphasis)}.ea-radio__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ea-radio__input:focus-visible+.ea-radio__circle{outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:2px}@media(forced-colors:active){.ea-radio__input:focus-visible+.ea-radio__circle{outline:2px solid Highlight;outline-offset:2px}}.ea-radio__circle{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1.25em;height:1.25em;border-radius:var(--radius-full);background-color:var(--color-bg-base);border:var(--border-width-medium) solid var(--color-border-strong);transition:var(--transition-colors),var(--transition-shadow)}.ea-radio__circle:after{content:\"\";display:block;width:45%;height:45%;border-radius:var(--radius-full);background-color:var(--color-brand-default);transform:scale(0);transition:var(--transition-transform)}.ea-radio__label{line-height:1.25em;font-weight:var(--font-weight-regular)}\n"],
26375
+ styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}.ea-radio{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans);color:var(--color-text-primary)}.ea-radio:has(.ea-radio__label){align-items:flex-start}.ea-radio:has(.ea-radio__label) .ea-radio__circle{margin-top:calc((var(--line-height-normal) * 1em - 1.25em) / 2)}.ea-radio--2xs{font-size:var(--font-size-2xs)}.ea-radio--xs{font-size:var(--font-size-xs)}.ea-radio--sm{font-size:var(--font-size-sm)}.ea-radio--md{font-size:var(--font-size-md)}.ea-radio--lg{font-size:var(--font-size-lg)}.ea-radio--xl{font-size:var(--font-size-xl)}.ea-radio--disabled{opacity:.45;cursor:default}.ea-radio--checked .ea-radio__circle{border-color:var(--color-brand-default)}.ea-radio--checked .ea-radio__circle:after{transform:scale(1)}@media(forced-colors:active){.ea-radio--checked .ea-radio__circle{border-color:Highlight}.ea-radio--checked .ea-radio__circle:after{background-color:Highlight}}.ea-radio:hover:not(.ea-radio--disabled,.ea-radio--checked) .ea-radio__circle{border-color:var(--color-border-emphasis)}.ea-radio__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ea-radio__input:focus-visible+.ea-radio__circle{outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:2px}@media(forced-colors:active){.ea-radio__input:focus-visible+.ea-radio__circle{outline:2px solid Highlight;outline-offset:2px}}.ea-radio__circle{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1.25em;height:1.25em;border-radius:var(--radius-full);background-color:var(--color-bg-base);border:var(--border-width-medium) solid var(--color-border-strong);transition:var(--transition-colors),var(--transition-shadow)}.ea-radio__circle:after{content:\"\";display:block;width:45%;height:45%;border-radius:var(--radius-full);background-color:var(--color-brand-default);transform:scale(0);transition:var(--transition-transform)}.ea-radio__label{font-weight:var(--font-weight-regular);line-height:var(--line-height-normal)}\n"],
26344
26376
  dependencies: [{
26345
26377
  kind: "directive",
26346
26378
  type: NgClass,
@@ -26362,7 +26394,7 @@ i0.ɵɵngDeclareClassMetadata({
26362
26394
  changeDetection: ChangeDetectionStrategy.OnPush,
26363
26395
  imports: [NgClass],
26364
26396
  template: "<label\n class=\"ea-radio\"\n [ngClass]=\"hostClasses()\"\n [for]=\"id()\">\n <input\n type=\"radio\"\n class=\"ea-radio__input\"\n [id]=\"id()\"\n [name]=\"name()\"\n [value]=\"value()\"\n [checked]=\"isChecked()\"\n [disabled]=\"isDisabled()\"\n (change)=\"handleChange()\" />\n\n <span\n class=\"ea-radio__circle\"\n aria-hidden=\"true\">\n </span>\n\n @if (label()) {\n <span class=\"ea-radio__label\">{{ label() }}</span>\n }\n</label>\n",
26365
- styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}.ea-radio{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans);color:var(--color-text-primary)}.ea-radio--2xs{font-size:var(--font-size-2xs)}.ea-radio--xs{font-size:var(--font-size-xs)}.ea-radio--sm{font-size:var(--font-size-sm)}.ea-radio--md{font-size:var(--font-size-md)}.ea-radio--lg{font-size:var(--font-size-lg)}.ea-radio--xl{font-size:var(--font-size-xl)}.ea-radio--disabled{opacity:.45;cursor:default}.ea-radio--checked .ea-radio__circle{border-color:var(--color-brand-default)}.ea-radio--checked .ea-radio__circle:after{transform:scale(1)}@media(forced-colors:active){.ea-radio--checked .ea-radio__circle{border-color:Highlight}.ea-radio--checked .ea-radio__circle:after{background-color:Highlight}}.ea-radio:hover:not(.ea-radio--disabled,.ea-radio--checked) .ea-radio__circle{border-color:var(--color-border-emphasis)}.ea-radio__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ea-radio__input:focus-visible+.ea-radio__circle{outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:2px}@media(forced-colors:active){.ea-radio__input:focus-visible+.ea-radio__circle{outline:2px solid Highlight;outline-offset:2px}}.ea-radio__circle{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1.25em;height:1.25em;border-radius:var(--radius-full);background-color:var(--color-bg-base);border:var(--border-width-medium) solid var(--color-border-strong);transition:var(--transition-colors),var(--transition-shadow)}.ea-radio__circle:after{content:\"\";display:block;width:45%;height:45%;border-radius:var(--radius-full);background-color:var(--color-brand-default);transform:scale(0);transition:var(--transition-transform)}.ea-radio__label{line-height:1.25em;font-weight:var(--font-weight-regular)}\n"]
26397
+ styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}.ea-radio{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans);color:var(--color-text-primary)}.ea-radio:has(.ea-radio__label){align-items:flex-start}.ea-radio:has(.ea-radio__label) .ea-radio__circle{margin-top:calc((var(--line-height-normal) * 1em - 1.25em) / 2)}.ea-radio--2xs{font-size:var(--font-size-2xs)}.ea-radio--xs{font-size:var(--font-size-xs)}.ea-radio--sm{font-size:var(--font-size-sm)}.ea-radio--md{font-size:var(--font-size-md)}.ea-radio--lg{font-size:var(--font-size-lg)}.ea-radio--xl{font-size:var(--font-size-xl)}.ea-radio--disabled{opacity:.45;cursor:default}.ea-radio--checked .ea-radio__circle{border-color:var(--color-brand-default)}.ea-radio--checked .ea-radio__circle:after{transform:scale(1)}@media(forced-colors:active){.ea-radio--checked .ea-radio__circle{border-color:Highlight}.ea-radio--checked .ea-radio__circle:after{background-color:Highlight}}.ea-radio:hover:not(.ea-radio--disabled,.ea-radio--checked) .ea-radio__circle{border-color:var(--color-border-emphasis)}.ea-radio__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ea-radio__input:focus-visible+.ea-radio__circle{outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:2px}@media(forced-colors:active){.ea-radio__input:focus-visible+.ea-radio__circle{outline:2px solid Highlight;outline-offset:2px}}.ea-radio__circle{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1.25em;height:1.25em;border-radius:var(--radius-full);background-color:var(--color-bg-base);border:var(--border-width-medium) solid var(--color-border-strong);transition:var(--transition-colors),var(--transition-shadow)}.ea-radio__circle:after{content:\"\";display:block;width:45%;height:45%;border-radius:var(--radius-full);background-color:var(--color-brand-default);transform:scale(0);transition:var(--transition-transform)}.ea-radio__label{font-weight:var(--font-weight-regular);line-height:var(--line-height-normal)}\n"]
26366
26398
  }]
26367
26399
  }],
26368
26400
  propDecorators: {