@ethlete/components 1.0.0-next.23 → 1.0.0-next.24

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/fesm2022/ethlete-components.mjs +180 -109
  3. package/fesm2022/ethlete-components.mjs.map +1 -1
  4. package/package.json +1 -1
  5. package/types/ethlete-components.d.ts +69 -22
package/fesm2022/ethlete-components.mjs CHANGED
@@ -5,7 +5,7 @@ import { injectStyleManager, SurfaceInteractiveDirective, RuntimeError, createCa
5
5
  import { NgTemplateOutlet, DOCUMENT as DOCUMENT$1, NgComponentOutlet, Location, isPlatformBrowser } from '@angular/common';
6
6
  import { DomSanitizer } from '@angular/platform-browser';
7
7
  import { endOfMonth, startOfWeek, startOfMonth, addDays, addYears, addMonths, startOfDay, isSameMonth, getDate, setDate, lastDayOfMonth, isBefore, format, isSameDay, isAfter, parse, isValid, setMilliseconds, setSeconds, setMinutes, setHours } from 'date-fns';
8
- import { withArgs, queryComputed, queryStateSignal, isQueryStateSuccess, isQueryStateFailure, isQueryStateLoading } from '@ethlete/query';
8
+ import { withArgs, queryComputed, queryStateSignal, isQueryStateSuccess, isQueryStateLoading, isQueryStateFailure } from '@ethlete/query';
9
9
  import { defer, filter, take, map, finalize, timer, switchMap, EMPTY, tap, Subject, fromEvent, merge, takeUntil, of, isObservable, from, catchError, distinctUntilChanged, concat, scan, debounceTime, animationFrameScheduler, combineLatest, exhaustMap, Observable, shareReplay, interval } from 'rxjs';
10
10
  import { toObservable, takeUntilDestroyed, toSignal, outputToObservable, outputFromObservable, rxResource } from '@angular/core/rxjs-interop';
11
11
  import { createManagedMetadataKey, metadata, validate, FORM_FIELD } from '@angular/forms/signals';
@@ -609,7 +609,7 @@ class ButtonComponent {
609
609
  <ng-template #iconTpl>
610
610
  <ng-content select="[etIcon]" />
611
611
  </ng-template>
612
- `, isInline: true, styles: ["@layer components{.et-button{--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-on-primary);--_et-button-border-color: transparent;display:inline-flex;position:relative;align-items:center;justify-content:center;gap:var(--et-button-gap);background:var(--_et-button-background);color:var(--_et-button-color);border-radius:var(--et-button-border-radius);padding:var(--et-button-padding);font-size:var(--et-button-font-size);font-weight:var(--et-button-font-weight);border:var(--et-button-border-width, .1rem) solid var(--_et-button-border-color);box-shadow:var(--et-button-shadow, 0 0 #0000);cursor:var(--et-button-cursor);text-decoration:none;appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;touch-action:manipulation;line-height:var(--et-button-line-height);white-space:nowrap}.et-button[data-can-animate]{transition:background .12s ease,color .12s ease,border-color .12s ease,box-shadow .12s ease,outline-color .12s ease,opacity .12s ease}.et-button:where([data-size=xs]){--et-button-padding: .2rem .8rem;--et-button-font-size: 1.2rem;--et-button-border-radius: .3rem;--et-button-gap: .4rem}.et-button:where([data-size=sm]){--et-button-padding: .4rem 1.2rem;--et-button-font-size: 1.4rem;--et-button-border-radius: .4rem;--et-button-gap: .5rem}.et-button:where([data-size=md]){--et-button-padding: .8rem 1.6rem;--et-button-font-size: 1.4rem;--et-button-border-radius: .4rem;--et-button-gap: .6rem}.et-button:where([data-size=lg]){--et-button-padding: 1rem 2rem;--et-button-font-size: 1.6rem;--et-button-border-radius: .6rem;--et-button-gap: .7rem}.et-button:where([data-size=xl]){--et-button-padding: 1.4rem 2.8rem;--et-button-font-size: 1.8rem;--et-button-border-radius: .8rem;--et-button-gap: .8rem}.et-button:where([disabled]),.et-button:where([aria-disabled=true]){cursor:not-allowed;pointer-events:none}.et-button:where([disabled],[aria-disabled=true]):where([data-variant=outline]),.et-button:where([disabled],[aria-disabled=true]):where([data-variant=tonal]),.et-button:where([disabled],[aria-disabled=true]):where([data-variant=transparent]),.et-button:where([disabled],[aria-disabled=true])[data-pressed=true]{opacity:var(--et-button-opacity-disabled)}.et-button:where([data-variant=outline]){--et-theme-color-primary-opacity: 0;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-ink-solid);--_et-button-border-color: var(--et-theme-color-ink-solid)}.et-button:where([data-variant=outline]):hover{--et-theme-color-primary-opacity: .08}.et-button:where([data-variant=outline]):focus-visible{--et-theme-color-primary-opacity: .12}.et-button:where([data-variant=outline]):active{--et-theme-color-primary-opacity: .16}.et-button[data-pressed=true]:where([data-pressed-variant=outline]){--et-theme-color-primary-opacity: 0;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-ink-solid);--_et-button-border-color: var(--et-theme-color-ink-solid)}.et-button[data-pressed=true]:where([data-pressed-variant=outline]):hover{--et-theme-color-primary-opacity: .08}.et-button[data-pressed=true]:where([data-pressed-variant=outline]):focus-visible{--et-theme-color-primary-opacity: .12}.et-button[data-pressed=true]:where([data-pressed-variant=outline]):active{--et-theme-color-primary-opacity: .16}.et-button[data-pressed=true]:where([data-pressed-variant=outline])[data-loading=true]:not([disabled],[aria-disabled=true]){--_et-button-color: var(--et-theme-color-primary-solid);--_et-button-border-color: var(--et-theme-color-primary-solid)}.et-button:where([data-variant=tonal]),.et-button[data-pressed=true]:where([data-pressed-variant=tonal]){--et-theme-color-primary-opacity: .16;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-ink-solid);--_et-button-border-color: transparent}:is(.et-button:where([data-variant=tonal]),.et-button[data-pressed=true]:where([data-pressed-variant=tonal])):hover{--et-theme-color-primary-opacity: .24}:is(.et-button:where([data-variant=tonal]),.et-button[data-pressed=true]:where([data-pressed-variant=tonal])):focus-visible{--et-theme-color-primary-opacity: .28}:is(.et-button:where([data-variant=tonal]),.et-button[data-pressed=true]:where([data-pressed-variant=tonal])):active{--et-theme-color-primary-opacity: .32}.et-button:where([data-variant=transparent]){--et-theme-color-primary-opacity: 0;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-ink-solid);--_et-button-border-color: transparent}.et-button:where([data-variant=transparent]):hover{--et-theme-color-primary-opacity: .08}.et-button:where([data-variant=transparent]):focus-visible{--et-theme-color-primary-opacity: .12}.et-button:where([data-variant=transparent]):active{--et-theme-color-primary-opacity: .16}.et-button[data-pressed=true]:where([data-pressed-variant=filled]){--et-theme-color-primary-opacity: 1;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-on-primary);--_et-button-border-color: transparent}.et-button[data-pressed=true]:where([data-pressed-variant=filled]):hover{--et-theme-color-primary-opacity: 1}.et-button[data-pressed=true]:where([data-pressed-variant=filled]):focus-visible{--et-theme-color-primary-opacity: 1}.et-button[data-pressed=true]:where([data-pressed-variant=filled]):active{--et-theme-color-primary-opacity: 1}.et-button[data-muted-until-pressed]:not([data-pressed=true]){--_et-button-color: currentColor}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 32%, transparent);--_et-button-border-color: transparent}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):hover:not([disabled]):not([aria-disabled=true]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 40%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):focus-visible{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 44%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):active{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 48%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]){--_et-button-background: transparent;--_et-button-border-color: var(--et-surface-interaction-solid)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):hover:not([disabled]):not([aria-disabled=true]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 12%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):focus-visible{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 16%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):active{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 20%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 16%, transparent);--_et-button-border-color: transparent}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):hover:not([disabled]):not([aria-disabled=true]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 24%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):focus-visible{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 28%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):active{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 32%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]){--_et-button-background: transparent;--_et-button-border-color: transparent}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):hover:not([disabled]):not([aria-disabled=true]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 12%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):focus-visible{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 16%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):active{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 20%, transparent)}.et-button .et-button-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:opacity .12s ease}.et-button .et-button-icon:empty{display:none}.et-button .et-button-icon .et-icon{width:1em;height:1em}.et-button .et-button-contents{display:inline-flex;align-items:center;min-width:0;transition:opacity .12s ease}.et-button[data-loading=true] .et-button-icon,.et-button[data-loading=true] .et-button-contents{opacity:0}.et-button[data-loading=true] .et-button-loader{opacity:1}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }], encapsulation: i0.ViewEncapsulation.None }); }
612
+ `, isInline: true, styles: ["@layer components{.et-button{--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-on-primary);--_et-button-border-color: transparent;display:inline-flex;position:relative;align-items:center;justify-content:center;gap:var(--et-button-gap);background:var(--_et-button-background);color:var(--_et-button-color);border-radius:var(--et-button-border-radius);padding:var(--et-button-padding);font-size:var(--et-button-font-size);font-weight:var(--et-button-font-weight);border:var(--et-button-border-width, .1rem) solid var(--_et-button-border-color);box-shadow:var(--et-button-shadow, 0 0 #0000);cursor:var(--et-button-cursor);text-decoration:none;appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;touch-action:manipulation;line-height:var(--et-button-line-height);white-space:nowrap}.et-button[data-can-animate]{transition:background .12s ease,color .12s ease,border-color .12s ease,box-shadow .12s ease,outline-color .12s ease,opacity .12s ease}.et-button:where([data-size=xs]){--et-button-padding: .2rem .8rem;--et-button-font-size: 1.2rem;--et-button-border-radius: .3rem;--et-button-gap: .4rem}.et-button:where([data-size=sm]){--et-button-padding: .4rem 1.2rem;--et-button-font-size: 1.4rem;--et-button-border-radius: .4rem;--et-button-gap: .5rem}.et-button:where([data-size=md]){--et-button-padding: .8rem 1.6rem;--et-button-font-size: 1.4rem;--et-button-border-radius: .4rem;--et-button-gap: .6rem}.et-button:where([data-size=lg]){--et-button-padding: 1rem 2rem;--et-button-font-size: 1.6rem;--et-button-border-radius: .6rem;--et-button-gap: .7rem}.et-button:where([data-size=xl]){--et-button-padding: 1.4rem 2.8rem;--et-button-font-size: 1.8rem;--et-button-border-radius: .8rem;--et-button-gap: .8rem}.et-button:where([disabled]),.et-button:where([aria-disabled=true]){cursor:not-allowed;pointer-events:none}.et-button:where([disabled],[aria-disabled=true]):where([data-variant=outline]),.et-button:where([disabled],[aria-disabled=true]):where([data-variant=tonal]),.et-button:where([disabled],[aria-disabled=true]):where([data-variant=transparent]),.et-button:where([disabled],[aria-disabled=true])[data-pressed=true]{opacity:var(--et-button-opacity-disabled)}.et-button:where([data-variant=outline]){--et-theme-color-primary-opacity: 0;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-ink-solid);--_et-button-border-color: var(--et-theme-color-ink-solid)}@media(hover:hover){.et-button:where([data-variant=outline]):hover{--et-theme-color-primary-opacity: .08}}.et-button:where([data-variant=outline]):focus-visible{--et-theme-color-primary-opacity: .12}.et-button:where([data-variant=outline]):active{--et-theme-color-primary-opacity: .16}.et-button[data-pressed=true]:where([data-pressed-variant=outline]){--et-theme-color-primary-opacity: 0;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-ink-solid);--_et-button-border-color: var(--et-theme-color-ink-solid)}@media(hover:hover){.et-button[data-pressed=true]:where([data-pressed-variant=outline]):hover{--et-theme-color-primary-opacity: .08}}.et-button[data-pressed=true]:where([data-pressed-variant=outline]):focus-visible{--et-theme-color-primary-opacity: .12}.et-button[data-pressed=true]:where([data-pressed-variant=outline]):active{--et-theme-color-primary-opacity: .16}.et-button[data-pressed=true]:where([data-pressed-variant=outline])[data-loading=true]:not([disabled],[aria-disabled=true]){--_et-button-color: var(--et-theme-color-primary-solid);--_et-button-border-color: var(--et-theme-color-primary-solid)}.et-button:where([data-variant=tonal]),.et-button[data-pressed=true]:where([data-pressed-variant=tonal]){--et-theme-color-primary-opacity: .16;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-ink-solid);--_et-button-border-color: transparent}@media(hover:hover){:is(.et-button:where([data-variant=tonal]),.et-button[data-pressed=true]:where([data-pressed-variant=tonal])):hover{--et-theme-color-primary-opacity: .24}}:is(.et-button:where([data-variant=tonal]),.et-button[data-pressed=true]:where([data-pressed-variant=tonal])):focus-visible{--et-theme-color-primary-opacity: .28}:is(.et-button:where([data-variant=tonal]),.et-button[data-pressed=true]:where([data-pressed-variant=tonal])):active{--et-theme-color-primary-opacity: .32}.et-button:where([data-variant=transparent]){--et-theme-color-primary-opacity: 0;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-ink-solid);--_et-button-border-color: transparent}@media(hover:hover){.et-button:where([data-variant=transparent]):hover{--et-theme-color-primary-opacity: .08}}.et-button:where([data-variant=transparent]):focus-visible{--et-theme-color-primary-opacity: .12}.et-button:where([data-variant=transparent]):active{--et-theme-color-primary-opacity: .16}.et-button[data-pressed=true]:where([data-pressed-variant=filled]){--et-theme-color-primary-opacity: 1;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-on-primary);--_et-button-border-color: transparent}@media(hover:hover){.et-button[data-pressed=true]:where([data-pressed-variant=filled]):hover{--et-theme-color-primary-opacity: 1}}.et-button[data-pressed=true]:where([data-pressed-variant=filled]):focus-visible{--et-theme-color-primary-opacity: 1}.et-button[data-pressed=true]:where([data-pressed-variant=filled]):active{--et-theme-color-primary-opacity: 1}.et-button[data-muted-until-pressed]:not([data-pressed=true]){--_et-button-color: currentColor}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 32%, transparent);--_et-button-border-color: transparent}@media(hover:hover){.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):hover:not([disabled]):not([aria-disabled=true]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 40%, transparent)}}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):focus-visible{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 44%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):active{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 48%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]){--_et-button-background: transparent;--_et-button-border-color: var(--et-surface-interaction-solid)}@media(hover:hover){.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):hover:not([disabled]):not([aria-disabled=true]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 12%, transparent)}}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):focus-visible{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 16%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):active{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 20%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 16%, transparent);--_et-button-border-color: transparent}@media(hover:hover){.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):hover:not([disabled]):not([aria-disabled=true]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 24%, transparent)}}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):focus-visible{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 28%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):active{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 32%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]){--_et-button-background: transparent;--_et-button-border-color: transparent}@media(hover:hover){.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):hover:not([disabled]):not([aria-disabled=true]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 12%, transparent)}}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):focus-visible{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 16%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):active{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 20%, transparent)}.et-button .et-button-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:opacity .12s ease}.et-button .et-button-icon:empty{display:none}.et-button .et-button-icon .et-icon{width:1em;height:1em}.et-button .et-button-contents{display:inline-flex;align-items:center;min-width:0;transition:opacity .12s ease}.et-button[data-loading=true] .et-button-icon,.et-button[data-loading=true] .et-button-contents{opacity:0}.et-button[data-loading=true] .et-button-loader{opacity:1}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }], encapsulation: i0.ViewEncapsulation.None }); }
613
613
  }
614
614
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ButtonComponent, decorators: [{
615
615
  type: Component,
@@ -662,7 +662,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
662
662
  '[attr.data-size]': 'size()',
663
663
  '[attr.data-pressed-variant]': 'pressedVariant()',
664
664
  '[attr.data-can-animate]': 'canAnimate.state() || null',
665
- }, styles: ["@layer components{.et-button{--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-on-primary);--_et-button-border-color: transparent;display:inline-flex;position:relative;align-items:center;justify-content:center;gap:var(--et-button-gap);background:var(--_et-button-background);color:var(--_et-button-color);border-radius:var(--et-button-border-radius);padding:var(--et-button-padding);font-size:var(--et-button-font-size);font-weight:var(--et-button-font-weight);border:var(--et-button-border-width, .1rem) solid var(--_et-button-border-color);box-shadow:var(--et-button-shadow, 0 0 #0000);cursor:var(--et-button-cursor);text-decoration:none;appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;touch-action:manipulation;line-height:var(--et-button-line-height);white-space:nowrap}.et-button[data-can-animate]{transition:background .12s ease,color .12s ease,border-color .12s ease,box-shadow .12s ease,outline-color .12s ease,opacity .12s ease}.et-button:where([data-size=xs]){--et-button-padding: .2rem .8rem;--et-button-font-size: 1.2rem;--et-button-border-radius: .3rem;--et-button-gap: .4rem}.et-button:where([data-size=sm]){--et-button-padding: .4rem 1.2rem;--et-button-font-size: 1.4rem;--et-button-border-radius: .4rem;--et-button-gap: .5rem}.et-button:where([data-size=md]){--et-button-padding: .8rem 1.6rem;--et-button-font-size: 1.4rem;--et-button-border-radius: .4rem;--et-button-gap: .6rem}.et-button:where([data-size=lg]){--et-button-padding: 1rem 2rem;--et-button-font-size: 1.6rem;--et-button-border-radius: .6rem;--et-button-gap: .7rem}.et-button:where([data-size=xl]){--et-button-padding: 1.4rem 2.8rem;--et-button-font-size: 1.8rem;--et-button-border-radius: .8rem;--et-button-gap: .8rem}.et-button:where([disabled]),.et-button:where([aria-disabled=true]){cursor:not-allowed;pointer-events:none}.et-button:where([disabled],[aria-disabled=true]):where([data-variant=outline]),.et-button:where([disabled],[aria-disabled=true]):where([data-variant=tonal]),.et-button:where([disabled],[aria-disabled=true]):where([data-variant=transparent]),.et-button:where([disabled],[aria-disabled=true])[data-pressed=true]{opacity:var(--et-button-opacity-disabled)}.et-button:where([data-variant=outline]){--et-theme-color-primary-opacity: 0;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-ink-solid);--_et-button-border-color: var(--et-theme-color-ink-solid)}.et-button:where([data-variant=outline]):hover{--et-theme-color-primary-opacity: .08}.et-button:where([data-variant=outline]):focus-visible{--et-theme-color-primary-opacity: .12}.et-button:where([data-variant=outline]):active{--et-theme-color-primary-opacity: .16}.et-button[data-pressed=true]:where([data-pressed-variant=outline]){--et-theme-color-primary-opacity: 0;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-ink-solid);--_et-button-border-color: var(--et-theme-color-ink-solid)}.et-button[data-pressed=true]:where([data-pressed-variant=outline]):hover{--et-theme-color-primary-opacity: .08}.et-button[data-pressed=true]:where([data-pressed-variant=outline]):focus-visible{--et-theme-color-primary-opacity: .12}.et-button[data-pressed=true]:where([data-pressed-variant=outline]):active{--et-theme-color-primary-opacity: .16}.et-button[data-pressed=true]:where([data-pressed-variant=outline])[data-loading=true]:not([disabled],[aria-disabled=true]){--_et-button-color: var(--et-theme-color-primary-solid);--_et-button-border-color: var(--et-theme-color-primary-solid)}.et-button:where([data-variant=tonal]),.et-button[data-pressed=true]:where([data-pressed-variant=tonal]){--et-theme-color-primary-opacity: .16;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-ink-solid);--_et-button-border-color: transparent}:is(.et-button:where([data-variant=tonal]),.et-button[data-pressed=true]:where([data-pressed-variant=tonal])):hover{--et-theme-color-primary-opacity: .24}:is(.et-button:where([data-variant=tonal]),.et-button[data-pressed=true]:where([data-pressed-variant=tonal])):focus-visible{--et-theme-color-primary-opacity: .28}:is(.et-button:where([data-variant=tonal]),.et-button[data-pressed=true]:where([data-pressed-variant=tonal])):active{--et-theme-color-primary-opacity: .32}.et-button:where([data-variant=transparent]){--et-theme-color-primary-opacity: 0;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-ink-solid);--_et-button-border-color: transparent}.et-button:where([data-variant=transparent]):hover{--et-theme-color-primary-opacity: .08}.et-button:where([data-variant=transparent]):focus-visible{--et-theme-color-primary-opacity: .12}.et-button:where([data-variant=transparent]):active{--et-theme-color-primary-opacity: .16}.et-button[data-pressed=true]:where([data-pressed-variant=filled]){--et-theme-color-primary-opacity: 1;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-on-primary);--_et-button-border-color: transparent}.et-button[data-pressed=true]:where([data-pressed-variant=filled]):hover{--et-theme-color-primary-opacity: 1}.et-button[data-pressed=true]:where([data-pressed-variant=filled]):focus-visible{--et-theme-color-primary-opacity: 1}.et-button[data-pressed=true]:where([data-pressed-variant=filled]):active{--et-theme-color-primary-opacity: 1}.et-button[data-muted-until-pressed]:not([data-pressed=true]){--_et-button-color: currentColor}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 32%, transparent);--_et-button-border-color: transparent}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):hover:not([disabled]):not([aria-disabled=true]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 40%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):focus-visible{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 44%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):active{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 48%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]){--_et-button-background: transparent;--_et-button-border-color: var(--et-surface-interaction-solid)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):hover:not([disabled]):not([aria-disabled=true]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 12%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):focus-visible{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 16%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):active{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 20%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 16%, transparent);--_et-button-border-color: transparent}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):hover:not([disabled]):not([aria-disabled=true]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 24%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):focus-visible{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 28%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):active{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 32%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]){--_et-button-background: transparent;--_et-button-border-color: transparent}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):hover:not([disabled]):not([aria-disabled=true]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 12%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):focus-visible{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 16%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):active{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 20%, transparent)}.et-button .et-button-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:opacity .12s ease}.et-button .et-button-icon:empty{display:none}.et-button .et-button-icon .et-icon{width:1em;height:1em}.et-button .et-button-contents{display:inline-flex;align-items:center;min-width:0;transition:opacity .12s ease}.et-button[data-loading=true] .et-button-icon,.et-button[data-loading=true] .et-button-contents{opacity:0}.et-button[data-loading=true] .et-button-loader{opacity:1}}\n"] }]
665
+ }, styles: ["@layer components{.et-button{--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-on-primary);--_et-button-border-color: transparent;display:inline-flex;position:relative;align-items:center;justify-content:center;gap:var(--et-button-gap);background:var(--_et-button-background);color:var(--_et-button-color);border-radius:var(--et-button-border-radius);padding:var(--et-button-padding);font-size:var(--et-button-font-size);font-weight:var(--et-button-font-weight);border:var(--et-button-border-width, .1rem) solid var(--_et-button-border-color);box-shadow:var(--et-button-shadow, 0 0 #0000);cursor:var(--et-button-cursor);text-decoration:none;appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;touch-action:manipulation;line-height:var(--et-button-line-height);white-space:nowrap}.et-button[data-can-animate]{transition:background .12s ease,color .12s ease,border-color .12s ease,box-shadow .12s ease,outline-color .12s ease,opacity .12s ease}.et-button:where([data-size=xs]){--et-button-padding: .2rem .8rem;--et-button-font-size: 1.2rem;--et-button-border-radius: .3rem;--et-button-gap: .4rem}.et-button:where([data-size=sm]){--et-button-padding: .4rem 1.2rem;--et-button-font-size: 1.4rem;--et-button-border-radius: .4rem;--et-button-gap: .5rem}.et-button:where([data-size=md]){--et-button-padding: .8rem 1.6rem;--et-button-font-size: 1.4rem;--et-button-border-radius: .4rem;--et-button-gap: .6rem}.et-button:where([data-size=lg]){--et-button-padding: 1rem 2rem;--et-button-font-size: 1.6rem;--et-button-border-radius: .6rem;--et-button-gap: .7rem}.et-button:where([data-size=xl]){--et-button-padding: 1.4rem 2.8rem;--et-button-font-size: 1.8rem;--et-button-border-radius: .8rem;--et-button-gap: .8rem}.et-button:where([disabled]),.et-button:where([aria-disabled=true]){cursor:not-allowed;pointer-events:none}.et-button:where([disabled],[aria-disabled=true]):where([data-variant=outline]),.et-button:where([disabled],[aria-disabled=true]):where([data-variant=tonal]),.et-button:where([disabled],[aria-disabled=true]):where([data-variant=transparent]),.et-button:where([disabled],[aria-disabled=true])[data-pressed=true]{opacity:var(--et-button-opacity-disabled)}.et-button:where([data-variant=outline]){--et-theme-color-primary-opacity: 0;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-ink-solid);--_et-button-border-color: var(--et-theme-color-ink-solid)}@media(hover:hover){.et-button:where([data-variant=outline]):hover{--et-theme-color-primary-opacity: .08}}.et-button:where([data-variant=outline]):focus-visible{--et-theme-color-primary-opacity: .12}.et-button:where([data-variant=outline]):active{--et-theme-color-primary-opacity: .16}.et-button[data-pressed=true]:where([data-pressed-variant=outline]){--et-theme-color-primary-opacity: 0;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-ink-solid);--_et-button-border-color: var(--et-theme-color-ink-solid)}@media(hover:hover){.et-button[data-pressed=true]:where([data-pressed-variant=outline]):hover{--et-theme-color-primary-opacity: .08}}.et-button[data-pressed=true]:where([data-pressed-variant=outline]):focus-visible{--et-theme-color-primary-opacity: .12}.et-button[data-pressed=true]:where([data-pressed-variant=outline]):active{--et-theme-color-primary-opacity: .16}.et-button[data-pressed=true]:where([data-pressed-variant=outline])[data-loading=true]:not([disabled],[aria-disabled=true]){--_et-button-color: var(--et-theme-color-primary-solid);--_et-button-border-color: var(--et-theme-color-primary-solid)}.et-button:where([data-variant=tonal]),.et-button[data-pressed=true]:where([data-pressed-variant=tonal]){--et-theme-color-primary-opacity: .16;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-ink-solid);--_et-button-border-color: transparent}@media(hover:hover){:is(.et-button:where([data-variant=tonal]),.et-button[data-pressed=true]:where([data-pressed-variant=tonal])):hover{--et-theme-color-primary-opacity: .24}}:is(.et-button:where([data-variant=tonal]),.et-button[data-pressed=true]:where([data-pressed-variant=tonal])):focus-visible{--et-theme-color-primary-opacity: .28}:is(.et-button:where([data-variant=tonal]),.et-button[data-pressed=true]:where([data-pressed-variant=tonal])):active{--et-theme-color-primary-opacity: .32}.et-button:where([data-variant=transparent]){--et-theme-color-primary-opacity: 0;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-ink-solid);--_et-button-border-color: transparent}@media(hover:hover){.et-button:where([data-variant=transparent]):hover{--et-theme-color-primary-opacity: .08}}.et-button:where([data-variant=transparent]):focus-visible{--et-theme-color-primary-opacity: .12}.et-button:where([data-variant=transparent]):active{--et-theme-color-primary-opacity: .16}.et-button[data-pressed=true]:where([data-pressed-variant=filled]){--et-theme-color-primary-opacity: 1;--_et-button-background: var(--et-theme-color-primary);--_et-button-color: var(--et-theme-color-on-primary);--_et-button-border-color: transparent}@media(hover:hover){.et-button[data-pressed=true]:where([data-pressed-variant=filled]):hover{--et-theme-color-primary-opacity: 1}}.et-button[data-pressed=true]:where([data-pressed-variant=filled]):focus-visible{--et-theme-color-primary-opacity: 1}.et-button[data-pressed=true]:where([data-pressed-variant=filled]):active{--et-theme-color-primary-opacity: 1}.et-button[data-muted-until-pressed]:not([data-pressed=true]){--_et-button-color: currentColor}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 32%, transparent);--_et-button-border-color: transparent}@media(hover:hover){.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):hover:not([disabled]):not([aria-disabled=true]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 40%, transparent)}}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):focus-visible{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 44%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):active{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 48%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]){--_et-button-background: transparent;--_et-button-border-color: var(--et-surface-interaction-solid)}@media(hover:hover){.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):hover:not([disabled]):not([aria-disabled=true]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 12%, transparent)}}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):focus-visible{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 16%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):active{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 20%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 16%, transparent);--_et-button-border-color: transparent}@media(hover:hover){.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):hover:not([disabled]):not([aria-disabled=true]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 24%, transparent)}}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):focus-visible{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 28%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):active{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 32%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]){--_et-button-background: transparent;--_et-button-border-color: transparent}@media(hover:hover){.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):hover:not([disabled]):not([aria-disabled=true]){--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 12%, transparent)}}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):focus-visible{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 16%, transparent)}.et-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):active{--_et-button-background: color-mix(in srgb, var(--et-surface-interaction-solid) 20%, transparent)}.et-button .et-button-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:opacity .12s ease}.et-button .et-button-icon:empty{display:none}.et-button .et-button-icon .et-icon{width:1em;height:1em}.et-button .et-button-contents{display:inline-flex;align-items:center;min-width:0;transition:opacity .12s ease}.et-button[data-loading=true] .et-button-icon,.et-button[data-loading=true] .et-button-contents{opacity:0}.et-button[data-loading=true] .et-button-loader{opacity:1}}\n"] }]
666
666
  }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], iconAlignment: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconAlignment", required: false }] }] } });
667
667
 
668
668
  class FabComponent {
@@ -710,7 +710,7 @@ class FabComponent {
710
710
  <ng-template #iconTpl>
711
711
  <ng-content select="[etIcon]" />
712
712
  </ng-template>
713
- `, isInline: true, styles: ["@layer components{.et-fab{--_et-fab-expand-duration: .38s;--_et-fab-expand-easing: cubic-bezier(.22, .9, .3, 1);--_et-fab-collapse-duration: .22s;--_et-fab-collapse-easing: cubic-bezier(.4, 0, .2, 1);--_et-fab-label-fade-duration: .18s;--_et-fab-label-fade-expand-delay: 40ms;--_et-fab-contents-padding: 0 var(--_et-fab-contents-gap) 0 0;--et-button-shadow: 0 .3rem .8rem rgb(0 0 0 / .2), 0 .1rem .3rem rgb(0 0 0 / .12);display:inline-flex;position:relative;align-items:center;background:var(--et-theme-color-primary);color:var(--et-theme-color-on-primary);border:none;border-radius:9999px;padding:0;overflow:hidden;height:var(--_et-fab-size, 4rem);font-size:var(--et-button-font-size);font-weight:var(--et-button-font-weight);box-shadow:var(--et-button-shadow);cursor:var(--et-button-cursor);text-decoration:none;appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;line-height:var(--et-button-line-height);white-space:nowrap;flex-shrink:0}.et-fab[data-can-animate]{transition:background .12s ease,color .12s ease,box-shadow .12s ease,outline-color .12s ease}.et-fab:after{content:\"\";position:absolute;inset:0;box-sizing:border-box;border:0 solid transparent;border-radius:inherit;pointer-events:none;transition:background .12s ease}.et-fab:where([data-variant=filled]):hover:after{background:rgb(var(--et-theme-color-on-primary-rgb) / .08)}.et-fab:where([data-variant=filled]):focus-visible:after{background:rgb(var(--et-theme-color-on-primary-rgb) / .12)}.et-fab:where([data-variant=filled]):active:after{background:rgb(var(--et-theme-color-on-primary-rgb) / .16)}.et-fab:where([data-variant=filled]):focus-visible:active:after{background:rgb(var(--et-theme-color-on-primary-rgb) / .16)}.et-fab:where([data-size=xs]){--_et-fab-size: 2.4rem;--_et-fab-label-font-size: 1.2rem;--_et-fab-icon-size: 1.4rem;--_et-fab-contents-gap: .5rem}.et-fab:where([data-size=sm]){--_et-fab-size: 3.1rem;--_et-fab-label-font-size: 1.2rem;--_et-fab-icon-size: 1.8rem;--_et-fab-contents-gap: .6rem}.et-fab:where([data-size=md]){--_et-fab-size: 3.9rem;--_et-fab-label-font-size: 1.3rem;--_et-fab-icon-size: 2rem;--_et-fab-contents-gap: .8rem}.et-fab:where([data-size=lg]){--_et-fab-size: 4.6rem;--_et-fab-label-font-size: 1.4rem;--_et-fab-icon-size: 2.4rem;--_et-fab-contents-gap: 1rem}.et-fab:where([data-size=xl]){--_et-fab-size: 5.7rem;--_et-fab-label-font-size: 1.6rem;--_et-fab-icon-size: 2.8rem;--_et-fab-contents-gap: 1.2rem}.et-fab:hover{--et-button-shadow: 0 .6rem 1.2rem rgb(0 0 0 / .22), 0 .2rem .4rem rgb(0 0 0 / .14)}.et-fab:active{--et-button-shadow: 0 .2rem .6rem rgb(0 0 0 / .18), 0 .1rem .2rem rgb(0 0 0 / .1)}.et-fab:focus-visible:active{--et-button-shadow: 0 .2rem .6rem rgb(0 0 0 / .18), 0 .1rem .2rem rgb(0 0 0 / .1)}.et-fab:where([disabled]),.et-fab:where([aria-disabled=true]){opacity:var(--et-button-opacity-disabled);cursor:not-allowed;pointer-events:none}.et-fab:where([data-variant=outline]){--et-theme-color-primary-opacity: 0;--et-button-shadow: none;background:var(--et-theme-color-primary);color:var(--et-theme-color-ink-solid)}.et-fab:where([data-variant=outline]):after{border-width:var(--et-button-border-width, .1rem);border-color:var(--et-theme-color-ink-solid)}.et-fab:where([data-variant=outline]):hover{--et-theme-color-primary-opacity: .08;--et-button-shadow: none}.et-fab:where([data-variant=outline]):focus-visible{--et-theme-color-primary-opacity: .12}.et-fab:where([data-variant=outline]):active{--et-theme-color-primary-opacity: .16;--et-button-shadow: none}.et-fab:where([data-variant=outline]):focus-visible:active{--et-button-shadow: none}.et-fab:where([data-variant=tonal]){--et-theme-color-primary-opacity: .16;--et-button-shadow: none;background:var(--et-theme-color-primary);color:var(--et-theme-color-ink-solid)}.et-fab:where([data-variant=tonal]):hover{--et-theme-color-primary-opacity: .24;--et-button-shadow: none}.et-fab:where([data-variant=tonal]):focus-visible{--et-theme-color-primary-opacity: .28}.et-fab:where([data-variant=tonal]):active{--et-theme-color-primary-opacity: .32;--et-button-shadow: none}.et-fab:where([data-variant=tonal]):focus-visible:active{--et-button-shadow: none}.et-fab:where([data-variant=transparent]){--et-theme-color-primary-opacity: 0;--et-button-shadow: none;background:var(--et-theme-color-primary);color:var(--et-theme-color-ink-solid)}.et-fab:where([data-variant=transparent]):hover{--et-theme-color-primary-opacity: .08;--et-button-shadow: none}.et-fab:where([data-variant=transparent]):focus-visible{--et-theme-color-primary-opacity: .12}.et-fab:where([data-variant=transparent]):active{--et-theme-color-primary-opacity: .16;--et-button-shadow: none}.et-fab:where([data-variant=transparent]):focus-visible:active{--et-button-shadow: none}.et-fab[data-icon-alignment=end]{--_et-fab-contents-padding: 0 0 0 var(--_et-fab-contents-gap)}.et-fab .et-fab-icon{display:flex;align-items:center;justify-content:center;width:var(--_et-fab-size, 4rem);height:var(--_et-fab-size, 4rem);transition:opacity .12s ease}.et-fab .et-fab-icon .et-icon{width:var(--_et-fab-icon-size);height:var(--_et-fab-icon-size)}.et-fab .et-fab-contents{display:inline-grid;grid-template-columns:1fr;padding:var(--_et-fab-contents-padding);transition:opacity .12s ease,grid-template-columns var(--_et-fab-expand-duration) var(--_et-fab-expand-easing),padding var(--_et-fab-expand-duration) var(--_et-fab-expand-easing)}.et-fab .et-fab-contents .et-fab-contents-inner{min-width:0;opacity:1;white-space:nowrap;font-size:var(--_et-fab-label-font-size);transition:opacity var(--_et-fab-label-fade-duration) var(--_et-fab-expand-easing)}.et-fab:not([data-expanded=true]) .et-fab-contents{grid-template-columns:0fr;padding:0;pointer-events:none;transition:opacity .12s ease,grid-template-columns var(--_et-fab-collapse-duration) var(--_et-fab-collapse-easing),padding var(--_et-fab-collapse-duration) var(--_et-fab-collapse-easing)}.et-fab:not([data-expanded=true]) .et-fab-contents-inner{opacity:0;transition:opacity var(--_et-fab-label-fade-duration) var(--_et-fab-collapse-easing)}.et-fab[data-loading=true] .et-fab-icon,.et-fab[data-loading=true] .et-fab-contents{opacity:0}.et-fab[data-loading=true] .et-button-loader{opacity:1}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }], encapsulation: i0.ViewEncapsulation.None }); }
713
+ `, isInline: true, styles: ["@layer components{.et-fab{--_et-fab-expand-duration: .38s;--_et-fab-expand-easing: cubic-bezier(.22, .9, .3, 1);--_et-fab-collapse-duration: .22s;--_et-fab-collapse-easing: cubic-bezier(.4, 0, .2, 1);--_et-fab-label-fade-duration: .18s;--_et-fab-label-fade-expand-delay: 40ms;--_et-fab-contents-padding: 0 var(--_et-fab-contents-gap) 0 0;--et-button-shadow: 0 .3rem .8rem rgb(0 0 0 / .2), 0 .1rem .3rem rgb(0 0 0 / .12);display:inline-flex;position:relative;align-items:center;background:var(--et-theme-color-primary);color:var(--et-theme-color-on-primary);border:none;border-radius:9999px;padding:0;overflow:hidden;height:var(--_et-fab-size, 4rem);font-size:var(--et-button-font-size);font-weight:var(--et-button-font-weight);box-shadow:var(--et-button-shadow);cursor:var(--et-button-cursor);text-decoration:none;appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;line-height:var(--et-button-line-height);white-space:nowrap;flex-shrink:0}.et-fab[data-can-animate]{transition:background .12s ease,color .12s ease,box-shadow .12s ease,outline-color .12s ease}.et-fab:after{content:\"\";position:absolute;inset:0;box-sizing:border-box;border:0 solid transparent;border-radius:inherit;pointer-events:none;transition:background .12s ease}@media(hover:hover){.et-fab:where([data-variant=filled]):hover:after{background:rgb(var(--et-theme-color-on-primary-rgb) / .08)}}.et-fab:where([data-variant=filled]):focus-visible:after{background:rgb(var(--et-theme-color-on-primary-rgb) / .12)}.et-fab:where([data-variant=filled]):active:after{background:rgb(var(--et-theme-color-on-primary-rgb) / .16)}.et-fab:where([data-variant=filled]):focus-visible:active:after{background:rgb(var(--et-theme-color-on-primary-rgb) / .16)}.et-fab:where([data-size=xs]){--_et-fab-size: 2.4rem;--_et-fab-label-font-size: 1.2rem;--_et-fab-icon-size: 1.4rem;--_et-fab-contents-gap: .5rem}.et-fab:where([data-size=sm]){--_et-fab-size: 3.1rem;--_et-fab-label-font-size: 1.2rem;--_et-fab-icon-size: 1.8rem;--_et-fab-contents-gap: .6rem}.et-fab:where([data-size=md]){--_et-fab-size: 3.9rem;--_et-fab-label-font-size: 1.3rem;--_et-fab-icon-size: 2rem;--_et-fab-contents-gap: .8rem}.et-fab:where([data-size=lg]){--_et-fab-size: 4.6rem;--_et-fab-label-font-size: 1.4rem;--_et-fab-icon-size: 2.4rem;--_et-fab-contents-gap: 1rem}.et-fab:where([data-size=xl]){--_et-fab-size: 5.7rem;--_et-fab-label-font-size: 1.6rem;--_et-fab-icon-size: 2.8rem;--_et-fab-contents-gap: 1.2rem}@media(hover:hover){.et-fab:hover{--et-button-shadow: 0 .6rem 1.2rem rgb(0 0 0 / .22), 0 .2rem .4rem rgb(0 0 0 / .14)}}.et-fab:active{--et-button-shadow: 0 .2rem .6rem rgb(0 0 0 / .18), 0 .1rem .2rem rgb(0 0 0 / .1)}.et-fab:focus-visible:active{--et-button-shadow: 0 .2rem .6rem rgb(0 0 0 / .18), 0 .1rem .2rem rgb(0 0 0 / .1)}.et-fab:where([disabled]),.et-fab:where([aria-disabled=true]){opacity:var(--et-button-opacity-disabled);cursor:not-allowed;pointer-events:none}.et-fab:where([data-variant=outline]){--et-theme-color-primary-opacity: 0;--et-button-shadow: none;background:var(--et-theme-color-primary);color:var(--et-theme-color-ink-solid)}.et-fab:where([data-variant=outline]):after{border-width:var(--et-button-border-width, .1rem);border-color:var(--et-theme-color-ink-solid)}@media(hover:hover){.et-fab:where([data-variant=outline]):hover{--et-theme-color-primary-opacity: .08;--et-button-shadow: none}}.et-fab:where([data-variant=outline]):focus-visible{--et-theme-color-primary-opacity: .12}.et-fab:where([data-variant=outline]):active{--et-theme-color-primary-opacity: .16;--et-button-shadow: none}.et-fab:where([data-variant=outline]):focus-visible:active{--et-button-shadow: none}.et-fab:where([data-variant=tonal]){--et-theme-color-primary-opacity: .16;--et-button-shadow: none;background:var(--et-theme-color-primary);color:var(--et-theme-color-ink-solid)}@media(hover:hover){.et-fab:where([data-variant=tonal]):hover{--et-theme-color-primary-opacity: .24;--et-button-shadow: none}}.et-fab:where([data-variant=tonal]):focus-visible{--et-theme-color-primary-opacity: .28}.et-fab:where([data-variant=tonal]):active{--et-theme-color-primary-opacity: .32;--et-button-shadow: none}.et-fab:where([data-variant=tonal]):focus-visible:active{--et-button-shadow: none}.et-fab:where([data-variant=transparent]){--et-theme-color-primary-opacity: 0;--et-button-shadow: none;background:var(--et-theme-color-primary);color:var(--et-theme-color-ink-solid)}@media(hover:hover){.et-fab:where([data-variant=transparent]):hover{--et-theme-color-primary-opacity: .08;--et-button-shadow: none}}.et-fab:where([data-variant=transparent]):focus-visible{--et-theme-color-primary-opacity: .12}.et-fab:where([data-variant=transparent]):active{--et-theme-color-primary-opacity: .16;--et-button-shadow: none}.et-fab:where([data-variant=transparent]):focus-visible:active{--et-button-shadow: none}.et-fab[data-icon-alignment=end]{--_et-fab-contents-padding: 0 0 0 var(--_et-fab-contents-gap)}.et-fab .et-fab-icon{display:flex;align-items:center;justify-content:center;width:var(--_et-fab-size, 4rem);height:var(--_et-fab-size, 4rem);transition:opacity .12s ease}.et-fab .et-fab-icon .et-icon{width:var(--_et-fab-icon-size);height:var(--_et-fab-icon-size)}.et-fab .et-fab-contents{display:inline-grid;grid-template-columns:1fr;padding:var(--_et-fab-contents-padding);transition:opacity .12s ease,grid-template-columns var(--_et-fab-expand-duration) var(--_et-fab-expand-easing),padding var(--_et-fab-expand-duration) var(--_et-fab-expand-easing)}.et-fab .et-fab-contents .et-fab-contents-inner{min-width:0;opacity:1;white-space:nowrap;font-size:var(--_et-fab-label-font-size);transition:opacity var(--_et-fab-label-fade-duration) var(--_et-fab-expand-easing)}.et-fab:not([data-expanded=true]) .et-fab-contents{grid-template-columns:0fr;padding:0;pointer-events:none;transition:opacity .12s ease,grid-template-columns var(--_et-fab-collapse-duration) var(--_et-fab-collapse-easing),padding var(--_et-fab-collapse-duration) var(--_et-fab-collapse-easing)}.et-fab:not([data-expanded=true]) .et-fab-contents-inner{opacity:0;transition:opacity var(--_et-fab-label-fade-duration) var(--_et-fab-collapse-easing)}.et-fab[data-loading=true] .et-fab-icon,.et-fab[data-loading=true] .et-fab-contents{opacity:0}.et-fab[data-loading=true] .et-button-loader{opacity:1}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }], encapsulation: i0.ViewEncapsulation.None }); }
714
714
  }
715
715
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: FabComponent, decorators: [{
716
716
  type: Component,
@@ -760,7 +760,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
760
760
  '[attr.data-expanded]': 'expandedAttr()',
761
761
  '[attr.data-icon-alignment]': 'iconAlignment()',
762
762
  '[attr.data-can-animate]': 'canAnimate.state() || null',
763
- }, styles: ["@layer components{.et-fab{--_et-fab-expand-duration: .38s;--_et-fab-expand-easing: cubic-bezier(.22, .9, .3, 1);--_et-fab-collapse-duration: .22s;--_et-fab-collapse-easing: cubic-bezier(.4, 0, .2, 1);--_et-fab-label-fade-duration: .18s;--_et-fab-label-fade-expand-delay: 40ms;--_et-fab-contents-padding: 0 var(--_et-fab-contents-gap) 0 0;--et-button-shadow: 0 .3rem .8rem rgb(0 0 0 / .2), 0 .1rem .3rem rgb(0 0 0 / .12);display:inline-flex;position:relative;align-items:center;background:var(--et-theme-color-primary);color:var(--et-theme-color-on-primary);border:none;border-radius:9999px;padding:0;overflow:hidden;height:var(--_et-fab-size, 4rem);font-size:var(--et-button-font-size);font-weight:var(--et-button-font-weight);box-shadow:var(--et-button-shadow);cursor:var(--et-button-cursor);text-decoration:none;appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;line-height:var(--et-button-line-height);white-space:nowrap;flex-shrink:0}.et-fab[data-can-animate]{transition:background .12s ease,color .12s ease,box-shadow .12s ease,outline-color .12s ease}.et-fab:after{content:\"\";position:absolute;inset:0;box-sizing:border-box;border:0 solid transparent;border-radius:inherit;pointer-events:none;transition:background .12s ease}.et-fab:where([data-variant=filled]):hover:after{background:rgb(var(--et-theme-color-on-primary-rgb) / .08)}.et-fab:where([data-variant=filled]):focus-visible:after{background:rgb(var(--et-theme-color-on-primary-rgb) / .12)}.et-fab:where([data-variant=filled]):active:after{background:rgb(var(--et-theme-color-on-primary-rgb) / .16)}.et-fab:where([data-variant=filled]):focus-visible:active:after{background:rgb(var(--et-theme-color-on-primary-rgb) / .16)}.et-fab:where([data-size=xs]){--_et-fab-size: 2.4rem;--_et-fab-label-font-size: 1.2rem;--_et-fab-icon-size: 1.4rem;--_et-fab-contents-gap: .5rem}.et-fab:where([data-size=sm]){--_et-fab-size: 3.1rem;--_et-fab-label-font-size: 1.2rem;--_et-fab-icon-size: 1.8rem;--_et-fab-contents-gap: .6rem}.et-fab:where([data-size=md]){--_et-fab-size: 3.9rem;--_et-fab-label-font-size: 1.3rem;--_et-fab-icon-size: 2rem;--_et-fab-contents-gap: .8rem}.et-fab:where([data-size=lg]){--_et-fab-size: 4.6rem;--_et-fab-label-font-size: 1.4rem;--_et-fab-icon-size: 2.4rem;--_et-fab-contents-gap: 1rem}.et-fab:where([data-size=xl]){--_et-fab-size: 5.7rem;--_et-fab-label-font-size: 1.6rem;--_et-fab-icon-size: 2.8rem;--_et-fab-contents-gap: 1.2rem}.et-fab:hover{--et-button-shadow: 0 .6rem 1.2rem rgb(0 0 0 / .22), 0 .2rem .4rem rgb(0 0 0 / .14)}.et-fab:active{--et-button-shadow: 0 .2rem .6rem rgb(0 0 0 / .18), 0 .1rem .2rem rgb(0 0 0 / .1)}.et-fab:focus-visible:active{--et-button-shadow: 0 .2rem .6rem rgb(0 0 0 / .18), 0 .1rem .2rem rgb(0 0 0 / .1)}.et-fab:where([disabled]),.et-fab:where([aria-disabled=true]){opacity:var(--et-button-opacity-disabled);cursor:not-allowed;pointer-events:none}.et-fab:where([data-variant=outline]){--et-theme-color-primary-opacity: 0;--et-button-shadow: none;background:var(--et-theme-color-primary);color:var(--et-theme-color-ink-solid)}.et-fab:where([data-variant=outline]):after{border-width:var(--et-button-border-width, .1rem);border-color:var(--et-theme-color-ink-solid)}.et-fab:where([data-variant=outline]):hover{--et-theme-color-primary-opacity: .08;--et-button-shadow: none}.et-fab:where([data-variant=outline]):focus-visible{--et-theme-color-primary-opacity: .12}.et-fab:where([data-variant=outline]):active{--et-theme-color-primary-opacity: .16;--et-button-shadow: none}.et-fab:where([data-variant=outline]):focus-visible:active{--et-button-shadow: none}.et-fab:where([data-variant=tonal]){--et-theme-color-primary-opacity: .16;--et-button-shadow: none;background:var(--et-theme-color-primary);color:var(--et-theme-color-ink-solid)}.et-fab:where([data-variant=tonal]):hover{--et-theme-color-primary-opacity: .24;--et-button-shadow: none}.et-fab:where([data-variant=tonal]):focus-visible{--et-theme-color-primary-opacity: .28}.et-fab:where([data-variant=tonal]):active{--et-theme-color-primary-opacity: .32;--et-button-shadow: none}.et-fab:where([data-variant=tonal]):focus-visible:active{--et-button-shadow: none}.et-fab:where([data-variant=transparent]){--et-theme-color-primary-opacity: 0;--et-button-shadow: none;background:var(--et-theme-color-primary);color:var(--et-theme-color-ink-solid)}.et-fab:where([data-variant=transparent]):hover{--et-theme-color-primary-opacity: .08;--et-button-shadow: none}.et-fab:where([data-variant=transparent]):focus-visible{--et-theme-color-primary-opacity: .12}.et-fab:where([data-variant=transparent]):active{--et-theme-color-primary-opacity: .16;--et-button-shadow: none}.et-fab:where([data-variant=transparent]):focus-visible:active{--et-button-shadow: none}.et-fab[data-icon-alignment=end]{--_et-fab-contents-padding: 0 0 0 var(--_et-fab-contents-gap)}.et-fab .et-fab-icon{display:flex;align-items:center;justify-content:center;width:var(--_et-fab-size, 4rem);height:var(--_et-fab-size, 4rem);transition:opacity .12s ease}.et-fab .et-fab-icon .et-icon{width:var(--_et-fab-icon-size);height:var(--_et-fab-icon-size)}.et-fab .et-fab-contents{display:inline-grid;grid-template-columns:1fr;padding:var(--_et-fab-contents-padding);transition:opacity .12s ease,grid-template-columns var(--_et-fab-expand-duration) var(--_et-fab-expand-easing),padding var(--_et-fab-expand-duration) var(--_et-fab-expand-easing)}.et-fab .et-fab-contents .et-fab-contents-inner{min-width:0;opacity:1;white-space:nowrap;font-size:var(--_et-fab-label-font-size);transition:opacity var(--_et-fab-label-fade-duration) var(--_et-fab-expand-easing)}.et-fab:not([data-expanded=true]) .et-fab-contents{grid-template-columns:0fr;padding:0;pointer-events:none;transition:opacity .12s ease,grid-template-columns var(--_et-fab-collapse-duration) var(--_et-fab-collapse-easing),padding var(--_et-fab-collapse-duration) var(--_et-fab-collapse-easing)}.et-fab:not([data-expanded=true]) .et-fab-contents-inner{opacity:0;transition:opacity var(--_et-fab-label-fade-duration) var(--_et-fab-collapse-easing)}.et-fab[data-loading=true] .et-fab-icon,.et-fab[data-loading=true] .et-fab-contents{opacity:0}.et-fab[data-loading=true] .et-button-loader{opacity:1}}\n"] }]
763
+ }, styles: ["@layer components{.et-fab{--_et-fab-expand-duration: .38s;--_et-fab-expand-easing: cubic-bezier(.22, .9, .3, 1);--_et-fab-collapse-duration: .22s;--_et-fab-collapse-easing: cubic-bezier(.4, 0, .2, 1);--_et-fab-label-fade-duration: .18s;--_et-fab-label-fade-expand-delay: 40ms;--_et-fab-contents-padding: 0 var(--_et-fab-contents-gap) 0 0;--et-button-shadow: 0 .3rem .8rem rgb(0 0 0 / .2), 0 .1rem .3rem rgb(0 0 0 / .12);display:inline-flex;position:relative;align-items:center;background:var(--et-theme-color-primary);color:var(--et-theme-color-on-primary);border:none;border-radius:9999px;padding:0;overflow:hidden;height:var(--_et-fab-size, 4rem);font-size:var(--et-button-font-size);font-weight:var(--et-button-font-weight);box-shadow:var(--et-button-shadow);cursor:var(--et-button-cursor);text-decoration:none;appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;line-height:var(--et-button-line-height);white-space:nowrap;flex-shrink:0}.et-fab[data-can-animate]{transition:background .12s ease,color .12s ease,box-shadow .12s ease,outline-color .12s ease}.et-fab:after{content:\"\";position:absolute;inset:0;box-sizing:border-box;border:0 solid transparent;border-radius:inherit;pointer-events:none;transition:background .12s ease}@media(hover:hover){.et-fab:where([data-variant=filled]):hover:after{background:rgb(var(--et-theme-color-on-primary-rgb) / .08)}}.et-fab:where([data-variant=filled]):focus-visible:after{background:rgb(var(--et-theme-color-on-primary-rgb) / .12)}.et-fab:where([data-variant=filled]):active:after{background:rgb(var(--et-theme-color-on-primary-rgb) / .16)}.et-fab:where([data-variant=filled]):focus-visible:active:after{background:rgb(var(--et-theme-color-on-primary-rgb) / .16)}.et-fab:where([data-size=xs]){--_et-fab-size: 2.4rem;--_et-fab-label-font-size: 1.2rem;--_et-fab-icon-size: 1.4rem;--_et-fab-contents-gap: .5rem}.et-fab:where([data-size=sm]){--_et-fab-size: 3.1rem;--_et-fab-label-font-size: 1.2rem;--_et-fab-icon-size: 1.8rem;--_et-fab-contents-gap: .6rem}.et-fab:where([data-size=md]){--_et-fab-size: 3.9rem;--_et-fab-label-font-size: 1.3rem;--_et-fab-icon-size: 2rem;--_et-fab-contents-gap: .8rem}.et-fab:where([data-size=lg]){--_et-fab-size: 4.6rem;--_et-fab-label-font-size: 1.4rem;--_et-fab-icon-size: 2.4rem;--_et-fab-contents-gap: 1rem}.et-fab:where([data-size=xl]){--_et-fab-size: 5.7rem;--_et-fab-label-font-size: 1.6rem;--_et-fab-icon-size: 2.8rem;--_et-fab-contents-gap: 1.2rem}@media(hover:hover){.et-fab:hover{--et-button-shadow: 0 .6rem 1.2rem rgb(0 0 0 / .22), 0 .2rem .4rem rgb(0 0 0 / .14)}}.et-fab:active{--et-button-shadow: 0 .2rem .6rem rgb(0 0 0 / .18), 0 .1rem .2rem rgb(0 0 0 / .1)}.et-fab:focus-visible:active{--et-button-shadow: 0 .2rem .6rem rgb(0 0 0 / .18), 0 .1rem .2rem rgb(0 0 0 / .1)}.et-fab:where([disabled]),.et-fab:where([aria-disabled=true]){opacity:var(--et-button-opacity-disabled);cursor:not-allowed;pointer-events:none}.et-fab:where([data-variant=outline]){--et-theme-color-primary-opacity: 0;--et-button-shadow: none;background:var(--et-theme-color-primary);color:var(--et-theme-color-ink-solid)}.et-fab:where([data-variant=outline]):after{border-width:var(--et-button-border-width, .1rem);border-color:var(--et-theme-color-ink-solid)}@media(hover:hover){.et-fab:where([data-variant=outline]):hover{--et-theme-color-primary-opacity: .08;--et-button-shadow: none}}.et-fab:where([data-variant=outline]):focus-visible{--et-theme-color-primary-opacity: .12}.et-fab:where([data-variant=outline]):active{--et-theme-color-primary-opacity: .16;--et-button-shadow: none}.et-fab:where([data-variant=outline]):focus-visible:active{--et-button-shadow: none}.et-fab:where([data-variant=tonal]){--et-theme-color-primary-opacity: .16;--et-button-shadow: none;background:var(--et-theme-color-primary);color:var(--et-theme-color-ink-solid)}@media(hover:hover){.et-fab:where([data-variant=tonal]):hover{--et-theme-color-primary-opacity: .24;--et-button-shadow: none}}.et-fab:where([data-variant=tonal]):focus-visible{--et-theme-color-primary-opacity: .28}.et-fab:where([data-variant=tonal]):active{--et-theme-color-primary-opacity: .32;--et-button-shadow: none}.et-fab:where([data-variant=tonal]):focus-visible:active{--et-button-shadow: none}.et-fab:where([data-variant=transparent]){--et-theme-color-primary-opacity: 0;--et-button-shadow: none;background:var(--et-theme-color-primary);color:var(--et-theme-color-ink-solid)}@media(hover:hover){.et-fab:where([data-variant=transparent]):hover{--et-theme-color-primary-opacity: .08;--et-button-shadow: none}}.et-fab:where([data-variant=transparent]):focus-visible{--et-theme-color-primary-opacity: .12}.et-fab:where([data-variant=transparent]):active{--et-theme-color-primary-opacity: .16;--et-button-shadow: none}.et-fab:where([data-variant=transparent]):focus-visible:active{--et-button-shadow: none}.et-fab[data-icon-alignment=end]{--_et-fab-contents-padding: 0 0 0 var(--_et-fab-contents-gap)}.et-fab .et-fab-icon{display:flex;align-items:center;justify-content:center;width:var(--_et-fab-size, 4rem);height:var(--_et-fab-size, 4rem);transition:opacity .12s ease}.et-fab .et-fab-icon .et-icon{width:var(--_et-fab-icon-size);height:var(--_et-fab-icon-size)}.et-fab .et-fab-contents{display:inline-grid;grid-template-columns:1fr;padding:var(--_et-fab-contents-padding);transition:opacity .12s ease,grid-template-columns var(--_et-fab-expand-duration) var(--_et-fab-expand-easing),padding var(--_et-fab-expand-duration) var(--_et-fab-expand-easing)}.et-fab .et-fab-contents .et-fab-contents-inner{min-width:0;opacity:1;white-space:nowrap;font-size:var(--_et-fab-label-font-size);transition:opacity var(--_et-fab-label-fade-duration) var(--_et-fab-expand-easing)}.et-fab:not([data-expanded=true]) .et-fab-contents{grid-template-columns:0fr;padding:0;pointer-events:none;transition:opacity .12s ease,grid-template-columns var(--_et-fab-collapse-duration) var(--_et-fab-collapse-easing),padding var(--_et-fab-collapse-duration) var(--_et-fab-collapse-easing)}.et-fab:not([data-expanded=true]) .et-fab-contents-inner{opacity:0;transition:opacity var(--_et-fab-label-fade-duration) var(--_et-fab-collapse-easing)}.et-fab[data-loading=true] .et-fab-icon,.et-fab[data-loading=true] .et-fab-contents{opacity:0}.et-fab[data-loading=true] .et-button-loader{opacity:1}}\n"] }]
764
764
  }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], expanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "expanded", required: false }] }], iconAlignment: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconAlignment", required: false }] }] } });
765
765
 
766
766
  const PRESSED_VARIANT_MAP$1 = {
@@ -797,7 +797,7 @@ class IconButtonComponent {
797
797
  />
798
798
  </div>
799
799
  }
800
- `, isInline: true, styles: ["@layer components{@property --_et-icon-button-icon-size{syntax: \"<length>\"; inherits: true; initial-value: 20px;}.et-icon-button{display:inline-flex;position:relative;align-items:center;justify-content:center;background:var(--et-theme-color-primary);color:var(--et-theme-color-ink-solid);border:none;border-radius:var(--et-icon-button-border-radius, 9999px);padding:0;font-size:var(--et-button-font-size);cursor:var(--et-button-cursor);appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;overflow:hidden;flex-shrink:0;--et-theme-color-primary-opacity: 0}.et-icon-button[data-can-animate]{transition:background .12s ease,color .12s ease,box-shadow .12s ease,outline-color .12s ease,opacity .12s ease}.et-icon-button:where([data-size=xs]){width:2.4rem;height:2.4rem;--_et-icon-button-icon-size: 1.4rem}.et-icon-button:where([data-size=sm]){width:3.1rem;height:3.1rem;--_et-icon-button-icon-size: 1.8rem}.et-icon-button:where([data-size=md]){width:3.9rem;height:3.9rem;--_et-icon-button-icon-size: 2rem}.et-icon-button:where([data-size=lg]){width:4.6rem;height:4.6rem;--_et-icon-button-icon-size: 2.4rem}.et-icon-button:where([data-size=xl]){width:5.7rem;height:5.7rem;--_et-icon-button-icon-size: 2.8rem}.et-icon-button:where([disabled]),.et-icon-button:where([aria-disabled=true]){opacity:var(--et-button-opacity-disabled);cursor:not-allowed;pointer-events:none}.et-icon-button:where([data-variant=filled]){--et-theme-color-primary-opacity: 1;color:var(--et-theme-color-on-primary)}.et-icon-button:where([data-variant=filled]):hover{--et-theme-color-primary-opacity: .92}.et-icon-button:where([data-variant=filled]):focus-visible{--et-theme-color-primary-opacity: .88}.et-icon-button:where([data-variant=filled]):active{--et-theme-color-primary-opacity: .84}.et-icon-button:where([data-variant=outline]){--et-theme-color-primary-opacity: 0;border:var(--et-button-border-width, .1rem) solid var(--et-theme-color-ink-solid)}.et-icon-button:where([data-variant=outline]):hover{--et-theme-color-primary-opacity: .08}.et-icon-button:where([data-variant=outline]):focus-visible{--et-theme-color-primary-opacity: .12}.et-icon-button:where([data-variant=outline]):active{--et-theme-color-primary-opacity: .16}.et-icon-button:where([data-variant=tonal]){--et-theme-color-primary-opacity: .16}.et-icon-button:where([data-variant=tonal]):hover{--et-theme-color-primary-opacity: .24}.et-icon-button:where([data-variant=tonal]):focus-visible{--et-theme-color-primary-opacity: .28}.et-icon-button:where([data-variant=tonal]):active{--et-theme-color-primary-opacity: .32}.et-icon-button:where([data-variant=transparent]){--et-theme-color-primary-opacity: 0}.et-icon-button:where([data-variant=transparent]):hover{--et-theme-color-primary-opacity: .08}.et-icon-button:where([data-variant=transparent]):focus-visible{--et-theme-color-primary-opacity: .12}.et-icon-button:where([data-variant=transparent]):active{--et-theme-color-primary-opacity: .16}.et-icon-button[data-pressed=true]:where([data-pressed-variant=transparent]){--et-theme-color-primary-opacity: .16}.et-icon-button[data-pressed=true]:where([data-pressed-variant=transparent]):hover{--et-theme-color-primary-opacity: .24}.et-icon-button[data-pressed=true]:where([data-pressed-variant=transparent]):focus-visible{--et-theme-color-primary-opacity: .28}.et-icon-button[data-pressed=true]:where([data-pressed-variant=transparent]):active{--et-theme-color-primary-opacity: .32}.et-icon-button[data-pressed=true]:where([data-pressed-variant=tonal]){--et-theme-color-primary-opacity: .16}.et-icon-button[data-pressed=true]:where([data-pressed-variant=tonal]):hover{--et-theme-color-primary-opacity: .24}.et-icon-button[data-pressed=true]:where([data-pressed-variant=tonal]):focus-visible{--et-theme-color-primary-opacity: .28}.et-icon-button[data-pressed=true]:where([data-pressed-variant=tonal]):active{--et-theme-color-primary-opacity: .32}.et-icon-button[data-pressed=true]:where([data-pressed-variant=filled]){--et-theme-color-primary-opacity: 1;color:var(--et-theme-color-on-primary)}.et-icon-button[data-pressed=true]:where([data-pressed-variant=filled]):hover{--et-theme-color-primary-opacity: .92}.et-icon-button[data-pressed=true]:where([data-pressed-variant=filled]):focus-visible{--et-theme-color-primary-opacity: .88}.et-icon-button[data-pressed=true]:where([data-pressed-variant=filled]):active{--et-theme-color-primary-opacity: .84}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]){color:currentColor}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 32%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):hover:not([disabled]):not([aria-disabled=true]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 40%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 44%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):active{background:color-mix(in srgb,var(--et-surface-interaction-solid) 48%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]){background:transparent;border-color:var(--et-surface-interaction-solid)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):hover:not([disabled]):not([aria-disabled=true]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 16%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):active{background:color-mix(in srgb,var(--et-surface-interaction-solid) 20%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 16%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):hover:not([disabled]):not([aria-disabled=true]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 24%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 28%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):active{background:color-mix(in srgb,var(--et-surface-interaction-solid) 32%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]){background:transparent}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):hover:not([disabled]):not([aria-disabled=true]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 16%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):active{background:color-mix(in srgb,var(--et-surface-interaction-solid) 20%,transparent)}.et-icon-button .et-icon-button-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%;transition:opacity .12s ease}.et-icon-button .et-icon-button-icon .et-icon{width:var(--_et-icon-button-icon-size);height:var(--_et-icon-button-icon-size)}.et-icon-button[data-loading=true] .et-icon-button-icon{opacity:0}.et-icon-button[data-loading=true] .et-button-loader{opacity:1}}\n"], dependencies: [{ kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }], encapsulation: i0.ViewEncapsulation.None }); }
800
+ `, isInline: true, styles: ["@layer components{@property --_et-icon-button-icon-size{syntax: \"<length>\"; inherits: true; initial-value: 20px;}.et-icon-button{display:inline-flex;position:relative;align-items:center;justify-content:center;background:var(--et-theme-color-primary);color:var(--et-theme-color-ink-solid);border:none;border-radius:var(--et-icon-button-border-radius, 9999px);padding:0;font-size:var(--et-button-font-size);cursor:var(--et-button-cursor);appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;overflow:hidden;flex-shrink:0;--et-theme-color-primary-opacity: 0}.et-icon-button[data-can-animate]{transition:background .12s ease,color .12s ease,box-shadow .12s ease,outline-color .12s ease,opacity .12s ease}.et-icon-button:where([data-size=xs]){width:2.4rem;height:2.4rem;--_et-icon-button-icon-size: 1.4rem}.et-icon-button:where([data-size=sm]){width:3.1rem;height:3.1rem;--_et-icon-button-icon-size: 1.8rem}.et-icon-button:where([data-size=md]){width:3.9rem;height:3.9rem;--_et-icon-button-icon-size: 2rem}.et-icon-button:where([data-size=lg]){width:4.6rem;height:4.6rem;--_et-icon-button-icon-size: 2.4rem}.et-icon-button:where([data-size=xl]){width:5.7rem;height:5.7rem;--_et-icon-button-icon-size: 2.8rem}.et-icon-button:where([disabled]),.et-icon-button:where([aria-disabled=true]){opacity:var(--et-button-opacity-disabled);cursor:not-allowed;pointer-events:none}.et-icon-button:where([data-variant=filled]){--et-theme-color-primary-opacity: 1;color:var(--et-theme-color-on-primary)}@media(hover:hover){.et-icon-button:where([data-variant=filled]):hover{--et-theme-color-primary-opacity: .92}}.et-icon-button:where([data-variant=filled]):focus-visible{--et-theme-color-primary-opacity: .88}.et-icon-button:where([data-variant=filled]):active{--et-theme-color-primary-opacity: .84}.et-icon-button:where([data-variant=outline]){--et-theme-color-primary-opacity: 0;border:var(--et-button-border-width, .1rem) solid var(--et-theme-color-ink-solid)}@media(hover:hover){.et-icon-button:where([data-variant=outline]):hover{--et-theme-color-primary-opacity: .08}}.et-icon-button:where([data-variant=outline]):focus-visible{--et-theme-color-primary-opacity: .12}.et-icon-button:where([data-variant=outline]):active{--et-theme-color-primary-opacity: .16}.et-icon-button:where([data-variant=tonal]){--et-theme-color-primary-opacity: .16}@media(hover:hover){.et-icon-button:where([data-variant=tonal]):hover{--et-theme-color-primary-opacity: .24}}.et-icon-button:where([data-variant=tonal]):focus-visible{--et-theme-color-primary-opacity: .28}.et-icon-button:where([data-variant=tonal]):active{--et-theme-color-primary-opacity: .32}.et-icon-button:where([data-variant=transparent]){--et-theme-color-primary-opacity: 0}@media(hover:hover){.et-icon-button:where([data-variant=transparent]):hover{--et-theme-color-primary-opacity: .08}}.et-icon-button:where([data-variant=transparent]):focus-visible{--et-theme-color-primary-opacity: .12}.et-icon-button:where([data-variant=transparent]):active{--et-theme-color-primary-opacity: .16}.et-icon-button[data-pressed=true]:where([data-pressed-variant=transparent]){--et-theme-color-primary-opacity: .16}@media(hover:hover){.et-icon-button[data-pressed=true]:where([data-pressed-variant=transparent]):hover{--et-theme-color-primary-opacity: .24}}.et-icon-button[data-pressed=true]:where([data-pressed-variant=transparent]):focus-visible{--et-theme-color-primary-opacity: .28}.et-icon-button[data-pressed=true]:where([data-pressed-variant=transparent]):active{--et-theme-color-primary-opacity: .32}.et-icon-button[data-pressed=true]:where([data-pressed-variant=tonal]){--et-theme-color-primary-opacity: .16}@media(hover:hover){.et-icon-button[data-pressed=true]:where([data-pressed-variant=tonal]):hover{--et-theme-color-primary-opacity: .24}}.et-icon-button[data-pressed=true]:where([data-pressed-variant=tonal]):focus-visible{--et-theme-color-primary-opacity: .28}.et-icon-button[data-pressed=true]:where([data-pressed-variant=tonal]):active{--et-theme-color-primary-opacity: .32}.et-icon-button[data-pressed=true]:where([data-pressed-variant=filled]){--et-theme-color-primary-opacity: 1;color:var(--et-theme-color-on-primary)}@media(hover:hover){.et-icon-button[data-pressed=true]:where([data-pressed-variant=filled]):hover{--et-theme-color-primary-opacity: .92}}.et-icon-button[data-pressed=true]:where([data-pressed-variant=filled]):focus-visible{--et-theme-color-primary-opacity: .88}.et-icon-button[data-pressed=true]:where([data-pressed-variant=filled]):active{--et-theme-color-primary-opacity: .84}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]){color:currentColor}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 32%,transparent)}@media(hover:hover){.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):hover:not([disabled]):not([aria-disabled=true]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 40%,transparent)}}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 44%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):active{background:color-mix(in srgb,var(--et-surface-interaction-solid) 48%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]){background:transparent;border-color:var(--et-surface-interaction-solid)}@media(hover:hover){.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):hover:not([disabled]):not([aria-disabled=true]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent)}}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 16%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):active{background:color-mix(in srgb,var(--et-surface-interaction-solid) 20%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 16%,transparent)}@media(hover:hover){.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):hover:not([disabled]):not([aria-disabled=true]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 24%,transparent)}}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 28%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):active{background:color-mix(in srgb,var(--et-surface-interaction-solid) 32%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]){background:transparent}@media(hover:hover){.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):hover:not([disabled]):not([aria-disabled=true]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent)}}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 16%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):active{background:color-mix(in srgb,var(--et-surface-interaction-solid) 20%,transparent)}.et-icon-button .et-icon-button-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%;transition:opacity .12s ease}.et-icon-button .et-icon-button-icon .et-icon{width:var(--_et-icon-button-icon-size);height:var(--_et-icon-button-icon-size)}.et-icon-button[data-loading=true] .et-icon-button-icon{opacity:0}.et-icon-button[data-loading=true] .et-button-loader{opacity:1}}\n"], dependencies: [{ kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }], encapsulation: i0.ViewEncapsulation.None }); }
801
801
  }
802
802
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: IconButtonComponent, decorators: [{
803
803
  type: Component,
@@ -833,18 +833,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
833
833
  '[attr.data-size]': 'size()',
834
834
  '[attr.data-pressed-variant]': 'pressedVariant()',
835
835
  '[attr.data-can-animate]': 'canAnimate.state() || null',
836
- }, styles: ["@layer components{@property --_et-icon-button-icon-size{syntax: \"<length>\"; inherits: true; initial-value: 20px;}.et-icon-button{display:inline-flex;position:relative;align-items:center;justify-content:center;background:var(--et-theme-color-primary);color:var(--et-theme-color-ink-solid);border:none;border-radius:var(--et-icon-button-border-radius, 9999px);padding:0;font-size:var(--et-button-font-size);cursor:var(--et-button-cursor);appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;overflow:hidden;flex-shrink:0;--et-theme-color-primary-opacity: 0}.et-icon-button[data-can-animate]{transition:background .12s ease,color .12s ease,box-shadow .12s ease,outline-color .12s ease,opacity .12s ease}.et-icon-button:where([data-size=xs]){width:2.4rem;height:2.4rem;--_et-icon-button-icon-size: 1.4rem}.et-icon-button:where([data-size=sm]){width:3.1rem;height:3.1rem;--_et-icon-button-icon-size: 1.8rem}.et-icon-button:where([data-size=md]){width:3.9rem;height:3.9rem;--_et-icon-button-icon-size: 2rem}.et-icon-button:where([data-size=lg]){width:4.6rem;height:4.6rem;--_et-icon-button-icon-size: 2.4rem}.et-icon-button:where([data-size=xl]){width:5.7rem;height:5.7rem;--_et-icon-button-icon-size: 2.8rem}.et-icon-button:where([disabled]),.et-icon-button:where([aria-disabled=true]){opacity:var(--et-button-opacity-disabled);cursor:not-allowed;pointer-events:none}.et-icon-button:where([data-variant=filled]){--et-theme-color-primary-opacity: 1;color:var(--et-theme-color-on-primary)}.et-icon-button:where([data-variant=filled]):hover{--et-theme-color-primary-opacity: .92}.et-icon-button:where([data-variant=filled]):focus-visible{--et-theme-color-primary-opacity: .88}.et-icon-button:where([data-variant=filled]):active{--et-theme-color-primary-opacity: .84}.et-icon-button:where([data-variant=outline]){--et-theme-color-primary-opacity: 0;border:var(--et-button-border-width, .1rem) solid var(--et-theme-color-ink-solid)}.et-icon-button:where([data-variant=outline]):hover{--et-theme-color-primary-opacity: .08}.et-icon-button:where([data-variant=outline]):focus-visible{--et-theme-color-primary-opacity: .12}.et-icon-button:where([data-variant=outline]):active{--et-theme-color-primary-opacity: .16}.et-icon-button:where([data-variant=tonal]){--et-theme-color-primary-opacity: .16}.et-icon-button:where([data-variant=tonal]):hover{--et-theme-color-primary-opacity: .24}.et-icon-button:where([data-variant=tonal]):focus-visible{--et-theme-color-primary-opacity: .28}.et-icon-button:where([data-variant=tonal]):active{--et-theme-color-primary-opacity: .32}.et-icon-button:where([data-variant=transparent]){--et-theme-color-primary-opacity: 0}.et-icon-button:where([data-variant=transparent]):hover{--et-theme-color-primary-opacity: .08}.et-icon-button:where([data-variant=transparent]):focus-visible{--et-theme-color-primary-opacity: .12}.et-icon-button:where([data-variant=transparent]):active{--et-theme-color-primary-opacity: .16}.et-icon-button[data-pressed=true]:where([data-pressed-variant=transparent]){--et-theme-color-primary-opacity: .16}.et-icon-button[data-pressed=true]:where([data-pressed-variant=transparent]):hover{--et-theme-color-primary-opacity: .24}.et-icon-button[data-pressed=true]:where([data-pressed-variant=transparent]):focus-visible{--et-theme-color-primary-opacity: .28}.et-icon-button[data-pressed=true]:where([data-pressed-variant=transparent]):active{--et-theme-color-primary-opacity: .32}.et-icon-button[data-pressed=true]:where([data-pressed-variant=tonal]){--et-theme-color-primary-opacity: .16}.et-icon-button[data-pressed=true]:where([data-pressed-variant=tonal]):hover{--et-theme-color-primary-opacity: .24}.et-icon-button[data-pressed=true]:where([data-pressed-variant=tonal]):focus-visible{--et-theme-color-primary-opacity: .28}.et-icon-button[data-pressed=true]:where([data-pressed-variant=tonal]):active{--et-theme-color-primary-opacity: .32}.et-icon-button[data-pressed=true]:where([data-pressed-variant=filled]){--et-theme-color-primary-opacity: 1;color:var(--et-theme-color-on-primary)}.et-icon-button[data-pressed=true]:where([data-pressed-variant=filled]):hover{--et-theme-color-primary-opacity: .92}.et-icon-button[data-pressed=true]:where([data-pressed-variant=filled]):focus-visible{--et-theme-color-primary-opacity: .88}.et-icon-button[data-pressed=true]:where([data-pressed-variant=filled]):active{--et-theme-color-primary-opacity: .84}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]){color:currentColor}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 32%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):hover:not([disabled]):not([aria-disabled=true]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 40%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 44%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):active{background:color-mix(in srgb,var(--et-surface-interaction-solid) 48%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]){background:transparent;border-color:var(--et-surface-interaction-solid)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):hover:not([disabled]):not([aria-disabled=true]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 16%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):active{background:color-mix(in srgb,var(--et-surface-interaction-solid) 20%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 16%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):hover:not([disabled]):not([aria-disabled=true]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 24%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 28%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):active{background:color-mix(in srgb,var(--et-surface-interaction-solid) 32%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]){background:transparent}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):hover:not([disabled]):not([aria-disabled=true]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 16%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):active{background:color-mix(in srgb,var(--et-surface-interaction-solid) 20%,transparent)}.et-icon-button .et-icon-button-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%;transition:opacity .12s ease}.et-icon-button .et-icon-button-icon .et-icon{width:var(--_et-icon-button-icon-size);height:var(--_et-icon-button-icon-size)}.et-icon-button[data-loading=true] .et-icon-button-icon{opacity:0}.et-icon-button[data-loading=true] .et-button-loader{opacity:1}}\n"] }]
836
+ }, styles: ["@layer components{@property --_et-icon-button-icon-size{syntax: \"<length>\"; inherits: true; initial-value: 20px;}.et-icon-button{display:inline-flex;position:relative;align-items:center;justify-content:center;background:var(--et-theme-color-primary);color:var(--et-theme-color-ink-solid);border:none;border-radius:var(--et-icon-button-border-radius, 9999px);padding:0;font-size:var(--et-button-font-size);cursor:var(--et-button-cursor);appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;overflow:hidden;flex-shrink:0;--et-theme-color-primary-opacity: 0}.et-icon-button[data-can-animate]{transition:background .12s ease,color .12s ease,box-shadow .12s ease,outline-color .12s ease,opacity .12s ease}.et-icon-button:where([data-size=xs]){width:2.4rem;height:2.4rem;--_et-icon-button-icon-size: 1.4rem}.et-icon-button:where([data-size=sm]){width:3.1rem;height:3.1rem;--_et-icon-button-icon-size: 1.8rem}.et-icon-button:where([data-size=md]){width:3.9rem;height:3.9rem;--_et-icon-button-icon-size: 2rem}.et-icon-button:where([data-size=lg]){width:4.6rem;height:4.6rem;--_et-icon-button-icon-size: 2.4rem}.et-icon-button:where([data-size=xl]){width:5.7rem;height:5.7rem;--_et-icon-button-icon-size: 2.8rem}.et-icon-button:where([disabled]),.et-icon-button:where([aria-disabled=true]){opacity:var(--et-button-opacity-disabled);cursor:not-allowed;pointer-events:none}.et-icon-button:where([data-variant=filled]){--et-theme-color-primary-opacity: 1;color:var(--et-theme-color-on-primary)}@media(hover:hover){.et-icon-button:where([data-variant=filled]):hover{--et-theme-color-primary-opacity: .92}}.et-icon-button:where([data-variant=filled]):focus-visible{--et-theme-color-primary-opacity: .88}.et-icon-button:where([data-variant=filled]):active{--et-theme-color-primary-opacity: .84}.et-icon-button:where([data-variant=outline]){--et-theme-color-primary-opacity: 0;border:var(--et-button-border-width, .1rem) solid var(--et-theme-color-ink-solid)}@media(hover:hover){.et-icon-button:where([data-variant=outline]):hover{--et-theme-color-primary-opacity: .08}}.et-icon-button:where([data-variant=outline]):focus-visible{--et-theme-color-primary-opacity: .12}.et-icon-button:where([data-variant=outline]):active{--et-theme-color-primary-opacity: .16}.et-icon-button:where([data-variant=tonal]){--et-theme-color-primary-opacity: .16}@media(hover:hover){.et-icon-button:where([data-variant=tonal]):hover{--et-theme-color-primary-opacity: .24}}.et-icon-button:where([data-variant=tonal]):focus-visible{--et-theme-color-primary-opacity: .28}.et-icon-button:where([data-variant=tonal]):active{--et-theme-color-primary-opacity: .32}.et-icon-button:where([data-variant=transparent]){--et-theme-color-primary-opacity: 0}@media(hover:hover){.et-icon-button:where([data-variant=transparent]):hover{--et-theme-color-primary-opacity: .08}}.et-icon-button:where([data-variant=transparent]):focus-visible{--et-theme-color-primary-opacity: .12}.et-icon-button:where([data-variant=transparent]):active{--et-theme-color-primary-opacity: .16}.et-icon-button[data-pressed=true]:where([data-pressed-variant=transparent]){--et-theme-color-primary-opacity: .16}@media(hover:hover){.et-icon-button[data-pressed=true]:where([data-pressed-variant=transparent]):hover{--et-theme-color-primary-opacity: .24}}.et-icon-button[data-pressed=true]:where([data-pressed-variant=transparent]):focus-visible{--et-theme-color-primary-opacity: .28}.et-icon-button[data-pressed=true]:where([data-pressed-variant=transparent]):active{--et-theme-color-primary-opacity: .32}.et-icon-button[data-pressed=true]:where([data-pressed-variant=tonal]){--et-theme-color-primary-opacity: .16}@media(hover:hover){.et-icon-button[data-pressed=true]:where([data-pressed-variant=tonal]):hover{--et-theme-color-primary-opacity: .24}}.et-icon-button[data-pressed=true]:where([data-pressed-variant=tonal]):focus-visible{--et-theme-color-primary-opacity: .28}.et-icon-button[data-pressed=true]:where([data-pressed-variant=tonal]):active{--et-theme-color-primary-opacity: .32}.et-icon-button[data-pressed=true]:where([data-pressed-variant=filled]){--et-theme-color-primary-opacity: 1;color:var(--et-theme-color-on-primary)}@media(hover:hover){.et-icon-button[data-pressed=true]:where([data-pressed-variant=filled]):hover{--et-theme-color-primary-opacity: .92}}.et-icon-button[data-pressed=true]:where([data-pressed-variant=filled]):focus-visible{--et-theme-color-primary-opacity: .88}.et-icon-button[data-pressed=true]:where([data-pressed-variant=filled]):active{--et-theme-color-primary-opacity: .84}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]){color:currentColor}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 32%,transparent)}@media(hover:hover){.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):hover:not([disabled]):not([aria-disabled=true]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 40%,transparent)}}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 44%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=filled]):active{background:color-mix(in srgb,var(--et-surface-interaction-solid) 48%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]){background:transparent;border-color:var(--et-surface-interaction-solid)}@media(hover:hover){.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):hover:not([disabled]):not([aria-disabled=true]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent)}}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 16%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=outline]):active{background:color-mix(in srgb,var(--et-surface-interaction-solid) 20%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 16%,transparent)}@media(hover:hover){.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):hover:not([disabled]):not([aria-disabled=true]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 24%,transparent)}}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 28%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=tonal]):active{background:color-mix(in srgb,var(--et-surface-interaction-solid) 32%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]){background:transparent}@media(hover:hover){.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):hover:not([disabled]):not([aria-disabled=true]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent)}}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 16%,transparent)}.et-icon-button[data-muted-until-pressed]:not([data-pressed=true]):where([data-variant=transparent]):active{background:color-mix(in srgb,var(--et-surface-interaction-solid) 20%,transparent)}.et-icon-button .et-icon-button-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%;transition:opacity .12s ease}.et-icon-button .et-icon-button-icon .et-icon{width:var(--_et-icon-button-icon-size);height:var(--_et-icon-button-icon-size)}.et-icon-button[data-loading=true] .et-icon-button-icon{opacity:0}.et-icon-button[data-loading=true] .et-button-loader{opacity:1}}\n"] }]
837
837
  }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
838
838
 
839
839
  class SplitButtonComponent {
840
840
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SplitButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
841
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: SplitButtonComponent, isStandalone: true, selector: "et-split-button", host: { classAttribute: "et-split-button" }, hostDirectives: [{ directive: SplitButtonDirective }], ngImport: i0, template: `<ng-content />`, isInline: true, styles: ["@layer components{@property --et-split-button-divider-color{syntax: \"*\"; inherits: true;}.et-split-button{display:inline-flex;align-items:stretch}.et-split-button .et-split-button-action,.et-split-button .et-split-button-trigger{position:relative}:is(.et-split-button .et-split-button-action,.et-split-button .et-split-button-trigger):hover,:is(.et-split-button .et-split-button-action,.et-split-button .et-split-button-trigger):focus-visible{z-index:1}.et-split-button .et-split-button-action{border-start-end-radius:0;border-end-end-radius:0}.et-split-button .et-split-button-trigger{height:auto;border-start-start-radius:0;border-end-start-radius:0;border-start-end-radius:var(--et-button-border-radius);border-end-end-radius:var(--et-button-border-radius)}.et-split-button .et-split-button-trigger:where([data-size=xs]){--et-button-border-radius: .3rem}.et-split-button .et-split-button-trigger:where([data-size=sm]),.et-split-button .et-split-button-trigger:where([data-size=md]){--et-button-border-radius: .4rem}.et-split-button .et-split-button-trigger:where([data-size=lg]){--et-button-border-radius: .6rem}.et-split-button .et-split-button-trigger:where([data-size=xl]){--et-button-border-radius: .8rem}.et-split-button .et-split-button-trigger:not([data-variant=outline]){border-inline-start:var(--et-button-border-width, .1rem) solid var(--et-split-button-divider-color, color-mix(in srgb, currentColor 32%, transparent))}.et-split-button .et-split-button-trigger:where([data-variant=outline]){margin-inline-start:calc(var(--et-button-border-width, .1rem) * -1)}.et-split-button .et-icon-button.et-split-button-trigger:where([data-variant=filled]):where([disabled],[aria-disabled=true]){opacity:1}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
841
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: SplitButtonComponent, isStandalone: true, selector: "et-split-button", host: { classAttribute: "et-split-button" }, hostDirectives: [{ directive: SplitButtonDirective }], ngImport: i0, template: `<ng-content />`, isInline: true, styles: ["@layer components{@property --et-split-button-divider-color{syntax: \"*\"; inherits: true;}.et-split-button{display:inline-flex;align-items:stretch}.et-split-button .et-split-button-action,.et-split-button .et-split-button-trigger{position:relative}:is(.et-split-button .et-split-button-action,.et-split-button .et-split-button-trigger):focus-visible{z-index:1}@media(hover:hover){:is(.et-split-button .et-split-button-action,.et-split-button .et-split-button-trigger):hover{z-index:1}}.et-split-button .et-split-button-action{border-start-end-radius:0;border-end-end-radius:0}.et-split-button .et-split-button-trigger{height:auto;border-start-start-radius:0;border-end-start-radius:0;border-start-end-radius:var(--et-button-border-radius);border-end-end-radius:var(--et-button-border-radius)}.et-split-button .et-split-button-trigger:where([data-size=xs]){--et-button-border-radius: .3rem}.et-split-button .et-split-button-trigger:where([data-size=sm]),.et-split-button .et-split-button-trigger:where([data-size=md]){--et-button-border-radius: .4rem}.et-split-button .et-split-button-trigger:where([data-size=lg]){--et-button-border-radius: .6rem}.et-split-button .et-split-button-trigger:where([data-size=xl]){--et-button-border-radius: .8rem}.et-split-button .et-split-button-trigger:not([data-variant=outline]){border-inline-start:var(--et-button-border-width, .1rem) solid var(--et-split-button-divider-color, color-mix(in srgb, currentColor 32%, transparent))}.et-split-button .et-split-button-trigger:where([data-variant=outline]){margin-inline-start:calc(var(--et-button-border-width, .1rem) * -1)}.et-split-button .et-icon-button.et-split-button-trigger:where([data-variant=filled]):where([disabled],[aria-disabled=true]){opacity:1}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
842
842
  }
843
843
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SplitButtonComponent, decorators: [{
844
844
  type: Component,
845
845
  args: [{ selector: 'et-split-button', template: `<ng-content />`, encapsulation: ViewEncapsulation.None, hostDirectives: [SplitButtonDirective], host: {
846
846
  class: 'et-split-button',
847
- }, styles: ["@layer components{@property --et-split-button-divider-color{syntax: \"*\"; inherits: true;}.et-split-button{display:inline-flex;align-items:stretch}.et-split-button .et-split-button-action,.et-split-button .et-split-button-trigger{position:relative}:is(.et-split-button .et-split-button-action,.et-split-button .et-split-button-trigger):hover,:is(.et-split-button .et-split-button-action,.et-split-button .et-split-button-trigger):focus-visible{z-index:1}.et-split-button .et-split-button-action{border-start-end-radius:0;border-end-end-radius:0}.et-split-button .et-split-button-trigger{height:auto;border-start-start-radius:0;border-end-start-radius:0;border-start-end-radius:var(--et-button-border-radius);border-end-end-radius:var(--et-button-border-radius)}.et-split-button .et-split-button-trigger:where([data-size=xs]){--et-button-border-radius: .3rem}.et-split-button .et-split-button-trigger:where([data-size=sm]),.et-split-button .et-split-button-trigger:where([data-size=md]){--et-button-border-radius: .4rem}.et-split-button .et-split-button-trigger:where([data-size=lg]){--et-button-border-radius: .6rem}.et-split-button .et-split-button-trigger:where([data-size=xl]){--et-button-border-radius: .8rem}.et-split-button .et-split-button-trigger:not([data-variant=outline]){border-inline-start:var(--et-button-border-width, .1rem) solid var(--et-split-button-divider-color, color-mix(in srgb, currentColor 32%, transparent))}.et-split-button .et-split-button-trigger:where([data-variant=outline]){margin-inline-start:calc(var(--et-button-border-width, .1rem) * -1)}.et-split-button .et-icon-button.et-split-button-trigger:where([data-variant=filled]):where([disabled],[aria-disabled=true]){opacity:1}}\n"] }]
847
+ }, styles: ["@layer components{@property --et-split-button-divider-color{syntax: \"*\"; inherits: true;}.et-split-button{display:inline-flex;align-items:stretch}.et-split-button .et-split-button-action,.et-split-button .et-split-button-trigger{position:relative}:is(.et-split-button .et-split-button-action,.et-split-button .et-split-button-trigger):focus-visible{z-index:1}@media(hover:hover){:is(.et-split-button .et-split-button-action,.et-split-button .et-split-button-trigger):hover{z-index:1}}.et-split-button .et-split-button-action{border-start-end-radius:0;border-end-end-radius:0}.et-split-button .et-split-button-trigger{height:auto;border-start-start-radius:0;border-end-start-radius:0;border-start-end-radius:var(--et-button-border-radius);border-end-end-radius:var(--et-button-border-radius)}.et-split-button .et-split-button-trigger:where([data-size=xs]){--et-button-border-radius: .3rem}.et-split-button .et-split-button-trigger:where([data-size=sm]),.et-split-button .et-split-button-trigger:where([data-size=md]){--et-button-border-radius: .4rem}.et-split-button .et-split-button-trigger:where([data-size=lg]){--et-button-border-radius: .6rem}.et-split-button .et-split-button-trigger:where([data-size=xl]){--et-button-border-radius: .8rem}.et-split-button .et-split-button-trigger:not([data-variant=outline]){border-inline-start:var(--et-button-border-width, .1rem) solid var(--et-split-button-divider-color, color-mix(in srgb, currentColor 32%, transparent))}.et-split-button .et-split-button-trigger:where([data-variant=outline]){margin-inline-start:calc(var(--et-button-border-width, .1rem) * -1)}.et-split-button .et-icon-button.et-split-button-trigger:where([data-variant=filled]):where([disabled],[aria-disabled=true]){opacity:1}}\n"] }]
848
848
  }] });
849
849
 
850
850
  class TextButtonComponent {
@@ -889,7 +889,7 @@ class TextButtonComponent {
889
889
  <ng-template #iconTpl>
890
890
  <ng-content select="[etIcon]" />
891
891
  </ng-template>
892
- `, isInline: true, styles: ["@layer components{.et-text-button{display:inline-flex;position:relative;align-items:center;justify-content:center;gap:var(--et-button-gap);background:transparent;color:var(--et-theme-color-ink-solid);border:none;padding:0;border-radius:.2rem;font-size:var(--et-button-font-size);font-weight:var(--et-button-font-weight);cursor:var(--et-button-cursor);text-decoration:none;appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;line-height:var(--et-button-line-height);white-space:nowrap}.et-text-button[data-can-animate]{transition:color .12s ease,box-shadow .12s ease,outline-color .12s ease,opacity .12s ease}.et-text-button:where([data-size=xs]){--et-button-font-size: 1.2rem;--et-button-gap: .4rem}.et-text-button:where([data-size=sm]){--et-button-font-size: 1.4rem;--et-button-gap: .5rem}.et-text-button:where([data-size=md]){--et-button-font-size: 1.4rem;--et-button-gap: .6rem}.et-text-button:where([data-size=lg]){--et-button-font-size: 1.6rem;--et-button-gap: .7rem}.et-text-button:where([data-size=xl]){--et-button-font-size: 1.8rem;--et-button-gap: .8rem}.et-text-button:hover .et-text-button-contents:after{opacity:.9;transform:scaleX(1)}.et-text-button:focus-visible .et-text-button-contents:after{opacity:1;transform:scaleX(1)}.et-text-button:active .et-text-button-contents:after{opacity:1;transform:scaleX(.98)}.et-text-button:where([disabled]),.et-text-button:where([aria-disabled=true]){opacity:var(--et-button-opacity-disabled);cursor:not-allowed;pointer-events:none}.et-text-button .et-text-button-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:opacity .12s ease}.et-text-button .et-text-button-icon:empty{display:none}.et-text-button .et-text-button-icon .et-icon{width:1em;height:1em}.et-text-button .et-text-button-contents{display:inline-flex;align-items:center;min-width:0;position:relative;transition:opacity .12s ease}.et-text-button .et-text-button-contents:after{content:\"\";position:absolute;inset-inline:.04em;bottom:.15em;height:.08em;border-radius:999px;background:currentColor;opacity:0;transform:scaleX(.6);transform-origin:center;transition:opacity .16s ease,transform .2s ease}.et-text-button[data-loading=true] .et-text-button-icon,.et-text-button[data-loading=true] .et-text-button-contents{opacity:0}.et-text-button[data-loading=true] .et-button-loader{opacity:1}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }], encapsulation: i0.ViewEncapsulation.None }); }
892
+ `, isInline: true, styles: ["@layer components{.et-text-button{display:inline-flex;position:relative;align-items:center;justify-content:center;gap:var(--et-button-gap);background:transparent;color:var(--et-theme-color-ink-solid);border:none;padding:0;border-radius:.2rem;font-size:var(--et-button-font-size);font-weight:var(--et-button-font-weight);cursor:var(--et-button-cursor);text-decoration:none;appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;line-height:var(--et-button-line-height);white-space:nowrap}.et-text-button[data-can-animate]{transition:color .12s ease,box-shadow .12s ease,outline-color .12s ease,opacity .12s ease}.et-text-button:where([data-size=xs]){--et-button-font-size: 1.2rem;--et-button-gap: .4rem}.et-text-button:where([data-size=sm]){--et-button-font-size: 1.4rem;--et-button-gap: .5rem}.et-text-button:where([data-size=md]){--et-button-font-size: 1.4rem;--et-button-gap: .6rem}.et-text-button:where([data-size=lg]){--et-button-font-size: 1.6rem;--et-button-gap: .7rem}.et-text-button:where([data-size=xl]){--et-button-font-size: 1.8rem;--et-button-gap: .8rem}@media(hover:hover){.et-text-button:hover .et-text-button-contents:after{opacity:.9;transform:scaleX(1)}}.et-text-button:focus-visible .et-text-button-contents:after{opacity:1;transform:scaleX(1)}.et-text-button:active .et-text-button-contents:after{opacity:1;transform:scaleX(.98)}.et-text-button:where([disabled]),.et-text-button:where([aria-disabled=true]){opacity:var(--et-button-opacity-disabled);cursor:not-allowed;pointer-events:none}.et-text-button .et-text-button-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:opacity .12s ease}.et-text-button .et-text-button-icon:empty{display:none}.et-text-button .et-text-button-icon .et-icon{width:1em;height:1em}.et-text-button .et-text-button-contents{display:inline-flex;align-items:center;min-width:0;position:relative;transition:opacity .12s ease}.et-text-button .et-text-button-contents:after{content:\"\";position:absolute;inset-inline:.04em;bottom:.15em;height:.08em;border-radius:999px;background:currentColor;opacity:0;transform:scaleX(.6);transform-origin:center;transition:opacity .16s ease,transform .2s ease}.et-text-button[data-loading=true] .et-text-button-icon,.et-text-button[data-loading=true] .et-text-button-contents{opacity:0}.et-text-button[data-loading=true] .et-button-loader{opacity:1}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }], encapsulation: i0.ViewEncapsulation.None }); }
893
893
  }
894
894
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: TextButtonComponent, decorators: [{
895
895
  type: Component,
@@ -940,7 +940,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
940
940
  '[attr.data-icon-alignment]': 'iconAlignment()',
941
941
  '[attr.data-size]': 'size()',
942
942
  '[attr.data-can-animate]': 'canAnimate.state() || null',
943
- }, styles: ["@layer components{.et-text-button{display:inline-flex;position:relative;align-items:center;justify-content:center;gap:var(--et-button-gap);background:transparent;color:var(--et-theme-color-ink-solid);border:none;padding:0;border-radius:.2rem;font-size:var(--et-button-font-size);font-weight:var(--et-button-font-weight);cursor:var(--et-button-cursor);text-decoration:none;appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;line-height:var(--et-button-line-height);white-space:nowrap}.et-text-button[data-can-animate]{transition:color .12s ease,box-shadow .12s ease,outline-color .12s ease,opacity .12s ease}.et-text-button:where([data-size=xs]){--et-button-font-size: 1.2rem;--et-button-gap: .4rem}.et-text-button:where([data-size=sm]){--et-button-font-size: 1.4rem;--et-button-gap: .5rem}.et-text-button:where([data-size=md]){--et-button-font-size: 1.4rem;--et-button-gap: .6rem}.et-text-button:where([data-size=lg]){--et-button-font-size: 1.6rem;--et-button-gap: .7rem}.et-text-button:where([data-size=xl]){--et-button-font-size: 1.8rem;--et-button-gap: .8rem}.et-text-button:hover .et-text-button-contents:after{opacity:.9;transform:scaleX(1)}.et-text-button:focus-visible .et-text-button-contents:after{opacity:1;transform:scaleX(1)}.et-text-button:active .et-text-button-contents:after{opacity:1;transform:scaleX(.98)}.et-text-button:where([disabled]),.et-text-button:where([aria-disabled=true]){opacity:var(--et-button-opacity-disabled);cursor:not-allowed;pointer-events:none}.et-text-button .et-text-button-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:opacity .12s ease}.et-text-button .et-text-button-icon:empty{display:none}.et-text-button .et-text-button-icon .et-icon{width:1em;height:1em}.et-text-button .et-text-button-contents{display:inline-flex;align-items:center;min-width:0;position:relative;transition:opacity .12s ease}.et-text-button .et-text-button-contents:after{content:\"\";position:absolute;inset-inline:.04em;bottom:.15em;height:.08em;border-radius:999px;background:currentColor;opacity:0;transform:scaleX(.6);transform-origin:center;transition:opacity .16s ease,transform .2s ease}.et-text-button[data-loading=true] .et-text-button-icon,.et-text-button[data-loading=true] .et-text-button-contents{opacity:0}.et-text-button[data-loading=true] .et-button-loader{opacity:1}}\n"] }]
943
+ }, styles: ["@layer components{.et-text-button{display:inline-flex;position:relative;align-items:center;justify-content:center;gap:var(--et-button-gap);background:transparent;color:var(--et-theme-color-ink-solid);border:none;padding:0;border-radius:.2rem;font-size:var(--et-button-font-size);font-weight:var(--et-button-font-weight);cursor:var(--et-button-cursor);text-decoration:none;appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;line-height:var(--et-button-line-height);white-space:nowrap}.et-text-button[data-can-animate]{transition:color .12s ease,box-shadow .12s ease,outline-color .12s ease,opacity .12s ease}.et-text-button:where([data-size=xs]){--et-button-font-size: 1.2rem;--et-button-gap: .4rem}.et-text-button:where([data-size=sm]){--et-button-font-size: 1.4rem;--et-button-gap: .5rem}.et-text-button:where([data-size=md]){--et-button-font-size: 1.4rem;--et-button-gap: .6rem}.et-text-button:where([data-size=lg]){--et-button-font-size: 1.6rem;--et-button-gap: .7rem}.et-text-button:where([data-size=xl]){--et-button-font-size: 1.8rem;--et-button-gap: .8rem}@media(hover:hover){.et-text-button:hover .et-text-button-contents:after{opacity:.9;transform:scaleX(1)}}.et-text-button:focus-visible .et-text-button-contents:after{opacity:1;transform:scaleX(1)}.et-text-button:active .et-text-button-contents:after{opacity:1;transform:scaleX(.98)}.et-text-button:where([disabled]),.et-text-button:where([aria-disabled=true]){opacity:var(--et-button-opacity-disabled);cursor:not-allowed;pointer-events:none}.et-text-button .et-text-button-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:opacity .12s ease}.et-text-button .et-text-button-icon:empty{display:none}.et-text-button .et-text-button-icon .et-icon{width:1em;height:1em}.et-text-button .et-text-button-contents{display:inline-flex;align-items:center;min-width:0;position:relative;transition:opacity .12s ease}.et-text-button .et-text-button-contents:after{content:\"\";position:absolute;inset-inline:.04em;bottom:.15em;height:.08em;border-radius:999px;background:currentColor;opacity:0;transform:scaleX(.6);transform-origin:center;transition:opacity .16s ease,transform .2s ease}.et-text-button[data-loading=true] .et-text-button-icon,.et-text-button[data-loading=true] .et-text-button-contents{opacity:0}.et-text-button[data-loading=true] .et-button-loader{opacity:1}}\n"] }]
944
944
  }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], iconAlignment: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconAlignment", required: false }] }] } });
945
945
 
946
946
  const WINDOW_CONTROL_BUTTON_SIZES = {
@@ -983,7 +983,7 @@ class WindowControlButtonComponent {
983
983
  />
984
984
  </div>
985
985
  }
986
- `, isInline: true, styles: ["@layer components{@property --_et-window-control-button-size{syntax: \"<length>\"; inherits: false; initial-value: 32px;}@property --_et-window-control-button-icon-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}.et-window-control-button{--et-theme-color-primary-opacity: 0;--_et-window-control-button-fallback-background: transparent;--_et-window-control-button-fallback-color: rgba(255, 255, 255, .92);--_et-window-control-button-border-radius: 4px;display:inline-flex;position:relative;align-items:center;justify-content:center;width:var(--_et-window-control-button-size);height:var(--_et-window-control-button-size);flex-shrink:0;padding:0;border:none;border-radius:var(--_et-window-control-button-border-radius);background:var(--et-theme-color-primary, var(--_et-window-control-button-fallback-background));color:var(--et-theme-color-ink-solid, var(--_et-window-control-button-fallback-color));cursor:var(--et-button-cursor);font-size:var(--_et-window-control-button-icon-size);line-height:1;text-decoration:none;appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;overflow:hidden}.et-window-control-button[data-can-animate]{transition:background .12s ease,color .12s ease,box-shadow .12s ease,outline-color .12s ease,opacity .12s ease}.et-window-control-button:where([data-size=sm]){--_et-window-control-button-size: 2.8rem;--_et-window-control-button-icon-size: 1.4rem}.et-window-control-button:where([data-size=md]){--_et-window-control-button-size: 3.2rem;--_et-window-control-button-icon-size: 1.6rem}.et-window-control-button:where([data-size=lg]){--_et-window-control-button-size: 3.6rem;--_et-window-control-button-icon-size: 1.8rem}.et-window-control-button:hover{--et-theme-color-primary-opacity: .14;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .14)}.et-window-control-button:focus-visible{--et-theme-color-primary-opacity: .18;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .18);outline:none}.et-window-control-button:active{--et-theme-color-primary-opacity: .22;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .22)}.et-window-control-button[data-pressed=true]{--et-theme-color-primary-opacity: .18;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .18)}.et-window-control-button[data-pressed=true]:hover{--et-theme-color-primary-opacity: .24;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .24)}.et-window-control-button[data-pressed=true]:focus-visible{--et-theme-color-primary-opacity: .28;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .28)}.et-window-control-button[data-pressed=true]:active{--et-theme-color-primary-opacity: .32;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .32)}.et-window-control-button:where([data-kind=close]):hover,.et-window-control-button:where([data-kind=close]):focus-visible{background:#e81123eb;color:#fff}.et-window-control-button:where([data-kind=close]):active{background:#c40e1df5;color:#fff}.et-window-control-button:where([disabled]),.et-window-control-button:where([aria-disabled=true]){opacity:var(--et-button-opacity-disabled);cursor:not-allowed;pointer-events:none}.et-window-control-button .et-window-control-button-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%;transition:opacity .12s ease}.et-window-control-button .et-window-control-button-icon:empty{display:none}.et-window-control-button .et-window-control-button-icon .et-icon{width:var(--_et-window-control-button-icon-size);height:var(--_et-window-control-button-icon-size)}.et-window-control-button[data-loading=true] .et-window-control-button-icon{opacity:0}.et-window-control-button[data-loading=true] .et-button-loader{opacity:1}}\n"], dependencies: [{ kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }], encapsulation: i0.ViewEncapsulation.None }); }
986
+ `, isInline: true, styles: ["@layer components{@property --_et-window-control-button-size{syntax: \"<length>\"; inherits: false; initial-value: 32px;}@property --_et-window-control-button-icon-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}.et-window-control-button{--et-theme-color-primary-opacity: 0;--_et-window-control-button-fallback-background: transparent;--_et-window-control-button-fallback-color: rgba(255, 255, 255, .92);--_et-window-control-button-border-radius: 4px;display:inline-flex;position:relative;align-items:center;justify-content:center;width:var(--_et-window-control-button-size);height:var(--_et-window-control-button-size);flex-shrink:0;padding:0;border:none;border-radius:var(--_et-window-control-button-border-radius);background:var(--et-theme-color-primary, var(--_et-window-control-button-fallback-background));color:var(--et-theme-color-ink-solid, var(--_et-window-control-button-fallback-color));cursor:var(--et-button-cursor);font-size:var(--_et-window-control-button-icon-size);line-height:1;text-decoration:none;appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;overflow:hidden}.et-window-control-button[data-can-animate]{transition:background .12s ease,color .12s ease,box-shadow .12s ease,outline-color .12s ease,opacity .12s ease}.et-window-control-button:where([data-size=sm]){--_et-window-control-button-size: 2.8rem;--_et-window-control-button-icon-size: 1.4rem}.et-window-control-button:where([data-size=md]){--_et-window-control-button-size: 3.2rem;--_et-window-control-button-icon-size: 1.6rem}.et-window-control-button:where([data-size=lg]){--_et-window-control-button-size: 3.6rem;--_et-window-control-button-icon-size: 1.8rem}@media(hover:hover){.et-window-control-button:hover{--et-theme-color-primary-opacity: .14;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .14)}}.et-window-control-button:focus-visible{--et-theme-color-primary-opacity: .18;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .18);outline:none}.et-window-control-button:active{--et-theme-color-primary-opacity: .22;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .22)}.et-window-control-button[data-pressed=true]{--et-theme-color-primary-opacity: .18;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .18)}@media(hover:hover){.et-window-control-button[data-pressed=true]:hover{--et-theme-color-primary-opacity: .24;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .24)}}.et-window-control-button[data-pressed=true]:focus-visible{--et-theme-color-primary-opacity: .28;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .28)}.et-window-control-button[data-pressed=true]:active{--et-theme-color-primary-opacity: .32;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .32)}.et-window-control-button:where([data-kind=close]):focus-visible{background:#e81123eb;color:#fff}@media(hover:hover){.et-window-control-button:where([data-kind=close]):hover{background:#e81123eb;color:#fff}}.et-window-control-button:where([data-kind=close]):active{background:#c40e1df5;color:#fff}.et-window-control-button:where([disabled]),.et-window-control-button:where([aria-disabled=true]){opacity:var(--et-button-opacity-disabled);cursor:not-allowed;pointer-events:none}.et-window-control-button .et-window-control-button-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%;transition:opacity .12s ease}.et-window-control-button .et-window-control-button-icon:empty{display:none}.et-window-control-button .et-window-control-button-icon .et-icon{width:var(--_et-window-control-button-icon-size);height:var(--_et-window-control-button-icon-size)}.et-window-control-button[data-loading=true] .et-window-control-button-icon{opacity:0}.et-window-control-button[data-loading=true] .et-button-loader{opacity:1}}\n"], dependencies: [{ kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }], encapsulation: i0.ViewEncapsulation.None }); }
987
987
  }
988
988
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: WindowControlButtonComponent, decorators: [{
989
989
  type: Component,
@@ -1018,7 +1018,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
1018
1018
  '[attr.data-kind]': 'kind()',
1019
1019
  '[attr.data-size]': 'size()',
1020
1020
  '[attr.data-can-animate]': 'canAnimate.state() || null',
1021
- }, styles: ["@layer components{@property --_et-window-control-button-size{syntax: \"<length>\"; inherits: false; initial-value: 32px;}@property --_et-window-control-button-icon-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}.et-window-control-button{--et-theme-color-primary-opacity: 0;--_et-window-control-button-fallback-background: transparent;--_et-window-control-button-fallback-color: rgba(255, 255, 255, .92);--_et-window-control-button-border-radius: 4px;display:inline-flex;position:relative;align-items:center;justify-content:center;width:var(--_et-window-control-button-size);height:var(--_et-window-control-button-size);flex-shrink:0;padding:0;border:none;border-radius:var(--_et-window-control-button-border-radius);background:var(--et-theme-color-primary, var(--_et-window-control-button-fallback-background));color:var(--et-theme-color-ink-solid, var(--_et-window-control-button-fallback-color));cursor:var(--et-button-cursor);font-size:var(--_et-window-control-button-icon-size);line-height:1;text-decoration:none;appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;overflow:hidden}.et-window-control-button[data-can-animate]{transition:background .12s ease,color .12s ease,box-shadow .12s ease,outline-color .12s ease,opacity .12s ease}.et-window-control-button:where([data-size=sm]){--_et-window-control-button-size: 2.8rem;--_et-window-control-button-icon-size: 1.4rem}.et-window-control-button:where([data-size=md]){--_et-window-control-button-size: 3.2rem;--_et-window-control-button-icon-size: 1.6rem}.et-window-control-button:where([data-size=lg]){--_et-window-control-button-size: 3.6rem;--_et-window-control-button-icon-size: 1.8rem}.et-window-control-button:hover{--et-theme-color-primary-opacity: .14;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .14)}.et-window-control-button:focus-visible{--et-theme-color-primary-opacity: .18;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .18);outline:none}.et-window-control-button:active{--et-theme-color-primary-opacity: .22;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .22)}.et-window-control-button[data-pressed=true]{--et-theme-color-primary-opacity: .18;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .18)}.et-window-control-button[data-pressed=true]:hover{--et-theme-color-primary-opacity: .24;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .24)}.et-window-control-button[data-pressed=true]:focus-visible{--et-theme-color-primary-opacity: .28;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .28)}.et-window-control-button[data-pressed=true]:active{--et-theme-color-primary-opacity: .32;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .32)}.et-window-control-button:where([data-kind=close]):hover,.et-window-control-button:where([data-kind=close]):focus-visible{background:#e81123eb;color:#fff}.et-window-control-button:where([data-kind=close]):active{background:#c40e1df5;color:#fff}.et-window-control-button:where([disabled]),.et-window-control-button:where([aria-disabled=true]){opacity:var(--et-button-opacity-disabled);cursor:not-allowed;pointer-events:none}.et-window-control-button .et-window-control-button-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%;transition:opacity .12s ease}.et-window-control-button .et-window-control-button-icon:empty{display:none}.et-window-control-button .et-window-control-button-icon .et-icon{width:var(--_et-window-control-button-icon-size);height:var(--_et-window-control-button-icon-size)}.et-window-control-button[data-loading=true] .et-window-control-button-icon{opacity:0}.et-window-control-button[data-loading=true] .et-button-loader{opacity:1}}\n"] }]
1021
+ }, styles: ["@layer components{@property --_et-window-control-button-size{syntax: \"<length>\"; inherits: false; initial-value: 32px;}@property --_et-window-control-button-icon-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}.et-window-control-button{--et-theme-color-primary-opacity: 0;--_et-window-control-button-fallback-background: transparent;--_et-window-control-button-fallback-color: rgba(255, 255, 255, .92);--_et-window-control-button-border-radius: 4px;display:inline-flex;position:relative;align-items:center;justify-content:center;width:var(--_et-window-control-button-size);height:var(--_et-window-control-button-size);flex-shrink:0;padding:0;border:none;border-radius:var(--_et-window-control-button-border-radius);background:var(--et-theme-color-primary, var(--_et-window-control-button-fallback-background));color:var(--et-theme-color-ink-solid, var(--_et-window-control-button-fallback-color));cursor:var(--et-button-cursor);font-size:var(--_et-window-control-button-icon-size);line-height:1;text-decoration:none;appearance:none;box-sizing:border-box;-webkit-user-select:none;user-select:none;overflow:hidden}.et-window-control-button[data-can-animate]{transition:background .12s ease,color .12s ease,box-shadow .12s ease,outline-color .12s ease,opacity .12s ease}.et-window-control-button:where([data-size=sm]){--_et-window-control-button-size: 2.8rem;--_et-window-control-button-icon-size: 1.4rem}.et-window-control-button:where([data-size=md]){--_et-window-control-button-size: 3.2rem;--_et-window-control-button-icon-size: 1.6rem}.et-window-control-button:where([data-size=lg]){--_et-window-control-button-size: 3.6rem;--_et-window-control-button-icon-size: 1.8rem}@media(hover:hover){.et-window-control-button:hover{--et-theme-color-primary-opacity: .14;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .14)}}.et-window-control-button:focus-visible{--et-theme-color-primary-opacity: .18;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .18);outline:none}.et-window-control-button:active{--et-theme-color-primary-opacity: .22;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .22)}.et-window-control-button[data-pressed=true]{--et-theme-color-primary-opacity: .18;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .18)}@media(hover:hover){.et-window-control-button[data-pressed=true]:hover{--et-theme-color-primary-opacity: .24;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .24)}}.et-window-control-button[data-pressed=true]:focus-visible{--et-theme-color-primary-opacity: .28;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .28)}.et-window-control-button[data-pressed=true]:active{--et-theme-color-primary-opacity: .32;--_et-window-control-button-fallback-background: rgba(255, 255, 255, .32)}.et-window-control-button:where([data-kind=close]):focus-visible{background:#e81123eb;color:#fff}@media(hover:hover){.et-window-control-button:where([data-kind=close]):hover{background:#e81123eb;color:#fff}}.et-window-control-button:where([data-kind=close]):active{background:#c40e1df5;color:#fff}.et-window-control-button:where([disabled]),.et-window-control-button:where([aria-disabled=true]){opacity:var(--et-button-opacity-disabled);cursor:not-allowed;pointer-events:none}.et-window-control-button .et-window-control-button-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%;transition:opacity .12s ease}.et-window-control-button .et-window-control-button-icon:empty{display:none}.et-window-control-button .et-window-control-button-icon .et-icon{width:var(--_et-window-control-button-icon-size);height:var(--_et-window-control-button-icon-size)}.et-window-control-button[data-loading=true] .et-window-control-button-icon{opacity:0}.et-window-control-button[data-loading=true] .et-button-loader{opacity:1}}\n"] }]
1022
1022
  }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], kind: [{ type: i0.Input, args: [{ isSignal: true, alias: "kind", required: false }] }] } });
1023
1023
 
1024
1024
  const BUTTON_IMPORTS = [
@@ -2251,7 +2251,7 @@ class CalendarComponent {
2251
2251
  ...(ngDevMode ? [{ debugName: "nextMonthLabel" }] : /* istanbul ignore next */ []));
2252
2252
  }
2253
2253
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2254
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: CalendarComponent, isStandalone: true, selector: "et-calendar", inputs: { previousMonthLabel: { classPropertyName: "previousMonthLabel", publicName: "previousMonthLabel", isSignal: true, isRequired: false, transformFunction: null }, nextMonthLabel: { classPropertyName: "nextMonthLabel", publicName: "nextMonthLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-calendar" }, providers: [provideIcons(CHEVRON_ICON)], hostDirectives: [{ directive: CalendarDirective, inputs: ["mode", "mode", "min", "min", "max", "max", "dateFilter", "dateFilter", "firstDayOfWeek", "firstDayOfWeek", "locale", "locale", "value", "value", "rangeValue", "rangeValue", "activeMonth", "activeMonth"], outputs: ["valueChange", "valueChange", "rangeValueChange", "rangeValueChange", "activeMonthChange", "activeMonthChange"] }], ngImport: i0, template: "<div class=\"et-calendar-header\">\n <button\n [disabled]=\"!calendar.canGoPrev()\"\n [attr.aria-label]=\"previousMonthLabel()\"\n (click)=\"calendar.previousMonth()\"\n class=\"et-calendar-nav-button et-calendar-nav-button--previous\"\n et-icon-button\n size=\"sm\"\n type=\"button\"\n >\n <i etIcon=\"et-chevron\"></i>\n </button>\n\n <span class=\"et-calendar-header-label\" aria-live=\"polite\">{{ calendar.visibleMonthLabel() }}</span>\n\n <button\n [disabled]=\"!calendar.canGoNext()\"\n [attr.aria-label]=\"nextMonthLabel()\"\n (click)=\"calendar.nextMonth()\"\n class=\"et-calendar-nav-button et-calendar-nav-button--next\"\n et-icon-button\n size=\"sm\"\n type=\"button\"\n >\n <i etIcon=\"et-chevron\"></i>\n </button>\n</div>\n\n<div class=\"et-calendar-grid\" etCalendarGrid>\n <div class=\"et-calendar-weekdays\" role=\"row\">\n @for (weekday of calendar.weekdays(); track weekday.long) {\n <span [attr.aria-label]=\"weekday.long\" class=\"et-calendar-weekday\" role=\"columnheader\">{{ weekday.short }}</span>\n }\n </div>\n\n <!-- keyed per month so navigation re-creates the rows and runs the slide-in -->\n @for (monthKey of [calendar.visibleMonthKey()]; track monthKey) {\n <div [attr.data-nav]=\"calendar.navigationDirection()\" class=\"et-calendar-weeks\" role=\"rowgroup\">\n @for (week of calendar.weeks(); track $index) {\n <div class=\"et-calendar-week\" role=\"row\">\n @for (cell of week; track cell.date.getTime()) {\n <button [cell]=\"cell\" class=\"et-calendar-cell\" etCalendarCell type=\"button\">\n <span class=\"et-calendar-cell-content\">{{ cell.dayOfMonth }}</span>\n </button>\n }\n </div>\n }\n </div>\n }\n</div>\n", styles: ["@layer components{@property --et-calendar-cell-size{syntax: \"<length>\"; inherits: true; initial-value: 40px;}.et-calendar{display:inline-flex;flex-direction:column;gap:4px;-webkit-user-select:none;user-select:none}.et-calendar .et-calendar-header{display:flex;align-items:center;gap:4px}.et-calendar .et-calendar-header-label{flex:1;text-align:center;font-size:14px;font-weight:600;color:var(--et-surface-color-solid)}.et-calendar .et-calendar-nav-button--previous .et-icon{rotate:-90deg}.et-calendar .et-calendar-nav-button--next .et-icon{rotate:90deg}.et-calendar .et-calendar-weekdays,.et-calendar .et-calendar-week{display:grid;grid-template-columns:repeat(7,var(--et-calendar-cell-size))}.et-calendar .et-calendar-weeks:where([data-nav=forward]){animation:et-calendar-weeks-in-forward .2s ease}.et-calendar .et-calendar-weeks:where([data-nav=backward]){animation:et-calendar-weeks-in-backward .2s ease}.et-calendar .et-calendar-weekday{display:inline-flex;align-items:center;justify-content:center;block-size:32px;font-size:12px;color:var(--et-surface-color-muted-solid)}.et-calendar .et-calendar-cell{position:relative;display:inline-flex;align-items:center;justify-content:center;block-size:var(--et-calendar-cell-size);padding:0;border:none;background:transparent;font:inherit;font-size:13px;color:var(--et-surface-color-solid);cursor:pointer;touch-action:manipulation}.et-calendar .et-calendar-cell:before{content:\"\";position:absolute;inset-block:4px;inset-inline:0;display:none;background:color-mix(in srgb,var(--et-theme-color-primary-solid) 12%,transparent)}.et-calendar .et-calendar-cell:where([data-band]):before{display:block}.et-calendar .et-calendar-cell:where([data-band=start]):before{inset-inline-start:50%}.et-calendar .et-calendar-cell:where([data-band=end]):before{inset-inline-end:50%}.et-calendar .et-calendar-cell .et-calendar-cell-content{position:relative;display:inline-flex;align-items:center;justify-content:center;inline-size:calc(var(--et-calendar-cell-size) - 6px);block-size:calc(var(--et-calendar-cell-size) - 6px);border-radius:999px;transition:background-color .15s ease,color .15s ease}.et-calendar .et-calendar-cell:where(:not([data-disabled])):hover .et-calendar-cell-content{background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent)}.et-calendar .et-calendar-cell:focus-visible{outline:none}.et-calendar .et-calendar-cell:focus-visible .et-calendar-cell-content{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:1px}.et-calendar .et-calendar-cell:where([data-outside-month]){color:var(--et-surface-color-subtle-solid)}.et-calendar .et-calendar-cell:where([data-today]) .et-calendar-cell-content{box-shadow:inset 0 0 0 1px var(--et-theme-color-ink-solid)}.et-calendar .et-calendar-cell:where([data-band=start],[data-band=end]):where(:not([data-selected])){color:var(--et-theme-color-on-primary)}.et-calendar .et-calendar-cell:where([data-band=start],[data-band=end]):where(:not([data-selected])) .et-calendar-cell-content{background:var(--et-theme-color-primary-solid);font-weight:600}.et-calendar .et-calendar-cell:where([data-band=start],[data-band=end]):where(:not([data-selected])):hover .et-calendar-cell-content{background:var(--et-theme-color-primary-solid)}.et-calendar .et-calendar-cell:where([data-selected]){color:var(--et-theme-color-on-primary)}.et-calendar .et-calendar-cell:where([data-selected]) .et-calendar-cell-content{background:var(--et-theme-color-primary-solid);font-weight:600}.et-calendar .et-calendar-cell:where([data-selected]):hover .et-calendar-cell-content{background:var(--et-theme-color-primary-solid)}.et-calendar .et-calendar-cell:where([data-disabled]){color:var(--et-surface-color-subtle-solid);cursor:default}.et-calendar .et-calendar-cell:where([data-disabled]) .et-calendar-cell-content{background:transparent;text-decoration:line-through}@keyframes et-calendar-weeks-in-forward{0%{opacity:0;transform:translate(14px)}}@keyframes et-calendar-weeks-in-backward{0%{opacity:0;transform:translate(-14px)}}@media(prefers-reduced-motion:reduce){.et-calendar .et-calendar-weeks{animation:none}}}\n"], dependencies: [{ kind: "directive", type: CalendarCellDirective, selector: "[etCalendarCell]", inputs: ["cell"], exportAs: ["etCalendarCell"] }, { kind: "directive", type: CalendarGridDirective, selector: "[etCalendarGrid]", exportAs: ["etCalendarGrid"] }, { kind: "component", type: IconButtonComponent, selector: "[et-icon-button]", inputs: ["variant", "size"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
2254
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: CalendarComponent, isStandalone: true, selector: "et-calendar", inputs: { previousMonthLabel: { classPropertyName: "previousMonthLabel", publicName: "previousMonthLabel", isSignal: true, isRequired: false, transformFunction: null }, nextMonthLabel: { classPropertyName: "nextMonthLabel", publicName: "nextMonthLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-calendar" }, providers: [provideIcons(CHEVRON_ICON)], hostDirectives: [{ directive: CalendarDirective, inputs: ["mode", "mode", "min", "min", "max", "max", "dateFilter", "dateFilter", "firstDayOfWeek", "firstDayOfWeek", "locale", "locale", "value", "value", "rangeValue", "rangeValue", "activeMonth", "activeMonth"], outputs: ["valueChange", "valueChange", "rangeValueChange", "rangeValueChange", "activeMonthChange", "activeMonthChange"] }], ngImport: i0, template: "<div class=\"et-calendar-header\">\n <button\n [disabled]=\"!calendar.canGoPrev()\"\n [attr.aria-label]=\"previousMonthLabel()\"\n (click)=\"calendar.previousMonth()\"\n class=\"et-calendar-nav-button et-calendar-nav-button--previous\"\n et-icon-button\n size=\"sm\"\n type=\"button\"\n >\n <i etIcon=\"et-chevron\"></i>\n </button>\n\n <span class=\"et-calendar-header-label\" aria-live=\"polite\">{{ calendar.visibleMonthLabel() }}</span>\n\n <button\n [disabled]=\"!calendar.canGoNext()\"\n [attr.aria-label]=\"nextMonthLabel()\"\n (click)=\"calendar.nextMonth()\"\n class=\"et-calendar-nav-button et-calendar-nav-button--next\"\n et-icon-button\n size=\"sm\"\n type=\"button\"\n >\n <i etIcon=\"et-chevron\"></i>\n </button>\n</div>\n\n<div class=\"et-calendar-grid\" etCalendarGrid>\n <div class=\"et-calendar-weekdays\" role=\"row\">\n @for (weekday of calendar.weekdays(); track weekday.long) {\n <span [attr.aria-label]=\"weekday.long\" class=\"et-calendar-weekday\" role=\"columnheader\">{{ weekday.short }}</span>\n }\n </div>\n\n <!-- keyed per month so navigation re-creates the rows and runs the slide-in -->\n @for (monthKey of [calendar.visibleMonthKey()]; track monthKey) {\n <div [attr.data-nav]=\"calendar.navigationDirection()\" class=\"et-calendar-weeks\" role=\"rowgroup\">\n @for (week of calendar.weeks(); track $index) {\n <div class=\"et-calendar-week\" role=\"row\">\n @for (cell of week; track cell.date.getTime()) {\n <button [cell]=\"cell\" class=\"et-calendar-cell\" etCalendarCell type=\"button\">\n <span class=\"et-calendar-cell-content\">{{ cell.dayOfMonth }}</span>\n </button>\n }\n </div>\n }\n </div>\n }\n</div>\n", styles: ["@layer components{@property --et-calendar-cell-size{syntax: \"<length>\"; inherits: true; initial-value: 40px;}.et-calendar{display:inline-flex;flex-direction:column;gap:4px;-webkit-user-select:none;user-select:none}.et-calendar .et-calendar-header{display:flex;align-items:center;gap:4px}.et-calendar .et-calendar-header-label{flex:1;text-align:center;font-size:14px;font-weight:600;color:var(--et-surface-color-solid)}.et-calendar .et-calendar-nav-button--previous .et-icon{rotate:-90deg}.et-calendar .et-calendar-nav-button--next .et-icon{rotate:90deg}.et-calendar .et-calendar-weekdays,.et-calendar .et-calendar-week{display:grid;grid-template-columns:repeat(7,var(--et-calendar-cell-size))}.et-calendar .et-calendar-weeks:where([data-nav=forward]){animation:et-calendar-weeks-in-forward .2s ease}.et-calendar .et-calendar-weeks:where([data-nav=backward]){animation:et-calendar-weeks-in-backward .2s ease}.et-calendar .et-calendar-weekday{display:inline-flex;align-items:center;justify-content:center;block-size:32px;font-size:12px;color:var(--et-surface-color-muted-solid)}.et-calendar .et-calendar-cell{position:relative;display:inline-flex;align-items:center;justify-content:center;block-size:var(--et-calendar-cell-size);padding:0;border:none;background:transparent;font:inherit;font-size:13px;color:var(--et-surface-color-solid);cursor:pointer;touch-action:manipulation}.et-calendar .et-calendar-cell:before{content:\"\";position:absolute;inset-block:4px;inset-inline:0;display:none;background:color-mix(in srgb,var(--et-theme-color-primary-solid) 12%,transparent)}.et-calendar .et-calendar-cell:where([data-band]):before{display:block}.et-calendar .et-calendar-cell:where([data-band=start]):before{inset-inline-start:50%}.et-calendar .et-calendar-cell:where([data-band=end]):before{inset-inline-end:50%}.et-calendar .et-calendar-cell .et-calendar-cell-content{position:relative;display:inline-flex;align-items:center;justify-content:center;inline-size:calc(var(--et-calendar-cell-size) - 6px);block-size:calc(var(--et-calendar-cell-size) - 6px);border-radius:999px;transition:background-color .15s ease,color .15s ease}@media(hover:hover){.et-calendar .et-calendar-cell:where(:not([data-disabled])):hover .et-calendar-cell-content{background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent)}}.et-calendar .et-calendar-cell:focus-visible{outline:none}.et-calendar .et-calendar-cell:focus-visible .et-calendar-cell-content{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:1px}.et-calendar .et-calendar-cell:where([data-outside-month]){color:var(--et-surface-color-subtle-solid)}.et-calendar .et-calendar-cell:where([data-today]) .et-calendar-cell-content{box-shadow:inset 0 0 0 1px var(--et-theme-color-ink-solid)}.et-calendar .et-calendar-cell:where([data-band=start],[data-band=end]):where(:not([data-selected])){color:var(--et-theme-color-on-primary)}.et-calendar .et-calendar-cell:where([data-band=start],[data-band=end]):where(:not([data-selected])) .et-calendar-cell-content{background:var(--et-theme-color-primary-solid);font-weight:600}@media(hover:hover){.et-calendar .et-calendar-cell:where([data-band=start],[data-band=end]):where(:not([data-selected])):hover .et-calendar-cell-content{background:var(--et-theme-color-primary-solid)}}.et-calendar .et-calendar-cell:where([data-selected]){color:var(--et-theme-color-on-primary)}.et-calendar .et-calendar-cell:where([data-selected]) .et-calendar-cell-content{background:var(--et-theme-color-primary-solid);font-weight:600}@media(hover:hover){.et-calendar .et-calendar-cell:where([data-selected]):hover .et-calendar-cell-content{background:var(--et-theme-color-primary-solid)}}.et-calendar .et-calendar-cell:where([data-disabled]){color:var(--et-surface-color-subtle-solid);cursor:default}.et-calendar .et-calendar-cell:where([data-disabled]) .et-calendar-cell-content{background:transparent;text-decoration:line-through}@keyframes et-calendar-weeks-in-forward{0%{opacity:0;transform:translate(14px)}}@keyframes et-calendar-weeks-in-backward{0%{opacity:0;transform:translate(-14px)}}@media(prefers-reduced-motion:reduce){.et-calendar .et-calendar-weeks{animation:none}}}\n"], dependencies: [{ kind: "directive", type: CalendarCellDirective, selector: "[etCalendarCell]", inputs: ["cell"], exportAs: ["etCalendarCell"] }, { kind: "directive", type: CalendarGridDirective, selector: "[etCalendarGrid]", exportAs: ["etCalendarGrid"] }, { kind: "component", type: IconButtonComponent, selector: "[et-icon-button]", inputs: ["variant", "size"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
2255
2255
  }
2256
2256
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CalendarComponent, decorators: [{
2257
2257
  type: Component,
@@ -2263,7 +2263,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
2263
2263
  },
2264
2264
  ], host: {
2265
2265
  class: 'et-calendar',
2266
- }, template: "<div class=\"et-calendar-header\">\n <button\n [disabled]=\"!calendar.canGoPrev()\"\n [attr.aria-label]=\"previousMonthLabel()\"\n (click)=\"calendar.previousMonth()\"\n class=\"et-calendar-nav-button et-calendar-nav-button--previous\"\n et-icon-button\n size=\"sm\"\n type=\"button\"\n >\n <i etIcon=\"et-chevron\"></i>\n </button>\n\n <span class=\"et-calendar-header-label\" aria-live=\"polite\">{{ calendar.visibleMonthLabel() }}</span>\n\n <button\n [disabled]=\"!calendar.canGoNext()\"\n [attr.aria-label]=\"nextMonthLabel()\"\n (click)=\"calendar.nextMonth()\"\n class=\"et-calendar-nav-button et-calendar-nav-button--next\"\n et-icon-button\n size=\"sm\"\n type=\"button\"\n >\n <i etIcon=\"et-chevron\"></i>\n </button>\n</div>\n\n<div class=\"et-calendar-grid\" etCalendarGrid>\n <div class=\"et-calendar-weekdays\" role=\"row\">\n @for (weekday of calendar.weekdays(); track weekday.long) {\n <span [attr.aria-label]=\"weekday.long\" class=\"et-calendar-weekday\" role=\"columnheader\">{{ weekday.short }}</span>\n }\n </div>\n\n <!-- keyed per month so navigation re-creates the rows and runs the slide-in -->\n @for (monthKey of [calendar.visibleMonthKey()]; track monthKey) {\n <div [attr.data-nav]=\"calendar.navigationDirection()\" class=\"et-calendar-weeks\" role=\"rowgroup\">\n @for (week of calendar.weeks(); track $index) {\n <div class=\"et-calendar-week\" role=\"row\">\n @for (cell of week; track cell.date.getTime()) {\n <button [cell]=\"cell\" class=\"et-calendar-cell\" etCalendarCell type=\"button\">\n <span class=\"et-calendar-cell-content\">{{ cell.dayOfMonth }}</span>\n </button>\n }\n </div>\n }\n </div>\n }\n</div>\n", styles: ["@layer components{@property --et-calendar-cell-size{syntax: \"<length>\"; inherits: true; initial-value: 40px;}.et-calendar{display:inline-flex;flex-direction:column;gap:4px;-webkit-user-select:none;user-select:none}.et-calendar .et-calendar-header{display:flex;align-items:center;gap:4px}.et-calendar .et-calendar-header-label{flex:1;text-align:center;font-size:14px;font-weight:600;color:var(--et-surface-color-solid)}.et-calendar .et-calendar-nav-button--previous .et-icon{rotate:-90deg}.et-calendar .et-calendar-nav-button--next .et-icon{rotate:90deg}.et-calendar .et-calendar-weekdays,.et-calendar .et-calendar-week{display:grid;grid-template-columns:repeat(7,var(--et-calendar-cell-size))}.et-calendar .et-calendar-weeks:where([data-nav=forward]){animation:et-calendar-weeks-in-forward .2s ease}.et-calendar .et-calendar-weeks:where([data-nav=backward]){animation:et-calendar-weeks-in-backward .2s ease}.et-calendar .et-calendar-weekday{display:inline-flex;align-items:center;justify-content:center;block-size:32px;font-size:12px;color:var(--et-surface-color-muted-solid)}.et-calendar .et-calendar-cell{position:relative;display:inline-flex;align-items:center;justify-content:center;block-size:var(--et-calendar-cell-size);padding:0;border:none;background:transparent;font:inherit;font-size:13px;color:var(--et-surface-color-solid);cursor:pointer;touch-action:manipulation}.et-calendar .et-calendar-cell:before{content:\"\";position:absolute;inset-block:4px;inset-inline:0;display:none;background:color-mix(in srgb,var(--et-theme-color-primary-solid) 12%,transparent)}.et-calendar .et-calendar-cell:where([data-band]):before{display:block}.et-calendar .et-calendar-cell:where([data-band=start]):before{inset-inline-start:50%}.et-calendar .et-calendar-cell:where([data-band=end]):before{inset-inline-end:50%}.et-calendar .et-calendar-cell .et-calendar-cell-content{position:relative;display:inline-flex;align-items:center;justify-content:center;inline-size:calc(var(--et-calendar-cell-size) - 6px);block-size:calc(var(--et-calendar-cell-size) - 6px);border-radius:999px;transition:background-color .15s ease,color .15s ease}.et-calendar .et-calendar-cell:where(:not([data-disabled])):hover .et-calendar-cell-content{background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent)}.et-calendar .et-calendar-cell:focus-visible{outline:none}.et-calendar .et-calendar-cell:focus-visible .et-calendar-cell-content{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:1px}.et-calendar .et-calendar-cell:where([data-outside-month]){color:var(--et-surface-color-subtle-solid)}.et-calendar .et-calendar-cell:where([data-today]) .et-calendar-cell-content{box-shadow:inset 0 0 0 1px var(--et-theme-color-ink-solid)}.et-calendar .et-calendar-cell:where([data-band=start],[data-band=end]):where(:not([data-selected])){color:var(--et-theme-color-on-primary)}.et-calendar .et-calendar-cell:where([data-band=start],[data-band=end]):where(:not([data-selected])) .et-calendar-cell-content{background:var(--et-theme-color-primary-solid);font-weight:600}.et-calendar .et-calendar-cell:where([data-band=start],[data-band=end]):where(:not([data-selected])):hover .et-calendar-cell-content{background:var(--et-theme-color-primary-solid)}.et-calendar .et-calendar-cell:where([data-selected]){color:var(--et-theme-color-on-primary)}.et-calendar .et-calendar-cell:where([data-selected]) .et-calendar-cell-content{background:var(--et-theme-color-primary-solid);font-weight:600}.et-calendar .et-calendar-cell:where([data-selected]):hover .et-calendar-cell-content{background:var(--et-theme-color-primary-solid)}.et-calendar .et-calendar-cell:where([data-disabled]){color:var(--et-surface-color-subtle-solid);cursor:default}.et-calendar .et-calendar-cell:where([data-disabled]) .et-calendar-cell-content{background:transparent;text-decoration:line-through}@keyframes et-calendar-weeks-in-forward{0%{opacity:0;transform:translate(14px)}}@keyframes et-calendar-weeks-in-backward{0%{opacity:0;transform:translate(-14px)}}@media(prefers-reduced-motion:reduce){.et-calendar .et-calendar-weeks{animation:none}}}\n"] }]
2266
+ }, template: "<div class=\"et-calendar-header\">\n <button\n [disabled]=\"!calendar.canGoPrev()\"\n [attr.aria-label]=\"previousMonthLabel()\"\n (click)=\"calendar.previousMonth()\"\n class=\"et-calendar-nav-button et-calendar-nav-button--previous\"\n et-icon-button\n size=\"sm\"\n type=\"button\"\n >\n <i etIcon=\"et-chevron\"></i>\n </button>\n\n <span class=\"et-calendar-header-label\" aria-live=\"polite\">{{ calendar.visibleMonthLabel() }}</span>\n\n <button\n [disabled]=\"!calendar.canGoNext()\"\n [attr.aria-label]=\"nextMonthLabel()\"\n (click)=\"calendar.nextMonth()\"\n class=\"et-calendar-nav-button et-calendar-nav-button--next\"\n et-icon-button\n size=\"sm\"\n type=\"button\"\n >\n <i etIcon=\"et-chevron\"></i>\n </button>\n</div>\n\n<div class=\"et-calendar-grid\" etCalendarGrid>\n <div class=\"et-calendar-weekdays\" role=\"row\">\n @for (weekday of calendar.weekdays(); track weekday.long) {\n <span [attr.aria-label]=\"weekday.long\" class=\"et-calendar-weekday\" role=\"columnheader\">{{ weekday.short }}</span>\n }\n </div>\n\n <!-- keyed per month so navigation re-creates the rows and runs the slide-in -->\n @for (monthKey of [calendar.visibleMonthKey()]; track monthKey) {\n <div [attr.data-nav]=\"calendar.navigationDirection()\" class=\"et-calendar-weeks\" role=\"rowgroup\">\n @for (week of calendar.weeks(); track $index) {\n <div class=\"et-calendar-week\" role=\"row\">\n @for (cell of week; track cell.date.getTime()) {\n <button [cell]=\"cell\" class=\"et-calendar-cell\" etCalendarCell type=\"button\">\n <span class=\"et-calendar-cell-content\">{{ cell.dayOfMonth }}</span>\n </button>\n }\n </div>\n }\n </div>\n }\n</div>\n", styles: ["@layer components{@property --et-calendar-cell-size{syntax: \"<length>\"; inherits: true; initial-value: 40px;}.et-calendar{display:inline-flex;flex-direction:column;gap:4px;-webkit-user-select:none;user-select:none}.et-calendar .et-calendar-header{display:flex;align-items:center;gap:4px}.et-calendar .et-calendar-header-label{flex:1;text-align:center;font-size:14px;font-weight:600;color:var(--et-surface-color-solid)}.et-calendar .et-calendar-nav-button--previous .et-icon{rotate:-90deg}.et-calendar .et-calendar-nav-button--next .et-icon{rotate:90deg}.et-calendar .et-calendar-weekdays,.et-calendar .et-calendar-week{display:grid;grid-template-columns:repeat(7,var(--et-calendar-cell-size))}.et-calendar .et-calendar-weeks:where([data-nav=forward]){animation:et-calendar-weeks-in-forward .2s ease}.et-calendar .et-calendar-weeks:where([data-nav=backward]){animation:et-calendar-weeks-in-backward .2s ease}.et-calendar .et-calendar-weekday{display:inline-flex;align-items:center;justify-content:center;block-size:32px;font-size:12px;color:var(--et-surface-color-muted-solid)}.et-calendar .et-calendar-cell{position:relative;display:inline-flex;align-items:center;justify-content:center;block-size:var(--et-calendar-cell-size);padding:0;border:none;background:transparent;font:inherit;font-size:13px;color:var(--et-surface-color-solid);cursor:pointer;touch-action:manipulation}.et-calendar .et-calendar-cell:before{content:\"\";position:absolute;inset-block:4px;inset-inline:0;display:none;background:color-mix(in srgb,var(--et-theme-color-primary-solid) 12%,transparent)}.et-calendar .et-calendar-cell:where([data-band]):before{display:block}.et-calendar .et-calendar-cell:where([data-band=start]):before{inset-inline-start:50%}.et-calendar .et-calendar-cell:where([data-band=end]):before{inset-inline-end:50%}.et-calendar .et-calendar-cell .et-calendar-cell-content{position:relative;display:inline-flex;align-items:center;justify-content:center;inline-size:calc(var(--et-calendar-cell-size) - 6px);block-size:calc(var(--et-calendar-cell-size) - 6px);border-radius:999px;transition:background-color .15s ease,color .15s ease}@media(hover:hover){.et-calendar .et-calendar-cell:where(:not([data-disabled])):hover .et-calendar-cell-content{background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent)}}.et-calendar .et-calendar-cell:focus-visible{outline:none}.et-calendar .et-calendar-cell:focus-visible .et-calendar-cell-content{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:1px}.et-calendar .et-calendar-cell:where([data-outside-month]){color:var(--et-surface-color-subtle-solid)}.et-calendar .et-calendar-cell:where([data-today]) .et-calendar-cell-content{box-shadow:inset 0 0 0 1px var(--et-theme-color-ink-solid)}.et-calendar .et-calendar-cell:where([data-band=start],[data-band=end]):where(:not([data-selected])){color:var(--et-theme-color-on-primary)}.et-calendar .et-calendar-cell:where([data-band=start],[data-band=end]):where(:not([data-selected])) .et-calendar-cell-content{background:var(--et-theme-color-primary-solid);font-weight:600}@media(hover:hover){.et-calendar .et-calendar-cell:where([data-band=start],[data-band=end]):where(:not([data-selected])):hover .et-calendar-cell-content{background:var(--et-theme-color-primary-solid)}}.et-calendar .et-calendar-cell:where([data-selected]){color:var(--et-theme-color-on-primary)}.et-calendar .et-calendar-cell:where([data-selected]) .et-calendar-cell-content{background:var(--et-theme-color-primary-solid);font-weight:600}@media(hover:hover){.et-calendar .et-calendar-cell:where([data-selected]):hover .et-calendar-cell-content{background:var(--et-theme-color-primary-solid)}}.et-calendar .et-calendar-cell:where([data-disabled]){color:var(--et-surface-color-subtle-solid);cursor:default}.et-calendar .et-calendar-cell:where([data-disabled]) .et-calendar-cell-content{background:transparent;text-decoration:line-through}@keyframes et-calendar-weeks-in-forward{0%{opacity:0;transform:translate(14px)}}@keyframes et-calendar-weeks-in-backward{0%{opacity:0;transform:translate(-14px)}}@media(prefers-reduced-motion:reduce){.et-calendar .et-calendar-weeks{animation:none}}}\n"] }]
2267
2267
  }], propDecorators: { previousMonthLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "previousMonthLabel", required: false }] }], nextMonthLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "nextMonthLabel", required: false }] }] } });
2268
2268
 
2269
2269
  const CALENDAR_IMPORTS = [
@@ -2361,7 +2361,7 @@ class ChipComponent {
2361
2361
  this.chip = inject(ChipDirective);
2362
2362
  }
2363
2363
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ChipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2364
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: ChipComponent, isStandalone: true, selector: "et-chip", host: { classAttribute: "et-chip" }, providers: [provideIcons(TIMES_ICON)], hostDirectives: [{ directive: ChipDirective, inputs: ["disabled", "disabled", "removable", "removable"], outputs: ["remove", "remove"] }], ngImport: i0, template: "<span class=\"et-chip-label\">\n <ng-content />\n</span>\n\n@if (chip.removable()) {\n <button class=\"et-chip-remove-button\" etChipRemove>\n <i etIcon=\"et-times\"></i>\n </button>\n}\n", styles: ["@layer components{@property --et-chip-gap{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-chip-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-chip-min-block-size{syntax: \"<length>\"; inherits: true; initial-value: 24px;}@property --et-chip-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 999px;}@property --et-chip-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-chip-remove-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}@property --et-chip-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .4;}.et-chip{display:inline-flex;align-items:center;gap:var(--et-chip-gap);padding-inline:var(--et-chip-padding-inline);min-block-size:var(--et-chip-min-block-size);border-radius:var(--et-chip-border-radius);font-size:var(--et-chip-font-size);line-height:1.4;max-inline-size:100%;box-sizing:border-box;background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 14%,transparent);color:var(--et-surface-color-solid, currentColor);-webkit-user-select:none;user-select:none}.et-chip:where([data-disabled]){opacity:var(--et-chip-opacity-disabled);pointer-events:none}.et-chip:where([role=checkbox],[role=radio]){cursor:pointer;transition:background .12s ease,color .12s ease}.et-chip:where([role=checkbox],[role=radio]):hover:not([aria-checked=true]):not([data-readonly]){background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 22%,transparent)}.et-chip:where([role=checkbox],[role=radio]):focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:1px}.et-chip:where([role=checkbox],[role=radio]):where([data-readonly]){cursor:default}.et-chip:where([aria-checked=true]){background:color-mix(in srgb,var(--et-theme-color-primary-solid, currentColor) 16%,transparent);color:var(--et-theme-color-ink-solid, currentColor)}.et-chip:where([aria-checked=true]):hover:not([data-readonly]){background:color-mix(in srgb,var(--et-theme-color-primary-solid, currentColor) 24%,transparent)}.et-chip:where([data-removable]){padding-inline-end:calc(var(--et-chip-padding-inline) / 2)}.et-chip .et-chip-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-inline-size:0}.et-chip .et-chip-remove-button{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-chip-remove-size);block-size:var(--et-chip-remove-size);border-radius:50%;border:none;padding:0;margin:0;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;appearance:none}.et-chip .et-chip-remove-button:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 20%,transparent);color:var(--et-surface-color-solid, currentColor)}.et-chip .et-chip-remove-button:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 28%,transparent)}.et-chip .et-chip-remove-button .et-icon{inline-size:calc(var(--et-chip-remove-size) - 6px);block-size:calc(var(--et-chip-remove-size) - 6px)}}\n"], dependencies: [{ kind: "directive", type: ChipRemoveDirective, selector: "[etChipRemove]", inputs: ["removeLabel"], exportAs: ["etChipRemove"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
2364
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: ChipComponent, isStandalone: true, selector: "et-chip", host: { classAttribute: "et-chip" }, providers: [provideIcons(TIMES_ICON)], hostDirectives: [{ directive: ChipDirective, inputs: ["disabled", "disabled", "removable", "removable"], outputs: ["remove", "remove"] }], ngImport: i0, template: "<span class=\"et-chip-label\">\n <ng-content />\n</span>\n\n@if (chip.removable()) {\n <button class=\"et-chip-remove-button\" etChipRemove>\n <i etIcon=\"et-times\"></i>\n </button>\n}\n", styles: ["@layer components{@property --et-chip-gap{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-chip-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-chip-min-block-size{syntax: \"<length>\"; inherits: true; initial-value: 24px;}@property --et-chip-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 999px;}@property --et-chip-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-chip-remove-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}@property --et-chip-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .4;}.et-chip{display:inline-flex;align-items:center;gap:var(--et-chip-gap);padding-inline:var(--et-chip-padding-inline);min-block-size:var(--et-chip-min-block-size);border-radius:var(--et-chip-border-radius);font-size:var(--et-chip-font-size);line-height:1.4;max-inline-size:100%;box-sizing:border-box;background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 14%,transparent);color:var(--et-surface-color-solid, currentColor);-webkit-user-select:none;user-select:none}.et-chip:where([data-disabled]){opacity:var(--et-chip-opacity-disabled);pointer-events:none}.et-chip:where([role=checkbox],[role=radio]){cursor:pointer;transition:background .12s ease,color .12s ease}@media(hover:hover){.et-chip:where([role=checkbox],[role=radio]):hover:not([aria-checked=true]):not([data-readonly]){background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 22%,transparent)}}.et-chip:where([role=checkbox],[role=radio]):focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:1px}.et-chip:where([role=checkbox],[role=radio]):where([data-readonly]){cursor:default}.et-chip:where([aria-checked=true]){background:color-mix(in srgb,var(--et-theme-color-primary-solid, currentColor) 16%,transparent);color:var(--et-theme-color-ink-solid, currentColor)}@media(hover:hover){.et-chip:where([aria-checked=true]):hover:not([data-readonly]){background:color-mix(in srgb,var(--et-theme-color-primary-solid, currentColor) 24%,transparent)}}.et-chip:where([data-removable]){padding-inline-end:calc(var(--et-chip-padding-inline) / 2)}.et-chip .et-chip-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-inline-size:0}.et-chip .et-chip-remove-button{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-chip-remove-size);block-size:var(--et-chip-remove-size);border-radius:50%;border:none;padding:0;margin:0;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;appearance:none}@media(hover:hover){.et-chip .et-chip-remove-button:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 20%,transparent);color:var(--et-surface-color-solid, currentColor)}}.et-chip .et-chip-remove-button:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 28%,transparent)}.et-chip .et-chip-remove-button .et-icon{inline-size:calc(var(--et-chip-remove-size) - 6px);block-size:calc(var(--et-chip-remove-size) - 6px)}}\n"], dependencies: [{ kind: "directive", type: ChipRemoveDirective, selector: "[etChipRemove]", inputs: ["removeLabel"], exportAs: ["etChipRemove"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
2365
2365
  }
2366
2366
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ChipComponent, decorators: [{
2367
2367
  type: Component,
@@ -2373,7 +2373,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
2373
2373
  },
2374
2374
  ], host: {
2375
2375
  class: 'et-chip',
2376
- }, template: "<span class=\"et-chip-label\">\n <ng-content />\n</span>\n\n@if (chip.removable()) {\n <button class=\"et-chip-remove-button\" etChipRemove>\n <i etIcon=\"et-times\"></i>\n </button>\n}\n", styles: ["@layer components{@property --et-chip-gap{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-chip-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-chip-min-block-size{syntax: \"<length>\"; inherits: true; initial-value: 24px;}@property --et-chip-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 999px;}@property --et-chip-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-chip-remove-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}@property --et-chip-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .4;}.et-chip{display:inline-flex;align-items:center;gap:var(--et-chip-gap);padding-inline:var(--et-chip-padding-inline);min-block-size:var(--et-chip-min-block-size);border-radius:var(--et-chip-border-radius);font-size:var(--et-chip-font-size);line-height:1.4;max-inline-size:100%;box-sizing:border-box;background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 14%,transparent);color:var(--et-surface-color-solid, currentColor);-webkit-user-select:none;user-select:none}.et-chip:where([data-disabled]){opacity:var(--et-chip-opacity-disabled);pointer-events:none}.et-chip:where([role=checkbox],[role=radio]){cursor:pointer;transition:background .12s ease,color .12s ease}.et-chip:where([role=checkbox],[role=radio]):hover:not([aria-checked=true]):not([data-readonly]){background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 22%,transparent)}.et-chip:where([role=checkbox],[role=radio]):focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:1px}.et-chip:where([role=checkbox],[role=radio]):where([data-readonly]){cursor:default}.et-chip:where([aria-checked=true]){background:color-mix(in srgb,var(--et-theme-color-primary-solid, currentColor) 16%,transparent);color:var(--et-theme-color-ink-solid, currentColor)}.et-chip:where([aria-checked=true]):hover:not([data-readonly]){background:color-mix(in srgb,var(--et-theme-color-primary-solid, currentColor) 24%,transparent)}.et-chip:where([data-removable]){padding-inline-end:calc(var(--et-chip-padding-inline) / 2)}.et-chip .et-chip-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-inline-size:0}.et-chip .et-chip-remove-button{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-chip-remove-size);block-size:var(--et-chip-remove-size);border-radius:50%;border:none;padding:0;margin:0;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;appearance:none}.et-chip .et-chip-remove-button:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 20%,transparent);color:var(--et-surface-color-solid, currentColor)}.et-chip .et-chip-remove-button:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 28%,transparent)}.et-chip .et-chip-remove-button .et-icon{inline-size:calc(var(--et-chip-remove-size) - 6px);block-size:calc(var(--et-chip-remove-size) - 6px)}}\n"] }]
2376
+ }, template: "<span class=\"et-chip-label\">\n <ng-content />\n</span>\n\n@if (chip.removable()) {\n <button class=\"et-chip-remove-button\" etChipRemove>\n <i etIcon=\"et-times\"></i>\n </button>\n}\n", styles: ["@layer components{@property --et-chip-gap{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-chip-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-chip-min-block-size{syntax: \"<length>\"; inherits: true; initial-value: 24px;}@property --et-chip-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 999px;}@property --et-chip-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-chip-remove-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}@property --et-chip-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .4;}.et-chip{display:inline-flex;align-items:center;gap:var(--et-chip-gap);padding-inline:var(--et-chip-padding-inline);min-block-size:var(--et-chip-min-block-size);border-radius:var(--et-chip-border-radius);font-size:var(--et-chip-font-size);line-height:1.4;max-inline-size:100%;box-sizing:border-box;background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 14%,transparent);color:var(--et-surface-color-solid, currentColor);-webkit-user-select:none;user-select:none}.et-chip:where([data-disabled]){opacity:var(--et-chip-opacity-disabled);pointer-events:none}.et-chip:where([role=checkbox],[role=radio]){cursor:pointer;transition:background .12s ease,color .12s ease}@media(hover:hover){.et-chip:where([role=checkbox],[role=radio]):hover:not([aria-checked=true]):not([data-readonly]){background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 22%,transparent)}}.et-chip:where([role=checkbox],[role=radio]):focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:1px}.et-chip:where([role=checkbox],[role=radio]):where([data-readonly]){cursor:default}.et-chip:where([aria-checked=true]){background:color-mix(in srgb,var(--et-theme-color-primary-solid, currentColor) 16%,transparent);color:var(--et-theme-color-ink-solid, currentColor)}@media(hover:hover){.et-chip:where([aria-checked=true]):hover:not([data-readonly]){background:color-mix(in srgb,var(--et-theme-color-primary-solid, currentColor) 24%,transparent)}}.et-chip:where([data-removable]){padding-inline-end:calc(var(--et-chip-padding-inline) / 2)}.et-chip .et-chip-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-inline-size:0}.et-chip .et-chip-remove-button{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-chip-remove-size);block-size:var(--et-chip-remove-size);border-radius:50%;border:none;padding:0;margin:0;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;appearance:none}@media(hover:hover){.et-chip .et-chip-remove-button:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 20%,transparent);color:var(--et-surface-color-solid, currentColor)}}.et-chip .et-chip-remove-button:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 28%,transparent)}.et-chip .et-chip-remove-button .et-icon{inline-size:calc(var(--et-chip-remove-size) - 6px);block-size:calc(var(--et-chip-remove-size) - 6px)}}\n"] }]
2377
2377
  }] });
2378
2378
 
2379
2379
  const CHIP_IMPORTS = [ChipComponent, ChipDirective, ChipRemoveDirective];
@@ -6722,7 +6722,7 @@ class CascaderPanelComponent {
6722
6722
  <div #panelBody class="et-cascader-panel-body">
6723
6723
  <ng-content />
6724
6724
  </div>
6725
- `, isInline: true, styles: ["@layer components{@property --et-cascader-column-inline-size{syntax: \"<length>\"; inherits: true; initial-value: 220px;}@property --et-cascader-panel-max-block-size{syntax: \"<length-percentage>\"; inherits: false; initial-value: 320px;}@property --et-cascader-node-height{syntax: \"<length>\"; inherits: true; initial-value: 36px;}.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-enter-from,.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-leave-to{opacity:0}.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-enter-active{transition:transform .14s ease,opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-leave-active{transition:transform .1s ease,opacity .1s ease}.et-overlay--cascader[data-overlay-placement^=top].et-animation-enter-from,.et-overlay--cascader[data-overlay-placement^=top].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(.3rem)!important}.et-overlay--cascader[data-overlay-placement^=bottom].et-animation-enter-from,.et-overlay--cascader[data-overlay-placement^=bottom].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(-.3rem)!important}@media(prefers-reduced-motion:reduce){.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-enter-active,.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-leave-active{transition-duration:0ms}}.et-cascader-panel{display:block;box-sizing:border-box;border-radius:10px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:var(--et-surface-background-solid, rgb(32 32 32));color:var(--et-surface-color-solid, rgb(244 244 245));font-size:14px;box-shadow:0 10px 24px #00000029;overflow:hidden}.et-cascader-panel.et-cascader-panel--resizing{overflow:clip}.et-cascader-panel:not([data-sheet])>.et-cascader-panel-body{inline-size:max-content}.et-cascader-panel .et-cascader-sheet-header{position:relative;display:flex;align-items:center;flex:none;box-sizing:border-box;block-size:var(--et-cascader-node-height);padding-block:4px;padding-inline:20px;border-block-end:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1))}.et-cascader-panel .et-cascader-back{position:absolute;inset-block:0;inset-inline-start:20px;display:inline-flex;align-items:center;transition:opacity .18s ease,transform .18s ease}.et-cascader-panel .et-cascader-back.et-cascader-back--hidden{opacity:0;transform:translate(-6px);pointer-events:none}.et-cascader-panel .et-cascader-back-icon{rotate:-90deg}.et-cascader-panel .et-cascader-sheet-title-slot{position:relative;flex:1;min-inline-size:0;align-self:stretch;overflow:hidden;pointer-events:none}.et-cascader-panel .et-cascader-sheet-title-shift{position:absolute;inset:0;transform:translate(0);transition:transform .18s ease}.et-cascader-panel .et-cascader-sheet-header[data-back] .et-cascader-sheet-title-shift{transform:translate(var(--et-cascader-back-slot, 4em))}.et-cascader-panel .et-cascader-sheet-title{position:absolute;inset:0;display:flex;align-items:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:600;color:var(--et-surface-color-solid, currentColor)}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=slide][data-nav=forward] .et-cascader-sheet-title--enter{animation:et-cascader-title-enter-forward .2s ease}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=slide][data-nav=backward] .et-cascader-sheet-title--enter{animation:et-cascader-title-enter-backward .2s ease}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=slide][data-nav=forward] .et-cascader-sheet-title--leave{animation:et-cascader-title-leave-forward .18s ease forwards}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=slide][data-nav=backward] .et-cascader-sheet-title--leave{animation:et-cascader-title-leave-backward .18s ease forwards}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=fade] .et-cascader-sheet-title--enter{animation:et-cascader-title-fade-in .18s ease}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=fade] .et-cascader-sheet-title--leave{animation:et-cascader-title-fade-out .18s ease forwards}.et-cascader-panel .et-cascader-breadcrumbs{display:flex;align-items:center;gap:2px;box-sizing:border-box;inline-size:0;min-inline-size:100%;padding:6px;border-block-start:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));overflow:hidden}.et-cascader-panel .et-cascader-crumb{display:flex;align-items:center;gap:2px;min-inline-size:0}.et-cascader-panel .et-cascader-crumb.et-cascader-crumb--enter{animation:et-cascader-crumb-in .2s ease}.et-cascader-panel .et-cascader-crumb.et-cascader-crumb--leave{animation:et-cascader-crumb-out .16s ease forwards}.et-cascader-panel .et-cascader-breadcrumb{display:block;min-inline-size:0;padding:4px 8px;border:none;border-radius:6px;background:transparent;font:inherit;font-size:12px;color:var(--et-surface-color-muted-solid, currentColor);text-align:start;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;appearance:none;outline:none;transition:background .12s ease,color .12s ease}.et-cascader-panel .et-cascader-breadcrumb:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent);color:var(--et-surface-color-solid, currentColor)}.et-cascader-panel .et-cascader-breadcrumb:focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 16%,transparent);color:var(--et-surface-color-solid, currentColor)}.et-cascader-panel .et-cascader-breadcrumb[data-current]{color:var(--et-surface-color-solid, currentColor)}.et-cascader-panel .et-cascader-breadcrumb-chevron{flex:none;inline-size:10px;block-size:10px;color:var(--et-surface-color-subtle-solid, currentColor);rotate:90deg}.et-cascader-panel .et-cascader-columns{display:flex;max-block-size:var(--et-cascader-panel-max-block-size)}.et-cascader-panel .et-cascader-columns:not([data-sheet]){display:block;inline-size:calc(var(--_et-cascader-visible-columns, 1) * var(--et-cascader-column-inline-size));overflow:clip}.et-cascader-panel .et-cascader-columns:not([data-sheet]) .et-cascader-column{box-sizing:border-box}.et-cascader-panel .et-cascader-columns:not([data-sheet]) .et-cascader-column--offstage{contain:size}.et-cascader-panel .et-cascader-columns[data-sheet]{display:block;flex:1;min-block-size:0;max-block-size:none;overflow-y:auto;overflow-x:clip;overscroll-behavior:contain}.et-cascader-panel .et-cascader-columns[data-sheet] .et-cascader-column{inline-size:100%;block-size:100%;max-block-size:none;overflow:visible;border-inline-end:none}.et-cascader-panel .et-cascader-columns[data-sheet] .et-cascader-column:has(.et-cascader-state){display:flex;align-items:center;justify-content:center}.et-cascader-panel .et-cascader-columns-track{display:flex;max-block-size:inherit;transform:translate(calc(var(--_et-cascader-column-window-start, 0) * -1 * var(--et-cascader-column-inline-size)));transition:transform .24s ease}.et-cascader-panel .et-cascader-sheet-body{display:flex;flex-direction:column;block-size:min(60vh,480px)}.et-cascader-panel .et-cascader-search{padding:6px;border-block-end:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1))}.et-cascader-panel .et-cascader-search input[etcascadersearch]{inline-size:100%;block-size:36px;box-sizing:border-box;padding-inline:10px;border-radius:6px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 6%,transparent);color:inherit;font:inherit;outline:none;caret-color:var(--et-theme-color-primary-solid, currentColor);transition:border-color .12s ease,background .12s ease}.et-cascader-panel .et-cascader-search input[etcascadersearch]:focus-visible{border-color:var(--et-theme-color-primary-solid, rgb(255 255 255 / .3))}.et-cascader-panel .et-cascader-search input[etcascadersearch]::placeholder{color:var(--et-surface-color-muted-solid, rgb(255 255 255 / .55))}.et-cascader-panel .et-cascader-results{display:block;box-sizing:border-box;inline-size:min(320px,calc(100vw - 24px));max-block-size:var(--et-cascader-panel-max-block-size);overflow-y:auto;overflow-x:clip;overscroll-behavior:contain;padding:6px}.et-cascader-panel .et-cascader-sheet-body .et-cascader-results{flex:1;min-block-size:0;inline-size:100%;max-block-size:none}.et-cascader-panel .et-cascader-column{display:block;flex:none;inline-size:var(--et-cascader-column-inline-size);max-block-size:var(--et-cascader-panel-max-block-size);overflow-y:auto;overflow-x:clip;overscroll-behavior:contain;padding:6px}.et-cascader-panel .et-cascader-column:not(:last-child){border-inline-end:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1))}.et-cascader-panel .et-cascader-columns[data-sheet] .et-cascader-column:where([data-nav=forward]){animation:et-cascader-column-in-forward .2s ease}.et-cascader-panel .et-cascader-columns[data-sheet] .et-cascader-column:where([data-nav=backward]){animation:et-cascader-column-in-backward .2s ease}.et-cascader-panel .et-cascader-columns:not([data-sheet]) .et-cascader-column:where([data-nav=forward]){animation:et-cascader-column-grow-in .18s ease}.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option{display:flex;align-items:center;gap:8px;inline-size:100%;min-block-size:var(--et-cascader-node-height);padding-inline:10px;border:none;border-radius:6px;background:transparent;font:inherit;text-align:start;color:inherit;cursor:pointer;appearance:none;outline:none;transition:background .12s ease}:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option):hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent)}:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option):focus-visible,:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option)[data-focused]{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 16%,transparent)}:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option)[data-expanded]{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent)}:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option)[data-selected]{color:var(--et-theme-color-ink-solid, currentColor);font-weight:500}:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option)[data-disabled]{cursor:default;opacity:.4}.et-cascader-panel .et-cascader-node-label,.et-cascader-panel .et-cascader-search-option-label{flex:1;min-inline-size:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.et-cascader-panel .et-cascader-search-option-ancestor{color:var(--et-surface-color-muted-solid, currentColor)}.et-cascader-panel .et-cascader-check{position:relative;flex:none;inline-size:16px;block-size:16px;box-sizing:border-box;border:2px solid var(--et-surface-border-solid, rgb(255 255 255 / .3));border-radius:4px;transition:background .12s ease,border-color .12s ease}.et-cascader-panel .et-cascader-check:after{content:\"\";position:absolute;opacity:0}.et-cascader-panel [data-selected]>.et-cascader-check,.et-cascader-panel [data-indeterminate]>.et-cascader-check{border-color:var(--et-theme-color-primary-solid, currentColor);background:var(--et-theme-color-primary-solid, currentColor)}.et-cascader-panel [data-selected]>.et-cascader-check:after{inset-inline-start:4px;inset-block-start:1px;inline-size:4px;block-size:8px;border:solid var(--et-theme-color-on-primary, rgb(0 0 0));border-width:0 2px 2px 0;rotate:45deg;opacity:1}.et-cascader-panel [data-indeterminate]>.et-cascader-check:after{inset-inline-start:2px;inset-block-start:5px;inline-size:8px;block-size:2px;background:var(--et-theme-color-on-primary, rgb(0 0 0));opacity:1}.et-cascader-panel .et-cascader-node-chevron{flex:none;inline-size:12px;block-size:12px;color:var(--et-surface-color-muted-solid, currentColor);rotate:90deg}.et-cascader-panel .et-cascader-state{display:flex;align-items:center;justify-content:center;gap:8px;min-block-size:var(--et-cascader-node-height);padding:12px 16px;text-align:center;color:var(--et-surface-color-muted-solid, currentColor)}.et-cascader-panel .et-cascader-state.et-cascader-state--error{flex-direction:column;gap:8px;font-size:12px}.et-cascader-panel .et-cascader-state-error-message{color:var(--et-theme-color-primary-solid, rgb(248 113 113))}@keyframes et-cascader-title-enter-forward{0%{opacity:0;transform:translate(12px)}}@keyframes et-cascader-title-enter-backward{0%{opacity:0;transform:translate(-12px)}}@keyframes et-cascader-title-leave-forward{to{opacity:0;transform:translate(-12px)}}@keyframes et-cascader-title-leave-backward{to{opacity:0;transform:translate(12px)}}@keyframes et-cascader-title-fade-in{0%{opacity:0}}@keyframes et-cascader-title-fade-out{to{opacity:0}}@keyframes et-cascader-column-in-forward{0%{opacity:0;transform:translate(14px)}}@keyframes et-cascader-column-in-backward{0%{opacity:0;transform:translate(-14px)}}@keyframes et-cascader-column-grow-in{0%{opacity:0;transform:translate(-10px)}}@keyframes et-cascader-crumb-in{0%{opacity:0;transform:translate(8px)}}@keyframes et-cascader-crumb-out{to{opacity:0;transform:translate(8px)}}.et-overlay.et-cascader-sheet{--et-cascader-node-height: 52px;border-radius:16px 16px 0 0}.et-overlay.et-cascader-sheet .et-overlay-container-drag-handle{display:none}.et-overlay.et-cascader-sheet .et-cascader-node,.et-overlay.et-cascader-sheet .et-cascader-search-option{font-size:16px;padding-inline:14px}.et-overlay.et-cascader-sheet .et-cascader-search{padding-inline:20px}.et-overlay.et-cascader-sheet .et-cascader-search input[etcascadersearch]{block-size:44px;font-size:16px}.et-overlay.et-cascader-sheet .et-cascader-node-chevron{inline-size:14px;block-size:14px}.et-overlay.et-cascader-sheet .et-cascader-panel{max-inline-size:none;border:none;border-radius:0;box-shadow:none;padding-block-end:max(8px,env(safe-area-inset-bottom))}.et-overlay.et-cascader-sheet .et-cascader-panel:before{content:\"\";display:block;inline-size:32px;block-size:4px;margin-inline:auto;margin-block:8px 4px;border-radius:999px;background:var(--et-surface-border-solid, rgb(255 255 255 / .2))}@media(prefers-reduced-motion:reduce){.et-cascader-panel .et-cascader-column,.et-cascader-panel .et-cascader-sheet-title,.et-cascader-panel .et-cascader-crumb{animation:none}.et-cascader-panel .et-cascader-back,.et-cascader-panel .et-cascader-sheet-title-shift,.et-cascader-panel .et-cascader-columns-track{transition:none}}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
6725
+ `, isInline: true, styles: ["@layer components{@property --et-cascader-column-inline-size{syntax: \"<length>\"; inherits: true; initial-value: 220px;}@property --et-cascader-panel-max-block-size{syntax: \"<length-percentage>\"; inherits: false; initial-value: 320px;}@property --et-cascader-node-height{syntax: \"<length>\"; inherits: true; initial-value: 36px;}.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-enter-from,.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-leave-to{opacity:0}.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-enter-active{transition:transform .14s ease,opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-leave-active{transition:transform .1s ease,opacity .1s ease}.et-overlay--cascader[data-overlay-placement^=top].et-animation-enter-from,.et-overlay--cascader[data-overlay-placement^=top].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(.3rem)!important}.et-overlay--cascader[data-overlay-placement^=bottom].et-animation-enter-from,.et-overlay--cascader[data-overlay-placement^=bottom].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(-.3rem)!important}@media(prefers-reduced-motion:reduce){.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-enter-active,.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-leave-active{transition-duration:0ms}}.et-cascader-panel{display:block;box-sizing:border-box;border-radius:10px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:var(--et-surface-background-solid, rgb(32 32 32));color:var(--et-surface-color-solid, rgb(244 244 245));font-size:14px;box-shadow:0 10px 24px #00000029;overflow:hidden}.et-cascader-panel.et-cascader-panel--resizing{overflow:clip}.et-cascader-panel:not([data-sheet])>.et-cascader-panel-body{inline-size:max-content}.et-cascader-panel .et-cascader-sheet-header{position:relative;display:flex;align-items:center;flex:none;box-sizing:border-box;block-size:var(--et-cascader-node-height);padding-block:4px;padding-inline:20px;border-block-end:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1))}.et-cascader-panel .et-cascader-back{position:absolute;inset-block:0;inset-inline-start:20px;display:inline-flex;align-items:center;transition:opacity .18s ease,transform .18s ease}.et-cascader-panel .et-cascader-back.et-cascader-back--hidden{opacity:0;transform:translate(-6px);pointer-events:none}.et-cascader-panel .et-cascader-back-icon{rotate:-90deg}.et-cascader-panel .et-cascader-sheet-title-slot{position:relative;flex:1;min-inline-size:0;align-self:stretch;overflow:hidden;pointer-events:none}.et-cascader-panel .et-cascader-sheet-title-shift{position:absolute;inset:0;transform:translate(0);transition:transform .18s ease}.et-cascader-panel .et-cascader-sheet-header[data-back] .et-cascader-sheet-title-shift{transform:translate(var(--et-cascader-back-slot, 4em))}.et-cascader-panel .et-cascader-sheet-title{position:absolute;inset:0;display:flex;align-items:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:600;color:var(--et-surface-color-solid, currentColor)}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=slide][data-nav=forward] .et-cascader-sheet-title--enter{animation:et-cascader-title-enter-forward .2s ease}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=slide][data-nav=backward] .et-cascader-sheet-title--enter{animation:et-cascader-title-enter-backward .2s ease}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=slide][data-nav=forward] .et-cascader-sheet-title--leave{animation:et-cascader-title-leave-forward .18s ease forwards}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=slide][data-nav=backward] .et-cascader-sheet-title--leave{animation:et-cascader-title-leave-backward .18s ease forwards}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=fade] .et-cascader-sheet-title--enter{animation:et-cascader-title-fade-in .18s ease}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=fade] .et-cascader-sheet-title--leave{animation:et-cascader-title-fade-out .18s ease forwards}.et-cascader-panel .et-cascader-breadcrumbs{display:flex;align-items:center;gap:2px;box-sizing:border-box;inline-size:0;min-inline-size:100%;padding:6px;border-block-start:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));overflow:hidden}.et-cascader-panel .et-cascader-crumb{display:flex;align-items:center;gap:2px;min-inline-size:0}.et-cascader-panel .et-cascader-crumb.et-cascader-crumb--enter{animation:et-cascader-crumb-in .2s ease}.et-cascader-panel .et-cascader-crumb.et-cascader-crumb--leave{animation:et-cascader-crumb-out .16s ease forwards}.et-cascader-panel .et-cascader-breadcrumb{display:block;min-inline-size:0;padding:4px 8px;border:none;border-radius:6px;background:transparent;font:inherit;font-size:12px;color:var(--et-surface-color-muted-solid, currentColor);text-align:start;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;appearance:none;outline:none;transition:background .12s ease,color .12s ease}@media(hover:hover){.et-cascader-panel .et-cascader-breadcrumb:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent);color:var(--et-surface-color-solid, currentColor)}}.et-cascader-panel .et-cascader-breadcrumb:focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 16%,transparent);color:var(--et-surface-color-solid, currentColor)}.et-cascader-panel .et-cascader-breadcrumb[data-current]{color:var(--et-surface-color-solid, currentColor)}.et-cascader-panel .et-cascader-breadcrumb-chevron{flex:none;inline-size:10px;block-size:10px;color:var(--et-surface-color-subtle-solid, currentColor);rotate:90deg}.et-cascader-panel .et-cascader-columns{display:flex;max-block-size:var(--et-cascader-panel-max-block-size)}.et-cascader-panel .et-cascader-columns:not([data-sheet]){display:block;inline-size:calc(var(--_et-cascader-visible-columns, 1) * var(--et-cascader-column-inline-size));overflow:clip}.et-cascader-panel .et-cascader-columns:not([data-sheet]) .et-cascader-column{box-sizing:border-box}.et-cascader-panel .et-cascader-columns:not([data-sheet]) .et-cascader-column--offstage{contain:size}.et-cascader-panel .et-cascader-columns[data-sheet]{display:block;flex:1;min-block-size:0;max-block-size:none;overflow-y:auto;overflow-x:clip;overscroll-behavior:contain}.et-cascader-panel .et-cascader-columns[data-sheet] .et-cascader-column{inline-size:100%;block-size:100%;max-block-size:none;overflow:visible;border-inline-end:none}.et-cascader-panel .et-cascader-columns[data-sheet] .et-cascader-column:has(.et-cascader-state){display:flex;align-items:center;justify-content:center}.et-cascader-panel .et-cascader-columns-track{display:flex;max-block-size:inherit;transform:translate(calc(var(--_et-cascader-column-window-start, 0) * -1 * var(--et-cascader-column-inline-size)));transition:transform .24s ease}.et-cascader-panel .et-cascader-sheet-body{display:flex;flex-direction:column;block-size:min(60vh,480px)}.et-cascader-panel .et-cascader-search{padding:6px;border-block-end:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1))}.et-cascader-panel .et-cascader-search input[etcascadersearch]{inline-size:100%;block-size:36px;box-sizing:border-box;padding-inline:10px;border-radius:6px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 6%,transparent);color:inherit;font:inherit;outline:none;caret-color:var(--et-theme-color-primary-solid, currentColor);transition:border-color .12s ease,background .12s ease}.et-cascader-panel .et-cascader-search input[etcascadersearch]:focus-visible{border-color:var(--et-theme-color-primary-solid, rgb(255 255 255 / .3))}.et-cascader-panel .et-cascader-search input[etcascadersearch]::placeholder{color:var(--et-surface-color-muted-solid, rgb(255 255 255 / .55))}.et-cascader-panel .et-cascader-results{display:block;box-sizing:border-box;inline-size:min(320px,calc(100vw - 24px));max-block-size:var(--et-cascader-panel-max-block-size);overflow-y:auto;overflow-x:clip;overscroll-behavior:contain;padding:6px}.et-cascader-panel .et-cascader-sheet-body .et-cascader-results{flex:1;min-block-size:0;inline-size:100%;max-block-size:none}.et-cascader-panel .et-cascader-column{display:block;flex:none;inline-size:var(--et-cascader-column-inline-size);max-block-size:var(--et-cascader-panel-max-block-size);overflow-y:auto;overflow-x:clip;overscroll-behavior:contain;padding:6px}.et-cascader-panel .et-cascader-column:not(:last-child){border-inline-end:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1))}.et-cascader-panel .et-cascader-columns[data-sheet] .et-cascader-column:where([data-nav=forward]){animation:et-cascader-column-in-forward .2s ease}.et-cascader-panel .et-cascader-columns[data-sheet] .et-cascader-column:where([data-nav=backward]){animation:et-cascader-column-in-backward .2s ease}.et-cascader-panel .et-cascader-columns:not([data-sheet]) .et-cascader-column:where([data-nav=forward]){animation:et-cascader-column-grow-in .18s ease}.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option{display:flex;align-items:center;gap:8px;inline-size:100%;min-block-size:var(--et-cascader-node-height);padding-inline:10px;border:none;border-radius:6px;background:transparent;font:inherit;text-align:start;color:inherit;cursor:pointer;appearance:none;outline:none;transition:background .12s ease}@media(hover:hover){:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option):hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent)}}:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option):focus-visible,:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option)[data-focused]{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 16%,transparent)}:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option)[data-expanded]{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent)}:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option)[data-selected]{color:var(--et-theme-color-ink-solid, currentColor);font-weight:500}:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option)[data-disabled]{cursor:default;opacity:.4}.et-cascader-panel .et-cascader-node-label,.et-cascader-panel .et-cascader-search-option-label{flex:1;min-inline-size:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.et-cascader-panel .et-cascader-search-option-ancestor{color:var(--et-surface-color-muted-solid, currentColor)}.et-cascader-panel .et-cascader-check{position:relative;flex:none;inline-size:16px;block-size:16px;box-sizing:border-box;border:2px solid var(--et-surface-border-solid, rgb(255 255 255 / .3));border-radius:4px;transition:background .12s ease,border-color .12s ease}.et-cascader-panel .et-cascader-check:after{content:\"\";position:absolute;opacity:0}.et-cascader-panel [data-selected]>.et-cascader-check,.et-cascader-panel [data-indeterminate]>.et-cascader-check{border-color:var(--et-theme-color-primary-solid, currentColor);background:var(--et-theme-color-primary-solid, currentColor)}.et-cascader-panel [data-selected]>.et-cascader-check:after{inset-inline-start:4px;inset-block-start:1px;inline-size:4px;block-size:8px;border:solid var(--et-theme-color-on-primary, rgb(0 0 0));border-width:0 2px 2px 0;rotate:45deg;opacity:1}.et-cascader-panel [data-indeterminate]>.et-cascader-check:after{inset-inline-start:2px;inset-block-start:5px;inline-size:8px;block-size:2px;background:var(--et-theme-color-on-primary, rgb(0 0 0));opacity:1}.et-cascader-panel .et-cascader-node-chevron{flex:none;inline-size:12px;block-size:12px;color:var(--et-surface-color-muted-solid, currentColor);rotate:90deg}.et-cascader-panel .et-cascader-state{display:flex;align-items:center;justify-content:center;gap:8px;min-block-size:var(--et-cascader-node-height);padding:12px 16px;text-align:center;color:var(--et-surface-color-muted-solid, currentColor)}.et-cascader-panel .et-cascader-state.et-cascader-state--error{flex-direction:column;gap:8px;font-size:12px}.et-cascader-panel .et-cascader-state-error-message{color:var(--et-theme-color-primary-solid, rgb(248 113 113))}@keyframes et-cascader-title-enter-forward{0%{opacity:0;transform:translate(12px)}}@keyframes et-cascader-title-enter-backward{0%{opacity:0;transform:translate(-12px)}}@keyframes et-cascader-title-leave-forward{to{opacity:0;transform:translate(-12px)}}@keyframes et-cascader-title-leave-backward{to{opacity:0;transform:translate(12px)}}@keyframes et-cascader-title-fade-in{0%{opacity:0}}@keyframes et-cascader-title-fade-out{to{opacity:0}}@keyframes et-cascader-column-in-forward{0%{opacity:0;transform:translate(14px)}}@keyframes et-cascader-column-in-backward{0%{opacity:0;transform:translate(-14px)}}@keyframes et-cascader-column-grow-in{0%{opacity:0;transform:translate(-10px)}}@keyframes et-cascader-crumb-in{0%{opacity:0;transform:translate(8px)}}@keyframes et-cascader-crumb-out{to{opacity:0;transform:translate(8px)}}.et-overlay.et-cascader-sheet{--et-cascader-node-height: 52px;border-radius:16px 16px 0 0}.et-overlay.et-cascader-sheet .et-overlay-container-drag-handle{display:none}.et-overlay.et-cascader-sheet .et-cascader-node,.et-overlay.et-cascader-sheet .et-cascader-search-option{font-size:16px;padding-inline:14px}.et-overlay.et-cascader-sheet .et-cascader-search{padding-inline:20px}.et-overlay.et-cascader-sheet .et-cascader-search input[etcascadersearch]{block-size:44px;font-size:16px}.et-overlay.et-cascader-sheet .et-cascader-node-chevron{inline-size:14px;block-size:14px}.et-overlay.et-cascader-sheet .et-cascader-panel{max-inline-size:none;border:none;border-radius:0;box-shadow:none;padding-block-end:max(8px,env(safe-area-inset-bottom))}.et-overlay.et-cascader-sheet .et-cascader-panel:before{content:\"\";display:block;inline-size:32px;block-size:4px;margin-inline:auto;margin-block:8px 4px;border-radius:999px;background:var(--et-surface-border-solid, rgb(255 255 255 / .2))}@media(prefers-reduced-motion:reduce){.et-cascader-panel .et-cascader-column,.et-cascader-panel .et-cascader-sheet-title,.et-cascader-panel .et-cascader-crumb{animation:none}.et-cascader-panel .et-cascader-back,.et-cascader-panel .et-cascader-sheet-title-shift,.et-cascader-panel .et-cascader-columns-track{transition:none}}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
6726
6726
  }
6727
6727
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CascaderPanelComponent, decorators: [{
6728
6728
  type: Component,
@@ -6742,7 +6742,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
6742
6742
  '[attr.data-sheet]': 'isSheet() || null',
6743
6743
  '(focusin)': 'handleFocusIn()',
6744
6744
  '(focusout)': 'handleFocusOut($event)',
6745
- }, styles: ["@layer components{@property --et-cascader-column-inline-size{syntax: \"<length>\"; inherits: true; initial-value: 220px;}@property --et-cascader-panel-max-block-size{syntax: \"<length-percentage>\"; inherits: false; initial-value: 320px;}@property --et-cascader-node-height{syntax: \"<length>\"; inherits: true; initial-value: 36px;}.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-enter-from,.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-leave-to{opacity:0}.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-enter-active{transition:transform .14s ease,opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-leave-active{transition:transform .1s ease,opacity .1s ease}.et-overlay--cascader[data-overlay-placement^=top].et-animation-enter-from,.et-overlay--cascader[data-overlay-placement^=top].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(.3rem)!important}.et-overlay--cascader[data-overlay-placement^=bottom].et-animation-enter-from,.et-overlay--cascader[data-overlay-placement^=bottom].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(-.3rem)!important}@media(prefers-reduced-motion:reduce){.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-enter-active,.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-leave-active{transition-duration:0ms}}.et-cascader-panel{display:block;box-sizing:border-box;border-radius:10px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:var(--et-surface-background-solid, rgb(32 32 32));color:var(--et-surface-color-solid, rgb(244 244 245));font-size:14px;box-shadow:0 10px 24px #00000029;overflow:hidden}.et-cascader-panel.et-cascader-panel--resizing{overflow:clip}.et-cascader-panel:not([data-sheet])>.et-cascader-panel-body{inline-size:max-content}.et-cascader-panel .et-cascader-sheet-header{position:relative;display:flex;align-items:center;flex:none;box-sizing:border-box;block-size:var(--et-cascader-node-height);padding-block:4px;padding-inline:20px;border-block-end:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1))}.et-cascader-panel .et-cascader-back{position:absolute;inset-block:0;inset-inline-start:20px;display:inline-flex;align-items:center;transition:opacity .18s ease,transform .18s ease}.et-cascader-panel .et-cascader-back.et-cascader-back--hidden{opacity:0;transform:translate(-6px);pointer-events:none}.et-cascader-panel .et-cascader-back-icon{rotate:-90deg}.et-cascader-panel .et-cascader-sheet-title-slot{position:relative;flex:1;min-inline-size:0;align-self:stretch;overflow:hidden;pointer-events:none}.et-cascader-panel .et-cascader-sheet-title-shift{position:absolute;inset:0;transform:translate(0);transition:transform .18s ease}.et-cascader-panel .et-cascader-sheet-header[data-back] .et-cascader-sheet-title-shift{transform:translate(var(--et-cascader-back-slot, 4em))}.et-cascader-panel .et-cascader-sheet-title{position:absolute;inset:0;display:flex;align-items:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:600;color:var(--et-surface-color-solid, currentColor)}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=slide][data-nav=forward] .et-cascader-sheet-title--enter{animation:et-cascader-title-enter-forward .2s ease}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=slide][data-nav=backward] .et-cascader-sheet-title--enter{animation:et-cascader-title-enter-backward .2s ease}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=slide][data-nav=forward] .et-cascader-sheet-title--leave{animation:et-cascader-title-leave-forward .18s ease forwards}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=slide][data-nav=backward] .et-cascader-sheet-title--leave{animation:et-cascader-title-leave-backward .18s ease forwards}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=fade] .et-cascader-sheet-title--enter{animation:et-cascader-title-fade-in .18s ease}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=fade] .et-cascader-sheet-title--leave{animation:et-cascader-title-fade-out .18s ease forwards}.et-cascader-panel .et-cascader-breadcrumbs{display:flex;align-items:center;gap:2px;box-sizing:border-box;inline-size:0;min-inline-size:100%;padding:6px;border-block-start:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));overflow:hidden}.et-cascader-panel .et-cascader-crumb{display:flex;align-items:center;gap:2px;min-inline-size:0}.et-cascader-panel .et-cascader-crumb.et-cascader-crumb--enter{animation:et-cascader-crumb-in .2s ease}.et-cascader-panel .et-cascader-crumb.et-cascader-crumb--leave{animation:et-cascader-crumb-out .16s ease forwards}.et-cascader-panel .et-cascader-breadcrumb{display:block;min-inline-size:0;padding:4px 8px;border:none;border-radius:6px;background:transparent;font:inherit;font-size:12px;color:var(--et-surface-color-muted-solid, currentColor);text-align:start;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;appearance:none;outline:none;transition:background .12s ease,color .12s ease}.et-cascader-panel .et-cascader-breadcrumb:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent);color:var(--et-surface-color-solid, currentColor)}.et-cascader-panel .et-cascader-breadcrumb:focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 16%,transparent);color:var(--et-surface-color-solid, currentColor)}.et-cascader-panel .et-cascader-breadcrumb[data-current]{color:var(--et-surface-color-solid, currentColor)}.et-cascader-panel .et-cascader-breadcrumb-chevron{flex:none;inline-size:10px;block-size:10px;color:var(--et-surface-color-subtle-solid, currentColor);rotate:90deg}.et-cascader-panel .et-cascader-columns{display:flex;max-block-size:var(--et-cascader-panel-max-block-size)}.et-cascader-panel .et-cascader-columns:not([data-sheet]){display:block;inline-size:calc(var(--_et-cascader-visible-columns, 1) * var(--et-cascader-column-inline-size));overflow:clip}.et-cascader-panel .et-cascader-columns:not([data-sheet]) .et-cascader-column{box-sizing:border-box}.et-cascader-panel .et-cascader-columns:not([data-sheet]) .et-cascader-column--offstage{contain:size}.et-cascader-panel .et-cascader-columns[data-sheet]{display:block;flex:1;min-block-size:0;max-block-size:none;overflow-y:auto;overflow-x:clip;overscroll-behavior:contain}.et-cascader-panel .et-cascader-columns[data-sheet] .et-cascader-column{inline-size:100%;block-size:100%;max-block-size:none;overflow:visible;border-inline-end:none}.et-cascader-panel .et-cascader-columns[data-sheet] .et-cascader-column:has(.et-cascader-state){display:flex;align-items:center;justify-content:center}.et-cascader-panel .et-cascader-columns-track{display:flex;max-block-size:inherit;transform:translate(calc(var(--_et-cascader-column-window-start, 0) * -1 * var(--et-cascader-column-inline-size)));transition:transform .24s ease}.et-cascader-panel .et-cascader-sheet-body{display:flex;flex-direction:column;block-size:min(60vh,480px)}.et-cascader-panel .et-cascader-search{padding:6px;border-block-end:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1))}.et-cascader-panel .et-cascader-search input[etcascadersearch]{inline-size:100%;block-size:36px;box-sizing:border-box;padding-inline:10px;border-radius:6px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 6%,transparent);color:inherit;font:inherit;outline:none;caret-color:var(--et-theme-color-primary-solid, currentColor);transition:border-color .12s ease,background .12s ease}.et-cascader-panel .et-cascader-search input[etcascadersearch]:focus-visible{border-color:var(--et-theme-color-primary-solid, rgb(255 255 255 / .3))}.et-cascader-panel .et-cascader-search input[etcascadersearch]::placeholder{color:var(--et-surface-color-muted-solid, rgb(255 255 255 / .55))}.et-cascader-panel .et-cascader-results{display:block;box-sizing:border-box;inline-size:min(320px,calc(100vw - 24px));max-block-size:var(--et-cascader-panel-max-block-size);overflow-y:auto;overflow-x:clip;overscroll-behavior:contain;padding:6px}.et-cascader-panel .et-cascader-sheet-body .et-cascader-results{flex:1;min-block-size:0;inline-size:100%;max-block-size:none}.et-cascader-panel .et-cascader-column{display:block;flex:none;inline-size:var(--et-cascader-column-inline-size);max-block-size:var(--et-cascader-panel-max-block-size);overflow-y:auto;overflow-x:clip;overscroll-behavior:contain;padding:6px}.et-cascader-panel .et-cascader-column:not(:last-child){border-inline-end:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1))}.et-cascader-panel .et-cascader-columns[data-sheet] .et-cascader-column:where([data-nav=forward]){animation:et-cascader-column-in-forward .2s ease}.et-cascader-panel .et-cascader-columns[data-sheet] .et-cascader-column:where([data-nav=backward]){animation:et-cascader-column-in-backward .2s ease}.et-cascader-panel .et-cascader-columns:not([data-sheet]) .et-cascader-column:where([data-nav=forward]){animation:et-cascader-column-grow-in .18s ease}.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option{display:flex;align-items:center;gap:8px;inline-size:100%;min-block-size:var(--et-cascader-node-height);padding-inline:10px;border:none;border-radius:6px;background:transparent;font:inherit;text-align:start;color:inherit;cursor:pointer;appearance:none;outline:none;transition:background .12s ease}:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option):hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent)}:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option):focus-visible,:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option)[data-focused]{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 16%,transparent)}:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option)[data-expanded]{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent)}:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option)[data-selected]{color:var(--et-theme-color-ink-solid, currentColor);font-weight:500}:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option)[data-disabled]{cursor:default;opacity:.4}.et-cascader-panel .et-cascader-node-label,.et-cascader-panel .et-cascader-search-option-label{flex:1;min-inline-size:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.et-cascader-panel .et-cascader-search-option-ancestor{color:var(--et-surface-color-muted-solid, currentColor)}.et-cascader-panel .et-cascader-check{position:relative;flex:none;inline-size:16px;block-size:16px;box-sizing:border-box;border:2px solid var(--et-surface-border-solid, rgb(255 255 255 / .3));border-radius:4px;transition:background .12s ease,border-color .12s ease}.et-cascader-panel .et-cascader-check:after{content:\"\";position:absolute;opacity:0}.et-cascader-panel [data-selected]>.et-cascader-check,.et-cascader-panel [data-indeterminate]>.et-cascader-check{border-color:var(--et-theme-color-primary-solid, currentColor);background:var(--et-theme-color-primary-solid, currentColor)}.et-cascader-panel [data-selected]>.et-cascader-check:after{inset-inline-start:4px;inset-block-start:1px;inline-size:4px;block-size:8px;border:solid var(--et-theme-color-on-primary, rgb(0 0 0));border-width:0 2px 2px 0;rotate:45deg;opacity:1}.et-cascader-panel [data-indeterminate]>.et-cascader-check:after{inset-inline-start:2px;inset-block-start:5px;inline-size:8px;block-size:2px;background:var(--et-theme-color-on-primary, rgb(0 0 0));opacity:1}.et-cascader-panel .et-cascader-node-chevron{flex:none;inline-size:12px;block-size:12px;color:var(--et-surface-color-muted-solid, currentColor);rotate:90deg}.et-cascader-panel .et-cascader-state{display:flex;align-items:center;justify-content:center;gap:8px;min-block-size:var(--et-cascader-node-height);padding:12px 16px;text-align:center;color:var(--et-surface-color-muted-solid, currentColor)}.et-cascader-panel .et-cascader-state.et-cascader-state--error{flex-direction:column;gap:8px;font-size:12px}.et-cascader-panel .et-cascader-state-error-message{color:var(--et-theme-color-primary-solid, rgb(248 113 113))}@keyframes et-cascader-title-enter-forward{0%{opacity:0;transform:translate(12px)}}@keyframes et-cascader-title-enter-backward{0%{opacity:0;transform:translate(-12px)}}@keyframes et-cascader-title-leave-forward{to{opacity:0;transform:translate(-12px)}}@keyframes et-cascader-title-leave-backward{to{opacity:0;transform:translate(12px)}}@keyframes et-cascader-title-fade-in{0%{opacity:0}}@keyframes et-cascader-title-fade-out{to{opacity:0}}@keyframes et-cascader-column-in-forward{0%{opacity:0;transform:translate(14px)}}@keyframes et-cascader-column-in-backward{0%{opacity:0;transform:translate(-14px)}}@keyframes et-cascader-column-grow-in{0%{opacity:0;transform:translate(-10px)}}@keyframes et-cascader-crumb-in{0%{opacity:0;transform:translate(8px)}}@keyframes et-cascader-crumb-out{to{opacity:0;transform:translate(8px)}}.et-overlay.et-cascader-sheet{--et-cascader-node-height: 52px;border-radius:16px 16px 0 0}.et-overlay.et-cascader-sheet .et-overlay-container-drag-handle{display:none}.et-overlay.et-cascader-sheet .et-cascader-node,.et-overlay.et-cascader-sheet .et-cascader-search-option{font-size:16px;padding-inline:14px}.et-overlay.et-cascader-sheet .et-cascader-search{padding-inline:20px}.et-overlay.et-cascader-sheet .et-cascader-search input[etcascadersearch]{block-size:44px;font-size:16px}.et-overlay.et-cascader-sheet .et-cascader-node-chevron{inline-size:14px;block-size:14px}.et-overlay.et-cascader-sheet .et-cascader-panel{max-inline-size:none;border:none;border-radius:0;box-shadow:none;padding-block-end:max(8px,env(safe-area-inset-bottom))}.et-overlay.et-cascader-sheet .et-cascader-panel:before{content:\"\";display:block;inline-size:32px;block-size:4px;margin-inline:auto;margin-block:8px 4px;border-radius:999px;background:var(--et-surface-border-solid, rgb(255 255 255 / .2))}@media(prefers-reduced-motion:reduce){.et-cascader-panel .et-cascader-column,.et-cascader-panel .et-cascader-sheet-title,.et-cascader-panel .et-cascader-crumb{animation:none}.et-cascader-panel .et-cascader-back,.et-cascader-panel .et-cascader-sheet-title-shift,.et-cascader-panel .et-cascader-columns-track{transition:none}}}\n"] }]
6745
+ }, styles: ["@layer components{@property --et-cascader-column-inline-size{syntax: \"<length>\"; inherits: true; initial-value: 220px;}@property --et-cascader-panel-max-block-size{syntax: \"<length-percentage>\"; inherits: false; initial-value: 320px;}@property --et-cascader-node-height{syntax: \"<length>\"; inherits: true; initial-value: 36px;}.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-enter-from,.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-leave-to{opacity:0}.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-enter-active{transition:transform .14s ease,opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-leave-active{transition:transform .1s ease,opacity .1s ease}.et-overlay--cascader[data-overlay-placement^=top].et-animation-enter-from,.et-overlay--cascader[data-overlay-placement^=top].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(.3rem)!important}.et-overlay--cascader[data-overlay-placement^=bottom].et-animation-enter-from,.et-overlay--cascader[data-overlay-placement^=bottom].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(-.3rem)!important}@media(prefers-reduced-motion:reduce){.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-enter-active,.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-leave-active{transition-duration:0ms}}.et-cascader-panel{display:block;box-sizing:border-box;border-radius:10px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:var(--et-surface-background-solid, rgb(32 32 32));color:var(--et-surface-color-solid, rgb(244 244 245));font-size:14px;box-shadow:0 10px 24px #00000029;overflow:hidden}.et-cascader-panel.et-cascader-panel--resizing{overflow:clip}.et-cascader-panel:not([data-sheet])>.et-cascader-panel-body{inline-size:max-content}.et-cascader-panel .et-cascader-sheet-header{position:relative;display:flex;align-items:center;flex:none;box-sizing:border-box;block-size:var(--et-cascader-node-height);padding-block:4px;padding-inline:20px;border-block-end:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1))}.et-cascader-panel .et-cascader-back{position:absolute;inset-block:0;inset-inline-start:20px;display:inline-flex;align-items:center;transition:opacity .18s ease,transform .18s ease}.et-cascader-panel .et-cascader-back.et-cascader-back--hidden{opacity:0;transform:translate(-6px);pointer-events:none}.et-cascader-panel .et-cascader-back-icon{rotate:-90deg}.et-cascader-panel .et-cascader-sheet-title-slot{position:relative;flex:1;min-inline-size:0;align-self:stretch;overflow:hidden;pointer-events:none}.et-cascader-panel .et-cascader-sheet-title-shift{position:absolute;inset:0;transform:translate(0);transition:transform .18s ease}.et-cascader-panel .et-cascader-sheet-header[data-back] .et-cascader-sheet-title-shift{transform:translate(var(--et-cascader-back-slot, 4em))}.et-cascader-panel .et-cascader-sheet-title{position:absolute;inset:0;display:flex;align-items:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:600;color:var(--et-surface-color-solid, currentColor)}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=slide][data-nav=forward] .et-cascader-sheet-title--enter{animation:et-cascader-title-enter-forward .2s ease}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=slide][data-nav=backward] .et-cascader-sheet-title--enter{animation:et-cascader-title-enter-backward .2s ease}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=slide][data-nav=forward] .et-cascader-sheet-title--leave{animation:et-cascader-title-leave-forward .18s ease forwards}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=slide][data-nav=backward] .et-cascader-sheet-title--leave{animation:et-cascader-title-leave-backward .18s ease forwards}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=fade] .et-cascader-sheet-title--enter{animation:et-cascader-title-fade-in .18s ease}.et-cascader-panel .et-cascader-sheet-title-slot[data-anim=fade] .et-cascader-sheet-title--leave{animation:et-cascader-title-fade-out .18s ease forwards}.et-cascader-panel .et-cascader-breadcrumbs{display:flex;align-items:center;gap:2px;box-sizing:border-box;inline-size:0;min-inline-size:100%;padding:6px;border-block-start:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));overflow:hidden}.et-cascader-panel .et-cascader-crumb{display:flex;align-items:center;gap:2px;min-inline-size:0}.et-cascader-panel .et-cascader-crumb.et-cascader-crumb--enter{animation:et-cascader-crumb-in .2s ease}.et-cascader-panel .et-cascader-crumb.et-cascader-crumb--leave{animation:et-cascader-crumb-out .16s ease forwards}.et-cascader-panel .et-cascader-breadcrumb{display:block;min-inline-size:0;padding:4px 8px;border:none;border-radius:6px;background:transparent;font:inherit;font-size:12px;color:var(--et-surface-color-muted-solid, currentColor);text-align:start;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;appearance:none;outline:none;transition:background .12s ease,color .12s ease}@media(hover:hover){.et-cascader-panel .et-cascader-breadcrumb:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent);color:var(--et-surface-color-solid, currentColor)}}.et-cascader-panel .et-cascader-breadcrumb:focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 16%,transparent);color:var(--et-surface-color-solid, currentColor)}.et-cascader-panel .et-cascader-breadcrumb[data-current]{color:var(--et-surface-color-solid, currentColor)}.et-cascader-panel .et-cascader-breadcrumb-chevron{flex:none;inline-size:10px;block-size:10px;color:var(--et-surface-color-subtle-solid, currentColor);rotate:90deg}.et-cascader-panel .et-cascader-columns{display:flex;max-block-size:var(--et-cascader-panel-max-block-size)}.et-cascader-panel .et-cascader-columns:not([data-sheet]){display:block;inline-size:calc(var(--_et-cascader-visible-columns, 1) * var(--et-cascader-column-inline-size));overflow:clip}.et-cascader-panel .et-cascader-columns:not([data-sheet]) .et-cascader-column{box-sizing:border-box}.et-cascader-panel .et-cascader-columns:not([data-sheet]) .et-cascader-column--offstage{contain:size}.et-cascader-panel .et-cascader-columns[data-sheet]{display:block;flex:1;min-block-size:0;max-block-size:none;overflow-y:auto;overflow-x:clip;overscroll-behavior:contain}.et-cascader-panel .et-cascader-columns[data-sheet] .et-cascader-column{inline-size:100%;block-size:100%;max-block-size:none;overflow:visible;border-inline-end:none}.et-cascader-panel .et-cascader-columns[data-sheet] .et-cascader-column:has(.et-cascader-state){display:flex;align-items:center;justify-content:center}.et-cascader-panel .et-cascader-columns-track{display:flex;max-block-size:inherit;transform:translate(calc(var(--_et-cascader-column-window-start, 0) * -1 * var(--et-cascader-column-inline-size)));transition:transform .24s ease}.et-cascader-panel .et-cascader-sheet-body{display:flex;flex-direction:column;block-size:min(60vh,480px)}.et-cascader-panel .et-cascader-search{padding:6px;border-block-end:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1))}.et-cascader-panel .et-cascader-search input[etcascadersearch]{inline-size:100%;block-size:36px;box-sizing:border-box;padding-inline:10px;border-radius:6px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 6%,transparent);color:inherit;font:inherit;outline:none;caret-color:var(--et-theme-color-primary-solid, currentColor);transition:border-color .12s ease,background .12s ease}.et-cascader-panel .et-cascader-search input[etcascadersearch]:focus-visible{border-color:var(--et-theme-color-primary-solid, rgb(255 255 255 / .3))}.et-cascader-panel .et-cascader-search input[etcascadersearch]::placeholder{color:var(--et-surface-color-muted-solid, rgb(255 255 255 / .55))}.et-cascader-panel .et-cascader-results{display:block;box-sizing:border-box;inline-size:min(320px,calc(100vw - 24px));max-block-size:var(--et-cascader-panel-max-block-size);overflow-y:auto;overflow-x:clip;overscroll-behavior:contain;padding:6px}.et-cascader-panel .et-cascader-sheet-body .et-cascader-results{flex:1;min-block-size:0;inline-size:100%;max-block-size:none}.et-cascader-panel .et-cascader-column{display:block;flex:none;inline-size:var(--et-cascader-column-inline-size);max-block-size:var(--et-cascader-panel-max-block-size);overflow-y:auto;overflow-x:clip;overscroll-behavior:contain;padding:6px}.et-cascader-panel .et-cascader-column:not(:last-child){border-inline-end:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1))}.et-cascader-panel .et-cascader-columns[data-sheet] .et-cascader-column:where([data-nav=forward]){animation:et-cascader-column-in-forward .2s ease}.et-cascader-panel .et-cascader-columns[data-sheet] .et-cascader-column:where([data-nav=backward]){animation:et-cascader-column-in-backward .2s ease}.et-cascader-panel .et-cascader-columns:not([data-sheet]) .et-cascader-column:where([data-nav=forward]){animation:et-cascader-column-grow-in .18s ease}.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option{display:flex;align-items:center;gap:8px;inline-size:100%;min-block-size:var(--et-cascader-node-height);padding-inline:10px;border:none;border-radius:6px;background:transparent;font:inherit;text-align:start;color:inherit;cursor:pointer;appearance:none;outline:none;transition:background .12s ease}@media(hover:hover){:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option):hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent)}}:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option):focus-visible,:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option)[data-focused]{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 16%,transparent)}:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option)[data-expanded]{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent)}:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option)[data-selected]{color:var(--et-theme-color-ink-solid, currentColor);font-weight:500}:is(.et-cascader-panel .et-cascader-node,.et-cascader-panel .et-cascader-search-option)[data-disabled]{cursor:default;opacity:.4}.et-cascader-panel .et-cascader-node-label,.et-cascader-panel .et-cascader-search-option-label{flex:1;min-inline-size:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.et-cascader-panel .et-cascader-search-option-ancestor{color:var(--et-surface-color-muted-solid, currentColor)}.et-cascader-panel .et-cascader-check{position:relative;flex:none;inline-size:16px;block-size:16px;box-sizing:border-box;border:2px solid var(--et-surface-border-solid, rgb(255 255 255 / .3));border-radius:4px;transition:background .12s ease,border-color .12s ease}.et-cascader-panel .et-cascader-check:after{content:\"\";position:absolute;opacity:0}.et-cascader-panel [data-selected]>.et-cascader-check,.et-cascader-panel [data-indeterminate]>.et-cascader-check{border-color:var(--et-theme-color-primary-solid, currentColor);background:var(--et-theme-color-primary-solid, currentColor)}.et-cascader-panel [data-selected]>.et-cascader-check:after{inset-inline-start:4px;inset-block-start:1px;inline-size:4px;block-size:8px;border:solid var(--et-theme-color-on-primary, rgb(0 0 0));border-width:0 2px 2px 0;rotate:45deg;opacity:1}.et-cascader-panel [data-indeterminate]>.et-cascader-check:after{inset-inline-start:2px;inset-block-start:5px;inline-size:8px;block-size:2px;background:var(--et-theme-color-on-primary, rgb(0 0 0));opacity:1}.et-cascader-panel .et-cascader-node-chevron{flex:none;inline-size:12px;block-size:12px;color:var(--et-surface-color-muted-solid, currentColor);rotate:90deg}.et-cascader-panel .et-cascader-state{display:flex;align-items:center;justify-content:center;gap:8px;min-block-size:var(--et-cascader-node-height);padding:12px 16px;text-align:center;color:var(--et-surface-color-muted-solid, currentColor)}.et-cascader-panel .et-cascader-state.et-cascader-state--error{flex-direction:column;gap:8px;font-size:12px}.et-cascader-panel .et-cascader-state-error-message{color:var(--et-theme-color-primary-solid, rgb(248 113 113))}@keyframes et-cascader-title-enter-forward{0%{opacity:0;transform:translate(12px)}}@keyframes et-cascader-title-enter-backward{0%{opacity:0;transform:translate(-12px)}}@keyframes et-cascader-title-leave-forward{to{opacity:0;transform:translate(-12px)}}@keyframes et-cascader-title-leave-backward{to{opacity:0;transform:translate(12px)}}@keyframes et-cascader-title-fade-in{0%{opacity:0}}@keyframes et-cascader-title-fade-out{to{opacity:0}}@keyframes et-cascader-column-in-forward{0%{opacity:0;transform:translate(14px)}}@keyframes et-cascader-column-in-backward{0%{opacity:0;transform:translate(-14px)}}@keyframes et-cascader-column-grow-in{0%{opacity:0;transform:translate(-10px)}}@keyframes et-cascader-crumb-in{0%{opacity:0;transform:translate(8px)}}@keyframes et-cascader-crumb-out{to{opacity:0;transform:translate(8px)}}.et-overlay.et-cascader-sheet{--et-cascader-node-height: 52px;border-radius:16px 16px 0 0}.et-overlay.et-cascader-sheet .et-overlay-container-drag-handle{display:none}.et-overlay.et-cascader-sheet .et-cascader-node,.et-overlay.et-cascader-sheet .et-cascader-search-option{font-size:16px;padding-inline:14px}.et-overlay.et-cascader-sheet .et-cascader-search{padding-inline:20px}.et-overlay.et-cascader-sheet .et-cascader-search input[etcascadersearch]{block-size:44px;font-size:16px}.et-overlay.et-cascader-sheet .et-cascader-node-chevron{inline-size:14px;block-size:14px}.et-overlay.et-cascader-sheet .et-cascader-panel{max-inline-size:none;border:none;border-radius:0;box-shadow:none;padding-block-end:max(8px,env(safe-area-inset-bottom))}.et-overlay.et-cascader-sheet .et-cascader-panel:before{content:\"\";display:block;inline-size:32px;block-size:4px;margin-inline:auto;margin-block:8px 4px;border-radius:999px;background:var(--et-surface-border-solid, rgb(255 255 255 / .2))}@media(prefers-reduced-motion:reduce){.et-cascader-panel .et-cascader-column,.et-cascader-panel .et-cascader-sheet-title,.et-cascader-panel .et-cascader-crumb{animation:none}.et-cascader-panel .et-cascader-back,.et-cascader-panel .et-cascader-sheet-title-shift,.et-cascader-panel .et-cascader-columns-track{transition:none}}}\n"] }]
6746
6746
  }], ctorParameters: () => [], propDecorators: { panelBody: [{ type: i0.ViewChild, args: ['panelBody', { isSignal: true }] }] } });
6747
6747
 
6748
6748
  class CascaderComponent {
@@ -6787,7 +6787,7 @@ class CascaderComponent {
6787
6787
  return !this.isColumnOffstage(columnIndex);
6788
6788
  }
6789
6789
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CascaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
6790
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: CascaderComponent, isStandalone: true, selector: "et-cascader", inputs: { clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null }, backLabel: { classPropertyName: "backLabel", publicName: "backLabel", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-cascader" }, providers: [provideIcons(CHEVRON_ICON, TIMES_ICON)], hostDirectives: [{ directive: CascaderDirective, inputs: ["value", "value", "touched", "touched", "open", "open", "dataSource", "dataSource", "multiple", "multiple", "selectableLevels", "selectableLevels", "compareWith", "compareWith", "toErrorMessage", "toErrorMessage", "mirrorPanelWidth", "mirrorPanelWidth", "maxVisibleColumns", "maxVisibleColumns", "placeholder", "placeholder", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange", "openChange", "openChange", "opened", "opened", "closed", "closed"] }, { directive: i1.ColorInteractiveDirective }], ngImport: i0, template: "<div class=\"et-cascader-trigger\" etCascaderTrigger>\n <span [attr.data-placeholder]=\"!cascader.hasValue() || null\" class=\"et-cascader-value\">\n @if (cascader.displayValue(); as display) {\n {{ display }}\n } @else {\n {{ cascader.placeholder() }}\n }\n </span>\n\n @if (showClear()) {\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n class=\"et-cascader-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n }\n\n <button [disabled]=\"cascader.disabled()\" class=\"et-cascader-arrow\" aria-hidden=\"true\" tabindex=\"-1\" type=\"button\">\n <i etIcon=\"et-chevron\"></i>\n </button>\n</div>\n\n<ng-template etCascaderSurface>\n <et-cascader-panel #panel>\n @if (cascader.canSearch()) {\n <div class=\"et-cascader-search\">\n <input [placeholder]=\"searchPlaceholder()\" etCascaderSearch />\n </div>\n }\n\n @if (panel.isSheet()) {\n <!-- the sheet body is a fixed-height flex column: the header (when present) and the\n column area share it, so the Back bar appearing doesn't change the total sheet\n height \u2014 the column area just flexes to fill, and the panel never resizes -->\n <div class=\"et-cascader-sheet-body\">\n @if (cascader.isSearching()) {\n <ng-container [ngTemplateOutlet]=\"searchResults\" />\n } @else {\n <ng-container [ngTemplateOutlet]=\"sheetBrowse\" />\n }\n </div>\n } @else if (cascader.isSearching()) {\n <ng-container [ngTemplateOutlet]=\"searchResults\" />\n } @else {\n <div [style.--_et-cascader-visible-columns]=\"cascader.visibleColumns().length\" class=\"et-cascader-columns\">\n <!-- every drilled level stays mounted on one translating track: a level collapsing\n into a breadcrumb slides out to the left together with the columns following it,\n and the reverse plays when a crumb brings it back \u2014 the viewport clips the rest -->\n <div\n [style.--_et-cascader-column-window-start]=\"cascader.visibleColumnStart()\"\n class=\"et-cascader-columns-track\"\n >\n @for (column of cascader.columns(); track $index; let columnIndex = $index) {\n <ng-container\n [ngTemplateOutlet]=\"columnBody\"\n [ngTemplateOutletContext]=\"{ $implicit: column, columnIndex }\"\n />\n }\n </div>\n </div>\n\n <!-- the full drilled trail, shown while any level is collapsed out of the window; below\n the columns so mounting never shifts them (the panel's animated block size covers the\n height change). A crumb click anchors the window at its level without truncating. -->\n @if (cascader.breadcrumbPath().length) {\n <div class=\"et-cascader-breadcrumbs\">\n @for (crumb of cascader.breadcrumbPath(); track $index; let last = $last) {\n <span\n class=\"et-cascader-crumb\"\n animate.enter=\"et-cascader-crumb--enter\"\n animate.leave=\"et-cascader-crumb--leave\"\n >\n <button\n [attr.title]=\"crumb.label\"\n [attr.data-current]=\"isCrumbCurrent($index) || null\"\n (click)=\"cascader.showColumn($index)\"\n class=\"et-cascader-breadcrumb\"\n type=\"button\"\n >\n {{ crumb.label }}\n </button>\n @if (!last) {\n <i class=\"et-cascader-breadcrumb-chevron\" etIcon=\"et-chevron\" aria-hidden=\"true\"></i>\n }\n </span>\n }\n </div>\n }\n }\n </et-cascader-panel>\n</ng-template>\n\n<ng-template #sheetBrowse>\n <!-- persistent nav bar (fixed height): only its contents animate, so nothing reflows\n the column list. Back is an absolute overlay (no layout impact); the title slot's\n shift wrapper translates to clear the Back space (transform = reliably smooth,\n unlike a flex width transition), and the title cross-slides on level changes -->\n <div [attr.data-back]=\"cascader.deepestColumnIndex() > 0 || null\" class=\"et-cascader-sheet-header\">\n <button\n [class.et-cascader-back--hidden]=\"cascader.deepestColumnIndex() === 0\"\n [attr.aria-hidden]=\"cascader.deepestColumnIndex() === 0 || null\"\n [attr.tabindex]=\"cascader.deepestColumnIndex() === 0 ? -1 : null\"\n (click)=\"cascader.goBack()\"\n class=\"et-cascader-back\"\n et-text-button\n size=\"sm\"\n type=\"button\"\n >\n <i class=\"et-cascader-back-icon\" etIcon=\"et-chevron\" aria-hidden=\"true\"></i>\n {{ backLabel() }}\n </button>\n\n <span\n [attr.data-nav]=\"cascader.navigationDirection()\"\n [attr.data-anim]=\"cascader.titleAnimation()\"\n class=\"et-cascader-sheet-title-slot\"\n >\n <!-- shifts right (transform) to make room for Back; the title fills it at the root -->\n <span class=\"et-cascader-sheet-title-shift\">\n <!-- keyed by depth so a level change re-creates it: old title slides out in the\n travel direction, new one slides in (both absolutely positioned) -->\n @for (titleKey of [cascader.deepestColumnIndex()]; track titleKey) {\n @let titleParent = cascader.columns()[titleKey]?.parent;\n <span\n class=\"et-cascader-sheet-title\"\n animate.enter=\"et-cascader-sheet-title--enter\"\n animate.leave=\"et-cascader-sheet-title--leave\"\n >{{ titleParent?.label ?? cascader.placeholder() }}</span\n >\n }\n </span>\n </span>\n </div>\n\n <!-- one column at a time, keyed by depth so drilling / going back re-creates it and\n re-fires the slide animation; it scrolls internally within the fixed body -->\n <div class=\"et-cascader-columns\" data-sheet>\n @for (columnIndex of [cascader.deepestColumnIndex()]; track columnIndex) {\n @let sheetColumn = cascader.columns()[columnIndex];\n @if (sheetColumn) {\n <ng-container\n [ngTemplateOutlet]=\"columnBody\"\n [ngTemplateOutletContext]=\"{ $implicit: sheetColumn, columnIndex }\"\n />\n }\n }\n </div>\n</ng-template>\n\n<ng-template #searchResults>\n <div class=\"et-cascader-results\">\n @switch (cascader.searchState().status) {\n @case ('loading') {\n <div class=\"et-cascader-state et-cascader-state--loading\">\n <et-spinner diameter=\"16\" strokeWidth=\"2\" />\n Searching\u2026\n </div>\n }\n @case ('error') {\n <div class=\"et-cascader-state et-cascader-state--error\" role=\"alert\">\n <span [etProvideColor]=\"errorColorTheme\" class=\"et-cascader-state-error-message\">{{\n cascader.searchState().error\n }}</span>\n <button (click)=\"cascader.retrySearch()\" et-text-button size=\"sm\" type=\"button\">Retry</button>\n </div>\n }\n @default {\n @if (cascader.searchState().results.length) {\n @for (result of cascader.searchState().results; track $index) {\n <button\n [path]=\"result\"\n [index]=\"$index\"\n [disabled]=\"resultDisabled(result)\"\n class=\"et-cascader-search-option\"\n etCascaderSearchOption\n type=\"button\"\n >\n @if (cascader.multiple()) {\n <span class=\"et-cascader-check\" aria-hidden=\"true\"></span>\n }\n <span class=\"et-cascader-search-option-label\">\n @for (part of result; track $index; let last = $last) {\n @if (last) {\n {{ part.label }}\n } @else {\n <span class=\"et-cascader-search-option-ancestor\">{{ part.label }} / </span>\n }\n }\n </span>\n </button>\n }\n } @else {\n <div class=\"et-cascader-state et-cascader-state--empty\">No matches</div>\n }\n }\n }\n </div>\n</ng-template>\n\n<ng-template #columnBody let-column let-columnIndex=\"columnIndex\">\n <div\n [etCascaderColumn]=\"columnIndex\"\n [attr.data-nav]=\"columnIndex === cascader.deepestColumnIndex() ? cascader.navigationDirection() : null\"\n [class.et-cascader-column--offstage]=\"isColumnOffstage(columnIndex)\"\n class=\"et-cascader-column\"\n >\n @switch (column.status) {\n @case ('loading') {\n <div class=\"et-cascader-state et-cascader-state--loading\">\n <et-spinner diameter=\"16\" strokeWidth=\"2\" />\n Loading\u2026\n </div>\n }\n @case ('error') {\n <div class=\"et-cascader-state et-cascader-state--error\" role=\"alert\">\n <span [etProvideColor]=\"errorColorTheme\" class=\"et-cascader-state-error-message\">{{ column.error }}</span>\n <button (click)=\"cascader.retryColumn(columnIndex)\" et-text-button size=\"sm\" type=\"button\">Retry</button>\n </div>\n }\n @default {\n @if (column.nodes.length) {\n @for (node of column.nodes; track $index) {\n <button [node]=\"node\" [disabled]=\"node.disabled\" class=\"et-cascader-node\" etCascaderNode type=\"button\">\n @if (cascader.multiple()) {\n <span class=\"et-cascader-check\" aria-hidden=\"true\"></span>\n }\n <span class=\"et-cascader-node-label\">{{ node.label }}</span>\n @if (node.isLeaf !== true && node.hasChildren !== false) {\n <i class=\"et-cascader-node-chevron\" etIcon=\"et-chevron\" aria-hidden=\"true\"></i>\n }\n </button>\n }\n } @else {\n <div class=\"et-cascader-state et-cascader-state--empty\">No options</div>\n }\n }\n }\n </div>\n</ng-template>\n", styles: ["@layer components{et-cascader{display:block;flex:1;min-inline-size:0;color:inherit}et-cascader .et-cascader-trigger{display:flex;align-items:center;gap:4px;inline-size:100%;min-inline-size:0;cursor:pointer;outline:none}et-cascader[data-disabled] .et-cascader-trigger{cursor:not-allowed}et-cascader .et-cascader-value{flex:1;min-inline-size:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:inherit}et-cascader .et-cascader-value[data-placeholder]{color:color-mix(in srgb,currentColor 46%,transparent)}et-cascader .et-cascader-clear,et-cascader .et-cascader-arrow{display:flex;align-items:center;justify-content:center;flex:none;inline-size:20px;block-size:20px;padding:0;border:none;border-radius:4px;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;outline:none}:is(et-cascader .et-cascader-clear,et-cascader .et-cascader-arrow) .et-icon{inline-size:14px;block-size:14px}:is(et-cascader .et-cascader-clear,et-cascader .et-cascader-arrow):hover{color:var(--et-surface-color-solid, currentColor)}:is(et-cascader .et-cascader-clear,et-cascader .et-cascader-arrow):disabled{cursor:default;color:inherit}et-cascader .et-cascader-arrow .et-icon{rotate:180deg}}\n"], dependencies: [{ kind: "directive", type: CascaderTriggerDirective, selector: "[etCascaderTrigger]", exportAs: ["etCascaderTrigger"] }, { kind: "directive", type: CascaderSurfaceDirective, selector: "ng-template[etCascaderSurface]", exportAs: ["etCascaderSurface"] }, { kind: "directive", type: CascaderColumnDirective, selector: "[etCascaderColumn]", inputs: ["etCascaderColumn"], exportAs: ["etCascaderColumn"] }, { kind: "directive", type: CascaderNodeDirective, selector: "[etCascaderNode]", inputs: ["node"], exportAs: ["etCascaderNode"] }, { kind: "directive", type: CascaderSearchDirective, selector: "input[etCascaderSearch]", exportAs: ["etCascaderSearch"] }, { kind: "directive", type: CascaderSearchOptionDirective, selector: "[etCascaderSearchOption]", inputs: ["path", "index"], exportAs: ["etCascaderSearchOption"] }, { kind: "component", type: CascaderPanelComponent, selector: "et-cascader-panel" }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }, { kind: "component", type: TextButtonComponent, selector: "[et-text-button]", inputs: ["size", "iconAlignment"] }, { kind: "directive", type: ProvideColorDirective, selector: "[etProvideColor]", inputs: ["etProvideColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
6790
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: CascaderComponent, isStandalone: true, selector: "et-cascader", inputs: { clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null }, backLabel: { classPropertyName: "backLabel", publicName: "backLabel", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-cascader" }, providers: [provideIcons(CHEVRON_ICON, TIMES_ICON)], hostDirectives: [{ directive: CascaderDirective, inputs: ["value", "value", "touched", "touched", "open", "open", "dataSource", "dataSource", "multiple", "multiple", "selectableLevels", "selectableLevels", "compareWith", "compareWith", "toErrorMessage", "toErrorMessage", "mirrorPanelWidth", "mirrorPanelWidth", "maxVisibleColumns", "maxVisibleColumns", "placeholder", "placeholder", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange", "openChange", "openChange", "opened", "opened", "closed", "closed"] }, { directive: i1.ColorInteractiveDirective }], ngImport: i0, template: "<div class=\"et-cascader-trigger\" etCascaderTrigger>\n <span [attr.data-placeholder]=\"!cascader.hasValue() || null\" class=\"et-cascader-value\">\n @if (cascader.displayValue(); as display) {\n {{ display }}\n } @else {\n {{ cascader.placeholder() }}\n }\n </span>\n\n @if (showClear()) {\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n class=\"et-cascader-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n }\n\n <button [disabled]=\"cascader.disabled()\" class=\"et-cascader-arrow\" aria-hidden=\"true\" tabindex=\"-1\" type=\"button\">\n <i etIcon=\"et-chevron\"></i>\n </button>\n</div>\n\n<ng-template etCascaderSurface>\n <et-cascader-panel #panel>\n @if (cascader.canSearch()) {\n <div class=\"et-cascader-search\">\n <input [placeholder]=\"searchPlaceholder()\" etCascaderSearch />\n </div>\n }\n\n @if (panel.isSheet()) {\n <!-- the sheet body is a fixed-height flex column: the header (when present) and the\n column area share it, so the Back bar appearing doesn't change the total sheet\n height \u2014 the column area just flexes to fill, and the panel never resizes -->\n <div class=\"et-cascader-sheet-body\">\n @if (cascader.isSearching()) {\n <ng-container [ngTemplateOutlet]=\"searchResults\" />\n } @else {\n <ng-container [ngTemplateOutlet]=\"sheetBrowse\" />\n }\n </div>\n } @else if (cascader.isSearching()) {\n <ng-container [ngTemplateOutlet]=\"searchResults\" />\n } @else {\n <div [style.--_et-cascader-visible-columns]=\"cascader.visibleColumns().length\" class=\"et-cascader-columns\">\n <!-- every drilled level stays mounted on one translating track: a level collapsing\n into a breadcrumb slides out to the left together with the columns following it,\n and the reverse plays when a crumb brings it back \u2014 the viewport clips the rest -->\n <div\n [style.--_et-cascader-column-window-start]=\"cascader.visibleColumnStart()\"\n class=\"et-cascader-columns-track\"\n >\n @for (column of cascader.columns(); track $index; let columnIndex = $index) {\n <ng-container\n [ngTemplateOutlet]=\"columnBody\"\n [ngTemplateOutletContext]=\"{ $implicit: column, columnIndex }\"\n />\n }\n </div>\n </div>\n\n <!-- the full drilled trail, shown while any level is collapsed out of the window; below\n the columns so mounting never shifts them (the panel's animated block size covers the\n height change). A crumb click anchors the window at its level without truncating. -->\n @if (cascader.breadcrumbPath().length) {\n <div class=\"et-cascader-breadcrumbs\">\n @for (crumb of cascader.breadcrumbPath(); track $index; let last = $last) {\n <span\n class=\"et-cascader-crumb\"\n animate.enter=\"et-cascader-crumb--enter\"\n animate.leave=\"et-cascader-crumb--leave\"\n >\n <button\n [attr.title]=\"crumb.label\"\n [attr.data-current]=\"isCrumbCurrent($index) || null\"\n (click)=\"cascader.showColumn($index)\"\n class=\"et-cascader-breadcrumb\"\n type=\"button\"\n >\n {{ crumb.label }}\n </button>\n @if (!last) {\n <i class=\"et-cascader-breadcrumb-chevron\" etIcon=\"et-chevron\" aria-hidden=\"true\"></i>\n }\n </span>\n }\n </div>\n }\n }\n </et-cascader-panel>\n</ng-template>\n\n<ng-template #sheetBrowse>\n <!-- persistent nav bar (fixed height): only its contents animate, so nothing reflows\n the column list. Back is an absolute overlay (no layout impact); the title slot's\n shift wrapper translates to clear the Back space (transform = reliably smooth,\n unlike a flex width transition), and the title cross-slides on level changes -->\n <div [attr.data-back]=\"cascader.deepestColumnIndex() > 0 || null\" class=\"et-cascader-sheet-header\">\n <button\n [class.et-cascader-back--hidden]=\"cascader.deepestColumnIndex() === 0\"\n [attr.aria-hidden]=\"cascader.deepestColumnIndex() === 0 || null\"\n [attr.tabindex]=\"cascader.deepestColumnIndex() === 0 ? -1 : null\"\n (click)=\"cascader.goBack()\"\n class=\"et-cascader-back\"\n et-text-button\n size=\"sm\"\n type=\"button\"\n >\n <i class=\"et-cascader-back-icon\" etIcon=\"et-chevron\" aria-hidden=\"true\"></i>\n {{ backLabel() }}\n </button>\n\n <span\n [attr.data-nav]=\"cascader.navigationDirection()\"\n [attr.data-anim]=\"cascader.titleAnimation()\"\n class=\"et-cascader-sheet-title-slot\"\n >\n <!-- shifts right (transform) to make room for Back; the title fills it at the root -->\n <span class=\"et-cascader-sheet-title-shift\">\n <!-- keyed by depth so a level change re-creates it: old title slides out in the\n travel direction, new one slides in (both absolutely positioned) -->\n @for (titleKey of [cascader.deepestColumnIndex()]; track titleKey) {\n @let titleParent = cascader.columns()[titleKey]?.parent;\n <span\n class=\"et-cascader-sheet-title\"\n animate.enter=\"et-cascader-sheet-title--enter\"\n animate.leave=\"et-cascader-sheet-title--leave\"\n >{{ titleParent?.label ?? cascader.placeholder() }}</span\n >\n }\n </span>\n </span>\n </div>\n\n <!-- one column at a time, keyed by depth so drilling / going back re-creates it and\n re-fires the slide animation; it scrolls internally within the fixed body -->\n <div class=\"et-cascader-columns\" data-sheet>\n @for (columnIndex of [cascader.deepestColumnIndex()]; track columnIndex) {\n @let sheetColumn = cascader.columns()[columnIndex];\n @if (sheetColumn) {\n <ng-container\n [ngTemplateOutlet]=\"columnBody\"\n [ngTemplateOutletContext]=\"{ $implicit: sheetColumn, columnIndex }\"\n />\n }\n }\n </div>\n</ng-template>\n\n<ng-template #searchResults>\n <div class=\"et-cascader-results\">\n @switch (cascader.searchState().status) {\n @case ('loading') {\n <div class=\"et-cascader-state et-cascader-state--loading\">\n <et-spinner diameter=\"16\" strokeWidth=\"2\" />\n Searching\u2026\n </div>\n }\n @case ('error') {\n <div class=\"et-cascader-state et-cascader-state--error\" role=\"alert\">\n <span [etProvideColor]=\"errorColorTheme\" class=\"et-cascader-state-error-message\">{{\n cascader.searchState().error\n }}</span>\n <button (click)=\"cascader.retrySearch()\" et-text-button size=\"sm\" type=\"button\">Retry</button>\n </div>\n }\n @default {\n @if (cascader.searchState().results.length) {\n @for (result of cascader.searchState().results; track $index) {\n <button\n [path]=\"result\"\n [index]=\"$index\"\n [disabled]=\"resultDisabled(result)\"\n class=\"et-cascader-search-option\"\n etCascaderSearchOption\n type=\"button\"\n >\n @if (cascader.multiple()) {\n <span class=\"et-cascader-check\" aria-hidden=\"true\"></span>\n }\n <span class=\"et-cascader-search-option-label\">\n @for (part of result; track $index; let last = $last) {\n @if (last) {\n {{ part.label }}\n } @else {\n <span class=\"et-cascader-search-option-ancestor\">{{ part.label }} / </span>\n }\n }\n </span>\n </button>\n }\n } @else {\n <div class=\"et-cascader-state et-cascader-state--empty\">No matches</div>\n }\n }\n }\n </div>\n</ng-template>\n\n<ng-template #columnBody let-column let-columnIndex=\"columnIndex\">\n <div\n [etCascaderColumn]=\"columnIndex\"\n [attr.data-nav]=\"columnIndex === cascader.deepestColumnIndex() ? cascader.navigationDirection() : null\"\n [class.et-cascader-column--offstage]=\"isColumnOffstage(columnIndex)\"\n class=\"et-cascader-column\"\n >\n @switch (column.status) {\n @case ('loading') {\n <div class=\"et-cascader-state et-cascader-state--loading\">\n <et-spinner diameter=\"16\" strokeWidth=\"2\" />\n Loading\u2026\n </div>\n }\n @case ('error') {\n <div class=\"et-cascader-state et-cascader-state--error\" role=\"alert\">\n <span [etProvideColor]=\"errorColorTheme\" class=\"et-cascader-state-error-message\">{{ column.error }}</span>\n <button (click)=\"cascader.retryColumn(columnIndex)\" et-text-button size=\"sm\" type=\"button\">Retry</button>\n </div>\n }\n @default {\n @if (column.nodes.length) {\n @for (node of column.nodes; track $index) {\n <button [node]=\"node\" [disabled]=\"node.disabled\" class=\"et-cascader-node\" etCascaderNode type=\"button\">\n @if (cascader.multiple()) {\n <span class=\"et-cascader-check\" aria-hidden=\"true\"></span>\n }\n <span class=\"et-cascader-node-label\">{{ node.label }}</span>\n @if (node.isLeaf !== true && node.hasChildren !== false) {\n <i class=\"et-cascader-node-chevron\" etIcon=\"et-chevron\" aria-hidden=\"true\"></i>\n }\n </button>\n }\n } @else {\n <div class=\"et-cascader-state et-cascader-state--empty\">No options</div>\n }\n }\n }\n </div>\n</ng-template>\n", styles: ["@layer components{et-cascader{display:block;flex:1;min-inline-size:0;color:inherit}et-cascader .et-cascader-trigger{display:flex;align-items:center;gap:4px;inline-size:100%;min-inline-size:0;cursor:pointer;outline:none}et-cascader[data-disabled] .et-cascader-trigger{cursor:not-allowed}et-cascader .et-cascader-value{flex:1;min-inline-size:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:inherit}et-cascader .et-cascader-value[data-placeholder]{color:color-mix(in srgb,currentColor 46%,transparent)}et-cascader .et-cascader-clear,et-cascader .et-cascader-arrow{display:flex;align-items:center;justify-content:center;flex:none;inline-size:20px;block-size:20px;padding:0;border:none;border-radius:4px;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;outline:none}:is(et-cascader .et-cascader-clear,et-cascader .et-cascader-arrow) .et-icon{inline-size:14px;block-size:14px}@media(hover:hover){:is(et-cascader .et-cascader-clear,et-cascader .et-cascader-arrow):hover{color:var(--et-surface-color-solid, currentColor)}}:is(et-cascader .et-cascader-clear,et-cascader .et-cascader-arrow):disabled{cursor:default;color:inherit}et-cascader .et-cascader-arrow .et-icon{rotate:180deg}}\n"], dependencies: [{ kind: "directive", type: CascaderTriggerDirective, selector: "[etCascaderTrigger]", exportAs: ["etCascaderTrigger"] }, { kind: "directive", type: CascaderSurfaceDirective, selector: "ng-template[etCascaderSurface]", exportAs: ["etCascaderSurface"] }, { kind: "directive", type: CascaderColumnDirective, selector: "[etCascaderColumn]", inputs: ["etCascaderColumn"], exportAs: ["etCascaderColumn"] }, { kind: "directive", type: CascaderNodeDirective, selector: "[etCascaderNode]", inputs: ["node"], exportAs: ["etCascaderNode"] }, { kind: "directive", type: CascaderSearchDirective, selector: "input[etCascaderSearch]", exportAs: ["etCascaderSearch"] }, { kind: "directive", type: CascaderSearchOptionDirective, selector: "[etCascaderSearchOption]", inputs: ["path", "index"], exportAs: ["etCascaderSearchOption"] }, { kind: "component", type: CascaderPanelComponent, selector: "et-cascader-panel" }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }, { kind: "component", type: TextButtonComponent, selector: "[et-text-button]", inputs: ["size", "iconAlignment"] }, { kind: "directive", type: ProvideColorDirective, selector: "[etProvideColor]", inputs: ["etProvideColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
6791
6791
  }
6792
6792
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CascaderComponent, decorators: [{
6793
6793
  type: Component,
@@ -6831,7 +6831,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
6831
6831
  ColorInteractiveDirective,
6832
6832
  ], host: {
6833
6833
  class: 'et-cascader',
6834
- }, template: "<div class=\"et-cascader-trigger\" etCascaderTrigger>\n <span [attr.data-placeholder]=\"!cascader.hasValue() || null\" class=\"et-cascader-value\">\n @if (cascader.displayValue(); as display) {\n {{ display }}\n } @else {\n {{ cascader.placeholder() }}\n }\n </span>\n\n @if (showClear()) {\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n class=\"et-cascader-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n }\n\n <button [disabled]=\"cascader.disabled()\" class=\"et-cascader-arrow\" aria-hidden=\"true\" tabindex=\"-1\" type=\"button\">\n <i etIcon=\"et-chevron\"></i>\n </button>\n</div>\n\n<ng-template etCascaderSurface>\n <et-cascader-panel #panel>\n @if (cascader.canSearch()) {\n <div class=\"et-cascader-search\">\n <input [placeholder]=\"searchPlaceholder()\" etCascaderSearch />\n </div>\n }\n\n @if (panel.isSheet()) {\n <!-- the sheet body is a fixed-height flex column: the header (when present) and the\n column area share it, so the Back bar appearing doesn't change the total sheet\n height \u2014 the column area just flexes to fill, and the panel never resizes -->\n <div class=\"et-cascader-sheet-body\">\n @if (cascader.isSearching()) {\n <ng-container [ngTemplateOutlet]=\"searchResults\" />\n } @else {\n <ng-container [ngTemplateOutlet]=\"sheetBrowse\" />\n }\n </div>\n } @else if (cascader.isSearching()) {\n <ng-container [ngTemplateOutlet]=\"searchResults\" />\n } @else {\n <div [style.--_et-cascader-visible-columns]=\"cascader.visibleColumns().length\" class=\"et-cascader-columns\">\n <!-- every drilled level stays mounted on one translating track: a level collapsing\n into a breadcrumb slides out to the left together with the columns following it,\n and the reverse plays when a crumb brings it back \u2014 the viewport clips the rest -->\n <div\n [style.--_et-cascader-column-window-start]=\"cascader.visibleColumnStart()\"\n class=\"et-cascader-columns-track\"\n >\n @for (column of cascader.columns(); track $index; let columnIndex = $index) {\n <ng-container\n [ngTemplateOutlet]=\"columnBody\"\n [ngTemplateOutletContext]=\"{ $implicit: column, columnIndex }\"\n />\n }\n </div>\n </div>\n\n <!-- the full drilled trail, shown while any level is collapsed out of the window; below\n the columns so mounting never shifts them (the panel's animated block size covers the\n height change). A crumb click anchors the window at its level without truncating. -->\n @if (cascader.breadcrumbPath().length) {\n <div class=\"et-cascader-breadcrumbs\">\n @for (crumb of cascader.breadcrumbPath(); track $index; let last = $last) {\n <span\n class=\"et-cascader-crumb\"\n animate.enter=\"et-cascader-crumb--enter\"\n animate.leave=\"et-cascader-crumb--leave\"\n >\n <button\n [attr.title]=\"crumb.label\"\n [attr.data-current]=\"isCrumbCurrent($index) || null\"\n (click)=\"cascader.showColumn($index)\"\n class=\"et-cascader-breadcrumb\"\n type=\"button\"\n >\n {{ crumb.label }}\n </button>\n @if (!last) {\n <i class=\"et-cascader-breadcrumb-chevron\" etIcon=\"et-chevron\" aria-hidden=\"true\"></i>\n }\n </span>\n }\n </div>\n }\n }\n </et-cascader-panel>\n</ng-template>\n\n<ng-template #sheetBrowse>\n <!-- persistent nav bar (fixed height): only its contents animate, so nothing reflows\n the column list. Back is an absolute overlay (no layout impact); the title slot's\n shift wrapper translates to clear the Back space (transform = reliably smooth,\n unlike a flex width transition), and the title cross-slides on level changes -->\n <div [attr.data-back]=\"cascader.deepestColumnIndex() > 0 || null\" class=\"et-cascader-sheet-header\">\n <button\n [class.et-cascader-back--hidden]=\"cascader.deepestColumnIndex() === 0\"\n [attr.aria-hidden]=\"cascader.deepestColumnIndex() === 0 || null\"\n [attr.tabindex]=\"cascader.deepestColumnIndex() === 0 ? -1 : null\"\n (click)=\"cascader.goBack()\"\n class=\"et-cascader-back\"\n et-text-button\n size=\"sm\"\n type=\"button\"\n >\n <i class=\"et-cascader-back-icon\" etIcon=\"et-chevron\" aria-hidden=\"true\"></i>\n {{ backLabel() }}\n </button>\n\n <span\n [attr.data-nav]=\"cascader.navigationDirection()\"\n [attr.data-anim]=\"cascader.titleAnimation()\"\n class=\"et-cascader-sheet-title-slot\"\n >\n <!-- shifts right (transform) to make room for Back; the title fills it at the root -->\n <span class=\"et-cascader-sheet-title-shift\">\n <!-- keyed by depth so a level change re-creates it: old title slides out in the\n travel direction, new one slides in (both absolutely positioned) -->\n @for (titleKey of [cascader.deepestColumnIndex()]; track titleKey) {\n @let titleParent = cascader.columns()[titleKey]?.parent;\n <span\n class=\"et-cascader-sheet-title\"\n animate.enter=\"et-cascader-sheet-title--enter\"\n animate.leave=\"et-cascader-sheet-title--leave\"\n >{{ titleParent?.label ?? cascader.placeholder() }}</span\n >\n }\n </span>\n </span>\n </div>\n\n <!-- one column at a time, keyed by depth so drilling / going back re-creates it and\n re-fires the slide animation; it scrolls internally within the fixed body -->\n <div class=\"et-cascader-columns\" data-sheet>\n @for (columnIndex of [cascader.deepestColumnIndex()]; track columnIndex) {\n @let sheetColumn = cascader.columns()[columnIndex];\n @if (sheetColumn) {\n <ng-container\n [ngTemplateOutlet]=\"columnBody\"\n [ngTemplateOutletContext]=\"{ $implicit: sheetColumn, columnIndex }\"\n />\n }\n }\n </div>\n</ng-template>\n\n<ng-template #searchResults>\n <div class=\"et-cascader-results\">\n @switch (cascader.searchState().status) {\n @case ('loading') {\n <div class=\"et-cascader-state et-cascader-state--loading\">\n <et-spinner diameter=\"16\" strokeWidth=\"2\" />\n Searching\u2026\n </div>\n }\n @case ('error') {\n <div class=\"et-cascader-state et-cascader-state--error\" role=\"alert\">\n <span [etProvideColor]=\"errorColorTheme\" class=\"et-cascader-state-error-message\">{{\n cascader.searchState().error\n }}</span>\n <button (click)=\"cascader.retrySearch()\" et-text-button size=\"sm\" type=\"button\">Retry</button>\n </div>\n }\n @default {\n @if (cascader.searchState().results.length) {\n @for (result of cascader.searchState().results; track $index) {\n <button\n [path]=\"result\"\n [index]=\"$index\"\n [disabled]=\"resultDisabled(result)\"\n class=\"et-cascader-search-option\"\n etCascaderSearchOption\n type=\"button\"\n >\n @if (cascader.multiple()) {\n <span class=\"et-cascader-check\" aria-hidden=\"true\"></span>\n }\n <span class=\"et-cascader-search-option-label\">\n @for (part of result; track $index; let last = $last) {\n @if (last) {\n {{ part.label }}\n } @else {\n <span class=\"et-cascader-search-option-ancestor\">{{ part.label }} / </span>\n }\n }\n </span>\n </button>\n }\n } @else {\n <div class=\"et-cascader-state et-cascader-state--empty\">No matches</div>\n }\n }\n }\n </div>\n</ng-template>\n\n<ng-template #columnBody let-column let-columnIndex=\"columnIndex\">\n <div\n [etCascaderColumn]=\"columnIndex\"\n [attr.data-nav]=\"columnIndex === cascader.deepestColumnIndex() ? cascader.navigationDirection() : null\"\n [class.et-cascader-column--offstage]=\"isColumnOffstage(columnIndex)\"\n class=\"et-cascader-column\"\n >\n @switch (column.status) {\n @case ('loading') {\n <div class=\"et-cascader-state et-cascader-state--loading\">\n <et-spinner diameter=\"16\" strokeWidth=\"2\" />\n Loading\u2026\n </div>\n }\n @case ('error') {\n <div class=\"et-cascader-state et-cascader-state--error\" role=\"alert\">\n <span [etProvideColor]=\"errorColorTheme\" class=\"et-cascader-state-error-message\">{{ column.error }}</span>\n <button (click)=\"cascader.retryColumn(columnIndex)\" et-text-button size=\"sm\" type=\"button\">Retry</button>\n </div>\n }\n @default {\n @if (column.nodes.length) {\n @for (node of column.nodes; track $index) {\n <button [node]=\"node\" [disabled]=\"node.disabled\" class=\"et-cascader-node\" etCascaderNode type=\"button\">\n @if (cascader.multiple()) {\n <span class=\"et-cascader-check\" aria-hidden=\"true\"></span>\n }\n <span class=\"et-cascader-node-label\">{{ node.label }}</span>\n @if (node.isLeaf !== true && node.hasChildren !== false) {\n <i class=\"et-cascader-node-chevron\" etIcon=\"et-chevron\" aria-hidden=\"true\"></i>\n }\n </button>\n }\n } @else {\n <div class=\"et-cascader-state et-cascader-state--empty\">No options</div>\n }\n }\n }\n </div>\n</ng-template>\n", styles: ["@layer components{et-cascader{display:block;flex:1;min-inline-size:0;color:inherit}et-cascader .et-cascader-trigger{display:flex;align-items:center;gap:4px;inline-size:100%;min-inline-size:0;cursor:pointer;outline:none}et-cascader[data-disabled] .et-cascader-trigger{cursor:not-allowed}et-cascader .et-cascader-value{flex:1;min-inline-size:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:inherit}et-cascader .et-cascader-value[data-placeholder]{color:color-mix(in srgb,currentColor 46%,transparent)}et-cascader .et-cascader-clear,et-cascader .et-cascader-arrow{display:flex;align-items:center;justify-content:center;flex:none;inline-size:20px;block-size:20px;padding:0;border:none;border-radius:4px;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;outline:none}:is(et-cascader .et-cascader-clear,et-cascader .et-cascader-arrow) .et-icon{inline-size:14px;block-size:14px}:is(et-cascader .et-cascader-clear,et-cascader .et-cascader-arrow):hover{color:var(--et-surface-color-solid, currentColor)}:is(et-cascader .et-cascader-clear,et-cascader .et-cascader-arrow):disabled{cursor:default;color:inherit}et-cascader .et-cascader-arrow .et-icon{rotate:180deg}}\n"] }]
6834
+ }, template: "<div class=\"et-cascader-trigger\" etCascaderTrigger>\n <span [attr.data-placeholder]=\"!cascader.hasValue() || null\" class=\"et-cascader-value\">\n @if (cascader.displayValue(); as display) {\n {{ display }}\n } @else {\n {{ cascader.placeholder() }}\n }\n </span>\n\n @if (showClear()) {\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n class=\"et-cascader-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n }\n\n <button [disabled]=\"cascader.disabled()\" class=\"et-cascader-arrow\" aria-hidden=\"true\" tabindex=\"-1\" type=\"button\">\n <i etIcon=\"et-chevron\"></i>\n </button>\n</div>\n\n<ng-template etCascaderSurface>\n <et-cascader-panel #panel>\n @if (cascader.canSearch()) {\n <div class=\"et-cascader-search\">\n <input [placeholder]=\"searchPlaceholder()\" etCascaderSearch />\n </div>\n }\n\n @if (panel.isSheet()) {\n <!-- the sheet body is a fixed-height flex column: the header (when present) and the\n column area share it, so the Back bar appearing doesn't change the total sheet\n height \u2014 the column area just flexes to fill, and the panel never resizes -->\n <div class=\"et-cascader-sheet-body\">\n @if (cascader.isSearching()) {\n <ng-container [ngTemplateOutlet]=\"searchResults\" />\n } @else {\n <ng-container [ngTemplateOutlet]=\"sheetBrowse\" />\n }\n </div>\n } @else if (cascader.isSearching()) {\n <ng-container [ngTemplateOutlet]=\"searchResults\" />\n } @else {\n <div [style.--_et-cascader-visible-columns]=\"cascader.visibleColumns().length\" class=\"et-cascader-columns\">\n <!-- every drilled level stays mounted on one translating track: a level collapsing\n into a breadcrumb slides out to the left together with the columns following it,\n and the reverse plays when a crumb brings it back \u2014 the viewport clips the rest -->\n <div\n [style.--_et-cascader-column-window-start]=\"cascader.visibleColumnStart()\"\n class=\"et-cascader-columns-track\"\n >\n @for (column of cascader.columns(); track $index; let columnIndex = $index) {\n <ng-container\n [ngTemplateOutlet]=\"columnBody\"\n [ngTemplateOutletContext]=\"{ $implicit: column, columnIndex }\"\n />\n }\n </div>\n </div>\n\n <!-- the full drilled trail, shown while any level is collapsed out of the window; below\n the columns so mounting never shifts them (the panel's animated block size covers the\n height change). A crumb click anchors the window at its level without truncating. -->\n @if (cascader.breadcrumbPath().length) {\n <div class=\"et-cascader-breadcrumbs\">\n @for (crumb of cascader.breadcrumbPath(); track $index; let last = $last) {\n <span\n class=\"et-cascader-crumb\"\n animate.enter=\"et-cascader-crumb--enter\"\n animate.leave=\"et-cascader-crumb--leave\"\n >\n <button\n [attr.title]=\"crumb.label\"\n [attr.data-current]=\"isCrumbCurrent($index) || null\"\n (click)=\"cascader.showColumn($index)\"\n class=\"et-cascader-breadcrumb\"\n type=\"button\"\n >\n {{ crumb.label }}\n </button>\n @if (!last) {\n <i class=\"et-cascader-breadcrumb-chevron\" etIcon=\"et-chevron\" aria-hidden=\"true\"></i>\n }\n </span>\n }\n </div>\n }\n }\n </et-cascader-panel>\n</ng-template>\n\n<ng-template #sheetBrowse>\n <!-- persistent nav bar (fixed height): only its contents animate, so nothing reflows\n the column list. Back is an absolute overlay (no layout impact); the title slot's\n shift wrapper translates to clear the Back space (transform = reliably smooth,\n unlike a flex width transition), and the title cross-slides on level changes -->\n <div [attr.data-back]=\"cascader.deepestColumnIndex() > 0 || null\" class=\"et-cascader-sheet-header\">\n <button\n [class.et-cascader-back--hidden]=\"cascader.deepestColumnIndex() === 0\"\n [attr.aria-hidden]=\"cascader.deepestColumnIndex() === 0 || null\"\n [attr.tabindex]=\"cascader.deepestColumnIndex() === 0 ? -1 : null\"\n (click)=\"cascader.goBack()\"\n class=\"et-cascader-back\"\n et-text-button\n size=\"sm\"\n type=\"button\"\n >\n <i class=\"et-cascader-back-icon\" etIcon=\"et-chevron\" aria-hidden=\"true\"></i>\n {{ backLabel() }}\n </button>\n\n <span\n [attr.data-nav]=\"cascader.navigationDirection()\"\n [attr.data-anim]=\"cascader.titleAnimation()\"\n class=\"et-cascader-sheet-title-slot\"\n >\n <!-- shifts right (transform) to make room for Back; the title fills it at the root -->\n <span class=\"et-cascader-sheet-title-shift\">\n <!-- keyed by depth so a level change re-creates it: old title slides out in the\n travel direction, new one slides in (both absolutely positioned) -->\n @for (titleKey of [cascader.deepestColumnIndex()]; track titleKey) {\n @let titleParent = cascader.columns()[titleKey]?.parent;\n <span\n class=\"et-cascader-sheet-title\"\n animate.enter=\"et-cascader-sheet-title--enter\"\n animate.leave=\"et-cascader-sheet-title--leave\"\n >{{ titleParent?.label ?? cascader.placeholder() }}</span\n >\n }\n </span>\n </span>\n </div>\n\n <!-- one column at a time, keyed by depth so drilling / going back re-creates it and\n re-fires the slide animation; it scrolls internally within the fixed body -->\n <div class=\"et-cascader-columns\" data-sheet>\n @for (columnIndex of [cascader.deepestColumnIndex()]; track columnIndex) {\n @let sheetColumn = cascader.columns()[columnIndex];\n @if (sheetColumn) {\n <ng-container\n [ngTemplateOutlet]=\"columnBody\"\n [ngTemplateOutletContext]=\"{ $implicit: sheetColumn, columnIndex }\"\n />\n }\n }\n </div>\n</ng-template>\n\n<ng-template #searchResults>\n <div class=\"et-cascader-results\">\n @switch (cascader.searchState().status) {\n @case ('loading') {\n <div class=\"et-cascader-state et-cascader-state--loading\">\n <et-spinner diameter=\"16\" strokeWidth=\"2\" />\n Searching\u2026\n </div>\n }\n @case ('error') {\n <div class=\"et-cascader-state et-cascader-state--error\" role=\"alert\">\n <span [etProvideColor]=\"errorColorTheme\" class=\"et-cascader-state-error-message\">{{\n cascader.searchState().error\n }}</span>\n <button (click)=\"cascader.retrySearch()\" et-text-button size=\"sm\" type=\"button\">Retry</button>\n </div>\n }\n @default {\n @if (cascader.searchState().results.length) {\n @for (result of cascader.searchState().results; track $index) {\n <button\n [path]=\"result\"\n [index]=\"$index\"\n [disabled]=\"resultDisabled(result)\"\n class=\"et-cascader-search-option\"\n etCascaderSearchOption\n type=\"button\"\n >\n @if (cascader.multiple()) {\n <span class=\"et-cascader-check\" aria-hidden=\"true\"></span>\n }\n <span class=\"et-cascader-search-option-label\">\n @for (part of result; track $index; let last = $last) {\n @if (last) {\n {{ part.label }}\n } @else {\n <span class=\"et-cascader-search-option-ancestor\">{{ part.label }} / </span>\n }\n }\n </span>\n </button>\n }\n } @else {\n <div class=\"et-cascader-state et-cascader-state--empty\">No matches</div>\n }\n }\n }\n </div>\n</ng-template>\n\n<ng-template #columnBody let-column let-columnIndex=\"columnIndex\">\n <div\n [etCascaderColumn]=\"columnIndex\"\n [attr.data-nav]=\"columnIndex === cascader.deepestColumnIndex() ? cascader.navigationDirection() : null\"\n [class.et-cascader-column--offstage]=\"isColumnOffstage(columnIndex)\"\n class=\"et-cascader-column\"\n >\n @switch (column.status) {\n @case ('loading') {\n <div class=\"et-cascader-state et-cascader-state--loading\">\n <et-spinner diameter=\"16\" strokeWidth=\"2\" />\n Loading\u2026\n </div>\n }\n @case ('error') {\n <div class=\"et-cascader-state et-cascader-state--error\" role=\"alert\">\n <span [etProvideColor]=\"errorColorTheme\" class=\"et-cascader-state-error-message\">{{ column.error }}</span>\n <button (click)=\"cascader.retryColumn(columnIndex)\" et-text-button size=\"sm\" type=\"button\">Retry</button>\n </div>\n }\n @default {\n @if (column.nodes.length) {\n @for (node of column.nodes; track $index) {\n <button [node]=\"node\" [disabled]=\"node.disabled\" class=\"et-cascader-node\" etCascaderNode type=\"button\">\n @if (cascader.multiple()) {\n <span class=\"et-cascader-check\" aria-hidden=\"true\"></span>\n }\n <span class=\"et-cascader-node-label\">{{ node.label }}</span>\n @if (node.isLeaf !== true && node.hasChildren !== false) {\n <i class=\"et-cascader-node-chevron\" etIcon=\"et-chevron\" aria-hidden=\"true\"></i>\n }\n </button>\n }\n } @else {\n <div class=\"et-cascader-state et-cascader-state--empty\">No options</div>\n }\n }\n }\n </div>\n</ng-template>\n", styles: ["@layer components{et-cascader{display:block;flex:1;min-inline-size:0;color:inherit}et-cascader .et-cascader-trigger{display:flex;align-items:center;gap:4px;inline-size:100%;min-inline-size:0;cursor:pointer;outline:none}et-cascader[data-disabled] .et-cascader-trigger{cursor:not-allowed}et-cascader .et-cascader-value{flex:1;min-inline-size:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:inherit}et-cascader .et-cascader-value[data-placeholder]{color:color-mix(in srgb,currentColor 46%,transparent)}et-cascader .et-cascader-clear,et-cascader .et-cascader-arrow{display:flex;align-items:center;justify-content:center;flex:none;inline-size:20px;block-size:20px;padding:0;border:none;border-radius:4px;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;outline:none}:is(et-cascader .et-cascader-clear,et-cascader .et-cascader-arrow) .et-icon{inline-size:14px;block-size:14px}@media(hover:hover){:is(et-cascader .et-cascader-clear,et-cascader .et-cascader-arrow):hover{color:var(--et-surface-color-solid, currentColor)}}:is(et-cascader .et-cascader-clear,et-cascader .et-cascader-arrow):disabled{cursor:default;color:inherit}et-cascader .et-cascader-arrow .et-icon{rotate:180deg}}\n"] }]
6835
6835
  }], propDecorators: { clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], clearLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearLabel", required: false }] }], backLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "backLabel", required: false }] }], searchPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchPlaceholder", required: false }] }] } });
6836
6836
 
6837
6837
  const CASCADER_IMPORTS = [
@@ -6975,7 +6975,7 @@ class CheckboxComponent {
6975
6975
  });
6976
6976
  }
6977
6977
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
6978
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.5", type: CheckboxComponent, isStandalone: true, selector: "et-checkbox", host: { properties: { "attr.data-can-animate": "canAnimate.state() || null" }, classAttribute: "et-checkbox" }, viewQueries: [{ propertyName: "checkmarkEl", first: true, predicate: ["checkmark"], descendants: true, isSignal: true }, { propertyName: "indeterminateEl", first: true, predicate: ["indeterminate"], descendants: true, isSignal: true }], hostDirectives: [{ directive: CheckboxDirective, inputs: ["checked", "checked", "indeterminate", "indeterminate", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name"], outputs: ["checkedChange", "checkedChange", "indeterminateChange", "indeterminateChange", "touchedChange", "touchedChange"] }, { directive: i1.ColorInteractiveDirective }, { directive: FocusRingDirective }], ngImport: i0, template: "<div class=\"et-checkbox-box\">\n <svg\n #checkmark\n [style.color]=\"frozenCheckmarkColor()\"\n class=\"et-checkbox-checkmark\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n >\n <polyline\n class=\"et-checkbox-checkmark-path\"\n points=\"3.5 8 6.5 11 12.5 5\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n <svg\n #indeterminate\n [style.color]=\"frozenIndeterminateColor()\"\n class=\"et-checkbox-indeterminate\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n >\n <line\n class=\"et-checkbox-indeterminate-path\"\n x1=\"4\"\n y1=\"8\"\n x2=\"12\"\n y2=\"8\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n />\n </svg>\n</div>\n", styles: ["@layer components{@property --et-checkbox-size{syntax: \"<length>\"; inherits: true; initial-value: 20px;}@property --et-checkbox-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-checkbox-border-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-checkbox-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-checkbox-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}et-checkbox{display:inline-flex;align-items:center;cursor:pointer;border-radius:var(--et-checkbox-border-radius);transition:opacity .15s ease,outline-color .15s ease}et-checkbox[data-readonly]{cursor:default}et-checkbox[aria-disabled=true]{opacity:var(--et-checkbox-opacity-disabled);pointer-events:none;cursor:default}et-checkbox .et-checkbox-box{position:relative;display:grid;place-items:center;width:var(--et-checkbox-size);height:var(--et-checkbox-size);border:var(--et-checkbox-border-width) solid var(--et-surface-border-solid, currentColor);border-radius:var(--et-checkbox-border-radius)}et-checkbox:hover:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-checkbox:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-box{border-color:var(--et-surface-interaction-hover-solid, currentColor)}:where(et-choice-field[data-error]) et-checkbox:not([aria-disabled=true]) .et-checkbox-box{border-color:var(--et-theme-color-primary-solid)}:where(et-choice-field[data-error]) et-checkbox:hover:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-box,:where(et-choice-field[data-error]:has(.et-choice-field-label-area:hover)) et-checkbox:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-box{border-color:var(--et-theme-color-primary-solid)}et-checkbox:focus-visible:not([aria-checked=true]):not([aria-checked=mixed]){--_et-focus-ring-color: var(--et-surface-color-solid, currentColor)}et-checkbox:focus-visible:not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box{border-color:var(--et-surface-color-solid, currentColor)}et-checkbox:focus-visible:is([aria-checked=true],[aria-checked=mixed]) .et-checkbox-box{border-color:var(--et-theme-color-primary-solid)}et-choice-field[data-error] et-checkbox:focus-visible:not([aria-checked=true]):not([aria-checked=mixed]){--_et-focus-ring-color: var(--et-theme-color-primary-solid)}et-choice-field[data-error] et-checkbox:focus-visible:not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box{border-color:var(--et-theme-color-primary-solid)}et-checkbox:active:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box,et-checkbox.et-focus-ring--active:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:active)) et-checkbox:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box{border-color:var(--et-surface-interaction-hover-solid, currentColor);transform:scale(.95)}et-checkbox:active:not([aria-disabled=true]):not([data-readonly]):is([aria-checked=true],[aria-checked=mixed]) .et-checkbox-box,et-checkbox.et-focus-ring--active:not([aria-disabled=true]):not([data-readonly]):is([aria-checked=true],[aria-checked=mixed]) .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:active)) et-checkbox:not([aria-disabled=true]):not([data-readonly]):is([aria-checked=true],[aria-checked=mixed]) .et-checkbox-box{transform:scale(.95)}et-checkbox .et-checkbox-checkmark{position:absolute;inset:0;width:100%;height:100%;color:var(--et-theme-color-on-primary-solid, white);opacity:0}et-checkbox .et-checkbox-checkmark-path{stroke-dasharray:18;stroke-dashoffset:18}et-checkbox .et-checkbox-indeterminate{position:absolute;inset:0;width:100%;height:100%;color:var(--et-theme-color-on-primary-solid, white);opacity:0}et-checkbox .et-checkbox-indeterminate-path{stroke-dasharray:8;stroke-dashoffset:8}et-checkbox[aria-checked=true] .et-checkbox-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}et-checkbox[aria-checked=true] .et-checkbox-checkmark{opacity:1}et-checkbox[aria-checked=true] .et-checkbox-checkmark-path{stroke-dashoffset:0}et-checkbox[aria-checked=true]:hover .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-checkbox[aria-checked=true] .et-checkbox-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}et-checkbox[aria-checked=mixed] .et-checkbox-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}et-checkbox[aria-checked=mixed] .et-checkbox-indeterminate{opacity:1}et-checkbox[aria-checked=mixed] .et-checkbox-indeterminate-path{stroke-dashoffset:0}et-checkbox[aria-checked=mixed]:hover .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-checkbox[aria-checked=mixed] .et-checkbox-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}et-checkbox[data-can-animate]{transition:opacity var(--et-checkbox-transition-duration) ease,outline-color var(--et-checkbox-transition-duration) ease}et-checkbox[data-can-animate] .et-checkbox-box{transition:background-color var(--et-checkbox-transition-duration) ease,border-color var(--et-checkbox-transition-duration) ease,transform var(--et-checkbox-transition-duration) ease}et-checkbox[data-can-animate] .et-checkbox-checkmark{transition:opacity 0s calc(var(--et-checkbox-transition-duration) * 1.5)}et-checkbox[data-can-animate] .et-checkbox-checkmark-path{transition:stroke-dashoffset calc(var(--et-checkbox-transition-duration) * 1.5) ease}et-checkbox[data-can-animate] .et-checkbox-indeterminate{transition:opacity 0s calc(var(--et-checkbox-transition-duration) * 1.5)}et-checkbox[data-can-animate] .et-checkbox-indeterminate-path{transition:stroke-dashoffset calc(var(--et-checkbox-transition-duration) * 1.5) ease}et-checkbox[data-can-animate][aria-checked=true] .et-checkbox-checkmark{transition:opacity 0s 0s}et-checkbox[data-can-animate][aria-checked=mixed] .et-checkbox-indeterminate{transition:opacity 0s 0s}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
6978
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.5", type: CheckboxComponent, isStandalone: true, selector: "et-checkbox", host: { properties: { "attr.data-can-animate": "canAnimate.state() || null" }, classAttribute: "et-checkbox" }, viewQueries: [{ propertyName: "checkmarkEl", first: true, predicate: ["checkmark"], descendants: true, isSignal: true }, { propertyName: "indeterminateEl", first: true, predicate: ["indeterminate"], descendants: true, isSignal: true }], hostDirectives: [{ directive: CheckboxDirective, inputs: ["checked", "checked", "indeterminate", "indeterminate", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name"], outputs: ["checkedChange", "checkedChange", "indeterminateChange", "indeterminateChange", "touchedChange", "touchedChange"] }, { directive: i1.ColorInteractiveDirective }, { directive: FocusRingDirective }], ngImport: i0, template: "<div class=\"et-checkbox-box\">\n <svg\n #checkmark\n [style.color]=\"frozenCheckmarkColor()\"\n class=\"et-checkbox-checkmark\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n >\n <polyline\n class=\"et-checkbox-checkmark-path\"\n points=\"3.5 8 6.5 11 12.5 5\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n <svg\n #indeterminate\n [style.color]=\"frozenIndeterminateColor()\"\n class=\"et-checkbox-indeterminate\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n >\n <line\n class=\"et-checkbox-indeterminate-path\"\n x1=\"4\"\n y1=\"8\"\n x2=\"12\"\n y2=\"8\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n />\n </svg>\n</div>\n", styles: ["@layer components{@property --et-checkbox-size{syntax: \"<length>\"; inherits: true; initial-value: 20px;}@property --et-checkbox-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-checkbox-border-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-checkbox-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-checkbox-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}et-checkbox{display:inline-flex;align-items:center;cursor:pointer;border-radius:var(--et-checkbox-border-radius);transition:opacity .15s ease,outline-color .15s ease}et-checkbox[data-readonly]{cursor:default}et-checkbox[aria-disabled=true]{opacity:var(--et-checkbox-opacity-disabled);pointer-events:none;cursor:default}et-checkbox .et-checkbox-box{position:relative;display:grid;place-items:center;width:var(--et-checkbox-size);height:var(--et-checkbox-size);border:var(--et-checkbox-border-width) solid var(--et-surface-border-solid, currentColor);border-radius:var(--et-checkbox-border-radius)}@media(hover:hover){et-checkbox:hover:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-checkbox:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-box{border-color:var(--et-surface-interaction-hover-solid, currentColor)}}:where(et-choice-field[data-error]) et-checkbox:not([aria-disabled=true]) .et-checkbox-box{border-color:var(--et-theme-color-primary-solid)}@media(hover:hover){:where(et-choice-field[data-error]) et-checkbox:hover:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-box,:where(et-choice-field[data-error]:has(.et-choice-field-label-area:hover)) et-checkbox:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-box{border-color:var(--et-theme-color-primary-solid)}}et-checkbox:focus-visible:not([aria-checked=true]):not([aria-checked=mixed]){--_et-focus-ring-color: var(--et-surface-color-solid, currentColor)}et-checkbox:focus-visible:not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box{border-color:var(--et-surface-color-solid, currentColor)}et-checkbox:focus-visible:is([aria-checked=true],[aria-checked=mixed]) .et-checkbox-box{border-color:var(--et-theme-color-primary-solid)}et-choice-field[data-error] et-checkbox:focus-visible:not([aria-checked=true]):not([aria-checked=mixed]){--_et-focus-ring-color: var(--et-theme-color-primary-solid)}et-choice-field[data-error] et-checkbox:focus-visible:not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box{border-color:var(--et-theme-color-primary-solid)}et-checkbox:active:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box,et-checkbox.et-focus-ring--active:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:active)) et-checkbox:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box{border-color:var(--et-surface-interaction-hover-solid, currentColor);transform:scale(.95)}et-checkbox:active:not([aria-disabled=true]):not([data-readonly]):is([aria-checked=true],[aria-checked=mixed]) .et-checkbox-box,et-checkbox.et-focus-ring--active:not([aria-disabled=true]):not([data-readonly]):is([aria-checked=true],[aria-checked=mixed]) .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:active)) et-checkbox:not([aria-disabled=true]):not([data-readonly]):is([aria-checked=true],[aria-checked=mixed]) .et-checkbox-box{transform:scale(.95)}et-checkbox .et-checkbox-checkmark{position:absolute;inset:0;width:100%;height:100%;color:var(--et-theme-color-on-primary-solid, white);opacity:0}et-checkbox .et-checkbox-checkmark-path{stroke-dasharray:18;stroke-dashoffset:18}et-checkbox .et-checkbox-indeterminate{position:absolute;inset:0;width:100%;height:100%;color:var(--et-theme-color-on-primary-solid, white);opacity:0}et-checkbox .et-checkbox-indeterminate-path{stroke-dasharray:8;stroke-dashoffset:8}et-checkbox[aria-checked=true] .et-checkbox-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}et-checkbox[aria-checked=true] .et-checkbox-checkmark{opacity:1}et-checkbox[aria-checked=true] .et-checkbox-checkmark-path{stroke-dashoffset:0}@media(hover:hover){et-checkbox[aria-checked=true]:hover .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-checkbox[aria-checked=true] .et-checkbox-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}}et-checkbox[aria-checked=mixed] .et-checkbox-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}et-checkbox[aria-checked=mixed] .et-checkbox-indeterminate{opacity:1}et-checkbox[aria-checked=mixed] .et-checkbox-indeterminate-path{stroke-dashoffset:0}@media(hover:hover){et-checkbox[aria-checked=mixed]:hover .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-checkbox[aria-checked=mixed] .et-checkbox-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}}et-checkbox[data-can-animate]{transition:opacity var(--et-checkbox-transition-duration) ease,outline-color var(--et-checkbox-transition-duration) ease}et-checkbox[data-can-animate] .et-checkbox-box{transition:background-color var(--et-checkbox-transition-duration) ease,border-color var(--et-checkbox-transition-duration) ease,transform var(--et-checkbox-transition-duration) ease}et-checkbox[data-can-animate] .et-checkbox-checkmark{transition:opacity 0s calc(var(--et-checkbox-transition-duration) * 1.5)}et-checkbox[data-can-animate] .et-checkbox-checkmark-path{transition:stroke-dashoffset calc(var(--et-checkbox-transition-duration) * 1.5) ease}et-checkbox[data-can-animate] .et-checkbox-indeterminate{transition:opacity 0s calc(var(--et-checkbox-transition-duration) * 1.5)}et-checkbox[data-can-animate] .et-checkbox-indeterminate-path{transition:stroke-dashoffset calc(var(--et-checkbox-transition-duration) * 1.5) ease}et-checkbox[data-can-animate][aria-checked=true] .et-checkbox-checkmark{transition:opacity 0s 0s}et-checkbox[data-can-animate][aria-checked=mixed] .et-checkbox-indeterminate{transition:opacity 0s 0s}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
6979
6979
  }
6980
6980
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CheckboxComponent, decorators: [{
6981
6981
  type: Component,
@@ -6990,7 +6990,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
6990
6990
  ], host: {
6991
6991
  class: 'et-checkbox',
6992
6992
  '[attr.data-can-animate]': 'canAnimate.state() || null',
6993
- }, template: "<div class=\"et-checkbox-box\">\n <svg\n #checkmark\n [style.color]=\"frozenCheckmarkColor()\"\n class=\"et-checkbox-checkmark\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n >\n <polyline\n class=\"et-checkbox-checkmark-path\"\n points=\"3.5 8 6.5 11 12.5 5\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n <svg\n #indeterminate\n [style.color]=\"frozenIndeterminateColor()\"\n class=\"et-checkbox-indeterminate\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n >\n <line\n class=\"et-checkbox-indeterminate-path\"\n x1=\"4\"\n y1=\"8\"\n x2=\"12\"\n y2=\"8\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n />\n </svg>\n</div>\n", styles: ["@layer components{@property --et-checkbox-size{syntax: \"<length>\"; inherits: true; initial-value: 20px;}@property --et-checkbox-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-checkbox-border-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-checkbox-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-checkbox-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}et-checkbox{display:inline-flex;align-items:center;cursor:pointer;border-radius:var(--et-checkbox-border-radius);transition:opacity .15s ease,outline-color .15s ease}et-checkbox[data-readonly]{cursor:default}et-checkbox[aria-disabled=true]{opacity:var(--et-checkbox-opacity-disabled);pointer-events:none;cursor:default}et-checkbox .et-checkbox-box{position:relative;display:grid;place-items:center;width:var(--et-checkbox-size);height:var(--et-checkbox-size);border:var(--et-checkbox-border-width) solid var(--et-surface-border-solid, currentColor);border-radius:var(--et-checkbox-border-radius)}et-checkbox:hover:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-checkbox:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-box{border-color:var(--et-surface-interaction-hover-solid, currentColor)}:where(et-choice-field[data-error]) et-checkbox:not([aria-disabled=true]) .et-checkbox-box{border-color:var(--et-theme-color-primary-solid)}:where(et-choice-field[data-error]) et-checkbox:hover:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-box,:where(et-choice-field[data-error]:has(.et-choice-field-label-area:hover)) et-checkbox:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-box{border-color:var(--et-theme-color-primary-solid)}et-checkbox:focus-visible:not([aria-checked=true]):not([aria-checked=mixed]){--_et-focus-ring-color: var(--et-surface-color-solid, currentColor)}et-checkbox:focus-visible:not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box{border-color:var(--et-surface-color-solid, currentColor)}et-checkbox:focus-visible:is([aria-checked=true],[aria-checked=mixed]) .et-checkbox-box{border-color:var(--et-theme-color-primary-solid)}et-choice-field[data-error] et-checkbox:focus-visible:not([aria-checked=true]):not([aria-checked=mixed]){--_et-focus-ring-color: var(--et-theme-color-primary-solid)}et-choice-field[data-error] et-checkbox:focus-visible:not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box{border-color:var(--et-theme-color-primary-solid)}et-checkbox:active:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box,et-checkbox.et-focus-ring--active:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:active)) et-checkbox:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box{border-color:var(--et-surface-interaction-hover-solid, currentColor);transform:scale(.95)}et-checkbox:active:not([aria-disabled=true]):not([data-readonly]):is([aria-checked=true],[aria-checked=mixed]) .et-checkbox-box,et-checkbox.et-focus-ring--active:not([aria-disabled=true]):not([data-readonly]):is([aria-checked=true],[aria-checked=mixed]) .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:active)) et-checkbox:not([aria-disabled=true]):not([data-readonly]):is([aria-checked=true],[aria-checked=mixed]) .et-checkbox-box{transform:scale(.95)}et-checkbox .et-checkbox-checkmark{position:absolute;inset:0;width:100%;height:100%;color:var(--et-theme-color-on-primary-solid, white);opacity:0}et-checkbox .et-checkbox-checkmark-path{stroke-dasharray:18;stroke-dashoffset:18}et-checkbox .et-checkbox-indeterminate{position:absolute;inset:0;width:100%;height:100%;color:var(--et-theme-color-on-primary-solid, white);opacity:0}et-checkbox .et-checkbox-indeterminate-path{stroke-dasharray:8;stroke-dashoffset:8}et-checkbox[aria-checked=true] .et-checkbox-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}et-checkbox[aria-checked=true] .et-checkbox-checkmark{opacity:1}et-checkbox[aria-checked=true] .et-checkbox-checkmark-path{stroke-dashoffset:0}et-checkbox[aria-checked=true]:hover .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-checkbox[aria-checked=true] .et-checkbox-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}et-checkbox[aria-checked=mixed] .et-checkbox-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}et-checkbox[aria-checked=mixed] .et-checkbox-indeterminate{opacity:1}et-checkbox[aria-checked=mixed] .et-checkbox-indeterminate-path{stroke-dashoffset:0}et-checkbox[aria-checked=mixed]:hover .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-checkbox[aria-checked=mixed] .et-checkbox-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}et-checkbox[data-can-animate]{transition:opacity var(--et-checkbox-transition-duration) ease,outline-color var(--et-checkbox-transition-duration) ease}et-checkbox[data-can-animate] .et-checkbox-box{transition:background-color var(--et-checkbox-transition-duration) ease,border-color var(--et-checkbox-transition-duration) ease,transform var(--et-checkbox-transition-duration) ease}et-checkbox[data-can-animate] .et-checkbox-checkmark{transition:opacity 0s calc(var(--et-checkbox-transition-duration) * 1.5)}et-checkbox[data-can-animate] .et-checkbox-checkmark-path{transition:stroke-dashoffset calc(var(--et-checkbox-transition-duration) * 1.5) ease}et-checkbox[data-can-animate] .et-checkbox-indeterminate{transition:opacity 0s calc(var(--et-checkbox-transition-duration) * 1.5)}et-checkbox[data-can-animate] .et-checkbox-indeterminate-path{transition:stroke-dashoffset calc(var(--et-checkbox-transition-duration) * 1.5) ease}et-checkbox[data-can-animate][aria-checked=true] .et-checkbox-checkmark{transition:opacity 0s 0s}et-checkbox[data-can-animate][aria-checked=mixed] .et-checkbox-indeterminate{transition:opacity 0s 0s}}\n"] }]
6993
+ }, template: "<div class=\"et-checkbox-box\">\n <svg\n #checkmark\n [style.color]=\"frozenCheckmarkColor()\"\n class=\"et-checkbox-checkmark\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n >\n <polyline\n class=\"et-checkbox-checkmark-path\"\n points=\"3.5 8 6.5 11 12.5 5\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n <svg\n #indeterminate\n [style.color]=\"frozenIndeterminateColor()\"\n class=\"et-checkbox-indeterminate\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n >\n <line\n class=\"et-checkbox-indeterminate-path\"\n x1=\"4\"\n y1=\"8\"\n x2=\"12\"\n y2=\"8\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n />\n </svg>\n</div>\n", styles: ["@layer components{@property --et-checkbox-size{syntax: \"<length>\"; inherits: true; initial-value: 20px;}@property --et-checkbox-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-checkbox-border-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-checkbox-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-checkbox-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}et-checkbox{display:inline-flex;align-items:center;cursor:pointer;border-radius:var(--et-checkbox-border-radius);transition:opacity .15s ease,outline-color .15s ease}et-checkbox[data-readonly]{cursor:default}et-checkbox[aria-disabled=true]{opacity:var(--et-checkbox-opacity-disabled);pointer-events:none;cursor:default}et-checkbox .et-checkbox-box{position:relative;display:grid;place-items:center;width:var(--et-checkbox-size);height:var(--et-checkbox-size);border:var(--et-checkbox-border-width) solid var(--et-surface-border-solid, currentColor);border-radius:var(--et-checkbox-border-radius)}@media(hover:hover){et-checkbox:hover:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-checkbox:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-box{border-color:var(--et-surface-interaction-hover-solid, currentColor)}}:where(et-choice-field[data-error]) et-checkbox:not([aria-disabled=true]) .et-checkbox-box{border-color:var(--et-theme-color-primary-solid)}@media(hover:hover){:where(et-choice-field[data-error]) et-checkbox:hover:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-box,:where(et-choice-field[data-error]:has(.et-choice-field-label-area:hover)) et-checkbox:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-box{border-color:var(--et-theme-color-primary-solid)}}et-checkbox:focus-visible:not([aria-checked=true]):not([aria-checked=mixed]){--_et-focus-ring-color: var(--et-surface-color-solid, currentColor)}et-checkbox:focus-visible:not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box{border-color:var(--et-surface-color-solid, currentColor)}et-checkbox:focus-visible:is([aria-checked=true],[aria-checked=mixed]) .et-checkbox-box{border-color:var(--et-theme-color-primary-solid)}et-choice-field[data-error] et-checkbox:focus-visible:not([aria-checked=true]):not([aria-checked=mixed]){--_et-focus-ring-color: var(--et-theme-color-primary-solid)}et-choice-field[data-error] et-checkbox:focus-visible:not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box{border-color:var(--et-theme-color-primary-solid)}et-checkbox:active:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box,et-checkbox.et-focus-ring--active:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:active)) et-checkbox:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]):not([aria-checked=mixed]) .et-checkbox-box{border-color:var(--et-surface-interaction-hover-solid, currentColor);transform:scale(.95)}et-checkbox:active:not([aria-disabled=true]):not([data-readonly]):is([aria-checked=true],[aria-checked=mixed]) .et-checkbox-box,et-checkbox.et-focus-ring--active:not([aria-disabled=true]):not([data-readonly]):is([aria-checked=true],[aria-checked=mixed]) .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:active)) et-checkbox:not([aria-disabled=true]):not([data-readonly]):is([aria-checked=true],[aria-checked=mixed]) .et-checkbox-box{transform:scale(.95)}et-checkbox .et-checkbox-checkmark{position:absolute;inset:0;width:100%;height:100%;color:var(--et-theme-color-on-primary-solid, white);opacity:0}et-checkbox .et-checkbox-checkmark-path{stroke-dasharray:18;stroke-dashoffset:18}et-checkbox .et-checkbox-indeterminate{position:absolute;inset:0;width:100%;height:100%;color:var(--et-theme-color-on-primary-solid, white);opacity:0}et-checkbox .et-checkbox-indeterminate-path{stroke-dasharray:8;stroke-dashoffset:8}et-checkbox[aria-checked=true] .et-checkbox-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}et-checkbox[aria-checked=true] .et-checkbox-checkmark{opacity:1}et-checkbox[aria-checked=true] .et-checkbox-checkmark-path{stroke-dashoffset:0}@media(hover:hover){et-checkbox[aria-checked=true]:hover .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-checkbox[aria-checked=true] .et-checkbox-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}}et-checkbox[aria-checked=mixed] .et-checkbox-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}et-checkbox[aria-checked=mixed] .et-checkbox-indeterminate{opacity:1}et-checkbox[aria-checked=mixed] .et-checkbox-indeterminate-path{stroke-dashoffset:0}@media(hover:hover){et-checkbox[aria-checked=mixed]:hover .et-checkbox-box,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-checkbox[aria-checked=mixed] .et-checkbox-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}}et-checkbox[data-can-animate]{transition:opacity var(--et-checkbox-transition-duration) ease,outline-color var(--et-checkbox-transition-duration) ease}et-checkbox[data-can-animate] .et-checkbox-box{transition:background-color var(--et-checkbox-transition-duration) ease,border-color var(--et-checkbox-transition-duration) ease,transform var(--et-checkbox-transition-duration) ease}et-checkbox[data-can-animate] .et-checkbox-checkmark{transition:opacity 0s calc(var(--et-checkbox-transition-duration) * 1.5)}et-checkbox[data-can-animate] .et-checkbox-checkmark-path{transition:stroke-dashoffset calc(var(--et-checkbox-transition-duration) * 1.5) ease}et-checkbox[data-can-animate] .et-checkbox-indeterminate{transition:opacity 0s calc(var(--et-checkbox-transition-duration) * 1.5)}et-checkbox[data-can-animate] .et-checkbox-indeterminate-path{transition:stroke-dashoffset calc(var(--et-checkbox-transition-duration) * 1.5) ease}et-checkbox[data-can-animate][aria-checked=true] .et-checkbox-checkmark{transition:opacity 0s 0s}et-checkbox[data-can-animate][aria-checked=mixed] .et-checkbox-indeterminate{transition:opacity 0s 0s}}\n"] }]
6994
6994
  }], ctorParameters: () => [], propDecorators: { checkmarkEl: [{ type: i0.ViewChild, args: ['checkmark', { isSignal: true }] }], indeterminateEl: [{ type: i0.ViewChild, args: ['indeterminate', { isSignal: true }] }] } });
6995
6995
 
6996
6996
  const CHECKBOX_IMPORTS = [CheckboxComponent, CheckboxDirective];
@@ -7065,7 +7065,7 @@ class ChoiceFieldComponent {
7065
7065
  });
7066
7066
  }
7067
7067
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ChoiceFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
7068
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: ChoiceFieldComponent, isStandalone: true, selector: "et-choice-field", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-size": "size()", "attr.data-can-animate": "canAnimate.state() || null", "attr.data-error": "support.displaysError() || null" }, classAttribute: "et-choice-field" }, providers: [provideFormSupport()], viewQueries: [{ propertyName: "errorContentRef", first: true, predicate: ["errorContent"], descendants: true, isSignal: true }, { propertyName: "hintContentRef", first: true, predicate: ["hintContent"], descendants: true, isSignal: true }, { propertyName: "errorAnimatableRef", first: true, predicate: ["errorAnimatable"], descendants: true, isSignal: true }, { propertyName: "hintAnimatableRef", first: true, predicate: ["hintAnimatable"], descendants: true, isSignal: true }], hostDirectives: [{ directive: FormFieldDirective }, { directive: i1.ProvideColorDirective, inputs: ["etProvideColor", "color"] }], ngImport: i0, template: "<div class=\"et-choice-field-control\" etColorInteractiveContainer>\n <div class=\"et-choice-field-control-slot\">\n <ng-content />\n </div>\n\n <div class=\"et-choice-field-label-area\">\n <ng-content select=\"et-label\" />\n </div>\n</div>\n\n@if (support.shouldRenderSupport()) {\n <div [style.block-size.px]=\"support.supportHeight()\" class=\"et-choice-field-support\" etColorInteractiveExclude>\n <div class=\"et-choice-field-support-stack\">\n @if (support.shouldRenderError()) {\n <div\n #errorContent\n #errorAnimatable=\"etAnimatable\"\n [id]=\"support.formFieldDir.errorId()\"\n [attr.aria-atomic]=\"support.errorActive() ? 'true' : null\"\n [attr.aria-hidden]=\"!support.errorActive() ? 'true' : null\"\n [attr.aria-live]=\"support.errorActive() ? 'polite' : null\"\n [attr.data-active]=\"support.errorActive() || null\"\n [etProvideColor]=\"support.errorColorTheme\"\n class=\"et-choice-field-support-content et-choice-field-errors\"\n etAnimatable\n >\n @for (error of support.visibleErrors(); track $index) {\n <et-form-error [error]=\"error\" />\n }\n </div>\n }\n\n @if (support.shouldRenderHint()) {\n <div\n #hintContent\n #hintAnimatable=\"etAnimatable\"\n [id]=\"support.formFieldDir.hintId()\"\n [attr.aria-hidden]=\"!support.hintActive() ? 'true' : null\"\n [attr.data-active]=\"support.hintActive() || null\"\n class=\"et-choice-field-support-content et-choice-field-hint\"\n etAnimatable\n >\n <ng-content select=\"et-hint\" />\n </div>\n }\n </div>\n </div>\n}\n", styles: ["@layer components{@property --et-choice-field-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-choice-field-support-duration{syntax: \"<time>\"; inherits: true; initial-value: .18s;}@property --et-choice-field-support-offset{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-choice-field-label-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-choice-field-error-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-choice-field-hint-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}et-choice-field{display:flex;flex-direction:column;width:fit-content;gap:4px;color:var(--et-surface-color-solid, currentColor)}et-choice-field .et-choice-field-control{display:flex;align-items:center;gap:var(--et-choice-field-gap)}et-choice-field .et-choice-field-control-slot{flex:0 0 auto}et-choice-field:where([data-size=sm]){--et-choice-field-label-font-size: 12px}et-choice-field:where([data-size=sm]) et-checkbox{--et-checkbox-size: 16px}et-choice-field:where([data-size=sm]) et-switch{--et-switch-track-width: 34px;--et-switch-track-height: 19px;--et-switch-thumb-size: 13px}et-choice-field:where([data-size=lg]){--et-choice-field-label-font-size: 16px}et-choice-field:where([data-size=lg]) et-checkbox{--et-checkbox-size: 24px}et-choice-field:where([data-size=lg]) et-switch{--et-switch-track-width: 46px;--et-switch-track-height: 25px;--et-switch-thumb-size: 19px}et-choice-field .et-choice-field-label-area{display:flex;align-items:baseline;font-size:var(--et-choice-field-label-font-size);font-weight:500;line-height:1.2;letter-spacing:-.01em;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;-webkit-user-select:none;user-select:none;min-inline-size:0;flex:1;overflow:hidden;transition:color .15s ease,opacity .15s ease}et-choice-field .et-choice-field-label-area et-label{display:inline;min-inline-size:0}et-choice-field:where(:has(.et-choice-field-control:hover)):where(:not(:has([data-readonly]))) .et-choice-field-label-area{color:var(--et-surface-color-solid, currentColor)}et-choice-field:where(:has(.et-choice-field-control:active)):where(:not(:has([data-readonly]))) .et-choice-field-label-area{color:var(--et-surface-color-solid, currentColor)}et-choice-field:where(:has([data-readonly])) .et-choice-field-label-area{cursor:default}et-choice-field:where(:has(:focus-visible)) .et-choice-field-label-area{color:var(--et-surface-color-solid, currentColor)}et-choice-field:has([aria-disabled=true]) .et-choice-field-label-area,et-choice-field:has(:disabled) .et-choice-field-label-area{cursor:not-allowed;color:var(--et-surface-interaction-disabled-solid, currentColor);pointer-events:none}et-choice-field:has([aria-disabled=true]) .et-choice-field-hint,et-choice-field:has(:disabled) .et-choice-field-hint{color:var(--et-surface-interaction-disabled-solid, currentColor)}et-choice-field .et-choice-field-support{overflow:clip;block-size:0;-webkit-user-select:none;user-select:none}et-choice-field .et-choice-field-support-stack{position:relative;display:grid}et-choice-field .et-choice-field-support-content{grid-area:1 / 1;min-inline-size:0;opacity:0}et-choice-field .et-choice-field-support-content[data-active]{opacity:1;transform:translateY(0)}et-choice-field .et-choice-field-errors{display:flex;flex-direction:column;gap:2px;font-size:var(--et-choice-field-error-font-size);color:var(--et-theme-color-primary-solid);padding-inline-start:calc(var(--et-choice-field-gap) + var(--et-checkbox-size, 20px));transform:translateY(var(--et-choice-field-support-offset))}et-choice-field .et-choice-field-hint{font-size:var(--et-choice-field-hint-font-size);color:var(--et-surface-color-muted-solid, currentColor);padding-inline-start:calc(var(--et-choice-field-gap) + var(--et-checkbox-size, 20px));transform:translateY(calc(-1 * var(--et-choice-field-support-offset)))}et-choice-field .et-choice-field-hint:empty{display:none}et-choice-field[data-can-animate] .et-choice-field-support{transition:block-size var(--et-choice-field-support-duration) ease}et-choice-field[data-can-animate] .et-choice-field-support-content{transition:opacity var(--et-choice-field-support-duration) ease,transform var(--et-choice-field-support-duration) ease,color .15s ease}@starting-style{et-choice-field[data-can-animate] .et-choice-field-errors[data-active]{opacity:0;transform:translateY(var(--et-choice-field-support-offset))}}@starting-style{et-choice-field[data-can-animate] .et-choice-field-hint[data-active]{opacity:0;transform:translateY(calc(-1 * var(--et-choice-field-support-offset)))}}}\n"], dependencies: [{ kind: "directive", type: AnimatableDirective, selector: "[etAnimatable]", exportAs: ["etAnimatable"] }, { kind: "directive", type: ColorInteractiveContainerDirective, selector: "[etColorInteractiveContainer]" }, { kind: "directive", type: ColorInteractiveExcludeDirective, selector: "[etColorInteractiveExclude]" }, { kind: "component", type: FormErrorComponent, selector: "et-form-error", inputs: ["error"] }, { kind: "directive", type: ProvideColorDirective, selector: "[etProvideColor]", inputs: ["etProvideColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
7068
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: ChoiceFieldComponent, isStandalone: true, selector: "et-choice-field", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-size": "size()", "attr.data-can-animate": "canAnimate.state() || null", "attr.data-error": "support.displaysError() || null" }, classAttribute: "et-choice-field" }, providers: [provideFormSupport()], viewQueries: [{ propertyName: "errorContentRef", first: true, predicate: ["errorContent"], descendants: true, isSignal: true }, { propertyName: "hintContentRef", first: true, predicate: ["hintContent"], descendants: true, isSignal: true }, { propertyName: "errorAnimatableRef", first: true, predicate: ["errorAnimatable"], descendants: true, isSignal: true }, { propertyName: "hintAnimatableRef", first: true, predicate: ["hintAnimatable"], descendants: true, isSignal: true }], hostDirectives: [{ directive: FormFieldDirective }, { directive: i1.ProvideColorDirective, inputs: ["etProvideColor", "color"] }], ngImport: i0, template: "<div class=\"et-choice-field-control\" etColorInteractiveContainer>\n <div class=\"et-choice-field-control-slot\">\n <ng-content />\n </div>\n\n <div class=\"et-choice-field-label-area\">\n <ng-content select=\"et-label\" />\n </div>\n</div>\n\n@if (support.shouldRenderSupport()) {\n <div [style.block-size.px]=\"support.supportHeight()\" class=\"et-choice-field-support\" etColorInteractiveExclude>\n <div class=\"et-choice-field-support-stack\">\n @if (support.shouldRenderError()) {\n <div\n #errorContent\n #errorAnimatable=\"etAnimatable\"\n [id]=\"support.formFieldDir.errorId()\"\n [attr.aria-atomic]=\"support.errorActive() ? 'true' : null\"\n [attr.aria-hidden]=\"!support.errorActive() ? 'true' : null\"\n [attr.aria-live]=\"support.errorActive() ? 'polite' : null\"\n [attr.data-active]=\"support.errorActive() || null\"\n [etProvideColor]=\"support.errorColorTheme\"\n class=\"et-choice-field-support-content et-choice-field-errors\"\n etAnimatable\n >\n @for (error of support.visibleErrors(); track $index) {\n <et-form-error [error]=\"error\" />\n }\n </div>\n }\n\n @if (support.shouldRenderHint()) {\n <div\n #hintContent\n #hintAnimatable=\"etAnimatable\"\n [id]=\"support.formFieldDir.hintId()\"\n [attr.aria-hidden]=\"!support.hintActive() ? 'true' : null\"\n [attr.data-active]=\"support.hintActive() || null\"\n class=\"et-choice-field-support-content et-choice-field-hint\"\n etAnimatable\n >\n <ng-content select=\"et-hint\" />\n </div>\n }\n </div>\n </div>\n}\n", styles: ["@layer components{@property --et-choice-field-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-choice-field-support-duration{syntax: \"<time>\"; inherits: true; initial-value: .18s;}@property --et-choice-field-support-offset{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-choice-field-label-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-choice-field-error-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-choice-field-hint-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}et-choice-field{display:flex;flex-direction:column;width:fit-content;gap:4px;color:var(--et-surface-color-solid, currentColor)}et-choice-field .et-choice-field-control{display:flex;align-items:center;gap:var(--et-choice-field-gap)}et-choice-field .et-choice-field-control-slot{flex:0 0 auto}et-choice-field:where([data-size=sm]){--et-choice-field-label-font-size: 12px}et-choice-field:where([data-size=sm]) et-checkbox{--et-checkbox-size: 16px}et-choice-field:where([data-size=sm]) et-switch{--et-switch-track-width: 34px;--et-switch-track-height: 19px;--et-switch-thumb-size: 13px}et-choice-field:where([data-size=lg]){--et-choice-field-label-font-size: 16px}et-choice-field:where([data-size=lg]) et-checkbox{--et-checkbox-size: 24px}et-choice-field:where([data-size=lg]) et-switch{--et-switch-track-width: 46px;--et-switch-track-height: 25px;--et-switch-thumb-size: 19px}et-choice-field .et-choice-field-label-area{display:flex;align-items:baseline;font-size:var(--et-choice-field-label-font-size);font-weight:500;line-height:1.2;letter-spacing:-.01em;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;-webkit-user-select:none;user-select:none;min-inline-size:0;flex:1;overflow:hidden;transition:color .15s ease,opacity .15s ease}et-choice-field .et-choice-field-label-area et-label{display:inline;min-inline-size:0}@media(hover:hover){et-choice-field:where(:has(.et-choice-field-control:hover)):where(:not(:has([data-readonly]))) .et-choice-field-label-area{color:var(--et-surface-color-solid, currentColor)}}et-choice-field:where(:has(.et-choice-field-control:active)):where(:not(:has([data-readonly]))) .et-choice-field-label-area{color:var(--et-surface-color-solid, currentColor)}et-choice-field:where(:has([data-readonly])) .et-choice-field-label-area{cursor:default}et-choice-field:where(:has(:focus-visible)) .et-choice-field-label-area{color:var(--et-surface-color-solid, currentColor)}et-choice-field:has([aria-disabled=true]) .et-choice-field-label-area,et-choice-field:has(:disabled) .et-choice-field-label-area{cursor:not-allowed;color:var(--et-surface-interaction-disabled-solid, currentColor);pointer-events:none}et-choice-field:has([aria-disabled=true]) .et-choice-field-hint,et-choice-field:has(:disabled) .et-choice-field-hint{color:var(--et-surface-interaction-disabled-solid, currentColor)}et-choice-field .et-choice-field-support{overflow:clip;block-size:0;-webkit-user-select:none;user-select:none}et-choice-field .et-choice-field-support-stack{position:relative;display:grid}et-choice-field .et-choice-field-support-content{grid-area:1 / 1;min-inline-size:0;opacity:0}et-choice-field .et-choice-field-support-content[data-active]{opacity:1;transform:translateY(0)}et-choice-field .et-choice-field-errors{display:flex;flex-direction:column;gap:2px;font-size:var(--et-choice-field-error-font-size);color:var(--et-theme-color-primary-solid);padding-inline-start:calc(var(--et-choice-field-gap) + var(--et-checkbox-size, 20px));transform:translateY(var(--et-choice-field-support-offset))}et-choice-field .et-choice-field-hint{font-size:var(--et-choice-field-hint-font-size);color:var(--et-surface-color-muted-solid, currentColor);padding-inline-start:calc(var(--et-choice-field-gap) + var(--et-checkbox-size, 20px));transform:translateY(calc(-1 * var(--et-choice-field-support-offset)))}et-choice-field .et-choice-field-hint:empty{display:none}et-choice-field[data-can-animate] .et-choice-field-support{transition:block-size var(--et-choice-field-support-duration) ease}et-choice-field[data-can-animate] .et-choice-field-support-content{transition:opacity var(--et-choice-field-support-duration) ease,transform var(--et-choice-field-support-duration) ease,color .15s ease}@starting-style{et-choice-field[data-can-animate] .et-choice-field-errors[data-active]{opacity:0;transform:translateY(var(--et-choice-field-support-offset))}}@starting-style{et-choice-field[data-can-animate] .et-choice-field-hint[data-active]{opacity:0;transform:translateY(calc(-1 * var(--et-choice-field-support-offset)))}}}\n"], dependencies: [{ kind: "directive", type: AnimatableDirective, selector: "[etAnimatable]", exportAs: ["etAnimatable"] }, { kind: "directive", type: ColorInteractiveContainerDirective, selector: "[etColorInteractiveContainer]" }, { kind: "directive", type: ColorInteractiveExcludeDirective, selector: "[etColorInteractiveExclude]" }, { kind: "component", type: FormErrorComponent, selector: "et-form-error", inputs: ["error"] }, { kind: "directive", type: ProvideColorDirective, selector: "[etProvideColor]", inputs: ["etProvideColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
7069
7069
  }
7070
7070
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ChoiceFieldComponent, decorators: [{
7071
7071
  type: Component,
@@ -7080,7 +7080,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
7080
7080
  '[attr.data-size]': 'size()',
7081
7081
  '[attr.data-can-animate]': 'canAnimate.state() || null',
7082
7082
  '[attr.data-error]': 'support.displaysError() || null',
7083
- }, template: "<div class=\"et-choice-field-control\" etColorInteractiveContainer>\n <div class=\"et-choice-field-control-slot\">\n <ng-content />\n </div>\n\n <div class=\"et-choice-field-label-area\">\n <ng-content select=\"et-label\" />\n </div>\n</div>\n\n@if (support.shouldRenderSupport()) {\n <div [style.block-size.px]=\"support.supportHeight()\" class=\"et-choice-field-support\" etColorInteractiveExclude>\n <div class=\"et-choice-field-support-stack\">\n @if (support.shouldRenderError()) {\n <div\n #errorContent\n #errorAnimatable=\"etAnimatable\"\n [id]=\"support.formFieldDir.errorId()\"\n [attr.aria-atomic]=\"support.errorActive() ? 'true' : null\"\n [attr.aria-hidden]=\"!support.errorActive() ? 'true' : null\"\n [attr.aria-live]=\"support.errorActive() ? 'polite' : null\"\n [attr.data-active]=\"support.errorActive() || null\"\n [etProvideColor]=\"support.errorColorTheme\"\n class=\"et-choice-field-support-content et-choice-field-errors\"\n etAnimatable\n >\n @for (error of support.visibleErrors(); track $index) {\n <et-form-error [error]=\"error\" />\n }\n </div>\n }\n\n @if (support.shouldRenderHint()) {\n <div\n #hintContent\n #hintAnimatable=\"etAnimatable\"\n [id]=\"support.formFieldDir.hintId()\"\n [attr.aria-hidden]=\"!support.hintActive() ? 'true' : null\"\n [attr.data-active]=\"support.hintActive() || null\"\n class=\"et-choice-field-support-content et-choice-field-hint\"\n etAnimatable\n >\n <ng-content select=\"et-hint\" />\n </div>\n }\n </div>\n </div>\n}\n", styles: ["@layer components{@property --et-choice-field-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-choice-field-support-duration{syntax: \"<time>\"; inherits: true; initial-value: .18s;}@property --et-choice-field-support-offset{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-choice-field-label-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-choice-field-error-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-choice-field-hint-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}et-choice-field{display:flex;flex-direction:column;width:fit-content;gap:4px;color:var(--et-surface-color-solid, currentColor)}et-choice-field .et-choice-field-control{display:flex;align-items:center;gap:var(--et-choice-field-gap)}et-choice-field .et-choice-field-control-slot{flex:0 0 auto}et-choice-field:where([data-size=sm]){--et-choice-field-label-font-size: 12px}et-choice-field:where([data-size=sm]) et-checkbox{--et-checkbox-size: 16px}et-choice-field:where([data-size=sm]) et-switch{--et-switch-track-width: 34px;--et-switch-track-height: 19px;--et-switch-thumb-size: 13px}et-choice-field:where([data-size=lg]){--et-choice-field-label-font-size: 16px}et-choice-field:where([data-size=lg]) et-checkbox{--et-checkbox-size: 24px}et-choice-field:where([data-size=lg]) et-switch{--et-switch-track-width: 46px;--et-switch-track-height: 25px;--et-switch-thumb-size: 19px}et-choice-field .et-choice-field-label-area{display:flex;align-items:baseline;font-size:var(--et-choice-field-label-font-size);font-weight:500;line-height:1.2;letter-spacing:-.01em;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;-webkit-user-select:none;user-select:none;min-inline-size:0;flex:1;overflow:hidden;transition:color .15s ease,opacity .15s ease}et-choice-field .et-choice-field-label-area et-label{display:inline;min-inline-size:0}et-choice-field:where(:has(.et-choice-field-control:hover)):where(:not(:has([data-readonly]))) .et-choice-field-label-area{color:var(--et-surface-color-solid, currentColor)}et-choice-field:where(:has(.et-choice-field-control:active)):where(:not(:has([data-readonly]))) .et-choice-field-label-area{color:var(--et-surface-color-solid, currentColor)}et-choice-field:where(:has([data-readonly])) .et-choice-field-label-area{cursor:default}et-choice-field:where(:has(:focus-visible)) .et-choice-field-label-area{color:var(--et-surface-color-solid, currentColor)}et-choice-field:has([aria-disabled=true]) .et-choice-field-label-area,et-choice-field:has(:disabled) .et-choice-field-label-area{cursor:not-allowed;color:var(--et-surface-interaction-disabled-solid, currentColor);pointer-events:none}et-choice-field:has([aria-disabled=true]) .et-choice-field-hint,et-choice-field:has(:disabled) .et-choice-field-hint{color:var(--et-surface-interaction-disabled-solid, currentColor)}et-choice-field .et-choice-field-support{overflow:clip;block-size:0;-webkit-user-select:none;user-select:none}et-choice-field .et-choice-field-support-stack{position:relative;display:grid}et-choice-field .et-choice-field-support-content{grid-area:1 / 1;min-inline-size:0;opacity:0}et-choice-field .et-choice-field-support-content[data-active]{opacity:1;transform:translateY(0)}et-choice-field .et-choice-field-errors{display:flex;flex-direction:column;gap:2px;font-size:var(--et-choice-field-error-font-size);color:var(--et-theme-color-primary-solid);padding-inline-start:calc(var(--et-choice-field-gap) + var(--et-checkbox-size, 20px));transform:translateY(var(--et-choice-field-support-offset))}et-choice-field .et-choice-field-hint{font-size:var(--et-choice-field-hint-font-size);color:var(--et-surface-color-muted-solid, currentColor);padding-inline-start:calc(var(--et-choice-field-gap) + var(--et-checkbox-size, 20px));transform:translateY(calc(-1 * var(--et-choice-field-support-offset)))}et-choice-field .et-choice-field-hint:empty{display:none}et-choice-field[data-can-animate] .et-choice-field-support{transition:block-size var(--et-choice-field-support-duration) ease}et-choice-field[data-can-animate] .et-choice-field-support-content{transition:opacity var(--et-choice-field-support-duration) ease,transform var(--et-choice-field-support-duration) ease,color .15s ease}@starting-style{et-choice-field[data-can-animate] .et-choice-field-errors[data-active]{opacity:0;transform:translateY(var(--et-choice-field-support-offset))}}@starting-style{et-choice-field[data-can-animate] .et-choice-field-hint[data-active]{opacity:0;transform:translateY(calc(-1 * var(--et-choice-field-support-offset)))}}}\n"] }]
7083
+ }, template: "<div class=\"et-choice-field-control\" etColorInteractiveContainer>\n <div class=\"et-choice-field-control-slot\">\n <ng-content />\n </div>\n\n <div class=\"et-choice-field-label-area\">\n <ng-content select=\"et-label\" />\n </div>\n</div>\n\n@if (support.shouldRenderSupport()) {\n <div [style.block-size.px]=\"support.supportHeight()\" class=\"et-choice-field-support\" etColorInteractiveExclude>\n <div class=\"et-choice-field-support-stack\">\n @if (support.shouldRenderError()) {\n <div\n #errorContent\n #errorAnimatable=\"etAnimatable\"\n [id]=\"support.formFieldDir.errorId()\"\n [attr.aria-atomic]=\"support.errorActive() ? 'true' : null\"\n [attr.aria-hidden]=\"!support.errorActive() ? 'true' : null\"\n [attr.aria-live]=\"support.errorActive() ? 'polite' : null\"\n [attr.data-active]=\"support.errorActive() || null\"\n [etProvideColor]=\"support.errorColorTheme\"\n class=\"et-choice-field-support-content et-choice-field-errors\"\n etAnimatable\n >\n @for (error of support.visibleErrors(); track $index) {\n <et-form-error [error]=\"error\" />\n }\n </div>\n }\n\n @if (support.shouldRenderHint()) {\n <div\n #hintContent\n #hintAnimatable=\"etAnimatable\"\n [id]=\"support.formFieldDir.hintId()\"\n [attr.aria-hidden]=\"!support.hintActive() ? 'true' : null\"\n [attr.data-active]=\"support.hintActive() || null\"\n class=\"et-choice-field-support-content et-choice-field-hint\"\n etAnimatable\n >\n <ng-content select=\"et-hint\" />\n </div>\n }\n </div>\n </div>\n}\n", styles: ["@layer components{@property --et-choice-field-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-choice-field-support-duration{syntax: \"<time>\"; inherits: true; initial-value: .18s;}@property --et-choice-field-support-offset{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-choice-field-label-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-choice-field-error-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-choice-field-hint-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}et-choice-field{display:flex;flex-direction:column;width:fit-content;gap:4px;color:var(--et-surface-color-solid, currentColor)}et-choice-field .et-choice-field-control{display:flex;align-items:center;gap:var(--et-choice-field-gap)}et-choice-field .et-choice-field-control-slot{flex:0 0 auto}et-choice-field:where([data-size=sm]){--et-choice-field-label-font-size: 12px}et-choice-field:where([data-size=sm]) et-checkbox{--et-checkbox-size: 16px}et-choice-field:where([data-size=sm]) et-switch{--et-switch-track-width: 34px;--et-switch-track-height: 19px;--et-switch-thumb-size: 13px}et-choice-field:where([data-size=lg]){--et-choice-field-label-font-size: 16px}et-choice-field:where([data-size=lg]) et-checkbox{--et-checkbox-size: 24px}et-choice-field:where([data-size=lg]) et-switch{--et-switch-track-width: 46px;--et-switch-track-height: 25px;--et-switch-thumb-size: 19px}et-choice-field .et-choice-field-label-area{display:flex;align-items:baseline;font-size:var(--et-choice-field-label-font-size);font-weight:500;line-height:1.2;letter-spacing:-.01em;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;-webkit-user-select:none;user-select:none;min-inline-size:0;flex:1;overflow:hidden;transition:color .15s ease,opacity .15s ease}et-choice-field .et-choice-field-label-area et-label{display:inline;min-inline-size:0}@media(hover:hover){et-choice-field:where(:has(.et-choice-field-control:hover)):where(:not(:has([data-readonly]))) .et-choice-field-label-area{color:var(--et-surface-color-solid, currentColor)}}et-choice-field:where(:has(.et-choice-field-control:active)):where(:not(:has([data-readonly]))) .et-choice-field-label-area{color:var(--et-surface-color-solid, currentColor)}et-choice-field:where(:has([data-readonly])) .et-choice-field-label-area{cursor:default}et-choice-field:where(:has(:focus-visible)) .et-choice-field-label-area{color:var(--et-surface-color-solid, currentColor)}et-choice-field:has([aria-disabled=true]) .et-choice-field-label-area,et-choice-field:has(:disabled) .et-choice-field-label-area{cursor:not-allowed;color:var(--et-surface-interaction-disabled-solid, currentColor);pointer-events:none}et-choice-field:has([aria-disabled=true]) .et-choice-field-hint,et-choice-field:has(:disabled) .et-choice-field-hint{color:var(--et-surface-interaction-disabled-solid, currentColor)}et-choice-field .et-choice-field-support{overflow:clip;block-size:0;-webkit-user-select:none;user-select:none}et-choice-field .et-choice-field-support-stack{position:relative;display:grid}et-choice-field .et-choice-field-support-content{grid-area:1 / 1;min-inline-size:0;opacity:0}et-choice-field .et-choice-field-support-content[data-active]{opacity:1;transform:translateY(0)}et-choice-field .et-choice-field-errors{display:flex;flex-direction:column;gap:2px;font-size:var(--et-choice-field-error-font-size);color:var(--et-theme-color-primary-solid);padding-inline-start:calc(var(--et-choice-field-gap) + var(--et-checkbox-size, 20px));transform:translateY(var(--et-choice-field-support-offset))}et-choice-field .et-choice-field-hint{font-size:var(--et-choice-field-hint-font-size);color:var(--et-surface-color-muted-solid, currentColor);padding-inline-start:calc(var(--et-choice-field-gap) + var(--et-checkbox-size, 20px));transform:translateY(calc(-1 * var(--et-choice-field-support-offset)))}et-choice-field .et-choice-field-hint:empty{display:none}et-choice-field[data-can-animate] .et-choice-field-support{transition:block-size var(--et-choice-field-support-duration) ease}et-choice-field[data-can-animate] .et-choice-field-support-content{transition:opacity var(--et-choice-field-support-duration) ease,transform var(--et-choice-field-support-duration) ease,color .15s ease}@starting-style{et-choice-field[data-can-animate] .et-choice-field-errors[data-active]{opacity:0;transform:translateY(var(--et-choice-field-support-offset))}}@starting-style{et-choice-field[data-can-animate] .et-choice-field-hint[data-active]{opacity:0;transform:translateY(calc(-1 * var(--et-choice-field-support-offset)))}}}\n"] }]
7084
7084
  }], ctorParameters: () => [], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], errorContentRef: [{ type: i0.ViewChild, args: ['errorContent', { isSignal: true }] }], hintContentRef: [{ type: i0.ViewChild, args: ['hintContent', { isSignal: true }] }], errorAnimatableRef: [{ type: i0.ViewChild, args: ['errorAnimatable', { isSignal: true }] }], hintAnimatableRef: [{ type: i0.ViewChild, args: ['hintAnimatable', { isSignal: true }] }] } });
7085
7085
 
7086
7086
  class HintComponent {
@@ -8311,7 +8311,7 @@ class DateInputComponent {
8311
8311
  this.dateInput.clearValue();
8312
8312
  }
8313
8313
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DateInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
8314
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: DateInputComponent, isStandalone: true, selector: "et-date-input", inputs: { pickerTriggerLabel: { classPropertyName: "pickerTriggerLabel", publicName: "pickerTriggerLabel", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-date-input" }, providers: [provideIcons(CALENDAR_ICON, TIMES_ICON)], hostDirectives: [{ directive: DateInputDirective, inputs: ["value", "value", "touched", "touched", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name", "placeholder", "placeholder", "parseErrorMessage", "parseErrorMessage", "valueFormat", "valueFormat", "displayFormat", "displayFormat", "locale", "locale", "mask", "mask", "minDate", "minDate", "maxDate", "maxDate", "dateFilter", "dateFilter", "pickerOpen", "pickerOpen"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange", "pickerOpenChange", "pickerOpenChange"] }], ngImport: i0, template: "<input\n [etInputMask]=\"dateInput.maskPattern()\"\n class=\"et-date-input-field\"\n etDateInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n/>\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-date-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n\n<button [attr.aria-label]=\"pickerTriggerLabel()\" class=\"et-date-input-picker-trigger\" etDatePickerTrigger>\n <i etIcon=\"et-calendar\"></i>\n</button>\n\n<ng-template etDatePickerSurface>\n <et-date-picker-panel dialogLabel=\"Choose a date\">\n <et-calendar\n [value]=\"dateInput.date()\"\n [min]=\"dateInput.minDate()\"\n [max]=\"dateInput.maxDate()\"\n [dateFilter]=\"dateInput.dateFilter()\"\n [locale]=\"dateInput.effectiveLocale()\"\n (valueChange)=\"dateInput.selectDate($event)\"\n />\n </et-date-picker-panel>\n</ng-template>\n", styles: ["@layer components{et-date-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-date-input .et-date-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-date-input .et-date-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-date-input .et-date-input-field:disabled{cursor:not-allowed}et-date-input .et-date-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-date-input .et-date-input-clear .et-icon{inline-size:16px;block-size:16px}et-date-input .et-date-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}et-date-input .et-date-input-picker-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none;touch-action:manipulation}et-date-input .et-date-input-picker-trigger:after{content:\"\";position:absolute;inset:-14px}et-date-input .et-date-input-picker-trigger .et-icon{inline-size:16px}et-date-input .et-date-input-picker-trigger:hover{color:var(--et-surface-color-solid, currentColor)}et-date-input .et-date-input-picker-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-date-input .et-date-input-picker-trigger:disabled{cursor:not-allowed;color:var(--et-surface-color-subtle-solid, currentColor)}}\n"], dependencies: [{ kind: "component", type: CalendarComponent, selector: "et-calendar", inputs: ["previousMonthLabel", "nextMonthLabel"] }, { kind: "directive", type: DateInputFieldDirective, selector: "input[etDateInputField]", exportAs: ["etDateInputField"] }, { kind: "directive", type: DatePickerSurfaceDirective, selector: "ng-template[etDatePickerSurface]", exportAs: ["etDatePickerSurface"] }, { kind: "directive", type: DatePickerTriggerDirective, selector: "button[etDatePickerTrigger]", exportAs: ["etDatePickerTrigger"] }, { kind: "component", type: DatePickerPanelComponent, selector: "et-date-picker-panel", inputs: ["dialogLabel"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }, { kind: "directive", type: InputMaskDirective, selector: "[etInputMask]", inputs: ["etInputMask", "maskValueMode", "placeholderChar"], exportAs: ["etInputMask"] }], encapsulation: i0.ViewEncapsulation.None }); }
8314
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: DateInputComponent, isStandalone: true, selector: "et-date-input", inputs: { pickerTriggerLabel: { classPropertyName: "pickerTriggerLabel", publicName: "pickerTriggerLabel", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-date-input" }, providers: [provideIcons(CALENDAR_ICON, TIMES_ICON)], hostDirectives: [{ directive: DateInputDirective, inputs: ["value", "value", "touched", "touched", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name", "placeholder", "placeholder", "parseErrorMessage", "parseErrorMessage", "valueFormat", "valueFormat", "displayFormat", "displayFormat", "locale", "locale", "mask", "mask", "minDate", "minDate", "maxDate", "maxDate", "dateFilter", "dateFilter", "pickerOpen", "pickerOpen"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange", "pickerOpenChange", "pickerOpenChange"] }], ngImport: i0, template: "<input\n [etInputMask]=\"dateInput.maskPattern()\"\n class=\"et-date-input-field\"\n etDateInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n/>\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-date-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n\n<button [attr.aria-label]=\"pickerTriggerLabel()\" class=\"et-date-input-picker-trigger\" etDatePickerTrigger>\n <i etIcon=\"et-calendar\"></i>\n</button>\n\n<ng-template etDatePickerSurface>\n <et-date-picker-panel dialogLabel=\"Choose a date\">\n <et-calendar\n [value]=\"dateInput.date()\"\n [min]=\"dateInput.minDate()\"\n [max]=\"dateInput.maxDate()\"\n [dateFilter]=\"dateInput.dateFilter()\"\n [locale]=\"dateInput.effectiveLocale()\"\n (valueChange)=\"dateInput.selectDate($event)\"\n />\n </et-date-picker-panel>\n</ng-template>\n", styles: ["@layer components{et-date-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-date-input .et-date-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-date-input .et-date-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-date-input .et-date-input-field:disabled{cursor:not-allowed}et-date-input .et-date-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-date-input .et-date-input-clear .et-icon{inline-size:16px;block-size:16px}@media(hover:hover){et-date-input .et-date-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}}et-date-input .et-date-input-picker-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none;touch-action:manipulation}et-date-input .et-date-input-picker-trigger:after{content:\"\";position:absolute;inset:-14px}et-date-input .et-date-input-picker-trigger .et-icon{inline-size:16px}@media(hover:hover){et-date-input .et-date-input-picker-trigger:hover{color:var(--et-surface-color-solid, currentColor)}}et-date-input .et-date-input-picker-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-date-input .et-date-input-picker-trigger:disabled{cursor:not-allowed;color:var(--et-surface-color-subtle-solid, currentColor)}}\n"], dependencies: [{ kind: "component", type: CalendarComponent, selector: "et-calendar", inputs: ["previousMonthLabel", "nextMonthLabel"] }, { kind: "directive", type: DateInputFieldDirective, selector: "input[etDateInputField]", exportAs: ["etDateInputField"] }, { kind: "directive", type: DatePickerSurfaceDirective, selector: "ng-template[etDatePickerSurface]", exportAs: ["etDatePickerSurface"] }, { kind: "directive", type: DatePickerTriggerDirective, selector: "button[etDatePickerTrigger]", exportAs: ["etDatePickerTrigger"] }, { kind: "component", type: DatePickerPanelComponent, selector: "et-date-picker-panel", inputs: ["dialogLabel"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }, { kind: "directive", type: InputMaskDirective, selector: "[etInputMask]", inputs: ["etInputMask", "maskValueMode", "placeholderChar"], exportAs: ["etInputMask"] }], encapsulation: i0.ViewEncapsulation.None }); }
8315
8315
  }
8316
8316
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DateInputComponent, decorators: [{
8317
8317
  type: Component,
@@ -8350,7 +8350,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
8350
8350
  },
8351
8351
  ], host: {
8352
8352
  class: 'et-date-input',
8353
- }, template: "<input\n [etInputMask]=\"dateInput.maskPattern()\"\n class=\"et-date-input-field\"\n etDateInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n/>\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-date-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n\n<button [attr.aria-label]=\"pickerTriggerLabel()\" class=\"et-date-input-picker-trigger\" etDatePickerTrigger>\n <i etIcon=\"et-calendar\"></i>\n</button>\n\n<ng-template etDatePickerSurface>\n <et-date-picker-panel dialogLabel=\"Choose a date\">\n <et-calendar\n [value]=\"dateInput.date()\"\n [min]=\"dateInput.minDate()\"\n [max]=\"dateInput.maxDate()\"\n [dateFilter]=\"dateInput.dateFilter()\"\n [locale]=\"dateInput.effectiveLocale()\"\n (valueChange)=\"dateInput.selectDate($event)\"\n />\n </et-date-picker-panel>\n</ng-template>\n", styles: ["@layer components{et-date-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-date-input .et-date-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-date-input .et-date-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-date-input .et-date-input-field:disabled{cursor:not-allowed}et-date-input .et-date-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-date-input .et-date-input-clear .et-icon{inline-size:16px;block-size:16px}et-date-input .et-date-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}et-date-input .et-date-input-picker-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none;touch-action:manipulation}et-date-input .et-date-input-picker-trigger:after{content:\"\";position:absolute;inset:-14px}et-date-input .et-date-input-picker-trigger .et-icon{inline-size:16px}et-date-input .et-date-input-picker-trigger:hover{color:var(--et-surface-color-solid, currentColor)}et-date-input .et-date-input-picker-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-date-input .et-date-input-picker-trigger:disabled{cursor:not-allowed;color:var(--et-surface-color-subtle-solid, currentColor)}}\n"] }]
8353
+ }, template: "<input\n [etInputMask]=\"dateInput.maskPattern()\"\n class=\"et-date-input-field\"\n etDateInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n/>\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-date-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n\n<button [attr.aria-label]=\"pickerTriggerLabel()\" class=\"et-date-input-picker-trigger\" etDatePickerTrigger>\n <i etIcon=\"et-calendar\"></i>\n</button>\n\n<ng-template etDatePickerSurface>\n <et-date-picker-panel dialogLabel=\"Choose a date\">\n <et-calendar\n [value]=\"dateInput.date()\"\n [min]=\"dateInput.minDate()\"\n [max]=\"dateInput.maxDate()\"\n [dateFilter]=\"dateInput.dateFilter()\"\n [locale]=\"dateInput.effectiveLocale()\"\n (valueChange)=\"dateInput.selectDate($event)\"\n />\n </et-date-picker-panel>\n</ng-template>\n", styles: ["@layer components{et-date-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-date-input .et-date-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-date-input .et-date-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-date-input .et-date-input-field:disabled{cursor:not-allowed}et-date-input .et-date-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-date-input .et-date-input-clear .et-icon{inline-size:16px;block-size:16px}@media(hover:hover){et-date-input .et-date-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}}et-date-input .et-date-input-picker-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none;touch-action:manipulation}et-date-input .et-date-input-picker-trigger:after{content:\"\";position:absolute;inset:-14px}et-date-input .et-date-input-picker-trigger .et-icon{inline-size:16px}@media(hover:hover){et-date-input .et-date-input-picker-trigger:hover{color:var(--et-surface-color-solid, currentColor)}}et-date-input .et-date-input-picker-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-date-input .et-date-input-picker-trigger:disabled{cursor:not-allowed;color:var(--et-surface-color-subtle-solid, currentColor)}}\n"] }]
8354
8354
  }], propDecorators: { pickerTriggerLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "pickerTriggerLabel", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], clearLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearLabel", required: false }] }] } });
8355
8355
 
8356
8356
  const DATE_INPUT_IMPORTS = [
@@ -8825,7 +8825,7 @@ class DateRangeInputComponent {
8825
8825
  ...(ngDevMode ? [{ debugName: "pickerTriggerLabel" }] : /* istanbul ignore next */ []));
8826
8826
  }
8827
8827
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DateRangeInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
8828
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.5", type: DateRangeInputComponent, isStandalone: true, selector: "et-date-range-input", inputs: { startAriaLabel: { classPropertyName: "startAriaLabel", publicName: "startAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, endAriaLabel: { classPropertyName: "endAriaLabel", publicName: "endAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, pickerTriggerLabel: { classPropertyName: "pickerTriggerLabel", publicName: "pickerTriggerLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "group" }, properties: { "attr.aria-labelledby": "rangeInput.labelId()" }, classAttribute: "et-date-range-input" }, providers: [provideIcons(CALENDAR_ICON)], hostDirectives: [{ directive: DateRangeInputDirective, inputs: ["value", "value", "touched", "touched", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name", "startPlaceholder", "startPlaceholder", "endPlaceholder", "endPlaceholder", "parseErrorMessage", "parseErrorMessage", "valueFormat", "valueFormat", "displayFormat", "displayFormat", "locale", "locale", "mask", "mask", "minDate", "minDate", "maxDate", "maxDate", "dateFilter", "dateFilter", "pickerOpen", "pickerOpen"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange", "pickerOpenChange", "pickerOpenChange"] }], ngImport: i0, template: "<input\n [attr.aria-label]=\"startAriaLabel()\"\n [etInputMask]=\"rangeInput.maskPattern()\"\n class=\"et-date-range-input-field\"\n etDateRangeInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n side=\"start\"\n/>\n\n<span class=\"et-date-range-input-separator\" aria-hidden=\"true\">\u2013</span>\n\n<input\n [attr.aria-label]=\"endAriaLabel()\"\n [etInputMask]=\"rangeInput.maskPattern()\"\n class=\"et-date-range-input-field\"\n etDateRangeInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n side=\"end\"\n/>\n\n<button [attr.aria-label]=\"pickerTriggerLabel()\" class=\"et-date-range-input-picker-trigger\" etDatePickerTrigger>\n <i etIcon=\"et-calendar\"></i>\n</button>\n\n<ng-template etDatePickerSurface>\n <et-date-picker-panel dialogLabel=\"Choose a date range\">\n <et-calendar\n [rangeValue]=\"rangeInput.calendarRange()\"\n [min]=\"rangeInput.minDate()\"\n [max]=\"rangeInput.maxDate()\"\n [dateFilter]=\"rangeInput.dateFilter()\"\n [locale]=\"rangeInput.effectiveLocale()\"\n (rangeValueChange)=\"rangeInput.selectCalendarRange($event)\"\n mode=\"range\"\n />\n </et-date-picker-panel>\n</ng-template>\n", styles: ["@layer components{et-date-range-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-date-range-input .et-date-range-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-date-range-input .et-date-range-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-date-range-input .et-date-range-input-field:disabled{cursor:not-allowed}et-date-range-input .et-date-range-input-separator{color:var(--et-surface-color-muted-solid, currentColor)}et-date-range-input .et-date-range-input-picker-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none;touch-action:manipulation}et-date-range-input .et-date-range-input-picker-trigger:after{content:\"\";position:absolute;inset:-14px}et-date-range-input .et-date-range-input-picker-trigger .et-icon{inline-size:16px}et-date-range-input .et-date-range-input-picker-trigger:hover{color:var(--et-surface-color-solid, currentColor)}et-date-range-input .et-date-range-input-picker-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-date-range-input .et-date-range-input-picker-trigger:disabled{cursor:not-allowed;color:var(--et-surface-color-subtle-solid, currentColor)}}\n"], dependencies: [{ kind: "component", type: CalendarComponent, selector: "et-calendar", inputs: ["previousMonthLabel", "nextMonthLabel"] }, { kind: "directive", type: DateRangeInputFieldDirective, selector: "input[etDateRangeInputField]", inputs: ["side"], exportAs: ["etDateRangeInputField"] }, { kind: "directive", type: DatePickerSurfaceDirective, selector: "ng-template[etDatePickerSurface]", exportAs: ["etDatePickerSurface"] }, { kind: "directive", type: DatePickerTriggerDirective, selector: "button[etDatePickerTrigger]", exportAs: ["etDatePickerTrigger"] }, { kind: "component", type: DatePickerPanelComponent, selector: "et-date-picker-panel", inputs: ["dialogLabel"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }, { kind: "directive", type: InputMaskDirective, selector: "[etInputMask]", inputs: ["etInputMask", "maskValueMode", "placeholderChar"], exportAs: ["etInputMask"] }], encapsulation: i0.ViewEncapsulation.None }); }
8828
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.5", type: DateRangeInputComponent, isStandalone: true, selector: "et-date-range-input", inputs: { startAriaLabel: { classPropertyName: "startAriaLabel", publicName: "startAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, endAriaLabel: { classPropertyName: "endAriaLabel", publicName: "endAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, pickerTriggerLabel: { classPropertyName: "pickerTriggerLabel", publicName: "pickerTriggerLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "group" }, properties: { "attr.aria-labelledby": "rangeInput.labelId()" }, classAttribute: "et-date-range-input" }, providers: [provideIcons(CALENDAR_ICON)], hostDirectives: [{ directive: DateRangeInputDirective, inputs: ["value", "value", "touched", "touched", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name", "startPlaceholder", "startPlaceholder", "endPlaceholder", "endPlaceholder", "parseErrorMessage", "parseErrorMessage", "valueFormat", "valueFormat", "displayFormat", "displayFormat", "locale", "locale", "mask", "mask", "minDate", "minDate", "maxDate", "maxDate", "dateFilter", "dateFilter", "pickerOpen", "pickerOpen"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange", "pickerOpenChange", "pickerOpenChange"] }], ngImport: i0, template: "<input\n [attr.aria-label]=\"startAriaLabel()\"\n [etInputMask]=\"rangeInput.maskPattern()\"\n class=\"et-date-range-input-field\"\n etDateRangeInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n side=\"start\"\n/>\n\n<span class=\"et-date-range-input-separator\" aria-hidden=\"true\">\u2013</span>\n\n<input\n [attr.aria-label]=\"endAriaLabel()\"\n [etInputMask]=\"rangeInput.maskPattern()\"\n class=\"et-date-range-input-field\"\n etDateRangeInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n side=\"end\"\n/>\n\n<button [attr.aria-label]=\"pickerTriggerLabel()\" class=\"et-date-range-input-picker-trigger\" etDatePickerTrigger>\n <i etIcon=\"et-calendar\"></i>\n</button>\n\n<ng-template etDatePickerSurface>\n <et-date-picker-panel dialogLabel=\"Choose a date range\">\n <et-calendar\n [rangeValue]=\"rangeInput.calendarRange()\"\n [min]=\"rangeInput.minDate()\"\n [max]=\"rangeInput.maxDate()\"\n [dateFilter]=\"rangeInput.dateFilter()\"\n [locale]=\"rangeInput.effectiveLocale()\"\n (rangeValueChange)=\"rangeInput.selectCalendarRange($event)\"\n mode=\"range\"\n />\n </et-date-picker-panel>\n</ng-template>\n", styles: ["@layer components{et-date-range-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-date-range-input .et-date-range-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-date-range-input .et-date-range-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-date-range-input .et-date-range-input-field:disabled{cursor:not-allowed}et-date-range-input .et-date-range-input-separator{color:var(--et-surface-color-muted-solid, currentColor)}et-date-range-input .et-date-range-input-picker-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none;touch-action:manipulation}et-date-range-input .et-date-range-input-picker-trigger:after{content:\"\";position:absolute;inset:-14px}et-date-range-input .et-date-range-input-picker-trigger .et-icon{inline-size:16px}@media(hover:hover){et-date-range-input .et-date-range-input-picker-trigger:hover{color:var(--et-surface-color-solid, currentColor)}}et-date-range-input .et-date-range-input-picker-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-date-range-input .et-date-range-input-picker-trigger:disabled{cursor:not-allowed;color:var(--et-surface-color-subtle-solid, currentColor)}}\n"], dependencies: [{ kind: "component", type: CalendarComponent, selector: "et-calendar", inputs: ["previousMonthLabel", "nextMonthLabel"] }, { kind: "directive", type: DateRangeInputFieldDirective, selector: "input[etDateRangeInputField]", inputs: ["side"], exportAs: ["etDateRangeInputField"] }, { kind: "directive", type: DatePickerSurfaceDirective, selector: "ng-template[etDatePickerSurface]", exportAs: ["etDatePickerSurface"] }, { kind: "directive", type: DatePickerTriggerDirective, selector: "button[etDatePickerTrigger]", exportAs: ["etDatePickerTrigger"] }, { kind: "component", type: DatePickerPanelComponent, selector: "et-date-picker-panel", inputs: ["dialogLabel"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }, { kind: "directive", type: InputMaskDirective, selector: "[etInputMask]", inputs: ["etInputMask", "maskValueMode", "placeholderChar"], exportAs: ["etInputMask"] }], encapsulation: i0.ViewEncapsulation.None }); }
8829
8829
  }
8830
8830
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DateRangeInputComponent, decorators: [{
8831
8831
  type: Component,
@@ -8867,7 +8867,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
8867
8867
  class: 'et-date-range-input',
8868
8868
  role: 'group',
8869
8869
  '[attr.aria-labelledby]': 'rangeInput.labelId()',
8870
- }, template: "<input\n [attr.aria-label]=\"startAriaLabel()\"\n [etInputMask]=\"rangeInput.maskPattern()\"\n class=\"et-date-range-input-field\"\n etDateRangeInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n side=\"start\"\n/>\n\n<span class=\"et-date-range-input-separator\" aria-hidden=\"true\">\u2013</span>\n\n<input\n [attr.aria-label]=\"endAriaLabel()\"\n [etInputMask]=\"rangeInput.maskPattern()\"\n class=\"et-date-range-input-field\"\n etDateRangeInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n side=\"end\"\n/>\n\n<button [attr.aria-label]=\"pickerTriggerLabel()\" class=\"et-date-range-input-picker-trigger\" etDatePickerTrigger>\n <i etIcon=\"et-calendar\"></i>\n</button>\n\n<ng-template etDatePickerSurface>\n <et-date-picker-panel dialogLabel=\"Choose a date range\">\n <et-calendar\n [rangeValue]=\"rangeInput.calendarRange()\"\n [min]=\"rangeInput.minDate()\"\n [max]=\"rangeInput.maxDate()\"\n [dateFilter]=\"rangeInput.dateFilter()\"\n [locale]=\"rangeInput.effectiveLocale()\"\n (rangeValueChange)=\"rangeInput.selectCalendarRange($event)\"\n mode=\"range\"\n />\n </et-date-picker-panel>\n</ng-template>\n", styles: ["@layer components{et-date-range-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-date-range-input .et-date-range-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-date-range-input .et-date-range-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-date-range-input .et-date-range-input-field:disabled{cursor:not-allowed}et-date-range-input .et-date-range-input-separator{color:var(--et-surface-color-muted-solid, currentColor)}et-date-range-input .et-date-range-input-picker-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none;touch-action:manipulation}et-date-range-input .et-date-range-input-picker-trigger:after{content:\"\";position:absolute;inset:-14px}et-date-range-input .et-date-range-input-picker-trigger .et-icon{inline-size:16px}et-date-range-input .et-date-range-input-picker-trigger:hover{color:var(--et-surface-color-solid, currentColor)}et-date-range-input .et-date-range-input-picker-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-date-range-input .et-date-range-input-picker-trigger:disabled{cursor:not-allowed;color:var(--et-surface-color-subtle-solid, currentColor)}}\n"] }]
8870
+ }, template: "<input\n [attr.aria-label]=\"startAriaLabel()\"\n [etInputMask]=\"rangeInput.maskPattern()\"\n class=\"et-date-range-input-field\"\n etDateRangeInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n side=\"start\"\n/>\n\n<span class=\"et-date-range-input-separator\" aria-hidden=\"true\">\u2013</span>\n\n<input\n [attr.aria-label]=\"endAriaLabel()\"\n [etInputMask]=\"rangeInput.maskPattern()\"\n class=\"et-date-range-input-field\"\n etDateRangeInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n side=\"end\"\n/>\n\n<button [attr.aria-label]=\"pickerTriggerLabel()\" class=\"et-date-range-input-picker-trigger\" etDatePickerTrigger>\n <i etIcon=\"et-calendar\"></i>\n</button>\n\n<ng-template etDatePickerSurface>\n <et-date-picker-panel dialogLabel=\"Choose a date range\">\n <et-calendar\n [rangeValue]=\"rangeInput.calendarRange()\"\n [min]=\"rangeInput.minDate()\"\n [max]=\"rangeInput.maxDate()\"\n [dateFilter]=\"rangeInput.dateFilter()\"\n [locale]=\"rangeInput.effectiveLocale()\"\n (rangeValueChange)=\"rangeInput.selectCalendarRange($event)\"\n mode=\"range\"\n />\n </et-date-picker-panel>\n</ng-template>\n", styles: ["@layer components{et-date-range-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-date-range-input .et-date-range-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-date-range-input .et-date-range-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-date-range-input .et-date-range-input-field:disabled{cursor:not-allowed}et-date-range-input .et-date-range-input-separator{color:var(--et-surface-color-muted-solid, currentColor)}et-date-range-input .et-date-range-input-picker-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none;touch-action:manipulation}et-date-range-input .et-date-range-input-picker-trigger:after{content:\"\";position:absolute;inset:-14px}et-date-range-input .et-date-range-input-picker-trigger .et-icon{inline-size:16px}@media(hover:hover){et-date-range-input .et-date-range-input-picker-trigger:hover{color:var(--et-surface-color-solid, currentColor)}}et-date-range-input .et-date-range-input-picker-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-date-range-input .et-date-range-input-picker-trigger:disabled{cursor:not-allowed;color:var(--et-surface-color-subtle-solid, currentColor)}}\n"] }]
8871
8871
  }], propDecorators: { startAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "startAriaLabel", required: false }] }], endAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "endAriaLabel", required: false }] }], pickerTriggerLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "pickerTriggerLabel", required: false }] }] } });
8872
8872
 
8873
8873
  const DATE_RANGE_INPUT_IMPORTS = [
@@ -9270,7 +9270,7 @@ class TimePickerComponent {
9270
9270
  this.timePicker = inject(TimePickerDirective);
9271
9271
  }
9272
9272
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: TimePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
9273
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: TimePickerComponent, isStandalone: true, selector: "et-time-picker", host: { classAttribute: "et-time-picker" }, hostDirectives: [{ directive: TimePickerDirective, inputs: ["format", "format", "locale", "locale", "minuteStep", "minuteStep", "secondStep", "secondStep", "hoursLabel", "hoursLabel", "minutesLabel", "minutesLabel", "secondsLabel", "secondsLabel", "periodLabel", "periodLabel", "value", "value"], outputs: ["valueChange", "valueChange"] }], ngImport: i0, template: "@for (column of timePicker.columns(); track column.unit) {\n <div [column]=\"column\" class=\"et-time-picker-column\" etTimePickerColumn>\n @for (option of column.options; track option.value) {\n <button [option]=\"option\" class=\"et-time-picker-option\" etTimePickerOption>{{ option.label }}</button>\n }\n </div>\n}\n", styles: ["@layer components{@property --et-time-picker-column-size{syntax: \"<length>\"; inherits: true; initial-value: 240px;}@property --et-time-picker-option-size{syntax: \"<length>\"; inherits: true; initial-value: 36px;}.et-time-picker{display:inline-flex;gap:8px;-webkit-user-select:none;user-select:none}.et-time-picker .et-time-picker-column{display:flex;flex-direction:column;gap:2px;block-size:var(--et-time-picker-column-size);padding-block:calc((var(--et-time-picker-column-size) - var(--et-time-picker-option-size)) / 2);overflow-y:auto;scroll-snap-type:y proximity;scrollbar-width:none;-webkit-mask-image:linear-gradient(transparent,black 10%,black 90%,transparent);mask-image:linear-gradient(transparent,black 10%,black 90%,transparent)}.et-time-picker .et-time-picker-column::-webkit-scrollbar{display:none}.et-time-picker .et-time-picker-column+.et-time-picker-column{border-inline-start:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .08));padding-inline-start:8px}.et-time-picker .et-time-picker-option{display:inline-flex;align-items:center;justify-content:center;flex:none;scroll-snap-align:center;min-inline-size:52px;block-size:var(--et-time-picker-option-size);padding-inline:8px;border:none;border-radius:8px;background:transparent;font:inherit;font-size:14px;font-variant-numeric:tabular-nums;color:var(--et-surface-color-muted-solid);cursor:pointer;touch-action:pan-y;transition:background-color .15s ease,color .15s ease}.et-time-picker .et-time-picker-option:where([data-focused]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 8%,transparent);color:var(--et-surface-color-solid)}.et-time-picker .et-time-picker-option:where([data-selected]){background:var(--et-theme-color-primary-solid);color:var(--et-theme-color-on-primary);font-weight:600}.et-time-picker .et-time-picker-option:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent);color:var(--et-surface-color-solid)}.et-time-picker .et-time-picker-option:hover:where([data-selected]){background:var(--et-theme-color-primary-solid);color:var(--et-theme-color-on-primary)}.et-time-picker .et-time-picker-option:focus-visible{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:-2px}}\n"], dependencies: [{ kind: "directive", type: TimePickerColumnDirective, selector: "[etTimePickerColumn]", inputs: ["column"], exportAs: ["etTimePickerColumn"] }, { kind: "directive", type: TimePickerOptionDirective, selector: "button[etTimePickerOption]", inputs: ["option"], exportAs: ["etTimePickerOption"] }], encapsulation: i0.ViewEncapsulation.None }); }
9273
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: TimePickerComponent, isStandalone: true, selector: "et-time-picker", host: { classAttribute: "et-time-picker" }, hostDirectives: [{ directive: TimePickerDirective, inputs: ["format", "format", "locale", "locale", "minuteStep", "minuteStep", "secondStep", "secondStep", "hoursLabel", "hoursLabel", "minutesLabel", "minutesLabel", "secondsLabel", "secondsLabel", "periodLabel", "periodLabel", "value", "value"], outputs: ["valueChange", "valueChange"] }], ngImport: i0, template: "@for (column of timePicker.columns(); track column.unit) {\n <div [column]=\"column\" class=\"et-time-picker-column\" etTimePickerColumn>\n @for (option of column.options; track option.value) {\n <button [option]=\"option\" class=\"et-time-picker-option\" etTimePickerOption>{{ option.label }}</button>\n }\n </div>\n}\n", styles: ["@layer components{@property --et-time-picker-column-size{syntax: \"<length>\"; inherits: true; initial-value: 240px;}@property --et-time-picker-option-size{syntax: \"<length>\"; inherits: true; initial-value: 36px;}.et-time-picker{display:inline-flex;gap:8px;-webkit-user-select:none;user-select:none}.et-time-picker .et-time-picker-column{display:flex;flex-direction:column;gap:2px;block-size:var(--et-time-picker-column-size);padding-block:calc((var(--et-time-picker-column-size) - var(--et-time-picker-option-size)) / 2);overflow-y:auto;scroll-snap-type:y proximity;scrollbar-width:none;-webkit-mask-image:linear-gradient(transparent,black 10%,black 90%,transparent);mask-image:linear-gradient(transparent,black 10%,black 90%,transparent)}.et-time-picker .et-time-picker-column::-webkit-scrollbar{display:none}.et-time-picker .et-time-picker-column+.et-time-picker-column{border-inline-start:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .08));padding-inline-start:8px}.et-time-picker .et-time-picker-option{display:inline-flex;align-items:center;justify-content:center;flex:none;scroll-snap-align:center;min-inline-size:52px;block-size:var(--et-time-picker-option-size);padding-inline:8px;border:none;border-radius:8px;background:transparent;font:inherit;font-size:14px;font-variant-numeric:tabular-nums;color:var(--et-surface-color-muted-solid);cursor:pointer;touch-action:pan-y;transition:background-color .15s ease,color .15s ease}.et-time-picker .et-time-picker-option:where([data-focused]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 8%,transparent);color:var(--et-surface-color-solid)}.et-time-picker .et-time-picker-option:where([data-selected]){background:var(--et-theme-color-primary-solid);color:var(--et-theme-color-on-primary);font-weight:600}@media(hover:hover){.et-time-picker .et-time-picker-option:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent);color:var(--et-surface-color-solid)}.et-time-picker .et-time-picker-option:hover:where([data-selected]){background:var(--et-theme-color-primary-solid);color:var(--et-theme-color-on-primary)}}.et-time-picker .et-time-picker-option:focus-visible{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:-2px}}\n"], dependencies: [{ kind: "directive", type: TimePickerColumnDirective, selector: "[etTimePickerColumn]", inputs: ["column"], exportAs: ["etTimePickerColumn"] }, { kind: "directive", type: TimePickerOptionDirective, selector: "button[etTimePickerOption]", inputs: ["option"], exportAs: ["etTimePickerOption"] }], encapsulation: i0.ViewEncapsulation.None }); }
9274
9274
  }
9275
9275
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: TimePickerComponent, decorators: [{
9276
9276
  type: Component,
@@ -9292,7 +9292,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
9292
9292
  },
9293
9293
  ], host: {
9294
9294
  class: 'et-time-picker',
9295
- }, template: "@for (column of timePicker.columns(); track column.unit) {\n <div [column]=\"column\" class=\"et-time-picker-column\" etTimePickerColumn>\n @for (option of column.options; track option.value) {\n <button [option]=\"option\" class=\"et-time-picker-option\" etTimePickerOption>{{ option.label }}</button>\n }\n </div>\n}\n", styles: ["@layer components{@property --et-time-picker-column-size{syntax: \"<length>\"; inherits: true; initial-value: 240px;}@property --et-time-picker-option-size{syntax: \"<length>\"; inherits: true; initial-value: 36px;}.et-time-picker{display:inline-flex;gap:8px;-webkit-user-select:none;user-select:none}.et-time-picker .et-time-picker-column{display:flex;flex-direction:column;gap:2px;block-size:var(--et-time-picker-column-size);padding-block:calc((var(--et-time-picker-column-size) - var(--et-time-picker-option-size)) / 2);overflow-y:auto;scroll-snap-type:y proximity;scrollbar-width:none;-webkit-mask-image:linear-gradient(transparent,black 10%,black 90%,transparent);mask-image:linear-gradient(transparent,black 10%,black 90%,transparent)}.et-time-picker .et-time-picker-column::-webkit-scrollbar{display:none}.et-time-picker .et-time-picker-column+.et-time-picker-column{border-inline-start:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .08));padding-inline-start:8px}.et-time-picker .et-time-picker-option{display:inline-flex;align-items:center;justify-content:center;flex:none;scroll-snap-align:center;min-inline-size:52px;block-size:var(--et-time-picker-option-size);padding-inline:8px;border:none;border-radius:8px;background:transparent;font:inherit;font-size:14px;font-variant-numeric:tabular-nums;color:var(--et-surface-color-muted-solid);cursor:pointer;touch-action:pan-y;transition:background-color .15s ease,color .15s ease}.et-time-picker .et-time-picker-option:where([data-focused]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 8%,transparent);color:var(--et-surface-color-solid)}.et-time-picker .et-time-picker-option:where([data-selected]){background:var(--et-theme-color-primary-solid);color:var(--et-theme-color-on-primary);font-weight:600}.et-time-picker .et-time-picker-option:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent);color:var(--et-surface-color-solid)}.et-time-picker .et-time-picker-option:hover:where([data-selected]){background:var(--et-theme-color-primary-solid);color:var(--et-theme-color-on-primary)}.et-time-picker .et-time-picker-option:focus-visible{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:-2px}}\n"] }]
9295
+ }, template: "@for (column of timePicker.columns(); track column.unit) {\n <div [column]=\"column\" class=\"et-time-picker-column\" etTimePickerColumn>\n @for (option of column.options; track option.value) {\n <button [option]=\"option\" class=\"et-time-picker-option\" etTimePickerOption>{{ option.label }}</button>\n }\n </div>\n}\n", styles: ["@layer components{@property --et-time-picker-column-size{syntax: \"<length>\"; inherits: true; initial-value: 240px;}@property --et-time-picker-option-size{syntax: \"<length>\"; inherits: true; initial-value: 36px;}.et-time-picker{display:inline-flex;gap:8px;-webkit-user-select:none;user-select:none}.et-time-picker .et-time-picker-column{display:flex;flex-direction:column;gap:2px;block-size:var(--et-time-picker-column-size);padding-block:calc((var(--et-time-picker-column-size) - var(--et-time-picker-option-size)) / 2);overflow-y:auto;scroll-snap-type:y proximity;scrollbar-width:none;-webkit-mask-image:linear-gradient(transparent,black 10%,black 90%,transparent);mask-image:linear-gradient(transparent,black 10%,black 90%,transparent)}.et-time-picker .et-time-picker-column::-webkit-scrollbar{display:none}.et-time-picker .et-time-picker-column+.et-time-picker-column{border-inline-start:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .08));padding-inline-start:8px}.et-time-picker .et-time-picker-option{display:inline-flex;align-items:center;justify-content:center;flex:none;scroll-snap-align:center;min-inline-size:52px;block-size:var(--et-time-picker-option-size);padding-inline:8px;border:none;border-radius:8px;background:transparent;font:inherit;font-size:14px;font-variant-numeric:tabular-nums;color:var(--et-surface-color-muted-solid);cursor:pointer;touch-action:pan-y;transition:background-color .15s ease,color .15s ease}.et-time-picker .et-time-picker-option:where([data-focused]){background:color-mix(in srgb,var(--et-surface-interaction-solid) 8%,transparent);color:var(--et-surface-color-solid)}.et-time-picker .et-time-picker-option:where([data-selected]){background:var(--et-theme-color-primary-solid);color:var(--et-theme-color-on-primary);font-weight:600}@media(hover:hover){.et-time-picker .et-time-picker-option:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent);color:var(--et-surface-color-solid)}.et-time-picker .et-time-picker-option:hover:where([data-selected]){background:var(--et-theme-color-primary-solid);color:var(--et-theme-color-on-primary)}}.et-time-picker .et-time-picker-option:focus-visible{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:-2px}}\n"] }]
9296
9296
  }] });
9297
9297
 
9298
9298
  const TIME_PICKER_IMPORTS = [
@@ -9793,7 +9793,7 @@ class SegmentedButtonComponent {
9793
9793
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.5", type: SegmentedButtonComponent, isStandalone: true, selector: "et-segmented-button", host: { properties: { "attr.data-can-animate": "canAnimate.state() || null" }, classAttribute: "et-segmented-button" }, viewQueries: [{ propertyName: "backgroundRef", first: true, predicate: ["background"], descendants: true, isSignal: true }], hostDirectives: [{ directive: SelectionOptionDirective, inputs: ["value", "value", "checked", "checked", "disabled", "disabled"], outputs: ["checkedChange", "checkedChange"] }, { directive: i1.ColorInteractiveDirective }], ngImport: i0, template: `
9794
9794
  <div #background class="et-segmented-button-bg"></div>
9795
9795
  <ng-content />
9796
- `, isInline: true, styles: ["@layer components{@property --et-segmented-button-padding-x{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-segmented-button-padding-y{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-segmented-button-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 7px;}@property --et-segmented-button-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-segmented-button-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}et-segmented-button{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;padding:var(--et-segmented-button-padding-y) var(--et-segmented-button-padding-x);border-radius:var(--et-segmented-button-border-radius);cursor:pointer;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);font-size:14px;font-weight:500;line-height:1.4;white-space:nowrap;-webkit-user-select:none;user-select:none}et-segmented-button[data-readonly]{cursor:default}et-segmented-button .et-segmented-button-bg{position:absolute;inset:0;z-index:-1;border-radius:var(--et-segmented-button-border-radius);background-color:var(--et-theme-color-primary-solid, currentColor);opacity:0}et-segmented-button[aria-disabled=true]{opacity:var(--et-segmented-button-opacity-disabled);pointer-events:none;cursor:default}et-segmented-button:hover:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]){color:var(--et-surface-color-solid, currentColor);background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 10%,transparent)}et-segmented-button:focus-visible{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:1px}et-segmented-button:active:not([aria-disabled=true]):not([data-readonly]){transform:scale(.97)}et-segmented-button[aria-checked=true]{color:var(--et-theme-color-on-primary-solid, white)}et-segmented-button[aria-checked=true] .et-segmented-button-bg{opacity:1}et-segmented-button[data-can-animate]{transition:color var(--et-segmented-button-transition-duration) ease,transform var(--et-segmented-button-transition-duration) ease}@media(prefers-reduced-motion:reduce){et-segmented-button{--et-segmented-button-transition-duration: 1ms}}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
9796
+ `, isInline: true, styles: ["@layer components{@property --et-segmented-button-padding-x{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-segmented-button-padding-y{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-segmented-button-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 7px;}@property --et-segmented-button-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-segmented-button-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}et-segmented-button{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;padding:var(--et-segmented-button-padding-y) var(--et-segmented-button-padding-x);border-radius:var(--et-segmented-button-border-radius);cursor:pointer;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);font-size:14px;font-weight:500;line-height:1.4;white-space:nowrap;-webkit-user-select:none;user-select:none}et-segmented-button[data-readonly]{cursor:default}et-segmented-button .et-segmented-button-bg{position:absolute;inset:0;z-index:-1;border-radius:var(--et-segmented-button-border-radius);background-color:var(--et-theme-color-primary-solid, currentColor);opacity:0}et-segmented-button[aria-disabled=true]{opacity:var(--et-segmented-button-opacity-disabled);pointer-events:none;cursor:default}@media(hover:hover){et-segmented-button:hover:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]){color:var(--et-surface-color-solid, currentColor);background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 10%,transparent)}}et-segmented-button:focus-visible{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:1px}et-segmented-button:active:not([aria-disabled=true]):not([data-readonly]){transform:scale(.97)}et-segmented-button[aria-checked=true]{color:var(--et-theme-color-on-primary-solid, white)}et-segmented-button[aria-checked=true] .et-segmented-button-bg{opacity:1}et-segmented-button[data-can-animate]{transition:color var(--et-segmented-button-transition-duration) ease,transform var(--et-segmented-button-transition-duration) ease}@media(prefers-reduced-motion:reduce){et-segmented-button{--et-segmented-button-transition-duration: 1ms}}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
9797
9797
  }
9798
9798
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SegmentedButtonComponent, decorators: [{
9799
9799
  type: Component,
@@ -9810,7 +9810,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
9810
9810
  ], host: {
9811
9811
  class: 'et-segmented-button',
9812
9812
  '[attr.data-can-animate]': 'canAnimate.state() || null',
9813
- }, styles: ["@layer components{@property --et-segmented-button-padding-x{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-segmented-button-padding-y{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-segmented-button-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 7px;}@property --et-segmented-button-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-segmented-button-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}et-segmented-button{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;padding:var(--et-segmented-button-padding-y) var(--et-segmented-button-padding-x);border-radius:var(--et-segmented-button-border-radius);cursor:pointer;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);font-size:14px;font-weight:500;line-height:1.4;white-space:nowrap;-webkit-user-select:none;user-select:none}et-segmented-button[data-readonly]{cursor:default}et-segmented-button .et-segmented-button-bg{position:absolute;inset:0;z-index:-1;border-radius:var(--et-segmented-button-border-radius);background-color:var(--et-theme-color-primary-solid, currentColor);opacity:0}et-segmented-button[aria-disabled=true]{opacity:var(--et-segmented-button-opacity-disabled);pointer-events:none;cursor:default}et-segmented-button:hover:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]){color:var(--et-surface-color-solid, currentColor);background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 10%,transparent)}et-segmented-button:focus-visible{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:1px}et-segmented-button:active:not([aria-disabled=true]):not([data-readonly]){transform:scale(.97)}et-segmented-button[aria-checked=true]{color:var(--et-theme-color-on-primary-solid, white)}et-segmented-button[aria-checked=true] .et-segmented-button-bg{opacity:1}et-segmented-button[data-can-animate]{transition:color var(--et-segmented-button-transition-duration) ease,transform var(--et-segmented-button-transition-duration) ease}@media(prefers-reduced-motion:reduce){et-segmented-button{--et-segmented-button-transition-duration: 1ms}}}\n"] }]
9813
+ }, styles: ["@layer components{@property --et-segmented-button-padding-x{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-segmented-button-padding-y{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-segmented-button-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 7px;}@property --et-segmented-button-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-segmented-button-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}et-segmented-button{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;padding:var(--et-segmented-button-padding-y) var(--et-segmented-button-padding-x);border-radius:var(--et-segmented-button-border-radius);cursor:pointer;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);font-size:14px;font-weight:500;line-height:1.4;white-space:nowrap;-webkit-user-select:none;user-select:none}et-segmented-button[data-readonly]{cursor:default}et-segmented-button .et-segmented-button-bg{position:absolute;inset:0;z-index:-1;border-radius:var(--et-segmented-button-border-radius);background-color:var(--et-theme-color-primary-solid, currentColor);opacity:0}et-segmented-button[aria-disabled=true]{opacity:var(--et-segmented-button-opacity-disabled);pointer-events:none;cursor:default}@media(hover:hover){et-segmented-button:hover:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]){color:var(--et-surface-color-solid, currentColor);background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 10%,transparent)}}et-segmented-button:focus-visible{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:1px}et-segmented-button:active:not([aria-disabled=true]):not([data-readonly]){transform:scale(.97)}et-segmented-button[aria-checked=true]{color:var(--et-theme-color-on-primary-solid, white)}et-segmented-button[aria-checked=true] .et-segmented-button-bg{opacity:1}et-segmented-button[data-can-animate]{transition:color var(--et-segmented-button-transition-duration) ease,transform var(--et-segmented-button-transition-duration) ease}@media(prefers-reduced-motion:reduce){et-segmented-button{--et-segmented-button-transition-duration: 1ms}}}\n"] }]
9814
9814
  }], ctorParameters: () => [], propDecorators: { backgroundRef: [{ type: i0.ViewChild, args: ['background', { isSignal: true }] }] } });
9815
9815
 
9816
9816
  const COMPENSATION_DURATION = 160;
@@ -10248,7 +10248,7 @@ class DateTimeInputComponent {
10248
10248
  this.activePane.set(next);
10249
10249
  }
10250
10250
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DateTimeInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
10251
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: DateTimeInputComponent, isStandalone: true, selector: "et-date-time-input", inputs: { pickerTriggerLabel: { classPropertyName: "pickerTriggerLabel", publicName: "pickerTriggerLabel", isSignal: true, isRequired: false, transformFunction: null }, minuteStep: { classPropertyName: "minuteStep", publicName: "minuteStep", isSignal: true, isRequired: false, transformFunction: null }, secondStep: { classPropertyName: "secondStep", publicName: "secondStep", isSignal: true, isRequired: false, transformFunction: null }, dateTabLabel: { classPropertyName: "dateTabLabel", publicName: "dateTabLabel", isSignal: true, isRequired: false, transformFunction: null }, timeTabLabel: { classPropertyName: "timeTabLabel", publicName: "timeTabLabel", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-date-time-input" }, providers: [provideIcons(CALENDAR_ICON, TIMES_ICON)], hostDirectives: [{ directive: DateTimeInputDirective, inputs: ["value", "value", "touched", "touched", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name", "placeholder", "placeholder", "parseErrorMessage", "parseErrorMessage", "valueFormat", "valueFormat", "displayFormat", "displayFormat", "locale", "locale", "mask", "mask", "minDate", "minDate", "maxDate", "maxDate", "dateFilter", "dateFilter", "pickerOpen", "pickerOpen"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange", "pickerOpenChange", "pickerOpenChange"] }], ngImport: i0, template: "<input\n [etInputMask]=\"dateTimeInput.maskPattern()\"\n class=\"et-date-time-input-field\"\n etDateTimeInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n/>\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-date-time-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n\n<button [attr.aria-label]=\"pickerTriggerLabel()\" class=\"et-date-time-input-picker-trigger\" etDatePickerTrigger>\n <i etIcon=\"et-calendar\"></i>\n</button>\n\n<ng-template etDatePickerSurface>\n <et-date-picker-panel dialogLabel=\"Choose a date and time\">\n <div class=\"et-date-time-input-panel\">\n <div class=\"et-date-time-input-panel-tabs\">\n <et-segmented-button-group [value]=\"activePane()\" (valueChange)=\"setActivePane($event)\">\n <et-segmented-button value=\"date\">{{ dateTabLabel() }}</et-segmented-button>\n <et-segmented-button value=\"time\">{{ timeTabLabel() }}</et-segmented-button>\n </et-segmented-button-group>\n </div>\n\n <div\n [attr.data-active-pane]=\"activePane()\"\n [attr.data-nav]=\"paneNav()\"\n class=\"et-date-time-input-panel-panes\"\n etDateTimeInputPanes\n >\n <et-calendar\n [value]=\"dateTimeInput.dateTime()\"\n [min]=\"dateTimeInput.minDate()\"\n [max]=\"dateTimeInput.maxDate()\"\n [dateFilter]=\"dateTimeInput.dateFilter()\"\n [locale]=\"dateTimeInput.effectiveLocale()\"\n (valueChange)=\"dateTimeInput.selectDate($event)\"\n />\n <div class=\"et-date-time-input-panel-time-pane\">\n <et-time-picker\n [value]=\"dateTimeInput.dateTime()\"\n [format]=\"dateTimeInput.displayFormat()\"\n [locale]=\"dateTimeInput.effectiveLocale()\"\n [minuteStep]=\"minuteStep()\"\n [secondStep]=\"secondStep()\"\n (valueChange)=\"dateTimeInput.selectTime($event)\"\n />\n </div>\n </div>\n </div>\n </et-date-picker-panel>\n</ng-template>\n", styles: ["@layer components{et-date-time-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-date-time-input .et-date-time-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-date-time-input .et-date-time-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-date-time-input .et-date-time-input-field:disabled{cursor:not-allowed}et-date-time-input .et-date-time-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-date-time-input .et-date-time-input-clear .et-icon{inline-size:16px;block-size:16px}et-date-time-input .et-date-time-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}et-date-time-input .et-date-time-input-picker-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none;touch-action:manipulation}et-date-time-input .et-date-time-input-picker-trigger:after{content:\"\";position:absolute;inset:-14px}et-date-time-input .et-date-time-input-picker-trigger .et-icon{inline-size:16px}et-date-time-input .et-date-time-input-picker-trigger:hover{color:var(--et-surface-color-solid, currentColor)}et-date-time-input .et-date-time-input-picker-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-date-time-input .et-date-time-input-picker-trigger:disabled{cursor:not-allowed;color:var(--et-surface-color-subtle-solid, currentColor)}.et-date-time-input-panel .et-date-time-input-panel-tabs{display:none}.et-date-time-input-panel .et-date-time-input-panel-panes{display:flex;align-items:start;gap:12px}.et-date-time-input-panel .et-date-time-input-panel-time-pane{align-self:stretch;display:flex}.et-date-time-input-panel .et-time-picker{align-items:center;border-inline-start:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .08));padding-inline-start:12px}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-tabs{display:block;margin-block-end:12px}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-tabs .et-segmented-button-group-buttons{display:flex;align-self:stretch}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-tabs et-segmented-button{flex:1}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes{display:grid;justify-content:center;justify-items:center;align-items:center}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes>et-calendar,.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes>.et-date-time-input-panel-time-pane{grid-area:1 / 1}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-time-pane{align-self:center;align-items:center}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-time-picker{border-inline-start:none;padding-inline-start:0;--et-time-picker-column-size: 300px}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes[data-active-pane=date]>.et-date-time-input-panel-time-pane{visibility:hidden}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes[data-active-pane=time]>et-calendar{visibility:hidden}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes[data-nav=forward][data-active-pane=time]>.et-date-time-input-panel-time-pane{animation:et-date-time-input-pane-in-forward .2s ease}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes[data-nav=backward][data-active-pane=date]>et-calendar{animation:et-date-time-input-pane-in-backward .2s ease}@keyframes et-date-time-input-pane-in-forward{0%{opacity:0;transform:translate(14px)}}@keyframes et-date-time-input-pane-in-backward{0%{opacity:0;transform:translate(-14px)}}@media(prefers-reduced-motion:reduce){.et-date-time-input-panel-panes>et-calendar,.et-date-time-input-panel-panes>.et-date-time-input-panel-time-pane{animation:none}}}\n"], dependencies: [{ kind: "component", type: CalendarComponent, selector: "et-calendar", inputs: ["previousMonthLabel", "nextMonthLabel"] }, { kind: "component", type: TimePickerComponent, selector: "et-time-picker" }, { kind: "directive", type: DateTimeInputFieldDirective, selector: "input[etDateTimeInputField]", exportAs: ["etDateTimeInputField"] }, { kind: "directive", type: DatePickerSurfaceDirective, selector: "ng-template[etDatePickerSurface]", exportAs: ["etDatePickerSurface"] }, { kind: "directive", type: DatePickerTriggerDirective, selector: "button[etDatePickerTrigger]", exportAs: ["etDatePickerTrigger"] }, { kind: "component", type: DatePickerPanelComponent, selector: "et-date-picker-panel", inputs: ["dialogLabel"] }, { kind: "directive", type: DateTimeInputPanesDirective, selector: "[etDateTimeInputPanes]" }, { kind: "component", type: SegmentedButtonGroupComponent, selector: "et-segmented-button-group", inputs: ["size"] }, { kind: "component", type: SegmentedButtonComponent, selector: "et-segmented-button" }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }, { kind: "directive", type: InputMaskDirective, selector: "[etInputMask]", inputs: ["etInputMask", "maskValueMode", "placeholderChar"], exportAs: ["etInputMask"] }], encapsulation: i0.ViewEncapsulation.None }); }
10251
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: DateTimeInputComponent, isStandalone: true, selector: "et-date-time-input", inputs: { pickerTriggerLabel: { classPropertyName: "pickerTriggerLabel", publicName: "pickerTriggerLabel", isSignal: true, isRequired: false, transformFunction: null }, minuteStep: { classPropertyName: "minuteStep", publicName: "minuteStep", isSignal: true, isRequired: false, transformFunction: null }, secondStep: { classPropertyName: "secondStep", publicName: "secondStep", isSignal: true, isRequired: false, transformFunction: null }, dateTabLabel: { classPropertyName: "dateTabLabel", publicName: "dateTabLabel", isSignal: true, isRequired: false, transformFunction: null }, timeTabLabel: { classPropertyName: "timeTabLabel", publicName: "timeTabLabel", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-date-time-input" }, providers: [provideIcons(CALENDAR_ICON, TIMES_ICON)], hostDirectives: [{ directive: DateTimeInputDirective, inputs: ["value", "value", "touched", "touched", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name", "placeholder", "placeholder", "parseErrorMessage", "parseErrorMessage", "valueFormat", "valueFormat", "displayFormat", "displayFormat", "locale", "locale", "mask", "mask", "minDate", "minDate", "maxDate", "maxDate", "dateFilter", "dateFilter", "pickerOpen", "pickerOpen"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange", "pickerOpenChange", "pickerOpenChange"] }], ngImport: i0, template: "<input\n [etInputMask]=\"dateTimeInput.maskPattern()\"\n class=\"et-date-time-input-field\"\n etDateTimeInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n/>\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-date-time-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n\n<button [attr.aria-label]=\"pickerTriggerLabel()\" class=\"et-date-time-input-picker-trigger\" etDatePickerTrigger>\n <i etIcon=\"et-calendar\"></i>\n</button>\n\n<ng-template etDatePickerSurface>\n <et-date-picker-panel dialogLabel=\"Choose a date and time\">\n <div class=\"et-date-time-input-panel\">\n <div class=\"et-date-time-input-panel-tabs\">\n <et-segmented-button-group [value]=\"activePane()\" (valueChange)=\"setActivePane($event)\">\n <et-segmented-button value=\"date\">{{ dateTabLabel() }}</et-segmented-button>\n <et-segmented-button value=\"time\">{{ timeTabLabel() }}</et-segmented-button>\n </et-segmented-button-group>\n </div>\n\n <div\n [attr.data-active-pane]=\"activePane()\"\n [attr.data-nav]=\"paneNav()\"\n class=\"et-date-time-input-panel-panes\"\n etDateTimeInputPanes\n >\n <et-calendar\n [value]=\"dateTimeInput.dateTime()\"\n [min]=\"dateTimeInput.minDate()\"\n [max]=\"dateTimeInput.maxDate()\"\n [dateFilter]=\"dateTimeInput.dateFilter()\"\n [locale]=\"dateTimeInput.effectiveLocale()\"\n (valueChange)=\"dateTimeInput.selectDate($event)\"\n />\n <div class=\"et-date-time-input-panel-time-pane\">\n <et-time-picker\n [value]=\"dateTimeInput.dateTime()\"\n [format]=\"dateTimeInput.displayFormat()\"\n [locale]=\"dateTimeInput.effectiveLocale()\"\n [minuteStep]=\"minuteStep()\"\n [secondStep]=\"secondStep()\"\n (valueChange)=\"dateTimeInput.selectTime($event)\"\n />\n </div>\n </div>\n </div>\n </et-date-picker-panel>\n</ng-template>\n", styles: ["@layer components{et-date-time-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-date-time-input .et-date-time-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-date-time-input .et-date-time-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-date-time-input .et-date-time-input-field:disabled{cursor:not-allowed}et-date-time-input .et-date-time-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-date-time-input .et-date-time-input-clear .et-icon{inline-size:16px;block-size:16px}@media(hover:hover){et-date-time-input .et-date-time-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}}et-date-time-input .et-date-time-input-picker-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none;touch-action:manipulation}et-date-time-input .et-date-time-input-picker-trigger:after{content:\"\";position:absolute;inset:-14px}et-date-time-input .et-date-time-input-picker-trigger .et-icon{inline-size:16px}@media(hover:hover){et-date-time-input .et-date-time-input-picker-trigger:hover{color:var(--et-surface-color-solid, currentColor)}}et-date-time-input .et-date-time-input-picker-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-date-time-input .et-date-time-input-picker-trigger:disabled{cursor:not-allowed;color:var(--et-surface-color-subtle-solid, currentColor)}.et-date-time-input-panel .et-date-time-input-panel-tabs{display:none}.et-date-time-input-panel .et-date-time-input-panel-panes{display:flex;align-items:start;gap:12px}.et-date-time-input-panel .et-date-time-input-panel-time-pane{align-self:stretch;display:flex}.et-date-time-input-panel .et-time-picker{align-items:center;border-inline-start:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .08));padding-inline-start:12px}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-tabs{display:block;margin-block-end:12px}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-tabs .et-segmented-button-group-buttons{display:flex;align-self:stretch}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-tabs et-segmented-button{flex:1}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes{display:grid;justify-content:center;justify-items:center;align-items:center}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes>et-calendar,.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes>.et-date-time-input-panel-time-pane{grid-area:1 / 1}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-time-pane{align-self:center;align-items:center}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-time-picker{border-inline-start:none;padding-inline-start:0;--et-time-picker-column-size: 300px}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes[data-active-pane=date]>.et-date-time-input-panel-time-pane{visibility:hidden}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes[data-active-pane=time]>et-calendar{visibility:hidden}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes[data-nav=forward][data-active-pane=time]>.et-date-time-input-panel-time-pane{animation:et-date-time-input-pane-in-forward .2s ease}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes[data-nav=backward][data-active-pane=date]>et-calendar{animation:et-date-time-input-pane-in-backward .2s ease}@keyframes et-date-time-input-pane-in-forward{0%{opacity:0;transform:translate(14px)}}@keyframes et-date-time-input-pane-in-backward{0%{opacity:0;transform:translate(-14px)}}@media(prefers-reduced-motion:reduce){.et-date-time-input-panel-panes>et-calendar,.et-date-time-input-panel-panes>.et-date-time-input-panel-time-pane{animation:none}}}\n"], dependencies: [{ kind: "component", type: CalendarComponent, selector: "et-calendar", inputs: ["previousMonthLabel", "nextMonthLabel"] }, { kind: "component", type: TimePickerComponent, selector: "et-time-picker" }, { kind: "directive", type: DateTimeInputFieldDirective, selector: "input[etDateTimeInputField]", exportAs: ["etDateTimeInputField"] }, { kind: "directive", type: DatePickerSurfaceDirective, selector: "ng-template[etDatePickerSurface]", exportAs: ["etDatePickerSurface"] }, { kind: "directive", type: DatePickerTriggerDirective, selector: "button[etDatePickerTrigger]", exportAs: ["etDatePickerTrigger"] }, { kind: "component", type: DatePickerPanelComponent, selector: "et-date-picker-panel", inputs: ["dialogLabel"] }, { kind: "directive", type: DateTimeInputPanesDirective, selector: "[etDateTimeInputPanes]" }, { kind: "component", type: SegmentedButtonGroupComponent, selector: "et-segmented-button-group", inputs: ["size"] }, { kind: "component", type: SegmentedButtonComponent, selector: "et-segmented-button" }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }, { kind: "directive", type: InputMaskDirective, selector: "[etInputMask]", inputs: ["etInputMask", "maskValueMode", "placeholderChar"], exportAs: ["etInputMask"] }], encapsulation: i0.ViewEncapsulation.None }); }
10252
10252
  }
10253
10253
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DateTimeInputComponent, decorators: [{
10254
10254
  type: Component,
@@ -10291,7 +10291,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
10291
10291
  },
10292
10292
  ], host: {
10293
10293
  class: 'et-date-time-input',
10294
- }, template: "<input\n [etInputMask]=\"dateTimeInput.maskPattern()\"\n class=\"et-date-time-input-field\"\n etDateTimeInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n/>\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-date-time-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n\n<button [attr.aria-label]=\"pickerTriggerLabel()\" class=\"et-date-time-input-picker-trigger\" etDatePickerTrigger>\n <i etIcon=\"et-calendar\"></i>\n</button>\n\n<ng-template etDatePickerSurface>\n <et-date-picker-panel dialogLabel=\"Choose a date and time\">\n <div class=\"et-date-time-input-panel\">\n <div class=\"et-date-time-input-panel-tabs\">\n <et-segmented-button-group [value]=\"activePane()\" (valueChange)=\"setActivePane($event)\">\n <et-segmented-button value=\"date\">{{ dateTabLabel() }}</et-segmented-button>\n <et-segmented-button value=\"time\">{{ timeTabLabel() }}</et-segmented-button>\n </et-segmented-button-group>\n </div>\n\n <div\n [attr.data-active-pane]=\"activePane()\"\n [attr.data-nav]=\"paneNav()\"\n class=\"et-date-time-input-panel-panes\"\n etDateTimeInputPanes\n >\n <et-calendar\n [value]=\"dateTimeInput.dateTime()\"\n [min]=\"dateTimeInput.minDate()\"\n [max]=\"dateTimeInput.maxDate()\"\n [dateFilter]=\"dateTimeInput.dateFilter()\"\n [locale]=\"dateTimeInput.effectiveLocale()\"\n (valueChange)=\"dateTimeInput.selectDate($event)\"\n />\n <div class=\"et-date-time-input-panel-time-pane\">\n <et-time-picker\n [value]=\"dateTimeInput.dateTime()\"\n [format]=\"dateTimeInput.displayFormat()\"\n [locale]=\"dateTimeInput.effectiveLocale()\"\n [minuteStep]=\"minuteStep()\"\n [secondStep]=\"secondStep()\"\n (valueChange)=\"dateTimeInput.selectTime($event)\"\n />\n </div>\n </div>\n </div>\n </et-date-picker-panel>\n</ng-template>\n", styles: ["@layer components{et-date-time-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-date-time-input .et-date-time-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-date-time-input .et-date-time-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-date-time-input .et-date-time-input-field:disabled{cursor:not-allowed}et-date-time-input .et-date-time-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-date-time-input .et-date-time-input-clear .et-icon{inline-size:16px;block-size:16px}et-date-time-input .et-date-time-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}et-date-time-input .et-date-time-input-picker-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none;touch-action:manipulation}et-date-time-input .et-date-time-input-picker-trigger:after{content:\"\";position:absolute;inset:-14px}et-date-time-input .et-date-time-input-picker-trigger .et-icon{inline-size:16px}et-date-time-input .et-date-time-input-picker-trigger:hover{color:var(--et-surface-color-solid, currentColor)}et-date-time-input .et-date-time-input-picker-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-date-time-input .et-date-time-input-picker-trigger:disabled{cursor:not-allowed;color:var(--et-surface-color-subtle-solid, currentColor)}.et-date-time-input-panel .et-date-time-input-panel-tabs{display:none}.et-date-time-input-panel .et-date-time-input-panel-panes{display:flex;align-items:start;gap:12px}.et-date-time-input-panel .et-date-time-input-panel-time-pane{align-self:stretch;display:flex}.et-date-time-input-panel .et-time-picker{align-items:center;border-inline-start:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .08));padding-inline-start:12px}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-tabs{display:block;margin-block-end:12px}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-tabs .et-segmented-button-group-buttons{display:flex;align-self:stretch}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-tabs et-segmented-button{flex:1}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes{display:grid;justify-content:center;justify-items:center;align-items:center}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes>et-calendar,.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes>.et-date-time-input-panel-time-pane{grid-area:1 / 1}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-time-pane{align-self:center;align-items:center}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-time-picker{border-inline-start:none;padding-inline-start:0;--et-time-picker-column-size: 300px}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes[data-active-pane=date]>.et-date-time-input-panel-time-pane{visibility:hidden}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes[data-active-pane=time]>et-calendar{visibility:hidden}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes[data-nav=forward][data-active-pane=time]>.et-date-time-input-panel-time-pane{animation:et-date-time-input-pane-in-forward .2s ease}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes[data-nav=backward][data-active-pane=date]>et-calendar{animation:et-date-time-input-pane-in-backward .2s ease}@keyframes et-date-time-input-pane-in-forward{0%{opacity:0;transform:translate(14px)}}@keyframes et-date-time-input-pane-in-backward{0%{opacity:0;transform:translate(-14px)}}@media(prefers-reduced-motion:reduce){.et-date-time-input-panel-panes>et-calendar,.et-date-time-input-panel-panes>.et-date-time-input-panel-time-pane{animation:none}}}\n"] }]
10294
+ }, template: "<input\n [etInputMask]=\"dateTimeInput.maskPattern()\"\n class=\"et-date-time-input-field\"\n etDateTimeInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n/>\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-date-time-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n\n<button [attr.aria-label]=\"pickerTriggerLabel()\" class=\"et-date-time-input-picker-trigger\" etDatePickerTrigger>\n <i etIcon=\"et-calendar\"></i>\n</button>\n\n<ng-template etDatePickerSurface>\n <et-date-picker-panel dialogLabel=\"Choose a date and time\">\n <div class=\"et-date-time-input-panel\">\n <div class=\"et-date-time-input-panel-tabs\">\n <et-segmented-button-group [value]=\"activePane()\" (valueChange)=\"setActivePane($event)\">\n <et-segmented-button value=\"date\">{{ dateTabLabel() }}</et-segmented-button>\n <et-segmented-button value=\"time\">{{ timeTabLabel() }}</et-segmented-button>\n </et-segmented-button-group>\n </div>\n\n <div\n [attr.data-active-pane]=\"activePane()\"\n [attr.data-nav]=\"paneNav()\"\n class=\"et-date-time-input-panel-panes\"\n etDateTimeInputPanes\n >\n <et-calendar\n [value]=\"dateTimeInput.dateTime()\"\n [min]=\"dateTimeInput.minDate()\"\n [max]=\"dateTimeInput.maxDate()\"\n [dateFilter]=\"dateTimeInput.dateFilter()\"\n [locale]=\"dateTimeInput.effectiveLocale()\"\n (valueChange)=\"dateTimeInput.selectDate($event)\"\n />\n <div class=\"et-date-time-input-panel-time-pane\">\n <et-time-picker\n [value]=\"dateTimeInput.dateTime()\"\n [format]=\"dateTimeInput.displayFormat()\"\n [locale]=\"dateTimeInput.effectiveLocale()\"\n [minuteStep]=\"minuteStep()\"\n [secondStep]=\"secondStep()\"\n (valueChange)=\"dateTimeInput.selectTime($event)\"\n />\n </div>\n </div>\n </div>\n </et-date-picker-panel>\n</ng-template>\n", styles: ["@layer components{et-date-time-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-date-time-input .et-date-time-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-date-time-input .et-date-time-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-date-time-input .et-date-time-input-field:disabled{cursor:not-allowed}et-date-time-input .et-date-time-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-date-time-input .et-date-time-input-clear .et-icon{inline-size:16px;block-size:16px}@media(hover:hover){et-date-time-input .et-date-time-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}}et-date-time-input .et-date-time-input-picker-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none;touch-action:manipulation}et-date-time-input .et-date-time-input-picker-trigger:after{content:\"\";position:absolute;inset:-14px}et-date-time-input .et-date-time-input-picker-trigger .et-icon{inline-size:16px}@media(hover:hover){et-date-time-input .et-date-time-input-picker-trigger:hover{color:var(--et-surface-color-solid, currentColor)}}et-date-time-input .et-date-time-input-picker-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-date-time-input .et-date-time-input-picker-trigger:disabled{cursor:not-allowed;color:var(--et-surface-color-subtle-solid, currentColor)}.et-date-time-input-panel .et-date-time-input-panel-tabs{display:none}.et-date-time-input-panel .et-date-time-input-panel-panes{display:flex;align-items:start;gap:12px}.et-date-time-input-panel .et-date-time-input-panel-time-pane{align-self:stretch;display:flex}.et-date-time-input-panel .et-time-picker{align-items:center;border-inline-start:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .08));padding-inline-start:12px}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-tabs{display:block;margin-block-end:12px}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-tabs .et-segmented-button-group-buttons{display:flex;align-self:stretch}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-tabs et-segmented-button{flex:1}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes{display:grid;justify-content:center;justify-items:center;align-items:center}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes>et-calendar,.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes>.et-date-time-input-panel-time-pane{grid-area:1 / 1}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-time-pane{align-self:center;align-items:center}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-time-picker{border-inline-start:none;padding-inline-start:0;--et-time-picker-column-size: 300px}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes[data-active-pane=date]>.et-date-time-input-panel-time-pane{visibility:hidden}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes[data-active-pane=time]>et-calendar{visibility:hidden}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes[data-nav=forward][data-active-pane=time]>.et-date-time-input-panel-time-pane{animation:et-date-time-input-pane-in-forward .2s ease}.et-overlay.et-date-picker-sheet .et-date-time-input-panel .et-date-time-input-panel-panes[data-nav=backward][data-active-pane=date]>et-calendar{animation:et-date-time-input-pane-in-backward .2s ease}@keyframes et-date-time-input-pane-in-forward{0%{opacity:0;transform:translate(14px)}}@keyframes et-date-time-input-pane-in-backward{0%{opacity:0;transform:translate(-14px)}}@media(prefers-reduced-motion:reduce){.et-date-time-input-panel-panes>et-calendar,.et-date-time-input-panel-panes>.et-date-time-input-panel-time-pane{animation:none}}}\n"] }]
10295
10295
  }], ctorParameters: () => [], propDecorators: { pickerTriggerLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "pickerTriggerLabel", required: false }] }], minuteStep: [{ type: i0.Input, args: [{ isSignal: true, alias: "minuteStep", required: false }] }], secondStep: [{ type: i0.Input, args: [{ isSignal: true, alias: "secondStep", required: false }] }], dateTabLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "dateTabLabel", required: false }] }], timeTabLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "timeTabLabel", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], clearLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearLabel", required: false }] }] } });
10296
10296
 
10297
10297
  const DATE_TIME_INPUT_IMPORTS = [
@@ -10653,7 +10653,7 @@ class DurationInputComponent {
10653
10653
  this.durationInput.clearValue();
10654
10654
  }
10655
10655
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DurationInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
10656
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: DurationInputComponent, isStandalone: true, selector: "et-duration-input", inputs: { clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "durationInput.activate()" }, classAttribute: "et-duration-input" }, providers: [provideIcons(TIMES_ICON)], hostDirectives: [{ directive: DurationInputDirective, inputs: ["value", "value", "touched", "touched", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name", "placeholder", "placeholder", "parseErrorMessage", "parseErrorMessage", "durationFormat", "durationFormat"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange"] }], ngImport: i0, template: "<input class=\"et-duration-input-field\" etDurationInputField />\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-duration-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n", styles: ["@layer components{et-duration-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-duration-input .et-duration-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-duration-input .et-duration-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-duration-input .et-duration-input-field:disabled{cursor:not-allowed}et-duration-input .et-duration-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-duration-input .et-duration-input-clear .et-icon{inline-size:16px;block-size:16px}et-duration-input .et-duration-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}}\n"], dependencies: [{ kind: "directive", type: DurationInputFieldDirective, selector: "input[etDurationInputField]", exportAs: ["etDurationInputField"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
10656
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: DurationInputComponent, isStandalone: true, selector: "et-duration-input", inputs: { clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "durationInput.activate()" }, classAttribute: "et-duration-input" }, providers: [provideIcons(TIMES_ICON)], hostDirectives: [{ directive: DurationInputDirective, inputs: ["value", "value", "touched", "touched", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name", "placeholder", "placeholder", "parseErrorMessage", "parseErrorMessage", "durationFormat", "durationFormat"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange"] }], ngImport: i0, template: "<input class=\"et-duration-input-field\" etDurationInputField />\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-duration-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n", styles: ["@layer components{et-duration-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-duration-input .et-duration-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-duration-input .et-duration-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-duration-input .et-duration-input-field:disabled{cursor:not-allowed}et-duration-input .et-duration-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-duration-input .et-duration-input-clear .et-icon{inline-size:16px;block-size:16px}@media(hover:hover){et-duration-input .et-duration-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}}}\n"], dependencies: [{ kind: "directive", type: DurationInputFieldDirective, selector: "input[etDurationInputField]", exportAs: ["etDurationInputField"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
10657
10657
  }
10658
10658
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DurationInputComponent, decorators: [{
10659
10659
  type: Component,
@@ -10678,7 +10678,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
10678
10678
  ], host: {
10679
10679
  class: 'et-duration-input',
10680
10680
  '(click)': 'durationInput.activate()',
10681
- }, template: "<input class=\"et-duration-input-field\" etDurationInputField />\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-duration-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n", styles: ["@layer components{et-duration-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-duration-input .et-duration-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-duration-input .et-duration-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-duration-input .et-duration-input-field:disabled{cursor:not-allowed}et-duration-input .et-duration-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-duration-input .et-duration-input-clear .et-icon{inline-size:16px;block-size:16px}et-duration-input .et-duration-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}}\n"] }]
10681
+ }, template: "<input class=\"et-duration-input-field\" etDurationInputField />\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-duration-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n", styles: ["@layer components{et-duration-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-duration-input .et-duration-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-duration-input .et-duration-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-duration-input .et-duration-input-field:disabled{cursor:not-allowed}et-duration-input .et-duration-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-duration-input .et-duration-input-clear .et-icon{inline-size:16px;block-size:16px}@media(hover:hover){et-duration-input .et-duration-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}}}\n"] }]
10682
10682
  }], propDecorators: { clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], clearLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearLabel", required: false }] }] } });
10683
10683
 
10684
10684
  const DURATION_INPUT_IMPORTS = [
@@ -10851,7 +10851,7 @@ class TimeInputComponent {
10851
10851
  this.timeInput.clearValue();
10852
10852
  }
10853
10853
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: TimeInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
10854
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: TimeInputComponent, isStandalone: true, selector: "et-time-input", inputs: { pickerTriggerLabel: { classPropertyName: "pickerTriggerLabel", publicName: "pickerTriggerLabel", isSignal: true, isRequired: false, transformFunction: null }, minuteStep: { classPropertyName: "minuteStep", publicName: "minuteStep", isSignal: true, isRequired: false, transformFunction: null }, secondStep: { classPropertyName: "secondStep", publicName: "secondStep", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-time-input" }, providers: [provideIcons(CLOCK_ICON, TIMES_ICON)], hostDirectives: [{ directive: TimeInputDirective, inputs: ["value", "value", "touched", "touched", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name", "placeholder", "placeholder", "parseErrorMessage", "parseErrorMessage", "valueFormat", "valueFormat", "displayFormat", "displayFormat", "locale", "locale", "mask", "mask", "pickerOpen", "pickerOpen"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange", "pickerOpenChange", "pickerOpenChange"] }], ngImport: i0, template: "<input\n [etInputMask]=\"timeInput.maskPattern()\"\n class=\"et-time-input-field\"\n etTimeInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n/>\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-time-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n\n<button [attr.aria-label]=\"pickerTriggerLabel()\" class=\"et-time-input-picker-trigger\" etDatePickerTrigger>\n <i etIcon=\"et-clock\"></i>\n</button>\n\n<ng-template etDatePickerSurface>\n <et-date-picker-panel dialogLabel=\"Choose a time\">\n <et-time-picker\n [value]=\"timeInput.time()\"\n [format]=\"timeInput.displayFormat()\"\n [locale]=\"timeInput.effectiveLocale()\"\n [minuteStep]=\"minuteStep()\"\n [secondStep]=\"secondStep()\"\n (valueChange)=\"timeInput.selectTime($event)\"\n />\n </et-date-picker-panel>\n</ng-template>\n", styles: ["@layer components{et-time-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-time-input .et-time-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-time-input .et-time-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-time-input .et-time-input-field:disabled{cursor:not-allowed}et-time-input .et-time-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-time-input .et-time-input-clear .et-icon{inline-size:16px;block-size:16px}et-time-input .et-time-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}et-time-input .et-time-input-picker-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none;touch-action:manipulation}et-time-input .et-time-input-picker-trigger:after{content:\"\";position:absolute;inset:-14px}et-time-input .et-time-input-picker-trigger .et-icon{inline-size:16px}et-time-input .et-time-input-picker-trigger:hover{color:var(--et-surface-color-solid, currentColor)}et-time-input .et-time-input-picker-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-time-input .et-time-input-picker-trigger:disabled{cursor:not-allowed;color:var(--et-surface-color-subtle-solid, currentColor)}}\n"], dependencies: [{ kind: "component", type: TimePickerComponent, selector: "et-time-picker" }, { kind: "directive", type: TimeInputFieldDirective, selector: "input[etTimeInputField]", exportAs: ["etTimeInputField"] }, { kind: "directive", type: DatePickerSurfaceDirective, selector: "ng-template[etDatePickerSurface]", exportAs: ["etDatePickerSurface"] }, { kind: "directive", type: DatePickerTriggerDirective, selector: "button[etDatePickerTrigger]", exportAs: ["etDatePickerTrigger"] }, { kind: "component", type: DatePickerPanelComponent, selector: "et-date-picker-panel", inputs: ["dialogLabel"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }, { kind: "directive", type: InputMaskDirective, selector: "[etInputMask]", inputs: ["etInputMask", "maskValueMode", "placeholderChar"], exportAs: ["etInputMask"] }], encapsulation: i0.ViewEncapsulation.None }); }
10854
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: TimeInputComponent, isStandalone: true, selector: "et-time-input", inputs: { pickerTriggerLabel: { classPropertyName: "pickerTriggerLabel", publicName: "pickerTriggerLabel", isSignal: true, isRequired: false, transformFunction: null }, minuteStep: { classPropertyName: "minuteStep", publicName: "minuteStep", isSignal: true, isRequired: false, transformFunction: null }, secondStep: { classPropertyName: "secondStep", publicName: "secondStep", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-time-input" }, providers: [provideIcons(CLOCK_ICON, TIMES_ICON)], hostDirectives: [{ directive: TimeInputDirective, inputs: ["value", "value", "touched", "touched", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name", "placeholder", "placeholder", "parseErrorMessage", "parseErrorMessage", "valueFormat", "valueFormat", "displayFormat", "displayFormat", "locale", "locale", "mask", "mask", "pickerOpen", "pickerOpen"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange", "pickerOpenChange", "pickerOpenChange"] }], ngImport: i0, template: "<input\n [etInputMask]=\"timeInput.maskPattern()\"\n class=\"et-time-input-field\"\n etTimeInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n/>\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-time-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n\n<button [attr.aria-label]=\"pickerTriggerLabel()\" class=\"et-time-input-picker-trigger\" etDatePickerTrigger>\n <i etIcon=\"et-clock\"></i>\n</button>\n\n<ng-template etDatePickerSurface>\n <et-date-picker-panel dialogLabel=\"Choose a time\">\n <et-time-picker\n [value]=\"timeInput.time()\"\n [format]=\"timeInput.displayFormat()\"\n [locale]=\"timeInput.effectiveLocale()\"\n [minuteStep]=\"minuteStep()\"\n [secondStep]=\"secondStep()\"\n (valueChange)=\"timeInput.selectTime($event)\"\n />\n </et-date-picker-panel>\n</ng-template>\n", styles: ["@layer components{et-time-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-time-input .et-time-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-time-input .et-time-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-time-input .et-time-input-field:disabled{cursor:not-allowed}et-time-input .et-time-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-time-input .et-time-input-clear .et-icon{inline-size:16px;block-size:16px}@media(hover:hover){et-time-input .et-time-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}}et-time-input .et-time-input-picker-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none;touch-action:manipulation}et-time-input .et-time-input-picker-trigger:after{content:\"\";position:absolute;inset:-14px}et-time-input .et-time-input-picker-trigger .et-icon{inline-size:16px}@media(hover:hover){et-time-input .et-time-input-picker-trigger:hover{color:var(--et-surface-color-solid, currentColor)}}et-time-input .et-time-input-picker-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-time-input .et-time-input-picker-trigger:disabled{cursor:not-allowed;color:var(--et-surface-color-subtle-solid, currentColor)}}\n"], dependencies: [{ kind: "component", type: TimePickerComponent, selector: "et-time-picker" }, { kind: "directive", type: TimeInputFieldDirective, selector: "input[etTimeInputField]", exportAs: ["etTimeInputField"] }, { kind: "directive", type: DatePickerSurfaceDirective, selector: "ng-template[etDatePickerSurface]", exportAs: ["etDatePickerSurface"] }, { kind: "directive", type: DatePickerTriggerDirective, selector: "button[etDatePickerTrigger]", exportAs: ["etDatePickerTrigger"] }, { kind: "component", type: DatePickerPanelComponent, selector: "et-date-picker-panel", inputs: ["dialogLabel"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }, { kind: "directive", type: InputMaskDirective, selector: "[etInputMask]", inputs: ["etInputMask", "maskValueMode", "placeholderChar"], exportAs: ["etInputMask"] }], encapsulation: i0.ViewEncapsulation.None }); }
10855
10855
  }
10856
10856
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: TimeInputComponent, decorators: [{
10857
10857
  type: Component,
@@ -10887,7 +10887,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
10887
10887
  },
10888
10888
  ], host: {
10889
10889
  class: 'et-time-input',
10890
- }, template: "<input\n [etInputMask]=\"timeInput.maskPattern()\"\n class=\"et-time-input-field\"\n etTimeInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n/>\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-time-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n\n<button [attr.aria-label]=\"pickerTriggerLabel()\" class=\"et-time-input-picker-trigger\" etDatePickerTrigger>\n <i etIcon=\"et-clock\"></i>\n</button>\n\n<ng-template etDatePickerSurface>\n <et-date-picker-panel dialogLabel=\"Choose a time\">\n <et-time-picker\n [value]=\"timeInput.time()\"\n [format]=\"timeInput.displayFormat()\"\n [locale]=\"timeInput.effectiveLocale()\"\n [minuteStep]=\"minuteStep()\"\n [secondStep]=\"secondStep()\"\n (valueChange)=\"timeInput.selectTime($event)\"\n />\n </et-date-picker-panel>\n</ng-template>\n", styles: ["@layer components{et-time-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-time-input .et-time-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-time-input .et-time-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-time-input .et-time-input-field:disabled{cursor:not-allowed}et-time-input .et-time-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-time-input .et-time-input-clear .et-icon{inline-size:16px;block-size:16px}et-time-input .et-time-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}et-time-input .et-time-input-picker-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none;touch-action:manipulation}et-time-input .et-time-input-picker-trigger:after{content:\"\";position:absolute;inset:-14px}et-time-input .et-time-input-picker-trigger .et-icon{inline-size:16px}et-time-input .et-time-input-picker-trigger:hover{color:var(--et-surface-color-solid, currentColor)}et-time-input .et-time-input-picker-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-time-input .et-time-input-picker-trigger:disabled{cursor:not-allowed;color:var(--et-surface-color-subtle-solid, currentColor)}}\n"] }]
10890
+ }, template: "<input\n [etInputMask]=\"timeInput.maskPattern()\"\n class=\"et-time-input-field\"\n etTimeInputField\n maskValueMode=\"masked\"\n placeholderChar=\"_\"\n/>\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-time-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n\n<button [attr.aria-label]=\"pickerTriggerLabel()\" class=\"et-time-input-picker-trigger\" etDatePickerTrigger>\n <i etIcon=\"et-clock\"></i>\n</button>\n\n<ng-template etDatePickerSurface>\n <et-date-picker-panel dialogLabel=\"Choose a time\">\n <et-time-picker\n [value]=\"timeInput.time()\"\n [format]=\"timeInput.displayFormat()\"\n [locale]=\"timeInput.effectiveLocale()\"\n [minuteStep]=\"minuteStep()\"\n [secondStep]=\"secondStep()\"\n (valueChange)=\"timeInput.selectTime($event)\"\n />\n </et-date-picker-panel>\n</ng-template>\n", styles: ["@layer components{et-time-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-time-input .et-time-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-time-input .et-time-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-time-input .et-time-input-field:disabled{cursor:not-allowed}et-time-input .et-time-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-time-input .et-time-input-clear .et-icon{inline-size:16px;block-size:16px}@media(hover:hover){et-time-input .et-time-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}}et-time-input .et-time-input-picker-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none;touch-action:manipulation}et-time-input .et-time-input-picker-trigger:after{content:\"\";position:absolute;inset:-14px}et-time-input .et-time-input-picker-trigger .et-icon{inline-size:16px}@media(hover:hover){et-time-input .et-time-input-picker-trigger:hover{color:var(--et-surface-color-solid, currentColor)}}et-time-input .et-time-input-picker-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-time-input .et-time-input-picker-trigger:disabled{cursor:not-allowed;color:var(--et-surface-color-subtle-solid, currentColor)}}\n"] }]
10891
10891
  }], propDecorators: { pickerTriggerLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "pickerTriggerLabel", required: false }] }], minuteStep: [{ type: i0.Input, args: [{ isSignal: true, alias: "minuteStep", required: false }] }], secondStep: [{ type: i0.Input, args: [{ isSignal: true, alias: "secondStep", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], clearLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearLabel", required: false }] }] } });
10892
10892
 
10893
10893
  const TIME_INPUT_IMPORTS = [
@@ -11582,7 +11582,7 @@ class DropzoneComponent {
11582
11582
  return serverMessage ? `"${entry.name()}": ${serverMessage}` : `"${entry.name()}" ${this.uploadErrorLabel()}.`;
11583
11583
  }
11584
11584
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropzoneComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
11585
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: DropzoneComponent, isStandalone: true, selector: "et-dropzone", inputs: { retryLabel: { classPropertyName: "retryLabel", publicName: "retryLabel", isSignal: true, isRequired: false, transformFunction: null }, removeLabel: { classPropertyName: "removeLabel", publicName: "removeLabel", isSignal: true, isRequired: false, transformFunction: null }, replaceLabel: { classPropertyName: "replaceLabel", publicName: "replaceLabel", isSignal: true, isRequired: false, transformFunction: null }, uploadErrorLabel: { classPropertyName: "uploadErrorLabel", publicName: "uploadErrorLabel", isSignal: true, isRequired: false, transformFunction: null }, uploadErrorMessage: { classPropertyName: "uploadErrorMessage", publicName: "uploadErrorMessage", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-error": "support.displaysError() || null", "attr.data-multiple": "dropzoneDir.multiple() || null", "attr.data-can-animate": "canAnimate.state() || null" }, classAttribute: "et-dropzone" }, providers: [provideFormSupport(), provideIcons(UPLOAD_ICON, FILE_ICON, ROTATE_RIGHT_ICON, TIMES_ICON)], viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true, isSignal: true }, { propertyName: "browseButton", first: true, predicate: ["browseButton"], descendants: true, isSignal: true }, { propertyName: "errorContentRef", first: true, predicate: ["errorContent"], descendants: true, isSignal: true }, { propertyName: "hintContentRef", first: true, predicate: ["hintContent"], descendants: true, isSignal: true }, { propertyName: "errorAnimatableRef", first: true, predicate: ["errorAnimatable"], descendants: true, isSignal: true }, { propertyName: "hintAnimatableRef", first: true, predicate: ["hintAnimatable"], descendants: true, isSignal: true }, { propertyName: "entryElements", predicate: ["entryEl"], descendants: true, isSignal: true }], hostDirectives: [{ directive: FormFieldDirective }, { directive: DropzoneDirective, inputs: ["value", "value", "touched", "touched", "disabled", "disabled", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name", "upload", "upload", "multiple", "multiple"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange", "filesReject", "filesReject", "uploadSucceed", "uploadSucceed", "uploadFail", "uploadFail"] }, { directive: i1.ProvideColorDirective, inputs: ["etProvideColor", "color"] }], ngImport: i0, template: "<ng-content select=\"et-label\" />\n\n<input\n #fileInput\n [accept]=\"dropzoneDir.accept() || null\"\n [multiple]=\"dropzoneDir.multiple()\"\n [disabled]=\"dropzoneDir.disabled()\"\n (change)=\"uploadPickedFiles($event)\"\n (cancel)=\"resetFilePickerState()\"\n class=\"et-dropzone-native-input\"\n type=\"file\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n/>\n\n<div [attr.data-has-preview]=\"singleEntry() ? true : null\" class=\"et-dropzone-area\">\n <button\n #browseButton\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.tabindex]=\"singleEntry() ? '-1' : null\"\n [attr.aria-invalid]=\"dropzoneDir.shouldDisplayError() || null\"\n [attr.aria-describedby]=\"dropzoneDir.describedBy() || null\"\n [attr.aria-labelledby]=\"dropzoneDir.labelId() || null\"\n (click)=\"openFilePicker()\"\n (focus)=\"resetFilePickerState()\"\n (blur)=\"markTriggerTouched()\"\n class=\"et-dropzone-trigger\"\n type=\"button\"\n etFocusRing\n >\n <span class=\"et-dropzone-prompt\">\n <ng-content>\n <i class=\"et-dropzone-prompt-icon\" etIcon=\"et-upload\"></i>\n <span class=\"et-dropzone-prompt-text\">Drag &amp; drop or click to browse</span>\n </ng-content>\n </span>\n </button>\n\n @if (singleEntry(); as entry) {\n <div #entryEl [attr.data-status]=\"entry.status()\" class=\"et-dropzone-preview\">\n @if (entry.previewUrl(); as previewUrl) {\n <img [src]=\"previewUrl\" class=\"et-dropzone-preview-image\" alt=\"\" />\n } @else {\n <i class=\"et-dropzone-file-icon\" etIcon=\"et-file\"></i>\n }\n\n <div class=\"et-dropzone-preview-info\">\n <span class=\"et-dropzone-entry-name\">{{ entry.name() }}</span>\n\n @if (entry.size(); as size) {\n <span class=\"et-dropzone-entry-size\">{{ FORMAT_FILE_SIZE(size) }}</span>\n }\n\n @if (entry.source.type === 'file') {\n <div [attr.data-active]=\"entry.status() === 'uploading' || null\" class=\"et-dropzone-entry-progress\">\n <div class=\"et-dropzone-entry-progress-inner\">\n <et-progress-bar [value]=\"entry.progress() ?? 0\" [indeterminate]=\"entry.progress() === null\" />\n </div>\n </div>\n }\n </div>\n\n <div class=\"et-dropzone-preview-actions\">\n @if (entry.status() === 'error') {\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"retryLabel() + ' ' + entry.name()\"\n (click)=\"dropzoneDir.retryEntry(entry.id)\"\n class=\"et-dropzone-retry-button\"\n type=\"button\"\n et-icon-button\n variant=\"filled\"\n size=\"sm\"\n >\n <i etIcon=\"et-rotate-right\"></i>\n </button>\n } @else {\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"replaceLabel()\"\n (click)=\"openFilePicker()\"\n class=\"et-dropzone-replace-button\"\n type=\"button\"\n et-icon-button\n variant=\"filled\"\n size=\"sm\"\n >\n <i etIcon=\"et-rotate-right\"></i>\n </button>\n }\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"removeLabel() + ' ' + entry.name()\"\n (click)=\"removeEntryAnimated(entry, entryEl)\"\n class=\"et-dropzone-remove-button\"\n type=\"button\"\n et-icon-button\n variant=\"filled\"\n size=\"sm\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n </div>\n </div>\n }\n</div>\n\n@if (dropzoneDir.multiple() && dropzoneDir.entries().length) {\n <ul class=\"et-dropzone-list\" role=\"list\">\n @for (entry of dropzoneDir.entries(); track entry.id) {\n <li #entryEl [attr.data-status]=\"entry.status()\" class=\"et-dropzone-item\">\n <div class=\"et-dropzone-item-thumbnail\" aria-hidden=\"true\">\n @if (entry.previewUrl(); as previewUrl) {\n <img [src]=\"previewUrl\" class=\"et-dropzone-preview-image\" alt=\"\" />\n } @else {\n <i class=\"et-dropzone-file-icon\" etIcon=\"et-file\"></i>\n }\n </div>\n\n <div class=\"et-dropzone-item-info\">\n <span class=\"et-dropzone-entry-name\">{{ entry.name() }}</span>\n\n @if (entry.size(); as size) {\n <span class=\"et-dropzone-entry-size\">{{ FORMAT_FILE_SIZE(size) }}</span>\n }\n\n @if (entry.source.type === 'file') {\n <div [attr.data-active]=\"entry.status() === 'uploading' || null\" class=\"et-dropzone-entry-progress\">\n <div class=\"et-dropzone-entry-progress-inner\">\n <et-progress-bar [value]=\"entry.progress() ?? 0\" [indeterminate]=\"entry.progress() === null\" />\n </div>\n </div>\n }\n </div>\n\n @if (entry.status() === 'error') {\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"retryLabel() + ' ' + entry.name()\"\n (click)=\"dropzoneDir.retryEntry(entry.id)\"\n class=\"et-dropzone-retry-button\"\n type=\"button\"\n et-icon-button\n size=\"sm\"\n >\n <i etIcon=\"et-rotate-right\"></i>\n </button>\n }\n\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"removeLabel() + ' ' + entry.name()\"\n (click)=\"removeEntryAnimated(entry, entryEl)\"\n class=\"et-dropzone-remove-button\"\n type=\"button\"\n et-icon-button\n size=\"sm\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n </li>\n }\n </ul>\n}\n\n<div class=\"et-dropzone-live-status\" role=\"status\" aria-live=\"polite\">{{ liveStatusMessage() }}</div>\n\n@if (internalErrorMessages().length) {\n <div [etProvideColor]=\"support.errorColorTheme\" class=\"et-dropzone-internal-errors\" role=\"alert\">\n @for (message of internalErrorMessages(); track $index) {\n <span class=\"et-dropzone-internal-error\">{{ message }}</span>\n }\n </div>\n}\n\n@if (support.shouldRenderSupport()) {\n <div [style.block-size.px]=\"support.supportHeight()\" class=\"et-dropzone-support\">\n <div class=\"et-dropzone-support-stack\">\n @if (support.shouldRenderError()) {\n <div\n #errorContent\n #errorAnimatable=\"etAnimatable\"\n [attr.aria-atomic]=\"support.errorActive() ? 'true' : null\"\n [attr.aria-hidden]=\"!support.errorActive() ? 'true' : null\"\n [attr.aria-live]=\"support.errorActive() ? 'polite' : null\"\n [attr.data-active]=\"support.errorActive() || null\"\n [etProvideColor]=\"support.errorColorTheme\"\n class=\"et-dropzone-support-content et-dropzone-errors\"\n etAnimatable\n >\n @for (error of support.visibleErrors(); track $index) {\n <et-form-error [error]=\"error\" />\n }\n </div>\n }\n\n @if (support.shouldRenderHint()) {\n <div\n #hintContent\n #hintAnimatable=\"etAnimatable\"\n [attr.aria-hidden]=\"!support.hintActive() ? 'true' : null\"\n [attr.data-active]=\"support.hintActive() || null\"\n class=\"et-dropzone-support-content et-dropzone-hint\"\n etAnimatable\n >\n <ng-content select=\"et-hint\" />\n </div>\n }\n </div>\n </div>\n}\n", styles: ["@layer components{@property --et-dropzone-min-height{syntax: \"<length>\"; inherits: true; initial-value: 160px;}@property --et-dropzone-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-dropzone-border-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-dropzone-gap{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-dropzone-thumbnail-size{syntax: \"<length>\"; inherits: true; initial-value: 48px;}@property --et-dropzone-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-dropzone-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}@property --et-dropzone-label-font-size{syntax: \"<length>\"; inherits: true; initial-value: 13px;}@property --et-dropzone-support-duration{syntax: \"<time>\"; inherits: true; initial-value: .18s;}@property --et-dropzone-support-offset{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-dropzone-error-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-dropzone-hint-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}et-dropzone{display:flex;flex-direction:column;gap:var(--et-dropzone-gap);color:var(--et-surface-color-solid, currentColor)}et-dropzone>et-label{font-size:var(--et-dropzone-label-font-size);font-weight:500;line-height:1.2;letter-spacing:-.01em;color:var(--et-surface-color-muted-solid, currentColor);-webkit-user-select:none;user-select:none}et-dropzone .et-dropzone-native-input{position:absolute;inline-size:1px;block-size:1px;opacity:0;pointer-events:none}et-dropzone .et-dropzone-area{position:relative;display:grid}et-dropzone .et-dropzone-trigger{grid-area:1 / 1;display:grid;place-items:center;min-block-size:var(--et-dropzone-min-height);padding:16px;border:var(--et-dropzone-border-width) dashed var(--et-surface-border-solid, currentColor);border-radius:var(--et-dropzone-border-radius);background-color:transparent;color:var(--et-surface-color-muted-solid, currentColor);font:inherit;cursor:pointer;transition:border-color var(--et-dropzone-transition-duration) ease,background-color var(--et-dropzone-transition-duration) ease}et-dropzone .et-dropzone-trigger:hover:not(:disabled){border-color:var(--et-surface-interaction-hover-solid, currentColor);background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 6%,transparent)}et-dropzone .et-dropzone-trigger:disabled{cursor:not-allowed}et-dropzone .et-dropzone-prompt{display:flex;flex-direction:column;align-items:center;gap:8px}et-dropzone .et-dropzone-prompt-icon{display:block;inline-size:28px;block-size:28px}et-dropzone .et-dropzone-prompt-text{font-size:13px;line-height:1.4}et-dropzone .et-dropzone-area[data-has-preview] .et-dropzone-prompt{visibility:hidden}et-dropzone .et-dropzone-file-icon{display:block;inline-size:40px;block-size:40px;color:var(--et-surface-color-muted-solid, currentColor)}et-dropzone .et-dropzone-preview{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;border:var(--et-dropzone-border-width) solid var(--et-surface-border-solid, currentColor);border-radius:var(--et-dropzone-border-radius);background-color:var(--et-surface-background-solid, transparent)}et-dropzone .et-dropzone-preview>.et-dropzone-preview-image{position:absolute;inset:0;inline-size:100%;block-size:100%;object-fit:cover;transition:opacity var(--et-dropzone-transition-duration) ease}et-dropzone .et-dropzone-preview[data-status=error]>.et-dropzone-preview-image{opacity:.15}et-dropzone .et-dropzone-preview .et-dropzone-preview-info{position:absolute;inset:auto 0 0;display:flex;flex-direction:column;gap:4px;padding:10px 12px;background-color:#0009;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff}et-dropzone .et-dropzone-preview .et-dropzone-preview-info .et-dropzone-entry-size{color:#ffffffb3}et-dropzone .et-dropzone-preview .et-dropzone-preview-actions{position:absolute;inset-block-start:8px;inset-inline-end:8px;display:flex;gap:6px}et-dropzone .et-dropzone-list{position:relative;display:flex;flex-direction:column;gap:8px;margin:0;padding:0;list-style:none}et-dropzone .et-dropzone-item{display:flex;align-items:center;gap:12px;padding:8px;border:1px solid var(--et-surface-border-solid, currentColor);border-radius:calc(var(--et-dropzone-border-radius) / 1.5);background-color:var(--et-surface-background-solid, transparent)}et-dropzone .et-dropzone-item .et-dropzone-item-thumbnail{display:grid;place-items:center;flex-shrink:0;inline-size:var(--et-dropzone-thumbnail-size);block-size:var(--et-dropzone-thumbnail-size);overflow:hidden;border-radius:calc(var(--et-dropzone-border-radius) / 2);background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 8%,transparent)}et-dropzone .et-dropzone-item .et-dropzone-item-thumbnail .et-dropzone-preview-image{inline-size:100%;block-size:100%;object-fit:cover}et-dropzone .et-dropzone-item .et-dropzone-item-thumbnail .et-dropzone-file-icon{inline-size:22px;block-size:22px}et-dropzone .et-dropzone-item .et-dropzone-item-info{display:flex;flex-direction:column;gap:2px;min-inline-size:0;flex:1}et-dropzone .et-dropzone-entry-name{overflow:hidden;font-size:13px;line-height:1.4;text-overflow:ellipsis;white-space:nowrap}et-dropzone .et-dropzone-entry-size{font-size:12px;color:var(--et-surface-color-muted-solid, currentColor)}et-dropzone .et-dropzone-internal-errors{display:flex;flex-direction:column;gap:2px;margin-block-start:calc(4px - var(--et-dropzone-gap));font-size:var(--et-dropzone-error-font-size);color:var(--et-theme-color-primary-solid, currentColor)}et-dropzone .et-dropzone-entry-progress{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows var(--et-dropzone-transition-duration) ease,opacity var(--et-dropzone-transition-duration) ease}et-dropzone .et-dropzone-entry-progress[data-active]{grid-template-rows:1fr;opacity:1}et-dropzone .et-dropzone-entry-progress .et-dropzone-entry-progress-inner{min-block-size:0;overflow:hidden}et-dropzone .et-dropzone-entry-progress .et-dropzone-entry-progress-inner et-progress-bar{margin-block:4px 2px}et-dropzone .et-dropzone-live-status{position:absolute;inline-size:1px;block-size:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}et-dropzone .et-dropzone-support{margin-block-start:calc(4px - var(--et-dropzone-gap));overflow:clip;block-size:0}et-dropzone .et-dropzone-support-stack{position:relative;display:grid}et-dropzone .et-dropzone-support-content{grid-area:1 / 1;min-inline-size:0;opacity:0;transform:translateY(0)}et-dropzone .et-dropzone-support-content[data-active]{opacity:1;transform:translateY(0)}et-dropzone .et-dropzone-errors{display:flex;flex-direction:column;gap:2px;padding-block-start:4px;font-size:var(--et-dropzone-error-font-size);color:var(--et-theme-color-primary-solid, currentColor)}et-dropzone .et-dropzone-hint{padding-block-start:4px;font-size:var(--et-dropzone-hint-font-size);color:var(--et-surface-color-muted-solid, currentColor)}et-dropzone .et-dropzone-hint:empty{display:none}et-dropzone[data-can-animate] .et-dropzone-support{transition:block-size var(--et-dropzone-support-duration) ease}et-dropzone[data-can-animate] .et-dropzone-support-content{transition:opacity var(--et-dropzone-support-duration) ease,transform var(--et-dropzone-support-duration) ease}@starting-style{et-dropzone[data-can-animate] .et-dropzone-support-content[data-active]{opacity:0;transform:translateY(calc(var(--et-dropzone-support-offset) * -1))}}et-dropzone[data-can-animate] .et-dropzone-item,et-dropzone[data-can-animate] .et-dropzone-preview{transition:opacity var(--et-dropzone-transition-duration) ease,scale var(--et-dropzone-transition-duration) ease}@starting-style{et-dropzone[data-can-animate] .et-dropzone-item,et-dropzone[data-can-animate] .et-dropzone-preview{opacity:0;scale:.97}}et-dropzone[data-can-animate] .et-dropzone-internal-errors{transition:opacity var(--et-dropzone-support-duration) ease}@starting-style{et-dropzone[data-can-animate] .et-dropzone-internal-errors{opacity:0}}@media(prefers-reduced-motion:reduce){et-dropzone{--et-dropzone-support-duration: 1ms;--et-dropzone-support-offset: 0px;--et-dropzone-transition-duration: 1ms}}et-dropzone[data-drag-over] .et-dropzone-trigger{border-color:var(--et-theme-color-primary-solid, currentColor);background-color:color-mix(in srgb,var(--et-theme-color-primary-solid, currentColor) 8%,transparent)}et-dropzone[data-error] .et-dropzone-trigger{border-color:var(--et-theme-color-primary-solid, currentColor)}et-dropzone[data-disabled] .et-dropzone-area,et-dropzone[data-disabled] .et-dropzone-list{opacity:var(--et-dropzone-opacity-disabled)}}\n"], dependencies: [{ kind: "directive", type: AnimatableDirective, selector: "[etAnimatable]", exportAs: ["etAnimatable"] }, { kind: "component", type: FormErrorComponent, selector: "et-form-error", inputs: ["error"] }, { kind: "directive", type: ProvideColorDirective, selector: "[etProvideColor]", inputs: ["etProvideColor"] }, { kind: "component", type: ProgressBarComponent, selector: "et-progress-bar", inputs: ["value", "indeterminate"] }, { kind: "directive", type: FocusRingDirective, selector: "[etFocusRing]", inputs: ["disabled"] }, { kind: "component", type: IconButtonComponent, selector: "[et-icon-button]", inputs: ["variant", "size"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
11585
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: DropzoneComponent, isStandalone: true, selector: "et-dropzone", inputs: { retryLabel: { classPropertyName: "retryLabel", publicName: "retryLabel", isSignal: true, isRequired: false, transformFunction: null }, removeLabel: { classPropertyName: "removeLabel", publicName: "removeLabel", isSignal: true, isRequired: false, transformFunction: null }, replaceLabel: { classPropertyName: "replaceLabel", publicName: "replaceLabel", isSignal: true, isRequired: false, transformFunction: null }, uploadErrorLabel: { classPropertyName: "uploadErrorLabel", publicName: "uploadErrorLabel", isSignal: true, isRequired: false, transformFunction: null }, uploadErrorMessage: { classPropertyName: "uploadErrorMessage", publicName: "uploadErrorMessage", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-error": "support.displaysError() || null", "attr.data-multiple": "dropzoneDir.multiple() || null", "attr.data-can-animate": "canAnimate.state() || null" }, classAttribute: "et-dropzone" }, providers: [provideFormSupport(), provideIcons(UPLOAD_ICON, FILE_ICON, ROTATE_RIGHT_ICON, TIMES_ICON)], viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true, isSignal: true }, { propertyName: "browseButton", first: true, predicate: ["browseButton"], descendants: true, isSignal: true }, { propertyName: "errorContentRef", first: true, predicate: ["errorContent"], descendants: true, isSignal: true }, { propertyName: "hintContentRef", first: true, predicate: ["hintContent"], descendants: true, isSignal: true }, { propertyName: "errorAnimatableRef", first: true, predicate: ["errorAnimatable"], descendants: true, isSignal: true }, { propertyName: "hintAnimatableRef", first: true, predicate: ["hintAnimatable"], descendants: true, isSignal: true }, { propertyName: "entryElements", predicate: ["entryEl"], descendants: true, isSignal: true }], hostDirectives: [{ directive: FormFieldDirective }, { directive: DropzoneDirective, inputs: ["value", "value", "touched", "touched", "disabled", "disabled", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name", "upload", "upload", "multiple", "multiple"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange", "filesReject", "filesReject", "uploadSucceed", "uploadSucceed", "uploadFail", "uploadFail"] }, { directive: i1.ProvideColorDirective, inputs: ["etProvideColor", "color"] }], ngImport: i0, template: "<ng-content select=\"et-label\" />\n\n<input\n #fileInput\n [accept]=\"dropzoneDir.accept() || null\"\n [multiple]=\"dropzoneDir.multiple()\"\n [disabled]=\"dropzoneDir.disabled()\"\n (change)=\"uploadPickedFiles($event)\"\n (cancel)=\"resetFilePickerState()\"\n class=\"et-dropzone-native-input\"\n type=\"file\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n/>\n\n<div [attr.data-has-preview]=\"singleEntry() ? true : null\" class=\"et-dropzone-area\">\n <button\n #browseButton\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.tabindex]=\"singleEntry() ? '-1' : null\"\n [attr.aria-invalid]=\"dropzoneDir.shouldDisplayError() || null\"\n [attr.aria-describedby]=\"dropzoneDir.describedBy() || null\"\n [attr.aria-labelledby]=\"dropzoneDir.labelId() || null\"\n (click)=\"openFilePicker()\"\n (focus)=\"resetFilePickerState()\"\n (blur)=\"markTriggerTouched()\"\n class=\"et-dropzone-trigger\"\n type=\"button\"\n etFocusRing\n >\n <span class=\"et-dropzone-prompt\">\n <ng-content>\n <i class=\"et-dropzone-prompt-icon\" etIcon=\"et-upload\"></i>\n <span class=\"et-dropzone-prompt-text\">Drag &amp; drop or click to browse</span>\n </ng-content>\n </span>\n </button>\n\n @if (singleEntry(); as entry) {\n <div #entryEl [attr.data-status]=\"entry.status()\" class=\"et-dropzone-preview\">\n @if (entry.previewUrl(); as previewUrl) {\n <img [src]=\"previewUrl\" class=\"et-dropzone-preview-image\" alt=\"\" />\n } @else {\n <i class=\"et-dropzone-file-icon\" etIcon=\"et-file\"></i>\n }\n\n <div class=\"et-dropzone-preview-info\">\n <span class=\"et-dropzone-entry-name\">{{ entry.name() }}</span>\n\n @if (entry.size(); as size) {\n <span class=\"et-dropzone-entry-size\">{{ FORMAT_FILE_SIZE(size) }}</span>\n }\n\n @if (entry.source.type === 'file') {\n <div [attr.data-active]=\"entry.status() === 'uploading' || null\" class=\"et-dropzone-entry-progress\">\n <div class=\"et-dropzone-entry-progress-inner\">\n <et-progress-bar [value]=\"entry.progress() ?? 0\" [indeterminate]=\"entry.progress() === null\" />\n </div>\n </div>\n }\n </div>\n\n <div class=\"et-dropzone-preview-actions\">\n @if (entry.status() === 'error') {\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"retryLabel() + ' ' + entry.name()\"\n (click)=\"dropzoneDir.retryEntry(entry.id)\"\n class=\"et-dropzone-retry-button\"\n type=\"button\"\n et-icon-button\n variant=\"filled\"\n size=\"sm\"\n >\n <i etIcon=\"et-rotate-right\"></i>\n </button>\n } @else {\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"replaceLabel()\"\n (click)=\"openFilePicker()\"\n class=\"et-dropzone-replace-button\"\n type=\"button\"\n et-icon-button\n variant=\"filled\"\n size=\"sm\"\n >\n <i etIcon=\"et-rotate-right\"></i>\n </button>\n }\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"removeLabel() + ' ' + entry.name()\"\n (click)=\"removeEntryAnimated(entry, entryEl)\"\n class=\"et-dropzone-remove-button\"\n type=\"button\"\n et-icon-button\n variant=\"filled\"\n size=\"sm\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n </div>\n </div>\n }\n</div>\n\n@if (dropzoneDir.multiple() && dropzoneDir.entries().length) {\n <ul class=\"et-dropzone-list\" role=\"list\">\n @for (entry of dropzoneDir.entries(); track entry.id) {\n <li #entryEl [attr.data-status]=\"entry.status()\" class=\"et-dropzone-item\">\n <div class=\"et-dropzone-item-thumbnail\" aria-hidden=\"true\">\n @if (entry.previewUrl(); as previewUrl) {\n <img [src]=\"previewUrl\" class=\"et-dropzone-preview-image\" alt=\"\" />\n } @else {\n <i class=\"et-dropzone-file-icon\" etIcon=\"et-file\"></i>\n }\n </div>\n\n <div class=\"et-dropzone-item-info\">\n <span class=\"et-dropzone-entry-name\">{{ entry.name() }}</span>\n\n @if (entry.size(); as size) {\n <span class=\"et-dropzone-entry-size\">{{ FORMAT_FILE_SIZE(size) }}</span>\n }\n\n @if (entry.source.type === 'file') {\n <div [attr.data-active]=\"entry.status() === 'uploading' || null\" class=\"et-dropzone-entry-progress\">\n <div class=\"et-dropzone-entry-progress-inner\">\n <et-progress-bar [value]=\"entry.progress() ?? 0\" [indeterminate]=\"entry.progress() === null\" />\n </div>\n </div>\n }\n </div>\n\n @if (entry.status() === 'error') {\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"retryLabel() + ' ' + entry.name()\"\n (click)=\"dropzoneDir.retryEntry(entry.id)\"\n class=\"et-dropzone-retry-button\"\n type=\"button\"\n et-icon-button\n size=\"sm\"\n >\n <i etIcon=\"et-rotate-right\"></i>\n </button>\n }\n\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"removeLabel() + ' ' + entry.name()\"\n (click)=\"removeEntryAnimated(entry, entryEl)\"\n class=\"et-dropzone-remove-button\"\n type=\"button\"\n et-icon-button\n size=\"sm\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n </li>\n }\n </ul>\n}\n\n<div class=\"et-dropzone-live-status\" role=\"status\" aria-live=\"polite\">{{ liveStatusMessage() }}</div>\n\n@if (internalErrorMessages().length) {\n <div [etProvideColor]=\"support.errorColorTheme\" class=\"et-dropzone-internal-errors\" role=\"alert\">\n @for (message of internalErrorMessages(); track $index) {\n <span class=\"et-dropzone-internal-error\">{{ message }}</span>\n }\n </div>\n}\n\n@if (support.shouldRenderSupport()) {\n <div [style.block-size.px]=\"support.supportHeight()\" class=\"et-dropzone-support\">\n <div class=\"et-dropzone-support-stack\">\n @if (support.shouldRenderError()) {\n <div\n #errorContent\n #errorAnimatable=\"etAnimatable\"\n [attr.aria-atomic]=\"support.errorActive() ? 'true' : null\"\n [attr.aria-hidden]=\"!support.errorActive() ? 'true' : null\"\n [attr.aria-live]=\"support.errorActive() ? 'polite' : null\"\n [attr.data-active]=\"support.errorActive() || null\"\n [etProvideColor]=\"support.errorColorTheme\"\n class=\"et-dropzone-support-content et-dropzone-errors\"\n etAnimatable\n >\n @for (error of support.visibleErrors(); track $index) {\n <et-form-error [error]=\"error\" />\n }\n </div>\n }\n\n @if (support.shouldRenderHint()) {\n <div\n #hintContent\n #hintAnimatable=\"etAnimatable\"\n [attr.aria-hidden]=\"!support.hintActive() ? 'true' : null\"\n [attr.data-active]=\"support.hintActive() || null\"\n class=\"et-dropzone-support-content et-dropzone-hint\"\n etAnimatable\n >\n <ng-content select=\"et-hint\" />\n </div>\n }\n </div>\n </div>\n}\n", styles: ["@layer components{@property --et-dropzone-min-height{syntax: \"<length>\"; inherits: true; initial-value: 160px;}@property --et-dropzone-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-dropzone-border-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-dropzone-gap{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-dropzone-thumbnail-size{syntax: \"<length>\"; inherits: true; initial-value: 48px;}@property --et-dropzone-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-dropzone-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}@property --et-dropzone-label-font-size{syntax: \"<length>\"; inherits: true; initial-value: 13px;}@property --et-dropzone-support-duration{syntax: \"<time>\"; inherits: true; initial-value: .18s;}@property --et-dropzone-support-offset{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-dropzone-error-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-dropzone-hint-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}et-dropzone{display:flex;flex-direction:column;gap:var(--et-dropzone-gap);color:var(--et-surface-color-solid, currentColor)}et-dropzone>et-label{font-size:var(--et-dropzone-label-font-size);font-weight:500;line-height:1.2;letter-spacing:-.01em;color:var(--et-surface-color-muted-solid, currentColor);-webkit-user-select:none;user-select:none}et-dropzone .et-dropzone-native-input{position:absolute;inline-size:1px;block-size:1px;opacity:0;pointer-events:none}et-dropzone .et-dropzone-area{position:relative;display:grid}et-dropzone .et-dropzone-trigger{grid-area:1 / 1;display:grid;place-items:center;min-block-size:var(--et-dropzone-min-height);padding:16px;border:var(--et-dropzone-border-width) dashed var(--et-surface-border-solid, currentColor);border-radius:var(--et-dropzone-border-radius);background-color:transparent;color:var(--et-surface-color-muted-solid, currentColor);font:inherit;cursor:pointer;transition:border-color var(--et-dropzone-transition-duration) ease,background-color var(--et-dropzone-transition-duration) ease}@media(hover:hover){et-dropzone .et-dropzone-trigger:hover:not(:disabled){border-color:var(--et-surface-interaction-hover-solid, currentColor);background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 6%,transparent)}}et-dropzone .et-dropzone-trigger:disabled{cursor:not-allowed}et-dropzone .et-dropzone-prompt{display:flex;flex-direction:column;align-items:center;gap:8px}et-dropzone .et-dropzone-prompt-icon{display:block;inline-size:28px;block-size:28px}et-dropzone .et-dropzone-prompt-text{font-size:13px;line-height:1.4}et-dropzone .et-dropzone-area[data-has-preview] .et-dropzone-prompt{visibility:hidden}et-dropzone .et-dropzone-file-icon{display:block;inline-size:40px;block-size:40px;color:var(--et-surface-color-muted-solid, currentColor)}et-dropzone .et-dropzone-preview{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;border:var(--et-dropzone-border-width) solid var(--et-surface-border-solid, currentColor);border-radius:var(--et-dropzone-border-radius);background-color:var(--et-surface-background-solid, transparent)}et-dropzone .et-dropzone-preview>.et-dropzone-preview-image{position:absolute;inset:0;inline-size:100%;block-size:100%;object-fit:cover;transition:opacity var(--et-dropzone-transition-duration) ease}et-dropzone .et-dropzone-preview[data-status=error]>.et-dropzone-preview-image{opacity:.15}et-dropzone .et-dropzone-preview .et-dropzone-preview-info{position:absolute;inset:auto 0 0;display:flex;flex-direction:column;gap:4px;padding:10px 12px;background-color:#0009;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff}et-dropzone .et-dropzone-preview .et-dropzone-preview-info .et-dropzone-entry-size{color:#ffffffb3}et-dropzone .et-dropzone-preview .et-dropzone-preview-actions{position:absolute;inset-block-start:8px;inset-inline-end:8px;display:flex;gap:6px}et-dropzone .et-dropzone-list{position:relative;display:flex;flex-direction:column;gap:8px;margin:0;padding:0;list-style:none}et-dropzone .et-dropzone-item{display:flex;align-items:center;gap:12px;padding:8px;border:1px solid var(--et-surface-border-solid, currentColor);border-radius:calc(var(--et-dropzone-border-radius) / 1.5);background-color:var(--et-surface-background-solid, transparent)}et-dropzone .et-dropzone-item .et-dropzone-item-thumbnail{display:grid;place-items:center;flex-shrink:0;inline-size:var(--et-dropzone-thumbnail-size);block-size:var(--et-dropzone-thumbnail-size);overflow:hidden;border-radius:calc(var(--et-dropzone-border-radius) / 2);background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 8%,transparent)}et-dropzone .et-dropzone-item .et-dropzone-item-thumbnail .et-dropzone-preview-image{inline-size:100%;block-size:100%;object-fit:cover}et-dropzone .et-dropzone-item .et-dropzone-item-thumbnail .et-dropzone-file-icon{inline-size:22px;block-size:22px}et-dropzone .et-dropzone-item .et-dropzone-item-info{display:flex;flex-direction:column;gap:2px;min-inline-size:0;flex:1}et-dropzone .et-dropzone-entry-name{overflow:hidden;font-size:13px;line-height:1.4;text-overflow:ellipsis;white-space:nowrap}et-dropzone .et-dropzone-entry-size{font-size:12px;color:var(--et-surface-color-muted-solid, currentColor)}et-dropzone .et-dropzone-internal-errors{display:flex;flex-direction:column;gap:2px;margin-block-start:calc(4px - var(--et-dropzone-gap));font-size:var(--et-dropzone-error-font-size);color:var(--et-theme-color-primary-solid, currentColor)}et-dropzone .et-dropzone-entry-progress{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows var(--et-dropzone-transition-duration) ease,opacity var(--et-dropzone-transition-duration) ease}et-dropzone .et-dropzone-entry-progress[data-active]{grid-template-rows:1fr;opacity:1}et-dropzone .et-dropzone-entry-progress .et-dropzone-entry-progress-inner{min-block-size:0;overflow:hidden}et-dropzone .et-dropzone-entry-progress .et-dropzone-entry-progress-inner et-progress-bar{margin-block:4px 2px}et-dropzone .et-dropzone-live-status{position:absolute;inline-size:1px;block-size:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}et-dropzone .et-dropzone-support{margin-block-start:calc(4px - var(--et-dropzone-gap));overflow:clip;block-size:0}et-dropzone .et-dropzone-support-stack{position:relative;display:grid}et-dropzone .et-dropzone-support-content{grid-area:1 / 1;min-inline-size:0;opacity:0;transform:translateY(0)}et-dropzone .et-dropzone-support-content[data-active]{opacity:1;transform:translateY(0)}et-dropzone .et-dropzone-errors{display:flex;flex-direction:column;gap:2px;padding-block-start:4px;font-size:var(--et-dropzone-error-font-size);color:var(--et-theme-color-primary-solid, currentColor)}et-dropzone .et-dropzone-hint{padding-block-start:4px;font-size:var(--et-dropzone-hint-font-size);color:var(--et-surface-color-muted-solid, currentColor)}et-dropzone .et-dropzone-hint:empty{display:none}et-dropzone[data-can-animate] .et-dropzone-support{transition:block-size var(--et-dropzone-support-duration) ease}et-dropzone[data-can-animate] .et-dropzone-support-content{transition:opacity var(--et-dropzone-support-duration) ease,transform var(--et-dropzone-support-duration) ease}@starting-style{et-dropzone[data-can-animate] .et-dropzone-support-content[data-active]{opacity:0;transform:translateY(calc(var(--et-dropzone-support-offset) * -1))}}et-dropzone[data-can-animate] .et-dropzone-item,et-dropzone[data-can-animate] .et-dropzone-preview{transition:opacity var(--et-dropzone-transition-duration) ease,scale var(--et-dropzone-transition-duration) ease}@starting-style{et-dropzone[data-can-animate] .et-dropzone-item,et-dropzone[data-can-animate] .et-dropzone-preview{opacity:0;scale:.97}}et-dropzone[data-can-animate] .et-dropzone-internal-errors{transition:opacity var(--et-dropzone-support-duration) ease}@starting-style{et-dropzone[data-can-animate] .et-dropzone-internal-errors{opacity:0}}@media(prefers-reduced-motion:reduce){et-dropzone{--et-dropzone-support-duration: 1ms;--et-dropzone-support-offset: 0px;--et-dropzone-transition-duration: 1ms}}et-dropzone[data-drag-over] .et-dropzone-trigger{border-color:var(--et-theme-color-primary-solid, currentColor);background-color:color-mix(in srgb,var(--et-theme-color-primary-solid, currentColor) 8%,transparent)}et-dropzone[data-error] .et-dropzone-trigger{border-color:var(--et-theme-color-primary-solid, currentColor)}et-dropzone[data-disabled] .et-dropzone-area,et-dropzone[data-disabled] .et-dropzone-list{opacity:var(--et-dropzone-opacity-disabled)}}\n"], dependencies: [{ kind: "directive", type: AnimatableDirective, selector: "[etAnimatable]", exportAs: ["etAnimatable"] }, { kind: "component", type: FormErrorComponent, selector: "et-form-error", inputs: ["error"] }, { kind: "directive", type: ProvideColorDirective, selector: "[etProvideColor]", inputs: ["etProvideColor"] }, { kind: "component", type: ProgressBarComponent, selector: "et-progress-bar", inputs: ["value", "indeterminate"] }, { kind: "directive", type: FocusRingDirective, selector: "[etFocusRing]", inputs: ["disabled"] }, { kind: "component", type: IconButtonComponent, selector: "[et-icon-button]", inputs: ["variant", "size"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
11586
11586
  }
11587
11587
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: DropzoneComponent, decorators: [{
11588
11588
  type: Component,
@@ -11607,7 +11607,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
11607
11607
  '[attr.data-error]': 'support.displaysError() || null',
11608
11608
  '[attr.data-multiple]': 'dropzoneDir.multiple() || null',
11609
11609
  '[attr.data-can-animate]': 'canAnimate.state() || null',
11610
- }, template: "<ng-content select=\"et-label\" />\n\n<input\n #fileInput\n [accept]=\"dropzoneDir.accept() || null\"\n [multiple]=\"dropzoneDir.multiple()\"\n [disabled]=\"dropzoneDir.disabled()\"\n (change)=\"uploadPickedFiles($event)\"\n (cancel)=\"resetFilePickerState()\"\n class=\"et-dropzone-native-input\"\n type=\"file\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n/>\n\n<div [attr.data-has-preview]=\"singleEntry() ? true : null\" class=\"et-dropzone-area\">\n <button\n #browseButton\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.tabindex]=\"singleEntry() ? '-1' : null\"\n [attr.aria-invalid]=\"dropzoneDir.shouldDisplayError() || null\"\n [attr.aria-describedby]=\"dropzoneDir.describedBy() || null\"\n [attr.aria-labelledby]=\"dropzoneDir.labelId() || null\"\n (click)=\"openFilePicker()\"\n (focus)=\"resetFilePickerState()\"\n (blur)=\"markTriggerTouched()\"\n class=\"et-dropzone-trigger\"\n type=\"button\"\n etFocusRing\n >\n <span class=\"et-dropzone-prompt\">\n <ng-content>\n <i class=\"et-dropzone-prompt-icon\" etIcon=\"et-upload\"></i>\n <span class=\"et-dropzone-prompt-text\">Drag &amp; drop or click to browse</span>\n </ng-content>\n </span>\n </button>\n\n @if (singleEntry(); as entry) {\n <div #entryEl [attr.data-status]=\"entry.status()\" class=\"et-dropzone-preview\">\n @if (entry.previewUrl(); as previewUrl) {\n <img [src]=\"previewUrl\" class=\"et-dropzone-preview-image\" alt=\"\" />\n } @else {\n <i class=\"et-dropzone-file-icon\" etIcon=\"et-file\"></i>\n }\n\n <div class=\"et-dropzone-preview-info\">\n <span class=\"et-dropzone-entry-name\">{{ entry.name() }}</span>\n\n @if (entry.size(); as size) {\n <span class=\"et-dropzone-entry-size\">{{ FORMAT_FILE_SIZE(size) }}</span>\n }\n\n @if (entry.source.type === 'file') {\n <div [attr.data-active]=\"entry.status() === 'uploading' || null\" class=\"et-dropzone-entry-progress\">\n <div class=\"et-dropzone-entry-progress-inner\">\n <et-progress-bar [value]=\"entry.progress() ?? 0\" [indeterminate]=\"entry.progress() === null\" />\n </div>\n </div>\n }\n </div>\n\n <div class=\"et-dropzone-preview-actions\">\n @if (entry.status() === 'error') {\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"retryLabel() + ' ' + entry.name()\"\n (click)=\"dropzoneDir.retryEntry(entry.id)\"\n class=\"et-dropzone-retry-button\"\n type=\"button\"\n et-icon-button\n variant=\"filled\"\n size=\"sm\"\n >\n <i etIcon=\"et-rotate-right\"></i>\n </button>\n } @else {\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"replaceLabel()\"\n (click)=\"openFilePicker()\"\n class=\"et-dropzone-replace-button\"\n type=\"button\"\n et-icon-button\n variant=\"filled\"\n size=\"sm\"\n >\n <i etIcon=\"et-rotate-right\"></i>\n </button>\n }\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"removeLabel() + ' ' + entry.name()\"\n (click)=\"removeEntryAnimated(entry, entryEl)\"\n class=\"et-dropzone-remove-button\"\n type=\"button\"\n et-icon-button\n variant=\"filled\"\n size=\"sm\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n </div>\n </div>\n }\n</div>\n\n@if (dropzoneDir.multiple() && dropzoneDir.entries().length) {\n <ul class=\"et-dropzone-list\" role=\"list\">\n @for (entry of dropzoneDir.entries(); track entry.id) {\n <li #entryEl [attr.data-status]=\"entry.status()\" class=\"et-dropzone-item\">\n <div class=\"et-dropzone-item-thumbnail\" aria-hidden=\"true\">\n @if (entry.previewUrl(); as previewUrl) {\n <img [src]=\"previewUrl\" class=\"et-dropzone-preview-image\" alt=\"\" />\n } @else {\n <i class=\"et-dropzone-file-icon\" etIcon=\"et-file\"></i>\n }\n </div>\n\n <div class=\"et-dropzone-item-info\">\n <span class=\"et-dropzone-entry-name\">{{ entry.name() }}</span>\n\n @if (entry.size(); as size) {\n <span class=\"et-dropzone-entry-size\">{{ FORMAT_FILE_SIZE(size) }}</span>\n }\n\n @if (entry.source.type === 'file') {\n <div [attr.data-active]=\"entry.status() === 'uploading' || null\" class=\"et-dropzone-entry-progress\">\n <div class=\"et-dropzone-entry-progress-inner\">\n <et-progress-bar [value]=\"entry.progress() ?? 0\" [indeterminate]=\"entry.progress() === null\" />\n </div>\n </div>\n }\n </div>\n\n @if (entry.status() === 'error') {\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"retryLabel() + ' ' + entry.name()\"\n (click)=\"dropzoneDir.retryEntry(entry.id)\"\n class=\"et-dropzone-retry-button\"\n type=\"button\"\n et-icon-button\n size=\"sm\"\n >\n <i etIcon=\"et-rotate-right\"></i>\n </button>\n }\n\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"removeLabel() + ' ' + entry.name()\"\n (click)=\"removeEntryAnimated(entry, entryEl)\"\n class=\"et-dropzone-remove-button\"\n type=\"button\"\n et-icon-button\n size=\"sm\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n </li>\n }\n </ul>\n}\n\n<div class=\"et-dropzone-live-status\" role=\"status\" aria-live=\"polite\">{{ liveStatusMessage() }}</div>\n\n@if (internalErrorMessages().length) {\n <div [etProvideColor]=\"support.errorColorTheme\" class=\"et-dropzone-internal-errors\" role=\"alert\">\n @for (message of internalErrorMessages(); track $index) {\n <span class=\"et-dropzone-internal-error\">{{ message }}</span>\n }\n </div>\n}\n\n@if (support.shouldRenderSupport()) {\n <div [style.block-size.px]=\"support.supportHeight()\" class=\"et-dropzone-support\">\n <div class=\"et-dropzone-support-stack\">\n @if (support.shouldRenderError()) {\n <div\n #errorContent\n #errorAnimatable=\"etAnimatable\"\n [attr.aria-atomic]=\"support.errorActive() ? 'true' : null\"\n [attr.aria-hidden]=\"!support.errorActive() ? 'true' : null\"\n [attr.aria-live]=\"support.errorActive() ? 'polite' : null\"\n [attr.data-active]=\"support.errorActive() || null\"\n [etProvideColor]=\"support.errorColorTheme\"\n class=\"et-dropzone-support-content et-dropzone-errors\"\n etAnimatable\n >\n @for (error of support.visibleErrors(); track $index) {\n <et-form-error [error]=\"error\" />\n }\n </div>\n }\n\n @if (support.shouldRenderHint()) {\n <div\n #hintContent\n #hintAnimatable=\"etAnimatable\"\n [attr.aria-hidden]=\"!support.hintActive() ? 'true' : null\"\n [attr.data-active]=\"support.hintActive() || null\"\n class=\"et-dropzone-support-content et-dropzone-hint\"\n etAnimatable\n >\n <ng-content select=\"et-hint\" />\n </div>\n }\n </div>\n </div>\n}\n", styles: ["@layer components{@property --et-dropzone-min-height{syntax: \"<length>\"; inherits: true; initial-value: 160px;}@property --et-dropzone-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-dropzone-border-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-dropzone-gap{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-dropzone-thumbnail-size{syntax: \"<length>\"; inherits: true; initial-value: 48px;}@property --et-dropzone-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-dropzone-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}@property --et-dropzone-label-font-size{syntax: \"<length>\"; inherits: true; initial-value: 13px;}@property --et-dropzone-support-duration{syntax: \"<time>\"; inherits: true; initial-value: .18s;}@property --et-dropzone-support-offset{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-dropzone-error-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-dropzone-hint-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}et-dropzone{display:flex;flex-direction:column;gap:var(--et-dropzone-gap);color:var(--et-surface-color-solid, currentColor)}et-dropzone>et-label{font-size:var(--et-dropzone-label-font-size);font-weight:500;line-height:1.2;letter-spacing:-.01em;color:var(--et-surface-color-muted-solid, currentColor);-webkit-user-select:none;user-select:none}et-dropzone .et-dropzone-native-input{position:absolute;inline-size:1px;block-size:1px;opacity:0;pointer-events:none}et-dropzone .et-dropzone-area{position:relative;display:grid}et-dropzone .et-dropzone-trigger{grid-area:1 / 1;display:grid;place-items:center;min-block-size:var(--et-dropzone-min-height);padding:16px;border:var(--et-dropzone-border-width) dashed var(--et-surface-border-solid, currentColor);border-radius:var(--et-dropzone-border-radius);background-color:transparent;color:var(--et-surface-color-muted-solid, currentColor);font:inherit;cursor:pointer;transition:border-color var(--et-dropzone-transition-duration) ease,background-color var(--et-dropzone-transition-duration) ease}et-dropzone .et-dropzone-trigger:hover:not(:disabled){border-color:var(--et-surface-interaction-hover-solid, currentColor);background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 6%,transparent)}et-dropzone .et-dropzone-trigger:disabled{cursor:not-allowed}et-dropzone .et-dropzone-prompt{display:flex;flex-direction:column;align-items:center;gap:8px}et-dropzone .et-dropzone-prompt-icon{display:block;inline-size:28px;block-size:28px}et-dropzone .et-dropzone-prompt-text{font-size:13px;line-height:1.4}et-dropzone .et-dropzone-area[data-has-preview] .et-dropzone-prompt{visibility:hidden}et-dropzone .et-dropzone-file-icon{display:block;inline-size:40px;block-size:40px;color:var(--et-surface-color-muted-solid, currentColor)}et-dropzone .et-dropzone-preview{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;border:var(--et-dropzone-border-width) solid var(--et-surface-border-solid, currentColor);border-radius:var(--et-dropzone-border-radius);background-color:var(--et-surface-background-solid, transparent)}et-dropzone .et-dropzone-preview>.et-dropzone-preview-image{position:absolute;inset:0;inline-size:100%;block-size:100%;object-fit:cover;transition:opacity var(--et-dropzone-transition-duration) ease}et-dropzone .et-dropzone-preview[data-status=error]>.et-dropzone-preview-image{opacity:.15}et-dropzone .et-dropzone-preview .et-dropzone-preview-info{position:absolute;inset:auto 0 0;display:flex;flex-direction:column;gap:4px;padding:10px 12px;background-color:#0009;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff}et-dropzone .et-dropzone-preview .et-dropzone-preview-info .et-dropzone-entry-size{color:#ffffffb3}et-dropzone .et-dropzone-preview .et-dropzone-preview-actions{position:absolute;inset-block-start:8px;inset-inline-end:8px;display:flex;gap:6px}et-dropzone .et-dropzone-list{position:relative;display:flex;flex-direction:column;gap:8px;margin:0;padding:0;list-style:none}et-dropzone .et-dropzone-item{display:flex;align-items:center;gap:12px;padding:8px;border:1px solid var(--et-surface-border-solid, currentColor);border-radius:calc(var(--et-dropzone-border-radius) / 1.5);background-color:var(--et-surface-background-solid, transparent)}et-dropzone .et-dropzone-item .et-dropzone-item-thumbnail{display:grid;place-items:center;flex-shrink:0;inline-size:var(--et-dropzone-thumbnail-size);block-size:var(--et-dropzone-thumbnail-size);overflow:hidden;border-radius:calc(var(--et-dropzone-border-radius) / 2);background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 8%,transparent)}et-dropzone .et-dropzone-item .et-dropzone-item-thumbnail .et-dropzone-preview-image{inline-size:100%;block-size:100%;object-fit:cover}et-dropzone .et-dropzone-item .et-dropzone-item-thumbnail .et-dropzone-file-icon{inline-size:22px;block-size:22px}et-dropzone .et-dropzone-item .et-dropzone-item-info{display:flex;flex-direction:column;gap:2px;min-inline-size:0;flex:1}et-dropzone .et-dropzone-entry-name{overflow:hidden;font-size:13px;line-height:1.4;text-overflow:ellipsis;white-space:nowrap}et-dropzone .et-dropzone-entry-size{font-size:12px;color:var(--et-surface-color-muted-solid, currentColor)}et-dropzone .et-dropzone-internal-errors{display:flex;flex-direction:column;gap:2px;margin-block-start:calc(4px - var(--et-dropzone-gap));font-size:var(--et-dropzone-error-font-size);color:var(--et-theme-color-primary-solid, currentColor)}et-dropzone .et-dropzone-entry-progress{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows var(--et-dropzone-transition-duration) ease,opacity var(--et-dropzone-transition-duration) ease}et-dropzone .et-dropzone-entry-progress[data-active]{grid-template-rows:1fr;opacity:1}et-dropzone .et-dropzone-entry-progress .et-dropzone-entry-progress-inner{min-block-size:0;overflow:hidden}et-dropzone .et-dropzone-entry-progress .et-dropzone-entry-progress-inner et-progress-bar{margin-block:4px 2px}et-dropzone .et-dropzone-live-status{position:absolute;inline-size:1px;block-size:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}et-dropzone .et-dropzone-support{margin-block-start:calc(4px - var(--et-dropzone-gap));overflow:clip;block-size:0}et-dropzone .et-dropzone-support-stack{position:relative;display:grid}et-dropzone .et-dropzone-support-content{grid-area:1 / 1;min-inline-size:0;opacity:0;transform:translateY(0)}et-dropzone .et-dropzone-support-content[data-active]{opacity:1;transform:translateY(0)}et-dropzone .et-dropzone-errors{display:flex;flex-direction:column;gap:2px;padding-block-start:4px;font-size:var(--et-dropzone-error-font-size);color:var(--et-theme-color-primary-solid, currentColor)}et-dropzone .et-dropzone-hint{padding-block-start:4px;font-size:var(--et-dropzone-hint-font-size);color:var(--et-surface-color-muted-solid, currentColor)}et-dropzone .et-dropzone-hint:empty{display:none}et-dropzone[data-can-animate] .et-dropzone-support{transition:block-size var(--et-dropzone-support-duration) ease}et-dropzone[data-can-animate] .et-dropzone-support-content{transition:opacity var(--et-dropzone-support-duration) ease,transform var(--et-dropzone-support-duration) ease}@starting-style{et-dropzone[data-can-animate] .et-dropzone-support-content[data-active]{opacity:0;transform:translateY(calc(var(--et-dropzone-support-offset) * -1))}}et-dropzone[data-can-animate] .et-dropzone-item,et-dropzone[data-can-animate] .et-dropzone-preview{transition:opacity var(--et-dropzone-transition-duration) ease,scale var(--et-dropzone-transition-duration) ease}@starting-style{et-dropzone[data-can-animate] .et-dropzone-item,et-dropzone[data-can-animate] .et-dropzone-preview{opacity:0;scale:.97}}et-dropzone[data-can-animate] .et-dropzone-internal-errors{transition:opacity var(--et-dropzone-support-duration) ease}@starting-style{et-dropzone[data-can-animate] .et-dropzone-internal-errors{opacity:0}}@media(prefers-reduced-motion:reduce){et-dropzone{--et-dropzone-support-duration: 1ms;--et-dropzone-support-offset: 0px;--et-dropzone-transition-duration: 1ms}}et-dropzone[data-drag-over] .et-dropzone-trigger{border-color:var(--et-theme-color-primary-solid, currentColor);background-color:color-mix(in srgb,var(--et-theme-color-primary-solid, currentColor) 8%,transparent)}et-dropzone[data-error] .et-dropzone-trigger{border-color:var(--et-theme-color-primary-solid, currentColor)}et-dropzone[data-disabled] .et-dropzone-area,et-dropzone[data-disabled] .et-dropzone-list{opacity:var(--et-dropzone-opacity-disabled)}}\n"] }]
11610
+ }, template: "<ng-content select=\"et-label\" />\n\n<input\n #fileInput\n [accept]=\"dropzoneDir.accept() || null\"\n [multiple]=\"dropzoneDir.multiple()\"\n [disabled]=\"dropzoneDir.disabled()\"\n (change)=\"uploadPickedFiles($event)\"\n (cancel)=\"resetFilePickerState()\"\n class=\"et-dropzone-native-input\"\n type=\"file\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n/>\n\n<div [attr.data-has-preview]=\"singleEntry() ? true : null\" class=\"et-dropzone-area\">\n <button\n #browseButton\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.tabindex]=\"singleEntry() ? '-1' : null\"\n [attr.aria-invalid]=\"dropzoneDir.shouldDisplayError() || null\"\n [attr.aria-describedby]=\"dropzoneDir.describedBy() || null\"\n [attr.aria-labelledby]=\"dropzoneDir.labelId() || null\"\n (click)=\"openFilePicker()\"\n (focus)=\"resetFilePickerState()\"\n (blur)=\"markTriggerTouched()\"\n class=\"et-dropzone-trigger\"\n type=\"button\"\n etFocusRing\n >\n <span class=\"et-dropzone-prompt\">\n <ng-content>\n <i class=\"et-dropzone-prompt-icon\" etIcon=\"et-upload\"></i>\n <span class=\"et-dropzone-prompt-text\">Drag &amp; drop or click to browse</span>\n </ng-content>\n </span>\n </button>\n\n @if (singleEntry(); as entry) {\n <div #entryEl [attr.data-status]=\"entry.status()\" class=\"et-dropzone-preview\">\n @if (entry.previewUrl(); as previewUrl) {\n <img [src]=\"previewUrl\" class=\"et-dropzone-preview-image\" alt=\"\" />\n } @else {\n <i class=\"et-dropzone-file-icon\" etIcon=\"et-file\"></i>\n }\n\n <div class=\"et-dropzone-preview-info\">\n <span class=\"et-dropzone-entry-name\">{{ entry.name() }}</span>\n\n @if (entry.size(); as size) {\n <span class=\"et-dropzone-entry-size\">{{ FORMAT_FILE_SIZE(size) }}</span>\n }\n\n @if (entry.source.type === 'file') {\n <div [attr.data-active]=\"entry.status() === 'uploading' || null\" class=\"et-dropzone-entry-progress\">\n <div class=\"et-dropzone-entry-progress-inner\">\n <et-progress-bar [value]=\"entry.progress() ?? 0\" [indeterminate]=\"entry.progress() === null\" />\n </div>\n </div>\n }\n </div>\n\n <div class=\"et-dropzone-preview-actions\">\n @if (entry.status() === 'error') {\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"retryLabel() + ' ' + entry.name()\"\n (click)=\"dropzoneDir.retryEntry(entry.id)\"\n class=\"et-dropzone-retry-button\"\n type=\"button\"\n et-icon-button\n variant=\"filled\"\n size=\"sm\"\n >\n <i etIcon=\"et-rotate-right\"></i>\n </button>\n } @else {\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"replaceLabel()\"\n (click)=\"openFilePicker()\"\n class=\"et-dropzone-replace-button\"\n type=\"button\"\n et-icon-button\n variant=\"filled\"\n size=\"sm\"\n >\n <i etIcon=\"et-rotate-right\"></i>\n </button>\n }\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"removeLabel() + ' ' + entry.name()\"\n (click)=\"removeEntryAnimated(entry, entryEl)\"\n class=\"et-dropzone-remove-button\"\n type=\"button\"\n et-icon-button\n variant=\"filled\"\n size=\"sm\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n </div>\n </div>\n }\n</div>\n\n@if (dropzoneDir.multiple() && dropzoneDir.entries().length) {\n <ul class=\"et-dropzone-list\" role=\"list\">\n @for (entry of dropzoneDir.entries(); track entry.id) {\n <li #entryEl [attr.data-status]=\"entry.status()\" class=\"et-dropzone-item\">\n <div class=\"et-dropzone-item-thumbnail\" aria-hidden=\"true\">\n @if (entry.previewUrl(); as previewUrl) {\n <img [src]=\"previewUrl\" class=\"et-dropzone-preview-image\" alt=\"\" />\n } @else {\n <i class=\"et-dropzone-file-icon\" etIcon=\"et-file\"></i>\n }\n </div>\n\n <div class=\"et-dropzone-item-info\">\n <span class=\"et-dropzone-entry-name\">{{ entry.name() }}</span>\n\n @if (entry.size(); as size) {\n <span class=\"et-dropzone-entry-size\">{{ FORMAT_FILE_SIZE(size) }}</span>\n }\n\n @if (entry.source.type === 'file') {\n <div [attr.data-active]=\"entry.status() === 'uploading' || null\" class=\"et-dropzone-entry-progress\">\n <div class=\"et-dropzone-entry-progress-inner\">\n <et-progress-bar [value]=\"entry.progress() ?? 0\" [indeterminate]=\"entry.progress() === null\" />\n </div>\n </div>\n }\n </div>\n\n @if (entry.status() === 'error') {\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"retryLabel() + ' ' + entry.name()\"\n (click)=\"dropzoneDir.retryEntry(entry.id)\"\n class=\"et-dropzone-retry-button\"\n type=\"button\"\n et-icon-button\n size=\"sm\"\n >\n <i etIcon=\"et-rotate-right\"></i>\n </button>\n }\n\n <button\n [disabled]=\"dropzoneDir.disabled()\"\n [attr.aria-label]=\"removeLabel() + ' ' + entry.name()\"\n (click)=\"removeEntryAnimated(entry, entryEl)\"\n class=\"et-dropzone-remove-button\"\n type=\"button\"\n et-icon-button\n size=\"sm\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n </li>\n }\n </ul>\n}\n\n<div class=\"et-dropzone-live-status\" role=\"status\" aria-live=\"polite\">{{ liveStatusMessage() }}</div>\n\n@if (internalErrorMessages().length) {\n <div [etProvideColor]=\"support.errorColorTheme\" class=\"et-dropzone-internal-errors\" role=\"alert\">\n @for (message of internalErrorMessages(); track $index) {\n <span class=\"et-dropzone-internal-error\">{{ message }}</span>\n }\n </div>\n}\n\n@if (support.shouldRenderSupport()) {\n <div [style.block-size.px]=\"support.supportHeight()\" class=\"et-dropzone-support\">\n <div class=\"et-dropzone-support-stack\">\n @if (support.shouldRenderError()) {\n <div\n #errorContent\n #errorAnimatable=\"etAnimatable\"\n [attr.aria-atomic]=\"support.errorActive() ? 'true' : null\"\n [attr.aria-hidden]=\"!support.errorActive() ? 'true' : null\"\n [attr.aria-live]=\"support.errorActive() ? 'polite' : null\"\n [attr.data-active]=\"support.errorActive() || null\"\n [etProvideColor]=\"support.errorColorTheme\"\n class=\"et-dropzone-support-content et-dropzone-errors\"\n etAnimatable\n >\n @for (error of support.visibleErrors(); track $index) {\n <et-form-error [error]=\"error\" />\n }\n </div>\n }\n\n @if (support.shouldRenderHint()) {\n <div\n #hintContent\n #hintAnimatable=\"etAnimatable\"\n [attr.aria-hidden]=\"!support.hintActive() ? 'true' : null\"\n [attr.data-active]=\"support.hintActive() || null\"\n class=\"et-dropzone-support-content et-dropzone-hint\"\n etAnimatable\n >\n <ng-content select=\"et-hint\" />\n </div>\n }\n </div>\n </div>\n}\n", styles: ["@layer components{@property --et-dropzone-min-height{syntax: \"<length>\"; inherits: true; initial-value: 160px;}@property --et-dropzone-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-dropzone-border-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-dropzone-gap{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-dropzone-thumbnail-size{syntax: \"<length>\"; inherits: true; initial-value: 48px;}@property --et-dropzone-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-dropzone-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}@property --et-dropzone-label-font-size{syntax: \"<length>\"; inherits: true; initial-value: 13px;}@property --et-dropzone-support-duration{syntax: \"<time>\"; inherits: true; initial-value: .18s;}@property --et-dropzone-support-offset{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-dropzone-error-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-dropzone-hint-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}et-dropzone{display:flex;flex-direction:column;gap:var(--et-dropzone-gap);color:var(--et-surface-color-solid, currentColor)}et-dropzone>et-label{font-size:var(--et-dropzone-label-font-size);font-weight:500;line-height:1.2;letter-spacing:-.01em;color:var(--et-surface-color-muted-solid, currentColor);-webkit-user-select:none;user-select:none}et-dropzone .et-dropzone-native-input{position:absolute;inline-size:1px;block-size:1px;opacity:0;pointer-events:none}et-dropzone .et-dropzone-area{position:relative;display:grid}et-dropzone .et-dropzone-trigger{grid-area:1 / 1;display:grid;place-items:center;min-block-size:var(--et-dropzone-min-height);padding:16px;border:var(--et-dropzone-border-width) dashed var(--et-surface-border-solid, currentColor);border-radius:var(--et-dropzone-border-radius);background-color:transparent;color:var(--et-surface-color-muted-solid, currentColor);font:inherit;cursor:pointer;transition:border-color var(--et-dropzone-transition-duration) ease,background-color var(--et-dropzone-transition-duration) ease}@media(hover:hover){et-dropzone .et-dropzone-trigger:hover:not(:disabled){border-color:var(--et-surface-interaction-hover-solid, currentColor);background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 6%,transparent)}}et-dropzone .et-dropzone-trigger:disabled{cursor:not-allowed}et-dropzone .et-dropzone-prompt{display:flex;flex-direction:column;align-items:center;gap:8px}et-dropzone .et-dropzone-prompt-icon{display:block;inline-size:28px;block-size:28px}et-dropzone .et-dropzone-prompt-text{font-size:13px;line-height:1.4}et-dropzone .et-dropzone-area[data-has-preview] .et-dropzone-prompt{visibility:hidden}et-dropzone .et-dropzone-file-icon{display:block;inline-size:40px;block-size:40px;color:var(--et-surface-color-muted-solid, currentColor)}et-dropzone .et-dropzone-preview{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;border:var(--et-dropzone-border-width) solid var(--et-surface-border-solid, currentColor);border-radius:var(--et-dropzone-border-radius);background-color:var(--et-surface-background-solid, transparent)}et-dropzone .et-dropzone-preview>.et-dropzone-preview-image{position:absolute;inset:0;inline-size:100%;block-size:100%;object-fit:cover;transition:opacity var(--et-dropzone-transition-duration) ease}et-dropzone .et-dropzone-preview[data-status=error]>.et-dropzone-preview-image{opacity:.15}et-dropzone .et-dropzone-preview .et-dropzone-preview-info{position:absolute;inset:auto 0 0;display:flex;flex-direction:column;gap:4px;padding:10px 12px;background-color:#0009;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff}et-dropzone .et-dropzone-preview .et-dropzone-preview-info .et-dropzone-entry-size{color:#ffffffb3}et-dropzone .et-dropzone-preview .et-dropzone-preview-actions{position:absolute;inset-block-start:8px;inset-inline-end:8px;display:flex;gap:6px}et-dropzone .et-dropzone-list{position:relative;display:flex;flex-direction:column;gap:8px;margin:0;padding:0;list-style:none}et-dropzone .et-dropzone-item{display:flex;align-items:center;gap:12px;padding:8px;border:1px solid var(--et-surface-border-solid, currentColor);border-radius:calc(var(--et-dropzone-border-radius) / 1.5);background-color:var(--et-surface-background-solid, transparent)}et-dropzone .et-dropzone-item .et-dropzone-item-thumbnail{display:grid;place-items:center;flex-shrink:0;inline-size:var(--et-dropzone-thumbnail-size);block-size:var(--et-dropzone-thumbnail-size);overflow:hidden;border-radius:calc(var(--et-dropzone-border-radius) / 2);background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 8%,transparent)}et-dropzone .et-dropzone-item .et-dropzone-item-thumbnail .et-dropzone-preview-image{inline-size:100%;block-size:100%;object-fit:cover}et-dropzone .et-dropzone-item .et-dropzone-item-thumbnail .et-dropzone-file-icon{inline-size:22px;block-size:22px}et-dropzone .et-dropzone-item .et-dropzone-item-info{display:flex;flex-direction:column;gap:2px;min-inline-size:0;flex:1}et-dropzone .et-dropzone-entry-name{overflow:hidden;font-size:13px;line-height:1.4;text-overflow:ellipsis;white-space:nowrap}et-dropzone .et-dropzone-entry-size{font-size:12px;color:var(--et-surface-color-muted-solid, currentColor)}et-dropzone .et-dropzone-internal-errors{display:flex;flex-direction:column;gap:2px;margin-block-start:calc(4px - var(--et-dropzone-gap));font-size:var(--et-dropzone-error-font-size);color:var(--et-theme-color-primary-solid, currentColor)}et-dropzone .et-dropzone-entry-progress{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows var(--et-dropzone-transition-duration) ease,opacity var(--et-dropzone-transition-duration) ease}et-dropzone .et-dropzone-entry-progress[data-active]{grid-template-rows:1fr;opacity:1}et-dropzone .et-dropzone-entry-progress .et-dropzone-entry-progress-inner{min-block-size:0;overflow:hidden}et-dropzone .et-dropzone-entry-progress .et-dropzone-entry-progress-inner et-progress-bar{margin-block:4px 2px}et-dropzone .et-dropzone-live-status{position:absolute;inline-size:1px;block-size:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}et-dropzone .et-dropzone-support{margin-block-start:calc(4px - var(--et-dropzone-gap));overflow:clip;block-size:0}et-dropzone .et-dropzone-support-stack{position:relative;display:grid}et-dropzone .et-dropzone-support-content{grid-area:1 / 1;min-inline-size:0;opacity:0;transform:translateY(0)}et-dropzone .et-dropzone-support-content[data-active]{opacity:1;transform:translateY(0)}et-dropzone .et-dropzone-errors{display:flex;flex-direction:column;gap:2px;padding-block-start:4px;font-size:var(--et-dropzone-error-font-size);color:var(--et-theme-color-primary-solid, currentColor)}et-dropzone .et-dropzone-hint{padding-block-start:4px;font-size:var(--et-dropzone-hint-font-size);color:var(--et-surface-color-muted-solid, currentColor)}et-dropzone .et-dropzone-hint:empty{display:none}et-dropzone[data-can-animate] .et-dropzone-support{transition:block-size var(--et-dropzone-support-duration) ease}et-dropzone[data-can-animate] .et-dropzone-support-content{transition:opacity var(--et-dropzone-support-duration) ease,transform var(--et-dropzone-support-duration) ease}@starting-style{et-dropzone[data-can-animate] .et-dropzone-support-content[data-active]{opacity:0;transform:translateY(calc(var(--et-dropzone-support-offset) * -1))}}et-dropzone[data-can-animate] .et-dropzone-item,et-dropzone[data-can-animate] .et-dropzone-preview{transition:opacity var(--et-dropzone-transition-duration) ease,scale var(--et-dropzone-transition-duration) ease}@starting-style{et-dropzone[data-can-animate] .et-dropzone-item,et-dropzone[data-can-animate] .et-dropzone-preview{opacity:0;scale:.97}}et-dropzone[data-can-animate] .et-dropzone-internal-errors{transition:opacity var(--et-dropzone-support-duration) ease}@starting-style{et-dropzone[data-can-animate] .et-dropzone-internal-errors{opacity:0}}@media(prefers-reduced-motion:reduce){et-dropzone{--et-dropzone-support-duration: 1ms;--et-dropzone-support-offset: 0px;--et-dropzone-transition-duration: 1ms}}et-dropzone[data-drag-over] .et-dropzone-trigger{border-color:var(--et-theme-color-primary-solid, currentColor);background-color:color-mix(in srgb,var(--et-theme-color-primary-solid, currentColor) 8%,transparent)}et-dropzone[data-error] .et-dropzone-trigger{border-color:var(--et-theme-color-primary-solid, currentColor)}et-dropzone[data-disabled] .et-dropzone-area,et-dropzone[data-disabled] .et-dropzone-list{opacity:var(--et-dropzone-opacity-disabled)}}\n"] }]
11611
11611
  }], ctorParameters: () => [], propDecorators: { retryLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "retryLabel", required: false }] }], removeLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "removeLabel", required: false }] }], replaceLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "replaceLabel", required: false }] }], uploadErrorLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "uploadErrorLabel", required: false }] }], uploadErrorMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "uploadErrorMessage", required: false }] }], fileInput: [{ type: i0.ViewChild, args: ['fileInput', { isSignal: true }] }], browseButton: [{ type: i0.ViewChild, args: ['browseButton', { isSignal: true }] }], errorContentRef: [{ type: i0.ViewChild, args: ['errorContent', { isSignal: true }] }], hintContentRef: [{ type: i0.ViewChild, args: ['hintContent', { isSignal: true }] }], errorAnimatableRef: [{ type: i0.ViewChild, args: ['errorAnimatable', { isSignal: true }] }], hintAnimatableRef: [{ type: i0.ViewChild, args: ['hintAnimatable', { isSignal: true }] }], entryElements: [{ type: i0.ViewChildren, args: ['entryEl', { isSignal: true }] }] } });
11612
11612
 
11613
11613
  const DROPZONE_IMPORTS = [DropzoneComponent, DropzoneDirective];
@@ -11826,7 +11826,7 @@ class FormFieldComponent {
11826
11826
  this.formFieldDir.activate();
11827
11827
  }
11828
11828
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: FormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
11829
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: FormFieldComponent, isStandalone: true, selector: "et-form-field", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, fill: { classPropertyName: "fill", publicName: "fill", isSignal: true, isRequired: false, transformFunction: null }, labelMode: { classPropertyName: "labelMode", publicName: "labelMode", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.display": "formFieldDir.isHidden() ? \"none\" : null", "attr.data-can-animate": "canAnimate.state() || null", "attr.data-control-type": "formFieldDir.controlType()", "attr.data-error": "displaysError() || null", "attr.data-readonly": "formFieldDir.usesTextFieldShell() && formFieldDir.isReadonly() ? \"\" : null", "attr.data-disabled": "formFieldDir.usesTextFieldShell() && formFieldDir.isDisabled() ? \"\" : null", "attr.data-appearance": "formFieldDir.usesTextFieldShell() ? appearance() : null", "attr.data-fill": "formFieldDir.usesTextFieldShell() ? fill() : null", "attr.data-label-floated": "hasFloatingTextLabel() && formFieldDir.shouldFloatLabel() ? \"\" : null", "attr.data-label-mode": "formFieldDir.usesTextFieldShell() ? labelMode() : null", "attr.data-size": "formFieldDir.usesTextFieldShell() ? size() : null", "attr.data-text-shell": "formFieldDir.usesTextFieldShell() || null", "style.--_et-form-field-prefix-offset": "prefixOffset()" }, classAttribute: "et-form-field" }, viewQueries: [{ propertyName: "errorContent", first: true, predicate: ["errorContent"], descendants: true, isSignal: true }, { propertyName: "hintContent", first: true, predicate: ["hintContent"], descendants: true, isSignal: true }, { propertyName: "controlFrame", first: true, predicate: ["controlFrame"], descendants: true, isSignal: true }, { propertyName: "prefixEl", first: true, predicate: ["prefixEl"], descendants: true, isSignal: true }, { propertyName: "errorAnimatable", first: true, predicate: ["errorAnimatable"], descendants: true, isSignal: true }, { propertyName: "hintAnimatable", first: true, predicate: ["hintAnimatable"], descendants: true, isSignal: true }], hostDirectives: [{ directive: FormFieldDirective }, { directive: i1.ProvideColorDirective, inputs: ["etProvideColor", "color"] }, { directive: i1.ProvideSurfaceDirective, inputs: ["etProvideSurface", "surface"] }, { directive: i1.ColorInteractiveHasFocusDirective }], ngImport: i0, template: "<div class=\"et-form-field-shell\">\n <div #controlFrame (mousedown)=\"handleFramePointerDown($event)\" class=\"et-form-field-control-frame\">\n <div #prefixEl class=\"et-form-field-affix et-form-field-prefix\">\n <ng-content select=\"[etInputPrefix]\" />\n </div>\n\n <div class=\"et-form-field-control-area\">\n <div\n [class.et-form-field-label-area--floating]=\"hasFloatingTextLabel()\"\n [class.et-form-field-label-area--inline]=\"hasInlineLabel()\"\n class=\"et-form-field-label-area\"\n >\n <ng-content select=\"et-label\" />\n </div>\n\n <div class=\"et-form-field-control-slot\">\n <ng-content />\n </div>\n </div>\n\n <div class=\"et-form-field-affix et-form-field-suffix\">\n <ng-content select=\"[etInputSuffix]\" />\n </div>\n </div>\n</div>\n\n@if (shouldRenderSupport()) {\n <div [style.block-size.px]=\"supportHeight()\" class=\"et-form-field-support\" etColorInteractiveExclude>\n <div class=\"et-form-field-support-stack\">\n @if (shouldRenderError()) {\n <div\n #errorContent\n #errorAnimatable=\"etAnimatable\"\n [id]=\"formFieldDir.errorId()\"\n [attr.aria-atomic]=\"errorActive() ? 'true' : null\"\n [attr.aria-hidden]=\"!errorActive() ? 'true' : null\"\n [attr.aria-live]=\"errorActive() ? 'polite' : null\"\n [attr.data-active]=\"errorActive() || null\"\n [attr.data-direction]=\"errorDirection()\"\n [attr.data-state]=\"errorState()\"\n [etProvideColor]=\"errorColorTheme\"\n class=\"et-form-field-support-content et-form-field-errors\"\n etAnimatable\n >\n @for (error of visibleErrors(); track $index) {\n <et-form-error [error]=\"error\" />\n }\n </div>\n }\n\n @if (shouldRenderHint()) {\n <div\n #hintContent\n #hintAnimatable=\"etAnimatable\"\n [id]=\"formFieldDir.hintId()\"\n [attr.aria-hidden]=\"!hintActive() ? 'true' : null\"\n [attr.data-active]=\"hintActive() || null\"\n [attr.data-direction]=\"hintDirection()\"\n [attr.data-state]=\"hintState()\"\n class=\"et-form-field-support-content et-form-field-hint\"\n etAnimatable\n >\n <ng-content select=\"et-hint\" />\n </div>\n }\n </div>\n </div>\n}\n", styles: ["@layer components{@property --et-form-field-gap{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-form-field-control-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-form-field-control-border-width{syntax: \"<length>\"; inherits: true; initial-value: 1px;}@property --et-form-field-control-padding-block{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-form-field-control-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-form-field-control-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-form-field-control-line-height{syntax: \"<number>\"; inherits: true; initial-value: 1.5;}@property --et-form-field-control-affix-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-form-field-control-disabled-opacity{syntax: \"<number>\"; inherits: true; initial-value: .5;}@property --et-form-field-control-min-height{syntax: \"<length>\"; inherits: true; initial-value: 40px;}@property --et-form-field-label-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-form-field-error-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-form-field-hint-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-form-field-support-duration{syntax: \"<time>\"; inherits: true; initial-value: .18s;}@property --et-form-field-support-offset{syntax: \"<length>\"; inherits: true; initial-value: 4px;}et-form-field{--et-theme-color-primary-solid: rgb(var(--et-theme-color-primary-rgb));--_et-form-field-control-background: transparent;--_et-form-field-control-focus-ring: color-mix(in srgb, var(--et-theme-color-primary-solid) 18%, transparent);--_et-form-field-floating-label-scale: .75;display:flex;flex-direction:column;gap:var(--et-form-field-gap);color:var(--et-surface-color-solid, currentColor)}et-form-field:where([data-size=sm]){--et-form-field-gap: 4px;--et-form-field-control-border-radius: 4px;--et-form-field-control-padding-block: 4px;--et-form-field-control-padding-inline: 10px;--et-form-field-control-affix-gap: 6px;--et-form-field-control-font-size: 12px;--et-form-field-control-min-height: 42px;--et-form-field-label-font-size: 12px}et-form-field:where([data-size=md]){--et-form-field-gap: 5px;--et-form-field-control-border-radius: 5px;--et-form-field-control-padding-block: 6px;--et-form-field-control-padding-inline: 12px;--et-form-field-control-affix-gap: 8px;--et-form-field-control-font-size: 14px;--et-form-field-control-min-height: 50px;--et-form-field-label-font-size: 13px}et-form-field:where([data-size=lg]){--et-form-field-gap: 6px;--et-form-field-control-border-radius: 6px;--et-form-field-control-padding-block: 8px;--et-form-field-control-padding-inline: 14px;--et-form-field-control-affix-gap: 10px;--et-form-field-control-font-size: 16px;--et-form-field-control-min-height: 58px;--et-form-field-label-font-size: 14px}et-form-field[data-fill=filled]{--_et-form-field-control-background: var( --et-surface-background-solid, var(--et-surface-base-solid, transparent) )}et-form-field .et-form-field-shell{display:flex;flex-direction:column;gap:var(--et-form-field-gap);min-inline-size:0;overflow:visible}et-form-field .et-form-field-label-area{display:flex;align-items:center;font-size:var(--et-form-field-label-font-size);font-weight:500;line-height:1.2;letter-spacing:-.01em;color:var(--et-surface-color-muted-solid, currentColor);cursor:text;-webkit-user-select:none;user-select:none;min-inline-size:0;transition:color .15s ease,opacity .15s ease}et-form-field .et-form-field-label-area et-label{display:inline;min-inline-size:0}et-form-field .et-form-field-label-area--floating{position:absolute;inset-block-start:50%;inset-inline-start:0;z-index:1;max-inline-size:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transform:translateY(-50%);transform-origin:left top;pointer-events:none}et-form-field[data-can-animate] .et-form-field-label-area--floating{transition:color .15s ease,opacity .15s ease,inset-block-start .15s ease,inset-inline-start .15s ease,transform .15s ease}et-form-field .et-form-field-control-frame{position:relative;display:flex;align-items:center;box-sizing:border-box;gap:var(--et-form-field-control-affix-gap);min-inline-size:0;min-block-size:var(--et-form-field-control-min-height);padding-block:var(--et-form-field-control-padding-block);padding-inline:var(--et-form-field-control-padding-inline);border:var(--et-form-field-control-border-width) solid var(--et-surface-border-solid, currentColor);border-radius:var(--et-form-field-control-border-radius);background:var(--_et-form-field-control-background);font-size:var(--et-form-field-control-font-size);line-height:var(--et-form-field-control-line-height);transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease,opacity .15s ease;cursor:text}et-form-field .et-form-field-affix{display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--et-surface-color-muted-solid, currentColor);opacity:.78;pointer-events:none;transition:color .15s ease,opacity .15s ease}et-form-field .et-form-field-affix:empty{display:none}et-form-field .et-form-field-affix>*{pointer-events:none}et-form-field .et-form-field-affix>:is(button,a[href],input,select,textarea,summary,label,[role=button],[tabindex]:not([tabindex=\"-1\"])){pointer-events:auto}et-form-field .et-form-field-affix button{font:inherit;color:inherit;border:none;background:transparent;padding:0;cursor:pointer}et-form-field .et-form-field-control-area{position:relative;display:flex;align-items:center;flex:1;min-inline-size:0}et-form-field .et-form-field-control-area>*{min-inline-size:0}et-form-field .et-form-field-control-slot{display:flex;align-items:center;flex:1;min-inline-size:0}et-form-field:where([data-text-shell])[data-label-mode=static] .et-form-field-shell{padding-block-start:calc(var(--et-form-field-label-font-size) * 1.2 + var(--et-form-field-gap))}et-form-field:where([data-text-shell])[data-label-mode=static] .et-form-field-control-area{position:static}et-form-field:where([data-text-shell])[data-label-mode=static] .et-form-field-label-area{position:absolute;inset-block-start:0;inset-inline-start:var(--et-form-field-control-padding-inline);transform:translateY(calc(-100% - var(--et-form-field-gap) - var(--et-form-field-control-border-width)))}et-form-field:where([data-text-shell])[data-label-mode=static][data-appearance=underline][data-fill=transparent] .et-form-field-label-area{inset-inline-start:0}et-form-field:where([data-text-shell])[data-label-mode=inline] .et-form-field-control-frame{align-items:stretch}et-form-field:where([data-text-shell])[data-label-mode=inline] .et-form-field-control-area{position:static;gap:var(--et-form-field-control-affix-gap);align-items:stretch}et-form-field:where([data-text-shell])[data-label-mode=inline] .et-form-field-control-slot{display:flex;align-items:center}et-form-field:where([data-text-shell])[data-label-mode=inline] .et-form-field-label-area--inline{position:static;flex-shrink:0;transform:none;white-space:nowrap;pointer-events:auto;font-size:var(--et-form-field-control-font-size);line-height:var(--et-form-field-control-line-height);display:flex;align-items:center;margin-block:calc(var(--et-form-field-control-padding-block) * -1)}et-form-field:where([data-text-shell])[data-label-mode=inline][data-appearance=underline] .et-form-field-label-area--inline:after{content:\":\"}et-form-field:where([data-text-shell])[data-label-mode=inline][data-appearance=box] .et-form-field-label-area--inline{padding-inline-end:var(--et-form-field-control-padding-inline);margin-inline-end:calc(var(--et-form-field-control-padding-inline) - var(--et-form-field-control-affix-gap));border-inline-end:var(--et-form-field-control-border-width) solid var(--et-surface-border-solid, currentColor)}:is(et-form-field:where([data-text-shell])[data-label-mode=floating-inside],et-form-field:where([data-text-shell])[data-label-mode=floating-outside]) :is(.et-input-native,.et-number-input-native,.et-textarea-native)::placeholder{transition:color .15s ease}:is(et-form-field:where([data-text-shell])[data-label-mode=floating-inside],et-form-field:where([data-text-shell])[data-label-mode=floating-outside]) .et-select-value[data-placeholder]{transition:color .15s ease}:is(et-form-field:where([data-text-shell])[data-label-mode=floating-inside],et-form-field:where([data-text-shell])[data-label-mode=floating-outside]):not([data-label-floated]) :is(.et-input-native,.et-number-input-native,.et-textarea-native)::placeholder{color:transparent}:is(et-form-field:where([data-text-shell])[data-label-mode=floating-inside],et-form-field:where([data-text-shell])[data-label-mode=floating-outside]):not([data-label-floated]) .et-select-value[data-placeholder]{color:transparent}et-form-field:where([data-text-shell])[data-label-mode=floating-outside] .et-form-field-control-area{align-self:stretch;display:flex;align-items:center}et-form-field:where([data-text-shell])[data-label-mode=floating-outside] .et-form-field-label-area--floating{inset-inline-start:0}et-form-field:where([data-text-shell])[data-label-mode=floating-outside] .et-form-field-shell{padding-block-start:calc(var(--et-form-field-label-font-size) * 1.2 + var(--et-form-field-gap))}et-form-field:where([data-text-shell])[data-label-mode=floating-outside][data-label-floated] .et-form-field-label-area--floating{inset-block-start:0;inset-inline-start:calc(var(--_et-form-field-prefix-offset, 0px) * -1);transform:translateY(calc(-100% - var(--et-form-field-gap) - var(--et-form-field-control-border-width) - var(--et-form-field-control-padding-block)))}et-form-field:where([data-text-shell])[data-label-mode=floating-inside]{--_et-form-field-float-inside-extra-padding: calc( var(--et-form-field-label-font-size) * var(--_et-form-field-floating-label-scale) + 2px )}et-form-field:where([data-text-shell])[data-label-mode=floating-inside] .et-form-field-control-area{align-self:stretch;display:flex;align-items:center;padding-block-start:var(--_et-form-field-float-inside-extra-padding)}et-form-field:where([data-text-shell])[data-label-mode=floating-inside] .et-form-field-label-area--floating{inset-inline-start:0}et-form-field:where([data-text-shell])[data-label-mode=floating-inside][data-label-floated] .et-form-field-label-area--floating{inset-block-start:4px;transform:scale(var(--_et-form-field-floating-label-scale))}et-form-field:where([data-text-shell])[data-label-mode=floating-inside] .et-form-field-control-slot{font-size:calc(var(--et-form-field-control-font-size) * .96)}et-form-field:where([data-text-shell]) .et-form-field-label-area{max-inline-size:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}et-form-field:where([data-text-shell]):where(:hover:not([data-readonly]):not([data-disabled]):not(:has(.et-color-interactive-exclude:hover))) .et-form-field-control-frame{border-color:var(--et-surface-interaction-hover-solid, currentColor)}et-form-field:where([data-text-shell]):where(:hover:not([data-readonly]):not([data-disabled]):not(:has(.et-color-interactive-exclude:hover))) .et-form-field-label-area,et-form-field:where([data-text-shell]):where(:hover:not([data-readonly]):not([data-disabled]):not(:has(.et-color-interactive-exclude:hover))) .et-form-field-affix{color:var(--et-surface-color-solid, currentColor);opacity:1}et-form-field:where([data-text-shell]):where(:has(:focus-visible):not([data-readonly])) .et-form-field-control-frame{border-color:var(--et-theme-color-primary-solid)}et-form-field:where([data-text-shell]):where(:has(:focus-visible):not([data-readonly])) .et-form-field-label-area,et-form-field:where([data-text-shell]):where(:has(:focus-visible):not([data-readonly])) .et-form-field-affix{color:var(--et-surface-color-solid, currentColor);opacity:1}et-form-field:where([data-text-shell])[data-readonly] .et-form-field-control-frame,et-form-field:where([data-text-shell])[data-readonly] .et-form-field-control,et-form-field:where([data-text-shell])[data-readonly] input,et-form-field:where([data-text-shell])[data-readonly] textarea,et-form-field:where([data-text-shell])[data-readonly] [contenteditable]{cursor:default}et-form-field:where([data-text-shell])[data-error] .et-form-field-control-frame{border-color:var(--et-theme-color-primary-solid)}et-form-field:where([data-text-shell])[data-error] .et-form-field-label-area{color:var(--et-theme-color-primary-solid)}et-form-field:where([data-text-shell])[data-error] .et-form-field-affix{color:var(--et-theme-color-primary-solid);opacity:1}et-form-field:where([data-text-shell])[data-disabled] .et-form-field-control-frame{opacity:var(--et-form-field-control-disabled-opacity);pointer-events:none;box-shadow:none}et-form-field:where([data-text-shell])[data-disabled] .et-form-field-label-area{cursor:not-allowed}et-form-field:where([data-text-shell])[data-appearance=underline] .et-form-field-control-frame{border-top:none;border-inline:none;border-radius:0;box-shadow:none}et-form-field:where([data-text-shell])[data-appearance=underline][data-fill=transparent] .et-form-field-control-frame{padding-inline:0}et-form-field:where([data-text-shell])[data-appearance=underline][data-fill=transparent] .et-form-field-errors,et-form-field:where([data-text-shell])[data-appearance=underline][data-fill=transparent] .et-form-field-hint{padding-inline-start:0}et-form-field:where([data-control-type=rich-text]) .et-form-field-control-frame{align-items:stretch;padding:0;cursor:auto}et-form-field:where([data-control-type=rich-text]) .et-form-field-control-area,et-form-field:where([data-control-type=rich-text]) .et-form-field-control-slot{align-items:stretch}et-form-field:where([data-control-type=rich-text])[data-label-mode=inline] .et-form-field-label-area--inline{align-items:flex-start;margin-block:0;padding-block-start:var(--et-form-field-control-padding-block);padding-inline-start:var(--et-form-field-control-padding-inline)}et-form-field:where([data-control-type=rich-text])[data-appearance=box][data-label-mode=inline] .et-form-field-label-area--inline{margin-inline-end:calc(var(--et-form-field-control-affix-gap) * -1)}et-form-field:where([data-control-type=textarea]) .et-form-field-control-frame,et-form-field:where([data-control-type=textarea]) .et-form-field-control-area,et-form-field:where([data-control-type=textarea]) .et-form-field-control-slot{align-items:stretch}et-form-field:where([data-control-type=textarea]) .et-form-field-affix{align-items:flex-start}et-form-field:where([data-control-type=textarea]):not([data-label-floated]) .et-form-field-label-area--floating{inset-block-start:calc((var(--et-form-field-control-font-size) * var(--et-form-field-control-line-height)) / 2)}et-form-field:where([data-control-type=textarea])[data-label-mode=floating-inside]:not([data-label-floated]) .et-form-field-label-area--floating{inset-block-start:calc(var(--_et-form-field-float-inside-extra-padding) + (var(--et-form-field-control-font-size) * var(--et-form-field-control-line-height)) / 2)}et-form-field:where([data-control-type=textarea])[data-label-mode=inline] .et-form-field-label-area--inline{align-items:flex-start;padding-block-start:var(--et-form-field-control-padding-block)}et-form-field .et-form-field-support{overflow:clip;block-size:0}et-form-field .et-form-field-support-stack{position:relative;display:grid}et-form-field .et-form-field-support-content{grid-area:1 / 1;min-inline-size:0;opacity:0;transform:translateY(0)}et-form-field .et-form-field-support-content[data-active]{opacity:1;transform:translateY(0)}et-form-field .et-form-field-support-content[data-state=leaving][data-direction=to-above]{position:absolute;inset:0;opacity:0;transform:translateY(calc(var(--et-form-field-support-offset) * -1));pointer-events:none}et-form-field .et-form-field-support-content[data-state=leaving][data-direction=to-below]{position:absolute;inset:0;opacity:0;transform:translateY(var(--et-form-field-support-offset));pointer-events:none}et-form-field .et-form-field-errors{display:flex;flex-direction:column;gap:2px;font-size:var(--et-form-field-error-font-size);color:var(--et-theme-color-primary-solid);padding-inline-start:calc(var(--et-form-field-control-padding-inline) + var(--et-form-field-control-border-width))}et-form-field .et-form-field-hint{font-size:var(--et-form-field-hint-font-size);color:var(--et-surface-color-muted-solid, currentColor);padding-inline-start:calc(var(--et-form-field-control-padding-inline) + var(--et-form-field-control-border-width));transition:color .15s ease}et-form-field .et-form-field-hint:empty{display:none}et-form-field[data-disabled] .et-form-field-hint{color:var(--et-surface-interaction-disabled-solid, currentColor)}et-form-field[data-can-animate] .et-form-field-support{transition:block-size var(--et-form-field-support-duration) ease}et-form-field[data-can-animate] .et-form-field-support-content{transition:opacity var(--et-form-field-support-duration) ease,transform var(--et-form-field-support-duration) ease}@starting-style{et-form-field[data-can-animate] .et-form-field-support-content[data-active][data-direction=from-above]{opacity:0;transform:translateY(calc(var(--et-form-field-support-offset) * -1))}}@starting-style{et-form-field[data-can-animate] .et-form-field-support-content[data-active][data-direction=from-below]{opacity:0;transform:translateY(var(--et-form-field-support-offset))}}@media(prefers-reduced-motion:reduce){et-form-field{--et-form-field-support-duration: 1ms;--et-form-field-support-offset: 0px}}}\n"], dependencies: [{ kind: "directive", type: AnimatableDirective, selector: "[etAnimatable]", exportAs: ["etAnimatable"] }, { kind: "directive", type: ColorInteractiveExcludeDirective, selector: "[etColorInteractiveExclude]" }, { kind: "component", type: FormErrorComponent, selector: "et-form-error", inputs: ["error"] }, { kind: "directive", type: ProvideColorDirective, selector: "[etProvideColor]", inputs: ["etProvideColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
11829
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: FormFieldComponent, isStandalone: true, selector: "et-form-field", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, fill: { classPropertyName: "fill", publicName: "fill", isSignal: true, isRequired: false, transformFunction: null }, labelMode: { classPropertyName: "labelMode", publicName: "labelMode", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.display": "formFieldDir.isHidden() ? \"none\" : null", "attr.data-can-animate": "canAnimate.state() || null", "attr.data-control-type": "formFieldDir.controlType()", "attr.data-error": "displaysError() || null", "attr.data-readonly": "formFieldDir.usesTextFieldShell() && formFieldDir.isReadonly() ? \"\" : null", "attr.data-disabled": "formFieldDir.usesTextFieldShell() && formFieldDir.isDisabled() ? \"\" : null", "attr.data-appearance": "formFieldDir.usesTextFieldShell() ? appearance() : null", "attr.data-fill": "formFieldDir.usesTextFieldShell() ? fill() : null", "attr.data-label-floated": "hasFloatingTextLabel() && formFieldDir.shouldFloatLabel() ? \"\" : null", "attr.data-label-mode": "formFieldDir.usesTextFieldShell() ? labelMode() : null", "attr.data-size": "formFieldDir.usesTextFieldShell() ? size() : null", "attr.data-text-shell": "formFieldDir.usesTextFieldShell() || null", "style.--_et-form-field-prefix-offset": "prefixOffset()" }, classAttribute: "et-form-field" }, viewQueries: [{ propertyName: "errorContent", first: true, predicate: ["errorContent"], descendants: true, isSignal: true }, { propertyName: "hintContent", first: true, predicate: ["hintContent"], descendants: true, isSignal: true }, { propertyName: "controlFrame", first: true, predicate: ["controlFrame"], descendants: true, isSignal: true }, { propertyName: "prefixEl", first: true, predicate: ["prefixEl"], descendants: true, isSignal: true }, { propertyName: "errorAnimatable", first: true, predicate: ["errorAnimatable"], descendants: true, isSignal: true }, { propertyName: "hintAnimatable", first: true, predicate: ["hintAnimatable"], descendants: true, isSignal: true }], hostDirectives: [{ directive: FormFieldDirective }, { directive: i1.ProvideColorDirective, inputs: ["etProvideColor", "color"] }, { directive: i1.ProvideSurfaceDirective, inputs: ["etProvideSurface", "surface"] }, { directive: i1.ColorInteractiveHasFocusDirective }], ngImport: i0, template: "<div class=\"et-form-field-shell\">\n <div #controlFrame (mousedown)=\"handleFramePointerDown($event)\" class=\"et-form-field-control-frame\">\n <div #prefixEl class=\"et-form-field-affix et-form-field-prefix\">\n <ng-content select=\"[etInputPrefix]\" />\n </div>\n\n <div class=\"et-form-field-control-area\">\n <div\n [class.et-form-field-label-area--floating]=\"hasFloatingTextLabel()\"\n [class.et-form-field-label-area--inline]=\"hasInlineLabel()\"\n class=\"et-form-field-label-area\"\n >\n <ng-content select=\"et-label\" />\n </div>\n\n <div class=\"et-form-field-control-slot\">\n <ng-content />\n </div>\n </div>\n\n <div class=\"et-form-field-affix et-form-field-suffix\">\n <ng-content select=\"[etInputSuffix]\" />\n </div>\n </div>\n</div>\n\n@if (shouldRenderSupport()) {\n <div [style.block-size.px]=\"supportHeight()\" class=\"et-form-field-support\" etColorInteractiveExclude>\n <div class=\"et-form-field-support-stack\">\n @if (shouldRenderError()) {\n <div\n #errorContent\n #errorAnimatable=\"etAnimatable\"\n [id]=\"formFieldDir.errorId()\"\n [attr.aria-atomic]=\"errorActive() ? 'true' : null\"\n [attr.aria-hidden]=\"!errorActive() ? 'true' : null\"\n [attr.aria-live]=\"errorActive() ? 'polite' : null\"\n [attr.data-active]=\"errorActive() || null\"\n [attr.data-direction]=\"errorDirection()\"\n [attr.data-state]=\"errorState()\"\n [etProvideColor]=\"errorColorTheme\"\n class=\"et-form-field-support-content et-form-field-errors\"\n etAnimatable\n >\n @for (error of visibleErrors(); track $index) {\n <et-form-error [error]=\"error\" />\n }\n </div>\n }\n\n @if (shouldRenderHint()) {\n <div\n #hintContent\n #hintAnimatable=\"etAnimatable\"\n [id]=\"formFieldDir.hintId()\"\n [attr.aria-hidden]=\"!hintActive() ? 'true' : null\"\n [attr.data-active]=\"hintActive() || null\"\n [attr.data-direction]=\"hintDirection()\"\n [attr.data-state]=\"hintState()\"\n class=\"et-form-field-support-content et-form-field-hint\"\n etAnimatable\n >\n <ng-content select=\"et-hint\" />\n </div>\n }\n </div>\n </div>\n}\n", styles: ["@layer components{@property --et-form-field-gap{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-form-field-control-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-form-field-control-border-width{syntax: \"<length>\"; inherits: true; initial-value: 1px;}@property --et-form-field-control-padding-block{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-form-field-control-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-form-field-control-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-form-field-control-line-height{syntax: \"<number>\"; inherits: true; initial-value: 1.5;}@property --et-form-field-control-affix-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-form-field-control-disabled-opacity{syntax: \"<number>\"; inherits: true; initial-value: .5;}@property --et-form-field-control-min-height{syntax: \"<length>\"; inherits: true; initial-value: 40px;}@property --et-form-field-label-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-form-field-error-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-form-field-hint-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-form-field-support-duration{syntax: \"<time>\"; inherits: true; initial-value: .18s;}@property --et-form-field-support-offset{syntax: \"<length>\"; inherits: true; initial-value: 4px;}et-form-field{--et-theme-color-primary-solid: rgb(var(--et-theme-color-primary-rgb));--_et-form-field-control-background: transparent;--_et-form-field-control-focus-ring: color-mix(in srgb, var(--et-theme-color-primary-solid) 18%, transparent);--_et-form-field-floating-label-scale: .75;display:flex;flex-direction:column;gap:var(--et-form-field-gap);color:var(--et-surface-color-solid, currentColor)}et-form-field:where([data-size=sm]){--et-form-field-gap: 4px;--et-form-field-control-border-radius: 4px;--et-form-field-control-padding-block: 4px;--et-form-field-control-padding-inline: 10px;--et-form-field-control-affix-gap: 6px;--et-form-field-control-font-size: 12px;--et-form-field-control-min-height: 42px;--et-form-field-label-font-size: 12px}et-form-field:where([data-size=md]){--et-form-field-gap: 5px;--et-form-field-control-border-radius: 5px;--et-form-field-control-padding-block: 6px;--et-form-field-control-padding-inline: 12px;--et-form-field-control-affix-gap: 8px;--et-form-field-control-font-size: 14px;--et-form-field-control-min-height: 50px;--et-form-field-label-font-size: 13px}et-form-field:where([data-size=lg]){--et-form-field-gap: 6px;--et-form-field-control-border-radius: 6px;--et-form-field-control-padding-block: 8px;--et-form-field-control-padding-inline: 14px;--et-form-field-control-affix-gap: 10px;--et-form-field-control-font-size: 16px;--et-form-field-control-min-height: 58px;--et-form-field-label-font-size: 14px}et-form-field[data-fill=filled]{--_et-form-field-control-background: var( --et-surface-background-solid, var(--et-surface-base-solid, transparent) )}et-form-field .et-form-field-shell{display:flex;flex-direction:column;gap:var(--et-form-field-gap);min-inline-size:0;overflow:visible}et-form-field .et-form-field-label-area{display:flex;align-items:center;font-size:var(--et-form-field-label-font-size);font-weight:500;line-height:1.2;letter-spacing:-.01em;color:var(--et-surface-color-muted-solid, currentColor);cursor:text;-webkit-user-select:none;user-select:none;min-inline-size:0;transition:color .15s ease,opacity .15s ease}et-form-field .et-form-field-label-area et-label{display:inline;min-inline-size:0}et-form-field .et-form-field-label-area--floating{position:absolute;inset-block-start:50%;inset-inline-start:0;z-index:1;max-inline-size:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transform:translateY(-50%);transform-origin:left top;pointer-events:none}et-form-field[data-can-animate] .et-form-field-label-area--floating{transition:color .15s ease,opacity .15s ease,inset-block-start .15s ease,inset-inline-start .15s ease,transform .15s ease}et-form-field .et-form-field-control-frame{position:relative;display:flex;align-items:center;box-sizing:border-box;gap:var(--et-form-field-control-affix-gap);min-inline-size:0;min-block-size:var(--et-form-field-control-min-height);padding-block:var(--et-form-field-control-padding-block);padding-inline:var(--et-form-field-control-padding-inline);border:var(--et-form-field-control-border-width) solid var(--et-surface-border-solid, currentColor);border-radius:var(--et-form-field-control-border-radius);background:var(--_et-form-field-control-background);font-size:var(--et-form-field-control-font-size);line-height:var(--et-form-field-control-line-height);transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease,opacity .15s ease;cursor:text}et-form-field .et-form-field-affix{display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--et-surface-color-muted-solid, currentColor);opacity:.78;pointer-events:none;transition:color .15s ease,opacity .15s ease}et-form-field .et-form-field-affix:empty{display:none}et-form-field .et-form-field-affix>*{pointer-events:none}et-form-field .et-form-field-affix>:is(button,a[href],input,select,textarea,summary,label,[role=button],[tabindex]:not([tabindex=\"-1\"])){pointer-events:auto}et-form-field .et-form-field-affix button{font:inherit;color:inherit;border:none;background:transparent;padding:0;cursor:pointer}et-form-field .et-form-field-control-area{position:relative;display:flex;align-items:center;flex:1;min-inline-size:0}et-form-field .et-form-field-control-area>*{min-inline-size:0}et-form-field .et-form-field-control-slot{display:flex;align-items:center;flex:1;min-inline-size:0}et-form-field:where([data-text-shell])[data-label-mode=static] .et-form-field-shell{padding-block-start:calc(var(--et-form-field-label-font-size) * 1.2 + var(--et-form-field-gap))}et-form-field:where([data-text-shell])[data-label-mode=static] .et-form-field-control-area{position:static}et-form-field:where([data-text-shell])[data-label-mode=static] .et-form-field-label-area{position:absolute;inset-block-start:0;inset-inline-start:var(--et-form-field-control-padding-inline);transform:translateY(calc(-100% - var(--et-form-field-gap) - var(--et-form-field-control-border-width)))}et-form-field:where([data-text-shell])[data-label-mode=static][data-appearance=underline][data-fill=transparent] .et-form-field-label-area{inset-inline-start:0}et-form-field:where([data-text-shell])[data-label-mode=inline] .et-form-field-control-frame{align-items:stretch}et-form-field:where([data-text-shell])[data-label-mode=inline] .et-form-field-control-area{position:static;gap:var(--et-form-field-control-affix-gap);align-items:stretch}et-form-field:where([data-text-shell])[data-label-mode=inline] .et-form-field-control-slot{display:flex;align-items:center}et-form-field:where([data-text-shell])[data-label-mode=inline] .et-form-field-label-area--inline{position:static;flex-shrink:0;transform:none;white-space:nowrap;pointer-events:auto;font-size:var(--et-form-field-control-font-size);line-height:var(--et-form-field-control-line-height);display:flex;align-items:center;margin-block:calc(var(--et-form-field-control-padding-block) * -1)}et-form-field:where([data-text-shell])[data-label-mode=inline][data-appearance=underline] .et-form-field-label-area--inline:after{content:\":\"}et-form-field:where([data-text-shell])[data-label-mode=inline][data-appearance=box] .et-form-field-label-area--inline{padding-inline-end:var(--et-form-field-control-padding-inline);margin-inline-end:calc(var(--et-form-field-control-padding-inline) - var(--et-form-field-control-affix-gap));border-inline-end:var(--et-form-field-control-border-width) solid var(--et-surface-border-solid, currentColor)}:is(et-form-field:where([data-text-shell])[data-label-mode=floating-inside],et-form-field:where([data-text-shell])[data-label-mode=floating-outside]) :is(.et-input-native,.et-number-input-native,.et-textarea-native)::placeholder{transition:color .15s ease}:is(et-form-field:where([data-text-shell])[data-label-mode=floating-inside],et-form-field:where([data-text-shell])[data-label-mode=floating-outside]) .et-select-value[data-placeholder]{transition:color .15s ease}:is(et-form-field:where([data-text-shell])[data-label-mode=floating-inside],et-form-field:where([data-text-shell])[data-label-mode=floating-outside]):not([data-label-floated]) :is(.et-input-native,.et-number-input-native,.et-textarea-native)::placeholder{color:transparent}:is(et-form-field:where([data-text-shell])[data-label-mode=floating-inside],et-form-field:where([data-text-shell])[data-label-mode=floating-outside]):not([data-label-floated]) .et-select-value[data-placeholder]{color:transparent}et-form-field:where([data-text-shell])[data-label-mode=floating-outside] .et-form-field-control-area{align-self:stretch;display:flex;align-items:center}et-form-field:where([data-text-shell])[data-label-mode=floating-outside] .et-form-field-label-area--floating{inset-inline-start:0}et-form-field:where([data-text-shell])[data-label-mode=floating-outside] .et-form-field-shell{padding-block-start:calc(var(--et-form-field-label-font-size) * 1.2 + var(--et-form-field-gap))}et-form-field:where([data-text-shell])[data-label-mode=floating-outside][data-label-floated] .et-form-field-label-area--floating{inset-block-start:0;inset-inline-start:calc(var(--_et-form-field-prefix-offset, 0px) * -1);transform:translateY(calc(-100% - var(--et-form-field-gap) - var(--et-form-field-control-border-width) - var(--et-form-field-control-padding-block)))}et-form-field:where([data-text-shell])[data-label-mode=floating-inside]{--_et-form-field-float-inside-extra-padding: calc( var(--et-form-field-label-font-size) * var(--_et-form-field-floating-label-scale) + 2px )}et-form-field:where([data-text-shell])[data-label-mode=floating-inside] .et-form-field-control-area{align-self:stretch;display:flex;align-items:center;padding-block-start:var(--_et-form-field-float-inside-extra-padding)}et-form-field:where([data-text-shell])[data-label-mode=floating-inside] .et-form-field-label-area--floating{inset-inline-start:0}et-form-field:where([data-text-shell])[data-label-mode=floating-inside][data-label-floated] .et-form-field-label-area--floating{inset-block-start:4px;transform:scale(var(--_et-form-field-floating-label-scale))}et-form-field:where([data-text-shell])[data-label-mode=floating-inside] .et-form-field-control-slot{font-size:calc(var(--et-form-field-control-font-size) * .96)}et-form-field:where([data-text-shell]) .et-form-field-label-area{max-inline-size:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media(hover:hover){et-form-field:where([data-text-shell]):where(:hover:not([data-readonly]):not([data-disabled]):not(:has(.et-color-interactive-exclude:hover))) .et-form-field-control-frame{border-color:var(--et-surface-interaction-hover-solid, currentColor)}et-form-field:where([data-text-shell]):where(:hover:not([data-readonly]):not([data-disabled]):not(:has(.et-color-interactive-exclude:hover))) .et-form-field-label-area,et-form-field:where([data-text-shell]):where(:hover:not([data-readonly]):not([data-disabled]):not(:has(.et-color-interactive-exclude:hover))) .et-form-field-affix{color:var(--et-surface-color-solid, currentColor);opacity:1}}et-form-field:where([data-text-shell]):where(:has(:focus-visible):not([data-readonly])) .et-form-field-control-frame{border-color:var(--et-theme-color-primary-solid)}et-form-field:where([data-text-shell]):where(:has(:focus-visible):not([data-readonly])) .et-form-field-label-area,et-form-field:where([data-text-shell]):where(:has(:focus-visible):not([data-readonly])) .et-form-field-affix{color:var(--et-surface-color-solid, currentColor);opacity:1}et-form-field:where([data-text-shell])[data-readonly] .et-form-field-control-frame,et-form-field:where([data-text-shell])[data-readonly] .et-form-field-control,et-form-field:where([data-text-shell])[data-readonly] input,et-form-field:where([data-text-shell])[data-readonly] textarea,et-form-field:where([data-text-shell])[data-readonly] [contenteditable]{cursor:default}et-form-field:where([data-text-shell])[data-error] .et-form-field-control-frame{border-color:var(--et-theme-color-primary-solid)}et-form-field:where([data-text-shell])[data-error] .et-form-field-label-area{color:var(--et-theme-color-primary-solid)}et-form-field:where([data-text-shell])[data-error] .et-form-field-affix{color:var(--et-theme-color-primary-solid);opacity:1}et-form-field:where([data-text-shell])[data-disabled] .et-form-field-control-frame{opacity:var(--et-form-field-control-disabled-opacity);pointer-events:none;box-shadow:none}et-form-field:where([data-text-shell])[data-disabled] .et-form-field-label-area{cursor:not-allowed}et-form-field:where([data-text-shell])[data-appearance=underline] .et-form-field-control-frame{border-top:none;border-inline:none;border-radius:0;box-shadow:none}et-form-field:where([data-text-shell])[data-appearance=underline][data-fill=transparent] .et-form-field-control-frame{padding-inline:0}et-form-field:where([data-text-shell])[data-appearance=underline][data-fill=transparent] .et-form-field-errors,et-form-field:where([data-text-shell])[data-appearance=underline][data-fill=transparent] .et-form-field-hint{padding-inline-start:0}et-form-field:where([data-control-type=rich-text]) .et-form-field-control-frame{align-items:stretch;padding:0;cursor:auto}et-form-field:where([data-control-type=rich-text]) .et-form-field-control-area,et-form-field:where([data-control-type=rich-text]) .et-form-field-control-slot{align-items:stretch}et-form-field:where([data-control-type=rich-text])[data-label-mode=inline] .et-form-field-label-area--inline{align-items:flex-start;margin-block:0;padding-block-start:var(--et-form-field-control-padding-block);padding-inline-start:var(--et-form-field-control-padding-inline)}et-form-field:where([data-control-type=rich-text])[data-appearance=box][data-label-mode=inline] .et-form-field-label-area--inline{margin-inline-end:calc(var(--et-form-field-control-affix-gap) * -1)}et-form-field:where([data-control-type=textarea]) .et-form-field-control-frame,et-form-field:where([data-control-type=textarea]) .et-form-field-control-area,et-form-field:where([data-control-type=textarea]) .et-form-field-control-slot{align-items:stretch}et-form-field:where([data-control-type=textarea]) .et-form-field-affix{align-items:flex-start}et-form-field:where([data-control-type=textarea]):not([data-label-floated]) .et-form-field-label-area--floating{inset-block-start:calc((var(--et-form-field-control-font-size) * var(--et-form-field-control-line-height)) / 2)}et-form-field:where([data-control-type=textarea])[data-label-mode=floating-inside]:not([data-label-floated]) .et-form-field-label-area--floating{inset-block-start:calc(var(--_et-form-field-float-inside-extra-padding) + (var(--et-form-field-control-font-size) * var(--et-form-field-control-line-height)) / 2)}et-form-field:where([data-control-type=textarea])[data-label-mode=inline] .et-form-field-label-area--inline{align-items:flex-start;padding-block-start:var(--et-form-field-control-padding-block)}et-form-field .et-form-field-support{overflow:clip;block-size:0}et-form-field .et-form-field-support-stack{position:relative;display:grid}et-form-field .et-form-field-support-content{grid-area:1 / 1;min-inline-size:0;opacity:0;transform:translateY(0)}et-form-field .et-form-field-support-content[data-active]{opacity:1;transform:translateY(0)}et-form-field .et-form-field-support-content[data-state=leaving][data-direction=to-above]{position:absolute;inset:0;opacity:0;transform:translateY(calc(var(--et-form-field-support-offset) * -1));pointer-events:none}et-form-field .et-form-field-support-content[data-state=leaving][data-direction=to-below]{position:absolute;inset:0;opacity:0;transform:translateY(var(--et-form-field-support-offset));pointer-events:none}et-form-field .et-form-field-errors{display:flex;flex-direction:column;gap:2px;font-size:var(--et-form-field-error-font-size);color:var(--et-theme-color-primary-solid);padding-inline-start:calc(var(--et-form-field-control-padding-inline) + var(--et-form-field-control-border-width))}et-form-field .et-form-field-hint{font-size:var(--et-form-field-hint-font-size);color:var(--et-surface-color-muted-solid, currentColor);padding-inline-start:calc(var(--et-form-field-control-padding-inline) + var(--et-form-field-control-border-width));transition:color .15s ease}et-form-field .et-form-field-hint:empty{display:none}et-form-field[data-disabled] .et-form-field-hint{color:var(--et-surface-interaction-disabled-solid, currentColor)}et-form-field[data-can-animate] .et-form-field-support{transition:block-size var(--et-form-field-support-duration) ease}et-form-field[data-can-animate] .et-form-field-support-content{transition:opacity var(--et-form-field-support-duration) ease,transform var(--et-form-field-support-duration) ease}@starting-style{et-form-field[data-can-animate] .et-form-field-support-content[data-active][data-direction=from-above]{opacity:0;transform:translateY(calc(var(--et-form-field-support-offset) * -1))}}@starting-style{et-form-field[data-can-animate] .et-form-field-support-content[data-active][data-direction=from-below]{opacity:0;transform:translateY(var(--et-form-field-support-offset))}}@media(prefers-reduced-motion:reduce){et-form-field{--et-form-field-support-duration: 1ms;--et-form-field-support-offset: 0px}}}\n"], dependencies: [{ kind: "directive", type: AnimatableDirective, selector: "[etAnimatable]", exportAs: ["etAnimatable"] }, { kind: "directive", type: ColorInteractiveExcludeDirective, selector: "[etColorInteractiveExclude]" }, { kind: "component", type: FormErrorComponent, selector: "et-form-error", inputs: ["error"] }, { kind: "directive", type: ProvideColorDirective, selector: "[etProvideColor]", inputs: ["etProvideColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
11830
11830
  }
11831
11831
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: FormFieldComponent, decorators: [{
11832
11832
  type: Component,
@@ -11852,7 +11852,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
11852
11852
  '[attr.data-size]': 'formFieldDir.usesTextFieldShell() ? size() : null',
11853
11853
  '[attr.data-text-shell]': 'formFieldDir.usesTextFieldShell() || null',
11854
11854
  '[style.--_et-form-field-prefix-offset]': 'prefixOffset()',
11855
- }, template: "<div class=\"et-form-field-shell\">\n <div #controlFrame (mousedown)=\"handleFramePointerDown($event)\" class=\"et-form-field-control-frame\">\n <div #prefixEl class=\"et-form-field-affix et-form-field-prefix\">\n <ng-content select=\"[etInputPrefix]\" />\n </div>\n\n <div class=\"et-form-field-control-area\">\n <div\n [class.et-form-field-label-area--floating]=\"hasFloatingTextLabel()\"\n [class.et-form-field-label-area--inline]=\"hasInlineLabel()\"\n class=\"et-form-field-label-area\"\n >\n <ng-content select=\"et-label\" />\n </div>\n\n <div class=\"et-form-field-control-slot\">\n <ng-content />\n </div>\n </div>\n\n <div class=\"et-form-field-affix et-form-field-suffix\">\n <ng-content select=\"[etInputSuffix]\" />\n </div>\n </div>\n</div>\n\n@if (shouldRenderSupport()) {\n <div [style.block-size.px]=\"supportHeight()\" class=\"et-form-field-support\" etColorInteractiveExclude>\n <div class=\"et-form-field-support-stack\">\n @if (shouldRenderError()) {\n <div\n #errorContent\n #errorAnimatable=\"etAnimatable\"\n [id]=\"formFieldDir.errorId()\"\n [attr.aria-atomic]=\"errorActive() ? 'true' : null\"\n [attr.aria-hidden]=\"!errorActive() ? 'true' : null\"\n [attr.aria-live]=\"errorActive() ? 'polite' : null\"\n [attr.data-active]=\"errorActive() || null\"\n [attr.data-direction]=\"errorDirection()\"\n [attr.data-state]=\"errorState()\"\n [etProvideColor]=\"errorColorTheme\"\n class=\"et-form-field-support-content et-form-field-errors\"\n etAnimatable\n >\n @for (error of visibleErrors(); track $index) {\n <et-form-error [error]=\"error\" />\n }\n </div>\n }\n\n @if (shouldRenderHint()) {\n <div\n #hintContent\n #hintAnimatable=\"etAnimatable\"\n [id]=\"formFieldDir.hintId()\"\n [attr.aria-hidden]=\"!hintActive() ? 'true' : null\"\n [attr.data-active]=\"hintActive() || null\"\n [attr.data-direction]=\"hintDirection()\"\n [attr.data-state]=\"hintState()\"\n class=\"et-form-field-support-content et-form-field-hint\"\n etAnimatable\n >\n <ng-content select=\"et-hint\" />\n </div>\n }\n </div>\n </div>\n}\n", styles: ["@layer components{@property --et-form-field-gap{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-form-field-control-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-form-field-control-border-width{syntax: \"<length>\"; inherits: true; initial-value: 1px;}@property --et-form-field-control-padding-block{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-form-field-control-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-form-field-control-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-form-field-control-line-height{syntax: \"<number>\"; inherits: true; initial-value: 1.5;}@property --et-form-field-control-affix-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-form-field-control-disabled-opacity{syntax: \"<number>\"; inherits: true; initial-value: .5;}@property --et-form-field-control-min-height{syntax: \"<length>\"; inherits: true; initial-value: 40px;}@property --et-form-field-label-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-form-field-error-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-form-field-hint-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-form-field-support-duration{syntax: \"<time>\"; inherits: true; initial-value: .18s;}@property --et-form-field-support-offset{syntax: \"<length>\"; inherits: true; initial-value: 4px;}et-form-field{--et-theme-color-primary-solid: rgb(var(--et-theme-color-primary-rgb));--_et-form-field-control-background: transparent;--_et-form-field-control-focus-ring: color-mix(in srgb, var(--et-theme-color-primary-solid) 18%, transparent);--_et-form-field-floating-label-scale: .75;display:flex;flex-direction:column;gap:var(--et-form-field-gap);color:var(--et-surface-color-solid, currentColor)}et-form-field:where([data-size=sm]){--et-form-field-gap: 4px;--et-form-field-control-border-radius: 4px;--et-form-field-control-padding-block: 4px;--et-form-field-control-padding-inline: 10px;--et-form-field-control-affix-gap: 6px;--et-form-field-control-font-size: 12px;--et-form-field-control-min-height: 42px;--et-form-field-label-font-size: 12px}et-form-field:where([data-size=md]){--et-form-field-gap: 5px;--et-form-field-control-border-radius: 5px;--et-form-field-control-padding-block: 6px;--et-form-field-control-padding-inline: 12px;--et-form-field-control-affix-gap: 8px;--et-form-field-control-font-size: 14px;--et-form-field-control-min-height: 50px;--et-form-field-label-font-size: 13px}et-form-field:where([data-size=lg]){--et-form-field-gap: 6px;--et-form-field-control-border-radius: 6px;--et-form-field-control-padding-block: 8px;--et-form-field-control-padding-inline: 14px;--et-form-field-control-affix-gap: 10px;--et-form-field-control-font-size: 16px;--et-form-field-control-min-height: 58px;--et-form-field-label-font-size: 14px}et-form-field[data-fill=filled]{--_et-form-field-control-background: var( --et-surface-background-solid, var(--et-surface-base-solid, transparent) )}et-form-field .et-form-field-shell{display:flex;flex-direction:column;gap:var(--et-form-field-gap);min-inline-size:0;overflow:visible}et-form-field .et-form-field-label-area{display:flex;align-items:center;font-size:var(--et-form-field-label-font-size);font-weight:500;line-height:1.2;letter-spacing:-.01em;color:var(--et-surface-color-muted-solid, currentColor);cursor:text;-webkit-user-select:none;user-select:none;min-inline-size:0;transition:color .15s ease,opacity .15s ease}et-form-field .et-form-field-label-area et-label{display:inline;min-inline-size:0}et-form-field .et-form-field-label-area--floating{position:absolute;inset-block-start:50%;inset-inline-start:0;z-index:1;max-inline-size:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transform:translateY(-50%);transform-origin:left top;pointer-events:none}et-form-field[data-can-animate] .et-form-field-label-area--floating{transition:color .15s ease,opacity .15s ease,inset-block-start .15s ease,inset-inline-start .15s ease,transform .15s ease}et-form-field .et-form-field-control-frame{position:relative;display:flex;align-items:center;box-sizing:border-box;gap:var(--et-form-field-control-affix-gap);min-inline-size:0;min-block-size:var(--et-form-field-control-min-height);padding-block:var(--et-form-field-control-padding-block);padding-inline:var(--et-form-field-control-padding-inline);border:var(--et-form-field-control-border-width) solid var(--et-surface-border-solid, currentColor);border-radius:var(--et-form-field-control-border-radius);background:var(--_et-form-field-control-background);font-size:var(--et-form-field-control-font-size);line-height:var(--et-form-field-control-line-height);transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease,opacity .15s ease;cursor:text}et-form-field .et-form-field-affix{display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--et-surface-color-muted-solid, currentColor);opacity:.78;pointer-events:none;transition:color .15s ease,opacity .15s ease}et-form-field .et-form-field-affix:empty{display:none}et-form-field .et-form-field-affix>*{pointer-events:none}et-form-field .et-form-field-affix>:is(button,a[href],input,select,textarea,summary,label,[role=button],[tabindex]:not([tabindex=\"-1\"])){pointer-events:auto}et-form-field .et-form-field-affix button{font:inherit;color:inherit;border:none;background:transparent;padding:0;cursor:pointer}et-form-field .et-form-field-control-area{position:relative;display:flex;align-items:center;flex:1;min-inline-size:0}et-form-field .et-form-field-control-area>*{min-inline-size:0}et-form-field .et-form-field-control-slot{display:flex;align-items:center;flex:1;min-inline-size:0}et-form-field:where([data-text-shell])[data-label-mode=static] .et-form-field-shell{padding-block-start:calc(var(--et-form-field-label-font-size) * 1.2 + var(--et-form-field-gap))}et-form-field:where([data-text-shell])[data-label-mode=static] .et-form-field-control-area{position:static}et-form-field:where([data-text-shell])[data-label-mode=static] .et-form-field-label-area{position:absolute;inset-block-start:0;inset-inline-start:var(--et-form-field-control-padding-inline);transform:translateY(calc(-100% - var(--et-form-field-gap) - var(--et-form-field-control-border-width)))}et-form-field:where([data-text-shell])[data-label-mode=static][data-appearance=underline][data-fill=transparent] .et-form-field-label-area{inset-inline-start:0}et-form-field:where([data-text-shell])[data-label-mode=inline] .et-form-field-control-frame{align-items:stretch}et-form-field:where([data-text-shell])[data-label-mode=inline] .et-form-field-control-area{position:static;gap:var(--et-form-field-control-affix-gap);align-items:stretch}et-form-field:where([data-text-shell])[data-label-mode=inline] .et-form-field-control-slot{display:flex;align-items:center}et-form-field:where([data-text-shell])[data-label-mode=inline] .et-form-field-label-area--inline{position:static;flex-shrink:0;transform:none;white-space:nowrap;pointer-events:auto;font-size:var(--et-form-field-control-font-size);line-height:var(--et-form-field-control-line-height);display:flex;align-items:center;margin-block:calc(var(--et-form-field-control-padding-block) * -1)}et-form-field:where([data-text-shell])[data-label-mode=inline][data-appearance=underline] .et-form-field-label-area--inline:after{content:\":\"}et-form-field:where([data-text-shell])[data-label-mode=inline][data-appearance=box] .et-form-field-label-area--inline{padding-inline-end:var(--et-form-field-control-padding-inline);margin-inline-end:calc(var(--et-form-field-control-padding-inline) - var(--et-form-field-control-affix-gap));border-inline-end:var(--et-form-field-control-border-width) solid var(--et-surface-border-solid, currentColor)}:is(et-form-field:where([data-text-shell])[data-label-mode=floating-inside],et-form-field:where([data-text-shell])[data-label-mode=floating-outside]) :is(.et-input-native,.et-number-input-native,.et-textarea-native)::placeholder{transition:color .15s ease}:is(et-form-field:where([data-text-shell])[data-label-mode=floating-inside],et-form-field:where([data-text-shell])[data-label-mode=floating-outside]) .et-select-value[data-placeholder]{transition:color .15s ease}:is(et-form-field:where([data-text-shell])[data-label-mode=floating-inside],et-form-field:where([data-text-shell])[data-label-mode=floating-outside]):not([data-label-floated]) :is(.et-input-native,.et-number-input-native,.et-textarea-native)::placeholder{color:transparent}:is(et-form-field:where([data-text-shell])[data-label-mode=floating-inside],et-form-field:where([data-text-shell])[data-label-mode=floating-outside]):not([data-label-floated]) .et-select-value[data-placeholder]{color:transparent}et-form-field:where([data-text-shell])[data-label-mode=floating-outside] .et-form-field-control-area{align-self:stretch;display:flex;align-items:center}et-form-field:where([data-text-shell])[data-label-mode=floating-outside] .et-form-field-label-area--floating{inset-inline-start:0}et-form-field:where([data-text-shell])[data-label-mode=floating-outside] .et-form-field-shell{padding-block-start:calc(var(--et-form-field-label-font-size) * 1.2 + var(--et-form-field-gap))}et-form-field:where([data-text-shell])[data-label-mode=floating-outside][data-label-floated] .et-form-field-label-area--floating{inset-block-start:0;inset-inline-start:calc(var(--_et-form-field-prefix-offset, 0px) * -1);transform:translateY(calc(-100% - var(--et-form-field-gap) - var(--et-form-field-control-border-width) - var(--et-form-field-control-padding-block)))}et-form-field:where([data-text-shell])[data-label-mode=floating-inside]{--_et-form-field-float-inside-extra-padding: calc( var(--et-form-field-label-font-size) * var(--_et-form-field-floating-label-scale) + 2px )}et-form-field:where([data-text-shell])[data-label-mode=floating-inside] .et-form-field-control-area{align-self:stretch;display:flex;align-items:center;padding-block-start:var(--_et-form-field-float-inside-extra-padding)}et-form-field:where([data-text-shell])[data-label-mode=floating-inside] .et-form-field-label-area--floating{inset-inline-start:0}et-form-field:where([data-text-shell])[data-label-mode=floating-inside][data-label-floated] .et-form-field-label-area--floating{inset-block-start:4px;transform:scale(var(--_et-form-field-floating-label-scale))}et-form-field:where([data-text-shell])[data-label-mode=floating-inside] .et-form-field-control-slot{font-size:calc(var(--et-form-field-control-font-size) * .96)}et-form-field:where([data-text-shell]) .et-form-field-label-area{max-inline-size:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}et-form-field:where([data-text-shell]):where(:hover:not([data-readonly]):not([data-disabled]):not(:has(.et-color-interactive-exclude:hover))) .et-form-field-control-frame{border-color:var(--et-surface-interaction-hover-solid, currentColor)}et-form-field:where([data-text-shell]):where(:hover:not([data-readonly]):not([data-disabled]):not(:has(.et-color-interactive-exclude:hover))) .et-form-field-label-area,et-form-field:where([data-text-shell]):where(:hover:not([data-readonly]):not([data-disabled]):not(:has(.et-color-interactive-exclude:hover))) .et-form-field-affix{color:var(--et-surface-color-solid, currentColor);opacity:1}et-form-field:where([data-text-shell]):where(:has(:focus-visible):not([data-readonly])) .et-form-field-control-frame{border-color:var(--et-theme-color-primary-solid)}et-form-field:where([data-text-shell]):where(:has(:focus-visible):not([data-readonly])) .et-form-field-label-area,et-form-field:where([data-text-shell]):where(:has(:focus-visible):not([data-readonly])) .et-form-field-affix{color:var(--et-surface-color-solid, currentColor);opacity:1}et-form-field:where([data-text-shell])[data-readonly] .et-form-field-control-frame,et-form-field:where([data-text-shell])[data-readonly] .et-form-field-control,et-form-field:where([data-text-shell])[data-readonly] input,et-form-field:where([data-text-shell])[data-readonly] textarea,et-form-field:where([data-text-shell])[data-readonly] [contenteditable]{cursor:default}et-form-field:where([data-text-shell])[data-error] .et-form-field-control-frame{border-color:var(--et-theme-color-primary-solid)}et-form-field:where([data-text-shell])[data-error] .et-form-field-label-area{color:var(--et-theme-color-primary-solid)}et-form-field:where([data-text-shell])[data-error] .et-form-field-affix{color:var(--et-theme-color-primary-solid);opacity:1}et-form-field:where([data-text-shell])[data-disabled] .et-form-field-control-frame{opacity:var(--et-form-field-control-disabled-opacity);pointer-events:none;box-shadow:none}et-form-field:where([data-text-shell])[data-disabled] .et-form-field-label-area{cursor:not-allowed}et-form-field:where([data-text-shell])[data-appearance=underline] .et-form-field-control-frame{border-top:none;border-inline:none;border-radius:0;box-shadow:none}et-form-field:where([data-text-shell])[data-appearance=underline][data-fill=transparent] .et-form-field-control-frame{padding-inline:0}et-form-field:where([data-text-shell])[data-appearance=underline][data-fill=transparent] .et-form-field-errors,et-form-field:where([data-text-shell])[data-appearance=underline][data-fill=transparent] .et-form-field-hint{padding-inline-start:0}et-form-field:where([data-control-type=rich-text]) .et-form-field-control-frame{align-items:stretch;padding:0;cursor:auto}et-form-field:where([data-control-type=rich-text]) .et-form-field-control-area,et-form-field:where([data-control-type=rich-text]) .et-form-field-control-slot{align-items:stretch}et-form-field:where([data-control-type=rich-text])[data-label-mode=inline] .et-form-field-label-area--inline{align-items:flex-start;margin-block:0;padding-block-start:var(--et-form-field-control-padding-block);padding-inline-start:var(--et-form-field-control-padding-inline)}et-form-field:where([data-control-type=rich-text])[data-appearance=box][data-label-mode=inline] .et-form-field-label-area--inline{margin-inline-end:calc(var(--et-form-field-control-affix-gap) * -1)}et-form-field:where([data-control-type=textarea]) .et-form-field-control-frame,et-form-field:where([data-control-type=textarea]) .et-form-field-control-area,et-form-field:where([data-control-type=textarea]) .et-form-field-control-slot{align-items:stretch}et-form-field:where([data-control-type=textarea]) .et-form-field-affix{align-items:flex-start}et-form-field:where([data-control-type=textarea]):not([data-label-floated]) .et-form-field-label-area--floating{inset-block-start:calc((var(--et-form-field-control-font-size) * var(--et-form-field-control-line-height)) / 2)}et-form-field:where([data-control-type=textarea])[data-label-mode=floating-inside]:not([data-label-floated]) .et-form-field-label-area--floating{inset-block-start:calc(var(--_et-form-field-float-inside-extra-padding) + (var(--et-form-field-control-font-size) * var(--et-form-field-control-line-height)) / 2)}et-form-field:where([data-control-type=textarea])[data-label-mode=inline] .et-form-field-label-area--inline{align-items:flex-start;padding-block-start:var(--et-form-field-control-padding-block)}et-form-field .et-form-field-support{overflow:clip;block-size:0}et-form-field .et-form-field-support-stack{position:relative;display:grid}et-form-field .et-form-field-support-content{grid-area:1 / 1;min-inline-size:0;opacity:0;transform:translateY(0)}et-form-field .et-form-field-support-content[data-active]{opacity:1;transform:translateY(0)}et-form-field .et-form-field-support-content[data-state=leaving][data-direction=to-above]{position:absolute;inset:0;opacity:0;transform:translateY(calc(var(--et-form-field-support-offset) * -1));pointer-events:none}et-form-field .et-form-field-support-content[data-state=leaving][data-direction=to-below]{position:absolute;inset:0;opacity:0;transform:translateY(var(--et-form-field-support-offset));pointer-events:none}et-form-field .et-form-field-errors{display:flex;flex-direction:column;gap:2px;font-size:var(--et-form-field-error-font-size);color:var(--et-theme-color-primary-solid);padding-inline-start:calc(var(--et-form-field-control-padding-inline) + var(--et-form-field-control-border-width))}et-form-field .et-form-field-hint{font-size:var(--et-form-field-hint-font-size);color:var(--et-surface-color-muted-solid, currentColor);padding-inline-start:calc(var(--et-form-field-control-padding-inline) + var(--et-form-field-control-border-width));transition:color .15s ease}et-form-field .et-form-field-hint:empty{display:none}et-form-field[data-disabled] .et-form-field-hint{color:var(--et-surface-interaction-disabled-solid, currentColor)}et-form-field[data-can-animate] .et-form-field-support{transition:block-size var(--et-form-field-support-duration) ease}et-form-field[data-can-animate] .et-form-field-support-content{transition:opacity var(--et-form-field-support-duration) ease,transform var(--et-form-field-support-duration) ease}@starting-style{et-form-field[data-can-animate] .et-form-field-support-content[data-active][data-direction=from-above]{opacity:0;transform:translateY(calc(var(--et-form-field-support-offset) * -1))}}@starting-style{et-form-field[data-can-animate] .et-form-field-support-content[data-active][data-direction=from-below]{opacity:0;transform:translateY(var(--et-form-field-support-offset))}}@media(prefers-reduced-motion:reduce){et-form-field{--et-form-field-support-duration: 1ms;--et-form-field-support-offset: 0px}}}\n"] }]
11855
+ }, template: "<div class=\"et-form-field-shell\">\n <div #controlFrame (mousedown)=\"handleFramePointerDown($event)\" class=\"et-form-field-control-frame\">\n <div #prefixEl class=\"et-form-field-affix et-form-field-prefix\">\n <ng-content select=\"[etInputPrefix]\" />\n </div>\n\n <div class=\"et-form-field-control-area\">\n <div\n [class.et-form-field-label-area--floating]=\"hasFloatingTextLabel()\"\n [class.et-form-field-label-area--inline]=\"hasInlineLabel()\"\n class=\"et-form-field-label-area\"\n >\n <ng-content select=\"et-label\" />\n </div>\n\n <div class=\"et-form-field-control-slot\">\n <ng-content />\n </div>\n </div>\n\n <div class=\"et-form-field-affix et-form-field-suffix\">\n <ng-content select=\"[etInputSuffix]\" />\n </div>\n </div>\n</div>\n\n@if (shouldRenderSupport()) {\n <div [style.block-size.px]=\"supportHeight()\" class=\"et-form-field-support\" etColorInteractiveExclude>\n <div class=\"et-form-field-support-stack\">\n @if (shouldRenderError()) {\n <div\n #errorContent\n #errorAnimatable=\"etAnimatable\"\n [id]=\"formFieldDir.errorId()\"\n [attr.aria-atomic]=\"errorActive() ? 'true' : null\"\n [attr.aria-hidden]=\"!errorActive() ? 'true' : null\"\n [attr.aria-live]=\"errorActive() ? 'polite' : null\"\n [attr.data-active]=\"errorActive() || null\"\n [attr.data-direction]=\"errorDirection()\"\n [attr.data-state]=\"errorState()\"\n [etProvideColor]=\"errorColorTheme\"\n class=\"et-form-field-support-content et-form-field-errors\"\n etAnimatable\n >\n @for (error of visibleErrors(); track $index) {\n <et-form-error [error]=\"error\" />\n }\n </div>\n }\n\n @if (shouldRenderHint()) {\n <div\n #hintContent\n #hintAnimatable=\"etAnimatable\"\n [id]=\"formFieldDir.hintId()\"\n [attr.aria-hidden]=\"!hintActive() ? 'true' : null\"\n [attr.data-active]=\"hintActive() || null\"\n [attr.data-direction]=\"hintDirection()\"\n [attr.data-state]=\"hintState()\"\n class=\"et-form-field-support-content et-form-field-hint\"\n etAnimatable\n >\n <ng-content select=\"et-hint\" />\n </div>\n }\n </div>\n </div>\n}\n", styles: ["@layer components{@property --et-form-field-gap{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-form-field-control-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-form-field-control-border-width{syntax: \"<length>\"; inherits: true; initial-value: 1px;}@property --et-form-field-control-padding-block{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-form-field-control-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-form-field-control-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-form-field-control-line-height{syntax: \"<number>\"; inherits: true; initial-value: 1.5;}@property --et-form-field-control-affix-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-form-field-control-disabled-opacity{syntax: \"<number>\"; inherits: true; initial-value: .5;}@property --et-form-field-control-min-height{syntax: \"<length>\"; inherits: true; initial-value: 40px;}@property --et-form-field-label-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-form-field-error-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-form-field-hint-font-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-form-field-support-duration{syntax: \"<time>\"; inherits: true; initial-value: .18s;}@property --et-form-field-support-offset{syntax: \"<length>\"; inherits: true; initial-value: 4px;}et-form-field{--et-theme-color-primary-solid: rgb(var(--et-theme-color-primary-rgb));--_et-form-field-control-background: transparent;--_et-form-field-control-focus-ring: color-mix(in srgb, var(--et-theme-color-primary-solid) 18%, transparent);--_et-form-field-floating-label-scale: .75;display:flex;flex-direction:column;gap:var(--et-form-field-gap);color:var(--et-surface-color-solid, currentColor)}et-form-field:where([data-size=sm]){--et-form-field-gap: 4px;--et-form-field-control-border-radius: 4px;--et-form-field-control-padding-block: 4px;--et-form-field-control-padding-inline: 10px;--et-form-field-control-affix-gap: 6px;--et-form-field-control-font-size: 12px;--et-form-field-control-min-height: 42px;--et-form-field-label-font-size: 12px}et-form-field:where([data-size=md]){--et-form-field-gap: 5px;--et-form-field-control-border-radius: 5px;--et-form-field-control-padding-block: 6px;--et-form-field-control-padding-inline: 12px;--et-form-field-control-affix-gap: 8px;--et-form-field-control-font-size: 14px;--et-form-field-control-min-height: 50px;--et-form-field-label-font-size: 13px}et-form-field:where([data-size=lg]){--et-form-field-gap: 6px;--et-form-field-control-border-radius: 6px;--et-form-field-control-padding-block: 8px;--et-form-field-control-padding-inline: 14px;--et-form-field-control-affix-gap: 10px;--et-form-field-control-font-size: 16px;--et-form-field-control-min-height: 58px;--et-form-field-label-font-size: 14px}et-form-field[data-fill=filled]{--_et-form-field-control-background: var( --et-surface-background-solid, var(--et-surface-base-solid, transparent) )}et-form-field .et-form-field-shell{display:flex;flex-direction:column;gap:var(--et-form-field-gap);min-inline-size:0;overflow:visible}et-form-field .et-form-field-label-area{display:flex;align-items:center;font-size:var(--et-form-field-label-font-size);font-weight:500;line-height:1.2;letter-spacing:-.01em;color:var(--et-surface-color-muted-solid, currentColor);cursor:text;-webkit-user-select:none;user-select:none;min-inline-size:0;transition:color .15s ease,opacity .15s ease}et-form-field .et-form-field-label-area et-label{display:inline;min-inline-size:0}et-form-field .et-form-field-label-area--floating{position:absolute;inset-block-start:50%;inset-inline-start:0;z-index:1;max-inline-size:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transform:translateY(-50%);transform-origin:left top;pointer-events:none}et-form-field[data-can-animate] .et-form-field-label-area--floating{transition:color .15s ease,opacity .15s ease,inset-block-start .15s ease,inset-inline-start .15s ease,transform .15s ease}et-form-field .et-form-field-control-frame{position:relative;display:flex;align-items:center;box-sizing:border-box;gap:var(--et-form-field-control-affix-gap);min-inline-size:0;min-block-size:var(--et-form-field-control-min-height);padding-block:var(--et-form-field-control-padding-block);padding-inline:var(--et-form-field-control-padding-inline);border:var(--et-form-field-control-border-width) solid var(--et-surface-border-solid, currentColor);border-radius:var(--et-form-field-control-border-radius);background:var(--_et-form-field-control-background);font-size:var(--et-form-field-control-font-size);line-height:var(--et-form-field-control-line-height);transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease,opacity .15s ease;cursor:text}et-form-field .et-form-field-affix{display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--et-surface-color-muted-solid, currentColor);opacity:.78;pointer-events:none;transition:color .15s ease,opacity .15s ease}et-form-field .et-form-field-affix:empty{display:none}et-form-field .et-form-field-affix>*{pointer-events:none}et-form-field .et-form-field-affix>:is(button,a[href],input,select,textarea,summary,label,[role=button],[tabindex]:not([tabindex=\"-1\"])){pointer-events:auto}et-form-field .et-form-field-affix button{font:inherit;color:inherit;border:none;background:transparent;padding:0;cursor:pointer}et-form-field .et-form-field-control-area{position:relative;display:flex;align-items:center;flex:1;min-inline-size:0}et-form-field .et-form-field-control-area>*{min-inline-size:0}et-form-field .et-form-field-control-slot{display:flex;align-items:center;flex:1;min-inline-size:0}et-form-field:where([data-text-shell])[data-label-mode=static] .et-form-field-shell{padding-block-start:calc(var(--et-form-field-label-font-size) * 1.2 + var(--et-form-field-gap))}et-form-field:where([data-text-shell])[data-label-mode=static] .et-form-field-control-area{position:static}et-form-field:where([data-text-shell])[data-label-mode=static] .et-form-field-label-area{position:absolute;inset-block-start:0;inset-inline-start:var(--et-form-field-control-padding-inline);transform:translateY(calc(-100% - var(--et-form-field-gap) - var(--et-form-field-control-border-width)))}et-form-field:where([data-text-shell])[data-label-mode=static][data-appearance=underline][data-fill=transparent] .et-form-field-label-area{inset-inline-start:0}et-form-field:where([data-text-shell])[data-label-mode=inline] .et-form-field-control-frame{align-items:stretch}et-form-field:where([data-text-shell])[data-label-mode=inline] .et-form-field-control-area{position:static;gap:var(--et-form-field-control-affix-gap);align-items:stretch}et-form-field:where([data-text-shell])[data-label-mode=inline] .et-form-field-control-slot{display:flex;align-items:center}et-form-field:where([data-text-shell])[data-label-mode=inline] .et-form-field-label-area--inline{position:static;flex-shrink:0;transform:none;white-space:nowrap;pointer-events:auto;font-size:var(--et-form-field-control-font-size);line-height:var(--et-form-field-control-line-height);display:flex;align-items:center;margin-block:calc(var(--et-form-field-control-padding-block) * -1)}et-form-field:where([data-text-shell])[data-label-mode=inline][data-appearance=underline] .et-form-field-label-area--inline:after{content:\":\"}et-form-field:where([data-text-shell])[data-label-mode=inline][data-appearance=box] .et-form-field-label-area--inline{padding-inline-end:var(--et-form-field-control-padding-inline);margin-inline-end:calc(var(--et-form-field-control-padding-inline) - var(--et-form-field-control-affix-gap));border-inline-end:var(--et-form-field-control-border-width) solid var(--et-surface-border-solid, currentColor)}:is(et-form-field:where([data-text-shell])[data-label-mode=floating-inside],et-form-field:where([data-text-shell])[data-label-mode=floating-outside]) :is(.et-input-native,.et-number-input-native,.et-textarea-native)::placeholder{transition:color .15s ease}:is(et-form-field:where([data-text-shell])[data-label-mode=floating-inside],et-form-field:where([data-text-shell])[data-label-mode=floating-outside]) .et-select-value[data-placeholder]{transition:color .15s ease}:is(et-form-field:where([data-text-shell])[data-label-mode=floating-inside],et-form-field:where([data-text-shell])[data-label-mode=floating-outside]):not([data-label-floated]) :is(.et-input-native,.et-number-input-native,.et-textarea-native)::placeholder{color:transparent}:is(et-form-field:where([data-text-shell])[data-label-mode=floating-inside],et-form-field:where([data-text-shell])[data-label-mode=floating-outside]):not([data-label-floated]) .et-select-value[data-placeholder]{color:transparent}et-form-field:where([data-text-shell])[data-label-mode=floating-outside] .et-form-field-control-area{align-self:stretch;display:flex;align-items:center}et-form-field:where([data-text-shell])[data-label-mode=floating-outside] .et-form-field-label-area--floating{inset-inline-start:0}et-form-field:where([data-text-shell])[data-label-mode=floating-outside] .et-form-field-shell{padding-block-start:calc(var(--et-form-field-label-font-size) * 1.2 + var(--et-form-field-gap))}et-form-field:where([data-text-shell])[data-label-mode=floating-outside][data-label-floated] .et-form-field-label-area--floating{inset-block-start:0;inset-inline-start:calc(var(--_et-form-field-prefix-offset, 0px) * -1);transform:translateY(calc(-100% - var(--et-form-field-gap) - var(--et-form-field-control-border-width) - var(--et-form-field-control-padding-block)))}et-form-field:where([data-text-shell])[data-label-mode=floating-inside]{--_et-form-field-float-inside-extra-padding: calc( var(--et-form-field-label-font-size) * var(--_et-form-field-floating-label-scale) + 2px )}et-form-field:where([data-text-shell])[data-label-mode=floating-inside] .et-form-field-control-area{align-self:stretch;display:flex;align-items:center;padding-block-start:var(--_et-form-field-float-inside-extra-padding)}et-form-field:where([data-text-shell])[data-label-mode=floating-inside] .et-form-field-label-area--floating{inset-inline-start:0}et-form-field:where([data-text-shell])[data-label-mode=floating-inside][data-label-floated] .et-form-field-label-area--floating{inset-block-start:4px;transform:scale(var(--_et-form-field-floating-label-scale))}et-form-field:where([data-text-shell])[data-label-mode=floating-inside] .et-form-field-control-slot{font-size:calc(var(--et-form-field-control-font-size) * .96)}et-form-field:where([data-text-shell]) .et-form-field-label-area{max-inline-size:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media(hover:hover){et-form-field:where([data-text-shell]):where(:hover:not([data-readonly]):not([data-disabled]):not(:has(.et-color-interactive-exclude:hover))) .et-form-field-control-frame{border-color:var(--et-surface-interaction-hover-solid, currentColor)}et-form-field:where([data-text-shell]):where(:hover:not([data-readonly]):not([data-disabled]):not(:has(.et-color-interactive-exclude:hover))) .et-form-field-label-area,et-form-field:where([data-text-shell]):where(:hover:not([data-readonly]):not([data-disabled]):not(:has(.et-color-interactive-exclude:hover))) .et-form-field-affix{color:var(--et-surface-color-solid, currentColor);opacity:1}}et-form-field:where([data-text-shell]):where(:has(:focus-visible):not([data-readonly])) .et-form-field-control-frame{border-color:var(--et-theme-color-primary-solid)}et-form-field:where([data-text-shell]):where(:has(:focus-visible):not([data-readonly])) .et-form-field-label-area,et-form-field:where([data-text-shell]):where(:has(:focus-visible):not([data-readonly])) .et-form-field-affix{color:var(--et-surface-color-solid, currentColor);opacity:1}et-form-field:where([data-text-shell])[data-readonly] .et-form-field-control-frame,et-form-field:where([data-text-shell])[data-readonly] .et-form-field-control,et-form-field:where([data-text-shell])[data-readonly] input,et-form-field:where([data-text-shell])[data-readonly] textarea,et-form-field:where([data-text-shell])[data-readonly] [contenteditable]{cursor:default}et-form-field:where([data-text-shell])[data-error] .et-form-field-control-frame{border-color:var(--et-theme-color-primary-solid)}et-form-field:where([data-text-shell])[data-error] .et-form-field-label-area{color:var(--et-theme-color-primary-solid)}et-form-field:where([data-text-shell])[data-error] .et-form-field-affix{color:var(--et-theme-color-primary-solid);opacity:1}et-form-field:where([data-text-shell])[data-disabled] .et-form-field-control-frame{opacity:var(--et-form-field-control-disabled-opacity);pointer-events:none;box-shadow:none}et-form-field:where([data-text-shell])[data-disabled] .et-form-field-label-area{cursor:not-allowed}et-form-field:where([data-text-shell])[data-appearance=underline] .et-form-field-control-frame{border-top:none;border-inline:none;border-radius:0;box-shadow:none}et-form-field:where([data-text-shell])[data-appearance=underline][data-fill=transparent] .et-form-field-control-frame{padding-inline:0}et-form-field:where([data-text-shell])[data-appearance=underline][data-fill=transparent] .et-form-field-errors,et-form-field:where([data-text-shell])[data-appearance=underline][data-fill=transparent] .et-form-field-hint{padding-inline-start:0}et-form-field:where([data-control-type=rich-text]) .et-form-field-control-frame{align-items:stretch;padding:0;cursor:auto}et-form-field:where([data-control-type=rich-text]) .et-form-field-control-area,et-form-field:where([data-control-type=rich-text]) .et-form-field-control-slot{align-items:stretch}et-form-field:where([data-control-type=rich-text])[data-label-mode=inline] .et-form-field-label-area--inline{align-items:flex-start;margin-block:0;padding-block-start:var(--et-form-field-control-padding-block);padding-inline-start:var(--et-form-field-control-padding-inline)}et-form-field:where([data-control-type=rich-text])[data-appearance=box][data-label-mode=inline] .et-form-field-label-area--inline{margin-inline-end:calc(var(--et-form-field-control-affix-gap) * -1)}et-form-field:where([data-control-type=textarea]) .et-form-field-control-frame,et-form-field:where([data-control-type=textarea]) .et-form-field-control-area,et-form-field:where([data-control-type=textarea]) .et-form-field-control-slot{align-items:stretch}et-form-field:where([data-control-type=textarea]) .et-form-field-affix{align-items:flex-start}et-form-field:where([data-control-type=textarea]):not([data-label-floated]) .et-form-field-label-area--floating{inset-block-start:calc((var(--et-form-field-control-font-size) * var(--et-form-field-control-line-height)) / 2)}et-form-field:where([data-control-type=textarea])[data-label-mode=floating-inside]:not([data-label-floated]) .et-form-field-label-area--floating{inset-block-start:calc(var(--_et-form-field-float-inside-extra-padding) + (var(--et-form-field-control-font-size) * var(--et-form-field-control-line-height)) / 2)}et-form-field:where([data-control-type=textarea])[data-label-mode=inline] .et-form-field-label-area--inline{align-items:flex-start;padding-block-start:var(--et-form-field-control-padding-block)}et-form-field .et-form-field-support{overflow:clip;block-size:0}et-form-field .et-form-field-support-stack{position:relative;display:grid}et-form-field .et-form-field-support-content{grid-area:1 / 1;min-inline-size:0;opacity:0;transform:translateY(0)}et-form-field .et-form-field-support-content[data-active]{opacity:1;transform:translateY(0)}et-form-field .et-form-field-support-content[data-state=leaving][data-direction=to-above]{position:absolute;inset:0;opacity:0;transform:translateY(calc(var(--et-form-field-support-offset) * -1));pointer-events:none}et-form-field .et-form-field-support-content[data-state=leaving][data-direction=to-below]{position:absolute;inset:0;opacity:0;transform:translateY(var(--et-form-field-support-offset));pointer-events:none}et-form-field .et-form-field-errors{display:flex;flex-direction:column;gap:2px;font-size:var(--et-form-field-error-font-size);color:var(--et-theme-color-primary-solid);padding-inline-start:calc(var(--et-form-field-control-padding-inline) + var(--et-form-field-control-border-width))}et-form-field .et-form-field-hint{font-size:var(--et-form-field-hint-font-size);color:var(--et-surface-color-muted-solid, currentColor);padding-inline-start:calc(var(--et-form-field-control-padding-inline) + var(--et-form-field-control-border-width));transition:color .15s ease}et-form-field .et-form-field-hint:empty{display:none}et-form-field[data-disabled] .et-form-field-hint{color:var(--et-surface-interaction-disabled-solid, currentColor)}et-form-field[data-can-animate] .et-form-field-support{transition:block-size var(--et-form-field-support-duration) ease}et-form-field[data-can-animate] .et-form-field-support-content{transition:opacity var(--et-form-field-support-duration) ease,transform var(--et-form-field-support-duration) ease}@starting-style{et-form-field[data-can-animate] .et-form-field-support-content[data-active][data-direction=from-above]{opacity:0;transform:translateY(calc(var(--et-form-field-support-offset) * -1))}}@starting-style{et-form-field[data-can-animate] .et-form-field-support-content[data-active][data-direction=from-below]{opacity:0;transform:translateY(var(--et-form-field-support-offset))}}@media(prefers-reduced-motion:reduce){et-form-field{--et-form-field-support-duration: 1ms;--et-form-field-support-offset: 0px}}}\n"] }]
11856
11856
  }], ctorParameters: () => [], propDecorators: { appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], fill: [{ type: i0.Input, args: [{ isSignal: true, alias: "fill", required: false }] }], labelMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelMode", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], errorContent: [{ type: i0.ViewChild, args: ['errorContent', { isSignal: true }] }], hintContent: [{ type: i0.ViewChild, args: ['hintContent', { isSignal: true }] }], controlFrame: [{ type: i0.ViewChild, args: ['controlFrame', { isSignal: true }] }], prefixEl: [{ type: i0.ViewChild, args: ['prefixEl', { isSignal: true }] }], errorAnimatable: [{ type: i0.ViewChild, args: ['errorAnimatable', { isSignal: true }] }], hintAnimatable: [{ type: i0.ViewChild, args: ['hintAnimatable', { isSignal: true }] }] } });
11857
11857
 
11858
11858
  class InputPrefixDirective {
@@ -12266,7 +12266,7 @@ class NumberInputComponent {
12266
12266
  this.repeatSub = null;
12267
12267
  }
12268
12268
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NumberInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
12269
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: NumberInputComponent, isStandalone: true, selector: "et-number-input", inputs: { stepper: { classPropertyName: "stepper", publicName: "stepper", isSignal: true, isRequired: false, transformFunction: null }, incrementLabel: { classPropertyName: "incrementLabel", publicName: "incrementLabel", isSignal: true, isRequired: false, transformFunction: null }, decrementLabel: { classPropertyName: "decrementLabel", publicName: "decrementLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "numberInputDir.activate()" }, properties: { "attr.data-stepper": "stepper() || null" }, classAttribute: "et-number-input" }, providers: [provideIcons(MINUS_ICON, PLUS_ICON)], viewQueries: [{ propertyName: "nativeInput", first: true, predicate: ["nativeInput"], descendants: true, isSignal: true }], hostDirectives: [{ directive: NumberInputDirective, inputs: ["min", "min", "max", "max", "step", "step", "placeholder", "placeholder", "autocomplete", "autocomplete", "textAlign", "textAlign", "value", "value", "disabled", "disabled", "readonly", "readonly", "hidden", "hidden", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange"] }, { directive: i1.ColorInteractiveDirective }], ngImport: i0, template: "<input\n #nativeInput\n [value]=\"numberInputDir.value() ?? ''\"\n [disabled]=\"numberInputDir.disabled()\"\n [readOnly]=\"numberInputDir.readonly()\"\n [required]=\"numberInputDir.required()\"\n [placeholder]=\"numberInputDir.placeholder()\"\n [autocomplete]=\"numberInputDir.autocomplete()\"\n [attr.min]=\"numberInputDir.min() ?? null\"\n [attr.max]=\"numberInputDir.max() ?? null\"\n [attr.step]=\"numberInputDir.step() ?? null\"\n [attr.name]=\"numberInputDir.name() || null\"\n [attr.aria-invalid]=\"numberInputDir.shouldDisplayError() || null\"\n [attr.aria-describedby]=\"numberInputDir.describedBy() || null\"\n [attr.aria-labelledby]=\"numberInputDir.labelId() || null\"\n [attr.data-text-align]=\"numberInputDir.textAlign()\"\n (input)=\"syncNativeValue($event)\"\n (focus)=\"numberInputDir.focused.set(true)\"\n (blur)=\"numberInputDir.focused.set(false); numberInputDir.touched.set(true)\"\n class=\"et-number-input-native\"\n type=\"number\"\n/>\n\n@if (stepper()) {\n <div class=\"et-number-input-stepper\">\n <button\n [attr.aria-label]=\"decrementLabel()\"\n [disabled]=\"!numberInputDir.canStepDown()\"\n (pointerdown)=\"startStepRepeat($event, -1)\"\n (pointerup)=\"stopStepRepeat()\"\n (pointercancel)=\"stopStepRepeat()\"\n (lostpointercapture)=\"stopStepRepeat()\"\n class=\"et-number-input-stepper-button\"\n type=\"button\"\n tabindex=\"-1\"\n >\n <i aria-hidden=\"true\" etIcon=\"et-minus\"></i>\n </button>\n <button\n [attr.aria-label]=\"incrementLabel()\"\n [disabled]=\"!numberInputDir.canStepUp()\"\n (pointerdown)=\"startStepRepeat($event, 1)\"\n (pointerup)=\"stopStepRepeat()\"\n (pointercancel)=\"stopStepRepeat()\"\n (lostpointercapture)=\"stopStepRepeat()\"\n class=\"et-number-input-stepper-button\"\n type=\"button\"\n tabindex=\"-1\"\n >\n <i aria-hidden=\"true\" etIcon=\"et-plus\"></i>\n </button>\n </div>\n}\n", styles: ["@layer components{@property --et-number-input-stepper-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}et-number-input{display:block;flex:1;min-inline-size:0;color:inherit}et-number-input[data-stepper]{display:flex;align-items:center;gap:8px}et-number-input .et-number-input-stepper{display:flex;align-items:center;gap:2px;flex:none}et-number-input .et-number-input-stepper-button{display:flex;align-items:center;justify-content:center;flex:none;inline-size:calc(var(--et-number-input-stepper-size) + 8px);block-size:calc(var(--et-number-input-stepper-size) + 8px);padding:0;border:none;border-radius:4px;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;outline:none;touch-action:none}et-number-input .et-number-input-stepper-button .et-icon{inline-size:var(--et-number-input-stepper-size);block-size:var(--et-number-input-stepper-size)}et-number-input .et-number-input-stepper-button:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent);color:var(--et-surface-color-solid, currentColor)}et-number-input .et-number-input-stepper-button:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 20%,transparent)}et-number-input .et-number-input-stepper-button:disabled{cursor:default;background:transparent;color:inherit;opacity:.4}et-number-input .et-number-input-native{display:block;inline-size:100%;border:none;outline:none;background:transparent;font:inherit;color:inherit;caret-color:var(--et-theme-color-primary-solid, currentColor);padding:0;min-width:0;appearance:textfield}et-number-input .et-number-input-native::-webkit-outer-spin-button,et-number-input .et-number-input-native::-webkit-inner-spin-button{appearance:none;margin:0}et-number-input .et-number-input-native:not(:focus){overflow:hidden;text-overflow:ellipsis}et-number-input .et-number-input-native::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-number-input .et-number-input-native[data-text-align=start]{text-align:start}et-number-input .et-number-input-native[data-text-align=center]{text-align:center}et-number-input .et-number-input-native[data-text-align=end]{text-align:end}}\n"], dependencies: [{ kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
12269
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: NumberInputComponent, isStandalone: true, selector: "et-number-input", inputs: { stepper: { classPropertyName: "stepper", publicName: "stepper", isSignal: true, isRequired: false, transformFunction: null }, incrementLabel: { classPropertyName: "incrementLabel", publicName: "incrementLabel", isSignal: true, isRequired: false, transformFunction: null }, decrementLabel: { classPropertyName: "decrementLabel", publicName: "decrementLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "numberInputDir.activate()" }, properties: { "attr.data-stepper": "stepper() || null" }, classAttribute: "et-number-input" }, providers: [provideIcons(MINUS_ICON, PLUS_ICON)], viewQueries: [{ propertyName: "nativeInput", first: true, predicate: ["nativeInput"], descendants: true, isSignal: true }], hostDirectives: [{ directive: NumberInputDirective, inputs: ["min", "min", "max", "max", "step", "step", "placeholder", "placeholder", "autocomplete", "autocomplete", "textAlign", "textAlign", "value", "value", "disabled", "disabled", "readonly", "readonly", "hidden", "hidden", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange"] }, { directive: i1.ColorInteractiveDirective }], ngImport: i0, template: "<input\n #nativeInput\n [value]=\"numberInputDir.value() ?? ''\"\n [disabled]=\"numberInputDir.disabled()\"\n [readOnly]=\"numberInputDir.readonly()\"\n [required]=\"numberInputDir.required()\"\n [placeholder]=\"numberInputDir.placeholder()\"\n [autocomplete]=\"numberInputDir.autocomplete()\"\n [attr.min]=\"numberInputDir.min() ?? null\"\n [attr.max]=\"numberInputDir.max() ?? null\"\n [attr.step]=\"numberInputDir.step() ?? null\"\n [attr.name]=\"numberInputDir.name() || null\"\n [attr.aria-invalid]=\"numberInputDir.shouldDisplayError() || null\"\n [attr.aria-describedby]=\"numberInputDir.describedBy() || null\"\n [attr.aria-labelledby]=\"numberInputDir.labelId() || null\"\n [attr.data-text-align]=\"numberInputDir.textAlign()\"\n (input)=\"syncNativeValue($event)\"\n (focus)=\"numberInputDir.focused.set(true)\"\n (blur)=\"numberInputDir.focused.set(false); numberInputDir.touched.set(true)\"\n class=\"et-number-input-native\"\n type=\"number\"\n/>\n\n@if (stepper()) {\n <div class=\"et-number-input-stepper\">\n <button\n [attr.aria-label]=\"decrementLabel()\"\n [disabled]=\"!numberInputDir.canStepDown()\"\n (pointerdown)=\"startStepRepeat($event, -1)\"\n (pointerup)=\"stopStepRepeat()\"\n (pointercancel)=\"stopStepRepeat()\"\n (lostpointercapture)=\"stopStepRepeat()\"\n class=\"et-number-input-stepper-button\"\n type=\"button\"\n tabindex=\"-1\"\n >\n <i aria-hidden=\"true\" etIcon=\"et-minus\"></i>\n </button>\n <button\n [attr.aria-label]=\"incrementLabel()\"\n [disabled]=\"!numberInputDir.canStepUp()\"\n (pointerdown)=\"startStepRepeat($event, 1)\"\n (pointerup)=\"stopStepRepeat()\"\n (pointercancel)=\"stopStepRepeat()\"\n (lostpointercapture)=\"stopStepRepeat()\"\n class=\"et-number-input-stepper-button\"\n type=\"button\"\n tabindex=\"-1\"\n >\n <i aria-hidden=\"true\" etIcon=\"et-plus\"></i>\n </button>\n </div>\n}\n", styles: ["@layer components{@property --et-number-input-stepper-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}et-number-input{display:block;flex:1;min-inline-size:0;color:inherit}et-number-input[data-stepper]{display:flex;align-items:center;gap:8px}et-number-input .et-number-input-stepper{display:flex;align-items:center;gap:2px;flex:none}et-number-input .et-number-input-stepper-button{display:flex;align-items:center;justify-content:center;flex:none;inline-size:calc(var(--et-number-input-stepper-size) + 8px);block-size:calc(var(--et-number-input-stepper-size) + 8px);padding:0;border:none;border-radius:4px;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;outline:none;touch-action:none}et-number-input .et-number-input-stepper-button .et-icon{inline-size:var(--et-number-input-stepper-size);block-size:var(--et-number-input-stepper-size)}@media(hover:hover){et-number-input .et-number-input-stepper-button:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent);color:var(--et-surface-color-solid, currentColor)}}et-number-input .et-number-input-stepper-button:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 20%,transparent)}et-number-input .et-number-input-stepper-button:disabled{cursor:default;background:transparent;color:inherit;opacity:.4}et-number-input .et-number-input-native{display:block;inline-size:100%;border:none;outline:none;background:transparent;font:inherit;color:inherit;caret-color:var(--et-theme-color-primary-solid, currentColor);padding:0;min-width:0;appearance:textfield}et-number-input .et-number-input-native::-webkit-outer-spin-button,et-number-input .et-number-input-native::-webkit-inner-spin-button{appearance:none;margin:0}et-number-input .et-number-input-native:not(:focus){overflow:hidden;text-overflow:ellipsis}et-number-input .et-number-input-native::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-number-input .et-number-input-native[data-text-align=start]{text-align:start}et-number-input .et-number-input-native[data-text-align=center]{text-align:center}et-number-input .et-number-input-native[data-text-align=end]{text-align:end}}\n"], dependencies: [{ kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
12270
12270
  }
12271
12271
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NumberInputComponent, decorators: [{
12272
12272
  type: Component,
@@ -12296,7 +12296,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
12296
12296
  class: 'et-number-input',
12297
12297
  '[attr.data-stepper]': 'stepper() || null',
12298
12298
  '(click)': 'numberInputDir.activate()',
12299
- }, template: "<input\n #nativeInput\n [value]=\"numberInputDir.value() ?? ''\"\n [disabled]=\"numberInputDir.disabled()\"\n [readOnly]=\"numberInputDir.readonly()\"\n [required]=\"numberInputDir.required()\"\n [placeholder]=\"numberInputDir.placeholder()\"\n [autocomplete]=\"numberInputDir.autocomplete()\"\n [attr.min]=\"numberInputDir.min() ?? null\"\n [attr.max]=\"numberInputDir.max() ?? null\"\n [attr.step]=\"numberInputDir.step() ?? null\"\n [attr.name]=\"numberInputDir.name() || null\"\n [attr.aria-invalid]=\"numberInputDir.shouldDisplayError() || null\"\n [attr.aria-describedby]=\"numberInputDir.describedBy() || null\"\n [attr.aria-labelledby]=\"numberInputDir.labelId() || null\"\n [attr.data-text-align]=\"numberInputDir.textAlign()\"\n (input)=\"syncNativeValue($event)\"\n (focus)=\"numberInputDir.focused.set(true)\"\n (blur)=\"numberInputDir.focused.set(false); numberInputDir.touched.set(true)\"\n class=\"et-number-input-native\"\n type=\"number\"\n/>\n\n@if (stepper()) {\n <div class=\"et-number-input-stepper\">\n <button\n [attr.aria-label]=\"decrementLabel()\"\n [disabled]=\"!numberInputDir.canStepDown()\"\n (pointerdown)=\"startStepRepeat($event, -1)\"\n (pointerup)=\"stopStepRepeat()\"\n (pointercancel)=\"stopStepRepeat()\"\n (lostpointercapture)=\"stopStepRepeat()\"\n class=\"et-number-input-stepper-button\"\n type=\"button\"\n tabindex=\"-1\"\n >\n <i aria-hidden=\"true\" etIcon=\"et-minus\"></i>\n </button>\n <button\n [attr.aria-label]=\"incrementLabel()\"\n [disabled]=\"!numberInputDir.canStepUp()\"\n (pointerdown)=\"startStepRepeat($event, 1)\"\n (pointerup)=\"stopStepRepeat()\"\n (pointercancel)=\"stopStepRepeat()\"\n (lostpointercapture)=\"stopStepRepeat()\"\n class=\"et-number-input-stepper-button\"\n type=\"button\"\n tabindex=\"-1\"\n >\n <i aria-hidden=\"true\" etIcon=\"et-plus\"></i>\n </button>\n </div>\n}\n", styles: ["@layer components{@property --et-number-input-stepper-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}et-number-input{display:block;flex:1;min-inline-size:0;color:inherit}et-number-input[data-stepper]{display:flex;align-items:center;gap:8px}et-number-input .et-number-input-stepper{display:flex;align-items:center;gap:2px;flex:none}et-number-input .et-number-input-stepper-button{display:flex;align-items:center;justify-content:center;flex:none;inline-size:calc(var(--et-number-input-stepper-size) + 8px);block-size:calc(var(--et-number-input-stepper-size) + 8px);padding:0;border:none;border-radius:4px;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;outline:none;touch-action:none}et-number-input .et-number-input-stepper-button .et-icon{inline-size:var(--et-number-input-stepper-size);block-size:var(--et-number-input-stepper-size)}et-number-input .et-number-input-stepper-button:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent);color:var(--et-surface-color-solid, currentColor)}et-number-input .et-number-input-stepper-button:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 20%,transparent)}et-number-input .et-number-input-stepper-button:disabled{cursor:default;background:transparent;color:inherit;opacity:.4}et-number-input .et-number-input-native{display:block;inline-size:100%;border:none;outline:none;background:transparent;font:inherit;color:inherit;caret-color:var(--et-theme-color-primary-solid, currentColor);padding:0;min-width:0;appearance:textfield}et-number-input .et-number-input-native::-webkit-outer-spin-button,et-number-input .et-number-input-native::-webkit-inner-spin-button{appearance:none;margin:0}et-number-input .et-number-input-native:not(:focus){overflow:hidden;text-overflow:ellipsis}et-number-input .et-number-input-native::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-number-input .et-number-input-native[data-text-align=start]{text-align:start}et-number-input .et-number-input-native[data-text-align=center]{text-align:center}et-number-input .et-number-input-native[data-text-align=end]{text-align:end}}\n"] }]
12299
+ }, template: "<input\n #nativeInput\n [value]=\"numberInputDir.value() ?? ''\"\n [disabled]=\"numberInputDir.disabled()\"\n [readOnly]=\"numberInputDir.readonly()\"\n [required]=\"numberInputDir.required()\"\n [placeholder]=\"numberInputDir.placeholder()\"\n [autocomplete]=\"numberInputDir.autocomplete()\"\n [attr.min]=\"numberInputDir.min() ?? null\"\n [attr.max]=\"numberInputDir.max() ?? null\"\n [attr.step]=\"numberInputDir.step() ?? null\"\n [attr.name]=\"numberInputDir.name() || null\"\n [attr.aria-invalid]=\"numberInputDir.shouldDisplayError() || null\"\n [attr.aria-describedby]=\"numberInputDir.describedBy() || null\"\n [attr.aria-labelledby]=\"numberInputDir.labelId() || null\"\n [attr.data-text-align]=\"numberInputDir.textAlign()\"\n (input)=\"syncNativeValue($event)\"\n (focus)=\"numberInputDir.focused.set(true)\"\n (blur)=\"numberInputDir.focused.set(false); numberInputDir.touched.set(true)\"\n class=\"et-number-input-native\"\n type=\"number\"\n/>\n\n@if (stepper()) {\n <div class=\"et-number-input-stepper\">\n <button\n [attr.aria-label]=\"decrementLabel()\"\n [disabled]=\"!numberInputDir.canStepDown()\"\n (pointerdown)=\"startStepRepeat($event, -1)\"\n (pointerup)=\"stopStepRepeat()\"\n (pointercancel)=\"stopStepRepeat()\"\n (lostpointercapture)=\"stopStepRepeat()\"\n class=\"et-number-input-stepper-button\"\n type=\"button\"\n tabindex=\"-1\"\n >\n <i aria-hidden=\"true\" etIcon=\"et-minus\"></i>\n </button>\n <button\n [attr.aria-label]=\"incrementLabel()\"\n [disabled]=\"!numberInputDir.canStepUp()\"\n (pointerdown)=\"startStepRepeat($event, 1)\"\n (pointerup)=\"stopStepRepeat()\"\n (pointercancel)=\"stopStepRepeat()\"\n (lostpointercapture)=\"stopStepRepeat()\"\n class=\"et-number-input-stepper-button\"\n type=\"button\"\n tabindex=\"-1\"\n >\n <i aria-hidden=\"true\" etIcon=\"et-plus\"></i>\n </button>\n </div>\n}\n", styles: ["@layer components{@property --et-number-input-stepper-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}et-number-input{display:block;flex:1;min-inline-size:0;color:inherit}et-number-input[data-stepper]{display:flex;align-items:center;gap:8px}et-number-input .et-number-input-stepper{display:flex;align-items:center;gap:2px;flex:none}et-number-input .et-number-input-stepper-button{display:flex;align-items:center;justify-content:center;flex:none;inline-size:calc(var(--et-number-input-stepper-size) + 8px);block-size:calc(var(--et-number-input-stepper-size) + 8px);padding:0;border:none;border-radius:4px;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;outline:none;touch-action:none}et-number-input .et-number-input-stepper-button .et-icon{inline-size:var(--et-number-input-stepper-size);block-size:var(--et-number-input-stepper-size)}@media(hover:hover){et-number-input .et-number-input-stepper-button:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent);color:var(--et-surface-color-solid, currentColor)}}et-number-input .et-number-input-stepper-button:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 20%,transparent)}et-number-input .et-number-input-stepper-button:disabled{cursor:default;background:transparent;color:inherit;opacity:.4}et-number-input .et-number-input-native{display:block;inline-size:100%;border:none;outline:none;background:transparent;font:inherit;color:inherit;caret-color:var(--et-theme-color-primary-solid, currentColor);padding:0;min-width:0;appearance:textfield}et-number-input .et-number-input-native::-webkit-outer-spin-button,et-number-input .et-number-input-native::-webkit-inner-spin-button{appearance:none;margin:0}et-number-input .et-number-input-native:not(:focus){overflow:hidden;text-overflow:ellipsis}et-number-input .et-number-input-native::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-number-input .et-number-input-native[data-text-align=start]{text-align:start}et-number-input .et-number-input-native[data-text-align=center]{text-align:center}et-number-input .et-number-input-native[data-text-align=end]{text-align:end}}\n"] }]
12300
12300
  }], ctorParameters: () => [], propDecorators: { stepper: [{ type: i0.Input, args: [{ isSignal: true, alias: "stepper", required: false }] }], incrementLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "incrementLabel", required: false }] }], decrementLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "decrementLabel", required: false }] }], nativeInput: [{ type: i0.ViewChild, args: ['nativeInput', { isSignal: true }] }] } });
12301
12301
 
12302
12302
  class PasswordInputComponent {
@@ -12332,7 +12332,7 @@ class PasswordInputComponent {
12332
12332
  this.passwordDir.value.set(event.target.value);
12333
12333
  }
12334
12334
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: PasswordInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
12335
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: PasswordInputComponent, isStandalone: true, selector: "et-password-input", inputs: { revealable: { classPropertyName: "revealable", publicName: "revealable", isSignal: true, isRequired: false, transformFunction: null }, revealLabel: { classPropertyName: "revealLabel", publicName: "revealLabel", isSignal: true, isRequired: false, transformFunction: null }, hideLabel: { classPropertyName: "hideLabel", publicName: "hideLabel", isSignal: true, isRequired: false, transformFunction: null }, capsLockWarning: { classPropertyName: "capsLockWarning", publicName: "capsLockWarning", isSignal: true, isRequired: false, transformFunction: null }, capsLockLabel: { classPropertyName: "capsLockLabel", publicName: "capsLockLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "passwordDir.activate()" }, classAttribute: "et-password-input" }, providers: [provideIcons(EYE_ICON, EYE_SLASH_ICON, TRIANGLE_EXCLAMATION_ICON)], viewQueries: [{ propertyName: "nativeInput", first: true, predicate: ["nativeInput"], descendants: true, isSignal: true }], hostDirectives: [{ directive: PasswordInputDirective, inputs: ["placeholder", "placeholder", "autocomplete", "autocomplete", "value", "value", "revealed", "revealed", "disabled", "disabled", "readonly", "readonly", "hidden", "hidden", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange", "revealedChange", "revealedChange"] }, { directive: i1.ColorInteractiveDirective }], ngImport: i0, template: "<input\n #nativeInput\n [type]=\"passwordDir.inputType()\"\n [value]=\"passwordDir.value()\"\n [disabled]=\"passwordDir.disabled()\"\n [readOnly]=\"passwordDir.readonly()\"\n [required]=\"passwordDir.required()\"\n [placeholder]=\"passwordDir.placeholder()\"\n [autocomplete]=\"passwordDir.autocomplete()\"\n [attr.name]=\"passwordDir.name() || null\"\n [attr.aria-invalid]=\"passwordDir.shouldDisplayError() || null\"\n [attr.aria-describedby]=\"passwordDir.describedBy() || null\"\n [attr.aria-labelledby]=\"passwordDir.labelId() || null\"\n (input)=\"syncNativeValue($event)\"\n (keydown)=\"passwordDir.syncCapsLock($event)\"\n (keyup)=\"passwordDir.syncCapsLock($event)\"\n (mousedown)=\"passwordDir.syncCapsLock($event)\"\n (focus)=\"passwordDir.focused.set(true)\"\n (blur)=\"passwordDir.focused.set(false); passwordDir.touched.set(true)\"\n class=\"et-password-input-native\"\n/>\n\n@if (showCapsLockWarning()) {\n <span class=\"et-password-input-caps-warning\" role=\"status\">\n <i aria-hidden=\"true\" etIcon=\"et-triangle-exclamation\"></i>\n <span class=\"et-password-input-caps-warning-text\">{{ capsLockLabel() }}</span>\n </span>\n}\n\n@if (revealable()) {\n <button\n [attr.aria-label]=\"passwordDir.revealed() ? hideLabel() : revealLabel()\"\n [attr.aria-pressed]=\"passwordDir.revealed()\"\n [disabled]=\"passwordDir.disabled()\"\n (click)=\"passwordDir.toggleRevealed(); $event.stopPropagation()\"\n class=\"et-password-input-reveal\"\n type=\"button\"\n >\n <i [etIcon]=\"passwordDir.revealed() ? 'et-eye-slash' : 'et-eye'\" aria-hidden=\"true\"></i>\n </button>\n}\n", styles: ["@layer components{@property --et-password-input-reveal-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}et-password-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-password-input .et-password-input-native{display:block;flex:1;inline-size:100%;border:none;outline:none;background:transparent;font:inherit;color:inherit;caret-color:var(--et-theme-color-primary-solid, currentColor);padding:0;min-width:0}et-password-input .et-password-input-native:not(:focus){overflow:hidden;text-overflow:ellipsis}et-password-input .et-password-input-native::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-password-input .et-password-input-caps-warning{display:flex;align-items:center;flex:none;inline-size:var(--et-password-input-reveal-size);block-size:var(--et-password-input-reveal-size);color:var(--et-surface-color-muted-solid, currentColor)}et-password-input .et-password-input-caps-warning .et-icon{inline-size:100%;block-size:100%}et-password-input .et-password-input-caps-warning-text{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}et-password-input .et-password-input-reveal{display:flex;align-items:center;justify-content:center;flex:none;inline-size:calc(var(--et-password-input-reveal-size) + 8px);block-size:calc(var(--et-password-input-reveal-size) + 8px);padding:0;border:none;border-radius:4px;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;outline:none}et-password-input .et-password-input-reveal .et-icon{inline-size:var(--et-password-input-reveal-size);block-size:var(--et-password-input-reveal-size)}et-password-input .et-password-input-reveal:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent);color:var(--et-surface-color-solid, currentColor)}et-password-input .et-password-input-reveal:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:1px}et-password-input .et-password-input-reveal:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 20%,transparent)}et-password-input .et-password-input-reveal:disabled{cursor:default;background:transparent;color:inherit}}\n"], dependencies: [{ kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
12335
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: PasswordInputComponent, isStandalone: true, selector: "et-password-input", inputs: { revealable: { classPropertyName: "revealable", publicName: "revealable", isSignal: true, isRequired: false, transformFunction: null }, revealLabel: { classPropertyName: "revealLabel", publicName: "revealLabel", isSignal: true, isRequired: false, transformFunction: null }, hideLabel: { classPropertyName: "hideLabel", publicName: "hideLabel", isSignal: true, isRequired: false, transformFunction: null }, capsLockWarning: { classPropertyName: "capsLockWarning", publicName: "capsLockWarning", isSignal: true, isRequired: false, transformFunction: null }, capsLockLabel: { classPropertyName: "capsLockLabel", publicName: "capsLockLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "passwordDir.activate()" }, classAttribute: "et-password-input" }, providers: [provideIcons(EYE_ICON, EYE_SLASH_ICON, TRIANGLE_EXCLAMATION_ICON)], viewQueries: [{ propertyName: "nativeInput", first: true, predicate: ["nativeInput"], descendants: true, isSignal: true }], hostDirectives: [{ directive: PasswordInputDirective, inputs: ["placeholder", "placeholder", "autocomplete", "autocomplete", "value", "value", "revealed", "revealed", "disabled", "disabled", "readonly", "readonly", "hidden", "hidden", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange", "revealedChange", "revealedChange"] }, { directive: i1.ColorInteractiveDirective }], ngImport: i0, template: "<input\n #nativeInput\n [type]=\"passwordDir.inputType()\"\n [value]=\"passwordDir.value()\"\n [disabled]=\"passwordDir.disabled()\"\n [readOnly]=\"passwordDir.readonly()\"\n [required]=\"passwordDir.required()\"\n [placeholder]=\"passwordDir.placeholder()\"\n [autocomplete]=\"passwordDir.autocomplete()\"\n [attr.name]=\"passwordDir.name() || null\"\n [attr.aria-invalid]=\"passwordDir.shouldDisplayError() || null\"\n [attr.aria-describedby]=\"passwordDir.describedBy() || null\"\n [attr.aria-labelledby]=\"passwordDir.labelId() || null\"\n (input)=\"syncNativeValue($event)\"\n (keydown)=\"passwordDir.syncCapsLock($event)\"\n (keyup)=\"passwordDir.syncCapsLock($event)\"\n (mousedown)=\"passwordDir.syncCapsLock($event)\"\n (focus)=\"passwordDir.focused.set(true)\"\n (blur)=\"passwordDir.focused.set(false); passwordDir.touched.set(true)\"\n class=\"et-password-input-native\"\n/>\n\n@if (showCapsLockWarning()) {\n <span class=\"et-password-input-caps-warning\" role=\"status\">\n <i aria-hidden=\"true\" etIcon=\"et-triangle-exclamation\"></i>\n <span class=\"et-password-input-caps-warning-text\">{{ capsLockLabel() }}</span>\n </span>\n}\n\n@if (revealable()) {\n <button\n [attr.aria-label]=\"passwordDir.revealed() ? hideLabel() : revealLabel()\"\n [attr.aria-pressed]=\"passwordDir.revealed()\"\n [disabled]=\"passwordDir.disabled()\"\n (click)=\"passwordDir.toggleRevealed(); $event.stopPropagation()\"\n class=\"et-password-input-reveal\"\n type=\"button\"\n >\n <i [etIcon]=\"passwordDir.revealed() ? 'et-eye-slash' : 'et-eye'\" aria-hidden=\"true\"></i>\n </button>\n}\n", styles: ["@layer components{@property --et-password-input-reveal-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}et-password-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-password-input .et-password-input-native{display:block;flex:1;inline-size:100%;border:none;outline:none;background:transparent;font:inherit;color:inherit;caret-color:var(--et-theme-color-primary-solid, currentColor);padding:0;min-width:0}et-password-input .et-password-input-native:not(:focus){overflow:hidden;text-overflow:ellipsis}et-password-input .et-password-input-native::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-password-input .et-password-input-caps-warning{display:flex;align-items:center;flex:none;inline-size:var(--et-password-input-reveal-size);block-size:var(--et-password-input-reveal-size);color:var(--et-surface-color-muted-solid, currentColor)}et-password-input .et-password-input-caps-warning .et-icon{inline-size:100%;block-size:100%}et-password-input .et-password-input-caps-warning-text{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}et-password-input .et-password-input-reveal{display:flex;align-items:center;justify-content:center;flex:none;inline-size:calc(var(--et-password-input-reveal-size) + 8px);block-size:calc(var(--et-password-input-reveal-size) + 8px);padding:0;border:none;border-radius:4px;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;outline:none}et-password-input .et-password-input-reveal .et-icon{inline-size:var(--et-password-input-reveal-size);block-size:var(--et-password-input-reveal-size)}@media(hover:hover){et-password-input .et-password-input-reveal:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent);color:var(--et-surface-color-solid, currentColor)}}et-password-input .et-password-input-reveal:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:1px}et-password-input .et-password-input-reveal:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 20%,transparent)}et-password-input .et-password-input-reveal:disabled{cursor:default;background:transparent;color:inherit}}\n"], dependencies: [{ kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
12336
12336
  }
12337
12337
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: PasswordInputComponent, decorators: [{
12338
12338
  type: Component,
@@ -12358,7 +12358,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
12358
12358
  ], host: {
12359
12359
  class: 'et-password-input',
12360
12360
  '(click)': 'passwordDir.activate()',
12361
- }, template: "<input\n #nativeInput\n [type]=\"passwordDir.inputType()\"\n [value]=\"passwordDir.value()\"\n [disabled]=\"passwordDir.disabled()\"\n [readOnly]=\"passwordDir.readonly()\"\n [required]=\"passwordDir.required()\"\n [placeholder]=\"passwordDir.placeholder()\"\n [autocomplete]=\"passwordDir.autocomplete()\"\n [attr.name]=\"passwordDir.name() || null\"\n [attr.aria-invalid]=\"passwordDir.shouldDisplayError() || null\"\n [attr.aria-describedby]=\"passwordDir.describedBy() || null\"\n [attr.aria-labelledby]=\"passwordDir.labelId() || null\"\n (input)=\"syncNativeValue($event)\"\n (keydown)=\"passwordDir.syncCapsLock($event)\"\n (keyup)=\"passwordDir.syncCapsLock($event)\"\n (mousedown)=\"passwordDir.syncCapsLock($event)\"\n (focus)=\"passwordDir.focused.set(true)\"\n (blur)=\"passwordDir.focused.set(false); passwordDir.touched.set(true)\"\n class=\"et-password-input-native\"\n/>\n\n@if (showCapsLockWarning()) {\n <span class=\"et-password-input-caps-warning\" role=\"status\">\n <i aria-hidden=\"true\" etIcon=\"et-triangle-exclamation\"></i>\n <span class=\"et-password-input-caps-warning-text\">{{ capsLockLabel() }}</span>\n </span>\n}\n\n@if (revealable()) {\n <button\n [attr.aria-label]=\"passwordDir.revealed() ? hideLabel() : revealLabel()\"\n [attr.aria-pressed]=\"passwordDir.revealed()\"\n [disabled]=\"passwordDir.disabled()\"\n (click)=\"passwordDir.toggleRevealed(); $event.stopPropagation()\"\n class=\"et-password-input-reveal\"\n type=\"button\"\n >\n <i [etIcon]=\"passwordDir.revealed() ? 'et-eye-slash' : 'et-eye'\" aria-hidden=\"true\"></i>\n </button>\n}\n", styles: ["@layer components{@property --et-password-input-reveal-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}et-password-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-password-input .et-password-input-native{display:block;flex:1;inline-size:100%;border:none;outline:none;background:transparent;font:inherit;color:inherit;caret-color:var(--et-theme-color-primary-solid, currentColor);padding:0;min-width:0}et-password-input .et-password-input-native:not(:focus){overflow:hidden;text-overflow:ellipsis}et-password-input .et-password-input-native::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-password-input .et-password-input-caps-warning{display:flex;align-items:center;flex:none;inline-size:var(--et-password-input-reveal-size);block-size:var(--et-password-input-reveal-size);color:var(--et-surface-color-muted-solid, currentColor)}et-password-input .et-password-input-caps-warning .et-icon{inline-size:100%;block-size:100%}et-password-input .et-password-input-caps-warning-text{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}et-password-input .et-password-input-reveal{display:flex;align-items:center;justify-content:center;flex:none;inline-size:calc(var(--et-password-input-reveal-size) + 8px);block-size:calc(var(--et-password-input-reveal-size) + 8px);padding:0;border:none;border-radius:4px;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;outline:none}et-password-input .et-password-input-reveal .et-icon{inline-size:var(--et-password-input-reveal-size);block-size:var(--et-password-input-reveal-size)}et-password-input .et-password-input-reveal:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent);color:var(--et-surface-color-solid, currentColor)}et-password-input .et-password-input-reveal:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:1px}et-password-input .et-password-input-reveal:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 20%,transparent)}et-password-input .et-password-input-reveal:disabled{cursor:default;background:transparent;color:inherit}}\n"] }]
12361
+ }, template: "<input\n #nativeInput\n [type]=\"passwordDir.inputType()\"\n [value]=\"passwordDir.value()\"\n [disabled]=\"passwordDir.disabled()\"\n [readOnly]=\"passwordDir.readonly()\"\n [required]=\"passwordDir.required()\"\n [placeholder]=\"passwordDir.placeholder()\"\n [autocomplete]=\"passwordDir.autocomplete()\"\n [attr.name]=\"passwordDir.name() || null\"\n [attr.aria-invalid]=\"passwordDir.shouldDisplayError() || null\"\n [attr.aria-describedby]=\"passwordDir.describedBy() || null\"\n [attr.aria-labelledby]=\"passwordDir.labelId() || null\"\n (input)=\"syncNativeValue($event)\"\n (keydown)=\"passwordDir.syncCapsLock($event)\"\n (keyup)=\"passwordDir.syncCapsLock($event)\"\n (mousedown)=\"passwordDir.syncCapsLock($event)\"\n (focus)=\"passwordDir.focused.set(true)\"\n (blur)=\"passwordDir.focused.set(false); passwordDir.touched.set(true)\"\n class=\"et-password-input-native\"\n/>\n\n@if (showCapsLockWarning()) {\n <span class=\"et-password-input-caps-warning\" role=\"status\">\n <i aria-hidden=\"true\" etIcon=\"et-triangle-exclamation\"></i>\n <span class=\"et-password-input-caps-warning-text\">{{ capsLockLabel() }}</span>\n </span>\n}\n\n@if (revealable()) {\n <button\n [attr.aria-label]=\"passwordDir.revealed() ? hideLabel() : revealLabel()\"\n [attr.aria-pressed]=\"passwordDir.revealed()\"\n [disabled]=\"passwordDir.disabled()\"\n (click)=\"passwordDir.toggleRevealed(); $event.stopPropagation()\"\n class=\"et-password-input-reveal\"\n type=\"button\"\n >\n <i [etIcon]=\"passwordDir.revealed() ? 'et-eye-slash' : 'et-eye'\" aria-hidden=\"true\"></i>\n </button>\n}\n", styles: ["@layer components{@property --et-password-input-reveal-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}et-password-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-password-input .et-password-input-native{display:block;flex:1;inline-size:100%;border:none;outline:none;background:transparent;font:inherit;color:inherit;caret-color:var(--et-theme-color-primary-solid, currentColor);padding:0;min-width:0}et-password-input .et-password-input-native:not(:focus){overflow:hidden;text-overflow:ellipsis}et-password-input .et-password-input-native::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-password-input .et-password-input-caps-warning{display:flex;align-items:center;flex:none;inline-size:var(--et-password-input-reveal-size);block-size:var(--et-password-input-reveal-size);color:var(--et-surface-color-muted-solid, currentColor)}et-password-input .et-password-input-caps-warning .et-icon{inline-size:100%;block-size:100%}et-password-input .et-password-input-caps-warning-text{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}et-password-input .et-password-input-reveal{display:flex;align-items:center;justify-content:center;flex:none;inline-size:calc(var(--et-password-input-reveal-size) + 8px);block-size:calc(var(--et-password-input-reveal-size) + 8px);padding:0;border:none;border-radius:4px;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);cursor:pointer;outline:none}et-password-input .et-password-input-reveal .et-icon{inline-size:var(--et-password-input-reveal-size);block-size:var(--et-password-input-reveal-size)}@media(hover:hover){et-password-input .et-password-input-reveal:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 12%,transparent);color:var(--et-surface-color-solid, currentColor)}}et-password-input .et-password-input-reveal:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:1px}et-password-input .et-password-input-reveal:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 20%,transparent)}et-password-input .et-password-input-reveal:disabled{cursor:default;background:transparent;color:inherit}}\n"] }]
12362
12362
  }], ctorParameters: () => [], propDecorators: { revealable: [{ type: i0.Input, args: [{ isSignal: true, alias: "revealable", required: false }] }], revealLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "revealLabel", required: false }] }], hideLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideLabel", required: false }] }], capsLockWarning: [{ type: i0.Input, args: [{ isSignal: true, alias: "capsLockWarning", required: false }] }], capsLockLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "capsLockLabel", required: false }] }], nativeInput: [{ type: i0.ViewChild, args: ['nativeInput', { isSignal: true }] }] } });
12363
12363
 
12364
12364
  const INPUT_IMPORTS = [InputComponent, InputDirective];
@@ -17334,13 +17334,13 @@ class MenuComponent {
17334
17334
  });
17335
17335
  }
17336
17336
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: MenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
17337
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: MenuComponent, isStandalone: true, selector: "et-menu", host: { classAttribute: "et-menu" }, viewQueries: [{ propertyName: "headerElement", first: true, predicate: ["menuHeader"], descendants: true, isSignal: true }, { propertyName: "bodyElement", first: true, predicate: ["menuBody"], descendants: true, isSignal: true }], hostDirectives: [{ directive: MenuPanelDirective }, { directive: i1.ProvideColorDirective }, { directive: i1.AutoSurfaceDirective }], ngImport: i0, template: "<div #menuHeader class=\"et-menu-header\">\n <div class=\"et-menu-search-field\">\n <ng-content select=\"input[etMenuSearch]\" />\n\n @if (searchLoading()) {\n <et-spinner class=\"et-menu-search-spinner\" diameter=\"16\" />\n }\n </div>\n\n @if (searchError(); as error) {\n <p [id]=\"searchErrorId\" [etProvideColor]=\"errorColorTheme\" class=\"et-menu-search-error\" role=\"alert\">\n {{ error }}\n </p>\n }\n</div>\n\n<div #menuBody class=\"et-menu-body\">\n <ng-content />\n</div>\n", styles: ["@layer components{@property --et-menu-min-width{syntax: \"<length>\"; inherits: false; initial-value: 180px;}@property --et-menu-max-height{syntax: \"<length-percentage>\"; inherits: false; initial-value: 40vh;}@property --et-menu-padding-block{syntax: \"<length>\"; inherits: false; initial-value: 6px;}@property --et-menu-padding-inline{syntax: \"<length>\"; inherits: false; initial-value: 6px;}@property --et-menu-item-height{syntax: \"<length>\"; inherits: true; initial-value: 36px;}@property --et-menu-item-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-menu-item-gap{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-menu-item-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-menu-item-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-menu-item-icon-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}@property --et-menu-separator-margin-block{syntax: \"<length>\"; inherits: false; initial-value: 6px;}@property --et-menu-group-label-font-size{syntax: \"<length>\"; inherits: false; initial-value: 12px;}@property --et-menu-search-height{syntax: \"<length>\"; inherits: false; initial-value: 36px;}.et-overlay.et-overlay--menu{overflow:visible;background:transparent;box-shadow:none}.et-menu{--_et-menu-background: var(--et-surface-background-solid, var(--et-surface-2, rgb(32 32 32)));--_et-menu-color: var(--et-surface-color-solid, var(--et-color-main-contrast, rgb(244 244 245)));--_et-menu-border: var(--et-surface-border-solid, rgb(255 255 255 / .1));--_et-menu-shadow: 0 10px 24px rgb(0 0 0 / .16);--_et-menu-radius: 10px;--_et-menu-item-active-background: color-mix( in srgb, var(--et-surface-interaction-solid, rgb(255 255 255)) 12%, transparent );--_et-menu-item-pressed-background: color-mix( in srgb, var(--et-surface-interaction-solid, rgb(255 255 255)) 20%, transparent );--_et-menu-muted-color: var(--et-surface-color-muted-solid, rgb(255 255 255 / .55));--_et-menu-separator-color: var(--et-surface-border-solid, rgb(255 255 255 / .1));display:block;min-inline-size:var(--et-menu-min-width);max-inline-size:min(320px,calc(100vw - 24px));border-radius:var(--_et-menu-radius);border:1px solid var(--_et-menu-border);background:var(--_et-menu-background);color:var(--_et-menu-color);font-family:var(--et-font-family, inherit);font-size:var(--et-menu-item-font-size);box-shadow:var(--_et-menu-shadow);outline:none}.et-menu.et-menu--resizing{overflow:clip}.et-menu .et-menu-header{padding:var(--et-menu-padding-block) var(--et-menu-padding-inline) 0;contain:inline-size}.et-menu .et-menu-header:not(:has(input[etmenusearch])){display:none}.et-menu .et-menu-header .et-menu-search-field{position:relative}.et-menu .et-menu-header .et-menu-search-field:has(.et-menu-search-spinner) input[etmenusearch]{padding-inline-end:calc(var(--et-menu-item-padding-inline) + 22px)}.et-menu .et-menu-header .et-menu-search-spinner{position:absolute;inset-block-start:50%;inset-inline-end:10px;translate:0 -50%;color:var(--_et-menu-muted-color)}.et-menu .et-menu-header .et-menu-search-error{margin:6px 2px 0;font-size:12px;color:var(--et-theme-color-primary-solid, rgb(248 113 113))}.et-menu .et-menu-header input[etmenusearch]{inline-size:100%;block-size:var(--et-menu-search-height);padding-inline:var(--et-menu-item-padding-inline);border-radius:var(--et-menu-item-border-radius);border:1px solid var(--_et-menu-border);background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 6%,transparent);color:inherit;font:inherit;outline:none;box-sizing:border-box;transition:border-color .12s ease,background .12s ease}.et-menu .et-menu-header input[etmenusearch]:focus-visible{border-color:var(--et-theme-color-primary-solid, rgb(255 255 255 / .3))}.et-menu .et-menu-header input[etmenusearch]::placeholder{color:var(--_et-menu-muted-color)}.et-menu .et-menu-body{max-block-size:var(--et-menu-max-height, var(--et-overlay-max-height));padding:var(--et-menu-padding-block) var(--et-menu-padding-inline);overflow-y:auto;overscroll-behavior:contain}.et-menu .et-menu-group{display:block}.et-menu .et-menu-item{display:flex;align-items:center;gap:var(--et-menu-item-gap);inline-size:100%;min-block-size:var(--et-menu-item-height);padding-inline:var(--et-menu-item-padding-inline);border:none;border-radius:var(--et-menu-item-border-radius);background:transparent;color:inherit;font:inherit;text-align:start;text-decoration:none;cursor:pointer;outline:none;box-sizing:border-box;transition:background .12s ease,color .12s ease,opacity .12s ease}.et-menu .et-menu-item[data-active]:where(:hover,:focus-visible),.et-menu .et-menu-item[data-menu-open]{background:var(--_et-menu-item-active-background)}.et-menu .et-menu-item:active:not([aria-disabled=true]){background:var(--_et-menu-item-pressed-background)}.et-menu .et-menu-item[aria-disabled=true]{opacity:.4;cursor:default}.et-menu .et-menu-item[data-variant=destructive]{color:var(--et-theme-color-primary-solid, rgb(248 113 113))}.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-enter-from,.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-leave-to{opacity:0}.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-enter-active{transition:transform .14s ease,opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-leave-active{transition:transform .1s ease,opacity .1s ease}.et-overlay--menu[data-overlay-placement^=top].et-animation-enter-from,.et-overlay--menu[data-overlay-placement^=top].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(.3rem)!important}.et-overlay--menu[data-overlay-placement^=bottom].et-animation-enter-from,.et-overlay--menu[data-overlay-placement^=bottom].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(-.3rem)!important}.et-overlay--menu[data-overlay-placement^=right].et-animation-enter-from,.et-overlay--menu[data-overlay-placement^=right].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translate(-.3rem)!important}.et-overlay--menu[data-overlay-placement^=left].et-animation-enter-from,.et-overlay--menu[data-overlay-placement^=left].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translate(.3rem)!important}@media(prefers-reduced-motion:reduce){.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-enter-active,.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-leave-active{transition-duration:0ms}.et-overlay--menu[data-overlay-placement].et-animation-enter-from,.et-overlay--menu[data-overlay-placement].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0)!important}}}\n"], dependencies: [{ kind: "directive", type: ProvideColorDirective, selector: "[etProvideColor]", inputs: ["etProvideColor"] }, { kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }], encapsulation: i0.ViewEncapsulation.None }); }
17337
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: MenuComponent, isStandalone: true, selector: "et-menu", host: { classAttribute: "et-menu" }, viewQueries: [{ propertyName: "headerElement", first: true, predicate: ["menuHeader"], descendants: true, isSignal: true }, { propertyName: "bodyElement", first: true, predicate: ["menuBody"], descendants: true, isSignal: true }], hostDirectives: [{ directive: MenuPanelDirective }, { directive: i1.ProvideColorDirective }, { directive: i1.AutoSurfaceDirective }], ngImport: i0, template: "<div #menuHeader class=\"et-menu-header\">\n <div class=\"et-menu-search-field\">\n <ng-content select=\"input[etMenuSearch]\" />\n\n @if (searchLoading()) {\n <et-spinner class=\"et-menu-search-spinner\" diameter=\"16\" />\n }\n </div>\n\n @if (searchError(); as error) {\n <p [id]=\"searchErrorId\" [etProvideColor]=\"errorColorTheme\" class=\"et-menu-search-error\" role=\"alert\">\n {{ error }}\n </p>\n }\n</div>\n\n<div #menuBody class=\"et-menu-body\">\n <ng-content />\n</div>\n", styles: ["@layer components{@property --et-menu-min-width{syntax: \"<length>\"; inherits: false; initial-value: 180px;}@property --et-menu-max-height{syntax: \"<length-percentage>\"; inherits: false; initial-value: 40vh;}@property --et-menu-padding-block{syntax: \"<length>\"; inherits: false; initial-value: 6px;}@property --et-menu-padding-inline{syntax: \"<length>\"; inherits: false; initial-value: 6px;}@property --et-menu-item-height{syntax: \"<length>\"; inherits: true; initial-value: 36px;}@property --et-menu-item-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-menu-item-gap{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-menu-item-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-menu-item-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-menu-item-icon-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}@property --et-menu-separator-margin-block{syntax: \"<length>\"; inherits: false; initial-value: 6px;}@property --et-menu-group-label-font-size{syntax: \"<length>\"; inherits: false; initial-value: 12px;}@property --et-menu-search-height{syntax: \"<length>\"; inherits: false; initial-value: 36px;}.et-overlay.et-overlay--menu{overflow:visible;background:transparent;box-shadow:none}.et-menu{--_et-menu-background: var(--et-surface-background-solid, var(--et-surface-2, rgb(32 32 32)));--_et-menu-color: var(--et-surface-color-solid, var(--et-color-main-contrast, rgb(244 244 245)));--_et-menu-border: var(--et-surface-border-solid, rgb(255 255 255 / .1));--_et-menu-shadow: 0 10px 24px rgb(0 0 0 / .16);--_et-menu-radius: 10px;--_et-menu-item-active-background: color-mix( in srgb, var(--et-surface-interaction-solid, rgb(255 255 255)) 12%, transparent );--_et-menu-item-pressed-background: color-mix( in srgb, var(--et-surface-interaction-solid, rgb(255 255 255)) 20%, transparent );--_et-menu-muted-color: var(--et-surface-color-muted-solid, rgb(255 255 255 / .55));--_et-menu-separator-color: var(--et-surface-border-solid, rgb(255 255 255 / .1));display:block;min-inline-size:var(--et-menu-min-width);max-inline-size:min(320px,calc(100vw - 24px));border-radius:var(--_et-menu-radius);border:1px solid var(--_et-menu-border);background:var(--_et-menu-background);color:var(--_et-menu-color);font-family:var(--et-font-family, inherit);font-size:var(--et-menu-item-font-size);box-shadow:var(--_et-menu-shadow);outline:none}.et-menu.et-menu--resizing{overflow:clip}.et-menu .et-menu-header{padding:var(--et-menu-padding-block) var(--et-menu-padding-inline) 0;contain:inline-size}.et-menu .et-menu-header:not(:has(input[etmenusearch])){display:none}.et-menu .et-menu-header .et-menu-search-field{position:relative}.et-menu .et-menu-header .et-menu-search-field:has(.et-menu-search-spinner) input[etmenusearch]{padding-inline-end:calc(var(--et-menu-item-padding-inline) + 22px)}.et-menu .et-menu-header .et-menu-search-spinner{position:absolute;inset-block-start:50%;inset-inline-end:10px;translate:0 -50%;color:var(--_et-menu-muted-color)}.et-menu .et-menu-header .et-menu-search-error{margin:6px 2px 0;font-size:12px;color:var(--et-theme-color-primary-solid, rgb(248 113 113))}.et-menu .et-menu-header input[etmenusearch]{inline-size:100%;block-size:var(--et-menu-search-height);padding-inline:var(--et-menu-item-padding-inline);border-radius:var(--et-menu-item-border-radius);border:1px solid var(--_et-menu-border);background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 6%,transparent);color:inherit;font:inherit;outline:none;box-sizing:border-box;transition:border-color .12s ease,background .12s ease}.et-menu .et-menu-header input[etmenusearch]:focus-visible{border-color:var(--et-theme-color-primary-solid, rgb(255 255 255 / .3))}.et-menu .et-menu-header input[etmenusearch]::placeholder{color:var(--_et-menu-muted-color)}.et-menu .et-menu-body{max-block-size:var(--et-menu-max-height, var(--et-overlay-max-height));padding:var(--et-menu-padding-block) var(--et-menu-padding-inline);overflow-y:auto;overscroll-behavior:contain}.et-menu .et-menu-group{display:block}.et-menu .et-menu-item{display:flex;align-items:center;gap:var(--et-menu-item-gap);inline-size:100%;min-block-size:var(--et-menu-item-height);padding-inline:var(--et-menu-item-padding-inline);border:none;border-radius:var(--et-menu-item-border-radius);background:transparent;color:inherit;font:inherit;text-align:start;text-decoration:none;cursor:pointer;outline:none;box-sizing:border-box;transition:background .12s ease,color .12s ease,opacity .12s ease}.et-menu .et-menu-item[data-active]:where(:focus-visible),.et-menu .et-menu-item[data-menu-open]{background:var(--_et-menu-item-active-background)}@media(hover:hover){.et-menu .et-menu-item[data-active]:where(:hover){background:var(--_et-menu-item-active-background)}}.et-menu .et-menu-item:active:not([aria-disabled=true]){background:var(--_et-menu-item-pressed-background)}.et-menu .et-menu-item[aria-disabled=true]{opacity:.4;cursor:default}.et-menu .et-menu-item[data-variant=destructive]{color:var(--et-theme-color-primary-solid, rgb(248 113 113))}.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-enter-from,.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-leave-to{opacity:0}.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-enter-active{transition:transform .14s ease,opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-leave-active{transition:transform .1s ease,opacity .1s ease}.et-overlay--menu[data-overlay-placement^=top].et-animation-enter-from,.et-overlay--menu[data-overlay-placement^=top].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(.3rem)!important}.et-overlay--menu[data-overlay-placement^=bottom].et-animation-enter-from,.et-overlay--menu[data-overlay-placement^=bottom].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(-.3rem)!important}.et-overlay--menu[data-overlay-placement^=right].et-animation-enter-from,.et-overlay--menu[data-overlay-placement^=right].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translate(-.3rem)!important}.et-overlay--menu[data-overlay-placement^=left].et-animation-enter-from,.et-overlay--menu[data-overlay-placement^=left].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translate(.3rem)!important}@media(prefers-reduced-motion:reduce){.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-enter-active,.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-leave-active{transition-duration:0ms}.et-overlay--menu[data-overlay-placement].et-animation-enter-from,.et-overlay--menu[data-overlay-placement].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0)!important}}}\n"], dependencies: [{ kind: "directive", type: ProvideColorDirective, selector: "[etProvideColor]", inputs: ["etProvideColor"] }, { kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }], encapsulation: i0.ViewEncapsulation.None }); }
17338
17338
  }
17339
17339
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: MenuComponent, decorators: [{
17340
17340
  type: Component,
17341
17341
  args: [{ selector: 'et-menu', encapsulation: ViewEncapsulation.None, imports: [ProvideColorDirective, SpinnerComponent], hostDirectives: [MenuPanelDirective, ProvideColorDirective, AutoSurfaceDirective], host: {
17342
17342
  class: 'et-menu',
17343
- }, template: "<div #menuHeader class=\"et-menu-header\">\n <div class=\"et-menu-search-field\">\n <ng-content select=\"input[etMenuSearch]\" />\n\n @if (searchLoading()) {\n <et-spinner class=\"et-menu-search-spinner\" diameter=\"16\" />\n }\n </div>\n\n @if (searchError(); as error) {\n <p [id]=\"searchErrorId\" [etProvideColor]=\"errorColorTheme\" class=\"et-menu-search-error\" role=\"alert\">\n {{ error }}\n </p>\n }\n</div>\n\n<div #menuBody class=\"et-menu-body\">\n <ng-content />\n</div>\n", styles: ["@layer components{@property --et-menu-min-width{syntax: \"<length>\"; inherits: false; initial-value: 180px;}@property --et-menu-max-height{syntax: \"<length-percentage>\"; inherits: false; initial-value: 40vh;}@property --et-menu-padding-block{syntax: \"<length>\"; inherits: false; initial-value: 6px;}@property --et-menu-padding-inline{syntax: \"<length>\"; inherits: false; initial-value: 6px;}@property --et-menu-item-height{syntax: \"<length>\"; inherits: true; initial-value: 36px;}@property --et-menu-item-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-menu-item-gap{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-menu-item-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-menu-item-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-menu-item-icon-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}@property --et-menu-separator-margin-block{syntax: \"<length>\"; inherits: false; initial-value: 6px;}@property --et-menu-group-label-font-size{syntax: \"<length>\"; inherits: false; initial-value: 12px;}@property --et-menu-search-height{syntax: \"<length>\"; inherits: false; initial-value: 36px;}.et-overlay.et-overlay--menu{overflow:visible;background:transparent;box-shadow:none}.et-menu{--_et-menu-background: var(--et-surface-background-solid, var(--et-surface-2, rgb(32 32 32)));--_et-menu-color: var(--et-surface-color-solid, var(--et-color-main-contrast, rgb(244 244 245)));--_et-menu-border: var(--et-surface-border-solid, rgb(255 255 255 / .1));--_et-menu-shadow: 0 10px 24px rgb(0 0 0 / .16);--_et-menu-radius: 10px;--_et-menu-item-active-background: color-mix( in srgb, var(--et-surface-interaction-solid, rgb(255 255 255)) 12%, transparent );--_et-menu-item-pressed-background: color-mix( in srgb, var(--et-surface-interaction-solid, rgb(255 255 255)) 20%, transparent );--_et-menu-muted-color: var(--et-surface-color-muted-solid, rgb(255 255 255 / .55));--_et-menu-separator-color: var(--et-surface-border-solid, rgb(255 255 255 / .1));display:block;min-inline-size:var(--et-menu-min-width);max-inline-size:min(320px,calc(100vw - 24px));border-radius:var(--_et-menu-radius);border:1px solid var(--_et-menu-border);background:var(--_et-menu-background);color:var(--_et-menu-color);font-family:var(--et-font-family, inherit);font-size:var(--et-menu-item-font-size);box-shadow:var(--_et-menu-shadow);outline:none}.et-menu.et-menu--resizing{overflow:clip}.et-menu .et-menu-header{padding:var(--et-menu-padding-block) var(--et-menu-padding-inline) 0;contain:inline-size}.et-menu .et-menu-header:not(:has(input[etmenusearch])){display:none}.et-menu .et-menu-header .et-menu-search-field{position:relative}.et-menu .et-menu-header .et-menu-search-field:has(.et-menu-search-spinner) input[etmenusearch]{padding-inline-end:calc(var(--et-menu-item-padding-inline) + 22px)}.et-menu .et-menu-header .et-menu-search-spinner{position:absolute;inset-block-start:50%;inset-inline-end:10px;translate:0 -50%;color:var(--_et-menu-muted-color)}.et-menu .et-menu-header .et-menu-search-error{margin:6px 2px 0;font-size:12px;color:var(--et-theme-color-primary-solid, rgb(248 113 113))}.et-menu .et-menu-header input[etmenusearch]{inline-size:100%;block-size:var(--et-menu-search-height);padding-inline:var(--et-menu-item-padding-inline);border-radius:var(--et-menu-item-border-radius);border:1px solid var(--_et-menu-border);background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 6%,transparent);color:inherit;font:inherit;outline:none;box-sizing:border-box;transition:border-color .12s ease,background .12s ease}.et-menu .et-menu-header input[etmenusearch]:focus-visible{border-color:var(--et-theme-color-primary-solid, rgb(255 255 255 / .3))}.et-menu .et-menu-header input[etmenusearch]::placeholder{color:var(--_et-menu-muted-color)}.et-menu .et-menu-body{max-block-size:var(--et-menu-max-height, var(--et-overlay-max-height));padding:var(--et-menu-padding-block) var(--et-menu-padding-inline);overflow-y:auto;overscroll-behavior:contain}.et-menu .et-menu-group{display:block}.et-menu .et-menu-item{display:flex;align-items:center;gap:var(--et-menu-item-gap);inline-size:100%;min-block-size:var(--et-menu-item-height);padding-inline:var(--et-menu-item-padding-inline);border:none;border-radius:var(--et-menu-item-border-radius);background:transparent;color:inherit;font:inherit;text-align:start;text-decoration:none;cursor:pointer;outline:none;box-sizing:border-box;transition:background .12s ease,color .12s ease,opacity .12s ease}.et-menu .et-menu-item[data-active]:where(:hover,:focus-visible),.et-menu .et-menu-item[data-menu-open]{background:var(--_et-menu-item-active-background)}.et-menu .et-menu-item:active:not([aria-disabled=true]){background:var(--_et-menu-item-pressed-background)}.et-menu .et-menu-item[aria-disabled=true]{opacity:.4;cursor:default}.et-menu .et-menu-item[data-variant=destructive]{color:var(--et-theme-color-primary-solid, rgb(248 113 113))}.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-enter-from,.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-leave-to{opacity:0}.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-enter-active{transition:transform .14s ease,opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-leave-active{transition:transform .1s ease,opacity .1s ease}.et-overlay--menu[data-overlay-placement^=top].et-animation-enter-from,.et-overlay--menu[data-overlay-placement^=top].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(.3rem)!important}.et-overlay--menu[data-overlay-placement^=bottom].et-animation-enter-from,.et-overlay--menu[data-overlay-placement^=bottom].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(-.3rem)!important}.et-overlay--menu[data-overlay-placement^=right].et-animation-enter-from,.et-overlay--menu[data-overlay-placement^=right].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translate(-.3rem)!important}.et-overlay--menu[data-overlay-placement^=left].et-animation-enter-from,.et-overlay--menu[data-overlay-placement^=left].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translate(.3rem)!important}@media(prefers-reduced-motion:reduce){.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-enter-active,.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-leave-active{transition-duration:0ms}.et-overlay--menu[data-overlay-placement].et-animation-enter-from,.et-overlay--menu[data-overlay-placement].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0)!important}}}\n"] }]
17343
+ }, template: "<div #menuHeader class=\"et-menu-header\">\n <div class=\"et-menu-search-field\">\n <ng-content select=\"input[etMenuSearch]\" />\n\n @if (searchLoading()) {\n <et-spinner class=\"et-menu-search-spinner\" diameter=\"16\" />\n }\n </div>\n\n @if (searchError(); as error) {\n <p [id]=\"searchErrorId\" [etProvideColor]=\"errorColorTheme\" class=\"et-menu-search-error\" role=\"alert\">\n {{ error }}\n </p>\n }\n</div>\n\n<div #menuBody class=\"et-menu-body\">\n <ng-content />\n</div>\n", styles: ["@layer components{@property --et-menu-min-width{syntax: \"<length>\"; inherits: false; initial-value: 180px;}@property --et-menu-max-height{syntax: \"<length-percentage>\"; inherits: false; initial-value: 40vh;}@property --et-menu-padding-block{syntax: \"<length>\"; inherits: false; initial-value: 6px;}@property --et-menu-padding-inline{syntax: \"<length>\"; inherits: false; initial-value: 6px;}@property --et-menu-item-height{syntax: \"<length>\"; inherits: true; initial-value: 36px;}@property --et-menu-item-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-menu-item-gap{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-menu-item-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-menu-item-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-menu-item-icon-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}@property --et-menu-separator-margin-block{syntax: \"<length>\"; inherits: false; initial-value: 6px;}@property --et-menu-group-label-font-size{syntax: \"<length>\"; inherits: false; initial-value: 12px;}@property --et-menu-search-height{syntax: \"<length>\"; inherits: false; initial-value: 36px;}.et-overlay.et-overlay--menu{overflow:visible;background:transparent;box-shadow:none}.et-menu{--_et-menu-background: var(--et-surface-background-solid, var(--et-surface-2, rgb(32 32 32)));--_et-menu-color: var(--et-surface-color-solid, var(--et-color-main-contrast, rgb(244 244 245)));--_et-menu-border: var(--et-surface-border-solid, rgb(255 255 255 / .1));--_et-menu-shadow: 0 10px 24px rgb(0 0 0 / .16);--_et-menu-radius: 10px;--_et-menu-item-active-background: color-mix( in srgb, var(--et-surface-interaction-solid, rgb(255 255 255)) 12%, transparent );--_et-menu-item-pressed-background: color-mix( in srgb, var(--et-surface-interaction-solid, rgb(255 255 255)) 20%, transparent );--_et-menu-muted-color: var(--et-surface-color-muted-solid, rgb(255 255 255 / .55));--_et-menu-separator-color: var(--et-surface-border-solid, rgb(255 255 255 / .1));display:block;min-inline-size:var(--et-menu-min-width);max-inline-size:min(320px,calc(100vw - 24px));border-radius:var(--_et-menu-radius);border:1px solid var(--_et-menu-border);background:var(--_et-menu-background);color:var(--_et-menu-color);font-family:var(--et-font-family, inherit);font-size:var(--et-menu-item-font-size);box-shadow:var(--_et-menu-shadow);outline:none}.et-menu.et-menu--resizing{overflow:clip}.et-menu .et-menu-header{padding:var(--et-menu-padding-block) var(--et-menu-padding-inline) 0;contain:inline-size}.et-menu .et-menu-header:not(:has(input[etmenusearch])){display:none}.et-menu .et-menu-header .et-menu-search-field{position:relative}.et-menu .et-menu-header .et-menu-search-field:has(.et-menu-search-spinner) input[etmenusearch]{padding-inline-end:calc(var(--et-menu-item-padding-inline) + 22px)}.et-menu .et-menu-header .et-menu-search-spinner{position:absolute;inset-block-start:50%;inset-inline-end:10px;translate:0 -50%;color:var(--_et-menu-muted-color)}.et-menu .et-menu-header .et-menu-search-error{margin:6px 2px 0;font-size:12px;color:var(--et-theme-color-primary-solid, rgb(248 113 113))}.et-menu .et-menu-header input[etmenusearch]{inline-size:100%;block-size:var(--et-menu-search-height);padding-inline:var(--et-menu-item-padding-inline);border-radius:var(--et-menu-item-border-radius);border:1px solid var(--_et-menu-border);background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 6%,transparent);color:inherit;font:inherit;outline:none;box-sizing:border-box;transition:border-color .12s ease,background .12s ease}.et-menu .et-menu-header input[etmenusearch]:focus-visible{border-color:var(--et-theme-color-primary-solid, rgb(255 255 255 / .3))}.et-menu .et-menu-header input[etmenusearch]::placeholder{color:var(--_et-menu-muted-color)}.et-menu .et-menu-body{max-block-size:var(--et-menu-max-height, var(--et-overlay-max-height));padding:var(--et-menu-padding-block) var(--et-menu-padding-inline);overflow-y:auto;overscroll-behavior:contain}.et-menu .et-menu-group{display:block}.et-menu .et-menu-item{display:flex;align-items:center;gap:var(--et-menu-item-gap);inline-size:100%;min-block-size:var(--et-menu-item-height);padding-inline:var(--et-menu-item-padding-inline);border:none;border-radius:var(--et-menu-item-border-radius);background:transparent;color:inherit;font:inherit;text-align:start;text-decoration:none;cursor:pointer;outline:none;box-sizing:border-box;transition:background .12s ease,color .12s ease,opacity .12s ease}.et-menu .et-menu-item[data-active]:where(:focus-visible),.et-menu .et-menu-item[data-menu-open]{background:var(--_et-menu-item-active-background)}@media(hover:hover){.et-menu .et-menu-item[data-active]:where(:hover){background:var(--_et-menu-item-active-background)}}.et-menu .et-menu-item:active:not([aria-disabled=true]){background:var(--_et-menu-item-pressed-background)}.et-menu .et-menu-item[aria-disabled=true]{opacity:.4;cursor:default}.et-menu .et-menu-item[data-variant=destructive]{color:var(--et-theme-color-primary-solid, rgb(248 113 113))}.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-enter-from,.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-leave-to{opacity:0}.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-enter-active{transition:transform .14s ease,opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-leave-active{transition:transform .1s ease,opacity .1s ease}.et-overlay--menu[data-overlay-placement^=top].et-animation-enter-from,.et-overlay--menu[data-overlay-placement^=top].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(.3rem)!important}.et-overlay--menu[data-overlay-placement^=bottom].et-animation-enter-from,.et-overlay--menu[data-overlay-placement^=bottom].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(-.3rem)!important}.et-overlay--menu[data-overlay-placement^=right].et-animation-enter-from,.et-overlay--menu[data-overlay-placement^=right].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translate(-.3rem)!important}.et-overlay--menu[data-overlay-placement^=left].et-animation-enter-from,.et-overlay--menu[data-overlay-placement^=left].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translate(.3rem)!important}@media(prefers-reduced-motion:reduce){.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-enter-active,.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-leave-active{transition-duration:0ms}.et-overlay--menu[data-overlay-placement].et-animation-enter-from,.et-overlay--menu[data-overlay-placement].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0)!important}}}\n"] }]
17344
17344
  }], ctorParameters: () => [], propDecorators: { headerElement: [{ type: i0.ViewChild, args: ['menuHeader', { isSignal: true }] }], bodyElement: [{ type: i0.ViewChild, args: ['menuBody', { isSignal: true }] }] } });
17345
17345
 
17346
17346
  const MENU_IMPORTS = [
@@ -18581,11 +18581,11 @@ class MultiLanguageRichTextEditorLanguageToolComponent {
18581
18581
  queueMicrotask(() => this.editor().activate());
18582
18582
  }
18583
18583
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: MultiLanguageRichTextEditorLanguageToolComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
18584
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: MultiLanguageRichTextEditorLanguageToolComponent, isStandalone: true, selector: "et-multi-language-rich-text-editor-language-tool", inputs: { editor: { classPropertyName: "editor", publicName: "editor", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "et-ml-rte-lang-tool" }, providers: [provideIcons(CHECK_ICON)], ngImport: i0, template: "<div [autoFocus]=\"!hasTouchInput()\" etMenu>\n <button\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"'Language: ' + activeLabel()\"\n [class.et-ml-rte-lang-trigger--flagged]=\"missingCount() > 0\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-ml-rte-lang-trigger\"\n etMenuTrigger\n type=\"button\"\n >\n <span class=\"et-ml-rte-lang-trigger-code\">{{ activeCode() }}</span>\n </button>\n\n <ng-template etMenuSurface>\n <et-menu>\n <et-menu-radio-group [value]=\"activeCode()\" (valueChange)=\"select($event)\" (mousedown)=\"$event.preventDefault()\">\n @for (language of languages(); track language.code) {\n <et-menu-radio-item [value]=\"language.code\" [icon]=\"activeIcon(language.code)\" [closeOnActivate]=\"true\">\n <span class=\"et-ml-rte-lang-item\">\n <span class=\"et-ml-rte-lang-item-label\">{{ language.label }}</span>\n <span\n [class.et-ml-rte-lang-dot--filled]=\"isFilled(language.code)\"\n [attr.aria-label]=\"isFilled(language.code) ? 'has content' : 'empty'\"\n class=\"et-ml-rte-lang-dot\"\n ></span>\n </span>\n </et-menu-radio-item>\n }\n </et-menu-radio-group>\n </et-menu>\n </ng-template>\n</div>\n", styles: ["@layer components{@property --et-multi-language-rich-text-editor-badge-size{syntax: \"<length>\"; inherits: true; initial-value: 7px;}@property --et-multi-language-rich-text-editor-dot-size{syntax: \"<length>\"; inherits: true; initial-value: 8px;}.et-ml-rte-lang-tool{display:contents}.et-ml-rte-lang-item{display:flex;flex:1;align-items:center;justify-content:space-between;gap:12px;min-inline-size:0}.et-ml-rte-lang-dot{flex:none;box-sizing:border-box;inline-size:var(--et-multi-language-rich-text-editor-dot-size);block-size:var(--et-multi-language-rich-text-editor-dot-size);border-radius:50%;border:1.5px solid var(--et-surface-color-muted-solid, color-mix(in srgb, currentColor 40%, transparent));background:transparent}.et-ml-rte-lang-dot--filled{border-color:var(--et-theme-color-primary-solid, var(--et-surface-color-solid, currentColor));background:var(--et-theme-color-primary-solid, var(--et-surface-color-solid, currentColor))}.et-ml-rte-lang-trigger{display:inline-flex;position:relative;align-items:center;justify-content:center;inline-size:3.1rem;block-size:3.1rem;border:none;border-radius:var(--et-rich-text-editor-button-radius, 4px);background:transparent;color:inherit;font:inherit;line-height:1;cursor:pointer;appearance:none;transition:background .12s ease}.et-ml-rte-lang-trigger:hover:not(:disabled){background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent)}.et-ml-rte-lang-trigger:focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 16%,transparent)}.et-ml-rte-lang-trigger:active:not(:disabled){background:color-mix(in srgb,var(--et-surface-interaction-solid) 20%,transparent)}.et-ml-rte-lang-trigger:disabled{opacity:.5;cursor:not-allowed}.et-ml-rte-lang-trigger-code{font-size:1.3rem;font-weight:600;text-transform:uppercase}.et-ml-rte-lang-trigger--flagged:after{content:\"\";position:absolute;inset-block-start:4px;inset-inline-end:4px;inline-size:var(--et-multi-language-rich-text-editor-badge-size);block-size:var(--et-multi-language-rich-text-editor-badge-size);border-radius:50%;background:var(--et-theme-color-primary-solid, var(--et-surface-interaction-solid, currentColor))}}\n"], dependencies: [{ kind: "directive", type: MenuDirective, selector: "[etMenu]", inputs: ["placement", "fallbackPlacements", "offset", "viewportPadding", "arrow", "arrowPadding", "autoFocus", "hoverOpen", "hoverOpenDelay", "hoverCloseDelay", "disabled", "open"], outputs: ["openChange"], exportAs: ["etMenu"] }, { kind: "directive", type: MenuTriggerDirective, selector: "[etMenuTrigger]", exportAs: ["etMenuTrigger"] }, { kind: "directive", type: MenuSurfaceDirective, selector: "ng-template[etMenuSurface]", exportAs: ["etMenuSurface"] }, { kind: "component", type: MenuComponent, selector: "et-menu" }, { kind: "component", type: MenuRadioGroupComponent, selector: "et-menu-radio-group" }, { kind: "component", type: MenuRadioItemComponent, selector: "et-menu-radio-item", inputs: ["icon"] }], encapsulation: i0.ViewEncapsulation.None }); }
18584
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: MultiLanguageRichTextEditorLanguageToolComponent, isStandalone: true, selector: "et-multi-language-rich-text-editor-language-tool", inputs: { editor: { classPropertyName: "editor", publicName: "editor", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "et-ml-rte-lang-tool" }, providers: [provideIcons(CHECK_ICON)], ngImport: i0, template: "<div [autoFocus]=\"!hasTouchInput()\" etMenu>\n <button\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"'Language: ' + activeLabel()\"\n [class.et-ml-rte-lang-trigger--flagged]=\"missingCount() > 0\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-ml-rte-lang-trigger\"\n etMenuTrigger\n type=\"button\"\n >\n <span class=\"et-ml-rte-lang-trigger-code\">{{ activeCode() }}</span>\n </button>\n\n <ng-template etMenuSurface>\n <et-menu>\n <et-menu-radio-group [value]=\"activeCode()\" (valueChange)=\"select($event)\" (mousedown)=\"$event.preventDefault()\">\n @for (language of languages(); track language.code) {\n <et-menu-radio-item [value]=\"language.code\" [icon]=\"activeIcon(language.code)\" [closeOnActivate]=\"true\">\n <span class=\"et-ml-rte-lang-item\">\n <span class=\"et-ml-rte-lang-item-label\">{{ language.label }}</span>\n <span\n [class.et-ml-rte-lang-dot--filled]=\"isFilled(language.code)\"\n [attr.aria-label]=\"isFilled(language.code) ? 'has content' : 'empty'\"\n class=\"et-ml-rte-lang-dot\"\n ></span>\n </span>\n </et-menu-radio-item>\n }\n </et-menu-radio-group>\n </et-menu>\n </ng-template>\n</div>\n", styles: ["@layer components{@property --et-multi-language-rich-text-editor-badge-size{syntax: \"<length>\"; inherits: true; initial-value: 7px;}@property --et-multi-language-rich-text-editor-dot-size{syntax: \"<length>\"; inherits: true; initial-value: 8px;}.et-ml-rte-lang-tool{display:contents}.et-ml-rte-lang-item{display:flex;flex:1;align-items:center;justify-content:space-between;gap:12px;min-inline-size:0}.et-ml-rte-lang-dot{flex:none;box-sizing:border-box;inline-size:var(--et-multi-language-rich-text-editor-dot-size);block-size:var(--et-multi-language-rich-text-editor-dot-size);border-radius:50%;border:1.5px solid var(--et-surface-color-muted-solid, color-mix(in srgb, currentColor 40%, transparent));background:transparent}.et-ml-rte-lang-dot--filled{border-color:var(--et-theme-color-primary-solid, var(--et-surface-color-solid, currentColor));background:var(--et-theme-color-primary-solid, var(--et-surface-color-solid, currentColor))}.et-ml-rte-lang-trigger{display:inline-flex;position:relative;align-items:center;justify-content:center;inline-size:3.1rem;block-size:3.1rem;border:none;border-radius:var(--et-rich-text-editor-button-radius, 4px);background:transparent;color:inherit;font:inherit;line-height:1;cursor:pointer;appearance:none;transition:background .12s ease}@media(hover:hover){.et-ml-rte-lang-trigger:hover:not(:disabled){background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent)}}.et-ml-rte-lang-trigger:focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 16%,transparent)}.et-ml-rte-lang-trigger:active:not(:disabled){background:color-mix(in srgb,var(--et-surface-interaction-solid) 20%,transparent)}.et-ml-rte-lang-trigger:disabled{opacity:.5;cursor:not-allowed}.et-ml-rte-lang-trigger-code{font-size:1.3rem;font-weight:600;text-transform:uppercase}.et-ml-rte-lang-trigger--flagged:after{content:\"\";position:absolute;inset-block-start:4px;inset-inline-end:4px;inline-size:var(--et-multi-language-rich-text-editor-badge-size);block-size:var(--et-multi-language-rich-text-editor-badge-size);border-radius:50%;background:var(--et-theme-color-primary-solid, var(--et-surface-interaction-solid, currentColor))}}\n"], dependencies: [{ kind: "directive", type: MenuDirective, selector: "[etMenu]", inputs: ["placement", "fallbackPlacements", "offset", "viewportPadding", "arrow", "arrowPadding", "autoFocus", "hoverOpen", "hoverOpenDelay", "hoverCloseDelay", "disabled", "open"], outputs: ["openChange"], exportAs: ["etMenu"] }, { kind: "directive", type: MenuTriggerDirective, selector: "[etMenuTrigger]", exportAs: ["etMenuTrigger"] }, { kind: "directive", type: MenuSurfaceDirective, selector: "ng-template[etMenuSurface]", exportAs: ["etMenuSurface"] }, { kind: "component", type: MenuComponent, selector: "et-menu" }, { kind: "component", type: MenuRadioGroupComponent, selector: "et-menu-radio-group" }, { kind: "component", type: MenuRadioItemComponent, selector: "et-menu-radio-item", inputs: ["icon"] }], encapsulation: i0.ViewEncapsulation.None }); }
18585
18585
  }
18586
18586
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: MultiLanguageRichTextEditorLanguageToolComponent, decorators: [{
18587
18587
  type: Component,
18588
- args: [{ selector: 'et-multi-language-rich-text-editor-language-tool', encapsulation: ViewEncapsulation.None, imports: [...MENU_IMPORTS], providers: [provideIcons(CHECK_ICON)], host: { class: 'et-ml-rte-lang-tool' }, template: "<div [autoFocus]=\"!hasTouchInput()\" etMenu>\n <button\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"'Language: ' + activeLabel()\"\n [class.et-ml-rte-lang-trigger--flagged]=\"missingCount() > 0\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-ml-rte-lang-trigger\"\n etMenuTrigger\n type=\"button\"\n >\n <span class=\"et-ml-rte-lang-trigger-code\">{{ activeCode() }}</span>\n </button>\n\n <ng-template etMenuSurface>\n <et-menu>\n <et-menu-radio-group [value]=\"activeCode()\" (valueChange)=\"select($event)\" (mousedown)=\"$event.preventDefault()\">\n @for (language of languages(); track language.code) {\n <et-menu-radio-item [value]=\"language.code\" [icon]=\"activeIcon(language.code)\" [closeOnActivate]=\"true\">\n <span class=\"et-ml-rte-lang-item\">\n <span class=\"et-ml-rte-lang-item-label\">{{ language.label }}</span>\n <span\n [class.et-ml-rte-lang-dot--filled]=\"isFilled(language.code)\"\n [attr.aria-label]=\"isFilled(language.code) ? 'has content' : 'empty'\"\n class=\"et-ml-rte-lang-dot\"\n ></span>\n </span>\n </et-menu-radio-item>\n }\n </et-menu-radio-group>\n </et-menu>\n </ng-template>\n</div>\n", styles: ["@layer components{@property --et-multi-language-rich-text-editor-badge-size{syntax: \"<length>\"; inherits: true; initial-value: 7px;}@property --et-multi-language-rich-text-editor-dot-size{syntax: \"<length>\"; inherits: true; initial-value: 8px;}.et-ml-rte-lang-tool{display:contents}.et-ml-rte-lang-item{display:flex;flex:1;align-items:center;justify-content:space-between;gap:12px;min-inline-size:0}.et-ml-rte-lang-dot{flex:none;box-sizing:border-box;inline-size:var(--et-multi-language-rich-text-editor-dot-size);block-size:var(--et-multi-language-rich-text-editor-dot-size);border-radius:50%;border:1.5px solid var(--et-surface-color-muted-solid, color-mix(in srgb, currentColor 40%, transparent));background:transparent}.et-ml-rte-lang-dot--filled{border-color:var(--et-theme-color-primary-solid, var(--et-surface-color-solid, currentColor));background:var(--et-theme-color-primary-solid, var(--et-surface-color-solid, currentColor))}.et-ml-rte-lang-trigger{display:inline-flex;position:relative;align-items:center;justify-content:center;inline-size:3.1rem;block-size:3.1rem;border:none;border-radius:var(--et-rich-text-editor-button-radius, 4px);background:transparent;color:inherit;font:inherit;line-height:1;cursor:pointer;appearance:none;transition:background .12s ease}.et-ml-rte-lang-trigger:hover:not(:disabled){background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent)}.et-ml-rte-lang-trigger:focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 16%,transparent)}.et-ml-rte-lang-trigger:active:not(:disabled){background:color-mix(in srgb,var(--et-surface-interaction-solid) 20%,transparent)}.et-ml-rte-lang-trigger:disabled{opacity:.5;cursor:not-allowed}.et-ml-rte-lang-trigger-code{font-size:1.3rem;font-weight:600;text-transform:uppercase}.et-ml-rte-lang-trigger--flagged:after{content:\"\";position:absolute;inset-block-start:4px;inset-inline-end:4px;inline-size:var(--et-multi-language-rich-text-editor-badge-size);block-size:var(--et-multi-language-rich-text-editor-badge-size);border-radius:50%;background:var(--et-theme-color-primary-solid, var(--et-surface-interaction-solid, currentColor))}}\n"] }]
18588
+ args: [{ selector: 'et-multi-language-rich-text-editor-language-tool', encapsulation: ViewEncapsulation.None, imports: [...MENU_IMPORTS], providers: [provideIcons(CHECK_ICON)], host: { class: 'et-ml-rte-lang-tool' }, template: "<div [autoFocus]=\"!hasTouchInput()\" etMenu>\n <button\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"'Language: ' + activeLabel()\"\n [class.et-ml-rte-lang-trigger--flagged]=\"missingCount() > 0\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-ml-rte-lang-trigger\"\n etMenuTrigger\n type=\"button\"\n >\n <span class=\"et-ml-rte-lang-trigger-code\">{{ activeCode() }}</span>\n </button>\n\n <ng-template etMenuSurface>\n <et-menu>\n <et-menu-radio-group [value]=\"activeCode()\" (valueChange)=\"select($event)\" (mousedown)=\"$event.preventDefault()\">\n @for (language of languages(); track language.code) {\n <et-menu-radio-item [value]=\"language.code\" [icon]=\"activeIcon(language.code)\" [closeOnActivate]=\"true\">\n <span class=\"et-ml-rte-lang-item\">\n <span class=\"et-ml-rte-lang-item-label\">{{ language.label }}</span>\n <span\n [class.et-ml-rte-lang-dot--filled]=\"isFilled(language.code)\"\n [attr.aria-label]=\"isFilled(language.code) ? 'has content' : 'empty'\"\n class=\"et-ml-rte-lang-dot\"\n ></span>\n </span>\n </et-menu-radio-item>\n }\n </et-menu-radio-group>\n </et-menu>\n </ng-template>\n</div>\n", styles: ["@layer components{@property --et-multi-language-rich-text-editor-badge-size{syntax: \"<length>\"; inherits: true; initial-value: 7px;}@property --et-multi-language-rich-text-editor-dot-size{syntax: \"<length>\"; inherits: true; initial-value: 8px;}.et-ml-rte-lang-tool{display:contents}.et-ml-rte-lang-item{display:flex;flex:1;align-items:center;justify-content:space-between;gap:12px;min-inline-size:0}.et-ml-rte-lang-dot{flex:none;box-sizing:border-box;inline-size:var(--et-multi-language-rich-text-editor-dot-size);block-size:var(--et-multi-language-rich-text-editor-dot-size);border-radius:50%;border:1.5px solid var(--et-surface-color-muted-solid, color-mix(in srgb, currentColor 40%, transparent));background:transparent}.et-ml-rte-lang-dot--filled{border-color:var(--et-theme-color-primary-solid, var(--et-surface-color-solid, currentColor));background:var(--et-theme-color-primary-solid, var(--et-surface-color-solid, currentColor))}.et-ml-rte-lang-trigger{display:inline-flex;position:relative;align-items:center;justify-content:center;inline-size:3.1rem;block-size:3.1rem;border:none;border-radius:var(--et-rich-text-editor-button-radius, 4px);background:transparent;color:inherit;font:inherit;line-height:1;cursor:pointer;appearance:none;transition:background .12s ease}@media(hover:hover){.et-ml-rte-lang-trigger:hover:not(:disabled){background:color-mix(in srgb,var(--et-surface-interaction-solid) 12%,transparent)}}.et-ml-rte-lang-trigger:focus-visible{background:color-mix(in srgb,var(--et-surface-interaction-solid) 16%,transparent)}.et-ml-rte-lang-trigger:active:not(:disabled){background:color-mix(in srgb,var(--et-surface-interaction-solid) 20%,transparent)}.et-ml-rte-lang-trigger:disabled{opacity:.5;cursor:not-allowed}.et-ml-rte-lang-trigger-code{font-size:1.3rem;font-weight:600;text-transform:uppercase}.et-ml-rte-lang-trigger--flagged:after{content:\"\";position:absolute;inset-block-start:4px;inset-inline-end:4px;inline-size:var(--et-multi-language-rich-text-editor-badge-size);block-size:var(--et-multi-language-rich-text-editor-badge-size);border-radius:50%;background:var(--et-theme-color-primary-solid, var(--et-surface-interaction-solid, currentColor))}}\n"] }]
18589
18589
  }], propDecorators: { editor: [{ type: i0.Input, args: [{ isSignal: true, alias: "editor", required: true }] }] } });
18590
18590
 
18591
18591
  /** The toolbar token the language switcher renders for. Include it in the editor's `tools` to place
@@ -19555,7 +19555,7 @@ class SelectDirective {
19555
19555
  /** Maximum number of selected values (multi select) — further adds are ignored. */
19556
19556
  this.maxSelection = input(undefined, /* @ts-ignore */
19557
19557
  ...(ngDevMode ? [{ debugName: "maxSelection" }] : /* istanbul ignore next */ []));
19558
- /** Renders an "Add new" row in `et-select`'s panel — clicking it emits `addNewRequested`. */
19558
+ /** Renders an "Add new" row in `et-select`'s panel — clicking it emits `addNew`. */
19559
19559
  this.allowAddNew = input(false, /* @ts-ignore */
19560
19560
  ...(ngDevMode ? [{ debugName: "allowAddNew" }] : /* istanbul ignore next */ []));
19561
19561
  /** Async option state — rendered by `et-select` as a loading row inside the panel. */
@@ -19564,16 +19564,16 @@ class SelectDirective {
19564
19564
  /** Async option state — rendered by `et-select` as an error row inside the panel. */
19565
19565
  this.error = input(null, /* @ts-ignore */
19566
19566
  ...(ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []));
19567
- /** Async option state — `et-select` renders a load-more control emitting `loadMoreRequested`. */
19567
+ /** Async option state — `et-select` renders a load-more control emitting `loadMore`. */
19568
19568
  this.hasMoreItems = input(false, /* @ts-ignore */
19569
19569
  ...(ngDevMode ? [{ debugName: "hasMoreItems" }] : /* istanbul ignore next */ []));
19570
19570
  /** Whether the panel mirrors the anchor's width. Off for compact triggers (e.g. a country picker). */
19571
19571
  this.mirrorPanelWidth = input(true, /* @ts-ignore */
19572
19572
  ...(ngDevMode ? [{ debugName: "mirrorPanelWidth" }] : /* istanbul ignore next */ []));
19573
19573
  this.queryChange = output();
19574
- this.loadMoreRequested = output();
19574
+ this.loadMore = output();
19575
19575
  /** The user picked the "Add new" row (`allowAddNew`). Emits the current search query for prefilling. */
19576
- this.addNewRequested = output();
19576
+ this.addNew = output();
19577
19577
  this.shouldDisplayError = computed(() => this.touched() && this.invalid(), /* @ts-ignore */
19578
19578
  ...(ngDevMode ? [{ debugName: "shouldDisplayError" }] : /* istanbul ignore next */ []));
19579
19579
  this.hasValue = computed(() => {
@@ -20032,15 +20032,15 @@ class SelectDirective {
20032
20032
  this.hide();
20033
20033
  }
20034
20034
  }
20035
- /** @internal Emits `loadMoreRequested` — wired to the panel's load-more control. */
20035
+ /** @internal Emits `loadMore` — wired to the panel's load-more control. */
20036
20036
  requestLoadMore() {
20037
20037
  if (this.loading()) {
20038
20038
  return;
20039
20039
  }
20040
- this.loadMoreRequested.emit();
20040
+ this.loadMore.emit();
20041
20041
  }
20042
20042
  /**
20043
- * Emits `addNewRequested` with the current search query and closes the panel — wired to
20043
+ * Emits `addNew` with the current search query and closes the panel — wired to
20044
20044
  * the panel's "Add new" row (`allowAddNew`). The consumer reacts by e.g. opening a
20045
20045
  * creation dialog and, once the new option exists, setting it as the value.
20046
20046
  */
@@ -20048,7 +20048,7 @@ class SelectDirective {
20048
20048
  if (this.disabled() || this.readonly()) {
20049
20049
  return;
20050
20050
  }
20051
- this.addNewRequested.emit(this.query().trim());
20051
+ this.addNew.emit(this.query().trim());
20052
20052
  // the query was handed off — it must not double as a custom value when the close commits
20053
20053
  this.registeredSearch()?.clear();
20054
20054
  this.hide();
@@ -20437,7 +20437,7 @@ class SelectDirective {
20437
20437
  this.hide();
20438
20438
  }
20439
20439
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
20440
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.5", type: SelectDirective, isStandalone: true, selector: "[etSelect]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", 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 }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, filterMode: { classPropertyName: "filterMode", publicName: "filterMode", isSignal: true, isRequired: false, transformFunction: null }, allowCustomValues: { classPropertyName: "allowCustomValues", publicName: "allowCustomValues", isSignal: true, isRequired: false, transformFunction: null }, customValueSeparators: { classPropertyName: "customValueSeparators", publicName: "customValueSeparators", isSignal: true, isRequired: false, transformFunction: null }, normalizeCustomValue: { classPropertyName: "normalizeCustomValue", publicName: "normalizeCustomValue", isSignal: true, isRequired: false, transformFunction: null }, commitCustomValueOnClose: { classPropertyName: "commitCustomValueOnClose", publicName: "commitCustomValueOnClose", isSignal: true, isRequired: false, transformFunction: null }, maxSelection: { classPropertyName: "maxSelection", publicName: "maxSelection", isSignal: true, isRequired: false, transformFunction: null }, allowAddNew: { classPropertyName: "allowAddNew", publicName: "allowAddNew", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, hasMoreItems: { classPropertyName: "hasMoreItems", publicName: "hasMoreItems", isSignal: true, isRequired: false, transformFunction: null }, mirrorPanelWidth: { classPropertyName: "mirrorPanelWidth", publicName: "mirrorPanelWidth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touched: "touchedChange", open: "openChange", queryChange: "queryChange", loadMoreRequested: "loadMoreRequested", addNewRequested: "addNewRequested" }, host: { properties: { "attr.data-select-open": "open() || null" } }, exportAs: ["etSelect"], ngImport: i0 }); }
20440
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.5", type: SelectDirective, isStandalone: true, selector: "[etSelect]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", 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 }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, filterMode: { classPropertyName: "filterMode", publicName: "filterMode", isSignal: true, isRequired: false, transformFunction: null }, allowCustomValues: { classPropertyName: "allowCustomValues", publicName: "allowCustomValues", isSignal: true, isRequired: false, transformFunction: null }, customValueSeparators: { classPropertyName: "customValueSeparators", publicName: "customValueSeparators", isSignal: true, isRequired: false, transformFunction: null }, normalizeCustomValue: { classPropertyName: "normalizeCustomValue", publicName: "normalizeCustomValue", isSignal: true, isRequired: false, transformFunction: null }, commitCustomValueOnClose: { classPropertyName: "commitCustomValueOnClose", publicName: "commitCustomValueOnClose", isSignal: true, isRequired: false, transformFunction: null }, maxSelection: { classPropertyName: "maxSelection", publicName: "maxSelection", isSignal: true, isRequired: false, transformFunction: null }, allowAddNew: { classPropertyName: "allowAddNew", publicName: "allowAddNew", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, hasMoreItems: { classPropertyName: "hasMoreItems", publicName: "hasMoreItems", isSignal: true, isRequired: false, transformFunction: null }, mirrorPanelWidth: { classPropertyName: "mirrorPanelWidth", publicName: "mirrorPanelWidth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touched: "touchedChange", open: "openChange", queryChange: "queryChange", loadMore: "loadMore", addNew: "addNew" }, host: { properties: { "attr.data-select-open": "open() || null" } }, exportAs: ["etSelect"], ngImport: i0 }); }
20441
20441
  }
20442
20442
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectDirective, decorators: [{
20443
20443
  type: Directive,
@@ -20448,7 +20448,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
20448
20448
  '[attr.data-select-open]': 'open() || null',
20449
20449
  },
20450
20450
  }]
20451
- }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], errors: [{ type: i0.Input, args: [{ isSignal: true, alias: "errors", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], filterMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterMode", required: false }] }], allowCustomValues: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowCustomValues", required: false }] }], customValueSeparators: [{ type: i0.Input, args: [{ isSignal: true, alias: "customValueSeparators", required: false }] }], normalizeCustomValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "normalizeCustomValue", required: false }] }], commitCustomValueOnClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "commitCustomValueOnClose", required: false }] }], maxSelection: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxSelection", required: false }] }], allowAddNew: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowAddNew", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], hasMoreItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasMoreItems", required: false }] }], mirrorPanelWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "mirrorPanelWidth", required: false }] }], queryChange: [{ type: i0.Output, args: ["queryChange"] }], loadMoreRequested: [{ type: i0.Output, args: ["loadMoreRequested"] }], addNewRequested: [{ type: i0.Output, args: ["addNewRequested"] }] } });
20451
+ }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], errors: [{ type: i0.Input, args: [{ isSignal: true, alias: "errors", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], filterMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterMode", required: false }] }], allowCustomValues: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowCustomValues", required: false }] }], customValueSeparators: [{ type: i0.Input, args: [{ isSignal: true, alias: "customValueSeparators", required: false }] }], normalizeCustomValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "normalizeCustomValue", required: false }] }], commitCustomValueOnClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "commitCustomValueOnClose", required: false }] }], maxSelection: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxSelection", required: false }] }], allowAddNew: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowAddNew", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], hasMoreItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasMoreItems", required: false }] }], mirrorPanelWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "mirrorPanelWidth", required: false }] }], queryChange: [{ type: i0.Output, args: ["queryChange"] }], loadMore: [{ type: i0.Output, args: ["loadMore"] }], addNew: [{ type: i0.Output, args: ["addNew"] }] } });
20452
20452
 
20453
20453
  class SelectListboxDirective {
20454
20454
  constructor() {
@@ -21327,7 +21327,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
21327
21327
 
21328
21328
  class SelectOptionComponent {
21329
21329
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
21330
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: SelectOptionComponent, isStandalone: true, selector: "et-select-option", host: { classAttribute: "et-select-option" }, providers: [provideIcons(CHECK_ICON, PLUS_ICON)], hostDirectives: [{ directive: SelectOptionDirective, inputs: ["value", "value", "label", "label", "disabled", "disabled", "customValueOption", "customValueOption"] }], ngImport: i0, template: "<span class=\"et-select-option-label\">\n <ng-content />\n</span>\n\n<span class=\"et-select-option-check\">\n <i etIcon=\"et-check\"></i>\n</span>\n", styles: ["@layer components{@property --et-select-option-height{syntax: \"<length>\"; inherits: true; initial-value: 36px;}@property --et-select-option-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-select-option-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-select-option-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-select-option-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-select-option-check-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}.et-select-option{display:flex;align-items:center;gap:var(--et-select-option-gap);min-block-size:var(--et-select-option-height);padding-inline:var(--et-select-option-padding-inline);border-radius:var(--et-select-option-border-radius);font-size:var(--et-select-option-font-size);cursor:pointer;-webkit-user-select:none;user-select:none;content-visibility:auto;contain-intrinsic-block-size:auto var(--et-select-option-height);transition:background .12s ease,color .12s ease,opacity .12s ease}.et-select-option[data-filtered]{display:none}.et-select-option:where([data-active][data-active-source=keyboard]),.et-select-option:where([data-active]:hover){background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 12%,transparent)}.et-select-option:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 20%,transparent)}.et-select-option:where([aria-disabled=true]){opacity:.4;cursor:not-allowed}.et-select-option:where([aria-disabled=true]):active{background:transparent}.et-select-option .et-select-option-check{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-select-option-check-size);block-size:var(--et-select-option-check-size);color:var(--et-theme-color-primary-solid, currentColor);opacity:0}.et-select-option .et-select-option-check .et-icon{inline-size:100%;block-size:100%}.et-select-option:where([data-selected]) .et-select-option-check{opacity:1}.et-select-option .et-select-option-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-inline-size:0}.et-select-option.et-select-create-option{color:var(--et-theme-color-ink-solid, currentColor)}.et-select-option.et-select-create-option .et-select-option-check{display:none}.et-select-option.et-select-create-option .et-select-option-label{display:flex;align-items:center;gap:var(--et-select-option-gap)}.et-select-option.et-select-create-option .et-select-create-option-icon{flex:none;inline-size:var(--et-select-option-check-size);block-size:var(--et-select-option-check-size)}}\n"], dependencies: [{ kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
21330
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: SelectOptionComponent, isStandalone: true, selector: "et-select-option", host: { classAttribute: "et-select-option" }, providers: [provideIcons(CHECK_ICON, PLUS_ICON)], hostDirectives: [{ directive: SelectOptionDirective, inputs: ["value", "value", "label", "label", "disabled", "disabled", "customValueOption", "customValueOption"] }], ngImport: i0, template: "<span class=\"et-select-option-label\">\n <ng-content />\n</span>\n\n<span class=\"et-select-option-check\">\n <i etIcon=\"et-check\"></i>\n</span>\n", styles: ["@layer components{@property --et-select-option-height{syntax: \"<length>\"; inherits: true; initial-value: 36px;}@property --et-select-option-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-select-option-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-select-option-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-select-option-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-select-option-check-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}.et-select-option{display:flex;align-items:center;gap:var(--et-select-option-gap);min-block-size:var(--et-select-option-height);padding-inline:var(--et-select-option-padding-inline);border-radius:var(--et-select-option-border-radius);font-size:var(--et-select-option-font-size);cursor:pointer;-webkit-user-select:none;user-select:none;content-visibility:auto;contain-intrinsic-block-size:auto var(--et-select-option-height);transition:background .12s ease,color .12s ease,opacity .12s ease}.et-select-option[data-filtered]{display:none}.et-select-option:where([data-active][data-active-source=keyboard]){background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 12%,transparent)}@media(hover:hover){.et-select-option:where([data-active]:hover){background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 12%,transparent)}}.et-select-option:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 20%,transparent)}.et-select-option:where([aria-disabled=true]){opacity:.4;cursor:not-allowed}.et-select-option:where([aria-disabled=true]):active{background:transparent}.et-select-option .et-select-option-check{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-select-option-check-size);block-size:var(--et-select-option-check-size);color:var(--et-theme-color-primary-solid, currentColor);opacity:0}.et-select-option .et-select-option-check .et-icon{inline-size:100%;block-size:100%}.et-select-option:where([data-selected]) .et-select-option-check{opacity:1}.et-select-option .et-select-option-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-inline-size:0}.et-select-option.et-select-create-option{color:var(--et-theme-color-ink-solid, currentColor)}.et-select-option.et-select-create-option .et-select-option-check{display:none}.et-select-option.et-select-create-option .et-select-option-label{display:flex;align-items:center;gap:var(--et-select-option-gap)}.et-select-option.et-select-create-option .et-select-create-option-icon{flex:none;inline-size:var(--et-select-option-check-size);block-size:var(--et-select-option-check-size)}}\n"], dependencies: [{ kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
21331
21331
  }
21332
21332
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectOptionComponent, decorators: [{
21333
21333
  type: Component,
@@ -21338,7 +21338,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
21338
21338
  },
21339
21339
  ], host: {
21340
21340
  class: 'et-select-option',
21341
- }, template: "<span class=\"et-select-option-label\">\n <ng-content />\n</span>\n\n<span class=\"et-select-option-check\">\n <i etIcon=\"et-check\"></i>\n</span>\n", styles: ["@layer components{@property --et-select-option-height{syntax: \"<length>\"; inherits: true; initial-value: 36px;}@property --et-select-option-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-select-option-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-select-option-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-select-option-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-select-option-check-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}.et-select-option{display:flex;align-items:center;gap:var(--et-select-option-gap);min-block-size:var(--et-select-option-height);padding-inline:var(--et-select-option-padding-inline);border-radius:var(--et-select-option-border-radius);font-size:var(--et-select-option-font-size);cursor:pointer;-webkit-user-select:none;user-select:none;content-visibility:auto;contain-intrinsic-block-size:auto var(--et-select-option-height);transition:background .12s ease,color .12s ease,opacity .12s ease}.et-select-option[data-filtered]{display:none}.et-select-option:where([data-active][data-active-source=keyboard]),.et-select-option:where([data-active]:hover){background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 12%,transparent)}.et-select-option:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 20%,transparent)}.et-select-option:where([aria-disabled=true]){opacity:.4;cursor:not-allowed}.et-select-option:where([aria-disabled=true]):active{background:transparent}.et-select-option .et-select-option-check{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-select-option-check-size);block-size:var(--et-select-option-check-size);color:var(--et-theme-color-primary-solid, currentColor);opacity:0}.et-select-option .et-select-option-check .et-icon{inline-size:100%;block-size:100%}.et-select-option:where([data-selected]) .et-select-option-check{opacity:1}.et-select-option .et-select-option-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-inline-size:0}.et-select-option.et-select-create-option{color:var(--et-theme-color-ink-solid, currentColor)}.et-select-option.et-select-create-option .et-select-option-check{display:none}.et-select-option.et-select-create-option .et-select-option-label{display:flex;align-items:center;gap:var(--et-select-option-gap)}.et-select-option.et-select-create-option .et-select-create-option-icon{flex:none;inline-size:var(--et-select-option-check-size);block-size:var(--et-select-option-check-size)}}\n"] }]
21341
+ }, template: "<span class=\"et-select-option-label\">\n <ng-content />\n</span>\n\n<span class=\"et-select-option-check\">\n <i etIcon=\"et-check\"></i>\n</span>\n", styles: ["@layer components{@property --et-select-option-height{syntax: \"<length>\"; inherits: true; initial-value: 36px;}@property --et-select-option-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-select-option-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-select-option-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-select-option-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-select-option-check-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}.et-select-option{display:flex;align-items:center;gap:var(--et-select-option-gap);min-block-size:var(--et-select-option-height);padding-inline:var(--et-select-option-padding-inline);border-radius:var(--et-select-option-border-radius);font-size:var(--et-select-option-font-size);cursor:pointer;-webkit-user-select:none;user-select:none;content-visibility:auto;contain-intrinsic-block-size:auto var(--et-select-option-height);transition:background .12s ease,color .12s ease,opacity .12s ease}.et-select-option[data-filtered]{display:none}.et-select-option:where([data-active][data-active-source=keyboard]){background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 12%,transparent)}@media(hover:hover){.et-select-option:where([data-active]:hover){background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 12%,transparent)}}.et-select-option:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 20%,transparent)}.et-select-option:where([aria-disabled=true]){opacity:.4;cursor:not-allowed}.et-select-option:where([aria-disabled=true]):active{background:transparent}.et-select-option .et-select-option-check{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-select-option-check-size);block-size:var(--et-select-option-check-size);color:var(--et-theme-color-primary-solid, currentColor);opacity:0}.et-select-option .et-select-option-check .et-icon{inline-size:100%;block-size:100%}.et-select-option:where([data-selected]) .et-select-option-check{opacity:1}.et-select-option .et-select-option-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-inline-size:0}.et-select-option.et-select-create-option{color:var(--et-theme-color-ink-solid, currentColor)}.et-select-option.et-select-create-option .et-select-option-check{display:none}.et-select-option.et-select-create-option .et-select-option-label{display:flex;align-items:center;gap:var(--et-select-option-gap)}.et-select-option.et-select-create-option .et-select-create-option-icon{flex:none;inline-size:var(--et-select-option-check-size);block-size:var(--et-select-option-check-size)}}\n"] }]
21342
21342
  }] });
21343
21343
 
21344
21344
  const firstErrorMessage$1 = (error) => {
@@ -21354,8 +21354,9 @@ const firstErrorMessage$1 = (error) => {
21354
21354
  * ```ts
21355
21355
  * users = selectOptionsFromQuery({
21356
21356
  * queryCreator: searchUsers,
21357
- * args: (query) => (query() ? { queryParams: { q: query() } } : null),
21357
+ * args: (query, page) => (query() ? { queryParams: { q: query(), page: page() } } : null),
21358
21358
  * toOptions: (res) => res.items,
21359
+ * toHasMore: (res) => res.page < res.totalPages,
21359
21360
  * });
21360
21361
  * ```
21361
21362
  *
@@ -21364,7 +21365,9 @@ const firstErrorMessage$1 = (error) => {
21364
21365
  * [formField]="form.assignee"
21365
21366
  * [loading]="users.loading()"
21366
21367
  * [error]="users.error()"
21368
+ * [hasMoreItems]="users.hasMore()"
21367
21369
  * (queryChange)="users.setQuery($event)"
21370
+ * (loadMore)="users.loadMore()"
21368
21371
  * filterMode="external"
21369
21372
  * >
21370
21373
  * <input etSelectSearch placeholder="Search users" />
@@ -21374,8 +21377,18 @@ const firstErrorMessage$1 = (error) => {
21374
21377
  * </et-select>
21375
21378
  * ```
21376
21379
  *
21380
+ * Pagination is built in: `loadMore()` advances `page` and appends the next page's slice to
21381
+ * `options`; the accumulator resets whenever the query changes. Derive `hasMore` from the latest
21382
+ * response via `toHasMore` — it also gates `loadMore()`.
21383
+ *
21377
21384
  * Call it from a field initializer / constructor (injection context), the same place you'd create
21378
21385
  * a query or a query stack.
21386
+ *
21387
+ * Pagination is built in: `args` receives a `page` signal (starting at `initialPage`, default `1`)
21388
+ * that resets on every query change and advances on `loadMore()`. Return only the current page's
21389
+ * slice from `toOptions` — the factory appends each page to the accumulated `options`. Wire
21390
+ * `hasMore` (via `toHasMore`) to `hasMoreItems` and `loadMore` to `(loadMore)`; `loadMore`
21391
+ * is a no-op while loading, when skipped, or once `hasMore` is false.
21379
21392
  */
21380
21393
  const selectOptionsFromQuery = (config) => {
21381
21394
  const rawQuery = signal('', /* @ts-ignore */
@@ -21386,21 +21399,39 @@ const selectOptionsFromQuery = (config) => {
21386
21399
  const minQueryLength = config.minQueryLength ?? 0;
21387
21400
  const skipped = computed(() => debouncedQuery().trim().length < minQueryLength, /* @ts-ignore */
21388
21401
  ...(ngDevMode ? [{ debugName: "skipped" }] : /* istanbul ignore next */ []));
21389
- // created once, exactly like a query stack — `withArgs` re-runs as the debounced query changes
21402
+ const initialPage = config.initialPage ?? 1;
21403
+ // Resets to `initialPage` whenever the debounced query changes (so the next request starts a
21404
+ // fresh page run), and `loadMore()` bumps it. Keyed off the debounced query — not the raw one —
21405
+ // so the reset lands in the same tick the request re-runs, never firing a spurious page.
21406
+ const page = linkedSignal({ ...(ngDevMode ? { debugName: "page" } : /* istanbul ignore next */ {}), source: debouncedQuery,
21407
+ computation: () => initialPage });
21408
+ // created once, exactly like a query stack — `withArgs` re-runs as the debounced query or page changes
21390
21409
  const query = config.queryCreator(withArgs(() => {
21391
21410
  if (skipped()) {
21392
21411
  return null;
21393
21412
  }
21394
- return config.args(debouncedQuery);
21413
+ return config.args(debouncedQuery, page);
21395
21414
  }));
21396
21415
  const toErrorMessage = config.toErrorMessage ?? firstErrorMessage$1;
21397
- const options = computed(() => {
21398
- if (skipped()) {
21399
- return [];
21400
- }
21401
- const response = query.response();
21402
- return response === null ? [] : config.toOptions(response);
21403
- }, /* @ts-ignore */
21416
+ // Accumulate the per-page slices, indexed by page offset. `query.response()` only holds the
21417
+ // latest page, so this folds each new response into the slice for the page it was requested for
21418
+ // (`page` read untracked: only a new response, never an in-flight page bump, appends). Slicing to
21419
+ // `index` drops later pages, so a query change (page back to `initialPage`) resets to one page.
21420
+ // It's a `linkedSignal` (not a plain accumulator) so `options` recomputes synchronously on read.
21421
+ const pageSlices = linkedSignal({ ...(ngDevMode ? { debugName: "pageSlices" } : /* istanbul ignore next */ {}), source: () => query.response(),
21422
+ computation: (response, previous) => {
21423
+ const index = untracked(page) - initialPage;
21424
+ const slices = (previous?.value ?? []).slice(0, index);
21425
+ if (response !== null) {
21426
+ slices[index] = config.toOptions(response);
21427
+ }
21428
+ return slices;
21429
+ } });
21430
+ // A `linkedSignal` only folds while something observes it — so a page that settles while nothing
21431
+ // renders `options` (e.g. the panel is closed) would be skipped, and a later page would fold over
21432
+ // a stale `previous`. This keepalive makes the fold eager: it captures every settled page.
21433
+ effect(() => void pageSlices());
21434
+ const options = computed(() => (skipped() ? [] : pageSlices().flat()), /* @ts-ignore */
21404
21435
  ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
21405
21436
  const hasMore = computed(() => {
21406
21437
  const toHasMore = config.toHasMore;
@@ -21421,6 +21452,12 @@ const selectOptionsFromQuery = (config) => {
21421
21452
  hasMore,
21422
21453
  query: debouncedQuery,
21423
21454
  setQuery: (value) => rawQuery.set(value),
21455
+ loadMore: () => {
21456
+ if (skipped() || query.loading() !== null || !hasMore()) {
21457
+ return;
21458
+ }
21459
+ page.update((current) => current + 1);
21460
+ },
21424
21461
  };
21425
21462
  };
21426
21463
 
@@ -21448,8 +21485,9 @@ const firstErrorMessage = (error) => {
21448
21485
  * ```ts
21449
21486
  * users = selectOptionsFromV2Query({
21450
21487
  * queryCreator: searchUsers, // client.get({ route: '/users', types: { … } })
21451
- * args: (query) => (query() ? { queryParams: { q: query() } } : null),
21488
+ * args: (query, page) => (query() ? { queryParams: { q: query(), page: page() } } : null),
21452
21489
  * toOptions: (res) => res.items,
21490
+ * toHasMore: (res) => res.page < res.totalPages,
21453
21491
  * });
21454
21492
  * ```
21455
21493
  *
@@ -21458,7 +21496,9 @@ const firstErrorMessage = (error) => {
21458
21496
  * [formField]="form.assignee"
21459
21497
  * [loading]="users.loading()"
21460
21498
  * [error]="users.error()"
21499
+ * [hasMoreItems]="users.hasMore()"
21461
21500
  * (queryChange)="users.setQuery($event)"
21501
+ * (loadMore)="users.loadMore()"
21462
21502
  * filterMode="external"
21463
21503
  * >
21464
21504
  * <input etSelectSearch placeholder="Search users" />
@@ -21470,6 +21510,12 @@ const firstErrorMessage = (error) => {
21470
21510
  *
21471
21511
  * Call it from a field initializer / constructor (injection context), the same place you'd use
21472
21512
  * `queryComputed` or a query container.
21513
+ *
21514
+ * Pagination is built in: `args` receives a `page` signal (starting at `initialPage`, default `1`)
21515
+ * that resets on every query change and advances on `loadMore()`. Return only the current page's
21516
+ * slice from `toOptions` — the factory appends each page to the accumulated `options`. Wire
21517
+ * `hasMore` (via `toHasMore`) to `hasMoreItems` and `loadMore` to `(loadMore)`; `loadMore`
21518
+ * is a no-op while loading, when skipped, or once `hasMore` is false.
21473
21519
  */
21474
21520
  const selectOptionsFromV2Query = (config) => {
21475
21521
  const rawQuery = signal('', /* @ts-ignore */
@@ -21480,13 +21526,19 @@ const selectOptionsFromV2Query = (config) => {
21480
21526
  const minQueryLength = config.minQueryLength ?? 0;
21481
21527
  const skipped = computed(() => debouncedQuery().trim().length < minQueryLength, /* @ts-ignore */
21482
21528
  ...(ngDevMode ? [{ debugName: "skipped" }] : /* istanbul ignore next */ []));
21483
- // `queryComputed` is the legacy container idiom: it re-prepares as the debounced query changes
21484
- // and aborts/releases the previous query instance (and the current one on destroy).
21529
+ const initialPage = config.initialPage ?? 1;
21530
+ // Resets to `initialPage` whenever the debounced query changes (so the next request starts a
21531
+ // fresh page run), and `loadMore()` bumps it. Keyed off the debounced query — not the raw one —
21532
+ // so the reset lands in the same tick the query re-prepares, never firing a spurious page.
21533
+ const page = linkedSignal({ ...(ngDevMode ? { debugName: "page" } : /* istanbul ignore next */ {}), source: debouncedQuery,
21534
+ computation: () => initialPage });
21535
+ // `queryComputed` is the legacy container idiom: it re-prepares as the debounced query or page
21536
+ // changes and aborts/releases the previous query instance (and the current one on destroy).
21485
21537
  const query = queryComputed(() => {
21486
21538
  if (skipped()) {
21487
21539
  return null;
21488
21540
  }
21489
- const args = config.args(debouncedQuery);
21541
+ const args = config.args(debouncedQuery, page);
21490
21542
  if (args === null) {
21491
21543
  return null;
21492
21544
  }
@@ -21497,13 +21549,26 @@ const selectOptionsFromV2Query = (config) => {
21497
21549
  // mirroring how the current system's `response()` behaves across re-executions.
21498
21550
  const settledState = queryStateSignal(query, { cacheResponse: true });
21499
21551
  const toErrorMessage = config.toErrorMessage ?? firstErrorMessage;
21500
- const options = computed(() => {
21501
- const settled = settledState();
21502
- if (skipped() || !isQueryStateSuccess(settled)) {
21503
- return [];
21504
- }
21505
- return config.toOptions(settled.response);
21506
- }, /* @ts-ignore */
21552
+ // Accumulate the per-page slices, indexed by page offset. `settledState` only holds the latest
21553
+ // settled response, so this folds each new success into the slice for the page it was requested
21554
+ // for (`page` read untracked: only a new settled state, never an in-flight page bump, appends).
21555
+ // Slicing to `index` drops later pages, so a query change (page back to `initialPage`) resets to
21556
+ // one page; a non-success settled state keeps the accumulated slices as-is. It's a `linkedSignal`
21557
+ // (not a plain accumulator) so `options` recomputes synchronously on read.
21558
+ const pageSlices = linkedSignal({ ...(ngDevMode ? { debugName: "pageSlices" } : /* istanbul ignore next */ {}), source: settledState,
21559
+ computation: (settled, previous) => {
21560
+ const index = untracked(page) - initialPage;
21561
+ const slices = (previous?.value ?? []).slice(0, index);
21562
+ if (isQueryStateSuccess(settled)) {
21563
+ slices[index] = config.toOptions(settled.response);
21564
+ }
21565
+ return slices;
21566
+ } });
21567
+ // A `linkedSignal` only folds while something observes it — so a page that settles while nothing
21568
+ // renders `options` (e.g. the panel is closed) would be skipped, and a later page would fold over
21569
+ // a stale `previous`. This keepalive makes the fold eager: it captures every settled page.
21570
+ effect(() => void pageSlices());
21571
+ const options = computed(() => (skipped() ? [] : pageSlices().flat()), /* @ts-ignore */
21507
21572
  ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
21508
21573
  const hasMore = computed(() => {
21509
21574
  const toHasMore = config.toHasMore;
@@ -21524,6 +21589,12 @@ const selectOptionsFromV2Query = (config) => {
21524
21589
  hasMore,
21525
21590
  query: debouncedQuery,
21526
21591
  setQuery: (value) => rawQuery.set(value),
21592
+ loadMore: () => {
21593
+ if (skipped() || isQueryStateLoading(state()) || !hasMore()) {
21594
+ return;
21595
+ }
21596
+ page.update((current) => current + 1);
21597
+ },
21527
21598
  };
21528
21599
  };
21529
21600
 
@@ -21545,7 +21616,7 @@ class SelectPanelComponent {
21545
21616
  <ng-content select="[etSelectPanelExtras]" />
21546
21617
  </div>
21547
21618
  </div>
21548
- `, isInline: true, styles: ["@layer components{@property --et-select-panel-max-height{syntax: \"<length-percentage>\"; inherits: false; initial-value: 40vh;}@property --et-select-panel-padding{syntax: \"<length>\"; inherits: false; initial-value: 6px;}.et-overlay.et-with-default-animation.et-overlay--select.et-animation-enter-from,.et-overlay.et-with-default-animation.et-overlay--select.et-animation-leave-to{opacity:0}.et-overlay.et-with-default-animation.et-overlay--select.et-animation-enter-active{transition:transform .14s ease,opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--select.et-animation-leave-active{transition:transform .1s ease,opacity .1s ease}.et-overlay--select[data-overlay-placement^=top].et-animation-enter-from,.et-overlay--select[data-overlay-placement^=top].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(.3rem)!important}.et-overlay--select[data-overlay-placement^=bottom].et-animation-enter-from,.et-overlay--select[data-overlay-placement^=bottom].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(-.3rem)!important}@media(prefers-reduced-motion:reduce){.et-overlay.et-with-default-animation.et-overlay--select.et-animation-enter-active,.et-overlay.et-with-default-animation.et-overlay--select.et-animation-leave-active{transition-duration:0ms}}.et-select-panel{display:grid;grid-template-rows:minmax(0,1fr);box-sizing:border-box;max-inline-size:min(400px,calc(100vw - 24px));max-block-size:var(--et-select-panel-max-height);overflow:hidden;--_et-select-panel-padding: var(--et-select-panel-padding);border-radius:10px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:var(--et-surface-background-solid, rgb(32 32 32));color:var(--et-surface-color-solid, rgb(244 244 245));font-size:var(--et-select-option-font-size, 14px);box-shadow:0 10px 24px #00000029}.et-select-panel .et-select-panel-scroller{box-sizing:border-box;overflow-y:auto;overscroll-behavior:contain;padding:var(--_et-select-panel-padding)}.et-select-panel.et-select-panel--resizing .et-select-panel-scroller{overflow:clip}.et-select-panel .et-select-listbox,.et-select-panel .et-select-panel-extras{display:contents}.et-select-panel .et-select-state{display:flex;align-items:center;gap:8px;min-block-size:var(--et-select-option-height, 36px);padding-inline:var(--et-select-option-padding-inline, 10px);font-size:var(--et-select-option-font-size, 14px);color:var(--et-surface-color-muted-solid, currentColor)}.et-select-panel .et-select-state.et-select-state--error{font-size:12px;color:var(--et-theme-color-primary-solid, rgb(248 113 113))}.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new{position:relative;display:flex;align-items:center;gap:var(--et-select-option-gap, 8px);inline-size:100%;min-block-size:var(--et-select-option-height, 36px);margin-block-start:7px;padding-inline:var(--et-select-option-padding-inline, 10px);border:none;border-radius:var(--et-select-option-border-radius, 6px);background:transparent;font:inherit;font-size:var(--et-select-option-font-size, 14px);text-align:start;color:var(--et-theme-color-ink-solid, currentColor);cursor:pointer;appearance:none;transition:background .12s ease}:is(.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new):before{content:\"\";position:absolute;inset-inline:calc(var(--et-select-panel-padding, 6px) * -1);inset-block-start:-4px;block-size:1px;background:var(--et-surface-border-solid, rgb(255 255 255 / .1))}:is(.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new):hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 12%,transparent)}:is(.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new):active{background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 20%,transparent)}:is(.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new) .et-icon{flex:none;inline-size:16px;block-size:16px}.et-select-panel .et-select-load-more+.et-select-add-new{margin-block-start:2px}.et-select-panel .et-select-load-more+.et-select-add-new:before{content:none}.et-select-panel .et-select-load-more-icon{rotate:180deg}}\n"], dependencies: [{ kind: "directive", type: SelectListboxDirective, selector: "[etSelectListbox]", exportAs: ["etSelectListbox"] }, { kind: "directive", type: SelectViewportDirective, selector: "[etSelectViewport]", exportAs: ["etSelectViewport"] }], encapsulation: i0.ViewEncapsulation.None }); }
21619
+ `, isInline: true, styles: ["@layer components{@property --et-select-panel-max-height{syntax: \"<length-percentage>\"; inherits: false; initial-value: 40vh;}@property --et-select-panel-padding{syntax: \"<length>\"; inherits: false; initial-value: 6px;}.et-overlay.et-with-default-animation.et-overlay--select.et-animation-enter-from,.et-overlay.et-with-default-animation.et-overlay--select.et-animation-leave-to{opacity:0}.et-overlay.et-with-default-animation.et-overlay--select.et-animation-enter-active{transition:transform .14s ease,opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--select.et-animation-leave-active{transition:transform .1s ease,opacity .1s ease}.et-overlay--select[data-overlay-placement^=top].et-animation-enter-from,.et-overlay--select[data-overlay-placement^=top].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(.3rem)!important}.et-overlay--select[data-overlay-placement^=bottom].et-animation-enter-from,.et-overlay--select[data-overlay-placement^=bottom].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(-.3rem)!important}@media(prefers-reduced-motion:reduce){.et-overlay.et-with-default-animation.et-overlay--select.et-animation-enter-active,.et-overlay.et-with-default-animation.et-overlay--select.et-animation-leave-active{transition-duration:0ms}}.et-select-panel{display:grid;grid-template-rows:minmax(0,1fr);box-sizing:border-box;max-inline-size:min(400px,calc(100vw - 24px));max-block-size:var(--et-select-panel-max-height);overflow:hidden;--_et-select-panel-padding: var(--et-select-panel-padding);border-radius:10px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:var(--et-surface-background-solid, rgb(32 32 32));color:var(--et-surface-color-solid, rgb(244 244 245));font-size:var(--et-select-option-font-size, 14px);box-shadow:0 10px 24px #00000029}.et-select-panel .et-select-panel-scroller{box-sizing:border-box;overflow-y:auto;overscroll-behavior:contain;padding:var(--_et-select-panel-padding)}.et-select-panel.et-select-panel--resizing .et-select-panel-scroller{overflow:clip}.et-select-panel .et-select-listbox,.et-select-panel .et-select-panel-extras{display:contents}.et-select-panel .et-select-state{display:flex;align-items:center;gap:8px;min-block-size:var(--et-select-option-height, 36px);padding-inline:var(--et-select-option-padding-inline, 10px);font-size:var(--et-select-option-font-size, 14px);color:var(--et-surface-color-muted-solid, currentColor)}.et-select-panel .et-select-state.et-select-state--error{font-size:12px;color:var(--et-theme-color-primary-solid, rgb(248 113 113))}.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new{position:relative;display:flex;align-items:center;gap:var(--et-select-option-gap, 8px);inline-size:100%;min-block-size:var(--et-select-option-height, 36px);margin-block-start:7px;padding-inline:var(--et-select-option-padding-inline, 10px);border:none;border-radius:var(--et-select-option-border-radius, 6px);background:transparent;font:inherit;font-size:var(--et-select-option-font-size, 14px);text-align:start;color:var(--et-theme-color-ink-solid, currentColor);cursor:pointer;appearance:none;transition:background .12s ease}:is(.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new):before{content:\"\";position:absolute;inset-inline:calc(var(--et-select-panel-padding, 6px) * -1);inset-block-start:-4px;block-size:1px;background:var(--et-surface-border-solid, rgb(255 255 255 / .1))}@media(hover:hover){:is(.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new):hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 12%,transparent)}}:is(.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new):active{background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 20%,transparent)}:is(.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new) .et-icon{flex:none;inline-size:16px;block-size:16px}.et-select-panel .et-select-load-more+.et-select-add-new{margin-block-start:2px}.et-select-panel .et-select-load-more+.et-select-add-new:before{content:none}.et-select-panel .et-select-load-more-icon{rotate:180deg}}\n"], dependencies: [{ kind: "directive", type: SelectListboxDirective, selector: "[etSelectListbox]", exportAs: ["etSelectListbox"] }, { kind: "directive", type: SelectViewportDirective, selector: "[etSelectViewport]", exportAs: ["etSelectViewport"] }], encapsulation: i0.ViewEncapsulation.None }); }
21549
21620
  }
21550
21621
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectPanelComponent, decorators: [{
21551
21622
  type: Component,
@@ -21560,7 +21631,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
21560
21631
  </div>
21561
21632
  `, encapsulation: ViewEncapsulation.None, imports: [SelectListboxDirective, SelectViewportDirective], hostDirectives: [ProvideColorDirective, AutoSurfaceDirective], host: {
21562
21633
  class: 'et-select-panel',
21563
- }, styles: ["@layer components{@property --et-select-panel-max-height{syntax: \"<length-percentage>\"; inherits: false; initial-value: 40vh;}@property --et-select-panel-padding{syntax: \"<length>\"; inherits: false; initial-value: 6px;}.et-overlay.et-with-default-animation.et-overlay--select.et-animation-enter-from,.et-overlay.et-with-default-animation.et-overlay--select.et-animation-leave-to{opacity:0}.et-overlay.et-with-default-animation.et-overlay--select.et-animation-enter-active{transition:transform .14s ease,opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--select.et-animation-leave-active{transition:transform .1s ease,opacity .1s ease}.et-overlay--select[data-overlay-placement^=top].et-animation-enter-from,.et-overlay--select[data-overlay-placement^=top].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(.3rem)!important}.et-overlay--select[data-overlay-placement^=bottom].et-animation-enter-from,.et-overlay--select[data-overlay-placement^=bottom].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(-.3rem)!important}@media(prefers-reduced-motion:reduce){.et-overlay.et-with-default-animation.et-overlay--select.et-animation-enter-active,.et-overlay.et-with-default-animation.et-overlay--select.et-animation-leave-active{transition-duration:0ms}}.et-select-panel{display:grid;grid-template-rows:minmax(0,1fr);box-sizing:border-box;max-inline-size:min(400px,calc(100vw - 24px));max-block-size:var(--et-select-panel-max-height);overflow:hidden;--_et-select-panel-padding: var(--et-select-panel-padding);border-radius:10px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:var(--et-surface-background-solid, rgb(32 32 32));color:var(--et-surface-color-solid, rgb(244 244 245));font-size:var(--et-select-option-font-size, 14px);box-shadow:0 10px 24px #00000029}.et-select-panel .et-select-panel-scroller{box-sizing:border-box;overflow-y:auto;overscroll-behavior:contain;padding:var(--_et-select-panel-padding)}.et-select-panel.et-select-panel--resizing .et-select-panel-scroller{overflow:clip}.et-select-panel .et-select-listbox,.et-select-panel .et-select-panel-extras{display:contents}.et-select-panel .et-select-state{display:flex;align-items:center;gap:8px;min-block-size:var(--et-select-option-height, 36px);padding-inline:var(--et-select-option-padding-inline, 10px);font-size:var(--et-select-option-font-size, 14px);color:var(--et-surface-color-muted-solid, currentColor)}.et-select-panel .et-select-state.et-select-state--error{font-size:12px;color:var(--et-theme-color-primary-solid, rgb(248 113 113))}.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new{position:relative;display:flex;align-items:center;gap:var(--et-select-option-gap, 8px);inline-size:100%;min-block-size:var(--et-select-option-height, 36px);margin-block-start:7px;padding-inline:var(--et-select-option-padding-inline, 10px);border:none;border-radius:var(--et-select-option-border-radius, 6px);background:transparent;font:inherit;font-size:var(--et-select-option-font-size, 14px);text-align:start;color:var(--et-theme-color-ink-solid, currentColor);cursor:pointer;appearance:none;transition:background .12s ease}:is(.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new):before{content:\"\";position:absolute;inset-inline:calc(var(--et-select-panel-padding, 6px) * -1);inset-block-start:-4px;block-size:1px;background:var(--et-surface-border-solid, rgb(255 255 255 / .1))}:is(.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new):hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 12%,transparent)}:is(.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new):active{background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 20%,transparent)}:is(.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new) .et-icon{flex:none;inline-size:16px;block-size:16px}.et-select-panel .et-select-load-more+.et-select-add-new{margin-block-start:2px}.et-select-panel .et-select-load-more+.et-select-add-new:before{content:none}.et-select-panel .et-select-load-more-icon{rotate:180deg}}\n"] }]
21634
+ }, styles: ["@layer components{@property --et-select-panel-max-height{syntax: \"<length-percentage>\"; inherits: false; initial-value: 40vh;}@property --et-select-panel-padding{syntax: \"<length>\"; inherits: false; initial-value: 6px;}.et-overlay.et-with-default-animation.et-overlay--select.et-animation-enter-from,.et-overlay.et-with-default-animation.et-overlay--select.et-animation-leave-to{opacity:0}.et-overlay.et-with-default-animation.et-overlay--select.et-animation-enter-active{transition:transform .14s ease,opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--select.et-animation-leave-active{transition:transform .1s ease,opacity .1s ease}.et-overlay--select[data-overlay-placement^=top].et-animation-enter-from,.et-overlay--select[data-overlay-placement^=top].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(.3rem)!important}.et-overlay--select[data-overlay-placement^=bottom].et-animation-enter-from,.et-overlay--select[data-overlay-placement^=bottom].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0) translateY(-.3rem)!important}@media(prefers-reduced-motion:reduce){.et-overlay.et-with-default-animation.et-overlay--select.et-animation-enter-active,.et-overlay.et-with-default-animation.et-overlay--select.et-animation-leave-active{transition-duration:0ms}}.et-select-panel{display:grid;grid-template-rows:minmax(0,1fr);box-sizing:border-box;max-inline-size:min(400px,calc(100vw - 24px));max-block-size:var(--et-select-panel-max-height);overflow:hidden;--_et-select-panel-padding: var(--et-select-panel-padding);border-radius:10px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:var(--et-surface-background-solid, rgb(32 32 32));color:var(--et-surface-color-solid, rgb(244 244 245));font-size:var(--et-select-option-font-size, 14px);box-shadow:0 10px 24px #00000029}.et-select-panel .et-select-panel-scroller{box-sizing:border-box;overflow-y:auto;overscroll-behavior:contain;padding:var(--_et-select-panel-padding)}.et-select-panel.et-select-panel--resizing .et-select-panel-scroller{overflow:clip}.et-select-panel .et-select-listbox,.et-select-panel .et-select-panel-extras{display:contents}.et-select-panel .et-select-state{display:flex;align-items:center;gap:8px;min-block-size:var(--et-select-option-height, 36px);padding-inline:var(--et-select-option-padding-inline, 10px);font-size:var(--et-select-option-font-size, 14px);color:var(--et-surface-color-muted-solid, currentColor)}.et-select-panel .et-select-state.et-select-state--error{font-size:12px;color:var(--et-theme-color-primary-solid, rgb(248 113 113))}.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new{position:relative;display:flex;align-items:center;gap:var(--et-select-option-gap, 8px);inline-size:100%;min-block-size:var(--et-select-option-height, 36px);margin-block-start:7px;padding-inline:var(--et-select-option-padding-inline, 10px);border:none;border-radius:var(--et-select-option-border-radius, 6px);background:transparent;font:inherit;font-size:var(--et-select-option-font-size, 14px);text-align:start;color:var(--et-theme-color-ink-solid, currentColor);cursor:pointer;appearance:none;transition:background .12s ease}:is(.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new):before{content:\"\";position:absolute;inset-inline:calc(var(--et-select-panel-padding, 6px) * -1);inset-block-start:-4px;block-size:1px;background:var(--et-surface-border-solid, rgb(255 255 255 / .1))}@media(hover:hover){:is(.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new):hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 12%,transparent)}}:is(.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new):active{background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 20%,transparent)}:is(.et-select-panel .et-select-load-more,.et-select-panel .et-select-add-new) .et-icon{flex:none;inline-size:16px;block-size:16px}.et-select-panel .et-select-load-more+.et-select-add-new{margin-block-start:2px}.et-select-panel .et-select-load-more+.et-select-add-new:before{content:none}.et-select-panel .et-select-load-more-icon{rotate:180deg}}\n"] }]
21564
21635
  }], ctorParameters: () => [], propDecorators: { panelBody: [{ type: i0.ViewChild, args: ['panelBody', { isSignal: true }] }] } });
21565
21636
 
21566
21637
  /**
@@ -21594,7 +21665,7 @@ class SelectVirtualOptionComponent {
21594
21665
  <span class="et-select-option-check">
21595
21666
  <i etIcon="et-check"></i>
21596
21667
  </span>
21597
- `, isInline: true, styles: ["@layer components{@property --et-select-option-height{syntax: \"<length>\"; inherits: true; initial-value: 36px;}@property --et-select-option-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-select-option-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-select-option-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-select-option-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-select-option-check-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}.et-select-option{display:flex;align-items:center;gap:var(--et-select-option-gap);min-block-size:var(--et-select-option-height);padding-inline:var(--et-select-option-padding-inline);border-radius:var(--et-select-option-border-radius);font-size:var(--et-select-option-font-size);cursor:pointer;-webkit-user-select:none;user-select:none;content-visibility:auto;contain-intrinsic-block-size:auto var(--et-select-option-height);transition:background .12s ease,color .12s ease,opacity .12s ease}.et-select-option[data-filtered]{display:none}.et-select-option:where([data-active][data-active-source=keyboard]),.et-select-option:where([data-active]:hover){background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 12%,transparent)}.et-select-option:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 20%,transparent)}.et-select-option:where([aria-disabled=true]){opacity:.4;cursor:not-allowed}.et-select-option:where([aria-disabled=true]):active{background:transparent}.et-select-option .et-select-option-check{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-select-option-check-size);block-size:var(--et-select-option-check-size);color:var(--et-theme-color-primary-solid, currentColor);opacity:0}.et-select-option .et-select-option-check .et-icon{inline-size:100%;block-size:100%}.et-select-option:where([data-selected]) .et-select-option-check{opacity:1}.et-select-option .et-select-option-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-inline-size:0}.et-select-option.et-select-create-option{color:var(--et-theme-color-ink-solid, currentColor)}.et-select-option.et-select-create-option .et-select-option-check{display:none}.et-select-option.et-select-create-option .et-select-option-label{display:flex;align-items:center;gap:var(--et-select-option-gap)}.et-select-option.et-select-create-option .et-select-create-option-icon{flex:none;inline-size:var(--et-select-option-check-size);block-size:var(--et-select-option-check-size)}}\n"], dependencies: [{ kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], encapsulation: i0.ViewEncapsulation.None }); }
21668
+ `, isInline: true, styles: ["@layer components{@property --et-select-option-height{syntax: \"<length>\"; inherits: true; initial-value: 36px;}@property --et-select-option-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-select-option-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-select-option-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-select-option-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-select-option-check-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}.et-select-option{display:flex;align-items:center;gap:var(--et-select-option-gap);min-block-size:var(--et-select-option-height);padding-inline:var(--et-select-option-padding-inline);border-radius:var(--et-select-option-border-radius);font-size:var(--et-select-option-font-size);cursor:pointer;-webkit-user-select:none;user-select:none;content-visibility:auto;contain-intrinsic-block-size:auto var(--et-select-option-height);transition:background .12s ease,color .12s ease,opacity .12s ease}.et-select-option[data-filtered]{display:none}.et-select-option:where([data-active][data-active-source=keyboard]){background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 12%,transparent)}@media(hover:hover){.et-select-option:where([data-active]:hover){background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 12%,transparent)}}.et-select-option:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 20%,transparent)}.et-select-option:where([aria-disabled=true]){opacity:.4;cursor:not-allowed}.et-select-option:where([aria-disabled=true]):active{background:transparent}.et-select-option .et-select-option-check{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-select-option-check-size);block-size:var(--et-select-option-check-size);color:var(--et-theme-color-primary-solid, currentColor);opacity:0}.et-select-option .et-select-option-check .et-icon{inline-size:100%;block-size:100%}.et-select-option:where([data-selected]) .et-select-option-check{opacity:1}.et-select-option .et-select-option-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-inline-size:0}.et-select-option.et-select-create-option{color:var(--et-theme-color-ink-solid, currentColor)}.et-select-option.et-select-create-option .et-select-option-check{display:none}.et-select-option.et-select-create-option .et-select-option-label{display:flex;align-items:center;gap:var(--et-select-option-gap)}.et-select-option.et-select-create-option .et-select-create-option-icon{flex:none;inline-size:var(--et-select-option-check-size);block-size:var(--et-select-option-check-size)}}\n"], dependencies: [{ kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], encapsulation: i0.ViewEncapsulation.None }); }
21598
21669
  }
21599
21670
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectVirtualOptionComponent, decorators: [{
21600
21671
  type: Component,
@@ -21617,7 +21688,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
21617
21688
  },
21618
21689
  ], host: {
21619
21690
  class: 'et-select-option',
21620
- }, styles: ["@layer components{@property --et-select-option-height{syntax: \"<length>\"; inherits: true; initial-value: 36px;}@property --et-select-option-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-select-option-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-select-option-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-select-option-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-select-option-check-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}.et-select-option{display:flex;align-items:center;gap:var(--et-select-option-gap);min-block-size:var(--et-select-option-height);padding-inline:var(--et-select-option-padding-inline);border-radius:var(--et-select-option-border-radius);font-size:var(--et-select-option-font-size);cursor:pointer;-webkit-user-select:none;user-select:none;content-visibility:auto;contain-intrinsic-block-size:auto var(--et-select-option-height);transition:background .12s ease,color .12s ease,opacity .12s ease}.et-select-option[data-filtered]{display:none}.et-select-option:where([data-active][data-active-source=keyboard]),.et-select-option:where([data-active]:hover){background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 12%,transparent)}.et-select-option:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 20%,transparent)}.et-select-option:where([aria-disabled=true]){opacity:.4;cursor:not-allowed}.et-select-option:where([aria-disabled=true]):active{background:transparent}.et-select-option .et-select-option-check{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-select-option-check-size);block-size:var(--et-select-option-check-size);color:var(--et-theme-color-primary-solid, currentColor);opacity:0}.et-select-option .et-select-option-check .et-icon{inline-size:100%;block-size:100%}.et-select-option:where([data-selected]) .et-select-option-check{opacity:1}.et-select-option .et-select-option-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-inline-size:0}.et-select-option.et-select-create-option{color:var(--et-theme-color-ink-solid, currentColor)}.et-select-option.et-select-create-option .et-select-option-check{display:none}.et-select-option.et-select-create-option .et-select-option-label{display:flex;align-items:center;gap:var(--et-select-option-gap)}.et-select-option.et-select-create-option .et-select-create-option-icon{flex:none;inline-size:var(--et-select-option-check-size);block-size:var(--et-select-option-check-size)}}\n"] }]
21691
+ }, styles: ["@layer components{@property --et-select-option-height{syntax: \"<length>\"; inherits: true; initial-value: 36px;}@property --et-select-option-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-select-option-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-select-option-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-select-option-font-size{syntax: \"<length>\"; inherits: true; initial-value: 14px;}@property --et-select-option-check-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}.et-select-option{display:flex;align-items:center;gap:var(--et-select-option-gap);min-block-size:var(--et-select-option-height);padding-inline:var(--et-select-option-padding-inline);border-radius:var(--et-select-option-border-radius);font-size:var(--et-select-option-font-size);cursor:pointer;-webkit-user-select:none;user-select:none;content-visibility:auto;contain-intrinsic-block-size:auto var(--et-select-option-height);transition:background .12s ease,color .12s ease,opacity .12s ease}.et-select-option[data-filtered]{display:none}.et-select-option:where([data-active][data-active-source=keyboard]){background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 12%,transparent)}@media(hover:hover){.et-select-option:where([data-active]:hover){background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 12%,transparent)}}.et-select-option:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 20%,transparent)}.et-select-option:where([aria-disabled=true]){opacity:.4;cursor:not-allowed}.et-select-option:where([aria-disabled=true]):active{background:transparent}.et-select-option .et-select-option-check{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-select-option-check-size);block-size:var(--et-select-option-check-size);color:var(--et-theme-color-primary-solid, currentColor);opacity:0}.et-select-option .et-select-option-check .et-icon{inline-size:100%;block-size:100%}.et-select-option:where([data-selected]) .et-select-option-check{opacity:1}.et-select-option .et-select-option-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-inline-size:0}.et-select-option.et-select-create-option{color:var(--et-theme-color-ink-solid, currentColor)}.et-select-option.et-select-create-option .et-select-option-check{display:none}.et-select-option.et-select-create-option .et-select-option-label{display:flex;align-items:center;gap:var(--et-select-option-gap)}.et-select-option.et-select-create-option .et-select-create-option-icon{flex:none;inline-size:var(--et-select-option-check-size);block-size:var(--et-select-option-check-size)}}\n"] }]
21621
21692
  }] });
21622
21693
 
21623
21694
  class SelectComponent {
@@ -21699,7 +21770,7 @@ class SelectComponent {
21699
21770
  }
21700
21771
  }
21701
21772
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
21702
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: SelectComponent, isStandalone: true, selector: "et-select", inputs: { loadMoreLabel: { classPropertyName: "loadMoreLabel", publicName: "loadMoreLabel", isSignal: true, isRequired: false, transformFunction: null }, addNewLabel: { classPropertyName: "addNewLabel", publicName: "addNewLabel", isSignal: true, isRequired: false, transformFunction: null }, createLabel: { classPropertyName: "createLabel", publicName: "createLabel", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-select" }, providers: [provideIcons(CHEVRON_ICON, TIMES_ICON, PLUS_ICON)], hostDirectives: [{ directive: SelectDirective, inputs: ["value", "value", "touched", "touched", "open", "open", "multiple", "multiple", "placeholder", "placeholder", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name", "options", "options", "filterMode", "filterMode", "allowCustomValues", "allowCustomValues", "customValueSeparators", "customValueSeparators", "normalizeCustomValue", "normalizeCustomValue", "commitCustomValueOnClose", "commitCustomValueOnClose", "maxSelection", "maxSelection", "allowAddNew", "allowAddNew", "loading", "loading", "error", "error", "hasMoreItems", "hasMoreItems"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange", "openChange", "openChange", "queryChange", "queryChange", "loadMoreRequested", "loadMoreRequested", "addNewRequested", "addNewRequested"] }, { directive: i1.ColorInteractiveDirective }], ngImport: i0, template: "<!-- a div, not a <button>: chips carry remove buttons and buttons cannot nest.\n The trigger directive manages tabindex/aria-disabled for non-button hosts. -->\n<div class=\"et-select-trigger\" etSelectTrigger>\n <div [class.et-select-trigger-content--stacked]=\"stackedValue()\" class=\"et-select-trigger-content\">\n @if (select.registeredValueTemplate(); as valueTemplate) {\n @if (showCustomValue()) {\n <div class=\"et-select-value-custom\">\n <ng-template [ngTemplateOutlet]=\"valueTemplate.templateRef\" [ngTemplateOutletContext]=\"valueContext()\" />\n </div>\n }\n } @else if (select.multiple() && select.selectedEntries().length) {\n <!-- display: contents \u2014 the chips share the trigger's wrapping flex flow with the\n inline search input, tag-input style -->\n <!-- readonly is not disabled: the chips keep their normal look, they just lose the\n remove affordance -->\n <div class=\"et-select-chips\">\n @for (entry of select.selectedEntries(); track entry.value) {\n <et-chip\n [disabled]=\"select.disabled()\"\n [removable]=\"!select.readonly() && !select.disabled()\"\n (remove)=\"select.deselectValue(entry.value)\"\n >\n {{ entry.label }}\n </et-chip>\n }\n </div>\n }\n\n @if (showValueLabel()) {\n <span [attr.data-placeholder]=\"!select.hasValue() || null\" class=\"et-select-value\">\n {{ select.displayValue() ?? select.placeholder() }}\n </span>\n }\n\n <!-- combobox pattern: the search input sits inline in the field, not in the panel -->\n <ng-content select=\"input[etSelectSearch]\" />\n </div>\n\n <!-- async option state, surfaced in the field itself (mirrors the menu's search spinner) \u2014\n only while the panel is closed; open, the panel's loading row is the single spinner -->\n @if (select.loading() && !select.open()) {\n <et-spinner class=\"et-select-trigger-spinner\" diameter=\"16\" strokeWidth=\"2\" />\n }\n\n @if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear via Backspace / erasing -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n class=\"et-select-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n }\n\n <!-- pointer-only affordance (keyboard users close via Escape) \u2014 kept out of the tab order -->\n <button\n [disabled]=\"select.disabled()\"\n (click)=\"handleArrowClick($event)\"\n class=\"et-select-arrow\"\n aria-hidden=\"true\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-chevron\"></i>\n </button>\n</div>\n\n<ng-template #optionContent>\n <ng-content />\n</ng-template>\n\n@if (!select.isMounted()) {\n <!-- keeps the projected options rendered (and their bindings live) while the panel is\n closed, so the trigger can resolve a preselected value's label and closed typeahead\n works \u2014 the same template moves into the overlay while it is open -->\n <div class=\"et-select-detached-options\" aria-hidden=\"true\" hidden>\n <ng-template [ngTemplateOutlet]=\"optionContent\" />\n </div>\n}\n\n<ng-template etSelectSurface>\n <et-select-panel>\n @if (select.options()) {\n <!-- data-driven mode: the select owns the option rows and windows their rendering \u2014\n only rows near the viewport exist in the DOM; the block paddings stand in for the\n scroll height of everything outside the window -->\n <div\n [style.padding-block-start.px]=\"select.virtualWindow.paddingTop()\"\n [style.padding-block-end.px]=\"select.virtualWindow.paddingBottom()\"\n class=\"et-select-virtual-options\"\n role=\"none\"\n >\n @for (item of select.virtualizedItems(); track item) {\n <et-select-virtual-option [item]=\"item\" />\n }\n </div>\n }\n\n <ng-template [ngTemplateOutlet]=\"optionContent\" />\n\n <!-- a real option (not an action row like add-new): it takes part in virtual focus, so\n Enter commits it and it is keyboard-reachable while options still match the query.\n Its label is the candidate itself \u2014 that is what commits and what the label cache\n stores; the \"Create\" prefix is display-only. -->\n @if (select.customValueCandidate(); as candidate) {\n <et-select-option\n [value]=\"candidate\"\n [label]=\"candidate\"\n [customValueOption]=\"true\"\n class=\"et-select-create-option\"\n >\n <i class=\"et-select-create-option-icon\" etIcon=\"et-plus\" aria-hidden=\"true\"></i>\n {{ createLabel() }} \u201C{{ candidate }}\u201D\n </et-select-option>\n }\n\n <!-- state rows and action buttons are NOT options \u2014 projected outside the listbox element\n (display: contents, so they still flow within the scrolling panel) -->\n <div class=\"et-select-panel-extras\" etSelectPanelExtras>\n @if (select.loading()) {\n @if (select.registeredLoadingTemplate(); as loadingTemplate) {\n <ng-template [ngTemplateOutlet]=\"loadingTemplate.templateRef\" />\n } @else {\n <div class=\"et-select-state et-select-state--loading\">\n <et-spinner class=\"et-select-state-spinner\" diameter=\"16\" strokeWidth=\"2\" />\n Loading\u2026\n </div>\n }\n } @else if (select.error(); as error) {\n @if (select.registeredErrorTemplate(); as errorTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"errorTemplate.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: error }\"\n />\n } @else {\n <div [etProvideColor]=\"errorColorTheme\" class=\"et-select-state et-select-state--error\" role=\"alert\">\n {{ error }}\n </div>\n }\n } @else if (!select.visibleItems().length) {\n @if (select.registeredEmptyTemplate(); as emptyTemplate) {\n <ng-template [ngTemplateOutlet]=\"emptyTemplate.templateRef\" />\n } @else {\n <div class=\"et-select-state et-select-state--empty\">No results</div>\n }\n }\n\n @if (select.hasMoreItems() && !select.loading()) {\n <button (click)=\"select.requestLoadMore()\" class=\"et-select-load-more\" tabindex=\"-1\" type=\"button\">\n <i class=\"et-select-load-more-icon\" etIcon=\"et-chevron\" aria-hidden=\"true\"></i>\n {{ loadMoreLabel() }}\n </button>\n }\n\n @if (select.allowAddNew() && !select.loading()) {\n <!-- pointer-only, like the load-more control \u2014 keyboard users reach the same flow\n through the consumer's own UI (e.g. a button next to the field) -->\n <button (click)=\"select.requestAddNew()\" class=\"et-select-add-new\" tabindex=\"-1\" type=\"button\">\n <i class=\"et-select-add-new-icon\" etIcon=\"et-plus\" aria-hidden=\"true\"></i>\n {{ addNewLabel() }}\n </button>\n }\n </div>\n </et-select-panel>\n</ng-template>\n", styles: ["@layer components{@property --et-select-arrow-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}et-select{display:block;flex:1;min-inline-size:0;color:inherit}et-select .et-select-trigger{display:flex;align-items:center;gap:6px;inline-size:100%;outline:none;color:inherit;min-inline-size:0;text-align:start;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation}et-select .et-select-trigger[data-disabled]{cursor:not-allowed}et-select .et-select-trigger[data-readonly]{cursor:default}et-select .et-select-trigger .et-select-trigger-content{display:flex;flex-wrap:wrap;align-items:center;gap:6px;flex:1;min-inline-size:0}et-select .et-select-trigger .et-select-trigger-content.et-select-trigger-content--stacked{display:grid;grid-template-columns:minmax(0,1fr)}et-select .et-select-trigger .et-select-trigger-content.et-select-trigger-content--stacked>*{grid-area:1 / 1}et-select .et-select-trigger .et-select-trigger-content.et-select-trigger-content--stacked:has(.et-select-value-custom) input[etselectsearch]{caret-color:transparent}et-select .et-select-trigger input[etselectsearch]{flex:1 1 60px;min-inline-size:60px;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);cursor:text}et-select .et-select-trigger input[etselectsearch]::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-select .et-select-trigger input[etselectsearch]:disabled{cursor:not-allowed}et-select .et-select-trigger:has(input[etselectsearch]) .et-select-value{flex:0 1 auto}et-select .et-select-value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-inline-size:0}et-select .et-select-value[data-placeholder]{color:color-mix(in srgb,currentColor 46%,transparent)}et-select .et-select-value-custom{display:flex;align-items:center;flex:1;min-inline-size:0}et-select .et-select-trigger-content:has(input[etselectsearch]) .et-select-value-custom{flex:0 1 auto}et-select .et-select-trigger-content:has(.et-select-value-custom) input[etselectsearch]::placeholder{color:transparent}et-select .et-select-chips{display:contents}et-select .et-select-trigger-spinner{flex:none;color:var(--et-surface-color-muted-solid, currentColor)}et-select .et-select-clear{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-select-arrow-size);block-size:var(--et-select-arrow-size);color:var(--et-surface-color-muted-solid, currentColor);border:none;background:transparent;padding:0;margin:0;cursor:pointer;appearance:none}et-select .et-select-clear:hover{color:var(--et-surface-color-solid, currentColor)}et-select .et-select-clear .et-icon{inline-size:calc(var(--et-select-arrow-size) - 4px);block-size:calc(var(--et-select-arrow-size) - 4px)}et-select .et-select-arrow{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-select-arrow-size);block-size:var(--et-select-arrow-size);color:var(--et-surface-color-muted-solid, currentColor);border:none;background:transparent;padding:0;margin:0;cursor:pointer;appearance:none}et-select .et-select-arrow .et-icon{inline-size:100%;block-size:100%;rotate:180deg}}\n"], dependencies: [{ kind: "directive", type: SelectTriggerDirective, selector: "[etSelectTrigger]", exportAs: ["etSelectTrigger"] }, { kind: "directive", type: SelectSurfaceDirective, selector: "ng-template[etSelectSurface]", exportAs: ["etSelectSurface"] }, { kind: "component", type: SelectPanelComponent, selector: "et-select-panel" }, { kind: "component", type: SelectOptionComponent, selector: "et-select-option" }, { kind: "component", type: SelectVirtualOptionComponent, selector: "et-select-virtual-option" }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ChipComponent, selector: "et-chip" }, { kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }, { kind: "directive", type: ProvideColorDirective, selector: "[etProvideColor]", inputs: ["etProvideColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
21773
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: SelectComponent, isStandalone: true, selector: "et-select", inputs: { loadMoreLabel: { classPropertyName: "loadMoreLabel", publicName: "loadMoreLabel", isSignal: true, isRequired: false, transformFunction: null }, addNewLabel: { classPropertyName: "addNewLabel", publicName: "addNewLabel", isSignal: true, isRequired: false, transformFunction: null }, createLabel: { classPropertyName: "createLabel", publicName: "createLabel", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-select" }, providers: [provideIcons(CHEVRON_ICON, TIMES_ICON, PLUS_ICON)], hostDirectives: [{ directive: SelectDirective, inputs: ["value", "value", "touched", "touched", "open", "open", "multiple", "multiple", "placeholder", "placeholder", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name", "options", "options", "filterMode", "filterMode", "allowCustomValues", "allowCustomValues", "customValueSeparators", "customValueSeparators", "normalizeCustomValue", "normalizeCustomValue", "commitCustomValueOnClose", "commitCustomValueOnClose", "maxSelection", "maxSelection", "allowAddNew", "allowAddNew", "loading", "loading", "error", "error", "hasMoreItems", "hasMoreItems"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange", "openChange", "openChange", "queryChange", "queryChange", "loadMore", "loadMore", "addNew", "addNew"] }, { directive: i1.ColorInteractiveDirective }], ngImport: i0, template: "<!-- a div, not a <button>: chips carry remove buttons and buttons cannot nest.\n The trigger directive manages tabindex/aria-disabled for non-button hosts. -->\n<div class=\"et-select-trigger\" etSelectTrigger>\n <div [class.et-select-trigger-content--stacked]=\"stackedValue()\" class=\"et-select-trigger-content\">\n @if (select.registeredValueTemplate(); as valueTemplate) {\n @if (showCustomValue()) {\n <div class=\"et-select-value-custom\">\n <ng-template [ngTemplateOutlet]=\"valueTemplate.templateRef\" [ngTemplateOutletContext]=\"valueContext()\" />\n </div>\n }\n } @else if (select.multiple() && select.selectedEntries().length) {\n <!-- display: contents \u2014 the chips share the trigger's wrapping flex flow with the\n inline search input, tag-input style -->\n <!-- readonly is not disabled: the chips keep their normal look, they just lose the\n remove affordance -->\n <div class=\"et-select-chips\">\n @for (entry of select.selectedEntries(); track entry.value) {\n <et-chip\n [disabled]=\"select.disabled()\"\n [removable]=\"!select.readonly() && !select.disabled()\"\n (remove)=\"select.deselectValue(entry.value)\"\n >\n {{ entry.label }}\n </et-chip>\n }\n </div>\n }\n\n @if (showValueLabel()) {\n <span [attr.data-placeholder]=\"!select.hasValue() || null\" class=\"et-select-value\">\n {{ select.displayValue() ?? select.placeholder() }}\n </span>\n }\n\n <!-- combobox pattern: the search input sits inline in the field, not in the panel -->\n <ng-content select=\"input[etSelectSearch]\" />\n </div>\n\n <!-- async option state, surfaced in the field itself (mirrors the menu's search spinner) \u2014\n only while the panel is closed; open, the panel's loading row is the single spinner -->\n @if (select.loading() && !select.open()) {\n <et-spinner class=\"et-select-trigger-spinner\" diameter=\"16\" strokeWidth=\"2\" />\n }\n\n @if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear via Backspace / erasing -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n class=\"et-select-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n }\n\n <!-- pointer-only affordance (keyboard users close via Escape) \u2014 kept out of the tab order -->\n <button\n [disabled]=\"select.disabled()\"\n (click)=\"handleArrowClick($event)\"\n class=\"et-select-arrow\"\n aria-hidden=\"true\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-chevron\"></i>\n </button>\n</div>\n\n<ng-template #optionContent>\n <ng-content />\n</ng-template>\n\n@if (!select.isMounted()) {\n <!-- keeps the projected options rendered (and their bindings live) while the panel is\n closed, so the trigger can resolve a preselected value's label and closed typeahead\n works \u2014 the same template moves into the overlay while it is open -->\n <div class=\"et-select-detached-options\" aria-hidden=\"true\" hidden>\n <ng-template [ngTemplateOutlet]=\"optionContent\" />\n </div>\n}\n\n<ng-template etSelectSurface>\n <et-select-panel>\n @if (select.options()) {\n <!-- data-driven mode: the select owns the option rows and windows their rendering \u2014\n only rows near the viewport exist in the DOM; the block paddings stand in for the\n scroll height of everything outside the window -->\n <div\n [style.padding-block-start.px]=\"select.virtualWindow.paddingTop()\"\n [style.padding-block-end.px]=\"select.virtualWindow.paddingBottom()\"\n class=\"et-select-virtual-options\"\n role=\"none\"\n >\n @for (item of select.virtualizedItems(); track item) {\n <et-select-virtual-option [item]=\"item\" />\n }\n </div>\n }\n\n <ng-template [ngTemplateOutlet]=\"optionContent\" />\n\n <!-- a real option (not an action row like add-new): it takes part in virtual focus, so\n Enter commits it and it is keyboard-reachable while options still match the query.\n Its label is the candidate itself \u2014 that is what commits and what the label cache\n stores; the \"Create\" prefix is display-only. -->\n @if (select.customValueCandidate(); as candidate) {\n <et-select-option\n [value]=\"candidate\"\n [label]=\"candidate\"\n [customValueOption]=\"true\"\n class=\"et-select-create-option\"\n >\n <i class=\"et-select-create-option-icon\" etIcon=\"et-plus\" aria-hidden=\"true\"></i>\n {{ createLabel() }} \u201C{{ candidate }}\u201D\n </et-select-option>\n }\n\n <!-- state rows and action buttons are NOT options \u2014 projected outside the listbox element\n (display: contents, so they still flow within the scrolling panel) -->\n <div class=\"et-select-panel-extras\" etSelectPanelExtras>\n @if (select.loading()) {\n @if (select.registeredLoadingTemplate(); as loadingTemplate) {\n <ng-template [ngTemplateOutlet]=\"loadingTemplate.templateRef\" />\n } @else {\n <div class=\"et-select-state et-select-state--loading\">\n <et-spinner class=\"et-select-state-spinner\" diameter=\"16\" strokeWidth=\"2\" />\n Loading\u2026\n </div>\n }\n } @else if (select.error(); as error) {\n @if (select.registeredErrorTemplate(); as errorTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"errorTemplate.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: error }\"\n />\n } @else {\n <div [etProvideColor]=\"errorColorTheme\" class=\"et-select-state et-select-state--error\" role=\"alert\">\n {{ error }}\n </div>\n }\n } @else if (!select.visibleItems().length) {\n @if (select.registeredEmptyTemplate(); as emptyTemplate) {\n <ng-template [ngTemplateOutlet]=\"emptyTemplate.templateRef\" />\n } @else {\n <div class=\"et-select-state et-select-state--empty\">No results</div>\n }\n }\n\n @if (select.hasMoreItems() && !select.loading()) {\n <button (click)=\"select.requestLoadMore()\" class=\"et-select-load-more\" tabindex=\"-1\" type=\"button\">\n <i class=\"et-select-load-more-icon\" etIcon=\"et-chevron\" aria-hidden=\"true\"></i>\n {{ loadMoreLabel() }}\n </button>\n }\n\n @if (select.allowAddNew() && !select.loading()) {\n <!-- pointer-only, like the load-more control \u2014 keyboard users reach the same flow\n through the consumer's own UI (e.g. a button next to the field) -->\n <button (click)=\"select.requestAddNew()\" class=\"et-select-add-new\" tabindex=\"-1\" type=\"button\">\n <i class=\"et-select-add-new-icon\" etIcon=\"et-plus\" aria-hidden=\"true\"></i>\n {{ addNewLabel() }}\n </button>\n }\n </div>\n </et-select-panel>\n</ng-template>\n", styles: ["@layer components{@property --et-select-arrow-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}et-select{display:block;flex:1;min-inline-size:0;color:inherit}et-select .et-select-trigger{display:flex;align-items:center;gap:6px;inline-size:100%;outline:none;color:inherit;min-inline-size:0;text-align:start;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation}et-select .et-select-trigger[data-disabled]{cursor:not-allowed}et-select .et-select-trigger[data-readonly]{cursor:default}et-select .et-select-trigger .et-select-trigger-content{display:flex;flex-wrap:wrap;align-items:center;gap:6px;flex:1;min-inline-size:0}et-select .et-select-trigger .et-select-trigger-content.et-select-trigger-content--stacked{display:grid;grid-template-columns:minmax(0,1fr)}et-select .et-select-trigger .et-select-trigger-content.et-select-trigger-content--stacked>*{grid-area:1 / 1}et-select .et-select-trigger .et-select-trigger-content.et-select-trigger-content--stacked:has(.et-select-value-custom) input[etselectsearch]{caret-color:transparent}et-select .et-select-trigger input[etselectsearch]{flex:1 1 60px;min-inline-size:60px;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);cursor:text}et-select .et-select-trigger input[etselectsearch]::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-select .et-select-trigger input[etselectsearch]:disabled{cursor:not-allowed}et-select .et-select-trigger:has(input[etselectsearch]) .et-select-value{flex:0 1 auto}et-select .et-select-value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-inline-size:0}et-select .et-select-value[data-placeholder]{color:color-mix(in srgb,currentColor 46%,transparent)}et-select .et-select-value-custom{display:flex;align-items:center;flex:1;min-inline-size:0}et-select .et-select-trigger-content:has(input[etselectsearch]) .et-select-value-custom{flex:0 1 auto}et-select .et-select-trigger-content:has(.et-select-value-custom) input[etselectsearch]::placeholder{color:transparent}et-select .et-select-chips{display:contents}et-select .et-select-trigger-spinner{flex:none;color:var(--et-surface-color-muted-solid, currentColor)}et-select .et-select-clear{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-select-arrow-size);block-size:var(--et-select-arrow-size);color:var(--et-surface-color-muted-solid, currentColor);border:none;background:transparent;padding:0;margin:0;cursor:pointer;appearance:none}@media(hover:hover){et-select .et-select-clear:hover{color:var(--et-surface-color-solid, currentColor)}}et-select .et-select-clear .et-icon{inline-size:calc(var(--et-select-arrow-size) - 4px);block-size:calc(var(--et-select-arrow-size) - 4px)}et-select .et-select-arrow{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-select-arrow-size);block-size:var(--et-select-arrow-size);color:var(--et-surface-color-muted-solid, currentColor);border:none;background:transparent;padding:0;margin:0;cursor:pointer;appearance:none}et-select .et-select-arrow .et-icon{inline-size:100%;block-size:100%;rotate:180deg}}\n"], dependencies: [{ kind: "directive", type: SelectTriggerDirective, selector: "[etSelectTrigger]", exportAs: ["etSelectTrigger"] }, { kind: "directive", type: SelectSurfaceDirective, selector: "ng-template[etSelectSurface]", exportAs: ["etSelectSurface"] }, { kind: "component", type: SelectPanelComponent, selector: "et-select-panel" }, { kind: "component", type: SelectOptionComponent, selector: "et-select-option" }, { kind: "component", type: SelectVirtualOptionComponent, selector: "et-select-virtual-option" }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ChipComponent, selector: "et-chip" }, { kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }, { kind: "directive", type: ProvideColorDirective, selector: "[etProvideColor]", inputs: ["etProvideColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
21703
21774
  }
21704
21775
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectComponent, decorators: [{
21705
21776
  type: Component,
@@ -21741,12 +21812,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
21741
21812
  'error',
21742
21813
  'hasMoreItems',
21743
21814
  ],
21744
- outputs: ['valueChange', 'touchedChange', 'openChange', 'queryChange', 'loadMoreRequested', 'addNewRequested'],
21815
+ outputs: ['valueChange', 'touchedChange', 'openChange', 'queryChange', 'loadMore', 'addNew'],
21745
21816
  },
21746
21817
  ColorInteractiveDirective,
21747
21818
  ], host: {
21748
21819
  class: 'et-select',
21749
- }, template: "<!-- a div, not a <button>: chips carry remove buttons and buttons cannot nest.\n The trigger directive manages tabindex/aria-disabled for non-button hosts. -->\n<div class=\"et-select-trigger\" etSelectTrigger>\n <div [class.et-select-trigger-content--stacked]=\"stackedValue()\" class=\"et-select-trigger-content\">\n @if (select.registeredValueTemplate(); as valueTemplate) {\n @if (showCustomValue()) {\n <div class=\"et-select-value-custom\">\n <ng-template [ngTemplateOutlet]=\"valueTemplate.templateRef\" [ngTemplateOutletContext]=\"valueContext()\" />\n </div>\n }\n } @else if (select.multiple() && select.selectedEntries().length) {\n <!-- display: contents \u2014 the chips share the trigger's wrapping flex flow with the\n inline search input, tag-input style -->\n <!-- readonly is not disabled: the chips keep their normal look, they just lose the\n remove affordance -->\n <div class=\"et-select-chips\">\n @for (entry of select.selectedEntries(); track entry.value) {\n <et-chip\n [disabled]=\"select.disabled()\"\n [removable]=\"!select.readonly() && !select.disabled()\"\n (remove)=\"select.deselectValue(entry.value)\"\n >\n {{ entry.label }}\n </et-chip>\n }\n </div>\n }\n\n @if (showValueLabel()) {\n <span [attr.data-placeholder]=\"!select.hasValue() || null\" class=\"et-select-value\">\n {{ select.displayValue() ?? select.placeholder() }}\n </span>\n }\n\n <!-- combobox pattern: the search input sits inline in the field, not in the panel -->\n <ng-content select=\"input[etSelectSearch]\" />\n </div>\n\n <!-- async option state, surfaced in the field itself (mirrors the menu's search spinner) \u2014\n only while the panel is closed; open, the panel's loading row is the single spinner -->\n @if (select.loading() && !select.open()) {\n <et-spinner class=\"et-select-trigger-spinner\" diameter=\"16\" strokeWidth=\"2\" />\n }\n\n @if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear via Backspace / erasing -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n class=\"et-select-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n }\n\n <!-- pointer-only affordance (keyboard users close via Escape) \u2014 kept out of the tab order -->\n <button\n [disabled]=\"select.disabled()\"\n (click)=\"handleArrowClick($event)\"\n class=\"et-select-arrow\"\n aria-hidden=\"true\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-chevron\"></i>\n </button>\n</div>\n\n<ng-template #optionContent>\n <ng-content />\n</ng-template>\n\n@if (!select.isMounted()) {\n <!-- keeps the projected options rendered (and their bindings live) while the panel is\n closed, so the trigger can resolve a preselected value's label and closed typeahead\n works \u2014 the same template moves into the overlay while it is open -->\n <div class=\"et-select-detached-options\" aria-hidden=\"true\" hidden>\n <ng-template [ngTemplateOutlet]=\"optionContent\" />\n </div>\n}\n\n<ng-template etSelectSurface>\n <et-select-panel>\n @if (select.options()) {\n <!-- data-driven mode: the select owns the option rows and windows their rendering \u2014\n only rows near the viewport exist in the DOM; the block paddings stand in for the\n scroll height of everything outside the window -->\n <div\n [style.padding-block-start.px]=\"select.virtualWindow.paddingTop()\"\n [style.padding-block-end.px]=\"select.virtualWindow.paddingBottom()\"\n class=\"et-select-virtual-options\"\n role=\"none\"\n >\n @for (item of select.virtualizedItems(); track item) {\n <et-select-virtual-option [item]=\"item\" />\n }\n </div>\n }\n\n <ng-template [ngTemplateOutlet]=\"optionContent\" />\n\n <!-- a real option (not an action row like add-new): it takes part in virtual focus, so\n Enter commits it and it is keyboard-reachable while options still match the query.\n Its label is the candidate itself \u2014 that is what commits and what the label cache\n stores; the \"Create\" prefix is display-only. -->\n @if (select.customValueCandidate(); as candidate) {\n <et-select-option\n [value]=\"candidate\"\n [label]=\"candidate\"\n [customValueOption]=\"true\"\n class=\"et-select-create-option\"\n >\n <i class=\"et-select-create-option-icon\" etIcon=\"et-plus\" aria-hidden=\"true\"></i>\n {{ createLabel() }} \u201C{{ candidate }}\u201D\n </et-select-option>\n }\n\n <!-- state rows and action buttons are NOT options \u2014 projected outside the listbox element\n (display: contents, so they still flow within the scrolling panel) -->\n <div class=\"et-select-panel-extras\" etSelectPanelExtras>\n @if (select.loading()) {\n @if (select.registeredLoadingTemplate(); as loadingTemplate) {\n <ng-template [ngTemplateOutlet]=\"loadingTemplate.templateRef\" />\n } @else {\n <div class=\"et-select-state et-select-state--loading\">\n <et-spinner class=\"et-select-state-spinner\" diameter=\"16\" strokeWidth=\"2\" />\n Loading\u2026\n </div>\n }\n } @else if (select.error(); as error) {\n @if (select.registeredErrorTemplate(); as errorTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"errorTemplate.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: error }\"\n />\n } @else {\n <div [etProvideColor]=\"errorColorTheme\" class=\"et-select-state et-select-state--error\" role=\"alert\">\n {{ error }}\n </div>\n }\n } @else if (!select.visibleItems().length) {\n @if (select.registeredEmptyTemplate(); as emptyTemplate) {\n <ng-template [ngTemplateOutlet]=\"emptyTemplate.templateRef\" />\n } @else {\n <div class=\"et-select-state et-select-state--empty\">No results</div>\n }\n }\n\n @if (select.hasMoreItems() && !select.loading()) {\n <button (click)=\"select.requestLoadMore()\" class=\"et-select-load-more\" tabindex=\"-1\" type=\"button\">\n <i class=\"et-select-load-more-icon\" etIcon=\"et-chevron\" aria-hidden=\"true\"></i>\n {{ loadMoreLabel() }}\n </button>\n }\n\n @if (select.allowAddNew() && !select.loading()) {\n <!-- pointer-only, like the load-more control \u2014 keyboard users reach the same flow\n through the consumer's own UI (e.g. a button next to the field) -->\n <button (click)=\"select.requestAddNew()\" class=\"et-select-add-new\" tabindex=\"-1\" type=\"button\">\n <i class=\"et-select-add-new-icon\" etIcon=\"et-plus\" aria-hidden=\"true\"></i>\n {{ addNewLabel() }}\n </button>\n }\n </div>\n </et-select-panel>\n</ng-template>\n", styles: ["@layer components{@property --et-select-arrow-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}et-select{display:block;flex:1;min-inline-size:0;color:inherit}et-select .et-select-trigger{display:flex;align-items:center;gap:6px;inline-size:100%;outline:none;color:inherit;min-inline-size:0;text-align:start;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation}et-select .et-select-trigger[data-disabled]{cursor:not-allowed}et-select .et-select-trigger[data-readonly]{cursor:default}et-select .et-select-trigger .et-select-trigger-content{display:flex;flex-wrap:wrap;align-items:center;gap:6px;flex:1;min-inline-size:0}et-select .et-select-trigger .et-select-trigger-content.et-select-trigger-content--stacked{display:grid;grid-template-columns:minmax(0,1fr)}et-select .et-select-trigger .et-select-trigger-content.et-select-trigger-content--stacked>*{grid-area:1 / 1}et-select .et-select-trigger .et-select-trigger-content.et-select-trigger-content--stacked:has(.et-select-value-custom) input[etselectsearch]{caret-color:transparent}et-select .et-select-trigger input[etselectsearch]{flex:1 1 60px;min-inline-size:60px;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);cursor:text}et-select .et-select-trigger input[etselectsearch]::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-select .et-select-trigger input[etselectsearch]:disabled{cursor:not-allowed}et-select .et-select-trigger:has(input[etselectsearch]) .et-select-value{flex:0 1 auto}et-select .et-select-value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-inline-size:0}et-select .et-select-value[data-placeholder]{color:color-mix(in srgb,currentColor 46%,transparent)}et-select .et-select-value-custom{display:flex;align-items:center;flex:1;min-inline-size:0}et-select .et-select-trigger-content:has(input[etselectsearch]) .et-select-value-custom{flex:0 1 auto}et-select .et-select-trigger-content:has(.et-select-value-custom) input[etselectsearch]::placeholder{color:transparent}et-select .et-select-chips{display:contents}et-select .et-select-trigger-spinner{flex:none;color:var(--et-surface-color-muted-solid, currentColor)}et-select .et-select-clear{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-select-arrow-size);block-size:var(--et-select-arrow-size);color:var(--et-surface-color-muted-solid, currentColor);border:none;background:transparent;padding:0;margin:0;cursor:pointer;appearance:none}et-select .et-select-clear:hover{color:var(--et-surface-color-solid, currentColor)}et-select .et-select-clear .et-icon{inline-size:calc(var(--et-select-arrow-size) - 4px);block-size:calc(var(--et-select-arrow-size) - 4px)}et-select .et-select-arrow{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-select-arrow-size);block-size:var(--et-select-arrow-size);color:var(--et-surface-color-muted-solid, currentColor);border:none;background:transparent;padding:0;margin:0;cursor:pointer;appearance:none}et-select .et-select-arrow .et-icon{inline-size:100%;block-size:100%;rotate:180deg}}\n"] }]
21820
+ }, template: "<!-- a div, not a <button>: chips carry remove buttons and buttons cannot nest.\n The trigger directive manages tabindex/aria-disabled for non-button hosts. -->\n<div class=\"et-select-trigger\" etSelectTrigger>\n <div [class.et-select-trigger-content--stacked]=\"stackedValue()\" class=\"et-select-trigger-content\">\n @if (select.registeredValueTemplate(); as valueTemplate) {\n @if (showCustomValue()) {\n <div class=\"et-select-value-custom\">\n <ng-template [ngTemplateOutlet]=\"valueTemplate.templateRef\" [ngTemplateOutletContext]=\"valueContext()\" />\n </div>\n }\n } @else if (select.multiple() && select.selectedEntries().length) {\n <!-- display: contents \u2014 the chips share the trigger's wrapping flex flow with the\n inline search input, tag-input style -->\n <!-- readonly is not disabled: the chips keep their normal look, they just lose the\n remove affordance -->\n <div class=\"et-select-chips\">\n @for (entry of select.selectedEntries(); track entry.value) {\n <et-chip\n [disabled]=\"select.disabled()\"\n [removable]=\"!select.readonly() && !select.disabled()\"\n (remove)=\"select.deselectValue(entry.value)\"\n >\n {{ entry.label }}\n </et-chip>\n }\n </div>\n }\n\n @if (showValueLabel()) {\n <span [attr.data-placeholder]=\"!select.hasValue() || null\" class=\"et-select-value\">\n {{ select.displayValue() ?? select.placeholder() }}\n </span>\n }\n\n <!-- combobox pattern: the search input sits inline in the field, not in the panel -->\n <ng-content select=\"input[etSelectSearch]\" />\n </div>\n\n <!-- async option state, surfaced in the field itself (mirrors the menu's search spinner) \u2014\n only while the panel is closed; open, the panel's loading row is the single spinner -->\n @if (select.loading() && !select.open()) {\n <et-spinner class=\"et-select-trigger-spinner\" diameter=\"16\" strokeWidth=\"2\" />\n }\n\n @if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear via Backspace / erasing -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n class=\"et-select-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n }\n\n <!-- pointer-only affordance (keyboard users close via Escape) \u2014 kept out of the tab order -->\n <button\n [disabled]=\"select.disabled()\"\n (click)=\"handleArrowClick($event)\"\n class=\"et-select-arrow\"\n aria-hidden=\"true\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-chevron\"></i>\n </button>\n</div>\n\n<ng-template #optionContent>\n <ng-content />\n</ng-template>\n\n@if (!select.isMounted()) {\n <!-- keeps the projected options rendered (and their bindings live) while the panel is\n closed, so the trigger can resolve a preselected value's label and closed typeahead\n works \u2014 the same template moves into the overlay while it is open -->\n <div class=\"et-select-detached-options\" aria-hidden=\"true\" hidden>\n <ng-template [ngTemplateOutlet]=\"optionContent\" />\n </div>\n}\n\n<ng-template etSelectSurface>\n <et-select-panel>\n @if (select.options()) {\n <!-- data-driven mode: the select owns the option rows and windows their rendering \u2014\n only rows near the viewport exist in the DOM; the block paddings stand in for the\n scroll height of everything outside the window -->\n <div\n [style.padding-block-start.px]=\"select.virtualWindow.paddingTop()\"\n [style.padding-block-end.px]=\"select.virtualWindow.paddingBottom()\"\n class=\"et-select-virtual-options\"\n role=\"none\"\n >\n @for (item of select.virtualizedItems(); track item) {\n <et-select-virtual-option [item]=\"item\" />\n }\n </div>\n }\n\n <ng-template [ngTemplateOutlet]=\"optionContent\" />\n\n <!-- a real option (not an action row like add-new): it takes part in virtual focus, so\n Enter commits it and it is keyboard-reachable while options still match the query.\n Its label is the candidate itself \u2014 that is what commits and what the label cache\n stores; the \"Create\" prefix is display-only. -->\n @if (select.customValueCandidate(); as candidate) {\n <et-select-option\n [value]=\"candidate\"\n [label]=\"candidate\"\n [customValueOption]=\"true\"\n class=\"et-select-create-option\"\n >\n <i class=\"et-select-create-option-icon\" etIcon=\"et-plus\" aria-hidden=\"true\"></i>\n {{ createLabel() }} \u201C{{ candidate }}\u201D\n </et-select-option>\n }\n\n <!-- state rows and action buttons are NOT options \u2014 projected outside the listbox element\n (display: contents, so they still flow within the scrolling panel) -->\n <div class=\"et-select-panel-extras\" etSelectPanelExtras>\n @if (select.loading()) {\n @if (select.registeredLoadingTemplate(); as loadingTemplate) {\n <ng-template [ngTemplateOutlet]=\"loadingTemplate.templateRef\" />\n } @else {\n <div class=\"et-select-state et-select-state--loading\">\n <et-spinner class=\"et-select-state-spinner\" diameter=\"16\" strokeWidth=\"2\" />\n Loading\u2026\n </div>\n }\n } @else if (select.error(); as error) {\n @if (select.registeredErrorTemplate(); as errorTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"errorTemplate.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: error }\"\n />\n } @else {\n <div [etProvideColor]=\"errorColorTheme\" class=\"et-select-state et-select-state--error\" role=\"alert\">\n {{ error }}\n </div>\n }\n } @else if (!select.visibleItems().length) {\n @if (select.registeredEmptyTemplate(); as emptyTemplate) {\n <ng-template [ngTemplateOutlet]=\"emptyTemplate.templateRef\" />\n } @else {\n <div class=\"et-select-state et-select-state--empty\">No results</div>\n }\n }\n\n @if (select.hasMoreItems() && !select.loading()) {\n <button (click)=\"select.requestLoadMore()\" class=\"et-select-load-more\" tabindex=\"-1\" type=\"button\">\n <i class=\"et-select-load-more-icon\" etIcon=\"et-chevron\" aria-hidden=\"true\"></i>\n {{ loadMoreLabel() }}\n </button>\n }\n\n @if (select.allowAddNew() && !select.loading()) {\n <!-- pointer-only, like the load-more control \u2014 keyboard users reach the same flow\n through the consumer's own UI (e.g. a button next to the field) -->\n <button (click)=\"select.requestAddNew()\" class=\"et-select-add-new\" tabindex=\"-1\" type=\"button\">\n <i class=\"et-select-add-new-icon\" etIcon=\"et-plus\" aria-hidden=\"true\"></i>\n {{ addNewLabel() }}\n </button>\n }\n </div>\n </et-select-panel>\n</ng-template>\n", styles: ["@layer components{@property --et-select-arrow-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}et-select{display:block;flex:1;min-inline-size:0;color:inherit}et-select .et-select-trigger{display:flex;align-items:center;gap:6px;inline-size:100%;outline:none;color:inherit;min-inline-size:0;text-align:start;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation}et-select .et-select-trigger[data-disabled]{cursor:not-allowed}et-select .et-select-trigger[data-readonly]{cursor:default}et-select .et-select-trigger .et-select-trigger-content{display:flex;flex-wrap:wrap;align-items:center;gap:6px;flex:1;min-inline-size:0}et-select .et-select-trigger .et-select-trigger-content.et-select-trigger-content--stacked{display:grid;grid-template-columns:minmax(0,1fr)}et-select .et-select-trigger .et-select-trigger-content.et-select-trigger-content--stacked>*{grid-area:1 / 1}et-select .et-select-trigger .et-select-trigger-content.et-select-trigger-content--stacked:has(.et-select-value-custom) input[etselectsearch]{caret-color:transparent}et-select .et-select-trigger input[etselectsearch]{flex:1 1 60px;min-inline-size:60px;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);cursor:text}et-select .et-select-trigger input[etselectsearch]::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-select .et-select-trigger input[etselectsearch]:disabled{cursor:not-allowed}et-select .et-select-trigger:has(input[etselectsearch]) .et-select-value{flex:0 1 auto}et-select .et-select-value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-inline-size:0}et-select .et-select-value[data-placeholder]{color:color-mix(in srgb,currentColor 46%,transparent)}et-select .et-select-value-custom{display:flex;align-items:center;flex:1;min-inline-size:0}et-select .et-select-trigger-content:has(input[etselectsearch]) .et-select-value-custom{flex:0 1 auto}et-select .et-select-trigger-content:has(.et-select-value-custom) input[etselectsearch]::placeholder{color:transparent}et-select .et-select-chips{display:contents}et-select .et-select-trigger-spinner{flex:none;color:var(--et-surface-color-muted-solid, currentColor)}et-select .et-select-clear{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-select-arrow-size);block-size:var(--et-select-arrow-size);color:var(--et-surface-color-muted-solid, currentColor);border:none;background:transparent;padding:0;margin:0;cursor:pointer;appearance:none}@media(hover:hover){et-select .et-select-clear:hover{color:var(--et-surface-color-solid, currentColor)}}et-select .et-select-clear .et-icon{inline-size:calc(var(--et-select-arrow-size) - 4px);block-size:calc(var(--et-select-arrow-size) - 4px)}et-select .et-select-arrow{display:flex;align-items:center;justify-content:center;flex:none;inline-size:var(--et-select-arrow-size);block-size:var(--et-select-arrow-size);color:var(--et-surface-color-muted-solid, currentColor);border:none;background:transparent;padding:0;margin:0;cursor:pointer;appearance:none}et-select .et-select-arrow .et-icon{inline-size:100%;block-size:100%;rotate:180deg}}\n"] }]
21750
21821
  }], propDecorators: { loadMoreLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadMoreLabel", required: false }] }], addNewLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "addNewLabel", required: false }] }], createLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "createLabel", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], clearLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearLabel", required: false }] }] } });
21751
21822
 
21752
21823
  const SELECT_IMPORTS = [
@@ -21827,7 +21898,7 @@ class PhoneInputComponent {
21827
21898
  }
21828
21899
  }
21829
21900
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: PhoneInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
21830
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: PhoneInputComponent, isStandalone: true, selector: "et-phone-input", inputs: { countryLabel: { classPropertyName: "countryLabel", publicName: "countryLabel", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-phone-input" }, providers: [provideIcons(TIMES_ICON)], hostDirectives: [{ directive: PhoneInputDirective, inputs: ["value", "value", "touched", "touched", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name", "placeholder", "placeholder", "defaultCountry", "defaultCountry", "preferredCountries", "preferredCountries"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange"] }, { directive: i1.ColorInteractiveDirective }], ngImport: i0, template: "<!-- headless select composition: compact flag trigger, searchable country panel -->\n<div\n [mirrorPanelWidth]=\"false\"\n [value]=\"phone.country()\"\n (valueChange)=\"handleCountryChange($event)\"\n class=\"et-phone-input-country\"\n etSelect\n>\n <button\n [attr.aria-label]=\"countryLabel()\"\n [disabled]=\"phone.disabled()\"\n class=\"et-phone-input-country-trigger\"\n etSelectTrigger\n type=\"button\"\n >\n <span class=\"et-phone-input-country-flag\" aria-hidden=\"true\">\n @if (phone.registeredFlagTemplate(); as flagTemplate) {\n <ng-template [ngTemplateOutlet]=\"flagTemplate.templateRef\" [ngTemplateOutletContext]=\"activeFlagContext()\" />\n } @else {\n {{ activeFlag() }}\n }\n </span>\n <span class=\"et-phone-input-dial-code\">+{{ phone.dialCode() }}</span>\n </button>\n\n <ng-template etSelectSurface let-select>\n <et-select-panel class=\"et-phone-input-country-panel\">\n <div class=\"et-phone-input-country-search\">\n <input etSelectSearch placeholder=\"Search countries\" />\n </div>\n\n <!-- the label carries the dial code too, so searching by \"+49\" / \"49\" works -->\n @for (country of countries(); track country.iso2) {\n <et-select-option [label]=\"country.name + ' +' + country.dialCode\" [value]=\"country.iso2\">\n <span class=\"et-phone-input-option-flag\" aria-hidden=\"true\">\n @if (phone.registeredFlagTemplate(); as flagTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"flagTemplate.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: country }\"\n />\n } @else {\n {{ country.flag }}\n }\n </span>\n <span class=\"et-phone-input-option-name\">{{ country.name }}</span>\n <span class=\"et-phone-input-option-dial\">+{{ country.dialCode }}</span>\n </et-select-option>\n }\n\n @if (!select.visibleItems().length) {\n <div class=\"et-select-state et-select-state--empty\">No countries found</div>\n }\n </et-select-panel>\n </ng-template>\n</div>\n\n<input class=\"et-phone-input-field\" etPhoneInputField />\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-phone-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n", styles: ["@layer components{et-phone-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-phone-input .et-phone-input-country-trigger{display:flex;align-items:center;gap:4px;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;margin:0;cursor:pointer;appearance:none;white-space:nowrap}et-phone-input .et-phone-input-country-trigger:disabled{cursor:not-allowed}et-phone-input .et-phone-input-country-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-phone-input .et-phone-input-country-flag{display:inline-flex;align-items:center}et-phone-input .et-phone-input-dial-code{color:var(--et-surface-color-muted-solid, currentColor);font-variant-numeric:tabular-nums}et-phone-input .et-phone-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-phone-input .et-phone-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-phone-input .et-phone-input-field:disabled{cursor:not-allowed}et-phone-input .et-phone-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-phone-input .et-phone-input-clear .et-icon{inline-size:16px;block-size:16px}et-phone-input .et-phone-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}.et-phone-input-country-panel{inline-size:min(320px,calc(100vw - 24px))}.et-phone-input-country-search{position:sticky;inset-block-start:calc(var(--et-select-panel-padding, 6px) * -1);margin-block-start:calc(var(--et-select-panel-padding, 6px) * -1);margin-inline:calc(var(--et-select-panel-padding, 6px) * -1);padding:var(--et-select-panel-padding, 6px);background:var(--et-surface-background-solid, rgb(32 32 32));z-index:1}.et-phone-input-country-search input[etselectsearch]{inline-size:100%;block-size:36px;box-sizing:border-box;padding-inline:10px;border-radius:6px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 6%,transparent);color:inherit;font:inherit;outline:none;caret-color:var(--et-theme-color-primary-solid, currentColor);transition:border-color .12s ease,background .12s ease}.et-phone-input-country-search input[etselectsearch]:focus-visible{border-color:var(--et-theme-color-primary-solid, rgb(255 255 255 / .3))}.et-phone-input-country-search input[etselectsearch]::placeholder{color:var(--et-surface-color-muted-solid, rgb(255 255 255 / .55))}.et-phone-input-country-panel .et-select-option-label{display:flex;align-items:center;gap:var(--et-select-option-gap, 8px);flex:1;min-inline-size:0}.et-phone-input-option-flag{flex:none;display:inline-flex;align-items:center;justify-content:center}.et-phone-input-option-name{flex:1;min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.et-phone-input-option-dial{flex:none;color:var(--et-surface-color-muted-solid, currentColor);font-variant-numeric:tabular-nums}.et-phone-input-country-flag :is(img,svg),.et-phone-input-option-flag :is(img,svg){display:block;inline-size:20px;block-size:auto}}\n"], dependencies: [{ kind: "component", type: SelectOptionComponent, selector: "et-select-option" }, { kind: "component", type: SelectPanelComponent, selector: "et-select-panel" }, { kind: "directive", type: SelectDirective, selector: "[etSelect]", inputs: ["value", "touched", "open", "multiple", "disabled", "readonly", "invalid", "errors", "required", "name", "placeholder", "options", "filterMode", "allowCustomValues", "customValueSeparators", "normalizeCustomValue", "commitCustomValueOnClose", "maxSelection", "allowAddNew", "loading", "error", "hasMoreItems", "mirrorPanelWidth"], outputs: ["valueChange", "touchedChange", "openChange", "queryChange", "loadMoreRequested", "addNewRequested"], exportAs: ["etSelect"] }, { kind: "directive", type: SelectTriggerDirective, selector: "[etSelectTrigger]", exportAs: ["etSelectTrigger"] }, { kind: "directive", type: SelectSurfaceDirective, selector: "ng-template[etSelectSurface]", exportAs: ["etSelectSurface"] }, { kind: "directive", type: SelectSearchDirective, selector: "input[etSelectSearch]", inputs: ["query"], outputs: ["queryChange"], exportAs: ["etSelectSearch"] }, { kind: "directive", type: PhoneInputFieldDirective, selector: "input[etPhoneInputField]", exportAs: ["etPhoneInputField"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], viewProviders: [{ provide: FORM_FIELD_TOKEN, useValue: null }], encapsulation: i0.ViewEncapsulation.None }); }
21901
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: PhoneInputComponent, isStandalone: true, selector: "et-phone-input", inputs: { countryLabel: { classPropertyName: "countryLabel", publicName: "countryLabel", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-phone-input" }, providers: [provideIcons(TIMES_ICON)], hostDirectives: [{ directive: PhoneInputDirective, inputs: ["value", "value", "touched", "touched", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name", "placeholder", "placeholder", "defaultCountry", "defaultCountry", "preferredCountries", "preferredCountries"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange"] }, { directive: i1.ColorInteractiveDirective }], ngImport: i0, template: "<!-- headless select composition: compact flag trigger, searchable country panel -->\n<div\n [mirrorPanelWidth]=\"false\"\n [value]=\"phone.country()\"\n (valueChange)=\"handleCountryChange($event)\"\n class=\"et-phone-input-country\"\n etSelect\n>\n <button\n [attr.aria-label]=\"countryLabel()\"\n [disabled]=\"phone.disabled()\"\n class=\"et-phone-input-country-trigger\"\n etSelectTrigger\n type=\"button\"\n >\n <span class=\"et-phone-input-country-flag\" aria-hidden=\"true\">\n @if (phone.registeredFlagTemplate(); as flagTemplate) {\n <ng-template [ngTemplateOutlet]=\"flagTemplate.templateRef\" [ngTemplateOutletContext]=\"activeFlagContext()\" />\n } @else {\n {{ activeFlag() }}\n }\n </span>\n <span class=\"et-phone-input-dial-code\">+{{ phone.dialCode() }}</span>\n </button>\n\n <ng-template etSelectSurface let-select>\n <et-select-panel class=\"et-phone-input-country-panel\">\n <div class=\"et-phone-input-country-search\">\n <input etSelectSearch placeholder=\"Search countries\" />\n </div>\n\n <!-- the label carries the dial code too, so searching by \"+49\" / \"49\" works -->\n @for (country of countries(); track country.iso2) {\n <et-select-option [label]=\"country.name + ' +' + country.dialCode\" [value]=\"country.iso2\">\n <span class=\"et-phone-input-option-flag\" aria-hidden=\"true\">\n @if (phone.registeredFlagTemplate(); as flagTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"flagTemplate.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: country }\"\n />\n } @else {\n {{ country.flag }}\n }\n </span>\n <span class=\"et-phone-input-option-name\">{{ country.name }}</span>\n <span class=\"et-phone-input-option-dial\">+{{ country.dialCode }}</span>\n </et-select-option>\n }\n\n @if (!select.visibleItems().length) {\n <div class=\"et-select-state et-select-state--empty\">No countries found</div>\n }\n </et-select-panel>\n </ng-template>\n</div>\n\n<input class=\"et-phone-input-field\" etPhoneInputField />\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-phone-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n", styles: ["@layer components{et-phone-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-phone-input .et-phone-input-country-trigger{display:flex;align-items:center;gap:4px;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;margin:0;cursor:pointer;appearance:none;white-space:nowrap}et-phone-input .et-phone-input-country-trigger:disabled{cursor:not-allowed}et-phone-input .et-phone-input-country-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-phone-input .et-phone-input-country-flag{display:inline-flex;align-items:center}et-phone-input .et-phone-input-dial-code{color:var(--et-surface-color-muted-solid, currentColor);font-variant-numeric:tabular-nums}et-phone-input .et-phone-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-phone-input .et-phone-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-phone-input .et-phone-input-field:disabled{cursor:not-allowed}et-phone-input .et-phone-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-phone-input .et-phone-input-clear .et-icon{inline-size:16px;block-size:16px}@media(hover:hover){et-phone-input .et-phone-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}}.et-phone-input-country-panel{inline-size:min(320px,calc(100vw - 24px))}.et-phone-input-country-search{position:sticky;inset-block-start:calc(var(--et-select-panel-padding, 6px) * -1);margin-block-start:calc(var(--et-select-panel-padding, 6px) * -1);margin-inline:calc(var(--et-select-panel-padding, 6px) * -1);padding:var(--et-select-panel-padding, 6px);background:var(--et-surface-background-solid, rgb(32 32 32));z-index:1}.et-phone-input-country-search input[etselectsearch]{inline-size:100%;block-size:36px;box-sizing:border-box;padding-inline:10px;border-radius:6px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 6%,transparent);color:inherit;font:inherit;outline:none;caret-color:var(--et-theme-color-primary-solid, currentColor);transition:border-color .12s ease,background .12s ease}.et-phone-input-country-search input[etselectsearch]:focus-visible{border-color:var(--et-theme-color-primary-solid, rgb(255 255 255 / .3))}.et-phone-input-country-search input[etselectsearch]::placeholder{color:var(--et-surface-color-muted-solid, rgb(255 255 255 / .55))}.et-phone-input-country-panel .et-select-option-label{display:flex;align-items:center;gap:var(--et-select-option-gap, 8px);flex:1;min-inline-size:0}.et-phone-input-option-flag{flex:none;display:inline-flex;align-items:center;justify-content:center}.et-phone-input-option-name{flex:1;min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.et-phone-input-option-dial{flex:none;color:var(--et-surface-color-muted-solid, currentColor);font-variant-numeric:tabular-nums}.et-phone-input-country-flag :is(img,svg),.et-phone-input-option-flag :is(img,svg){display:block;inline-size:20px;block-size:auto}}\n"], dependencies: [{ kind: "component", type: SelectOptionComponent, selector: "et-select-option" }, { kind: "component", type: SelectPanelComponent, selector: "et-select-panel" }, { kind: "directive", type: SelectDirective, selector: "[etSelect]", inputs: ["value", "touched", "open", "multiple", "disabled", "readonly", "invalid", "errors", "required", "name", "placeholder", "options", "filterMode", "allowCustomValues", "customValueSeparators", "normalizeCustomValue", "commitCustomValueOnClose", "maxSelection", "allowAddNew", "loading", "error", "hasMoreItems", "mirrorPanelWidth"], outputs: ["valueChange", "touchedChange", "openChange", "queryChange", "loadMore", "addNew"], exportAs: ["etSelect"] }, { kind: "directive", type: SelectTriggerDirective, selector: "[etSelectTrigger]", exportAs: ["etSelectTrigger"] }, { kind: "directive", type: SelectSurfaceDirective, selector: "ng-template[etSelectSurface]", exportAs: ["etSelectSurface"] }, { kind: "directive", type: SelectSearchDirective, selector: "input[etSelectSearch]", inputs: ["query"], outputs: ["queryChange"], exportAs: ["etSelectSearch"] }, { kind: "directive", type: PhoneInputFieldDirective, selector: "input[etPhoneInputField]", exportAs: ["etPhoneInputField"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], viewProviders: [{ provide: FORM_FIELD_TOKEN, useValue: null }], encapsulation: i0.ViewEncapsulation.None }); }
21831
21902
  }
21832
21903
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: PhoneInputComponent, decorators: [{
21833
21904
  type: Component,
@@ -21852,7 +21923,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
21852
21923
  ColorInteractiveDirective,
21853
21924
  ], host: {
21854
21925
  class: 'et-phone-input',
21855
- }, template: "<!-- headless select composition: compact flag trigger, searchable country panel -->\n<div\n [mirrorPanelWidth]=\"false\"\n [value]=\"phone.country()\"\n (valueChange)=\"handleCountryChange($event)\"\n class=\"et-phone-input-country\"\n etSelect\n>\n <button\n [attr.aria-label]=\"countryLabel()\"\n [disabled]=\"phone.disabled()\"\n class=\"et-phone-input-country-trigger\"\n etSelectTrigger\n type=\"button\"\n >\n <span class=\"et-phone-input-country-flag\" aria-hidden=\"true\">\n @if (phone.registeredFlagTemplate(); as flagTemplate) {\n <ng-template [ngTemplateOutlet]=\"flagTemplate.templateRef\" [ngTemplateOutletContext]=\"activeFlagContext()\" />\n } @else {\n {{ activeFlag() }}\n }\n </span>\n <span class=\"et-phone-input-dial-code\">+{{ phone.dialCode() }}</span>\n </button>\n\n <ng-template etSelectSurface let-select>\n <et-select-panel class=\"et-phone-input-country-panel\">\n <div class=\"et-phone-input-country-search\">\n <input etSelectSearch placeholder=\"Search countries\" />\n </div>\n\n <!-- the label carries the dial code too, so searching by \"+49\" / \"49\" works -->\n @for (country of countries(); track country.iso2) {\n <et-select-option [label]=\"country.name + ' +' + country.dialCode\" [value]=\"country.iso2\">\n <span class=\"et-phone-input-option-flag\" aria-hidden=\"true\">\n @if (phone.registeredFlagTemplate(); as flagTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"flagTemplate.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: country }\"\n />\n } @else {\n {{ country.flag }}\n }\n </span>\n <span class=\"et-phone-input-option-name\">{{ country.name }}</span>\n <span class=\"et-phone-input-option-dial\">+{{ country.dialCode }}</span>\n </et-select-option>\n }\n\n @if (!select.visibleItems().length) {\n <div class=\"et-select-state et-select-state--empty\">No countries found</div>\n }\n </et-select-panel>\n </ng-template>\n</div>\n\n<input class=\"et-phone-input-field\" etPhoneInputField />\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-phone-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n", styles: ["@layer components{et-phone-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-phone-input .et-phone-input-country-trigger{display:flex;align-items:center;gap:4px;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;margin:0;cursor:pointer;appearance:none;white-space:nowrap}et-phone-input .et-phone-input-country-trigger:disabled{cursor:not-allowed}et-phone-input .et-phone-input-country-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-phone-input .et-phone-input-country-flag{display:inline-flex;align-items:center}et-phone-input .et-phone-input-dial-code{color:var(--et-surface-color-muted-solid, currentColor);font-variant-numeric:tabular-nums}et-phone-input .et-phone-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-phone-input .et-phone-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-phone-input .et-phone-input-field:disabled{cursor:not-allowed}et-phone-input .et-phone-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-phone-input .et-phone-input-clear .et-icon{inline-size:16px;block-size:16px}et-phone-input .et-phone-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}.et-phone-input-country-panel{inline-size:min(320px,calc(100vw - 24px))}.et-phone-input-country-search{position:sticky;inset-block-start:calc(var(--et-select-panel-padding, 6px) * -1);margin-block-start:calc(var(--et-select-panel-padding, 6px) * -1);margin-inline:calc(var(--et-select-panel-padding, 6px) * -1);padding:var(--et-select-panel-padding, 6px);background:var(--et-surface-background-solid, rgb(32 32 32));z-index:1}.et-phone-input-country-search input[etselectsearch]{inline-size:100%;block-size:36px;box-sizing:border-box;padding-inline:10px;border-radius:6px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 6%,transparent);color:inherit;font:inherit;outline:none;caret-color:var(--et-theme-color-primary-solid, currentColor);transition:border-color .12s ease,background .12s ease}.et-phone-input-country-search input[etselectsearch]:focus-visible{border-color:var(--et-theme-color-primary-solid, rgb(255 255 255 / .3))}.et-phone-input-country-search input[etselectsearch]::placeholder{color:var(--et-surface-color-muted-solid, rgb(255 255 255 / .55))}.et-phone-input-country-panel .et-select-option-label{display:flex;align-items:center;gap:var(--et-select-option-gap, 8px);flex:1;min-inline-size:0}.et-phone-input-option-flag{flex:none;display:inline-flex;align-items:center;justify-content:center}.et-phone-input-option-name{flex:1;min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.et-phone-input-option-dial{flex:none;color:var(--et-surface-color-muted-solid, currentColor);font-variant-numeric:tabular-nums}.et-phone-input-country-flag :is(img,svg),.et-phone-input-option-flag :is(img,svg){display:block;inline-size:20px;block-size:auto}}\n"] }]
21926
+ }, template: "<!-- headless select composition: compact flag trigger, searchable country panel -->\n<div\n [mirrorPanelWidth]=\"false\"\n [value]=\"phone.country()\"\n (valueChange)=\"handleCountryChange($event)\"\n class=\"et-phone-input-country\"\n etSelect\n>\n <button\n [attr.aria-label]=\"countryLabel()\"\n [disabled]=\"phone.disabled()\"\n class=\"et-phone-input-country-trigger\"\n etSelectTrigger\n type=\"button\"\n >\n <span class=\"et-phone-input-country-flag\" aria-hidden=\"true\">\n @if (phone.registeredFlagTemplate(); as flagTemplate) {\n <ng-template [ngTemplateOutlet]=\"flagTemplate.templateRef\" [ngTemplateOutletContext]=\"activeFlagContext()\" />\n } @else {\n {{ activeFlag() }}\n }\n </span>\n <span class=\"et-phone-input-dial-code\">+{{ phone.dialCode() }}</span>\n </button>\n\n <ng-template etSelectSurface let-select>\n <et-select-panel class=\"et-phone-input-country-panel\">\n <div class=\"et-phone-input-country-search\">\n <input etSelectSearch placeholder=\"Search countries\" />\n </div>\n\n <!-- the label carries the dial code too, so searching by \"+49\" / \"49\" works -->\n @for (country of countries(); track country.iso2) {\n <et-select-option [label]=\"country.name + ' +' + country.dialCode\" [value]=\"country.iso2\">\n <span class=\"et-phone-input-option-flag\" aria-hidden=\"true\">\n @if (phone.registeredFlagTemplate(); as flagTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"flagTemplate.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: country }\"\n />\n } @else {\n {{ country.flag }}\n }\n </span>\n <span class=\"et-phone-input-option-name\">{{ country.name }}</span>\n <span class=\"et-phone-input-option-dial\">+{{ country.dialCode }}</span>\n </et-select-option>\n }\n\n @if (!select.visibleItems().length) {\n <div class=\"et-select-state et-select-state--empty\">No countries found</div>\n }\n </et-select-panel>\n </ng-template>\n</div>\n\n<input class=\"et-phone-input-field\" etPhoneInputField />\n\n@if (showClear()) {\n <!-- pointer-only, out of the tab order \u2014 keyboard users clear by erasing the text.\n mousedown is prevented so the field keeps focus (its blur would unmount this\n button before the click could land) -->\n <button\n [attr.aria-label]=\"clearLabel()\"\n (click)=\"handleClearClick($event)\"\n (mousedown)=\"$event.preventDefault()\"\n class=\"et-phone-input-clear\"\n tabindex=\"-1\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n}\n", styles: ["@layer components{et-phone-input{display:flex;align-items:center;gap:8px;flex:1;min-inline-size:0;color:inherit}et-phone-input .et-phone-input-country-trigger{display:flex;align-items:center;gap:4px;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;margin:0;cursor:pointer;appearance:none;white-space:nowrap}et-phone-input .et-phone-input-country-trigger:disabled{cursor:not-allowed}et-phone-input .et-phone-input-country-trigger:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px;border-radius:4px}et-phone-input .et-phone-input-country-flag{display:inline-flex;align-items:center}et-phone-input .et-phone-input-dial-code{color:var(--et-surface-color-muted-solid, currentColor);font-variant-numeric:tabular-nums}et-phone-input .et-phone-input-field{flex:1;min-inline-size:0;border:none;outline:none;background:transparent;font:inherit;color:inherit;padding:0;caret-color:var(--et-theme-color-primary-solid, currentColor);font-variant-numeric:tabular-nums}et-phone-input .et-phone-input-field::placeholder{color:color-mix(in srgb,currentColor 46%,transparent)}et-phone-input .et-phone-input-field:disabled{cursor:not-allowed}et-phone-input .et-phone-input-clear{display:inline-flex;align-items:center;justify-content:center;flex:none;border:none;background:transparent;color:var(--et-surface-color-muted-solid, currentColor);padding:0;margin:0;cursor:pointer;appearance:none}et-phone-input .et-phone-input-clear .et-icon{inline-size:16px;block-size:16px}@media(hover:hover){et-phone-input .et-phone-input-clear:hover{color:var(--et-surface-color-solid, currentColor)}}.et-phone-input-country-panel{inline-size:min(320px,calc(100vw - 24px))}.et-phone-input-country-search{position:sticky;inset-block-start:calc(var(--et-select-panel-padding, 6px) * -1);margin-block-start:calc(var(--et-select-panel-padding, 6px) * -1);margin-inline:calc(var(--et-select-panel-padding, 6px) * -1);padding:var(--et-select-panel-padding, 6px);background:var(--et-surface-background-solid, rgb(32 32 32));z-index:1}.et-phone-input-country-search input[etselectsearch]{inline-size:100%;block-size:36px;box-sizing:border-box;padding-inline:10px;border-radius:6px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 6%,transparent);color:inherit;font:inherit;outline:none;caret-color:var(--et-theme-color-primary-solid, currentColor);transition:border-color .12s ease,background .12s ease}.et-phone-input-country-search input[etselectsearch]:focus-visible{border-color:var(--et-theme-color-primary-solid, rgb(255 255 255 / .3))}.et-phone-input-country-search input[etselectsearch]::placeholder{color:var(--et-surface-color-muted-solid, rgb(255 255 255 / .55))}.et-phone-input-country-panel .et-select-option-label{display:flex;align-items:center;gap:var(--et-select-option-gap, 8px);flex:1;min-inline-size:0}.et-phone-input-option-flag{flex:none;display:inline-flex;align-items:center;justify-content:center}.et-phone-input-option-name{flex:1;min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.et-phone-input-option-dial{flex:none;color:var(--et-surface-color-muted-solid, currentColor);font-variant-numeric:tabular-nums}.et-phone-input-country-flag :is(img,svg),.et-phone-input-option-flag :is(img,svg){display:block;inline-size:20px;block-size:auto}}\n"] }]
21856
21927
  }], propDecorators: { countryLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "countryLabel", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], clearLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearLabel", required: false }] }] } });
21857
21928
 
21858
21929
  const PHONE_INPUT_IMPORTS = [
@@ -22236,7 +22307,7 @@ class CheckboxOptionComponent {
22236
22307
  this.canAnimate = createCanAnimateSignal();
22237
22308
  }
22238
22309
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CheckboxOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
22239
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: CheckboxOptionComponent, isStandalone: true, selector: "et-checkbox-option", host: { properties: { "attr.data-can-animate": "canAnimate.state() || null" }, classAttribute: "et-checkbox-option" }, hostDirectives: [{ directive: SelectionOptionDirective, inputs: ["value", "value", "checked", "checked", "disabled", "disabled"], outputs: ["checkedChange", "checkedChange"] }, { directive: i1.ColorInteractiveDirective }], ngImport: i0, template: "<div class=\"et-checkbox-option-box\">\n <svg class=\"et-checkbox-option-check\" viewBox=\"0 0 12 10\" fill=\"none\">\n <path\n d=\"M1 5L4.5 8.5L11 1.5\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n</div>\n<div class=\"et-checkbox-option-content\">\n <span [attr.id]=\"optionDirective.labelId()\" class=\"et-checkbox-option-label\">\n <ng-content />\n </span>\n <ng-content select=\"et-description\" />\n</div>\n", styles: ["@layer components{@property --et-checkbox-option-size{syntax: \"<length>\"; inherits: true; initial-value: 20px;}@property --et-checkbox-option-border-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-checkbox-option-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-checkbox-option-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-checkbox-option-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}@property --et-checkbox-option-gap{syntax: \"<length>\"; inherits: true; initial-value: 10px;}et-checkbox-option{display:flex;align-items:flex-start;gap:var(--et-checkbox-option-gap);cursor:pointer;outline:none;-webkit-user-select:none;user-select:none}et-checkbox-option[data-readonly]{cursor:default}et-checkbox-option .et-checkbox-option-box{flex-shrink:0;inline-size:var(--et-checkbox-option-size);block-size:var(--et-checkbox-option-size);border-radius:var(--et-checkbox-option-border-radius);border:var(--et-checkbox-option-border-width) solid var(--_et-control-border, var(--et-surface-border-solid, currentColor));background-color:transparent;display:grid;place-items:center}et-checkbox-option .et-checkbox-option-check{inline-size:12px;block-size:10px;opacity:0;color:var(--et-theme-color-on-primary-solid, white)}et-checkbox-option .et-checkbox-option-check path{stroke-dasharray:15;stroke-dashoffset:15}et-checkbox-option .et-checkbox-option-content{display:flex;flex-direction:column;gap:2px;min-inline-size:0}et-checkbox-option .et-checkbox-option-label{font-size:14px;line-height:20px;color:var(--et-surface-color-solid, currentColor)}et-checkbox-option:hover:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]) .et-checkbox-option-box{border-color:var(--_et-control-border, var(--et-surface-interaction-hover-solid, currentColor));background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 8%,transparent)}et-checkbox-option:focus-visible .et-checkbox-option-box{border-color:var(--et-theme-color-primary-solid);outline:2px solid var(--et-theme-color-primary-solid);outline-offset:2px}et-checkbox-option:active:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-option-box{transform:scale(.92)}et-checkbox-option[aria-disabled=true]{opacity:var(--et-checkbox-option-opacity-disabled);pointer-events:none;cursor:default}et-checkbox-option[aria-disabled=true] .et-checkbox-option-label{color:var(--et-surface-interaction-disabled-solid, currentColor)}et-checkbox-option[aria-checked=true] .et-checkbox-option-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}et-checkbox-option[aria-checked=true] .et-checkbox-option-box .et-checkbox-option-check{opacity:1}et-checkbox-option[aria-checked=true] .et-checkbox-option-box .et-checkbox-option-check path{stroke-dashoffset:0}et-checkbox-option[data-can-animate] .et-checkbox-option-box{transition:border-color var(--et-checkbox-option-transition-duration) ease,background-color var(--et-checkbox-option-transition-duration) ease,transform var(--et-checkbox-option-transition-duration) ease}et-checkbox-option[data-can-animate] .et-checkbox-option-check{transition:opacity 0s calc(var(--et-checkbox-option-transition-duration) * 1.5)}et-checkbox-option[data-can-animate] .et-checkbox-option-check path{transition:stroke-dashoffset calc(var(--et-checkbox-option-transition-duration) * 1.5) ease}et-checkbox-option[data-can-animate][aria-checked=true] .et-checkbox-option-check{transition:opacity 0s 0s}@media(prefers-reduced-motion:reduce){et-checkbox-option{--et-checkbox-option-transition-duration: 1ms}}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
22310
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: CheckboxOptionComponent, isStandalone: true, selector: "et-checkbox-option", host: { properties: { "attr.data-can-animate": "canAnimate.state() || null" }, classAttribute: "et-checkbox-option" }, hostDirectives: [{ directive: SelectionOptionDirective, inputs: ["value", "value", "checked", "checked", "disabled", "disabled"], outputs: ["checkedChange", "checkedChange"] }, { directive: i1.ColorInteractiveDirective }], ngImport: i0, template: "<div class=\"et-checkbox-option-box\">\n <svg class=\"et-checkbox-option-check\" viewBox=\"0 0 12 10\" fill=\"none\">\n <path\n d=\"M1 5L4.5 8.5L11 1.5\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n</div>\n<div class=\"et-checkbox-option-content\">\n <span [attr.id]=\"optionDirective.labelId()\" class=\"et-checkbox-option-label\">\n <ng-content />\n </span>\n <ng-content select=\"et-description\" />\n</div>\n", styles: ["@layer components{@property --et-checkbox-option-size{syntax: \"<length>\"; inherits: true; initial-value: 20px;}@property --et-checkbox-option-border-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-checkbox-option-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-checkbox-option-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-checkbox-option-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}@property --et-checkbox-option-gap{syntax: \"<length>\"; inherits: true; initial-value: 10px;}et-checkbox-option{display:flex;align-items:flex-start;gap:var(--et-checkbox-option-gap);cursor:pointer;outline:none;-webkit-user-select:none;user-select:none}et-checkbox-option[data-readonly]{cursor:default}et-checkbox-option .et-checkbox-option-box{flex-shrink:0;inline-size:var(--et-checkbox-option-size);block-size:var(--et-checkbox-option-size);border-radius:var(--et-checkbox-option-border-radius);border:var(--et-checkbox-option-border-width) solid var(--_et-control-border, var(--et-surface-border-solid, currentColor));background-color:transparent;display:grid;place-items:center}et-checkbox-option .et-checkbox-option-check{inline-size:12px;block-size:10px;opacity:0;color:var(--et-theme-color-on-primary-solid, white)}et-checkbox-option .et-checkbox-option-check path{stroke-dasharray:15;stroke-dashoffset:15}et-checkbox-option .et-checkbox-option-content{display:flex;flex-direction:column;gap:2px;min-inline-size:0}et-checkbox-option .et-checkbox-option-label{font-size:14px;line-height:20px;color:var(--et-surface-color-solid, currentColor)}@media(hover:hover){et-checkbox-option:hover:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]) .et-checkbox-option-box{border-color:var(--_et-control-border, var(--et-surface-interaction-hover-solid, currentColor));background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 8%,transparent)}}et-checkbox-option:focus-visible .et-checkbox-option-box{border-color:var(--et-theme-color-primary-solid);outline:2px solid var(--et-theme-color-primary-solid);outline-offset:2px}et-checkbox-option:active:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-option-box{transform:scale(.92)}et-checkbox-option[aria-disabled=true]{opacity:var(--et-checkbox-option-opacity-disabled);pointer-events:none;cursor:default}et-checkbox-option[aria-disabled=true] .et-checkbox-option-label{color:var(--et-surface-interaction-disabled-solid, currentColor)}et-checkbox-option[aria-checked=true] .et-checkbox-option-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}et-checkbox-option[aria-checked=true] .et-checkbox-option-box .et-checkbox-option-check{opacity:1}et-checkbox-option[aria-checked=true] .et-checkbox-option-box .et-checkbox-option-check path{stroke-dashoffset:0}et-checkbox-option[data-can-animate] .et-checkbox-option-box{transition:border-color var(--et-checkbox-option-transition-duration) ease,background-color var(--et-checkbox-option-transition-duration) ease,transform var(--et-checkbox-option-transition-duration) ease}et-checkbox-option[data-can-animate] .et-checkbox-option-check{transition:opacity 0s calc(var(--et-checkbox-option-transition-duration) * 1.5)}et-checkbox-option[data-can-animate] .et-checkbox-option-check path{transition:stroke-dashoffset calc(var(--et-checkbox-option-transition-duration) * 1.5) ease}et-checkbox-option[data-can-animate][aria-checked=true] .et-checkbox-option-check{transition:opacity 0s 0s}@media(prefers-reduced-motion:reduce){et-checkbox-option{--et-checkbox-option-transition-duration: 1ms}}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
22240
22311
  }
22241
22312
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CheckboxOptionComponent, decorators: [{
22242
22313
  type: Component,
@@ -22250,7 +22321,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
22250
22321
  ], host: {
22251
22322
  class: 'et-checkbox-option',
22252
22323
  '[attr.data-can-animate]': 'canAnimate.state() || null',
22253
- }, template: "<div class=\"et-checkbox-option-box\">\n <svg class=\"et-checkbox-option-check\" viewBox=\"0 0 12 10\" fill=\"none\">\n <path\n d=\"M1 5L4.5 8.5L11 1.5\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n</div>\n<div class=\"et-checkbox-option-content\">\n <span [attr.id]=\"optionDirective.labelId()\" class=\"et-checkbox-option-label\">\n <ng-content />\n </span>\n <ng-content select=\"et-description\" />\n</div>\n", styles: ["@layer components{@property --et-checkbox-option-size{syntax: \"<length>\"; inherits: true; initial-value: 20px;}@property --et-checkbox-option-border-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-checkbox-option-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-checkbox-option-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-checkbox-option-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}@property --et-checkbox-option-gap{syntax: \"<length>\"; inherits: true; initial-value: 10px;}et-checkbox-option{display:flex;align-items:flex-start;gap:var(--et-checkbox-option-gap);cursor:pointer;outline:none;-webkit-user-select:none;user-select:none}et-checkbox-option[data-readonly]{cursor:default}et-checkbox-option .et-checkbox-option-box{flex-shrink:0;inline-size:var(--et-checkbox-option-size);block-size:var(--et-checkbox-option-size);border-radius:var(--et-checkbox-option-border-radius);border:var(--et-checkbox-option-border-width) solid var(--_et-control-border, var(--et-surface-border-solid, currentColor));background-color:transparent;display:grid;place-items:center}et-checkbox-option .et-checkbox-option-check{inline-size:12px;block-size:10px;opacity:0;color:var(--et-theme-color-on-primary-solid, white)}et-checkbox-option .et-checkbox-option-check path{stroke-dasharray:15;stroke-dashoffset:15}et-checkbox-option .et-checkbox-option-content{display:flex;flex-direction:column;gap:2px;min-inline-size:0}et-checkbox-option .et-checkbox-option-label{font-size:14px;line-height:20px;color:var(--et-surface-color-solid, currentColor)}et-checkbox-option:hover:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]) .et-checkbox-option-box{border-color:var(--_et-control-border, var(--et-surface-interaction-hover-solid, currentColor));background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 8%,transparent)}et-checkbox-option:focus-visible .et-checkbox-option-box{border-color:var(--et-theme-color-primary-solid);outline:2px solid var(--et-theme-color-primary-solid);outline-offset:2px}et-checkbox-option:active:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-option-box{transform:scale(.92)}et-checkbox-option[aria-disabled=true]{opacity:var(--et-checkbox-option-opacity-disabled);pointer-events:none;cursor:default}et-checkbox-option[aria-disabled=true] .et-checkbox-option-label{color:var(--et-surface-interaction-disabled-solid, currentColor)}et-checkbox-option[aria-checked=true] .et-checkbox-option-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}et-checkbox-option[aria-checked=true] .et-checkbox-option-box .et-checkbox-option-check{opacity:1}et-checkbox-option[aria-checked=true] .et-checkbox-option-box .et-checkbox-option-check path{stroke-dashoffset:0}et-checkbox-option[data-can-animate] .et-checkbox-option-box{transition:border-color var(--et-checkbox-option-transition-duration) ease,background-color var(--et-checkbox-option-transition-duration) ease,transform var(--et-checkbox-option-transition-duration) ease}et-checkbox-option[data-can-animate] .et-checkbox-option-check{transition:opacity 0s calc(var(--et-checkbox-option-transition-duration) * 1.5)}et-checkbox-option[data-can-animate] .et-checkbox-option-check path{transition:stroke-dashoffset calc(var(--et-checkbox-option-transition-duration) * 1.5) ease}et-checkbox-option[data-can-animate][aria-checked=true] .et-checkbox-option-check{transition:opacity 0s 0s}@media(prefers-reduced-motion:reduce){et-checkbox-option{--et-checkbox-option-transition-duration: 1ms}}}\n"] }]
22324
+ }, template: "<div class=\"et-checkbox-option-box\">\n <svg class=\"et-checkbox-option-check\" viewBox=\"0 0 12 10\" fill=\"none\">\n <path\n d=\"M1 5L4.5 8.5L11 1.5\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n</div>\n<div class=\"et-checkbox-option-content\">\n <span [attr.id]=\"optionDirective.labelId()\" class=\"et-checkbox-option-label\">\n <ng-content />\n </span>\n <ng-content select=\"et-description\" />\n</div>\n", styles: ["@layer components{@property --et-checkbox-option-size{syntax: \"<length>\"; inherits: true; initial-value: 20px;}@property --et-checkbox-option-border-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-checkbox-option-border-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-checkbox-option-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-checkbox-option-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}@property --et-checkbox-option-gap{syntax: \"<length>\"; inherits: true; initial-value: 10px;}et-checkbox-option{display:flex;align-items:flex-start;gap:var(--et-checkbox-option-gap);cursor:pointer;outline:none;-webkit-user-select:none;user-select:none}et-checkbox-option[data-readonly]{cursor:default}et-checkbox-option .et-checkbox-option-box{flex-shrink:0;inline-size:var(--et-checkbox-option-size);block-size:var(--et-checkbox-option-size);border-radius:var(--et-checkbox-option-border-radius);border:var(--et-checkbox-option-border-width) solid var(--_et-control-border, var(--et-surface-border-solid, currentColor));background-color:transparent;display:grid;place-items:center}et-checkbox-option .et-checkbox-option-check{inline-size:12px;block-size:10px;opacity:0;color:var(--et-theme-color-on-primary-solid, white)}et-checkbox-option .et-checkbox-option-check path{stroke-dasharray:15;stroke-dashoffset:15}et-checkbox-option .et-checkbox-option-content{display:flex;flex-direction:column;gap:2px;min-inline-size:0}et-checkbox-option .et-checkbox-option-label{font-size:14px;line-height:20px;color:var(--et-surface-color-solid, currentColor)}@media(hover:hover){et-checkbox-option:hover:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]) .et-checkbox-option-box{border-color:var(--_et-control-border, var(--et-surface-interaction-hover-solid, currentColor));background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 8%,transparent)}}et-checkbox-option:focus-visible .et-checkbox-option-box{border-color:var(--et-theme-color-primary-solid);outline:2px solid var(--et-theme-color-primary-solid);outline-offset:2px}et-checkbox-option:active:not([aria-disabled=true]):not([data-readonly]) .et-checkbox-option-box{transform:scale(.92)}et-checkbox-option[aria-disabled=true]{opacity:var(--et-checkbox-option-opacity-disabled);pointer-events:none;cursor:default}et-checkbox-option[aria-disabled=true] .et-checkbox-option-label{color:var(--et-surface-interaction-disabled-solid, currentColor)}et-checkbox-option[aria-checked=true] .et-checkbox-option-box{background-color:var(--et-theme-color-primary-solid, currentColor);border-color:var(--et-theme-color-primary-solid, currentColor)}et-checkbox-option[aria-checked=true] .et-checkbox-option-box .et-checkbox-option-check{opacity:1}et-checkbox-option[aria-checked=true] .et-checkbox-option-box .et-checkbox-option-check path{stroke-dashoffset:0}et-checkbox-option[data-can-animate] .et-checkbox-option-box{transition:border-color var(--et-checkbox-option-transition-duration) ease,background-color var(--et-checkbox-option-transition-duration) ease,transform var(--et-checkbox-option-transition-duration) ease}et-checkbox-option[data-can-animate] .et-checkbox-option-check{transition:opacity 0s calc(var(--et-checkbox-option-transition-duration) * 1.5)}et-checkbox-option[data-can-animate] .et-checkbox-option-check path{transition:stroke-dashoffset calc(var(--et-checkbox-option-transition-duration) * 1.5) ease}et-checkbox-option[data-can-animate][aria-checked=true] .et-checkbox-option-check{transition:opacity 0s 0s}@media(prefers-reduced-motion:reduce){et-checkbox-option{--et-checkbox-option-transition-duration: 1ms}}}\n"] }]
22254
22325
  }] });
22255
22326
 
22256
22327
  class RadioGroupComponent {
@@ -22301,7 +22372,7 @@ class RadioComponent {
22301
22372
  this.canAnimate = createCanAnimateSignal();
22302
22373
  }
22303
22374
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: RadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
22304
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: RadioComponent, isStandalone: true, selector: "et-radio", host: { properties: { "attr.data-can-animate": "canAnimate.state() || null" }, classAttribute: "et-radio" }, hostDirectives: [{ directive: SelectionOptionDirective, inputs: ["value", "value", "checked", "checked", "disabled", "disabled"], outputs: ["checkedChange", "checkedChange"] }, { directive: i1.ColorInteractiveDirective }], ngImport: i0, template: "<div class=\"et-radio-circle\"></div>\n<div class=\"et-radio-content\">\n <span [attr.id]=\"optionDirective.labelId()\" class=\"et-radio-label\">\n <ng-content />\n </span>\n <ng-content select=\"et-description\" />\n</div>\n", styles: ["@layer components{@property --et-radio-size{syntax: \"<length>\"; inherits: true; initial-value: 20px;}@property --et-radio-dot-size{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-radio-border-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-radio-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-radio-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}@property --et-radio-gap{syntax: \"<length>\"; inherits: true; initial-value: 10px;}et-radio{display:flex;align-items:flex-start;gap:var(--et-radio-gap);cursor:pointer;outline:none;-webkit-user-select:none;user-select:none}et-radio[data-readonly]{cursor:default}et-radio .et-radio-circle{flex-shrink:0;inline-size:var(--et-radio-size);block-size:var(--et-radio-size);border-radius:50%;border:var(--et-radio-border-width) solid var(--_et-control-border, var(--et-surface-border-solid, currentColor));background-color:transparent;display:grid;place-items:center}et-radio .et-radio-circle:after{content:\"\";inline-size:var(--et-radio-dot-size);block-size:var(--et-radio-dot-size);border-radius:50%;background-color:var(--et-theme-color-primary-solid, currentColor);transform:scale(0)}et-radio .et-radio-content{display:flex;flex-direction:column;gap:2px;min-inline-size:0}et-radio .et-radio-label{font-size:14px;line-height:20px;color:var(--et-surface-color-solid, currentColor)}et-radio:hover:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]) .et-radio-circle{border-color:var(--_et-control-border, var(--et-surface-interaction-hover-solid, currentColor));background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 8%,transparent)}et-radio:focus-visible .et-radio-circle{border-color:var(--et-theme-color-primary-solid);outline:2px solid var(--et-theme-color-primary-solid);outline-offset:2px}et-radio:active:not([aria-disabled=true]):not([data-readonly]) .et-radio-circle{transform:scale(.92)}et-radio[aria-disabled=true]{opacity:var(--et-radio-opacity-disabled);pointer-events:none;cursor:default}et-radio[aria-disabled=true] .et-radio-label{color:var(--et-surface-interaction-disabled-solid, currentColor)}et-radio[aria-checked=true] .et-radio-circle{border-color:var(--et-theme-color-primary-solid, currentColor);background-color:transparent}et-radio[aria-checked=true] .et-radio-circle:after{transform:scale(1)}et-radio[data-can-animate] .et-radio-circle{transition:border-color var(--et-radio-transition-duration) ease,background-color var(--et-radio-transition-duration) ease,transform var(--et-radio-transition-duration) ease}et-radio[data-can-animate] .et-radio-circle:after{transition:transform var(--et-radio-transition-duration) ease}@media(prefers-reduced-motion:reduce){et-radio{--et-radio-transition-duration: 1ms}}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
22375
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: RadioComponent, isStandalone: true, selector: "et-radio", host: { properties: { "attr.data-can-animate": "canAnimate.state() || null" }, classAttribute: "et-radio" }, hostDirectives: [{ directive: SelectionOptionDirective, inputs: ["value", "value", "checked", "checked", "disabled", "disabled"], outputs: ["checkedChange", "checkedChange"] }, { directive: i1.ColorInteractiveDirective }], ngImport: i0, template: "<div class=\"et-radio-circle\"></div>\n<div class=\"et-radio-content\">\n <span [attr.id]=\"optionDirective.labelId()\" class=\"et-radio-label\">\n <ng-content />\n </span>\n <ng-content select=\"et-description\" />\n</div>\n", styles: ["@layer components{@property --et-radio-size{syntax: \"<length>\"; inherits: true; initial-value: 20px;}@property --et-radio-dot-size{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-radio-border-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-radio-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-radio-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}@property --et-radio-gap{syntax: \"<length>\"; inherits: true; initial-value: 10px;}et-radio{display:flex;align-items:flex-start;gap:var(--et-radio-gap);cursor:pointer;outline:none;-webkit-user-select:none;user-select:none}et-radio[data-readonly]{cursor:default}et-radio .et-radio-circle{flex-shrink:0;inline-size:var(--et-radio-size);block-size:var(--et-radio-size);border-radius:50%;border:var(--et-radio-border-width) solid var(--_et-control-border, var(--et-surface-border-solid, currentColor));background-color:transparent;display:grid;place-items:center}et-radio .et-radio-circle:after{content:\"\";inline-size:var(--et-radio-dot-size);block-size:var(--et-radio-dot-size);border-radius:50%;background-color:var(--et-theme-color-primary-solid, currentColor);transform:scale(0)}et-radio .et-radio-content{display:flex;flex-direction:column;gap:2px;min-inline-size:0}et-radio .et-radio-label{font-size:14px;line-height:20px;color:var(--et-surface-color-solid, currentColor)}@media(hover:hover){et-radio:hover:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]) .et-radio-circle{border-color:var(--_et-control-border, var(--et-surface-interaction-hover-solid, currentColor));background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 8%,transparent)}}et-radio:focus-visible .et-radio-circle{border-color:var(--et-theme-color-primary-solid);outline:2px solid var(--et-theme-color-primary-solid);outline-offset:2px}et-radio:active:not([aria-disabled=true]):not([data-readonly]) .et-radio-circle{transform:scale(.92)}et-radio[aria-disabled=true]{opacity:var(--et-radio-opacity-disabled);pointer-events:none;cursor:default}et-radio[aria-disabled=true] .et-radio-label{color:var(--et-surface-interaction-disabled-solid, currentColor)}et-radio[aria-checked=true] .et-radio-circle{border-color:var(--et-theme-color-primary-solid, currentColor);background-color:transparent}et-radio[aria-checked=true] .et-radio-circle:after{transform:scale(1)}et-radio[data-can-animate] .et-radio-circle{transition:border-color var(--et-radio-transition-duration) ease,background-color var(--et-radio-transition-duration) ease,transform var(--et-radio-transition-duration) ease}et-radio[data-can-animate] .et-radio-circle:after{transition:transform var(--et-radio-transition-duration) ease}@media(prefers-reduced-motion:reduce){et-radio{--et-radio-transition-duration: 1ms}}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
22305
22376
  }
22306
22377
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: RadioComponent, decorators: [{
22307
22378
  type: Component,
@@ -22315,7 +22386,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
22315
22386
  ], host: {
22316
22387
  class: 'et-radio',
22317
22388
  '[attr.data-can-animate]': 'canAnimate.state() || null',
22318
- }, template: "<div class=\"et-radio-circle\"></div>\n<div class=\"et-radio-content\">\n <span [attr.id]=\"optionDirective.labelId()\" class=\"et-radio-label\">\n <ng-content />\n </span>\n <ng-content select=\"et-description\" />\n</div>\n", styles: ["@layer components{@property --et-radio-size{syntax: \"<length>\"; inherits: true; initial-value: 20px;}@property --et-radio-dot-size{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-radio-border-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-radio-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-radio-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}@property --et-radio-gap{syntax: \"<length>\"; inherits: true; initial-value: 10px;}et-radio{display:flex;align-items:flex-start;gap:var(--et-radio-gap);cursor:pointer;outline:none;-webkit-user-select:none;user-select:none}et-radio[data-readonly]{cursor:default}et-radio .et-radio-circle{flex-shrink:0;inline-size:var(--et-radio-size);block-size:var(--et-radio-size);border-radius:50%;border:var(--et-radio-border-width) solid var(--_et-control-border, var(--et-surface-border-solid, currentColor));background-color:transparent;display:grid;place-items:center}et-radio .et-radio-circle:after{content:\"\";inline-size:var(--et-radio-dot-size);block-size:var(--et-radio-dot-size);border-radius:50%;background-color:var(--et-theme-color-primary-solid, currentColor);transform:scale(0)}et-radio .et-radio-content{display:flex;flex-direction:column;gap:2px;min-inline-size:0}et-radio .et-radio-label{font-size:14px;line-height:20px;color:var(--et-surface-color-solid, currentColor)}et-radio:hover:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]) .et-radio-circle{border-color:var(--_et-control-border, var(--et-surface-interaction-hover-solid, currentColor));background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 8%,transparent)}et-radio:focus-visible .et-radio-circle{border-color:var(--et-theme-color-primary-solid);outline:2px solid var(--et-theme-color-primary-solid);outline-offset:2px}et-radio:active:not([aria-disabled=true]):not([data-readonly]) .et-radio-circle{transform:scale(.92)}et-radio[aria-disabled=true]{opacity:var(--et-radio-opacity-disabled);pointer-events:none;cursor:default}et-radio[aria-disabled=true] .et-radio-label{color:var(--et-surface-interaction-disabled-solid, currentColor)}et-radio[aria-checked=true] .et-radio-circle{border-color:var(--et-theme-color-primary-solid, currentColor);background-color:transparent}et-radio[aria-checked=true] .et-radio-circle:after{transform:scale(1)}et-radio[data-can-animate] .et-radio-circle{transition:border-color var(--et-radio-transition-duration) ease,background-color var(--et-radio-transition-duration) ease,transform var(--et-radio-transition-duration) ease}et-radio[data-can-animate] .et-radio-circle:after{transition:transform var(--et-radio-transition-duration) ease}@media(prefers-reduced-motion:reduce){et-radio{--et-radio-transition-duration: 1ms}}}\n"] }]
22389
+ }, template: "<div class=\"et-radio-circle\"></div>\n<div class=\"et-radio-content\">\n <span [attr.id]=\"optionDirective.labelId()\" class=\"et-radio-label\">\n <ng-content />\n </span>\n <ng-content select=\"et-description\" />\n</div>\n", styles: ["@layer components{@property --et-radio-size{syntax: \"<length>\"; inherits: true; initial-value: 20px;}@property --et-radio-dot-size{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-radio-border-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-radio-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-radio-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}@property --et-radio-gap{syntax: \"<length>\"; inherits: true; initial-value: 10px;}et-radio{display:flex;align-items:flex-start;gap:var(--et-radio-gap);cursor:pointer;outline:none;-webkit-user-select:none;user-select:none}et-radio[data-readonly]{cursor:default}et-radio .et-radio-circle{flex-shrink:0;inline-size:var(--et-radio-size);block-size:var(--et-radio-size);border-radius:50%;border:var(--et-radio-border-width) solid var(--_et-control-border, var(--et-surface-border-solid, currentColor));background-color:transparent;display:grid;place-items:center}et-radio .et-radio-circle:after{content:\"\";inline-size:var(--et-radio-dot-size);block-size:var(--et-radio-dot-size);border-radius:50%;background-color:var(--et-theme-color-primary-solid, currentColor);transform:scale(0)}et-radio .et-radio-content{display:flex;flex-direction:column;gap:2px;min-inline-size:0}et-radio .et-radio-label{font-size:14px;line-height:20px;color:var(--et-surface-color-solid, currentColor)}@media(hover:hover){et-radio:hover:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]) .et-radio-circle{border-color:var(--_et-control-border, var(--et-surface-interaction-hover-solid, currentColor));background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 8%,transparent)}}et-radio:focus-visible .et-radio-circle{border-color:var(--et-theme-color-primary-solid);outline:2px solid var(--et-theme-color-primary-solid);outline-offset:2px}et-radio:active:not([aria-disabled=true]):not([data-readonly]) .et-radio-circle{transform:scale(.92)}et-radio[aria-disabled=true]{opacity:var(--et-radio-opacity-disabled);pointer-events:none;cursor:default}et-radio[aria-disabled=true] .et-radio-label{color:var(--et-surface-interaction-disabled-solid, currentColor)}et-radio[aria-checked=true] .et-radio-circle{border-color:var(--et-theme-color-primary-solid, currentColor);background-color:transparent}et-radio[aria-checked=true] .et-radio-circle:after{transform:scale(1)}et-radio[data-can-animate] .et-radio-circle{transition:border-color var(--et-radio-transition-duration) ease,background-color var(--et-radio-transition-duration) ease,transform var(--et-radio-transition-duration) ease}et-radio[data-can-animate] .et-radio-circle:after{transition:transform var(--et-radio-transition-duration) ease}@media(prefers-reduced-motion:reduce){et-radio{--et-radio-transition-duration: 1ms}}}\n"] }]
22319
22390
  }] });
22320
22391
 
22321
22392
  // codes 3100-3199
@@ -23092,7 +23163,7 @@ class SwitchComponent {
23092
23163
  this.canAnimate = createCanAnimateSignal();
23093
23164
  }
23094
23165
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SwitchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
23095
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: SwitchComponent, isStandalone: true, selector: "et-switch", host: { properties: { "attr.data-can-animate": "canAnimate.state() || null" }, classAttribute: "et-switch" }, hostDirectives: [{ directive: SwitchDirective, inputs: ["checked", "checked", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name"], outputs: ["checkedChange", "checkedChange", "touchedChange", "touchedChange"] }, { directive: i1.ColorInteractiveDirective }], ngImport: i0, template: "<div class=\"et-switch-track\">\n <div class=\"et-switch-thumb\"></div>\n</div>\n", styles: ["@layer components{@property --et-switch-track-width{syntax: \"<length>\"; inherits: true; initial-value: 40px;}@property --et-switch-track-height{syntax: \"<length>\"; inherits: true; initial-value: 22px;}@property --et-switch-thumb-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}@property --et-switch-thumb-offset{syntax: \"<length>\"; inherits: true; initial-value: 3px;}@property --et-switch-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-switch-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}et-switch{display:inline-flex;align-items:center;cursor:pointer;outline:none}et-switch[data-readonly]{cursor:default}et-switch[aria-disabled=true]{opacity:var(--et-switch-opacity-disabled);pointer-events:none;cursor:default}et-switch .et-switch-track{position:relative;width:var(--et-switch-track-width);height:var(--et-switch-track-height);border-radius:calc(var(--et-switch-track-height) / 2);background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 22%,transparent)}et-switch:hover:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]) .et-switch-track,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-switch:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]) .et-switch-track{background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 30%,transparent)}:where(et-choice-field[data-error]) et-switch:not([aria-disabled=true]):not([aria-checked=true]) .et-switch-track{background-color:color-mix(in srgb,var(--et-theme-color-primary-solid) 40%,transparent)}et-switch:focus-visible .et-switch-track{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:2px}et-switch .et-switch-thumb{position:absolute;top:calc((var(--et-switch-track-height) - var(--et-switch-thumb-size) + 4px) / 2);left:calc((var(--et-switch-track-height) - var(--et-switch-thumb-size) + 4px) / 2);width:calc(var(--et-switch-thumb-size) - 4px);height:calc(var(--et-switch-thumb-size) - 4px);border-radius:calc(var(--et-switch-thumb-size) / 2);background-color:var(--et-surface-color-muted-solid, currentColor)}et-switch:hover:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-switch:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb{background-color:var(--et-surface-color-solid, currentColor)}et-switch:active:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb{width:var(--et-switch-thumb-size)}et-switch[aria-checked=true] .et-switch-track{background-color:var(--et-theme-color-primary-solid, currentColor)}et-switch[aria-checked=true] .et-switch-thumb{top:calc((var(--et-switch-track-height) - var(--et-switch-thumb-size)) / 2);left:calc(var(--et-switch-track-width) - var(--et-switch-thumb-size) - var(--et-switch-thumb-offset));width:var(--et-switch-thumb-size);height:var(--et-switch-thumb-size);background-color:var(--et-theme-color-on-primary-solid, white)}et-switch[aria-checked=true]:hover:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-switch[aria-checked=true]:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb{background-color:var(--et-theme-color-on-primary-solid, white)}et-switch[aria-checked=true]:active:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb{width:calc(var(--et-switch-thumb-size) + 3px);left:calc(var(--et-switch-track-width) - var(--et-switch-thumb-size) - 3px - var(--et-switch-thumb-offset))}et-switch[data-can-animate] .et-switch-track{transition:background-color var(--et-switch-transition-duration) ease}et-switch[data-can-animate] .et-switch-thumb{transition:top var(--et-switch-transition-duration) ease,left var(--et-switch-transition-duration) ease,width var(--et-switch-transition-duration) ease,height var(--et-switch-transition-duration) ease,background-color var(--et-switch-transition-duration) ease}@media(prefers-reduced-motion:reduce){et-switch{--et-switch-transition-duration: 1ms}}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
23166
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: SwitchComponent, isStandalone: true, selector: "et-switch", host: { properties: { "attr.data-can-animate": "canAnimate.state() || null" }, classAttribute: "et-switch" }, hostDirectives: [{ directive: SwitchDirective, inputs: ["checked", "checked", "disabled", "disabled", "readonly", "readonly", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name"], outputs: ["checkedChange", "checkedChange", "touchedChange", "touchedChange"] }, { directive: i1.ColorInteractiveDirective }], ngImport: i0, template: "<div class=\"et-switch-track\">\n <div class=\"et-switch-thumb\"></div>\n</div>\n", styles: ["@layer components{@property --et-switch-track-width{syntax: \"<length>\"; inherits: true; initial-value: 40px;}@property --et-switch-track-height{syntax: \"<length>\"; inherits: true; initial-value: 22px;}@property --et-switch-thumb-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}@property --et-switch-thumb-offset{syntax: \"<length>\"; inherits: true; initial-value: 3px;}@property --et-switch-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-switch-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}et-switch{display:inline-flex;align-items:center;cursor:pointer;outline:none}et-switch[data-readonly]{cursor:default}et-switch[aria-disabled=true]{opacity:var(--et-switch-opacity-disabled);pointer-events:none;cursor:default}et-switch .et-switch-track{position:relative;width:var(--et-switch-track-width);height:var(--et-switch-track-height);border-radius:calc(var(--et-switch-track-height) / 2);background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 22%,transparent)}@media(hover:hover){et-switch:hover:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]) .et-switch-track,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-switch:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]) .et-switch-track{background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 30%,transparent)}}:where(et-choice-field[data-error]) et-switch:not([aria-disabled=true]):not([aria-checked=true]) .et-switch-track{background-color:color-mix(in srgb,var(--et-theme-color-primary-solid) 40%,transparent)}et-switch:focus-visible .et-switch-track{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:2px}et-switch .et-switch-thumb{position:absolute;top:calc((var(--et-switch-track-height) - var(--et-switch-thumb-size) + 4px) / 2);left:calc((var(--et-switch-track-height) - var(--et-switch-thumb-size) + 4px) / 2);width:calc(var(--et-switch-thumb-size) - 4px);height:calc(var(--et-switch-thumb-size) - 4px);border-radius:calc(var(--et-switch-thumb-size) / 2);background-color:var(--et-surface-color-muted-solid, currentColor)}@media(hover:hover){et-switch:hover:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-switch:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb{background-color:var(--et-surface-color-solid, currentColor)}}et-switch:active:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb{width:var(--et-switch-thumb-size)}et-switch[aria-checked=true] .et-switch-track{background-color:var(--et-theme-color-primary-solid, currentColor)}et-switch[aria-checked=true] .et-switch-thumb{top:calc((var(--et-switch-track-height) - var(--et-switch-thumb-size)) / 2);left:calc(var(--et-switch-track-width) - var(--et-switch-thumb-size) - var(--et-switch-thumb-offset));width:var(--et-switch-thumb-size);height:var(--et-switch-thumb-size);background-color:var(--et-theme-color-on-primary-solid, white)}@media(hover:hover){et-switch[aria-checked=true]:hover:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-switch[aria-checked=true]:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb{background-color:var(--et-theme-color-on-primary-solid, white)}}et-switch[aria-checked=true]:active:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb{width:calc(var(--et-switch-thumb-size) + 3px);left:calc(var(--et-switch-track-width) - var(--et-switch-thumb-size) - 3px - var(--et-switch-thumb-offset))}et-switch[data-can-animate] .et-switch-track{transition:background-color var(--et-switch-transition-duration) ease}et-switch[data-can-animate] .et-switch-thumb{transition:top var(--et-switch-transition-duration) ease,left var(--et-switch-transition-duration) ease,width var(--et-switch-transition-duration) ease,height var(--et-switch-transition-duration) ease,background-color var(--et-switch-transition-duration) ease}@media(prefers-reduced-motion:reduce){et-switch{--et-switch-transition-duration: 1ms}}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
23096
23167
  }
23097
23168
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SwitchComponent, decorators: [{
23098
23169
  type: Component,
@@ -23106,7 +23177,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
23106
23177
  ], host: {
23107
23178
  class: 'et-switch',
23108
23179
  '[attr.data-can-animate]': 'canAnimate.state() || null',
23109
- }, template: "<div class=\"et-switch-track\">\n <div class=\"et-switch-thumb\"></div>\n</div>\n", styles: ["@layer components{@property --et-switch-track-width{syntax: \"<length>\"; inherits: true; initial-value: 40px;}@property --et-switch-track-height{syntax: \"<length>\"; inherits: true; initial-value: 22px;}@property --et-switch-thumb-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}@property --et-switch-thumb-offset{syntax: \"<length>\"; inherits: true; initial-value: 3px;}@property --et-switch-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-switch-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}et-switch{display:inline-flex;align-items:center;cursor:pointer;outline:none}et-switch[data-readonly]{cursor:default}et-switch[aria-disabled=true]{opacity:var(--et-switch-opacity-disabled);pointer-events:none;cursor:default}et-switch .et-switch-track{position:relative;width:var(--et-switch-track-width);height:var(--et-switch-track-height);border-radius:calc(var(--et-switch-track-height) / 2);background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 22%,transparent)}et-switch:hover:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]) .et-switch-track,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-switch:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]) .et-switch-track{background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 30%,transparent)}:where(et-choice-field[data-error]) et-switch:not([aria-disabled=true]):not([aria-checked=true]) .et-switch-track{background-color:color-mix(in srgb,var(--et-theme-color-primary-solid) 40%,transparent)}et-switch:focus-visible .et-switch-track{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:2px}et-switch .et-switch-thumb{position:absolute;top:calc((var(--et-switch-track-height) - var(--et-switch-thumb-size) + 4px) / 2);left:calc((var(--et-switch-track-height) - var(--et-switch-thumb-size) + 4px) / 2);width:calc(var(--et-switch-thumb-size) - 4px);height:calc(var(--et-switch-thumb-size) - 4px);border-radius:calc(var(--et-switch-thumb-size) / 2);background-color:var(--et-surface-color-muted-solid, currentColor)}et-switch:hover:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-switch:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb{background-color:var(--et-surface-color-solid, currentColor)}et-switch:active:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb{width:var(--et-switch-thumb-size)}et-switch[aria-checked=true] .et-switch-track{background-color:var(--et-theme-color-primary-solid, currentColor)}et-switch[aria-checked=true] .et-switch-thumb{top:calc((var(--et-switch-track-height) - var(--et-switch-thumb-size)) / 2);left:calc(var(--et-switch-track-width) - var(--et-switch-thumb-size) - var(--et-switch-thumb-offset));width:var(--et-switch-thumb-size);height:var(--et-switch-thumb-size);background-color:var(--et-theme-color-on-primary-solid, white)}et-switch[aria-checked=true]:hover:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-switch[aria-checked=true]:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb{background-color:var(--et-theme-color-on-primary-solid, white)}et-switch[aria-checked=true]:active:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb{width:calc(var(--et-switch-thumb-size) + 3px);left:calc(var(--et-switch-track-width) - var(--et-switch-thumb-size) - 3px - var(--et-switch-thumb-offset))}et-switch[data-can-animate] .et-switch-track{transition:background-color var(--et-switch-transition-duration) ease}et-switch[data-can-animate] .et-switch-thumb{transition:top var(--et-switch-transition-duration) ease,left var(--et-switch-transition-duration) ease,width var(--et-switch-transition-duration) ease,height var(--et-switch-transition-duration) ease,background-color var(--et-switch-transition-duration) ease}@media(prefers-reduced-motion:reduce){et-switch{--et-switch-transition-duration: 1ms}}}\n"] }]
23180
+ }, template: "<div class=\"et-switch-track\">\n <div class=\"et-switch-thumb\"></div>\n</div>\n", styles: ["@layer components{@property --et-switch-track-width{syntax: \"<length>\"; inherits: true; initial-value: 40px;}@property --et-switch-track-height{syntax: \"<length>\"; inherits: true; initial-value: 22px;}@property --et-switch-thumb-size{syntax: \"<length>\"; inherits: true; initial-value: 16px;}@property --et-switch-thumb-offset{syntax: \"<length>\"; inherits: true; initial-value: 3px;}@property --et-switch-transition-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --et-switch-opacity-disabled{syntax: \"<number>\"; inherits: true; initial-value: .5;}et-switch{display:inline-flex;align-items:center;cursor:pointer;outline:none}et-switch[data-readonly]{cursor:default}et-switch[aria-disabled=true]{opacity:var(--et-switch-opacity-disabled);pointer-events:none;cursor:default}et-switch .et-switch-track{position:relative;width:var(--et-switch-track-width);height:var(--et-switch-track-height);border-radius:calc(var(--et-switch-track-height) / 2);background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 22%,transparent)}@media(hover:hover){et-switch:hover:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]) .et-switch-track,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-switch:not([aria-disabled=true]):not([data-readonly]):not([aria-checked=true]) .et-switch-track{background-color:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 30%,transparent)}}:where(et-choice-field[data-error]) et-switch:not([aria-disabled=true]):not([aria-checked=true]) .et-switch-track{background-color:color-mix(in srgb,var(--et-theme-color-primary-solid) 40%,transparent)}et-switch:focus-visible .et-switch-track{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:2px}et-switch .et-switch-thumb{position:absolute;top:calc((var(--et-switch-track-height) - var(--et-switch-thumb-size) + 4px) / 2);left:calc((var(--et-switch-track-height) - var(--et-switch-thumb-size) + 4px) / 2);width:calc(var(--et-switch-thumb-size) - 4px);height:calc(var(--et-switch-thumb-size) - 4px);border-radius:calc(var(--et-switch-thumb-size) / 2);background-color:var(--et-surface-color-muted-solid, currentColor)}@media(hover:hover){et-switch:hover:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-switch:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb{background-color:var(--et-surface-color-solid, currentColor)}}et-switch:active:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb{width:var(--et-switch-thumb-size)}et-switch[aria-checked=true] .et-switch-track{background-color:var(--et-theme-color-primary-solid, currentColor)}et-switch[aria-checked=true] .et-switch-thumb{top:calc((var(--et-switch-track-height) - var(--et-switch-thumb-size)) / 2);left:calc(var(--et-switch-track-width) - var(--et-switch-thumb-size) - var(--et-switch-thumb-offset));width:var(--et-switch-thumb-size);height:var(--et-switch-thumb-size);background-color:var(--et-theme-color-on-primary-solid, white)}@media(hover:hover){et-switch[aria-checked=true]:hover:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb,:where(et-choice-field:has(.et-choice-field-label-area:hover)) et-switch[aria-checked=true]:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb{background-color:var(--et-theme-color-on-primary-solid, white)}}et-switch[aria-checked=true]:active:not([aria-disabled=true]):not([data-readonly]) .et-switch-thumb{width:calc(var(--et-switch-thumb-size) + 3px);left:calc(var(--et-switch-track-width) - var(--et-switch-thumb-size) - 3px - var(--et-switch-thumb-offset))}et-switch[data-can-animate] .et-switch-track{transition:background-color var(--et-switch-transition-duration) ease}et-switch[data-can-animate] .et-switch-thumb{transition:top var(--et-switch-transition-duration) ease,left var(--et-switch-transition-duration) ease,width var(--et-switch-transition-duration) ease,height var(--et-switch-transition-duration) ease,background-color var(--et-switch-transition-duration) ease}@media(prefers-reduced-motion:reduce){et-switch{--et-switch-transition-duration: 1ms}}}\n"] }]
23110
23181
  }] });
23111
23182
 
23112
23183
  const SWITCH_IMPORTS = [SwitchComponent, SwitchDirective];
@@ -25428,7 +25499,7 @@ class GridItemDefaultActionsComponent {
25428
25499
  <i etIcon="et-times"></i>
25429
25500
  </button>
25430
25501
  </et-grid-item-toolbar>
25431
- `, isInline: true, styles: ["et-grid-item-default-actions .et-grid-item-default-actions__remove{color:rgb(var(--et-surface-color-muted))}et-grid-item-default-actions .et-grid-item-default-actions__remove:hover{color:rgb(var(--et-surface-color))}\n"], dependencies: [{ kind: "component", type: GridItemToolbarComponent, selector: "et-grid-item-toolbar, [et-grid-item-toolbar]" }, { kind: "component", type: IconButtonComponent, selector: "[et-icon-button]", inputs: ["variant", "size"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
25502
+ `, isInline: true, styles: ["et-grid-item-default-actions .et-grid-item-default-actions__remove{color:rgb(var(--et-surface-color-muted))}@media(hover:hover){et-grid-item-default-actions .et-grid-item-default-actions__remove:hover{color:rgb(var(--et-surface-color))}}\n"], dependencies: [{ kind: "component", type: GridItemToolbarComponent, selector: "et-grid-item-toolbar, [et-grid-item-toolbar]" }, { kind: "component", type: IconButtonComponent, selector: "[et-icon-button]", inputs: ["variant", "size"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
25432
25503
  }
25433
25504
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: GridItemDefaultActionsComponent, decorators: [{
25434
25505
  type: Component,
@@ -25445,7 +25516,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
25445
25516
  <i etIcon="et-times"></i>
25446
25517
  </button>
25447
25518
  </et-grid-item-toolbar>
25448
- `, encapsulation: ViewEncapsulation.None, imports: [GridItemToolbarComponent, IconButtonComponent, ...ICON_IMPORTS], providers: [provideIcons(TIMES_ICON)], styles: ["et-grid-item-default-actions .et-grid-item-default-actions__remove{color:rgb(var(--et-surface-color-muted))}et-grid-item-default-actions .et-grid-item-default-actions__remove:hover{color:rgb(var(--et-surface-color))}\n"] }]
25519
+ `, encapsulation: ViewEncapsulation.None, imports: [GridItemToolbarComponent, IconButtonComponent, ...ICON_IMPORTS], providers: [provideIcons(TIMES_ICON)], styles: ["et-grid-item-default-actions .et-grid-item-default-actions__remove{color:rgb(var(--et-surface-color-muted))}@media(hover:hover){et-grid-item-default-actions .et-grid-item-default-actions__remove:hover{color:rgb(var(--et-surface-color))}}\n"] }]
25449
25520
  }], propDecorators: { itemId: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemId", required: true }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }] } });
25450
25521
 
25451
25522
  class GridItemComponent {
@@ -26542,7 +26613,7 @@ class NotificationComponent {
26542
26613
  });
26543
26614
  }
26544
26615
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NotificationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
26545
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: NotificationComponent, isStandalone: true, selector: "et-notification", host: { listeners: { "keydown.escape": "notification.ref().dismiss()", "mouseenter": "notification.ref().pauseTimer()", "mouseleave": "notification.ref().resumeTimer()", "focusin": "notification.ref().pauseTimer()", "focusout": "notification.ref().resumeTimer()" }, classAttribute: "et-notification" }, providers: [provideIcons(TIMES_ICON)], hostDirectives: [{ directive: NotificationDirective, inputs: ["ref", "ref"] }, { directive: i1.AnimatedLifecycleDirective }, { directive: i1.ProvideColorDirective, inputs: ["etProvideColor", "color"] }, { directive: i1.ProvideSurfaceDirective, inputs: ["etProvideSurface", "surface"] }], ngImport: i0, template: "<div class=\"et-notification-content\">\n <div class=\"et-notification-header\">\n @if (notification.isLoading()) {\n <et-spinner class=\"et-notification-spinner\" diameter=\"16\" strokeWidth=\"2\" />\n }\n\n <span class=\"et-notification-title\">{{ notification.title() }}</span>\n\n <button\n [color]=\"controlsColor()\"\n [attr.aria-label]=\"dismissLabel()\"\n class=\"et-notification-dismiss-btn\"\n et-icon-button\n etNotificationDismiss\n size=\"xs\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n </div>\n\n @if (notification.message()) {\n <p class=\"et-notification-message\">{{ notification.message() }}</p>\n }\n\n @if (notification.progress() !== undefined) {\n <et-progress-bar [value]=\"notification.progress()!\" class=\"et-notification-progress-bar\" />\n }\n\n @if (notification.action()) {\n <div class=\"et-notification-footer\">\n <button et-text-button etNotificationAction size=\"xs\" type=\"button\">\n {{ notification.action()!.label }}\n </button>\n </div>\n }\n</div>\n", styles: ["@layer components{@property --et-notification-border-radius{syntax: \"<length>\"; inherits: false; initial-value: 4px;}@property --et-notification-padding{syntax: \"*\"; inherits: false; initial-value: 12px 12px 12px 14px;}@property --et-notification-min-width{syntax: \"<length>\"; inherits: false; initial-value: 300px;}@property --et-notification-max-width{syntax: \"<length>\"; inherits: false; initial-value: 420px;}@property --et-notification-shadow{syntax: \"*\"; inherits: false; initial-value: 0 4px 16px rgb(0 0 0 / 10%),0 0 0 1px rgb(0 0 0 / 5%);}@property --et-notification-border-width{syntax: \"<length>\"; inherits: false; initial-value: 4px;}@property --et-notification-font-size{syntax: \"<length>\"; inherits: false; initial-value: 14px;}@property --et-notification-line-height{syntax: \"<length>\"; inherits: false; initial-value: 20px;}@property --et-notification-gap{syntax: \"<length>\"; inherits: false; initial-value: 8px;}@property --et-notification-title-font-weight{syntax: \"<number>\"; inherits: false; initial-value: 600;}@property --et-notification-message-font-size{syntax: \"<length>\"; inherits: false; initial-value: 12px;}@property --et-notification-message-line-height{syntax: \"<length>\"; inherits: false; initial-value: 16px;}@property --et-notification-message-opacity{syntax: \"<number>\"; inherits: false; initial-value: .65;}@property --et-notification-progress-bar-height{syntax: \"<length>\"; inherits: false; initial-value: 3px;}.et-notification{display:block;pointer-events:all;background:var(--et-surface-background-solid, #fff);color:var(--et-surface-color-solid, #111);border-radius:var(--et-notification-border-radius);padding:var(--et-notification-padding);box-shadow:var(--et-notification-shadow);min-width:var(--et-notification-min-width);max-width:var(--et-notification-max-width);border-left:var(--et-notification-border-width) solid var(--et-theme-color-primary-solid, #d1d5db);font-family:inherit;font-size:var(--et-notification-font-size);line-height:var(--et-notification-line-height)}.et-notification.et-animation-enter-from{opacity:0;transform:translate(1rem)}.et-notification.et-animation-enter-active{transition:opacity .2s ease,transform .2s ease}.et-notification.et-animation-leave-active{transition:opacity .2s ease,transform .2s ease}.et-notification.et-animation-leave-to{opacity:0;transform:translate(1rem)}:is(.et-notification-stack[data-position=bottom-start] .et-notification,.et-notification-stack[data-position=top-start] .et-notification).et-animation-enter-from,:is(.et-notification-stack[data-position=bottom-start] .et-notification,.et-notification-stack[data-position=top-start] .et-notification).et-animation-leave-to{transform:translate(-1rem)}.et-notification-stack[data-position=bottom-center] .et-notification.et-animation-enter-from,.et-notification-stack[data-position=bottom-center] .et-notification.et-animation-leave-to{transform:translateY(1rem)}.et-notification-stack[data-position=top-center] .et-notification.et-animation-enter-from,.et-notification-stack[data-position=top-center] .et-notification.et-animation-leave-to{transform:translateY(-1rem)}.et-notification-header{display:flex;align-items:center;justify-content:space-between;gap:var(--et-notification-gap)}.et-notification-spinner{flex-shrink:0;--et-spinner-color: var(--et-theme-color-primary-solid, currentColor)}.et-notification-title{flex:1;font-weight:var(--et-notification-title-font-weight);font-size:var(--et-notification-font-size);line-height:var(--et-notification-line-height)}.et-notification-dismiss-btn{flex-shrink:0;opacity:.4;transition:opacity .12s ease}.et-notification-dismiss-btn:hover{opacity:.8}.et-notification-message{margin:.4rem 0 0;color:var(--et-surface-color-muted-solid, inherit);opacity:var(--et-notification-message-opacity);font-size:var(--et-notification-message-font-size);line-height:var(--et-notification-message-line-height)}.et-notification-progress-bar{margin-top:.8rem;color:var(--et-theme-color-primary-solid, currentColor);--et-progress-bar-height: var(--et-notification-progress-bar-height)}.et-notification-footer{margin-top:.8rem}@media(prefers-reduced-motion:reduce){.et-notification.et-animation-enter-from{transform:none}.et-notification.et-animation-enter-active,.et-notification.et-animation-leave-active{transition-duration:0ms}.et-notification.et-animation-leave-to{transform:none}}}\n"], dependencies: [{ kind: "directive", type: NotificationActionDirective, selector: "[etNotificationAction]", exportAs: ["etNotificationAction"] }, { kind: "directive", type: NotificationDismissDirective, selector: "[etNotificationDismiss]", exportAs: ["etNotificationDismiss"] }, { kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }, { kind: "component", type: ProgressBarComponent, selector: "et-progress-bar", inputs: ["value", "indeterminate"] }, { kind: "component", type: IconButtonComponent, selector: "[et-icon-button]", inputs: ["variant", "size"] }, { kind: "component", type: TextButtonComponent, selector: "[et-text-button]", inputs: ["size", "iconAlignment"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
26616
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: NotificationComponent, isStandalone: true, selector: "et-notification", host: { listeners: { "keydown.escape": "notification.ref().dismiss()", "mouseenter": "notification.ref().pauseTimer()", "mouseleave": "notification.ref().resumeTimer()", "focusin": "notification.ref().pauseTimer()", "focusout": "notification.ref().resumeTimer()" }, classAttribute: "et-notification" }, providers: [provideIcons(TIMES_ICON)], hostDirectives: [{ directive: NotificationDirective, inputs: ["ref", "ref"] }, { directive: i1.AnimatedLifecycleDirective }, { directive: i1.ProvideColorDirective, inputs: ["etProvideColor", "color"] }, { directive: i1.ProvideSurfaceDirective, inputs: ["etProvideSurface", "surface"] }], ngImport: i0, template: "<div class=\"et-notification-content\">\n <div class=\"et-notification-header\">\n @if (notification.isLoading()) {\n <et-spinner class=\"et-notification-spinner\" diameter=\"16\" strokeWidth=\"2\" />\n }\n\n <span class=\"et-notification-title\">{{ notification.title() }}</span>\n\n <button\n [color]=\"controlsColor()\"\n [attr.aria-label]=\"dismissLabel()\"\n class=\"et-notification-dismiss-btn\"\n et-icon-button\n etNotificationDismiss\n size=\"xs\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n </div>\n\n @if (notification.message()) {\n <p class=\"et-notification-message\">{{ notification.message() }}</p>\n }\n\n @if (notification.progress() !== undefined) {\n <et-progress-bar [value]=\"notification.progress()!\" class=\"et-notification-progress-bar\" />\n }\n\n @if (notification.action()) {\n <div class=\"et-notification-footer\">\n <button et-text-button etNotificationAction size=\"xs\" type=\"button\">\n {{ notification.action()!.label }}\n </button>\n </div>\n }\n</div>\n", styles: ["@layer components{@property --et-notification-border-radius{syntax: \"<length>\"; inherits: false; initial-value: 4px;}@property --et-notification-padding{syntax: \"*\"; inherits: false; initial-value: 12px 12px 12px 14px;}@property --et-notification-min-width{syntax: \"<length>\"; inherits: false; initial-value: 300px;}@property --et-notification-max-width{syntax: \"<length>\"; inherits: false; initial-value: 420px;}@property --et-notification-shadow{syntax: \"*\"; inherits: false; initial-value: 0 4px 16px rgb(0 0 0 / 10%),0 0 0 1px rgb(0 0 0 / 5%);}@property --et-notification-border-width{syntax: \"<length>\"; inherits: false; initial-value: 4px;}@property --et-notification-font-size{syntax: \"<length>\"; inherits: false; initial-value: 14px;}@property --et-notification-line-height{syntax: \"<length>\"; inherits: false; initial-value: 20px;}@property --et-notification-gap{syntax: \"<length>\"; inherits: false; initial-value: 8px;}@property --et-notification-title-font-weight{syntax: \"<number>\"; inherits: false; initial-value: 600;}@property --et-notification-message-font-size{syntax: \"<length>\"; inherits: false; initial-value: 12px;}@property --et-notification-message-line-height{syntax: \"<length>\"; inherits: false; initial-value: 16px;}@property --et-notification-message-opacity{syntax: \"<number>\"; inherits: false; initial-value: .65;}@property --et-notification-progress-bar-height{syntax: \"<length>\"; inherits: false; initial-value: 3px;}.et-notification{display:block;pointer-events:all;background:var(--et-surface-background-solid, #fff);color:var(--et-surface-color-solid, #111);border-radius:var(--et-notification-border-radius);padding:var(--et-notification-padding);box-shadow:var(--et-notification-shadow);min-width:var(--et-notification-min-width);max-width:var(--et-notification-max-width);border-left:var(--et-notification-border-width) solid var(--et-theme-color-primary-solid, #d1d5db);font-family:inherit;font-size:var(--et-notification-font-size);line-height:var(--et-notification-line-height)}.et-notification.et-animation-enter-from{opacity:0;transform:translate(1rem)}.et-notification.et-animation-enter-active{transition:opacity .2s ease,transform .2s ease}.et-notification.et-animation-leave-active{transition:opacity .2s ease,transform .2s ease}.et-notification.et-animation-leave-to{opacity:0;transform:translate(1rem)}:is(.et-notification-stack[data-position=bottom-start] .et-notification,.et-notification-stack[data-position=top-start] .et-notification).et-animation-enter-from,:is(.et-notification-stack[data-position=bottom-start] .et-notification,.et-notification-stack[data-position=top-start] .et-notification).et-animation-leave-to{transform:translate(-1rem)}.et-notification-stack[data-position=bottom-center] .et-notification.et-animation-enter-from,.et-notification-stack[data-position=bottom-center] .et-notification.et-animation-leave-to{transform:translateY(1rem)}.et-notification-stack[data-position=top-center] .et-notification.et-animation-enter-from,.et-notification-stack[data-position=top-center] .et-notification.et-animation-leave-to{transform:translateY(-1rem)}.et-notification-header{display:flex;align-items:center;justify-content:space-between;gap:var(--et-notification-gap)}.et-notification-spinner{flex-shrink:0;--et-spinner-color: var(--et-theme-color-primary-solid, currentColor)}.et-notification-title{flex:1;font-weight:var(--et-notification-title-font-weight);font-size:var(--et-notification-font-size);line-height:var(--et-notification-line-height)}.et-notification-dismiss-btn{flex-shrink:0;opacity:.4;transition:opacity .12s ease}@media(hover:hover){.et-notification-dismiss-btn:hover{opacity:.8}}.et-notification-message{margin:.4rem 0 0;color:var(--et-surface-color-muted-solid, inherit);opacity:var(--et-notification-message-opacity);font-size:var(--et-notification-message-font-size);line-height:var(--et-notification-message-line-height)}.et-notification-progress-bar{margin-top:.8rem;color:var(--et-theme-color-primary-solid, currentColor);--et-progress-bar-height: var(--et-notification-progress-bar-height)}.et-notification-footer{margin-top:.8rem}@media(prefers-reduced-motion:reduce){.et-notification.et-animation-enter-from{transform:none}.et-notification.et-animation-enter-active,.et-notification.et-animation-leave-active{transition-duration:0ms}.et-notification.et-animation-leave-to{transform:none}}}\n"], dependencies: [{ kind: "directive", type: NotificationActionDirective, selector: "[etNotificationAction]", exportAs: ["etNotificationAction"] }, { kind: "directive", type: NotificationDismissDirective, selector: "[etNotificationDismiss]", exportAs: ["etNotificationDismiss"] }, { kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }, { kind: "component", type: ProgressBarComponent, selector: "et-progress-bar", inputs: ["value", "indeterminate"] }, { kind: "component", type: IconButtonComponent, selector: "[et-icon-button]", inputs: ["variant", "size"] }, { kind: "component", type: TextButtonComponent, selector: "[et-text-button]", inputs: ["size", "iconAlignment"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
26546
26617
  }
26547
26618
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NotificationComponent, decorators: [{
26548
26619
  type: Component,
@@ -26572,7 +26643,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
26572
26643
  '(mouseleave)': 'notification.ref().resumeTimer()',
26573
26644
  '(focusin)': 'notification.ref().pauseTimer()',
26574
26645
  '(focusout)': 'notification.ref().resumeTimer()',
26575
- }, template: "<div class=\"et-notification-content\">\n <div class=\"et-notification-header\">\n @if (notification.isLoading()) {\n <et-spinner class=\"et-notification-spinner\" diameter=\"16\" strokeWidth=\"2\" />\n }\n\n <span class=\"et-notification-title\">{{ notification.title() }}</span>\n\n <button\n [color]=\"controlsColor()\"\n [attr.aria-label]=\"dismissLabel()\"\n class=\"et-notification-dismiss-btn\"\n et-icon-button\n etNotificationDismiss\n size=\"xs\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n </div>\n\n @if (notification.message()) {\n <p class=\"et-notification-message\">{{ notification.message() }}</p>\n }\n\n @if (notification.progress() !== undefined) {\n <et-progress-bar [value]=\"notification.progress()!\" class=\"et-notification-progress-bar\" />\n }\n\n @if (notification.action()) {\n <div class=\"et-notification-footer\">\n <button et-text-button etNotificationAction size=\"xs\" type=\"button\">\n {{ notification.action()!.label }}\n </button>\n </div>\n }\n</div>\n", styles: ["@layer components{@property --et-notification-border-radius{syntax: \"<length>\"; inherits: false; initial-value: 4px;}@property --et-notification-padding{syntax: \"*\"; inherits: false; initial-value: 12px 12px 12px 14px;}@property --et-notification-min-width{syntax: \"<length>\"; inherits: false; initial-value: 300px;}@property --et-notification-max-width{syntax: \"<length>\"; inherits: false; initial-value: 420px;}@property --et-notification-shadow{syntax: \"*\"; inherits: false; initial-value: 0 4px 16px rgb(0 0 0 / 10%),0 0 0 1px rgb(0 0 0 / 5%);}@property --et-notification-border-width{syntax: \"<length>\"; inherits: false; initial-value: 4px;}@property --et-notification-font-size{syntax: \"<length>\"; inherits: false; initial-value: 14px;}@property --et-notification-line-height{syntax: \"<length>\"; inherits: false; initial-value: 20px;}@property --et-notification-gap{syntax: \"<length>\"; inherits: false; initial-value: 8px;}@property --et-notification-title-font-weight{syntax: \"<number>\"; inherits: false; initial-value: 600;}@property --et-notification-message-font-size{syntax: \"<length>\"; inherits: false; initial-value: 12px;}@property --et-notification-message-line-height{syntax: \"<length>\"; inherits: false; initial-value: 16px;}@property --et-notification-message-opacity{syntax: \"<number>\"; inherits: false; initial-value: .65;}@property --et-notification-progress-bar-height{syntax: \"<length>\"; inherits: false; initial-value: 3px;}.et-notification{display:block;pointer-events:all;background:var(--et-surface-background-solid, #fff);color:var(--et-surface-color-solid, #111);border-radius:var(--et-notification-border-radius);padding:var(--et-notification-padding);box-shadow:var(--et-notification-shadow);min-width:var(--et-notification-min-width);max-width:var(--et-notification-max-width);border-left:var(--et-notification-border-width) solid var(--et-theme-color-primary-solid, #d1d5db);font-family:inherit;font-size:var(--et-notification-font-size);line-height:var(--et-notification-line-height)}.et-notification.et-animation-enter-from{opacity:0;transform:translate(1rem)}.et-notification.et-animation-enter-active{transition:opacity .2s ease,transform .2s ease}.et-notification.et-animation-leave-active{transition:opacity .2s ease,transform .2s ease}.et-notification.et-animation-leave-to{opacity:0;transform:translate(1rem)}:is(.et-notification-stack[data-position=bottom-start] .et-notification,.et-notification-stack[data-position=top-start] .et-notification).et-animation-enter-from,:is(.et-notification-stack[data-position=bottom-start] .et-notification,.et-notification-stack[data-position=top-start] .et-notification).et-animation-leave-to{transform:translate(-1rem)}.et-notification-stack[data-position=bottom-center] .et-notification.et-animation-enter-from,.et-notification-stack[data-position=bottom-center] .et-notification.et-animation-leave-to{transform:translateY(1rem)}.et-notification-stack[data-position=top-center] .et-notification.et-animation-enter-from,.et-notification-stack[data-position=top-center] .et-notification.et-animation-leave-to{transform:translateY(-1rem)}.et-notification-header{display:flex;align-items:center;justify-content:space-between;gap:var(--et-notification-gap)}.et-notification-spinner{flex-shrink:0;--et-spinner-color: var(--et-theme-color-primary-solid, currentColor)}.et-notification-title{flex:1;font-weight:var(--et-notification-title-font-weight);font-size:var(--et-notification-font-size);line-height:var(--et-notification-line-height)}.et-notification-dismiss-btn{flex-shrink:0;opacity:.4;transition:opacity .12s ease}.et-notification-dismiss-btn:hover{opacity:.8}.et-notification-message{margin:.4rem 0 0;color:var(--et-surface-color-muted-solid, inherit);opacity:var(--et-notification-message-opacity);font-size:var(--et-notification-message-font-size);line-height:var(--et-notification-message-line-height)}.et-notification-progress-bar{margin-top:.8rem;color:var(--et-theme-color-primary-solid, currentColor);--et-progress-bar-height: var(--et-notification-progress-bar-height)}.et-notification-footer{margin-top:.8rem}@media(prefers-reduced-motion:reduce){.et-notification.et-animation-enter-from{transform:none}.et-notification.et-animation-enter-active,.et-notification.et-animation-leave-active{transition-duration:0ms}.et-notification.et-animation-leave-to{transform:none}}}\n"] }]
26646
+ }, template: "<div class=\"et-notification-content\">\n <div class=\"et-notification-header\">\n @if (notification.isLoading()) {\n <et-spinner class=\"et-notification-spinner\" diameter=\"16\" strokeWidth=\"2\" />\n }\n\n <span class=\"et-notification-title\">{{ notification.title() }}</span>\n\n <button\n [color]=\"controlsColor()\"\n [attr.aria-label]=\"dismissLabel()\"\n class=\"et-notification-dismiss-btn\"\n et-icon-button\n etNotificationDismiss\n size=\"xs\"\n type=\"button\"\n >\n <i etIcon=\"et-times\"></i>\n </button>\n </div>\n\n @if (notification.message()) {\n <p class=\"et-notification-message\">{{ notification.message() }}</p>\n }\n\n @if (notification.progress() !== undefined) {\n <et-progress-bar [value]=\"notification.progress()!\" class=\"et-notification-progress-bar\" />\n }\n\n @if (notification.action()) {\n <div class=\"et-notification-footer\">\n <button et-text-button etNotificationAction size=\"xs\" type=\"button\">\n {{ notification.action()!.label }}\n </button>\n </div>\n }\n</div>\n", styles: ["@layer components{@property --et-notification-border-radius{syntax: \"<length>\"; inherits: false; initial-value: 4px;}@property --et-notification-padding{syntax: \"*\"; inherits: false; initial-value: 12px 12px 12px 14px;}@property --et-notification-min-width{syntax: \"<length>\"; inherits: false; initial-value: 300px;}@property --et-notification-max-width{syntax: \"<length>\"; inherits: false; initial-value: 420px;}@property --et-notification-shadow{syntax: \"*\"; inherits: false; initial-value: 0 4px 16px rgb(0 0 0 / 10%),0 0 0 1px rgb(0 0 0 / 5%);}@property --et-notification-border-width{syntax: \"<length>\"; inherits: false; initial-value: 4px;}@property --et-notification-font-size{syntax: \"<length>\"; inherits: false; initial-value: 14px;}@property --et-notification-line-height{syntax: \"<length>\"; inherits: false; initial-value: 20px;}@property --et-notification-gap{syntax: \"<length>\"; inherits: false; initial-value: 8px;}@property --et-notification-title-font-weight{syntax: \"<number>\"; inherits: false; initial-value: 600;}@property --et-notification-message-font-size{syntax: \"<length>\"; inherits: false; initial-value: 12px;}@property --et-notification-message-line-height{syntax: \"<length>\"; inherits: false; initial-value: 16px;}@property --et-notification-message-opacity{syntax: \"<number>\"; inherits: false; initial-value: .65;}@property --et-notification-progress-bar-height{syntax: \"<length>\"; inherits: false; initial-value: 3px;}.et-notification{display:block;pointer-events:all;background:var(--et-surface-background-solid, #fff);color:var(--et-surface-color-solid, #111);border-radius:var(--et-notification-border-radius);padding:var(--et-notification-padding);box-shadow:var(--et-notification-shadow);min-width:var(--et-notification-min-width);max-width:var(--et-notification-max-width);border-left:var(--et-notification-border-width) solid var(--et-theme-color-primary-solid, #d1d5db);font-family:inherit;font-size:var(--et-notification-font-size);line-height:var(--et-notification-line-height)}.et-notification.et-animation-enter-from{opacity:0;transform:translate(1rem)}.et-notification.et-animation-enter-active{transition:opacity .2s ease,transform .2s ease}.et-notification.et-animation-leave-active{transition:opacity .2s ease,transform .2s ease}.et-notification.et-animation-leave-to{opacity:0;transform:translate(1rem)}:is(.et-notification-stack[data-position=bottom-start] .et-notification,.et-notification-stack[data-position=top-start] .et-notification).et-animation-enter-from,:is(.et-notification-stack[data-position=bottom-start] .et-notification,.et-notification-stack[data-position=top-start] .et-notification).et-animation-leave-to{transform:translate(-1rem)}.et-notification-stack[data-position=bottom-center] .et-notification.et-animation-enter-from,.et-notification-stack[data-position=bottom-center] .et-notification.et-animation-leave-to{transform:translateY(1rem)}.et-notification-stack[data-position=top-center] .et-notification.et-animation-enter-from,.et-notification-stack[data-position=top-center] .et-notification.et-animation-leave-to{transform:translateY(-1rem)}.et-notification-header{display:flex;align-items:center;justify-content:space-between;gap:var(--et-notification-gap)}.et-notification-spinner{flex-shrink:0;--et-spinner-color: var(--et-theme-color-primary-solid, currentColor)}.et-notification-title{flex:1;font-weight:var(--et-notification-title-font-weight);font-size:var(--et-notification-font-size);line-height:var(--et-notification-line-height)}.et-notification-dismiss-btn{flex-shrink:0;opacity:.4;transition:opacity .12s ease}@media(hover:hover){.et-notification-dismiss-btn:hover{opacity:.8}}.et-notification-message{margin:.4rem 0 0;color:var(--et-surface-color-muted-solid, inherit);opacity:var(--et-notification-message-opacity);font-size:var(--et-notification-message-font-size);line-height:var(--et-notification-message-line-height)}.et-notification-progress-bar{margin-top:.8rem;color:var(--et-theme-color-primary-solid, currentColor);--et-progress-bar-height: var(--et-notification-progress-bar-height)}.et-notification-footer{margin-top:.8rem}@media(prefers-reduced-motion:reduce){.et-notification.et-animation-enter-from{transform:none}.et-notification.et-animation-enter-active,.et-notification.et-animation-leave-active{transition-duration:0ms}.et-notification.et-animation-leave-to{transform:none}}}\n"] }]
26576
26647
  }], ctorParameters: () => [] });
26577
26648
 
26578
26649
  class NotificationStackComponent {
@@ -30514,7 +30585,7 @@ class StreamPipChromeComponent {
30514
30585
  return chrome.state.windowAspectRatio;
30515
30586
  },
30516
30587
  },
30517
- ], viewQueries: [{ propertyName: "stageRef", first: true, predicate: PipStageDirective, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "pipWindowRef", first: true, predicate: PipWindowComponent, descendants: true, isSignal: true }, { propertyName: "gridBtnRef", first: true, predicate: PipGridToggleDirective, descendants: true, read: ElementRef, isSignal: true }], hostDirectives: [{ directive: i1.ProvideSurfaceDirective }], ngImport: i0, template: "<et-pip-window>\n <ng-template etPipTitleBar>\n @if (state.showBackButton()) {\n <button [color]=\"controlsColor()\" [size]=\"WINDOW_CONTROL_BUTTON_SIZE\" et-window-control-button etPipBack>\n <i etIcon=\"et-arrow-out-up-right\"></i>\n </button>\n }\n <span class=\"et-pip-window__title-bar-spacer\"></span>\n @if (state.hasMultiplePips()) {\n <button\n [color]=\"controlsColor()\"\n [pressed]=\"state.multiView()\"\n [size]=\"WINDOW_CONTROL_BUTTON_SIZE\"\n et-window-control-button\n etPipGridToggle\n >\n @if (state.multiView()) {\n <i etIcon=\"et-focus-frame\"></i>\n } @else {\n <i etIcon=\"et-grid-2x2\"></i>\n }\n </button>\n }\n <button\n [color]=\"controlsColor()\"\n [kind]=\"CLOSE_KIND\"\n [size]=\"WINDOW_CONTROL_BUTTON_SIZE\"\n et-window-control-button\n etPipClose\n >\n <i etIcon=\"et-times\"></i>\n </button>\n </ng-template>\n\n <div etPipStage>\n @for (c of state.cells(); track c.playerId) {\n <div [etPipCell]=\"c\">\n <et-pip-player />\n </div>\n }\n </div>\n</et-pip-window>\n", styles: ["@layer components{et-stream-pip-chrome:not(.et-stream-pip-chrome--grid) et-pip-window:not(:has(.et-stream-pip-chrome__cell--featured .et-pip-player--ready)){visibility:hidden;pointer-events:none}et-stream-pip-chrome.et-stream-pip-chrome--grid et-pip-window:not(:has(.et-stream-pip-chrome__cell .et-pip-player--ready)){visibility:hidden;pointer-events:none}.et-stream-pip-chrome__stage{position:absolute;inset:0;overflow:hidden;clip-path:inset(0)}.et-stream-pip-chrome__cell{position:absolute;top:0;left:0;width:100%;height:100%;transform-origin:0 0;will-change:transform;overflow:hidden;transform:translate(calc(((var(--et-cell-col, 1) - 1) + var(--et-cell-exit-h, 0) * var(--et-pip-grid-cols, 1)) / var(--et-pip-grid-cols, 1) * 100%),calc((2 * (var(--et-cell-row, 1) - 1) + var(--et-pip-grid-cols, 1) - var(--et-pip-grid-rows, 1)) / (2 * var(--et-pip-grid-cols, 1)) * 100% + var(--et-cell-exit-v, 0) * 100%)) scale(calc(1 / var(--et-pip-grid-cols, 1)))}et-stream-pip-chrome:not(.et-stream-pip-chrome--grid) .et-stream-pip-chrome__cell--featured{transform:none}et-stream-pip-chrome:not(.et-stream-pip-chrome--grid) .et-stream-pip-chrome__cell:not(.et-stream-pip-chrome__cell--featured){transform:translate(calc(var(--et-cell-exit-h, 0) * 100%),calc(var(--et-cell-exit-v, 0) * 100%))}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell{cursor:pointer}.et-stream-pip-chrome__cell:after{content:\"\";position:absolute;inset:0;z-index:2;box-shadow:inset 0 0 0 5px transparent;transition:box-shadow .15s;pointer-events:none}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell:after{pointer-events:auto}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell:hover:after,et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell:focus-visible:after{box-shadow:inset 0 0 0 5px color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 35%,transparent)}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell:focus-visible{outline:none}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell--featured:after{box-shadow:inset 0 0 0 5px var(--et-stream-pip-chrome-featured-ring-color, var(--et-theme-color-primary-solid, #3b82f6))}et-pip-player{display:flex;align-items:center;justify-content:center;width:100%;height:100%;container-type:size}et-pip-player>:not(.et-pip-player__thumb-wrapper){flex:none;display:block!important;width:min(100cqw,100cqh * var(--et-pip-player-ratio, calc(16 / 9)))!important;height:min(100cqh,100cqw / var(--et-pip-player-ratio, calc(16 / 9)))!important}et-pip-player iframe{width:100%!important;height:100%!important;display:block}}\n"], dependencies: [{ kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }, { kind: "component", type: PipWindowComponent, selector: "et-pip-window" }, { kind: "component", type: PipPlayerComponent, selector: "et-pip-player", inputs: ["entry", "showThumbnail"] }, { kind: "directive", type: PipBackDirective, selector: "[etPipBack]", inputs: ["entry"] }, { kind: "directive", type: PipGridToggleDirective, selector: "[etPipGridToggle]" }, { kind: "directive", type: PipStageDirective, selector: "[etPipStage]" }, { kind: "directive", type: PipTitleBarTemplateDirective, selector: "ng-template[etPipTitleBar]" }, { kind: "directive", type: PipCellDirective, selector: "[etPipCell]", inputs: ["etPipCell"] }, { kind: "directive", type: PipCloseDirective, selector: "[etPipClose]", inputs: ["entry"] }, { kind: "component", type: WindowControlButtonComponent, selector: "[et-window-control-button]", inputs: ["size", "kind"] }], encapsulation: i0.ViewEncapsulation.None }); }
30588
+ ], viewQueries: [{ propertyName: "stageRef", first: true, predicate: PipStageDirective, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "pipWindowRef", first: true, predicate: PipWindowComponent, descendants: true, isSignal: true }, { propertyName: "gridBtnRef", first: true, predicate: PipGridToggleDirective, descendants: true, read: ElementRef, isSignal: true }], hostDirectives: [{ directive: i1.ProvideSurfaceDirective }], ngImport: i0, template: "<et-pip-window>\n <ng-template etPipTitleBar>\n @if (state.showBackButton()) {\n <button [color]=\"controlsColor()\" [size]=\"WINDOW_CONTROL_BUTTON_SIZE\" et-window-control-button etPipBack>\n <i etIcon=\"et-arrow-out-up-right\"></i>\n </button>\n }\n <span class=\"et-pip-window__title-bar-spacer\"></span>\n @if (state.hasMultiplePips()) {\n <button\n [color]=\"controlsColor()\"\n [pressed]=\"state.multiView()\"\n [size]=\"WINDOW_CONTROL_BUTTON_SIZE\"\n et-window-control-button\n etPipGridToggle\n >\n @if (state.multiView()) {\n <i etIcon=\"et-focus-frame\"></i>\n } @else {\n <i etIcon=\"et-grid-2x2\"></i>\n }\n </button>\n }\n <button\n [color]=\"controlsColor()\"\n [kind]=\"CLOSE_KIND\"\n [size]=\"WINDOW_CONTROL_BUTTON_SIZE\"\n et-window-control-button\n etPipClose\n >\n <i etIcon=\"et-times\"></i>\n </button>\n </ng-template>\n\n <div etPipStage>\n @for (c of state.cells(); track c.playerId) {\n <div [etPipCell]=\"c\">\n <et-pip-player />\n </div>\n }\n </div>\n</et-pip-window>\n", styles: ["@layer components{et-stream-pip-chrome:not(.et-stream-pip-chrome--grid) et-pip-window:not(:has(.et-stream-pip-chrome__cell--featured .et-pip-player--ready)){visibility:hidden;pointer-events:none}et-stream-pip-chrome.et-stream-pip-chrome--grid et-pip-window:not(:has(.et-stream-pip-chrome__cell .et-pip-player--ready)){visibility:hidden;pointer-events:none}.et-stream-pip-chrome__stage{position:absolute;inset:0;overflow:hidden;clip-path:inset(0)}.et-stream-pip-chrome__cell{position:absolute;top:0;left:0;width:100%;height:100%;transform-origin:0 0;will-change:transform;overflow:hidden;transform:translate(calc(((var(--et-cell-col, 1) - 1) + var(--et-cell-exit-h, 0) * var(--et-pip-grid-cols, 1)) / var(--et-pip-grid-cols, 1) * 100%),calc((2 * (var(--et-cell-row, 1) - 1) + var(--et-pip-grid-cols, 1) - var(--et-pip-grid-rows, 1)) / (2 * var(--et-pip-grid-cols, 1)) * 100% + var(--et-cell-exit-v, 0) * 100%)) scale(calc(1 / var(--et-pip-grid-cols, 1)))}et-stream-pip-chrome:not(.et-stream-pip-chrome--grid) .et-stream-pip-chrome__cell--featured{transform:none}et-stream-pip-chrome:not(.et-stream-pip-chrome--grid) .et-stream-pip-chrome__cell:not(.et-stream-pip-chrome__cell--featured){transform:translate(calc(var(--et-cell-exit-h, 0) * 100%),calc(var(--et-cell-exit-v, 0) * 100%))}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell{cursor:pointer}.et-stream-pip-chrome__cell:after{content:\"\";position:absolute;inset:0;z-index:2;box-shadow:inset 0 0 0 5px transparent;transition:box-shadow .15s;pointer-events:none}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell:after{pointer-events:auto}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell:focus-visible:after{box-shadow:inset 0 0 0 5px color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 35%,transparent)}@media(hover:hover){et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell:hover:after{box-shadow:inset 0 0 0 5px color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 35%,transparent)}}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell:focus-visible{outline:none}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell--featured:after{box-shadow:inset 0 0 0 5px var(--et-stream-pip-chrome-featured-ring-color, var(--et-theme-color-primary-solid, #3b82f6))}et-pip-player{display:flex;align-items:center;justify-content:center;width:100%;height:100%;container-type:size}et-pip-player>:not(.et-pip-player__thumb-wrapper){flex:none;display:block!important;width:min(100cqw,100cqh * var(--et-pip-player-ratio, calc(16 / 9)))!important;height:min(100cqh,100cqw / var(--et-pip-player-ratio, calc(16 / 9)))!important}et-pip-player iframe{width:100%!important;height:100%!important;display:block}}\n"], dependencies: [{ kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }, { kind: "component", type: PipWindowComponent, selector: "et-pip-window" }, { kind: "component", type: PipPlayerComponent, selector: "et-pip-player", inputs: ["entry", "showThumbnail"] }, { kind: "directive", type: PipBackDirective, selector: "[etPipBack]", inputs: ["entry"] }, { kind: "directive", type: PipGridToggleDirective, selector: "[etPipGridToggle]" }, { kind: "directive", type: PipStageDirective, selector: "[etPipStage]" }, { kind: "directive", type: PipTitleBarTemplateDirective, selector: "ng-template[etPipTitleBar]" }, { kind: "directive", type: PipCellDirective, selector: "[etPipCell]", inputs: ["etPipCell"] }, { kind: "directive", type: PipCloseDirective, selector: "[etPipClose]", inputs: ["entry"] }, { kind: "component", type: WindowControlButtonComponent, selector: "[et-window-control-button]", inputs: ["size", "kind"] }], encapsulation: i0.ViewEncapsulation.None }); }
30518
30589
  }
30519
30590
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: StreamPipChromeComponent, decorators: [{
30520
30591
  type: Component,
@@ -30542,7 +30613,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
30542
30613
  ], hostDirectives: [ProvideSurfaceDirective], host: {
30543
30614
  class: 'et-stream-pip-chrome',
30544
30615
  '[class.et-stream-pip-chrome--grid]': 'state.multiView()',
30545
- }, template: "<et-pip-window>\n <ng-template etPipTitleBar>\n @if (state.showBackButton()) {\n <button [color]=\"controlsColor()\" [size]=\"WINDOW_CONTROL_BUTTON_SIZE\" et-window-control-button etPipBack>\n <i etIcon=\"et-arrow-out-up-right\"></i>\n </button>\n }\n <span class=\"et-pip-window__title-bar-spacer\"></span>\n @if (state.hasMultiplePips()) {\n <button\n [color]=\"controlsColor()\"\n [pressed]=\"state.multiView()\"\n [size]=\"WINDOW_CONTROL_BUTTON_SIZE\"\n et-window-control-button\n etPipGridToggle\n >\n @if (state.multiView()) {\n <i etIcon=\"et-focus-frame\"></i>\n } @else {\n <i etIcon=\"et-grid-2x2\"></i>\n }\n </button>\n }\n <button\n [color]=\"controlsColor()\"\n [kind]=\"CLOSE_KIND\"\n [size]=\"WINDOW_CONTROL_BUTTON_SIZE\"\n et-window-control-button\n etPipClose\n >\n <i etIcon=\"et-times\"></i>\n </button>\n </ng-template>\n\n <div etPipStage>\n @for (c of state.cells(); track c.playerId) {\n <div [etPipCell]=\"c\">\n <et-pip-player />\n </div>\n }\n </div>\n</et-pip-window>\n", styles: ["@layer components{et-stream-pip-chrome:not(.et-stream-pip-chrome--grid) et-pip-window:not(:has(.et-stream-pip-chrome__cell--featured .et-pip-player--ready)){visibility:hidden;pointer-events:none}et-stream-pip-chrome.et-stream-pip-chrome--grid et-pip-window:not(:has(.et-stream-pip-chrome__cell .et-pip-player--ready)){visibility:hidden;pointer-events:none}.et-stream-pip-chrome__stage{position:absolute;inset:0;overflow:hidden;clip-path:inset(0)}.et-stream-pip-chrome__cell{position:absolute;top:0;left:0;width:100%;height:100%;transform-origin:0 0;will-change:transform;overflow:hidden;transform:translate(calc(((var(--et-cell-col, 1) - 1) + var(--et-cell-exit-h, 0) * var(--et-pip-grid-cols, 1)) / var(--et-pip-grid-cols, 1) * 100%),calc((2 * (var(--et-cell-row, 1) - 1) + var(--et-pip-grid-cols, 1) - var(--et-pip-grid-rows, 1)) / (2 * var(--et-pip-grid-cols, 1)) * 100% + var(--et-cell-exit-v, 0) * 100%)) scale(calc(1 / var(--et-pip-grid-cols, 1)))}et-stream-pip-chrome:not(.et-stream-pip-chrome--grid) .et-stream-pip-chrome__cell--featured{transform:none}et-stream-pip-chrome:not(.et-stream-pip-chrome--grid) .et-stream-pip-chrome__cell:not(.et-stream-pip-chrome__cell--featured){transform:translate(calc(var(--et-cell-exit-h, 0) * 100%),calc(var(--et-cell-exit-v, 0) * 100%))}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell{cursor:pointer}.et-stream-pip-chrome__cell:after{content:\"\";position:absolute;inset:0;z-index:2;box-shadow:inset 0 0 0 5px transparent;transition:box-shadow .15s;pointer-events:none}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell:after{pointer-events:auto}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell:hover:after,et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell:focus-visible:after{box-shadow:inset 0 0 0 5px color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 35%,transparent)}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell:focus-visible{outline:none}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell--featured:after{box-shadow:inset 0 0 0 5px var(--et-stream-pip-chrome-featured-ring-color, var(--et-theme-color-primary-solid, #3b82f6))}et-pip-player{display:flex;align-items:center;justify-content:center;width:100%;height:100%;container-type:size}et-pip-player>:not(.et-pip-player__thumb-wrapper){flex:none;display:block!important;width:min(100cqw,100cqh * var(--et-pip-player-ratio, calc(16 / 9)))!important;height:min(100cqh,100cqw / var(--et-pip-player-ratio, calc(16 / 9)))!important}et-pip-player iframe{width:100%!important;height:100%!important;display:block}}\n"] }]
30616
+ }, template: "<et-pip-window>\n <ng-template etPipTitleBar>\n @if (state.showBackButton()) {\n <button [color]=\"controlsColor()\" [size]=\"WINDOW_CONTROL_BUTTON_SIZE\" et-window-control-button etPipBack>\n <i etIcon=\"et-arrow-out-up-right\"></i>\n </button>\n }\n <span class=\"et-pip-window__title-bar-spacer\"></span>\n @if (state.hasMultiplePips()) {\n <button\n [color]=\"controlsColor()\"\n [pressed]=\"state.multiView()\"\n [size]=\"WINDOW_CONTROL_BUTTON_SIZE\"\n et-window-control-button\n etPipGridToggle\n >\n @if (state.multiView()) {\n <i etIcon=\"et-focus-frame\"></i>\n } @else {\n <i etIcon=\"et-grid-2x2\"></i>\n }\n </button>\n }\n <button\n [color]=\"controlsColor()\"\n [kind]=\"CLOSE_KIND\"\n [size]=\"WINDOW_CONTROL_BUTTON_SIZE\"\n et-window-control-button\n etPipClose\n >\n <i etIcon=\"et-times\"></i>\n </button>\n </ng-template>\n\n <div etPipStage>\n @for (c of state.cells(); track c.playerId) {\n <div [etPipCell]=\"c\">\n <et-pip-player />\n </div>\n }\n </div>\n</et-pip-window>\n", styles: ["@layer components{et-stream-pip-chrome:not(.et-stream-pip-chrome--grid) et-pip-window:not(:has(.et-stream-pip-chrome__cell--featured .et-pip-player--ready)){visibility:hidden;pointer-events:none}et-stream-pip-chrome.et-stream-pip-chrome--grid et-pip-window:not(:has(.et-stream-pip-chrome__cell .et-pip-player--ready)){visibility:hidden;pointer-events:none}.et-stream-pip-chrome__stage{position:absolute;inset:0;overflow:hidden;clip-path:inset(0)}.et-stream-pip-chrome__cell{position:absolute;top:0;left:0;width:100%;height:100%;transform-origin:0 0;will-change:transform;overflow:hidden;transform:translate(calc(((var(--et-cell-col, 1) - 1) + var(--et-cell-exit-h, 0) * var(--et-pip-grid-cols, 1)) / var(--et-pip-grid-cols, 1) * 100%),calc((2 * (var(--et-cell-row, 1) - 1) + var(--et-pip-grid-cols, 1) - var(--et-pip-grid-rows, 1)) / (2 * var(--et-pip-grid-cols, 1)) * 100% + var(--et-cell-exit-v, 0) * 100%)) scale(calc(1 / var(--et-pip-grid-cols, 1)))}et-stream-pip-chrome:not(.et-stream-pip-chrome--grid) .et-stream-pip-chrome__cell--featured{transform:none}et-stream-pip-chrome:not(.et-stream-pip-chrome--grid) .et-stream-pip-chrome__cell:not(.et-stream-pip-chrome__cell--featured){transform:translate(calc(var(--et-cell-exit-h, 0) * 100%),calc(var(--et-cell-exit-v, 0) * 100%))}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell{cursor:pointer}.et-stream-pip-chrome__cell:after{content:\"\";position:absolute;inset:0;z-index:2;box-shadow:inset 0 0 0 5px transparent;transition:box-shadow .15s;pointer-events:none}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell:after{pointer-events:auto}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell:focus-visible:after{box-shadow:inset 0 0 0 5px color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 35%,transparent)}@media(hover:hover){et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell:hover:after{box-shadow:inset 0 0 0 5px color-mix(in srgb,var(--et-surface-interaction-solid, rgb(255 255 255)) 35%,transparent)}}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell:focus-visible{outline:none}et-stream-pip-chrome.et-stream-pip-chrome--grid .et-stream-pip-chrome__cell--featured:after{box-shadow:inset 0 0 0 5px var(--et-stream-pip-chrome-featured-ring-color, var(--et-theme-color-primary-solid, #3b82f6))}et-pip-player{display:flex;align-items:center;justify-content:center;width:100%;height:100%;container-type:size}et-pip-player>:not(.et-pip-player__thumb-wrapper){flex:none;display:block!important;width:min(100cqw,100cqh * var(--et-pip-player-ratio, calc(16 / 9)))!important;height:min(100cqh,100cqw / var(--et-pip-player-ratio, calc(16 / 9)))!important}et-pip-player iframe{width:100%!important;height:100%!important;display:block}}\n"] }]
30546
30617
  }], ctorParameters: () => [], propDecorators: { stageRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => PipStageDirective), { ...{ read: ElementRef }, isSignal: true }] }], pipWindowRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => PipWindowComponent), { isSignal: true }] }], gridBtnRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => PipGridToggleDirective), { ...{
30547
30618
  read: ElementRef,
30548
30619
  }, isSignal: true }] }] } });
@@ -34046,7 +34117,7 @@ class NavTabLinkComponent {
34046
34117
  this.elementRef.nativeElement.click();
34047
34118
  }
34048
34119
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NavTabLinkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
34049
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: NavTabLinkComponent, isStandalone: true, selector: "a[et-nav-tab-link]", host: { listeners: { "keydown.space": "handleSpace($event)" }, properties: { "class.et-nav-tab-link--active": "navTabLink.isActive()", "class.et-nav-tab-link--disabled": "navTabLink.trigger.disabled()" }, classAttribute: "et-nav-tab-link" }, hostDirectives: [{ directive: i1$1.RouterLink, inputs: ["routerLink", "et-nav-tab-link", "queryParams", "queryParams", "fragment", "fragment", "queryParamsHandling", "queryParamsHandling", "preserveFragment", "preserveFragment", "skipLocationChange", "skipLocationChange", "replaceUrl", "replaceUrl", "state", "state", "relativeTo", "relativeTo"] }, { directive: i1$1.RouterLinkActive, inputs: ["routerLinkActive", "routerLinkActive", "routerLinkActiveOptions", "routerLinkActiveOptions", "ariaCurrentWhenActive", "ariaCurrentWhenActive"] }, { directive: TabBarTriggerDirective, inputs: ["disabled", "disabled"] }, { directive: NavTabLinkDirective }, { directive: FocusRingDirective }], ngImport: i0, template: `<span class="et-nav-tab-link__content"><ng-content /></span><span etTabBarUnderline></span>`, isInline: true, styles: ["@property --et-nav-tab-link-padding-inline{syntax: \"<length>\"; inherits: false; initial-value: 16px;}@property --et-nav-tab-link-padding-block{syntax: \"<length>\"; inherits: false; initial-value: 12px;}.et-nav-tab-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding-inline:var(--et-nav-tab-link-padding-inline);padding-block:var(--et-nav-tab-link-padding-block);text-decoration:none;color:var(--et-surface-interaction-solid, inherit);font-size:var(--et-nav-tabs-font-size, inherit);cursor:pointer;position:relative;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:color .15s ease,background .15s ease;outline:none;border-radius:.5rem}.et-nav-tab-link.et-tab-bar-trigger--no-initial-transition{transition:none}.et-nav-tab-link.et-nav-tab-link--active:not(.et-tab-bar-trigger--just-activated):hover{background:rgb(var(--et-color-primary, 0 0 0) / .08)}.et-nav-tab-link.et-nav-tab-link--active:not(.et-tab-bar-trigger--just-activated):focus-visible{background:rgb(var(--et-color-primary, 0 0 0) / .12)}.et-nav-tab-link.et-nav-tab-link--active:not(.et-tab-bar-trigger--just-activated):active{background:rgb(var(--et-color-primary, 0 0 0) / .16)}[data-variant=primary] .et-nav-tab-link{flex-direction:column;gap:4px}.et-nav-tab-link [etIcon]{width:1.2em;height:1.2em}.et-nav-tab-link.et-nav-tab-link--active{color:var(--et-surface-color-solid, inherit)}.et-nav-tab-link.et-nav-tab-link--disabled{pointer-events:none;cursor:default}.et-nav-tab-link .et-nav-tab-link__content{display:inline-flex;align-items:center;gap:inherit;border-radius:.5rem;padding:4px 8px;margin:-4px -8px}.et-nav-tab-link:focus-visible .et-nav-tab-link__content{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px}.et-nav-tab-link .et-tab-bar-underline{position:absolute;z-index:1;background:var(--et-theme-color-ink-solid, currentColor);border-radius:var(--et-nav-tabs-underline-radius, 1px);pointer-events:none;opacity:0}.et-nav-tab-link .et-tab-bar-underline--active{opacity:1}[data-orientation=horizontal] .et-nav-tab-link .et-tab-bar-underline{bottom:0;left:0;right:0;height:var(--et-nav-tabs-underline-size, 2px);transform-origin:left}[data-variant=primary][data-orientation=horizontal] .et-nav-tab-link .et-tab-bar-underline{left:25%;right:25%;height:var(--et-nav-tabs-underline-size, 3px);border-radius:var(--et-nav-tabs-underline-size, 3px) var(--et-nav-tabs-underline-size, 3px) 0 0}[data-orientation=vertical] .et-nav-tab-link .et-tab-bar-underline{left:0;top:0;bottom:0;width:var(--et-nav-tabs-underline-size, 2px);transform-origin:top}[data-variant=primary][data-orientation=vertical] .et-nav-tab-link .et-tab-bar-underline{top:25%;bottom:25%;width:var(--et-nav-tabs-underline-size, 3px);border-radius:0 var(--et-nav-tabs-underline-size, 3px) var(--et-nav-tabs-underline-size, 3px) 0}[data-size=sm] .et-nav-tab-link{--et-nav-tab-link-padding-inline: 12px;--et-nav-tab-link-padding-block: 8px}[data-size=md] .et-nav-tab-link{--et-nav-tab-link-padding-inline: 16px;--et-nav-tab-link-padding-block: 12px}[data-size=lg] .et-nav-tab-link{--et-nav-tab-link-padding-inline: 20px;--et-nav-tab-link-padding-block: 14px}\n"], dependencies: [{ kind: "directive", type: TabBarUnderlineDirective, selector: "[etTabBarUnderline]" }], encapsulation: i0.ViewEncapsulation.None }); }
34120
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: NavTabLinkComponent, isStandalone: true, selector: "a[et-nav-tab-link]", host: { listeners: { "keydown.space": "handleSpace($event)" }, properties: { "class.et-nav-tab-link--active": "navTabLink.isActive()", "class.et-nav-tab-link--disabled": "navTabLink.trigger.disabled()" }, classAttribute: "et-nav-tab-link" }, hostDirectives: [{ directive: i1$1.RouterLink, inputs: ["routerLink", "et-nav-tab-link", "queryParams", "queryParams", "fragment", "fragment", "queryParamsHandling", "queryParamsHandling", "preserveFragment", "preserveFragment", "skipLocationChange", "skipLocationChange", "replaceUrl", "replaceUrl", "state", "state", "relativeTo", "relativeTo"] }, { directive: i1$1.RouterLinkActive, inputs: ["routerLinkActive", "routerLinkActive", "routerLinkActiveOptions", "routerLinkActiveOptions", "ariaCurrentWhenActive", "ariaCurrentWhenActive"] }, { directive: TabBarTriggerDirective, inputs: ["disabled", "disabled"] }, { directive: NavTabLinkDirective }, { directive: FocusRingDirective }], ngImport: i0, template: `<span class="et-nav-tab-link__content"><ng-content /></span><span etTabBarUnderline></span>`, isInline: true, styles: ["@property --et-nav-tab-link-padding-inline{syntax: \"<length>\"; inherits: false; initial-value: 16px;}@property --et-nav-tab-link-padding-block{syntax: \"<length>\"; inherits: false; initial-value: 12px;}.et-nav-tab-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding-inline:var(--et-nav-tab-link-padding-inline);padding-block:var(--et-nav-tab-link-padding-block);text-decoration:none;color:var(--et-surface-interaction-solid, inherit);font-size:var(--et-nav-tabs-font-size, inherit);cursor:pointer;position:relative;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:color .15s ease,background .15s ease;outline:none;border-radius:.5rem}.et-nav-tab-link.et-tab-bar-trigger--no-initial-transition{transition:none}@media(hover:hover){.et-nav-tab-link.et-nav-tab-link--active:not(.et-tab-bar-trigger--just-activated):hover{background:rgb(var(--et-color-primary, 0 0 0) / .08)}}.et-nav-tab-link.et-nav-tab-link--active:not(.et-tab-bar-trigger--just-activated):focus-visible{background:rgb(var(--et-color-primary, 0 0 0) / .12)}.et-nav-tab-link.et-nav-tab-link--active:not(.et-tab-bar-trigger--just-activated):active{background:rgb(var(--et-color-primary, 0 0 0) / .16)}[data-variant=primary] .et-nav-tab-link{flex-direction:column;gap:4px}.et-nav-tab-link [etIcon]{width:1.2em;height:1.2em}.et-nav-tab-link.et-nav-tab-link--active{color:var(--et-surface-color-solid, inherit)}.et-nav-tab-link.et-nav-tab-link--disabled{pointer-events:none;cursor:default}.et-nav-tab-link .et-nav-tab-link__content{display:inline-flex;align-items:center;gap:inherit;border-radius:.5rem;padding:4px 8px;margin:-4px -8px}.et-nav-tab-link:focus-visible .et-nav-tab-link__content{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px}.et-nav-tab-link .et-tab-bar-underline{position:absolute;z-index:1;background:var(--et-theme-color-ink-solid, currentColor);border-radius:var(--et-nav-tabs-underline-radius, 1px);pointer-events:none;opacity:0}.et-nav-tab-link .et-tab-bar-underline--active{opacity:1}[data-orientation=horizontal] .et-nav-tab-link .et-tab-bar-underline{bottom:0;left:0;right:0;height:var(--et-nav-tabs-underline-size, 2px);transform-origin:left}[data-variant=primary][data-orientation=horizontal] .et-nav-tab-link .et-tab-bar-underline{left:25%;right:25%;height:var(--et-nav-tabs-underline-size, 3px);border-radius:var(--et-nav-tabs-underline-size, 3px) var(--et-nav-tabs-underline-size, 3px) 0 0}[data-orientation=vertical] .et-nav-tab-link .et-tab-bar-underline{left:0;top:0;bottom:0;width:var(--et-nav-tabs-underline-size, 2px);transform-origin:top}[data-variant=primary][data-orientation=vertical] .et-nav-tab-link .et-tab-bar-underline{top:25%;bottom:25%;width:var(--et-nav-tabs-underline-size, 3px);border-radius:0 var(--et-nav-tabs-underline-size, 3px) var(--et-nav-tabs-underline-size, 3px) 0}[data-size=sm] .et-nav-tab-link{--et-nav-tab-link-padding-inline: 12px;--et-nav-tab-link-padding-block: 8px}[data-size=md] .et-nav-tab-link{--et-nav-tab-link-padding-inline: 16px;--et-nav-tab-link-padding-block: 12px}[data-size=lg] .et-nav-tab-link{--et-nav-tab-link-padding-inline: 20px;--et-nav-tab-link-padding-block: 14px}\n"], dependencies: [{ kind: "directive", type: TabBarUnderlineDirective, selector: "[etTabBarUnderline]" }], encapsulation: i0.ViewEncapsulation.None }); }
34050
34121
  }
34051
34122
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NavTabLinkComponent, decorators: [{
34052
34123
  type: Component,
@@ -34080,7 +34151,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
34080
34151
  '[class.et-nav-tab-link--active]': 'navTabLink.isActive()',
34081
34152
  '[class.et-nav-tab-link--disabled]': 'navTabLink.trigger.disabled()',
34082
34153
  '(keydown.space)': 'handleSpace($event)',
34083
- }, styles: ["@property --et-nav-tab-link-padding-inline{syntax: \"<length>\"; inherits: false; initial-value: 16px;}@property --et-nav-tab-link-padding-block{syntax: \"<length>\"; inherits: false; initial-value: 12px;}.et-nav-tab-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding-inline:var(--et-nav-tab-link-padding-inline);padding-block:var(--et-nav-tab-link-padding-block);text-decoration:none;color:var(--et-surface-interaction-solid, inherit);font-size:var(--et-nav-tabs-font-size, inherit);cursor:pointer;position:relative;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:color .15s ease,background .15s ease;outline:none;border-radius:.5rem}.et-nav-tab-link.et-tab-bar-trigger--no-initial-transition{transition:none}.et-nav-tab-link.et-nav-tab-link--active:not(.et-tab-bar-trigger--just-activated):hover{background:rgb(var(--et-color-primary, 0 0 0) / .08)}.et-nav-tab-link.et-nav-tab-link--active:not(.et-tab-bar-trigger--just-activated):focus-visible{background:rgb(var(--et-color-primary, 0 0 0) / .12)}.et-nav-tab-link.et-nav-tab-link--active:not(.et-tab-bar-trigger--just-activated):active{background:rgb(var(--et-color-primary, 0 0 0) / .16)}[data-variant=primary] .et-nav-tab-link{flex-direction:column;gap:4px}.et-nav-tab-link [etIcon]{width:1.2em;height:1.2em}.et-nav-tab-link.et-nav-tab-link--active{color:var(--et-surface-color-solid, inherit)}.et-nav-tab-link.et-nav-tab-link--disabled{pointer-events:none;cursor:default}.et-nav-tab-link .et-nav-tab-link__content{display:inline-flex;align-items:center;gap:inherit;border-radius:.5rem;padding:4px 8px;margin:-4px -8px}.et-nav-tab-link:focus-visible .et-nav-tab-link__content{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px}.et-nav-tab-link .et-tab-bar-underline{position:absolute;z-index:1;background:var(--et-theme-color-ink-solid, currentColor);border-radius:var(--et-nav-tabs-underline-radius, 1px);pointer-events:none;opacity:0}.et-nav-tab-link .et-tab-bar-underline--active{opacity:1}[data-orientation=horizontal] .et-nav-tab-link .et-tab-bar-underline{bottom:0;left:0;right:0;height:var(--et-nav-tabs-underline-size, 2px);transform-origin:left}[data-variant=primary][data-orientation=horizontal] .et-nav-tab-link .et-tab-bar-underline{left:25%;right:25%;height:var(--et-nav-tabs-underline-size, 3px);border-radius:var(--et-nav-tabs-underline-size, 3px) var(--et-nav-tabs-underline-size, 3px) 0 0}[data-orientation=vertical] .et-nav-tab-link .et-tab-bar-underline{left:0;top:0;bottom:0;width:var(--et-nav-tabs-underline-size, 2px);transform-origin:top}[data-variant=primary][data-orientation=vertical] .et-nav-tab-link .et-tab-bar-underline{top:25%;bottom:25%;width:var(--et-nav-tabs-underline-size, 3px);border-radius:0 var(--et-nav-tabs-underline-size, 3px) var(--et-nav-tabs-underline-size, 3px) 0}[data-size=sm] .et-nav-tab-link{--et-nav-tab-link-padding-inline: 12px;--et-nav-tab-link-padding-block: 8px}[data-size=md] .et-nav-tab-link{--et-nav-tab-link-padding-inline: 16px;--et-nav-tab-link-padding-block: 12px}[data-size=lg] .et-nav-tab-link{--et-nav-tab-link-padding-inline: 20px;--et-nav-tab-link-padding-block: 14px}\n"] }]
34154
+ }, styles: ["@property --et-nav-tab-link-padding-inline{syntax: \"<length>\"; inherits: false; initial-value: 16px;}@property --et-nav-tab-link-padding-block{syntax: \"<length>\"; inherits: false; initial-value: 12px;}.et-nav-tab-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding-inline:var(--et-nav-tab-link-padding-inline);padding-block:var(--et-nav-tab-link-padding-block);text-decoration:none;color:var(--et-surface-interaction-solid, inherit);font-size:var(--et-nav-tabs-font-size, inherit);cursor:pointer;position:relative;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:color .15s ease,background .15s ease;outline:none;border-radius:.5rem}.et-nav-tab-link.et-tab-bar-trigger--no-initial-transition{transition:none}@media(hover:hover){.et-nav-tab-link.et-nav-tab-link--active:not(.et-tab-bar-trigger--just-activated):hover{background:rgb(var(--et-color-primary, 0 0 0) / .08)}}.et-nav-tab-link.et-nav-tab-link--active:not(.et-tab-bar-trigger--just-activated):focus-visible{background:rgb(var(--et-color-primary, 0 0 0) / .12)}.et-nav-tab-link.et-nav-tab-link--active:not(.et-tab-bar-trigger--just-activated):active{background:rgb(var(--et-color-primary, 0 0 0) / .16)}[data-variant=primary] .et-nav-tab-link{flex-direction:column;gap:4px}.et-nav-tab-link [etIcon]{width:1.2em;height:1.2em}.et-nav-tab-link.et-nav-tab-link--active{color:var(--et-surface-color-solid, inherit)}.et-nav-tab-link.et-nav-tab-link--disabled{pointer-events:none;cursor:default}.et-nav-tab-link .et-nav-tab-link__content{display:inline-flex;align-items:center;gap:inherit;border-radius:.5rem;padding:4px 8px;margin:-4px -8px}.et-nav-tab-link:focus-visible .et-nav-tab-link__content{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px}.et-nav-tab-link .et-tab-bar-underline{position:absolute;z-index:1;background:var(--et-theme-color-ink-solid, currentColor);border-radius:var(--et-nav-tabs-underline-radius, 1px);pointer-events:none;opacity:0}.et-nav-tab-link .et-tab-bar-underline--active{opacity:1}[data-orientation=horizontal] .et-nav-tab-link .et-tab-bar-underline{bottom:0;left:0;right:0;height:var(--et-nav-tabs-underline-size, 2px);transform-origin:left}[data-variant=primary][data-orientation=horizontal] .et-nav-tab-link .et-tab-bar-underline{left:25%;right:25%;height:var(--et-nav-tabs-underline-size, 3px);border-radius:var(--et-nav-tabs-underline-size, 3px) var(--et-nav-tabs-underline-size, 3px) 0 0}[data-orientation=vertical] .et-nav-tab-link .et-tab-bar-underline{left:0;top:0;bottom:0;width:var(--et-nav-tabs-underline-size, 2px);transform-origin:top}[data-variant=primary][data-orientation=vertical] .et-nav-tab-link .et-tab-bar-underline{top:25%;bottom:25%;width:var(--et-nav-tabs-underline-size, 3px);border-radius:0 var(--et-nav-tabs-underline-size, 3px) var(--et-nav-tabs-underline-size, 3px) 0}[data-size=sm] .et-nav-tab-link{--et-nav-tab-link-padding-inline: 12px;--et-nav-tab-link-padding-block: 8px}[data-size=md] .et-nav-tab-link{--et-nav-tab-link-padding-inline: 16px;--et-nav-tab-link-padding-block: 12px}[data-size=lg] .et-nav-tab-link{--et-nav-tab-link-padding-inline: 20px;--et-nav-tab-link-padding-block: 14px}\n"] }]
34084
34155
  }] });
34085
34156
 
34086
34157
  class NavTabsOutletComponent {
@@ -34547,7 +34618,7 @@ class TabGroupComponent {
34547
34618
  </div>
34548
34619
  }
34549
34620
  </div>
34550
- `, isInline: true, styles: ["@property --et-tab-group-gap{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --et-tab-group-header-gap{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --et-tab-group-trigger-padding-inline{syntax: \"<length>\"; inherits: false; initial-value: 16px;}@property --et-tab-group-trigger-padding-block{syntax: \"<length>\"; inherits: false; initial-value: 12px;}@property --et-tab-group-underline-size{syntax: \"<length>\"; inherits: false; initial-value: 2px;}@property --et-tab-group-underline-radius{syntax: \"<length>\"; inherits: false; initial-value: 1px;}@property --et-tab-group-font-size{syntax: \"<length>\"; inherits: false; initial-value: 1.4rem;}.et-tab-group{display:flex;flex-direction:column;gap:var(--et-tab-group-gap)}.et-tab-group[data-orientation=vertical]{flex-direction:row}.et-tab-group:where([data-size=sm]){--et-tab-group-trigger-padding-inline: 12px;--et-tab-group-trigger-padding-block: 8px;--et-tab-group-font-size: 1.2rem;--et-tab-group-underline-size: 2px}.et-tab-group:where([data-size=md]){--et-tab-group-trigger-padding-inline: 16px;--et-tab-group-trigger-padding-block: 12px;--et-tab-group-font-size: 1.4rem;--et-tab-group-underline-size: 2px}.et-tab-group:where([data-size=lg]){--et-tab-group-trigger-padding-inline: 20px;--et-tab-group-trigger-padding-block: 14px;--et-tab-group-font-size: 1.6rem;--et-tab-group-underline-size: 3px}.et-tab-group:where([data-variant=primary][data-size=sm]){--et-tab-group-underline-size: 3px}.et-tab-group:where([data-variant=primary][data-size=md]){--et-tab-group-underline-size: 3px}.et-tab-group:where([data-variant=primary][data-size=lg]){--et-tab-group-underline-size: 4px}.et-tab-group__header-shell,.et-tab-group__header-scrollable{min-inline-size:0}.et-tab-group__header{position:relative;gap:var(--et-tab-group-header-gap)}.et-tab-group__header:after{content:\"\";position:absolute;background:var(--et-surface-border-solid, currentColor);opacity:.2;pointer-events:none}[data-divider=false] .et-tab-group__header:after{display:none}[data-orientation=horizontal] .et-tab-group__header:after{bottom:0;left:0;right:0;height:var(--et-tab-group-underline-size);border-radius:var(--et-tab-group-underline-radius)}[data-orientation=vertical] .et-tab-group__header{justify-items:start}[data-orientation=vertical] .et-tab-group__header:after{left:0;top:0;bottom:0;width:var(--et-tab-group-underline-size);border-radius:var(--et-tab-group-underline-radius)}.et-tab-group__trigger{display:inline-flex;align-items:center;justify-content:center;padding-inline:var(--et-tab-group-trigger-padding-inline);padding-block:var(--et-tab-group-trigger-padding-block);border:none;background:none;color:var(--et-surface-interaction-solid, inherit);font:inherit;font-size:var(--et-tab-group-font-size);cursor:pointer;position:relative;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:color .15s ease,background .15s ease;outline:none;border-radius:.5rem}.et-tab-group__trigger.et-tab-bar-trigger--no-initial-transition{transition:none}.et-tab-group__trigger.et-tab-group__trigger--active:not(.et-tab-bar-trigger--just-activated):hover{background:rgb(var(--et-color-primary, 0 0 0) / .08)}.et-tab-group__trigger.et-tab-group__trigger--active:not(.et-tab-bar-trigger--just-activated):focus-visible{background:rgb(var(--et-color-primary, 0 0 0) / .12)}.et-tab-group__trigger.et-tab-group__trigger--active:not(.et-tab-bar-trigger--just-activated):active{background:rgb(var(--et-color-primary, 0 0 0) / .16)}.et-tab-group__trigger .et-tab-group__trigger-content{display:flex;align-items:center;gap:8px;border-radius:.5rem;padding:4px 8px;margin:-4px -8px}.et-tab-group__trigger:focus-visible .et-tab-group__trigger-content{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px}.et-tab-group__trigger .et-tab-group__trigger-icon{width:1.2em;height:1.2em}[data-variant=primary] .et-tab-group__trigger .et-tab-group__trigger-content{flex-direction:column;gap:4px}.et-tab-group__trigger .et-tab-bar-underline{position:absolute;z-index:1;background:var(--et-theme-color-ink-solid, currentColor);border-radius:var(--et-tab-group-underline-radius);pointer-events:none;opacity:0}.et-tab-group__trigger .et-tab-bar-underline--active{opacity:1}[data-orientation=horizontal] .et-tab-group__trigger .et-tab-bar-underline{bottom:0;left:0;right:0;height:var(--et-tab-group-underline-size);transform-origin:left}[data-variant=primary][data-orientation=horizontal] .et-tab-group__trigger .et-tab-bar-underline{left:25%;right:25%;height:var(--et-tab-group-underline-size);border-radius:var(--et-tab-group-underline-size) var(--et-tab-group-underline-size) 0 0}[data-orientation=vertical] .et-tab-group__trigger .et-tab-bar-underline{left:0;top:0;bottom:0;width:var(--et-tab-group-underline-size);transform-origin:top}[data-variant=primary][data-orientation=vertical] .et-tab-group__trigger .et-tab-bar-underline{top:25%;bottom:25%;width:var(--et-tab-group-underline-size);border-radius:0 var(--et-tab-group-underline-size) var(--et-tab-group-underline-size) 0}.et-tab-group__trigger.et-tab-group__trigger--active{color:var(--et-surface-color-solid, inherit)}.et-tab-group__trigger:disabled{pointer-events:none;cursor:default}.et-tab-group__body{display:grid}.et-tab-group__panel{grid-area:1 / 1}.et-tab-group__panel[hidden]{display:none}\n"], dependencies: [{ kind: "directive", type: TabBarTriggerDirective, selector: "[etTabBarTrigger]", inputs: ["disabled"] }, { kind: "directive", type: TabBarUnderlineDirective, selector: "[etTabBarUnderline]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }, { kind: "directive", type: FocusRingDirective, selector: "[etFocusRing]", inputs: ["disabled"] }, { kind: "component", type: ScrollableComponent, selector: "et-scrollable", inputs: ["renderMasks", "maskVariant", "renderButtons", "buttonPosition", "renderNavigation", "snap", "cursorDragScroll", "darkenNonIntersectingItems", "stickyButtons", "showLoadingTemplate", "loadingTemplatePosition", "scrollableRole", "scrollableClass"], outputs: ["intersectionChange", "scrollStateChange"] }], encapsulation: i0.ViewEncapsulation.None }); }
34621
+ `, isInline: true, styles: ["@property --et-tab-group-gap{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --et-tab-group-header-gap{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --et-tab-group-trigger-padding-inline{syntax: \"<length>\"; inherits: false; initial-value: 16px;}@property --et-tab-group-trigger-padding-block{syntax: \"<length>\"; inherits: false; initial-value: 12px;}@property --et-tab-group-underline-size{syntax: \"<length>\"; inherits: false; initial-value: 2px;}@property --et-tab-group-underline-radius{syntax: \"<length>\"; inherits: false; initial-value: 1px;}@property --et-tab-group-font-size{syntax: \"<length>\"; inherits: false; initial-value: 1.4rem;}.et-tab-group{display:flex;flex-direction:column;gap:var(--et-tab-group-gap)}.et-tab-group[data-orientation=vertical]{flex-direction:row}.et-tab-group:where([data-size=sm]){--et-tab-group-trigger-padding-inline: 12px;--et-tab-group-trigger-padding-block: 8px;--et-tab-group-font-size: 1.2rem;--et-tab-group-underline-size: 2px}.et-tab-group:where([data-size=md]){--et-tab-group-trigger-padding-inline: 16px;--et-tab-group-trigger-padding-block: 12px;--et-tab-group-font-size: 1.4rem;--et-tab-group-underline-size: 2px}.et-tab-group:where([data-size=lg]){--et-tab-group-trigger-padding-inline: 20px;--et-tab-group-trigger-padding-block: 14px;--et-tab-group-font-size: 1.6rem;--et-tab-group-underline-size: 3px}.et-tab-group:where([data-variant=primary][data-size=sm]){--et-tab-group-underline-size: 3px}.et-tab-group:where([data-variant=primary][data-size=md]){--et-tab-group-underline-size: 3px}.et-tab-group:where([data-variant=primary][data-size=lg]){--et-tab-group-underline-size: 4px}.et-tab-group__header-shell,.et-tab-group__header-scrollable{min-inline-size:0}.et-tab-group__header{position:relative;gap:var(--et-tab-group-header-gap)}.et-tab-group__header:after{content:\"\";position:absolute;background:var(--et-surface-border-solid, currentColor);opacity:.2;pointer-events:none}[data-divider=false] .et-tab-group__header:after{display:none}[data-orientation=horizontal] .et-tab-group__header:after{bottom:0;left:0;right:0;height:var(--et-tab-group-underline-size);border-radius:var(--et-tab-group-underline-radius)}[data-orientation=vertical] .et-tab-group__header{justify-items:start}[data-orientation=vertical] .et-tab-group__header:after{left:0;top:0;bottom:0;width:var(--et-tab-group-underline-size);border-radius:var(--et-tab-group-underline-radius)}.et-tab-group__trigger{display:inline-flex;align-items:center;justify-content:center;padding-inline:var(--et-tab-group-trigger-padding-inline);padding-block:var(--et-tab-group-trigger-padding-block);border:none;background:none;color:var(--et-surface-interaction-solid, inherit);font:inherit;font-size:var(--et-tab-group-font-size);cursor:pointer;position:relative;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:color .15s ease,background .15s ease;outline:none;border-radius:.5rem}.et-tab-group__trigger.et-tab-bar-trigger--no-initial-transition{transition:none}@media(hover:hover){.et-tab-group__trigger.et-tab-group__trigger--active:not(.et-tab-bar-trigger--just-activated):hover{background:rgb(var(--et-color-primary, 0 0 0) / .08)}}.et-tab-group__trigger.et-tab-group__trigger--active:not(.et-tab-bar-trigger--just-activated):focus-visible{background:rgb(var(--et-color-primary, 0 0 0) / .12)}.et-tab-group__trigger.et-tab-group__trigger--active:not(.et-tab-bar-trigger--just-activated):active{background:rgb(var(--et-color-primary, 0 0 0) / .16)}.et-tab-group__trigger .et-tab-group__trigger-content{display:flex;align-items:center;gap:8px;border-radius:.5rem;padding:4px 8px;margin:-4px -8px}.et-tab-group__trigger:focus-visible .et-tab-group__trigger-content{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px}.et-tab-group__trigger .et-tab-group__trigger-icon{width:1.2em;height:1.2em}[data-variant=primary] .et-tab-group__trigger .et-tab-group__trigger-content{flex-direction:column;gap:4px}.et-tab-group__trigger .et-tab-bar-underline{position:absolute;z-index:1;background:var(--et-theme-color-ink-solid, currentColor);border-radius:var(--et-tab-group-underline-radius);pointer-events:none;opacity:0}.et-tab-group__trigger .et-tab-bar-underline--active{opacity:1}[data-orientation=horizontal] .et-tab-group__trigger .et-tab-bar-underline{bottom:0;left:0;right:0;height:var(--et-tab-group-underline-size);transform-origin:left}[data-variant=primary][data-orientation=horizontal] .et-tab-group__trigger .et-tab-bar-underline{left:25%;right:25%;height:var(--et-tab-group-underline-size);border-radius:var(--et-tab-group-underline-size) var(--et-tab-group-underline-size) 0 0}[data-orientation=vertical] .et-tab-group__trigger .et-tab-bar-underline{left:0;top:0;bottom:0;width:var(--et-tab-group-underline-size);transform-origin:top}[data-variant=primary][data-orientation=vertical] .et-tab-group__trigger .et-tab-bar-underline{top:25%;bottom:25%;width:var(--et-tab-group-underline-size);border-radius:0 var(--et-tab-group-underline-size) var(--et-tab-group-underline-size) 0}.et-tab-group__trigger.et-tab-group__trigger--active{color:var(--et-surface-color-solid, inherit)}.et-tab-group__trigger:disabled{pointer-events:none;cursor:default}.et-tab-group__body{display:grid}.et-tab-group__panel{grid-area:1 / 1}.et-tab-group__panel[hidden]{display:none}\n"], dependencies: [{ kind: "directive", type: TabBarTriggerDirective, selector: "[etTabBarTrigger]", inputs: ["disabled"] }, { kind: "directive", type: TabBarUnderlineDirective, selector: "[etTabBarUnderline]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor"] }, { kind: "directive", type: FocusRingDirective, selector: "[etFocusRing]", inputs: ["disabled"] }, { kind: "component", type: ScrollableComponent, selector: "et-scrollable", inputs: ["renderMasks", "maskVariant", "renderButtons", "buttonPosition", "renderNavigation", "snap", "cursorDragScroll", "darkenNonIntersectingItems", "stickyButtons", "showLoadingTemplate", "loadingTemplatePosition", "scrollableRole", "scrollableClass"], outputs: ["intersectionChange", "scrollStateChange"] }], encapsulation: i0.ViewEncapsulation.None }); }
34551
34622
  }
34552
34623
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: TabGroupComponent, decorators: [{
34553
34624
  type: Component,
@@ -34637,7 +34708,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
34637
34708
  '[attr.data-fit]': 'tabGroup.tabBar.fit()',
34638
34709
  '[attr.data-divider]': 'tabGroup.tabBar.divider()',
34639
34710
  '[attr.data-variant]': 'tabGroup.tabBar.variant()',
34640
- }, styles: ["@property --et-tab-group-gap{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --et-tab-group-header-gap{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --et-tab-group-trigger-padding-inline{syntax: \"<length>\"; inherits: false; initial-value: 16px;}@property --et-tab-group-trigger-padding-block{syntax: \"<length>\"; inherits: false; initial-value: 12px;}@property --et-tab-group-underline-size{syntax: \"<length>\"; inherits: false; initial-value: 2px;}@property --et-tab-group-underline-radius{syntax: \"<length>\"; inherits: false; initial-value: 1px;}@property --et-tab-group-font-size{syntax: \"<length>\"; inherits: false; initial-value: 1.4rem;}.et-tab-group{display:flex;flex-direction:column;gap:var(--et-tab-group-gap)}.et-tab-group[data-orientation=vertical]{flex-direction:row}.et-tab-group:where([data-size=sm]){--et-tab-group-trigger-padding-inline: 12px;--et-tab-group-trigger-padding-block: 8px;--et-tab-group-font-size: 1.2rem;--et-tab-group-underline-size: 2px}.et-tab-group:where([data-size=md]){--et-tab-group-trigger-padding-inline: 16px;--et-tab-group-trigger-padding-block: 12px;--et-tab-group-font-size: 1.4rem;--et-tab-group-underline-size: 2px}.et-tab-group:where([data-size=lg]){--et-tab-group-trigger-padding-inline: 20px;--et-tab-group-trigger-padding-block: 14px;--et-tab-group-font-size: 1.6rem;--et-tab-group-underline-size: 3px}.et-tab-group:where([data-variant=primary][data-size=sm]){--et-tab-group-underline-size: 3px}.et-tab-group:where([data-variant=primary][data-size=md]){--et-tab-group-underline-size: 3px}.et-tab-group:where([data-variant=primary][data-size=lg]){--et-tab-group-underline-size: 4px}.et-tab-group__header-shell,.et-tab-group__header-scrollable{min-inline-size:0}.et-tab-group__header{position:relative;gap:var(--et-tab-group-header-gap)}.et-tab-group__header:after{content:\"\";position:absolute;background:var(--et-surface-border-solid, currentColor);opacity:.2;pointer-events:none}[data-divider=false] .et-tab-group__header:after{display:none}[data-orientation=horizontal] .et-tab-group__header:after{bottom:0;left:0;right:0;height:var(--et-tab-group-underline-size);border-radius:var(--et-tab-group-underline-radius)}[data-orientation=vertical] .et-tab-group__header{justify-items:start}[data-orientation=vertical] .et-tab-group__header:after{left:0;top:0;bottom:0;width:var(--et-tab-group-underline-size);border-radius:var(--et-tab-group-underline-radius)}.et-tab-group__trigger{display:inline-flex;align-items:center;justify-content:center;padding-inline:var(--et-tab-group-trigger-padding-inline);padding-block:var(--et-tab-group-trigger-padding-block);border:none;background:none;color:var(--et-surface-interaction-solid, inherit);font:inherit;font-size:var(--et-tab-group-font-size);cursor:pointer;position:relative;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:color .15s ease,background .15s ease;outline:none;border-radius:.5rem}.et-tab-group__trigger.et-tab-bar-trigger--no-initial-transition{transition:none}.et-tab-group__trigger.et-tab-group__trigger--active:not(.et-tab-bar-trigger--just-activated):hover{background:rgb(var(--et-color-primary, 0 0 0) / .08)}.et-tab-group__trigger.et-tab-group__trigger--active:not(.et-tab-bar-trigger--just-activated):focus-visible{background:rgb(var(--et-color-primary, 0 0 0) / .12)}.et-tab-group__trigger.et-tab-group__trigger--active:not(.et-tab-bar-trigger--just-activated):active{background:rgb(var(--et-color-primary, 0 0 0) / .16)}.et-tab-group__trigger .et-tab-group__trigger-content{display:flex;align-items:center;gap:8px;border-radius:.5rem;padding:4px 8px;margin:-4px -8px}.et-tab-group__trigger:focus-visible .et-tab-group__trigger-content{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px}.et-tab-group__trigger .et-tab-group__trigger-icon{width:1.2em;height:1.2em}[data-variant=primary] .et-tab-group__trigger .et-tab-group__trigger-content{flex-direction:column;gap:4px}.et-tab-group__trigger .et-tab-bar-underline{position:absolute;z-index:1;background:var(--et-theme-color-ink-solid, currentColor);border-radius:var(--et-tab-group-underline-radius);pointer-events:none;opacity:0}.et-tab-group__trigger .et-tab-bar-underline--active{opacity:1}[data-orientation=horizontal] .et-tab-group__trigger .et-tab-bar-underline{bottom:0;left:0;right:0;height:var(--et-tab-group-underline-size);transform-origin:left}[data-variant=primary][data-orientation=horizontal] .et-tab-group__trigger .et-tab-bar-underline{left:25%;right:25%;height:var(--et-tab-group-underline-size);border-radius:var(--et-tab-group-underline-size) var(--et-tab-group-underline-size) 0 0}[data-orientation=vertical] .et-tab-group__trigger .et-tab-bar-underline{left:0;top:0;bottom:0;width:var(--et-tab-group-underline-size);transform-origin:top}[data-variant=primary][data-orientation=vertical] .et-tab-group__trigger .et-tab-bar-underline{top:25%;bottom:25%;width:var(--et-tab-group-underline-size);border-radius:0 var(--et-tab-group-underline-size) var(--et-tab-group-underline-size) 0}.et-tab-group__trigger.et-tab-group__trigger--active{color:var(--et-surface-color-solid, inherit)}.et-tab-group__trigger:disabled{pointer-events:none;cursor:default}.et-tab-group__body{display:grid}.et-tab-group__panel{grid-area:1 / 1}.et-tab-group__panel[hidden]{display:none}\n"] }]
34711
+ }, styles: ["@property --et-tab-group-gap{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --et-tab-group-header-gap{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --et-tab-group-trigger-padding-inline{syntax: \"<length>\"; inherits: false; initial-value: 16px;}@property --et-tab-group-trigger-padding-block{syntax: \"<length>\"; inherits: false; initial-value: 12px;}@property --et-tab-group-underline-size{syntax: \"<length>\"; inherits: false; initial-value: 2px;}@property --et-tab-group-underline-radius{syntax: \"<length>\"; inherits: false; initial-value: 1px;}@property --et-tab-group-font-size{syntax: \"<length>\"; inherits: false; initial-value: 1.4rem;}.et-tab-group{display:flex;flex-direction:column;gap:var(--et-tab-group-gap)}.et-tab-group[data-orientation=vertical]{flex-direction:row}.et-tab-group:where([data-size=sm]){--et-tab-group-trigger-padding-inline: 12px;--et-tab-group-trigger-padding-block: 8px;--et-tab-group-font-size: 1.2rem;--et-tab-group-underline-size: 2px}.et-tab-group:where([data-size=md]){--et-tab-group-trigger-padding-inline: 16px;--et-tab-group-trigger-padding-block: 12px;--et-tab-group-font-size: 1.4rem;--et-tab-group-underline-size: 2px}.et-tab-group:where([data-size=lg]){--et-tab-group-trigger-padding-inline: 20px;--et-tab-group-trigger-padding-block: 14px;--et-tab-group-font-size: 1.6rem;--et-tab-group-underline-size: 3px}.et-tab-group:where([data-variant=primary][data-size=sm]){--et-tab-group-underline-size: 3px}.et-tab-group:where([data-variant=primary][data-size=md]){--et-tab-group-underline-size: 3px}.et-tab-group:where([data-variant=primary][data-size=lg]){--et-tab-group-underline-size: 4px}.et-tab-group__header-shell,.et-tab-group__header-scrollable{min-inline-size:0}.et-tab-group__header{position:relative;gap:var(--et-tab-group-header-gap)}.et-tab-group__header:after{content:\"\";position:absolute;background:var(--et-surface-border-solid, currentColor);opacity:.2;pointer-events:none}[data-divider=false] .et-tab-group__header:after{display:none}[data-orientation=horizontal] .et-tab-group__header:after{bottom:0;left:0;right:0;height:var(--et-tab-group-underline-size);border-radius:var(--et-tab-group-underline-radius)}[data-orientation=vertical] .et-tab-group__header{justify-items:start}[data-orientation=vertical] .et-tab-group__header:after{left:0;top:0;bottom:0;width:var(--et-tab-group-underline-size);border-radius:var(--et-tab-group-underline-radius)}.et-tab-group__trigger{display:inline-flex;align-items:center;justify-content:center;padding-inline:var(--et-tab-group-trigger-padding-inline);padding-block:var(--et-tab-group-trigger-padding-block);border:none;background:none;color:var(--et-surface-interaction-solid, inherit);font:inherit;font-size:var(--et-tab-group-font-size);cursor:pointer;position:relative;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:color .15s ease,background .15s ease;outline:none;border-radius:.5rem}.et-tab-group__trigger.et-tab-bar-trigger--no-initial-transition{transition:none}@media(hover:hover){.et-tab-group__trigger.et-tab-group__trigger--active:not(.et-tab-bar-trigger--just-activated):hover{background:rgb(var(--et-color-primary, 0 0 0) / .08)}}.et-tab-group__trigger.et-tab-group__trigger--active:not(.et-tab-bar-trigger--just-activated):focus-visible{background:rgb(var(--et-color-primary, 0 0 0) / .12)}.et-tab-group__trigger.et-tab-group__trigger--active:not(.et-tab-bar-trigger--just-activated):active{background:rgb(var(--et-color-primary, 0 0 0) / .16)}.et-tab-group__trigger .et-tab-group__trigger-content{display:flex;align-items:center;gap:8px;border-radius:.5rem;padding:4px 8px;margin:-4px -8px}.et-tab-group__trigger:focus-visible .et-tab-group__trigger-content{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:2px}.et-tab-group__trigger .et-tab-group__trigger-icon{width:1.2em;height:1.2em}[data-variant=primary] .et-tab-group__trigger .et-tab-group__trigger-content{flex-direction:column;gap:4px}.et-tab-group__trigger .et-tab-bar-underline{position:absolute;z-index:1;background:var(--et-theme-color-ink-solid, currentColor);border-radius:var(--et-tab-group-underline-radius);pointer-events:none;opacity:0}.et-tab-group__trigger .et-tab-bar-underline--active{opacity:1}[data-orientation=horizontal] .et-tab-group__trigger .et-tab-bar-underline{bottom:0;left:0;right:0;height:var(--et-tab-group-underline-size);transform-origin:left}[data-variant=primary][data-orientation=horizontal] .et-tab-group__trigger .et-tab-bar-underline{left:25%;right:25%;height:var(--et-tab-group-underline-size);border-radius:var(--et-tab-group-underline-size) var(--et-tab-group-underline-size) 0 0}[data-orientation=vertical] .et-tab-group__trigger .et-tab-bar-underline{left:0;top:0;bottom:0;width:var(--et-tab-group-underline-size);transform-origin:top}[data-variant=primary][data-orientation=vertical] .et-tab-group__trigger .et-tab-bar-underline{top:25%;bottom:25%;width:var(--et-tab-group-underline-size);border-radius:0 var(--et-tab-group-underline-size) var(--et-tab-group-underline-size) 0}.et-tab-group__trigger.et-tab-group__trigger--active{color:var(--et-surface-color-solid, inherit)}.et-tab-group__trigger:disabled{pointer-events:none;cursor:default}.et-tab-group__body{display:grid}.et-tab-group__panel{grid-area:1 / 1}.et-tab-group__panel[hidden]{display:none}\n"] }]
34641
34712
  }], ctorParameters: () => [], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], tabs: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => TabComponent), { isSignal: true }] }] } });
34642
34713
 
34643
34714
  const NavTabImports = [NavTabsComponent, NavTabLinkComponent, NavTabsOutletComponent];