@ethlete/components 1.0.0-next.37 → 1.0.0-next.39

package/fesm2022/ethlete-components.mjs

@@ -4,9 +4,9 @@ import * as i1 from '@ethlete/core';
 import { injectHostElement, RuntimeError, createComponentId, ProvideColorDirective, defineLabels, toProvideFn, toInjectFn, toToken, injectStyleManager, SurfaceInteractiveDirective, createCanAnimateSignal, ColorInteractiveDirective, injectSuccessTheme, injectWarningTheme, injectErrorTheme, injectLocale, defineStaticRootProvider, inferMimeType, injectColorThemes, injectRenderer, ProvideSurfaceDirective, COLOR_PROVIDER, SURFACE_PROVIDER, injectSurfaceThemes, injectSurfaceThemesPrefix, injectSurfaceContextTracker, injectBoundaryElement, ANIMATED_LIFECYCLE_TOKEN, resolveAppRootColorProvider, resolveSurfaceByElevation, createCssSurfaceName, provideBoundaryElement, AnimatedLifecycleDirective, injectBreakpointObserver, isHTMLElement, equal, animationDebugLog, defineRootProvider, injectOverlayRuntime, anchoredOverlayPosition, enableAnchoredOverlayPositionExtras, randomId, forceReflow, nextFrame, elementCanScroll, matchesReducedMotion, createSwipeTracker, ScrollObserverDirective, signalElementScrollState, ScrollObserverStartDirective, ScrollObserverEndDirective, applyHostListener, injectQueryParam, createUnsavedChangesTracker, createDocumentElementSignal, defineProvider, fromNextFrame, injectRoute, AnimatedIfDirective, signalElementDimensions, applyInitialFocus, syncSignal, AutoSurfaceDirective, setInputSignal, injectTemplateRef, signalHostElementScrollState, applyStructuredDataBinding, typedBreakpointTransform, signalElementChildren, signalElementIntersection, signalHostAttributes, signalHostClasses, signalHostStyles, getScrollContainerTarget, getScrollItemTarget, getElementScrollCoordinates, provideBreakpointInstance, signalClasses, useCursorDragScroll, signalStyles, getScrollSnapTarget, injectPrefersReducedMotion, injectIsDocumentVisible, signalHostElementIntersection, clamp as clamp$1, copyToClipboard, injectAnimatedBlockSize, injectObserveBreakpoint, AnimatableDirective, ColorInteractiveContainerDirective, ColorInteractiveExcludeDirective, createFlipAnimation, createFlipAnimationGroup, ColorInteractiveHasFocusDirective, htmlToMarkdown, markdownToHtml, injectHasTouchInput, signalHostElementDimensions, DragHandleDirective, ResizeHandlesComponent, numberBreakpointTransform, applyLinkBinding, applyHeadTitleBinding, injectViewportSize, injectFocusVisibleTracker, getFocusableElements, dragGestureFrom, injectRouterEvent, canUseSessionMemory, createAutoSessionMemoryKey, createSessionMemory } from '@ethlete/core';
 import { NgTemplateOutlet, NgComponentOutlet, Location, DOCUMENT as DOCUMENT$1, isPlatformBrowser } from '@angular/common';
 import { DomSanitizer } from '@angular/platform-browser';
-import { format, startOfWeek, startOfDay, endOfWeek, isBefore, addDays, endOfMonth, startOfMonth, isSameYear, isSameMonth, isSameDay, startOfYear, isAfter, addYears, addMonths, setMonth, setYear, getDate, setDate, lastDayOfMonth, getWeek, endOfYear, parse, isValid, setSeconds, setMinutes, setHours, setMilliseconds, endOfDay, eachDayOfInterval } from 'date-fns';
+import { format, startOfWeek, startOfDay, endOfWeek, isBefore, addDays, endOfMonth, startOfMonth, isSameYear, isSameMonth, isSameDay, startOfYear, isAfter, addYears, addMonths, setMonth, setYear, getDate, setDate, lastDayOfMonth, getWeek, endOfYear, parse, isValid, setSeconds, setMinutes, setHours, setMilliseconds, endOfDay, eachDayOfInterval, addHours } from 'date-fns';
 import { takeUntilDestroyed, toObservable, toSignal, outputFromObservable, outputToObservable, rxResource } from '@angular/core/rxjs-interop';
-import { Subject, take, tap, timer, takeUntil, fromEvent, filter, combineLatest, switchMap, map, distinctUntilChanged, EMPTY, debounceTime, merge, defer, finalize, of, isObservable, from, catchError, firstValueFrom, concat, scan, interval, animationFrameScheduler, EmptyError, exhaustMap, Observable, shareReplay, defaultIfEmpty, expand, toArray } from 'rxjs';
+import { Subject, take, tap, timer, takeUntil, fromEvent, filter, combineLatest, switchMap, map, distinctUntilChanged, EMPTY, debounceTime, merge, defer, finalize, of, isObservable, from, catchError, firstValueFrom, concat, scan, interval, animationFrameScheduler, EmptyError, exhaustMap, Observable, shareReplay, defaultIfEmpty, expand, toArray, mergeMap } from 'rxjs';
 import * as i1$1 from '@angular/router';
 import { Router, RouterLink, RouterLinkActive, NavigationEnd } from '@angular/router';
 import { withArgs, queryStateSignal, isQueryStateSuccess, isQueryStateFailure, isQueryStateLoading, executeUntilSettled, extractQuery, queryComputed, detectPaginationShape, isDateShapedLeaf, collectLeafPaths, QUERY_DEVTOOLS_FAULT_STATUSES, clearQueryDevtoolsFaults, setQueryDevtoolsFault, queryDevtoolsEntries, queryDevtoolsFaults, EMPTY_QUERY_DEVTOOLS_FAULT, isQueryDevtoolsFaultArmed, measureQueryDevtoolsPayload, createQueryErrorResponse, sumQueryDevtoolsStats, parseHttpErrorCodeToMessageEn, parseHttpErrorCodeToTitleEn, parseHttpErrorCodeToMessageDe, parseHttpErrorCodeToTitleDe, queryErrorMessages } from '@ethlete/query';
@@ -1108,6 +1108,7 @@ const ET_BUILT_IN_ICON_NAMES = [
     'et-strikethrough',
     'et-table',
     'et-times',
+    'et-trash',
     'et-triangle-exclamation',
     'et-trophy',
     'et-underline',
@@ -1535,6 +1536,29 @@ const TIMES_ICON = {
   `,
 };
 
+const TRASH_ICON = {
+    name: 'et-trash',
+    data: `
+    <svg
+      width="100%"
+      height="100%"
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      stroke-width="1.8"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    >
+      <path d="M4 7h16" />
+      <path d="M9 7V4.5A1.5 1.5 0 0 1 10.5 3h3A1.5 1.5 0 0 1 15 4.5V7" />
+      <path d="M6 7l1 13a2 2 0 0 0 2 1.9h6a2 2 0 0 0 2-1.9l1-13" />
+      <path d="M10 11v6" />
+      <path d="M14 11v6" />
+    </svg>
+  `,
+};
+
 // Font Awesome Pro 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.
 const TRIANGLE_EXCLAMATION_ICON = {
     name: 'et-triangle-exclamation',
@@ -8488,11 +8512,6 @@ const swissBracketLayout = (options = {}) => ({
     styles: [BracketSwissStylesComponent],
 });
 
-// TODO(bracket): curate the public surface once the default cards are built - `./core` and
-// `./linked` currently re-export internal engine builders (createBracket, relations, base
-// map/round/match builders) alongside the public data types. Narrow to the types consumers
-// actually need (data source, round/match/participant, swiss group, enums) at that point.
-
 class FabComponent {
     constructor() {
         this.buttonDir = inject(ButtonDirective);
@@ -9626,6 +9645,7 @@ const buildAnchoredRuntimePositionStrategy = (options = {}) => (origin) => {
             viewportPadding: options.viewportPadding,
             shift: options.shift,
             autoResize: options.autoResize,
+            minAvailableSpace: options.minAvailableSpace,
             autoHide: options.autoHide,
             autoCloseIfReferenceHidden: options.autoCloseIfReferenceHidden,
             mirrorWidth: options.mirrorWidth,
@@ -9825,7 +9845,7 @@ const injectAnchoredDialogStrategy = /* @__PURE__ */ toInjectFn(ANCHORED_DIALOG_
 const anchoredDialogOverlayStrategy = (options = {}) => {
     return () => {
         const strategyProvider = injectAnchoredDialogStrategy();
-        const { placement, fallbackPlacements, offset, arrowPadding, viewportPadding, shift, autoResize, autoHide, autoCloseIfReferenceHidden, mirrorWidth, positionStrategy, ...breakpointConfig } = options;
+        const { placement, fallbackPlacements, offset, arrowPadding, viewportPadding, shift, autoResize, minAvailableSpace, autoHide, autoCloseIfReferenceHidden, mirrorWidth, positionStrategy, ...breakpointConfig } = options;
         const config = {
             ...breakpointConfig,
             positionStrategy: positionStrategy ??
@@ -9837,6 +9857,7 @@ const anchoredDialogOverlayStrategy = (options = {}) => {
                     viewportPadding,
                     shift: shift ?? DEFAULT_ANCHORED_DIALOG_POSITION.shift,
                     autoResize: autoResize ?? DEFAULT_ANCHORED_DIALOG_POSITION.autoResize,
+                    minAvailableSpace,
                     autoHide,
                     autoCloseIfReferenceHidden,
                     mirrorWidth,
@@ -11159,6 +11180,8 @@ class OverlayDirective {
         this.viewportPadding = input(8, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "viewportPadding" }] : /* istanbul ignore next */ []));
         this.autoResize = input(false, { ...(ngDevMode ? { debugName: "autoResize" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+        this.minAvailableSpace = input(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "minAvailableSpace" }] : /* istanbul ignore next */ []));
         this.shift = input(true, { ...(ngDevMode ? { debugName: "shift" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
         this.autoHide = input(false, { ...(ngDevMode ? { debugName: "autoHide" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
         this.autoCloseIfReferenceHidden = input(false, { ...(ngDevMode ? { debugName: "autoCloseIfReferenceHidden" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
@@ -11287,6 +11310,7 @@ class OverlayDirective {
                     offset: this.offset(),
                     viewportPadding: this.viewportPadding(),
                     autoResize: this.autoResize(),
+                    minAvailableSpace: this.minAvailableSpace(),
                     shift: this.shift(),
                     autoHide: this.autoHide(),
                     autoCloseIfReferenceHidden: this.autoCloseIfReferenceHidden(),
@@ -11311,7 +11335,7 @@ class OverlayDirective {
             .subscribe();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: OverlayDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: OverlayDirective, isStandalone: true, selector: "[etOverlay]", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, disableClose: { classPropertyName: "disableClose", publicName: "disableClose", isSignal: true, isRequired: false, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: false, transformFunction: null }, restoreFocus: { classPropertyName: "restoreFocus", publicName: "restoreFocus", isSignal: true, isRequired: false, transformFunction: null }, hasBackdrop: { classPropertyName: "hasBackdrop", publicName: "hasBackdrop", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, closeOnOutsidePointer: { classPropertyName: "closeOnOutsidePointer", publicName: "closeOnOutsidePointer", isSignal: true, isRequired: false, transformFunction: null }, hostClass: { classPropertyName: "hostClass", publicName: "hostClass", isSignal: true, isRequired: false, transformFunction: null }, backdropClass: { classPropertyName: "backdropClass", publicName: "backdropClass", isSignal: true, isRequired: false, transformFunction: null }, panelClass: { classPropertyName: "panelClass", publicName: "panelClass", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, fallbackPlacements: { classPropertyName: "fallbackPlacements", publicName: "fallbackPlacements", isSignal: true, isRequired: false, transformFunction: null }, offset: { classPropertyName: "offset", publicName: "offset", isSignal: true, isRequired: false, transformFunction: null }, viewportPadding: { classPropertyName: "viewportPadding", publicName: "viewportPadding", isSignal: true, isRequired: false, transformFunction: null }, autoResize: { classPropertyName: "autoResize", publicName: "autoResize", isSignal: true, isRequired: false, transformFunction: null }, shift: { classPropertyName: "shift", publicName: "shift", isSignal: true, isRequired: false, transformFunction: null }, autoHide: { classPropertyName: "autoHide", publicName: "autoHide", isSignal: true, isRequired: false, transformFunction: null }, autoCloseIfReferenceHidden: { classPropertyName: "autoCloseIfReferenceHidden", publicName: "autoCloseIfReferenceHidden", isSignal: true, isRequired: false, transformFunction: null }, mirrorWidth: { classPropertyName: "mirrorWidth", publicName: "mirrorWidth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange" }, host: { properties: { "attr.data-overlay-open": "open() || null", "attr.data-overlay-mode": "mode()" } }, exportAs: ["etOverlay"], ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: OverlayDirective, isStandalone: true, selector: "[etOverlay]", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, disableClose: { classPropertyName: "disableClose", publicName: "disableClose", isSignal: true, isRequired: false, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: false, transformFunction: null }, restoreFocus: { classPropertyName: "restoreFocus", publicName: "restoreFocus", isSignal: true, isRequired: false, transformFunction: null }, hasBackdrop: { classPropertyName: "hasBackdrop", publicName: "hasBackdrop", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, closeOnOutsidePointer: { classPropertyName: "closeOnOutsidePointer", publicName: "closeOnOutsidePointer", isSignal: true, isRequired: false, transformFunction: null }, hostClass: { classPropertyName: "hostClass", publicName: "hostClass", isSignal: true, isRequired: false, transformFunction: null }, backdropClass: { classPropertyName: "backdropClass", publicName: "backdropClass", isSignal: true, isRequired: false, transformFunction: null }, panelClass: { classPropertyName: "panelClass", publicName: "panelClass", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, fallbackPlacements: { classPropertyName: "fallbackPlacements", publicName: "fallbackPlacements", isSignal: true, isRequired: false, transformFunction: null }, offset: { classPropertyName: "offset", publicName: "offset", isSignal: true, isRequired: false, transformFunction: null }, viewportPadding: { classPropertyName: "viewportPadding", publicName: "viewportPadding", isSignal: true, isRequired: false, transformFunction: null }, autoResize: { classPropertyName: "autoResize", publicName: "autoResize", isSignal: true, isRequired: false, transformFunction: null }, minAvailableSpace: { classPropertyName: "minAvailableSpace", publicName: "minAvailableSpace", isSignal: true, isRequired: false, transformFunction: null }, shift: { classPropertyName: "shift", publicName: "shift", isSignal: true, isRequired: false, transformFunction: null }, autoHide: { classPropertyName: "autoHide", publicName: "autoHide", isSignal: true, isRequired: false, transformFunction: null }, autoCloseIfReferenceHidden: { classPropertyName: "autoCloseIfReferenceHidden", publicName: "autoCloseIfReferenceHidden", isSignal: true, isRequired: false, transformFunction: null }, mirrorWidth: { classPropertyName: "mirrorWidth", publicName: "mirrorWidth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange" }, host: { properties: { "attr.data-overlay-open": "open() || null", "attr.data-overlay-mode": "mode()" } }, exportAs: ["etOverlay"], ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: OverlayDirective, decorators: [{
             type: Directive,
@@ -11323,7 +11347,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                         '[attr.data-overlay-mode]': 'mode()',
                     },
                 }]
-        }], ctorParameters: () => [], propDecorators: { mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], role: [{ type: i0.Input, args: [{ isSignal: true, alias: "role", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], disableClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableClose", required: false }] }], autoFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoFocus", required: false }] }], restoreFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "restoreFocus", required: false }] }], hasBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasBackdrop", required: false }] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], closeOnOutsidePointer: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnOutsidePointer", required: false }] }], hostClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "hostClass", required: false }] }], backdropClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "backdropClass", required: false }] }], panelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelClass", required: false }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], fallbackPlacements: [{ type: i0.Input, args: [{ isSignal: true, alias: "fallbackPlacements", required: false }] }], offset: [{ type: i0.Input, args: [{ isSignal: true, alias: "offset", required: false }] }], viewportPadding: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewportPadding", required: false }] }], autoResize: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoResize", required: false }] }], shift: [{ type: i0.Input, args: [{ isSignal: true, alias: "shift", required: false }] }], autoHide: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoHide", required: false }] }], autoCloseIfReferenceHidden: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoCloseIfReferenceHidden", required: false }] }], mirrorWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "mirrorWidth", required: false }] }] } });
+        }], ctorParameters: () => [], propDecorators: { mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], role: [{ type: i0.Input, args: [{ isSignal: true, alias: "role", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], disableClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableClose", required: false }] }], autoFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoFocus", required: false }] }], restoreFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "restoreFocus", required: false }] }], hasBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasBackdrop", required: false }] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], closeOnOutsidePointer: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnOutsidePointer", required: false }] }], hostClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "hostClass", required: false }] }], backdropClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "backdropClass", required: false }] }], panelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelClass", required: false }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], fallbackPlacements: [{ type: i0.Input, args: [{ isSignal: true, alias: "fallbackPlacements", required: false }] }], offset: [{ type: i0.Input, args: [{ isSignal: true, alias: "offset", required: false }] }], viewportPadding: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewportPadding", required: false }] }], autoResize: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoResize", required: false }] }], minAvailableSpace: [{ type: i0.Input, args: [{ isSignal: true, alias: "minAvailableSpace", required: false }] }], shift: [{ type: i0.Input, args: [{ isSignal: true, alias: "shift", required: false }] }], autoHide: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoHide", required: false }] }], autoCloseIfReferenceHidden: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoCloseIfReferenceHidden", required: false }] }], mirrorWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "mirrorWidth", required: false }] }] } });
 
 class OverlayAnchorDirective {
     constructor() {
@@ -18266,6 +18290,45 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 const DESCRIPTION_LIST_IMPORTS = [DescriptionListComponent];
 
+/**
+ * A thin rule between two groups of content or controls, announced as a separator.
+ *
+ * A `vertical` divider sizes itself from its parent's cross axis, so it needs a flex or grid parent
+ * (or an explicit `block-size`) to be visible. Set `decorative` when the grouping is already clear
+ * from the surrounding markup - the rule then carries no semantics at all.
+ *
+ * @example
+ * <et-divider />
+ *
+ * @example
+ * <div class="flex items-center">
+ *   <button et-button>Save</button>
+ *   <et-divider orientation="vertical" decorative />
+ *   <button et-button>Discard</button>
+ * </div>
+ */
+class DividerComponent {
+    constructor() {
+        this.orientation = input('horizontal', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
+        this.decorative = input(false, { ...(ngDevMode ? { debugName: "decorative" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: DividerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.7", type: DividerComponent, isStandalone: true, selector: "et-divider", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, decorative: { classPropertyName: "decorative", publicName: "decorative", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-orientation": "orientation()", "attr.role": "decorative() ? \"presentation\" : \"separator\"", "attr.aria-orientation": "decorative() ? null : orientation()", "attr.aria-hidden": "decorative() ? \"true\" : null" }, classAttribute: "et-divider" }, ngImport: i0, template: ``, isInline: true, styles: ["@layer components{@property --et-divider-thickness{syntax: \"<length>\"; inherits: true; initial-value: 1px;}@property --et-divider-spacing{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-divider-inset{syntax: \"<length>\"; inherits: true; initial-value: 0px;}.et-divider{display:block;flex:none;background:var(--et-divider-color, var(--et-surface-border-solid, rgb(255 255 255 / .1)));block-size:var(--et-divider-thickness);margin-block:var(--et-divider-spacing);margin-inline:var(--et-divider-inset)}.et-divider:where([data-orientation=vertical]){align-self:stretch;block-size:auto;inline-size:var(--et-divider-thickness);margin-block:var(--et-divider-inset);margin-inline:var(--et-divider-spacing)}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: DividerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'et-divider', template: ``, encapsulation: ViewEncapsulation.None, host: {
+                        class: 'et-divider',
+                        '[attr.data-orientation]': 'orientation()',
+                        '[attr.role]': 'decorative() ? "presentation" : "separator"',
+                        '[attr.aria-orientation]': 'decorative() ? null : orientation()',
+                        '[attr.aria-hidden]': 'decorative() ? "true" : null',
+                    }, styles: ["@layer components{@property --et-divider-thickness{syntax: \"<length>\"; inherits: true; initial-value: 1px;}@property --et-divider-spacing{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-divider-inset{syntax: \"<length>\"; inherits: true; initial-value: 0px;}.et-divider{display:block;flex:none;background:var(--et-divider-color, var(--et-surface-border-solid, rgb(255 255 255 / .1)));block-size:var(--et-divider-thickness);margin-block:var(--et-divider-spacing);margin-inline:var(--et-divider-inset)}.et-divider:where([data-orientation=vertical]){align-self:stretch;block-size:auto;inline-size:var(--et-divider-thickness);margin-block:var(--et-divider-inset);margin-inline:var(--et-divider-spacing)}}\n"] }]
+        }], propDecorators: { orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], decorative: [{ type: i0.Input, args: [{ isSignal: true, alias: "decorative", required: false }] }] } });
+
+const DIVIDER_IMPORTS = [DividerComponent];
+
 /**
  * A placeholder for a section or page that currently has nothing to show - no results, an empty
  * list, a not-yet-configured feature. Project an icon via `[etIcon]`, set `title`/`description`,
@@ -18463,7 +18526,7 @@ const provideFilterOverlay = (config) => [{ provide: FILTER_OVERLAY_TOKEN, useFa
  * The filter overlay provided above this component, typed to your filters' **value** shape:
  *
  * ```ts
- * const createTeamFilters = () => createQueryForm({ fields: TEAM_FILTER_FIELDS });
+ * const createTeamFilters = () => defineQueryForm({ fields: TEAM_FILTER_FIELDS });
  * type TeamFilterValue = FilterOverlayValueOf<ReturnType<typeof createTeamFilters>>;
  *
  * protected filters = injectFilterOverlay<TeamFilterValue>();
@@ -19892,9 +19955,9 @@ const createTypeahead = (resetDelay = 500) => {
 
 /** Whether a node can be drilled into - false for explicit leaves and `hasChildren: false`. */
 const canHaveChildren = (node) => node.isLeaf !== true && node.hasChildren !== false;
-const defaultCompareWith = (a, b) => a === b;
+const defaultCompareWith$1 = (a, b) => a === b;
 /** Value equality between two nodes via the configured comparator. */
-const nodesEqual = (options) => {
+const nodesEqual$1 = (options) => {
     const { a, b, compareWith } = options;
     return a !== null && b !== null && compareWith(a.value, b.value);
 };
@@ -19904,7 +19967,7 @@ const indexOfNode = (options) => {
     return node === null ? -1 : nodes.findIndex((candidate) => compareWith(candidate.value, node.value));
 };
 /** Normalizes a `loadChildren` result (array | Promise | Observable) into an Observable. */
-const toChildrenObservable = (result) => {
+const toChildrenObservable$1 = (result) => {
     if (Array.isArray(result)) {
         return of(result);
     }
@@ -19983,7 +20046,7 @@ class CascaderDirective {
         this.selectableLevels = input(CASCADER_SELECTABLE_LEVELS.LEAF, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "selectableLevels" }] : /* istanbul ignore next */ []));
         /** Value equality - override when values are objects. */
-        this.compareWith = input(defaultCompareWith, /* @ts-ignore */
+        this.compareWith = input(defaultCompareWith$1, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "compareWith" }] : /* istanbul ignore next */ []));
         /**
          * Turns a `loadChildren` / `search` failure into the error text shown in the panel. The default
@@ -20199,13 +20262,10 @@ class CascaderDirective {
                         ...anchoredOverlayStrategy({
                             containerClass: ['et-overlay--anchored', 'et-overlay--cascader'],
                             placement: 'bottom-start',
-                            // prefer flipping the alignment on the same side (right-align under the field) before
-                            // flipping up, so a field near the right viewport edge opens bottom-end, not shifted
-                            fallbackPlacements: ['bottom-end', 'top-start', 'top-end'],
                             offset: 4,
                             viewportPadding: 8,
                             autoResize: true,
-                            shift: { crossAxis: true },
+                            minAvailableSpace: 160,
                             mirrorWidth: this.mirrorPanelWidth(),
                         })().map((entry) => ({ ...entry, breakpoint: 'md' })),
                     ],
@@ -20463,7 +20523,7 @@ class CascaderDirective {
     }
     /** Whether a node is expanded (its children fill the next column). */
     isExpanded(node, columnIndex) {
-        return nodesEqual({ a: this.openPath()[columnIndex] ?? null, b: node, compareWith: this.compareWith() });
+        return nodesEqual$1({ a: this.openPath()[columnIndex] ?? null, b: node, compareWith: this.compareWith() });
     }
     /**
      * Activates a node from a pointer/keyboard interaction: drills into branches, commits leaves.
@@ -20786,7 +20846,7 @@ class CascaderDirective {
         if (!canHaveChildren(node) || visited.some((seen) => compareWith(seen.value, node.value))) {
             return false;
         }
-        const children = this.knownChildren().find((entry) => nodesEqual({ a: entry.parent, b: node, compareWith }))?.children;
+        const children = this.knownChildren().find((entry) => nodesEqual$1({ a: entry.parent, b: node, compareWith }))?.children;
         const selectable = children?.filter((child) => !child.disabled) ?? [];
         return selectable.length > 0 && selectable.every((child) => this.isFullySelected(child, [...visited, node]));
     }
@@ -20887,7 +20947,7 @@ class CascaderDirective {
         }
         this.loadSubscriptions.get(columnIndex)?.unsubscribe();
         this.setColumn(columnIndex, { parent, status: 'loading', nodes: [], error: null });
-        const subscription = toChildrenObservable(source.loadChildren(parent))
+        const subscription = toChildrenObservable$1(source.loadChildren(parent))
             .pipe(take(1), tap({
             next: (nodes) => {
                 this.setColumn(columnIndex, { parent, status: 'loaded', nodes, error: null });
@@ -20905,7 +20965,7 @@ class CascaderDirective {
     rememberChildren(parent, children) {
         const compareWith = this.compareWith();
         this.knownChildren.update((entries) => [
-            ...entries.filter((entry) => parent === null ? entry.parent !== null : !nodesEqual({ a: entry.parent, b: parent, compareWith })),
+            ...entries.filter((entry) => parent === null ? entry.parent !== null : !nodesEqual$1({ a: entry.parent, b: parent, compareWith })),
             { parent, children },
         ]);
     }
@@ -21066,7 +21126,7 @@ class CascaderNodeDirective {
         ...(ngDevMode ? [{ debugName: "indeterminate" }] : /* istanbul ignore next */ []));
         this.expanded = computed(() => this.cascader?.isExpanded(this.node(), this.column.columnIndex()) ?? false, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "expanded" }] : /* istanbul ignore next */ []));
-        this.focused = computed(() => nodesEqual({
+        this.focused = computed(() => nodesEqual$1({
             a: this.cascader?.focusedNode() ?? null,
             b: this.node(),
             compareWith: this.cascader?.compareWith() ?? ((a, b) => a === b),
@@ -21479,7 +21539,7 @@ class CascaderPanelComponent {
     <div #panelBody class="et-cascader-panel-body">
       <ng-content />
     </div>
-  `, 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{transition:opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-leave-active{transition:opacity .1s ease}.et-overlay--cascader[data-overlay-placement].et-animation-enter-from,.et-overlay--cascader[data-overlay-placement].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0)!important}}.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)}}@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 }); }
+  `, 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{transition:opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-leave-active{transition:opacity .1s ease}.et-overlay--cascader[data-overlay-placement].et-animation-enter-from,.et-overlay--cascader[data-overlay-placement].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0)!important}}.et-cascader-panel{display:block;box-sizing:border-box;--_et-cascader-panel-max-block-size: min( var(--et-cascader-panel-max-block-size), var(--et-overlay-max-height, 100vh) );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)}}@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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: CascaderPanelComponent, decorators: [{
             type: Component,
@@ -21499,7 +21559,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                         '[attr.data-sheet]': 'isSheet() || null',
                         '(focusin)': 'handleFocusIn()',
                         '(focusout)': 'handleFocusOut($event)',
-                    }, 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{transition:opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-leave-active{transition:opacity .1s ease}.et-overlay--cascader[data-overlay-placement].et-animation-enter-from,.et-overlay--cascader[data-overlay-placement].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0)!important}}.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)}}@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"] }]
+                    }, 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{transition:opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--cascader.et-animation-leave-active{transition:opacity .1s ease}.et-overlay--cascader[data-overlay-placement].et-animation-enter-from,.et-overlay--cascader[data-overlay-placement].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0)!important}}.et-cascader-panel{display:block;box-sizing:border-box;--_et-cascader-panel-max-block-size: min( var(--et-cascader-panel-max-block-size), var(--et-overlay-max-height, 100vh) );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)}}@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"] }]
         }], ctorParameters: () => [], propDecorators: { panelBody: [{ type: i0.ViewChild, args: ['panelBody', { isSignal: true }] }] } });
 
 class CascaderComponent {
@@ -28900,17 +28960,17 @@ class RichTextEditorFloatingToolbarComponent {
         return richTextEditorToolLabel(this.labels(), tool);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: RichTextEditorFloatingToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: RichTextEditorFloatingToolbarComponent, isStandalone: true, selector: "et-rich-text-editor-floating-toolbar", inputs: { editor: { classPropertyName: "editor", publicName: "editor", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "role": "toolbar" }, listeners: { "mousedown": "$event.preventDefault()" }, properties: { "attr.aria-label": "labels().selectionToolbar" }, classAttribute: "et-rte-floating-toolbar" }, providers: [provideIcons(BOLD_ICON, ITALIC_ICON, UNDERLINE_ICON, STRIKETHROUGH_ICON, CODE_ICON, LINK_ICON)], hostDirectives: [{ directive: i1.ProvideColorDirective }, { directive: i1.AutoSurfaceDirective }], ngImport: i0, template: "@for (def of inlineTools(); track def.token; let first = $first) {\n  @if (def.token === TOOLS.LINK && !first) {\n    <span class=\"et-rte-toolbar-divider\" aria-hidden=\"true\"></span>\n  }\n\n  <!-- Icon tools only: this bar has no room for a custom control, and every inline tool is a toggle. -->\n  @if (def.icon; as icon) {\n    <button\n      [pressed]=\"def.isActive?.(editor()) ?? false\"\n      [disabled]=\"def.isDisabled?.(editor()) ?? false\"\n      [attr.aria-label]=\"toolLabel(def)\"\n      (mousedown)=\"$event.preventDefault()\"\n      (click)=\"def.run?.(editor())\"\n      mutedUntilPressed\n      et-icon-button\n      size=\"sm\"\n      type=\"button\"\n      tabindex=\"-1\"\n    >\n      <i [allowHardcodedColor]=\"def.allowHardcodedColor ?? false\" [etIcon]=\"icon\"></i>\n    </button>\n  }\n}\n", styles: ["@layer components{.et-overlay.et-rte-floating-toolbar-overlay{overflow:visible;background:transparent;box-shadow:none;border-radius:10px}.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-enter-from,.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-leave-to{opacity:0}.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-enter-active{transition:transform .14s ease,opacity .14s ease}.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-leave-active{transition:transform .1s ease,opacity .1s ease}.et-rte-floating-toolbar-overlay[data-overlay-placement^=top].et-animation-enter-from,.et-rte-floating-toolbar-overlay[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-rte-floating-toolbar-overlay[data-overlay-placement^=bottom].et-animation-enter-from,.et-rte-floating-toolbar-overlay[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-rte-floating-toolbar-overlay.et-animation-enter-active{transition:opacity .14s ease}.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-leave-active{transition:opacity .1s ease}.et-rte-floating-toolbar-overlay[data-overlay-placement].et-animation-enter-from,.et-rte-floating-toolbar-overlay[data-overlay-placement].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0)!important}}.et-rte-floating-toolbar{display:flex;align-items:center;gap:var(--et-rich-text-editor-toolbar-gap, 2px);padding:var(--et-rich-text-editor-toolbar-padding, 4px);border-radius:10px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:var(--et-surface-background-solid, var(--et-surface-2, rgb(38 38 38)));color:var(--et-surface-color-solid, var(--et-color-main-contrast, rgb(244 244 245)));box-shadow:0 10px 24px #00000029;--et-icon-button-border-radius: var(--et-rich-text-editor-button-radius, 4px)}.et-rte-floating-toolbar .et-rte-toolbar-divider{inline-size:1px;align-self:stretch;margin-block:4px;margin-inline:2px;background:color-mix(in srgb,currentColor 20%,transparent)}}\n"], dependencies: [{ kind: "component", type: IconButtonComponent, selector: "[et-icon-button]", inputs: ["variant", "size"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor", "label"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: RichTextEditorFloatingToolbarComponent, isStandalone: true, selector: "et-rich-text-editor-floating-toolbar", inputs: { editor: { classPropertyName: "editor", publicName: "editor", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "role": "toolbar" }, listeners: { "mousedown": "$event.preventDefault()" }, properties: { "attr.aria-label": "labels().selectionToolbar" }, classAttribute: "et-rte-floating-toolbar" }, providers: [provideIcons(BOLD_ICON, ITALIC_ICON, UNDERLINE_ICON, STRIKETHROUGH_ICON, CODE_ICON, LINK_ICON)], hostDirectives: [{ directive: i1.ProvideColorDirective }, { directive: i1.AutoSurfaceDirective }], ngImport: i0, template: "@for (def of inlineTools(); track def.token; let first = $first) {\n  @if (def.token === TOOLS.LINK && !first) {\n    <et-divider orientation=\"vertical\" decorative />\n  }\n\n  <!-- Icon tools only: this bar has no room for a custom control, and every inline tool is a toggle. -->\n  @if (def.icon; as icon) {\n    <button\n      [pressed]=\"def.isActive?.(editor()) ?? false\"\n      [disabled]=\"def.isDisabled?.(editor()) ?? false\"\n      [attr.aria-label]=\"toolLabel(def)\"\n      (mousedown)=\"$event.preventDefault()\"\n      (click)=\"def.run?.(editor())\"\n      mutedUntilPressed\n      et-icon-button\n      size=\"sm\"\n      type=\"button\"\n      tabindex=\"-1\"\n    >\n      <i [allowHardcodedColor]=\"def.allowHardcodedColor ?? false\" [etIcon]=\"icon\"></i>\n    </button>\n  }\n}\n", styles: ["@layer components{.et-overlay.et-rte-floating-toolbar-overlay{overflow:visible;background:transparent;box-shadow:none;border-radius:10px}.et-overlay.et-rte-floating-toolbar-overlay>.et-rte-floating-toolbar{display:flex}.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-enter-from,.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-leave-to{opacity:0}.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-enter-active{transition:transform .14s ease,opacity .14s ease}.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-leave-active{transition:transform .1s ease,opacity .1s ease}.et-rte-floating-toolbar-overlay[data-overlay-placement^=top].et-animation-enter-from,.et-rte-floating-toolbar-overlay[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-rte-floating-toolbar-overlay[data-overlay-placement^=bottom].et-animation-enter-from,.et-rte-floating-toolbar-overlay[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-rte-floating-toolbar-overlay.et-animation-enter-active{transition:opacity .14s ease}.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-leave-active{transition:opacity .1s ease}.et-rte-floating-toolbar-overlay[data-overlay-placement].et-animation-enter-from,.et-rte-floating-toolbar-overlay[data-overlay-placement].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0)!important}}.et-rte-floating-toolbar{display:flex;align-items:center;gap:var(--et-rich-text-editor-toolbar-gap, 2px);padding:var(--et-rich-text-editor-toolbar-padding, 4px);border-radius:10px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:var(--et-surface-background-solid, var(--et-surface-2, rgb(38 38 38)));color:var(--et-surface-color-solid, var(--et-color-main-contrast, rgb(244 244 245)));box-shadow:0 10px 24px #00000029;--et-icon-button-border-radius: var(--et-rich-text-editor-button-radius, 4px)}.et-rte-floating-toolbar .et-divider{--et-divider-color: color-mix(in srgb, currentColor 20%, transparent);--et-divider-spacing: 2px;--et-divider-inset: 4px}}\n"], dependencies: [{ kind: "component", type: DividerComponent, selector: "et-divider", inputs: ["orientation", "decorative"] }, { kind: "component", type: IconButtonComponent, selector: "[et-icon-button]", inputs: ["variant", "size"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor", "label"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: RichTextEditorFloatingToolbarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'et-rich-text-editor-floating-toolbar', encapsulation: ViewEncapsulation.None, imports: [IconButtonComponent, IconDirective], providers: [provideIcons(BOLD_ICON, ITALIC_ICON, UNDERLINE_ICON, STRIKETHROUGH_ICON, CODE_ICON, LINK_ICON)], hostDirectives: [ProvideColorDirective, AutoSurfaceDirective], host: {
+            args: [{ selector: 'et-rich-text-editor-floating-toolbar', encapsulation: ViewEncapsulation.None, imports: [DividerComponent, IconButtonComponent, IconDirective], providers: [provideIcons(BOLD_ICON, ITALIC_ICON, UNDERLINE_ICON, STRIKETHROUGH_ICON, CODE_ICON, LINK_ICON)], hostDirectives: [ProvideColorDirective, AutoSurfaceDirective], host: {
                         class: 'et-rte-floating-toolbar',
                         role: 'toolbar',
                         '[attr.aria-label]': 'labels().selectionToolbar',
                         // keep the caret/selection in the editor when the user clicks a button
                         '(mousedown)': '$event.preventDefault()',
-                    }, template: "@for (def of inlineTools(); track def.token; let first = $first) {\n  @if (def.token === TOOLS.LINK && !first) {\n    <span class=\"et-rte-toolbar-divider\" aria-hidden=\"true\"></span>\n  }\n\n  <!-- Icon tools only: this bar has no room for a custom control, and every inline tool is a toggle. -->\n  @if (def.icon; as icon) {\n    <button\n      [pressed]=\"def.isActive?.(editor()) ?? false\"\n      [disabled]=\"def.isDisabled?.(editor()) ?? false\"\n      [attr.aria-label]=\"toolLabel(def)\"\n      (mousedown)=\"$event.preventDefault()\"\n      (click)=\"def.run?.(editor())\"\n      mutedUntilPressed\n      et-icon-button\n      size=\"sm\"\n      type=\"button\"\n      tabindex=\"-1\"\n    >\n      <i [allowHardcodedColor]=\"def.allowHardcodedColor ?? false\" [etIcon]=\"icon\"></i>\n    </button>\n  }\n}\n", styles: ["@layer components{.et-overlay.et-rte-floating-toolbar-overlay{overflow:visible;background:transparent;box-shadow:none;border-radius:10px}.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-enter-from,.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-leave-to{opacity:0}.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-enter-active{transition:transform .14s ease,opacity .14s ease}.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-leave-active{transition:transform .1s ease,opacity .1s ease}.et-rte-floating-toolbar-overlay[data-overlay-placement^=top].et-animation-enter-from,.et-rte-floating-toolbar-overlay[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-rte-floating-toolbar-overlay[data-overlay-placement^=bottom].et-animation-enter-from,.et-rte-floating-toolbar-overlay[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-rte-floating-toolbar-overlay.et-animation-enter-active{transition:opacity .14s ease}.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-leave-active{transition:opacity .1s ease}.et-rte-floating-toolbar-overlay[data-overlay-placement].et-animation-enter-from,.et-rte-floating-toolbar-overlay[data-overlay-placement].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0)!important}}.et-rte-floating-toolbar{display:flex;align-items:center;gap:var(--et-rich-text-editor-toolbar-gap, 2px);padding:var(--et-rich-text-editor-toolbar-padding, 4px);border-radius:10px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:var(--et-surface-background-solid, var(--et-surface-2, rgb(38 38 38)));color:var(--et-surface-color-solid, var(--et-color-main-contrast, rgb(244 244 245)));box-shadow:0 10px 24px #00000029;--et-icon-button-border-radius: var(--et-rich-text-editor-button-radius, 4px)}.et-rte-floating-toolbar .et-rte-toolbar-divider{inline-size:1px;align-self:stretch;margin-block:4px;margin-inline:2px;background:color-mix(in srgb,currentColor 20%,transparent)}}\n"] }]
+                    }, template: "@for (def of inlineTools(); track def.token; let first = $first) {\n  @if (def.token === TOOLS.LINK && !first) {\n    <et-divider orientation=\"vertical\" decorative />\n  }\n\n  <!-- Icon tools only: this bar has no room for a custom control, and every inline tool is a toggle. -->\n  @if (def.icon; as icon) {\n    <button\n      [pressed]=\"def.isActive?.(editor()) ?? false\"\n      [disabled]=\"def.isDisabled?.(editor()) ?? false\"\n      [attr.aria-label]=\"toolLabel(def)\"\n      (mousedown)=\"$event.preventDefault()\"\n      (click)=\"def.run?.(editor())\"\n      mutedUntilPressed\n      et-icon-button\n      size=\"sm\"\n      type=\"button\"\n      tabindex=\"-1\"\n    >\n      <i [allowHardcodedColor]=\"def.allowHardcodedColor ?? false\" [etIcon]=\"icon\"></i>\n    </button>\n  }\n}\n", styles: ["@layer components{.et-overlay.et-rte-floating-toolbar-overlay{overflow:visible;background:transparent;box-shadow:none;border-radius:10px}.et-overlay.et-rte-floating-toolbar-overlay>.et-rte-floating-toolbar{display:flex}.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-enter-from,.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-leave-to{opacity:0}.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-enter-active{transition:transform .14s ease,opacity .14s ease}.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-leave-active{transition:transform .1s ease,opacity .1s ease}.et-rte-floating-toolbar-overlay[data-overlay-placement^=top].et-animation-enter-from,.et-rte-floating-toolbar-overlay[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-rte-floating-toolbar-overlay[data-overlay-placement^=bottom].et-animation-enter-from,.et-rte-floating-toolbar-overlay[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-rte-floating-toolbar-overlay.et-animation-enter-active{transition:opacity .14s ease}.et-overlay.et-with-default-animation.et-rte-floating-toolbar-overlay.et-animation-leave-active{transition:opacity .1s ease}.et-rte-floating-toolbar-overlay[data-overlay-placement].et-animation-enter-from,.et-rte-floating-toolbar-overlay[data-overlay-placement].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0)!important}}.et-rte-floating-toolbar{display:flex;align-items:center;gap:var(--et-rich-text-editor-toolbar-gap, 2px);padding:var(--et-rich-text-editor-toolbar-padding, 4px);border-radius:10px;border:1px solid var(--et-surface-border-solid, rgb(255 255 255 / .1));background:var(--et-surface-background-solid, var(--et-surface-2, rgb(38 38 38)));color:var(--et-surface-color-solid, var(--et-color-main-contrast, rgb(244 244 245)));box-shadow:0 10px 24px #00000029;--et-icon-button-border-radius: var(--et-rich-text-editor-button-radius, 4px)}.et-rte-floating-toolbar .et-divider{--et-divider-color: color-mix(in srgb, currentColor 20%, transparent);--et-divider-spacing: 2px;--et-divider-inset: 4px}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { editor: [{ type: i0.Input, args: [{ isSignal: true, alias: "editor", required: true }] }] } });
 
 const HEADING_SELECTOR = 'h1, h2, h3, h4, h5, h6';
@@ -32430,6 +32490,7 @@ const createMenuHoverIntent = () => {
     };
 };
 
+const MENU_MIN_AVAILABLE_SPACE = 160;
 class MenuDirective {
     constructor() {
         this.destroyRef = inject(DestroyRef);
@@ -33005,6 +33066,7 @@ class MenuDirective {
         const positionOptions = {
             placement: this.resolvedPlacement(),
             fallbackPlacements: this.resolvedFallbackPlacements(),
+            minAvailableSpace: this.resolvedMinAvailableSpace(),
             offset: this.resolvedOffset(),
             arrowPadding: this.arrowPadding(),
             viewportPadding: this.viewportPadding(),
@@ -33066,6 +33128,18 @@ class MenuDirective {
         }
         return ['left-start', 'right-end', 'left-end'];
     }
+    /**
+     * `minAvailableSpace` replaces `flip` outright, so it may only kick in where no consumer has
+     * expressed a placement preference of their own. It is also vertical-only: a submenu opens on the
+     * x axis, where shrinking to the space beside the parent means a narrower - not a shorter - panel.
+     */
+    resolvedMinAvailableSpace() {
+        if (this.fallbackPlacements() || this.anchorPoint() || !this.isRoot) {
+            return undefined;
+        }
+        const side = this.resolvedPlacement().split('-')[0];
+        return side === 'top' || side === 'bottom' ? MENU_MIN_AVAILABLE_SPACE : undefined;
+    }
     resolvedArrow() {
         // a point anchor (context menu) has no element the arrow could meaningfully point at
         return this.arrow() && this.isRoot && !this.anchorPoint();
@@ -34022,12 +34096,12 @@ class MenuComponent {
         this.contextColorProvider = inject(COLOR_PROVIDER, { optional: true, skipSelf: true });
         this.menu = inject(MenuDirective, { optional: true });
         this.errorColorTheme = injectErrorTheme();
-        // observed instead of the host: the host's used size is overridden by the resize animation
-        // itself, so observing it directly would feed the animation back into the observer
+        // both must stay content-sized: the host's used size is overridden by the resize animation and
+        // the scroller is sized by the host, so observing either would feed the animation back in
         this.headerElement = viewChild('menuHeader', /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "headerElement" }] : /* istanbul ignore next */ []));
-        this.bodyElement = viewChild('menuBody', /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "bodyElement" }] : /* istanbul ignore next */ []));
+        this.bodyContentElement = viewChild('menuBodyContent', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "bodyContentElement" }] : /* istanbul ignore next */ []));
         this.search = computed(() => this.menu?.registeredSearch() ?? null, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "search" }] : /* istanbul ignore next */ []));
         this.searchLoading = computed(() => this.search()?.loading() ?? false, /* @ts-ignore */
@@ -34053,19 +34127,19 @@ class MenuComponent {
         // animate the menu's block size when its content changes while open
         // (e.g. search filtering items away or the search error line appearing)
         injectAnimatedBlockSize({
-            observe: [this.headerElement, this.bodyElement],
+            observe: [this.headerElement, this.bodyContentElement],
             resizingClass: RESIZE_ANIMATION_CLASS,
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", 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;-webkit-tap-highlight-color:transparent;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-menu .et-menu-item .et-menu-item-content{flex:1;min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.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{transition:opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-leave-active{transition:opacity .1s ease}.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 }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: MenuComponent, isStandalone: true, selector: "et-menu", host: { classAttribute: "et-menu" }, viewQueries: [{ propertyName: "headerElement", first: true, predicate: ["menuHeader"], descendants: true, isSignal: true }, { propertyName: "bodyContentElement", first: true, predicate: ["menuBodyContent"], 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 class=\"et-menu-body\">\n  <div #menuBodyContent class=\"et-menu-body-content\">\n    <ng-content />\n  </div>\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:flex;flex-direction:column;min-inline-size:var(--et-menu-min-width);max-inline-size:min(320px,calc(100vw - 24px));max-block-size:min(var(--et-menu-max-height),var(--et-overlay-max-height, 100vh));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--resizing .et-menu-body{overflow:clip}.et-menu .et-menu-header{flex:none;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{flex:1;min-block-size:0;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;-webkit-tap-highlight-color:transparent;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-menu .et-menu-item .et-menu-item-content{flex:1;min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.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{transition:opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-leave-active{transition:opacity .1s ease}.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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MenuComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-menu', encapsulation: ViewEncapsulation.None, imports: [ProvideColorDirective, SpinnerComponent], hostDirectives: [MenuPanelDirective, ProvideColorDirective, AutoSurfaceDirective], host: {
                         class: 'et-menu',
-                    }, 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;-webkit-tap-highlight-color:transparent;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-menu .et-menu-item .et-menu-item-content{flex:1;min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.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{transition:opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-leave-active{transition:opacity .1s ease}.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"] }]
-        }], ctorParameters: () => [], propDecorators: { headerElement: [{ type: i0.ViewChild, args: ['menuHeader', { isSignal: true }] }], bodyElement: [{ type: i0.ViewChild, args: ['menuBody', { isSignal: true }] }] } });
+                    }, 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 class=\"et-menu-body\">\n  <div #menuBodyContent class=\"et-menu-body-content\">\n    <ng-content />\n  </div>\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:flex;flex-direction:column;min-inline-size:var(--et-menu-min-width);max-inline-size:min(320px,calc(100vw - 24px));max-block-size:min(var(--et-menu-max-height),var(--et-overlay-max-height, 100vh));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--resizing .et-menu-body{overflow:clip}.et-menu .et-menu-header{flex:none;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{flex:1;min-block-size:0;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;-webkit-tap-highlight-color:transparent;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-menu .et-menu-item .et-menu-item-content{flex:1;min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.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{transition:opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--menu.et-animation-leave-active{transition:opacity .1s ease}.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"] }]
+        }], ctorParameters: () => [], propDecorators: { headerElement: [{ type: i0.ViewChild, args: ['menuHeader', { isSignal: true }] }], bodyContentElement: [{ type: i0.ViewChild, args: ['menuBodyContent', { isSignal: true }] }] } });
 
 const MENU_IMPORTS = [
     MenuDirective,
@@ -36630,6 +36704,160 @@ const createRichTextEditorTriggerWithQuery = (config) => {
  */
 const RICH_TEXT_EDITOR_TRIGGERS_IMPORTS = [RichTextEditorTriggersDirective];
 
+const TOOLBAR_ORIENTATIONS = {
+    HORIZONTAL: 'horizontal',
+    VERTICAL: 'vertical',
+};
+
+const CONTROL_SELECTOR = 'button, [href], input, select, textarea';
+const TOOLBAR_SELECTOR = '[role="toolbar"]';
+/**
+ * Turns its host into an ARIA toolbar: a single tab stop that Tab enters and leaves, with the arrow
+ * keys moving focus between the controls inside it. `Home`/`End` jump to the first/last control and
+ * arrow navigation wraps around; in a horizontal toolbar the left/right keys follow the writing
+ * direction.
+ *
+ * Every focusable control rendered inside the host is a toolbar control - projected content,
+ * `@for` output and components that own their own button templates included - so nothing has to be
+ * marked up per item. Natively disabled controls are skipped; controls belonging to a nested
+ * toolbar stay with that toolbar.
+ *
+ * Pair it with an accessible name (`aria-label`, or `aria-labelledby` pointing at a visible
+ * heading), which is what tells the user what the toolbar is for.
+ *
+ * @example
+ * <div [attr.aria-label]="'Text formatting'" etToolbar>
+ *   <button et-icon-button type="button">…</button>
+ *   <button et-icon-button type="button">…</button>
+ * </div>
+ */
+class ToolbarDirective {
+    constructor() {
+        this.elementRef = inject(ElementRef);
+        this.document = inject(DOCUMENT$1);
+        this.orientation = input(TOOLBAR_ORIENTATIONS.HORIZONTAL, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
+        this.tabStop = null;
+        afterEveryRender(() => this.syncTabStops());
+    }
+    /** Moves focus to the toolbar's first control, the tab stop a fresh Tab would land on. */
+    focusFirst() {
+        this.focusableControls()[0]?.focus();
+    }
+    handleKeydown(event) {
+        const horizontal = this.orientation() === TOOLBAR_ORIENTATIONS.HORIZONTAL;
+        const rtl = horizontal && getComputedStyle(this.elementRef.nativeElement).direction === 'rtl';
+        const nextKey = horizontal ? (rtl ? 'ArrowLeft' : 'ArrowRight') : 'ArrowDown';
+        const previousKey = horizontal ? (rtl ? 'ArrowRight' : 'ArrowLeft') : 'ArrowUp';
+        let target;
+        const controls = this.focusableControls();
+        if (!controls.length)
+            return;
+        const current = controls.indexOf(this.document.activeElement);
+        switch (event.key) {
+            case nextKey:
+                target = controls[(current + 1) % controls.length];
+                break;
+            case previousKey:
+                target = controls[current <= 0 ? controls.length - 1 : current - 1];
+                break;
+            case 'Home':
+                target = controls[0];
+                break;
+            case 'End':
+                target = controls[controls.length - 1];
+                break;
+            default:
+                return;
+        }
+        if (!target)
+            return;
+        event.preventDefault();
+        target.focus();
+    }
+    /** The last focused control keeps the tab stop, so Shift+Tab back re-enters where the user left. */
+    handleFocusIn(event) {
+        const target = event.target;
+        if (!(target instanceof HTMLElement) || !this.focusableControls().includes(target))
+            return;
+        this.tabStop = target;
+        this.syncTabStops();
+    }
+    /** Every control this toolbar owns. Disabled ones are included: they must lose their tab stop too,
+     *  or re-enabling one would leave the toolbar with two. */
+    controls() {
+        const host = this.elementRef.nativeElement;
+        // eslint-disable-next-line ethlete/no-dom-query -- any focusable descendant is a toolbar control, including those inside components that own their own button templates, which no directive token could reach
+        const found = Array.from(host.querySelectorAll(`${CONTROL_SELECTOR}, ${TOOLBAR_SELECTOR}`));
+        const nested = found.filter((element) => element.matches(TOOLBAR_SELECTOR));
+        return found.filter((control) => !nested.includes(control) && !nested.some((toolbar) => toolbar.contains(control)));
+    }
+    focusableControls() {
+        return this.controls().filter((control) => !control.disabled);
+    }
+    syncTabStops() {
+        const focusable = this.focusableControls();
+        if (!this.tabStop || !focusable.includes(this.tabStop)) {
+            this.tabStop = focusable[0] ?? null;
+        }
+        for (const control of this.controls()) {
+            const tabIndex = control === this.tabStop ? 0 : -1;
+            // written imperatively rather than as a binding: the controls are arbitrary projected content,
+            // so only touch the DOM when the value changed to keep the per-render pass free
+            if (control.tabIndex !== tabIndex)
+                control.tabIndex = tabIndex;
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: ToolbarDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: ToolbarDirective, isStandalone: true, selector: "[etToolbar]", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "toolbar" }, listeners: { "keydown": "handleKeydown($event)", "focusin": "handleFocusIn($event)" }, properties: { "attr.aria-orientation": "orientation()" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: ToolbarDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[etToolbar]',
+                    host: {
+                        role: 'toolbar',
+                        '[attr.aria-orientation]': 'orientation()',
+                        '(keydown)': 'handleKeydown($event)',
+                        '(focusin)': 'handleFocusIn($event)',
+                    },
+                }]
+        }], ctorParameters: () => [], propDecorators: { orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }] } });
+
+/**
+ * A bar of related controls that share one tab stop, laid out in a row (or a column with
+ * `orientation="vertical"`) and navigated with the arrow keys - see `[etToolbar]` for the keyboard
+ * model. Group the controls inside it with `et-divider`.
+ *
+ * Pass an `aria-label` naming what the toolbar acts on; without one a screen reader announces only
+ * that a toolbar is present.
+ *
+ * @example
+ * <et-toolbar aria-label="Text formatting">
+ *   <button et-icon-button type="button"><i etIcon="et-bold"></i></button>
+ *   <button et-icon-button type="button"><i etIcon="et-italic"></i></button>
+ *   <et-divider orientation="vertical" decorative />
+ *   <button et-icon-button type="button"><i etIcon="et-link"></i></button>
+ * </et-toolbar>
+ */
+class ToolbarComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: ToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.7", type: ToolbarComponent, isStandalone: true, selector: "et-toolbar, [et-toolbar]", host: { classAttribute: "et-toolbar" }, hostDirectives: [{ directive: ToolbarDirective, inputs: ["orientation", "orientation"] }], ngImport: i0, template: `<ng-content />`, isInline: true, styles: ["@layer components{@property --et-toolbar-gap{syntax: \"<length>\"; inherits: false; initial-value: 4px;}@property --et-toolbar-padding{syntax: \"<length>\"; inherits: false; initial-value: 4px;}@property --et-toolbar-border-radius{syntax: \"<length>\"; inherits: false; initial-value: 8px;}@property --et-toolbar-background{syntax: \"<color>\"; inherits: false; initial-value: transparent;}.et-toolbar{display:flex;align-items:center;gap:var(--et-toolbar-gap);padding:var(--et-toolbar-padding);border-radius:var(--et-toolbar-border-radius);background:var(--et-toolbar-background);box-sizing:border-box}.et-toolbar:where([aria-orientation=vertical]){flex-direction:column;align-items:stretch}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: ToolbarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'et-toolbar, [et-toolbar]', template: `<ng-content />`, encapsulation: ViewEncapsulation.None, hostDirectives: [
+                        {
+                            directive: ToolbarDirective,
+                            inputs: ['orientation'],
+                        },
+                    ], host: {
+                        class: 'et-toolbar',
+                    }, styles: ["@layer components{@property --et-toolbar-gap{syntax: \"<length>\"; inherits: false; initial-value: 4px;}@property --et-toolbar-padding{syntax: \"<length>\"; inherits: false; initial-value: 4px;}@property --et-toolbar-border-radius{syntax: \"<length>\"; inherits: false; initial-value: 8px;}@property --et-toolbar-background{syntax: \"<color>\"; inherits: false; initial-value: transparent;}.et-toolbar{display:flex;align-items:center;gap:var(--et-toolbar-gap);padding:var(--et-toolbar-padding);border-radius:var(--et-toolbar-border-radius);background:var(--et-toolbar-background);box-sizing:border-box}.et-toolbar:where([aria-orientation=vertical]){flex-direction:column;align-items:stretch}}\n"] }]
+        }] });
+
+const TOOLBAR_IMPORTS = [ToolbarComponent, ToolbarDirective];
+
 /** How often the docked toolbar re-checks where the keyboard is, to recover a missed viewport event. */
 const DOCKED_TOOLBAR_POLL_MS = 500;
 /** Caret-navigation / deletion keys that should drop any pending stored-mark toggle. */
@@ -36664,8 +36892,6 @@ class RichTextEditorComponent {
         this.floatingToolbarSetup = inject(RICH_TEXT_EDITOR_FLOATING_TOOLBAR, { optional: true });
         this.editable = viewChild.required('editable', /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "editable" }] : /* istanbul ignore next */ []));
-        this.toolbar = viewChild.required('toolbar', /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "toolbar" }] : /* istanbul ignore next */ []));
         this.TOOLS = RICH_TEXT_EDITOR_TOOLS;
         /** The strings in effect, owned by the directive so the opt-in tools read the same set. */
         this.labels = computed(() => this.dir.resolvedLabels(), /* @ts-ignore */
@@ -36679,14 +36905,10 @@ class RichTextEditorComponent {
         /** Dock the toolbar above the keyboard only on touch while editing. */
         this.dockedToolbar = computed(() => this.hasTouchInput() && this.editingActive(), /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "dockedToolbar" }] : /* istanbul ignore next */ []));
-        /** The toolbar button currently holding the single roving tab stop (ARIA toolbar pattern). */
-        this.toolbarTabStop = null;
         this.linkEditorSetup?.(this.dir, this.host.nativeElement);
         this.floatingToolbarSetup?.(this.dir);
         this.trackKeyboardInset();
         this.trackEditingActive();
-        // keep the roving tab stop valid as tools are added/removed or become disabled
-        afterEveryRender(() => this.updateToolbarTabStops());
         afterNextRender(() => {
             this.dir.editorDom.root.set(this.editable().nativeElement ?? null);
             this.dir.renderExternalValue();
@@ -36713,48 +36935,6 @@ class RichTextEditorComponent {
     syncValueFromDom() {
         this.dir.syncFromDom();
     }
-    /**
-     * The toolbar is a single tab stop (ARIA toolbar pattern): Tab enters on one button, the arrow
-     * keys move focus between the buttons, and the next Tab leaves the toolbar. Menu surfaces render
-     * into an overlay, so every `button` inside the toolbar element is a toolbar control - including
-     * the custom tool controls (`ngComponentOutlet`), which template bindings couldn't reach.
-     */
-    handleToolbarKeydown(event) {
-        if (event.key !== 'ArrowLeft' && event.key !== 'ArrowRight' && event.key !== 'Home' && event.key !== 'End') {
-            return;
-        }
-        const buttons = this.toolbarButtons().filter((button) => !button.disabled);
-        if (!buttons.length)
-            return;
-        const currentIndex = buttons.indexOf(this.document.activeElement);
-        let next;
-        switch (event.key) {
-            case 'ArrowLeft':
-                next = buttons[currentIndex <= 0 ? buttons.length - 1 : currentIndex - 1];
-                break;
-            case 'ArrowRight':
-                next = buttons[(currentIndex + 1) % buttons.length];
-                break;
-            case 'Home':
-                next = buttons[0];
-                break;
-            case 'End':
-                next = buttons[buttons.length - 1];
-                break;
-        }
-        if (!next)
-            return;
-        event.preventDefault();
-        next.focus();
-    }
-    /** The last focused button keeps the tab stop, so Shift+Tab back re-enters where the user left. */
-    handleToolbarFocusIn(event) {
-        const target = event.target;
-        if (!(target instanceof HTMLButtonElement) || target.disabled)
-            return;
-        this.toolbarTabStop = target;
-        this.updateToolbarTabStops();
-    }
     interceptEditorKeydown(event) {
         // History first, and always prevented: the native contenteditable undo stack must never run,
         // since paste normalization and autoformat rewrite the DOM behind its back and it would restore
@@ -36924,24 +37104,6 @@ class RichTextEditorComponent {
                 break;
         }
     }
-    toolbarButtons() {
-        // eslint-disable-next-line ethlete/no-dom-query -- custom tool controls (ngComponentOutlet) own their button templates, so no directive token could reach them
-        return Array.from(this.toolbar().nativeElement.querySelectorAll('button'));
-    }
-    updateToolbarTabStops() {
-        const buttons = this.toolbarButtons();
-        const enabled = buttons.filter((button) => !button.disabled);
-        if (!this.toolbarTabStop || !enabled.includes(this.toolbarTabStop)) {
-            this.toolbarTabStop = enabled[0] ?? null;
-        }
-        for (const button of buttons) {
-            const tabIndex = button === this.toolbarTabStop ? 0 : -1;
-            // written imperatively (not a binding) since custom tool controls own their button templates;
-            // only touch the DOM when the value changed so the per-render pass stays free
-            if (button.tabIndex !== tabIndex)
-                button.tabIndex = tabIndex;
-        }
-    }
     /** Track the visual viewport so the docked (fixed) toolbar sits right above the on-screen
      *  keyboard: the inset is the gap from where `position: fixed; bottom: 0` actually renders (a
      *  measured probe - see below) down past the keyboard's top edge
@@ -37088,11 +37250,11 @@ class RichTextEditorComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: RichTextEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: RichTextEditorComponent, isStandalone: true, selector: "et-rich-text-editor", host: { listeners: { "click": "dir.activate()" }, properties: { "class.et-rich-text-editor--touch": "hasTouchInput()", "class.et-rich-text-editor--docked-toolbar": "dockedToolbar()" }, classAttribute: "et-rich-text-editor" }, providers: [
             provideIcons(BOLD_ICON, ITALIC_ICON, UNDERLINE_ICON, STRIKETHROUGH_ICON, CODE_ICON, LIST_BULLETED_ICON, LIST_NUMBERED_ICON, LINK_ICON, QUOTE_ICON, CODE_BLOCK_ICON, UNDO_ICON, REDO_ICON),
-        ], viewQueries: [{ propertyName: "editable", first: true, predicate: ["editable"], descendants: true, isSignal: true }, { propertyName: "toolbar", first: true, predicate: ["toolbar"], descendants: true, isSignal: true }], hostDirectives: [{ directive: RichTextEditorDirective, inputs: ["value", "value", "disabled", "disabled", "readonly", "readonly", "hidden", "hidden", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name", "placeholder", "placeholder", "tools", "tools", "autoformat", "autoformat", "labels", "labels"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange"] }], ngImport: i0, template: "<!-- eslint-disable-next-line @angular-eslint/template/interactive-supports-focus -- ARIA toolbar pattern: the container only relays keys/focus for its roving tab stop; the buttons inside are the focusable controls -->\n<div\n  #toolbar\n  [attr.aria-label]=\"labels().toolbar\"\n  (keydown)=\"handleToolbarKeydown($event)\"\n  (focusin)=\"handleToolbarFocusIn($event)\"\n  class=\"et-rte-toolbar\"\n  role=\"toolbar\"\n>\n  @for (tool of dir.resolvedTools(); track $index) {\n    @switch (tool) {\n      @case (TOOLS.DIVIDER) {\n        <span class=\"et-rte-toolbar-divider\" aria-hidden=\"true\"></span>\n      }\n      @default {\n        @if (dir.toolDefs.get(tool); as def) {\n          @if (def.control; as control) {\n            <ng-container [ngComponentOutlet]=\"control\" [ngComponentOutletInputs]=\"{ editor: dir }\" />\n          } @else {\n            <button\n              [pressed]=\"def.isActive?.(dir) ?? false\"\n              [disabled]=\"dir.disabled() || dir.readonly() || (def.isDisabled?.(dir) ?? false)\"\n              [attr.aria-label]=\"toolLabel(def)\"\n              (mousedown)=\"$event.preventDefault()\"\n              (click)=\"def.run?.(dir)\"\n              mutedUntilPressed\n              et-icon-button\n              size=\"sm\"\n              type=\"button\"\n            >\n              <i [allowHardcodedColor]=\"def.allowHardcodedColor ?? false\" [etIcon]=\"def.icon ?? ''\"></i>\n            </button>\n          }\n        }\n      }\n    }\n  }\n</div>\n\n<div\n  #editable\n  [attr.contenteditable]=\"dir.disabled() || dir.readonly() ? 'false' : 'true'\"\n  [attr.tabindex]=\"dir.disabled() ? -1 : 0\"\n  [attr.data-placeholder]=\"dir.placeholder() || null\"\n  [attr.aria-invalid]=\"dir.shouldDisplayError() || null\"\n  [attr.aria-describedby]=\"dir.describedBy() || null\"\n  [attr.aria-labelledby]=\"dir.labelId() || null\"\n  [attr.aria-disabled]=\"dir.disabled() || null\"\n  [attr.aria-readonly]=\"dir.readonly() || null\"\n  (input)=\"syncValueFromDom()\"\n  (beforeinput)=\"interceptFormattingCommand($event)\"\n  (keydown)=\"interceptEditorKeydown($event)\"\n  (paste)=\"interceptPaste($event)\"\n  (drop)=\"interceptDrop($event)\"\n  (click)=\"interceptClick($event)\"\n  (pointerdown)=\"dir.clearPendingMarks()\"\n  (focus)=\"dir.focused.set(true)\"\n  (blur)=\"dir.focused.set(false); dir.touched.set(true)\"\n  class=\"et-rte-content\"\n  role=\"textbox\"\n  aria-multiline=\"true\"\n></div>\n", styles: ["@layer components{@property --et-rich-text-editor-toolbar-gap{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-rich-text-editor-toolbar-padding{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-rich-text-editor-button-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-rich-text-editor-min-height{syntax: \"<length>\"; inherits: true; initial-value: 96px;}@property --et-rich-text-editor-content-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-rich-text-editor-quote-indent{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-rich-text-editor-quote-bar-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-rich-text-editor-code-block-radius{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-rich-text-editor-token-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-rich-text-editor-token-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 4px;}et-rich-text-editor{display:flex;flex:1;flex-direction:column;min-inline-size:0;color:inherit}et-rich-text-editor .et-rte-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--et-rich-text-editor-toolbar-gap);padding:var(--et-rich-text-editor-toolbar-padding);padding-inline:calc(var(--et-form-field-control-padding-inline) - var(--et-rich-text-editor-toolbar-padding));border-block-end:var(--et-form-field-control-border-width, 1px) solid color-mix(in srgb,currentColor 12%,transparent);--et-icon-button-border-radius: var(--et-rich-text-editor-button-radius)}et-rich-text-editor .et-rte-toolbar .et-icon-button{--_et-focus-ring-offset: -1px}et-rich-text-editor.et-rich-text-editor--touch .et-rte-toolbar{position:fixed;inset-inline:0;inset-block-end:0;z-index:60;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;padding-inline:8px;padding-block-start:6px;padding-block-end:calc(6px + max(var(--_et-rte-keyboard-inset, 0px),env(keyboard-inset-height,0px)));background:var(--et-surface-background-solid, var(--et-surface-2, rgb(24 24 24)));border-block-end:none;border-block-start:var(--et-form-field-control-border-width, 1px) solid color-mix(in srgb,currentColor 12%,transparent);box-shadow:0 -6px 20px #0000003d;scrollbar-width:none;opacity:0;transform:translateY(100%);pointer-events:none;transition:opacity .16s var(--ease-out-5, ease),transform .26s var(--ease-out-5, ease)}et-rich-text-editor.et-rich-text-editor--touch .et-rte-toolbar::-webkit-scrollbar{display:none}et-rich-text-editor.et-rich-text-editor--touch.et-rich-text-editor--docked-toolbar .et-rte-toolbar{opacity:1;transform:translateY(0);pointer-events:auto}et-rich-text-editor.et-rich-text-editor--touch .et-rte-content{font-size:max(1em,16px)}@media(prefers-reduced-motion:reduce){et-rich-text-editor.et-rich-text-editor--touch .et-rte-toolbar{transition:opacity .16s var(--ease-out-5, ease)}}et-rich-text-editor .et-rte-toolbar-divider{inline-size:1px;align-self:stretch;margin-block:4px;margin-inline:2px;background:color-mix(in srgb,currentColor 12%,transparent)}et-rich-text-editor .et-rte-content{--et-theme-color-primary-rgb: var(--et-color-primary);--et-theme-color-primary-solid: rgb(var(--et-theme-color-primary-rgb));--et-theme-color-ink-rgb: var(--et-color-primary-ink, var(--et-color-primary));--et-theme-color-ink-solid: rgb(var(--et-theme-color-ink-rgb));display:block;flex:1;min-inline-size:0;padding-block:var(--et-form-field-control-padding-block);padding-inline:var(--et-form-field-control-padding-inline);min-block-size:var(--et-rich-text-editor-min-height);outline:none;color:inherit;caret-color:var(--et-theme-color-primary-solid, currentColor);overflow-wrap:anywhere}et-rich-text-editor .et-rte-content:empty:before{content:attr(data-placeholder);color:color-mix(in srgb,currentColor 46%,transparent);pointer-events:none}et-rich-text-editor .et-rte-content>:first-child{margin-block-start:0}et-rich-text-editor .et-rte-content>:last-child{margin-block-end:0}et-rich-text-editor .et-rte-content p{margin-block:0}et-rich-text-editor .et-rte-content p+p,et-rich-text-editor .et-rte-content ul,et-rich-text-editor .et-rte-content ol,et-rich-text-editor .et-rte-content blockquote,et-rich-text-editor .et-rte-content pre{margin-block-start:var(--et-rich-text-editor-content-gap)}et-rich-text-editor .et-rte-content h1,et-rich-text-editor .et-rte-content h2,et-rich-text-editor .et-rte-content h3,et-rich-text-editor .et-rte-content h4,et-rich-text-editor .et-rte-content h5,et-rich-text-editor .et-rte-content h6{margin-block:0;font-weight:700;line-height:1.25}et-rich-text-editor .et-rte-content :is(h1,h2,h3,h4,h5,h6)+*,et-rich-text-editor .et-rte-content *+:is(h1,h2,h3,h4,h5,h6){margin-block-start:var(--et-rich-text-editor-content-gap)}et-rich-text-editor .et-rte-content h1{font-size:2.4rem}et-rich-text-editor .et-rte-content h2{font-size:2rem}et-rich-text-editor .et-rte-content h3{font-size:1.6rem}et-rich-text-editor .et-rte-content ul,et-rich-text-editor .et-rte-content ol{margin-block-end:0;padding-inline-start:1.5em;list-style-position:outside}et-rich-text-editor .et-rte-content ul{list-style-type:disc}et-rich-text-editor .et-rte-content ul ul,et-rich-text-editor .et-rte-content ul ul ul ul ul{list-style-type:circle}et-rich-text-editor .et-rte-content ul ul ul,et-rich-text-editor .et-rte-content ul ul ul ul ul ul{list-style-type:square}et-rich-text-editor .et-rte-content ul ul ul ul{list-style-type:disc}et-rich-text-editor .et-rte-content ol{list-style-type:decimal}et-rich-text-editor .et-rte-content ol ol,et-rich-text-editor .et-rte-content ol ol ol ol ol{list-style-type:lower-alpha}et-rich-text-editor .et-rte-content ol ol ol,et-rich-text-editor .et-rte-content ol ol ol ol ol ol{list-style-type:lower-roman}et-rich-text-editor .et-rte-content ol ol ol ol{list-style-type:decimal}et-rich-text-editor .et-rte-content li{margin-block:0}et-rich-text-editor .et-rte-content li::marker{color:color-mix(in srgb,currentColor 60%,transparent)}et-rich-text-editor .et-rte-content a{color:var(--et-theme-color-primary-solid, currentColor);text-decoration:underline}et-rich-text-editor .et-rte-content code{padding:.1em .3em;border-radius:4px;background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 14%,transparent);font-family:var(--et-font-family-mono, ui-monospace, monospace);font-size:.9em}et-rich-text-editor .et-rte-content blockquote{margin-inline:0;margin-block-end:0;padding-inline-start:var(--et-rich-text-editor-quote-indent);border-inline-start:var(--et-rich-text-editor-quote-bar-width) solid color-mix(in srgb,var(--et-surface-border-solid, currentColor) 80%,transparent);color:color-mix(in srgb,currentColor 82%,transparent)}et-rich-text-editor .et-rte-content blockquote blockquote{margin-block-start:var(--et-rich-text-editor-content-gap)}et-rich-text-editor .et-rte-content pre{margin-block-end:0;padding:8px 10px;border-radius:var(--et-rich-text-editor-code-block-radius);background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 10%,transparent);font-family:var(--et-font-family-mono, ui-monospace, monospace);font-size:.9em;white-space:pre-wrap}et-rich-text-editor .et-rte-content pre code{padding:0;border-radius:0;background:none;font-size:inherit}et-rich-text-editor .et-rte-content .et-rte-token{--_et-rte-token-accent: var(--et-theme-color-primary-solid, var(--et-surface-interaction-solid, currentColor));display:inline;padding-inline:var(--et-rich-text-editor-token-padding-inline);border-radius:var(--et-rich-text-editor-token-radius);background:color-mix(in srgb,var(--_et-rte-token-accent) 22%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--_et-rte-token-accent) 45%,transparent);color:var(--et-theme-color-ink-solid, inherit);font-weight:500;white-space:nowrap;-webkit-user-select:all;user-select:all;cursor:default}et-rich-text-editor .et-rte-content .et-rte-token-prefix{margin-inline-end:1px;opacity:.65}}\n"], dependencies: [{ kind: "component", type: IconButtonComponent, selector: "[et-icon-button]", inputs: ["variant", "size"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor", "label"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }], encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "editable", first: true, predicate: ["editable"], descendants: true, isSignal: true }], hostDirectives: [{ directive: RichTextEditorDirective, inputs: ["value", "value", "disabled", "disabled", "readonly", "readonly", "hidden", "hidden", "invalid", "invalid", "errors", "errors", "required", "required", "name", "name", "placeholder", "placeholder", "tools", "tools", "autoformat", "autoformat", "labels", "labels"], outputs: ["valueChange", "valueChange", "touchedChange", "touchedChange"] }], ngImport: i0, template: "<div [attr.aria-label]=\"labels().toolbar\" class=\"et-rte-toolbar\" etToolbar>\n  @for (tool of dir.resolvedTools(); track $index) {\n    @switch (tool) {\n      @case (TOOLS.DIVIDER) {\n        <et-divider orientation=\"vertical\" decorative />\n      }\n      @default {\n        @if (dir.toolDefs.get(tool); as def) {\n          @if (def.control; as control) {\n            <ng-container [ngComponentOutlet]=\"control\" [ngComponentOutletInputs]=\"{ editor: dir }\" />\n          } @else {\n            <button\n              [pressed]=\"def.isActive?.(dir) ?? false\"\n              [disabled]=\"dir.disabled() || dir.readonly() || (def.isDisabled?.(dir) ?? false)\"\n              [attr.aria-label]=\"toolLabel(def)\"\n              (mousedown)=\"$event.preventDefault()\"\n              (click)=\"def.run?.(dir)\"\n              mutedUntilPressed\n              et-icon-button\n              size=\"sm\"\n              type=\"button\"\n            >\n              <i [allowHardcodedColor]=\"def.allowHardcodedColor ?? false\" [etIcon]=\"def.icon ?? ''\"></i>\n            </button>\n          }\n        }\n      }\n    }\n  }\n</div>\n\n<div\n  #editable\n  [attr.contenteditable]=\"dir.disabled() || dir.readonly() ? 'false' : 'true'\"\n  [attr.tabindex]=\"dir.disabled() ? -1 : 0\"\n  [attr.data-placeholder]=\"dir.placeholder() || null\"\n  [attr.aria-invalid]=\"dir.shouldDisplayError() || null\"\n  [attr.aria-describedby]=\"dir.describedBy() || null\"\n  [attr.aria-labelledby]=\"dir.labelId() || null\"\n  [attr.aria-disabled]=\"dir.disabled() || null\"\n  [attr.aria-readonly]=\"dir.readonly() || null\"\n  (input)=\"syncValueFromDom()\"\n  (beforeinput)=\"interceptFormattingCommand($event)\"\n  (keydown)=\"interceptEditorKeydown($event)\"\n  (paste)=\"interceptPaste($event)\"\n  (drop)=\"interceptDrop($event)\"\n  (click)=\"interceptClick($event)\"\n  (pointerdown)=\"dir.clearPendingMarks()\"\n  (focus)=\"dir.focused.set(true)\"\n  (blur)=\"dir.focused.set(false); dir.touched.set(true)\"\n  class=\"et-rte-content\"\n  role=\"textbox\"\n  aria-multiline=\"true\"\n></div>\n", styles: ["@layer components{@property --et-rich-text-editor-toolbar-gap{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-rich-text-editor-toolbar-padding{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-rich-text-editor-button-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-rich-text-editor-min-height{syntax: \"<length>\"; inherits: true; initial-value: 96px;}@property --et-rich-text-editor-content-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-rich-text-editor-quote-indent{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-rich-text-editor-quote-bar-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-rich-text-editor-code-block-radius{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-rich-text-editor-token-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-rich-text-editor-token-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 4px;}et-rich-text-editor{display:flex;flex:1;flex-direction:column;min-inline-size:0;color:inherit}et-rich-text-editor .et-rte-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--et-rich-text-editor-toolbar-gap);padding:var(--et-rich-text-editor-toolbar-padding);padding-inline:calc(var(--et-form-field-control-padding-inline) - var(--et-rich-text-editor-toolbar-padding));border-block-end:var(--et-form-field-control-border-width, 1px) solid color-mix(in srgb,currentColor 12%,transparent);--et-icon-button-border-radius: var(--et-rich-text-editor-button-radius)}et-rich-text-editor .et-rte-toolbar .et-icon-button{--_et-focus-ring-offset: -1px}et-rich-text-editor.et-rich-text-editor--touch .et-rte-toolbar{position:fixed;inset-inline:0;inset-block-end:0;z-index:60;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;padding-inline:8px;padding-block-start:6px;padding-block-end:calc(6px + max(var(--_et-rte-keyboard-inset, 0px),env(keyboard-inset-height,0px)));background:var(--et-surface-background-solid, var(--et-surface-2, rgb(24 24 24)));border-block-end:none;border-block-start:var(--et-form-field-control-border-width, 1px) solid color-mix(in srgb,currentColor 12%,transparent);box-shadow:0 -6px 20px #0000003d;scrollbar-width:none;opacity:0;transform:translateY(100%);pointer-events:none;transition:opacity .16s var(--ease-out-5, ease),transform .26s var(--ease-out-5, ease)}et-rich-text-editor.et-rich-text-editor--touch .et-rte-toolbar::-webkit-scrollbar{display:none}et-rich-text-editor.et-rich-text-editor--touch.et-rich-text-editor--docked-toolbar .et-rte-toolbar{opacity:1;transform:translateY(0);pointer-events:auto}et-rich-text-editor.et-rich-text-editor--touch .et-rte-content{font-size:max(1em,16px)}@media(prefers-reduced-motion:reduce){et-rich-text-editor.et-rich-text-editor--touch .et-rte-toolbar{transition:opacity .16s var(--ease-out-5, ease)}}et-rich-text-editor .et-rte-toolbar .et-divider{--et-divider-color: color-mix(in srgb, currentColor 12%, transparent);--et-divider-spacing: 2px;--et-divider-inset: 4px}et-rich-text-editor .et-rte-content{--et-theme-color-primary-rgb: var(--et-color-primary);--et-theme-color-primary-solid: rgb(var(--et-theme-color-primary-rgb));--et-theme-color-ink-rgb: var(--et-color-primary-ink, var(--et-color-primary));--et-theme-color-ink-solid: rgb(var(--et-theme-color-ink-rgb));display:block;flex:1;min-inline-size:0;padding-block:var(--et-form-field-control-padding-block);padding-inline:var(--et-form-field-control-padding-inline);min-block-size:var(--et-rich-text-editor-min-height);outline:none;color:inherit;caret-color:var(--et-theme-color-primary-solid, currentColor);overflow-wrap:anywhere}et-rich-text-editor .et-rte-content:empty:before{content:attr(data-placeholder);color:color-mix(in srgb,currentColor 46%,transparent);pointer-events:none}et-rich-text-editor .et-rte-content>:first-child{margin-block-start:0}et-rich-text-editor .et-rte-content>:last-child{margin-block-end:0}et-rich-text-editor .et-rte-content p{margin-block:0}et-rich-text-editor .et-rte-content p+p,et-rich-text-editor .et-rte-content ul,et-rich-text-editor .et-rte-content ol,et-rich-text-editor .et-rte-content blockquote,et-rich-text-editor .et-rte-content pre{margin-block-start:var(--et-rich-text-editor-content-gap)}et-rich-text-editor .et-rte-content h1,et-rich-text-editor .et-rte-content h2,et-rich-text-editor .et-rte-content h3,et-rich-text-editor .et-rte-content h4,et-rich-text-editor .et-rte-content h5,et-rich-text-editor .et-rte-content h6{margin-block:0;font-weight:700;line-height:1.25}et-rich-text-editor .et-rte-content :is(h1,h2,h3,h4,h5,h6)+*,et-rich-text-editor .et-rte-content *+:is(h1,h2,h3,h4,h5,h6){margin-block-start:var(--et-rich-text-editor-content-gap)}et-rich-text-editor .et-rte-content h1{font-size:2.4rem}et-rich-text-editor .et-rte-content h2{font-size:2rem}et-rich-text-editor .et-rte-content h3{font-size:1.6rem}et-rich-text-editor .et-rte-content ul,et-rich-text-editor .et-rte-content ol{margin-block-end:0;padding-inline-start:1.5em;list-style-position:outside}et-rich-text-editor .et-rte-content ul{list-style-type:disc}et-rich-text-editor .et-rte-content ul ul,et-rich-text-editor .et-rte-content ul ul ul ul ul{list-style-type:circle}et-rich-text-editor .et-rte-content ul ul ul,et-rich-text-editor .et-rte-content ul ul ul ul ul ul{list-style-type:square}et-rich-text-editor .et-rte-content ul ul ul ul{list-style-type:disc}et-rich-text-editor .et-rte-content ol{list-style-type:decimal}et-rich-text-editor .et-rte-content ol ol,et-rich-text-editor .et-rte-content ol ol ol ol ol{list-style-type:lower-alpha}et-rich-text-editor .et-rte-content ol ol ol,et-rich-text-editor .et-rte-content ol ol ol ol ol ol{list-style-type:lower-roman}et-rich-text-editor .et-rte-content ol ol ol ol{list-style-type:decimal}et-rich-text-editor .et-rte-content li{margin-block:0}et-rich-text-editor .et-rte-content li::marker{color:color-mix(in srgb,currentColor 60%,transparent)}et-rich-text-editor .et-rte-content a{color:var(--et-theme-color-primary-solid, currentColor);text-decoration:underline}et-rich-text-editor .et-rte-content code{padding:.1em .3em;border-radius:4px;background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 14%,transparent);font-family:var(--et-font-family-mono, ui-monospace, monospace);font-size:.9em}et-rich-text-editor .et-rte-content blockquote{margin-inline:0;margin-block-end:0;padding-inline-start:var(--et-rich-text-editor-quote-indent);border-inline-start:var(--et-rich-text-editor-quote-bar-width) solid color-mix(in srgb,var(--et-surface-border-solid, currentColor) 80%,transparent);color:color-mix(in srgb,currentColor 82%,transparent)}et-rich-text-editor .et-rte-content blockquote blockquote{margin-block-start:var(--et-rich-text-editor-content-gap)}et-rich-text-editor .et-rte-content pre{margin-block-end:0;padding:8px 10px;border-radius:var(--et-rich-text-editor-code-block-radius);background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 10%,transparent);font-family:var(--et-font-family-mono, ui-monospace, monospace);font-size:.9em;white-space:pre-wrap}et-rich-text-editor .et-rte-content pre code{padding:0;border-radius:0;background:none;font-size:inherit}et-rich-text-editor .et-rte-content .et-rte-token{--_et-rte-token-accent: var(--et-theme-color-primary-solid, var(--et-surface-interaction-solid, currentColor));display:inline;padding-inline:var(--et-rich-text-editor-token-padding-inline);border-radius:var(--et-rich-text-editor-token-radius);background:color-mix(in srgb,var(--_et-rte-token-accent) 22%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--_et-rte-token-accent) 45%,transparent);color:var(--et-theme-color-ink-solid, inherit);font-weight:500;white-space:nowrap;-webkit-user-select:all;user-select:all;cursor:default}et-rich-text-editor .et-rte-content .et-rte-token-prefix{margin-inline-end:1px;opacity:.65}}\n"], dependencies: [{ kind: "component", type: IconButtonComponent, selector: "[et-icon-button]", inputs: ["variant", "size"] }, { kind: "component", type: DividerComponent, selector: "et-divider", inputs: ["orientation", "decorative"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor", "label"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: ToolbarDirective, selector: "[etToolbar]", inputs: ["orientation"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: RichTextEditorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'et-rich-text-editor', encapsulation: ViewEncapsulation.None, imports: [...BUTTON_IMPORTS, IconDirective, NgComponentOutlet], providers: [
+            args: [{ selector: 'et-rich-text-editor', encapsulation: ViewEncapsulation.None, imports: [...BUTTON_IMPORTS, DividerComponent, IconDirective, NgComponentOutlet, ToolbarDirective], providers: [
                         provideIcons(BOLD_ICON, ITALIC_ICON, UNDERLINE_ICON, STRIKETHROUGH_ICON, CODE_ICON, LIST_BULLETED_ICON, LIST_NUMBERED_ICON, LINK_ICON, QUOTE_ICON, CODE_BLOCK_ICON, UNDO_ICON, REDO_ICON),
                     ], hostDirectives: [
                         {
@@ -37121,8 +37283,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                         '[class.et-rich-text-editor--touch]': 'hasTouchInput()',
                         '[class.et-rich-text-editor--docked-toolbar]': 'dockedToolbar()',
                         '(click)': 'dir.activate()',
-                    }, template: "<!-- eslint-disable-next-line @angular-eslint/template/interactive-supports-focus -- ARIA toolbar pattern: the container only relays keys/focus for its roving tab stop; the buttons inside are the focusable controls -->\n<div\n  #toolbar\n  [attr.aria-label]=\"labels().toolbar\"\n  (keydown)=\"handleToolbarKeydown($event)\"\n  (focusin)=\"handleToolbarFocusIn($event)\"\n  class=\"et-rte-toolbar\"\n  role=\"toolbar\"\n>\n  @for (tool of dir.resolvedTools(); track $index) {\n    @switch (tool) {\n      @case (TOOLS.DIVIDER) {\n        <span class=\"et-rte-toolbar-divider\" aria-hidden=\"true\"></span>\n      }\n      @default {\n        @if (dir.toolDefs.get(tool); as def) {\n          @if (def.control; as control) {\n            <ng-container [ngComponentOutlet]=\"control\" [ngComponentOutletInputs]=\"{ editor: dir }\" />\n          } @else {\n            <button\n              [pressed]=\"def.isActive?.(dir) ?? false\"\n              [disabled]=\"dir.disabled() || dir.readonly() || (def.isDisabled?.(dir) ?? false)\"\n              [attr.aria-label]=\"toolLabel(def)\"\n              (mousedown)=\"$event.preventDefault()\"\n              (click)=\"def.run?.(dir)\"\n              mutedUntilPressed\n              et-icon-button\n              size=\"sm\"\n              type=\"button\"\n            >\n              <i [allowHardcodedColor]=\"def.allowHardcodedColor ?? false\" [etIcon]=\"def.icon ?? ''\"></i>\n            </button>\n          }\n        }\n      }\n    }\n  }\n</div>\n\n<div\n  #editable\n  [attr.contenteditable]=\"dir.disabled() || dir.readonly() ? 'false' : 'true'\"\n  [attr.tabindex]=\"dir.disabled() ? -1 : 0\"\n  [attr.data-placeholder]=\"dir.placeholder() || null\"\n  [attr.aria-invalid]=\"dir.shouldDisplayError() || null\"\n  [attr.aria-describedby]=\"dir.describedBy() || null\"\n  [attr.aria-labelledby]=\"dir.labelId() || null\"\n  [attr.aria-disabled]=\"dir.disabled() || null\"\n  [attr.aria-readonly]=\"dir.readonly() || null\"\n  (input)=\"syncValueFromDom()\"\n  (beforeinput)=\"interceptFormattingCommand($event)\"\n  (keydown)=\"interceptEditorKeydown($event)\"\n  (paste)=\"interceptPaste($event)\"\n  (drop)=\"interceptDrop($event)\"\n  (click)=\"interceptClick($event)\"\n  (pointerdown)=\"dir.clearPendingMarks()\"\n  (focus)=\"dir.focused.set(true)\"\n  (blur)=\"dir.focused.set(false); dir.touched.set(true)\"\n  class=\"et-rte-content\"\n  role=\"textbox\"\n  aria-multiline=\"true\"\n></div>\n", styles: ["@layer components{@property --et-rich-text-editor-toolbar-gap{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-rich-text-editor-toolbar-padding{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-rich-text-editor-button-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-rich-text-editor-min-height{syntax: \"<length>\"; inherits: true; initial-value: 96px;}@property --et-rich-text-editor-content-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-rich-text-editor-quote-indent{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-rich-text-editor-quote-bar-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-rich-text-editor-code-block-radius{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-rich-text-editor-token-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-rich-text-editor-token-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 4px;}et-rich-text-editor{display:flex;flex:1;flex-direction:column;min-inline-size:0;color:inherit}et-rich-text-editor .et-rte-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--et-rich-text-editor-toolbar-gap);padding:var(--et-rich-text-editor-toolbar-padding);padding-inline:calc(var(--et-form-field-control-padding-inline) - var(--et-rich-text-editor-toolbar-padding));border-block-end:var(--et-form-field-control-border-width, 1px) solid color-mix(in srgb,currentColor 12%,transparent);--et-icon-button-border-radius: var(--et-rich-text-editor-button-radius)}et-rich-text-editor .et-rte-toolbar .et-icon-button{--_et-focus-ring-offset: -1px}et-rich-text-editor.et-rich-text-editor--touch .et-rte-toolbar{position:fixed;inset-inline:0;inset-block-end:0;z-index:60;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;padding-inline:8px;padding-block-start:6px;padding-block-end:calc(6px + max(var(--_et-rte-keyboard-inset, 0px),env(keyboard-inset-height,0px)));background:var(--et-surface-background-solid, var(--et-surface-2, rgb(24 24 24)));border-block-end:none;border-block-start:var(--et-form-field-control-border-width, 1px) solid color-mix(in srgb,currentColor 12%,transparent);box-shadow:0 -6px 20px #0000003d;scrollbar-width:none;opacity:0;transform:translateY(100%);pointer-events:none;transition:opacity .16s var(--ease-out-5, ease),transform .26s var(--ease-out-5, ease)}et-rich-text-editor.et-rich-text-editor--touch .et-rte-toolbar::-webkit-scrollbar{display:none}et-rich-text-editor.et-rich-text-editor--touch.et-rich-text-editor--docked-toolbar .et-rte-toolbar{opacity:1;transform:translateY(0);pointer-events:auto}et-rich-text-editor.et-rich-text-editor--touch .et-rte-content{font-size:max(1em,16px)}@media(prefers-reduced-motion:reduce){et-rich-text-editor.et-rich-text-editor--touch .et-rte-toolbar{transition:opacity .16s var(--ease-out-5, ease)}}et-rich-text-editor .et-rte-toolbar-divider{inline-size:1px;align-self:stretch;margin-block:4px;margin-inline:2px;background:color-mix(in srgb,currentColor 12%,transparent)}et-rich-text-editor .et-rte-content{--et-theme-color-primary-rgb: var(--et-color-primary);--et-theme-color-primary-solid: rgb(var(--et-theme-color-primary-rgb));--et-theme-color-ink-rgb: var(--et-color-primary-ink, var(--et-color-primary));--et-theme-color-ink-solid: rgb(var(--et-theme-color-ink-rgb));display:block;flex:1;min-inline-size:0;padding-block:var(--et-form-field-control-padding-block);padding-inline:var(--et-form-field-control-padding-inline);min-block-size:var(--et-rich-text-editor-min-height);outline:none;color:inherit;caret-color:var(--et-theme-color-primary-solid, currentColor);overflow-wrap:anywhere}et-rich-text-editor .et-rte-content:empty:before{content:attr(data-placeholder);color:color-mix(in srgb,currentColor 46%,transparent);pointer-events:none}et-rich-text-editor .et-rte-content>:first-child{margin-block-start:0}et-rich-text-editor .et-rte-content>:last-child{margin-block-end:0}et-rich-text-editor .et-rte-content p{margin-block:0}et-rich-text-editor .et-rte-content p+p,et-rich-text-editor .et-rte-content ul,et-rich-text-editor .et-rte-content ol,et-rich-text-editor .et-rte-content blockquote,et-rich-text-editor .et-rte-content pre{margin-block-start:var(--et-rich-text-editor-content-gap)}et-rich-text-editor .et-rte-content h1,et-rich-text-editor .et-rte-content h2,et-rich-text-editor .et-rte-content h3,et-rich-text-editor .et-rte-content h4,et-rich-text-editor .et-rte-content h5,et-rich-text-editor .et-rte-content h6{margin-block:0;font-weight:700;line-height:1.25}et-rich-text-editor .et-rte-content :is(h1,h2,h3,h4,h5,h6)+*,et-rich-text-editor .et-rte-content *+:is(h1,h2,h3,h4,h5,h6){margin-block-start:var(--et-rich-text-editor-content-gap)}et-rich-text-editor .et-rte-content h1{font-size:2.4rem}et-rich-text-editor .et-rte-content h2{font-size:2rem}et-rich-text-editor .et-rte-content h3{font-size:1.6rem}et-rich-text-editor .et-rte-content ul,et-rich-text-editor .et-rte-content ol{margin-block-end:0;padding-inline-start:1.5em;list-style-position:outside}et-rich-text-editor .et-rte-content ul{list-style-type:disc}et-rich-text-editor .et-rte-content ul ul,et-rich-text-editor .et-rte-content ul ul ul ul ul{list-style-type:circle}et-rich-text-editor .et-rte-content ul ul ul,et-rich-text-editor .et-rte-content ul ul ul ul ul ul{list-style-type:square}et-rich-text-editor .et-rte-content ul ul ul ul{list-style-type:disc}et-rich-text-editor .et-rte-content ol{list-style-type:decimal}et-rich-text-editor .et-rte-content ol ol,et-rich-text-editor .et-rte-content ol ol ol ol ol{list-style-type:lower-alpha}et-rich-text-editor .et-rte-content ol ol ol,et-rich-text-editor .et-rte-content ol ol ol ol ol ol{list-style-type:lower-roman}et-rich-text-editor .et-rte-content ol ol ol ol{list-style-type:decimal}et-rich-text-editor .et-rte-content li{margin-block:0}et-rich-text-editor .et-rte-content li::marker{color:color-mix(in srgb,currentColor 60%,transparent)}et-rich-text-editor .et-rte-content a{color:var(--et-theme-color-primary-solid, currentColor);text-decoration:underline}et-rich-text-editor .et-rte-content code{padding:.1em .3em;border-radius:4px;background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 14%,transparent);font-family:var(--et-font-family-mono, ui-monospace, monospace);font-size:.9em}et-rich-text-editor .et-rte-content blockquote{margin-inline:0;margin-block-end:0;padding-inline-start:var(--et-rich-text-editor-quote-indent);border-inline-start:var(--et-rich-text-editor-quote-bar-width) solid color-mix(in srgb,var(--et-surface-border-solid, currentColor) 80%,transparent);color:color-mix(in srgb,currentColor 82%,transparent)}et-rich-text-editor .et-rte-content blockquote blockquote{margin-block-start:var(--et-rich-text-editor-content-gap)}et-rich-text-editor .et-rte-content pre{margin-block-end:0;padding:8px 10px;border-radius:var(--et-rich-text-editor-code-block-radius);background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 10%,transparent);font-family:var(--et-font-family-mono, ui-monospace, monospace);font-size:.9em;white-space:pre-wrap}et-rich-text-editor .et-rte-content pre code{padding:0;border-radius:0;background:none;font-size:inherit}et-rich-text-editor .et-rte-content .et-rte-token{--_et-rte-token-accent: var(--et-theme-color-primary-solid, var(--et-surface-interaction-solid, currentColor));display:inline;padding-inline:var(--et-rich-text-editor-token-padding-inline);border-radius:var(--et-rich-text-editor-token-radius);background:color-mix(in srgb,var(--_et-rte-token-accent) 22%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--_et-rte-token-accent) 45%,transparent);color:var(--et-theme-color-ink-solid, inherit);font-weight:500;white-space:nowrap;-webkit-user-select:all;user-select:all;cursor:default}et-rich-text-editor .et-rte-content .et-rte-token-prefix{margin-inline-end:1px;opacity:.65}}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { editable: [{ type: i0.ViewChild, args: ['editable', { isSignal: true }] }], toolbar: [{ type: i0.ViewChild, args: ['toolbar', { isSignal: true }] }] } });
+                    }, template: "<div [attr.aria-label]=\"labels().toolbar\" class=\"et-rte-toolbar\" etToolbar>\n  @for (tool of dir.resolvedTools(); track $index) {\n    @switch (tool) {\n      @case (TOOLS.DIVIDER) {\n        <et-divider orientation=\"vertical\" decorative />\n      }\n      @default {\n        @if (dir.toolDefs.get(tool); as def) {\n          @if (def.control; as control) {\n            <ng-container [ngComponentOutlet]=\"control\" [ngComponentOutletInputs]=\"{ editor: dir }\" />\n          } @else {\n            <button\n              [pressed]=\"def.isActive?.(dir) ?? false\"\n              [disabled]=\"dir.disabled() || dir.readonly() || (def.isDisabled?.(dir) ?? false)\"\n              [attr.aria-label]=\"toolLabel(def)\"\n              (mousedown)=\"$event.preventDefault()\"\n              (click)=\"def.run?.(dir)\"\n              mutedUntilPressed\n              et-icon-button\n              size=\"sm\"\n              type=\"button\"\n            >\n              <i [allowHardcodedColor]=\"def.allowHardcodedColor ?? false\" [etIcon]=\"def.icon ?? ''\"></i>\n            </button>\n          }\n        }\n      }\n    }\n  }\n</div>\n\n<div\n  #editable\n  [attr.contenteditable]=\"dir.disabled() || dir.readonly() ? 'false' : 'true'\"\n  [attr.tabindex]=\"dir.disabled() ? -1 : 0\"\n  [attr.data-placeholder]=\"dir.placeholder() || null\"\n  [attr.aria-invalid]=\"dir.shouldDisplayError() || null\"\n  [attr.aria-describedby]=\"dir.describedBy() || null\"\n  [attr.aria-labelledby]=\"dir.labelId() || null\"\n  [attr.aria-disabled]=\"dir.disabled() || null\"\n  [attr.aria-readonly]=\"dir.readonly() || null\"\n  (input)=\"syncValueFromDom()\"\n  (beforeinput)=\"interceptFormattingCommand($event)\"\n  (keydown)=\"interceptEditorKeydown($event)\"\n  (paste)=\"interceptPaste($event)\"\n  (drop)=\"interceptDrop($event)\"\n  (click)=\"interceptClick($event)\"\n  (pointerdown)=\"dir.clearPendingMarks()\"\n  (focus)=\"dir.focused.set(true)\"\n  (blur)=\"dir.focused.set(false); dir.touched.set(true)\"\n  class=\"et-rte-content\"\n  role=\"textbox\"\n  aria-multiline=\"true\"\n></div>\n", styles: ["@layer components{@property --et-rich-text-editor-toolbar-gap{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-rich-text-editor-toolbar-padding{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-rich-text-editor-button-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-rich-text-editor-min-height{syntax: \"<length>\"; inherits: true; initial-value: 96px;}@property --et-rich-text-editor-content-gap{syntax: \"<length>\"; inherits: true; initial-value: 8px;}@property --et-rich-text-editor-quote-indent{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-rich-text-editor-quote-bar-width{syntax: \"<length>\"; inherits: true; initial-value: 2px;}@property --et-rich-text-editor-code-block-radius{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-rich-text-editor-token-radius{syntax: \"<length>\"; inherits: true; initial-value: 4px;}@property --et-rich-text-editor-token-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 4px;}et-rich-text-editor{display:flex;flex:1;flex-direction:column;min-inline-size:0;color:inherit}et-rich-text-editor .et-rte-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--et-rich-text-editor-toolbar-gap);padding:var(--et-rich-text-editor-toolbar-padding);padding-inline:calc(var(--et-form-field-control-padding-inline) - var(--et-rich-text-editor-toolbar-padding));border-block-end:var(--et-form-field-control-border-width, 1px) solid color-mix(in srgb,currentColor 12%,transparent);--et-icon-button-border-radius: var(--et-rich-text-editor-button-radius)}et-rich-text-editor .et-rte-toolbar .et-icon-button{--_et-focus-ring-offset: -1px}et-rich-text-editor.et-rich-text-editor--touch .et-rte-toolbar{position:fixed;inset-inline:0;inset-block-end:0;z-index:60;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;padding-inline:8px;padding-block-start:6px;padding-block-end:calc(6px + max(var(--_et-rte-keyboard-inset, 0px),env(keyboard-inset-height,0px)));background:var(--et-surface-background-solid, var(--et-surface-2, rgb(24 24 24)));border-block-end:none;border-block-start:var(--et-form-field-control-border-width, 1px) solid color-mix(in srgb,currentColor 12%,transparent);box-shadow:0 -6px 20px #0000003d;scrollbar-width:none;opacity:0;transform:translateY(100%);pointer-events:none;transition:opacity .16s var(--ease-out-5, ease),transform .26s var(--ease-out-5, ease)}et-rich-text-editor.et-rich-text-editor--touch .et-rte-toolbar::-webkit-scrollbar{display:none}et-rich-text-editor.et-rich-text-editor--touch.et-rich-text-editor--docked-toolbar .et-rte-toolbar{opacity:1;transform:translateY(0);pointer-events:auto}et-rich-text-editor.et-rich-text-editor--touch .et-rte-content{font-size:max(1em,16px)}@media(prefers-reduced-motion:reduce){et-rich-text-editor.et-rich-text-editor--touch .et-rte-toolbar{transition:opacity .16s var(--ease-out-5, ease)}}et-rich-text-editor .et-rte-toolbar .et-divider{--et-divider-color: color-mix(in srgb, currentColor 12%, transparent);--et-divider-spacing: 2px;--et-divider-inset: 4px}et-rich-text-editor .et-rte-content{--et-theme-color-primary-rgb: var(--et-color-primary);--et-theme-color-primary-solid: rgb(var(--et-theme-color-primary-rgb));--et-theme-color-ink-rgb: var(--et-color-primary-ink, var(--et-color-primary));--et-theme-color-ink-solid: rgb(var(--et-theme-color-ink-rgb));display:block;flex:1;min-inline-size:0;padding-block:var(--et-form-field-control-padding-block);padding-inline:var(--et-form-field-control-padding-inline);min-block-size:var(--et-rich-text-editor-min-height);outline:none;color:inherit;caret-color:var(--et-theme-color-primary-solid, currentColor);overflow-wrap:anywhere}et-rich-text-editor .et-rte-content:empty:before{content:attr(data-placeholder);color:color-mix(in srgb,currentColor 46%,transparent);pointer-events:none}et-rich-text-editor .et-rte-content>:first-child{margin-block-start:0}et-rich-text-editor .et-rte-content>:last-child{margin-block-end:0}et-rich-text-editor .et-rte-content p{margin-block:0}et-rich-text-editor .et-rte-content p+p,et-rich-text-editor .et-rte-content ul,et-rich-text-editor .et-rte-content ol,et-rich-text-editor .et-rte-content blockquote,et-rich-text-editor .et-rte-content pre{margin-block-start:var(--et-rich-text-editor-content-gap)}et-rich-text-editor .et-rte-content h1,et-rich-text-editor .et-rte-content h2,et-rich-text-editor .et-rte-content h3,et-rich-text-editor .et-rte-content h4,et-rich-text-editor .et-rte-content h5,et-rich-text-editor .et-rte-content h6{margin-block:0;font-weight:700;line-height:1.25}et-rich-text-editor .et-rte-content :is(h1,h2,h3,h4,h5,h6)+*,et-rich-text-editor .et-rte-content *+:is(h1,h2,h3,h4,h5,h6){margin-block-start:var(--et-rich-text-editor-content-gap)}et-rich-text-editor .et-rte-content h1{font-size:2.4rem}et-rich-text-editor .et-rte-content h2{font-size:2rem}et-rich-text-editor .et-rte-content h3{font-size:1.6rem}et-rich-text-editor .et-rte-content ul,et-rich-text-editor .et-rte-content ol{margin-block-end:0;padding-inline-start:1.5em;list-style-position:outside}et-rich-text-editor .et-rte-content ul{list-style-type:disc}et-rich-text-editor .et-rte-content ul ul,et-rich-text-editor .et-rte-content ul ul ul ul ul{list-style-type:circle}et-rich-text-editor .et-rte-content ul ul ul,et-rich-text-editor .et-rte-content ul ul ul ul ul ul{list-style-type:square}et-rich-text-editor .et-rte-content ul ul ul ul{list-style-type:disc}et-rich-text-editor .et-rte-content ol{list-style-type:decimal}et-rich-text-editor .et-rte-content ol ol,et-rich-text-editor .et-rte-content ol ol ol ol ol{list-style-type:lower-alpha}et-rich-text-editor .et-rte-content ol ol ol,et-rich-text-editor .et-rte-content ol ol ol ol ol ol{list-style-type:lower-roman}et-rich-text-editor .et-rte-content ol ol ol ol{list-style-type:decimal}et-rich-text-editor .et-rte-content li{margin-block:0}et-rich-text-editor .et-rte-content li::marker{color:color-mix(in srgb,currentColor 60%,transparent)}et-rich-text-editor .et-rte-content a{color:var(--et-theme-color-primary-solid, currentColor);text-decoration:underline}et-rich-text-editor .et-rte-content code{padding:.1em .3em;border-radius:4px;background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 14%,transparent);font-family:var(--et-font-family-mono, ui-monospace, monospace);font-size:.9em}et-rich-text-editor .et-rte-content blockquote{margin-inline:0;margin-block-end:0;padding-inline-start:var(--et-rich-text-editor-quote-indent);border-inline-start:var(--et-rich-text-editor-quote-bar-width) solid color-mix(in srgb,var(--et-surface-border-solid, currentColor) 80%,transparent);color:color-mix(in srgb,currentColor 82%,transparent)}et-rich-text-editor .et-rte-content blockquote blockquote{margin-block-start:var(--et-rich-text-editor-content-gap)}et-rich-text-editor .et-rte-content pre{margin-block-end:0;padding:8px 10px;border-radius:var(--et-rich-text-editor-code-block-radius);background:color-mix(in srgb,var(--et-surface-interaction-solid, currentColor) 10%,transparent);font-family:var(--et-font-family-mono, ui-monospace, monospace);font-size:.9em;white-space:pre-wrap}et-rich-text-editor .et-rte-content pre code{padding:0;border-radius:0;background:none;font-size:inherit}et-rich-text-editor .et-rte-content .et-rte-token{--_et-rte-token-accent: var(--et-theme-color-primary-solid, var(--et-surface-interaction-solid, currentColor));display:inline;padding-inline:var(--et-rich-text-editor-token-padding-inline);border-radius:var(--et-rich-text-editor-token-radius);background:color-mix(in srgb,var(--_et-rte-token-accent) 22%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--_et-rte-token-accent) 45%,transparent);color:var(--et-theme-color-ink-solid, inherit);font-weight:500;white-space:nowrap;-webkit-user-select:all;user-select:all;cursor:default}et-rich-text-editor .et-rte-content .et-rte-token-prefix{margin-inline-end:1px;opacity:.65}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { editable: [{ type: i0.ViewChild, args: ['editable', { isSignal: true }] }] } });
 
 const RICH_TEXT_EDITOR_IMPORTS = [RichTextEditorComponent, RichTextEditorDirective];
 
@@ -38377,13 +38539,10 @@ class SelectDirective {
                             ...(this.mirrorPanelWidth() ? [] : ['et-overlay--select-content-width']),
                         ],
                         placement: 'bottom-start',
-                        // prefer flipping the alignment on the same side (right-align under the field) before
-                        // flipping up, so a field near the right viewport edge opens bottom-end, not shifted
-                        fallbackPlacements: ['bottom-end', 'top-start', 'top-end'],
                         offset: 4,
                         viewportPadding: 8,
                         autoResize: true,
-                        shift: { crossAxis: true },
+                        minAvailableSpace: 160,
                         mirrorWidth: this.mirrorPanelWidth(),
                     }),
                 };
@@ -40543,7 +40702,7 @@ class SelectPanelComponent {
         <ng-content select="[etSelectPanelExtras]" />
       </div>
     </div>
-  `, 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{transition:opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--select.et-animation-leave-active{transition:opacity .1s ease}.et-overlay--select[data-overlay-placement].et-animation-enter-from,.et-overlay--select[data-overlay-placement].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0)!important}}.et-select-panel{display:grid;grid-template-rows:minmax(0,1fr);box-sizing:border-box;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}.et-overlay--select-content-width .et-select-panel{max-inline-size:min(400px,calc(100vw - 24px))}}\n"], dependencies: [{ kind: "directive", type: SelectListboxDirective, selector: "[etSelectListbox]", exportAs: ["etSelectListbox"] }, { kind: "directive", type: SelectViewportDirective, selector: "[etSelectViewport]", exportAs: ["etSelectViewport"] }], encapsulation: i0.ViewEncapsulation.None }); }
+  `, 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{transition:opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--select.et-animation-leave-active{transition:opacity .1s ease}.et-overlay--select[data-overlay-placement].et-animation-enter-from,.et-overlay--select[data-overlay-placement].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0)!important}}.et-select-panel{display:grid;grid-template-rows:minmax(0,1fr);box-sizing:border-box;max-block-size:min(var(--et-select-panel-max-height),var(--et-overlay-max-height, 100vh));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}.et-overlay--select-content-width .et-select-panel{max-inline-size:min(400px,calc(100vw - 24px))}}\n"], dependencies: [{ kind: "directive", type: SelectListboxDirective, selector: "[etSelectListbox]", exportAs: ["etSelectListbox"] }, { kind: "directive", type: SelectViewportDirective, selector: "[etSelectViewport]", exportAs: ["etSelectViewport"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SelectPanelComponent, decorators: [{
             type: Component,
@@ -40558,7 +40717,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
     </div>
   `, encapsulation: ViewEncapsulation.None, imports: [SelectListboxDirective, SelectViewportDirective], hostDirectives: [ProvideColorDirective, AutoSurfaceDirective], host: {
                         class: 'et-select-panel',
-                    }, 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{transition:opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--select.et-animation-leave-active{transition:opacity .1s ease}.et-overlay--select[data-overlay-placement].et-animation-enter-from,.et-overlay--select[data-overlay-placement].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0)!important}}.et-select-panel{display:grid;grid-template-rows:minmax(0,1fr);box-sizing:border-box;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}.et-overlay--select-content-width .et-select-panel{max-inline-size:min(400px,calc(100vw - 24px))}}\n"] }]
+                    }, 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{transition:opacity .14s ease}.et-overlay.et-with-default-animation.et-overlay--select.et-animation-leave-active{transition:opacity .1s ease}.et-overlay--select[data-overlay-placement].et-animation-enter-from,.et-overlay--select[data-overlay-placement].et-animation-leave-to{transform:translate3d(var(--et-overlay-anchored-x, 0px),var(--et-overlay-anchored-y, 0px),0)!important}}.et-select-panel{display:grid;grid-template-rows:minmax(0,1fr);box-sizing:border-box;max-block-size:min(var(--et-select-panel-max-height),var(--et-overlay-max-height, 100vh));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}.et-overlay--select-content-width .et-select-panel{max-inline-size:min(400px,calc(100vw - 24px))}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { panelBody: [{ type: i0.ViewChild, args: ['panelBody', { isSignal: true }] }] } });
 
 /**
@@ -49019,17 +49178,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
             args: [{ selector: 'et-query-devtools-faults-tab', encapsulation: ViewEncapsulation.None, template: "<div class=\"et-query-devtools-scroll\">\n  <div class=\"et-query-devtools-toolbar\">\n    <p class=\"et-query-devtools-hint\">\n      Faults are injected into the request pipeline, so retries, error handling features and the cache see them exactly\n      as they would see a real one. Unlike the rest of the panel, what you arm here is not persisted - a page reload\n      disarms every client.\n    </p>\n  </div>\n\n  @for (client of host.faultClients(); track client.name) {\n    @let fault = client.fault;\n    <div [class.et-query-devtools-card--armed]=\"client.armed\" class=\"et-query-devtools-card\">\n      <div class=\"et-query-devtools-card-head\">\n        <strong class=\"et-query-devtools-mono\">{{ client.name }}</strong>\n        <span class=\"et-query-devtools-url\">{{ client.baseUrl }}</span>\n        @if (client.armed) {\n          <span class=\"et-query-devtools-chip et-query-devtools-chip--error\">armed</span>\n          <button (click)=\"CLEAR_FAULTS(client.name)\" class=\"et-query-devtools-btn\" type=\"button\">Disarm</button>\n        }\n      </div>\n\n      <div class=\"et-query-devtools-faults\">\n        <label class=\"et-query-devtools-field\">\n          <span>Latency</span>\n          <input\n            #latencyInput\n            [value]=\"fault.latencyMs\"\n            (change)=\"armFaultValue({ clientName: client.name, field: 'latencyMs', value: latencyInput.value })\"\n            class=\"et-query-devtools-input et-query-devtools-input--number\"\n            type=\"number\"\n            min=\"0\"\n            max=\"60000\"\n            step=\"100\"\n          />\n          <small>ms before every attempt starts</small>\n        </label>\n\n        <label class=\"et-query-devtools-field\">\n          <span>Fail next</span>\n          <input\n            #failNextInput\n            [value]=\"fault.failNext\"\n            (change)=\"armFaultValue({ clientName: client.name, field: 'failNext', value: failNextInput.value })\"\n            class=\"et-query-devtools-input et-query-devtools-input--number\"\n            type=\"number\"\n            min=\"0\"\n            max=\"99\"\n            step=\"1\"\n          />\n          <small>attempts, counted down as they are spent</small>\n        </label>\n\n        <label class=\"et-query-devtools-field\">\n          <span>Fail rate</span>\n          <input\n            #failRateInput\n            [value]=\"fault.failRate\"\n            (change)=\"armFaultValue({ clientName: client.name, field: 'failRate', value: failRateInput.value })\"\n            class=\"et-query-devtools-input et-query-devtools-input--number\"\n            type=\"number\"\n            min=\"0\"\n            max=\"100\"\n            step=\"5\"\n          />\n          <small>% of attempts, rolled per attempt</small>\n        </label>\n\n        <label class=\"et-query-devtools-field\">\n          <span>Status</span>\n          <select\n            #statusSelect\n            (change)=\"armFaultStatus({ clientName: client.name, value: statusSelect.value })\"\n            class=\"et-query-devtools-select\"\n          >\n            @for (option of FAULT_STATUSES; track option.status) {\n              <!-- `selected` on the option, not `value` on the select: the select's value is\n                   applied before its options exist, so it would fall back to the first one. -->\n              <option [value]=\"option.status\" [selected]=\"option.status === fault.status\">\n                {{ option.status }} \u00B7 {{ option.label }}\n              </option>\n            }\n          </select>\n          <small>\n            @if (isFaultStatusRetryable(fault.status)) {\n              the default retry policy retries this\n            } @else {\n              the default retry policy gives up on this\n            }\n          </small>\n        </label>\n      </div>\n    </div>\n  } @empty {\n    <p class=\"et-query-devtools-empty\">No query clients registered yet.</p>\n  }\n</div>\n" }]
         }] });
 
-/** The Forms tab: registered `createQueryForm()` handles, each expandable to its field table. */
+/** The Forms tab: registered `defineQueryForm()` handles, each expandable to its field table. */
 class QueryDevtoolsFormsTabComponent {
     constructor() {
         this.host = injectQueryDevtoolsHost();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: QueryDevtoolsFormsTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: QueryDevtoolsFormsTabComponent, isStandalone: true, selector: "et-query-devtools-forms-tab", ngImport: i0, template: "<div #panes class=\"et-query-devtools-split\">\n  <div class=\"et-query-devtools-scroll\">\n    @for (entry of host.formEntries(); track entry.id) {\n      @let form = host.asForm(entry);\n      @let expanded = host.selectedFormId() === entry.id;\n      <div class=\"et-query-devtools-card\">\n        <div class=\"et-query-devtools-card-head\">\n          <button\n            [attr.aria-expanded]=\"expanded\"\n            (click)=\"host.selectedFormId.set(expanded ? null : entry.id)\"\n            class=\"et-query-devtools-row-link\"\n            type=\"button\"\n          >\n            <span class=\"et-query-devtools-caret\">{{ expanded ? '\u25BE' : '\u25B8' }}</span>\n            <strong>{{ entry.meta.name || 'query form' }}</strong>\n          </button>\n          @if (form.activeFilterCount(); as count) {\n            <span class=\"et-query-devtools-chip\">{{ count }} active</span>\n          } @else {\n            <span class=\"et-query-devtools-chip et-query-devtools-chip--muted\">at defaults</span>\n          }\n          @if (form.isCommitPending()) {\n            <span class=\"et-query-devtools-chip et-query-devtools-chip--loading\">debouncing</span>\n          }\n          @if (!form.isObserving()) {\n            <span\n              class=\"et-query-devtools-chip et-query-devtools-chip--muted\"\n              title=\"observe() has not been called, so nothing syncs with the URL\"\n            >\n              not observing\n            </span>\n          }\n          <button\n            [disabled]=\"form.isAtDefaults()\"\n            (click)=\"form.resetAll()\"\n            class=\"et-query-devtools-btn\"\n            type=\"button\"\n          >\n            \u27F2 Reset all\n          </button>\n        </div>\n\n        @let driven = host.queriesDrivenByForm(entry);\n        <dl class=\"et-query-devtools-meta\">\n          <dt>Drives</dt>\n          <dd>\n            @if (driven.length) {\n              <div class=\"et-query-devtools-inner-queries\">\n                @for (link of driven; track link.id) {\n                  <button\n                    [class.et-query-devtools-inner-row--active]=\"host.formSelectedQueryId() === link.id\"\n                    [disabled]=\"!link.id\"\n                    (click)=\"host.formSelectedQueryId.set(link.id)\"\n                    class=\"et-query-devtools-inner-row\"\n                    type=\"button\"\n                  >\n                    <span [attr.data-status]=\"host.queryStatus(link.query)\" class=\"et-query-devtools-status\"></span>\n                    <span class=\"et-query-devtools-method\">{{ link.method }}</span>\n                    <span class=\"et-query-devtools-route\">\n                      <et-query-devtools-route [segments]=\"link.segments\" [fallback]=\"link.query.id() || 'query'\" />\n                    </span>\n                  </button>\n                }\n              </div>\n            } @else {\n              <span class=\"et-query-devtools-hint\">\n                No query has read this form's value yet. A query picks it up the first time its\n                <code>withArgs</code> reads <code>value()</code>.\n              </span>\n            }\n          </dd>\n        </dl>\n\n        @if (expanded) {\n          <table class=\"et-query-devtools-table\">\n            <thead>\n              <tr>\n                <th>Field</th>\n                <th>Value</th>\n                <th>Default</th>\n                <th>URL param</th>\n                <th>Rules</th>\n                <th></th>\n              </tr>\n            </thead>\n            <tbody>\n              @for (field of form.fields(); track field.key) {\n                <tr [attr.data-status]=\"field.isDefault ? null : 'success'\">\n                  <td class=\"et-query-devtools-mono\">{{ field.key }}</td>\n                  <td class=\"et-query-devtools-mono\">\n                    {{ host.inlineValue(field.value) }}\n                    <!-- The live value only differs while a debounce is pending, which is exactly\n                       when \"the input says X but the query asked for Y\" needs explaining. -->\n                    @if (field.liveValue !== field.value) {\n                      <span class=\"et-query-devtools-stat-sub\">typing {{ host.inlineValue(field.liveValue) }}</span>\n                    }\n                  </td>\n                  <td class=\"et-query-devtools-mono\">{{ host.inlineValue(field.defaultValue) }}</td>\n                  <td class=\"et-query-devtools-mono\">\n                    @if (field.queryParam === undefined) {\n                      <span class=\"et-query-devtools-hint\">\u2014</span>\n                    } @else {\n                      {{ field.paramKey }}={{ host.inlineValue(field.queryParam) }}\n                    }\n                  </td>\n                  <td>\n                    <div class=\"et-query-devtools-chips\">\n                      @if (field.debounceMs !== null) {\n                        <span class=\"et-query-devtools-chip et-query-devtools-chip--muted\">\n                          {{ field.debounceMs }}ms\n                        </span>\n                      }\n                      @if (field.isResetBy.length) {\n                        <span\n                          class=\"et-query-devtools-chip et-query-devtools-chip--muted\"\n                          title=\"Reset to its default whenever one of these changes\"\n                        >\n                          reset by {{ field.isResetBy.join(', ') }}\n                        </span>\n                      }\n                      @if (!field.countsAsFilter) {\n                        <span\n                          class=\"et-query-devtools-chip et-query-devtools-chip--muted\"\n                          title=\"Not counted by activeFilterCount\"\n                        >\n                          not a filter\n                        </span>\n                      }\n                    </div>\n                  </td>\n                  <td>\n                    <button\n                      [disabled]=\"field.isDefault\"\n                      (click)=\"form.resetField(field.key)\"\n                      class=\"et-query-devtools-btn\"\n                      type=\"button\"\n                    >\n                      \u27F2\n                    </button>\n                  </td>\n                </tr>\n              }\n            </tbody>\n          </table>\n\n          <h4 class=\"et-query-devtools-section\">Committed value</h4>\n          <et-query-devtools-json [value]=\"form.value()\" />\n        }\n      </div>\n    } @empty {\n      <p class=\"et-query-devtools-empty\">\n        No query forms registered. A form created with <code>createQueryForm()</code> registers itself.\n      </p>\n    }\n  </div>\n\n  <et-query-devtools-drawer\n    [sel]=\"host.formSelectedQuery()\"\n    [container]=\"panes\"\n    (dismiss)=\"host.formSelectedQueryId.set(null)\"\n  />\n</div>\n", dependencies: [{ kind: "component", type: QueryDevtoolsDrawerComponent, selector: "et-query-devtools-drawer", inputs: ["sel", "container"], outputs: ["dismiss"] }, { kind: "component", type: QueryDevtoolsJsonComponent, selector: "et-query-devtools-json", inputs: ["value", "nodeKey", "depth", "search", "chunk", "path", "expandedPaths", "collapsedPaths", "toggleFn", "jsonPath", "parentKind", "overrides"] }, { kind: "component", type: QueryDevtoolsRouteComponent, selector: "et-query-devtools-route", inputs: ["segments", "fallback"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: QueryDevtoolsFormsTabComponent, isStandalone: true, selector: "et-query-devtools-forms-tab", ngImport: i0, template: "<div #panes class=\"et-query-devtools-split\">\n  <div class=\"et-query-devtools-scroll\">\n    @for (entry of host.formEntries(); track entry.id) {\n      @let form = host.asForm(entry);\n      @let expanded = host.selectedFormId() === entry.id;\n      <div class=\"et-query-devtools-card\">\n        <div class=\"et-query-devtools-card-head\">\n          <button\n            [attr.aria-expanded]=\"expanded\"\n            (click)=\"host.selectedFormId.set(expanded ? null : entry.id)\"\n            class=\"et-query-devtools-row-link\"\n            type=\"button\"\n          >\n            <span class=\"et-query-devtools-caret\">{{ expanded ? '\u25BE' : '\u25B8' }}</span>\n            <strong>{{ entry.meta.name || 'query form' }}</strong>\n          </button>\n          @if (form.activeFilterCount(); as count) {\n            <span class=\"et-query-devtools-chip\">{{ count }} active</span>\n          } @else {\n            <span class=\"et-query-devtools-chip et-query-devtools-chip--muted\">at defaults</span>\n          }\n          @if (form.isCommitPending()) {\n            <span class=\"et-query-devtools-chip et-query-devtools-chip--loading\">debouncing</span>\n          }\n          @if (!form.isObserving()) {\n            <span\n              class=\"et-query-devtools-chip et-query-devtools-chip--muted\"\n              title=\"observe() has not been called, so nothing syncs with the URL\"\n            >\n              not observing\n            </span>\n          }\n          <button\n            [disabled]=\"form.isAtDefaults()\"\n            (click)=\"form.resetAll()\"\n            class=\"et-query-devtools-btn\"\n            type=\"button\"\n          >\n            \u27F2 Reset all\n          </button>\n        </div>\n\n        @let driven = host.queriesDrivenByForm(entry);\n        <dl class=\"et-query-devtools-meta\">\n          <dt>Drives</dt>\n          <dd>\n            @if (driven.length) {\n              <div class=\"et-query-devtools-inner-queries\">\n                @for (link of driven; track link.id) {\n                  <button\n                    [class.et-query-devtools-inner-row--active]=\"host.formSelectedQueryId() === link.id\"\n                    [disabled]=\"!link.id\"\n                    (click)=\"host.formSelectedQueryId.set(link.id)\"\n                    class=\"et-query-devtools-inner-row\"\n                    type=\"button\"\n                  >\n                    <span [attr.data-status]=\"host.queryStatus(link.query)\" class=\"et-query-devtools-status\"></span>\n                    <span class=\"et-query-devtools-method\">{{ link.method }}</span>\n                    <span class=\"et-query-devtools-route\">\n                      <et-query-devtools-route [segments]=\"link.segments\" [fallback]=\"link.query.id() || 'query'\" />\n                    </span>\n                  </button>\n                }\n              </div>\n            } @else {\n              <span class=\"et-query-devtools-hint\">\n                No query has read this form's value yet. A query picks it up the first time its\n                <code>withArgs</code> reads <code>value()</code>.\n              </span>\n            }\n          </dd>\n        </dl>\n\n        @if (expanded) {\n          <table class=\"et-query-devtools-table\">\n            <thead>\n              <tr>\n                <th>Field</th>\n                <th>Value</th>\n                <th>Default</th>\n                <th>URL param</th>\n                <th>Rules</th>\n                <th></th>\n              </tr>\n            </thead>\n            <tbody>\n              @for (field of form.fields(); track field.key) {\n                <tr [attr.data-status]=\"field.isDefault ? null : 'success'\">\n                  <td class=\"et-query-devtools-mono\">{{ field.key }}</td>\n                  <td class=\"et-query-devtools-mono\">\n                    {{ host.inlineValue(field.value) }}\n                    <!-- The live value only differs while a debounce is pending, which is exactly\n                       when \"the input says X but the query asked for Y\" needs explaining. -->\n                    @if (field.liveValue !== field.value) {\n                      <span class=\"et-query-devtools-stat-sub\">typing {{ host.inlineValue(field.liveValue) }}</span>\n                    }\n                  </td>\n                  <td class=\"et-query-devtools-mono\">{{ host.inlineValue(field.defaultValue) }}</td>\n                  <td class=\"et-query-devtools-mono\">\n                    @if (field.queryParam === undefined) {\n                      <span class=\"et-query-devtools-hint\">\u2014</span>\n                    } @else {\n                      {{ field.paramKey }}={{ host.inlineValue(field.queryParam) }}\n                    }\n                  </td>\n                  <td>\n                    <div class=\"et-query-devtools-chips\">\n                      @if (field.debounceMs !== null) {\n                        <span class=\"et-query-devtools-chip et-query-devtools-chip--muted\">\n                          {{ field.debounceMs }}ms\n                        </span>\n                      }\n                      @if (field.isResetBy.length) {\n                        <span\n                          class=\"et-query-devtools-chip et-query-devtools-chip--muted\"\n                          title=\"Reset to its default whenever one of these changes\"\n                        >\n                          reset by {{ field.isResetBy.join(', ') }}\n                        </span>\n                      }\n                      @if (!field.countsAsFilter) {\n                        <span\n                          class=\"et-query-devtools-chip et-query-devtools-chip--muted\"\n                          title=\"Not counted by activeFilterCount\"\n                        >\n                          not a filter\n                        </span>\n                      }\n                    </div>\n                  </td>\n                  <td>\n                    <button\n                      [disabled]=\"field.isDefault\"\n                      (click)=\"form.resetField(field.key)\"\n                      class=\"et-query-devtools-btn\"\n                      type=\"button\"\n                    >\n                      \u27F2\n                    </button>\n                  </td>\n                </tr>\n              }\n            </tbody>\n          </table>\n\n          <h4 class=\"et-query-devtools-section\">Committed value</h4>\n          <et-query-devtools-json [value]=\"form.value()\" />\n        }\n      </div>\n    } @empty {\n      <p class=\"et-query-devtools-empty\">\n        No query forms registered. A form created with <code>defineQueryForm()</code> registers itself.\n      </p>\n    }\n  </div>\n\n  <et-query-devtools-drawer\n    [sel]=\"host.formSelectedQuery()\"\n    [container]=\"panes\"\n    (dismiss)=\"host.formSelectedQueryId.set(null)\"\n  />\n</div>\n", dependencies: [{ kind: "component", type: QueryDevtoolsDrawerComponent, selector: "et-query-devtools-drawer", inputs: ["sel", "container"], outputs: ["dismiss"] }, { kind: "component", type: QueryDevtoolsJsonComponent, selector: "et-query-devtools-json", inputs: ["value", "nodeKey", "depth", "search", "chunk", "path", "expandedPaths", "collapsedPaths", "toggleFn", "jsonPath", "parentKind", "overrides"] }, { kind: "component", type: QueryDevtoolsRouteComponent, selector: "et-query-devtools-route", inputs: ["segments", "fallback"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: QueryDevtoolsFormsTabComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'et-query-devtools-forms-tab', encapsulation: ViewEncapsulation.None, imports: [QueryDevtoolsDrawerComponent, QueryDevtoolsJsonComponent, QueryDevtoolsRouteComponent], template: "<div #panes class=\"et-query-devtools-split\">\n  <div class=\"et-query-devtools-scroll\">\n    @for (entry of host.formEntries(); track entry.id) {\n      @let form = host.asForm(entry);\n      @let expanded = host.selectedFormId() === entry.id;\n      <div class=\"et-query-devtools-card\">\n        <div class=\"et-query-devtools-card-head\">\n          <button\n            [attr.aria-expanded]=\"expanded\"\n            (click)=\"host.selectedFormId.set(expanded ? null : entry.id)\"\n            class=\"et-query-devtools-row-link\"\n            type=\"button\"\n          >\n            <span class=\"et-query-devtools-caret\">{{ expanded ? '\u25BE' : '\u25B8' }}</span>\n            <strong>{{ entry.meta.name || 'query form' }}</strong>\n          </button>\n          @if (form.activeFilterCount(); as count) {\n            <span class=\"et-query-devtools-chip\">{{ count }} active</span>\n          } @else {\n            <span class=\"et-query-devtools-chip et-query-devtools-chip--muted\">at defaults</span>\n          }\n          @if (form.isCommitPending()) {\n            <span class=\"et-query-devtools-chip et-query-devtools-chip--loading\">debouncing</span>\n          }\n          @if (!form.isObserving()) {\n            <span\n              class=\"et-query-devtools-chip et-query-devtools-chip--muted\"\n              title=\"observe() has not been called, so nothing syncs with the URL\"\n            >\n              not observing\n            </span>\n          }\n          <button\n            [disabled]=\"form.isAtDefaults()\"\n            (click)=\"form.resetAll()\"\n            class=\"et-query-devtools-btn\"\n            type=\"button\"\n          >\n            \u27F2 Reset all\n          </button>\n        </div>\n\n        @let driven = host.queriesDrivenByForm(entry);\n        <dl class=\"et-query-devtools-meta\">\n          <dt>Drives</dt>\n          <dd>\n            @if (driven.length) {\n              <div class=\"et-query-devtools-inner-queries\">\n                @for (link of driven; track link.id) {\n                  <button\n                    [class.et-query-devtools-inner-row--active]=\"host.formSelectedQueryId() === link.id\"\n                    [disabled]=\"!link.id\"\n                    (click)=\"host.formSelectedQueryId.set(link.id)\"\n                    class=\"et-query-devtools-inner-row\"\n                    type=\"button\"\n                  >\n                    <span [attr.data-status]=\"host.queryStatus(link.query)\" class=\"et-query-devtools-status\"></span>\n                    <span class=\"et-query-devtools-method\">{{ link.method }}</span>\n                    <span class=\"et-query-devtools-route\">\n                      <et-query-devtools-route [segments]=\"link.segments\" [fallback]=\"link.query.id() || 'query'\" />\n                    </span>\n                  </button>\n                }\n              </div>\n            } @else {\n              <span class=\"et-query-devtools-hint\">\n                No query has read this form's value yet. A query picks it up the first time its\n                <code>withArgs</code> reads <code>value()</code>.\n              </span>\n            }\n          </dd>\n        </dl>\n\n        @if (expanded) {\n          <table class=\"et-query-devtools-table\">\n            <thead>\n              <tr>\n                <th>Field</th>\n                <th>Value</th>\n                <th>Default</th>\n                <th>URL param</th>\n                <th>Rules</th>\n                <th></th>\n              </tr>\n            </thead>\n            <tbody>\n              @for (field of form.fields(); track field.key) {\n                <tr [attr.data-status]=\"field.isDefault ? null : 'success'\">\n                  <td class=\"et-query-devtools-mono\">{{ field.key }}</td>\n                  <td class=\"et-query-devtools-mono\">\n                    {{ host.inlineValue(field.value) }}\n                    <!-- The live value only differs while a debounce is pending, which is exactly\n                       when \"the input says X but the query asked for Y\" needs explaining. -->\n                    @if (field.liveValue !== field.value) {\n                      <span class=\"et-query-devtools-stat-sub\">typing {{ host.inlineValue(field.liveValue) }}</span>\n                    }\n                  </td>\n                  <td class=\"et-query-devtools-mono\">{{ host.inlineValue(field.defaultValue) }}</td>\n                  <td class=\"et-query-devtools-mono\">\n                    @if (field.queryParam === undefined) {\n                      <span class=\"et-query-devtools-hint\">\u2014</span>\n                    } @else {\n                      {{ field.paramKey }}={{ host.inlineValue(field.queryParam) }}\n                    }\n                  </td>\n                  <td>\n                    <div class=\"et-query-devtools-chips\">\n                      @if (field.debounceMs !== null) {\n                        <span class=\"et-query-devtools-chip et-query-devtools-chip--muted\">\n                          {{ field.debounceMs }}ms\n                        </span>\n                      }\n                      @if (field.isResetBy.length) {\n                        <span\n                          class=\"et-query-devtools-chip et-query-devtools-chip--muted\"\n                          title=\"Reset to its default whenever one of these changes\"\n                        >\n                          reset by {{ field.isResetBy.join(', ') }}\n                        </span>\n                      }\n                      @if (!field.countsAsFilter) {\n                        <span\n                          class=\"et-query-devtools-chip et-query-devtools-chip--muted\"\n                          title=\"Not counted by activeFilterCount\"\n                        >\n                          not a filter\n                        </span>\n                      }\n                    </div>\n                  </td>\n                  <td>\n                    <button\n                      [disabled]=\"field.isDefault\"\n                      (click)=\"form.resetField(field.key)\"\n                      class=\"et-query-devtools-btn\"\n                      type=\"button\"\n                    >\n                      \u27F2\n                    </button>\n                  </td>\n                </tr>\n              }\n            </tbody>\n          </table>\n\n          <h4 class=\"et-query-devtools-section\">Committed value</h4>\n          <et-query-devtools-json [value]=\"form.value()\" />\n        }\n      </div>\n    } @empty {\n      <p class=\"et-query-devtools-empty\">\n        No query forms registered. A form created with <code>createQueryForm()</code> registers itself.\n      </p>\n    }\n  </div>\n\n  <et-query-devtools-drawer\n    [sel]=\"host.formSelectedQuery()\"\n    [container]=\"panes\"\n    (dismiss)=\"host.formSelectedQueryId.set(null)\"\n  />\n</div>\n" }]
+            args: [{ selector: 'et-query-devtools-forms-tab', encapsulation: ViewEncapsulation.None, imports: [QueryDevtoolsDrawerComponent, QueryDevtoolsJsonComponent, QueryDevtoolsRouteComponent], template: "<div #panes class=\"et-query-devtools-split\">\n  <div class=\"et-query-devtools-scroll\">\n    @for (entry of host.formEntries(); track entry.id) {\n      @let form = host.asForm(entry);\n      @let expanded = host.selectedFormId() === entry.id;\n      <div class=\"et-query-devtools-card\">\n        <div class=\"et-query-devtools-card-head\">\n          <button\n            [attr.aria-expanded]=\"expanded\"\n            (click)=\"host.selectedFormId.set(expanded ? null : entry.id)\"\n            class=\"et-query-devtools-row-link\"\n            type=\"button\"\n          >\n            <span class=\"et-query-devtools-caret\">{{ expanded ? '\u25BE' : '\u25B8' }}</span>\n            <strong>{{ entry.meta.name || 'query form' }}</strong>\n          </button>\n          @if (form.activeFilterCount(); as count) {\n            <span class=\"et-query-devtools-chip\">{{ count }} active</span>\n          } @else {\n            <span class=\"et-query-devtools-chip et-query-devtools-chip--muted\">at defaults</span>\n          }\n          @if (form.isCommitPending()) {\n            <span class=\"et-query-devtools-chip et-query-devtools-chip--loading\">debouncing</span>\n          }\n          @if (!form.isObserving()) {\n            <span\n              class=\"et-query-devtools-chip et-query-devtools-chip--muted\"\n              title=\"observe() has not been called, so nothing syncs with the URL\"\n            >\n              not observing\n            </span>\n          }\n          <button\n            [disabled]=\"form.isAtDefaults()\"\n            (click)=\"form.resetAll()\"\n            class=\"et-query-devtools-btn\"\n            type=\"button\"\n          >\n            \u27F2 Reset all\n          </button>\n        </div>\n\n        @let driven = host.queriesDrivenByForm(entry);\n        <dl class=\"et-query-devtools-meta\">\n          <dt>Drives</dt>\n          <dd>\n            @if (driven.length) {\n              <div class=\"et-query-devtools-inner-queries\">\n                @for (link of driven; track link.id) {\n                  <button\n                    [class.et-query-devtools-inner-row--active]=\"host.formSelectedQueryId() === link.id\"\n                    [disabled]=\"!link.id\"\n                    (click)=\"host.formSelectedQueryId.set(link.id)\"\n                    class=\"et-query-devtools-inner-row\"\n                    type=\"button\"\n                  >\n                    <span [attr.data-status]=\"host.queryStatus(link.query)\" class=\"et-query-devtools-status\"></span>\n                    <span class=\"et-query-devtools-method\">{{ link.method }}</span>\n                    <span class=\"et-query-devtools-route\">\n                      <et-query-devtools-route [segments]=\"link.segments\" [fallback]=\"link.query.id() || 'query'\" />\n                    </span>\n                  </button>\n                }\n              </div>\n            } @else {\n              <span class=\"et-query-devtools-hint\">\n                No query has read this form's value yet. A query picks it up the first time its\n                <code>withArgs</code> reads <code>value()</code>.\n              </span>\n            }\n          </dd>\n        </dl>\n\n        @if (expanded) {\n          <table class=\"et-query-devtools-table\">\n            <thead>\n              <tr>\n                <th>Field</th>\n                <th>Value</th>\n                <th>Default</th>\n                <th>URL param</th>\n                <th>Rules</th>\n                <th></th>\n              </tr>\n            </thead>\n            <tbody>\n              @for (field of form.fields(); track field.key) {\n                <tr [attr.data-status]=\"field.isDefault ? null : 'success'\">\n                  <td class=\"et-query-devtools-mono\">{{ field.key }}</td>\n                  <td class=\"et-query-devtools-mono\">\n                    {{ host.inlineValue(field.value) }}\n                    <!-- The live value only differs while a debounce is pending, which is exactly\n                       when \"the input says X but the query asked for Y\" needs explaining. -->\n                    @if (field.liveValue !== field.value) {\n                      <span class=\"et-query-devtools-stat-sub\">typing {{ host.inlineValue(field.liveValue) }}</span>\n                    }\n                  </td>\n                  <td class=\"et-query-devtools-mono\">{{ host.inlineValue(field.defaultValue) }}</td>\n                  <td class=\"et-query-devtools-mono\">\n                    @if (field.queryParam === undefined) {\n                      <span class=\"et-query-devtools-hint\">\u2014</span>\n                    } @else {\n                      {{ field.paramKey }}={{ host.inlineValue(field.queryParam) }}\n                    }\n                  </td>\n                  <td>\n                    <div class=\"et-query-devtools-chips\">\n                      @if (field.debounceMs !== null) {\n                        <span class=\"et-query-devtools-chip et-query-devtools-chip--muted\">\n                          {{ field.debounceMs }}ms\n                        </span>\n                      }\n                      @if (field.isResetBy.length) {\n                        <span\n                          class=\"et-query-devtools-chip et-query-devtools-chip--muted\"\n                          title=\"Reset to its default whenever one of these changes\"\n                        >\n                          reset by {{ field.isResetBy.join(', ') }}\n                        </span>\n                      }\n                      @if (!field.countsAsFilter) {\n                        <span\n                          class=\"et-query-devtools-chip et-query-devtools-chip--muted\"\n                          title=\"Not counted by activeFilterCount\"\n                        >\n                          not a filter\n                        </span>\n                      }\n                    </div>\n                  </td>\n                  <td>\n                    <button\n                      [disabled]=\"field.isDefault\"\n                      (click)=\"form.resetField(field.key)\"\n                      class=\"et-query-devtools-btn\"\n                      type=\"button\"\n                    >\n                      \u27F2\n                    </button>\n                  </td>\n                </tr>\n              }\n            </tbody>\n          </table>\n\n          <h4 class=\"et-query-devtools-section\">Committed value</h4>\n          <et-query-devtools-json [value]=\"form.value()\" />\n        }\n      </div>\n    } @empty {\n      <p class=\"et-query-devtools-empty\">\n        No query forms registered. A form created with <code>defineQueryForm()</code> registers itself.\n      </p>\n    }\n  </div>\n\n  <et-query-devtools-drawer\n    [sel]=\"host.formSelectedQuery()\"\n    [container]=\"panes\"\n    (dismiss)=\"host.formSelectedQueryId.set(null)\"\n  />\n</div>\n" }]
         }] });
 
 /* eslint-disable @typescript-eslint/naming-convention -- the `__export_*` keys are Insomnia's file format */
@@ -51776,6 +51935,8 @@ const SCHEDULER_ERROR_CODES = {
     FEATURE_OUTSIDE_SCHEDULER: 4500,
     /** A view layout directive (e.g. `[etSchedulerMonth]`) was placed outside an `[etScheduler]`. */
     VIEW_OUTSIDE_SCHEDULER: 4501,
+    /** An edit-surface feature (e.g. an edit field or appointment action) was used outside an `<et-scheduler-edit-surface>`. */
+    EDIT_SURFACE_FEATURE_OUTSIDE_SURFACE: 4502,
 };
 
 /** The built-in English labels. */
@@ -51789,6 +51950,21 @@ const DEFAULT_SCHEDULER_LABELS = {
     week: 'Week',
     day: 'Day',
     agenda: 'Agenda',
+    addAppointment: 'Add appointment',
+    untitledAppointment: 'Untitled appointment',
+    ancestors: 'Ancestor chain',
+    subAppointments: 'Sub-appointments',
+    moreActions: 'More actions',
+    save: 'Save',
+    cancel: 'Cancel',
+    addSubAppointment: 'Add sub-appointment',
+    deleteWithDescendants: 'Delete (with descendants)',
+    titleField: 'Title',
+    startField: 'Starts',
+    endField: 'Ends',
+    locationField: 'Location',
+    descriptionField: 'Description',
+    colorField: 'Color',
 };
 const SCHEDULER_LABELS_DEF = /* @__PURE__ */ defineLabels('SCHEDULER_LABELS', DEFAULT_SCHEDULER_LABELS);
 const provideSchedulerLabels = /* @__PURE__ */ toProvideFn(SCHEDULER_LABELS_DEF);
@@ -51825,6 +52001,21 @@ const buildAppointmentTree = (appointments) => {
 const flattenAppointmentTree = (nodes) => nodes.flatMap((node) => [node, ...flattenAppointmentTree(node.children)]);
 /** Every descendant a node has, at any depth - what the chain-count badge adornment shows. */
 const countDescendants = (node) => node.children.reduce((count, child) => count + 1 + countDescendants(child), 0);
+/** Finds the tree node for an appointment id, searching every chain at any depth. */
+const findAppointmentNode = (nodes, id) => {
+    for (const node of nodes) {
+        if (node.appointment.id === id) {
+            return node;
+        }
+        const found = findAppointmentNode(node.children, id);
+        if (found) {
+            return found;
+        }
+    }
+    return null;
+};
+/** Every descendant id a node has, at any depth - what "delete (with descendants)" removes in one pass. */
+const collectDescendantIds = (node) => node.children.flatMap((child) => [child.appointment.id, ...collectDescendantIds(child)]);
 
 /**
  * Headless scheduler state: the active view, the focused date, the visible date range each view
@@ -52001,6 +52192,114 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                 }]
         }], ctorParameters: () => [] });
 
+/**
+ * Headless edit-surface state: which appointment is open, the live draft every field reads and
+ * writes, and navigation across the sub-appointment chain (ancestors, children, "add
+ * sub-appointment") - all without any template structure. `<et-scheduler-edit-surface>` applies
+ * this via `hostDirectives` and renders the registered fields/actions on top (see
+ * `SCHEDULER_EDIT_SURFACE_HOST`).
+ */
+class SchedulerEditSurfaceDirective {
+    constructor() {
+        /** The appointment to open the surface for - a freshly-synthesized blank one (with `id` already assigned) for "add". */
+        this.appointment = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "appointment" }] : /* istanbul ignore next */ []));
+        /** Every appointment the scheduler knows about - for the ancestor breadcrumb, the children list, and chain-aware actions. */
+        this.appointments = input([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "appointments" }] : /* istanbul ignore next */ []));
+        /** Emits the draft when the surface commits an edit or a new sub-appointment. */
+        this.save = output();
+        /** Emits every id to remove - the current appointment plus, for "delete with descendants", its whole chain. */
+        this.deleteAppointments = output();
+        this.appointmentTree = computed(() => buildAppointmentTree(this.appointments()), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "appointmentTree" }] : /* istanbul ignore next */ []));
+        /** A synthesized appointment not yet in `appointments()` - set while "add sub-appointment" is in progress. */
+        this.pendingAppointment = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "pendingAppointment" }] : /* istanbul ignore next */ []));
+        /**
+         * Which appointment id the surface is currently showing. Starts at `appointment()`'s id;
+         * breadcrumb/children navigation and "add sub-appointment" move it without opening a new dialog.
+         */
+        this.currentAppointmentId = linkedSignal(() => this.appointment().id, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "currentAppointmentId" }] : /* istanbul ignore next */ []));
+        /** The pre-edit snapshot of whichever appointment is currently shown. */
+        this.currentAppointment = computed(() => this.pendingAppointment() ??
+            this.appointments().find((candidate) => candidate.id === this.currentAppointmentId()) ??
+            this.appointment(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "currentAppointment" }] : /* istanbul ignore next */ []));
+        /**
+         * The live draft every edit field reads and writes. Resets to `currentAppointment()` whenever
+         * the surface navigates - unsaved edits are discarded on navigation, the same "edit a copy"
+         * tradeoff the filter overlay makes.
+         */
+        this.draft = linkedSignal(() => this.currentAppointment(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "draft" }] : /* istanbul ignore next */ []));
+        /** `currentAppointment()`'s ancestor chain, root first - what the breadcrumb renders. */
+        this.ancestors = computed(() => {
+            const byId = new Map(this.appointments().map((candidate) => [candidate.id, candidate]));
+            const chain = [];
+            const seen = new Set();
+            let parentId = this.currentAppointment().parentId;
+            while (parentId !== null && !seen.has(parentId)) {
+                seen.add(parentId);
+                const parent = byId.get(parentId);
+                if (!parent) {
+                    break;
+                }
+                chain.unshift(parent);
+                parentId = parent.parentId;
+            }
+            return chain;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "ancestors" }] : /* istanbul ignore next */ []));
+        this.currentNode = computed(() => findAppointmentNode(this.appointmentTree(), this.currentAppointmentId()), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "currentNode" }] : /* istanbul ignore next */ []));
+        /** `currentAppointment()`'s direct children - what the children list renders, each navigable via `navigateTo`. */
+        this.children = computed(() => this.currentNode()?.children ?? [], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "children" }] : /* istanbul ignore next */ []));
+    }
+    /**
+     * Navigates to a different appointment already in `appointments()` - a breadcrumb ancestor or a
+     * child in the list. Discards any unsaved draft edits for the appointment navigated away from.
+     */
+    navigateTo(id) {
+        this.pendingAppointment.set(null);
+        this.currentAppointmentId.set(id);
+    }
+    /** Starts "add sub-appointment": synthesizes a blank child of `currentAppointment()` and navigates to it. */
+    startAddSubAppointment() {
+        const parent = this.currentAppointment();
+        const blank = {
+            id: randomId(),
+            parentId: parent.id,
+            title: '',
+            start: parent.start,
+            end: parent.end,
+        };
+        this.pendingAppointment.set(blank);
+        this.currentAppointmentId.set(blank.id);
+    }
+    /** Commits the current draft via `save` - the component closes the dialog on this. */
+    commit() {
+        this.save.emit(this.draft());
+    }
+    /** Emits `deleteAppointments` for the current appointment and every descendant - the component closes the dialog on this. */
+    requestDelete() {
+        const node = this.currentNode();
+        const ids = node ? [node.appointment.id, ...collectDescendantIds(node)] : [this.currentAppointment().id];
+        this.deleteAppointments.emit(ids);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditSurfaceDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: SchedulerEditSurfaceDirective, isStandalone: true, selector: "[etSchedulerEditSurface]", inputs: { appointment: { classPropertyName: "appointment", publicName: "appointment", isSignal: true, isRequired: true, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { save: "save", deleteAppointments: "deleteAppointments" }, exportAs: ["etSchedulerEditSurface"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditSurfaceDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[etSchedulerEditSurface]',
+                    exportAs: 'etSchedulerEditSurface',
+                }]
+        }], propDecorators: { appointment: [{ type: i0.Input, args: [{ isSignal: true, alias: "appointment", required: true }] }], appointments: [{ type: i0.Input, args: [{ isSignal: true, alias: "appointments", required: false }] }], save: [{ type: i0.Output, args: ["save"] }], deleteAppointments: [{ type: i0.Output, args: ["deleteAppointments"] }] } });
+
 const SCHEDULER_FEATURE_HOST = new InjectionToken('SCHEDULER_FEATURE_HOST');
 /**
  * Read a feature's config input. A feature directive is usually written bare
@@ -52019,6 +52318,18 @@ const injectSchedulerFeatureHost = (feature) => {
     }
     return host;
 };
+const SCHEDULER_EDIT_SURFACE_HOST = new InjectionToken('SCHEDULER_EDIT_SURFACE_HOST');
+/**
+ * Inject the host edit surface from inside a feature. Throws a labelled error when the feature was
+ * placed outside an `<et-scheduler-edit-surface>`, where it could only ever silently do nothing.
+ */
+const injectSchedulerEditSurfaceHost = (feature) => {
+    const host = inject(SCHEDULER_EDIT_SURFACE_HOST, { optional: true });
+    if (!host) {
+        throw new RuntimeError(SCHEDULER_ERROR_CODES.EDIT_SURFACE_FEATURE_OUTSIDE_SURFACE, `[${feature}] must be used inside an <et-scheduler-edit-surface>.`);
+    }
+    return host;
+};
 
 const appointmentCoversDay = (appointment, day) => appointment.start <= day.end && appointment.end >= day.start;
 /**
@@ -52224,6 +52535,22 @@ const buildSchedulerTimeGrid = (options) => {
     }));
     return { days: dayColumns, allDay, allDayRowCount: rowCount };
 };
+/**
+ * Which hour the time grid's scrollable body should open scrolled to, so day/week view never
+ * starts on an empty screen scrolled to midnight: the current hour (with an hour of lead-in) when
+ * today is one of the visible days, else the earliest timed appointment's hour (same lead-in),
+ * else a business-hours default.
+ */
+const computeInitialScrollHour = (grid, now) => {
+    if (grid.days.some((day) => day.today)) {
+        return Math.max(0, now.getHours() - 1);
+    }
+    const offsets = grid.days.flatMap((day) => day.blocks.map((block) => block.offset));
+    if (offsets.length === 0) {
+        return 8;
+    }
+    return Math.max(0, Math.floor((Math.min(...offsets) / 100) * 24) - 1);
+};
 
 /**
  * Lays the host `[etScheduler]`'s appointments onto an hour-axis time grid: one day column per day
@@ -52257,6 +52584,14 @@ class SchedulerTimeGridDirective {
         /** How many stacking rows {@link allDay} needs - sizes the all-day lane's reserved space. */
         this.allDayRowCount = computed(() => this.grid().allDayRowCount, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "allDayRowCount" }] : /* istanbul ignore next */ []));
+        /**
+         * Which hour the body's scrollable region should open scrolled to - the current hour when today
+         * is visible, else the earliest appointment's hour, else a business-hours default. See
+         * `SchedulerTimeGridViewComponent`, which reads this once on mount rather than reactively, so
+         * navigating days/weeks afterwards never yanks the user's own scroll position back.
+         */
+        this.initialScrollHour = computed(() => computeInitialScrollHour(this.grid(), new Date()), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "initialScrollHour" }] : /* istanbul ignore next */ []));
         if (ngDevMode) {
             afterNextRender(() => {
                 if (!this.scheduler) {
@@ -52276,6 +52611,114 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                 }]
         }], ctorParameters: () => [] });
 
+/**
+ * Built-in toolbar action: opens the default edit surface for a brand-new, blank top-level
+ * appointment - see `SchedulerFeatureHost.addAppointment`. One of the default pieces
+ * `<et-scheduler>` bundles - see `registerToolbarAction`. Depends on the default edit surface
+ * (it's what the dialog it opens is), so unlike `etSchedulerActionAddSubAppointment` it has no
+ * bare-`[etScheduler]` equivalent - a headless-only composition needs its own "new appointment"
+ * affordance.
+ *
+ * @example
+ * <et-scheduler [etSchedulerActionAddAppointment]="{ enabled: false }" … />
+ */
+class SchedulerActionAddAppointmentDirective {
+    constructor() {
+        this.host = injectSchedulerFeatureHost('etSchedulerActionAddAppointment');
+        this.labels = injectSchedulerLabels();
+        /** See {@link SchedulerActionAddAppointmentConfig}. */
+        this.config = input({}, { ...(ngDevMode ? { debugName: "config" } : /* istanbul ignore next */ {}), alias: 'etSchedulerActionAddAppointment',
+            transform: (schedulerFeatureConfig) });
+        this.host.registerToolbarAction({
+            label: computed(() => this.labels().addAppointment),
+            icon: 'et-plus',
+            order: 0,
+            enabled: computed(() => this.config().enabled ?? true),
+            run: () => this.host.addAppointment(),
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerActionAddAppointmentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: SchedulerActionAddAppointmentDirective, isStandalone: true, selector: "[etSchedulerActionAddAppointment]", inputs: { config: { classPropertyName: "config", publicName: "etSchedulerActionAddAppointment", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["etSchedulerActionAddAppointment"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerActionAddAppointmentDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[etSchedulerActionAddAppointment]',
+                    exportAs: 'etSchedulerActionAddAppointment',
+                }]
+        }], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "etSchedulerActionAddAppointment", required: false }] }] } });
+
+/**
+ * Built-in appointment action: starts adding a sub-appointment of the surface's current
+ * appointment - see `SchedulerEditSurfaceDirective.startAddSubAppointment`. One of the default
+ * pieces `<et-scheduler-edit-surface>` bundles - see `registerAppointmentAction`.
+ *
+ * @example
+ * <et-scheduler-edit-surface [etSchedulerActionAddSubAppointment]="{ enabled: false }" … />
+ */
+class SchedulerActionAddSubAppointmentDirective {
+    constructor() {
+        this.host = injectSchedulerEditSurfaceHost('etSchedulerActionAddSubAppointment');
+        this.surface = inject(SchedulerEditSurfaceDirective);
+        this.labels = injectSchedulerLabels();
+        /** See {@link SchedulerActionAddSubAppointmentConfig}. */
+        this.config = input({}, { ...(ngDevMode ? { debugName: "config" } : /* istanbul ignore next */ {}), alias: 'etSchedulerActionAddSubAppointment',
+            transform: (schedulerFeatureConfig) });
+        this.host.registerAppointmentAction({
+            label: computed(() => this.labels().addSubAppointment),
+            icon: 'et-plus',
+            order: 0,
+            enabled: computed(() => this.config().enabled ?? true),
+            run: () => this.surface.startAddSubAppointment(),
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerActionAddSubAppointmentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: SchedulerActionAddSubAppointmentDirective, isStandalone: true, selector: "[etSchedulerActionAddSubAppointment]", inputs: { config: { classPropertyName: "config", publicName: "etSchedulerActionAddSubAppointment", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["etSchedulerActionAddSubAppointment"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerActionAddSubAppointmentDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[etSchedulerActionAddSubAppointment]',
+                    exportAs: 'etSchedulerActionAddSubAppointment',
+                }]
+        }], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "etSchedulerActionAddSubAppointment", required: false }] }] } });
+
+/**
+ * Built-in appointment action: deletes the surface's current appointment together with every
+ * descendant - see `SchedulerEditSurfaceDirective.requestDelete`. One of the default pieces
+ * `<et-scheduler-edit-surface>` bundles - see `registerAppointmentAction`.
+ *
+ * @example
+ * <et-scheduler-edit-surface [etSchedulerActionDelete]="{ enabled: false }" … />
+ */
+class SchedulerActionDeleteDirective {
+    constructor() {
+        this.host = injectSchedulerEditSurfaceHost('etSchedulerActionDelete');
+        this.surface = inject(SchedulerEditSurfaceDirective);
+        this.labels = injectSchedulerLabels();
+        /** See {@link SchedulerActionDeleteConfig}. */
+        this.config = input({}, { ...(ngDevMode ? { debugName: "config" } : /* istanbul ignore next */ {}), alias: 'etSchedulerActionDelete',
+            transform: (schedulerFeatureConfig) });
+        this.host.registerAppointmentAction({
+            label: computed(() => this.labels().deleteWithDescendants),
+            icon: 'et-trash',
+            order: 100,
+            destructive: true,
+            enabled: computed(() => this.config().enabled ?? true),
+            run: () => this.surface.requestDelete(),
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerActionDeleteDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: SchedulerActionDeleteDirective, isStandalone: true, selector: "[etSchedulerActionDelete]", inputs: { config: { classPropertyName: "config", publicName: "etSchedulerActionDelete", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["etSchedulerActionDelete"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerActionDeleteDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[etSchedulerActionDelete]',
+                    exportAs: 'etSchedulerActionDelete',
+                }]
+        }], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "etSchedulerActionDelete", required: false }] }] } });
+
 /**
  * The `.et-scheduler-appointment` badge rule, as a styles-only component mounted by every
  * scheduler view that renders a plain (non-time-grid) appointment badge - see
@@ -52654,6 +53097,524 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                 }]
         }], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "etSchedulerBadgeTitle", required: false }] }] } });
 
+/**
+ * The color piece of the edit surface, stamped by `etSchedulerEditColor`. A plain text field for
+ * `colorToken` rather than a swatch picker - theme names are app-registered (see `theming`), so
+ * the SDK has no fixed set of tokens to offer as choices.
+ *
+ * @internal
+ */
+class SchedulerEditColorComponent {
+    constructor() {
+        this.labels = injectSchedulerLabels();
+        this.draft = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "draft" }] : /* istanbul ignore next */ []));
+        this.label = computed(() => this.labels().colorField, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+        this.value = computed(() => this.draft()().colorToken ?? '', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    }
+    updateColorToken(value) {
+        this.draft().update((appointment) => ({ ...appointment, colorToken: value || undefined }));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditColorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.7", type: SchedulerEditColorComponent, isStandalone: true, selector: "et-scheduler-edit-color", inputs: { draft: { classPropertyName: "draft", publicName: "draft", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
+    <et-form-field>
+      <et-label>{{ label() }}</et-label>
+      <et-input [value]="value()" (valueChange)="updateColorToken($event)" />
+    </et-form-field>
+  `, isInline: true, dependencies: [{ kind: "component", type: FormFieldComponent, selector: "et-form-field", inputs: ["appearance", "fill", "labelMode", "size", "busy"] }, { kind: "component", type: LabelDirective, selector: "et-label" }, { kind: "component", type: InputComponent, selector: "et-input" }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditColorComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'et-scheduler-edit-color',
+                    template: `
+    <et-form-field>
+      <et-label>{{ label() }}</et-label>
+      <et-input [value]="value()" (valueChange)="updateColorToken($event)" />
+    </et-form-field>
+  `,
+                    encapsulation: ViewEncapsulation.None,
+                    imports: [...FORM_FIELD_IMPORTS, ...INPUT_IMPORTS],
+                }]
+        }], propDecorators: { draft: [{ type: i0.Input, args: [{ isSignal: true, alias: "draft", required: true }] }] } });
+
+/**
+ * Built-in edit-surface field: the appointment's `colorToken`. One of the default pieces
+ * `<et-scheduler-edit-surface>` bundles - see `registerEditField`.
+ *
+ * @example
+ * <et-scheduler-edit-surface [etSchedulerEditColor]="{ enabled: false }" … />
+ */
+class SchedulerEditColorDirective {
+    constructor() {
+        this.host = injectSchedulerEditSurfaceHost('etSchedulerEditColor');
+        /** See {@link SchedulerEditColorConfig}. */
+        this.config = input({}, { ...(ngDevMode ? { debugName: "config" } : /* istanbul ignore next */ {}), alias: 'etSchedulerEditColor',
+            transform: (schedulerFeatureConfig) });
+        this.host.registerEditField({
+            component: SchedulerEditColorComponent,
+            injector: inject(Injector),
+            order: 40,
+            enabled: computed(() => this.config().enabled ?? true),
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditColorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: SchedulerEditColorDirective, isStandalone: true, selector: "[etSchedulerEditColor]", inputs: { config: { classPropertyName: "config", publicName: "etSchedulerEditColor", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["etSchedulerEditColor"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditColorDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[etSchedulerEditColor]',
+                    exportAs: 'etSchedulerEditColor',
+                }]
+        }], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "etSchedulerEditColor", required: false }] }] } });
+
+/**
+ * The description piece of the edit surface, stamped by `etSchedulerEditDescription`.
+ *
+ * @internal
+ */
+class SchedulerEditDescriptionComponent {
+    constructor() {
+        this.labels = injectSchedulerLabels();
+        this.draft = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "draft" }] : /* istanbul ignore next */ []));
+        this.label = computed(() => this.labels().descriptionField, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+        this.value = computed(() => this.draft()().description ?? '', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    }
+    updateDescription(value) {
+        this.draft().update((appointment) => ({ ...appointment, description: value || undefined }));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditDescriptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.7", type: SchedulerEditDescriptionComponent, isStandalone: true, selector: "et-scheduler-edit-description", inputs: { draft: { classPropertyName: "draft", publicName: "draft", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
+    <et-form-field>
+      <et-label>{{ label() }}</et-label>
+      <et-textarea [value]="value()" (valueChange)="updateDescription($event)" />
+    </et-form-field>
+  `, isInline: true, dependencies: [{ kind: "component", type: FormFieldComponent, selector: "et-form-field", inputs: ["appearance", "fill", "labelMode", "size", "busy"] }, { kind: "component", type: LabelDirective, selector: "et-label" }, { kind: "component", type: TextareaComponent, selector: "et-textarea" }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditDescriptionComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'et-scheduler-edit-description',
+                    template: `
+    <et-form-field>
+      <et-label>{{ label() }}</et-label>
+      <et-textarea [value]="value()" (valueChange)="updateDescription($event)" />
+    </et-form-field>
+  `,
+                    encapsulation: ViewEncapsulation.None,
+                    imports: [...FORM_FIELD_IMPORTS, ...TEXTAREA_IMPORTS],
+                }]
+        }], propDecorators: { draft: [{ type: i0.Input, args: [{ isSignal: true, alias: "draft", required: true }] }] } });
+
+/**
+ * Built-in edit-surface field: the appointment's `description`. One of the default pieces
+ * `<et-scheduler-edit-surface>` bundles - see `registerEditField`.
+ *
+ * @example
+ * <et-scheduler-edit-surface [etSchedulerEditDescription]="{ enabled: false }" … />
+ */
+class SchedulerEditDescriptionDirective {
+    constructor() {
+        this.host = injectSchedulerEditSurfaceHost('etSchedulerEditDescription');
+        /** See {@link SchedulerEditDescriptionConfig}. */
+        this.config = input({}, { ...(ngDevMode ? { debugName: "config" } : /* istanbul ignore next */ {}), alias: 'etSchedulerEditDescription',
+            transform: (schedulerFeatureConfig) });
+        this.host.registerEditField({
+            component: SchedulerEditDescriptionComponent,
+            injector: inject(Injector),
+            order: 30,
+            enabled: computed(() => this.config().enabled ?? true),
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditDescriptionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: SchedulerEditDescriptionDirective, isStandalone: true, selector: "[etSchedulerEditDescription]", inputs: { config: { classPropertyName: "config", publicName: "etSchedulerEditDescription", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["etSchedulerEditDescription"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditDescriptionDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[etSchedulerEditDescription]',
+                    exportAs: 'etSchedulerEditDescription',
+                }]
+        }], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "etSchedulerEditDescription", required: false }] }] } });
+
+/**
+ * The location piece of the edit surface, stamped by `etSchedulerEditLocation`.
+ *
+ * @internal
+ */
+class SchedulerEditLocationComponent {
+    constructor() {
+        this.labels = injectSchedulerLabels();
+        this.draft = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "draft" }] : /* istanbul ignore next */ []));
+        this.label = computed(() => this.labels().locationField, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+        this.value = computed(() => this.draft()().location ?? '', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    }
+    updateLocation(value) {
+        this.draft().update((appointment) => ({ ...appointment, location: value || undefined }));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditLocationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.7", type: SchedulerEditLocationComponent, isStandalone: true, selector: "et-scheduler-edit-location", inputs: { draft: { classPropertyName: "draft", publicName: "draft", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
+    <et-form-field>
+      <et-label>{{ label() }}</et-label>
+      <et-input [value]="value()" (valueChange)="updateLocation($event)" />
+    </et-form-field>
+  `, isInline: true, dependencies: [{ kind: "component", type: FormFieldComponent, selector: "et-form-field", inputs: ["appearance", "fill", "labelMode", "size", "busy"] }, { kind: "component", type: LabelDirective, selector: "et-label" }, { kind: "component", type: InputComponent, selector: "et-input" }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditLocationComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'et-scheduler-edit-location',
+                    template: `
+    <et-form-field>
+      <et-label>{{ label() }}</et-label>
+      <et-input [value]="value()" (valueChange)="updateLocation($event)" />
+    </et-form-field>
+  `,
+                    encapsulation: ViewEncapsulation.None,
+                    imports: [...FORM_FIELD_IMPORTS, ...INPUT_IMPORTS],
+                }]
+        }], propDecorators: { draft: [{ type: i0.Input, args: [{ isSignal: true, alias: "draft", required: true }] }] } });
+
+/**
+ * Built-in edit-surface field: the appointment's `location`. One of the default pieces
+ * `<et-scheduler-edit-surface>` bundles - see `registerEditField`.
+ *
+ * @example
+ * <et-scheduler-edit-surface [etSchedulerEditLocation]="{ enabled: false }" … />
+ */
+class SchedulerEditLocationDirective {
+    constructor() {
+        this.host = injectSchedulerEditSurfaceHost('etSchedulerEditLocation');
+        /** See {@link SchedulerEditLocationConfig}. */
+        this.config = input({}, { ...(ngDevMode ? { debugName: "config" } : /* istanbul ignore next */ {}), alias: 'etSchedulerEditLocation',
+            transform: (schedulerFeatureConfig) });
+        this.host.registerEditField({
+            component: SchedulerEditLocationComponent,
+            injector: inject(Injector),
+            order: 20,
+            enabled: computed(() => this.config().enabled ?? true),
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditLocationDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: SchedulerEditLocationDirective, isStandalone: true, selector: "[etSchedulerEditLocation]", inputs: { config: { classPropertyName: "config", publicName: "etSchedulerEditLocation", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["etSchedulerEditLocation"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditLocationDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[etSchedulerEditLocation]',
+                    exportAs: 'etSchedulerEditLocation',
+                }]
+        }], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "etSchedulerEditLocation", required: false }] }] } });
+
+/**
+ * The start/end piece of the edit surface, stamped by `etSchedulerEditTimeRange`.
+ *
+ * @internal
+ */
+class SchedulerEditTimeRangeComponent {
+    constructor() {
+        this.labels = injectSchedulerLabels();
+        this.dateFormat = injectDateFormat();
+        this.draft = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "draft" }] : /* istanbul ignore next */ []));
+        this.startLabel = computed(() => this.labels().startField, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "startLabel" }] : /* istanbul ignore next */ []));
+        this.endLabel = computed(() => this.labels().endField, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "endLabel" }] : /* istanbul ignore next */ []));
+        this.startValue = computed(() => format(this.draft()().start, this.dateFormat), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "startValue" }] : /* istanbul ignore next */ []));
+        this.endValue = computed(() => format(this.draft()().end, this.dateFormat), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "endValue" }] : /* istanbul ignore next */ []));
+    }
+    updateStart(value) {
+        if (!value) {
+            return;
+        }
+        const start = parse(value, this.dateFormat, this.draft()().start);
+        this.draft().update((appointment) => ({ ...appointment, start }));
+    }
+    updateEnd(value) {
+        if (!value) {
+            return;
+        }
+        const end = parse(value, this.dateFormat, this.draft()().end);
+        this.draft().update((appointment) => ({ ...appointment, end }));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditTimeRangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.7", type: SchedulerEditTimeRangeComponent, isStandalone: true, selector: "et-scheduler-edit-time-range", inputs: { draft: { classPropertyName: "draft", publicName: "draft", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "et-scheduler-edit-time-range" }, ngImport: i0, template: `
+    <et-form-field class="et-scheduler-edit-time-range-field">
+      <et-label>{{ startLabel() }}</et-label>
+      <et-date-time-input [value]="startValue()" (valueChange)="updateStart($event)" />
+    </et-form-field>
+
+    <et-form-field class="et-scheduler-edit-time-range-field">
+      <et-label>{{ endLabel() }}</et-label>
+      <et-date-time-input [value]="endValue()" (valueChange)="updateEnd($event)" />
+    </et-form-field>
+  `, isInline: true, dependencies: [{ kind: "component", type: FormFieldComponent, selector: "et-form-field", inputs: ["appearance", "fill", "labelMode", "size", "busy"] }, { kind: "component", type: LabelDirective, selector: "et-label" }, { kind: "component", type: DateTimeInputComponent, selector: "et-date-time-input", inputs: ["pickerTriggerLabel", "minuteStep", "secondStep", "dateTabLabel", "timeTabLabel", "clearable", "clearLabel"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditTimeRangeComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'et-scheduler-edit-time-range',
+                    template: `
+    <et-form-field class="et-scheduler-edit-time-range-field">
+      <et-label>{{ startLabel() }}</et-label>
+      <et-date-time-input [value]="startValue()" (valueChange)="updateStart($event)" />
+    </et-form-field>
+
+    <et-form-field class="et-scheduler-edit-time-range-field">
+      <et-label>{{ endLabel() }}</et-label>
+      <et-date-time-input [value]="endValue()" (valueChange)="updateEnd($event)" />
+    </et-form-field>
+  `,
+                    encapsulation: ViewEncapsulation.None,
+                    imports: [...FORM_FIELD_IMPORTS, ...DATE_TIME_INPUT_IMPORTS],
+                    host: {
+                        class: 'et-scheduler-edit-time-range',
+                    },
+                }]
+        }], propDecorators: { draft: [{ type: i0.Input, args: [{ isSignal: true, alias: "draft", required: true }] }] } });
+
+/**
+ * Built-in edit-surface field: the appointment's `start`/`end`. One of the default pieces
+ * `<et-scheduler-edit-surface>` bundles - see `registerEditField`. Invalid while `end` is before
+ * `start`, which gates the surface's save button.
+ *
+ * @example
+ * <et-scheduler-edit-surface [etSchedulerEditTimeRange]="{ enabled: false }" … />
+ */
+class SchedulerEditTimeRangeDirective {
+    constructor() {
+        this.host = injectSchedulerEditSurfaceHost('etSchedulerEditTimeRange');
+        this.surface = inject(SchedulerEditSurfaceDirective);
+        /** See {@link SchedulerEditTimeRangeConfig}. */
+        this.config = input({}, { ...(ngDevMode ? { debugName: "config" } : /* istanbul ignore next */ {}), alias: 'etSchedulerEditTimeRange',
+            transform: (schedulerFeatureConfig) });
+        this.host.registerEditField({
+            component: SchedulerEditTimeRangeComponent,
+            injector: inject(Injector),
+            order: 10,
+            enabled: computed(() => this.config().enabled ?? true),
+            valid: computed(() => this.surface.draft().end >= this.surface.draft().start),
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditTimeRangeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: SchedulerEditTimeRangeDirective, isStandalone: true, selector: "[etSchedulerEditTimeRange]", inputs: { config: { classPropertyName: "config", publicName: "etSchedulerEditTimeRange", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["etSchedulerEditTimeRange"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditTimeRangeDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[etSchedulerEditTimeRange]',
+                    exportAs: 'etSchedulerEditTimeRange',
+                }]
+        }], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "etSchedulerEditTimeRange", required: false }] }] } });
+
+/**
+ * The title piece of the edit surface, stamped by `etSchedulerEditTitle`.
+ *
+ * @internal
+ */
+class SchedulerEditTitleComponent {
+    constructor() {
+        this.labels = injectSchedulerLabels();
+        this.draft = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "draft" }] : /* istanbul ignore next */ []));
+        this.label = computed(() => this.labels().titleField, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+        this.value = computed(() => this.draft()().title, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    }
+    updateTitle(value) {
+        this.draft().update((appointment) => ({ ...appointment, title: value }));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.7", type: SchedulerEditTitleComponent, isStandalone: true, selector: "et-scheduler-edit-title", inputs: { draft: { classPropertyName: "draft", publicName: "draft", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
+    <et-form-field>
+      <et-label>{{ label() }}</et-label>
+      <et-input [value]="value()" (valueChange)="updateTitle($event)" />
+    </et-form-field>
+  `, isInline: true, dependencies: [{ kind: "component", type: FormFieldComponent, selector: "et-form-field", inputs: ["appearance", "fill", "labelMode", "size", "busy"] }, { kind: "component", type: LabelDirective, selector: "et-label" }, { kind: "component", type: InputComponent, selector: "et-input" }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditTitleComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'et-scheduler-edit-title',
+                    template: `
+    <et-form-field>
+      <et-label>{{ label() }}</et-label>
+      <et-input [value]="value()" (valueChange)="updateTitle($event)" />
+    </et-form-field>
+  `,
+                    encapsulation: ViewEncapsulation.None,
+                    imports: [...FORM_FIELD_IMPORTS, ...INPUT_IMPORTS],
+                }]
+        }], propDecorators: { draft: [{ type: i0.Input, args: [{ isSignal: true, alias: "draft", required: true }] }] } });
+
+/**
+ * Built-in edit-surface field: the appointment's title. One of the default pieces
+ * `<et-scheduler-edit-surface>` bundles - see `registerEditField`. Required - the field is
+ * invalid while the draft's title is blank, which gates the surface's save button.
+ *
+ * @example
+ * <et-scheduler-edit-surface [etSchedulerEditTitle]="{ enabled: false }" … />
+ */
+class SchedulerEditTitleDirective {
+    constructor() {
+        this.host = injectSchedulerEditSurfaceHost('etSchedulerEditTitle');
+        this.surface = inject(SchedulerEditSurfaceDirective);
+        /** See {@link SchedulerEditTitleConfig}. */
+        this.config = input({}, { ...(ngDevMode ? { debugName: "config" } : /* istanbul ignore next */ {}), alias: 'etSchedulerEditTitle',
+            transform: (schedulerFeatureConfig) });
+        this.host.registerEditField({
+            component: SchedulerEditTitleComponent,
+            injector: inject(Injector),
+            order: 0,
+            enabled: computed(() => this.config().enabled ?? true),
+            valid: computed(() => this.surface.draft().title.trim().length > 0),
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: SchedulerEditTitleDirective, isStandalone: true, selector: "[etSchedulerEditTitle]", inputs: { config: { classPropertyName: "config", publicName: "etSchedulerEditTitle", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["etSchedulerEditTitle"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditTitleDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[etSchedulerEditTitle]',
+                    exportAs: 'etSchedulerEditTitle',
+                }]
+        }], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "etSchedulerEditTitle", required: false }] }] } });
+
+/**
+ * The default edit surface: a dialog for one appointment, its fields, its ancestor breadcrumb and
+ * children list, and an action menu - built on the overlay system. Orchestrates the active fields
+ * + actions via `hostDirectives: [SchedulerEditSurfaceDirective]`, bakes the built-in fields and
+ * actions in by default (each forwarding its own config input, same pattern as `<et-scheduler>`'s
+ * badge adornments), and applies `SCHEDULER_EDIT_SURFACE_HOST` so they can register.
+ */
+class SchedulerEditSurfaceComponent {
+    constructor() {
+        this.labels = injectSchedulerLabels();
+        this.elementRef = inject(ElementRef);
+        this.overlayRef = inject(OVERLAY_REF, { optional: true });
+        /** The headless directive behind this surface - field/action registration, draft state and navigation. */
+        this.surface = inject(SchedulerEditSurfaceDirective);
+        this.cancelLabel = computed(() => this.labels().cancel, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "cancelLabel" }] : /* istanbul ignore next */ []));
+        this.saveLabel = computed(() => this.labels().save, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "saveLabel" }] : /* istanbul ignore next */ []));
+        this.moreActionsLabel = computed(() => this.labels().moreActions, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "moreActionsLabel" }] : /* istanbul ignore next */ []));
+        this.ancestorsLabel = computed(() => this.labels().ancestors, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "ancestorsLabel" }] : /* istanbul ignore next */ []));
+        this.subAppointmentsLabel = computed(() => this.labels().subAppointments, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "subAppointmentsLabel" }] : /* istanbul ignore next */ []));
+        this.untitledLabel = computed(() => this.labels().untitledAppointment, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "untitledLabel" }] : /* istanbul ignore next */ []));
+        this.headerLabel = computed(() => this.surface.currentAppointment().title || this.untitledLabel(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "headerLabel" }] : /* istanbul ignore next */ []));
+        // UI contributed by edit-field/action features - see SCHEDULER_EDIT_SURFACE_HOST. The built-ins
+        // above are features too, registering the same way a consumer's own field/action would.
+        this.editFieldList = signal([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "editFieldList" }] : /* istanbul ignore next */ []));
+        this.appointmentActionList = signal([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "appointmentActionList" }] : /* istanbul ignore next */ []));
+        this.editFields = computed(() => this.editFieldList()
+            .filter((field) => field.enabled?.() ?? true)
+            .sort((a, b) => (a.order ?? 0) - (b.order ?? 0)), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "editFields" }] : /* istanbul ignore next */ []));
+        this.appointmentActions = computed(() => this.appointmentActionList()
+            .filter((action) => action.enabled?.() ?? true)
+            .sort((a, b) => (a.order ?? 0) - (b.order ?? 0)), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "appointmentActions" }] : /* istanbul ignore next */ []));
+        /** Gates the save button - every currently-enabled field must report itself valid. */
+        this.canSave = computed(() => this.editFields().every((field) => field.valid?.() ?? true), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "canSave" }] : /* istanbul ignore next */ []));
+        outputToObservable(this.surface.save)
+            .pipe(takeUntilDestroyed(), tap((appointment) => this.overlayRef?.close({ kind: 'save', appointment })))
+            .subscribe();
+        outputToObservable(this.surface.deleteAppointments)
+            .pipe(takeUntilDestroyed(), tap((ids) => this.overlayRef?.close({ kind: 'delete', ids })))
+            .subscribe();
+    }
+    /** Part of the feature contract - see `SchedulerEditSurfaceHost`. */
+    get element() {
+        return this.elementRef.nativeElement;
+    }
+    /** Part of the feature contract - see `SchedulerEditSurfaceHost`. */
+    get appointment() {
+        return this.surface.currentAppointment;
+    }
+    /** Part of the feature contract - see `SchedulerEditSurfaceHost`. */
+    get appointmentTree() {
+        return this.surface.appointmentTree;
+    }
+    /** Part of the feature contract - see `SchedulerEditSurfaceHost`. */
+    registerEditField(field) {
+        this.editFieldList.update((list) => [...list, field]);
+    }
+    /** Part of the feature contract - see `SchedulerEditSurfaceHost`. */
+    registerAppointmentAction(action) {
+        this.appointmentActionList.update((list) => [...list, action]);
+    }
+    save() {
+        this.surface.commit();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditSurfaceComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: SchedulerEditSurfaceComponent, isStandalone: true, selector: "et-scheduler-edit-surface", host: { classAttribute: "et-scheduler-edit-surface" }, providers: [
+            provideIcons(PLUS_ICON, TRASH_ICON, ELLIPSIS_VERTICAL_ICON),
+            { provide: SCHEDULER_EDIT_SURFACE_HOST, useExisting: SchedulerEditSurfaceComponent },
+        ], hostDirectives: [{ directive: OverlayMainDirective }, { directive: SchedulerEditSurfaceDirective, inputs: ["appointment", "appointment", "appointments", "appointments"] }, { directive: SchedulerEditTitleDirective, inputs: ["etSchedulerEditTitle", "etSchedulerEditTitle"] }, { directive: SchedulerEditTimeRangeDirective, inputs: ["etSchedulerEditTimeRange", "etSchedulerEditTimeRange"] }, { directive: SchedulerEditLocationDirective, inputs: ["etSchedulerEditLocation", "etSchedulerEditLocation"] }, { directive: SchedulerEditDescriptionDirective, inputs: ["etSchedulerEditDescription", "etSchedulerEditDescription"] }, { directive: SchedulerEditColorDirective, inputs: ["etSchedulerEditColor", "etSchedulerEditColor"] }, { directive: SchedulerActionAddSubAppointmentDirective, inputs: ["etSchedulerActionAddSubAppointment", "etSchedulerActionAddSubAppointment"] }, { directive: SchedulerActionDeleteDirective, inputs: ["etSchedulerActionDelete", "etSchedulerActionDelete"] }], ngImport: i0, template: "<div class=\"et-scheduler-edit-surface-header\" etOverlayHeader>\n  <h2 class=\"et-scheduler-edit-surface-title\" etOverlayTitle>{{ headerLabel() }}</h2>\n\n  @if (appointmentActions().length > 0) {\n    <div class=\"et-scheduler-edit-surface-actions\" etMenu>\n      <button [attr.aria-label]=\"moreActionsLabel()\" et-icon-button etMenuTrigger size=\"sm\" type=\"button\">\n        <i etIcon=\"et-ellipsis-vertical\"></i>\n      </button>\n\n      <ng-template etMenuSurface>\n        <et-menu>\n          @for (action of appointmentActions(); track $index) {\n            <button\n              [variant]=\"action.destructive ? 'destructive' : 'default'\"\n              (click)=\"action.run()\"\n              et-menu-item\n              type=\"button\"\n            >\n              @if (action.icon) {\n                <i [etIcon]=\"action.icon\" aria-hidden=\"true\"></i>\n              }\n              {{ action.label() }}\n            </button>\n          }\n        </et-menu>\n      </ng-template>\n    </div>\n  }\n</div>\n\n<et-overlay-body>\n  @if (surface.ancestors().length > 0) {\n    <nav [attr.aria-label]=\"ancestorsLabel()\" class=\"et-scheduler-edit-surface-breadcrumb\">\n      @for (ancestor of surface.ancestors(); track ancestor.id) {\n        <button\n          (click)=\"surface.navigateTo(ancestor.id)\"\n          class=\"et-scheduler-edit-surface-breadcrumb-item\"\n          type=\"button\"\n        >\n          {{ ancestor.title || untitledLabel() }}\n        </button>\n        <span class=\"et-scheduler-edit-surface-breadcrumb-separator\" aria-hidden=\"true\">/</span>\n      }\n      <span class=\"et-scheduler-edit-surface-breadcrumb-current\" aria-current=\"page\">{{ headerLabel() }}</span>\n    </nav>\n  }\n\n  <div class=\"et-scheduler-edit-surface-fields\">\n    @for (field of editFields(); track $index) {\n      <ng-container *ngComponentOutlet=\"field.component; inputs: { draft: surface.draft }; injector: field.injector\" />\n    }\n  </div>\n\n  @if (surface.children().length > 0) {\n    <div class=\"et-scheduler-edit-surface-children\">\n      <h3 class=\"et-scheduler-edit-surface-children-heading\">{{ subAppointmentsLabel() }}</h3>\n\n      <ul class=\"et-scheduler-edit-surface-children-list\">\n        @for (child of surface.children(); track child.appointment.id) {\n          <li>\n            <button\n              (click)=\"surface.navigateTo(child.appointment.id)\"\n              class=\"et-scheduler-edit-surface-children-item\"\n              type=\"button\"\n            >\n              {{ child.appointment.title || untitledLabel() }}\n            </button>\n          </li>\n        }\n      </ul>\n    </div>\n  }\n</et-overlay-body>\n\n<div class=\"et-scheduler-edit-surface-footer\" etOverlayFooter>\n  <button et-button etOverlayClose type=\"button\" variant=\"outline\">{{ cancelLabel() }}</button>\n  <button [disabled]=\"!canSave()\" (click)=\"save()\" et-button type=\"button\">{{ saveLabel() }}</button>\n</div>\n", styles: ["@layer components{.et-scheduler-edit-surface-header{display:flex;align-items:center;gap:12px}.et-scheduler-edit-surface-title{flex:1;min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.et-scheduler-edit-surface-actions{flex-shrink:0;margin-inline-start:auto}.et-scheduler-edit-surface-footer{display:flex;justify-content:flex-end;gap:12px}.et-scheduler-edit-surface-breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin-block-end:16px;font-size:13px;color:var(--et-surface-color-muted-solid)}.et-scheduler-edit-surface-breadcrumb-item{color:inherit;text-decoration:underline;text-underline-offset:2px}.et-scheduler-edit-surface-breadcrumb-current{color:var(--et-surface-color-solid);font-weight:600}.et-scheduler-edit-surface-fields{display:flex;flex-direction:column;gap:16px}.et-scheduler-edit-time-range{display:flex;gap:12px}.et-scheduler-edit-time-range-field{flex:1;min-inline-size:0}.et-scheduler-edit-surface-children{margin-block-start:20px}.et-scheduler-edit-surface-children-heading{margin:0 0 8px;font-size:13px;font-weight:600;color:var(--et-surface-color-muted-solid)}.et-scheduler-edit-surface-children-list{display:flex;flex-direction:column;gap:4px;margin:0;padding:0;list-style:none}.et-scheduler-edit-surface-children-item{color:var(--et-theme-color-ink-solid, var(--et-surface-color-solid));text-decoration:underline;text-underline-offset:2px}}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "[et-button]", inputs: ["variant", "size", "iconAlignment"] }, { kind: "component", type: IconButtonComponent, selector: "[et-icon-button]", inputs: ["variant", "size"] }, { kind: "directive", type: MenuDirective, selector: "[etMenu]", inputs: ["placement", "fallbackPlacements", "offset", "viewportPadding", "arrow", "arrowPadding", "autoFocus", "hoverOpen", "loop", "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: MenuItemComponent, selector: "button[et-menu-item], a[et-menu-item]", inputs: ["variant"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor", "label"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "component", type: OverlayBodyComponent, selector: "[et-overlay-body], et-overlay-body", inputs: ["dividers"] }, { kind: "directive", type: OverlayCloseDirective, selector: "[et-overlay-close], [etOverlayClose]", inputs: ["aria-label", "type", "etOverlayClose", "et-overlay-close"], exportAs: ["etOverlayClose"] }, { kind: "directive", type: OverlayFooterDirective, selector: "[etOverlayFooter], et-overlay-footer" }, { kind: "directive", type: OverlayHeaderDirective, selector: "[etOverlayHeader], et-overlay-header" }, { kind: "directive", type: OverlayTitleDirective, selector: "[et-overlay-title], [etOverlayTitle]", inputs: ["id"], exportAs: ["etOverlayTitle"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerEditSurfaceComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'et-scheduler-edit-surface', encapsulation: ViewEncapsulation.None, imports: [
+                        ...BUTTON_IMPORTS,
+                        ...MENU_IMPORTS,
+                        IconDirective,
+                        NgComponentOutlet,
+                        OverlayBodyComponent,
+                        OverlayCloseDirective,
+                        OverlayFooterDirective,
+                        OverlayHeaderDirective,
+                        OverlayTitleDirective,
+                    ], providers: [
+                        provideIcons(PLUS_ICON, TRASH_ICON, ELLIPSIS_VERTICAL_ICON),
+                        { provide: SCHEDULER_EDIT_SURFACE_HOST, useExisting: SchedulerEditSurfaceComponent },
+                    ], hostDirectives: [
+                        OverlayMainDirective,
+                        { directive: SchedulerEditSurfaceDirective, inputs: ['appointment', 'appointments'] },
+                        // The built-in edit fields and appointment actions, bundled by default so
+                        // `<et-scheduler-edit-surface>` renders a full surface zero-config - each forwards its own
+                        // config input, so e.g. `[etSchedulerEditLocation]="{ enabled: false }"` disables just that
+                        // one piece without dropping to headless composition.
+                        { directive: SchedulerEditTitleDirective, inputs: ['etSchedulerEditTitle'] },
+                        { directive: SchedulerEditTimeRangeDirective, inputs: ['etSchedulerEditTimeRange'] },
+                        { directive: SchedulerEditLocationDirective, inputs: ['etSchedulerEditLocation'] },
+                        { directive: SchedulerEditDescriptionDirective, inputs: ['etSchedulerEditDescription'] },
+                        { directive: SchedulerEditColorDirective, inputs: ['etSchedulerEditColor'] },
+                        { directive: SchedulerActionAddSubAppointmentDirective, inputs: ['etSchedulerActionAddSubAppointment'] },
+                        { directive: SchedulerActionDeleteDirective, inputs: ['etSchedulerActionDelete'] },
+                    ], host: {
+                        class: 'et-scheduler-edit-surface',
+                    }, template: "<div class=\"et-scheduler-edit-surface-header\" etOverlayHeader>\n  <h2 class=\"et-scheduler-edit-surface-title\" etOverlayTitle>{{ headerLabel() }}</h2>\n\n  @if (appointmentActions().length > 0) {\n    <div class=\"et-scheduler-edit-surface-actions\" etMenu>\n      <button [attr.aria-label]=\"moreActionsLabel()\" et-icon-button etMenuTrigger size=\"sm\" type=\"button\">\n        <i etIcon=\"et-ellipsis-vertical\"></i>\n      </button>\n\n      <ng-template etMenuSurface>\n        <et-menu>\n          @for (action of appointmentActions(); track $index) {\n            <button\n              [variant]=\"action.destructive ? 'destructive' : 'default'\"\n              (click)=\"action.run()\"\n              et-menu-item\n              type=\"button\"\n            >\n              @if (action.icon) {\n                <i [etIcon]=\"action.icon\" aria-hidden=\"true\"></i>\n              }\n              {{ action.label() }}\n            </button>\n          }\n        </et-menu>\n      </ng-template>\n    </div>\n  }\n</div>\n\n<et-overlay-body>\n  @if (surface.ancestors().length > 0) {\n    <nav [attr.aria-label]=\"ancestorsLabel()\" class=\"et-scheduler-edit-surface-breadcrumb\">\n      @for (ancestor of surface.ancestors(); track ancestor.id) {\n        <button\n          (click)=\"surface.navigateTo(ancestor.id)\"\n          class=\"et-scheduler-edit-surface-breadcrumb-item\"\n          type=\"button\"\n        >\n          {{ ancestor.title || untitledLabel() }}\n        </button>\n        <span class=\"et-scheduler-edit-surface-breadcrumb-separator\" aria-hidden=\"true\">/</span>\n      }\n      <span class=\"et-scheduler-edit-surface-breadcrumb-current\" aria-current=\"page\">{{ headerLabel() }}</span>\n    </nav>\n  }\n\n  <div class=\"et-scheduler-edit-surface-fields\">\n    @for (field of editFields(); track $index) {\n      <ng-container *ngComponentOutlet=\"field.component; inputs: { draft: surface.draft }; injector: field.injector\" />\n    }\n  </div>\n\n  @if (surface.children().length > 0) {\n    <div class=\"et-scheduler-edit-surface-children\">\n      <h3 class=\"et-scheduler-edit-surface-children-heading\">{{ subAppointmentsLabel() }}</h3>\n\n      <ul class=\"et-scheduler-edit-surface-children-list\">\n        @for (child of surface.children(); track child.appointment.id) {\n          <li>\n            <button\n              (click)=\"surface.navigateTo(child.appointment.id)\"\n              class=\"et-scheduler-edit-surface-children-item\"\n              type=\"button\"\n            >\n              {{ child.appointment.title || untitledLabel() }}\n            </button>\n          </li>\n        }\n      </ul>\n    </div>\n  }\n</et-overlay-body>\n\n<div class=\"et-scheduler-edit-surface-footer\" etOverlayFooter>\n  <button et-button etOverlayClose type=\"button\" variant=\"outline\">{{ cancelLabel() }}</button>\n  <button [disabled]=\"!canSave()\" (click)=\"save()\" et-button type=\"button\">{{ saveLabel() }}</button>\n</div>\n", styles: ["@layer components{.et-scheduler-edit-surface-header{display:flex;align-items:center;gap:12px}.et-scheduler-edit-surface-title{flex:1;min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.et-scheduler-edit-surface-actions{flex-shrink:0;margin-inline-start:auto}.et-scheduler-edit-surface-footer{display:flex;justify-content:flex-end;gap:12px}.et-scheduler-edit-surface-breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin-block-end:16px;font-size:13px;color:var(--et-surface-color-muted-solid)}.et-scheduler-edit-surface-breadcrumb-item{color:inherit;text-decoration:underline;text-underline-offset:2px}.et-scheduler-edit-surface-breadcrumb-current{color:var(--et-surface-color-solid);font-weight:600}.et-scheduler-edit-surface-fields{display:flex;flex-direction:column;gap:16px}.et-scheduler-edit-time-range{display:flex;gap:12px}.et-scheduler-edit-time-range-field{flex:1;min-inline-size:0}.et-scheduler-edit-surface-children{margin-block-start:20px}.et-scheduler-edit-surface-children-heading{margin:0 0 8px;font-size:13px;font-weight:600;color:var(--et-surface-color-muted-solid)}.et-scheduler-edit-surface-children-list{display:flex;flex-direction:column;gap:4px;margin:0;padding:0;list-style:none}.et-scheduler-edit-surface-children-item{color:var(--et-theme-color-ink-solid, var(--et-surface-color-solid));text-decoration:underline;text-underline-offset:2px}}\n"] }]
+        }], ctorParameters: () => [] });
+/** Opens `<et-scheduler-edit-surface>` as a dialog - what `<et-scheduler>` uses to auto-open on selection. */
+const SCHEDULER_EDIT_SURFACE_OVERLAY = /* @__PURE__ */ defineOverlay({
+    component: SchedulerEditSurfaceComponent,
+    strategies: /* @__PURE__ */ dialogOverlayStrategy({ maxWidth: '520px' }),
+    panelClass: 'et-scheduler-edit-surface-panel',
+});
+
 /** The default month grid: one day cell per day, appointments as one-line badges with a "+N more" overflow. */
 class SchedulerMonthViewComponent {
     constructor() {
@@ -52697,6 +53658,10 @@ class SchedulerTimeGridViewComponent {
         this.scheduler = inject(SchedulerDirective, { optional: true });
         this.grid = inject(SchedulerTimeGridDirective);
         this.featureHost = inject(SCHEDULER_FEATURE_HOST, { optional: true });
+        this.timeGridBody = viewChild('timeGridBody', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "timeGridBody" }] : /* istanbul ignore next */ []));
+        this.firstHourRow = viewChild('hourRow', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "firstHourRow" }] : /* istanbul ignore next */ []));
         this.hours = computed(() => {
             const locale = this.scheduler?.effectiveLocale();
             const reference = startOfDay(new Date());
@@ -52707,6 +53672,16 @@ class SchedulerTimeGridViewComponent {
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "hours" }] : /* istanbul ignore next */ []));
         injectStyleManager().mount(SchedulerAppointmentStylesComponent);
+        // Once per mount, not reactively - re-scrolling on every `focusedDate` change would yank a
+        // user's own scroll position back every time they step to the next day/week.
+        afterNextRender(() => {
+            const body = this.timeGridBody()?.nativeElement;
+            const hourRow = this.firstHourRow()?.nativeElement;
+            if (!body || !hourRow) {
+                return;
+            }
+            body.scrollTop = this.grid.initialScrollHour() * hourRow.offsetHeight;
+        });
     }
     /** UI contributed by badge features (title, time range, …) - see `registerBadgeAdornment`. */
     badgeAdornments() {
@@ -52723,14 +53698,14 @@ class SchedulerTimeGridViewComponent {
         this.scheduler?.selectedAppointmentId.set(appointment.id);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerTimeGridViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: SchedulerTimeGridViewComponent, isStandalone: true, selector: "et-scheduler-time-grid-view", host: { classAttribute: "et-scheduler-time-grid-view" }, hostDirectives: [{ directive: SchedulerTimeGridDirective }], ngImport: i0, template: "<div class=\"et-scheduler-time-grid-row et-scheduler-time-grid-header\" role=\"row\">\n  <div class=\"et-scheduler-time-grid-gutter\"></div>\n\n  <div class=\"et-scheduler-time-grid-days\">\n    @for (day of grid.days(); track day.date.getTime()) {\n      <div [attr.data-today]=\"day.today ? '' : null\" class=\"et-scheduler-time-grid-header-day\" role=\"columnheader\">\n        <span class=\"et-scheduler-time-grid-header-weekday\">{{ weekdayLabel(day.date) }}</span>\n        <span class=\"et-scheduler-time-grid-header-date\">{{ day.date.getDate() }}</span>\n      </div>\n    }\n  </div>\n</div>\n\n@if (grid.allDayRowCount() > 0) {\n  <div class=\"et-scheduler-time-grid-row et-scheduler-time-grid-all-day\" role=\"row\">\n    <div class=\"et-scheduler-time-grid-gutter\"></div>\n\n    <div\n      [style.--_et-scheduler-time-grid-all-day-row-count]=\"grid.allDayRowCount()\"\n      class=\"et-scheduler-time-grid-all-day-lane\"\n      role=\"gridcell\"\n    >\n      @for (entry of grid.allDay(); track entry.node.appointment.id) {\n        <button\n          [style.--_et-scheduler-time-grid-all-day-offset]=\"entry.inlineOffset\"\n          [style.--_et-scheduler-time-grid-all-day-size]=\"entry.inlineSize\"\n          [style.--_et-scheduler-time-grid-all-day-row]=\"entry.row\"\n          [attr.data-selected]=\"isSelected(entry.node.appointment) ? '' : null\"\n          [attr.title]=\"entry.node.appointment.title\"\n          [etProvideColor]=\"entry.node.appointment.colorToken ?? null\"\n          (click)=\"select(entry.node.appointment)\"\n          class=\"et-scheduler-appointment et-scheduler-time-grid-all-day-entry\"\n          type=\"button\"\n        >\n          @for (adornment of badgeAdornments(); track $index) {\n            <ng-container\n              *ngComponentOutlet=\"adornment.component; inputs: { node: entry.node }; injector: adornment.injector\"\n            />\n          }\n        </button>\n      }\n    </div>\n  </div>\n}\n\n<div class=\"et-scheduler-time-grid-row et-scheduler-time-grid-body\">\n  <div class=\"et-scheduler-time-grid-gutter\" role=\"presentation\">\n    @for (hour of hours(); track hour.hour) {\n      <div class=\"et-scheduler-time-grid-hour-row\">\n        <span class=\"et-scheduler-time-grid-hour-label\">{{ hour.label }}</span>\n      </div>\n    }\n  </div>\n\n  <div class=\"et-scheduler-time-grid-days\">\n    @for (day of grid.days(); track day.date.getTime()) {\n      <div [attr.data-today]=\"day.today ? '' : null\" class=\"et-scheduler-time-grid-day\" role=\"gridcell\">\n        @for (hour of hours(); track hour.hour) {\n          <div class=\"et-scheduler-time-grid-hour-row\" role=\"presentation\"></div>\n        }\n\n        @for (block of day.blocks; track block.node.appointment.id) {\n          <button\n            [style.--_et-scheduler-time-grid-block-offset]=\"block.offset\"\n            [style.--_et-scheduler-time-grid-block-span]=\"block.span\"\n            [style.--_et-scheduler-time-grid-block-inline-offset]=\"block.inlineOffset\"\n            [style.--_et-scheduler-time-grid-block-inline-size]=\"block.inlineSize\"\n            [style.--_et-scheduler-time-grid-block-depth]=\"block.node.depth\"\n            [attr.data-selected]=\"isSelected(block.node.appointment) ? '' : null\"\n            [attr.data-nested]=\"block.node.depth > 0 ? '' : null\"\n            [attr.title]=\"block.node.appointment.title\"\n            [etProvideColor]=\"block.node.appointment.colorToken ?? null\"\n            (click)=\"select(block.node.appointment)\"\n            class=\"et-scheduler-time-grid-block\"\n            type=\"button\"\n          >\n            @for (adornment of badgeAdornments(); track $index) {\n              <ng-container\n                *ngComponentOutlet=\"adornment.component; inputs: { node: block.node }; injector: adornment.injector\"\n              />\n            }\n          </button>\n        }\n      </div>\n    }\n  </div>\n</div>\n", styles: ["@layer components{@property --et-scheduler-time-grid-hour-size{syntax: \"<length>\"; inherits: true; initial-value: 48px;}@property --et-scheduler-time-grid-gutter-size{syntax: \"<length>\"; inherits: true; initial-value: 56px;}@property --et-scheduler-time-grid-all-day-row-size{syntax: \"<length>\"; inherits: true; initial-value: 24px;}.et-scheduler-time-grid-view{display:flex;flex-direction:column}.et-scheduler-time-grid-row{display:flex}.et-scheduler-time-grid-gutter{flex-shrink:0;inline-size:var(--et-scheduler-time-grid-gutter-size)}.et-scheduler-time-grid-days{display:grid;flex:1;grid-auto-flow:column;grid-auto-columns:1fr}.et-scheduler-time-grid-header{padding-block-end:6px;border-block-end:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-header-day{display:flex;flex-direction:column;align-items:center;gap:2px;padding-block:4px}.et-scheduler-time-grid-header-day:where([data-today]) .et-scheduler-time-grid-header-date{background:var(--et-theme-color-primary-solid);color:var(--et-theme-color-on-primary)}.et-scheduler-time-grid-header-weekday{font-size:12px;font-weight:600;color:var(--et-surface-color-muted-solid)}.et-scheduler-time-grid-header-date{display:inline-flex;align-items:center;justify-content:center;inline-size:22px;block-size:22px;border-radius:999px;font-size:13px;font-variant-numeric:tabular-nums;color:var(--et-surface-color-solid)}.et-scheduler-time-grid-all-day{padding-block:4px;border-block-end:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-all-day-lane{position:relative;flex:1;min-block-size:calc(var(--_et-scheduler-time-grid-all-day-row-count, 0) * var(--et-scheduler-time-grid-all-day-row-size))}.et-scheduler-time-grid-all-day-entry{position:absolute;inset-block-start:calc(var(--_et-scheduler-time-grid-all-day-row, 0) * var(--et-scheduler-time-grid-all-day-row-size));inset-inline-start:calc(var(--_et-scheduler-time-grid-all-day-offset, 0) * 1%);inline-size:calc(var(--_et-scheduler-time-grid-all-day-size, 100) * 1% - 4px);block-size:calc(var(--et-scheduler-time-grid-all-day-row-size) - 2px)}.et-scheduler-time-grid-hour-row{box-sizing:border-box;block-size:var(--et-scheduler-time-grid-hour-size);border-block-end:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-body .et-scheduler-time-grid-gutter .et-scheduler-time-grid-hour-row{display:flex;align-items:flex-start;justify-content:flex-end;padding-inline-end:8px;border-block-end:none}.et-scheduler-time-grid-hour-label{inline-size:max-content;transform:translateY(-50%);font-size:11px;font-variant-numeric:tabular-nums;color:var(--et-surface-color-muted-solid)}.et-scheduler-time-grid-body .et-scheduler-time-grid-days{border-inline-start:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-day{position:relative;border-inline-end:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-day:where([data-today]){background:color-mix(in srgb,var(--et-theme-color-primary-solid) 6%,transparent)}.et-scheduler-time-grid-block{position:absolute;inset-block-start:calc(var(--_et-scheduler-time-grid-block-offset, 0) * 1%);inset-inline-start:calc(var(--_et-scheduler-time-grid-block-inline-offset, 0) * 1%);block-size:calc(var(--_et-scheduler-time-grid-block-span, 0) * 1%);inline-size:calc(var(--_et-scheduler-time-grid-block-inline-size, 100) * 1% - 2px);min-block-size:16px;display:flex;align-items:flex-start;gap:6px;overflow:hidden;padding:2px 6px;padding-inline-start:calc(min(var(--_et-scheduler-time-grid-block-depth, 0),4)*6px + 6px);border:none;border-radius:4px;background:color-mix(in srgb,var(--et-theme-color-primary-solid) 14%,transparent);color:var(--et-theme-color-ink-solid);font:inherit;font-size:12px;text-align:start;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.et-scheduler-time-grid-block .et-scheduler-appointment-dot{margin-block-start:4px}@media(hover:hover){.et-scheduler-time-grid-block:hover{background:color-mix(in srgb,var(--et-theme-color-primary-solid) 22%,transparent)}}.et-scheduler-time-grid-block:focus-visible{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:1px}.et-scheduler-time-grid-block:where([data-selected]){background:var(--et-theme-color-primary-solid);color:var(--et-theme-color-on-primary)}}\n"], dependencies: [{ kind: "directive", type: ProvideColorDirective, selector: "[etProvideColor]", inputs: ["etProvideColor"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: SchedulerTimeGridViewComponent, isStandalone: true, selector: "et-scheduler-time-grid-view", host: { classAttribute: "et-scheduler-time-grid-view" }, viewQueries: [{ propertyName: "timeGridBody", first: true, predicate: ["timeGridBody"], descendants: true, isSignal: true }, { propertyName: "firstHourRow", first: true, predicate: ["hourRow"], descendants: true, isSignal: true }], hostDirectives: [{ directive: SchedulerTimeGridDirective }], ngImport: i0, template: "<div class=\"et-scheduler-time-grid-row et-scheduler-time-grid-header\" role=\"row\">\n  <div class=\"et-scheduler-time-grid-gutter\"></div>\n\n  <div class=\"et-scheduler-time-grid-days\">\n    @for (day of grid.days(); track day.date.getTime()) {\n      <div [attr.data-today]=\"day.today ? '' : null\" class=\"et-scheduler-time-grid-header-day\" role=\"columnheader\">\n        <span class=\"et-scheduler-time-grid-header-weekday\">{{ weekdayLabel(day.date) }}</span>\n        <span class=\"et-scheduler-time-grid-header-date\">{{ day.date.getDate() }}</span>\n      </div>\n    }\n  </div>\n</div>\n\n@if (grid.allDayRowCount() > 0) {\n  <div class=\"et-scheduler-time-grid-row et-scheduler-time-grid-all-day\" role=\"row\">\n    <div class=\"et-scheduler-time-grid-gutter\"></div>\n\n    <div\n      [style.--_et-scheduler-time-grid-all-day-row-count]=\"grid.allDayRowCount()\"\n      class=\"et-scheduler-time-grid-all-day-lane\"\n      role=\"gridcell\"\n    >\n      @for (entry of grid.allDay(); track entry.node.appointment.id) {\n        <button\n          [style.--_et-scheduler-time-grid-all-day-offset]=\"entry.inlineOffset\"\n          [style.--_et-scheduler-time-grid-all-day-size]=\"entry.inlineSize\"\n          [style.--_et-scheduler-time-grid-all-day-row]=\"entry.row\"\n          [attr.data-selected]=\"isSelected(entry.node.appointment) ? '' : null\"\n          [attr.title]=\"entry.node.appointment.title\"\n          [etProvideColor]=\"entry.node.appointment.colorToken ?? null\"\n          (click)=\"select(entry.node.appointment)\"\n          class=\"et-scheduler-appointment et-scheduler-time-grid-all-day-entry\"\n          type=\"button\"\n        >\n          @for (adornment of badgeAdornments(); track $index) {\n            <ng-container\n              *ngComponentOutlet=\"adornment.component; inputs: { node: entry.node }; injector: adornment.injector\"\n            />\n          }\n        </button>\n      }\n    </div>\n  </div>\n}\n\n<div #timeGridBody class=\"et-scheduler-time-grid-row et-scheduler-time-grid-body\">\n  <div class=\"et-scheduler-time-grid-gutter\" role=\"presentation\">\n    @for (hour of hours(); track hour.hour) {\n      <div #hourRow class=\"et-scheduler-time-grid-hour-row\">\n        <span class=\"et-scheduler-time-grid-hour-label\">{{ hour.label }}</span>\n      </div>\n    }\n  </div>\n\n  <div class=\"et-scheduler-time-grid-days\">\n    @for (day of grid.days(); track day.date.getTime()) {\n      <div [attr.data-today]=\"day.today ? '' : null\" class=\"et-scheduler-time-grid-day\" role=\"gridcell\">\n        @for (hour of hours(); track hour.hour) {\n          <div class=\"et-scheduler-time-grid-hour-row\" role=\"presentation\"></div>\n        }\n\n        @for (block of day.blocks; track block.node.appointment.id) {\n          <button\n            [style.--_et-scheduler-time-grid-block-offset]=\"block.offset\"\n            [style.--_et-scheduler-time-grid-block-span]=\"block.span\"\n            [style.--_et-scheduler-time-grid-block-inline-offset]=\"block.inlineOffset\"\n            [style.--_et-scheduler-time-grid-block-inline-size]=\"block.inlineSize\"\n            [style.--_et-scheduler-time-grid-block-depth]=\"block.node.depth\"\n            [attr.data-selected]=\"isSelected(block.node.appointment) ? '' : null\"\n            [attr.data-nested]=\"block.node.depth > 0 ? '' : null\"\n            [attr.title]=\"block.node.appointment.title\"\n            [etProvideColor]=\"block.node.appointment.colorToken ?? null\"\n            (click)=\"select(block.node.appointment)\"\n            class=\"et-scheduler-time-grid-block\"\n            type=\"button\"\n          >\n            @for (adornment of badgeAdornments(); track $index) {\n              <ng-container\n                *ngComponentOutlet=\"adornment.component; inputs: { node: block.node }; injector: adornment.injector\"\n              />\n            }\n          </button>\n        }\n      </div>\n    }\n  </div>\n</div>\n", styles: ["@layer components{@property --et-scheduler-time-grid-hour-size{syntax: \"<length>\"; inherits: true; initial-value: 48px;}@property --et-scheduler-time-grid-gutter-size{syntax: \"<length>\"; inherits: true; initial-value: 56px;}@property --et-scheduler-time-grid-all-day-row-size{syntax: \"<length>\"; inherits: true; initial-value: 24px;}@property --et-scheduler-time-grid-body-max-height{syntax: \"<length>\"; inherits: true; initial-value: 600px;}.et-scheduler-time-grid-view{display:flex;flex-direction:column}.et-scheduler-time-grid-row{display:flex}.et-scheduler-time-grid-body{overflow-y:auto;max-block-size:var(--et-scheduler-time-grid-body-max-height)}.et-scheduler-time-grid-gutter{flex-shrink:0;inline-size:var(--et-scheduler-time-grid-gutter-size)}.et-scheduler-time-grid-days{display:grid;flex:1;grid-auto-flow:column;grid-auto-columns:1fr}.et-scheduler-time-grid-header{padding-block-end:6px;border-block-end:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-header-day{display:flex;flex-direction:column;align-items:center;gap:2px;padding-block:4px}.et-scheduler-time-grid-header-day:where([data-today]) .et-scheduler-time-grid-header-date{background:var(--et-theme-color-primary-solid);color:var(--et-theme-color-on-primary)}.et-scheduler-time-grid-header-weekday{font-size:12px;font-weight:600;color:var(--et-surface-color-muted-solid)}.et-scheduler-time-grid-header-date{display:inline-flex;align-items:center;justify-content:center;inline-size:22px;block-size:22px;border-radius:999px;font-size:13px;font-variant-numeric:tabular-nums;color:var(--et-surface-color-solid)}.et-scheduler-time-grid-all-day{padding-block:4px;border-block-end:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-all-day-lane{position:relative;flex:1;min-block-size:calc(var(--_et-scheduler-time-grid-all-day-row-count, 0) * var(--et-scheduler-time-grid-all-day-row-size))}.et-scheduler-time-grid-all-day-entry{position:absolute;inset-block-start:calc(var(--_et-scheduler-time-grid-all-day-row, 0) * var(--et-scheduler-time-grid-all-day-row-size));inset-inline-start:calc(var(--_et-scheduler-time-grid-all-day-offset, 0) * 1%);inline-size:calc(var(--_et-scheduler-time-grid-all-day-size, 100) * 1% - 4px);block-size:calc(var(--et-scheduler-time-grid-all-day-row-size) - 2px)}.et-scheduler-time-grid-hour-row{box-sizing:border-box;block-size:var(--et-scheduler-time-grid-hour-size);border-block-end:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-body .et-scheduler-time-grid-gutter .et-scheduler-time-grid-hour-row{display:flex;align-items:flex-start;justify-content:flex-end;padding-inline-end:8px;border-block-end:none}.et-scheduler-time-grid-hour-label{inline-size:max-content;transform:translateY(-50%);font-size:11px;font-variant-numeric:tabular-nums;color:var(--et-surface-color-muted-solid)}.et-scheduler-time-grid-body .et-scheduler-time-grid-days{border-inline-start:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-day{position:relative;border-inline-end:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-day:where([data-today]){background:color-mix(in srgb,var(--et-theme-color-primary-solid) 6%,transparent)}.et-scheduler-time-grid-block{position:absolute;inset-block-start:calc(var(--_et-scheduler-time-grid-block-offset, 0) * 1%);inset-inline-start:calc(var(--_et-scheduler-time-grid-block-inline-offset, 0) * 1%);block-size:calc(var(--_et-scheduler-time-grid-block-span, 0) * 1%);inline-size:calc(var(--_et-scheduler-time-grid-block-inline-size, 100) * 1% - 2px);min-block-size:16px;display:flex;align-items:flex-start;gap:6px;overflow:hidden;padding:2px 6px;padding-inline-start:calc(min(var(--_et-scheduler-time-grid-block-depth, 0),4)*6px + 6px);border:none;border-radius:4px;background:color-mix(in srgb,var(--et-theme-color-primary-solid) 14%,transparent);color:var(--et-theme-color-ink-solid);font:inherit;font-size:12px;text-align:start;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.et-scheduler-time-grid-block .et-scheduler-appointment-dot{margin-block-start:4px}@media(hover:hover){.et-scheduler-time-grid-block:hover{background:color-mix(in srgb,var(--et-theme-color-primary-solid) 22%,transparent)}}.et-scheduler-time-grid-block:focus-visible{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:1px}.et-scheduler-time-grid-block:where([data-selected]){background:var(--et-theme-color-primary-solid);color:var(--et-theme-color-on-primary)}}\n"], dependencies: [{ kind: "directive", type: ProvideColorDirective, selector: "[etProvideColor]", inputs: ["etProvideColor"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerTimeGridViewComponent, decorators: [{
             type: Component,
             args: [{ selector: 'et-scheduler-time-grid-view', encapsulation: ViewEncapsulation.None, imports: [ProvideColorDirective, NgComponentOutlet], hostDirectives: [SchedulerTimeGridDirective], host: {
                         class: 'et-scheduler-time-grid-view',
-                    }, template: "<div class=\"et-scheduler-time-grid-row et-scheduler-time-grid-header\" role=\"row\">\n  <div class=\"et-scheduler-time-grid-gutter\"></div>\n\n  <div class=\"et-scheduler-time-grid-days\">\n    @for (day of grid.days(); track day.date.getTime()) {\n      <div [attr.data-today]=\"day.today ? '' : null\" class=\"et-scheduler-time-grid-header-day\" role=\"columnheader\">\n        <span class=\"et-scheduler-time-grid-header-weekday\">{{ weekdayLabel(day.date) }}</span>\n        <span class=\"et-scheduler-time-grid-header-date\">{{ day.date.getDate() }}</span>\n      </div>\n    }\n  </div>\n</div>\n\n@if (grid.allDayRowCount() > 0) {\n  <div class=\"et-scheduler-time-grid-row et-scheduler-time-grid-all-day\" role=\"row\">\n    <div class=\"et-scheduler-time-grid-gutter\"></div>\n\n    <div\n      [style.--_et-scheduler-time-grid-all-day-row-count]=\"grid.allDayRowCount()\"\n      class=\"et-scheduler-time-grid-all-day-lane\"\n      role=\"gridcell\"\n    >\n      @for (entry of grid.allDay(); track entry.node.appointment.id) {\n        <button\n          [style.--_et-scheduler-time-grid-all-day-offset]=\"entry.inlineOffset\"\n          [style.--_et-scheduler-time-grid-all-day-size]=\"entry.inlineSize\"\n          [style.--_et-scheduler-time-grid-all-day-row]=\"entry.row\"\n          [attr.data-selected]=\"isSelected(entry.node.appointment) ? '' : null\"\n          [attr.title]=\"entry.node.appointment.title\"\n          [etProvideColor]=\"entry.node.appointment.colorToken ?? null\"\n          (click)=\"select(entry.node.appointment)\"\n          class=\"et-scheduler-appointment et-scheduler-time-grid-all-day-entry\"\n          type=\"button\"\n        >\n          @for (adornment of badgeAdornments(); track $index) {\n            <ng-container\n              *ngComponentOutlet=\"adornment.component; inputs: { node: entry.node }; injector: adornment.injector\"\n            />\n          }\n        </button>\n      }\n    </div>\n  </div>\n}\n\n<div class=\"et-scheduler-time-grid-row et-scheduler-time-grid-body\">\n  <div class=\"et-scheduler-time-grid-gutter\" role=\"presentation\">\n    @for (hour of hours(); track hour.hour) {\n      <div class=\"et-scheduler-time-grid-hour-row\">\n        <span class=\"et-scheduler-time-grid-hour-label\">{{ hour.label }}</span>\n      </div>\n    }\n  </div>\n\n  <div class=\"et-scheduler-time-grid-days\">\n    @for (day of grid.days(); track day.date.getTime()) {\n      <div [attr.data-today]=\"day.today ? '' : null\" class=\"et-scheduler-time-grid-day\" role=\"gridcell\">\n        @for (hour of hours(); track hour.hour) {\n          <div class=\"et-scheduler-time-grid-hour-row\" role=\"presentation\"></div>\n        }\n\n        @for (block of day.blocks; track block.node.appointment.id) {\n          <button\n            [style.--_et-scheduler-time-grid-block-offset]=\"block.offset\"\n            [style.--_et-scheduler-time-grid-block-span]=\"block.span\"\n            [style.--_et-scheduler-time-grid-block-inline-offset]=\"block.inlineOffset\"\n            [style.--_et-scheduler-time-grid-block-inline-size]=\"block.inlineSize\"\n            [style.--_et-scheduler-time-grid-block-depth]=\"block.node.depth\"\n            [attr.data-selected]=\"isSelected(block.node.appointment) ? '' : null\"\n            [attr.data-nested]=\"block.node.depth > 0 ? '' : null\"\n            [attr.title]=\"block.node.appointment.title\"\n            [etProvideColor]=\"block.node.appointment.colorToken ?? null\"\n            (click)=\"select(block.node.appointment)\"\n            class=\"et-scheduler-time-grid-block\"\n            type=\"button\"\n          >\n            @for (adornment of badgeAdornments(); track $index) {\n              <ng-container\n                *ngComponentOutlet=\"adornment.component; inputs: { node: block.node }; injector: adornment.injector\"\n              />\n            }\n          </button>\n        }\n      </div>\n    }\n  </div>\n</div>\n", styles: ["@layer components{@property --et-scheduler-time-grid-hour-size{syntax: \"<length>\"; inherits: true; initial-value: 48px;}@property --et-scheduler-time-grid-gutter-size{syntax: \"<length>\"; inherits: true; initial-value: 56px;}@property --et-scheduler-time-grid-all-day-row-size{syntax: \"<length>\"; inherits: true; initial-value: 24px;}.et-scheduler-time-grid-view{display:flex;flex-direction:column}.et-scheduler-time-grid-row{display:flex}.et-scheduler-time-grid-gutter{flex-shrink:0;inline-size:var(--et-scheduler-time-grid-gutter-size)}.et-scheduler-time-grid-days{display:grid;flex:1;grid-auto-flow:column;grid-auto-columns:1fr}.et-scheduler-time-grid-header{padding-block-end:6px;border-block-end:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-header-day{display:flex;flex-direction:column;align-items:center;gap:2px;padding-block:4px}.et-scheduler-time-grid-header-day:where([data-today]) .et-scheduler-time-grid-header-date{background:var(--et-theme-color-primary-solid);color:var(--et-theme-color-on-primary)}.et-scheduler-time-grid-header-weekday{font-size:12px;font-weight:600;color:var(--et-surface-color-muted-solid)}.et-scheduler-time-grid-header-date{display:inline-flex;align-items:center;justify-content:center;inline-size:22px;block-size:22px;border-radius:999px;font-size:13px;font-variant-numeric:tabular-nums;color:var(--et-surface-color-solid)}.et-scheduler-time-grid-all-day{padding-block:4px;border-block-end:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-all-day-lane{position:relative;flex:1;min-block-size:calc(var(--_et-scheduler-time-grid-all-day-row-count, 0) * var(--et-scheduler-time-grid-all-day-row-size))}.et-scheduler-time-grid-all-day-entry{position:absolute;inset-block-start:calc(var(--_et-scheduler-time-grid-all-day-row, 0) * var(--et-scheduler-time-grid-all-day-row-size));inset-inline-start:calc(var(--_et-scheduler-time-grid-all-day-offset, 0) * 1%);inline-size:calc(var(--_et-scheduler-time-grid-all-day-size, 100) * 1% - 4px);block-size:calc(var(--et-scheduler-time-grid-all-day-row-size) - 2px)}.et-scheduler-time-grid-hour-row{box-sizing:border-box;block-size:var(--et-scheduler-time-grid-hour-size);border-block-end:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-body .et-scheduler-time-grid-gutter .et-scheduler-time-grid-hour-row{display:flex;align-items:flex-start;justify-content:flex-end;padding-inline-end:8px;border-block-end:none}.et-scheduler-time-grid-hour-label{inline-size:max-content;transform:translateY(-50%);font-size:11px;font-variant-numeric:tabular-nums;color:var(--et-surface-color-muted-solid)}.et-scheduler-time-grid-body .et-scheduler-time-grid-days{border-inline-start:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-day{position:relative;border-inline-end:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-day:where([data-today]){background:color-mix(in srgb,var(--et-theme-color-primary-solid) 6%,transparent)}.et-scheduler-time-grid-block{position:absolute;inset-block-start:calc(var(--_et-scheduler-time-grid-block-offset, 0) * 1%);inset-inline-start:calc(var(--_et-scheduler-time-grid-block-inline-offset, 0) * 1%);block-size:calc(var(--_et-scheduler-time-grid-block-span, 0) * 1%);inline-size:calc(var(--_et-scheduler-time-grid-block-inline-size, 100) * 1% - 2px);min-block-size:16px;display:flex;align-items:flex-start;gap:6px;overflow:hidden;padding:2px 6px;padding-inline-start:calc(min(var(--_et-scheduler-time-grid-block-depth, 0),4)*6px + 6px);border:none;border-radius:4px;background:color-mix(in srgb,var(--et-theme-color-primary-solid) 14%,transparent);color:var(--et-theme-color-ink-solid);font:inherit;font-size:12px;text-align:start;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.et-scheduler-time-grid-block .et-scheduler-appointment-dot{margin-block-start:4px}@media(hover:hover){.et-scheduler-time-grid-block:hover{background:color-mix(in srgb,var(--et-theme-color-primary-solid) 22%,transparent)}}.et-scheduler-time-grid-block:focus-visible{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:1px}.et-scheduler-time-grid-block:where([data-selected]){background:var(--et-theme-color-primary-solid);color:var(--et-theme-color-on-primary)}}\n"] }]
-        }], ctorParameters: () => [] });
+                    }, template: "<div class=\"et-scheduler-time-grid-row et-scheduler-time-grid-header\" role=\"row\">\n  <div class=\"et-scheduler-time-grid-gutter\"></div>\n\n  <div class=\"et-scheduler-time-grid-days\">\n    @for (day of grid.days(); track day.date.getTime()) {\n      <div [attr.data-today]=\"day.today ? '' : null\" class=\"et-scheduler-time-grid-header-day\" role=\"columnheader\">\n        <span class=\"et-scheduler-time-grid-header-weekday\">{{ weekdayLabel(day.date) }}</span>\n        <span class=\"et-scheduler-time-grid-header-date\">{{ day.date.getDate() }}</span>\n      </div>\n    }\n  </div>\n</div>\n\n@if (grid.allDayRowCount() > 0) {\n  <div class=\"et-scheduler-time-grid-row et-scheduler-time-grid-all-day\" role=\"row\">\n    <div class=\"et-scheduler-time-grid-gutter\"></div>\n\n    <div\n      [style.--_et-scheduler-time-grid-all-day-row-count]=\"grid.allDayRowCount()\"\n      class=\"et-scheduler-time-grid-all-day-lane\"\n      role=\"gridcell\"\n    >\n      @for (entry of grid.allDay(); track entry.node.appointment.id) {\n        <button\n          [style.--_et-scheduler-time-grid-all-day-offset]=\"entry.inlineOffset\"\n          [style.--_et-scheduler-time-grid-all-day-size]=\"entry.inlineSize\"\n          [style.--_et-scheduler-time-grid-all-day-row]=\"entry.row\"\n          [attr.data-selected]=\"isSelected(entry.node.appointment) ? '' : null\"\n          [attr.title]=\"entry.node.appointment.title\"\n          [etProvideColor]=\"entry.node.appointment.colorToken ?? null\"\n          (click)=\"select(entry.node.appointment)\"\n          class=\"et-scheduler-appointment et-scheduler-time-grid-all-day-entry\"\n          type=\"button\"\n        >\n          @for (adornment of badgeAdornments(); track $index) {\n            <ng-container\n              *ngComponentOutlet=\"adornment.component; inputs: { node: entry.node }; injector: adornment.injector\"\n            />\n          }\n        </button>\n      }\n    </div>\n  </div>\n}\n\n<div #timeGridBody class=\"et-scheduler-time-grid-row et-scheduler-time-grid-body\">\n  <div class=\"et-scheduler-time-grid-gutter\" role=\"presentation\">\n    @for (hour of hours(); track hour.hour) {\n      <div #hourRow class=\"et-scheduler-time-grid-hour-row\">\n        <span class=\"et-scheduler-time-grid-hour-label\">{{ hour.label }}</span>\n      </div>\n    }\n  </div>\n\n  <div class=\"et-scheduler-time-grid-days\">\n    @for (day of grid.days(); track day.date.getTime()) {\n      <div [attr.data-today]=\"day.today ? '' : null\" class=\"et-scheduler-time-grid-day\" role=\"gridcell\">\n        @for (hour of hours(); track hour.hour) {\n          <div class=\"et-scheduler-time-grid-hour-row\" role=\"presentation\"></div>\n        }\n\n        @for (block of day.blocks; track block.node.appointment.id) {\n          <button\n            [style.--_et-scheduler-time-grid-block-offset]=\"block.offset\"\n            [style.--_et-scheduler-time-grid-block-span]=\"block.span\"\n            [style.--_et-scheduler-time-grid-block-inline-offset]=\"block.inlineOffset\"\n            [style.--_et-scheduler-time-grid-block-inline-size]=\"block.inlineSize\"\n            [style.--_et-scheduler-time-grid-block-depth]=\"block.node.depth\"\n            [attr.data-selected]=\"isSelected(block.node.appointment) ? '' : null\"\n            [attr.data-nested]=\"block.node.depth > 0 ? '' : null\"\n            [attr.title]=\"block.node.appointment.title\"\n            [etProvideColor]=\"block.node.appointment.colorToken ?? null\"\n            (click)=\"select(block.node.appointment)\"\n            class=\"et-scheduler-time-grid-block\"\n            type=\"button\"\n          >\n            @for (adornment of badgeAdornments(); track $index) {\n              <ng-container\n                *ngComponentOutlet=\"adornment.component; inputs: { node: block.node }; injector: adornment.injector\"\n              />\n            }\n          </button>\n        }\n      </div>\n    }\n  </div>\n</div>\n", styles: ["@layer components{@property --et-scheduler-time-grid-hour-size{syntax: \"<length>\"; inherits: true; initial-value: 48px;}@property --et-scheduler-time-grid-gutter-size{syntax: \"<length>\"; inherits: true; initial-value: 56px;}@property --et-scheduler-time-grid-all-day-row-size{syntax: \"<length>\"; inherits: true; initial-value: 24px;}@property --et-scheduler-time-grid-body-max-height{syntax: \"<length>\"; inherits: true; initial-value: 600px;}.et-scheduler-time-grid-view{display:flex;flex-direction:column}.et-scheduler-time-grid-row{display:flex}.et-scheduler-time-grid-body{overflow-y:auto;max-block-size:var(--et-scheduler-time-grid-body-max-height)}.et-scheduler-time-grid-gutter{flex-shrink:0;inline-size:var(--et-scheduler-time-grid-gutter-size)}.et-scheduler-time-grid-days{display:grid;flex:1;grid-auto-flow:column;grid-auto-columns:1fr}.et-scheduler-time-grid-header{padding-block-end:6px;border-block-end:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-header-day{display:flex;flex-direction:column;align-items:center;gap:2px;padding-block:4px}.et-scheduler-time-grid-header-day:where([data-today]) .et-scheduler-time-grid-header-date{background:var(--et-theme-color-primary-solid);color:var(--et-theme-color-on-primary)}.et-scheduler-time-grid-header-weekday{font-size:12px;font-weight:600;color:var(--et-surface-color-muted-solid)}.et-scheduler-time-grid-header-date{display:inline-flex;align-items:center;justify-content:center;inline-size:22px;block-size:22px;border-radius:999px;font-size:13px;font-variant-numeric:tabular-nums;color:var(--et-surface-color-solid)}.et-scheduler-time-grid-all-day{padding-block:4px;border-block-end:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-all-day-lane{position:relative;flex:1;min-block-size:calc(var(--_et-scheduler-time-grid-all-day-row-count, 0) * var(--et-scheduler-time-grid-all-day-row-size))}.et-scheduler-time-grid-all-day-entry{position:absolute;inset-block-start:calc(var(--_et-scheduler-time-grid-all-day-row, 0) * var(--et-scheduler-time-grid-all-day-row-size));inset-inline-start:calc(var(--_et-scheduler-time-grid-all-day-offset, 0) * 1%);inline-size:calc(var(--_et-scheduler-time-grid-all-day-size, 100) * 1% - 4px);block-size:calc(var(--et-scheduler-time-grid-all-day-row-size) - 2px)}.et-scheduler-time-grid-hour-row{box-sizing:border-box;block-size:var(--et-scheduler-time-grid-hour-size);border-block-end:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-body .et-scheduler-time-grid-gutter .et-scheduler-time-grid-hour-row{display:flex;align-items:flex-start;justify-content:flex-end;padding-inline-end:8px;border-block-end:none}.et-scheduler-time-grid-hour-label{inline-size:max-content;transform:translateY(-50%);font-size:11px;font-variant-numeric:tabular-nums;color:var(--et-surface-color-muted-solid)}.et-scheduler-time-grid-body .et-scheduler-time-grid-days{border-inline-start:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-day{position:relative;border-inline-end:1px solid var(--et-surface-border-solid)}.et-scheduler-time-grid-day:where([data-today]){background:color-mix(in srgb,var(--et-theme-color-primary-solid) 6%,transparent)}.et-scheduler-time-grid-block{position:absolute;inset-block-start:calc(var(--_et-scheduler-time-grid-block-offset, 0) * 1%);inset-inline-start:calc(var(--_et-scheduler-time-grid-block-inline-offset, 0) * 1%);block-size:calc(var(--_et-scheduler-time-grid-block-span, 0) * 1%);inline-size:calc(var(--_et-scheduler-time-grid-block-inline-size, 100) * 1% - 2px);min-block-size:16px;display:flex;align-items:flex-start;gap:6px;overflow:hidden;padding:2px 6px;padding-inline-start:calc(min(var(--_et-scheduler-time-grid-block-depth, 0),4)*6px + 6px);border:none;border-radius:4px;background:color-mix(in srgb,var(--et-theme-color-primary-solid) 14%,transparent);color:var(--et-theme-color-ink-solid);font:inherit;font-size:12px;text-align:start;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.et-scheduler-time-grid-block .et-scheduler-appointment-dot{margin-block-start:4px}@media(hover:hover){.et-scheduler-time-grid-block:hover{background:color-mix(in srgb,var(--et-theme-color-primary-solid) 22%,transparent)}}.et-scheduler-time-grid-block:focus-visible{outline:2px solid var(--et-theme-color-primary-solid);outline-offset:1px}.et-scheduler-time-grid-block:where([data-selected]){background:var(--et-theme-color-primary-solid);color:var(--et-theme-color-on-primary)}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { timeGridBody: [{ type: i0.ViewChild, args: ['timeGridBody', { isSignal: true }] }], firstHourRow: [{ type: i0.ViewChild, args: ['hourRow', { isSignal: true }] }] } });
 
 class SchedulerComponent {
     constructor() {
@@ -52741,6 +53716,10 @@ class SchedulerComponent {
          */
         this.headless = inject(SchedulerDirective);
         this.elementRef = inject(ElementRef);
+        /** Emits the edited or newly-added appointment once the default edit surface saves. */
+        this.appointmentSave = output();
+        /** Emits every id to remove once the default edit surface deletes a chain. */
+        this.appointmentsDelete = output();
         this.previousLabel = computed(() => this.labels().previous, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "previousLabel" }] : /* istanbul ignore next */ []));
         this.nextLabel = computed(() => this.labels().next, /* @ts-ignore */
@@ -52786,11 +53765,56 @@ class SchedulerComponent {
             .filter((adornment) => adornment.enabled?.() ?? true)
             .sort((a, b) => (a.order ?? 0) - (b.order ?? 0)), /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "badgeAdornments" }] : /* istanbul ignore next */ []));
+        // UI contributed by toolbar features (just "Add appointment" today) - rendered in the header
+        // alongside the built-in nav controls. Same registration story as the badge adornments above.
+        this.toolbarActionList = signal([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "toolbarActionList" }] : /* istanbul ignore next */ []));
+        this.toolbarActions = computed(() => this.toolbarActionList()
+            .filter((action) => action.enabled?.() ?? true)
+            .sort((a, b) => (a.order ?? 0) - (b.order ?? 0)), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "toolbarActions" }] : /* istanbul ignore next */ []));
+        /**
+         * Opens `<et-scheduler-edit-surface>` for the selected appointment - covers the zero-config
+         * case (no feature directives applied) per the plan. Its result bubbles as `appointmentSave` /
+         * `appointmentsDelete`, and closing always clears `selectedAppointmentId` back to `null` so
+         * clicking the same appointment again reopens a fresh surface.
+         */
+        this.editSurfaceOpener = createOverlayOpener(SCHEDULER_EDIT_SURFACE_OVERLAY, {
+            afterClosed: (result) => {
+                if (result?.kind === 'save') {
+                    this.appointmentSave.emit(result.appointment);
+                }
+                else if (result?.kind === 'delete') {
+                    this.appointmentsDelete.emit(result.ids);
+                }
+                this.headless.selectedAppointmentId.set(null);
+            },
+        });
+        effect(() => {
+            const appointment = this.headless.selectedAppointment();
+            if (!appointment) {
+                return;
+            }
+            untracked(() => this.openEditSurface(appointment));
+        });
     }
     /** Bound to the view-switch's `(valueChange)` - safe to cast since every `<et-segmented-button>` below carries a `SchedulerView` literal. */
     setView(value) {
         this.headless.view.set(value);
     }
+    /**
+     * Synthesizes a brand-new, blank top-level appointment - anchored to `focusedDate` so it lands
+     * in whatever period is currently in view, defaulting to the next hour if that's today, else a
+     * business-hours 9am - and opens the edit surface for it. Run by the built-in
+     * `etSchedulerActionAddAppointment` toolbar action; call directly to trigger the same flow from
+     * your own UI (`<et-scheduler #s>` then `s.addAppointment()`).
+     */
+    addAppointment() {
+        const day = startOfDay(this.headless.focusedDate());
+        const hour = isSameDay(day, new Date()) ? Math.min(23, new Date().getHours() + 1) : 9;
+        const start = setMinutes(setHours(day, hour), 0);
+        this.openEditSurface({ id: randomId(), parentId: null, title: '', start, end: addHours(start, 1) });
+    }
     /** The scheduler's own element. Part of the feature contract (a feature is a directive on it). */
     get element() {
         return this.elementRef.nativeElement;
@@ -52810,8 +53834,23 @@ class SchedulerComponent {
     registerBadgeAdornment(adornment) {
         this.badgeAdornmentList.update((list) => [...list, adornment]);
     }
+    /** Part of the feature contract - see `SchedulerFeatureHost`. */
+    registerToolbarAction(action) {
+        this.toolbarActionList.update((list) => [...list, action]);
+    }
+    openEditSurface(appointment) {
+        this.editSurfaceOpener.open({
+            bindings: [
+                inputBinding('appointment', () => appointment),
+                inputBinding('appointments', () => this.headless.appointments()),
+            ],
+        });
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: SchedulerComponent, isStandalone: true, selector: "et-scheduler", host: { classAttribute: "et-scheduler" }, providers: [provideIcons(CHEVRON_ICON), { provide: SCHEDULER_FEATURE_HOST, useExisting: SchedulerComponent }], hostDirectives: [{ directive: SchedulerDirective, inputs: ["appointments", "appointments", "view", "view", "focusedDate", "focusedDate", "selectedAppointmentId", "selectedAppointmentId", "locale", "locale", "firstDayOfWeek", "firstDayOfWeek"], outputs: ["viewChange", "viewChange", "focusedDateChange", "focusedDateChange", "selectedAppointmentIdChange", "selectedAppointmentIdChange"] }, { directive: SchedulerBadgeColorDotDirective, inputs: ["etSchedulerBadgeColorDot", "etSchedulerBadgeColorDot"] }, { directive: SchedulerBadgeTitleDirective, inputs: ["etSchedulerBadgeTitle", "etSchedulerBadgeTitle"] }, { directive: SchedulerBadgeTimeRangeDirective, inputs: ["etSchedulerBadgeTimeRange", "etSchedulerBadgeTimeRange"] }, { directive: SchedulerBadgeLocationDirective, inputs: ["etSchedulerBadgeLocation", "etSchedulerBadgeLocation"] }, { directive: SchedulerBadgeChainCountDirective, inputs: ["etSchedulerBadgeChainCount", "etSchedulerBadgeChainCount"] }], ngImport: i0, template: "<div class=\"et-scheduler-header\">\n  <button\n    (click)=\"headless.goToToday()\"\n    class=\"et-scheduler-today-button\"\n    et-button\n    size=\"sm\"\n    variant=\"outline\"\n    type=\"button\"\n  >\n    {{ todayLabel() }}\n  </button>\n\n  <div class=\"et-scheduler-nav-buttons\">\n    <button\n      [attr.aria-label]=\"previousLabel()\"\n      (click)=\"headless.previous()\"\n      class=\"et-scheduler-nav-button et-scheduler-nav-button--previous\"\n      et-icon-button\n      size=\"sm\"\n      type=\"button\"\n    >\n      <i etIcon=\"et-chevron\"></i>\n    </button>\n\n    <button\n      [attr.aria-label]=\"nextLabel()\"\n      (click)=\"headless.next()\"\n      class=\"et-scheduler-nav-button et-scheduler-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  <span class=\"et-scheduler-header-label\">{{ headerLabel() }}</span>\n\n  <div class=\"et-scheduler-header-spacer\"></div>\n\n  <et-segmented-button-group [value]=\"headless.view()\" (valueChange)=\"setView($event)\" size=\"sm\" variant=\"tabs\">\n    <et-label class=\"et-scheduler-view-switch-label\">{{ switchViewLabel() }}</et-label>\n\n    <et-segmented-button value=\"month\">{{ monthViewLabel() }}</et-segmented-button>\n    <et-segmented-button value=\"week\">{{ weekViewLabel() }}</et-segmented-button>\n    <et-segmented-button value=\"day\">{{ dayViewLabel() }}</et-segmented-button>\n    <et-segmented-button value=\"agenda\">{{ agendaViewLabel() }}</et-segmented-button>\n  </et-segmented-button-group>\n</div>\n\n<div class=\"et-scheduler-body\">\n  @switch (headless.view()) {\n    @case ('week') {\n      <et-scheduler-time-grid-view />\n    }\n    @case ('day') {\n      <et-scheduler-time-grid-view />\n    }\n    @case ('agenda') {\n      <et-scheduler-agenda-view />\n    }\n    @default {\n      <et-scheduler-month-view />\n    }\n  }\n</div>\n", styles: ["@layer components{.et-scheduler{display:flex;flex-direction:column;gap:12px}.et-scheduler-header{display:flex;align-items:center;gap:8px}.et-scheduler-nav-buttons{display:flex;gap:2px}.et-scheduler-nav-button--previous .et-icon{rotate:-90deg}.et-scheduler-nav-button--next .et-icon{rotate:90deg}.et-scheduler-header-label{font-size:15px;font-weight:600;color:var(--et-surface-color-solid)}.et-scheduler-header-spacer{flex:1}.et-scheduler-view-switch-label{position:absolute;inline-size:1px;block-size:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.et-scheduler-body{display:flex;flex:1;flex-direction:column}}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "[et-button]", inputs: ["variant", "size", "iconAlignment"] }, { kind: "component", type: IconButtonComponent, selector: "[et-icon-button]", inputs: ["variant", "size"] }, { kind: "component", type: SegmentedButtonGroupComponent, selector: "et-segmented-button-group", inputs: ["size", "variant"] }, { kind: "component", type: SegmentedButtonComponent, selector: "et-segmented-button" }, { kind: "component", type: LabelDirective, selector: "et-label" }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor", "label"] }, { kind: "component", type: SchedulerAgendaViewComponent, selector: "et-scheduler-agenda-view" }, { kind: "component", type: SchedulerMonthViewComponent, selector: "et-scheduler-month-view" }, { kind: "component", type: SchedulerTimeGridViewComponent, selector: "et-scheduler-time-grid-view" }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: SchedulerComponent, isStandalone: true, selector: "et-scheduler", outputs: { appointmentSave: "appointmentSave", appointmentsDelete: "appointmentsDelete" }, host: { classAttribute: "et-scheduler" }, providers: [
+            provideIcons(CHEVRON_ICON, PLUS_ICON),
+            { provide: SCHEDULER_FEATURE_HOST, useExisting: SchedulerComponent },
+        ], hostDirectives: [{ directive: SchedulerDirective, inputs: ["appointments", "appointments", "view", "view", "focusedDate", "focusedDate", "selectedAppointmentId", "selectedAppointmentId", "locale", "locale", "firstDayOfWeek", "firstDayOfWeek"], outputs: ["viewChange", "viewChange", "focusedDateChange", "focusedDateChange", "selectedAppointmentIdChange", "selectedAppointmentIdChange"] }, { directive: SchedulerBadgeColorDotDirective, inputs: ["etSchedulerBadgeColorDot", "etSchedulerBadgeColorDot"] }, { directive: SchedulerBadgeTitleDirective, inputs: ["etSchedulerBadgeTitle", "etSchedulerBadgeTitle"] }, { directive: SchedulerBadgeTimeRangeDirective, inputs: ["etSchedulerBadgeTimeRange", "etSchedulerBadgeTimeRange"] }, { directive: SchedulerBadgeLocationDirective, inputs: ["etSchedulerBadgeLocation", "etSchedulerBadgeLocation"] }, { directive: SchedulerBadgeChainCountDirective, inputs: ["etSchedulerBadgeChainCount", "etSchedulerBadgeChainCount"] }, { directive: SchedulerActionAddAppointmentDirective, inputs: ["etSchedulerActionAddAppointment", "etSchedulerActionAddAppointment"] }], ngImport: i0, template: "<div class=\"et-scheduler-header\">\n  <button\n    (click)=\"headless.goToToday()\"\n    class=\"et-scheduler-today-button\"\n    et-button\n    size=\"sm\"\n    variant=\"outline\"\n    type=\"button\"\n  >\n    {{ todayLabel() }}\n  </button>\n\n  @for (action of toolbarActions(); track $index) {\n    <button (click)=\"action.run()\" class=\"et-scheduler-toolbar-action\" et-button size=\"sm\" type=\"button\">\n      @if (action.icon) {\n        <i [etIcon]=\"action.icon\" aria-hidden=\"true\"></i>\n      }\n      {{ action.label() }}\n    </button>\n  }\n\n  <div class=\"et-scheduler-nav-buttons\">\n    <button\n      [attr.aria-label]=\"previousLabel()\"\n      (click)=\"headless.previous()\"\n      class=\"et-scheduler-nav-button et-scheduler-nav-button--previous\"\n      et-icon-button\n      size=\"sm\"\n      type=\"button\"\n    >\n      <i etIcon=\"et-chevron\"></i>\n    </button>\n\n    <button\n      [attr.aria-label]=\"nextLabel()\"\n      (click)=\"headless.next()\"\n      class=\"et-scheduler-nav-button et-scheduler-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  <span class=\"et-scheduler-header-label\">{{ headerLabel() }}</span>\n\n  <div class=\"et-scheduler-header-spacer\"></div>\n\n  <et-segmented-button-group\n    [value]=\"headless.view()\"\n    (valueChange)=\"setView($event)\"\n    class=\"et-scheduler-view-switch\"\n    size=\"sm\"\n    variant=\"tabs\"\n  >\n    <et-label class=\"et-scheduler-view-switch-label\">{{ switchViewLabel() }}</et-label>\n\n    <et-segmented-button value=\"month\">{{ monthViewLabel() }}</et-segmented-button>\n    <et-segmented-button value=\"week\">{{ weekViewLabel() }}</et-segmented-button>\n    <et-segmented-button value=\"day\">{{ dayViewLabel() }}</et-segmented-button>\n    <et-segmented-button value=\"agenda\">{{ agendaViewLabel() }}</et-segmented-button>\n  </et-segmented-button-group>\n</div>\n\n<div class=\"et-scheduler-body\">\n  @switch (headless.view()) {\n    @case ('week') {\n      <et-scheduler-time-grid-view />\n    }\n    @case ('day') {\n      <et-scheduler-time-grid-view />\n    }\n    @case ('agenda') {\n      <et-scheduler-agenda-view />\n    }\n    @default {\n      <et-scheduler-month-view />\n    }\n  }\n</div>\n", styles: ["@layer components{.et-scheduler{container-type:inline-size;container-name:et-scheduler;display:flex;flex-direction:column;gap:12px}.et-scheduler-header{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.et-scheduler-view-switch{flex-basis:100%}@container et-scheduler (min-inline-size: 480px){.et-scheduler-header-spacer{display:block}.et-scheduler-view-switch{flex-basis:auto}}.et-scheduler-nav-buttons{display:flex;gap:2px}.et-scheduler-nav-button--previous .et-icon{rotate:-90deg}.et-scheduler-nav-button--next .et-icon{rotate:90deg}.et-scheduler-header-label{flex:1 1 auto;min-inline-size:0;overflow:hidden;font-size:15px;font-weight:600;color:var(--et-surface-color-solid);white-space:nowrap;text-overflow:ellipsis}.et-scheduler-header-spacer{display:none;flex:1}.et-scheduler-view-switch-label{position:absolute;inline-size:1px;block-size:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.et-scheduler-body{display:flex;flex:1;flex-direction:column}}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "[et-button]", inputs: ["variant", "size", "iconAlignment"] }, { kind: "component", type: IconButtonComponent, selector: "[et-icon-button]", inputs: ["variant", "size"] }, { kind: "component", type: SegmentedButtonGroupComponent, selector: "et-segmented-button-group", inputs: ["size", "variant"] }, { kind: "component", type: SegmentedButtonComponent, selector: "et-segmented-button" }, { kind: "component", type: LabelDirective, selector: "et-label" }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor", "label"] }, { kind: "component", type: SchedulerAgendaViewComponent, selector: "et-scheduler-agenda-view" }, { kind: "component", type: SchedulerMonthViewComponent, selector: "et-scheduler-month-view" }, { kind: "component", type: SchedulerTimeGridViewComponent, selector: "et-scheduler-time-grid-view" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SchedulerComponent, decorators: [{
             type: Component,
@@ -52823,7 +53862,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                         SchedulerAgendaViewComponent,
                         SchedulerMonthViewComponent,
                         SchedulerTimeGridViewComponent,
-                    ], providers: [provideIcons(CHEVRON_ICON), { provide: SCHEDULER_FEATURE_HOST, useExisting: SchedulerComponent }], hostDirectives: [
+                    ], providers: [
+                        provideIcons(CHEVRON_ICON, PLUS_ICON),
+                        { provide: SCHEDULER_FEATURE_HOST, useExisting: SchedulerComponent },
+                    ], hostDirectives: [
                         {
                             directive: SchedulerDirective,
                             inputs: ['appointments', 'view', 'focusedDate', 'selectedAppointmentId', 'locale', 'firstDayOfWeek'],
@@ -52837,16 +53879,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                         { directive: SchedulerBadgeTimeRangeDirective, inputs: ['etSchedulerBadgeTimeRange'] },
                         { directive: SchedulerBadgeLocationDirective, inputs: ['etSchedulerBadgeLocation'] },
                         { directive: SchedulerBadgeChainCountDirective, inputs: ['etSchedulerBadgeChainCount'] },
+                        { directive: SchedulerActionAddAppointmentDirective, inputs: ['etSchedulerActionAddAppointment'] },
                     ], host: {
                         class: 'et-scheduler',
-                    }, template: "<div class=\"et-scheduler-header\">\n  <button\n    (click)=\"headless.goToToday()\"\n    class=\"et-scheduler-today-button\"\n    et-button\n    size=\"sm\"\n    variant=\"outline\"\n    type=\"button\"\n  >\n    {{ todayLabel() }}\n  </button>\n\n  <div class=\"et-scheduler-nav-buttons\">\n    <button\n      [attr.aria-label]=\"previousLabel()\"\n      (click)=\"headless.previous()\"\n      class=\"et-scheduler-nav-button et-scheduler-nav-button--previous\"\n      et-icon-button\n      size=\"sm\"\n      type=\"button\"\n    >\n      <i etIcon=\"et-chevron\"></i>\n    </button>\n\n    <button\n      [attr.aria-label]=\"nextLabel()\"\n      (click)=\"headless.next()\"\n      class=\"et-scheduler-nav-button et-scheduler-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  <span class=\"et-scheduler-header-label\">{{ headerLabel() }}</span>\n\n  <div class=\"et-scheduler-header-spacer\"></div>\n\n  <et-segmented-button-group [value]=\"headless.view()\" (valueChange)=\"setView($event)\" size=\"sm\" variant=\"tabs\">\n    <et-label class=\"et-scheduler-view-switch-label\">{{ switchViewLabel() }}</et-label>\n\n    <et-segmented-button value=\"month\">{{ monthViewLabel() }}</et-segmented-button>\n    <et-segmented-button value=\"week\">{{ weekViewLabel() }}</et-segmented-button>\n    <et-segmented-button value=\"day\">{{ dayViewLabel() }}</et-segmented-button>\n    <et-segmented-button value=\"agenda\">{{ agendaViewLabel() }}</et-segmented-button>\n  </et-segmented-button-group>\n</div>\n\n<div class=\"et-scheduler-body\">\n  @switch (headless.view()) {\n    @case ('week') {\n      <et-scheduler-time-grid-view />\n    }\n    @case ('day') {\n      <et-scheduler-time-grid-view />\n    }\n    @case ('agenda') {\n      <et-scheduler-agenda-view />\n    }\n    @default {\n      <et-scheduler-month-view />\n    }\n  }\n</div>\n", styles: ["@layer components{.et-scheduler{display:flex;flex-direction:column;gap:12px}.et-scheduler-header{display:flex;align-items:center;gap:8px}.et-scheduler-nav-buttons{display:flex;gap:2px}.et-scheduler-nav-button--previous .et-icon{rotate:-90deg}.et-scheduler-nav-button--next .et-icon{rotate:90deg}.et-scheduler-header-label{font-size:15px;font-weight:600;color:var(--et-surface-color-solid)}.et-scheduler-header-spacer{flex:1}.et-scheduler-view-switch-label{position:absolute;inline-size:1px;block-size:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.et-scheduler-body{display:flex;flex:1;flex-direction:column}}\n"] }]
-        }] });
+                    }, template: "<div class=\"et-scheduler-header\">\n  <button\n    (click)=\"headless.goToToday()\"\n    class=\"et-scheduler-today-button\"\n    et-button\n    size=\"sm\"\n    variant=\"outline\"\n    type=\"button\"\n  >\n    {{ todayLabel() }}\n  </button>\n\n  @for (action of toolbarActions(); track $index) {\n    <button (click)=\"action.run()\" class=\"et-scheduler-toolbar-action\" et-button size=\"sm\" type=\"button\">\n      @if (action.icon) {\n        <i [etIcon]=\"action.icon\" aria-hidden=\"true\"></i>\n      }\n      {{ action.label() }}\n    </button>\n  }\n\n  <div class=\"et-scheduler-nav-buttons\">\n    <button\n      [attr.aria-label]=\"previousLabel()\"\n      (click)=\"headless.previous()\"\n      class=\"et-scheduler-nav-button et-scheduler-nav-button--previous\"\n      et-icon-button\n      size=\"sm\"\n      type=\"button\"\n    >\n      <i etIcon=\"et-chevron\"></i>\n    </button>\n\n    <button\n      [attr.aria-label]=\"nextLabel()\"\n      (click)=\"headless.next()\"\n      class=\"et-scheduler-nav-button et-scheduler-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  <span class=\"et-scheduler-header-label\">{{ headerLabel() }}</span>\n\n  <div class=\"et-scheduler-header-spacer\"></div>\n\n  <et-segmented-button-group\n    [value]=\"headless.view()\"\n    (valueChange)=\"setView($event)\"\n    class=\"et-scheduler-view-switch\"\n    size=\"sm\"\n    variant=\"tabs\"\n  >\n    <et-label class=\"et-scheduler-view-switch-label\">{{ switchViewLabel() }}</et-label>\n\n    <et-segmented-button value=\"month\">{{ monthViewLabel() }}</et-segmented-button>\n    <et-segmented-button value=\"week\">{{ weekViewLabel() }}</et-segmented-button>\n    <et-segmented-button value=\"day\">{{ dayViewLabel() }}</et-segmented-button>\n    <et-segmented-button value=\"agenda\">{{ agendaViewLabel() }}</et-segmented-button>\n  </et-segmented-button-group>\n</div>\n\n<div class=\"et-scheduler-body\">\n  @switch (headless.view()) {\n    @case ('week') {\n      <et-scheduler-time-grid-view />\n    }\n    @case ('day') {\n      <et-scheduler-time-grid-view />\n    }\n    @case ('agenda') {\n      <et-scheduler-agenda-view />\n    }\n    @default {\n      <et-scheduler-month-view />\n    }\n  }\n</div>\n", styles: ["@layer components{.et-scheduler{container-type:inline-size;container-name:et-scheduler;display:flex;flex-direction:column;gap:12px}.et-scheduler-header{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.et-scheduler-view-switch{flex-basis:100%}@container et-scheduler (min-inline-size: 480px){.et-scheduler-header-spacer{display:block}.et-scheduler-view-switch{flex-basis:auto}}.et-scheduler-nav-buttons{display:flex;gap:2px}.et-scheduler-nav-button--previous .et-icon{rotate:-90deg}.et-scheduler-nav-button--next .et-icon{rotate:90deg}.et-scheduler-header-label{flex:1 1 auto;min-inline-size:0;overflow:hidden;font-size:15px;font-weight:600;color:var(--et-surface-color-solid);white-space:nowrap;text-overflow:ellipsis}.et-scheduler-header-spacer{display:none;flex:1}.et-scheduler-view-switch-label{position:absolute;inline-size:1px;block-size:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.et-scheduler-body{display:flex;flex:1;flex-direction:column}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { appointmentSave: [{ type: i0.Output, args: ["appointmentSave"] }], appointmentsDelete: [{ type: i0.Output, args: ["appointmentsDelete"] }] } });
 
 const SCHEDULER_IMPORTS = [
     SchedulerDirective,
     SchedulerAgendaDirective,
     SchedulerMonthDirective,
     SchedulerTimeGridDirective,
+    SchedulerEditSurfaceDirective,
     SchedulerComponent,
     SchedulerAgendaViewComponent,
     SchedulerMonthViewComponent,
@@ -52856,6 +53900,15 @@ const SCHEDULER_IMPORTS = [
     SchedulerBadgeTimeRangeDirective,
     SchedulerBadgeLocationDirective,
     SchedulerBadgeChainCountDirective,
+    SchedulerEditSurfaceComponent,
+    SchedulerEditTitleDirective,
+    SchedulerEditTimeRangeDirective,
+    SchedulerEditLocationDirective,
+    SchedulerEditDescriptionDirective,
+    SchedulerEditColorDirective,
+    SchedulerActionAddSubAppointmentDirective,
+    SchedulerActionDeleteDirective,
+    SchedulerActionAddAppointmentDirective,
 ];
 
 /** The built-in English labels. */
@@ -63750,9 +64803,785 @@ const TAB_IMPORTS = [TabGroupComponent, TabComponent, TabLabelDirective];
 
 const TOOLTIP_IMPORTS = [TooltipDirective, TooltipComponent];
 
+// codes 4600-4699
+const TREE_ERROR_CODES = {
+    /** An `[etTree]` was rendered without a `[dataSource]`, so it has nothing to show. */
+    MISSING_DATA_SOURCE: 4600,
+    /** A tree part (`etTreeNode`, `etTreeNodeDef`) was used outside an `[etTree]`. */
+    PART_OUTSIDE_TREE: 4601,
+};
+
+/** Whether a node can be expanded - false for explicit leaves and `hasChildren: false`. */
+const canExpand = (node) => node.isLeaf !== true && node.hasChildren !== false;
+const defaultCompareWith = (a, b) => a === b;
+/** Value equality between two nodes via the configured comparator. `null` matches only `null`. */
+const nodesEqual = (options) => {
+    const { a, b, compareWith } = options;
+    if (a === null || b === null) {
+        return a === b;
+    }
+    return compareWith(a.value, b.value);
+};
+/** Normalizes a `loadChildren` result (array | Promise | Observable) into an Observable. */
+const toChildrenObservable = (result) => {
+    if (Array.isArray(result)) {
+        return of(result);
+    }
+    if (isObservable(result)) {
+        return result;
+    }
+    return from(result);
+};
+
+const TREE_SELECTION_MODES = {
+    /** Rows never select. Expansion, focus and `activated` still work - a pure navigation tree. */
+    NONE: 'none',
+    /** At most one selected node; `value` is `T | null`. */
+    SINGLE: 'single',
+    /** Any number of selected nodes; `value` is `T[]`, and activating a row toggles it. */
+    MULTIPLE: 'multiple',
+};
+const TREE_LEVEL_STATUSES = {
+    /** Not requested yet - a collapsed branch's children start here. */
+    IDLE: 'idle',
+    LOADING: 'loading',
+    LOADED: 'loaded',
+    ERROR: 'error',
+};
+
+/**
+ * An ARIA tree over a lazily loaded hierarchy: owns the expansion state, the selection, roving focus
+ * and the keyboard model, and flattens the whole thing into the list of rows a template renders
+ * ({@link visibleRows}). No visual opinion - bring your own template, or use the default `et-tree`.
+ *
+ * Children are loaded per branch through the {@link TreeDataSource}, the first time that branch is
+ * expanded, so a deep or remote hierarchy costs only what the user actually opens. Every node is
+ * identified by its `value`, which therefore has to be unique across the tree.
+ *
+ * Rows are rendered flat rather than nested, which is why each one carries `level`, `posInSet` and
+ * `setSize` - a flat DOM has to state those for assistive tech.
+ *
+ * @example
+ * <div [dataSource]="source" [(value)]="selected" etTree #tree="etTree">
+ *   @for (row of tree.visibleRows(); track row.node) {
+ *     <div [row]="row" etTreeNode>{{ row.node.label }}</div>
+ *   }
+ * </div>
+ */
+class TreeDirective {
+    constructor() {
+        this.hostElement = injectHostElement();
+        /** The hierarchical source the tree renders. Required. */
+        this.dataSource = input(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "dataSource" }] : /* istanbul ignore next */ []));
+        /** Value equality - override when node values are objects. */
+        this.compareWith = input(defaultCompareWith, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "compareWith" }] : /* istanbul ignore next */ []));
+        /** Whether rows select, and how many at a time. @default 'single' */
+        this.selectionMode = input(TREE_SELECTION_MODES.SINGLE, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "selectionMode" }] : /* istanbul ignore next */ []));
+        /** The selected value: `T | null` in single mode, `T[]` in multiple. Two-way bindable. */
+        this.value = model(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+        /**
+         * The values of the expanded branches. Two-way bindable, and the tree's only expansion state - nothing
+         * is inferred from the data, so an expansion set can be persisted and restored as-is.
+         *
+         * Values that match no node are ignored rather than pruned, so a set restored before its branch has
+         * loaded still opens once the node arrives.
+         */
+        this.expandedValues = model([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "expandedValues" }] : /* istanbul ignore next */ []));
+        /** Refuse to expand, select or move focus. Rows are marked `aria-disabled` and keep their DOM order. */
+        this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+        /**
+         * Turns a `loadChildren` failure into the message shown on the branch that failed. The default shows an
+         * `Error`'s `message` verbatim and a generic fallback for anything else.
+         */
+        this.toErrorMessage = input((error) => (error instanceof Error && error.message) || 'Something went wrong', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "toErrorMessage" }] : /* istanbul ignore next */ []));
+        /** A row was activated - clicked, or Enter'd. Fires for branches and leaves alike. */
+        this.nodeActivate = output();
+        this.levels = signal([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "levels" }] : /* istanbul ignore next */ []));
+        this.registeredNodes = signal([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "registeredNodes" }] : /* istanbul ignore next */ []));
+        /** @internal The `etTreeNodeDef` row template, when one is projected. */
+        this.nodeTemplate = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "nodeTemplate" }] : /* istanbul ignore next */ []));
+        /**
+         * The node holding roving focus, once the user has moved it. A row writes it on `focusin`, so the tab
+         * stop stays where the user left it and Shift+Tab re-enters there.
+         */
+        this.focusedNode = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "focusedNode" }] : /* istanbul ignore next */ []));
+        /**
+         * The flattened tree: every row that is currently visible, in DOM order - the root's children plus
+         * the loaded children of every expanded branch below them.
+         */
+        this.visibleRows = computed(() => {
+            const compareWith = this.compareWith();
+            const levels = this.levels();
+            const expanded = this.expandedValues();
+            const rows = [];
+            const levelOf = (parent) => levels.find((level) => nodesEqual({ a: level.parent, b: parent, compareWith })) ?? null;
+            // `seen` guards against a malformed source whose branch contains its own value, which would
+            // otherwise recurse until the stack gives out
+            const walk = (options) => {
+                const { parent, level, path, seen } = options;
+                const entry = levelOf(parent);
+                if (!entry)
+                    return;
+                entry.nodes.forEach((node, index) => {
+                    const isExpandable = canExpand(node);
+                    const children = isExpandable ? levelOf(node) : null;
+                    const isExpanded = isExpandable && expanded.some((value) => compareWith(value, node.value));
+                    const nodePath = [...path, node];
+                    rows.push({
+                        node,
+                        level,
+                        path: nodePath,
+                        isExpandable,
+                        isExpanded,
+                        isDisabled: node.disabled === true,
+                        childrenStatus: children?.status ?? TREE_LEVEL_STATUSES.IDLE,
+                        childrenError: children?.error ?? null,
+                        posInSet: index + 1,
+                        setSize: entry.nodes.length,
+                    });
+                    if (isExpanded && !seen.some((value) => compareWith(value, node.value))) {
+                        walk({ parent: node, level: level + 1, path: nodePath, seen: [...seen, node.value] });
+                    }
+                });
+            };
+            walk({ parent: null, level: 1, path: [], seen: [] });
+            return rows;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "visibleRows" }] : /* istanbul ignore next */ []));
+        /** Load state of the root level - what a tree shows a loading or empty state for. */
+        this.rootStatus = computed(() => this.levelOf(null)?.status ?? TREE_LEVEL_STATUSES.IDLE, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "rootStatus" }] : /* istanbul ignore next */ []));
+        /** The message from a failed root load, or `null`. */
+        this.rootError = computed(() => this.levelOf(null)?.error ?? null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "rootError" }] : /* istanbul ignore next */ []));
+        /** The selected values, normalized to an array (empty for no selection). */
+        this.values = computed(() => {
+            const value = this.value();
+            if (Array.isArray(value)) {
+                return value;
+            }
+            return value === null || value === undefined ? [] : [value];
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "values" }] : /* istanbul ignore next */ []));
+        /**
+         * The row that owns the tree's single tab stop: the focused node while it is still visible, else the
+         * first row. A tree is one tab stop with the arrow keys moving inside it, so exactly one row is
+         * tabbable at any time.
+         */
+        this.activeNode = computed(() => {
+            const rows = this.visibleRows();
+            const focused = this.focusedNode();
+            const compareWith = this.compareWith();
+            if (focused && rows.some((row) => compareWith(row.node.value, focused.value))) {
+                return focused;
+            }
+            return rows[0]?.node ?? null;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "activeNode" }] : /* istanbul ignore next */ []));
+        // type-to-focus by label across the visible rows - a deep tree cannot be navigated by name otherwise
+        this.typeahead = createTypeahead();
+        // Every branch that needs loading right now: the root, plus each expanded branch whose children
+        // have not been requested yet. Expansion is therefore the only trigger a load ever needs - an
+        // `expandedValues` set that was restored from storage loads its branches exactly like a click does.
+        const idleParents = computed(() => {
+            if (!this.dataSource())
+                return [];
+            const parents = [];
+            if (this.rootStatus() === TREE_LEVEL_STATUSES.IDLE) {
+                parents.push(null);
+            }
+            for (const row of this.visibleRows()) {
+                if (row.isExpanded && row.childrenStatus === TREE_LEVEL_STATUSES.IDLE) {
+                    parents.push(row.node);
+                }
+            }
+            return parents;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "idleParents" }] : /* istanbul ignore next */ []));
+        // created here rather than inside the switchMap below, which is not an injection context
+        const idleParents$ = toObservable(idleParents);
+        toObservable(this.dataSource)
+            .pipe(switchMap((source) => {
+            // a swapped source describes a different tree - drop what was learned from the old one, and
+            // let switchMap cancel its in-flight loads so a late response cannot write into the new tree
+            untracked(() => {
+                this.levels.set([]);
+                this.focusedNode.set(null);
+            });
+            if (!source)
+                return EMPTY;
+            // mergeMap, not switchMap: sibling branches expanded in quick succession all load
+            return idleParents$.pipe(mergeMap((parents) => merge(...parents.map((parent) => this.load(source, parent)))));
+        }), takeUntilDestroyed())
+            .subscribe();
+        inject(DestroyRef).onDestroy(() => this.typeahead.destroy());
+        if (ngDevMode) {
+            afterNextRender(() => {
+                if (!this.dataSource()) {
+                    throw new RuntimeError(TREE_ERROR_CODES.MISSING_DATA_SOURCE, '[TreeDirective] A [dataSource] is required - without one the tree has nothing to load. ' +
+                        'Bind an object with a loadChildren(parent) method.', { element: this.hostElement });
+                }
+            });
+        }
+    }
+    /** Whether a node is expanded. */
+    isExpanded(node) {
+        const compareWith = this.compareWith();
+        return this.expandedValues().some((value) => compareWith(value, node.value));
+    }
+    /** Whether a node is selected. */
+    isSelected(node) {
+        const compareWith = this.compareWith();
+        return this.values().some((value) => compareWith(value, node.value));
+    }
+    /** Expand a branch, loading its children if this is the first time. No-op on leaves and disabled nodes. */
+    expand(node) {
+        if (this.disabled() || node.disabled || !canExpand(node) || this.isExpanded(node))
+            return;
+        this.expandedValues.update((values) => [...values, node.value]);
+    }
+    /** Collapse a branch. Its children stay loaded, so re-expanding it is instant. */
+    collapse(node) {
+        if (this.disabled())
+            return;
+        const compareWith = this.compareWith();
+        this.expandedValues.update((values) => values.filter((value) => !compareWith(value, node.value)));
+    }
+    toggleExpansion(node) {
+        if (this.isExpanded(node)) {
+            this.collapse(node);
+        }
+        else {
+            this.expand(node);
+        }
+    }
+    /**
+     * Expand every branch loaded so far. On a lazy source that is one level deeper than what is currently
+     * visible: call it again once the newly loaded branches arrive to keep going.
+     */
+    expandAll() {
+        if (this.disabled())
+            return;
+        const compareWith = this.compareWith();
+        const expandable = this.levels()
+            .flatMap((level) => level.nodes)
+            .filter((node) => canExpand(node) && !node.disabled);
+        this.expandedValues.update((values) => [
+            ...values,
+            ...expandable.filter((node) => !values.some((value) => compareWith(value, node.value))).map((node) => node.value),
+        ]);
+    }
+    collapseAll() {
+        if (this.disabled())
+            return;
+        this.expandedValues.set([]);
+    }
+    /** Reload a branch's children - what a failed load is retried with. Pass `null` for the root. */
+    retry(parent) {
+        this.setLevel(parent, { status: TREE_LEVEL_STATUSES.IDLE, nodes: [], error: null });
+    }
+    /** Select a node. No-op while `selectionMode` is `'none'`. */
+    select(node) {
+        if (this.disabled() || node.disabled || this.selectionMode() === TREE_SELECTION_MODES.NONE)
+            return;
+        if (this.selectionMode() === TREE_SELECTION_MODES.MULTIPLE) {
+            if (this.isSelected(node))
+                return;
+            this.value.set([...this.values(), node.value]);
+            return;
+        }
+        this.value.set(node.value);
+    }
+    deselect(node) {
+        if (this.disabled() || !this.isSelected(node))
+            return;
+        const compareWith = this.compareWith();
+        if (this.selectionMode() === TREE_SELECTION_MODES.MULTIPLE) {
+            this.value.set(this.values().filter((value) => !compareWith(value, node.value)));
+            return;
+        }
+        this.value.set(null);
+    }
+    /** Multiple mode: add the node to the selection, or remove it when already selected. */
+    toggleSelection(node) {
+        if (this.isSelected(node)) {
+            this.deselect(node);
+        }
+        else {
+            this.select(node);
+        }
+    }
+    clearSelection() {
+        this.value.set(this.selectionMode() === TREE_SELECTION_MODES.MULTIPLE ? [] : null);
+    }
+    /**
+     * What a click or Enter on a row does: move roving focus there, retry a branch whose children failed to
+     * load, otherwise expand/collapse it, and apply the selection for the current mode. Always emits
+     * {@link nodeActivate}, so a leaf can be "opened" without being selected.
+     */
+    activate(node) {
+        if (this.disabled() || node.disabled)
+            return;
+        this.focusNode(node);
+        const row = this.rowOf(node);
+        if (row?.childrenError) {
+            this.retry(node);
+        }
+        else if (canExpand(node)) {
+            this.toggleExpansion(node);
+        }
+        if (this.selectionMode() === TREE_SELECTION_MODES.MULTIPLE) {
+            this.toggleSelection(node);
+        }
+        else {
+            this.select(node);
+        }
+        this.nodeActivate.emit(node);
+    }
+    /** Move roving focus - and DOM focus, when the row is rendered - to a node. */
+    focusNode(node) {
+        this.focusedNode.set(node);
+        const compareWith = this.compareWith();
+        const element = this.registeredNodes().find((registered) => compareWith(registered.row().node.value, node.value))
+            ?.elementRef.nativeElement;
+        if (!element)
+            return;
+        element.focus({ preventScroll: true });
+        element.scrollIntoView?.({ block: 'nearest', inline: 'nearest' });
+    }
+    /** Move focus to the tree's first row - where a fresh Tab lands. */
+    focusFirst() {
+        const first = this.visibleRows()[0]?.node;
+        if (first) {
+            this.focusNode(first);
+        }
+    }
+    /** @internal Called from a node's constructor; the registration is undone when the row is destroyed. */
+    registerNode(node) {
+        this.registeredNodes.update((nodes) => [...nodes, node]);
+        inject(DestroyRef).onDestroy(() => this.registeredNodes.update((nodes) => nodes.filter((candidate) => candidate !== node)));
+    }
+    /** @internal Routes a row's keydown through the tree navigation model. */
+    handleNodeKeydown(event, node) {
+        if (event.ctrlKey || event.metaKey || event.altKey || this.disabled())
+            return;
+        const rows = this.visibleRows();
+        const compareWith = this.compareWith();
+        const index = rows.findIndex((row) => compareWith(row.node.value, node.value));
+        const row = rows[index];
+        if (!row)
+            return;
+        // ArrowRight/ArrowLeft expand and collapse, which means they follow the writing direction
+        const rtl = getComputedStyle(this.hostElement).direction === 'rtl';
+        const expandKey = rtl ? 'ArrowLeft' : 'ArrowRight';
+        const collapseKey = rtl ? 'ArrowRight' : 'ArrowLeft';
+        switch (event.key) {
+            case 'ArrowDown':
+                event.preventDefault();
+                this.focusRow(rows, index + 1);
+                return;
+            case 'ArrowUp':
+                event.preventDefault();
+                this.focusRow(rows, index - 1);
+                return;
+            case 'Home':
+                event.preventDefault();
+                this.focusRow(rows, 0);
+                return;
+            case 'End':
+                event.preventDefault();
+                this.focusRow(rows, rows.length - 1);
+                return;
+            case expandKey:
+                event.preventDefault();
+                if (row.isExpandable && !row.isExpanded) {
+                    this.expand(node);
+                }
+                else if (row.isExpanded && rows[index + 1]?.level === row.level + 1) {
+                    this.focusRow(rows, index + 1);
+                }
+                return;
+            case collapseKey:
+                event.preventDefault();
+                if (row.isExpanded) {
+                    this.collapse(node);
+                    return;
+                }
+                // to the parent - the closest row above that sits one level up
+                for (let candidate = index - 1; candidate >= 0; candidate--) {
+                    if (rows[candidate]?.level === row.level - 1) {
+                        this.focusRow(rows, candidate);
+                        return;
+                    }
+                }
+                return;
+            case 'Enter':
+                event.preventDefault();
+                this.activate(node);
+                return;
+            case ' ':
+                if (this.selectionMode() === TREE_SELECTION_MODES.NONE)
+                    return;
+                event.preventDefault();
+                if (this.selectionMode() === TREE_SELECTION_MODES.MULTIPLE) {
+                    this.toggleSelection(node);
+                }
+                else {
+                    this.select(node);
+                }
+                return;
+            case '*':
+                event.preventDefault();
+                this.expandSiblings(rows, row);
+                return;
+        }
+        if (event.key.length !== 1)
+            return;
+        const query = this.typeahead.append(event.key);
+        // start after the focused row and wrap, so repeating a letter walks through the matches
+        const match = rows
+            .slice(index + 1)
+            .concat(rows.slice(0, index + 1))
+            .find((candidate) => !candidate.isDisabled && candidate.node.label.toLowerCase().startsWith(query));
+        if (match) {
+            event.preventDefault();
+            this.focusNode(match.node);
+        }
+    }
+    levelOf(parent) {
+        const compareWith = this.compareWith();
+        return this.levels().find((level) => nodesEqual({ a: level.parent, b: parent, compareWith })) ?? null;
+    }
+    rowOf(node) {
+        const compareWith = this.compareWith();
+        return this.visibleRows().find((row) => compareWith(row.node.value, node.value)) ?? null;
+    }
+    focusRow(rows, index) {
+        const row = rows[Math.max(0, Math.min(rows.length - 1, index))];
+        if (row) {
+            this.focusNode(row.node);
+        }
+    }
+    /** `*` expands every branch at the focused row's level that shares its parent. */
+    expandSiblings(rows, row) {
+        const compareWith = this.compareWith();
+        const parent = row.path[row.path.length - 2] ?? null;
+        for (const candidate of rows) {
+            if (candidate.level === row.level &&
+                nodesEqual({ a: candidate.path[candidate.path.length - 2] ?? null, b: parent, compareWith })) {
+                this.expand(candidate.node);
+            }
+        }
+    }
+    load(source, parent) {
+        // The request was queued from a state that has since changed - the source was swapped, or the
+        // branch collapsed again while `toObservable` was still holding this list. Reading the current
+        // set is what keeps a re-emission from loading the same branch twice.
+        if (!this.isIdle(parent))
+            return EMPTY;
+        this.setLevel(parent, { status: TREE_LEVEL_STATUSES.LOADING, nodes: [], error: null });
+        // defer, so a `loadChildren` that throws on the spot fails the branch like a rejected load
+        // rather than tearing down the whole pipeline
+        return defer(() => toChildrenObservable(source.loadChildren(parent))).pipe(take(1), tap({
+            next: (nodes) => this.setLevel(parent, { status: TREE_LEVEL_STATUSES.LOADED, nodes, error: null }),
+            error: (error) => this.setLevel(parent, {
+                status: TREE_LEVEL_STATUSES.ERROR,
+                nodes: [],
+                error: this.toErrorMessage()(error),
+            }),
+        }), catchError(() => EMPTY));
+    }
+    isIdle(parent) {
+        const level = this.levelOf(parent);
+        if (level !== null && level.status !== TREE_LEVEL_STATUSES.IDLE) {
+            return false;
+        }
+        return parent === null || this.isExpanded(parent);
+    }
+    setLevel(parent, state) {
+        const compareWith = this.compareWith();
+        this.levels.update((levels) => [
+            ...levels.filter((level) => !nodesEqual({ a: level.parent, b: parent, compareWith })),
+            { parent, ...state },
+        ]);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: TreeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: TreeDirective, isStandalone: true, selector: "[etTree]", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, expandedValues: { classPropertyName: "expandedValues", publicName: "expandedValues", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, toErrorMessage: { classPropertyName: "toErrorMessage", publicName: "toErrorMessage", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", expandedValues: "expandedValuesChange", nodeActivate: "nodeActivate" }, host: { attributes: { "role": "tree" }, properties: { "attr.aria-multiselectable": "selectionMode() === \"multiple\" ? \"true\" : null", "attr.aria-busy": "rootStatus() === \"loading\" ? \"true\" : null", "attr.data-disabled": "disabled() || null" } }, exportAs: ["etTree"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: TreeDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[etTree]',
+                    exportAs: 'etTree',
+                    host: {
+                        role: 'tree',
+                        '[attr.aria-multiselectable]': 'selectionMode() === "multiple" ? "true" : null',
+                        '[attr.aria-busy]': 'rootStatus() === "loading" ? "true" : null',
+                        '[attr.data-disabled]': 'disabled() || null',
+                    },
+                }]
+        }], ctorParameters: () => [], propDecorators: { dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: false }] }], compareWith: [{ type: i0.Input, args: [{ isSignal: true, alias: "compareWith", required: false }] }], selectionMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionMode", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], expandedValues: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandedValues", required: false }] }, { type: i0.Output, args: ["expandedValuesChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], toErrorMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "toErrorMessage", required: false }] }], nodeActivate: [{ type: i0.Output, args: ["nodeActivate"] }] } });
+
+/**
+ * A single row of a tree. Bind the {@link TreeRow} it represents; the directive wires the ARIA tree
+ * semantics (including the position values a flat DOM has to state), the roving tab stop and the
+ * interaction, and mirrors the row's state as `data-*` attributes for styling.
+ *
+ * @example
+ * @for (row of tree.visibleRows(); track row.node) {
+ *   <div [row]="row" etTreeNode>{{ row.node.label }}</div>
+ * }
+ */
+class TreeNodeDirective {
+    constructor() {
+        this.tree = inject(TreeDirective, { optional: true });
+        /** @internal The element the tree moves DOM focus to when roving focus lands on this row. */
+        this.elementRef = inject(ElementRef);
+        /** The row this element renders - one entry of the tree's `visibleRows()`. */
+        this.row = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "row" }] : /* istanbul ignore next */ []));
+        this.selectionMode = computed(() => this.tree?.selectionMode() ?? 'none', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "selectionMode" }] : /* istanbul ignore next */ []));
+        this.selected = computed(() => this.tree?.isSelected(this.row().node) ?? false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "selected" }] : /* istanbul ignore next */ []));
+        this.disabled = computed(() => this.row().isDisabled || (this.tree?.disabled() ?? false), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+        this.active = computed(() => {
+            const active = this.tree?.activeNode();
+            if (!active || !this.tree)
+                return false;
+            return this.tree.compareWith()(active.value, this.row().node.value);
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
+        this.tree?.registerNode(this);
+        if (ngDevMode) {
+            afterNextRender(() => {
+                if (!this.tree) {
+                    throw new RuntimeError(TREE_ERROR_CODES.PART_OUTSIDE_TREE, '[TreeNodeDirective] etTreeNode must be placed inside an [etTree] element (e.g. <et-tree>).', { element: this.elementRef.nativeElement });
+                }
+            });
+        }
+    }
+    handleClick() {
+        this.tree?.activate(this.row().node);
+    }
+    handleKeydown(event) {
+        this.tree?.handleNodeKeydown(event, this.row().node);
+    }
+    handleFocusIn() {
+        this.tree?.focusedNode.set(this.row().node);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: TreeNodeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: TreeNodeDirective, isStandalone: true, selector: "[etTreeNode]", inputs: { row: { classPropertyName: "row", publicName: "row", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "role": "treeitem" }, listeners: { "click": "handleClick()", "keydown": "handleKeydown($event)", "focusin": "handleFocusIn()" }, properties: { "attr.aria-level": "row().level", "attr.aria-posinset": "row().posInSet", "attr.aria-setsize": "row().setSize", "attr.aria-expanded": "row().isExpandable ? row().isExpanded : null", "attr.aria-selected": "selectionMode() === \"none\" ? null : selected()", "attr.aria-disabled": "disabled() || null", "attr.aria-busy": "row().childrenStatus === \"loading\" ? \"true\" : null", "attr.tabindex": "active() ? 0 : -1", "attr.data-selected": "selected() || null", "attr.data-expanded": "row().isExpanded || null", "attr.data-branch": "row().isExpandable || null", "attr.data-disabled": "disabled() || null", "attr.data-error": "row().childrenError !== null || null" } }, exportAs: ["etTreeNode"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: TreeNodeDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[etTreeNode]',
+                    exportAs: 'etTreeNode',
+                    host: {
+                        role: 'treeitem',
+                        '[attr.aria-level]': 'row().level',
+                        '[attr.aria-posinset]': 'row().posInSet',
+                        '[attr.aria-setsize]': 'row().setSize',
+                        '[attr.aria-expanded]': 'row().isExpandable ? row().isExpanded : null',
+                        '[attr.aria-selected]': 'selectionMode() === "none" ? null : selected()',
+                        '[attr.aria-disabled]': 'disabled() || null',
+                        '[attr.aria-busy]': 'row().childrenStatus === "loading" ? "true" : null',
+                        '[attr.tabindex]': 'active() ? 0 : -1',
+                        '[attr.data-selected]': 'selected() || null',
+                        '[attr.data-expanded]': 'row().isExpanded || null',
+                        '[attr.data-branch]': 'row().isExpandable || null',
+                        '[attr.data-disabled]': 'disabled() || null',
+                        '[attr.data-error]': 'row().childrenError !== null || null',
+                        '(click)': 'handleClick()',
+                        '(keydown)': 'handleKeydown($event)',
+                        '(focusin)': 'handleFocusIn()',
+                    },
+                }]
+        }], ctorParameters: () => [], propDecorators: { row: [{ type: i0.Input, args: [{ isSignal: true, alias: "row", required: true }] }] } });
+
+/**
+ * Replaces the default tree's plain-text row label with a template, for rows that need markup - an
+ * icon per node type, a badge, a secondary line. The node is the template's implicit value, and its
+ * full {@link TreeRow} is available as `let-row` for the level, expansion and load state.
+ *
+ * @example
+ * <et-tree [dataSource]="files">
+ *   <ng-template etTreeNodeDef let-node let-row="row">
+ *     <i [etIcon]="row.isExpandable ? 'folder' : 'file'"></i>
+ *     {{ node.label }}
+ *   </ng-template>
+ * </et-tree>
+ */
+class TreeNodeDefDirective {
+    constructor() {
+        this.hostElement = injectHostElement();
+        this.tree = inject(TreeDirective, { optional: true });
+        this.templateRef = inject(TemplateRef);
+        this.tree?.nodeTemplate.set(this);
+        inject(DestroyRef).onDestroy(() => {
+            if (this.tree?.nodeTemplate() === this) {
+                this.tree.nodeTemplate.set(null);
+            }
+        });
+        if (ngDevMode) {
+            afterNextRender(() => {
+                if (!this.tree) {
+                    throw new RuntimeError(TREE_ERROR_CODES.PART_OUTSIDE_TREE, '[TreeNodeDefDirective] etTreeNodeDef must be placed inside an [etTree] element (e.g. <et-tree>).', { element: this.hostElement });
+                }
+            });
+        }
+    }
+    // static on purpose (the lint ban excepts it): Angular's template type checker requires the
+    // context guard to be static - it types the `let-` bindings of the host ng-template
+    static ngTemplateContextGuard(_directive, _context) {
+        return true;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: TreeNodeDefDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: TreeNodeDefDirective, isStandalone: true, selector: "ng-template[etTreeNodeDef]", exportAs: ["etTreeNodeDef"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: TreeNodeDefDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'ng-template[etTreeNodeDef]',
+                    exportAs: 'etTreeNodeDef',
+                }]
+        }], ctorParameters: () => [] });
+
+/** What the slot in front of a tree row shows. */
+const TREE_MARKERS = {
+    /** Nothing - a leaf, which keeps the slot so its label lines up with its siblings. */
+    NONE: 'none',
+    /** A collapsed or expanded branch; the rotation follows the row's `data-expanded`. */
+    CHEVRON: 'chevron',
+    /** The branch is loading its children. */
+    SPINNER: 'spinner',
+    /** The branch failed to load. */
+    WARNING: 'warning',
+};
+/**
+ * The slot in front of a tree row: its chevron, load spinner or failure mark. Its own component so
+ * that it - and not the tree - is what registers the icons it draws. A `provideIcons()` on the tree
+ * would sit above every projected row template in the injector tree and hide the consumer's own icon
+ * registration from it, since an embedded view resolves DI from where it is inserted.
+ */
+class TreeMarkerComponent {
+    constructor() {
+        this.marker = input(TREE_MARKERS.NONE, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "marker" }] : /* istanbul ignore next */ []));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: TreeMarkerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: TreeMarkerComponent, isStandalone: true, selector: "et-tree-marker", inputs: { marker: { classPropertyName: "marker", publicName: "marker", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "aria-hidden": "true" }, classAttribute: "et-tree-node-marker" }, providers: [provideIcons(CHEVRON_ICON, TRIANGLE_EXCLAMATION_ICON)], ngImport: i0, template: `
+    @switch (marker()) {
+      @case ('spinner') {
+        <et-spinner [diameter]="12" />
+      }
+      @case ('warning') {
+        <i class="et-tree-node-warning" etIcon="et-triangle-exclamation"></i>
+      }
+      @case ('chevron') {
+        <i class="et-tree-node-chevron" etIcon="et-chevron"></i>
+      }
+    }
+  `, isInline: true, dependencies: [{ kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor", "label"] }, { kind: "component", type: SpinnerComponent, selector: "et-spinner", inputs: ["diameter", "strokeWidth", "track", "value", "determinate"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: TreeMarkerComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'et-tree-marker',
+                    template: `
+    @switch (marker()) {
+      @case ('spinner') {
+        <et-spinner [diameter]="12" />
+      }
+      @case ('warning') {
+        <i class="et-tree-node-warning" etIcon="et-triangle-exclamation"></i>
+      }
+      @case ('chevron') {
+        <i class="et-tree-node-chevron" etIcon="et-chevron"></i>
+      }
+    }
+  `,
+                    encapsulation: ViewEncapsulation.None,
+                    imports: [IconDirective, SpinnerComponent],
+                    providers: [provideIcons(CHEVRON_ICON, TRIANGLE_EXCLAMATION_ICON)],
+                    host: {
+                        class: 'et-tree-node-marker',
+                        'aria-hidden': 'true',
+                    },
+                }]
+        }], propDecorators: { marker: [{ type: i0.Input, args: [{ isSignal: true, alias: "marker", required: false }] }] } });
+
+const markerFor = (row) => {
+    if (row.childrenStatus === 'loading')
+        return TREE_MARKERS.SPINNER;
+    if (row.childrenError !== null)
+        return TREE_MARKERS.WARNING;
+    return row.isExpandable ? TREE_MARKERS.CHEVRON : TREE_MARKERS.NONE;
+};
+/**
+ * The default tree: an indented, themed, keyboard-navigable rendering of a hierarchy, driven by the
+ * headless {@link TreeDirective}. Rows show their label; project an `<ng-template etTreeNodeDef>` to
+ * render them with markup instead.
+ *
+ * Branches load their children the first time they expand, so binding a lazy `[dataSource]` needs no
+ * extra wiring - a branch that is still loading shows a spinner in place of its chevron, and one whose
+ * load failed shows the message and reloads when selected again.
+ *
+ * @example
+ * <et-tree [dataSource]="categories" [(value)]="categoryId" [(expandedValues)]="openBranches" />
+ */
+class TreeComponent {
+    constructor() {
+        this.tree = inject(TreeDirective);
+        /** Shown while the root level loads. */
+        this.loadingLabel = input('Loading…', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "loadingLabel" }] : /* istanbul ignore next */ []));
+        /** Shown when the root level loaded no nodes at all. */
+        this.emptyLabel = input('Nothing to show', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "emptyLabel" }] : /* istanbul ignore next */ []));
+        /** Appended to a failed level's message, to say that selecting the row loads it again. */
+        this.retryLabel = input('select to retry', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "retryLabel" }] : /* istanbul ignore next */ []));
+        /**
+         * The rows plus their marker and template context, built together so each row's context object
+         * survives change detection instead of being rebuilt on every pass.
+         */
+        this.rows = computed(() => this.tree.visibleRows().map((row) => ({ row, marker: markerFor(row), context: { $implicit: row.node, row } })), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: TreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: TreeComponent, isStandalone: true, selector: "et-tree", inputs: { loadingLabel: { classPropertyName: "loadingLabel", publicName: "loadingLabel", isSignal: true, isRequired: false, transformFunction: null }, emptyLabel: { classPropertyName: "emptyLabel", publicName: "emptyLabel", isSignal: true, isRequired: false, transformFunction: null }, retryLabel: { classPropertyName: "retryLabel", publicName: "retryLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-tree" }, hostDirectives: [{ directive: TreeDirective, inputs: ["dataSource", "dataSource", "compareWith", "compareWith", "selectionMode", "selectionMode", "value", "value", "expandedValues", "expandedValues", "disabled", "disabled", "toErrorMessage", "toErrorMessage"], outputs: ["valueChange", "valueChange", "expandedValuesChange", "expandedValuesChange", "nodeActivate", "nodeActivate"] }], ngImport: i0, template: "@for (entry of rows(); track entry.row.node) {\n  <div [row]=\"entry.row\" [style.--_et-tree-node-depth]=\"entry.row.level - 1\" class=\"et-tree-node\" etTreeNode>\n    <et-tree-marker [marker]=\"entry.marker\" />\n\n    <span class=\"et-tree-node-label\">\n      @if (tree.nodeTemplate(); as nodeTemplate) {\n        <ng-container [ngTemplateOutlet]=\"nodeTemplate.templateRef\" [ngTemplateOutletContext]=\"entry.context\" />\n      } @else {\n        {{ entry.row.node.label }}\n      }\n    </span>\n\n    @if (entry.row.childrenError; as error) {\n      <span class=\"et-tree-node-error\">{{ error }} \u00B7 {{ retryLabel() }}</span>\n    }\n  </div>\n}\n\n<!-- The status lines are `treeitem`s rather than plain text: everything inside a `role=\"tree\"` has to be\n     one. The error line is also the retry control - selecting it reloads, the same way activating a\n     branch whose children failed does. -->\n@if (tree.rootStatus() === 'loading') {\n  <div class=\"et-tree-status\" aria-disabled=\"true\" aria-level=\"1\" aria-selected=\"false\" role=\"treeitem\">\n    <et-tree-marker marker=\"spinner\" />\n    {{ loadingLabel() }}\n  </div>\n} @else if (tree.rootError(); as error) {\n  <div\n    (click)=\"tree.retry(null)\"\n    (keydown.enter)=\"tree.retry(null)\"\n    class=\"et-tree-status et-tree-status--error\"\n    aria-level=\"1\"\n    aria-selected=\"false\"\n    role=\"treeitem\"\n    tabindex=\"0\"\n  >\n    <et-tree-marker marker=\"warning\" />\n    {{ error }} \u00B7 {{ retryLabel() }}\n  </div>\n} @else if (!rows().length) {\n  <div class=\"et-tree-status\" aria-disabled=\"true\" aria-level=\"1\" aria-selected=\"false\" role=\"treeitem\">\n    {{ emptyLabel() }}\n  </div>\n}\n", styles: ["@layer components{@property --et-tree-indent{syntax: \"<length>\"; inherits: true; initial-value: 18px;}@property --et-tree-node-padding-block{syntax: \"<length>\"; inherits: true; initial-value: 5px;}@property --et-tree-node-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-tree-node-gap{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-tree-node-radius{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-tree-marker-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-tree-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --_et-tree-node-depth{syntax: \"<number>\"; inherits: false; initial-value: 0;}.et-tree{display:block;color:var(--et-surface-color-solid, CanvasText)}.et-tree-node,.et-tree-status{display:flex;align-items:center;gap:var(--et-tree-node-gap);padding-block:var(--et-tree-node-padding-block);padding-inline:calc(var(--et-tree-node-padding-inline) + var(--_et-tree-node-depth) * var(--et-tree-indent)) var(--et-tree-node-padding-inline);border-radius:var(--et-tree-node-radius);box-sizing:border-box}.et-tree-node-marker{display:flex;flex:none;align-items:center;justify-content:center;inline-size:var(--et-tree-marker-size);block-size:var(--et-tree-marker-size);color:var(--et-surface-color-muted-solid, GrayText)}.et-tree-node-marker .et-tree-node-chevron{inline-size:100%;block-size:100%;rotate:90deg;transition:rotate var(--et-tree-duration) cubic-bezier(.25,0,.1,1)}.et-tree-node{cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color var(--et-tree-duration) ease}.et-tree-node .et-tree-node-label{flex:1;min-inline-size:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.et-tree-node .et-tree-node-error{flex:none;color:var(--et-tree-error-color, var(--et-surface-color-muted-solid, GrayText));font-size:.875em}.et-tree-node:where([data-expanded]) .et-tree-node-chevron{rotate:180deg}.et-tree-node:dir(rtl) .et-tree-node-chevron{rotate:-90deg}.et-tree-node:dir(rtl):where([data-expanded]) .et-tree-node-chevron{rotate:180deg}.et-tree-node:where([data-error]) .et-tree-node-marker{color:var(--et-tree-error-color, var(--et-surface-color-muted-solid, GrayText))}.et-tree-node:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, gray) 7%,transparent)}.et-tree-node:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, gray) 14%,transparent)}.et-tree-node:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:-2px}.et-tree-node:where([data-selected]){background:color-mix(in srgb,var(--et-theme-color-primary-solid, gray) 16%,transparent);color:var(--et-theme-color-ink-solid, inherit)}.et-tree-node:where([data-selected]):hover{background:color-mix(in srgb,var(--et-theme-color-primary-solid, gray) 24%,transparent)}.et-tree-node:where([data-selected]):active{background:color-mix(in srgb,var(--et-theme-color-primary-solid, gray) 32%,transparent)}.et-tree-node:where([aria-disabled]){color:var(--et-surface-color-muted-solid, GrayText);cursor:default}.et-tree-node:where([aria-disabled]):hover,.et-tree-node:where([aria-disabled]):active{background:transparent}.et-tree:where([aria-multiselectable]) .et-tree-node:after{content:\"\";flex:none;inline-size:4px;block-size:8px;margin-inline:3px;border:solid var(--et-theme-color-primary-solid, currentColor);border-width:0 2px 2px 0;rotate:45deg;opacity:0;transition:opacity var(--et-tree-duration) ease}.et-tree:where([aria-multiselectable]) .et-tree-node:where([data-selected]){background:color-mix(in srgb,var(--et-theme-color-primary-solid, gray) 8%,transparent);color:inherit}.et-tree:where([aria-multiselectable]) .et-tree-node:where([data-selected]):after{opacity:1}.et-tree:where([aria-multiselectable]) .et-tree-node:where([data-selected]):hover{background:color-mix(in srgb,var(--et-theme-color-primary-solid, gray) 14%,transparent)}.et-tree:where([aria-multiselectable]) .et-tree-node:where([data-selected]):active{background:color-mix(in srgb,var(--et-theme-color-primary-solid, gray) 20%,transparent)}.et-tree-status{color:var(--et-surface-color-muted-solid, GrayText)}.et-tree-status:where(.et-tree-status--error){color:var(--et-tree-error-color, var(--et-surface-color-muted-solid, GrayText));cursor:pointer}.et-tree-status:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:-2px}@media(prefers-reduced-motion:reduce){.et-tree-node,.et-tree-node:after,.et-tree-node .et-tree-node-chevron{transition:none}}}\n"], dependencies: [{ kind: "directive", type: TreeNodeDirective, selector: "[etTreeNode]", inputs: ["row"], exportAs: ["etTreeNode"] }, { kind: "component", type: TreeMarkerComponent, selector: "et-tree-marker", inputs: ["marker"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: TreeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'et-tree', encapsulation: ViewEncapsulation.None, imports: [TreeNodeDirective, TreeMarkerComponent, NgTemplateOutlet], hostDirectives: [
+                        {
+                            directive: TreeDirective,
+                            inputs: ['dataSource', 'compareWith', 'selectionMode', 'value', 'expandedValues', 'disabled', 'toErrorMessage'],
+                            outputs: ['valueChange', 'expandedValuesChange', 'nodeActivate'],
+                        },
+                    ], host: {
+                        class: 'et-tree',
+                    }, template: "@for (entry of rows(); track entry.row.node) {\n  <div [row]=\"entry.row\" [style.--_et-tree-node-depth]=\"entry.row.level - 1\" class=\"et-tree-node\" etTreeNode>\n    <et-tree-marker [marker]=\"entry.marker\" />\n\n    <span class=\"et-tree-node-label\">\n      @if (tree.nodeTemplate(); as nodeTemplate) {\n        <ng-container [ngTemplateOutlet]=\"nodeTemplate.templateRef\" [ngTemplateOutletContext]=\"entry.context\" />\n      } @else {\n        {{ entry.row.node.label }}\n      }\n    </span>\n\n    @if (entry.row.childrenError; as error) {\n      <span class=\"et-tree-node-error\">{{ error }} \u00B7 {{ retryLabel() }}</span>\n    }\n  </div>\n}\n\n<!-- The status lines are `treeitem`s rather than plain text: everything inside a `role=\"tree\"` has to be\n     one. The error line is also the retry control - selecting it reloads, the same way activating a\n     branch whose children failed does. -->\n@if (tree.rootStatus() === 'loading') {\n  <div class=\"et-tree-status\" aria-disabled=\"true\" aria-level=\"1\" aria-selected=\"false\" role=\"treeitem\">\n    <et-tree-marker marker=\"spinner\" />\n    {{ loadingLabel() }}\n  </div>\n} @else if (tree.rootError(); as error) {\n  <div\n    (click)=\"tree.retry(null)\"\n    (keydown.enter)=\"tree.retry(null)\"\n    class=\"et-tree-status et-tree-status--error\"\n    aria-level=\"1\"\n    aria-selected=\"false\"\n    role=\"treeitem\"\n    tabindex=\"0\"\n  >\n    <et-tree-marker marker=\"warning\" />\n    {{ error }} \u00B7 {{ retryLabel() }}\n  </div>\n} @else if (!rows().length) {\n  <div class=\"et-tree-status\" aria-disabled=\"true\" aria-level=\"1\" aria-selected=\"false\" role=\"treeitem\">\n    {{ emptyLabel() }}\n  </div>\n}\n", styles: ["@layer components{@property --et-tree-indent{syntax: \"<length>\"; inherits: true; initial-value: 18px;}@property --et-tree-node-padding-block{syntax: \"<length>\"; inherits: true; initial-value: 5px;}@property --et-tree-node-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-tree-node-gap{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-tree-node-radius{syntax: \"<length>\"; inherits: true; initial-value: 6px;}@property --et-tree-marker-size{syntax: \"<length>\"; inherits: true; initial-value: 12px;}@property --et-tree-duration{syntax: \"<time>\"; inherits: true; initial-value: .15s;}@property --_et-tree-node-depth{syntax: \"<number>\"; inherits: false; initial-value: 0;}.et-tree{display:block;color:var(--et-surface-color-solid, CanvasText)}.et-tree-node,.et-tree-status{display:flex;align-items:center;gap:var(--et-tree-node-gap);padding-block:var(--et-tree-node-padding-block);padding-inline:calc(var(--et-tree-node-padding-inline) + var(--_et-tree-node-depth) * var(--et-tree-indent)) var(--et-tree-node-padding-inline);border-radius:var(--et-tree-node-radius);box-sizing:border-box}.et-tree-node-marker{display:flex;flex:none;align-items:center;justify-content:center;inline-size:var(--et-tree-marker-size);block-size:var(--et-tree-marker-size);color:var(--et-surface-color-muted-solid, GrayText)}.et-tree-node-marker .et-tree-node-chevron{inline-size:100%;block-size:100%;rotate:90deg;transition:rotate var(--et-tree-duration) cubic-bezier(.25,0,.1,1)}.et-tree-node{cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color var(--et-tree-duration) ease}.et-tree-node .et-tree-node-label{flex:1;min-inline-size:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.et-tree-node .et-tree-node-error{flex:none;color:var(--et-tree-error-color, var(--et-surface-color-muted-solid, GrayText));font-size:.875em}.et-tree-node:where([data-expanded]) .et-tree-node-chevron{rotate:180deg}.et-tree-node:dir(rtl) .et-tree-node-chevron{rotate:-90deg}.et-tree-node:dir(rtl):where([data-expanded]) .et-tree-node-chevron{rotate:180deg}.et-tree-node:where([data-error]) .et-tree-node-marker{color:var(--et-tree-error-color, var(--et-surface-color-muted-solid, GrayText))}.et-tree-node:hover{background:color-mix(in srgb,var(--et-surface-interaction-solid, gray) 7%,transparent)}.et-tree-node:active{background:color-mix(in srgb,var(--et-surface-interaction-solid, gray) 14%,transparent)}.et-tree-node:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:-2px}.et-tree-node:where([data-selected]){background:color-mix(in srgb,var(--et-theme-color-primary-solid, gray) 16%,transparent);color:var(--et-theme-color-ink-solid, inherit)}.et-tree-node:where([data-selected]):hover{background:color-mix(in srgb,var(--et-theme-color-primary-solid, gray) 24%,transparent)}.et-tree-node:where([data-selected]):active{background:color-mix(in srgb,var(--et-theme-color-primary-solid, gray) 32%,transparent)}.et-tree-node:where([aria-disabled]){color:var(--et-surface-color-muted-solid, GrayText);cursor:default}.et-tree-node:where([aria-disabled]):hover,.et-tree-node:where([aria-disabled]):active{background:transparent}.et-tree:where([aria-multiselectable]) .et-tree-node:after{content:\"\";flex:none;inline-size:4px;block-size:8px;margin-inline:3px;border:solid var(--et-theme-color-primary-solid, currentColor);border-width:0 2px 2px 0;rotate:45deg;opacity:0;transition:opacity var(--et-tree-duration) ease}.et-tree:where([aria-multiselectable]) .et-tree-node:where([data-selected]){background:color-mix(in srgb,var(--et-theme-color-primary-solid, gray) 8%,transparent);color:inherit}.et-tree:where([aria-multiselectable]) .et-tree-node:where([data-selected]):after{opacity:1}.et-tree:where([aria-multiselectable]) .et-tree-node:where([data-selected]):hover{background:color-mix(in srgb,var(--et-theme-color-primary-solid, gray) 14%,transparent)}.et-tree:where([aria-multiselectable]) .et-tree-node:where([data-selected]):active{background:color-mix(in srgb,var(--et-theme-color-primary-solid, gray) 20%,transparent)}.et-tree-status{color:var(--et-surface-color-muted-solid, GrayText)}.et-tree-status:where(.et-tree-status--error){color:var(--et-tree-error-color, var(--et-surface-color-muted-solid, GrayText));cursor:pointer}.et-tree-status:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:-2px}@media(prefers-reduced-motion:reduce){.et-tree-node,.et-tree-node:after,.et-tree-node .et-tree-node-chevron{transition:none}}}\n"] }]
+        }], propDecorators: { loadingLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingLabel", required: false }] }], emptyLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyLabel", required: false }] }], retryLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "retryLabel", required: false }] }] } });
+
+const TREE_IMPORTS = [TreeComponent, TreeDirective, TreeNodeDirective, TreeNodeDefDirective];
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { ACCORDION_ERROR_CODES, ACCORDION_GROUP_TOKEN, ACCORDION_IMPORTS, ACCORDION_TOKEN, ALIGN_CENTER_ICON, ALIGN_JUSTIFY_ICON, ALIGN_LEFT_ICON, ALIGN_RIGHT_ICON, ARROWS_LEFT_RIGHT_ICON, ARROW_OUT_UP_RIGHT_ICON, ARROW_RIGHT_ICON, ARROW_UP_ICON, AVATAR_IMPORTS, AVATAR_SHAPES, AVATAR_SIZES, AccordionComponent, AccordionContentDirective, AccordionDirective, AccordionGroupComponent, AccordionGroupDirective, AccordionHintDirective, AccordionLabelDirective, AccordionPanelDirective, AccordionTriggerDirective, AvatarComponent, AvatarGroupComponent, BADGE_IMPORTS, BADGE_VARIANTS, BANNER_IMPORTS, BANNER_LABELS, BANNER_TYPES, BOLD_ICON, BRACKET_CARD_CONTEXT, BRACKET_DATA_LAYOUT, BRACKET_DEFAULTS, BRACKET_DENSITY, BRACKET_DENSITY_PRESETS, BRACKET_ERROR_CODES, BRACKET_IMPORTS, BRACKET_LABELS, BRACKET_ROUND_MIRROR_TYPE, BRACKET_SWISS_GROUP_COLOR_TYPE, BREADCRUMB_COLLAPSE_IMPORTS, BREADCRUMB_COLLAPSE_TOKEN, BREADCRUMB_ERROR_CODES, BREADCRUMB_IMPORTS, BREADCRUMB_LABELS, BREADCRUMB_SEGMENT_TOKEN, BREADCRUMB_SEO_IMPORTS, BREADCRUMB_TOKEN, BUTTON_ICON_ALIGNMENTS, BUTTON_IMPORTS, BUTTON_SIZES, BUTTON_SPINNER_CONFIG, BUTTON_TYPES, BUTTON_VARIANTS, BadgeComponent, BannerComponent, BracketComponent, BracketDefaultContinueComponent, BracketDefaultFinalMatchComponent, BracketDefaultMatchComponent, BracketDefaultRoundHeaderComponent, BracketMap, BracketRoundsListComponent, BrandLoaderComponent, BreadcrumbCollapseDirective, BreadcrumbComponent, BreadcrumbDirective, BreadcrumbItemDirective, BreadcrumbItemTemplateDirective, BreadcrumbOutletComponent, BreadcrumbOverflowComponent, BreadcrumbSegmentDirective, BreadcrumbSeoDirective, BreadcrumbSeparatorDirective, ButtonComponent, ButtonDirective, ButtonStylesDirective, CALENDAR_ERROR_CODES, CALENDAR_ICON, CALENDAR_IMPORTS, CALENDAR_LABELS, CARD_IMPORTS, CARD_VARIANTS, CAROUSEL_AUTOPLAY_TOKEN, CAROUSEL_ERROR_CODES, CAROUSEL_IMPORTS, CAROUSEL_LABELS, CAROUSEL_SLIDE_ALIGNMENTS, CAROUSEL_TOKEN, CAROUSEL_TRANSITIONS, CAROUSEL_TRANSITION_DRIVERS, CASCADER_ERROR_CODES, CASCADER_IMPORTS, CASCADER_LABELS, CASCADER_SELECTABLE_LEVELS, CHECKBOX_GROUP_IMPORTS, CHECKBOX_IMPORTS, CHECKBOX_OPTION_VARIANTS, CHECK_ICON, CHEVRON_ICON, CHIP_ERROR_CODES, CHIP_IMPORTS, CHIP_LABELS, CHOICE_FIELD_IMPORTS, CHOICE_FIELD_VARIANTS, CIRCLE_CHECK_ICON, CIRCLE_INFO_ICON, CLIPBOARD_CHECK_ICON, CLOCK_ICON, CODE_BLOCK_ICON, CODE_ICON, COLOR_INPUT_IMPORTS, COMMON_BRACKET_ROUND_TYPE, COPY_BUTTON_IMPORTS, CalendarCellDirective, CalendarComponent, CalendarDirective, CalendarGridDirective, CalendarHeaderDirective, CardComponent, CarouselAutoplayDirective, CarouselComponent, CarouselDirective, CarouselItemDirective, CarouselNextDirective, CarouselPlayToggleDirective, CarouselPreviousDirective, CarouselSlideDirective, CascaderColumnDirective, CascaderComponent, CascaderDirective, CascaderNodeDirective, CascaderPanelComponent, CascaderSearchDirective, CascaderSearchOptionDirective, CascaderSurfaceDirective, CascaderTriggerDirective, CheckboxComponent, CheckboxDirective, CheckboxGroupComponent, CheckboxGroupSelectAllComponent, CheckboxOptionComponent, ChipComponent, ChipDirective, ChipRemoveDirective, ChoiceFieldComponent, ColorInputComponent, ColorInputDirective, CopyButtonDirective, CounterComponent, DAILYMOTION_PLAYER_TOKEN, DATE_FORMAT, DATE_INPUT_ERROR_CODES, DATE_INPUT_IMPORTS, DATE_LOCALE, DATE_PICKER_HOST, DATE_RANGE_INPUT_ERROR_CODES, DATE_RANGE_INPUT_IMPORTS, DATE_TIME_INPUT_ERROR_CODES, DATE_TIME_INPUT_IMPORTS, DATE_TIME_LABELS, DEFAULT_BANNER_LABELS, DEFAULT_BRACKET_LABELS, DEFAULT_BREADCRUMB_LABELS, DEFAULT_BREAKPOINTS, DEFAULT_CALENDAR_LABELS, DEFAULT_CALENDAR_RANGE_STRATEGY, DEFAULT_CAROUSEL_LABELS, DEFAULT_CASCADER_LABELS, DEFAULT_CHIP_LABELS, DEFAULT_DATE_TIME_LABELS, DEFAULT_DROPZONE_LABELS, DEFAULT_FILTER_OVERLAY_LABELS, DEFAULT_FORM_FIELD_LABELS, DEFAULT_GRID_LABELS, DEFAULT_ICON_VARIANT, DEFAULT_INPUT_LABELS, DEFAULT_LOADER_LABELS, DEFAULT_MATCH_CARD_START_TIME_FORMAT, DEFAULT_MATCH_LABELS, DEFAULT_NOTIFICATION_LABELS, DEFAULT_NOTIFICATION_MANAGER_CONFIG, DEFAULT_NOTIFICATION_STATUS_ICONS, DEFAULT_PAGINATION_LABELS, DEFAULT_PHONE_INPUT_LABELS, DEFAULT_PIP_WINDOW_CONFIG, DEFAULT_QUERY_ERROR_LABELS, DEFAULT_RICH_TEXT_EDITOR_LABELS, DEFAULT_RICH_TEXT_EDITOR_TOOLS, DEFAULT_SCHEDULER_LABELS, DEFAULT_SELECT_LABELS, DEFAULT_SLIDER_LABELS, DEFAULT_STANDINGS_LABELS, DEFAULT_STREAM_LABELS, DEFAULT_STREAM_PLAYER_STATE, DEFAULT_TABLE_LABELS, DEFAULT_TIME_PICKER_LABELS, DESCRIPTION_IMPORTS, DESCRIPTION_LIST_IMPORTS, DOUBLE_ELIMINATION_BRACKET_ROUND_TYPE, DROPZONE_ENTRY_STATUSES, DROPZONE_ERROR_CODES, DROPZONE_FILES_ERROR_KIND, DROPZONE_FILE_CONSTRAINTS, DROPZONE_FILE_REJECTION_REASONS, DROPZONE_IMPORTS, DROPZONE_LABELS, DURATION_INPUT_ERROR_CODES, DURATION_INPUT_IMPORTS, DailymotionPlayerComponent, DailymotionPlayerDirective, DailymotionPlayerParamsDirective, DailymotionPlayerSlotComponent, DateInputComponent, DateInputDirective, DateInputFieldDirective, DatePickerPanelComponent, DatePickerSurfaceDirective, DatePickerTriggerDirective, DateRangeInputComponent, DateRangeInputDirective, DateRangeInputFieldDirective, DateTimeInputComponent, DateTimeInputDirective, DateTimeInputFieldDirective, DescriptionComponent, DescriptionListComponent, DropzoneComponent, DropzoneDirective, DurationInputComponent, DurationInputDirective, DurationInputFieldDirective, ELLIPSIS_ICON, ELLIPSIS_VERTICAL_ICON, EMPTY_STATE_IMPORTS, ET_BUILT_IN_ICON_NAMES, EYE_ICON, EYE_SLASH_ICON, EmptyStateComponent, FACEBOOK_PLAYER_TOKEN, FILE_ICON, FILTER_ICON, FILTER_OVERLAY_ERROR_CODES, FILTER_OVERLAY_IMPORTS, FILTER_OVERLAY_LABELS, FILTER_OVERLAY_TOKEN, FLOATING_ACTION_ERROR_CODES, FLOATING_ACTION_IMPORTS, FLOATING_ACTION_STATES, FLOATING_ACTION_TOKEN, FLOPPY_DISK_ICON, FOCUS_FRAME_ICON, FORM_ERROR_MESSAGE_RESOLVER, FORM_FIELD_APPEARANCES, FORM_FIELD_CONTROL_TYPES, FORM_FIELD_ERROR_CODES, FORM_FIELD_FILLS, FORM_FIELD_IMPORTS, FORM_FIELD_LABELS, FORM_FIELD_LABEL_MODES, FORM_FIELD_SIZES, FORM_FIELD_TOKEN, FabComponent, FacebookPlayerComponent, FacebookPlayerDirective, FacebookPlayerParamsDirective, FacebookPlayerSlotComponent, FilterOverlayResetDirective, FilterOverlaySubmitDirective, FloatingActionAnchorDirective, FloatingActionDirective, FloatingActionScopeDirective, FloatingActionTopDirective, FloatingActionTriggerDirective, FocusRingDirective, FormErrorComponent, FormFieldComponent, FormFieldDirective, GERMAN_FILTER_OVERLAY_LABELS, GERMAN_QUERY_ERROR_LABELS, GRID_2X2_ICON, GRID_DEBUG_IMPORTS, GRID_ERROR_CODES, GRID_IMPORTS, GRID_LABELS, GRID_TOKEN, GROUP_BRACKET_ROUND_TYPE, GridComponent, GridDebugComponent, GridDirective, GridDragDirective, GridItemComponent, GridItemDefaultActionsComponent, GridItemDirective, GridItemRef, GridItemToolbarComponent, GridResizeDirective, HEADING_1_ICON, HEADING_2_ICON, HEADING_3_ICON, HintComponent, ICONS_TOKEN, ICON_DIRECTIVE_TOKEN, ICON_ERROR_CODES, ICON_IMPORTS, ICON_OVERRIDES_TOKEN, IMAGE_ICON, INITIAL_SUPPORT_PRESENTATION_STATE, INPUT_IMPORTS, INPUT_LABELS, INPUT_MASK_HOST, INPUT_TEXT_ALIGNMENTS, INPUT_TYPES, INTERACTIVE_TAGS, ITALIC_ICON, IconButtonComponent, IconDirective, InputComponent, InputDirective, InputMaskDirective, InputPrefixDirective, InputSuffixDirective, KICK_PLAYER_TOKEN, KickPlayerComponent, KickPlayerDirective, KickPlayerParamsDirective, KickPlayerSlotComponent, LINK_ICON, LIST_BULLETED_ICON, LIST_NUMBERED_ICON, LOADER_LABELS, LOCATION_ICON, LOCK_ICON, LabelDirective, MASKED_INPUT_ERROR_CODES, MASKED_INPUT_IMPORTS, MASK_VALUE_MODES, MASONRY_ERROR_CODES, MASONRY_IMPORTS, MASONRY_TOKEN, MATCH_CARD_IMPORTS, MATCH_CARD_SIZES, MATCH_CARD_TOKEN, MATCH_ERROR_CODES, MATCH_LABELS, MATCH_PARTICIPANT_IMPORTS, MENU_ERROR_CODES, MENU_IMPORTS, MENU_ITEM_VARIANTS, MENU_SELECTION_GROUP_MULTIPLE, MENU_SELECTION_GROUP_TOKEN, MENU_SELECTION_ITEM_KIND, MINUS_ICON, MULTI_LANGUAGE_RICH_TEXT_EDITOR_ERROR_CODES, MULTI_LANGUAGE_RICH_TEXT_EDITOR_IMPORTS, MasonryDirective, MasonryItemDirective, MatchCardComponent, MatchCardDirective, MatchCardGameScoresDirective, MatchCardMetaDirective, MatchCardScoreDirective, MatchParticipantComponent, MatchScoreComponent, MenuCheckboxGroupComponent, MenuCheckboxItemComponent, MenuComponent, MenuContextTriggerDirective, MenuDirective, MenuGroupLabelComponent, MenuItemComponent, MenuItemDirective, MenuItemShortcutComponent, MenuPanelDirective, MenuRadioGroupComponent, MenuRadioItemComponent, MenuSearchDirective, MenuSelectionGroupDirective, MenuSelectionItemDirective, MenuSeparatorComponent, MenuSurfaceDirective, MenuTriggerDirective, MultiLanguageRichTextEditorComponent, MultiLanguageRichTextEditorDirective, MultiLanguageRichTextEditorLanguageToolComponent, NAV_TABS_TOKEN, NAV_TAB_IMPORTS, NOTIFICATION_ACTION_SLOTS, NOTIFICATION_ERROR_CODES, NOTIFICATION_IMPORTS, NOTIFICATION_LABELS, NOTIFICATION_STACK_CONTEXT_TOKEN, NOTIFICATION_STATUS, NUMBER_INPUT_IMPORTS, NavTabLinkComponent, NavTabLinkDirective, NavTabsComponent, NavTabsDirective, NavTabsOutletComponent, NavTabsOutletDirective, NotificationActionDirective, NotificationComponent, NotificationDirective, NotificationDismissDirective, NotificationItemDirective, NotificationStackDirective, NotificationSwipeToDismissDirective, NumberInputComponent, NumberInputDirective, OTP_INPUT_IMPORTS, OVERLAY_BACK_OR_CLOSE_TOKEN, OVERLAY_BODY_TOKEN, OVERLAY_CONFIG_CLASS_KEYS, OVERLAY_CONTENT_IMPORTS, OVERLAY_ERROR_CODES, OVERLAY_FOOTER_TOKEN, OVERLAY_HEADER_TEMPLATE_TOKEN, OVERLAY_HEADER_TOKEN, OVERLAY_IMPORTS, OVERLAY_MAIN_TOKEN, OVERLAY_QUERY_PARAM_INPUT_NAME, OVERLAY_REF, OVERLAY_ROUTER_CONFIG_TOKEN, OVERLAY_ROUTER_LINK_TOKEN, OVERLAY_ROUTER_OUTLET_DISABLED_TEMPLATE_TOKEN, OVERLAY_ROUTER_OUTLET_TOKEN, OVERLAY_ROUTER_TOKEN, OVERLAY_SHARED_ROUTE_TEMPLATE_TOKEN, OtpInputComponent, OtpInputDirective, OverlayAnchorDirective, OverlayBackOrCloseDirective, OverlayBodyComponent, OverlayCloseDirective, OverlayContainerComponent, OverlayDirective, OverlayFooterDirective, OverlayHeaderDirective, OverlayHeaderTemplateDirective, OverlayMainDirective, OverlayOriginCloneComponent, OverlayRouteHeaderTemplateOutletComponent, OverlayRouterLinkDirective, OverlayRouterOutletComponent, OverlayRouterOutletDisabledTemplateDirective, OverlaySharedRouteTemplateDirective, OverlaySharedRouteTemplateOutletComponent, OverlaySidebarComponent, OverlaySidebarPageComponent, OverlaySurfaceDirective, OverlayTitleDirective, OverlayTriggerDirective, PAGE_SIZE_SELECT_IMPORTS, PAGINATION_IMPORTS, PAGINATION_LABELS, PARAGRAPH_ICON, PASSWORD_INPUT_IMPORTS, PAUSE_ICON, PENCIL_ICON, PHONE_COUNTRIES, PHONE_INPUT_ERROR_CODES, PHONE_INPUT_IMPORTS, PHONE_INPUT_LABELS, PICTURE_IMPORTS, PICTURE_STATES, PIP_CHROME_REF_TOKEN, PIP_ENTRY_TOKEN, PIP_WINDOW_ASPECT_RATIO_TOKEN, PLAY_ICON, PLUS_ICON, PROGRESS_STEPS_IMPORTS, PROGRESS_STEP_STATES, PageSizeSelectComponent, PaginationComponent, PaginationDirective, PaginationSeoDirective, PasswordInputComponent, PasswordInputDirective, PhoneInputComponent, PhoneInputDirective, PhoneInputFieldDirective, PhoneInputFlagDirective, PictureComponent, PictureErrorDirective, PicturePlaceholderDirective, PipBackDirective, PipBringBackDirective, PipCellDirective, PipCloseDirective, PipCollapseOverlayDirective, PipGridToggleDirective, PipPlayerComponent, PipSlotPlaceholderComponent, PipStageDirective, PipTitleBarDirective, PipTitleBarTemplateDirective, PipWindowComponent, PipWindowParamsDirective, ProgressBarComponent, ProgressStepComponent, ProgressStepsComponent, QUERY_DEVTOOLS_IMPORTS, QUERY_ERROR_ERROR_CODES, QUERY_ERROR_IMPORTS, QUERY_ERROR_LABELS, QUERY_ERROR_TOKEN, QUOTE_ICON, QueryDevtoolsComponent, QueryDevtoolsJsonComponent, QueryDevtoolsJsonStylesComponent, QueryDevtoolsTimelineStylesComponent, QueryDevtoolsToggleComponent, QueryErrorActionsDirective, QueryErrorComponent, QueryErrorDirective, QueryErrorTitleDirective, QueryParamOverlayLinkDirective, RADIO_GROUP_IMPORTS, RADIO_VARIANTS, RATING_IMPORTS, REDO_ICON, RICH_TEXT_EDITOR_FLOATING_TOOLBAR, RICH_TEXT_EDITOR_HEADING_OPTIONS, RICH_TEXT_EDITOR_IMPORTS, RICH_TEXT_EDITOR_INLINE_TOOLS, RICH_TEXT_EDITOR_LABELS, RICH_TEXT_EDITOR_LANGUAGE_TOOL, RICH_TEXT_EDITOR_LINK_EDITOR, RICH_TEXT_EDITOR_TOKEN_CODEC, RICH_TEXT_EDITOR_TOKEN_PALETTE_IMPORTS, RICH_TEXT_EDITOR_TOOL, RICH_TEXT_EDITOR_TOOLS, RICH_TEXT_EDITOR_TOOL_BUTTONS, RICH_TEXT_EDITOR_TRIGGERS_IMPORTS, ROTATE_RIGHT_ICON, RadioComponent, RadioGroupComponent, RangeSliderComponent, RangeSliderDirective, RatingComponent, RatingDirective, RatingIconDirective, RichTextEditorAlignToolComponent, RichTextEditorComponent, RichTextEditorDirective, RichTextEditorFloatingToolbarComponent, RichTextEditorFloatingToolbarDirective, RichTextEditorHeadingToolComponent, RichTextEditorImageEditorComponent, RichTextEditorImageStylesComponent, RichTextEditorImageToolComponent, RichTextEditorLinkEditorComponent, RichTextEditorLinkEditorDirective, RichTextEditorTableStylesComponent, RichTextEditorTableToolComponent, RichTextEditorTokenPaletteComponent, RichTextEditorTokenPopupComponent, RichTextEditorTriggersDirective, SCHEDULER_ERROR_CODES, SCHEDULER_FEATURE_HOST, SCHEDULER_IMPORTS, SCHEDULER_LABELS, SCROLLABLE_DARKEN_IMPORTS, SCROLLABLE_DRAG_IMPORTS, SCROLLABLE_ERROR_CODES, SCROLLABLE_IMPORTS, SCROLLABLE_NAVIGATION_IMPORTS, SEGMENTED_BUTTON_GROUP_VARIANTS, SEGMENTED_BUTTON_IMPORTS, SELECTION_LIST_IMPORTS, SELECTION_LIST_MULTIPLE, SELECTION_LIST_TOKEN, SELECT_ERROR_CODES, SELECT_FILTER_MODES, SELECT_IMPORTS, SELECT_LABELS, SIDEBAR_OVERLAY_CONFIG, SIDEBAR_OVERLAY_TOKEN, SINGLE_ELIMINATION_BRACKET_ROUND_TYPE, SKELETON_IMPORTS, SLIDER_ERROR_CODES, SLIDER_IMPORTS, SLIDER_LABELS, SLIDER_MARK_VALUE_ATTRIBUTE, SLIDER_TOKEN, SNAP_HYSTERESIS, SOOP_PLAYER_TOKEN, SPLIT_BUTTON_ERROR_CODES, STANDINGS_ERROR_CODES, STANDINGS_IMPORTS, STANDINGS_LABELS, STAR_ICON, STREAM_ALL_IMPORTS, STREAM_CONSENT_TOKEN, STREAM_DAILYMOTION_IMPORTS, STREAM_FACEBOOK_IMPORTS, STREAM_IMPORTS, STREAM_KICK_IMPORTS, STREAM_LABELS, STREAM_PIP_IMPORTS, STREAM_PLAYER_COMPONENT_TOKEN, STREAM_PLAYER_ERROR_CONTEXT_TOKEN, STREAM_PLAYER_ERROR_TOKEN, STREAM_PLAYER_PARAMS_TOKEN, STREAM_PLAYER_SLOT_TOKEN, STREAM_PLAYER_TOKEN, STREAM_SLOT_PLAYER_ID_TOKEN, STREAM_SOOP_IMPORTS, STREAM_TIKTOK_IMPORTS, STREAM_TWITCH_IMPORTS, STREAM_USER_CONSENT_PROVIDER_TOKEN, STREAM_VIMEO_IMPORTS, STREAM_YOUTUBE_IMPORTS, STRIKETHROUGH_ICON, SUPPORT_CONTENT_STATE, SUPPORT_TRANSITION_DIRECTION, SWISS_ADVANCE_WINS, SWISS_BRACKET_ROUND_TYPE, SWISS_ELIMINATE_LOSSES, SWITCH_IMPORTS, SchedulerAgendaDirective, SchedulerAgendaViewComponent, SchedulerBadgeChainCountComponent, SchedulerBadgeChainCountDirective, SchedulerBadgeColorDotComponent, SchedulerBadgeColorDotDirective, SchedulerBadgeLocationComponent, SchedulerBadgeLocationDirective, SchedulerBadgeTimeRangeComponent, SchedulerBadgeTimeRangeDirective, SchedulerBadgeTitleComponent, SchedulerBadgeTitleDirective, SchedulerComponent, SchedulerDirective, SchedulerMonthDirective, SchedulerMonthViewComponent, SchedulerTimeGridDirective, SchedulerTimeGridViewComponent, ScrollableActiveChildDirective, ScrollableButtonsComponent, ScrollableButtonsDirective, ScrollableComponent, ScrollableDarkenDirective, ScrollableDirective, ScrollableDragDirective, ScrollableIgnoreChildDirective, ScrollableLoadingTemplateDirective, ScrollableMasksComponent, ScrollableNavigationComponent, ScrollableNavigationDirective, ScrollableSnapDirective, SegmentedButtonComponent, SegmentedButtonGroupComponent, SelectComponent, SelectDirective, SelectEmptyDirective, SelectErrorDirective, SelectListboxDirective, SelectLoadingDirective, SelectOptionComponent, SelectOptionDirective, SelectOptionGroupComponent, SelectOptionGroupDirective, SelectOptionTemplateDirective, SelectOptionsDirective, SelectPanelComponent, SelectSearchDirective, SelectSurfaceDirective, SelectTriggerDirective, SelectValueDirective, SelectViewportDirective, SelectVirtualOptionComponent, SelectVirtualOptionDirective, SelectionListControlDirective, SelectionListDirective, SelectionOptionDirective, SkeletonComponent, SkeletonItemComponent, SkeletonTextComponent, SliderComponent, SliderDirective, SliderThumbDirective, SliderThumbLabelDirective, SliderTrackDirective, SoopPlayerComponent, SoopPlayerDirective, SoopPlayerParamsDirective, SoopPlayerSlotComponent, SpinnerComponent, SplitButtonActionDirective, SplitButtonComponent, SplitButtonDirective, SplitButtonTriggerDirective, StandingsComponent, StandingsDirective, StreamConsentAcceptDirective, StreamConsentComponent, StreamConsentDirective, StreamPipChromeComponent, StreamPlayerErrorComponent, StreamPlayerErrorDirective, StreamPlayerLoadingComponent, StreamPlayerSlotDirective, SwitchComponent, SwitchDirective, TABLE_CELL_ERROR_TOOLTIP_IMPORTS, TABLE_COLUMN_CHOOSER_IMPORTS, TABLE_COLUMN_MENU_IMPORTS, TABLE_CSV_EXPORT_IMPORTS, TABLE_ERROR_CODES, TABLE_FEATURE_HOST, TABLE_FILTER_IMPORTS, TABLE_GROUP_HEADERS_IMPORTS, TABLE_ICON, TABLE_IMPORTS, TABLE_INLINE_EDIT_IMPORTS, TABLE_KEYBOARD_NAV_IMPORTS, TABLE_LABELS, TABLE_REORDER_IMPORTS, TABLE_RESIZE_IMPORTS, TABLE_ROW_EXPANSION_IMPORTS, TABLE_SELECTION_IMPORTS, TABLE_SKELETON_IMPORTS, TABLE_STATE_PERSISTENCE_IMPORTS, TABLE_STICKY_COLUMNS_IMPORTS, TABLE_VIRTUAL_SCROLL_IMPORTS, TAB_BAR_FITS, TAB_BAR_ORIENTATIONS, TAB_BAR_TOKEN, TAB_BAR_TRIGGER_TOKEN, TAB_BAR_VARIANTS, TAB_ERROR_CODES, TAB_GROUP_TOKEN, TAB_IMPORTS, TAB_PANEL_TOKEN, TAB_SIZES, TAG_INPUT_ERROR_CODES, TAG_INPUT_IMPORTS, TEXTAREA_IMPORTS, TEXTAREA_RESIZE_MODES, TEXT_ALIGNS, TIKTOK_PLAYER_TOKEN, TIMES_ICON, TIME_FORMAT, TIME_INPUT_ERROR_CODES, TIME_INPUT_IMPORTS, TIME_PICKER_ERROR_CODES, TIME_PICKER_IMPORTS, TIME_PICKER_LABELS, TOGGLETIP_ERROR_CODES, TOGGLETIP_IMPORTS, TOOLTIP_ERROR_CODES, TOOLTIP_IMPORTS, TOURNAMENT_MODE, TRIANGLE_EXCLAMATION_ICON, TROPHY_ICON, TWITCH_PLAYER_TOKEN, TabBarDirective, TabBarTriggerDirective, TabBarUnderlineDirective, TabComponent, TabGroupComponent, TabGroupDirective, TabLabelDirective, TabPanelDirective, TabTriggerDirective, TableCellDirective, TableCellEditDirective, TableCellErrorMarkComponent, TableCellErrorTooltipDirective, TableCellSkeletonDirective, TableColumnChooserComponent, TableColumnMenuDirective, TableColumnMenuTriggerComponent, TableComponent, TableCsvExportDirective, TableDetailStylesComponent, TableExpanderCellComponent, TableFilterOptionDirective, TableFilterTriggerComponent, TableFiltersDirective, TableFooterCellDirective, TableFooterDirective, TableGroupHeaderRowComponent, TableGroupHeadersDirective, TableHeaderCellDirective, TableInlineEditDirective, TableInlineEditStylesComponent, TableKeyboardNavDirective, TableReorderDirective, TableReorderOverlayComponent, TableResizeDirective, TableResizeGripComponent, TableRowDetailComponent, TableRowExpansionDirective, TableSelectAllCellComponent, TableSelectCellComponent, TableSelectionDirective, TableSkeletonDirective, TableSkeletonRowsComponent, TableStatePersistenceDirective, TableStickyColumnsDirective, TableVirtualScrollDirective, TableVirtualScrollStylesComponent, TagInputComponent, TagInputDirective, TagInputFieldDirective, TextButtonComponent, TextFieldControlDirective, TextareaComponent, TextareaDirective, TikTokPlayerComponent, TikTokPlayerDirective, TikTokPlayerParamsDirective, TikTokPlayerSlotComponent, TimeInputComponent, TimeInputDirective, TimeInputFieldDirective, TimePickerColumnDirective, TimePickerComponent, TimePickerDirective, TimePickerOptionDirective, ToggletipCloseDirective, ToggletipComponent, ToggletipDirective, ToggletipTriggerDirective, TooltipComponent, TooltipDirective, TwitchPlayerComponent, TwitchPlayerDirective, TwitchPlayerParamsDirective, TwitchPlayerSlotComponent, UNDERLINE_ICON, UNDO_ICON, UNIT_MS, UPLOAD_ICON, VIMEO_PLAYER_TOKEN, VimeoPlayerComponent, VimeoPlayerDirective, VimeoPlayerParamsDirective, VimeoPlayerSlotComponent, WINDOW_CONTROL_BUTTON_KINDS, WINDOW_CONTROL_BUTTON_SIZES, WindowControlButtonComponent, YOUTUBE_PLAYER_SLOT_TOKEN, YOUTUBE_PLAYER_TOKEN, YoutubePlayerComponent, YoutubePlayerDirective, YoutubePlayerParamsDirective, YoutubePlayerSlotComponent, YoutubePlayerSlotDirective, abortFullscreenAnimation, anchoredDialogOverlayStrategy, anchoredOverlayStrategy, autoPlace, bottomSheetOverlayStrategy, bracketFitsWidth, bracketNaturalWidth, buildAnchoredRuntimePositionStrategy, canHaveChildren, cascaderFromQuery, centeredOverlayStrategy, clampPosition, clampResizeRect, cleanupFullscreenAnimation, cleanupFullscreenAnimationStyles, compactLayout, computeGeometry, computeGridHeight, countDescendants, createAnchoredPanelController, createAutoScroller, createBracket, createBracketBase, createCardMask, createCurrencyMask, createDefaultDropzoneArgs, createDropzoneUpload, createExistingDropzoneEntry, createFileDropzoneEntry, createFixedLengthRangeStrategy, createGridAdapter, createIbanMask, createMatchesMapBase, createNewMatchParticipantBase, createNormalizedBracketMatch, createNotificationPromiseFn, createNotificationRef, createOverlayOpener, createOverlayRef, createOverlayStrategyController, createOverlayUnsavedChangesGuard, createParticipantsMapBase, createPipChromeAnimations, createPipChromeState, createRichTextEditorTrigger, createRichTextEditorTriggerWithQuery, createRoundsMapBase, createStreamConfig, createStreamPlayerSlot, createTableRowsSource, createTableStateStorage, createV2DropzoneUpload, createWeekRangeStrategy, defaultCompareWith, defaultDropzoneRejectionMessage, defineOverlay, defineQueryParamOverlay, deriveDurationFormatSpec, deserializeGridLayout, deserializeTableState, dialogOverlayStrategy, disposeDropzoneEntry, doubleEliminationBracketLayout, dropzoneFiles, enableDragToDismiss, extractFirstImageUrl, filterOverlayLabelsForLocale, filterOverlayPreviewFromQuery, filterRows, findCollision, findNextRelevantHtmlElement, findScrollableAncestor, formatDuration, formatFileSize, fromGridPosition, fullScreenDialogOverlayStrategy, generateBracketDataForEthlete, generateBracketRoundSwissGroupMaps, generateMatchPosition, generateMatchRelationPositions, generateMatchRelationsNew, generateRoundRelationsNew, generateRoundTypeFromEthleteRoundType, generateTournamentModeFormEthleteRounds, getAvailableSwissGroupsForRound, getClosestOverlay, getOriginCoordinatesAndDimensions, getSwissGroupColorType, hysteresisRound, iconRegistryKey, indexOfNode, injectAnchoredDialogStrategy, injectAnchoredDialogStrategyDefaults, injectBannerLabels, injectBottomSheetStrategy, injectBottomSheetStrategyDefaults, injectBracketConfig, injectBracketLabels, injectBreadcrumbLabels, injectBreadcrumbManager, injectCalendarLabels, injectCarouselLabels, injectCascaderLabels, injectChipLabels, injectDateFormat, injectDateLocale, injectDateTimeLabels, injectDialogStrategy, injectDialogStrategyDefaults, injectDropzoneLabels, injectFilterOverlay, injectFilterOverlayLabels, injectFormFieldLabels, injectFormSupport, injectFullscreenDialogStrategy, injectFullscreenDialogStrategyDefaults, injectGridConfig, injectGridLabels, injectInputLabels, injectLeftSheetStrategy, injectLeftSheetStrategyDefaults, injectLoaderLabels, injectMatchLabels, injectNotificationLabels, injectNotificationManager, injectNotificationManagerConfig, injectOverlayManager, injectOverlayRouter, injectOverlayScrollBlocker, injectOverlaySurfaceContext, injectPaginationLabels, injectPhoneInputLabels, injectPictureConfig, injectPipChromeManager, injectPipManager, injectPipSlotPlaceholderConfig, injectQueryErrorLabels, injectRichTextEditorLabels, injectRichTextEditorTools, injectRightSheetStrategy, injectRightSheetStrategyDefaults, injectSchedulerFeatureHost, injectSchedulerLabels, injectSelectLabels, injectSidebarOverlay, injectSliderLabels, injectStandingsLabels, injectStreamConfig, injectStreamConsentConfig, injectStreamLabels, injectStreamManager, injectStreamPlayerErrorConfig, injectStreamPlayerLoadingConfig, injectStreamScriptLoader, injectStreamUserConsentProvider, injectTableCsvExport, injectTableFeatureHost, injectTableLabels, injectTimeFormat, injectTimePickerLabels, injectTopSheetStrategy, injectTopSheetStrategyDefaults, isFileAccepted, isHtmlElement, isInteractiveElement, isPointerEvent, isTargetInsideOverlayTree, isTouchEvent, itemsCollide, kindOf, leftSheetOverlayStrategy, legacyQueryErrorSource, mapLayoutToBreakpoint, matchCountryByDialCode, matchParticipantDisplayName, mergeOverlayBreakpointConfigs, mergeOverlayConfigs, mirroredDoubleEliminationBracketLayout, mirroredSingleEliminationBracketLayout, mountRichTextEditorImageStyles, mountRichTextEditorTableStyles, nodesEqual, normalizeEthleteBracketMatch, normalizeEthleteGroupRanking, normalizeEthleteMatch, normalizeEthleteMatchStatus, normalizeEthleteMedia, normalizeEthleteParticipant, normalizeEthletePlacement, normalizePictureSizes, normalizePictureSource, paginate, parseDuration, phoneCountryFlag, phoneCountryName, pixelRectsEqual, positionToPixelRect, positionsEqual, projectDragCell, provideAnchoredDialogStrategy, provideAnchoredDialogStrategyDefaults, provideBannerLabels, provideBottomSheetStrategy, provideBottomSheetStrategyDefaults, provideBracketConfig, provideBracketLabels, provideBreadcrumbLabels, provideBreadcrumbManager, provideCalendarLabels, provideCarouselLabels, provideCascaderLabels, provideChipLabels, provideDateFormat, provideDateLocale, provideDateTimeLabels, provideDialogStrategy, provideDialogStrategyDefaults, provideDropzoneLabels, provideFilterOverlay, provideFilterOverlayLabels, provideFormErrorMessageResolver, provideFormFieldLabels, provideFormSupport, provideFullscreenDialogStrategy, provideFullscreenDialogStrategyDefaults, provideGridConfig, provideGridLabels, provideIconOverrides, provideIcons, provideInputLabels, provideLeftSheetStrategy, provideLeftSheetStrategyDefaults, provideLoaderLabels, provideMatchLabels, provideNotificationLabels, provideNotificationManager, provideNotificationManagerConfig, provideNotificationManagerInstance, provideOverlay, provideOverlayManager, provideOverlayRouter, provideOverlayRouterConfig, provideOverlayRouterService, provideOverlayScrollBlocker, providePaginationLabels, providePhoneInputLabels, providePictureConfig, providePipChromeManager, providePipManager, providePipSlotPlaceholderConfig, provideQueryErrorLabels, provideRichTextEditorAlignmentTool, provideRichTextEditorAutoformat, provideRichTextEditorBlockquoteTool, provideRichTextEditorCodeBlockTool, provideRichTextEditorDefaultTools, provideRichTextEditorFloatingToolbar, provideRichTextEditorHeadingTool, provideRichTextEditorImageTool, provideRichTextEditorLabels, provideRichTextEditorLanguageTool, provideRichTextEditorLinkEditor, provideRichTextEditorLinkTool, provideRichTextEditorTableTool, provideRichTextEditorTokenRendering, provideRichTextEditorTools, provideRightSheetStrategy, provideRightSheetStrategyDefaults, provideSchedulerLabels, provideSelectLabels, provideSidebarOverlay, provideSidebarOverlayConfig, provideSidebarOverlayService, provideSliderLabels, provideStandingsLabels, provideStreamConfig, provideStreamConsentConfig, provideStreamLabels, provideStreamManager, provideStreamPlayerErrorConfig, provideStreamPlayerLoadingConfig, provideTableLabels, provideTimeFormat, provideTimePickerLabels, provideTopSheetStrategy, provideTopSheetStrategyDefaults, queryErrorLabelsForLocale, queryErrorResponseFromLegacyError, reconcileColumnOrder, reconcileColumnWidths, reconcileHiddenColumns, reduceSupportPresentation, registerSingleton, requiredLanguages, resizeSpanBounds, resolveBracketLayout, resolveBreakpoint, resolveClosestOverlay, resolveCollisions, resolveFilterOverlaySubmitButton, resolveNotificationStatusIcon, resolveTableCsvRows, richTextEditorToolLabel, rightSheetOverlayStrategy, rowsToPixelHeight, schedulerFeatureConfig, selectOptionsFromQuery, selectOptionsFromV2Query, serializeGridLayout, serializeTableState, setupRichTextEditorFloatingToolbar, setupRichTextEditorLinkEditor, singleEliminationBracketLayout, snapResizeSpan, sortRows, spanHeight, spanWidth, startFullscreenEnterAnimation, startFullscreenLeaveAnimation, startImageUpload, startOfCalendarUnit, stripTrunkZero, supportPresentationIncludesState, swissBracketLayout, tableCsvRowsFromPages, tableFeatureConfig, tableRowsFromQuery, tableRowsFromV2Query, tableToCsv, toChildrenObservable, toGridPosition, toNotificationContent, toPathObservable, toSearchObservable, topSheetOverlayStrategy, transformingBottomSheetToDialogOverlayStrategy, transformingFullScreenDialogToDialogOverlayStrategy, transformingFullScreenDialogToRightSheetOverlayStrategy, wireFormSupport, withPictureBaseUrl };
+export { ACCORDION_ERROR_CODES, ACCORDION_GROUP_TOKEN, ACCORDION_IMPORTS, ACCORDION_TOKEN, ALIGN_CENTER_ICON, ALIGN_JUSTIFY_ICON, ALIGN_LEFT_ICON, ALIGN_RIGHT_ICON, ARROWS_LEFT_RIGHT_ICON, ARROW_OUT_UP_RIGHT_ICON, ARROW_RIGHT_ICON, ARROW_UP_ICON, AVATAR_IMPORTS, AVATAR_SHAPES, AVATAR_SIZES, AccordionComponent, AccordionContentDirective, AccordionDirective, AccordionGroupComponent, AccordionGroupDirective, AccordionHintDirective, AccordionLabelDirective, AccordionPanelDirective, AccordionTriggerDirective, AvatarComponent, AvatarGroupComponent, BADGE_IMPORTS, BADGE_VARIANTS, BANNER_IMPORTS, BANNER_LABELS, BANNER_TYPES, BOLD_ICON, BRACKET_CARD_CONTEXT, BRACKET_DATA_LAYOUT, BRACKET_DEFAULTS, BRACKET_DENSITY, BRACKET_DENSITY_PRESETS, BRACKET_ERROR_CODES, BRACKET_IMPORTS, BRACKET_LABELS, BRACKET_ROUND_MIRROR_TYPE, BRACKET_SWISS_GROUP_COLOR_TYPE, BREADCRUMB_COLLAPSE_IMPORTS, BREADCRUMB_COLLAPSE_TOKEN, BREADCRUMB_ERROR_CODES, BREADCRUMB_IMPORTS, BREADCRUMB_LABELS, BREADCRUMB_SEGMENT_TOKEN, BREADCRUMB_SEO_IMPORTS, BREADCRUMB_TOKEN, BUTTON_ICON_ALIGNMENTS, BUTTON_IMPORTS, BUTTON_SIZES, BUTTON_SPINNER_CONFIG, BUTTON_TYPES, BUTTON_VARIANTS, BadgeComponent, BannerComponent, BracketComponent, BracketDefaultContinueComponent, BracketDefaultFinalMatchComponent, BracketDefaultMatchComponent, BracketDefaultRoundHeaderComponent, BracketMap, BracketRoundsListComponent, BrandLoaderComponent, BreadcrumbCollapseDirective, BreadcrumbComponent, BreadcrumbDirective, BreadcrumbItemDirective, BreadcrumbItemTemplateDirective, BreadcrumbOutletComponent, BreadcrumbOverflowComponent, BreadcrumbSegmentDirective, BreadcrumbSeoDirective, BreadcrumbSeparatorDirective, ButtonComponent, ButtonDirective, ButtonStylesDirective, CALENDAR_ERROR_CODES, CALENDAR_ICON, CALENDAR_IMPORTS, CALENDAR_LABELS, CARD_IMPORTS, CARD_VARIANTS, CAROUSEL_AUTOPLAY_TOKEN, CAROUSEL_ERROR_CODES, CAROUSEL_IMPORTS, CAROUSEL_LABELS, CAROUSEL_SLIDE_ALIGNMENTS, CAROUSEL_TOKEN, CAROUSEL_TRANSITIONS, CAROUSEL_TRANSITION_DRIVERS, CASCADER_ERROR_CODES, CASCADER_IMPORTS, CASCADER_LABELS, CASCADER_SELECTABLE_LEVELS, CHECKBOX_GROUP_IMPORTS, CHECKBOX_IMPORTS, CHECKBOX_OPTION_VARIANTS, CHECK_ICON, CHEVRON_ICON, CHIP_ERROR_CODES, CHIP_IMPORTS, CHIP_LABELS, CHOICE_FIELD_IMPORTS, CHOICE_FIELD_VARIANTS, CIRCLE_CHECK_ICON, CIRCLE_INFO_ICON, CLIPBOARD_CHECK_ICON, CLOCK_ICON, CODE_BLOCK_ICON, CODE_ICON, COLOR_INPUT_IMPORTS, COMMON_BRACKET_ROUND_TYPE, COPY_BUTTON_IMPORTS, CalendarCellDirective, CalendarComponent, CalendarDirective, CalendarGridDirective, CalendarHeaderDirective, CardComponent, CarouselAutoplayDirective, CarouselComponent, CarouselDirective, CarouselItemDirective, CarouselNextDirective, CarouselPlayToggleDirective, CarouselPreviousDirective, CarouselSlideDirective, CascaderColumnDirective, CascaderComponent, CascaderDirective, CascaderNodeDirective, CascaderPanelComponent, CascaderSearchDirective, CascaderSearchOptionDirective, CascaderSurfaceDirective, CascaderTriggerDirective, CheckboxComponent, CheckboxDirective, CheckboxGroupComponent, CheckboxGroupSelectAllComponent, CheckboxOptionComponent, ChipComponent, ChipDirective, ChipRemoveDirective, ChoiceFieldComponent, ColorInputComponent, ColorInputDirective, CopyButtonDirective, CounterComponent, DAILYMOTION_PLAYER_TOKEN, DATE_FORMAT, DATE_INPUT_ERROR_CODES, DATE_INPUT_IMPORTS, DATE_LOCALE, DATE_PICKER_HOST, DATE_RANGE_INPUT_ERROR_CODES, DATE_RANGE_INPUT_IMPORTS, DATE_TIME_INPUT_ERROR_CODES, DATE_TIME_INPUT_IMPORTS, DATE_TIME_LABELS, DEFAULT_BANNER_LABELS, DEFAULT_BRACKET_LABELS, DEFAULT_BREADCRUMB_LABELS, DEFAULT_BREAKPOINTS, DEFAULT_CALENDAR_LABELS, DEFAULT_CALENDAR_RANGE_STRATEGY, DEFAULT_CAROUSEL_LABELS, DEFAULT_CASCADER_LABELS, DEFAULT_CHIP_LABELS, DEFAULT_DATE_TIME_LABELS, DEFAULT_DROPZONE_LABELS, DEFAULT_FILTER_OVERLAY_LABELS, DEFAULT_FORM_FIELD_LABELS, DEFAULT_GRID_LABELS, DEFAULT_ICON_VARIANT, DEFAULT_INPUT_LABELS, DEFAULT_LOADER_LABELS, DEFAULT_MATCH_CARD_START_TIME_FORMAT, DEFAULT_MATCH_LABELS, DEFAULT_NOTIFICATION_LABELS, DEFAULT_NOTIFICATION_MANAGER_CONFIG, DEFAULT_NOTIFICATION_STATUS_ICONS, DEFAULT_PAGINATION_LABELS, DEFAULT_PHONE_INPUT_LABELS, DEFAULT_PIP_WINDOW_CONFIG, DEFAULT_QUERY_ERROR_LABELS, DEFAULT_RICH_TEXT_EDITOR_LABELS, DEFAULT_RICH_TEXT_EDITOR_TOOLS, DEFAULT_SCHEDULER_LABELS, DEFAULT_SELECT_LABELS, DEFAULT_SLIDER_LABELS, DEFAULT_STANDINGS_LABELS, DEFAULT_STREAM_LABELS, DEFAULT_STREAM_PLAYER_STATE, DEFAULT_TABLE_LABELS, DEFAULT_TIME_PICKER_LABELS, DESCRIPTION_IMPORTS, DESCRIPTION_LIST_IMPORTS, DIVIDER_IMPORTS, DOUBLE_ELIMINATION_BRACKET_ROUND_TYPE, DROPZONE_ENTRY_STATUSES, DROPZONE_ERROR_CODES, DROPZONE_FILES_ERROR_KIND, DROPZONE_FILE_CONSTRAINTS, DROPZONE_FILE_REJECTION_REASONS, DROPZONE_IMPORTS, DROPZONE_LABELS, DURATION_INPUT_ERROR_CODES, DURATION_INPUT_IMPORTS, DailymotionPlayerComponent, DailymotionPlayerDirective, DailymotionPlayerParamsDirective, DailymotionPlayerSlotComponent, DateInputComponent, DateInputDirective, DateInputFieldDirective, DatePickerPanelComponent, DatePickerSurfaceDirective, DatePickerTriggerDirective, DateRangeInputComponent, DateRangeInputDirective, DateRangeInputFieldDirective, DateTimeInputComponent, DateTimeInputDirective, DateTimeInputFieldDirective, DescriptionComponent, DescriptionListComponent, DividerComponent, DropzoneComponent, DropzoneDirective, DurationInputComponent, DurationInputDirective, DurationInputFieldDirective, ELLIPSIS_ICON, ELLIPSIS_VERTICAL_ICON, EMPTY_STATE_IMPORTS, ET_BUILT_IN_ICON_NAMES, EYE_ICON, EYE_SLASH_ICON, EmptyStateComponent, FACEBOOK_PLAYER_TOKEN, FILE_ICON, FILTER_ICON, FILTER_OVERLAY_ERROR_CODES, FILTER_OVERLAY_IMPORTS, FILTER_OVERLAY_LABELS, FILTER_OVERLAY_TOKEN, FLOATING_ACTION_ERROR_CODES, FLOATING_ACTION_IMPORTS, FLOATING_ACTION_STATES, FLOATING_ACTION_TOKEN, FLOPPY_DISK_ICON, FOCUS_FRAME_ICON, FORM_ERROR_MESSAGE_RESOLVER, FORM_FIELD_APPEARANCES, FORM_FIELD_CONTROL_TYPES, FORM_FIELD_ERROR_CODES, FORM_FIELD_FILLS, FORM_FIELD_IMPORTS, FORM_FIELD_LABELS, FORM_FIELD_LABEL_MODES, FORM_FIELD_SIZES, FORM_FIELD_TOKEN, FabComponent, FacebookPlayerComponent, FacebookPlayerDirective, FacebookPlayerParamsDirective, FacebookPlayerSlotComponent, FilterOverlayResetDirective, FilterOverlaySubmitDirective, FloatingActionAnchorDirective, FloatingActionDirective, FloatingActionScopeDirective, FloatingActionTopDirective, FloatingActionTriggerDirective, FocusRingDirective, FormErrorComponent, FormFieldComponent, FormFieldDirective, GERMAN_FILTER_OVERLAY_LABELS, GERMAN_QUERY_ERROR_LABELS, GRID_2X2_ICON, GRID_DEBUG_IMPORTS, GRID_ERROR_CODES, GRID_IMPORTS, GRID_LABELS, GRID_TOKEN, GROUP_BRACKET_ROUND_TYPE, GridComponent, GridDebugComponent, GridDirective, GridDragDirective, GridItemComponent, GridItemDefaultActionsComponent, GridItemDirective, GridItemRef, GridItemToolbarComponent, GridResizeDirective, HEADING_1_ICON, HEADING_2_ICON, HEADING_3_ICON, HintComponent, ICONS_TOKEN, ICON_DIRECTIVE_TOKEN, ICON_ERROR_CODES, ICON_IMPORTS, ICON_OVERRIDES_TOKEN, IMAGE_ICON, INITIAL_SUPPORT_PRESENTATION_STATE, INPUT_IMPORTS, INPUT_LABELS, INPUT_MASK_HOST, INPUT_TEXT_ALIGNMENTS, INPUT_TYPES, INTERACTIVE_TAGS, ITALIC_ICON, IconButtonComponent, IconDirective, InputComponent, InputDirective, InputMaskDirective, InputPrefixDirective, InputSuffixDirective, KICK_PLAYER_TOKEN, KickPlayerComponent, KickPlayerDirective, KickPlayerParamsDirective, KickPlayerSlotComponent, LINK_ICON, LIST_BULLETED_ICON, LIST_NUMBERED_ICON, LOADER_LABELS, LOCATION_ICON, LOCK_ICON, LabelDirective, MASKED_INPUT_ERROR_CODES, MASKED_INPUT_IMPORTS, MASK_VALUE_MODES, MASONRY_ERROR_CODES, MASONRY_IMPORTS, MASONRY_TOKEN, MATCH_CARD_IMPORTS, MATCH_CARD_SIZES, MATCH_CARD_TOKEN, MATCH_ERROR_CODES, MATCH_LABELS, MATCH_PARTICIPANT_IMPORTS, MENU_ERROR_CODES, MENU_IMPORTS, MENU_ITEM_VARIANTS, MENU_SELECTION_GROUP_MULTIPLE, MENU_SELECTION_GROUP_TOKEN, MENU_SELECTION_ITEM_KIND, MINUS_ICON, MULTI_LANGUAGE_RICH_TEXT_EDITOR_ERROR_CODES, MULTI_LANGUAGE_RICH_TEXT_EDITOR_IMPORTS, MasonryDirective, MasonryItemDirective, MatchCardComponent, MatchCardDirective, MatchCardGameScoresDirective, MatchCardMetaDirective, MatchCardScoreDirective, MatchParticipantComponent, MatchScoreComponent, MenuCheckboxGroupComponent, MenuCheckboxItemComponent, MenuComponent, MenuContextTriggerDirective, MenuDirective, MenuGroupLabelComponent, MenuItemComponent, MenuItemDirective, MenuItemShortcutComponent, MenuPanelDirective, MenuRadioGroupComponent, MenuRadioItemComponent, MenuSearchDirective, MenuSelectionGroupDirective, MenuSelectionItemDirective, MenuSeparatorComponent, MenuSurfaceDirective, MenuTriggerDirective, MultiLanguageRichTextEditorComponent, MultiLanguageRichTextEditorDirective, MultiLanguageRichTextEditorLanguageToolComponent, NAV_TABS_TOKEN, NAV_TAB_IMPORTS, NOTIFICATION_ACTION_SLOTS, NOTIFICATION_ERROR_CODES, NOTIFICATION_IMPORTS, NOTIFICATION_LABELS, NOTIFICATION_STACK_CONTEXT_TOKEN, NOTIFICATION_STATUS, NUMBER_INPUT_IMPORTS, NavTabLinkComponent, NavTabLinkDirective, NavTabsComponent, NavTabsDirective, NavTabsOutletComponent, NavTabsOutletDirective, NotificationActionDirective, NotificationComponent, NotificationDirective, NotificationDismissDirective, NotificationItemDirective, NotificationStackDirective, NotificationSwipeToDismissDirective, NumberInputComponent, NumberInputDirective, OTP_INPUT_IMPORTS, OVERLAY_BACK_OR_CLOSE_TOKEN, OVERLAY_BODY_TOKEN, OVERLAY_CONFIG_CLASS_KEYS, OVERLAY_CONTENT_IMPORTS, OVERLAY_ERROR_CODES, OVERLAY_FOOTER_TOKEN, OVERLAY_HEADER_TEMPLATE_TOKEN, OVERLAY_HEADER_TOKEN, OVERLAY_IMPORTS, OVERLAY_MAIN_TOKEN, OVERLAY_QUERY_PARAM_INPUT_NAME, OVERLAY_REF, OVERLAY_ROUTER_CONFIG_TOKEN, OVERLAY_ROUTER_LINK_TOKEN, OVERLAY_ROUTER_OUTLET_DISABLED_TEMPLATE_TOKEN, OVERLAY_ROUTER_OUTLET_TOKEN, OVERLAY_ROUTER_TOKEN, OVERLAY_SHARED_ROUTE_TEMPLATE_TOKEN, OtpInputComponent, OtpInputDirective, OverlayAnchorDirective, OverlayBackOrCloseDirective, OverlayBodyComponent, OverlayCloseDirective, OverlayContainerComponent, OverlayDirective, OverlayFooterDirective, OverlayHeaderDirective, OverlayHeaderTemplateDirective, OverlayMainDirective, OverlayOriginCloneComponent, OverlayRouteHeaderTemplateOutletComponent, OverlayRouterLinkDirective, OverlayRouterOutletComponent, OverlayRouterOutletDisabledTemplateDirective, OverlaySharedRouteTemplateDirective, OverlaySharedRouteTemplateOutletComponent, OverlaySidebarComponent, OverlaySidebarPageComponent, OverlaySurfaceDirective, OverlayTitleDirective, OverlayTriggerDirective, PAGE_SIZE_SELECT_IMPORTS, PAGINATION_IMPORTS, PAGINATION_LABELS, PARAGRAPH_ICON, PASSWORD_INPUT_IMPORTS, PAUSE_ICON, PENCIL_ICON, PHONE_COUNTRIES, PHONE_INPUT_ERROR_CODES, PHONE_INPUT_IMPORTS, PHONE_INPUT_LABELS, PICTURE_IMPORTS, PICTURE_STATES, PIP_CHROME_REF_TOKEN, PIP_ENTRY_TOKEN, PIP_WINDOW_ASPECT_RATIO_TOKEN, PLAY_ICON, PLUS_ICON, PROGRESS_STEPS_IMPORTS, PROGRESS_STEP_STATES, PageSizeSelectComponent, PaginationComponent, PaginationDirective, PaginationSeoDirective, PasswordInputComponent, PasswordInputDirective, PhoneInputComponent, PhoneInputDirective, PhoneInputFieldDirective, PhoneInputFlagDirective, PictureComponent, PictureErrorDirective, PicturePlaceholderDirective, PipBackDirective, PipBringBackDirective, PipCellDirective, PipCloseDirective, PipCollapseOverlayDirective, PipGridToggleDirective, PipPlayerComponent, PipSlotPlaceholderComponent, PipStageDirective, PipTitleBarDirective, PipTitleBarTemplateDirective, PipWindowComponent, PipWindowParamsDirective, ProgressBarComponent, ProgressStepComponent, ProgressStepsComponent, QUERY_DEVTOOLS_IMPORTS, QUERY_ERROR_ERROR_CODES, QUERY_ERROR_IMPORTS, QUERY_ERROR_LABELS, QUERY_ERROR_TOKEN, QUOTE_ICON, QueryDevtoolsComponent, QueryDevtoolsJsonComponent, QueryDevtoolsJsonStylesComponent, QueryDevtoolsTimelineStylesComponent, QueryDevtoolsToggleComponent, QueryErrorActionsDirective, QueryErrorComponent, QueryErrorDirective, QueryErrorTitleDirective, QueryParamOverlayLinkDirective, RADIO_GROUP_IMPORTS, RADIO_VARIANTS, RATING_IMPORTS, REDO_ICON, RICH_TEXT_EDITOR_FLOATING_TOOLBAR, RICH_TEXT_EDITOR_HEADING_OPTIONS, RICH_TEXT_EDITOR_IMPORTS, RICH_TEXT_EDITOR_INLINE_TOOLS, RICH_TEXT_EDITOR_LABELS, RICH_TEXT_EDITOR_LANGUAGE_TOOL, RICH_TEXT_EDITOR_LINK_EDITOR, RICH_TEXT_EDITOR_TOKEN_CODEC, RICH_TEXT_EDITOR_TOKEN_PALETTE_IMPORTS, RICH_TEXT_EDITOR_TOOL, RICH_TEXT_EDITOR_TOOLS, RICH_TEXT_EDITOR_TOOL_BUTTONS, RICH_TEXT_EDITOR_TRIGGERS_IMPORTS, ROTATE_RIGHT_ICON, RadioComponent, RadioGroupComponent, RangeSliderComponent, RangeSliderDirective, RatingComponent, RatingDirective, RatingIconDirective, RichTextEditorAlignToolComponent, RichTextEditorComponent, RichTextEditorDirective, RichTextEditorFloatingToolbarComponent, RichTextEditorFloatingToolbarDirective, RichTextEditorHeadingToolComponent, RichTextEditorImageEditorComponent, RichTextEditorImageStylesComponent, RichTextEditorImageToolComponent, RichTextEditorLinkEditorComponent, RichTextEditorLinkEditorDirective, RichTextEditorTableStylesComponent, RichTextEditorTableToolComponent, RichTextEditorTokenPaletteComponent, RichTextEditorTokenPopupComponent, RichTextEditorTriggersDirective, SCHEDULER_EDIT_SURFACE_HOST, SCHEDULER_EDIT_SURFACE_OVERLAY, SCHEDULER_ERROR_CODES, SCHEDULER_FEATURE_HOST, SCHEDULER_IMPORTS, SCHEDULER_LABELS, SCROLLABLE_DARKEN_IMPORTS, SCROLLABLE_DRAG_IMPORTS, SCROLLABLE_ERROR_CODES, SCROLLABLE_IMPORTS, SCROLLABLE_NAVIGATION_IMPORTS, SEGMENTED_BUTTON_GROUP_VARIANTS, SEGMENTED_BUTTON_IMPORTS, SELECTION_LIST_IMPORTS, SELECTION_LIST_MULTIPLE, SELECTION_LIST_TOKEN, SELECT_ERROR_CODES, SELECT_FILTER_MODES, SELECT_IMPORTS, SELECT_LABELS, SIDEBAR_OVERLAY_CONFIG, SIDEBAR_OVERLAY_TOKEN, SINGLE_ELIMINATION_BRACKET_ROUND_TYPE, SKELETON_IMPORTS, SLIDER_ERROR_CODES, SLIDER_IMPORTS, SLIDER_LABELS, SLIDER_MARK_VALUE_ATTRIBUTE, SLIDER_TOKEN, SNAP_HYSTERESIS, SOOP_PLAYER_TOKEN, SPLIT_BUTTON_ERROR_CODES, STANDINGS_ERROR_CODES, STANDINGS_IMPORTS, STANDINGS_LABELS, STAR_ICON, STREAM_ALL_IMPORTS, STREAM_CONSENT_TOKEN, STREAM_DAILYMOTION_IMPORTS, STREAM_FACEBOOK_IMPORTS, STREAM_IMPORTS, STREAM_KICK_IMPORTS, STREAM_LABELS, STREAM_PIP_IMPORTS, STREAM_PLAYER_COMPONENT_TOKEN, STREAM_PLAYER_ERROR_CONTEXT_TOKEN, STREAM_PLAYER_ERROR_TOKEN, STREAM_PLAYER_PARAMS_TOKEN, STREAM_PLAYER_SLOT_TOKEN, STREAM_PLAYER_TOKEN, STREAM_SLOT_PLAYER_ID_TOKEN, STREAM_SOOP_IMPORTS, STREAM_TIKTOK_IMPORTS, STREAM_TWITCH_IMPORTS, STREAM_USER_CONSENT_PROVIDER_TOKEN, STREAM_VIMEO_IMPORTS, STREAM_YOUTUBE_IMPORTS, STRIKETHROUGH_ICON, SUPPORT_CONTENT_STATE, SUPPORT_TRANSITION_DIRECTION, SWISS_BRACKET_ROUND_TYPE, SWITCH_IMPORTS, SchedulerActionAddAppointmentDirective, SchedulerActionAddSubAppointmentDirective, SchedulerActionDeleteDirective, SchedulerAgendaDirective, SchedulerAgendaViewComponent, SchedulerBadgeChainCountComponent, SchedulerBadgeChainCountDirective, SchedulerBadgeColorDotComponent, SchedulerBadgeColorDotDirective, SchedulerBadgeLocationComponent, SchedulerBadgeLocationDirective, SchedulerBadgeTimeRangeComponent, SchedulerBadgeTimeRangeDirective, SchedulerBadgeTitleComponent, SchedulerBadgeTitleDirective, SchedulerComponent, SchedulerDirective, SchedulerEditColorComponent, SchedulerEditColorDirective, SchedulerEditDescriptionComponent, SchedulerEditDescriptionDirective, SchedulerEditLocationComponent, SchedulerEditLocationDirective, SchedulerEditSurfaceComponent, SchedulerEditSurfaceDirective, SchedulerEditTimeRangeComponent, SchedulerEditTimeRangeDirective, SchedulerEditTitleComponent, SchedulerEditTitleDirective, SchedulerMonthDirective, SchedulerMonthViewComponent, SchedulerTimeGridDirective, SchedulerTimeGridViewComponent, ScrollableActiveChildDirective, ScrollableButtonsComponent, ScrollableButtonsDirective, ScrollableComponent, ScrollableDarkenDirective, ScrollableDirective, ScrollableDragDirective, ScrollableIgnoreChildDirective, ScrollableLoadingTemplateDirective, ScrollableMasksComponent, ScrollableNavigationComponent, ScrollableNavigationDirective, ScrollableSnapDirective, SegmentedButtonComponent, SegmentedButtonGroupComponent, SelectComponent, SelectDirective, SelectEmptyDirective, SelectErrorDirective, SelectListboxDirective, SelectLoadingDirective, SelectOptionComponent, SelectOptionDirective, SelectOptionGroupComponent, SelectOptionGroupDirective, SelectOptionTemplateDirective, SelectOptionsDirective, SelectPanelComponent, SelectSearchDirective, SelectSurfaceDirective, SelectTriggerDirective, SelectValueDirective, SelectViewportDirective, SelectVirtualOptionComponent, SelectVirtualOptionDirective, SelectionListControlDirective, SelectionListDirective, SelectionOptionDirective, SkeletonComponent, SkeletonItemComponent, SkeletonTextComponent, SliderComponent, SliderDirective, SliderThumbDirective, SliderThumbLabelDirective, SliderTrackDirective, SoopPlayerComponent, SoopPlayerDirective, SoopPlayerParamsDirective, SoopPlayerSlotComponent, SpinnerComponent, SplitButtonActionDirective, SplitButtonComponent, SplitButtonDirective, SplitButtonTriggerDirective, StandingsComponent, StandingsDirective, StreamConsentAcceptDirective, StreamConsentComponent, StreamConsentDirective, StreamPipChromeComponent, StreamPlayerErrorComponent, StreamPlayerErrorDirective, StreamPlayerLoadingComponent, StreamPlayerSlotDirective, SwitchComponent, SwitchDirective, TABLE_CELL_ERROR_TOOLTIP_IMPORTS, TABLE_COLUMN_CHOOSER_IMPORTS, TABLE_COLUMN_MENU_IMPORTS, TABLE_CSV_EXPORT_IMPORTS, TABLE_ERROR_CODES, TABLE_FEATURE_HOST, TABLE_FILTER_IMPORTS, TABLE_GROUP_HEADERS_IMPORTS, TABLE_ICON, TABLE_IMPORTS, TABLE_INLINE_EDIT_IMPORTS, TABLE_KEYBOARD_NAV_IMPORTS, TABLE_LABELS, TABLE_REORDER_IMPORTS, TABLE_RESIZE_IMPORTS, TABLE_ROW_EXPANSION_IMPORTS, TABLE_SELECTION_IMPORTS, TABLE_SKELETON_IMPORTS, TABLE_STATE_PERSISTENCE_IMPORTS, TABLE_STICKY_COLUMNS_IMPORTS, TABLE_VIRTUAL_SCROLL_IMPORTS, TAB_BAR_FITS, TAB_BAR_ORIENTATIONS, TAB_BAR_TOKEN, TAB_BAR_TRIGGER_TOKEN, TAB_BAR_VARIANTS, TAB_ERROR_CODES, TAB_GROUP_TOKEN, TAB_IMPORTS, TAB_PANEL_TOKEN, TAB_SIZES, TAG_INPUT_ERROR_CODES, TAG_INPUT_IMPORTS, TEXTAREA_IMPORTS, TEXTAREA_RESIZE_MODES, TEXT_ALIGNS, TIKTOK_PLAYER_TOKEN, TIMES_ICON, TIME_FORMAT, TIME_INPUT_ERROR_CODES, TIME_INPUT_IMPORTS, TIME_PICKER_ERROR_CODES, TIME_PICKER_IMPORTS, TIME_PICKER_LABELS, TOGGLETIP_ERROR_CODES, TOGGLETIP_IMPORTS, TOOLBAR_IMPORTS, TOOLBAR_ORIENTATIONS, TOOLTIP_ERROR_CODES, TOOLTIP_IMPORTS, TOURNAMENT_MODE, TRASH_ICON, TREE_ERROR_CODES, TREE_IMPORTS, TREE_LEVEL_STATUSES, TREE_MARKERS, TREE_SELECTION_MODES, TRIANGLE_EXCLAMATION_ICON, TROPHY_ICON, TWITCH_PLAYER_TOKEN, TabBarDirective, TabBarTriggerDirective, TabBarUnderlineDirective, TabComponent, TabGroupComponent, TabGroupDirective, TabLabelDirective, TabPanelDirective, TabTriggerDirective, TableCellDirective, TableCellEditDirective, TableCellErrorMarkComponent, TableCellErrorTooltipDirective, TableCellSkeletonDirective, TableColumnChooserComponent, TableColumnMenuDirective, TableColumnMenuTriggerComponent, TableComponent, TableCsvExportDirective, TableDetailStylesComponent, TableExpanderCellComponent, TableFilterOptionDirective, TableFilterTriggerComponent, TableFiltersDirective, TableFooterCellDirective, TableFooterDirective, TableGroupHeaderRowComponent, TableGroupHeadersDirective, TableHeaderCellDirective, TableInlineEditDirective, TableInlineEditStylesComponent, TableKeyboardNavDirective, TableReorderDirective, TableReorderOverlayComponent, TableResizeDirective, TableResizeGripComponent, TableRowDetailComponent, TableRowExpansionDirective, TableSelectAllCellComponent, TableSelectCellComponent, TableSelectionDirective, TableSkeletonDirective, TableSkeletonRowsComponent, TableStatePersistenceDirective, TableStickyColumnsDirective, TableVirtualScrollDirective, TableVirtualScrollStylesComponent, TagInputComponent, TagInputDirective, TagInputFieldDirective, TextButtonComponent, TextFieldControlDirective, TextareaComponent, TextareaDirective, TikTokPlayerComponent, TikTokPlayerDirective, TikTokPlayerParamsDirective, TikTokPlayerSlotComponent, TimeInputComponent, TimeInputDirective, TimeInputFieldDirective, TimePickerColumnDirective, TimePickerComponent, TimePickerDirective, TimePickerOptionDirective, ToggletipCloseDirective, ToggletipComponent, ToggletipDirective, ToggletipTriggerDirective, ToolbarComponent, ToolbarDirective, TooltipComponent, TooltipDirective, TreeComponent, TreeDirective, TreeMarkerComponent, TreeNodeDefDirective, TreeNodeDirective, TwitchPlayerComponent, TwitchPlayerDirective, TwitchPlayerParamsDirective, TwitchPlayerSlotComponent, UNDERLINE_ICON, UNDO_ICON, UNIT_MS, UPLOAD_ICON, VIMEO_PLAYER_TOKEN, VimeoPlayerComponent, VimeoPlayerDirective, VimeoPlayerParamsDirective, VimeoPlayerSlotComponent, WINDOW_CONTROL_BUTTON_KINDS, WINDOW_CONTROL_BUTTON_SIZES, WindowControlButtonComponent, YOUTUBE_PLAYER_SLOT_TOKEN, YOUTUBE_PLAYER_TOKEN, YoutubePlayerComponent, YoutubePlayerDirective, YoutubePlayerParamsDirective, YoutubePlayerSlotComponent, YoutubePlayerSlotDirective, abortFullscreenAnimation, anchoredDialogOverlayStrategy, anchoredOverlayStrategy, autoPlace, bottomSheetOverlayStrategy, bracketFitsWidth, bracketNaturalWidth, buildAnchoredRuntimePositionStrategy, canHaveChildren, cascaderFromQuery, centeredOverlayStrategy, clampPosition, clampResizeRect, cleanupFullscreenAnimation, cleanupFullscreenAnimationStyles, compactLayout, computeGeometry, computeGridHeight, countDescendants, createAnchoredPanelController, createAutoScroller, createCardMask, createCurrencyMask, createDefaultDropzoneArgs, createDropzoneUpload, createExistingDropzoneEntry, createFileDropzoneEntry, createFixedLengthRangeStrategy, createGridAdapter, createIbanMask, createNormalizedBracketMatch, createNotificationPromiseFn, createNotificationRef, createOverlayOpener, createOverlayRef, createOverlayStrategyController, createOverlayUnsavedChangesGuard, createPipChromeAnimations, createPipChromeState, createRichTextEditorTrigger, createRichTextEditorTriggerWithQuery, createStreamConfig, createStreamPlayerSlot, createTableRowsSource, createTableStateStorage, createV2DropzoneUpload, createWeekRangeStrategy, defaultCompareWith$1 as defaultCompareWith, defaultDropzoneRejectionMessage, defineOverlay, defineQueryParamOverlay, deriveDurationFormatSpec, deserializeGridLayout, deserializeTableState, dialogOverlayStrategy, disposeDropzoneEntry, doubleEliminationBracketLayout, dropzoneFiles, enableDragToDismiss, extractFirstImageUrl, filterOverlayLabelsForLocale, filterOverlayPreviewFromQuery, filterRows, findCollision, findNextRelevantHtmlElement, findScrollableAncestor, formatDuration, formatFileSize, fromGridPosition, fullScreenDialogOverlayStrategy, generateBracketDataForEthlete, generateRoundTypeFromEthleteRoundType, generateTournamentModeFormEthleteRounds, getClosestOverlay, getOriginCoordinatesAndDimensions, hysteresisRound, iconRegistryKey, indexOfNode, injectAnchoredDialogStrategy, injectAnchoredDialogStrategyDefaults, injectBannerLabels, injectBottomSheetStrategy, injectBottomSheetStrategyDefaults, injectBracketConfig, injectBracketLabels, injectBreadcrumbLabels, injectBreadcrumbManager, injectCalendarLabels, injectCarouselLabels, injectCascaderLabels, injectChipLabels, injectDateFormat, injectDateLocale, injectDateTimeLabels, injectDialogStrategy, injectDialogStrategyDefaults, injectDropzoneLabels, injectFilterOverlay, injectFilterOverlayLabels, injectFormFieldLabels, injectFormSupport, injectFullscreenDialogStrategy, injectFullscreenDialogStrategyDefaults, injectGridConfig, injectGridLabels, injectInputLabels, injectLeftSheetStrategy, injectLeftSheetStrategyDefaults, injectLoaderLabels, injectMatchLabels, injectNotificationLabels, injectNotificationManager, injectNotificationManagerConfig, injectOverlayManager, injectOverlayRouter, injectOverlayScrollBlocker, injectOverlaySurfaceContext, injectPaginationLabels, injectPhoneInputLabels, injectPictureConfig, injectPipChromeManager, injectPipManager, injectPipSlotPlaceholderConfig, injectQueryErrorLabels, injectRichTextEditorLabels, injectRichTextEditorTools, injectRightSheetStrategy, injectRightSheetStrategyDefaults, injectSchedulerEditSurfaceHost, injectSchedulerFeatureHost, injectSchedulerLabels, injectSelectLabels, injectSidebarOverlay, injectSliderLabels, injectStandingsLabels, injectStreamConfig, injectStreamConsentConfig, injectStreamLabels, injectStreamManager, injectStreamPlayerErrorConfig, injectStreamPlayerLoadingConfig, injectStreamScriptLoader, injectStreamUserConsentProvider, injectTableCsvExport, injectTableFeatureHost, injectTableLabels, injectTimeFormat, injectTimePickerLabels, injectTopSheetStrategy, injectTopSheetStrategyDefaults, isFileAccepted, isHtmlElement, isInteractiveElement, isPointerEvent, isTargetInsideOverlayTree, isTouchEvent, itemsCollide, kindOf, leftSheetOverlayStrategy, legacyQueryErrorSource, mapLayoutToBreakpoint, matchCountryByDialCode, matchParticipantDisplayName, mergeOverlayBreakpointConfigs, mergeOverlayConfigs, mirroredDoubleEliminationBracketLayout, mirroredSingleEliminationBracketLayout, mountRichTextEditorImageStyles, mountRichTextEditorTableStyles, nodesEqual$1 as nodesEqual, normalizeEthleteBracketMatch, normalizeEthleteGroupRanking, normalizeEthleteMatch, normalizeEthleteMatchStatus, normalizeEthleteMedia, normalizeEthleteParticipant, normalizeEthletePlacement, normalizePictureSizes, normalizePictureSource, paginate, parseDuration, phoneCountryFlag, phoneCountryName, pixelRectsEqual, positionToPixelRect, positionsEqual, projectDragCell, provideAnchoredDialogStrategy, provideAnchoredDialogStrategyDefaults, provideBannerLabels, provideBottomSheetStrategy, provideBottomSheetStrategyDefaults, provideBracketConfig, provideBracketLabels, provideBreadcrumbLabels, provideBreadcrumbManager, provideCalendarLabels, provideCarouselLabels, provideCascaderLabels, provideChipLabels, provideDateFormat, provideDateLocale, provideDateTimeLabels, provideDialogStrategy, provideDialogStrategyDefaults, provideDropzoneLabels, provideFilterOverlay, provideFilterOverlayLabels, provideFormErrorMessageResolver, provideFormFieldLabels, provideFormSupport, provideFullscreenDialogStrategy, provideFullscreenDialogStrategyDefaults, provideGridConfig, provideGridLabels, provideIconOverrides, provideIcons, provideInputLabels, provideLeftSheetStrategy, provideLeftSheetStrategyDefaults, provideLoaderLabels, provideMatchLabels, provideNotificationLabels, provideNotificationManager, provideNotificationManagerConfig, provideNotificationManagerInstance, provideOverlay, provideOverlayManager, provideOverlayRouter, provideOverlayRouterConfig, provideOverlayRouterService, provideOverlayScrollBlocker, providePaginationLabels, providePhoneInputLabels, providePictureConfig, providePipChromeManager, providePipManager, providePipSlotPlaceholderConfig, provideQueryErrorLabels, provideRichTextEditorAlignmentTool, provideRichTextEditorAutoformat, provideRichTextEditorBlockquoteTool, provideRichTextEditorCodeBlockTool, provideRichTextEditorDefaultTools, provideRichTextEditorFloatingToolbar, provideRichTextEditorHeadingTool, provideRichTextEditorImageTool, provideRichTextEditorLabels, provideRichTextEditorLanguageTool, provideRichTextEditorLinkEditor, provideRichTextEditorLinkTool, provideRichTextEditorTableTool, provideRichTextEditorTokenRendering, provideRichTextEditorTools, provideRightSheetStrategy, provideRightSheetStrategyDefaults, provideSchedulerLabels, provideSelectLabels, provideSidebarOverlay, provideSidebarOverlayConfig, provideSidebarOverlayService, provideSliderLabels, provideStandingsLabels, provideStreamConfig, provideStreamConsentConfig, provideStreamLabels, provideStreamManager, provideStreamPlayerErrorConfig, provideStreamPlayerLoadingConfig, provideTableLabels, provideTimeFormat, provideTimePickerLabels, provideTopSheetStrategy, provideTopSheetStrategyDefaults, queryErrorLabelsForLocale, queryErrorResponseFromLegacyError, reconcileColumnOrder, reconcileColumnWidths, reconcileHiddenColumns, reduceSupportPresentation, registerSingleton, requiredLanguages, resizeSpanBounds, resolveBracketLayout, resolveBreakpoint, resolveClosestOverlay, resolveCollisions, resolveFilterOverlaySubmitButton, resolveNotificationStatusIcon, resolveTableCsvRows, richTextEditorToolLabel, rightSheetOverlayStrategy, rowsToPixelHeight, schedulerFeatureConfig, selectOptionsFromQuery, selectOptionsFromV2Query, serializeGridLayout, serializeTableState, setupRichTextEditorFloatingToolbar, setupRichTextEditorLinkEditor, singleEliminationBracketLayout, snapResizeSpan, sortRows, spanHeight, spanWidth, startFullscreenEnterAnimation, startFullscreenLeaveAnimation, startImageUpload, startOfCalendarUnit, stripTrunkZero, supportPresentationIncludesState, swissBracketLayout, tableCsvRowsFromPages, tableFeatureConfig, tableRowsFromQuery, tableRowsFromV2Query, tableToCsv, toChildrenObservable$1 as toChildrenObservable, toGridPosition, toNotificationContent, toPathObservable, toSearchObservable, topSheetOverlayStrategy, transformingBottomSheetToDialogOverlayStrategy, transformingFullScreenDialogToDialogOverlayStrategy, transformingFullScreenDialogToRightSheetOverlayStrategy, wireFormSupport, withPictureBaseUrl };
 //# sourceMappingURL=ethlete-components.mjs.map