@eagami/ui 2.11.0 → 3.0.0

package/fesm2022/eagami-ui.mjs

@@ -3,13 +3,22 @@ import { InjectionToken, makeEnvironmentProviders, provideEnvironmentInitializer
 import { NgClass, NgComponentOutlet, NgTemplateOutlet } from '@angular/common';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
 
-/** Ordered list of every supported locale, handy for language switchers. */
+/**
+ * Supported locales for language switchers: English pinned first (default
+ * fallback), then alphabetical by each language's own name (Latin scripts
+ * first, then Greek and Chinese).
+ */
 const EAGAMI_LOCALES = [
     'en',
+    'de',
+    'es-ES',
     'fr-FR',
-    'el',
+    'is',
+    'nl',
     'pl',
-    'es-ES',
+    'pt-BR',
+    'el',
+    'zh-CN',
 ];
 
 const STYLE_TAG_ID = 'eagami-palette';
@@ -373,6 +382,162 @@ function provideEagamiUi(config = {}) {
  */
 const _eagamiI18nLocaleOverride = signal(null, ...(ngDevMode ? [{ debugName: "_eagamiI18nLocaleOverride" }] : /* istanbul ignore next */ []));
 
+/** German messages. */
+const de = {
+    alert: {
+        dismiss: 'Schließen',
+    },
+    autocomplete: {
+        empty: 'Keine Ergebnisse',
+    },
+    avatarEditor: {
+        upload: 'Bild hochladen',
+        dropzone: 'Bild ablegen oder zum Hochladen klicken',
+        canvas: 'Bildvorschau, ziehen oder Pfeiltasten zum Verschieben verwenden, Schieberegler zum Zoomen',
+        change: 'Foto ändern',
+        revert: 'Auf Original zurücksetzen',
+        zoomOut: 'Verkleinern',
+        zoom: 'Zoom',
+        zoomIn: 'Vergrößern',
+        remove: 'Bild entfernen',
+    },
+    breadcrumbs: {
+        label: 'Brotkrümelnavigation',
+    },
+    codeInput: {
+        groupLabel: length => `Bestätigungscode, ${length} Ziffern`,
+        digitLabel: (index, length) => `Ziffer ${index} von ${length}`,
+    },
+    commandPalette: {
+        dialogLabel: 'Befehlspalette',
+        searchPlaceholder: 'Befehl eingeben oder suchen…',
+        empty: 'Keine Ergebnisse gefunden',
+        clear: 'Suche löschen',
+    },
+    colorPicker: {
+        placeholder: 'Farbe wählen…',
+        clear: 'Farbe löschen',
+        hue: 'Farbton',
+        saturationAndValue: 'Sättigung und Helligkeit',
+        alpha: 'Transparenz',
+        eyedropper: 'Vom Bildschirm auswählen',
+        presets: 'Voreinstellungen',
+        toggleFormat: 'Eingabeformat wechseln',
+    },
+    dataTable: {
+        noData: 'Keine Daten verfügbar',
+    },
+    datePicker: {
+        placeholder: 'Datum auswählen…',
+        clear: 'Datum löschen',
+        previousYear: 'Vorheriges Jahr',
+        previousMonth: 'Vorheriger Monat',
+        nextMonth: 'Nächster Monat',
+        nextYear: 'Nächstes Jahr',
+        today: 'Heute',
+    },
+    dialog: {
+        close: 'Dialog schließen',
+    },
+    drawer: {
+        close: 'Panel schließen',
+    },
+    dropdown: {
+        placeholder: 'Auswählen…',
+    },
+    fileUploader: {
+        prompt: 'Dateien hierher klicken oder ziehen zum Hochladen',
+        promptSingle: 'Datei hierher klicken oder ziehen zum Hochladen',
+        browse: 'Dateien durchsuchen',
+        removeFile: name => `${name} entfernen`,
+        fileListLabel: 'Ausgewählte Dateien',
+        constraintsAccept: accept => `Akzeptiert: ${accept}`,
+        constraintsMaxSize: size => `Max. ${size} pro Datei`,
+        constraintsMaxFiles: count => `Bis zu ${count} Dateien`,
+        rejectionType: name => `${name} hat einen nicht unterstützten Dateityp`,
+        rejectionSize: (name, max) => `${name} überschreitet das Limit von ${max}`,
+        rejectionCount: max => `Es können nur ${max} Dateien ausgewählt werden`,
+        bytesUnit: { b: 'B', kb: 'KB', mb: 'MB', gb: 'GB', tb: 'TB' },
+    },
+    input: {
+        showPassword: 'Passwort anzeigen',
+        hidePassword: 'Passwort verbergen',
+        clear: 'Löschen',
+    },
+    menu: {
+        label: 'Menü',
+    },
+    multiSelect: {
+        placeholder: 'Auswählen…',
+        searchPlaceholder: 'Suchen…',
+        searchEmpty: 'Keine Treffer',
+        selectAll: 'Alle auswählen',
+        clearAll: 'Auswahl aufheben',
+        removeOption: label => `${label} entfernen`,
+        selectedCount: count => `${count} ausgewählt`,
+    },
+    paginator: {
+        label: 'Seitennummerierung',
+        rowsPerPage: 'Zeilen pro Seite:',
+        range: (start, end, total) => `${start}–${end} von ${total}`,
+        previousPage: 'Vorherige Seite',
+        nextPage: 'Nächste Seite',
+    },
+    progressBar: {
+        label: 'Fortschritt',
+    },
+    rating: {
+        label: 'Bewertung',
+        valueLabel: (value, max) => `${value} von ${max}`,
+        clear: 'Bewertung löschen',
+    },
+    spinner: {
+        label: 'Wird geladen',
+    },
+    stepper: {
+        optional: 'optional',
+    },
+    tag: {
+        remove: 'Entfernen',
+    },
+    timePicker: {
+        placeholder: 'Uhrzeit auswählen…',
+        clear: 'Uhrzeit löschen',
+        hoursLabel: 'Stunden',
+        minutesLabel: 'Minuten',
+        secondsLabel: 'Sekunden',
+        incrementHours: 'Stunden erhöhen',
+        decrementHours: 'Stunden verringern',
+        incrementMinutes: 'Minuten erhöhen',
+        decrementMinutes: 'Minuten verringern',
+        incrementSeconds: 'Sekunden erhöhen',
+        decrementSeconds: 'Sekunden verringern',
+        amLabel: 'AM',
+        pmLabel: 'PM',
+    },
+    toast: {
+        dismiss: 'Schließen',
+    },
+    transferList: {
+        sourceLabel: 'Verfügbar',
+        targetLabel: 'Ausgewählt',
+        controlsLabel: 'Übertragungssteuerung',
+        moveSelectedToTarget: 'Ausgewählte nach rechts verschieben',
+        moveAllToTarget: 'Alle nach rechts verschieben',
+        moveSelectedToSource: 'Ausgewählte nach links verschieben',
+        moveAllToSource: 'Alle nach links verschieben',
+        empty: 'Keine Einträge',
+    },
+    tree: {
+        expand: 'Aufklappen',
+        collapse: 'Zuklappen',
+    },
+    wordmark: {
+        overline: 'handgefertigt von',
+        tagline: 'elegantes Webdesign',
+    },
+};
+
 /** Greek messages. */
 const el = {
     alert: {
@@ -997,6 +1162,318 @@ const frFR = {
     },
 };
 
+/** Icelandic messages. */
+const is = {
+    alert: {
+        dismiss: 'Loka',
+    },
+    autocomplete: {
+        empty: 'Engar niðurstöður',
+    },
+    avatarEditor: {
+        upload: 'Hlaða upp mynd',
+        dropzone: 'Slepptu mynd eða smelltu til að hlaða upp',
+        canvas: 'Forskoðun myndar, dragðu eða notaðu örvatakka til að hreyfa, sleða til að aðdrátta',
+        change: 'Skipta um mynd',
+        revert: 'Endurheimta upprunalega',
+        zoomOut: 'Minnka aðdrátt',
+        zoom: 'Aðdráttur',
+        zoomIn: 'Auka aðdrátt',
+        remove: 'Fjarlægja mynd',
+    },
+    breadcrumbs: {
+        label: 'Brauðmolaslóð',
+    },
+    codeInput: {
+        groupLabel: length => `Staðfestingarkóði, ${length} tölustafir`,
+        digitLabel: (index, length) => `Tölustafur ${index} af ${length}`,
+    },
+    commandPalette: {
+        dialogLabel: 'Skipanaspjald',
+        searchPlaceholder: 'Sláðu inn skipun eða leitaðu…',
+        empty: 'Engar niðurstöður fundust',
+        clear: 'Hreinsa leit',
+    },
+    colorPicker: {
+        placeholder: 'Veldu lit…',
+        clear: 'Hreinsa lit',
+        hue: 'Litblær',
+        saturationAndValue: 'Mettun og birta',
+        alpha: 'Gegnsæi',
+        eyedropper: 'Velja af skjánum',
+        presets: 'Forstillingar',
+        toggleFormat: 'Skipta um innsláttarsnið',
+    },
+    dataTable: {
+        noData: 'Engin gögn til staðar',
+    },
+    datePicker: {
+        placeholder: 'Veldu dagsetningu…',
+        clear: 'Hreinsa dagsetningu',
+        previousYear: 'Fyrra ár',
+        previousMonth: 'Fyrri mánuður',
+        nextMonth: 'Næsti mánuður',
+        nextYear: 'Næsta ár',
+        today: 'Í dag',
+    },
+    dialog: {
+        close: 'Loka glugga',
+    },
+    drawer: {
+        close: 'Loka spjaldi',
+    },
+    dropdown: {
+        placeholder: 'Veldu…',
+    },
+    fileUploader: {
+        prompt: 'Smelltu eða dragðu skrár hingað til að hlaða upp',
+        promptSingle: 'Smelltu eða dragðu skrá hingað til að hlaða upp',
+        browse: 'Velja skrár',
+        removeFile: name => `Fjarlægja ${name}`,
+        fileListLabel: 'Valdar skrár',
+        constraintsAccept: accept => `Samþykkt: ${accept}`,
+        constraintsMaxSize: size => `Hámark ${size} á hverja skrá`,
+        constraintsMaxFiles: count => `Allt að ${count} skrár`,
+        rejectionType: name => `${name} er með óstudda skráargerð`,
+        rejectionSize: (name, max) => `${name} fer yfir mörkin ${max}`,
+        rejectionCount: max => `Aðeins er hægt að velja ${max} skrár`,
+        bytesUnit: { b: 'B', kb: 'KB', mb: 'MB', gb: 'GB', tb: 'TB' },
+    },
+    input: {
+        showPassword: 'Sýna lykilorð',
+        hidePassword: 'Fela lykilorð',
+        clear: 'Hreinsa',
+    },
+    menu: {
+        label: 'Valmynd',
+    },
+    multiSelect: {
+        placeholder: 'Veldu…',
+        searchPlaceholder: 'Leita…',
+        searchEmpty: 'Engin samsvörun',
+        selectAll: 'Velja allt',
+        clearAll: 'Hreinsa val',
+        removeOption: label => `Fjarlægja ${label}`,
+        selectedCount: count => `${count} valdar`,
+    },
+    paginator: {
+        label: 'Síðuskipting',
+        rowsPerPage: 'Raðir á síðu:',
+        range: (start, end, total) => `${start}–${end} af ${total}`,
+        previousPage: 'Fyrri síða',
+        nextPage: 'Næsta síða',
+    },
+    progressBar: {
+        label: 'Framvinda',
+    },
+    rating: {
+        label: 'Einkunn',
+        valueLabel: (value, max) => `${value} af ${max}`,
+        clear: 'Hreinsa einkunn',
+    },
+    spinner: {
+        label: 'Hleð',
+    },
+    stepper: {
+        optional: 'valfrjálst',
+    },
+    tag: {
+        remove: 'Fjarlægja',
+    },
+    timePicker: {
+        placeholder: 'Veldu tíma…',
+        clear: 'Hreinsa tíma',
+        hoursLabel: 'Klukkustundir',
+        minutesLabel: 'Mínútur',
+        secondsLabel: 'Sekúndur',
+        incrementHours: 'Hækka klukkustundir',
+        decrementHours: 'Lækka klukkustundir',
+        incrementMinutes: 'Hækka mínútur',
+        decrementMinutes: 'Lækka mínútur',
+        incrementSeconds: 'Hækka sekúndur',
+        decrementSeconds: 'Lækka sekúndur',
+        amLabel: 'f.h.',
+        pmLabel: 'e.h.',
+    },
+    toast: {
+        dismiss: 'Loka',
+    },
+    transferList: {
+        sourceLabel: 'Í boði',
+        targetLabel: 'Valið',
+        controlsLabel: 'Flutningsstýringar',
+        moveSelectedToTarget: 'Færa valið yfir',
+        moveAllToTarget: 'Færa allt yfir',
+        moveSelectedToSource: 'Færa valið til baka',
+        moveAllToSource: 'Færa allt til baka',
+        empty: 'Engin atriði',
+    },
+    tree: {
+        expand: 'Fletta út',
+        collapse: 'Fella saman',
+    },
+    wordmark: {
+        overline: 'handunnið af',
+        tagline: 'glæsileg vefhönnun',
+    },
+};
+
+/** Dutch messages. */
+const nl = {
+    alert: {
+        dismiss: 'Sluiten',
+    },
+    autocomplete: {
+        empty: 'Geen resultaten',
+    },
+    avatarEditor: {
+        upload: 'Afbeelding uploaden',
+        dropzone: 'Sleep een afbeelding hierheen of klik om te uploaden',
+        canvas: 'Voorbeeld van afbeelding, sleep of gebruik de pijltjestoetsen om te verplaatsen, schuifregelaar om te zoomen',
+        change: 'Foto wijzigen',
+        revert: 'Terug naar origineel',
+        zoomOut: 'Uitzoomen',
+        zoom: 'Zoom',
+        zoomIn: 'Inzoomen',
+        remove: 'Afbeelding verwijderen',
+    },
+    breadcrumbs: {
+        label: 'Broodkruimelnavigatie',
+    },
+    codeInput: {
+        groupLabel: length => `Verificatiecode, ${length} cijfers`,
+        digitLabel: (index, length) => `Cijfer ${index} van ${length}`,
+    },
+    commandPalette: {
+        dialogLabel: 'Opdrachtenpalet',
+        searchPlaceholder: 'Typ een opdracht of zoek…',
+        empty: 'Geen resultaten gevonden',
+        clear: 'Zoekopdracht wissen',
+    },
+    colorPicker: {
+        placeholder: 'Kies een kleur…',
+        clear: 'Kleur wissen',
+        hue: 'Tint',
+        saturationAndValue: 'Verzadiging en helderheid',
+        alpha: 'Transparantie',
+        eyedropper: 'Kies van het scherm',
+        presets: 'Voorinstellingen',
+        toggleFormat: 'Invoerformaat wisselen',
+    },
+    dataTable: {
+        noData: 'Geen gegevens beschikbaar',
+    },
+    datePicker: {
+        placeholder: 'Selecteer datum…',
+        clear: 'Datum wissen',
+        previousYear: 'Vorig jaar',
+        previousMonth: 'Vorige maand',
+        nextMonth: 'Volgende maand',
+        nextYear: 'Volgend jaar',
+        today: 'Vandaag',
+    },
+    dialog: {
+        close: 'Dialoogvenster sluiten',
+    },
+    drawer: {
+        close: 'Paneel sluiten',
+    },
+    dropdown: {
+        placeholder: 'Selecteer…',
+    },
+    fileUploader: {
+        prompt: 'Klik of sleep bestanden hierheen om te uploaden',
+        promptSingle: 'Klik of sleep een bestand hierheen om te uploaden',
+        browse: 'Bestanden doorbladeren',
+        removeFile: name => `${name} verwijderen`,
+        fileListLabel: 'Geselecteerde bestanden',
+        constraintsAccept: accept => `Geaccepteerd: ${accept}`,
+        constraintsMaxSize: size => `Max. ${size} per bestand`,
+        constraintsMaxFiles: count => `Tot ${count} bestanden`,
+        rejectionType: name => `${name} heeft een niet-ondersteund bestandstype`,
+        rejectionSize: (name, max) => `${name} overschrijdt de limiet van ${max}`,
+        rejectionCount: max => `Er kunnen slechts ${max} bestanden worden geselecteerd`,
+        bytesUnit: { b: 'B', kb: 'KB', mb: 'MB', gb: 'GB', tb: 'TB' },
+    },
+    input: {
+        showPassword: 'Wachtwoord tonen',
+        hidePassword: 'Wachtwoord verbergen',
+        clear: 'Wissen',
+    },
+    menu: {
+        label: 'Menu',
+    },
+    multiSelect: {
+        placeholder: 'Selecteer…',
+        searchPlaceholder: 'Zoeken…',
+        searchEmpty: 'Geen overeenkomsten',
+        selectAll: 'Alles selecteren',
+        clearAll: 'Selectie wissen',
+        removeOption: label => `${label} verwijderen`,
+        selectedCount: count => `${count} geselecteerd`,
+    },
+    paginator: {
+        label: 'Paginering',
+        rowsPerPage: 'Rijen per pagina:',
+        range: (start, end, total) => `${start}–${end} van ${total}`,
+        previousPage: 'Vorige pagina',
+        nextPage: 'Volgende pagina',
+    },
+    progressBar: {
+        label: 'Voortgang',
+    },
+    rating: {
+        label: 'Beoordeling',
+        valueLabel: (value, max) => `${value} van ${max}`,
+        clear: 'Beoordeling wissen',
+    },
+    spinner: {
+        label: 'Laden',
+    },
+    stepper: {
+        optional: 'optioneel',
+    },
+    tag: {
+        remove: 'Verwijderen',
+    },
+    timePicker: {
+        placeholder: 'Selecteer tijd…',
+        clear: 'Tijd wissen',
+        hoursLabel: 'Uren',
+        minutesLabel: 'Minuten',
+        secondsLabel: 'Seconden',
+        incrementHours: 'Uren verhogen',
+        decrementHours: 'Uren verlagen',
+        incrementMinutes: 'Minuten verhogen',
+        decrementMinutes: 'Minuten verlagen',
+        incrementSeconds: 'Seconden verhogen',
+        decrementSeconds: 'Seconden verlagen',
+        amLabel: 'AM',
+        pmLabel: 'PM',
+    },
+    toast: {
+        dismiss: 'Sluiten',
+    },
+    transferList: {
+        sourceLabel: 'Beschikbaar',
+        targetLabel: 'Geselecteerd',
+        controlsLabel: 'Overdrachtsbediening',
+        moveSelectedToTarget: 'Selectie naar rechts verplaatsen',
+        moveAllToTarget: 'Alles naar rechts verplaatsen',
+        moveSelectedToSource: 'Selectie naar links verplaatsen',
+        moveAllToSource: 'Alles naar links verplaatsen',
+        empty: 'Geen items',
+    },
+    tree: {
+        expand: 'Uitvouwen',
+        collapse: 'Invouwen',
+    },
+    wordmark: {
+        overline: 'handgemaakt door',
+        tagline: 'elegant webontwerp',
+    },
+};
+
 /** Polish messages. */
 const pl = {
     alert: {
@@ -1153,6 +1630,318 @@ const pl = {
     },
 };
 
+/** Brazilian Portuguese messages. */
+const ptBR = {
+    alert: {
+        dismiss: 'Dispensar',
+    },
+    autocomplete: {
+        empty: 'Nenhum resultado',
+    },
+    avatarEditor: {
+        upload: 'Enviar imagem',
+        dropzone: 'Solte a imagem ou clique para enviar',
+        canvas: 'Pré-visualização da imagem, arraste ou use as setas para deslocar, o controle deslizante para ampliar',
+        change: 'Trocar foto',
+        revert: 'Reverter ao original',
+        zoomOut: 'Diminuir zoom',
+        zoom: 'Zoom',
+        zoomIn: 'Aumentar zoom',
+        remove: 'Remover imagem',
+    },
+    breadcrumbs: {
+        label: 'Trilha de navegação',
+    },
+    codeInput: {
+        groupLabel: length => `Código de verificação, ${length} dígitos`,
+        digitLabel: (index, length) => `Dígito ${index} de ${length}`,
+    },
+    commandPalette: {
+        dialogLabel: 'Paleta de comandos',
+        searchPlaceholder: 'Digite um comando ou pesquise…',
+        empty: 'Nenhum resultado encontrado',
+        clear: 'Limpar pesquisa',
+    },
+    colorPicker: {
+        placeholder: 'Escolha uma cor…',
+        clear: 'Limpar cor',
+        hue: 'Matiz',
+        saturationAndValue: 'Saturação e valor',
+        alpha: 'Alfa',
+        eyedropper: 'Capturar da tela',
+        presets: 'Predefinições',
+        toggleFormat: 'Alternar formato de entrada',
+    },
+    dataTable: {
+        noData: 'Nenhum dado disponível',
+    },
+    datePicker: {
+        placeholder: 'Selecione a data…',
+        clear: 'Limpar data',
+        previousYear: 'Ano anterior',
+        previousMonth: 'Mês anterior',
+        nextMonth: 'Próximo mês',
+        nextYear: 'Próximo ano',
+        today: 'Hoje',
+    },
+    dialog: {
+        close: 'Fechar diálogo',
+    },
+    drawer: {
+        close: 'Fechar painel',
+    },
+    dropdown: {
+        placeholder: 'Selecione…',
+    },
+    fileUploader: {
+        prompt: 'Clique ou arraste arquivos aqui para enviar',
+        promptSingle: 'Clique ou arraste um arquivo aqui para enviar',
+        browse: 'Procurar arquivos',
+        removeFile: name => `Remover ${name}`,
+        fileListLabel: 'Arquivos selecionados',
+        constraintsAccept: accept => `Aceitos: ${accept}`,
+        constraintsMaxSize: size => `Máximo ${size} por arquivo`,
+        constraintsMaxFiles: count => `Até ${count} arquivos`,
+        rejectionType: name => `${name} tem um tipo de arquivo não suportado`,
+        rejectionSize: (name, max) => `${name} excede o limite de ${max}`,
+        rejectionCount: max => `Somente ${max} arquivos podem ser selecionados`,
+        bytesUnit: { b: 'B', kb: 'KB', mb: 'MB', gb: 'GB', tb: 'TB' },
+    },
+    input: {
+        showPassword: 'Mostrar senha',
+        hidePassword: 'Ocultar senha',
+        clear: 'Limpar',
+    },
+    menu: {
+        label: 'Menu',
+    },
+    multiSelect: {
+        placeholder: 'Selecione…',
+        searchPlaceholder: 'Pesquisar…',
+        searchEmpty: 'Nenhuma correspondência',
+        selectAll: 'Selecionar tudo',
+        clearAll: 'Limpar seleção',
+        removeOption: label => `Remover ${label}`,
+        selectedCount: count => `${count} selecionado(s)`,
+    },
+    paginator: {
+        label: 'Paginação',
+        rowsPerPage: 'Linhas por página:',
+        range: (start, end, total) => `${start}–${end} de ${total}`,
+        previousPage: 'Página anterior',
+        nextPage: 'Próxima página',
+    },
+    progressBar: {
+        label: 'Progresso',
+    },
+    rating: {
+        label: 'Avaliação',
+        valueLabel: (value, max) => `${value} de ${max}`,
+        clear: 'Limpar avaliação',
+    },
+    spinner: {
+        label: 'Carregando',
+    },
+    stepper: {
+        optional: 'opcional',
+    },
+    tag: {
+        remove: 'Remover',
+    },
+    timePicker: {
+        placeholder: 'Selecione o horário…',
+        clear: 'Limpar horário',
+        hoursLabel: 'Horas',
+        minutesLabel: 'Minutos',
+        secondsLabel: 'Segundos',
+        incrementHours: 'Aumentar horas',
+        decrementHours: 'Diminuir horas',
+        incrementMinutes: 'Aumentar minutos',
+        decrementMinutes: 'Diminuir minutos',
+        incrementSeconds: 'Aumentar segundos',
+        decrementSeconds: 'Diminuir segundos',
+        amLabel: 'AM',
+        pmLabel: 'PM',
+    },
+    toast: {
+        dismiss: 'Dispensar',
+    },
+    transferList: {
+        sourceLabel: 'Disponíveis',
+        targetLabel: 'Selecionados',
+        controlsLabel: 'Controles de transferência',
+        moveSelectedToTarget: 'Mover selecionados para o destino',
+        moveAllToTarget: 'Mover todos para o destino',
+        moveSelectedToSource: 'Mover selecionados para a origem',
+        moveAllToSource: 'Mover todos para a origem',
+        empty: 'Nenhum item',
+    },
+    tree: {
+        expand: 'Expandir',
+        collapse: 'Recolher',
+    },
+    wordmark: {
+        overline: 'feito à mão por',
+        tagline: 'web design elegante',
+    },
+};
+
+/** Simplified Chinese messages. */
+const zhCN = {
+    alert: {
+        dismiss: '关闭',
+    },
+    autocomplete: {
+        empty: '无结果',
+    },
+    avatarEditor: {
+        upload: '上传图片',
+        dropzone: '拖放图片或点击上传',
+        canvas: '图片预览，拖动或使用方向键平移，使用滑块缩放',
+        change: '更换照片',
+        revert: '恢复原图',
+        zoomOut: '缩小',
+        zoom: '缩放',
+        zoomIn: '放大',
+        remove: '移除图片',
+    },
+    breadcrumbs: {
+        label: '面包屑导航',
+    },
+    codeInput: {
+        groupLabel: length => `验证码，共 ${length} 位`,
+        digitLabel: (index, length) => `第 ${index} 位，共 ${length} 位`,
+    },
+    commandPalette: {
+        dialogLabel: '命令面板',
+        searchPlaceholder: '输入命令或搜索…',
+        empty: '未找到结果',
+        clear: '清除搜索',
+    },
+    colorPicker: {
+        placeholder: '选择颜色…',
+        clear: '清除颜色',
+        hue: '色相',
+        saturationAndValue: '饱和度和明度',
+        alpha: '透明度',
+        eyedropper: '从屏幕取色',
+        presets: '预设',
+        toggleFormat: '切换输入格式',
+    },
+    dataTable: {
+        noData: '暂无数据',
+    },
+    datePicker: {
+        placeholder: '选择日期…',
+        clear: '清除日期',
+        previousYear: '上一年',
+        previousMonth: '上个月',
+        nextMonth: '下个月',
+        nextYear: '下一年',
+        today: '今天',
+    },
+    dialog: {
+        close: '关闭对话框',
+    },
+    drawer: {
+        close: '关闭面板',
+    },
+    dropdown: {
+        placeholder: '请选择…',
+    },
+    fileUploader: {
+        prompt: '点击或拖动文件到此处上传',
+        promptSingle: '点击或拖动文件到此处上传',
+        browse: '浏览文件',
+        removeFile: name => `移除 ${name}`,
+        fileListLabel: '已选文件',
+        constraintsAccept: accept => `支持格式：${accept}`,
+        constraintsMaxSize: size => `每个文件最大 ${size}`,
+        constraintsMaxFiles: count => `最多 ${count} 个文件`,
+        rejectionType: name => `${name} 的文件类型不受支持`,
+        rejectionSize: (name, max) => `${name} 超过了 ${max} 的限制`,
+        rejectionCount: max => `最多只能选择 ${max} 个文件`,
+        bytesUnit: { b: 'B', kb: 'KB', mb: 'MB', gb: 'GB', tb: 'TB' },
+    },
+    input: {
+        showPassword: '显示密码',
+        hidePassword: '隐藏密码',
+        clear: '清除',
+    },
+    menu: {
+        label: '菜单',
+    },
+    multiSelect: {
+        placeholder: '请选择…',
+        searchPlaceholder: '搜索…',
+        searchEmpty: '无匹配项',
+        selectAll: '全选',
+        clearAll: '清除选择',
+        removeOption: label => `移除 ${label}`,
+        selectedCount: count => `已选择 ${count} 项`,
+    },
+    paginator: {
+        label: '分页',
+        rowsPerPage: '每页行数：',
+        range: (start, end, total) => `共 ${total} 项中的 ${start}–${end}`,
+        previousPage: '上一页',
+        nextPage: '下一页',
+    },
+    progressBar: {
+        label: '进度',
+    },
+    rating: {
+        label: '评分',
+        valueLabel: (value, max) => `${value} / ${max}`,
+        clear: '清除评分',
+    },
+    spinner: {
+        label: '加载中',
+    },
+    stepper: {
+        optional: '可选',
+    },
+    tag: {
+        remove: '移除',
+    },
+    timePicker: {
+        placeholder: '选择时间…',
+        clear: '清除时间',
+        hoursLabel: '时',
+        minutesLabel: '分',
+        secondsLabel: '秒',
+        incrementHours: '增加小时',
+        decrementHours: '减少小时',
+        incrementMinutes: '增加分钟',
+        decrementMinutes: '减少分钟',
+        incrementSeconds: '增加秒数',
+        decrementSeconds: '减少秒数',
+        amLabel: '上午',
+        pmLabel: '下午',
+    },
+    toast: {
+        dismiss: '关闭',
+    },
+    transferList: {
+        sourceLabel: '可选',
+        targetLabel: '已选',
+        controlsLabel: '穿梭控件',
+        moveSelectedToTarget: '将所选项移至右侧',
+        moveAllToTarget: '将全部移至右侧',
+        moveSelectedToSource: '将所选项移至左侧',
+        moveAllToSource: '将全部移至左侧',
+        empty: '无项目',
+    },
+    tree: {
+        expand: '展开',
+        collapse: '折叠',
+    },
+    wordmark: {
+        overline: '匠心打造',
+        tagline: '优雅的网页设计',
+    },
+};
+
 /** Built-in message dictionaries, keyed by locale. */
 const EAGAMI_MESSAGES = {
     en,
@@ -1160,6 +1949,11 @@ const EAGAMI_MESSAGES = {
     el,
     pl,
     'es-ES': esES,
+    de,
+    'pt-BR': ptBR,
+    'zh-CN': zhCN,
+    is,
+    nl,
 };
 
 /** Shallow-merges per-component override groups over a complete base dictionary. */
@@ -2808,6 +3602,8 @@ class TooltipDirective {
     renderer = inject(Renderer2);
     eaTooltip = input.required(...(ngDevMode ? [{ debugName: "eaTooltip" }] : /* istanbul ignore next */ []));
     tooltipPosition = input('top', ...(ngDevMode ? [{ debugName: "tooltipPosition" }] : /* istanbul ignore next */ []));
+    /** Max width in px; the text wraps at this width. Clamped to a 50px floor. */
+    maxWidth = input(200, ...(ngDevMode ? [{ debugName: "maxWidth" }] : /* istanbul ignore next */ []));
     tooltipEl = null;
     tooltipId = `ea-tooltip-${Math.random().toString(36).slice(2, 9)}`;
     // Touch devices fire `mouseenter` on tap but never fire `mouseleave` until
@@ -2830,8 +3626,11 @@ class TooltipDirective {
        open even though the user has moved their cursor away. `:focus-visible`
        is the browser's signal for "keyboard activation", which is exactly
        when a tooltip on focus is welcome. */
-    focusHandler = () => {
-        if (!this.supportsFocusVisible || this.el.nativeElement.matches(':focus-visible')) {
+    focusHandler = (event) => {
+        // focusin bubbles, so the focused element may be a child of the host (e.g. the
+        // inner <button> of <ea-button>); test it, not the host, for keyboard focus.
+        const target = event.target;
+        if (!this.supportsFocusVisible || target.matches(':focus-visible')) {
             this.show();
         }
     };
@@ -2867,9 +3666,10 @@ class TooltipDirective {
     resizeObserver = null;
     constructor() {
         const native = this.el.nativeElement;
-        // Focus/blur/keydown always wire up; keyboard users benefit on any device.
-        native.addEventListener('focus', this.focusHandler);
-        native.addEventListener('blur', this.hideHandler);
+        // focusin/focusout (not focus/blur) so the tooltip still shows when the host
+        // wraps the focusable element (focus does not bubble; focusin does).
+        native.addEventListener('focusin', this.focusHandler);
+        native.addEventListener('focusout', this.hideHandler);
         native.addEventListener('keydown', this.keydownHandler);
         this.syncPointerListeners(this.hoverMql?.matches ?? true);
         this.hoverMql?.addEventListener('change', this.hoverChangeHandler);
@@ -2878,8 +3678,8 @@ class TooltipDirective {
         const native = this.el.nativeElement;
         native.removeEventListener('mouseenter', this.showHandler);
         native.removeEventListener('mouseleave', this.hideHandler);
-        native.removeEventListener('focus', this.focusHandler);
-        native.removeEventListener('blur', this.hideHandler);
+        native.removeEventListener('focusin', this.focusHandler);
+        native.removeEventListener('focusout', this.hideHandler);
         native.removeEventListener('keydown', this.keydownHandler);
         this.hoverMql?.removeEventListener('change', this.hoverChangeHandler);
         this.hide();
@@ -2908,6 +3708,11 @@ class TooltipDirective {
         this.renderer.setAttribute(this.tooltipEl, 'role', 'tooltip');
         this.renderer.setAttribute(this.tooltipEl, 'id', this.tooltipId);
         this.tooltipEl.textContent = this.eaTooltip();
+        const maxWidth = this.maxWidth();
+        if (maxWidth != null) {
+            this.renderer.setStyle(this.tooltipEl, 'max-width', `${Math.max(50, maxWidth)}px`);
+            this.renderer.setStyle(this.tooltipEl, 'white-space', 'normal');
+        }
         this.renderer.appendChild(document.body, this.tooltipEl);
         this.appendDescribedBy();
         this.positionTooltip();
@@ -3033,14 +3838,14 @@ class TooltipDirective {
         this.renderer.setStyle(this.tooltipEl, 'left', `${left + window.scrollX}px`);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: TooltipDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.16", type: TooltipDirective, isStandalone: true, selector: "[eaTooltip]", inputs: { eaTooltip: { classPropertyName: "eaTooltip", publicName: "eaTooltip", isSignal: true, isRequired: true, transformFunction: null }, tooltipPosition: { classPropertyName: "tooltipPosition", publicName: "tooltipPosition", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.16", type: TooltipDirective, isStandalone: true, selector: "[eaTooltip]", inputs: { eaTooltip: { classPropertyName: "eaTooltip", publicName: "eaTooltip", isSignal: true, isRequired: true, transformFunction: null }, tooltipPosition: { classPropertyName: "tooltipPosition", publicName: "tooltipPosition", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: TooltipDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[eaTooltip]',
                 }]
-        }], ctorParameters: () => [], propDecorators: { eaTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "eaTooltip", required: true }] }], tooltipPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltipPosition", required: false }] }] } });
+        }], ctorParameters: () => [], propDecorators: { eaTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "eaTooltip", required: true }] }], tooltipPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltipPosition", required: false }] }], maxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxWidth", required: false }] }] } });
 
 /**
  * Canvas-based image editor for cropping avatars. Supports drag-and-drop
@@ -3602,7 +4407,7 @@ class AvatarEditorComponent {
         ctx.clearRect(0, 0, canvas.width, canvas.height);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: AvatarEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: AvatarEditorComponent, isStandalone: true, selector: "ea-avatar-editor", inputs: { shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, canvasSize: { classPropertyName: "canvasSize", publicName: "canvasSize", isSignal: true, isRequired: false, transformFunction: null }, currentSrc: { classPropertyName: "currentSrc", publicName: "currentSrc", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, maxFileSize: { classPropertyName: "maxFileSize", publicName: "maxFileSize", isSignal: true, isRequired: false, transformFunction: null }, minZoom: { classPropertyName: "minZoom", publicName: "minZoom", isSignal: true, isRequired: false, transformFunction: null }, maxZoom: { classPropertyName: "maxZoom", publicName: "maxZoom", isSignal: true, isRequired: false, transformFunction: null }, exportQuality: { classPropertyName: "exportQuality", publicName: "exportQuality", isSignal: true, isRequired: false, transformFunction: null }, exportType: { classPropertyName: "exportType", publicName: "exportType", isSignal: true, isRequired: false, transformFunction: null }, cropState: { classPropertyName: "cropState", publicName: "cropState", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cropped: "cropped", fileSelected: "fileSelected", removed: "removed", errored: "errored", cropStateChanged: "cropStateChanged" }, viewQueries: [{ propertyName: "canvasEl", first: true, predicate: ["canvasEl"], descendants: true, isSignal: true }, { propertyName: "fileInputEl", first: true, predicate: ["fileInputEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"ea-avatar-editor\"\n  [ngClass]=\"hostClasses()\">\n  <input\n    #fileInputEl\n    type=\"file\"\n    class=\"ea-avatar-editor__file-input\"\n    [attr.aria-label]=\"i18n.messages().avatarEditor.upload\"\n    [accept]=\"accept()\"\n    (change)=\"onFileSelected($event)\" />\n\n  @if (!hasImage() && !isLoading()) {\n    <button\n      type=\"button\"\n      class=\"ea-avatar-editor__dropzone\"\n      [style.width.px]=\"canvasSize()\"\n      [style.height.px]=\"canvasSize()\"\n      (click)=\"openFilePicker()\"\n      (dragover)=\"onDragOver($event)\"\n      (dragleave)=\"onDragLeave($event)\"\n      (drop)=\"onDrop($event)\">\n      <ea-icon-upload class=\"ea-avatar-editor__upload-icon\" />\n      <span class=\"ea-avatar-editor__dropzone-text\">\n        {{ i18n.messages().avatarEditor.dropzone }}\n      </span>\n    </button>\n  }\n\n  @if (hasImage() || isLoading()) {\n    <div\n      class=\"ea-avatar-editor__canvas-wrapper\"\n      [style.width.px]=\"canvasSize()\"\n      [style.height.px]=\"canvasSize()\"\n      (dragover)=\"onDragOver($event)\"\n      (dragleave)=\"onDragLeave($event)\"\n      (drop)=\"onDrop($event)\">\n      @if (isLoading()) {\n        <ea-skeleton\n          [variant]=\"shape() === 'circle' ? 'circle' : 'rect'\"\n          [width]=\"canvasSize() + 'px'\"\n          [height]=\"canvasSize() + 'px'\" />\n      }\n\n      @if (hasImage()) {\n        <canvas\n          #canvasEl\n          class=\"ea-avatar-editor__canvas\"\n          role=\"img\"\n          tabindex=\"0\"\n          [attr.aria-label]=\"i18n.messages().avatarEditor.canvas\"\n          [style.display]=\"isLoading() ? 'none' : 'block'\"\n          [width]=\"canvasSize()\"\n          [height]=\"canvasSize()\"\n          (mousedown)=\"onMouseDown($event)\"\n          (touchstart)=\"onTouchStart($event)\"\n          (keydown)=\"onCanvasKeydown($event)\"></canvas>\n\n        @if (!isLoading()) {\n          <div\n            class=\"ea-avatar-editor__canvas-overlay\"\n            [class.ea-avatar-editor__canvas-overlay--on-light]=\"!isImageDark()\">\n            <ea-icon-camera class=\"ea-avatar-editor__overlay-icon\" />\n            <span>{{ i18n.messages().avatarEditor.change }}</span>\n          </div>\n        }\n      }\n    </div>\n  }\n\n  <div class=\"ea-avatar-editor__controls\">\n    <button\n      type=\"button\"\n      class=\"ea-avatar-editor__icon-btn\"\n      [eaTooltip]=\"i18n.messages().avatarEditor.revert\"\n      [attr.aria-label]=\"i18n.messages().avatarEditor.revert\"\n      [disabled]=\"!canRevert() || isLoading()\"\n      (click)=\"revertImage()\">\n      <ea-icon-rotate-ccw />\n    </button>\n\n    <button\n      type=\"button\"\n      class=\"ea-avatar-editor__icon-btn\"\n      [eaTooltip]=\"i18n.messages().avatarEditor.zoomOut\"\n      [attr.aria-label]=\"i18n.messages().avatarEditor.zoomOut\"\n      [disabled]=\"!hasImage() || isLoading() || zoom() <= minZoom()\"\n      (click)=\"setZoom(zoom() - 0.1)\">\n      <ea-icon-minus />\n    </button>\n\n    <input\n      type=\"range\"\n      class=\"ea-avatar-editor__zoom-slider\"\n      [min]=\"minZoom()\"\n      [max]=\"maxZoom()\"\n      step=\"0.01\"\n      [value]=\"zoom()\"\n      [disabled]=\"!hasImage() || isLoading()\"\n      [attr.aria-label]=\"i18n.messages().avatarEditor.zoom\"\n      (input)=\"onZoomInput($event)\" />\n\n    <button\n      type=\"button\"\n      class=\"ea-avatar-editor__icon-btn\"\n      [eaTooltip]=\"i18n.messages().avatarEditor.zoomIn\"\n      [attr.aria-label]=\"i18n.messages().avatarEditor.zoomIn\"\n      [disabled]=\"!hasImage() || isLoading() || zoom() >= maxZoom()\"\n      (click)=\"setZoom(zoom() + 0.1)\">\n      <ea-icon-plus />\n    </button>\n\n    <button\n      type=\"button\"\n      class=\"ea-avatar-editor__icon-btn ea-avatar-editor__icon-btn--danger\"\n      [eaTooltip]=\"i18n.messages().avatarEditor.remove\"\n      [attr.aria-label]=\"i18n.messages().avatarEditor.remove\"\n      [disabled]=\"!hasImage() || isLoading()\"\n      (click)=\"removeImage()\">\n      <ea-icon-trash />\n    </button>\n  </div>\n</div>\n", styles: [".ea-avatar-editor{display:inline-flex;flex-direction:column;align-items:center;gap:var(--space-3);font-family:var(--font-family-sans)}.ea-avatar-editor__file-input{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;margin:-1px;border:0;white-space:nowrap;clip:rect(0,0,0,0);clip-path:inset(50%)}.ea-avatar-editor__dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-4);font-family:inherit;font-size:var(--font-size-sm);line-height:var(--line-height-normal);border:2px dashed var(--color-border-default);border-radius:var(--radius-lg);background-color:var(--color-bg-subtle);color:var(--color-text-tertiary);cursor:pointer;transition:var(--transition-colors)}.ea-avatar-editor__dropzone:hover{border-color:var(--color-border-focus);background-color:var(--color-state-hover);color:var(--color-text-secondary)}.ea-avatar-editor__dropzone:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-avatar-editor--drag-over .ea-avatar-editor__dropzone{border-color:var(--color-primary-500);background-color:var(--color-primary-50);color:var(--color-primary-600)}.ea-avatar-editor--circle .ea-avatar-editor__dropzone{border-radius:var(--radius-full)}.ea-avatar-editor__upload-icon{width:32px;height:32px;opacity:.6}.ea-avatar-editor__dropzone-text{text-align:center}.ea-avatar-editor--compact .ea-avatar-editor__dropzone{gap:var(--space-1-5);padding:var(--space-3);font-size:.75rem;line-height:1.35}.ea-avatar-editor--compact .ea-avatar-editor__upload-icon{width:24px;height:24px}.ea-avatar-editor--ultra-compact .ea-avatar-editor__dropzone{gap:var(--space-1);padding:var(--space-2);font-size:.625rem;line-height:1.2}.ea-avatar-editor--ultra-compact .ea-avatar-editor__upload-icon{width:16px;height:16px}.ea-avatar-editor__canvas-wrapper{position:relative;overflow:hidden;border-radius:var(--radius-lg)}.ea-avatar-editor--circle .ea-avatar-editor__canvas-wrapper{border-radius:var(--radius-full)}.ea-avatar-editor__canvas{display:block;cursor:grab}.ea-avatar-editor__canvas:active{cursor:grabbing}.ea-avatar-editor__canvas-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-1);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-neutral-0);opacity:0;pointer-events:none;transition:opacity var(--duration-fast) var(--easing-default),color var(--duration-fast) var(--easing-default)}.ea-avatar-editor__canvas-overlay--on-light{color:var(--color-neutral-950)}.ea-avatar-editor__overlay-icon{width:24px;height:24px}.ea-avatar-editor__canvas-wrapper:hover .ea-avatar-editor__canvas-overlay{opacity:1}.ea-avatar-editor__controls{display:flex;align-items:center;gap:var(--space-2)}.ea-avatar-editor__icon-btn{display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;padding:0}.ea-avatar-editor__icon-btn ea-icon-rotate-ccw,.ea-avatar-editor__icon-btn ea-icon-minus,.ea-avatar-editor__icon-btn ea-icon-plus,.ea-avatar-editor__icon-btn ea-icon-trash{width:1rem;height:1rem}.ea-avatar-editor__icon-btn{border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);background-color:var(--color-bg-base);color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-avatar-editor__icon-btn:hover:not(:disabled){border-color:var(--color-border-focus)}.ea-avatar-editor__icon-btn:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-avatar-editor__icon-btn:disabled{opacity:.4;cursor:not-allowed}.ea-avatar-editor__icon-btn--danger{color:var(--color-error-default)}.ea-avatar-editor__icon-btn--danger:hover:not(:disabled){border-color:var(--color-error-default)}.ea-avatar-editor__zoom-slider{width:7rem;height:4px;border-radius:var(--radius-full);background:var(--color-neutral-200);appearance:none;cursor:pointer}.ea-avatar-editor__zoom-slider::-webkit-slider-thumb{width:1rem;height:1rem;border:2px solid var(--color-primary-500);border-radius:var(--radius-full);background:var(--color-bg-base);appearance:none;cursor:grab}.ea-avatar-editor__zoom-slider::-webkit-slider-thumb:active{cursor:grabbing}.ea-avatar-editor__zoom-slider::-moz-range-thumb{width:1rem;height:1rem;border:2px solid var(--color-primary-500);border-radius:var(--radius-full);background:var(--color-bg-base);cursor:grab}.ea-avatar-editor__zoom-slider::-moz-range-thumb:active{cursor:grabbing}.ea-avatar-editor__zoom-slider:focus-visible{outline:none}.ea-avatar-editor__zoom-slider:focus-visible::-webkit-slider-thumb{box-shadow:var(--shadow-focus-ring)}.ea-avatar-editor__zoom-slider:disabled{opacity:.4;cursor:not-allowed}\n"], dependencies: [{ kind: "component", type: CameraIconComponent, selector: "ea-icon-camera" }, { kind: "component", type: MinusIconComponent, selector: "ea-icon-minus" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: PlusIconComponent, selector: "ea-icon-plus" }, { kind: "component", type: RotateCcwIconComponent, selector: "ea-icon-rotate-ccw" }, { kind: "component", type: SkeletonComponent, selector: "ea-skeleton", inputs: ["variant", "width", "height", "animated"] }, { kind: "directive", type: TooltipDirective, selector: "[eaTooltip]", inputs: ["eaTooltip", "tooltipPosition"] }, { kind: "component", type: TrashIconComponent, selector: "ea-icon-trash" }, { kind: "component", type: UploadIconComponent, selector: "ea-icon-upload" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: AvatarEditorComponent, isStandalone: true, selector: "ea-avatar-editor", inputs: { shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, canvasSize: { classPropertyName: "canvasSize", publicName: "canvasSize", isSignal: true, isRequired: false, transformFunction: null }, currentSrc: { classPropertyName: "currentSrc", publicName: "currentSrc", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, maxFileSize: { classPropertyName: "maxFileSize", publicName: "maxFileSize", isSignal: true, isRequired: false, transformFunction: null }, minZoom: { classPropertyName: "minZoom", publicName: "minZoom", isSignal: true, isRequired: false, transformFunction: null }, maxZoom: { classPropertyName: "maxZoom", publicName: "maxZoom", isSignal: true, isRequired: false, transformFunction: null }, exportQuality: { classPropertyName: "exportQuality", publicName: "exportQuality", isSignal: true, isRequired: false, transformFunction: null }, exportType: { classPropertyName: "exportType", publicName: "exportType", isSignal: true, isRequired: false, transformFunction: null }, cropState: { classPropertyName: "cropState", publicName: "cropState", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cropped: "cropped", fileSelected: "fileSelected", removed: "removed", errored: "errored", cropStateChanged: "cropStateChanged" }, viewQueries: [{ propertyName: "canvasEl", first: true, predicate: ["canvasEl"], descendants: true, isSignal: true }, { propertyName: "fileInputEl", first: true, predicate: ["fileInputEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"ea-avatar-editor\"\n  [ngClass]=\"hostClasses()\">\n  <input\n    #fileInputEl\n    type=\"file\"\n    class=\"ea-avatar-editor__file-input\"\n    [attr.aria-label]=\"i18n.messages().avatarEditor.upload\"\n    [accept]=\"accept()\"\n    (change)=\"onFileSelected($event)\" />\n\n  @if (!hasImage() && !isLoading()) {\n    <button\n      type=\"button\"\n      class=\"ea-avatar-editor__dropzone\"\n      [style.width.px]=\"canvasSize()\"\n      [style.height.px]=\"canvasSize()\"\n      (click)=\"openFilePicker()\"\n      (dragover)=\"onDragOver($event)\"\n      (dragleave)=\"onDragLeave($event)\"\n      (drop)=\"onDrop($event)\">\n      <ea-icon-upload class=\"ea-avatar-editor__upload-icon\" />\n      <span class=\"ea-avatar-editor__dropzone-text\">\n        {{ i18n.messages().avatarEditor.dropzone }}\n      </span>\n    </button>\n  }\n\n  @if (hasImage() || isLoading()) {\n    <div\n      class=\"ea-avatar-editor__canvas-wrapper\"\n      [style.width.px]=\"canvasSize()\"\n      [style.height.px]=\"canvasSize()\"\n      (dragover)=\"onDragOver($event)\"\n      (dragleave)=\"onDragLeave($event)\"\n      (drop)=\"onDrop($event)\">\n      @if (isLoading()) {\n        <ea-skeleton\n          [variant]=\"shape() === 'circle' ? 'circle' : 'rect'\"\n          [width]=\"canvasSize() + 'px'\"\n          [height]=\"canvasSize() + 'px'\" />\n      }\n\n      @if (hasImage()) {\n        <canvas\n          #canvasEl\n          class=\"ea-avatar-editor__canvas\"\n          role=\"img\"\n          tabindex=\"0\"\n          [attr.aria-label]=\"i18n.messages().avatarEditor.canvas\"\n          [style.display]=\"isLoading() ? 'none' : 'block'\"\n          [width]=\"canvasSize()\"\n          [height]=\"canvasSize()\"\n          (mousedown)=\"onMouseDown($event)\"\n          (touchstart)=\"onTouchStart($event)\"\n          (keydown)=\"onCanvasKeydown($event)\"></canvas>\n\n        @if (!isLoading()) {\n          <div\n            class=\"ea-avatar-editor__canvas-overlay\"\n            [class.ea-avatar-editor__canvas-overlay--on-light]=\"!isImageDark()\">\n            <ea-icon-camera class=\"ea-avatar-editor__overlay-icon\" />\n            <span>{{ i18n.messages().avatarEditor.change }}</span>\n          </div>\n        }\n      }\n    </div>\n  }\n\n  <div class=\"ea-avatar-editor__controls\">\n    <button\n      type=\"button\"\n      class=\"ea-avatar-editor__icon-btn\"\n      [eaTooltip]=\"i18n.messages().avatarEditor.revert\"\n      [attr.aria-label]=\"i18n.messages().avatarEditor.revert\"\n      [disabled]=\"!canRevert() || isLoading()\"\n      (click)=\"revertImage()\">\n      <ea-icon-rotate-ccw />\n    </button>\n\n    <button\n      type=\"button\"\n      class=\"ea-avatar-editor__icon-btn\"\n      [eaTooltip]=\"i18n.messages().avatarEditor.zoomOut\"\n      [attr.aria-label]=\"i18n.messages().avatarEditor.zoomOut\"\n      [disabled]=\"!hasImage() || isLoading() || zoom() <= minZoom()\"\n      (click)=\"setZoom(zoom() - 0.1)\">\n      <ea-icon-minus />\n    </button>\n\n    <input\n      type=\"range\"\n      class=\"ea-avatar-editor__zoom-slider\"\n      [min]=\"minZoom()\"\n      [max]=\"maxZoom()\"\n      step=\"0.01\"\n      [value]=\"zoom()\"\n      [disabled]=\"!hasImage() || isLoading()\"\n      [attr.aria-label]=\"i18n.messages().avatarEditor.zoom\"\n      (input)=\"onZoomInput($event)\" />\n\n    <button\n      type=\"button\"\n      class=\"ea-avatar-editor__icon-btn\"\n      [eaTooltip]=\"i18n.messages().avatarEditor.zoomIn\"\n      [attr.aria-label]=\"i18n.messages().avatarEditor.zoomIn\"\n      [disabled]=\"!hasImage() || isLoading() || zoom() >= maxZoom()\"\n      (click)=\"setZoom(zoom() + 0.1)\">\n      <ea-icon-plus />\n    </button>\n\n    <button\n      type=\"button\"\n      class=\"ea-avatar-editor__icon-btn ea-avatar-editor__icon-btn--danger\"\n      [eaTooltip]=\"i18n.messages().avatarEditor.remove\"\n      [attr.aria-label]=\"i18n.messages().avatarEditor.remove\"\n      [disabled]=\"!hasImage() || isLoading()\"\n      (click)=\"removeImage()\">\n      <ea-icon-trash />\n    </button>\n  </div>\n</div>\n", styles: [".ea-avatar-editor{display:inline-flex;flex-direction:column;align-items:center;gap:var(--space-3);font-family:var(--font-family-sans)}.ea-avatar-editor__file-input{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;margin:-1px;border:0;white-space:nowrap;clip:rect(0,0,0,0);clip-path:inset(50%)}.ea-avatar-editor__dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-4);font-family:inherit;font-size:var(--font-size-sm);line-height:var(--line-height-normal);border:2px dashed var(--color-border-default);border-radius:var(--radius-lg);background-color:var(--color-bg-subtle);color:var(--color-text-tertiary);cursor:pointer;transition:var(--transition-colors)}.ea-avatar-editor__dropzone:hover{border-color:var(--color-border-focus);background-color:var(--color-state-hover);color:var(--color-text-secondary)}.ea-avatar-editor__dropzone:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-avatar-editor--drag-over .ea-avatar-editor__dropzone{border-color:var(--color-primary-500);background-color:var(--color-primary-50);color:var(--color-primary-600)}.ea-avatar-editor--circle .ea-avatar-editor__dropzone{border-radius:var(--radius-full)}.ea-avatar-editor__upload-icon{width:32px;height:32px;opacity:.6}.ea-avatar-editor__dropzone-text{text-align:center}.ea-avatar-editor--compact .ea-avatar-editor__dropzone{gap:var(--space-1-5);padding:var(--space-3);font-size:.75rem;line-height:1.35}.ea-avatar-editor--compact .ea-avatar-editor__upload-icon{width:24px;height:24px}.ea-avatar-editor--ultra-compact .ea-avatar-editor__dropzone{gap:var(--space-1);padding:var(--space-2);font-size:.625rem;line-height:1.2}.ea-avatar-editor--ultra-compact .ea-avatar-editor__upload-icon{width:16px;height:16px}.ea-avatar-editor__canvas-wrapper{position:relative;overflow:hidden;border-radius:var(--radius-lg)}.ea-avatar-editor--circle .ea-avatar-editor__canvas-wrapper{border-radius:var(--radius-full)}.ea-avatar-editor__canvas{display:block;cursor:grab}.ea-avatar-editor__canvas:active{cursor:grabbing}.ea-avatar-editor__canvas-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-1);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-neutral-0);opacity:0;pointer-events:none;transition:opacity var(--duration-fast) var(--easing-default),color var(--duration-fast) var(--easing-default)}.ea-avatar-editor__canvas-overlay--on-light{color:var(--color-neutral-950)}.ea-avatar-editor__overlay-icon{width:24px;height:24px}.ea-avatar-editor__canvas-wrapper:hover .ea-avatar-editor__canvas-overlay{opacity:1}.ea-avatar-editor__controls{display:flex;align-items:center;gap:var(--space-2)}.ea-avatar-editor__icon-btn{display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;padding:0}.ea-avatar-editor__icon-btn ea-icon-rotate-ccw,.ea-avatar-editor__icon-btn ea-icon-minus,.ea-avatar-editor__icon-btn ea-icon-plus,.ea-avatar-editor__icon-btn ea-icon-trash{width:1rem;height:1rem}.ea-avatar-editor__icon-btn{border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);background-color:var(--color-bg-base);color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-avatar-editor__icon-btn:hover:not(:disabled){border-color:var(--color-border-focus)}.ea-avatar-editor__icon-btn:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-avatar-editor__icon-btn:disabled{opacity:.4;cursor:not-allowed}.ea-avatar-editor__icon-btn--danger{color:var(--color-error-default)}.ea-avatar-editor__icon-btn--danger:hover:not(:disabled){border-color:var(--color-error-default)}.ea-avatar-editor__zoom-slider{width:7rem;height:4px;border-radius:var(--radius-full);background:var(--color-neutral-200);appearance:none;cursor:pointer}.ea-avatar-editor__zoom-slider::-webkit-slider-thumb{width:1rem;height:1rem;border:2px solid var(--color-primary-500);border-radius:var(--radius-full);background:var(--color-bg-base);appearance:none;cursor:grab}.ea-avatar-editor__zoom-slider::-webkit-slider-thumb:active{cursor:grabbing}.ea-avatar-editor__zoom-slider::-moz-range-thumb{width:1rem;height:1rem;border:2px solid var(--color-primary-500);border-radius:var(--radius-full);background:var(--color-bg-base);cursor:grab}.ea-avatar-editor__zoom-slider::-moz-range-thumb:active{cursor:grabbing}.ea-avatar-editor__zoom-slider:focus-visible{outline:none}.ea-avatar-editor__zoom-slider:focus-visible::-webkit-slider-thumb{box-shadow:var(--shadow-focus-ring)}.ea-avatar-editor__zoom-slider:disabled{opacity:.4;cursor:not-allowed}\n"], dependencies: [{ kind: "component", type: CameraIconComponent, selector: "ea-icon-camera" }, { kind: "component", type: MinusIconComponent, selector: "ea-icon-minus" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: PlusIconComponent, selector: "ea-icon-plus" }, { kind: "component", type: RotateCcwIconComponent, selector: "ea-icon-rotate-ccw" }, { kind: "component", type: SkeletonComponent, selector: "ea-skeleton", inputs: ["variant", "width", "height", "animated"] }, { kind: "directive", type: TooltipDirective, selector: "[eaTooltip]", inputs: ["eaTooltip", "tooltipPosition", "maxWidth"] }, { kind: "component", type: TrashIconComponent, selector: "ea-icon-trash" }, { kind: "component", type: UploadIconComponent, selector: "ea-icon-upload" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: AvatarEditorComponent, decorators: [{
             type: Component,
@@ -6193,11 +6998,7 @@ class DialogComponent {
     dialogEl = viewChild('dialogEl', ...(ngDevMode ? [{ debugName: "dialogEl" }] : /* istanbul ignore next */ []));
     previouslyFocused = null;
     i18n = inject(EagamiI18nService);
-    width = input(undefined, ...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
-    /**
-     * @deprecated Use `width` instead. Will be removed in v3.0.0.
-     */
-    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    width = input('md', ...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
     closeOnBackdrop = input(true, ...(ngDevMode ? [{ debugName: "closeOnBackdrop" }] : /* istanbul ignore next */ []));
     closeOnEscape = input(true, ...(ngDevMode ? [{ debugName: "closeOnEscape" }] : /* istanbul ignore next */ []));
     showClose = input(true, ...(ngDevMode ? [{ debugName: "showClose" }] : /* istanbul ignore next */ []));
@@ -6208,10 +7009,8 @@ class DialogComponent {
     opened = output();
     /** Fires when the dialog closes (via close button, backdrop, or Escape). */
     closed = output();
-    /** Effective panel width, preferring `width` over the deprecated `size`. */
-    resolvedWidth = computed(() => this.width() ?? this.size(), ...(ngDevMode ? [{ debugName: "resolvedWidth" }] : /* istanbul ignore next */ []));
     panelClasses = computed(() => ({
-        [`ea-dialog__panel--${this.resolvedWidth()}`]: true,
+        [`ea-dialog__panel--${this.width()}`]: true,
     }), ...(ngDevMode ? [{ debugName: "panelClasses" }] : /* istanbul ignore next */ []));
     constructor() {
         effect(() => {
@@ -6256,12 +7055,12 @@ class DialogComponent {
         this.handleClose();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: DialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: DialogComponent, isStandalone: true, selector: "ea-dialog", inputs: { width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, closeOnBackdrop: { classPropertyName: "closeOnBackdrop", publicName: "closeOnBackdrop", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, showClose: { classPropertyName: "showClose", publicName: "showClose", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", opened: "opened", closed: "closed" }, viewQueries: [{ propertyName: "dialogEl", first: true, predicate: ["dialogEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<dialog\n  #dialogEl\n  class=\"ea-dialog\"\n  [id]=\"id()\"\n  [attr.aria-label]=\"ariaLabel() ?? null\"\n  [attr.aria-labelledby]=\"!ariaLabel() ? id() + '-header' : null\"\n  (click)=\"handleBackdropClick($event)\"\n  (cancel)=\"handleCancel($event)\">\n  <div\n    class=\"ea-dialog__panel\"\n    [ngClass]=\"panelClasses()\">\n    @if (showClose()) {\n      <button\n        type=\"button\"\n        class=\"ea-dialog__close\"\n        [attr.aria-label]=\"i18n.messages().dialog.close\"\n        (click)=\"handleClose()\">\n        <ea-icon-x />\n      </button>\n    }\n\n    <div\n      class=\"ea-dialog__header\"\n      [id]=\"id() + '-header'\">\n      <ng-content select=\"[slot=header]\" />\n    </div>\n\n    <div class=\"ea-dialog__body\">\n      <ng-content />\n    </div>\n\n    <div class=\"ea-dialog__footer\">\n      <ng-content select=\"[slot=footer]\" />\n    </div>\n  </div>\n</dialog>\n", styles: [".ea-dialog{border:none;background:transparent;padding:0;margin:auto;max-width:none;max-height:none;overflow:visible}.ea-dialog::backdrop{background-color:var(--color-bg-overlay)}.ea-dialog__panel{position:relative;display:flex;flex-direction:column;background-color:var(--color-bg-elevated);border-radius:var(--radius-xl);box-shadow:var(--shadow-2xl);max-height:85vh;overflow:hidden}.ea-dialog__panel--xs{width:20rem}.ea-dialog__panel--sm{width:24rem}.ea-dialog__panel--md{width:32rem}.ea-dialog__panel--lg{width:42rem}.ea-dialog__panel--xl{width:52rem}.ea-dialog__panel--full{width:calc(100vw - 2rem);height:calc(100vh - 2rem);max-height:calc(100vh - 2rem)}.ea-dialog__close{z-index:1;position:absolute;top:var(--space-3);right:var(--space-3);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-dialog__close>*{font-size:1.25em}.ea-dialog__close:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-dialog__close:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-dialog__close:disabled{cursor:not-allowed;opacity:.5}.ea-dialog__close svg{width:1em;height:1em}.ea-dialog__header{padding:var(--space-5) var(--space-6) var(--space-3);font-size:var(--text-h4-size);font-weight:var(--text-h4-weight);line-height:var(--text-h4-lh);color:var(--color-text-primary)}.ea-dialog__header:empty{display:none}.ea-dialog__body{flex:1;padding:var(--space-3) var(--space-6);overflow-y:auto;font-size:var(--font-size-sm);line-height:var(--line-height-normal);color:var(--color-text-secondary)}.ea-dialog__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);padding:var(--space-3) var(--space-6) var(--space-5)}.ea-dialog__footer>*{display:flex;align-items:center;gap:var(--space-3)}.ea-dialog__footer:empty{display:none}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: XIconComponent, selector: "ea-icon-x" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: DialogComponent, isStandalone: true, selector: "ea-dialog", inputs: { width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, closeOnBackdrop: { classPropertyName: "closeOnBackdrop", publicName: "closeOnBackdrop", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, showClose: { classPropertyName: "showClose", publicName: "showClose", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", opened: "opened", closed: "closed" }, viewQueries: [{ propertyName: "dialogEl", first: true, predicate: ["dialogEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<dialog\n  #dialogEl\n  class=\"ea-dialog\"\n  [id]=\"id()\"\n  [attr.aria-label]=\"ariaLabel() ?? null\"\n  [attr.aria-labelledby]=\"!ariaLabel() ? id() + '-header' : null\"\n  (click)=\"handleBackdropClick($event)\"\n  (cancel)=\"handleCancel($event)\">\n  <div\n    class=\"ea-dialog__panel\"\n    [ngClass]=\"panelClasses()\">\n    @if (showClose()) {\n      <button\n        type=\"button\"\n        class=\"ea-dialog__close\"\n        [attr.aria-label]=\"i18n.messages().dialog.close\"\n        (click)=\"handleClose()\">\n        <ea-icon-x />\n      </button>\n    }\n\n    <div\n      class=\"ea-dialog__header\"\n      [id]=\"id() + '-header'\">\n      <ng-content select=\"[slot=header]\" />\n    </div>\n\n    <div class=\"ea-dialog__body\">\n      <ng-content />\n    </div>\n\n    <div class=\"ea-dialog__footer\">\n      <ng-content select=\"[slot=footer]\" />\n    </div>\n  </div>\n</dialog>\n", styles: [".ea-dialog{border:none;background:transparent;padding:0;margin:auto;max-width:none;max-height:none;overflow:visible}.ea-dialog::backdrop{background-color:var(--color-bg-overlay)}.ea-dialog__panel{position:relative;display:flex;flex-direction:column;background-color:var(--color-bg-elevated);border-radius:var(--radius-xl);box-shadow:var(--shadow-2xl);max-height:85vh;overflow:hidden}.ea-dialog__panel--xs{width:20rem}.ea-dialog__panel--sm{width:24rem}.ea-dialog__panel--md{width:32rem}.ea-dialog__panel--lg{width:42rem}.ea-dialog__panel--xl{width:52rem}.ea-dialog__panel--full{width:calc(100vw - 2rem);height:calc(100vh - 2rem);max-height:calc(100vh - 2rem)}.ea-dialog__close{z-index:1;position:absolute;top:var(--space-3);right:var(--space-3);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-dialog__close>*{font-size:1.25em}.ea-dialog__close:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-dialog__close:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-dialog__close:disabled{cursor:not-allowed;opacity:.5}.ea-dialog__close svg{width:1em;height:1em}.ea-dialog__header{padding:var(--space-5) var(--space-6) var(--space-3);font-size:var(--text-h4-size);font-weight:var(--text-h4-weight);line-height:var(--text-h4-lh);color:var(--color-text-primary)}.ea-dialog__header:empty{display:none}.ea-dialog__body{flex:1;padding:var(--space-3) var(--space-6);overflow-y:auto;font-size:var(--font-size-sm);line-height:var(--line-height-normal);color:var(--color-text-secondary)}.ea-dialog__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);padding:var(--space-3) var(--space-6) var(--space-5)}.ea-dialog__footer>*{display:flex;align-items:center;gap:var(--space-3)}.ea-dialog__footer:empty{display:none}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: XIconComponent, selector: "ea-icon-x" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: DialogComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ea-dialog', imports: [NgClass, XIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<dialog\n  #dialogEl\n  class=\"ea-dialog\"\n  [id]=\"id()\"\n  [attr.aria-label]=\"ariaLabel() ?? null\"\n  [attr.aria-labelledby]=\"!ariaLabel() ? id() + '-header' : null\"\n  (click)=\"handleBackdropClick($event)\"\n  (cancel)=\"handleCancel($event)\">\n  <div\n    class=\"ea-dialog__panel\"\n    [ngClass]=\"panelClasses()\">\n    @if (showClose()) {\n      <button\n        type=\"button\"\n        class=\"ea-dialog__close\"\n        [attr.aria-label]=\"i18n.messages().dialog.close\"\n        (click)=\"handleClose()\">\n        <ea-icon-x />\n      </button>\n    }\n\n    <div\n      class=\"ea-dialog__header\"\n      [id]=\"id() + '-header'\">\n      <ng-content select=\"[slot=header]\" />\n    </div>\n\n    <div class=\"ea-dialog__body\">\n      <ng-content />\n    </div>\n\n    <div class=\"ea-dialog__footer\">\n      <ng-content select=\"[slot=footer]\" />\n    </div>\n  </div>\n</dialog>\n", styles: [".ea-dialog{border:none;background:transparent;padding:0;margin:auto;max-width:none;max-height:none;overflow:visible}.ea-dialog::backdrop{background-color:var(--color-bg-overlay)}.ea-dialog__panel{position:relative;display:flex;flex-direction:column;background-color:var(--color-bg-elevated);border-radius:var(--radius-xl);box-shadow:var(--shadow-2xl);max-height:85vh;overflow:hidden}.ea-dialog__panel--xs{width:20rem}.ea-dialog__panel--sm{width:24rem}.ea-dialog__panel--md{width:32rem}.ea-dialog__panel--lg{width:42rem}.ea-dialog__panel--xl{width:52rem}.ea-dialog__panel--full{width:calc(100vw - 2rem);height:calc(100vh - 2rem);max-height:calc(100vh - 2rem)}.ea-dialog__close{z-index:1;position:absolute;top:var(--space-3);right:var(--space-3);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-dialog__close>*{font-size:1.25em}.ea-dialog__close:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-dialog__close:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-dialog__close:disabled{cursor:not-allowed;opacity:.5}.ea-dialog__close svg{width:1em;height:1em}.ea-dialog__header{padding:var(--space-5) var(--space-6) var(--space-3);font-size:var(--text-h4-size);font-weight:var(--text-h4-weight);line-height:var(--text-h4-lh);color:var(--color-text-primary)}.ea-dialog__header:empty{display:none}.ea-dialog__body{flex:1;padding:var(--space-3) var(--space-6);overflow-y:auto;font-size:var(--font-size-sm);line-height:var(--line-height-normal);color:var(--color-text-secondary)}.ea-dialog__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);padding:var(--space-3) var(--space-6) var(--space-5)}.ea-dialog__footer>*{display:flex;align-items:center;gap:var(--space-3)}.ea-dialog__footer:empty{display:none}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { dialogEl: [{ type: i0.ViewChild, args: ['dialogEl', { isSignal: true }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], closeOnBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnBackdrop", required: false }] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], showClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClose", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }] } });
+        }], ctorParameters: () => [], propDecorators: { dialogEl: [{ type: i0.ViewChild, args: ['dialogEl', { isSignal: true }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], closeOnBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnBackdrop", required: false }] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], showClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClose", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }] } });
 
 /**
  * Side panel backed by the native `<dialog>` element for browser-managed
@@ -6274,13 +7073,11 @@ class DrawerComponent {
     previouslyFocused = null;
     i18n = inject(EagamiI18nService);
     position = input('right', ...(ngDevMode ? [{ debugName: "position" }] : /* istanbul ignore next */ []));
-    width = input(undefined, ...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
-    /**
-     * @deprecated Use `width` instead. Will be removed in v3.0.0.
-     */
-    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    width = input('md', ...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
     closeOnBackdrop = input(true, ...(ngDevMode ? [{ debugName: "closeOnBackdrop" }] : /* istanbul ignore next */ []));
     closeOnEscape = input(true, ...(ngDevMode ? [{ debugName: "closeOnEscape" }] : /* istanbul ignore next */ []));
+    /** Slide the panel in from its edge when the drawer opens. */
+    animated = input(false, ...(ngDevMode ? [{ debugName: "animated" }] : /* istanbul ignore next */ []));
     showClose = input(true, ...(ngDevMode ? [{ debugName: "showClose" }] : /* istanbul ignore next */ []));
     ariaLabel = input(undefined, { ...(ngDevMode ? { debugName: "ariaLabel" } : /* istanbul ignore next */ {}), alias: 'aria-label' });
     id = input(uniqueId('ea-drawer'), ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
@@ -6289,11 +7086,9 @@ class DrawerComponent {
     opened = output();
     /** Fires when the drawer closes (via close button, backdrop, or Escape). */
     closed = output();
-    /** Effective panel width, preferring `width` over the deprecated `size`. */
-    resolvedWidth = computed(() => this.width() ?? this.size(), ...(ngDevMode ? [{ debugName: "resolvedWidth" }] : /* istanbul ignore next */ []));
     panelClasses = computed(() => ({
         [`ea-drawer__panel--${this.position()}`]: true,
-        [`ea-drawer__panel--${this.resolvedWidth()}`]: true,
+        [`ea-drawer__panel--${this.width()}`]: true,
     }), ...(ngDevMode ? [{ debugName: "panelClasses" }] : /* istanbul ignore next */ []));
     constructor() {
         effect(() => {
@@ -6337,13 +7132,29 @@ class DrawerComponent {
         }
         this.handleClose();
     }
+    // The native <dialog> can close on its own (e.g. Escape), so reconcile the open
+    // model here. When closeOnEscape is off, Chrome's repeated-Escape abuse
+    // mitigation can force the close past cancel's preventDefault, so re-show to
+    // keep the drawer open; otherwise mirror the close back into the model.
+    onDialogClose() {
+        if (!this.open()) {
+            return;
+        }
+        if (this.closeOnEscape()) {
+            this.open.set(false);
+            this.closed.emit();
+        }
+        else {
+            this.drawerEl()?.nativeElement.showModal();
+        }
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: DrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: DrawerComponent, isStandalone: true, selector: "ea-drawer", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, closeOnBackdrop: { classPropertyName: "closeOnBackdrop", publicName: "closeOnBackdrop", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, showClose: { classPropertyName: "showClose", publicName: "showClose", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", opened: "opened", closed: "closed" }, viewQueries: [{ propertyName: "drawerEl", first: true, predicate: ["drawerEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<dialog\n  #drawerEl\n  class=\"ea-drawer\"\n  [id]=\"id()\"\n  [attr.aria-label]=\"ariaLabel() ?? null\"\n  [attr.aria-labelledby]=\"!ariaLabel() ? id() + '-header' : null\"\n  (click)=\"handleBackdropClick($event)\"\n  (cancel)=\"handleCancel($event)\">\n  <div\n    class=\"ea-drawer__panel\"\n    [ngClass]=\"panelClasses()\">\n    @if (showClose()) {\n      <button\n        type=\"button\"\n        class=\"ea-drawer__close\"\n        [attr.aria-label]=\"i18n.messages().drawer.close\"\n        (click)=\"handleClose()\">\n        <ea-icon-x />\n      </button>\n    }\n\n    <div\n      class=\"ea-drawer__header\"\n      [id]=\"id() + '-header'\">\n      <ng-content select=\"[slot=header]\" />\n    </div>\n\n    <div class=\"ea-drawer__body\">\n      <ng-content />\n    </div>\n\n    <div class=\"ea-drawer__footer\">\n      <ng-content select=\"[slot=footer]\" />\n    </div>\n  </div>\n</dialog>\n", styles: [".ea-drawer{position:fixed;inset:0;width:100vw;max-width:none;height:100vh;max-height:none;padding:0;margin:0;border:none;background:transparent;overflow:hidden}.ea-drawer::backdrop{background-color:var(--color-bg-overlay)}.ea-drawer__panel{position:absolute;display:flex;flex-direction:column;background-color:var(--color-bg-elevated);box-shadow:var(--shadow-2xl);overflow:hidden}.ea-drawer__panel--right{top:0;right:0;bottom:0;height:100%}.ea-drawer__panel--right.ea-drawer__panel--xs{width:16rem}.ea-drawer__panel--right.ea-drawer__panel--sm{width:20rem}.ea-drawer__panel--right.ea-drawer__panel--md{width:28rem}.ea-drawer__panel--right.ea-drawer__panel--lg{width:36rem}.ea-drawer__panel--right.ea-drawer__panel--xl{width:44rem}.ea-drawer__panel--right.ea-drawer__panel--full{width:calc(100vw - 3rem)}.ea-drawer__panel--left{top:0;left:0;bottom:0;height:100%}.ea-drawer__panel--left.ea-drawer__panel--xs{width:16rem}.ea-drawer__panel--left.ea-drawer__panel--sm{width:20rem}.ea-drawer__panel--left.ea-drawer__panel--md{width:28rem}.ea-drawer__panel--left.ea-drawer__panel--lg{width:36rem}.ea-drawer__panel--left.ea-drawer__panel--xl{width:44rem}.ea-drawer__panel--left.ea-drawer__panel--full{width:calc(100vw - 3rem)}.ea-drawer__panel--top{top:0;left:0;right:0;width:100%}.ea-drawer__panel--top.ea-drawer__panel--xs{height:8rem}.ea-drawer__panel--top.ea-drawer__panel--sm{height:12rem}.ea-drawer__panel--top.ea-drawer__panel--md{height:20rem}.ea-drawer__panel--top.ea-drawer__panel--lg{height:28rem}.ea-drawer__panel--top.ea-drawer__panel--xl{height:36rem}.ea-drawer__panel--top.ea-drawer__panel--full{height:calc(100vh - 3rem)}.ea-drawer__panel--bottom{bottom:0;left:0;right:0;width:100%}.ea-drawer__panel--bottom.ea-drawer__panel--xs{height:8rem}.ea-drawer__panel--bottom.ea-drawer__panel--sm{height:12rem}.ea-drawer__panel--bottom.ea-drawer__panel--md{height:20rem}.ea-drawer__panel--bottom.ea-drawer__panel--lg{height:28rem}.ea-drawer__panel--bottom.ea-drawer__panel--xl{height:36rem}.ea-drawer__panel--bottom.ea-drawer__panel--full{height:calc(100vh - 3rem)}.ea-drawer__close{z-index:1;position:absolute;top:var(--space-3);right:var(--space-3);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-drawer__close>*{font-size:1.25em}.ea-drawer__close:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-drawer__close:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-drawer__close:disabled{cursor:not-allowed;opacity:.5}.ea-drawer__close svg{width:1em;height:1em}.ea-drawer__header{padding:var(--space-5) var(--space-6) var(--space-3);font-size:var(--text-h4-size);font-weight:var(--text-h4-weight);line-height:var(--text-h4-lh);color:var(--color-text-primary)}.ea-drawer__header:empty{display:none}.ea-drawer__body{flex:1;padding:var(--space-3) var(--space-6);overflow-y:auto;font-size:var(--font-size-sm);line-height:var(--line-height-normal);color:var(--color-text-secondary)}.ea-drawer__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);padding:var(--space-3) var(--space-6) var(--space-5)}.ea-drawer__footer>*{display:flex;align-items:center;gap:var(--space-3)}.ea-drawer__footer:empty{display:none}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: XIconComponent, selector: "ea-icon-x" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: DrawerComponent, isStandalone: true, selector: "ea-drawer", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, closeOnBackdrop: { classPropertyName: "closeOnBackdrop", publicName: "closeOnBackdrop", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, animated: { classPropertyName: "animated", publicName: "animated", isSignal: true, isRequired: false, transformFunction: null }, showClose: { classPropertyName: "showClose", publicName: "showClose", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", opened: "opened", closed: "closed" }, viewQueries: [{ propertyName: "drawerEl", first: true, predicate: ["drawerEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<dialog\n  #drawerEl\n  class=\"ea-drawer\"\n  [class.ea-drawer--animated]=\"animated()\"\n  [id]=\"id()\"\n  [attr.aria-label]=\"ariaLabel() ?? null\"\n  [attr.aria-labelledby]=\"!ariaLabel() ? id() + '-header' : null\"\n  (click)=\"handleBackdropClick($event)\"\n  (cancel)=\"handleCancel($event)\"\n  (close)=\"onDialogClose()\">\n  <div\n    class=\"ea-drawer__panel\"\n    [ngClass]=\"panelClasses()\">\n    @if (showClose()) {\n      <button\n        type=\"button\"\n        class=\"ea-drawer__close\"\n        [attr.aria-label]=\"i18n.messages().drawer.close\"\n        (click)=\"handleClose()\">\n        <ea-icon-x />\n      </button>\n    }\n\n    <div\n      class=\"ea-drawer__header\"\n      [id]=\"id() + '-header'\">\n      <ng-content select=\"[slot=header]\" />\n    </div>\n\n    <div class=\"ea-drawer__body\">\n      <ng-content />\n    </div>\n\n    <div class=\"ea-drawer__footer\">\n      <ng-content select=\"[slot=footer]\" />\n    </div>\n  </div>\n</dialog>\n", styles: [".ea-drawer{position:fixed;inset:0;width:100vw;max-width:none;height:100vh;max-height:none;padding:0;margin:0;border:none;background:transparent;overflow:hidden}.ea-drawer::backdrop{background-color:var(--color-bg-overlay)}.ea-drawer--animated[open]::backdrop{animation:ea-drawer-backdrop-in var(--duration-slow) var(--ease-out)}.ea-drawer--animated[open] .ea-drawer__panel--right{animation:ea-drawer-slide-right var(--duration-slow) var(--ease-out)}.ea-drawer--animated[open] .ea-drawer__panel--left{animation:ea-drawer-slide-left var(--duration-slow) var(--ease-out)}.ea-drawer--animated[open] .ea-drawer__panel--top{animation:ea-drawer-slide-top var(--duration-slow) var(--ease-out)}.ea-drawer--animated[open] .ea-drawer__panel--bottom{animation:ea-drawer-slide-bottom var(--duration-slow) var(--ease-out)}.ea-drawer__panel{position:absolute;display:flex;flex-direction:column;background-color:var(--color-bg-elevated);box-shadow:var(--shadow-2xl);overflow:hidden}.ea-drawer__panel--right{top:0;right:0;bottom:0;height:100%}.ea-drawer__panel--right.ea-drawer__panel--xs{width:16rem}.ea-drawer__panel--right.ea-drawer__panel--sm{width:20rem}.ea-drawer__panel--right.ea-drawer__panel--md{width:28rem}.ea-drawer__panel--right.ea-drawer__panel--lg{width:36rem}.ea-drawer__panel--right.ea-drawer__panel--xl{width:44rem}.ea-drawer__panel--right.ea-drawer__panel--full{width:calc(100vw - 3rem)}.ea-drawer__panel--left{top:0;left:0;bottom:0;height:100%}.ea-drawer__panel--left.ea-drawer__panel--xs{width:16rem}.ea-drawer__panel--left.ea-drawer__panel--sm{width:20rem}.ea-drawer__panel--left.ea-drawer__panel--md{width:28rem}.ea-drawer__panel--left.ea-drawer__panel--lg{width:36rem}.ea-drawer__panel--left.ea-drawer__panel--xl{width:44rem}.ea-drawer__panel--left.ea-drawer__panel--full{width:calc(100vw - 3rem)}.ea-drawer__panel--top{top:0;left:0;right:0;width:100%}.ea-drawer__panel--top.ea-drawer__panel--xs{height:8rem}.ea-drawer__panel--top.ea-drawer__panel--sm{height:12rem}.ea-drawer__panel--top.ea-drawer__panel--md{height:20rem}.ea-drawer__panel--top.ea-drawer__panel--lg{height:28rem}.ea-drawer__panel--top.ea-drawer__panel--xl{height:36rem}.ea-drawer__panel--top.ea-drawer__panel--full{height:calc(100vh - 3rem)}.ea-drawer__panel--bottom{bottom:0;left:0;right:0;width:100%}.ea-drawer__panel--bottom.ea-drawer__panel--xs{height:8rem}.ea-drawer__panel--bottom.ea-drawer__panel--sm{height:12rem}.ea-drawer__panel--bottom.ea-drawer__panel--md{height:20rem}.ea-drawer__panel--bottom.ea-drawer__panel--lg{height:28rem}.ea-drawer__panel--bottom.ea-drawer__panel--xl{height:36rem}.ea-drawer__panel--bottom.ea-drawer__panel--full{height:calc(100vh - 3rem)}.ea-drawer__panel--top.ea-drawer__panel--sm .ea-drawer__header,.ea-drawer__panel--bottom.ea-drawer__panel--sm .ea-drawer__header{padding-top:var(--space-3)}.ea-drawer__panel--top.ea-drawer__panel--sm .ea-drawer__body,.ea-drawer__panel--bottom.ea-drawer__panel--sm .ea-drawer__body{padding-block:var(--space-2)}.ea-drawer__panel--top.ea-drawer__panel--sm .ea-drawer__footer,.ea-drawer__panel--bottom.ea-drawer__panel--sm .ea-drawer__footer{padding-bottom:var(--space-3)}.ea-drawer__panel--top.ea-drawer__panel--xs .ea-drawer__header,.ea-drawer__panel--bottom.ea-drawer__panel--xs .ea-drawer__header{padding-top:var(--space-2);padding-bottom:var(--space-1)}.ea-drawer__panel--top.ea-drawer__panel--xs .ea-drawer__body,.ea-drawer__panel--bottom.ea-drawer__panel--xs .ea-drawer__body{padding-block:var(--space-1)}.ea-drawer__panel--top.ea-drawer__panel--xs .ea-drawer__footer,.ea-drawer__panel--bottom.ea-drawer__panel--xs .ea-drawer__footer{padding-top:var(--space-1);padding-bottom:var(--space-2)}.ea-drawer__close{z-index:1;position:absolute;top:var(--space-3);right:var(--space-3);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-drawer__close>*{font-size:1.25em}.ea-drawer__close:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-drawer__close:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-drawer__close:disabled{cursor:not-allowed;opacity:.5}.ea-drawer__close svg{width:1em;height:1em}.ea-drawer__header{padding:var(--space-5) var(--space-6) var(--space-3);font-size:var(--text-h4-size);font-weight:var(--text-h4-weight);line-height:var(--text-h4-lh);color:var(--color-text-primary)}.ea-drawer__header:empty{display:none}.ea-drawer__body{flex:1;padding:var(--space-3) var(--space-6);overflow-y:auto;font-size:var(--font-size-sm);line-height:var(--line-height-normal);color:var(--color-text-secondary)}.ea-drawer__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);padding:var(--space-3) var(--space-6) var(--space-5)}.ea-drawer__footer>*{display:flex;align-items:center;gap:var(--space-3)}.ea-drawer__footer:empty{display:none}@keyframes ea-drawer-slide-right{0%{transform:translate(100%)}}@keyframes ea-drawer-slide-left{0%{transform:translate(-100%)}}@keyframes ea-drawer-slide-top{0%{transform:translateY(-100%)}}@keyframes ea-drawer-slide-bottom{0%{transform:translateY(100%)}}@keyframes ea-drawer-backdrop-in{0%{opacity:0}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: XIconComponent, selector: "ea-icon-x" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: DrawerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ea-drawer', imports: [NgClass, XIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<dialog\n  #drawerEl\n  class=\"ea-drawer\"\n  [id]=\"id()\"\n  [attr.aria-label]=\"ariaLabel() ?? null\"\n  [attr.aria-labelledby]=\"!ariaLabel() ? id() + '-header' : null\"\n  (click)=\"handleBackdropClick($event)\"\n  (cancel)=\"handleCancel($event)\">\n  <div\n    class=\"ea-drawer__panel\"\n    [ngClass]=\"panelClasses()\">\n    @if (showClose()) {\n      <button\n        type=\"button\"\n        class=\"ea-drawer__close\"\n        [attr.aria-label]=\"i18n.messages().drawer.close\"\n        (click)=\"handleClose()\">\n        <ea-icon-x />\n      </button>\n    }\n\n    <div\n      class=\"ea-drawer__header\"\n      [id]=\"id() + '-header'\">\n      <ng-content select=\"[slot=header]\" />\n    </div>\n\n    <div class=\"ea-drawer__body\">\n      <ng-content />\n    </div>\n\n    <div class=\"ea-drawer__footer\">\n      <ng-content select=\"[slot=footer]\" />\n    </div>\n  </div>\n</dialog>\n", styles: [".ea-drawer{position:fixed;inset:0;width:100vw;max-width:none;height:100vh;max-height:none;padding:0;margin:0;border:none;background:transparent;overflow:hidden}.ea-drawer::backdrop{background-color:var(--color-bg-overlay)}.ea-drawer__panel{position:absolute;display:flex;flex-direction:column;background-color:var(--color-bg-elevated);box-shadow:var(--shadow-2xl);overflow:hidden}.ea-drawer__panel--right{top:0;right:0;bottom:0;height:100%}.ea-drawer__panel--right.ea-drawer__panel--xs{width:16rem}.ea-drawer__panel--right.ea-drawer__panel--sm{width:20rem}.ea-drawer__panel--right.ea-drawer__panel--md{width:28rem}.ea-drawer__panel--right.ea-drawer__panel--lg{width:36rem}.ea-drawer__panel--right.ea-drawer__panel--xl{width:44rem}.ea-drawer__panel--right.ea-drawer__panel--full{width:calc(100vw - 3rem)}.ea-drawer__panel--left{top:0;left:0;bottom:0;height:100%}.ea-drawer__panel--left.ea-drawer__panel--xs{width:16rem}.ea-drawer__panel--left.ea-drawer__panel--sm{width:20rem}.ea-drawer__panel--left.ea-drawer__panel--md{width:28rem}.ea-drawer__panel--left.ea-drawer__panel--lg{width:36rem}.ea-drawer__panel--left.ea-drawer__panel--xl{width:44rem}.ea-drawer__panel--left.ea-drawer__panel--full{width:calc(100vw - 3rem)}.ea-drawer__panel--top{top:0;left:0;right:0;width:100%}.ea-drawer__panel--top.ea-drawer__panel--xs{height:8rem}.ea-drawer__panel--top.ea-drawer__panel--sm{height:12rem}.ea-drawer__panel--top.ea-drawer__panel--md{height:20rem}.ea-drawer__panel--top.ea-drawer__panel--lg{height:28rem}.ea-drawer__panel--top.ea-drawer__panel--xl{height:36rem}.ea-drawer__panel--top.ea-drawer__panel--full{height:calc(100vh - 3rem)}.ea-drawer__panel--bottom{bottom:0;left:0;right:0;width:100%}.ea-drawer__panel--bottom.ea-drawer__panel--xs{height:8rem}.ea-drawer__panel--bottom.ea-drawer__panel--sm{height:12rem}.ea-drawer__panel--bottom.ea-drawer__panel--md{height:20rem}.ea-drawer__panel--bottom.ea-drawer__panel--lg{height:28rem}.ea-drawer__panel--bottom.ea-drawer__panel--xl{height:36rem}.ea-drawer__panel--bottom.ea-drawer__panel--full{height:calc(100vh - 3rem)}.ea-drawer__close{z-index:1;position:absolute;top:var(--space-3);right:var(--space-3);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-drawer__close>*{font-size:1.25em}.ea-drawer__close:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-drawer__close:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-drawer__close:disabled{cursor:not-allowed;opacity:.5}.ea-drawer__close svg{width:1em;height:1em}.ea-drawer__header{padding:var(--space-5) var(--space-6) var(--space-3);font-size:var(--text-h4-size);font-weight:var(--text-h4-weight);line-height:var(--text-h4-lh);color:var(--color-text-primary)}.ea-drawer__header:empty{display:none}.ea-drawer__body{flex:1;padding:var(--space-3) var(--space-6);overflow-y:auto;font-size:var(--font-size-sm);line-height:var(--line-height-normal);color:var(--color-text-secondary)}.ea-drawer__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);padding:var(--space-3) var(--space-6) var(--space-5)}.ea-drawer__footer>*{display:flex;align-items:center;gap:var(--space-3)}.ea-drawer__footer:empty{display:none}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { drawerEl: [{ type: i0.ViewChild, args: ['drawerEl', { isSignal: true }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], closeOnBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnBackdrop", required: false }] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], showClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClose", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }] } });
+            args: [{ selector: 'ea-drawer', imports: [NgClass, XIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<dialog\n  #drawerEl\n  class=\"ea-drawer\"\n  [class.ea-drawer--animated]=\"animated()\"\n  [id]=\"id()\"\n  [attr.aria-label]=\"ariaLabel() ?? null\"\n  [attr.aria-labelledby]=\"!ariaLabel() ? id() + '-header' : null\"\n  (click)=\"handleBackdropClick($event)\"\n  (cancel)=\"handleCancel($event)\"\n  (close)=\"onDialogClose()\">\n  <div\n    class=\"ea-drawer__panel\"\n    [ngClass]=\"panelClasses()\">\n    @if (showClose()) {\n      <button\n        type=\"button\"\n        class=\"ea-drawer__close\"\n        [attr.aria-label]=\"i18n.messages().drawer.close\"\n        (click)=\"handleClose()\">\n        <ea-icon-x />\n      </button>\n    }\n\n    <div\n      class=\"ea-drawer__header\"\n      [id]=\"id() + '-header'\">\n      <ng-content select=\"[slot=header]\" />\n    </div>\n\n    <div class=\"ea-drawer__body\">\n      <ng-content />\n    </div>\n\n    <div class=\"ea-drawer__footer\">\n      <ng-content select=\"[slot=footer]\" />\n    </div>\n  </div>\n</dialog>\n", styles: [".ea-drawer{position:fixed;inset:0;width:100vw;max-width:none;height:100vh;max-height:none;padding:0;margin:0;border:none;background:transparent;overflow:hidden}.ea-drawer::backdrop{background-color:var(--color-bg-overlay)}.ea-drawer--animated[open]::backdrop{animation:ea-drawer-backdrop-in var(--duration-slow) var(--ease-out)}.ea-drawer--animated[open] .ea-drawer__panel--right{animation:ea-drawer-slide-right var(--duration-slow) var(--ease-out)}.ea-drawer--animated[open] .ea-drawer__panel--left{animation:ea-drawer-slide-left var(--duration-slow) var(--ease-out)}.ea-drawer--animated[open] .ea-drawer__panel--top{animation:ea-drawer-slide-top var(--duration-slow) var(--ease-out)}.ea-drawer--animated[open] .ea-drawer__panel--bottom{animation:ea-drawer-slide-bottom var(--duration-slow) var(--ease-out)}.ea-drawer__panel{position:absolute;display:flex;flex-direction:column;background-color:var(--color-bg-elevated);box-shadow:var(--shadow-2xl);overflow:hidden}.ea-drawer__panel--right{top:0;right:0;bottom:0;height:100%}.ea-drawer__panel--right.ea-drawer__panel--xs{width:16rem}.ea-drawer__panel--right.ea-drawer__panel--sm{width:20rem}.ea-drawer__panel--right.ea-drawer__panel--md{width:28rem}.ea-drawer__panel--right.ea-drawer__panel--lg{width:36rem}.ea-drawer__panel--right.ea-drawer__panel--xl{width:44rem}.ea-drawer__panel--right.ea-drawer__panel--full{width:calc(100vw - 3rem)}.ea-drawer__panel--left{top:0;left:0;bottom:0;height:100%}.ea-drawer__panel--left.ea-drawer__panel--xs{width:16rem}.ea-drawer__panel--left.ea-drawer__panel--sm{width:20rem}.ea-drawer__panel--left.ea-drawer__panel--md{width:28rem}.ea-drawer__panel--left.ea-drawer__panel--lg{width:36rem}.ea-drawer__panel--left.ea-drawer__panel--xl{width:44rem}.ea-drawer__panel--left.ea-drawer__panel--full{width:calc(100vw - 3rem)}.ea-drawer__panel--top{top:0;left:0;right:0;width:100%}.ea-drawer__panel--top.ea-drawer__panel--xs{height:8rem}.ea-drawer__panel--top.ea-drawer__panel--sm{height:12rem}.ea-drawer__panel--top.ea-drawer__panel--md{height:20rem}.ea-drawer__panel--top.ea-drawer__panel--lg{height:28rem}.ea-drawer__panel--top.ea-drawer__panel--xl{height:36rem}.ea-drawer__panel--top.ea-drawer__panel--full{height:calc(100vh - 3rem)}.ea-drawer__panel--bottom{bottom:0;left:0;right:0;width:100%}.ea-drawer__panel--bottom.ea-drawer__panel--xs{height:8rem}.ea-drawer__panel--bottom.ea-drawer__panel--sm{height:12rem}.ea-drawer__panel--bottom.ea-drawer__panel--md{height:20rem}.ea-drawer__panel--bottom.ea-drawer__panel--lg{height:28rem}.ea-drawer__panel--bottom.ea-drawer__panel--xl{height:36rem}.ea-drawer__panel--bottom.ea-drawer__panel--full{height:calc(100vh - 3rem)}.ea-drawer__panel--top.ea-drawer__panel--sm .ea-drawer__header,.ea-drawer__panel--bottom.ea-drawer__panel--sm .ea-drawer__header{padding-top:var(--space-3)}.ea-drawer__panel--top.ea-drawer__panel--sm .ea-drawer__body,.ea-drawer__panel--bottom.ea-drawer__panel--sm .ea-drawer__body{padding-block:var(--space-2)}.ea-drawer__panel--top.ea-drawer__panel--sm .ea-drawer__footer,.ea-drawer__panel--bottom.ea-drawer__panel--sm .ea-drawer__footer{padding-bottom:var(--space-3)}.ea-drawer__panel--top.ea-drawer__panel--xs .ea-drawer__header,.ea-drawer__panel--bottom.ea-drawer__panel--xs .ea-drawer__header{padding-top:var(--space-2);padding-bottom:var(--space-1)}.ea-drawer__panel--top.ea-drawer__panel--xs .ea-drawer__body,.ea-drawer__panel--bottom.ea-drawer__panel--xs .ea-drawer__body{padding-block:var(--space-1)}.ea-drawer__panel--top.ea-drawer__panel--xs .ea-drawer__footer,.ea-drawer__panel--bottom.ea-drawer__panel--xs .ea-drawer__footer{padding-top:var(--space-1);padding-bottom:var(--space-2)}.ea-drawer__close{z-index:1;position:absolute;top:var(--space-3);right:var(--space-3);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-drawer__close>*{font-size:1.25em}.ea-drawer__close:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-drawer__close:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-drawer__close:disabled{cursor:not-allowed;opacity:.5}.ea-drawer__close svg{width:1em;height:1em}.ea-drawer__header{padding:var(--space-5) var(--space-6) var(--space-3);font-size:var(--text-h4-size);font-weight:var(--text-h4-weight);line-height:var(--text-h4-lh);color:var(--color-text-primary)}.ea-drawer__header:empty{display:none}.ea-drawer__body{flex:1;padding:var(--space-3) var(--space-6);overflow-y:auto;font-size:var(--font-size-sm);line-height:var(--line-height-normal);color:var(--color-text-secondary)}.ea-drawer__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);padding:var(--space-3) var(--space-6) var(--space-5)}.ea-drawer__footer>*{display:flex;align-items:center;gap:var(--space-3)}.ea-drawer__footer:empty{display:none}@keyframes ea-drawer-slide-right{0%{transform:translate(100%)}}@keyframes ea-drawer-slide-left{0%{transform:translate(-100%)}}@keyframes ea-drawer-slide-top{0%{transform:translateY(-100%)}}@keyframes ea-drawer-slide-bottom{0%{transform:translateY(100%)}}@keyframes ea-drawer-backdrop-in{0%{opacity:0}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { drawerEl: [{ type: i0.ViewChild, args: ['drawerEl', { isSignal: true }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], closeOnBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnBackdrop", required: false }] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], animated: [{ type: i0.Input, args: [{ isSignal: true, alias: "animated", required: false }] }], showClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClose", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }] } });
 
 /**
  * Single-select dropdown with a custom popup list. Supports keyboard
@@ -6905,27 +7716,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
  */
 class EagamiWordmarkComponent {
     i18n = inject(EagamiI18nService);
-    /**
-     * Content variant. The numeric values `1`/`2`/`3` are accepted as deprecated
-     * aliases for `default`/`byline`/`tagline` and are removed in v3.0.0.
-     */
+    /** Content variant. */
     variant = input('default', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
     layout = input('stacked', ...(ngDevMode ? [{ debugName: "layout" }] : /* istanbul ignore next */ []));
     size = input(48, ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    /** Collapses the deprecated numeric variants to the string form. */
-    resolvedVariant = computed(() => {
-        const variant = this.variant();
-        switch (variant) {
-            case 1:
-                return 'default';
-            case 2:
-                return 'byline';
-            case 3:
-                return 'tagline';
-            default:
-                return variant;
-        }
-    }, ...(ngDevMode ? [{ debugName: "resolvedVariant" }] : /* istanbul ignore next */ []));
     /** Clamps size to a 10px floor and falls back to the default when cleared. */
     resolvedSize = computed(() => {
         const raw = this.size();
@@ -6935,14 +7729,14 @@ class EagamiWordmarkComponent {
         }
         return Math.max(10, value);
     }, ...(ngDevMode ? [{ debugName: "resolvedSize" }] : /* istanbul ignore next */ []));
-    showOverline = computed(() => this.resolvedVariant() === 'byline', ...(ngDevMode ? [{ debugName: "showOverline" }] : /* istanbul ignore next */ []));
-    showTagline = computed(() => this.resolvedVariant() === 'tagline', ...(ngDevMode ? [{ debugName: "showTagline" }] : /* istanbul ignore next */ []));
+    showOverline = computed(() => this.variant() === 'byline', ...(ngDevMode ? [{ debugName: "showOverline" }] : /* istanbul ignore next */ []));
+    showTagline = computed(() => this.variant() === 'tagline', ...(ngDevMode ? [{ debugName: "showTagline" }] : /* istanbul ignore next */ []));
     brandText = computed(() => 'eagami', ...(ngDevMode ? [{ debugName: "brandText" }] : /* istanbul ignore next */ []));
     // The brand name itself stays untranslated; only the descriptive overline
     // and tagline localize.
     ariaLabel = computed(() => {
         const messages = this.i18n.messages().wordmark;
-        switch (this.resolvedVariant()) {
+        switch (this.variant()) {
             case 'default':
                 return 'eagami';
             case 'byline':
@@ -8126,6 +8920,17 @@ class InputComponent {
                 this.inputEl()?.nativeElement.focus();
             }
         }, { injector: this.injector });
+        // A `[value]` binding that reverts to the value Angular last wrote (e.g. a
+        // parent re-applying its default after the field is cleared) leaves the DOM
+        // showing the stale user edit, since the bound expression looks unchanged.
+        // Reconcile the element to the model so a controlled value always reflects.
+        effect(() => {
+            const el = this.inputEl()?.nativeElement;
+            const next = this.value();
+            if (el && el.value !== next) {
+                el.value = next;
+            }
+        });
     }
     writeValue(val) {
         this.value.set(val ?? '');
@@ -8258,6 +9063,8 @@ class MenuComponent {
     i18n = inject(EagamiI18nService);
     listEl = viewChild('listEl', ...(ngDevMode ? [{ debugName: "listEl" }] : /* istanbul ignore next */ []));
     placement = input('bottom-start', ...(ngDevMode ? [{ debugName: "placement" }] : /* istanbul ignore next */ []));
+    /** Max height of the scrollable list as a CSS length; tall menus scroll past it. */
+    maxHeight = input('20rem', ...(ngDevMode ? [{ debugName: "maxHeight" }] : /* istanbul ignore next */ []));
     disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     ariaLabel = input(undefined, { ...(ngDevMode ? { debugName: "ariaLabel" } : /* istanbul ignore next */ {}), alias: 'aria-label' });
     id = input(uniqueId('ea-menu'), ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
@@ -8375,12 +9182,12 @@ class MenuComponent {
         this.close(true);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: MenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.16", type: MenuComponent, isStandalone: true, selector: "ea-menu", inputs: { placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", opened: "opened", closed: "closed" }, host: { listeners: { "document:keydown": "onKeydown($event)", "document:keydown.escape": "onEscape()" } }, viewQueries: [{ propertyName: "listEl", first: true, predicate: ["listEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<ea-popover\n  [anchor]=\"triggerEl()\"\n  [open]=\"open()\"\n  [placement]=\"placement()\"\n  role=\"menu\"\n  [surfaceId]=\"id()\"\n  [ariaLabel]=\"resolvedAriaLabel()\"\n  [closeOnEscape]=\"false\"\n  scrollBehavior=\"reposition\"\n  (closeRequested)=\"onPopoverCloseRequested()\">\n  <div\n    #listEl\n    class=\"ea-menu__list\">\n    <ng-content />\n  </div>\n</ea-popover>\n", styles: [":host{display:contents}.ea-menu__list{min-width:10rem;max-height:20rem;padding:var(--space-1) 0;overflow-y:auto;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);background-color:var(--color-bg-elevated)}\n"], dependencies: [{ kind: "component", type: PopoverComponent, selector: "ea-popover", inputs: ["anchor", "open", "placement", "role", "aria-label", "surfaceId", "offset", "flip", "clamp", "matchAnchorWidth", "closeOnOutsideClick", "closeOnEscape", "scrollBehavior"], outputs: ["closeRequested"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.16", type: MenuComponent, isStandalone: true, selector: "ea-menu", inputs: { placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", opened: "opened", closed: "closed" }, host: { listeners: { "document:keydown": "onKeydown($event)", "document:keydown.escape": "onEscape()" } }, viewQueries: [{ propertyName: "listEl", first: true, predicate: ["listEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<ea-popover\n  [anchor]=\"triggerEl()\"\n  [open]=\"open()\"\n  [placement]=\"placement()\"\n  role=\"menu\"\n  [surfaceId]=\"id()\"\n  [ariaLabel]=\"resolvedAriaLabel()\"\n  [closeOnEscape]=\"false\"\n  scrollBehavior=\"reposition\"\n  (closeRequested)=\"onPopoverCloseRequested()\">\n  <div\n    #listEl\n    class=\"ea-menu__list\"\n    [style.max-height]=\"maxHeight()\">\n    <ng-content />\n  </div>\n</ea-popover>\n", styles: [":host{display:contents}.ea-menu__list{min-width:10rem;padding:var(--space-1) 0;overflow-y:auto;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);background-color:var(--color-bg-elevated)}\n"], dependencies: [{ kind: "component", type: PopoverComponent, selector: "ea-popover", inputs: ["anchor", "open", "placement", "role", "aria-label", "surfaceId", "offset", "flip", "clamp", "matchAnchorWidth", "closeOnOutsideClick", "closeOnEscape", "scrollBehavior"], outputs: ["closeRequested"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: MenuComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ea-menu', imports: [PopoverComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ea-popover\n  [anchor]=\"triggerEl()\"\n  [open]=\"open()\"\n  [placement]=\"placement()\"\n  role=\"menu\"\n  [surfaceId]=\"id()\"\n  [ariaLabel]=\"resolvedAriaLabel()\"\n  [closeOnEscape]=\"false\"\n  scrollBehavior=\"reposition\"\n  (closeRequested)=\"onPopoverCloseRequested()\">\n  <div\n    #listEl\n    class=\"ea-menu__list\">\n    <ng-content />\n  </div>\n</ea-popover>\n", styles: [":host{display:contents}.ea-menu__list{min-width:10rem;max-height:20rem;padding:var(--space-1) 0;overflow-y:auto;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);background-color:var(--color-bg-elevated)}\n"] }]
-        }], propDecorators: { listEl: [{ type: i0.ViewChild, args: ['listEl', { isSignal: true }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }], onKeydown: [{
+            args: [{ selector: 'ea-menu', imports: [PopoverComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ea-popover\n  [anchor]=\"triggerEl()\"\n  [open]=\"open()\"\n  [placement]=\"placement()\"\n  role=\"menu\"\n  [surfaceId]=\"id()\"\n  [ariaLabel]=\"resolvedAriaLabel()\"\n  [closeOnEscape]=\"false\"\n  scrollBehavior=\"reposition\"\n  (closeRequested)=\"onPopoverCloseRequested()\">\n  <div\n    #listEl\n    class=\"ea-menu__list\"\n    [style.max-height]=\"maxHeight()\">\n    <ng-content />\n  </div>\n</ea-popover>\n", styles: [":host{display:contents}.ea-menu__list{min-width:10rem;padding:var(--space-1) 0;overflow-y:auto;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);background-color:var(--color-bg-elevated)}\n"] }]
+        }], propDecorators: { listEl: [{ type: i0.ViewChild, args: ['listEl', { isSignal: true }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }], onKeydown: [{
                 type: HostListener,
                 args: ['document:keydown', ['$event']]
             }], onEscape: [{
@@ -8409,11 +9216,11 @@ class MenuItemComponent {
         this.menu?.close(true);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: MenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.16", type: MenuItemComponent, isStandalone: true, selector: "ea-menu-item", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<button\n  type=\"button\"\n  class=\"ea-menu-item\"\n  role=\"menuitem\"\n  [class.ea-menu-item--disabled]=\"disabled()\"\n  [class.ea-menu-item--danger]=\"variant() === 'danger'\"\n  [disabled]=\"disabled()\"\n  (click)=\"handleClick($event)\">\n  <span class=\"ea-menu-item__icon\">\n    <ng-content select=\"[slot=icon]\" />\n  </span>\n  <span class=\"ea-menu-item__label\">\n    <ng-content />\n  </span>\n</button>\n", styles: [".ea-menu-item{display:flex;align-items:center;gap:var(--space-2);width:100%;padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm);font-family:var(--font-family-sans);text-align:left;border:none;background:transparent;color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-menu-item:hover:not(.ea-menu-item--disabled),.ea-menu-item:focus-visible:not(.ea-menu-item--disabled){background-color:var(--color-bg-muted)}.ea-menu-item:focus-visible{outline:none}.ea-menu-item--danger{color:var(--color-error-default)}.ea-menu-item--danger:hover:not(.ea-menu-item--disabled),.ea-menu-item--danger:focus-visible:not(.ea-menu-item--disabled){background-color:var(--color-error-subtle, var(--color-bg-muted))}.ea-menu-item--disabled{color:var(--color-text-disabled);cursor:not-allowed}.ea-menu-item__icon{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:1rem;height:1rem;color:inherit}.ea-menu-item__icon>*{width:1rem;height:1rem}.ea-menu-item__icon:empty{display:none}.ea-menu-item__label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.16", type: MenuItemComponent, isStandalone: true, selector: "ea-menu-item", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<button\n  type=\"button\"\n  class=\"ea-menu-item\"\n  role=\"menuitem\"\n  [class.ea-menu-item--disabled]=\"disabled()\"\n  [class.ea-menu-item--danger]=\"variant() === 'danger'\"\n  [disabled]=\"disabled()\"\n  (click)=\"handleClick($event)\">\n  <span class=\"ea-menu-item__icon\">\n    <ng-content select=\"[slot=icon]\" />\n  </span>\n  <span class=\"ea-menu-item__label\">\n    <ng-content />\n  </span>\n</button>\n", styles: [".ea-menu-item{display:flex;align-items:center;gap:var(--space-2);width:100%;padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm);font-family:var(--font-family-sans);text-align:left;border:none;background:transparent;color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-menu-item:hover:not(.ea-menu-item--disabled),.ea-menu-item:focus-visible:not(.ea-menu-item--disabled){background-color:var(--color-state-hover)}.ea-menu-item:focus-visible{outline:none}.ea-menu-item--danger{color:var(--color-error-default)}.ea-menu-item--danger:hover:not(.ea-menu-item--disabled),.ea-menu-item--danger:focus-visible:not(.ea-menu-item--disabled){background-color:var(--color-error-subtle, var(--color-bg-muted))}.ea-menu-item--disabled{color:var(--color-text-disabled);cursor:not-allowed}.ea-menu-item__icon{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:1rem;height:1rem;color:inherit}.ea-menu-item__icon>*{width:1rem;height:1rem}.ea-menu-item__icon:empty{display:none}.ea-menu-item__label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: MenuItemComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ea-menu-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n  type=\"button\"\n  class=\"ea-menu-item\"\n  role=\"menuitem\"\n  [class.ea-menu-item--disabled]=\"disabled()\"\n  [class.ea-menu-item--danger]=\"variant() === 'danger'\"\n  [disabled]=\"disabled()\"\n  (click)=\"handleClick($event)\">\n  <span class=\"ea-menu-item__icon\">\n    <ng-content select=\"[slot=icon]\" />\n  </span>\n  <span class=\"ea-menu-item__label\">\n    <ng-content />\n  </span>\n</button>\n", styles: [".ea-menu-item{display:flex;align-items:center;gap:var(--space-2);width:100%;padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm);font-family:var(--font-family-sans);text-align:left;border:none;background:transparent;color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-menu-item:hover:not(.ea-menu-item--disabled),.ea-menu-item:focus-visible:not(.ea-menu-item--disabled){background-color:var(--color-bg-muted)}.ea-menu-item:focus-visible{outline:none}.ea-menu-item--danger{color:var(--color-error-default)}.ea-menu-item--danger:hover:not(.ea-menu-item--disabled),.ea-menu-item--danger:focus-visible:not(.ea-menu-item--disabled){background-color:var(--color-error-subtle, var(--color-bg-muted))}.ea-menu-item--disabled{color:var(--color-text-disabled);cursor:not-allowed}.ea-menu-item__icon{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:1rem;height:1rem;color:inherit}.ea-menu-item__icon>*{width:1rem;height:1rem}.ea-menu-item__icon:empty{display:none}.ea-menu-item__label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"] }]
+            args: [{ selector: 'ea-menu-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n  type=\"button\"\n  class=\"ea-menu-item\"\n  role=\"menuitem\"\n  [class.ea-menu-item--disabled]=\"disabled()\"\n  [class.ea-menu-item--danger]=\"variant() === 'danger'\"\n  [disabled]=\"disabled()\"\n  (click)=\"handleClick($event)\">\n  <span class=\"ea-menu-item__icon\">\n    <ng-content select=\"[slot=icon]\" />\n  </span>\n  <span class=\"ea-menu-item__label\">\n    <ng-content />\n  </span>\n</button>\n", styles: [".ea-menu-item{display:flex;align-items:center;gap:var(--space-2);width:100%;padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm);font-family:var(--font-family-sans);text-align:left;border:none;background:transparent;color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-menu-item:hover:not(.ea-menu-item--disabled),.ea-menu-item:focus-visible:not(.ea-menu-item--disabled){background-color:var(--color-state-hover)}.ea-menu-item:focus-visible{outline:none}.ea-menu-item--danger{color:var(--color-error-default)}.ea-menu-item--danger:hover:not(.ea-menu-item--disabled),.ea-menu-item--danger:focus-visible:not(.ea-menu-item--disabled){background-color:var(--color-error-subtle, var(--color-bg-muted))}.ea-menu-item--disabled{color:var(--color-text-disabled);cursor:not-allowed}.ea-menu-item__icon{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:1rem;height:1rem;color:inherit}.ea-menu-item__icon>*{width:1rem;height:1rem}.ea-menu-item__icon:empty{display:none}.ea-menu-item__label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"] }]
         }], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], clicked: [{ type: i0.Output, args: ["clicked"] }] } });
 
 /**
@@ -8525,8 +9332,8 @@ class MultiSelectComponent {
     searchable = input(true, ...(ngDevMode ? [{ debugName: "searchable" }] : /* istanbul ignore next */ []));
     /** Toggle the "Select all" row at the top of the option list. */
     selectAll = input(true, ...(ngDevMode ? [{ debugName: "selectAll" }] : /* istanbul ignore next */ []));
-    /** Max number of chips shown inside the trigger; the rest collapse into a "+N more" pill. `0` removes the cap. */
-    maxVisibleChips = input(3, ...(ngDevMode ? [{ debugName: "maxVisibleChips" }] : /* istanbul ignore next */ []));
+    /** Max number of chips shown inside the trigger; the rest collapse into a "+N more" pill. `0` removes the cap so every chip shows and the row scrolls horizontally. */
+    maxVisibleChips = input(0, ...(ngDevMode ? [{ debugName: "maxVisibleChips" }] : /* istanbul ignore next */ []));
     id = input(uniqueId('ea-multi-select'), ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
     /** Selected option values, in the original options order. */
     value = model([], ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
@@ -8806,7 +9613,7 @@ class MultiSelectComponent {
                 useExisting: forwardRef(() => MultiSelectComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "triggerEl", first: true, predicate: ["triggerEl"], descendants: true, isSignal: true }, { propertyName: "searchEl", first: true, predicate: ["searchEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ea-multi-select-field\">\n  @if (label(); as labelText) {\n    <ea-field-label\n      [text]=\"labelText\"\n      [forId]=\"id()\"\n      [labelId]=\"id() + '-label'\"\n      [required]=\"required()\" />\n  }\n\n  <div class=\"ea-multi-select\">\n    <div\n      class=\"ea-multi-select__trigger-wrapper\"\n      [ngClass]=\"wrapperClasses()\">\n      <div\n        #triggerEl\n        class=\"ea-multi-select__trigger\"\n        [ngClass]=\"triggerClasses()\"\n        [id]=\"id()\"\n        role=\"combobox\"\n        [attr.tabindex]=\"isDisabled() ? -1 : 0\"\n        [attr.aria-labelledby]=\"label() ? id() + '-label' : null\"\n        [attr.aria-expanded]=\"isOpen()\"\n        [attr.aria-haspopup]=\"'listbox'\"\n        [attr.aria-disabled]=\"isDisabled() || 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        (click)=\"toggle()\"\n        (keydown)=\"handleTriggerKeydown($event)\">\n        <span class=\"ea-multi-select__trigger-content\">\n          @if (!hasValue()) {\n            <span class=\"ea-multi-select__trigger-placeholder\">\n              {{ resolvedPlaceholder() }}\n            </span>\n          } @else {\n            @for (opt of visibleChips(); track opt.value) {\n              <ea-tag\n                [size]=\"size()\"\n                variant=\"default\"\n                [removable]=\"!isDisabled() && !readonly()\"\n                [removeLabel]=\"i18n.messages().multiSelect.removeOption(opt.label)\"\n                (removed)=\"removeChip(opt)\">\n                {{ opt.label }}\n              </ea-tag>\n            }\n            @if (hiddenChipCount() > 0) {\n              <span class=\"ea-multi-select__more\">+{{ hiddenChipCount() }}</span>\n            }\n          }\n        </span>\n        <ea-icon-chevron-down\n          class=\"ea-multi-select__trigger-icon\"\n          aria-hidden=\"true\" />\n      </div>\n      @if (hasValue() && !isDisabled() && !readonly()) {\n        <button\n          type=\"button\"\n          class=\"ea-multi-select__clear\"\n          [attr.aria-label]=\"i18n.messages().multiSelect.clearAll\"\n          (click)=\"clear($event)\">\n          <ea-icon-x\n            class=\"ea-multi-select__clear-icon\"\n            aria-hidden=\"true\" />\n        </button>\n      }\n    </div>\n\n    <ea-popover\n      [anchor]=\"triggerEl\"\n      [open]=\"isOpen()\"\n      placement=\"bottom-start\"\n      role=\"listbox\"\n      [matchAnchorWidth]=\"true\"\n      [closeOnEscape]=\"false\"\n      scrollBehavior=\"reposition\"\n      (closeRequested)=\"onPopoverCloseRequested()\">\n      <div\n        class=\"ea-multi-select__popover\"\n        [ngClass]=\"menuClasses()\">\n        @if (searchable()) {\n          <div class=\"ea-multi-select__search\">\n            <ea-icon-search\n              class=\"ea-multi-select__search-icon\"\n              aria-hidden=\"true\" />\n            <input\n              #searchEl\n              type=\"text\"\n              class=\"ea-multi-select__search-input\"\n              autocomplete=\"off\"\n              [placeholder]=\"resolvedSearchPlaceholder()\"\n              [value]=\"searchTerm()\"\n              (input)=\"onSearchInput($event)\"\n              (keydown)=\"handlePopoverKeydown($event)\" />\n          </div>\n        }\n\n        @if (selectAll() && filteredOptions().length > 0) {\n          <div\n            class=\"ea-multi-select__option ea-multi-select__option--select-all\"\n            (click)=\"toggleSelectAll()\">\n            <ea-checkbox\n              size=\"sm\"\n              [checked]=\"selectAllState() === 'all'\"\n              [indeterminate]=\"selectAllState() === 'some'\"\n              [ariaLabel]=\"i18n.messages().multiSelect.selectAll\" />\n            <span class=\"ea-multi-select__option-label\">\n              {{ i18n.messages().multiSelect.selectAll }}\n            </span>\n          </div>\n        }\n\n        <ul\n          class=\"ea-multi-select__list\"\n          role=\"presentation\">\n          @for (opt of filteredOptions(); track opt.value; let i = $index) {\n            <li\n              class=\"ea-multi-select__option\"\n              [class.ea-multi-select__option--focused]=\"focusedIndex() === i\"\n              [class.ea-multi-select__option--disabled]=\"opt.disabled\"\n              role=\"option\"\n              tabindex=\"-1\"\n              [attr.aria-selected]=\"selectedSet().has(opt.value)\"\n              [attr.aria-disabled]=\"opt.disabled || null\"\n              (click)=\"toggleOption(opt)\"\n              (keydown)=\"handlePopoverKeydown($event)\">\n              <ea-checkbox\n                size=\"sm\"\n                [checked]=\"selectedSet().has(opt.value)\"\n                [disabled]=\"!!opt.disabled\"\n                [ariaLabel]=\"opt.label\" />\n              <span class=\"ea-multi-select__option-label\">\n                {{ opt.label }}\n              </span>\n            </li>\n          } @empty {\n            <li class=\"ea-multi-select__empty\">\n              {{ i18n.messages().multiSelect.searchEmpty }}\n            </li>\n          }\n        </ul>\n      </div>\n    </ea-popover>\n  </div>\n\n  <ea-field-messages\n    [id]=\"id()\"\n    [error]=\"showError() ? errorMsg() : null\"\n    [hint]=\"showHint() ? hint() : null\" />\n</div>\n", styles: [".ea-multi-select-field{display:flex;flex-direction:column;gap:var(--space-1-5)}.ea-multi-select,.ea-multi-select__trigger-wrapper{position:relative}.ea-multi-select__trigger-wrapper--xs{font-size:var(--font-size-xs)}.ea-multi-select__trigger-wrapper--sm{font-size:var(--font-size-sm)}.ea-multi-select__trigger-wrapper--md{font-size:var(--font-size-md)}.ea-multi-select__trigger-wrapper--lg{font-size:var(--font-size-lg)}.ea-multi-select__trigger-wrapper--xl{font-size:var(--font-size-xl)}.ea-multi-select__trigger{display:flex;align-items:center;gap:.5em;width:100%;min-height:2.5em;padding:.375em .75em;text-align:left;font-family:var(--font-family-sans);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);background-color:var(--color-bg-base);color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors),var(--transition-shadow)}.ea-multi-select__trigger:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-multi-select__trigger--xs{font-size:var(--font-size-xs)}.ea-multi-select__trigger--sm{font-size:var(--font-size-sm)}.ea-multi-select__trigger--md{font-size:var(--font-size-md)}.ea-multi-select__trigger--lg{font-size:var(--font-size-lg)}.ea-multi-select__trigger--xl{font-size:var(--font-size-xl)}.ea-multi-select__trigger--open{border-color:var(--color-border-focus);box-shadow:var(--shadow-focus-ring)}.ea-multi-select__trigger--error{border-color:var(--color-error-default)}.ea-multi-select__trigger--error.ea-multi-select__trigger--open{box-shadow:var(--shadow-focus-ring-error)}.ea-multi-select__trigger--disabled{background-color:var(--color-bg-muted);opacity:.6;cursor:not-allowed}.ea-multi-select__trigger-content{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-1);flex:1;min-width:0}.ea-multi-select__trigger-placeholder{color:var(--color-text-tertiary)}.ea-multi-select__trigger-icon{flex-shrink:0;width:1em;height:1em;color:var(--color-text-secondary);transition:var(--transition-transform)}.ea-multi-select__trigger--open .ea-multi-select__trigger-icon{transform:rotate(180deg)}.ea-multi-select__more{display:inline-flex;align-items:center;padding:0 var(--space-1-5);border-radius:var(--radius-lg);background-color:var(--color-bg-muted);font-size:.85em;font-weight:var(--font-weight-medium);color:var(--color-text-secondary)}.ea-multi-select__clear{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-multi-select__clear>*{font-size:1.25em}.ea-multi-select__clear:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-multi-select__clear:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-multi-select__clear:disabled{cursor:not-allowed;opacity:.5}.ea-multi-select__clear{z-index:1;position:absolute;top:50%;right:calc(1em + var(--space-5));transform:translateY(-50%)}.ea-multi-select__clear-icon{width:1em;height:1em}.ea-multi-select__popover{display:flex;flex-direction:column;overflow:hidden;max-height:20rem;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);background-color:var(--color-bg-elevated)}.ea-multi-select__popover--xs{font-size:var(--font-size-xs)}.ea-multi-select__popover--sm{font-size:var(--font-size-sm)}.ea-multi-select__popover--md{font-size:var(--font-size-md)}.ea-multi-select__popover--lg{font-size:var(--font-size-lg)}.ea-multi-select__popover--xl{font-size:var(--font-size-xl)}.ea-multi-select__search{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;padding:var(--space-2) var(--space-3);border-bottom:var(--border-width-thin) solid var(--color-border-default)}.ea-multi-select__search-icon{flex-shrink:0;width:1em;height:1em;color:var(--color-text-tertiary)}.ea-multi-select__search-input{flex:1;min-width:0;padding:0;border:none;background:none;font-family:var(--font-family-sans);font-size:inherit;color:var(--color-text-primary)}.ea-multi-select__search-input::placeholder{color:var(--color-text-tertiary);opacity:1}.ea-multi-select__search-input:focus{outline:none}.ea-multi-select__list{overflow-y:auto;overscroll-behavior:none;flex:1;margin:0;padding:var(--space-1) 0;list-style:none}.ea-multi-select__option{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1-5) var(--space-3);font-size:inherit;font-family:var(--font-family-sans);color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-multi-select__option--focused{background-color:var(--color-state-hover)}.ea-multi-select__option--disabled{color:var(--color-text-disabled);cursor:not-allowed}.ea-multi-select__option--select-all{border-bottom:var(--border-width-thin) solid var(--color-border-default);font-weight:var(--font-weight-medium)}.ea-multi-select__option:hover:not(.ea-multi-select__option--disabled){background-color:var(--color-state-hover)}.ea-multi-select__option ea-checkbox{pointer-events:none;display:inline-flex;align-items:center;line-height:1}.ea-multi-select__option-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ea-multi-select__empty{padding:var(--space-3);font-size:inherit;text-align:center;color:var(--color-text-tertiary);list-style:none}\n"], dependencies: [{ kind: "component", type: CheckboxComponent, selector: "ea-checkbox", inputs: ["label", "count", "hint", "errorMsg", "size", "disabled", "required", "indeterminate", "aria-label", "id", "checked"], outputs: ["checkedChange", "changed"] }, { kind: "component", type: ChevronDownIconComponent, selector: "ea-icon-chevron-down" }, { kind: "component", type: FieldLabelComponent, selector: "ea-field-label", inputs: ["text", "forId", "required", "labelId"] }, { kind: "component", type: FieldMessagesComponent, selector: "ea-field-messages", inputs: ["id", "error", "hint"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: PopoverComponent, selector: "ea-popover", inputs: ["anchor", "open", "placement", "role", "aria-label", "surfaceId", "offset", "flip", "clamp", "matchAnchorWidth", "closeOnOutsideClick", "closeOnEscape", "scrollBehavior"], outputs: ["closeRequested"] }, { kind: "component", type: SearchIconComponent, selector: "ea-icon-search" }, { kind: "component", type: TagComponent, selector: "ea-tag", inputs: ["variant", "size", "removable", "disabled", "removeLabel"], outputs: ["removed"] }, { kind: "component", type: XIconComponent, selector: "ea-icon-x" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        ], viewQueries: [{ propertyName: "triggerEl", first: true, predicate: ["triggerEl"], descendants: true, isSignal: true }, { propertyName: "searchEl", first: true, predicate: ["searchEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ea-multi-select-field\">\n  @if (label(); as labelText) {\n    <ea-field-label\n      [text]=\"labelText\"\n      [forId]=\"id()\"\n      [labelId]=\"id() + '-label'\"\n      [required]=\"required()\" />\n  }\n\n  <div class=\"ea-multi-select\">\n    <div\n      class=\"ea-multi-select__trigger-wrapper\"\n      [ngClass]=\"wrapperClasses()\">\n      <div\n        #triggerEl\n        class=\"ea-multi-select__trigger\"\n        [ngClass]=\"triggerClasses()\"\n        [id]=\"id()\"\n        role=\"combobox\"\n        [attr.tabindex]=\"isDisabled() ? -1 : 0\"\n        [attr.aria-labelledby]=\"label() ? id() + '-label' : null\"\n        [attr.aria-expanded]=\"isOpen()\"\n        [attr.aria-haspopup]=\"'listbox'\"\n        [attr.aria-disabled]=\"isDisabled() || 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        (click)=\"toggle()\"\n        (keydown)=\"handleTriggerKeydown($event)\">\n        <span class=\"ea-multi-select__trigger-content\">\n          @if (!hasValue()) {\n            <span class=\"ea-multi-select__trigger-placeholder\">\n              {{ resolvedPlaceholder() }}\n            </span>\n          } @else {\n            @for (opt of visibleChips(); track opt.value) {\n              <ea-tag\n                [size]=\"size()\"\n                variant=\"default\"\n                [removable]=\"!isDisabled() && !readonly()\"\n                [removeLabel]=\"i18n.messages().multiSelect.removeOption(opt.label)\"\n                (removed)=\"removeChip(opt)\">\n                {{ opt.label }}\n              </ea-tag>\n            }\n            @if (hiddenChipCount() > 0) {\n              <span class=\"ea-multi-select__more\">+{{ hiddenChipCount() }}</span>\n            }\n          }\n        </span>\n      </div>\n      @if (hasValue() && !isDisabled() && !readonly()) {\n        <button\n          type=\"button\"\n          class=\"ea-multi-select__clear\"\n          [attr.aria-label]=\"i18n.messages().multiSelect.clearAll\"\n          (click)=\"clear($event)\">\n          <ea-icon-x\n            class=\"ea-multi-select__clear-icon\"\n            aria-hidden=\"true\" />\n        </button>\n      }\n      <ea-icon-chevron-down\n        class=\"ea-multi-select__trigger-icon\"\n        aria-hidden=\"true\"\n        (click)=\"toggle()\" />\n    </div>\n\n    <ea-popover\n      [anchor]=\"triggerEl\"\n      [open]=\"isOpen()\"\n      placement=\"bottom-start\"\n      role=\"listbox\"\n      [matchAnchorWidth]=\"true\"\n      [closeOnEscape]=\"false\"\n      scrollBehavior=\"reposition\"\n      (closeRequested)=\"onPopoverCloseRequested()\">\n      <div\n        class=\"ea-multi-select__popover\"\n        [ngClass]=\"menuClasses()\">\n        @if (searchable()) {\n          <div class=\"ea-multi-select__search\">\n            <ea-icon-search\n              class=\"ea-multi-select__search-icon\"\n              aria-hidden=\"true\" />\n            <input\n              #searchEl\n              type=\"text\"\n              class=\"ea-multi-select__search-input\"\n              autocomplete=\"off\"\n              [placeholder]=\"resolvedSearchPlaceholder()\"\n              [value]=\"searchTerm()\"\n              (input)=\"onSearchInput($event)\"\n              (keydown)=\"handlePopoverKeydown($event)\" />\n          </div>\n        }\n\n        @if (selectAll() && filteredOptions().length > 0) {\n          <div\n            class=\"ea-multi-select__option ea-multi-select__option--select-all\"\n            (click)=\"toggleSelectAll()\">\n            <ea-checkbox\n              size=\"sm\"\n              [checked]=\"selectAllState() === 'all'\"\n              [indeterminate]=\"selectAllState() === 'some'\"\n              [ariaLabel]=\"i18n.messages().multiSelect.selectAll\" />\n            <span class=\"ea-multi-select__option-label\">\n              {{ i18n.messages().multiSelect.selectAll }}\n            </span>\n          </div>\n        }\n\n        <ul\n          class=\"ea-multi-select__list\"\n          role=\"presentation\">\n          @for (opt of filteredOptions(); track opt.value; let i = $index) {\n            <li\n              class=\"ea-multi-select__option\"\n              [class.ea-multi-select__option--focused]=\"focusedIndex() === i\"\n              [class.ea-multi-select__option--disabled]=\"opt.disabled\"\n              role=\"option\"\n              tabindex=\"-1\"\n              [attr.aria-selected]=\"selectedSet().has(opt.value)\"\n              [attr.aria-disabled]=\"opt.disabled || null\"\n              (click)=\"toggleOption(opt)\"\n              (keydown)=\"handlePopoverKeydown($event)\">\n              <ea-checkbox\n                size=\"sm\"\n                [checked]=\"selectedSet().has(opt.value)\"\n                [disabled]=\"!!opt.disabled\"\n                [ariaLabel]=\"opt.label\" />\n              <span class=\"ea-multi-select__option-label\">\n                {{ opt.label }}\n              </span>\n            </li>\n          } @empty {\n            <li class=\"ea-multi-select__empty\">\n              {{ i18n.messages().multiSelect.searchEmpty }}\n            </li>\n          }\n        </ul>\n      </div>\n    </ea-popover>\n  </div>\n\n  <ea-field-messages\n    [id]=\"id()\"\n    [error]=\"showError() ? errorMsg() : null\"\n    [hint]=\"showHint() ? hint() : null\" />\n</div>\n", styles: [".ea-multi-select-field{display:flex;flex-direction:column;gap:var(--space-1-5)}.ea-multi-select{position:relative}.ea-multi-select__trigger-wrapper{position:relative;display:flex;align-items:center;gap:.5em;width:100%;min-height:2.5em;padding:.375em .75em;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);background-color:var(--color-bg-base);color:var(--color-text-primary);transition:var(--transition-colors),var(--transition-shadow)}.ea-multi-select__trigger-wrapper--xs{font-size:var(--font-size-xs)}.ea-multi-select__trigger-wrapper--sm{font-size:var(--font-size-sm)}.ea-multi-select__trigger-wrapper--md{font-size:var(--font-size-md)}.ea-multi-select__trigger-wrapper--lg{font-size:var(--font-size-lg)}.ea-multi-select__trigger-wrapper--xl{font-size:var(--font-size-xl)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger:focus-visible){box-shadow:var(--shadow-focus-ring)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--open){border-color:var(--color-border-focus);box-shadow:var(--shadow-focus-ring)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--error){border-color:var(--color-error-default)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--error.ea-multi-select__trigger--open){box-shadow:var(--shadow-focus-ring-error)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--disabled){background-color:var(--color-bg-muted);opacity:.6;cursor:not-allowed}.ea-multi-select__trigger{display:flex;align-items:center;flex:1;min-width:0;text-align:left;font-family:var(--font-family-sans);cursor:pointer}.ea-multi-select__trigger:focus-visible{outline:none}.ea-multi-select__trigger--disabled{cursor:not-allowed}.ea-multi-select__trigger-content{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--space-1);flex:1;min-width:0;overflow-x:auto;scrollbar-width:thin}.ea-multi-select__trigger-content ea-tag{flex-shrink:0}.ea-multi-select__trigger-placeholder{color:var(--color-text-tertiary)}.ea-multi-select__trigger-icon{flex-shrink:0;width:1em;height:1em;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-transform)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--open) .ea-multi-select__trigger-icon{transform:rotate(180deg)}.ea-multi-select__more{display:inline-flex;flex-shrink:0;align-items:center;padding:0 var(--space-1-5);border-radius:var(--radius-lg);background-color:var(--color-bg-muted);font-size:.85em;font-weight:var(--font-weight-medium);color:var(--color-text-secondary)}.ea-multi-select__clear{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-multi-select__clear>*{font-size:1.25em}.ea-multi-select__clear:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-multi-select__clear:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-multi-select__clear:disabled{cursor:not-allowed;opacity:.5}.ea-multi-select__clear{flex-shrink:0}.ea-multi-select__clear-icon{width:1em;height:1em}.ea-multi-select__popover{display:flex;flex-direction:column;overflow:hidden;max-height:20rem;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);background-color:var(--color-bg-elevated)}.ea-multi-select__popover--xs{font-size:var(--font-size-xs)}.ea-multi-select__popover--sm{font-size:var(--font-size-sm)}.ea-multi-select__popover--md{font-size:var(--font-size-md)}.ea-multi-select__popover--lg{font-size:var(--font-size-lg)}.ea-multi-select__popover--xl{font-size:var(--font-size-xl)}.ea-multi-select__search{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;padding:var(--space-2) var(--space-3);border-bottom:var(--border-width-thin) solid var(--color-border-default)}.ea-multi-select__search-icon{flex-shrink:0;width:1em;height:1em;color:var(--color-text-tertiary)}.ea-multi-select__search-input{flex:1;min-width:0;padding:0;border:none;background:none;font-family:var(--font-family-sans);font-size:inherit;color:var(--color-text-primary)}.ea-multi-select__search-input::placeholder{color:var(--color-text-tertiary);opacity:1}.ea-multi-select__search-input:focus{outline:none}.ea-multi-select__list{overflow-y:auto;overscroll-behavior:none;flex:1;margin:0;padding:var(--space-1) 0;list-style:none}.ea-multi-select__option{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1-5) var(--space-3);font-size:inherit;font-family:var(--font-family-sans);color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-multi-select__option--focused{background-color:var(--color-state-hover)}.ea-multi-select__option--disabled{color:var(--color-text-disabled);cursor:not-allowed}.ea-multi-select__option--select-all{border-bottom:var(--border-width-thin) solid var(--color-border-default);font-weight:var(--font-weight-medium)}.ea-multi-select__option:hover:not(.ea-multi-select__option--disabled){background-color:var(--color-state-hover)}.ea-multi-select__option ea-checkbox{pointer-events:none;display:inline-flex;align-items:center;line-height:1}.ea-multi-select__option-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ea-multi-select__empty{padding:var(--space-3);font-size:inherit;text-align:center;color:var(--color-text-tertiary);list-style:none}\n"], dependencies: [{ kind: "component", type: CheckboxComponent, selector: "ea-checkbox", inputs: ["label", "count", "hint", "errorMsg", "size", "disabled", "required", "indeterminate", "aria-label", "id", "checked"], outputs: ["checkedChange", "changed"] }, { kind: "component", type: ChevronDownIconComponent, selector: "ea-icon-chevron-down" }, { kind: "component", type: FieldLabelComponent, selector: "ea-field-label", inputs: ["text", "forId", "required", "labelId"] }, { kind: "component", type: FieldMessagesComponent, selector: "ea-field-messages", inputs: ["id", "error", "hint"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: PopoverComponent, selector: "ea-popover", inputs: ["anchor", "open", "placement", "role", "aria-label", "surfaceId", "offset", "flip", "clamp", "matchAnchorWidth", "closeOnOutsideClick", "closeOnEscape", "scrollBehavior"], outputs: ["closeRequested"] }, { kind: "component", type: SearchIconComponent, selector: "ea-icon-search" }, { kind: "component", type: TagComponent, selector: "ea-tag", inputs: ["variant", "size", "removable", "disabled", "removeLabel"], outputs: ["removed"] }, { kind: "component", type: XIconComponent, selector: "ea-icon-x" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: MultiSelectComponent, decorators: [{
             type: Component,
@@ -8826,7 +9633,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
                             useExisting: forwardRef(() => MultiSelectComponent),
                             multi: true,
                         },
-                    ], template: "<div class=\"ea-multi-select-field\">\n  @if (label(); as labelText) {\n    <ea-field-label\n      [text]=\"labelText\"\n      [forId]=\"id()\"\n      [labelId]=\"id() + '-label'\"\n      [required]=\"required()\" />\n  }\n\n  <div class=\"ea-multi-select\">\n    <div\n      class=\"ea-multi-select__trigger-wrapper\"\n      [ngClass]=\"wrapperClasses()\">\n      <div\n        #triggerEl\n        class=\"ea-multi-select__trigger\"\n        [ngClass]=\"triggerClasses()\"\n        [id]=\"id()\"\n        role=\"combobox\"\n        [attr.tabindex]=\"isDisabled() ? -1 : 0\"\n        [attr.aria-labelledby]=\"label() ? id() + '-label' : null\"\n        [attr.aria-expanded]=\"isOpen()\"\n        [attr.aria-haspopup]=\"'listbox'\"\n        [attr.aria-disabled]=\"isDisabled() || 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        (click)=\"toggle()\"\n        (keydown)=\"handleTriggerKeydown($event)\">\n        <span class=\"ea-multi-select__trigger-content\">\n          @if (!hasValue()) {\n            <span class=\"ea-multi-select__trigger-placeholder\">\n              {{ resolvedPlaceholder() }}\n            </span>\n          } @else {\n            @for (opt of visibleChips(); track opt.value) {\n              <ea-tag\n                [size]=\"size()\"\n                variant=\"default\"\n                [removable]=\"!isDisabled() && !readonly()\"\n                [removeLabel]=\"i18n.messages().multiSelect.removeOption(opt.label)\"\n                (removed)=\"removeChip(opt)\">\n                {{ opt.label }}\n              </ea-tag>\n            }\n            @if (hiddenChipCount() > 0) {\n              <span class=\"ea-multi-select__more\">+{{ hiddenChipCount() }}</span>\n            }\n          }\n        </span>\n        <ea-icon-chevron-down\n          class=\"ea-multi-select__trigger-icon\"\n          aria-hidden=\"true\" />\n      </div>\n      @if (hasValue() && !isDisabled() && !readonly()) {\n        <button\n          type=\"button\"\n          class=\"ea-multi-select__clear\"\n          [attr.aria-label]=\"i18n.messages().multiSelect.clearAll\"\n          (click)=\"clear($event)\">\n          <ea-icon-x\n            class=\"ea-multi-select__clear-icon\"\n            aria-hidden=\"true\" />\n        </button>\n      }\n    </div>\n\n    <ea-popover\n      [anchor]=\"triggerEl\"\n      [open]=\"isOpen()\"\n      placement=\"bottom-start\"\n      role=\"listbox\"\n      [matchAnchorWidth]=\"true\"\n      [closeOnEscape]=\"false\"\n      scrollBehavior=\"reposition\"\n      (closeRequested)=\"onPopoverCloseRequested()\">\n      <div\n        class=\"ea-multi-select__popover\"\n        [ngClass]=\"menuClasses()\">\n        @if (searchable()) {\n          <div class=\"ea-multi-select__search\">\n            <ea-icon-search\n              class=\"ea-multi-select__search-icon\"\n              aria-hidden=\"true\" />\n            <input\n              #searchEl\n              type=\"text\"\n              class=\"ea-multi-select__search-input\"\n              autocomplete=\"off\"\n              [placeholder]=\"resolvedSearchPlaceholder()\"\n              [value]=\"searchTerm()\"\n              (input)=\"onSearchInput($event)\"\n              (keydown)=\"handlePopoverKeydown($event)\" />\n          </div>\n        }\n\n        @if (selectAll() && filteredOptions().length > 0) {\n          <div\n            class=\"ea-multi-select__option ea-multi-select__option--select-all\"\n            (click)=\"toggleSelectAll()\">\n            <ea-checkbox\n              size=\"sm\"\n              [checked]=\"selectAllState() === 'all'\"\n              [indeterminate]=\"selectAllState() === 'some'\"\n              [ariaLabel]=\"i18n.messages().multiSelect.selectAll\" />\n            <span class=\"ea-multi-select__option-label\">\n              {{ i18n.messages().multiSelect.selectAll }}\n            </span>\n          </div>\n        }\n\n        <ul\n          class=\"ea-multi-select__list\"\n          role=\"presentation\">\n          @for (opt of filteredOptions(); track opt.value; let i = $index) {\n            <li\n              class=\"ea-multi-select__option\"\n              [class.ea-multi-select__option--focused]=\"focusedIndex() === i\"\n              [class.ea-multi-select__option--disabled]=\"opt.disabled\"\n              role=\"option\"\n              tabindex=\"-1\"\n              [attr.aria-selected]=\"selectedSet().has(opt.value)\"\n              [attr.aria-disabled]=\"opt.disabled || null\"\n              (click)=\"toggleOption(opt)\"\n              (keydown)=\"handlePopoverKeydown($event)\">\n              <ea-checkbox\n                size=\"sm\"\n                [checked]=\"selectedSet().has(opt.value)\"\n                [disabled]=\"!!opt.disabled\"\n                [ariaLabel]=\"opt.label\" />\n              <span class=\"ea-multi-select__option-label\">\n                {{ opt.label }}\n              </span>\n            </li>\n          } @empty {\n            <li class=\"ea-multi-select__empty\">\n              {{ i18n.messages().multiSelect.searchEmpty }}\n            </li>\n          }\n        </ul>\n      </div>\n    </ea-popover>\n  </div>\n\n  <ea-field-messages\n    [id]=\"id()\"\n    [error]=\"showError() ? errorMsg() : null\"\n    [hint]=\"showHint() ? hint() : null\" />\n</div>\n", styles: [".ea-multi-select-field{display:flex;flex-direction:column;gap:var(--space-1-5)}.ea-multi-select,.ea-multi-select__trigger-wrapper{position:relative}.ea-multi-select__trigger-wrapper--xs{font-size:var(--font-size-xs)}.ea-multi-select__trigger-wrapper--sm{font-size:var(--font-size-sm)}.ea-multi-select__trigger-wrapper--md{font-size:var(--font-size-md)}.ea-multi-select__trigger-wrapper--lg{font-size:var(--font-size-lg)}.ea-multi-select__trigger-wrapper--xl{font-size:var(--font-size-xl)}.ea-multi-select__trigger{display:flex;align-items:center;gap:.5em;width:100%;min-height:2.5em;padding:.375em .75em;text-align:left;font-family:var(--font-family-sans);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);background-color:var(--color-bg-base);color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors),var(--transition-shadow)}.ea-multi-select__trigger:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-multi-select__trigger--xs{font-size:var(--font-size-xs)}.ea-multi-select__trigger--sm{font-size:var(--font-size-sm)}.ea-multi-select__trigger--md{font-size:var(--font-size-md)}.ea-multi-select__trigger--lg{font-size:var(--font-size-lg)}.ea-multi-select__trigger--xl{font-size:var(--font-size-xl)}.ea-multi-select__trigger--open{border-color:var(--color-border-focus);box-shadow:var(--shadow-focus-ring)}.ea-multi-select__trigger--error{border-color:var(--color-error-default)}.ea-multi-select__trigger--error.ea-multi-select__trigger--open{box-shadow:var(--shadow-focus-ring-error)}.ea-multi-select__trigger--disabled{background-color:var(--color-bg-muted);opacity:.6;cursor:not-allowed}.ea-multi-select__trigger-content{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-1);flex:1;min-width:0}.ea-multi-select__trigger-placeholder{color:var(--color-text-tertiary)}.ea-multi-select__trigger-icon{flex-shrink:0;width:1em;height:1em;color:var(--color-text-secondary);transition:var(--transition-transform)}.ea-multi-select__trigger--open .ea-multi-select__trigger-icon{transform:rotate(180deg)}.ea-multi-select__more{display:inline-flex;align-items:center;padding:0 var(--space-1-5);border-radius:var(--radius-lg);background-color:var(--color-bg-muted);font-size:.85em;font-weight:var(--font-weight-medium);color:var(--color-text-secondary)}.ea-multi-select__clear{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-multi-select__clear>*{font-size:1.25em}.ea-multi-select__clear:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-multi-select__clear:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-multi-select__clear:disabled{cursor:not-allowed;opacity:.5}.ea-multi-select__clear{z-index:1;position:absolute;top:50%;right:calc(1em + var(--space-5));transform:translateY(-50%)}.ea-multi-select__clear-icon{width:1em;height:1em}.ea-multi-select__popover{display:flex;flex-direction:column;overflow:hidden;max-height:20rem;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);background-color:var(--color-bg-elevated)}.ea-multi-select__popover--xs{font-size:var(--font-size-xs)}.ea-multi-select__popover--sm{font-size:var(--font-size-sm)}.ea-multi-select__popover--md{font-size:var(--font-size-md)}.ea-multi-select__popover--lg{font-size:var(--font-size-lg)}.ea-multi-select__popover--xl{font-size:var(--font-size-xl)}.ea-multi-select__search{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;padding:var(--space-2) var(--space-3);border-bottom:var(--border-width-thin) solid var(--color-border-default)}.ea-multi-select__search-icon{flex-shrink:0;width:1em;height:1em;color:var(--color-text-tertiary)}.ea-multi-select__search-input{flex:1;min-width:0;padding:0;border:none;background:none;font-family:var(--font-family-sans);font-size:inherit;color:var(--color-text-primary)}.ea-multi-select__search-input::placeholder{color:var(--color-text-tertiary);opacity:1}.ea-multi-select__search-input:focus{outline:none}.ea-multi-select__list{overflow-y:auto;overscroll-behavior:none;flex:1;margin:0;padding:var(--space-1) 0;list-style:none}.ea-multi-select__option{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1-5) var(--space-3);font-size:inherit;font-family:var(--font-family-sans);color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-multi-select__option--focused{background-color:var(--color-state-hover)}.ea-multi-select__option--disabled{color:var(--color-text-disabled);cursor:not-allowed}.ea-multi-select__option--select-all{border-bottom:var(--border-width-thin) solid var(--color-border-default);font-weight:var(--font-weight-medium)}.ea-multi-select__option:hover:not(.ea-multi-select__option--disabled){background-color:var(--color-state-hover)}.ea-multi-select__option ea-checkbox{pointer-events:none;display:inline-flex;align-items:center;line-height:1}.ea-multi-select__option-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ea-multi-select__empty{padding:var(--space-3);font-size:inherit;text-align:center;color:var(--color-text-tertiary);list-style:none}\n"] }]
+                    ], template: "<div class=\"ea-multi-select-field\">\n  @if (label(); as labelText) {\n    <ea-field-label\n      [text]=\"labelText\"\n      [forId]=\"id()\"\n      [labelId]=\"id() + '-label'\"\n      [required]=\"required()\" />\n  }\n\n  <div class=\"ea-multi-select\">\n    <div\n      class=\"ea-multi-select__trigger-wrapper\"\n      [ngClass]=\"wrapperClasses()\">\n      <div\n        #triggerEl\n        class=\"ea-multi-select__trigger\"\n        [ngClass]=\"triggerClasses()\"\n        [id]=\"id()\"\n        role=\"combobox\"\n        [attr.tabindex]=\"isDisabled() ? -1 : 0\"\n        [attr.aria-labelledby]=\"label() ? id() + '-label' : null\"\n        [attr.aria-expanded]=\"isOpen()\"\n        [attr.aria-haspopup]=\"'listbox'\"\n        [attr.aria-disabled]=\"isDisabled() || 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        (click)=\"toggle()\"\n        (keydown)=\"handleTriggerKeydown($event)\">\n        <span class=\"ea-multi-select__trigger-content\">\n          @if (!hasValue()) {\n            <span class=\"ea-multi-select__trigger-placeholder\">\n              {{ resolvedPlaceholder() }}\n            </span>\n          } @else {\n            @for (opt of visibleChips(); track opt.value) {\n              <ea-tag\n                [size]=\"size()\"\n                variant=\"default\"\n                [removable]=\"!isDisabled() && !readonly()\"\n                [removeLabel]=\"i18n.messages().multiSelect.removeOption(opt.label)\"\n                (removed)=\"removeChip(opt)\">\n                {{ opt.label }}\n              </ea-tag>\n            }\n            @if (hiddenChipCount() > 0) {\n              <span class=\"ea-multi-select__more\">+{{ hiddenChipCount() }}</span>\n            }\n          }\n        </span>\n      </div>\n      @if (hasValue() && !isDisabled() && !readonly()) {\n        <button\n          type=\"button\"\n          class=\"ea-multi-select__clear\"\n          [attr.aria-label]=\"i18n.messages().multiSelect.clearAll\"\n          (click)=\"clear($event)\">\n          <ea-icon-x\n            class=\"ea-multi-select__clear-icon\"\n            aria-hidden=\"true\" />\n        </button>\n      }\n      <ea-icon-chevron-down\n        class=\"ea-multi-select__trigger-icon\"\n        aria-hidden=\"true\"\n        (click)=\"toggle()\" />\n    </div>\n\n    <ea-popover\n      [anchor]=\"triggerEl\"\n      [open]=\"isOpen()\"\n      placement=\"bottom-start\"\n      role=\"listbox\"\n      [matchAnchorWidth]=\"true\"\n      [closeOnEscape]=\"false\"\n      scrollBehavior=\"reposition\"\n      (closeRequested)=\"onPopoverCloseRequested()\">\n      <div\n        class=\"ea-multi-select__popover\"\n        [ngClass]=\"menuClasses()\">\n        @if (searchable()) {\n          <div class=\"ea-multi-select__search\">\n            <ea-icon-search\n              class=\"ea-multi-select__search-icon\"\n              aria-hidden=\"true\" />\n            <input\n              #searchEl\n              type=\"text\"\n              class=\"ea-multi-select__search-input\"\n              autocomplete=\"off\"\n              [placeholder]=\"resolvedSearchPlaceholder()\"\n              [value]=\"searchTerm()\"\n              (input)=\"onSearchInput($event)\"\n              (keydown)=\"handlePopoverKeydown($event)\" />\n          </div>\n        }\n\n        @if (selectAll() && filteredOptions().length > 0) {\n          <div\n            class=\"ea-multi-select__option ea-multi-select__option--select-all\"\n            (click)=\"toggleSelectAll()\">\n            <ea-checkbox\n              size=\"sm\"\n              [checked]=\"selectAllState() === 'all'\"\n              [indeterminate]=\"selectAllState() === 'some'\"\n              [ariaLabel]=\"i18n.messages().multiSelect.selectAll\" />\n            <span class=\"ea-multi-select__option-label\">\n              {{ i18n.messages().multiSelect.selectAll }}\n            </span>\n          </div>\n        }\n\n        <ul\n          class=\"ea-multi-select__list\"\n          role=\"presentation\">\n          @for (opt of filteredOptions(); track opt.value; let i = $index) {\n            <li\n              class=\"ea-multi-select__option\"\n              [class.ea-multi-select__option--focused]=\"focusedIndex() === i\"\n              [class.ea-multi-select__option--disabled]=\"opt.disabled\"\n              role=\"option\"\n              tabindex=\"-1\"\n              [attr.aria-selected]=\"selectedSet().has(opt.value)\"\n              [attr.aria-disabled]=\"opt.disabled || null\"\n              (click)=\"toggleOption(opt)\"\n              (keydown)=\"handlePopoverKeydown($event)\">\n              <ea-checkbox\n                size=\"sm\"\n                [checked]=\"selectedSet().has(opt.value)\"\n                [disabled]=\"!!opt.disabled\"\n                [ariaLabel]=\"opt.label\" />\n              <span class=\"ea-multi-select__option-label\">\n                {{ opt.label }}\n              </span>\n            </li>\n          } @empty {\n            <li class=\"ea-multi-select__empty\">\n              {{ i18n.messages().multiSelect.searchEmpty }}\n            </li>\n          }\n        </ul>\n      </div>\n    </ea-popover>\n  </div>\n\n  <ea-field-messages\n    [id]=\"id()\"\n    [error]=\"showError() ? errorMsg() : null\"\n    [hint]=\"showHint() ? hint() : null\" />\n</div>\n", styles: [".ea-multi-select-field{display:flex;flex-direction:column;gap:var(--space-1-5)}.ea-multi-select{position:relative}.ea-multi-select__trigger-wrapper{position:relative;display:flex;align-items:center;gap:.5em;width:100%;min-height:2.5em;padding:.375em .75em;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);background-color:var(--color-bg-base);color:var(--color-text-primary);transition:var(--transition-colors),var(--transition-shadow)}.ea-multi-select__trigger-wrapper--xs{font-size:var(--font-size-xs)}.ea-multi-select__trigger-wrapper--sm{font-size:var(--font-size-sm)}.ea-multi-select__trigger-wrapper--md{font-size:var(--font-size-md)}.ea-multi-select__trigger-wrapper--lg{font-size:var(--font-size-lg)}.ea-multi-select__trigger-wrapper--xl{font-size:var(--font-size-xl)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger:focus-visible){box-shadow:var(--shadow-focus-ring)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--open){border-color:var(--color-border-focus);box-shadow:var(--shadow-focus-ring)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--error){border-color:var(--color-error-default)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--error.ea-multi-select__trigger--open){box-shadow:var(--shadow-focus-ring-error)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--disabled){background-color:var(--color-bg-muted);opacity:.6;cursor:not-allowed}.ea-multi-select__trigger{display:flex;align-items:center;flex:1;min-width:0;text-align:left;font-family:var(--font-family-sans);cursor:pointer}.ea-multi-select__trigger:focus-visible{outline:none}.ea-multi-select__trigger--disabled{cursor:not-allowed}.ea-multi-select__trigger-content{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--space-1);flex:1;min-width:0;overflow-x:auto;scrollbar-width:thin}.ea-multi-select__trigger-content ea-tag{flex-shrink:0}.ea-multi-select__trigger-placeholder{color:var(--color-text-tertiary)}.ea-multi-select__trigger-icon{flex-shrink:0;width:1em;height:1em;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-transform)}.ea-multi-select__trigger-wrapper:has(.ea-multi-select__trigger--open) .ea-multi-select__trigger-icon{transform:rotate(180deg)}.ea-multi-select__more{display:inline-flex;flex-shrink:0;align-items:center;padding:0 var(--space-1-5);border-radius:var(--radius-lg);background-color:var(--color-bg-muted);font-size:.85em;font-weight:var(--font-weight-medium);color:var(--color-text-secondary)}.ea-multi-select__clear{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-multi-select__clear>*{font-size:1.25em}.ea-multi-select__clear:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-multi-select__clear:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-multi-select__clear:disabled{cursor:not-allowed;opacity:.5}.ea-multi-select__clear{flex-shrink:0}.ea-multi-select__clear-icon{width:1em;height:1em}.ea-multi-select__popover{display:flex;flex-direction:column;overflow:hidden;max-height:20rem;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);background-color:var(--color-bg-elevated)}.ea-multi-select__popover--xs{font-size:var(--font-size-xs)}.ea-multi-select__popover--sm{font-size:var(--font-size-sm)}.ea-multi-select__popover--md{font-size:var(--font-size-md)}.ea-multi-select__popover--lg{font-size:var(--font-size-lg)}.ea-multi-select__popover--xl{font-size:var(--font-size-xl)}.ea-multi-select__search{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;padding:var(--space-2) var(--space-3);border-bottom:var(--border-width-thin) solid var(--color-border-default)}.ea-multi-select__search-icon{flex-shrink:0;width:1em;height:1em;color:var(--color-text-tertiary)}.ea-multi-select__search-input{flex:1;min-width:0;padding:0;border:none;background:none;font-family:var(--font-family-sans);font-size:inherit;color:var(--color-text-primary)}.ea-multi-select__search-input::placeholder{color:var(--color-text-tertiary);opacity:1}.ea-multi-select__search-input:focus{outline:none}.ea-multi-select__list{overflow-y:auto;overscroll-behavior:none;flex:1;margin:0;padding:var(--space-1) 0;list-style:none}.ea-multi-select__option{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1-5) var(--space-3);font-size:inherit;font-family:var(--font-family-sans);color:var(--color-text-primary);cursor:pointer;transition:var(--transition-colors)}.ea-multi-select__option--focused{background-color:var(--color-state-hover)}.ea-multi-select__option--disabled{color:var(--color-text-disabled);cursor:not-allowed}.ea-multi-select__option--select-all{border-bottom:var(--border-width-thin) solid var(--color-border-default);font-weight:var(--font-weight-medium)}.ea-multi-select__option:hover:not(.ea-multi-select__option--disabled){background-color:var(--color-state-hover)}.ea-multi-select__option ea-checkbox{pointer-events:none;display:inline-flex;align-items:center;line-height:1}.ea-multi-select__option-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ea-multi-select__empty{padding:var(--space-3);font-size:inherit;text-align:center;color:var(--color-text-tertiary);list-style:none}\n"] }]
         }], propDecorators: { triggerEl: [{ type: i0.ViewChild, args: ['triggerEl', { isSignal: true }] }], searchEl: [{ type: i0.ViewChild, args: ['searchEl', { isSignal: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], searchPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchPlaceholder", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], errorMsg: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMsg", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], selectAll: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectAll", required: false }] }], maxVisibleChips: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxVisibleChips", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
 
 /**
@@ -8842,6 +9649,9 @@ class PaginatorComponent {
     showPageSizeSelector = input(true, ...(ngDevMode ? [{ debugName: "showPageSizeSelector" }] : /* istanbul ignore next */ []));
     showRangeLabel = input(true, ...(ngDevMode ? [{ debugName: "showRangeLabel" }] : /* istanbul ignore next */ []));
     align = input('right', ...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** Group thousands with commas in the range and page numbers. */
+    groupThousands = input(true, ...(ngDevMode ? [{ debugName: "groupThousands" }] : /* istanbul ignore next */ []));
     disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     page = model(1, ...(ngDevMode ? [{ debugName: "page" }] : /* istanbul ignore next */ []));
     pageSize = model(10, ...(ngDevMode ? [{ debugName: "pageSize" }] : /* istanbul ignore next */ []));
@@ -8852,6 +9662,10 @@ class PaginatorComponent {
     rangeEnd = computed(() => Math.min(this.page() * this.pageSize(), this.totalItems()), ...(ngDevMode ? [{ debugName: "rangeEnd" }] : /* istanbul ignore next */ []));
     canGoPrev = computed(() => this.page() > 1, ...(ngDevMode ? [{ debugName: "canGoPrev" }] : /* istanbul ignore next */ []));
     canGoNext = computed(() => this.page() < this.totalPages(), ...(ngDevMode ? [{ debugName: "canGoNext" }] : /* istanbul ignore next */ []));
+    /** Formats a number for display, grouping thousands with commas when enabled. */
+    formatNumber(value) {
+        return this.groupThousands() ? value.toLocaleString('en-US') : `${value}`;
+    }
     visiblePages = computed(() => {
         const total = this.totalPages();
         const current = this.page();
@@ -8911,12 +9725,17 @@ class PaginatorComponent {
         this.changed.emit({ page: 1, pageSize: newSize });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: PaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: PaginatorComponent, isStandalone: true, selector: "ea-paginator", inputs: { totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: true, transformFunction: null }, pageSizeOptions: { classPropertyName: "pageSizeOptions", publicName: "pageSizeOptions", isSignal: true, isRequired: false, transformFunction: null }, showPageSizeSelector: { classPropertyName: "showPageSizeSelector", publicName: "showPageSizeSelector", isSignal: true, isRequired: false, transformFunction: null }, showRangeLabel: { classPropertyName: "showRangeLabel", publicName: "showRangeLabel", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { page: "pageChange", pageSize: "pageSizeChange", changed: "changed" }, ngImport: i0, template: "<div\n  class=\"ea-paginator\"\n  [class.ea-paginator--left]=\"align() === 'left'\"\n  [class.ea-paginator--center]=\"align() === 'center'\"\n  [class.ea-paginator--disabled]=\"disabled()\"\n  role=\"navigation\"\n  [attr.aria-label]=\"i18n.messages().paginator.label\">\n  @if (showPageSizeSelector()) {\n    <div class=\"ea-paginator__page-size\">\n      <label\n        class=\"ea-paginator__label\"\n        for=\"ea-paginator-size\">\n        {{ i18n.messages().paginator.rowsPerPage }}\n      </label>\n      <select\n        class=\"ea-paginator__select\"\n        id=\"ea-paginator-size\"\n        [disabled]=\"disabled()\"\n        (change)=\"onPageSizeChange($event)\">\n        @for (size of pageSizeOptions(); track size) {\n          <option\n            [value]=\"size\"\n            [selected]=\"size === pageSize()\">\n            {{ size }}\n          </option>\n        }\n      </select>\n    </div>\n  }\n\n  @if (showRangeLabel()) {\n    <span class=\"ea-paginator__range\">\n      {{ i18n.messages().paginator.range(rangeStart(), rangeEnd(), totalItems()) }}\n    </span>\n  }\n\n  <div class=\"ea-paginator__controls\">\n    <ea-button\n      variant=\"ghost\"\n      size=\"sm\"\n      [disabled]=\"disabled() || !canGoPrev()\"\n      [aria-label]=\"i18n.messages().paginator.previousPage\"\n      (clicked)=\"prevPage()\">\n      <ea-icon-chevron-left />\n    </ea-button>\n\n    @for (p of visiblePages(); track $index) {\n      @if (p === 'ellipsis') {\n        <span class=\"ea-paginator__ellipsis\">\u2026</span>\n      } @else {\n        <ea-button\n          class=\"ea-paginator__page-btn\"\n          [class.ea-paginator__page-btn--active]=\"p === page()\"\n          variant=\"ghost\"\n          size=\"sm\"\n          [disabled]=\"disabled()\"\n          [aria-current]=\"p === page() ? 'page' : undefined\"\n          (clicked)=\"goToPage(p)\">\n          {{ p }}\n        </ea-button>\n      }\n    }\n\n    <ea-button\n      variant=\"ghost\"\n      size=\"sm\"\n      [disabled]=\"disabled() || !canGoNext()\"\n      [aria-label]=\"i18n.messages().paginator.nextPage\"\n      (clicked)=\"nextPage()\">\n      <ea-icon-chevron-right />\n    </ea-button>\n  </div>\n</div>\n", styles: [".ea-paginator{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:var(--space-4);padding:var(--space-3) var(--space-4);font-family:var(--font-family-sans);font-size:var(--font-size-sm);color:var(--color-text-secondary);border-top:var(--border-width-thin) solid var(--color-border-subtle)}.ea-paginator--left{justify-content:flex-start}.ea-paginator--center{justify-content:center}.ea-paginator__page-size{display:flex;align-items:center;gap:var(--space-2)}.ea-paginator__label{white-space:nowrap;color:var(--color-text-secondary)}.ea-paginator__select{padding:var(--space-1) calc(var(--space-2) + 1rem) var(--space-1) var(--space-2);font-size:var(--font-size-sm);font-family:var(--font-family-sans);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);background-color:var(--color-bg-base);background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right 6px center;color:var(--color-text-primary);cursor:pointer;appearance:none;transition:var(--transition-colors),var(--transition-shadow)}.ea-paginator__select:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-paginator__select:disabled{opacity:.5;cursor:not-allowed}.ea-paginator__range{white-space:nowrap;color:var(--color-text-secondary)}.ea-paginator__controls{display:flex;align-items:center;gap:var(--space-1)}.ea-paginator__controls ea-icon-chevron-left,.ea-paginator__controls ea-icon-chevron-right{width:1em;height:1em}.ea-paginator__page-btn--active .ea-button{font-weight:var(--font-weight-medium);border-color:var(--color-brand-text);background-color:var(--color-brand-subtle);color:var(--color-brand-text)}.ea-paginator__page-btn--active .ea-button:hover:not(.ea-button--disabled){background-color:var(--color-brand-muted)}.ea-paginator__ellipsis{display:inline-flex;align-items:center;justify-content:center;min-width:2rem;height:2rem;color:var(--color-text-tertiary);pointer-events:none;-webkit-user-select:none;user-select:none}.ea-paginator--disabled{pointer-events:none}.ea-paginator--disabled .ea-paginator__range,.ea-paginator--disabled .ea-paginator__label{opacity:.5}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "ea-button", inputs: ["variant", "size", "type", "disabled", "loading", "fullWidth", "icon", "aria-label", "aria-current"], outputs: ["clicked"] }, { kind: "component", type: ChevronLeftIconComponent, selector: "ea-icon-chevron-left" }, { kind: "component", type: ChevronRightIconComponent, selector: "ea-icon-chevron-right" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: PaginatorComponent, isStandalone: true, selector: "ea-paginator", inputs: { totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: true, transformFunction: null }, pageSizeOptions: { classPropertyName: "pageSizeOptions", publicName: "pageSizeOptions", isSignal: true, isRequired: false, transformFunction: null }, showPageSizeSelector: { classPropertyName: "showPageSizeSelector", publicName: "showPageSizeSelector", isSignal: true, isRequired: false, transformFunction: null }, showRangeLabel: { classPropertyName: "showRangeLabel", publicName: "showRangeLabel", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, groupThousands: { classPropertyName: "groupThousands", publicName: "groupThousands", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { page: "pageChange", pageSize: "pageSizeChange", changed: "changed" }, ngImport: i0, template: "<div\n  class=\"ea-paginator\"\n  [ngClass]=\"'ea-paginator--' + size()\"\n  [class.ea-paginator--left]=\"align() === 'left'\"\n  [class.ea-paginator--center]=\"align() === 'center'\"\n  [class.ea-paginator--disabled]=\"disabled()\"\n  role=\"navigation\"\n  [attr.aria-label]=\"i18n.messages().paginator.label\">\n  @if (showPageSizeSelector()) {\n    <div class=\"ea-paginator__page-size\">\n      <label\n        class=\"ea-paginator__label\"\n        for=\"ea-paginator-size\">\n        {{ i18n.messages().paginator.rowsPerPage }}\n      </label>\n      <select\n        class=\"ea-paginator__select\"\n        id=\"ea-paginator-size\"\n        [disabled]=\"disabled()\"\n        (change)=\"onPageSizeChange($event)\">\n        @for (option of pageSizeOptions(); track option) {\n          <option\n            [value]=\"option\"\n            [selected]=\"option === pageSize()\">\n            {{ formatNumber(option) }}\n          </option>\n        }\n      </select>\n    </div>\n  }\n\n  @if (showRangeLabel()) {\n    <span class=\"ea-paginator__range\">\n      {{\n        i18n\n          .messages()\n          .paginator.range(\n            formatNumber(rangeStart()),\n            formatNumber(rangeEnd()),\n            formatNumber(totalItems())\n          )\n      }}\n    </span>\n  }\n\n  <div class=\"ea-paginator__controls\">\n    <ea-button\n      variant=\"ghost\"\n      [size]=\"size()\"\n      [disabled]=\"disabled() || !canGoPrev()\"\n      [aria-label]=\"i18n.messages().paginator.previousPage\"\n      (clicked)=\"prevPage()\">\n      <ea-icon-chevron-left />\n    </ea-button>\n\n    @for (p of visiblePages(); track $index) {\n      @if (p === 'ellipsis') {\n        <span class=\"ea-paginator__ellipsis\">\u2026</span>\n      } @else {\n        <ea-button\n          class=\"ea-paginator__page-btn\"\n          [class.ea-paginator__page-btn--active]=\"p === page()\"\n          variant=\"ghost\"\n          [size]=\"size()\"\n          [disabled]=\"disabled()\"\n          [aria-current]=\"p === page() ? 'page' : undefined\"\n          (clicked)=\"goToPage(p)\">\n          {{ formatNumber(p) }}\n        </ea-button>\n      }\n    }\n\n    <ea-button\n      variant=\"ghost\"\n      [size]=\"size()\"\n      [disabled]=\"disabled() || !canGoNext()\"\n      [aria-label]=\"i18n.messages().paginator.nextPage\"\n      (clicked)=\"nextPage()\">\n      <ea-icon-chevron-right />\n    </ea-button>\n  </div>\n</div>\n", styles: [".ea-paginator{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:1em;width:100%;padding:.75em 1em;font-family:var(--font-family-sans);color:var(--color-text-secondary);border-top:var(--border-width-thin) solid var(--color-border-subtle)}.ea-paginator--xs{font-size:var(--font-size-xs)}.ea-paginator--sm{font-size:var(--font-size-sm)}.ea-paginator--md{font-size:var(--font-size-md)}.ea-paginator--lg{font-size:var(--font-size-lg)}.ea-paginator--xl{font-size:var(--font-size-xl)}.ea-paginator--left{justify-content:flex-start}.ea-paginator--center{justify-content:center}.ea-paginator__page-size{display:flex;align-items:center;gap:.5em}.ea-paginator__label{white-space:nowrap;color:var(--color-text-secondary)}.ea-paginator__select{padding:.25em 1.5em .25em .5em;font-size:inherit;font-family:var(--font-family-sans);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);background-color:var(--color-bg-base);background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right 6px center;color:var(--color-text-primary);cursor:pointer;appearance:none;transition:var(--transition-colors),var(--transition-shadow)}.ea-paginator__select:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-paginator__select:disabled{opacity:.5;cursor:not-allowed}.ea-paginator__range{white-space:nowrap;color:var(--color-text-secondary)}.ea-paginator__controls{display:flex;align-items:center;gap:.25em}.ea-paginator__controls ea-icon-chevron-left,.ea-paginator__controls ea-icon-chevron-right{width:1em;height:1em}.ea-paginator__page-btn--active .ea-button{font-weight:var(--font-weight-medium);border-color:var(--color-brand-text);background-color:var(--color-brand-subtle);color:var(--color-brand-text)}.ea-paginator__page-btn--active .ea-button:hover:not(.ea-button--disabled){background-color:var(--color-brand-muted)}.ea-paginator__ellipsis{display:inline-flex;align-items:center;justify-content:center;min-width:2em;height:2em;color:var(--color-text-tertiary);pointer-events:none;-webkit-user-select:none;user-select:none}.ea-paginator--disabled{pointer-events:none}.ea-paginator--disabled .ea-paginator__range,.ea-paginator--disabled .ea-paginator__label{opacity:.5}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonComponent, selector: "ea-button", inputs: ["variant", "size", "type", "disabled", "loading", "fullWidth", "icon", "aria-label", "aria-current"], outputs: ["clicked"] }, { kind: "component", type: ChevronLeftIconComponent, selector: "ea-icon-chevron-left" }, { kind: "component", type: ChevronRightIconComponent, selector: "ea-icon-chevron-right" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: PaginatorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ea-paginator', imports: [ButtonComponent, ChevronLeftIconComponent, ChevronRightIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n  class=\"ea-paginator\"\n  [class.ea-paginator--left]=\"align() === 'left'\"\n  [class.ea-paginator--center]=\"align() === 'center'\"\n  [class.ea-paginator--disabled]=\"disabled()\"\n  role=\"navigation\"\n  [attr.aria-label]=\"i18n.messages().paginator.label\">\n  @if (showPageSizeSelector()) {\n    <div class=\"ea-paginator__page-size\">\n      <label\n        class=\"ea-paginator__label\"\n        for=\"ea-paginator-size\">\n        {{ i18n.messages().paginator.rowsPerPage }}\n      </label>\n      <select\n        class=\"ea-paginator__select\"\n        id=\"ea-paginator-size\"\n        [disabled]=\"disabled()\"\n        (change)=\"onPageSizeChange($event)\">\n        @for (size of pageSizeOptions(); track size) {\n          <option\n            [value]=\"size\"\n            [selected]=\"size === pageSize()\">\n            {{ size }}\n          </option>\n        }\n      </select>\n    </div>\n  }\n\n  @if (showRangeLabel()) {\n    <span class=\"ea-paginator__range\">\n      {{ i18n.messages().paginator.range(rangeStart(), rangeEnd(), totalItems()) }}\n    </span>\n  }\n\n  <div class=\"ea-paginator__controls\">\n    <ea-button\n      variant=\"ghost\"\n      size=\"sm\"\n      [disabled]=\"disabled() || !canGoPrev()\"\n      [aria-label]=\"i18n.messages().paginator.previousPage\"\n      (clicked)=\"prevPage()\">\n      <ea-icon-chevron-left />\n    </ea-button>\n\n    @for (p of visiblePages(); track $index) {\n      @if (p === 'ellipsis') {\n        <span class=\"ea-paginator__ellipsis\">\u2026</span>\n      } @else {\n        <ea-button\n          class=\"ea-paginator__page-btn\"\n          [class.ea-paginator__page-btn--active]=\"p === page()\"\n          variant=\"ghost\"\n          size=\"sm\"\n          [disabled]=\"disabled()\"\n          [aria-current]=\"p === page() ? 'page' : undefined\"\n          (clicked)=\"goToPage(p)\">\n          {{ p }}\n        </ea-button>\n      }\n    }\n\n    <ea-button\n      variant=\"ghost\"\n      size=\"sm\"\n      [disabled]=\"disabled() || !canGoNext()\"\n      [aria-label]=\"i18n.messages().paginator.nextPage\"\n      (clicked)=\"nextPage()\">\n      <ea-icon-chevron-right />\n    </ea-button>\n  </div>\n</div>\n", styles: [".ea-paginator{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:var(--space-4);padding:var(--space-3) var(--space-4);font-family:var(--font-family-sans);font-size:var(--font-size-sm);color:var(--color-text-secondary);border-top:var(--border-width-thin) solid var(--color-border-subtle)}.ea-paginator--left{justify-content:flex-start}.ea-paginator--center{justify-content:center}.ea-paginator__page-size{display:flex;align-items:center;gap:var(--space-2)}.ea-paginator__label{white-space:nowrap;color:var(--color-text-secondary)}.ea-paginator__select{padding:var(--space-1) calc(var(--space-2) + 1rem) var(--space-1) var(--space-2);font-size:var(--font-size-sm);font-family:var(--font-family-sans);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);background-color:var(--color-bg-base);background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right 6px center;color:var(--color-text-primary);cursor:pointer;appearance:none;transition:var(--transition-colors),var(--transition-shadow)}.ea-paginator__select:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-paginator__select:disabled{opacity:.5;cursor:not-allowed}.ea-paginator__range{white-space:nowrap;color:var(--color-text-secondary)}.ea-paginator__controls{display:flex;align-items:center;gap:var(--space-1)}.ea-paginator__controls ea-icon-chevron-left,.ea-paginator__controls ea-icon-chevron-right{width:1em;height:1em}.ea-paginator__page-btn--active .ea-button{font-weight:var(--font-weight-medium);border-color:var(--color-brand-text);background-color:var(--color-brand-subtle);color:var(--color-brand-text)}.ea-paginator__page-btn--active .ea-button:hover:not(.ea-button--disabled){background-color:var(--color-brand-muted)}.ea-paginator__ellipsis{display:inline-flex;align-items:center;justify-content:center;min-width:2rem;height:2rem;color:var(--color-text-tertiary);pointer-events:none;-webkit-user-select:none;user-select:none}.ea-paginator--disabled{pointer-events:none}.ea-paginator--disabled .ea-paginator__range,.ea-paginator--disabled .ea-paginator__label{opacity:.5}\n"] }]
-        }], propDecorators: { totalItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalItems", required: true }] }], pageSizeOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSizeOptions", required: false }] }], showPageSizeSelector: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPageSizeSelector", required: false }] }], showRangeLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRangeLabel", required: false }] }], align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], page: [{ type: i0.Input, args: [{ isSignal: true, alias: "page", required: false }] }, { type: i0.Output, args: ["pageChange"] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }, { type: i0.Output, args: ["pageSizeChange"] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
+            args: [{ selector: 'ea-paginator', imports: [
+                        NgClass,
+                        ButtonComponent,
+                        ChevronLeftIconComponent,
+                        ChevronRightIconComponent,
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n  class=\"ea-paginator\"\n  [ngClass]=\"'ea-paginator--' + size()\"\n  [class.ea-paginator--left]=\"align() === 'left'\"\n  [class.ea-paginator--center]=\"align() === 'center'\"\n  [class.ea-paginator--disabled]=\"disabled()\"\n  role=\"navigation\"\n  [attr.aria-label]=\"i18n.messages().paginator.label\">\n  @if (showPageSizeSelector()) {\n    <div class=\"ea-paginator__page-size\">\n      <label\n        class=\"ea-paginator__label\"\n        for=\"ea-paginator-size\">\n        {{ i18n.messages().paginator.rowsPerPage }}\n      </label>\n      <select\n        class=\"ea-paginator__select\"\n        id=\"ea-paginator-size\"\n        [disabled]=\"disabled()\"\n        (change)=\"onPageSizeChange($event)\">\n        @for (option of pageSizeOptions(); track option) {\n          <option\n            [value]=\"option\"\n            [selected]=\"option === pageSize()\">\n            {{ formatNumber(option) }}\n          </option>\n        }\n      </select>\n    </div>\n  }\n\n  @if (showRangeLabel()) {\n    <span class=\"ea-paginator__range\">\n      {{\n        i18n\n          .messages()\n          .paginator.range(\n            formatNumber(rangeStart()),\n            formatNumber(rangeEnd()),\n            formatNumber(totalItems())\n          )\n      }}\n    </span>\n  }\n\n  <div class=\"ea-paginator__controls\">\n    <ea-button\n      variant=\"ghost\"\n      [size]=\"size()\"\n      [disabled]=\"disabled() || !canGoPrev()\"\n      [aria-label]=\"i18n.messages().paginator.previousPage\"\n      (clicked)=\"prevPage()\">\n      <ea-icon-chevron-left />\n    </ea-button>\n\n    @for (p of visiblePages(); track $index) {\n      @if (p === 'ellipsis') {\n        <span class=\"ea-paginator__ellipsis\">\u2026</span>\n      } @else {\n        <ea-button\n          class=\"ea-paginator__page-btn\"\n          [class.ea-paginator__page-btn--active]=\"p === page()\"\n          variant=\"ghost\"\n          [size]=\"size()\"\n          [disabled]=\"disabled()\"\n          [aria-current]=\"p === page() ? 'page' : undefined\"\n          (clicked)=\"goToPage(p)\">\n          {{ formatNumber(p) }}\n        </ea-button>\n      }\n    }\n\n    <ea-button\n      variant=\"ghost\"\n      [size]=\"size()\"\n      [disabled]=\"disabled() || !canGoNext()\"\n      [aria-label]=\"i18n.messages().paginator.nextPage\"\n      (clicked)=\"nextPage()\">\n      <ea-icon-chevron-right />\n    </ea-button>\n  </div>\n</div>\n", styles: [".ea-paginator{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:1em;width:100%;padding:.75em 1em;font-family:var(--font-family-sans);color:var(--color-text-secondary);border-top:var(--border-width-thin) solid var(--color-border-subtle)}.ea-paginator--xs{font-size:var(--font-size-xs)}.ea-paginator--sm{font-size:var(--font-size-sm)}.ea-paginator--md{font-size:var(--font-size-md)}.ea-paginator--lg{font-size:var(--font-size-lg)}.ea-paginator--xl{font-size:var(--font-size-xl)}.ea-paginator--left{justify-content:flex-start}.ea-paginator--center{justify-content:center}.ea-paginator__page-size{display:flex;align-items:center;gap:.5em}.ea-paginator__label{white-space:nowrap;color:var(--color-text-secondary)}.ea-paginator__select{padding:.25em 1.5em .25em .5em;font-size:inherit;font-family:var(--font-family-sans);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);background-color:var(--color-bg-base);background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right 6px center;color:var(--color-text-primary);cursor:pointer;appearance:none;transition:var(--transition-colors),var(--transition-shadow)}.ea-paginator__select:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-paginator__select:disabled{opacity:.5;cursor:not-allowed}.ea-paginator__range{white-space:nowrap;color:var(--color-text-secondary)}.ea-paginator__controls{display:flex;align-items:center;gap:.25em}.ea-paginator__controls ea-icon-chevron-left,.ea-paginator__controls ea-icon-chevron-right{width:1em;height:1em}.ea-paginator__page-btn--active .ea-button{font-weight:var(--font-weight-medium);border-color:var(--color-brand-text);background-color:var(--color-brand-subtle);color:var(--color-brand-text)}.ea-paginator__page-btn--active .ea-button:hover:not(.ea-button--disabled){background-color:var(--color-brand-muted)}.ea-paginator__ellipsis{display:inline-flex;align-items:center;justify-content:center;min-width:2em;height:2em;color:var(--color-text-tertiary);pointer-events:none;-webkit-user-select:none;user-select:none}.ea-paginator--disabled{pointer-events:none}.ea-paginator--disabled .ea-paginator__range,.ea-paginator--disabled .ea-paginator__label{opacity:.5}\n"] }]
+        }], propDecorators: { totalItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalItems", required: true }] }], pageSizeOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSizeOptions", required: false }] }], showPageSizeSelector: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPageSizeSelector", required: false }] }], showRangeLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRangeLabel", required: false }] }], align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], groupThousands: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupThousands", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], page: [{ type: i0.Input, args: [{ isSignal: true, alias: "page", required: false }] }, { type: i0.Output, args: ["pageChange"] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }, { type: i0.Output, args: ["pageSizeChange"] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
 
 /**
  * Linear progress indicator supporting both determinate (driven by `value`
@@ -8932,13 +9751,9 @@ class ProgressBarComponent {
     label = input(undefined, ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
     /** Shows the rounded percentage alongside the label. */
     showPercentage = input(false, ...(ngDevMode ? [{ debugName: "showPercentage" }] : /* istanbul ignore next */ []));
-    /**
-     * @deprecated Use `showPercentage` instead. Will be removed in v3.0.0.
-     */
-    showValue = input(false, ...(ngDevMode ? [{ debugName: "showValue" }] : /* istanbul ignore next */ []));
     indeterminate = input(false, ...(ngDevMode ? [{ debugName: "indeterminate" }] : /* istanbul ignore next */ []));
-    /** Whether to render the percentage (honours the deprecated `showValue` alias). */
-    showsPercentage = computed(() => this.showPercentage() || this.showValue(), ...(ngDevMode ? [{ debugName: "showsPercentage" }] : /* istanbul ignore next */ []));
+    /** Whether to render the percentage. */
+    showsPercentage = computed(() => this.showPercentage(), ...(ngDevMode ? [{ debugName: "showsPercentage" }] : /* istanbul ignore next */ []));
     percentage = computed(() => {
         const max = this.max();
         if (max <= 0) {
@@ -8953,12 +9768,12 @@ class ProgressBarComponent {
         'ea-progress-bar--indeterminate': this.indeterminate(),
     }), ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: ProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: ProgressBarComponent, isStandalone: true, selector: "ea-progress-bar", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, showPercentage: { classPropertyName: "showPercentage", publicName: "showPercentage", isSignal: true, isRequired: false, transformFunction: null }, showValue: { classPropertyName: "showValue", publicName: "showValue", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n  class=\"ea-progress-bar\"\n  [ngClass]=\"hostClasses()\">\n  @if (label() || showsPercentage()) {\n    <div class=\"ea-progress-bar__header\">\n      @if (label()) {\n        <span class=\"ea-progress-bar__label\">{{ label() }}</span>\n      }\n      @if (showsPercentage() && !indeterminate()) {\n        <span class=\"ea-progress-bar__value\">{{ percentageRounded() }}%</span>\n      }\n    </div>\n  }\n  <div\n    class=\"ea-progress-bar__track\"\n    role=\"progressbar\"\n    [attr.aria-valuenow]=\"indeterminate() ? null : percentageRounded()\"\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n    [attr.aria-busy]=\"indeterminate() || null\"\n    [attr.aria-label]=\"label() || i18n.messages().progressBar.label\">\n    <div\n      class=\"ea-progress-bar__fill\"\n      [style.width]=\"indeterminate() ? null : percentage() + '%'\"></div>\n  </div>\n</div>\n", styles: [".ea-progress-bar{display:flex;flex-direction:column;gap:var(--space-1-5);font-family:var(--font-family-sans)}.ea-progress-bar--xs{--ea-progress-bar-size: .125rem}.ea-progress-bar--sm{--ea-progress-bar-size: .25rem}.ea-progress-bar--md{--ea-progress-bar-size: .375rem}.ea-progress-bar--lg{--ea-progress-bar-size: .5rem}.ea-progress-bar--xl{--ea-progress-bar-size: .625rem}.ea-progress-bar__header{display:flex;justify-content:space-between;align-items:baseline}.ea-progress-bar__label{font-size:var(--text-label-md-size);font-weight:var(--text-label-md-weight);line-height:var(--text-label-md-lh);color:var(--color-text-primary)}.ea-progress-bar__value{font-size:var(--text-label-md-size);font-weight:var(--text-label-md-weight);line-height:var(--text-label-md-lh);color:var(--color-text-secondary)}.ea-progress-bar__track{overflow:hidden;height:var(--ea-progress-bar-size, .375rem);border-radius:var(--radius-full);background-color:var(--color-bg-muted)}.ea-progress-bar__fill{height:100%;border-radius:var(--radius-full);background-color:var(--color-brand-default);transition:width var(--duration-slow) var(--ease-out)}.ea-progress-bar--success .ea-progress-bar__fill{background-color:var(--color-success-default)}.ea-progress-bar--warning .ea-progress-bar__fill{background-color:var(--color-warning-default)}.ea-progress-bar--error .ea-progress-bar__fill{background-color:var(--color-error-default)}.ea-progress-bar--info .ea-progress-bar__fill{background-color:var(--color-info-default)}.ea-progress-bar--indeterminate .ea-progress-bar__fill{width:40%;transition:none;animation:ea-progress-indeterminate 1.5s var(--ease-in-out) infinite}@keyframes ea-progress-indeterminate{0%{transform:translate(-110%)}to{transform:translate(260%)}}@media(prefers-reduced-motion:reduce){.ea-progress-bar--indeterminate .ea-progress-bar__fill{width:100%;animation:none}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: ProgressBarComponent, isStandalone: true, selector: "ea-progress-bar", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, showPercentage: { classPropertyName: "showPercentage", publicName: "showPercentage", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n  class=\"ea-progress-bar\"\n  [ngClass]=\"hostClasses()\">\n  @if (label() || showsPercentage()) {\n    <div class=\"ea-progress-bar__header\">\n      @if (label()) {\n        <span class=\"ea-progress-bar__label\">{{ label() }}</span>\n      }\n      @if (showsPercentage() && !indeterminate()) {\n        <span class=\"ea-progress-bar__value\">{{ percentageRounded() }}%</span>\n      }\n    </div>\n  }\n  <div\n    class=\"ea-progress-bar__track\"\n    role=\"progressbar\"\n    [attr.aria-valuenow]=\"indeterminate() ? null : percentageRounded()\"\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n    [attr.aria-busy]=\"indeterminate() || null\"\n    [attr.aria-label]=\"label() || i18n.messages().progressBar.label\">\n    <div\n      class=\"ea-progress-bar__fill\"\n      [style.width]=\"indeterminate() ? null : percentage() + '%'\"></div>\n  </div>\n</div>\n", styles: [".ea-progress-bar{display:flex;flex-direction:column;gap:var(--space-1-5);font-family:var(--font-family-sans)}.ea-progress-bar--xs{--ea-progress-bar-size: .125rem}.ea-progress-bar--sm{--ea-progress-bar-size: .25rem}.ea-progress-bar--md{--ea-progress-bar-size: .375rem}.ea-progress-bar--lg{--ea-progress-bar-size: .5rem}.ea-progress-bar--xl{--ea-progress-bar-size: .625rem}.ea-progress-bar__header{display:flex;justify-content:space-between;align-items:baseline}.ea-progress-bar__label{font-size:var(--text-label-md-size);font-weight:var(--text-label-md-weight);line-height:var(--text-label-md-lh);color:var(--color-text-primary)}.ea-progress-bar__value{font-size:var(--text-label-md-size);font-weight:var(--text-label-md-weight);line-height:var(--text-label-md-lh);color:var(--color-text-secondary)}.ea-progress-bar__track{overflow:hidden;height:var(--ea-progress-bar-size, .375rem);border-radius:var(--radius-full);background-color:var(--color-bg-muted)}.ea-progress-bar__fill{height:100%;border-radius:var(--radius-full);background-color:var(--color-brand-default);transition:width var(--duration-slow) var(--ease-out)}.ea-progress-bar--success .ea-progress-bar__fill{background-color:var(--color-success-default)}.ea-progress-bar--warning .ea-progress-bar__fill{background-color:var(--color-warning-default)}.ea-progress-bar--error .ea-progress-bar__fill{background-color:var(--color-error-default)}.ea-progress-bar--info .ea-progress-bar__fill{background-color:var(--color-info-default)}.ea-progress-bar--indeterminate .ea-progress-bar__fill{width:40%;transition:none;animation:ea-progress-indeterminate 1.5s var(--ease-in-out) infinite}@keyframes ea-progress-indeterminate{0%{transform:translate(-110%)}to{transform:translate(260%)}}@media(prefers-reduced-motion:reduce){.ea-progress-bar--indeterminate .ea-progress-bar__fill{width:100%;animation:none}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: ProgressBarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ea-progress-bar', imports: [NgClass], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n  class=\"ea-progress-bar\"\n  [ngClass]=\"hostClasses()\">\n  @if (label() || showsPercentage()) {\n    <div class=\"ea-progress-bar__header\">\n      @if (label()) {\n        <span class=\"ea-progress-bar__label\">{{ label() }}</span>\n      }\n      @if (showsPercentage() && !indeterminate()) {\n        <span class=\"ea-progress-bar__value\">{{ percentageRounded() }}%</span>\n      }\n    </div>\n  }\n  <div\n    class=\"ea-progress-bar__track\"\n    role=\"progressbar\"\n    [attr.aria-valuenow]=\"indeterminate() ? null : percentageRounded()\"\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n    [attr.aria-busy]=\"indeterminate() || null\"\n    [attr.aria-label]=\"label() || i18n.messages().progressBar.label\">\n    <div\n      class=\"ea-progress-bar__fill\"\n      [style.width]=\"indeterminate() ? null : percentage() + '%'\"></div>\n  </div>\n</div>\n", styles: [".ea-progress-bar{display:flex;flex-direction:column;gap:var(--space-1-5);font-family:var(--font-family-sans)}.ea-progress-bar--xs{--ea-progress-bar-size: .125rem}.ea-progress-bar--sm{--ea-progress-bar-size: .25rem}.ea-progress-bar--md{--ea-progress-bar-size: .375rem}.ea-progress-bar--lg{--ea-progress-bar-size: .5rem}.ea-progress-bar--xl{--ea-progress-bar-size: .625rem}.ea-progress-bar__header{display:flex;justify-content:space-between;align-items:baseline}.ea-progress-bar__label{font-size:var(--text-label-md-size);font-weight:var(--text-label-md-weight);line-height:var(--text-label-md-lh);color:var(--color-text-primary)}.ea-progress-bar__value{font-size:var(--text-label-md-size);font-weight:var(--text-label-md-weight);line-height:var(--text-label-md-lh);color:var(--color-text-secondary)}.ea-progress-bar__track{overflow:hidden;height:var(--ea-progress-bar-size, .375rem);border-radius:var(--radius-full);background-color:var(--color-bg-muted)}.ea-progress-bar__fill{height:100%;border-radius:var(--radius-full);background-color:var(--color-brand-default);transition:width var(--duration-slow) var(--ease-out)}.ea-progress-bar--success .ea-progress-bar__fill{background-color:var(--color-success-default)}.ea-progress-bar--warning .ea-progress-bar__fill{background-color:var(--color-warning-default)}.ea-progress-bar--error .ea-progress-bar__fill{background-color:var(--color-error-default)}.ea-progress-bar--info .ea-progress-bar__fill{background-color:var(--color-info-default)}.ea-progress-bar--indeterminate .ea-progress-bar__fill{width:40%;transition:none;animation:ea-progress-indeterminate 1.5s var(--ease-in-out) infinite}@keyframes ea-progress-indeterminate{0%{transform:translate(-110%)}to{transform:translate(260%)}}@media(prefers-reduced-motion:reduce){.ea-progress-bar--indeterminate .ea-progress-bar__fill{width:100%;animation:none}}\n"] }]
-        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], showPercentage: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPercentage", required: false }] }], showValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "showValue", required: false }] }], indeterminate: [{ type: i0.Input, args: [{ isSignal: true, alias: "indeterminate", required: false }] }] } });
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], showPercentage: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPercentage", required: false }] }], indeterminate: [{ type: i0.Input, args: [{ isSignal: true, alias: "indeterminate", required: false }] }] } });
 
 /**
  * Composite single-select control made up of `ea-radio` children. Manages
@@ -9768,23 +10583,25 @@ class SegmentedComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: SegmentedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: SegmentedComponent, isStandalone: true, selector: "ea-segmented", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, errorMsg: { classPropertyName: "errorMsg", publicName: "errorMsg", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", changed: "changed" }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: SegmentedComponent, isStandalone: true, selector: "ea-segmented", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, errorMsg: { classPropertyName: "errorMsg", publicName: "errorMsg", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", changed: "changed" }, host: { properties: { "class.ea-segmented-host--full-width": "fullWidth()" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => SegmentedComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "buttonEls", predicate: ["optionEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ea-segmented-field\">\n  @if (label(); as labelText) {\n    <ea-field-label\n      [text]=\"labelText\"\n      [labelId]=\"id() + '-label'\"\n      [required]=\"required()\" />\n  }\n\n  <div\n    class=\"ea-segmented\"\n    role=\"radiogroup\"\n    [ngClass]=\"hostClasses()\"\n    [attr.aria-labelledby]=\"label() ? id() + '-label' : null\"\n    [attr.aria-label]=\"!label() ? (ariaLabel() ?? null) : null\"\n    [attr.aria-required]=\"required() || null\"\n    [attr.aria-invalid]=\"hasError() || null\"\n    [attr.aria-disabled]=\"isDisabled() || null\"\n    [attr.aria-describedby]=\"\n      showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n    \">\n    @for (option of options(); track option.value; let i = $index) {\n      <button\n        #optionEl\n        type=\"button\"\n        class=\"ea-segmented__option\"\n        role=\"radio\"\n        [class.ea-segmented__option--selected]=\"isSelected(option)\"\n        [class.ea-segmented__option--disabled]=\"isOptionDisabled(option)\"\n        [attr.aria-checked]=\"isSelected(option)\"\n        [attr.aria-disabled]=\"isOptionDisabled(option) || null\"\n        [disabled]=\"isOptionDisabled(option)\"\n        [attr.tabindex]=\"isSelected(option) || (!value() && i === 0) ? 0 : -1\"\n        (click)=\"select(option)\"\n        (keydown)=\"handleKeydown($event, i)\">\n        {{ option.label }}\n      </button>\n    }\n  </div>\n\n  <ea-field-messages\n    [id]=\"id()\"\n    [error]=\"showError() ? errorMsg() : null\"\n    [hint]=\"showHint() ? hint() : null\" />\n</div>\n", styles: [".ea-segmented-field{display:inline-flex;flex-direction:column;gap:var(--space-1-5)}.ea-segmented{display:inline-flex;flex-direction:row;flex-wrap:wrap;row-gap:var(--space-0-5);max-width:100%;padding:var(--space-0-5);background-color:var(--color-bg-muted);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);font-family:var(--font-family-sans)}.ea-segmented--full-width{display:flex;width:100%}.ea-segmented--full-width .ea-segmented__option{flex:1}.ea-segmented--disabled{opacity:.5;cursor:not-allowed}.ea-segmented--error{border-color:var(--color-error-default)}.ea-segmented--xs .ea-segmented__option{font-size:var(--font-size-xs)}.ea-segmented--sm .ea-segmented__option{font-size:var(--font-size-sm)}.ea-segmented--md .ea-segmented__option{font-size:var(--font-size-md)}.ea-segmented--lg .ea-segmented__option{font-size:var(--font-size-lg)}.ea-segmented--xl .ea-segmented__option{font-size:var(--font-size-xl)}.ea-segmented__option{display:inline-flex;align-items:center;justify-content:center;gap:.375em;min-height:2.25em;padding:.375em .75em;font-weight:var(--font-weight-medium);line-height:var(--line-height-tight);background:transparent;border:var(--border-width-thin) solid transparent;border-radius:var(--radius-sm);color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors),var(--transition-shadow)}.ea-segmented__option:hover:not(.ea-segmented__option--selected):not(.ea-segmented__option--disabled){color:var(--color-text-primary);background-color:var(--color-state-active)}.ea-segmented__option:focus-visible{box-shadow:var(--shadow-focus-ring);outline:none}.ea-segmented__option--selected{background-color:var(--color-bg-base);border-color:var(--color-border-default);color:var(--color-text-primary);box-shadow:var(--shadow-sm)}.ea-segmented__option--disabled{cursor:not-allowed}\n"], dependencies: [{ kind: "component", type: FieldLabelComponent, selector: "ea-field-label", inputs: ["text", "forId", "required", "labelId"] }, { kind: "component", type: FieldMessagesComponent, selector: "ea-field-messages", inputs: ["id", "error", "hint"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        ], viewQueries: [{ propertyName: "buttonEls", predicate: ["optionEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"ea-segmented-field\"\n  [class.ea-segmented-field--full-width]=\"fullWidth()\">\n  @if (label(); as labelText) {\n    <ea-field-label\n      [text]=\"labelText\"\n      [labelId]=\"id() + '-label'\"\n      [required]=\"required()\" />\n  }\n\n  <div\n    class=\"ea-segmented\"\n    role=\"radiogroup\"\n    [ngClass]=\"hostClasses()\"\n    [attr.aria-labelledby]=\"label() ? id() + '-label' : null\"\n    [attr.aria-label]=\"!label() ? (ariaLabel() ?? null) : null\"\n    [attr.aria-required]=\"required() || null\"\n    [attr.aria-invalid]=\"hasError() || null\"\n    [attr.aria-disabled]=\"isDisabled() || null\"\n    [attr.aria-describedby]=\"\n      showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n    \">\n    @for (option of options(); track option.value; let i = $index) {\n      <button\n        #optionEl\n        type=\"button\"\n        class=\"ea-segmented__option\"\n        role=\"radio\"\n        [class.ea-segmented__option--selected]=\"isSelected(option)\"\n        [class.ea-segmented__option--disabled]=\"isOptionDisabled(option)\"\n        [attr.aria-checked]=\"isSelected(option)\"\n        [attr.aria-disabled]=\"isOptionDisabled(option) || null\"\n        [disabled]=\"isOptionDisabled(option)\"\n        [attr.tabindex]=\"isSelected(option) || (!value() && i === 0) ? 0 : -1\"\n        (click)=\"select(option)\"\n        (keydown)=\"handleKeydown($event, i)\">\n        {{ option.label }}\n      </button>\n    }\n  </div>\n\n  <ea-field-messages\n    [id]=\"id()\"\n    [error]=\"showError() ? errorMsg() : null\"\n    [hint]=\"showHint() ? hint() : null\" />\n</div>\n", styles: [":host{display:flex}:host(.ea-segmented-host--full-width){display:block;width:100%}.ea-segmented-field{display:inline-flex;flex-direction:column;gap:var(--space-1-5)}.ea-segmented-field--full-width{width:100%}.ea-segmented{display:inline-flex;flex-direction:row;flex-wrap:wrap;row-gap:var(--space-0-5);max-width:100%;padding:var(--space-0-5);background-color:var(--color-bg-muted);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);font-family:var(--font-family-sans)}.ea-segmented--full-width{display:flex;width:100%}.ea-segmented--full-width .ea-segmented__option{flex:1}.ea-segmented--disabled{opacity:.5;cursor:not-allowed}.ea-segmented--error{border-color:var(--color-error-default)}.ea-segmented--xs .ea-segmented__option{font-size:var(--font-size-xs)}.ea-segmented--sm .ea-segmented__option{font-size:var(--font-size-sm)}.ea-segmented--md .ea-segmented__option{font-size:var(--font-size-md)}.ea-segmented--lg .ea-segmented__option{font-size:var(--font-size-lg)}.ea-segmented--xl .ea-segmented__option{font-size:var(--font-size-xl)}.ea-segmented__option{display:inline-flex;align-items:center;justify-content:center;gap:.375em;min-height:2.25em;padding:.375em .75em;font-weight:var(--font-weight-medium);line-height:var(--line-height-tight);background:transparent;border:var(--border-width-thin) solid transparent;border-radius:var(--radius-sm);color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors),var(--transition-shadow)}.ea-segmented__option:hover:not(.ea-segmented__option--selected):not(.ea-segmented__option--disabled){color:var(--color-text-primary);background-color:var(--color-state-active)}.ea-segmented__option:focus-visible{box-shadow:var(--shadow-focus-ring);outline:none}.ea-segmented__option--selected{background-color:var(--color-bg-base);border-color:var(--color-border-default);color:var(--color-text-primary);box-shadow:var(--shadow-sm)}.ea-segmented__option--disabled{cursor:not-allowed}\n"], dependencies: [{ kind: "component", type: FieldLabelComponent, selector: "ea-field-label", inputs: ["text", "forId", "required", "labelId"] }, { kind: "component", type: FieldMessagesComponent, selector: "ea-field-messages", inputs: ["id", "error", "hint"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: SegmentedComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ea-segmented', changeDetection: ChangeDetectionStrategy.OnPush, imports: [FieldLabelComponent, FieldMessagesComponent, NgClass], providers: [
+            args: [{ selector: 'ea-segmented', changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '[class.ea-segmented-host--full-width]': 'fullWidth()',
+                    }, imports: [FieldLabelComponent, FieldMessagesComponent, NgClass], providers: [
                         {
                             provide: NG_VALUE_ACCESSOR,
                             useExisting: forwardRef(() => SegmentedComponent),
                             multi: true,
                         },
-                    ], template: "<div class=\"ea-segmented-field\">\n  @if (label(); as labelText) {\n    <ea-field-label\n      [text]=\"labelText\"\n      [labelId]=\"id() + '-label'\"\n      [required]=\"required()\" />\n  }\n\n  <div\n    class=\"ea-segmented\"\n    role=\"radiogroup\"\n    [ngClass]=\"hostClasses()\"\n    [attr.aria-labelledby]=\"label() ? id() + '-label' : null\"\n    [attr.aria-label]=\"!label() ? (ariaLabel() ?? null) : null\"\n    [attr.aria-required]=\"required() || null\"\n    [attr.aria-invalid]=\"hasError() || null\"\n    [attr.aria-disabled]=\"isDisabled() || null\"\n    [attr.aria-describedby]=\"\n      showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n    \">\n    @for (option of options(); track option.value; let i = $index) {\n      <button\n        #optionEl\n        type=\"button\"\n        class=\"ea-segmented__option\"\n        role=\"radio\"\n        [class.ea-segmented__option--selected]=\"isSelected(option)\"\n        [class.ea-segmented__option--disabled]=\"isOptionDisabled(option)\"\n        [attr.aria-checked]=\"isSelected(option)\"\n        [attr.aria-disabled]=\"isOptionDisabled(option) || null\"\n        [disabled]=\"isOptionDisabled(option)\"\n        [attr.tabindex]=\"isSelected(option) || (!value() && i === 0) ? 0 : -1\"\n        (click)=\"select(option)\"\n        (keydown)=\"handleKeydown($event, i)\">\n        {{ option.label }}\n      </button>\n    }\n  </div>\n\n  <ea-field-messages\n    [id]=\"id()\"\n    [error]=\"showError() ? errorMsg() : null\"\n    [hint]=\"showHint() ? hint() : null\" />\n</div>\n", styles: [".ea-segmented-field{display:inline-flex;flex-direction:column;gap:var(--space-1-5)}.ea-segmented{display:inline-flex;flex-direction:row;flex-wrap:wrap;row-gap:var(--space-0-5);max-width:100%;padding:var(--space-0-5);background-color:var(--color-bg-muted);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);font-family:var(--font-family-sans)}.ea-segmented--full-width{display:flex;width:100%}.ea-segmented--full-width .ea-segmented__option{flex:1}.ea-segmented--disabled{opacity:.5;cursor:not-allowed}.ea-segmented--error{border-color:var(--color-error-default)}.ea-segmented--xs .ea-segmented__option{font-size:var(--font-size-xs)}.ea-segmented--sm .ea-segmented__option{font-size:var(--font-size-sm)}.ea-segmented--md .ea-segmented__option{font-size:var(--font-size-md)}.ea-segmented--lg .ea-segmented__option{font-size:var(--font-size-lg)}.ea-segmented--xl .ea-segmented__option{font-size:var(--font-size-xl)}.ea-segmented__option{display:inline-flex;align-items:center;justify-content:center;gap:.375em;min-height:2.25em;padding:.375em .75em;font-weight:var(--font-weight-medium);line-height:var(--line-height-tight);background:transparent;border:var(--border-width-thin) solid transparent;border-radius:var(--radius-sm);color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors),var(--transition-shadow)}.ea-segmented__option:hover:not(.ea-segmented__option--selected):not(.ea-segmented__option--disabled){color:var(--color-text-primary);background-color:var(--color-state-active)}.ea-segmented__option:focus-visible{box-shadow:var(--shadow-focus-ring);outline:none}.ea-segmented__option--selected{background-color:var(--color-bg-base);border-color:var(--color-border-default);color:var(--color-text-primary);box-shadow:var(--shadow-sm)}.ea-segmented__option--disabled{cursor:not-allowed}\n"] }]
+                    ], template: "<div\n  class=\"ea-segmented-field\"\n  [class.ea-segmented-field--full-width]=\"fullWidth()\">\n  @if (label(); as labelText) {\n    <ea-field-label\n      [text]=\"labelText\"\n      [labelId]=\"id() + '-label'\"\n      [required]=\"required()\" />\n  }\n\n  <div\n    class=\"ea-segmented\"\n    role=\"radiogroup\"\n    [ngClass]=\"hostClasses()\"\n    [attr.aria-labelledby]=\"label() ? id() + '-label' : null\"\n    [attr.aria-label]=\"!label() ? (ariaLabel() ?? null) : null\"\n    [attr.aria-required]=\"required() || null\"\n    [attr.aria-invalid]=\"hasError() || null\"\n    [attr.aria-disabled]=\"isDisabled() || null\"\n    [attr.aria-describedby]=\"\n      showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n    \">\n    @for (option of options(); track option.value; let i = $index) {\n      <button\n        #optionEl\n        type=\"button\"\n        class=\"ea-segmented__option\"\n        role=\"radio\"\n        [class.ea-segmented__option--selected]=\"isSelected(option)\"\n        [class.ea-segmented__option--disabled]=\"isOptionDisabled(option)\"\n        [attr.aria-checked]=\"isSelected(option)\"\n        [attr.aria-disabled]=\"isOptionDisabled(option) || null\"\n        [disabled]=\"isOptionDisabled(option)\"\n        [attr.tabindex]=\"isSelected(option) || (!value() && i === 0) ? 0 : -1\"\n        (click)=\"select(option)\"\n        (keydown)=\"handleKeydown($event, i)\">\n        {{ option.label }}\n      </button>\n    }\n  </div>\n\n  <ea-field-messages\n    [id]=\"id()\"\n    [error]=\"showError() ? errorMsg() : null\"\n    [hint]=\"showHint() ? hint() : null\" />\n</div>\n", styles: [":host{display:flex}:host(.ea-segmented-host--full-width){display:block;width:100%}.ea-segmented-field{display:inline-flex;flex-direction:column;gap:var(--space-1-5)}.ea-segmented-field--full-width{width:100%}.ea-segmented{display:inline-flex;flex-direction:row;flex-wrap:wrap;row-gap:var(--space-0-5);max-width:100%;padding:var(--space-0-5);background-color:var(--color-bg-muted);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);font-family:var(--font-family-sans)}.ea-segmented--full-width{display:flex;width:100%}.ea-segmented--full-width .ea-segmented__option{flex:1}.ea-segmented--disabled{opacity:.5;cursor:not-allowed}.ea-segmented--error{border-color:var(--color-error-default)}.ea-segmented--xs .ea-segmented__option{font-size:var(--font-size-xs)}.ea-segmented--sm .ea-segmented__option{font-size:var(--font-size-sm)}.ea-segmented--md .ea-segmented__option{font-size:var(--font-size-md)}.ea-segmented--lg .ea-segmented__option{font-size:var(--font-size-lg)}.ea-segmented--xl .ea-segmented__option{font-size:var(--font-size-xl)}.ea-segmented__option{display:inline-flex;align-items:center;justify-content:center;gap:.375em;min-height:2.25em;padding:.375em .75em;font-weight:var(--font-weight-medium);line-height:var(--line-height-tight);background:transparent;border:var(--border-width-thin) solid transparent;border-radius:var(--radius-sm);color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors),var(--transition-shadow)}.ea-segmented__option:hover:not(.ea-segmented__option--selected):not(.ea-segmented__option--disabled){color:var(--color-text-primary);background-color:var(--color-state-active)}.ea-segmented__option:focus-visible{box-shadow:var(--shadow-focus-ring);outline:none}.ea-segmented__option--selected{background-color:var(--color-bg-base);border-color:var(--color-border-default);color:var(--color-text-primary);box-shadow:var(--shadow-sm)}.ea-segmented__option--disabled{cursor:not-allowed}\n"] }]
         }], propDecorators: { buttonEls: [{ type: i0.ViewChildren, args: ['optionEl', { isSignal: true }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], errorMsg: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMsg", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], fullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullWidth", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
 
 // Default value formatter, identity-checked so a custom `formatValue` bypasses
@@ -10140,11 +10957,11 @@ class StepperComponent {
         return -1;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: StepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: StepperComponent, isStandalone: true, selector: "ea-stepper", inputs: { activeStep: { classPropertyName: "activeStep", publicName: "activeStep", isSignal: true, isRequired: false, transformFunction: null }, linear: { classPropertyName: "linear", publicName: "linear", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeStep: "activeStepChange", changed: "changed" }, ngImport: i0, template: "<div\n  class=\"ea-stepper\"\n  [ngClass]=\"hostClasses()\">\n  <div\n    class=\"ea-stepper__list\"\n    role=\"tablist\"\n    (keydown)=\"handleKeydown($event)\">\n    @for (step of registeredSteps(); let i = $index; track step) {\n      <div class=\"ea-stepper__item\">\n        <button\n          type=\"button\"\n          role=\"tab\"\n          class=\"ea-stepper__button\"\n          [class.ea-stepper__button--active]=\"i === activeStep()\"\n          [class.ea-stepper__button--completed]=\"step.completed()\"\n          [id]=\"step.id() + '-tab'\"\n          [attr.aria-controls]=\"step.id() + '-panel'\"\n          [attr.aria-selected]=\"i === activeStep()\"\n          [attr.aria-current]=\"i === activeStep() ? 'step' : null\"\n          [disabled]=\"!canNavigateTo(i)\"\n          [tabindex]=\"i === activeStep() ? 0 : -1\"\n          (click)=\"selectStep(i)\">\n          <span\n            class=\"ea-stepper__circle\"\n            aria-hidden=\"true\">\n            @if (step.completed()) {\n              <ea-icon-check />\n            } @else {\n              {{ i + 1 }}\n            }\n          </span>\n          <span class=\"ea-stepper__label\">\n            {{ step.label() }}\n            @if (step.optional()) {\n              <span class=\"ea-stepper__optional\">\n                ({{ i18n.messages().stepper.optional }})\n              </span>\n            }\n          </span>\n        </button>\n        @if (i < registeredSteps().length - 1) {\n          <span\n            class=\"ea-stepper__connector\"\n            [class.ea-stepper__connector--completed]=\"step.completed()\"\n            aria-hidden=\"true\">\n          </span>\n        }\n      </div>\n    }\n  </div>\n  <ng-content />\n</div>\n", styles: [".ea-stepper{display:flex;flex-direction:column;gap:var(--space-4)}.ea-stepper--xs{font-size:var(--font-size-xs)}.ea-stepper--sm{font-size:var(--font-size-sm)}.ea-stepper--md{font-size:var(--font-size-md)}.ea-stepper--lg{font-size:var(--font-size-lg)}.ea-stepper--xl{font-size:var(--font-size-xl)}.ea-stepper__list{display:flex;align-items:stretch;gap:var(--space-2);margin:0;padding:0;list-style:none}.ea-stepper__item{display:flex;align-items:center;flex:1;min-width:0}.ea-stepper__button{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;padding:0;border:none;background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-stepper__button:focus-visible{outline:none}.ea-stepper__button:focus-visible .ea-stepper__circle{box-shadow:var(--shadow-focus-ring)}.ea-stepper__button:hover:not(:disabled){color:var(--color-text-primary)}.ea-stepper__button:disabled{cursor:not-allowed;color:var(--color-text-disabled)}.ea-stepper__circle{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:2em;height:2em;font-weight:var(--font-weight-medium);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-full);background-color:var(--color-bg-base);color:var(--color-text-secondary);transition:var(--transition-colors)}.ea-stepper__circle ea-icon-check{width:.875em;height:.875em}.ea-stepper__button--active .ea-stepper__circle,.ea-stepper__button--completed .ea-stepper__circle{border-color:var(--color-brand-default);background-color:var(--color-brand-default);color:var(--color-text-inverse)}.ea-stepper__button:disabled .ea-stepper__circle{border-color:var(--color-border-default);background-color:var(--color-bg-muted);color:var(--color-text-disabled)}.ea-stepper__label{display:flex;flex-direction:column;align-items:flex-start;font-size:.875em;font-weight:var(--font-weight-medium);text-align:left;line-height:var(--line-height-tight)}.ea-stepper__button--active .ea-stepper__label{color:var(--color-text-primary)}.ea-stepper__optional{font-size:var(--font-size-xs);font-weight:var(--font-weight-regular);color:var(--color-text-tertiary)}.ea-stepper__connector{display:block;flex:1;align-self:center;min-width:var(--space-4);height:var(--border-width-thin);margin:0 var(--space-2);background-color:var(--color-border-default);transition:var(--transition-colors)}.ea-stepper__connector--completed{background-color:var(--color-brand-default)}.ea-stepper--disabled{opacity:.6;pointer-events:none}.ea-step__panel:focus-visible{outline:none}\n"], dependencies: [{ kind: "component", type: CheckIconComponent, selector: "ea-icon-check" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: StepperComponent, isStandalone: true, selector: "ea-stepper", inputs: { activeStep: { classPropertyName: "activeStep", publicName: "activeStep", isSignal: true, isRequired: false, transformFunction: null }, linear: { classPropertyName: "linear", publicName: "linear", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeStep: "activeStepChange", changed: "changed" }, ngImport: i0, template: "<div\n  class=\"ea-stepper\"\n  [ngClass]=\"hostClasses()\">\n  <div\n    class=\"ea-stepper__list\"\n    role=\"tablist\"\n    (keydown)=\"handleKeydown($event)\">\n    @for (step of registeredSteps(); let i = $index; track step) {\n      <button\n        type=\"button\"\n        role=\"tab\"\n        class=\"ea-stepper__button\"\n        [class.ea-stepper__button--active]=\"i === activeStep()\"\n        [class.ea-stepper__button--completed]=\"step.completed()\"\n        [id]=\"step.id() + '-tab'\"\n        [attr.aria-controls]=\"step.id() + '-panel'\"\n        [attr.aria-selected]=\"i === activeStep()\"\n        [attr.aria-current]=\"i === activeStep() ? 'step' : null\"\n        [disabled]=\"!canNavigateTo(i)\"\n        [tabindex]=\"i === activeStep() ? 0 : -1\"\n        (click)=\"selectStep(i)\">\n        <span\n          class=\"ea-stepper__circle\"\n          aria-hidden=\"true\">\n          @if (step.completed()) {\n            <ea-icon-check />\n          } @else {\n            {{ i + 1 }}\n          }\n        </span>\n        <span class=\"ea-stepper__label\">\n          {{ step.label() }}\n          @if (step.optional()) {\n            <span class=\"ea-stepper__optional\">\n              ({{ i18n.messages().stepper.optional }})\n            </span>\n          }\n        </span>\n      </button>\n      @if (i < registeredSteps().length - 1) {\n        <span\n          class=\"ea-stepper__connector\"\n          [class.ea-stepper__connector--completed]=\"step.completed()\"\n          aria-hidden=\"true\">\n        </span>\n      }\n    }\n  </div>\n  <ng-content />\n</div>\n", styles: [".ea-stepper{display:flex;flex-direction:column;gap:var(--space-4)}.ea-stepper--xs{font-size:var(--font-size-xs)}.ea-stepper--sm{font-size:var(--font-size-sm)}.ea-stepper--md{font-size:var(--font-size-md)}.ea-stepper--lg{font-size:var(--font-size-lg)}.ea-stepper--xl{font-size:var(--font-size-xl)}.ea-stepper__list{display:flex;align-items:center;gap:var(--space-2);margin:0;padding:0;list-style:none}.ea-stepper__button{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;padding:0;border:none;background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-stepper__button:focus-visible{outline:none}.ea-stepper__button:focus-visible .ea-stepper__circle{box-shadow:var(--shadow-focus-ring)}.ea-stepper__button:hover:not(:disabled){color:var(--color-text-primary)}.ea-stepper__button:disabled{cursor:not-allowed;color:var(--color-text-disabled)}.ea-stepper__circle{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:2em;height:2em;font-weight:var(--font-weight-medium);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-full);background-color:var(--color-bg-base);color:var(--color-text-secondary);transition:var(--transition-colors)}.ea-stepper__circle ea-icon-check{width:.875em;height:.875em}.ea-stepper__button--active .ea-stepper__circle,.ea-stepper__button--completed .ea-stepper__circle{border-color:var(--color-brand-default);background-color:var(--color-brand-default);color:var(--color-text-inverse)}.ea-stepper__button:disabled .ea-stepper__circle{border-color:var(--color-border-default);background-color:var(--color-bg-muted);color:var(--color-text-disabled)}.ea-stepper__label{display:flex;flex-direction:column;align-items:flex-start;font-size:.875em;font-weight:var(--font-weight-medium);text-align:left;line-height:var(--line-height-tight)}.ea-stepper__button--active .ea-stepper__label{color:var(--color-text-primary)}.ea-stepper__optional{font-size:var(--font-size-xs);font-weight:var(--font-weight-regular);color:var(--color-text-tertiary)}.ea-stepper__connector{display:block;flex:1;align-self:center;min-width:var(--space-4);height:var(--border-width-thin);background-color:var(--color-border-default);transition:var(--transition-colors)}.ea-stepper__connector--completed{background-color:var(--color-brand-default)}.ea-stepper--disabled{opacity:.6;pointer-events:none}.ea-step__panel:focus-visible{outline:none}\n"], dependencies: [{ kind: "component", type: CheckIconComponent, selector: "ea-icon-check" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: StepperComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ea-stepper', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CheckIconComponent, NgClass], template: "<div\n  class=\"ea-stepper\"\n  [ngClass]=\"hostClasses()\">\n  <div\n    class=\"ea-stepper__list\"\n    role=\"tablist\"\n    (keydown)=\"handleKeydown($event)\">\n    @for (step of registeredSteps(); let i = $index; track step) {\n      <div class=\"ea-stepper__item\">\n        <button\n          type=\"button\"\n          role=\"tab\"\n          class=\"ea-stepper__button\"\n          [class.ea-stepper__button--active]=\"i === activeStep()\"\n          [class.ea-stepper__button--completed]=\"step.completed()\"\n          [id]=\"step.id() + '-tab'\"\n          [attr.aria-controls]=\"step.id() + '-panel'\"\n          [attr.aria-selected]=\"i === activeStep()\"\n          [attr.aria-current]=\"i === activeStep() ? 'step' : null\"\n          [disabled]=\"!canNavigateTo(i)\"\n          [tabindex]=\"i === activeStep() ? 0 : -1\"\n          (click)=\"selectStep(i)\">\n          <span\n            class=\"ea-stepper__circle\"\n            aria-hidden=\"true\">\n            @if (step.completed()) {\n              <ea-icon-check />\n            } @else {\n              {{ i + 1 }}\n            }\n          </span>\n          <span class=\"ea-stepper__label\">\n            {{ step.label() }}\n            @if (step.optional()) {\n              <span class=\"ea-stepper__optional\">\n                ({{ i18n.messages().stepper.optional }})\n              </span>\n            }\n          </span>\n        </button>\n        @if (i < registeredSteps().length - 1) {\n          <span\n            class=\"ea-stepper__connector\"\n            [class.ea-stepper__connector--completed]=\"step.completed()\"\n            aria-hidden=\"true\">\n          </span>\n        }\n      </div>\n    }\n  </div>\n  <ng-content />\n</div>\n", styles: [".ea-stepper{display:flex;flex-direction:column;gap:var(--space-4)}.ea-stepper--xs{font-size:var(--font-size-xs)}.ea-stepper--sm{font-size:var(--font-size-sm)}.ea-stepper--md{font-size:var(--font-size-md)}.ea-stepper--lg{font-size:var(--font-size-lg)}.ea-stepper--xl{font-size:var(--font-size-xl)}.ea-stepper__list{display:flex;align-items:stretch;gap:var(--space-2);margin:0;padding:0;list-style:none}.ea-stepper__item{display:flex;align-items:center;flex:1;min-width:0}.ea-stepper__button{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;padding:0;border:none;background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-stepper__button:focus-visible{outline:none}.ea-stepper__button:focus-visible .ea-stepper__circle{box-shadow:var(--shadow-focus-ring)}.ea-stepper__button:hover:not(:disabled){color:var(--color-text-primary)}.ea-stepper__button:disabled{cursor:not-allowed;color:var(--color-text-disabled)}.ea-stepper__circle{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:2em;height:2em;font-weight:var(--font-weight-medium);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-full);background-color:var(--color-bg-base);color:var(--color-text-secondary);transition:var(--transition-colors)}.ea-stepper__circle ea-icon-check{width:.875em;height:.875em}.ea-stepper__button--active .ea-stepper__circle,.ea-stepper__button--completed .ea-stepper__circle{border-color:var(--color-brand-default);background-color:var(--color-brand-default);color:var(--color-text-inverse)}.ea-stepper__button:disabled .ea-stepper__circle{border-color:var(--color-border-default);background-color:var(--color-bg-muted);color:var(--color-text-disabled)}.ea-stepper__label{display:flex;flex-direction:column;align-items:flex-start;font-size:.875em;font-weight:var(--font-weight-medium);text-align:left;line-height:var(--line-height-tight)}.ea-stepper__button--active .ea-stepper__label{color:var(--color-text-primary)}.ea-stepper__optional{font-size:var(--font-size-xs);font-weight:var(--font-weight-regular);color:var(--color-text-tertiary)}.ea-stepper__connector{display:block;flex:1;align-self:center;min-width:var(--space-4);height:var(--border-width-thin);margin:0 var(--space-2);background-color:var(--color-border-default);transition:var(--transition-colors)}.ea-stepper__connector--completed{background-color:var(--color-brand-default)}.ea-stepper--disabled{opacity:.6;pointer-events:none}.ea-step__panel:focus-visible{outline:none}\n"] }]
+            args: [{ selector: 'ea-stepper', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CheckIconComponent, NgClass], template: "<div\n  class=\"ea-stepper\"\n  [ngClass]=\"hostClasses()\">\n  <div\n    class=\"ea-stepper__list\"\n    role=\"tablist\"\n    (keydown)=\"handleKeydown($event)\">\n    @for (step of registeredSteps(); let i = $index; track step) {\n      <button\n        type=\"button\"\n        role=\"tab\"\n        class=\"ea-stepper__button\"\n        [class.ea-stepper__button--active]=\"i === activeStep()\"\n        [class.ea-stepper__button--completed]=\"step.completed()\"\n        [id]=\"step.id() + '-tab'\"\n        [attr.aria-controls]=\"step.id() + '-panel'\"\n        [attr.aria-selected]=\"i === activeStep()\"\n        [attr.aria-current]=\"i === activeStep() ? 'step' : null\"\n        [disabled]=\"!canNavigateTo(i)\"\n        [tabindex]=\"i === activeStep() ? 0 : -1\"\n        (click)=\"selectStep(i)\">\n        <span\n          class=\"ea-stepper__circle\"\n          aria-hidden=\"true\">\n          @if (step.completed()) {\n            <ea-icon-check />\n          } @else {\n            {{ i + 1 }}\n          }\n        </span>\n        <span class=\"ea-stepper__label\">\n          {{ step.label() }}\n          @if (step.optional()) {\n            <span class=\"ea-stepper__optional\">\n              ({{ i18n.messages().stepper.optional }})\n            </span>\n          }\n        </span>\n      </button>\n      @if (i < registeredSteps().length - 1) {\n        <span\n          class=\"ea-stepper__connector\"\n          [class.ea-stepper__connector--completed]=\"step.completed()\"\n          aria-hidden=\"true\">\n        </span>\n      }\n    }\n  </div>\n  <ng-content />\n</div>\n", styles: [".ea-stepper{display:flex;flex-direction:column;gap:var(--space-4)}.ea-stepper--xs{font-size:var(--font-size-xs)}.ea-stepper--sm{font-size:var(--font-size-sm)}.ea-stepper--md{font-size:var(--font-size-md)}.ea-stepper--lg{font-size:var(--font-size-lg)}.ea-stepper--xl{font-size:var(--font-size-xl)}.ea-stepper__list{display:flex;align-items:center;gap:var(--space-2);margin:0;padding:0;list-style:none}.ea-stepper__button{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;padding:0;border:none;background:none;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-colors)}.ea-stepper__button:focus-visible{outline:none}.ea-stepper__button:focus-visible .ea-stepper__circle{box-shadow:var(--shadow-focus-ring)}.ea-stepper__button:hover:not(:disabled){color:var(--color-text-primary)}.ea-stepper__button:disabled{cursor:not-allowed;color:var(--color-text-disabled)}.ea-stepper__circle{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:2em;height:2em;font-weight:var(--font-weight-medium);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-full);background-color:var(--color-bg-base);color:var(--color-text-secondary);transition:var(--transition-colors)}.ea-stepper__circle ea-icon-check{width:.875em;height:.875em}.ea-stepper__button--active .ea-stepper__circle,.ea-stepper__button--completed .ea-stepper__circle{border-color:var(--color-brand-default);background-color:var(--color-brand-default);color:var(--color-text-inverse)}.ea-stepper__button:disabled .ea-stepper__circle{border-color:var(--color-border-default);background-color:var(--color-bg-muted);color:var(--color-text-disabled)}.ea-stepper__label{display:flex;flex-direction:column;align-items:flex-start;font-size:.875em;font-weight:var(--font-weight-medium);text-align:left;line-height:var(--line-height-tight)}.ea-stepper__button--active .ea-stepper__label{color:var(--color-text-primary)}.ea-stepper__optional{font-size:var(--font-size-xs);font-weight:var(--font-weight-regular);color:var(--color-text-tertiary)}.ea-stepper__connector{display:block;flex:1;align-self:center;min-width:var(--space-4);height:var(--border-width-thin);background-color:var(--color-border-default);transition:var(--transition-colors)}.ea-stepper__connector--completed{background-color:var(--color-brand-default)}.ea-stepper--disabled{opacity:.6;pointer-events:none}.ea-step__panel:focus-visible{outline:none}\n"] }]
         }], propDecorators: { activeStep: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeStep", required: false }] }, { type: i0.Output, args: ["activeStepChange"] }], linear: [{ type: i0.Input, args: [{ isSignal: true, alias: "linear", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
 
 /**
@@ -10387,9 +11204,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
                 }]
         }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
 
+const DEFAULT_ROWS = 3;
 /**
  * Multiline text field that mirrors the `ea-input` API. Supports configurable
- * `rows`, `resize` direction, and `maxlength`, and integrates with Angular
+ * `resize` direction and `maxlength`, and integrates with Angular
  * forms via `ControlValueAccessor`.
  */
 class TextareaComponent {
@@ -10402,18 +11220,13 @@ class TextareaComponent {
     disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
     required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
-    /**
-     * @deprecated Use `maxHeight` and the `resize` handle to control height; this
-     * sets the initial height only. Will be removed in v3.0.0.
-     */
-    rows = input(3, ...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
     resize = input('vertical', ...(ngDevMode ? [{ debugName: "resize" }] : /* istanbul ignore next */ []));
     maxlength = input(undefined, ...(ngDevMode ? [{ debugName: "maxlength" }] : /* istanbul ignore next */ []));
     /** Optional pixel ceiling for the textarea's height. Beyond it, the inner
      * field scrolls vertically instead of growing. */
     maxHeight = input(undefined, ...(ngDevMode ? [{ debugName: "maxHeight" }] : /* istanbul ignore next */ []));
     /** Optional pixel floor for the textarea's height. Clamped so it never drops
-     * below the height implied by `rows`. */
+     * below the default height. */
     minHeight = input(undefined, ...(ngDevMode ? [{ debugName: "minHeight" }] : /* istanbul ignore next */ []));
     id = input(uniqueId('ea-textarea'), ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
     value = model('', ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
@@ -10436,12 +11249,11 @@ class TextareaComponent {
         'ea-textarea-wrapper--disabled': this.isDisabled(),
         'ea-textarea-wrapper--readonly': this.readonly(),
     }), ...(ngDevMode ? [{ debugName: "wrapperClasses" }] : /* istanbul ignore next */ []));
-    // Drive the visible height from `rows` directly (as a flex item the native
-    // `rows` attribute gets collapsed): an em-based min-height of `rows` lines plus
-    // padding keeps it proportional to the size. A consumer `minHeight` (px) raises
-    // the floor but can never shrink it below that calculated value.
+    // Default em-based min-height of 3 lines plus padding keeps it proportional to
+    // the size; a consumer `minHeight` (px) raises the floor but can never shrink it
+    // below that calculated value.
     minHeightStyle = computed(() => {
-        const rowsHeight = `calc(${this.rows()} * var(--line-height-normal) * 1em + 0.75em * 2)`;
+        const rowsHeight = `calc(${DEFAULT_ROWS} * var(--line-height-normal) * 1em + 0.75em * 2)`;
         const px = this.minHeight();
         return px && px > 0 ? `max(${rowsHeight}, ${px}px)` : rowsHeight;
     }, ...(ngDevMode ? [{ debugName: "minHeightStyle" }] : /* istanbul ignore next */ []));
@@ -10476,13 +11288,13 @@ class TextareaComponent {
         this.textareaEl()?.nativeElement.focus();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: TextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: TextareaComponent, isStandalone: true, selector: "ea-textarea", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, errorMsg: { classPropertyName: "errorMsg", publicName: "errorMsg", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, resize: { classPropertyName: "resize", publicName: "resize", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", focused: "focused", blurred: "blurred" }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: TextareaComponent, isStandalone: true, selector: "ea-textarea", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, errorMsg: { classPropertyName: "errorMsg", publicName: "errorMsg", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, resize: { classPropertyName: "resize", publicName: "resize", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", focused: "focused", blurred: "blurred" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => TextareaComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "textareaEl", first: true, predicate: ["textareaEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ea-textarea-field\">\n  @if (label(); as labelText) {\n    <ea-field-label\n      [text]=\"labelText\"\n      [forId]=\"id()\"\n      [required]=\"required()\" />\n  }\n\n  <div\n    class=\"ea-textarea-wrapper\"\n    [ngClass]=\"wrapperClasses()\"\n    [style.resize]=\"resize()\"\n    [style.min-height]=\"minHeightStyle()\"\n    [style.max-height.px]=\"maxHeight() ?? null\">\n    <textarea\n      #textareaEl\n      class=\"ea-textarea\"\n      [id]=\"id()\"\n      [placeholder]=\"placeholder()\"\n      [disabled]=\"isDisabled()\"\n      [readOnly]=\"readonly()\"\n      [required]=\"required()\"\n      [rows]=\"rows()\"\n      [value]=\"value()\"\n      [attr.maxlength]=\"maxlength() ?? null\"\n      [attr.aria-invalid]=\"hasError() || null\"\n      [attr.aria-describedby]=\"\n        showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n      \"\n      (input)=\"handleInput($event)\"\n      (focus)=\"handleFocus($event)\"\n      (blur)=\"handleBlur($event)\"></textarea>\n  </div>\n\n  <ea-field-messages\n    [id]=\"id()\"\n    [error]=\"showError() ? errorMsg() : null\"\n    [hint]=\"showHint() ? hint() : null\" />\n</div>\n", styles: [".ea-textarea-field{display:flex;flex-direction:column;gap:var(--space-1-5);color:var(--color-text-secondary)}.ea-textarea-wrapper{display:flex;min-width:12em;background-color:var(--color-bg-base);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);transition:var(--transition-colors),var(--transition-shadow);overflow:hidden}.ea-textarea-wrapper--xs{font-size:var(--font-size-xs)}.ea-textarea-wrapper--sm{font-size:var(--font-size-sm)}.ea-textarea-wrapper--md{font-size:var(--font-size-md)}.ea-textarea-wrapper--lg{font-size:var(--font-size-lg)}.ea-textarea-wrapper--xl{font-size:var(--font-size-xl)}.ea-textarea-wrapper--focused{border-color:var(--color-border-focus);box-shadow:var(--shadow-focus-ring)}.ea-textarea-wrapper--error{border-color:var(--color-error-default)}.ea-textarea-wrapper--error.ea-textarea-wrapper--focused{box-shadow:var(--shadow-focus-ring-error)}.ea-textarea-wrapper--disabled{background-color:var(--color-bg-muted);border-color:var(--color-border-default);cursor:not-allowed;opacity:.6}.ea-textarea-wrapper--disabled .ea-textarea{cursor:not-allowed}.ea-textarea-wrapper--readonly{background-color:var(--color-bg-subtle)}.ea-textarea{flex:1;width:100%;min-width:0;padding:.75em;background:transparent;border:none;outline:none;resize:none;color:var(--color-text-primary);font-family:var(--font-family-sans);line-height:var(--line-height-normal)}.ea-textarea::placeholder{color:var(--color-text-tertiary)}.ea-textarea:disabled{cursor:not-allowed}\n"], dependencies: [{ kind: "component", type: FieldLabelComponent, selector: "ea-field-label", inputs: ["text", "forId", "required", "labelId"] }, { kind: "component", type: FieldMessagesComponent, selector: "ea-field-messages", inputs: ["id", "error", "hint"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        ], viewQueries: [{ propertyName: "textareaEl", first: true, predicate: ["textareaEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ea-textarea-field\">\n  @if (label(); as labelText) {\n    <ea-field-label\n      [text]=\"labelText\"\n      [forId]=\"id()\"\n      [required]=\"required()\" />\n  }\n\n  <div\n    class=\"ea-textarea-wrapper\"\n    [ngClass]=\"wrapperClasses()\"\n    [style.resize]=\"resize()\"\n    [style.min-height]=\"minHeightStyle()\"\n    [style.max-height.px]=\"maxHeight() ?? null\">\n    <textarea\n      #textareaEl\n      class=\"ea-textarea\"\n      [id]=\"id()\"\n      [placeholder]=\"placeholder()\"\n      [disabled]=\"isDisabled()\"\n      [readOnly]=\"readonly()\"\n      [required]=\"required()\"\n      [value]=\"value()\"\n      [attr.maxlength]=\"maxlength() ?? null\"\n      [attr.aria-invalid]=\"hasError() || null\"\n      [attr.aria-describedby]=\"\n        showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n      \"\n      (input)=\"handleInput($event)\"\n      (focus)=\"handleFocus($event)\"\n      (blur)=\"handleBlur($event)\"></textarea>\n  </div>\n\n  <ea-field-messages\n    [id]=\"id()\"\n    [error]=\"showError() ? errorMsg() : null\"\n    [hint]=\"showHint() ? hint() : null\" />\n</div>\n", styles: [".ea-textarea-field{display:flex;flex-direction:column;gap:var(--space-1-5);color:var(--color-text-secondary)}.ea-textarea-wrapper{display:flex;min-width:12em;background-color:var(--color-bg-base);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);transition:var(--transition-colors),var(--transition-shadow);overflow:hidden}.ea-textarea-wrapper--xs{font-size:var(--font-size-xs)}.ea-textarea-wrapper--sm{font-size:var(--font-size-sm)}.ea-textarea-wrapper--md{font-size:var(--font-size-md)}.ea-textarea-wrapper--lg{font-size:var(--font-size-lg)}.ea-textarea-wrapper--xl{font-size:var(--font-size-xl)}.ea-textarea-wrapper--focused{border-color:var(--color-border-focus);box-shadow:var(--shadow-focus-ring)}.ea-textarea-wrapper--error{border-color:var(--color-error-default)}.ea-textarea-wrapper--error.ea-textarea-wrapper--focused{box-shadow:var(--shadow-focus-ring-error)}.ea-textarea-wrapper--disabled{background-color:var(--color-bg-muted);border-color:var(--color-border-default);cursor:not-allowed;opacity:.6}.ea-textarea-wrapper--disabled .ea-textarea{cursor:not-allowed}.ea-textarea-wrapper--readonly{background-color:var(--color-bg-subtle)}.ea-textarea{flex:1;width:100%;min-width:0;padding:.75em;background:transparent;border:none;outline:none;resize:none;color:var(--color-text-primary);font-family:var(--font-family-sans);line-height:var(--line-height-normal)}.ea-textarea::placeholder{color:var(--color-text-tertiary)}.ea-textarea:disabled{cursor:not-allowed}\n"], dependencies: [{ kind: "component", type: FieldLabelComponent, selector: "ea-field-label", inputs: ["text", "forId", "required", "labelId"] }, { kind: "component", type: FieldMessagesComponent, selector: "ea-field-messages", inputs: ["id", "error", "hint"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: TextareaComponent, decorators: [{
             type: Component,
@@ -10492,8 +11304,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
                             useExisting: forwardRef(() => TextareaComponent),
                             multi: true,
                         },
-                    ], template: "<div class=\"ea-textarea-field\">\n  @if (label(); as labelText) {\n    <ea-field-label\n      [text]=\"labelText\"\n      [forId]=\"id()\"\n      [required]=\"required()\" />\n  }\n\n  <div\n    class=\"ea-textarea-wrapper\"\n    [ngClass]=\"wrapperClasses()\"\n    [style.resize]=\"resize()\"\n    [style.min-height]=\"minHeightStyle()\"\n    [style.max-height.px]=\"maxHeight() ?? null\">\n    <textarea\n      #textareaEl\n      class=\"ea-textarea\"\n      [id]=\"id()\"\n      [placeholder]=\"placeholder()\"\n      [disabled]=\"isDisabled()\"\n      [readOnly]=\"readonly()\"\n      [required]=\"required()\"\n      [rows]=\"rows()\"\n      [value]=\"value()\"\n      [attr.maxlength]=\"maxlength() ?? null\"\n      [attr.aria-invalid]=\"hasError() || null\"\n      [attr.aria-describedby]=\"\n        showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n      \"\n      (input)=\"handleInput($event)\"\n      (focus)=\"handleFocus($event)\"\n      (blur)=\"handleBlur($event)\"></textarea>\n  </div>\n\n  <ea-field-messages\n    [id]=\"id()\"\n    [error]=\"showError() ? errorMsg() : null\"\n    [hint]=\"showHint() ? hint() : null\" />\n</div>\n", styles: [".ea-textarea-field{display:flex;flex-direction:column;gap:var(--space-1-5);color:var(--color-text-secondary)}.ea-textarea-wrapper{display:flex;min-width:12em;background-color:var(--color-bg-base);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);transition:var(--transition-colors),var(--transition-shadow);overflow:hidden}.ea-textarea-wrapper--xs{font-size:var(--font-size-xs)}.ea-textarea-wrapper--sm{font-size:var(--font-size-sm)}.ea-textarea-wrapper--md{font-size:var(--font-size-md)}.ea-textarea-wrapper--lg{font-size:var(--font-size-lg)}.ea-textarea-wrapper--xl{font-size:var(--font-size-xl)}.ea-textarea-wrapper--focused{border-color:var(--color-border-focus);box-shadow:var(--shadow-focus-ring)}.ea-textarea-wrapper--error{border-color:var(--color-error-default)}.ea-textarea-wrapper--error.ea-textarea-wrapper--focused{box-shadow:var(--shadow-focus-ring-error)}.ea-textarea-wrapper--disabled{background-color:var(--color-bg-muted);border-color:var(--color-border-default);cursor:not-allowed;opacity:.6}.ea-textarea-wrapper--disabled .ea-textarea{cursor:not-allowed}.ea-textarea-wrapper--readonly{background-color:var(--color-bg-subtle)}.ea-textarea{flex:1;width:100%;min-width:0;padding:.75em;background:transparent;border:none;outline:none;resize:none;color:var(--color-text-primary);font-family:var(--font-family-sans);line-height:var(--line-height-normal)}.ea-textarea::placeholder{color:var(--color-text-tertiary)}.ea-textarea:disabled{cursor:not-allowed}\n"] }]
-        }], propDecorators: { textareaEl: [{ type: i0.ViewChild, args: ['textareaEl', { isSignal: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], errorMsg: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMsg", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], resize: [{ type: i0.Input, args: [{ isSignal: true, alias: "resize", required: false }] }], maxlength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxlength", required: false }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }], minHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "minHeight", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], focused: [{ type: i0.Output, args: ["focused"] }], blurred: [{ type: i0.Output, args: ["blurred"] }] } });
+                    ], template: "<div class=\"ea-textarea-field\">\n  @if (label(); as labelText) {\n    <ea-field-label\n      [text]=\"labelText\"\n      [forId]=\"id()\"\n      [required]=\"required()\" />\n  }\n\n  <div\n    class=\"ea-textarea-wrapper\"\n    [ngClass]=\"wrapperClasses()\"\n    [style.resize]=\"resize()\"\n    [style.min-height]=\"minHeightStyle()\"\n    [style.max-height.px]=\"maxHeight() ?? null\">\n    <textarea\n      #textareaEl\n      class=\"ea-textarea\"\n      [id]=\"id()\"\n      [placeholder]=\"placeholder()\"\n      [disabled]=\"isDisabled()\"\n      [readOnly]=\"readonly()\"\n      [required]=\"required()\"\n      [value]=\"value()\"\n      [attr.maxlength]=\"maxlength() ?? null\"\n      [attr.aria-invalid]=\"hasError() || null\"\n      [attr.aria-describedby]=\"\n        showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n      \"\n      (input)=\"handleInput($event)\"\n      (focus)=\"handleFocus($event)\"\n      (blur)=\"handleBlur($event)\"></textarea>\n  </div>\n\n  <ea-field-messages\n    [id]=\"id()\"\n    [error]=\"showError() ? errorMsg() : null\"\n    [hint]=\"showHint() ? hint() : null\" />\n</div>\n", styles: [".ea-textarea-field{display:flex;flex-direction:column;gap:var(--space-1-5);color:var(--color-text-secondary)}.ea-textarea-wrapper{display:flex;min-width:12em;background-color:var(--color-bg-base);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);transition:var(--transition-colors),var(--transition-shadow);overflow:hidden}.ea-textarea-wrapper--xs{font-size:var(--font-size-xs)}.ea-textarea-wrapper--sm{font-size:var(--font-size-sm)}.ea-textarea-wrapper--md{font-size:var(--font-size-md)}.ea-textarea-wrapper--lg{font-size:var(--font-size-lg)}.ea-textarea-wrapper--xl{font-size:var(--font-size-xl)}.ea-textarea-wrapper--focused{border-color:var(--color-border-focus);box-shadow:var(--shadow-focus-ring)}.ea-textarea-wrapper--error{border-color:var(--color-error-default)}.ea-textarea-wrapper--error.ea-textarea-wrapper--focused{box-shadow:var(--shadow-focus-ring-error)}.ea-textarea-wrapper--disabled{background-color:var(--color-bg-muted);border-color:var(--color-border-default);cursor:not-allowed;opacity:.6}.ea-textarea-wrapper--disabled .ea-textarea{cursor:not-allowed}.ea-textarea-wrapper--readonly{background-color:var(--color-bg-subtle)}.ea-textarea{flex:1;width:100%;min-width:0;padding:.75em;background:transparent;border:none;outline:none;resize:none;color:var(--color-text-primary);font-family:var(--font-family-sans);line-height:var(--line-height-normal)}.ea-textarea::placeholder{color:var(--color-text-tertiary)}.ea-textarea:disabled{cursor:not-allowed}\n"] }]
+        }], propDecorators: { textareaEl: [{ type: i0.ViewChild, args: ['textareaEl', { isSignal: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], errorMsg: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMsg", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], resize: [{ type: i0.Input, args: [{ isSignal: true, alias: "resize", required: false }] }], maxlength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxlength", required: false }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }], minHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "minHeight", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], focused: [{ type: i0.Output, args: ["focused"] }], blurred: [{ type: i0.Output, args: ["blurred"] }] } });
 
 class ChevronUpIconComponent extends IconComponentBase {
     static slug = 'chevron-up';
@@ -11194,16 +12006,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
 class ToastComponent {
     toastService = inject(ToastService);
     i18n = inject(EagamiI18nService);
+    /** Viewport corner or edge the toast stack is pinned to. */
+    position = input('bottom-right', ...(ngDevMode ? [{ debugName: "position" }] : /* istanbul ignore next */ []));
+    /** Show a dismiss button on each toast. */
+    clearable = input(true, ...(ngDevMode ? [{ debugName: "clearable" }] : /* istanbul ignore next */ []));
+    containerClass = computed(() => `ea-toast-container ea-toast-container--${this.position()}`, ...(ngDevMode ? [{ debugName: "containerClass" }] : /* istanbul ignore next */ []));
     getRole(toast) {
         return toast.variant === 'error' || toast.variant === 'warning' ? 'alert' : 'status';
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: ToastComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: ToastComponent, isStandalone: true, selector: "ea-toast", ngImport: i0, template: "@if (toastService.toasts().length) {\n  <div\n    class=\"ea-toast-container\"\n    aria-live=\"polite\"\n    aria-atomic=\"false\">\n    @for (toast of toastService.toasts(); track toast.id) {\n      <div\n        class=\"ea-toast ea-toast--{{ toast.variant }}\"\n        [attr.role]=\"getRole(toast)\"\n        [attr.aria-live]=\"getRole(toast) === 'alert' ? 'assertive' : 'polite'\">\n        <span class=\"ea-toast__message\">{{ toast.message }}</span>\n        <button\n          class=\"ea-toast__close\"\n          type=\"button\"\n          [attr.aria-label]=\"i18n.messages().toast.dismiss\"\n          (click)=\"toastService.dismiss(toast.id)\">\n          <ea-icon-x />\n        </button>\n      </div>\n    }\n  </div>\n}\n", styles: [".ea-toast-container{position:fixed;bottom:var(--space-6);right:var(--space-6);left:var(--space-6);z-index:var(--z-index-toast);display:flex;flex-direction:column;align-items:flex-end;gap:var(--space-2);pointer-events:none}@media(min-width:640px){.ea-toast-container{left:auto;max-width:24rem}}.ea-toast{display:flex;align-items:center;gap:var(--space-3);width:100%;padding:var(--space-3) var(--space-4);font-family:var(--font-family-sans);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-normal);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);pointer-events:auto;animation:ea-toast-slide-in var(--duration-slow) var(--ease-out)}@media(min-width:640px){.ea-toast{width:auto}}.ea-toast--default{background-color:var(--color-neutral-800);color:var(--color-neutral-0)}.ea-toast--success{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-success-subtle),var(--color-success-subtle));color:var(--color-success-text)}.ea-toast--warning{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-warning-subtle),var(--color-warning-subtle));color:var(--color-warning-text)}.ea-toast--error{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-error-subtle),var(--color-error-subtle));color:var(--color-error-text)}.ea-toast--info{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-info-subtle),var(--color-info-subtle));color:var(--color-info-text)}.ea-toast__message{flex:1;min-width:0}.ea-toast__close{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-toast__close>*{font-size:1.25em}.ea-toast__close:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-toast__close:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-toast__close:disabled{cursor:not-allowed;opacity:.5}.ea-toast__close ea-icon-x{width:1em;height:1em}@keyframes ea-toast-slide-in{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}@media(prefers-reduced-motion:reduce){.ea-toast{animation-name:ea-toast-fade-in}}@keyframes ea-toast-fade-in{0%{opacity:0}to{opacity:1}}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .ea-toast--success{color:var(--color-success-200)}:root:not([data-theme=light]) .ea-toast--warning{color:var(--color-warning-200)}:root:not([data-theme=light]) .ea-toast--error{color:var(--color-error-200)}:root:not([data-theme=light]) .ea-toast--info{color:var(--color-info-200)}}:root[data-theme=dark] .ea-toast--success{color:var(--color-success-200)}:root[data-theme=dark] .ea-toast--warning{color:var(--color-warning-200)}:root[data-theme=dark] .ea-toast--error{color:var(--color-error-200)}:root[data-theme=dark] .ea-toast--info{color:var(--color-info-200)}\n"], dependencies: [{ kind: "component", type: XIconComponent, selector: "ea-icon-x" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: ToastComponent, isStandalone: true, selector: "ea-toast", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (toastService.toasts().length) {\n  <div\n    [class]=\"containerClass()\"\n    aria-live=\"polite\"\n    aria-atomic=\"false\">\n    @for (toast of toastService.toasts(); track toast.id) {\n      <div\n        class=\"ea-toast ea-toast--{{ toast.variant }}\"\n        [attr.role]=\"getRole(toast)\"\n        [attr.aria-live]=\"getRole(toast) === 'alert' ? 'assertive' : 'polite'\">\n        <span class=\"ea-toast__message\">{{ toast.message }}</span>\n        @if (clearable()) {\n          <button\n            class=\"ea-toast__close\"\n            type=\"button\"\n            [attr.aria-label]=\"i18n.messages().toast.dismiss\"\n            (click)=\"toastService.dismiss(toast.id)\">\n            <ea-icon-x />\n          </button>\n        }\n      </div>\n    }\n  </div>\n}\n", styles: [".ea-toast-container{position:fixed;z-index:var(--z-index-toast);display:flex;flex-direction:column;gap:var(--space-2);max-width:min(24rem,100vw - var(--space-6) * 2);pointer-events:none}.ea-toast-container--top-left,.ea-toast-container--top,.ea-toast-container--top-right{top:var(--space-6)}.ea-toast-container--bottom-left,.ea-toast-container--bottom,.ea-toast-container--bottom-right{bottom:var(--space-6)}.ea-toast-container--top-left,.ea-toast-container--bottom-left{left:var(--space-6);align-items:flex-start}.ea-toast-container--top-right,.ea-toast-container--bottom-right{right:var(--space-6);align-items:flex-end}.ea-toast-container--top,.ea-toast-container--bottom{left:50%;align-items:center;transform:translate(-50%)}.ea-toast-container--top-left .ea-toast,.ea-toast-container--bottom-left .ea-toast{--ea-toast-enter-x: -100%}.ea-toast-container--top .ea-toast{--ea-toast-enter-x: 0;--ea-toast-enter-y: -100%}.ea-toast-container--bottom .ea-toast{--ea-toast-enter-x: 0;--ea-toast-enter-y: 100%}.ea-toast{--ea-toast-enter-x: 100%;--ea-toast-enter-y: 0;display:flex;align-items:center;gap:var(--space-3);width:100%;padding:var(--space-3) var(--space-4);font-family:var(--font-family-sans);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-normal);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);pointer-events:auto;animation:ea-toast-slide-in var(--duration-slow) var(--ease-out)}@media(min-width:640px){.ea-toast{width:auto}}.ea-toast--default{background-color:var(--color-neutral-800);color:var(--color-neutral-0)}.ea-toast--success{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-success-subtle),var(--color-success-subtle));color:var(--color-success-text)}.ea-toast--warning{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-warning-subtle),var(--color-warning-subtle));color:var(--color-warning-text)}.ea-toast--error{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-error-subtle),var(--color-error-subtle));color:var(--color-error-text)}.ea-toast--info{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-info-subtle),var(--color-info-subtle));color:var(--color-info-text)}.ea-toast__message{flex:1;min-width:0}.ea-toast__close{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-toast__close>*{font-size:1.25em}.ea-toast__close:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-toast__close:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-toast__close:disabled{cursor:not-allowed;opacity:.5}.ea-toast__close ea-icon-x{width:1em;height:1em}@keyframes ea-toast-slide-in{0%{opacity:0;transform:translate(var(--ea-toast-enter-x),var(--ea-toast-enter-y))}to{opacity:1;transform:translate(0)}}@media(prefers-reduced-motion:reduce){.ea-toast{animation-name:ea-toast-fade-in}}@keyframes ea-toast-fade-in{0%{opacity:0}to{opacity:1}}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .ea-toast--success{color:var(--color-success-200)}:root:not([data-theme=light]) .ea-toast--warning{color:var(--color-warning-200)}:root:not([data-theme=light]) .ea-toast--error{color:var(--color-error-200)}:root:not([data-theme=light]) .ea-toast--info{color:var(--color-info-200)}}:root[data-theme=dark] .ea-toast--success{color:var(--color-success-200)}:root[data-theme=dark] .ea-toast--warning{color:var(--color-warning-200)}:root[data-theme=dark] .ea-toast--error{color:var(--color-error-200)}:root[data-theme=dark] .ea-toast--info{color:var(--color-info-200)}\n"], dependencies: [{ kind: "component", type: XIconComponent, selector: "ea-icon-x" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: ToastComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ea-toast', imports: [XIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "@if (toastService.toasts().length) {\n  <div\n    class=\"ea-toast-container\"\n    aria-live=\"polite\"\n    aria-atomic=\"false\">\n    @for (toast of toastService.toasts(); track toast.id) {\n      <div\n        class=\"ea-toast ea-toast--{{ toast.variant }}\"\n        [attr.role]=\"getRole(toast)\"\n        [attr.aria-live]=\"getRole(toast) === 'alert' ? 'assertive' : 'polite'\">\n        <span class=\"ea-toast__message\">{{ toast.message }}</span>\n        <button\n          class=\"ea-toast__close\"\n          type=\"button\"\n          [attr.aria-label]=\"i18n.messages().toast.dismiss\"\n          (click)=\"toastService.dismiss(toast.id)\">\n          <ea-icon-x />\n        </button>\n      </div>\n    }\n  </div>\n}\n", styles: [".ea-toast-container{position:fixed;bottom:var(--space-6);right:var(--space-6);left:var(--space-6);z-index:var(--z-index-toast);display:flex;flex-direction:column;align-items:flex-end;gap:var(--space-2);pointer-events:none}@media(min-width:640px){.ea-toast-container{left:auto;max-width:24rem}}.ea-toast{display:flex;align-items:center;gap:var(--space-3);width:100%;padding:var(--space-3) var(--space-4);font-family:var(--font-family-sans);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-normal);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);pointer-events:auto;animation:ea-toast-slide-in var(--duration-slow) var(--ease-out)}@media(min-width:640px){.ea-toast{width:auto}}.ea-toast--default{background-color:var(--color-neutral-800);color:var(--color-neutral-0)}.ea-toast--success{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-success-subtle),var(--color-success-subtle));color:var(--color-success-text)}.ea-toast--warning{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-warning-subtle),var(--color-warning-subtle));color:var(--color-warning-text)}.ea-toast--error{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-error-subtle),var(--color-error-subtle));color:var(--color-error-text)}.ea-toast--info{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-info-subtle),var(--color-info-subtle));color:var(--color-info-text)}.ea-toast__message{flex:1;min-width:0}.ea-toast__close{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-toast__close>*{font-size:1.25em}.ea-toast__close:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-toast__close:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-toast__close:disabled{cursor:not-allowed;opacity:.5}.ea-toast__close ea-icon-x{width:1em;height:1em}@keyframes ea-toast-slide-in{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}@media(prefers-reduced-motion:reduce){.ea-toast{animation-name:ea-toast-fade-in}}@keyframes ea-toast-fade-in{0%{opacity:0}to{opacity:1}}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .ea-toast--success{color:var(--color-success-200)}:root:not([data-theme=light]) .ea-toast--warning{color:var(--color-warning-200)}:root:not([data-theme=light]) .ea-toast--error{color:var(--color-error-200)}:root:not([data-theme=light]) .ea-toast--info{color:var(--color-info-200)}}:root[data-theme=dark] .ea-toast--success{color:var(--color-success-200)}:root[data-theme=dark] .ea-toast--warning{color:var(--color-warning-200)}:root[data-theme=dark] .ea-toast--error{color:var(--color-error-200)}:root[data-theme=dark] .ea-toast--info{color:var(--color-info-200)}\n"] }]
-        }] });
+            args: [{ selector: 'ea-toast', imports: [XIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "@if (toastService.toasts().length) {\n  <div\n    [class]=\"containerClass()\"\n    aria-live=\"polite\"\n    aria-atomic=\"false\">\n    @for (toast of toastService.toasts(); track toast.id) {\n      <div\n        class=\"ea-toast ea-toast--{{ toast.variant }}\"\n        [attr.role]=\"getRole(toast)\"\n        [attr.aria-live]=\"getRole(toast) === 'alert' ? 'assertive' : 'polite'\">\n        <span class=\"ea-toast__message\">{{ toast.message }}</span>\n        @if (clearable()) {\n          <button\n            class=\"ea-toast__close\"\n            type=\"button\"\n            [attr.aria-label]=\"i18n.messages().toast.dismiss\"\n            (click)=\"toastService.dismiss(toast.id)\">\n            <ea-icon-x />\n          </button>\n        }\n      </div>\n    }\n  </div>\n}\n", styles: [".ea-toast-container{position:fixed;z-index:var(--z-index-toast);display:flex;flex-direction:column;gap:var(--space-2);max-width:min(24rem,100vw - var(--space-6) * 2);pointer-events:none}.ea-toast-container--top-left,.ea-toast-container--top,.ea-toast-container--top-right{top:var(--space-6)}.ea-toast-container--bottom-left,.ea-toast-container--bottom,.ea-toast-container--bottom-right{bottom:var(--space-6)}.ea-toast-container--top-left,.ea-toast-container--bottom-left{left:var(--space-6);align-items:flex-start}.ea-toast-container--top-right,.ea-toast-container--bottom-right{right:var(--space-6);align-items:flex-end}.ea-toast-container--top,.ea-toast-container--bottom{left:50%;align-items:center;transform:translate(-50%)}.ea-toast-container--top-left .ea-toast,.ea-toast-container--bottom-left .ea-toast{--ea-toast-enter-x: -100%}.ea-toast-container--top .ea-toast{--ea-toast-enter-x: 0;--ea-toast-enter-y: -100%}.ea-toast-container--bottom .ea-toast{--ea-toast-enter-x: 0;--ea-toast-enter-y: 100%}.ea-toast{--ea-toast-enter-x: 100%;--ea-toast-enter-y: 0;display:flex;align-items:center;gap:var(--space-3);width:100%;padding:var(--space-3) var(--space-4);font-family:var(--font-family-sans);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-normal);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);pointer-events:auto;animation:ea-toast-slide-in var(--duration-slow) var(--ease-out)}@media(min-width:640px){.ea-toast{width:auto}}.ea-toast--default{background-color:var(--color-neutral-800);color:var(--color-neutral-0)}.ea-toast--success{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-success-subtle),var(--color-success-subtle));color:var(--color-success-text)}.ea-toast--warning{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-warning-subtle),var(--color-warning-subtle));color:var(--color-warning-text)}.ea-toast--error{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-error-subtle),var(--color-error-subtle));color:var(--color-error-text)}.ea-toast--info{background-color:var(--color-bg-elevated);background-image:linear-gradient(var(--color-info-subtle),var(--color-info-subtle));color:var(--color-info-text)}.ea-toast__message{flex:1;min-width:0}.ea-toast__close{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-toast__close>*{font-size:1.25em}.ea-toast__close:hover{background-color:var(--color-state-hover);color:var(--color-text-primary)}.ea-toast__close:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}.ea-toast__close:disabled{cursor:not-allowed;opacity:.5}.ea-toast__close ea-icon-x{width:1em;height:1em}@keyframes ea-toast-slide-in{0%{opacity:0;transform:translate(var(--ea-toast-enter-x),var(--ea-toast-enter-y))}to{opacity:1;transform:translate(0)}}@media(prefers-reduced-motion:reduce){.ea-toast{animation-name:ea-toast-fade-in}}@keyframes ea-toast-fade-in{0%{opacity:0}to{opacity:1}}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .ea-toast--success{color:var(--color-success-200)}:root:not([data-theme=light]) .ea-toast--warning{color:var(--color-warning-200)}:root:not([data-theme=light]) .ea-toast--error{color:var(--color-error-200)}:root:not([data-theme=light]) .ea-toast--info{color:var(--color-info-200)}}:root[data-theme=dark] .ea-toast--success{color:var(--color-success-200)}:root[data-theme=dark] .ea-toast--warning{color:var(--color-warning-200)}:root[data-theme=dark] .ea-toast--error{color:var(--color-error-200)}:root[data-theme=dark] .ea-toast--info{color:var(--color-info-200)}\n"] }]
+        }], propDecorators: { position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }] } });
 
 class ChevronsLeftIconComponent extends IconComponentBase {
     static slug = 'chevrons-left';
@@ -20129,6 +20946,132 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
                 }]
         }] });
 
+class HalfCircleIconComponent extends IconComponentBase {
+    static slug = 'half-circle';
+    static category = 'eagami';
+    static tags = [
+        'half-circle',
+        'half',
+        'left',
+        'partial',
+        'rating',
+        'circle',
+        'round',
+        'shape',
+        'demi-cercle',
+        'demi',
+        'gauche',
+        'medio-círculo',
+        'medio',
+        'izquierda',
+        'μισός-κύκλος',
+        'μισό',
+        'αριστερά',
+        'pół-koła',
+        'pół',
+        'lewa',
+    ];
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: HalfCircleIconComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.16", type: HalfCircleIconComponent, isStandalone: true, selector: "ea-icon-half-circle", usesInheritance: true, ngImport: i0, template: `
+    <svg
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      [attr.stroke-width]="strokeWidth()"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+      aria-hidden="true"
+      width="100%"
+      height="100%">
+      <path d="M12 2 A10 10 0 0 0 12 22 Z" />
+    </svg>
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: HalfCircleIconComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ea-icon-half-circle',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: `
+    <svg
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      [attr.stroke-width]="strokeWidth()"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+      aria-hidden="true"
+      width="100%"
+      height="100%">
+      <path d="M12 2 A10 10 0 0 0 12 22 Z" />
+    </svg>
+  `,
+                }]
+        }] });
+
+class HalfHeartIconComponent extends IconComponentBase {
+    static slug = 'half-heart';
+    static category = 'eagami';
+    static tags = [
+        'half-heart',
+        'half',
+        'left',
+        'partial',
+        'rating',
+        'heart',
+        'love',
+        'shape',
+        'demi-cœur',
+        'demi',
+        'gauche',
+        'medio-corazón',
+        'medio',
+        'izquierda',
+        'μισή-καρδιά',
+        'μισό',
+        'αριστερά',
+        'pół-serca',
+        'pół',
+        'lewa',
+    ];
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: HalfHeartIconComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.16", type: HalfHeartIconComponent, isStandalone: true, selector: "ea-icon-half-heart", usesInheritance: true, ngImport: i0, template: `
+    <svg
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      [attr.stroke-width]="strokeWidth()"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+      aria-hidden="true"
+      width="100%"
+      height="100%">
+      <path d="M12 5.67 L10.94 4.61 a5.5 5.5 0 0 0 -7.78 7.78 L12 21.23 Z" />
+    </svg>
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: HalfHeartIconComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ea-icon-half-heart',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: `
+    <svg
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      [attr.stroke-width]="strokeWidth()"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+      aria-hidden="true"
+      width="100%"
+      height="100%">
+      <path d="M12 5.67 L10.94 4.61 a5.5 5.5 0 0 0 -7.78 7.78 L12 21.23 Z" />
+    </svg>
+  `,
+                }]
+        }] });
+
 class HardDriveIconComponent extends IconComponentBase {
     static slug = 'hard-drive';
     static category = 'feather';
@@ -32426,6 +33369,8 @@ const ICONS = [
     GlobeIconComponent,
     GoogleIconComponent,
     GridIconComponent,
+    HalfCircleIconComponent,
+    HalfHeartIconComponent,
     HardDriveIconComponent,
     HashIconComponent,
     HeadphonesIconComponent,
@@ -32619,5 +33564,5 @@ const ICONS = [
  * Generated bundle index. Do not edit.
  */
 
-export { AccordionComponent, AccordionItemComponent, ActivityIconComponent, AirplayIconComponent, AlertCircleIconComponent, AlertComponent, AlertOctagonIconComponent, AlertTriangleIconComponent, AlignCenterIconComponent, AlignJustifyIconComponent, AlignLeftIconComponent, AlignRightIconComponent, AnchorIconComponent, ApertureIconComponent, ArchiveIconComponent, ArrowDownCircleIconComponent, ArrowDownIconComponent, ArrowDownLeftIconComponent, ArrowDownRightIconComponent, ArrowLeftCircleIconComponent, ArrowLeftIconComponent, ArrowRightCircleIconComponent, ArrowRightIconComponent, ArrowUpCircleIconComponent, ArrowUpIconComponent, ArrowUpLeftIconComponent, ArrowUpRightIconComponent, AtSignIconComponent, AutocompleteComponent, AvatarComponent, AvatarEditorComponent, AwardIconComponent, BadgeComponent, BarChart2IconComponent, BarChartIconComponent, BatteryChargingIconComponent, BatteryIconComponent, BellIconComponent, BellOffIconComponent, BluetoothIconComponent, BoldIconComponent, BookIconComponent, BookOpenIconComponent, BookmarkIconComponent, BottleIconComponent, BoxIconComponent, BreadcrumbsComponent, BriefcaseIconComponent, ButtonComponent, CalendarIconComponent, CameraIconComponent, CameraOffIconComponent, CandleIconComponent, CardComponent, CastIconComponent, CheckCircleIconComponent, CheckIconComponent, CheckSquareIconComponent, CheckboxComponent, ChevronDownIconComponent, ChevronLeftIconComponent, ChevronRightIconComponent, ChevronUpIconComponent, ChevronsDownIconComponent, ChevronsLeftIconComponent, ChevronsRightIconComponent, ChevronsUpDownIconComponent, ChevronsUpIconComponent, ChromeIconComponent, CircleIconComponent, ClipboardIconComponent, ClockIconComponent, CloudDrizzleIconComponent, CloudIconComponent, CloudLightningIconComponent, CloudOffIconComponent, CloudRainIconComponent, CloudSnowIconComponent, CloudflareIconComponent, CodeIconComponent, CodeInputComponent, CodepenIconComponent, CodesandboxIconComponent, CoffeeIconComponent, ColorPickerComponent, ColumnsIconComponent, CommandIconComponent, CommandPaletteComponent, CompassIconComponent, CopyIconComponent, CornerDownLeftIconComponent, CornerDownRightIconComponent, CornerLeftDownIconComponent, CornerLeftUpIconComponent, CornerRightDownIconComponent, CornerRightUpIconComponent, CornerUpLeftIconComponent, CornerUpRightIconComponent, CpuIconComponent, CreditCardIconComponent, CropIconComponent, CrosshairIconComponent, DEFAULT_PALETTE_ROLES, DataTableComponent, DatabaseIconComponent, DatePickerComponent, DeleteIconComponent, DialogComponent, DiscIconComponent, DiscordIconComponent, DivideCircleIconComponent, DivideIconComponent, DivideSquareIconComponent, DividerComponent, DockerIconComponent, DollarSignIconComponent, DownloadCloudIconComponent, DownloadIconComponent, DrawerComponent, DribbbleIconComponent, DropboxIconComponent, DropdownComponent, DropletIconComponent, EAGAMI_I18N_CONFIG, EAGAMI_LOCALES, EAGAMI_MESSAGES, EagamiI18nService, EagamiIconComponent, EagamiWordmarkComponent, Edit2IconComponent, Edit3IconComponent, EditIconComponent, EmptyStateComponent, ExternalLinkIconComponent, EyeIconComponent, EyeOffIconComponent, Facebook2IconComponent, FacebookIconComponent, FastForwardIconComponent, FeatherIconComponent, FieldLabelComponent, FieldMessagesComponent, Figma2IconComponent, FigmaIconComponent, FileIconComponent, FileMinusIconComponent, FilePlusIconComponent, FileTextIconComponent, FileUploaderComponent, FilmIconComponent, FilterIconComponent, FlagIconComponent, FolderIconComponent, FolderMinusIconComponent, FolderPlusIconComponent, FramerIconComponent, FrownIconComponent, GiftIconComponent, GitBranchIconComponent, GitCommitIconComponent, GitMergeIconComponent, GitPullRequestIconComponent, Github2IconComponent, GithubIconComponent, GitlabIconComponent, GlobeIconComponent, GoogleIconComponent, GridIconComponent, HardDriveIconComponent, HashIconComponent, HeadphonesIconComponent, HeartIconComponent, HelpCircleIconComponent, HeptagonIconComponent, HexagonIconComponent, HomeIconComponent, ICONS, IconComponentBase, ImageIconComponent, InboxIconComponent, InfoIconComponent, InputComponent, InstagramIconComponent, ItalicIconComponent, KeyIconComponent, KubernetesIconComponent, LampIconComponent, LayersIconComponent, LayoutIconComponent, LeftHalfStarIconComponent, LifeBuoyIconComponent, Link2IconComponent, LinkIconComponent, Linkedin2IconComponent, LinkedinIconComponent, ListIconComponent, LoaderIconComponent, LockIconComponent, LogInIconComponent, LogOutIconComponent, MailIconComponent, MapIconComponent, MapPinIconComponent, MastercardIconComponent, Maximize2IconComponent, MaximizeIconComponent, MehIconComponent, MenuComponent, MenuIconComponent, MenuItemComponent, MenuTriggerDirective, MessageCircleIconComponent, MessageSquareIconComponent, MicIconComponent, MicOffIconComponent, MicrosoftIconComponent, Minimize2IconComponent, MinimizeIconComponent, MinusCircleIconComponent, MinusIconComponent, MinusSquareIconComponent, MongodbIconComponent, MonitorIconComponent, MoonIconComponent, MoreHorizontalIconComponent, MoreVerticalIconComponent, MousePointerIconComponent, MoveIconComponent, MultiSelectComponent, MusicIconComponent, Navigation2IconComponent, NavigationIconComponent, NetlifyIconComponent, NotionIconComponent, NpmIconComponent, OctagonIconComponent, PackageIconComponent, PaginatorComponent, PaperclipIconComponent, PauseCircleIconComponent, PauseIconComponent, PaypalIconComponent, PenToolIconComponent, PentagonIconComponent, PercentIconComponent, PhoneCallIconComponent, PhoneForwardedIconComponent, PhoneIconComponent, PhoneIncomingIconComponent, PhoneMissedIconComponent, PhoneOffIconComponent, PhoneOutgoingIconComponent, PieChartIconComponent, PlayCircleIconComponent, PlayIconComponent, PlusCircleIconComponent, PlusIconComponent, PlusSquareIconComponent, PocketIconComponent, PopoverComponent, PowerIconComponent, PrinterIconComponent, ProgressBarComponent, RadioComponent, RadioGroupComponent, RadioIconComponent, RangeSliderComponent, RatingComponent, RectangleHorizontalIconComponent, RectangleVerticalIconComponent, RedditIconComponent, RefreshCcwIconComponent, RefreshCwIconComponent, RepeatIconComponent, RewindIconComponent, RightHalfStarIconComponent, RotateCcwIconComponent, RotateCwIconComponent, RssIconComponent, SaveIconComponent, ScissorsIconComponent, SearchIconComponent, SegmentedComponent, SendIconComponent, ServerIconComponent, SettingsIconComponent, Share2IconComponent, ShareIconComponent, ShieldIconComponent, ShieldOffIconComponent, ShoppingBagIconComponent, ShoppingCartIconComponent, ShuffleIconComponent, SidebarIconComponent, SkeletonComponent, SkipBackIconComponent, SkipForwardIconComponent, Slack2IconComponent, SlackIconComponent, SlashIconComponent, SliderComponent, SlidersIconComponent, SmartphoneIconComponent, SmileIconComponent, SoccerBallIconComponent, SpeakerIconComponent, SpinnerComponent, SpotifyIconComponent, SquareIconComponent, StarIconComponent, StepComponent, StepperComponent, StopCircleIconComponent, StripeIconComponent, SunIconComponent, SunriseIconComponent, SunsetIconComponent, SwitchComponent, TabComponent, TableIconComponent, TabletIconComponent, TabsComponent, TagComponent, TagIconComponent, TargetIconComponent, TerminalIconComponent, TextareaComponent, ThermometerIconComponent, ThumbsDownIconComponent, ThumbsUpIconComponent, TimePickerComponent, ToastComponent, ToastService, ToggleLeftIconComponent, ToggleRightIconComponent, ToolIconComponent, TooltipDirective, TransferListComponent, Trash2IconComponent, TrashIconComponent, TreeComponent, TrelloIconComponent, TrendingDownIconComponent, TrendingUpIconComponent, TriangleIconComponent, TrophyIconComponent, TruckIconComponent, TvIconComponent, Twitch2IconComponent, TwitchIconComponent, TwitterIconComponent, TypeIconComponent, UmbrellaIconComponent, UnderlineIconComponent, UnlockIconComponent, UploadCloudIconComponent, UploadIconComponent, UserCheckIconComponent, UserIconComponent, UserMinusIconComponent, UserPlusIconComponent, UserXIconComponent, UsersIconComponent, VercelIconComponent, VideoIconComponent, VideoOffIconComponent, VirtualListComponent, VoicemailIconComponent, Volume1IconComponent, Volume2IconComponent, VolumeIconComponent, VolumeXIconComponent, WCAG_AA, WatchIconComponent, WifiIconComponent, WifiOffIconComponent, WindIconComponent, XCircleIconComponent, XIconComponent, XOctagonIconComponent, XSquareIconComponent, XTwitterIconComponent, Youtube2IconComponent, YoutubeIconComponent, ZapIconComponent, ZapOffIconComponent, ZoomInIconComponent, ZoomOutIconComponent, applyPalette, computePopoverPosition, contrastRatio, derivePalette, el, en, esES, formatViolations, frFR, frenchSpacing, hexToOklch, iconDisplayName, oklchToHex, pl, provideEagamiUi, relativeLuminance, validatePalette, visibleNodeIds, walkTree };
+export { AccordionComponent, AccordionItemComponent, ActivityIconComponent, AirplayIconComponent, AlertCircleIconComponent, AlertComponent, AlertOctagonIconComponent, AlertTriangleIconComponent, AlignCenterIconComponent, AlignJustifyIconComponent, AlignLeftIconComponent, AlignRightIconComponent, AnchorIconComponent, ApertureIconComponent, ArchiveIconComponent, ArrowDownCircleIconComponent, ArrowDownIconComponent, ArrowDownLeftIconComponent, ArrowDownRightIconComponent, ArrowLeftCircleIconComponent, ArrowLeftIconComponent, ArrowRightCircleIconComponent, ArrowRightIconComponent, ArrowUpCircleIconComponent, ArrowUpIconComponent, ArrowUpLeftIconComponent, ArrowUpRightIconComponent, AtSignIconComponent, AutocompleteComponent, AvatarComponent, AvatarEditorComponent, AwardIconComponent, BadgeComponent, BarChart2IconComponent, BarChartIconComponent, BatteryChargingIconComponent, BatteryIconComponent, BellIconComponent, BellOffIconComponent, BluetoothIconComponent, BoldIconComponent, BookIconComponent, BookOpenIconComponent, BookmarkIconComponent, BottleIconComponent, BoxIconComponent, BreadcrumbsComponent, BriefcaseIconComponent, ButtonComponent, CalendarIconComponent, CameraIconComponent, CameraOffIconComponent, CandleIconComponent, CardComponent, CastIconComponent, CheckCircleIconComponent, CheckIconComponent, CheckSquareIconComponent, CheckboxComponent, ChevronDownIconComponent, ChevronLeftIconComponent, ChevronRightIconComponent, ChevronUpIconComponent, ChevronsDownIconComponent, ChevronsLeftIconComponent, ChevronsRightIconComponent, ChevronsUpDownIconComponent, ChevronsUpIconComponent, ChromeIconComponent, CircleIconComponent, ClipboardIconComponent, ClockIconComponent, CloudDrizzleIconComponent, CloudIconComponent, CloudLightningIconComponent, CloudOffIconComponent, CloudRainIconComponent, CloudSnowIconComponent, CloudflareIconComponent, CodeIconComponent, CodeInputComponent, CodepenIconComponent, CodesandboxIconComponent, CoffeeIconComponent, ColorPickerComponent, ColumnsIconComponent, CommandIconComponent, CommandPaletteComponent, CompassIconComponent, CopyIconComponent, CornerDownLeftIconComponent, CornerDownRightIconComponent, CornerLeftDownIconComponent, CornerLeftUpIconComponent, CornerRightDownIconComponent, CornerRightUpIconComponent, CornerUpLeftIconComponent, CornerUpRightIconComponent, CpuIconComponent, CreditCardIconComponent, CropIconComponent, CrosshairIconComponent, DEFAULT_PALETTE_ROLES, DataTableComponent, DatabaseIconComponent, DatePickerComponent, DeleteIconComponent, DialogComponent, DiscIconComponent, DiscordIconComponent, DivideCircleIconComponent, DivideIconComponent, DivideSquareIconComponent, DividerComponent, DockerIconComponent, DollarSignIconComponent, DownloadCloudIconComponent, DownloadIconComponent, DrawerComponent, DribbbleIconComponent, DropboxIconComponent, DropdownComponent, DropletIconComponent, EAGAMI_I18N_CONFIG, EAGAMI_LOCALES, EAGAMI_MESSAGES, EagamiI18nService, EagamiIconComponent, EagamiWordmarkComponent, Edit2IconComponent, Edit3IconComponent, EditIconComponent, EmptyStateComponent, ExternalLinkIconComponent, EyeIconComponent, EyeOffIconComponent, Facebook2IconComponent, FacebookIconComponent, FastForwardIconComponent, FeatherIconComponent, FieldLabelComponent, FieldMessagesComponent, Figma2IconComponent, FigmaIconComponent, FileIconComponent, FileMinusIconComponent, FilePlusIconComponent, FileTextIconComponent, FileUploaderComponent, FilmIconComponent, FilterIconComponent, FlagIconComponent, FolderIconComponent, FolderMinusIconComponent, FolderPlusIconComponent, FramerIconComponent, FrownIconComponent, GiftIconComponent, GitBranchIconComponent, GitCommitIconComponent, GitMergeIconComponent, GitPullRequestIconComponent, Github2IconComponent, GithubIconComponent, GitlabIconComponent, GlobeIconComponent, GoogleIconComponent, GridIconComponent, HalfCircleIconComponent, HalfHeartIconComponent, HardDriveIconComponent, HashIconComponent, HeadphonesIconComponent, HeartIconComponent, HelpCircleIconComponent, HeptagonIconComponent, HexagonIconComponent, HomeIconComponent, ICONS, IconComponentBase, ImageIconComponent, InboxIconComponent, InfoIconComponent, InputComponent, InstagramIconComponent, ItalicIconComponent, KeyIconComponent, KubernetesIconComponent, LampIconComponent, LayersIconComponent, LayoutIconComponent, LeftHalfStarIconComponent, LifeBuoyIconComponent, Link2IconComponent, LinkIconComponent, Linkedin2IconComponent, LinkedinIconComponent, ListIconComponent, LoaderIconComponent, LockIconComponent, LogInIconComponent, LogOutIconComponent, MailIconComponent, MapIconComponent, MapPinIconComponent, MastercardIconComponent, Maximize2IconComponent, MaximizeIconComponent, MehIconComponent, MenuComponent, MenuIconComponent, MenuItemComponent, MenuTriggerDirective, MessageCircleIconComponent, MessageSquareIconComponent, MicIconComponent, MicOffIconComponent, MicrosoftIconComponent, Minimize2IconComponent, MinimizeIconComponent, MinusCircleIconComponent, MinusIconComponent, MinusSquareIconComponent, MongodbIconComponent, MonitorIconComponent, MoonIconComponent, MoreHorizontalIconComponent, MoreVerticalIconComponent, MousePointerIconComponent, MoveIconComponent, MultiSelectComponent, MusicIconComponent, Navigation2IconComponent, NavigationIconComponent, NetlifyIconComponent, NotionIconComponent, NpmIconComponent, OctagonIconComponent, PackageIconComponent, PaginatorComponent, PaperclipIconComponent, PauseCircleIconComponent, PauseIconComponent, PaypalIconComponent, PenToolIconComponent, PentagonIconComponent, PercentIconComponent, PhoneCallIconComponent, PhoneForwardedIconComponent, PhoneIconComponent, PhoneIncomingIconComponent, PhoneMissedIconComponent, PhoneOffIconComponent, PhoneOutgoingIconComponent, PieChartIconComponent, PlayCircleIconComponent, PlayIconComponent, PlusCircleIconComponent, PlusIconComponent, PlusSquareIconComponent, PocketIconComponent, PopoverComponent, PowerIconComponent, PrinterIconComponent, ProgressBarComponent, RadioComponent, RadioGroupComponent, RadioIconComponent, RangeSliderComponent, RatingComponent, RectangleHorizontalIconComponent, RectangleVerticalIconComponent, RedditIconComponent, RefreshCcwIconComponent, RefreshCwIconComponent, RepeatIconComponent, RewindIconComponent, RightHalfStarIconComponent, RotateCcwIconComponent, RotateCwIconComponent, RssIconComponent, SaveIconComponent, ScissorsIconComponent, SearchIconComponent, SegmentedComponent, SendIconComponent, ServerIconComponent, SettingsIconComponent, Share2IconComponent, ShareIconComponent, ShieldIconComponent, ShieldOffIconComponent, ShoppingBagIconComponent, ShoppingCartIconComponent, ShuffleIconComponent, SidebarIconComponent, SkeletonComponent, SkipBackIconComponent, SkipForwardIconComponent, Slack2IconComponent, SlackIconComponent, SlashIconComponent, SliderComponent, SlidersIconComponent, SmartphoneIconComponent, SmileIconComponent, SoccerBallIconComponent, SpeakerIconComponent, SpinnerComponent, SpotifyIconComponent, SquareIconComponent, StarIconComponent, StepComponent, StepperComponent, StopCircleIconComponent, StripeIconComponent, SunIconComponent, SunriseIconComponent, SunsetIconComponent, SwitchComponent, TabComponent, TableIconComponent, TabletIconComponent, TabsComponent, TagComponent, TagIconComponent, TargetIconComponent, TerminalIconComponent, TextareaComponent, ThermometerIconComponent, ThumbsDownIconComponent, ThumbsUpIconComponent, TimePickerComponent, ToastComponent, ToastService, ToggleLeftIconComponent, ToggleRightIconComponent, ToolIconComponent, TooltipDirective, TransferListComponent, Trash2IconComponent, TrashIconComponent, TreeComponent, TrelloIconComponent, TrendingDownIconComponent, TrendingUpIconComponent, TriangleIconComponent, TrophyIconComponent, TruckIconComponent, TvIconComponent, Twitch2IconComponent, TwitchIconComponent, TwitterIconComponent, TypeIconComponent, UmbrellaIconComponent, UnderlineIconComponent, UnlockIconComponent, UploadCloudIconComponent, UploadIconComponent, UserCheckIconComponent, UserIconComponent, UserMinusIconComponent, UserPlusIconComponent, UserXIconComponent, UsersIconComponent, VercelIconComponent, VideoIconComponent, VideoOffIconComponent, VirtualListComponent, VoicemailIconComponent, Volume1IconComponent, Volume2IconComponent, VolumeIconComponent, VolumeXIconComponent, WCAG_AA, WatchIconComponent, WifiIconComponent, WifiOffIconComponent, WindIconComponent, XCircleIconComponent, XIconComponent, XOctagonIconComponent, XSquareIconComponent, XTwitterIconComponent, Youtube2IconComponent, YoutubeIconComponent, ZapIconComponent, ZapOffIconComponent, ZoomInIconComponent, ZoomOutIconComponent, applyPalette, computePopoverPosition, contrastRatio, derivePalette, el, en, esES, formatViolations, frFR, frenchSpacing, hexToOklch, iconDisplayName, oklchToHex, pl, provideEagamiUi, relativeLuminance, validatePalette, visibleNodeIds, walkTree };
 //# sourceMappingURL=eagami-ui.mjs.map