@ethlete/components 1.0.0-next.52 → 1.0.0-next.54
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +26 -0
- package/fesm2022/ethlete-components.mjs +236 -51
- package/fesm2022/ethlete-components.mjs.map +1 -1
- package/package.json +1 -1
- package/types/ethlete-components.d.ts +160 -11
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { InjectionToken, input, booleanAttribute, signal, computed, effect, untracked, Directive, inject, afterNextRender, DestroyRef, TemplateRef, ElementRef, model, linkedSignal, ViewEncapsulation, Component, numberAttribute, contentChildren, Injector, output, runInInjectionContext, contentChild, NgZone, ApplicationRef, viewChild, ViewContainerRef, createEnvironmentInjector, DOCUMENT, EnvironmentInjector, inputBinding, createComponent, isSignal, assertInInjectionContext, isDevMode as isDevMode$1, provideEnvironmentInitializer, viewChildren, afterRenderEffect, outputBinding, afterEveryRender, PLATFORM_ID } from '@angular/core';
|
|
3
3
|
import * as i1 from '@ethlete/core';
|
|
4
|
-
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, resolveOverlayLayer, defineRootProvider, injectOverlayRuntime, anchoredOverlayPosition, enableAnchoredOverlayPositionExtras, randomId, forceReflow, nextFrame, elementCanScroll, matchesReducedMotion, createSwipeTracker, ScrollObserverDirective, signalElementScrollState, ScrollObserverStartDirective, ScrollObserverEndDirective, applyHostListener, injectQueryParam, defineProvider, fromNextFrame, injectRoute, createUnsavedChangesTracker, createDocumentElementSignal, 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, isOnHigherOverlayLayer, injectAnimatedBlockSize, injectObserveBreakpoint, signalDeferredLoading, AnimatableDirective, ColorInteractiveContainerDirective, ColorInteractiveExcludeDirective, createFlipAnimation, createObjectUrlHandle, createFlipAnimationGroup, focusElement, isFocusable, getFocusableElements, ColorInteractiveHasFocusDirective, dragGestureFrom, injectFocusVisibleTracker, htmlToMarkdown, markdownToHtml, injectHasTouchInput, signalHostElementDimensions, DragHandleDirective, ResizeHandlesComponent, numberBreakpointTransform, applyLinkBinding, applyHeadTitleBinding, injectColorPalette,
|
|
4
|
+
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, resolveOverlayLayer, defineRootProvider, injectOverlayRuntime, anchoredOverlayPosition, enableAnchoredOverlayPositionExtras, randomId, forceReflow, nextFrame, elementCanScroll, matchesReducedMotion, createSwipeTracker, ScrollObserverDirective, signalElementScrollState, ScrollObserverStartDirective, ScrollObserverEndDirective, applyHostListener, injectQueryParam, defineProvider, fromNextFrame, injectRoute, createUnsavedChangesTracker, createDocumentElementSignal, 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, isOnHigherOverlayLayer, injectAnimatedBlockSize, injectObserveBreakpoint, signalDeferredLoading, AnimatableDirective, ColorInteractiveContainerDirective, ColorInteractiveExcludeDirective, createFlipAnimation, createObjectUrlHandle, createFlipAnimationGroup, focusElement, isFocusable, getFocusableElements, injectParentSurface, ColorInteractiveHasFocusDirective, dragGestureFrom, injectFocusVisibleTracker, htmlToMarkdown, markdownToHtml, injectHasTouchInput, signalHostElementDimensions, DragHandleDirective, ResizeHandlesComponent, numberBreakpointTransform, DEFAULT_OVERLAY_LAYER, injectSurfaceType, applyLinkBinding, applyHeadTitleBinding, injectColorPalette, injectViewportSize, injectFileDownload, injectRouterEvent, canUseSessionMemory, createAutoSessionMemoryKey, createSessionMemory } from '@ethlete/core';
|
|
5
5
|
import { NgTemplateOutlet, NgComponentOutlet, Location, DOCUMENT as DOCUMENT$1, isPlatformBrowser } from '@angular/common';
|
|
6
6
|
import { DomSanitizer } from '@angular/platform-browser';
|
|
7
7
|
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, differenceInCalendarDays, addMinutes, differenceInMinutes, addHours } from 'date-fns';
|
|
8
8
|
import { takeUntilDestroyed, toSignal, toObservable, outputFromObservable, outputToObservable, rxResource } from '@angular/core/rxjs-interop';
|
|
9
9
|
import { Subject, take, tap, timer, takeUntil, fromEvent, filter, switchMap, map, combineLatest, 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';
|
|
10
10
|
import * as i1$1 from '@angular/router';
|
|
11
|
-
import { Router, RouterLink, RouterLinkActive, NavigationEnd } from '@angular/router';
|
|
11
|
+
import { Router, RouterLink, ActivatedRoute, RouterLinkActive, NavigationEnd } from '@angular/router';
|
|
12
12
|
import { withArgs, queryStateSignal, isQueryStateSuccess, isQueryStateFailure, isQueryStateLoading, executeUntilSettled, extractQuery, queryComputed, parseHttpErrorCodeToMessageEn, parseHttpErrorCodeToTitleEn, parseHttpErrorCodeToMessageDe, parseHttpErrorCodeToTitleDe, queryErrorMessages, createQueryErrorResponse } from '@ethlete/query';
|
|
13
13
|
import { createMetadataKey, metadata, FORM_FIELD, validate, createManagedMetadataKey, submit, form } from '@angular/forms/signals';
|
|
14
14
|
import { enUS } from 'date-fns/locale/en-US';
|
|
@@ -10515,9 +10515,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
10515
10515
|
}] });
|
|
10516
10516
|
|
|
10517
10517
|
const DIALOG_STRATEGY_DEFAULTS_DEF = /* @__PURE__ */ defineStaticRootProvider({
|
|
10518
|
-
|
|
10519
|
-
|
|
10520
|
-
|
|
10518
|
+
// Percentages, not viewport units: the pane is the item of a full-size grid cell, and that cell is
|
|
10519
|
+
// what a reservation shrinks. `80vh` would size a dialog against space a docked panel covers.
|
|
10520
|
+
maxHeight: '80%',
|
|
10521
|
+
maxWidth: '80%',
|
|
10522
|
+
width: 'min(512px, 80%)',
|
|
10521
10523
|
containerClass: 'et-overlay--dialog',
|
|
10522
10524
|
stylesComponent: DialogStylesComponent,
|
|
10523
10525
|
positionStrategy: () => ({ kind: 'global' }),
|
|
@@ -19121,11 +19123,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
19121
19123
|
*/
|
|
19122
19124
|
class FloatingActionStylesComponent {
|
|
19123
19125
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: FloatingActionStylesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
19124
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.7", type: FloatingActionStylesComponent, isStandalone: true, selector: "et-floating-action-styles", ngImport: i0, template: '', isInline: true, styles: ["@layer components{@property --et-floating-action-inset-inline-end{syntax: \"<length>\"; inherits: true; initial-value: 24px;}@property --et-floating-action-inset-block-end{syntax: \"<length>\"; inherits: true; initial-value: 24px;}@property --et-floating-action-z-index{syntax: \"<number>\"; inherits: true; initial-value: 10;}@property --et-floating-action-duration{syntax: \"<time>\"; inherits: true; initial-value: .2s;}.et-floating-action{display:block}.et-floating-action:where([data-state=floating]) .et-floating-action-trigger,.et-floating-action:where([data-state=hidden]) .et-floating-action-trigger{position:fixed;inset-inline-end:var(--et-floating-action-inset-inline-end);inset-block-end:calc(var(--et-floating-action-inset-block-end) + env(safe-area-inset-bottom,0px));z-index:var(--et-floating-action-z-index)}.et-floating-action:where([data-state=hidden]) .et-floating-action-trigger{scale:0;visibility:hidden}@media(prefers-reduced-motion:no-preference){.et-floating-action:where([data-state=floating]) .et-floating-action-trigger{animation:et-floating-action-in var(--et-floating-action-duration) var(--ease-3, ease-out)}.et-floating-action:where([data-state=hidden]) .et-floating-action-trigger{transition:scale var(--et-floating-action-duration) var(--ease-3, ease-out),visibility 0s linear var(--et-floating-action-duration)}@keyframes et-floating-action-in{0%{scale:0}to{scale:1}}}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
|
|
19126
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.7", type: FloatingActionStylesComponent, isStandalone: true, selector: "et-floating-action-styles", ngImport: i0, template: '', isInline: true, styles: ["@layer components{@property --et-floating-action-inset-inline-end{syntax: \"<length>\"; inherits: true; initial-value: 24px;}@property --et-floating-action-inset-block-end{syntax: \"<length>\"; inherits: true; initial-value: 24px;}@property --et-floating-action-z-index{syntax: \"<number>\"; inherits: true; initial-value: 10;}@property --et-floating-action-duration{syntax: \"<time>\"; inherits: true; initial-value: .2s;}.et-floating-action{display:block}.et-floating-action:where([data-state=floating]) .et-floating-action-trigger,.et-floating-action:where([data-state=hidden]) .et-floating-action-trigger{position:fixed;inset-inline-end:var(--et-floating-action-inset-inline-end);inset-block-end:calc(var(--et-floating-action-inset-block-end) + env(safe-area-inset-bottom,0px) + var(--et-viewport-inset-bottom, 0px));z-index:var(--et-floating-action-z-index)}.et-floating-action:where([data-state=hidden]) .et-floating-action-trigger{scale:0;visibility:hidden}@media(prefers-reduced-motion:no-preference){.et-floating-action:where([data-state=floating]) .et-floating-action-trigger{animation:et-floating-action-in var(--et-floating-action-duration) var(--ease-3, ease-out)}.et-floating-action:where([data-state=hidden]) .et-floating-action-trigger{transition:scale var(--et-floating-action-duration) var(--ease-3, ease-out),visibility 0s linear var(--et-floating-action-duration)}@keyframes et-floating-action-in{0%{scale:0}to{scale:1}}}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
|
|
19125
19127
|
}
|
|
19126
19128
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: FloatingActionStylesComponent, decorators: [{
|
|
19127
19129
|
type: Component,
|
|
19128
|
-
args: [{ selector: 'et-floating-action-styles', template: '', encapsulation: ViewEncapsulation.None, styles: ["@layer components{@property --et-floating-action-inset-inline-end{syntax: \"<length>\"; inherits: true; initial-value: 24px;}@property --et-floating-action-inset-block-end{syntax: \"<length>\"; inherits: true; initial-value: 24px;}@property --et-floating-action-z-index{syntax: \"<number>\"; inherits: true; initial-value: 10;}@property --et-floating-action-duration{syntax: \"<time>\"; inherits: true; initial-value: .2s;}.et-floating-action{display:block}.et-floating-action:where([data-state=floating]) .et-floating-action-trigger,.et-floating-action:where([data-state=hidden]) .et-floating-action-trigger{position:fixed;inset-inline-end:var(--et-floating-action-inset-inline-end);inset-block-end:calc(var(--et-floating-action-inset-block-end) + env(safe-area-inset-bottom,0px));z-index:var(--et-floating-action-z-index)}.et-floating-action:where([data-state=hidden]) .et-floating-action-trigger{scale:0;visibility:hidden}@media(prefers-reduced-motion:no-preference){.et-floating-action:where([data-state=floating]) .et-floating-action-trigger{animation:et-floating-action-in var(--et-floating-action-duration) var(--ease-3, ease-out)}.et-floating-action:where([data-state=hidden]) .et-floating-action-trigger{transition:scale var(--et-floating-action-duration) var(--ease-3, ease-out),visibility 0s linear var(--et-floating-action-duration)}@keyframes et-floating-action-in{0%{scale:0}to{scale:1}}}}\n"] }]
|
|
19130
|
+
args: [{ selector: 'et-floating-action-styles', template: '', encapsulation: ViewEncapsulation.None, styles: ["@layer components{@property --et-floating-action-inset-inline-end{syntax: \"<length>\"; inherits: true; initial-value: 24px;}@property --et-floating-action-inset-block-end{syntax: \"<length>\"; inherits: true; initial-value: 24px;}@property --et-floating-action-z-index{syntax: \"<number>\"; inherits: true; initial-value: 10;}@property --et-floating-action-duration{syntax: \"<time>\"; inherits: true; initial-value: .2s;}.et-floating-action{display:block}.et-floating-action:where([data-state=floating]) .et-floating-action-trigger,.et-floating-action:where([data-state=hidden]) .et-floating-action-trigger{position:fixed;inset-inline-end:var(--et-floating-action-inset-inline-end);inset-block-end:calc(var(--et-floating-action-inset-block-end) + env(safe-area-inset-bottom,0px) + var(--et-viewport-inset-bottom, 0px));z-index:var(--et-floating-action-z-index)}.et-floating-action:where([data-state=hidden]) .et-floating-action-trigger{scale:0;visibility:hidden}@media(prefers-reduced-motion:no-preference){.et-floating-action:where([data-state=floating]) .et-floating-action-trigger{animation:et-floating-action-in var(--et-floating-action-duration) var(--ease-3, ease-out)}.et-floating-action:where([data-state=hidden]) .et-floating-action-trigger{transition:scale var(--et-floating-action-duration) var(--ease-3, ease-out),visibility 0s linear var(--et-floating-action-duration)}@keyframes et-floating-action-in{0%{scale:0}to{scale:1}}}}\n"] }]
|
|
19129
19131
|
}] });
|
|
19130
19132
|
|
|
19131
19133
|
/**
|
|
@@ -29924,7 +29926,7 @@ class FormFieldComponent {
|
|
|
29924
29926
|
constructor() {
|
|
29925
29927
|
this.provideColor = inject(ProvideColorDirective);
|
|
29926
29928
|
this.provideSurface = inject(ProvideSurfaceDirective);
|
|
29927
|
-
this.
|
|
29929
|
+
this.parentSurface = injectParentSurface();
|
|
29928
29930
|
this.injector = inject(Injector);
|
|
29929
29931
|
this.formFieldDir = inject(FormFieldDirective);
|
|
29930
29932
|
this.errorColorTheme = injectErrorTheme();
|
|
@@ -29977,12 +29979,12 @@ class FormFieldComponent {
|
|
|
29977
29979
|
...(ngDevMode ? [{ debugName: "supportPresentation" }] : /* istanbul ignore next */ []));
|
|
29978
29980
|
this.resolvedSurface = computed(() => {
|
|
29979
29981
|
const themes = this.surfaceThemes;
|
|
29980
|
-
const
|
|
29981
|
-
if (!themes || !
|
|
29982
|
+
const parentSurface = this.parentSurface();
|
|
29983
|
+
if (!themes || !parentSurface) {
|
|
29982
29984
|
return null;
|
|
29983
29985
|
}
|
|
29984
29986
|
const paintsElevatedFill = this.formFieldDir.usesTextFieldShell() && this.fill() === FORM_FIELD_FILLS.FILLED;
|
|
29985
|
-
return resolveSurfaceByElevation(themes,
|
|
29987
|
+
return resolveSurfaceByElevation(themes, parentSurface.type, parentSurface.elevation + (paintsElevatedFill ? 1 : 0));
|
|
29986
29988
|
}, /* @ts-ignore */
|
|
29987
29989
|
...(ngDevMode ? [{ debugName: "resolvedSurface" }] : /* istanbul ignore next */ []));
|
|
29988
29990
|
this.canAnimate = createCanAnimateSignal();
|
|
@@ -48509,7 +48511,7 @@ class GridItemComponent {
|
|
|
48509
48511
|
this.grid = inject(GRID_TOKEN, { optional: true });
|
|
48510
48512
|
this.gridItem = inject(GridItemDirective);
|
|
48511
48513
|
this.provideSurface = inject(ProvideSurfaceDirective);
|
|
48512
|
-
this.
|
|
48514
|
+
this.parentSurface = injectParentSurface();
|
|
48513
48515
|
this.gridDrag = inject(GridDragDirective);
|
|
48514
48516
|
this.gridResize = inject(GridResizeDirective);
|
|
48515
48517
|
this.surfaceThemes = injectSurfaceThemes({ optional: true });
|
|
@@ -48520,10 +48522,10 @@ class GridItemComponent {
|
|
|
48520
48522
|
...(ngDevMode ? [{ debugName: "isReadOnly" }] : /* istanbul ignore next */ []));
|
|
48521
48523
|
this.resolvedSurface = computed(() => {
|
|
48522
48524
|
const themes = this.surfaceThemes;
|
|
48523
|
-
const parent = this.
|
|
48525
|
+
const parent = this.parentSurface();
|
|
48524
48526
|
if (!themes || !parent)
|
|
48525
48527
|
return null;
|
|
48526
|
-
return resolveSurfaceByElevation(themes, parent.
|
|
48528
|
+
return resolveSurfaceByElevation(themes, parent.type, parent.elevation + 1);
|
|
48527
48529
|
}, /* @ts-ignore */
|
|
48528
48530
|
...(ngDevMode ? [{ debugName: "resolvedSurface" }] : /* istanbul ignore next */ []));
|
|
48529
48531
|
effect(() => {
|
|
@@ -49983,12 +49985,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
49983
49985
|
|
|
49984
49986
|
const NOTIFICATION_STACK_CONTEXT_TOKEN = new InjectionToken('NOTIFICATION_STACK_CONTEXT_TOKEN');
|
|
49985
49987
|
|
|
49988
|
+
/**
|
|
49989
|
+
* The stacking level the notification stack paints at: one above the level app overlays mount at, so
|
|
49990
|
+
* a toast stays visible over a dialog, a sheet and their backdrops. Declared as the stack's
|
|
49991
|
+
* `data-et-overlay-layer` too, so a press on a toast does not read as a press outside an overlay
|
|
49992
|
+
* below it, and an overlay opened from a toast action mounts above the stack.
|
|
49993
|
+
*/
|
|
49994
|
+
const NOTIFICATION_STACK_OVERLAY_LAYER = DEFAULT_OVERLAY_LAYER + 1;
|
|
49986
49995
|
class NotificationStackDirective {
|
|
49987
49996
|
constructor() {
|
|
49988
49997
|
this.context = inject(NOTIFICATION_STACK_CONTEXT_TOKEN);
|
|
49989
49998
|
this.destroyRef = inject(DestroyRef);
|
|
49990
49999
|
this.injector = inject(Injector);
|
|
49991
50000
|
this.renderer = injectRenderer();
|
|
50001
|
+
this.OVERLAY_LAYER = NOTIFICATION_STACK_OVERLAY_LAYER;
|
|
49992
50002
|
/** @internal */
|
|
49993
50003
|
this.registeredItems = signal([], /* @ts-ignore */
|
|
49994
50004
|
...(ngDevMode ? [{ debugName: "registeredItems" }] : /* istanbul ignore next */ []));
|
|
@@ -50106,7 +50116,7 @@ class NotificationStackDirective {
|
|
|
50106
50116
|
this.registeredItems.update((items) => items.filter((item) => item.id !== id));
|
|
50107
50117
|
}
|
|
50108
50118
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: NotificationStackDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
50109
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: NotificationStackDirective, isStandalone: true, selector: "[etNotificationStack]", host: { properties: { "attr.data-position": "context.position" } }, exportAs: ["etNotificationStack"], ngImport: i0 }); }
|
|
50119
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: NotificationStackDirective, isStandalone: true, selector: "[etNotificationStack]", host: { properties: { "attr.data-position": "context.position", "attr.data-et-overlay-layer": "OVERLAY_LAYER", "style.--_et-notification-stack-layer": "OVERLAY_LAYER" } }, exportAs: ["etNotificationStack"], ngImport: i0 }); }
|
|
50110
50120
|
}
|
|
50111
50121
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: NotificationStackDirective, decorators: [{
|
|
50112
50122
|
type: Directive,
|
|
@@ -50115,6 +50125,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
50115
50125
|
exportAs: 'etNotificationStack',
|
|
50116
50126
|
host: {
|
|
50117
50127
|
'[attr.data-position]': 'context.position',
|
|
50128
|
+
'[attr.data-et-overlay-layer]': 'OVERLAY_LAYER',
|
|
50129
|
+
'[style.--_et-notification-stack-layer]': 'OVERLAY_LAYER',
|
|
50118
50130
|
},
|
|
50119
50131
|
}]
|
|
50120
50132
|
}], ctorParameters: () => [] });
|
|
@@ -50567,7 +50579,7 @@ class NotificationComponent {
|
|
|
50567
50579
|
this.managerConfig = injectNotificationManagerConfig();
|
|
50568
50580
|
this.labels = injectNotificationLabels();
|
|
50569
50581
|
this.surfaceThemes = injectSurfaceThemes({ optional: true });
|
|
50570
|
-
this.
|
|
50582
|
+
this.surfaceType = injectSurfaceType();
|
|
50571
50583
|
this.resolvedColor = computed(() => {
|
|
50572
50584
|
const mapping = this.managerConfig.statusColorMapping;
|
|
50573
50585
|
if (!mapping)
|
|
@@ -50580,9 +50592,10 @@ class NotificationComponent {
|
|
|
50580
50592
|
const themes = this.surfaceThemes;
|
|
50581
50593
|
if (!themes)
|
|
50582
50594
|
return null;
|
|
50583
|
-
|
|
50584
|
-
|
|
50585
|
-
|
|
50595
|
+
// The stack is appended to <body> and paints above every overlay, so a toast is a layer on the
|
|
50596
|
+
// page - elevation 1, the same level a dialog resolves to. It must not follow what is open
|
|
50597
|
+
// underneath it: that re-shaded every visible toast whenever an overlay came or went.
|
|
50598
|
+
return resolveSurfaceByElevation(themes, this.surfaceType(), 1);
|
|
50586
50599
|
}, /* @ts-ignore */
|
|
50587
50600
|
...(ngDevMode ? [{ debugName: "resolvedSurface" }] : /* istanbul ignore next */ []));
|
|
50588
50601
|
this.controlsColor = computed(() => {
|
|
@@ -50667,7 +50680,7 @@ class NotificationStackComponent {
|
|
|
50667
50680
|
this.stackDirective = inject(NotificationStackDirective);
|
|
50668
50681
|
}
|
|
50669
50682
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: NotificationStackComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
50670
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: NotificationStackComponent, isStandalone: true, selector: "et-notification-stack", host: { attributes: { "role": "log", "aria-live": "polite", "aria-relevant": "additions" }, classAttribute: "et-notification-stack" }, hostDirectives: [{ directive: NotificationStackDirective }], ngImport: i0, template: "@for (ref of stackDirective.displayRefs(); track ref.id) {\n <div [etNotificationItem]=\"ref\">\n <et-notification [ref]=\"ref\" />\n </div>\n}\n", styles: ["@layer components{.et-notification-stack{position:fixed;display:flex;flex-direction:column;align-items:flex-end;gap:var(--et-notification-stack-gap, .5rem);z-index:var(--et-notification-stack-z-index,
|
|
50683
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: NotificationStackComponent, isStandalone: true, selector: "et-notification-stack", host: { attributes: { "role": "log", "aria-live": "polite", "aria-relevant": "additions" }, classAttribute: "et-notification-stack" }, hostDirectives: [{ directive: NotificationStackDirective }], ngImport: i0, template: "@for (ref of stackDirective.displayRefs(); track ref.id) {\n <div [etNotificationItem]=\"ref\">\n <et-notification [ref]=\"ref\" />\n </div>\n}\n", styles: ["@layer components{.et-notification-stack{--_et-notification-inset-block-start: calc(1rem + var(--et-viewport-inset-top, 0px));--_et-notification-inset-block-end: calc(1rem + var(--et-viewport-inset-bottom, 0px));--_et-notification-inset-inline-start: calc(1rem + var(--et-viewport-inset-left, 0px));--_et-notification-inset-inline-end: calc(1rem + var(--et-viewport-inset-right, 0px));--_et-notification-center-shift: calc( (var(--et-viewport-inset-left, 0px) - var(--et-viewport-inset-right, 0px)) / 2 );position:fixed;display:flex;flex-direction:column;align-items:flex-end;gap:var(--et-notification-stack-gap, .5rem);z-index:var(--et-notification-stack-z-index, var(--_et-notification-stack-layer));pointer-events:none;top:var(--_et-notification-inset-block-start);bottom:var(--_et-notification-inset-block-end);justify-content:flex-end;inset-inline-end:var(--_et-notification-inset-inline-end)}.et-notification-stack:dir(rtl){--_et-notification-inset-inline-start: calc(1rem + var(--et-viewport-inset-right, 0px));--_et-notification-inset-inline-end: calc(1rem + var(--et-viewport-inset-left, 0px))}.et-notification-stack[data-position=bottom-center]{justify-content:flex-end;inset-inline:auto;left:calc(50% + var(--_et-notification-center-shift));align-items:center;transform:translate(-50%)}.et-notification-stack[data-position=bottom-start]{justify-content:flex-end;inset-inline-start:var(--_et-notification-inset-inline-start);inset-inline-end:auto;align-items:flex-start;transform:none}.et-notification-stack[data-position=bottom-end]{justify-content:flex-end;inset-inline-start:auto;inset-inline-end:var(--_et-notification-inset-inline-end);align-items:flex-end;transform:none}.et-notification-stack[data-position=top-center]{justify-content:flex-start;inset-inline:auto;left:calc(50% + var(--_et-notification-center-shift));align-items:center;transform:translate(-50%)}.et-notification-stack[data-position=top-start]{justify-content:flex-start;inset-inline-start:var(--_et-notification-inset-inline-start);inset-inline-end:auto;align-items:flex-start;transform:none}.et-notification-stack[data-position=top-end]{justify-content:flex-start;inset-inline-start:auto;inset-inline-end:var(--_et-notification-inset-inline-end);align-items:flex-end;transform:none}@media(max-width:480px){.et-notification-stack,.et-notification-stack[data-position]{left:calc(1rem + var(--et-viewport-inset-left, 0px));right:calc(1rem + var(--et-viewport-inset-right, 0px));align-items:stretch;transform:none}}}\n"], dependencies: [{ kind: "component", type: NotificationComponent, selector: "et-notification" }, { kind: "directive", type: NotificationItemDirective, selector: "[etNotificationItem]", inputs: ["etNotificationItem"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
50671
50684
|
}
|
|
50672
50685
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: NotificationStackComponent, decorators: [{
|
|
50673
50686
|
type: Component,
|
|
@@ -50676,7 +50689,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
50676
50689
|
role: 'log',
|
|
50677
50690
|
'aria-live': 'polite',
|
|
50678
50691
|
'aria-relevant': 'additions',
|
|
50679
|
-
}, template: "@for (ref of stackDirective.displayRefs(); track ref.id) {\n <div [etNotificationItem]=\"ref\">\n <et-notification [ref]=\"ref\" />\n </div>\n}\n", styles: ["@layer components{.et-notification-stack{position:fixed;display:flex;flex-direction:column;align-items:flex-end;gap:var(--et-notification-stack-gap, .5rem);z-index:var(--et-notification-stack-z-index,
|
|
50692
|
+
}, template: "@for (ref of stackDirective.displayRefs(); track ref.id) {\n <div [etNotificationItem]=\"ref\">\n <et-notification [ref]=\"ref\" />\n </div>\n}\n", styles: ["@layer components{.et-notification-stack{--_et-notification-inset-block-start: calc(1rem + var(--et-viewport-inset-top, 0px));--_et-notification-inset-block-end: calc(1rem + var(--et-viewport-inset-bottom, 0px));--_et-notification-inset-inline-start: calc(1rem + var(--et-viewport-inset-left, 0px));--_et-notification-inset-inline-end: calc(1rem + var(--et-viewport-inset-right, 0px));--_et-notification-center-shift: calc( (var(--et-viewport-inset-left, 0px) - var(--et-viewport-inset-right, 0px)) / 2 );position:fixed;display:flex;flex-direction:column;align-items:flex-end;gap:var(--et-notification-stack-gap, .5rem);z-index:var(--et-notification-stack-z-index, var(--_et-notification-stack-layer));pointer-events:none;top:var(--_et-notification-inset-block-start);bottom:var(--_et-notification-inset-block-end);justify-content:flex-end;inset-inline-end:var(--_et-notification-inset-inline-end)}.et-notification-stack:dir(rtl){--_et-notification-inset-inline-start: calc(1rem + var(--et-viewport-inset-right, 0px));--_et-notification-inset-inline-end: calc(1rem + var(--et-viewport-inset-left, 0px))}.et-notification-stack[data-position=bottom-center]{justify-content:flex-end;inset-inline:auto;left:calc(50% + var(--_et-notification-center-shift));align-items:center;transform:translate(-50%)}.et-notification-stack[data-position=bottom-start]{justify-content:flex-end;inset-inline-start:var(--_et-notification-inset-inline-start);inset-inline-end:auto;align-items:flex-start;transform:none}.et-notification-stack[data-position=bottom-end]{justify-content:flex-end;inset-inline-start:auto;inset-inline-end:var(--_et-notification-inset-inline-end);align-items:flex-end;transform:none}.et-notification-stack[data-position=top-center]{justify-content:flex-start;inset-inline:auto;left:calc(50% + var(--_et-notification-center-shift));align-items:center;transform:translate(-50%)}.et-notification-stack[data-position=top-start]{justify-content:flex-start;inset-inline-start:var(--_et-notification-inset-inline-start);inset-inline-end:auto;align-items:flex-start;transform:none}.et-notification-stack[data-position=top-end]{justify-content:flex-start;inset-inline-start:auto;inset-inline-end:var(--_et-notification-inset-inline-end);align-items:flex-end;transform:none}@media(max-width:480px){.et-notification-stack,.et-notification-stack[data-position]{left:calc(1rem + var(--et-viewport-inset-left, 0px));right:calc(1rem + var(--et-viewport-inset-right, 0px));align-items:stretch;transform:none}}}\n"] }]
|
|
50680
50693
|
}] });
|
|
50681
50694
|
|
|
50682
50695
|
const NOTIFICATION_MANAGER_DEF = /* @__PURE__ */ defineRootProvider(() => {
|
|
@@ -59578,6 +59591,8 @@ const TABLE_ERROR_CODES = {
|
|
|
59578
59591
|
CONFLICTING_EXPORT_OPTIONS: 3507,
|
|
59579
59592
|
/** An `expandedRowTemplate` was set on a table without `etTableRowExpansion` to render it. */
|
|
59580
59593
|
MISSING_ROW_EXPANSION: 3508,
|
|
59594
|
+
/** A `rowLink` answered with router commands on a table without `etTableRowRouterLink` to resolve them. */
|
|
59595
|
+
MISSING_ROW_ROUTER_LINK: 3509,
|
|
59581
59596
|
};
|
|
59582
59597
|
|
|
59583
59598
|
// What tells Excel the file is UTF-8; see `bom`.
|
|
@@ -60281,6 +60296,8 @@ const NO_PIN = { stickyStart: false, stickyEnd: false, offsetStart: null, offset
|
|
|
60281
60296
|
/** The same for a leading utility cell, and for the scroll fades' inline offsets. */
|
|
60282
60297
|
const NO_LEAD_PIN = { sticky: false, offset: null };
|
|
60283
60298
|
const NO_INSET = { start: 0, end: 0 };
|
|
60299
|
+
// Per-table counter, so the ids a row link is named by are unique across every table on the page.
|
|
60300
|
+
let uniqueTableId = 0;
|
|
60284
60301
|
/**
|
|
60285
60302
|
* The default table. Renders typed rows and cells from a {@link TableColumns}
|
|
60286
60303
|
* record on a CSS grid with a sticky header and an empty state. Light by
|
|
@@ -60372,7 +60389,8 @@ class TableComponent {
|
|
|
60372
60389
|
/**
|
|
60373
60390
|
* The table's visual frame. `'enclosed'` (default) is a bordered, rounded surface panel with a
|
|
60374
60391
|
* tinted header band; `'divided'` is borderless with row dividers; `'zebra'` stripes rows; `'grid'`
|
|
60375
|
-
* draws full cell borders; `'bare'` has no chrome
|
|
60392
|
+
* draws full cell borders; `'bare'` has no chrome; `'cards'` gives every row a box of its own - a
|
|
60393
|
+
* tinted, rounded card, spaced by `--et-table-row-gap`. @default 'enclosed'
|
|
60376
60394
|
*/
|
|
60377
60395
|
this.appearance = input('enclosed', /* @ts-ignore */
|
|
60378
60396
|
...(ngDevMode ? [{ debugName: "appearance" }] : /* istanbul ignore next */ []));
|
|
@@ -60422,9 +60440,31 @@ class TableComponent {
|
|
|
60422
60440
|
...(ngDevMode ? [undefined, { debugName: "expandedRowTemplate" }] : /* istanbul ignore next */ []));
|
|
60423
60441
|
/**
|
|
60424
60442
|
* Make whole rows respond to clicks: adds a hover/pointer affordance and emits {@link rowClick}
|
|
60425
|
-
* (clicks landing on interactive cell content are ignored - see `rowClick`).
|
|
60443
|
+
* (clicks landing on interactive cell content are ignored - see `rowClick`). For a row that
|
|
60444
|
+
* navigates, prefer {@link rowLink} - a real link, not a click handler. @default false
|
|
60426
60445
|
*/
|
|
60427
60446
|
this.rowInteractive = input(false, { ...(ngDevMode ? { debugName: "rowInteractive" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
60447
|
+
/**
|
|
60448
|
+
* Make every row a link, by saying where it goes: an `href` the browser follows, or the router
|
|
60449
|
+
* commands to navigate to - which need `etTableRowRouterLink` on the table, since the base table
|
|
60450
|
+
* depends on no router. Answer `null` for a row that links nowhere.
|
|
60451
|
+
*
|
|
60452
|
+
* The table renders **one** real `<a href>` per row and stretches it over the row, so middle click,
|
|
60453
|
+
* Ctrl/Cmd-click, "open in a new tab" and "copy link address" all work - none of which a
|
|
60454
|
+
* {@link rowInteractive} click handler can offer. The anchor sits in the first column that holds no
|
|
60455
|
+
* controls of its own and takes its accessible name from that cell, which keeps the row one link in
|
|
60456
|
+
* the accessibility tree and one stop in the tab order.
|
|
60457
|
+
*
|
|
60458
|
+
* A cell with a control in it keeps its clicks: the selection and expander cells always, and any
|
|
60459
|
+
* column that declares `interactive: true`.
|
|
60460
|
+
*
|
|
60461
|
+
* @example
|
|
60462
|
+
* <et-table [rowsSource]="source" [columns]="columns()" [rowLink]="orderLink" etTableRowRouterLink />
|
|
60463
|
+
*
|
|
60464
|
+
* protected orderLink = (order: Order) => ['/orders', order.id];
|
|
60465
|
+
*/
|
|
60466
|
+
this.rowLink = input(/* @ts-ignore */
|
|
60467
|
+
...(ngDevMode ? [undefined, { debugName: "rowLink" }] : /* istanbul ignore next */ []));
|
|
60428
60468
|
/**
|
|
60429
60469
|
* Emitted when an interactive row (see {@link rowInteractive}) is clicked, with the row as payload.
|
|
60430
60470
|
* Clicks originating from interactive descendants - buttons, links, inputs, selects, a menu trigger,
|
|
@@ -60447,6 +60487,8 @@ class TableComponent {
|
|
|
60447
60487
|
// the pinned data columns know how far in they start.
|
|
60448
60488
|
this.leadHeaderCells = viewChildren('leadHeaderCell', /* @ts-ignore */
|
|
60449
60489
|
...(ngDevMode ? [{ debugName: "leadHeaderCells" }] : /* istanbul ignore next */ []));
|
|
60490
|
+
// Base of the ids a row link is named by - one per table, so two tables on a page can't collide.
|
|
60491
|
+
this.LINK_ID_PREFIX = `et-table-${uniqueTableId++}-row-link`;
|
|
60450
60492
|
/** The sort mode in effect: what you set, else `'server'` when a {@link rowsSource} is bound. */
|
|
60451
60493
|
this.resolvedSortMode = computed(() => this.sortMode() ?? (this.rowsSource() ? 'server' : 'client'), /* @ts-ignore */
|
|
60452
60494
|
...(ngDevMode ? [{ debugName: "resolvedSortMode" }] : /* istanbul ignore next */ []));
|
|
@@ -60481,6 +60523,12 @@ class TableComponent {
|
|
|
60481
60523
|
...(ngDevMode ? [{ debugName: "cellErrorMarkList" }] : /* istanbul ignore next */ []));
|
|
60482
60524
|
this.cellErrorMark = computed(() => this.cellErrorMarkList().find((mark) => mark.enabled?.() ?? true) ?? null, /* @ts-ignore */
|
|
60483
60525
|
...(ngDevMode ? [{ debugName: "cellErrorMark" }] : /* istanbul ignore next */ []));
|
|
60526
|
+
// How a feature follows a row link given as router commands (etTableRowRouterLink). Null until one
|
|
60527
|
+
// registers, which is what keeps the router out of a table that links with plain hrefs - or not at all.
|
|
60528
|
+
this.rowNavigationList = signal([], /* @ts-ignore */
|
|
60529
|
+
...(ngDevMode ? [{ debugName: "rowNavigationList" }] : /* istanbul ignore next */ []));
|
|
60530
|
+
this.rowNavigation = computed(() => this.rowNavigationList().find((navigation) => navigation.enabled?.() ?? true) ?? null, /* @ts-ignore */
|
|
60531
|
+
...(ngDevMode ? [{ debugName: "rowNavigation" }] : /* istanbul ignore next */ []));
|
|
60484
60532
|
// Floating UI contributed by features (the reorder drag ghost). The table hosts it so a feature
|
|
60485
60533
|
// never needs a view - and never an element - of its own.
|
|
60486
60534
|
this.layerList = signal([], /* @ts-ignore */
|
|
@@ -60767,6 +60815,28 @@ class TableComponent {
|
|
|
60767
60815
|
* nothing behind but a flicker under the header.
|
|
60768
60816
|
*/
|
|
60769
60817
|
this.showBusyBar = signalDeferredLoading(this.refetchingOverRows);
|
|
60818
|
+
/**
|
|
60819
|
+
* Whether a body row gets a box of its own instead of being layout-transparent - a subgrid spanning
|
|
60820
|
+
* every track (see `.et-table-row--box`).
|
|
60821
|
+
*
|
|
60822
|
+
* Opt-in, because a box changes the containing block of everything positioned inside a row: a pinned
|
|
60823
|
+
* column, the row's own link. A card row needs one to paint, and a stretched row link needs one to
|
|
60824
|
+
* stretch over.
|
|
60825
|
+
*/
|
|
60826
|
+
this.rowBox = computed(() => this.appearance() === 'cards' || !!this.rowLink(), /* @ts-ignore */
|
|
60827
|
+
...(ngDevMode ? [{ debugName: "rowBox" }] : /* istanbul ignore next */ []));
|
|
60828
|
+
/**
|
|
60829
|
+
* The column whose cell hosts a row's link: the first visible one that doesn't hold controls of its
|
|
60830
|
+
* own, else the first visible one. Its content is what names the link, so it should be the column a
|
|
60831
|
+
* reader identifies the row by - which is what the leftmost column usually is.
|
|
60832
|
+
*/
|
|
60833
|
+
this.linkColumnKey = computed(() => {
|
|
60834
|
+
if (!this.rowLink())
|
|
60835
|
+
return null;
|
|
60836
|
+
const columns = this.visibleColumns();
|
|
60837
|
+
return (columns.find((column) => !column.interactive) ?? columns[0])?.key ?? null;
|
|
60838
|
+
}, /* @ts-ignore */
|
|
60839
|
+
...(ngDevMode ? [{ debugName: "linkColumnKey" }] : /* istanbul ignore next */ []));
|
|
60770
60840
|
/** The leading utility cells, with the pinning every row kind applies to them. */
|
|
60771
60841
|
this.leadCells = computed(() => {
|
|
60772
60842
|
const pinning = this.columnPinning();
|
|
@@ -60806,6 +60876,25 @@ class TableComponent {
|
|
|
60806
60876
|
});
|
|
60807
60877
|
}, /* @ts-ignore */
|
|
60808
60878
|
...(ngDevMode ? [{ debugName: "headerCellVms" }] : /* istanbul ignore next */ []));
|
|
60879
|
+
this.footerCells = computed(() => {
|
|
60880
|
+
const pinning = this.columnPinning();
|
|
60881
|
+
const templates = this.columnTemplates().footer;
|
|
60882
|
+
return this.visibleColumns().map((column) => ({
|
|
60883
|
+
...(pinning?.cellPinning(column.key) ?? NO_PIN),
|
|
60884
|
+
key: column.key,
|
|
60885
|
+
align: column.align ?? 'start',
|
|
60886
|
+
template: templates.get(column.key) ?? null,
|
|
60887
|
+
}));
|
|
60888
|
+
}, /* @ts-ignore */
|
|
60889
|
+
...(ngDevMode ? [{ debugName: "footerCells" }] : /* istanbul ignore next */ []));
|
|
60890
|
+
/** Spacer sizes standing in for the rows a window leaves out, or `null` when every row renders. */
|
|
60891
|
+
this.spacers = computed(() => {
|
|
60892
|
+
const window = this.rowWindow();
|
|
60893
|
+
if (!window || !this.rows().length)
|
|
60894
|
+
return null;
|
|
60895
|
+
return { start: window.paddingStart(), end: window.paddingEnd() };
|
|
60896
|
+
}, /* @ts-ignore */
|
|
60897
|
+
...(ngDevMode ? [{ debugName: "spacers" }] : /* istanbul ignore next */ []));
|
|
60809
60898
|
this.bodyRows = computed(() => {
|
|
60810
60899
|
const pinning = this.columnPinning();
|
|
60811
60900
|
const templates = this.columnTemplates().cell;
|
|
@@ -60817,17 +60906,31 @@ class TableComponent {
|
|
|
60817
60906
|
// At most one cell is ever open, so the edit templates are only looked up once there is one.
|
|
60818
60907
|
const editing = this.cellEditing()?.cell() ?? null;
|
|
60819
60908
|
const editTemplates = editing ? this.columnTemplates().cellEdit : null;
|
|
60820
|
-
|
|
60909
|
+
const rowLink = this.rowLink();
|
|
60910
|
+
const linkColumn = this.linkColumnKey();
|
|
60911
|
+
const navigation = this.rowNavigation();
|
|
60912
|
+
const rendered = this.renderedRows();
|
|
60913
|
+
// A footer row separates itself with this rule, and an end spacer stands in for rows still below.
|
|
60914
|
+
const endsWithRows = !this.hasFooter() && !this.spacers()?.end;
|
|
60915
|
+
return rendered.map((row, index) => {
|
|
60821
60916
|
const key = this.rowIdentity(row);
|
|
60917
|
+
const link = rowLink?.(row) ?? null;
|
|
60918
|
+
// A string is an href as given; commands are a URL only a navigator can build, so a table without
|
|
60919
|
+
// one renders no link at all rather than a wrong one (see the dev-mode check in the constructor).
|
|
60920
|
+
const href = link === null ? null : typeof link === 'string' ? link : (navigation?.href(link) ?? null);
|
|
60822
60921
|
return {
|
|
60823
60922
|
row,
|
|
60824
60923
|
key,
|
|
60825
60924
|
index: indexOffset + index,
|
|
60925
|
+
link,
|
|
60926
|
+
href,
|
|
60927
|
+
linkLabelId: `${this.LINK_ID_PREFIX}-${indexOffset + index}`,
|
|
60826
60928
|
classes: leads
|
|
60827
60929
|
.map((lead) => lead.lead.rowClass?.(row))
|
|
60828
60930
|
.filter((className) => !!className)
|
|
60829
60931
|
.join(' '),
|
|
60830
60932
|
stripe: (indexOffset + index) % 2 === 1,
|
|
60933
|
+
last: endsWithRows && index === rendered.length - 1,
|
|
60831
60934
|
detail: detail?.isOpen(row) ? detail : null,
|
|
60832
60935
|
leads,
|
|
60833
60936
|
cells: columns.map((column) => {
|
|
@@ -60842,6 +60945,9 @@ class TableComponent {
|
|
|
60842
60945
|
...(pinning?.cellPinning(column.key) ?? NO_PIN),
|
|
60843
60946
|
key: column.key,
|
|
60844
60947
|
align: column.align ?? 'start',
|
|
60948
|
+
// Not while this cell is being edited: the link covers the cell, and the editor must have it.
|
|
60949
|
+
linkHost: href !== null && column.key === linkColumn && editTemplate === null,
|
|
60950
|
+
interactive: !!column.interactive,
|
|
60845
60951
|
state,
|
|
60846
60952
|
message: typeof answer === 'string' ? null : (answer?.message ?? null),
|
|
60847
60953
|
template: templates.get(column.key) ?? null,
|
|
@@ -60854,25 +60960,6 @@ class TableComponent {
|
|
|
60854
60960
|
});
|
|
60855
60961
|
}, /* @ts-ignore */
|
|
60856
60962
|
...(ngDevMode ? [{ debugName: "bodyRows" }] : /* istanbul ignore next */ []));
|
|
60857
|
-
this.footerCells = computed(() => {
|
|
60858
|
-
const pinning = this.columnPinning();
|
|
60859
|
-
const templates = this.columnTemplates().footer;
|
|
60860
|
-
return this.visibleColumns().map((column) => ({
|
|
60861
|
-
...(pinning?.cellPinning(column.key) ?? NO_PIN),
|
|
60862
|
-
key: column.key,
|
|
60863
|
-
align: column.align ?? 'start',
|
|
60864
|
-
template: templates.get(column.key) ?? null,
|
|
60865
|
-
}));
|
|
60866
|
-
}, /* @ts-ignore */
|
|
60867
|
-
...(ngDevMode ? [{ debugName: "footerCells" }] : /* istanbul ignore next */ []));
|
|
60868
|
-
/** Spacer sizes standing in for the rows a window leaves out, or `null` when every row renders. */
|
|
60869
|
-
this.spacers = computed(() => {
|
|
60870
|
-
const window = this.rowWindow();
|
|
60871
|
-
if (!window || !this.rows().length)
|
|
60872
|
-
return null;
|
|
60873
|
-
return { start: window.paddingStart(), end: window.paddingEnd() };
|
|
60874
|
-
}, /* @ts-ignore */
|
|
60875
|
-
...(ngDevMode ? [{ debugName: "spacers" }] : /* istanbul ignore next */ []));
|
|
60876
60963
|
/**
|
|
60877
60964
|
* The keys of the currently hidden columns, in declared order. Nothing in the table's own chrome
|
|
60878
60965
|
* shows a hidden column - the column menu's "Hide column" takes one away and has no way back - so
|
|
@@ -60905,6 +60992,17 @@ class TableComponent {
|
|
|
60905
60992
|
return;
|
|
60906
60993
|
throw new RuntimeError(TABLE_ERROR_CODES.MISSING_ROW_EXPANSION, '[et-table] [expandedRowTemplate] needs the row-expansion feature to render it. Add `etTableRowExpansion` to the table and import TABLE_ROW_EXPANSION_IMPORTS.', { element: this.elementRef.nativeElement });
|
|
60907
60994
|
});
|
|
60995
|
+
// Router commands are a URL only the router can build, so such a row would otherwise render as a
|
|
60996
|
+
// row that looks like a link and leads nowhere. Asked of the rendered rows rather than of the
|
|
60997
|
+
// callback, since only a returned value says which form a table uses.
|
|
60998
|
+
effect(() => {
|
|
60999
|
+
const rowLink = this.rowLink();
|
|
61000
|
+
if (!rowLink || this.rowNavigationList().length)
|
|
61001
|
+
return;
|
|
61002
|
+
if (!this.renderedRows().some((row) => Array.isArray(rowLink(row))))
|
|
61003
|
+
return;
|
|
61004
|
+
throw new RuntimeError(TABLE_ERROR_CODES.MISSING_ROW_ROUTER_LINK, '[et-table] [rowLink] answered with router commands, which need the router feature to resolve them. Add `etTableRowRouterLink` to the table and import TABLE_ROW_ROUTER_LINK_IMPORTS, or answer with an href string instead.', { element: this.elementRef.nativeElement });
|
|
61005
|
+
});
|
|
60908
61006
|
}
|
|
60909
61007
|
// A bound rows source owns the sort/filter state, but everything here - features, `state()`, the
|
|
60910
61008
|
// header models - reads `sort()` / `filters()`. Mirror the source into them rather than teaching
|
|
@@ -61039,6 +61137,13 @@ class TableComponent {
|
|
|
61039
61137
|
registerColumnPinning(pinning) {
|
|
61040
61138
|
this.columnPinningList.update((list) => [...list, pinning]);
|
|
61041
61139
|
}
|
|
61140
|
+
/**
|
|
61141
|
+
* Called by an opt-in feature to resolve and follow row links given as router commands
|
|
61142
|
+
* (`etTableRowRouterLink`). Part of the feature contract; consumers never call this.
|
|
61143
|
+
*/
|
|
61144
|
+
registerRowNavigation(navigation) {
|
|
61145
|
+
this.rowNavigationList.update((list) => [...list, navigation]);
|
|
61146
|
+
}
|
|
61042
61147
|
/** The rendered header cells of the leading utility columns. Part of the feature contract. */
|
|
61043
61148
|
leadHeaderCellElements() {
|
|
61044
61149
|
return this.leadHeaderCells().map((ref) => ref.nativeElement);
|
|
@@ -61258,6 +61363,17 @@ class TableComponent {
|
|
|
61258
61363
|
event.preventDefault();
|
|
61259
61364
|
this.rowClick.emit(row);
|
|
61260
61365
|
}
|
|
61366
|
+
/**
|
|
61367
|
+
* Follow a row link the browser would otherwise load as a whole page. Only a link given as router
|
|
61368
|
+
* commands is followed, and only on a plain left click - a middle or Ctrl/Cmd-click keeps the
|
|
61369
|
+
* browser's own behaviour, which is the reason the row carries a real `href` at all.
|
|
61370
|
+
*/
|
|
61371
|
+
activateRowLink(link, event) {
|
|
61372
|
+
if (link === null || typeof link === 'string')
|
|
61373
|
+
return;
|
|
61374
|
+
if (this.rowNavigation()?.navigate(link, event))
|
|
61375
|
+
event.preventDefault();
|
|
61376
|
+
}
|
|
61261
61377
|
/**
|
|
61262
61378
|
* Stable identity for row-keyed state (change tracking, expansion, selection): the string form of
|
|
61263
61379
|
* `rowKey` (so it matches its serialized form regardless of string/number), or the row reference.
|
|
@@ -61410,10 +61526,10 @@ class TableComponent {
|
|
|
61410
61526
|
return false;
|
|
61411
61527
|
}
|
|
61412
61528
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
61413
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: TableComponent, isStandalone: true, selector: "et-table", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, rowsSource: { classPropertyName: "rowsSource", publicName: "rowsSource", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, rowKey: { classPropertyName: "rowKey", publicName: "rowKey", isSignal: true, isRequired: false, transformFunction: null }, labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, emptyTemplate: { classPropertyName: "emptyTemplate", publicName: "emptyTemplate", isSignal: true, isRequired: false, transformFunction: null }, errorTemplate: { classPropertyName: "errorTemplate", publicName: "errorTemplate", isSignal: true, isRequired: false, transformFunction: null }, cellState: { classPropertyName: "cellState", publicName: "cellState", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, density: { classPropertyName: "density", publicName: "density", isSignal: true, isRequired: false, transformFunction: null }, sort: { classPropertyName: "sort", publicName: "sort", isSignal: true, isRequired: false, transformFunction: null }, multiSort: { classPropertyName: "multiSort", publicName: "multiSort", isSignal: true, isRequired: false, transformFunction: null }, sortMode: { classPropertyName: "sortMode", publicName: "sortMode", isSignal: true, isRequired: false, transformFunction: null }, filters: { classPropertyName: "filters", publicName: "filters", isSignal: true, isRequired: false, transformFunction: null }, filterMode: { classPropertyName: "filterMode", publicName: "filterMode", isSignal: true, isRequired: false, transformFunction: null }, expandedRowTemplate: { classPropertyName: "expandedRowTemplate", publicName: "expandedRowTemplate", isSignal: true, isRequired: false, transformFunction: null }, rowInteractive: { classPropertyName: "rowInteractive", publicName: "rowInteractive", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sort: "sortChange", filters: "filtersChange", rowClick: "rowClick" }, host: { listeners: { "scroll": "syncScrollFades()" }, properties: { "attr.data-appearance": "appearance()", "attr.data-density": "density()", "attr.aria-busy": "resolvedLoading() ? \"true\" : null" }, classAttribute: "et-table-host" }, providers: [
|
|
61529
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: TableComponent, isStandalone: true, selector: "et-table", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, rowsSource: { classPropertyName: "rowsSource", publicName: "rowsSource", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, rowKey: { classPropertyName: "rowKey", publicName: "rowKey", isSignal: true, isRequired: false, transformFunction: null }, labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, emptyTemplate: { classPropertyName: "emptyTemplate", publicName: "emptyTemplate", isSignal: true, isRequired: false, transformFunction: null }, errorTemplate: { classPropertyName: "errorTemplate", publicName: "errorTemplate", isSignal: true, isRequired: false, transformFunction: null }, cellState: { classPropertyName: "cellState", publicName: "cellState", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, density: { classPropertyName: "density", publicName: "density", isSignal: true, isRequired: false, transformFunction: null }, sort: { classPropertyName: "sort", publicName: "sort", isSignal: true, isRequired: false, transformFunction: null }, multiSort: { classPropertyName: "multiSort", publicName: "multiSort", isSignal: true, isRequired: false, transformFunction: null }, sortMode: { classPropertyName: "sortMode", publicName: "sortMode", isSignal: true, isRequired: false, transformFunction: null }, filters: { classPropertyName: "filters", publicName: "filters", isSignal: true, isRequired: false, transformFunction: null }, filterMode: { classPropertyName: "filterMode", publicName: "filterMode", isSignal: true, isRequired: false, transformFunction: null }, expandedRowTemplate: { classPropertyName: "expandedRowTemplate", publicName: "expandedRowTemplate", isSignal: true, isRequired: false, transformFunction: null }, rowInteractive: { classPropertyName: "rowInteractive", publicName: "rowInteractive", isSignal: true, isRequired: false, transformFunction: null }, rowLink: { classPropertyName: "rowLink", publicName: "rowLink", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sort: "sortChange", filters: "filtersChange", rowClick: "rowClick" }, host: { listeners: { "scroll": "syncScrollFades()" }, properties: { "attr.data-appearance": "appearance()", "attr.data-density": "density()", "attr.aria-busy": "resolvedLoading() ? \"true\" : null" }, classAttribute: "et-table-host" }, providers: [
|
|
61414
61530
|
{ provide: TABLE_FEATURE_HOST, useExisting: TableComponent },
|
|
61415
61531
|
provideIcons(ARROW_UP_ICON, TRIANGLE_EXCLAMATION_ICON),
|
|
61416
|
-
], queries: [{ propertyName: "footerSlot", first: true, predicate: TableFooterDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "headerCells", predicate: ["headerCell"], descendants: true, isSignal: true }, { propertyName: "bodyCells", predicate: ["bodyCell"], descendants: true, isSignal: true }, { propertyName: "leadHeaderCells", predicate: ["leadHeaderCell"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Every binding below reads a field off a render model (see the `\u2026Vm` types in the component):\n methods belong in event bindings, not in bindings the framework re-evaluates each pass. -->\n<div [style.grid-template-columns]=\"templateColumns()\" class=\"et-table\" role=\"grid\">\n <!-- Rows a feature renders above the column headers (etTableGroupHeaders' spanning group row). Each\n is display: contents and lays its own cells into these tracks \u2014 see registerHeaderRow. -->\n @for (headerRow of headerRows(); track $index) {\n <ng-container *ngComponentOutlet=\"headerRow.component; injector: headerRow.injector\" />\n }\n\n <div class=\"et-table-header-row\" role=\"row\">\n <!-- Leading utility columns (selection from a feature, the expander when expansion is on). The\n table owns the cell chrome; the feature only supplies what goes inside. -->\n @for (lead of leadCells(); track lead.key) {\n <div\n #leadHeaderCell\n [class]=\"lead.cellClass\"\n [class.et-table-sticky-start]=\"lead.sticky\"\n [style.inset-inline-start.px]=\"lead.offset\"\n [attr.aria-hidden]=\"lead.lead.headerComponent ? null : 'true'\"\n class=\"et-table-header-cell\"\n role=\"columnheader\"\n >\n @if (lead.lead.headerComponent; as headerComponent) {\n <ng-container *ngComponentOutlet=\"headerComponent; injector: lead.lead.injector\" />\n }\n </div>\n }\n @for (cell of headerCellVms(); track cell.key) {\n <div\n #headerCell\n [attr.data-align]=\"cell.align\"\n [attr.data-col-key]=\"cell.key\"\n [attr.aria-sort]=\"cell.ariaSort\"\n [class.et-table-sticky-start]=\"cell.stickyStart\"\n [class.et-table-sticky-end]=\"cell.stickyEnd\"\n [style.inset-inline-start.px]=\"cell.offsetStart\"\n [style.inset-inline-end.px]=\"cell.offsetEnd\"\n class=\"et-table-header-cell\"\n role=\"columnheader\"\n >\n <!-- Sorting is the whole header's job, not a control's: the label plus everything around it is\n one button, and the only sort affordance is the direction arrow, which appears once the\n column is actually sorted. Adornments sit outside it so their own clicks don't sort. -->\n @if (cell.sortable) {\n <button\n [attr.aria-label]=\"cell.sortLabel\"\n (click)=\"toggleSort(cell.key)\"\n class=\"et-table-header-label et-table-header-label--sortable\"\n type=\"button\"\n >\n @if (cell.template; as headerTemplate) {\n <ng-container *ngTemplateOutlet=\"headerTemplate; context: { $implicit: cell.column.header }\" />\n } @else {\n <span class=\"et-table-cell-text\">{{ cell.column.header }}</span>\n }\n @if (cell.direction; as direction) {\n <!-- Flipping direction keeps this element mounted, so the arrow turns over rather than\n swapping; only appearing and disappearing are the fade. -->\n <i\n [attr.data-direction]=\"direction\"\n class=\"et-table-sort-indicator\"\n animate.enter=\"et-table-sort-indicator--enter\"\n animate.leave=\"et-table-sort-indicator--leave\"\n etIcon=\"et-arrow-up\"\n ></i>\n }\n </button>\n } @else {\n <span class=\"et-table-header-label\">\n @if (cell.template; as headerTemplate) {\n <ng-container *ngTemplateOutlet=\"headerTemplate; context: { $implicit: cell.column.header }\" />\n } @else {\n <span class=\"et-table-cell-text\">{{ cell.column.header }}</span>\n }\n </span>\n }\n\n <!-- UI from opt-in features (filter menu, \u2026), each registered rather than referenced \u2014 see\n registerHeaderAdornment. Renders nothing when no feature is imported. -->\n @for (adornment of headerAdornments(); track $index) {\n <ng-container\n *ngComponentOutlet=\"adornment.component; inputs: { column: cell.column }; injector: adornment.injector\"\n />\n }\n </div>\n }\n <!-- Filler cell for the trailing slack track (see hasFiller): carries the header band to the\n panel's edge when every column is a rigid width. -->\n @if (hasFiller()) {\n <div class=\"et-table-header-cell et-table-filler-cell\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n </div>\n\n <!-- Refetching over rows that are already on screen: a 2px indeterminate bar right under the header,\n so the data stays readable and in place. Drawn here rather than with `et-progress-bar` \u2014 the base\n table takes no component dependencies, and this is 2px of chrome, not a control. -->\n @if (showBusyBar()) {\n <div class=\"et-table-busy-bar\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n\n @if (spacers(); as spacer) {\n <div [style.block-size.px]=\"spacer.start\" class=\"et-table-spacer\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n\n @if (hasError()) {\n <!-- The error state stands in for the whole body: rows are either trustworthy or absent. -->\n <div class=\"et-table-message-row\" role=\"row\">\n <div class=\"et-table-error-cell\" role=\"gridcell\" aria-live=\"polite\">\n @if (errorTemplate(); as template) {\n <ng-container *ngTemplateOutlet=\"template; context: { $implicit: error() }\" />\n } @else {\n <ng-content select=\"[etTableError]\">\n <i [etProvideColor]=\"errorColorTheme\" class=\"et-table-error-icon\" etIcon=\"et-triangle-exclamation\"></i>\n <span>{{ resolvedLabels().error }}</span>\n </ng-content>\n }\n </div>\n </div>\n } @else if (showPlaceholderRows()) {\n <!-- First load with nothing to show yet. What a loading body looks like belongs to a feature\n (etTableSkeleton draws placeholder rows in these tracks); with none the body stays blank rather\n than showing a misleading empty state \u2014 the host's `aria-busy` is the announcement. -->\n @if (bodyPlaceholder(); as placeholder) {\n <ng-container *ngComponentOutlet=\"placeholder.component; injector: placeholder.injector\" />\n }\n } @else {\n @for (rowVm of bodyRows(); track rowVm.key) {\n <div\n [class]=\"rowVm.classes\"\n [class.et-table-row--stripe]=\"rowVm.stripe\"\n [class.et-table-row--interactive]=\"rowInteractive()\"\n [attr.tabindex]=\"rowInteractive() && !cellNavigation() ? 0 : null\"\n (click)=\"activateRow(rowVm.row, $event)\"\n (keydown.enter)=\"activateRow(rowVm.row, $event)\"\n (keydown.space)=\"activateRow(rowVm.row, $event)\"\n class=\"et-table-row\"\n role=\"row\"\n >\n @for (lead of rowVm.leads; track lead.key) {\n <div\n [class]=\"lead.cellClass\"\n [class.et-table-sticky-start]=\"lead.sticky\"\n [style.inset-inline-start.px]=\"lead.offset\"\n class=\"et-table-cell\"\n role=\"gridcell\"\n >\n <ng-container\n *ngComponentOutlet=\"lead.lead.bodyComponent; inputs: { row: rowVm.row }; injector: lead.lead.injector\"\n />\n </div>\n }\n @for (cell of rowVm.cells; track cell.key) {\n <div\n #bodyCell\n [attr.data-align]=\"cell.align\"\n [attr.data-col-key]=\"cell.key\"\n [attr.tabindex]=\"cellNavigation() ? -1 : null\"\n [attr.data-state]=\"cell.state\"\n [class.et-table-cell--editing]=\"cell.edit\"\n [class.et-skeleton--animated]=\"cell.state === 'loading'\"\n [class.et-table-sticky-start]=\"cell.stickyStart\"\n [class.et-table-sticky-end]=\"cell.stickyEnd\"\n [style.inset-inline-start.px]=\"cell.offsetStart\"\n [style.inset-inline-end.px]=\"cell.offsetEnd\"\n class=\"et-table-cell\"\n role=\"gridcell\"\n >\n @if (cell.edit; as edit) {\n <!-- The one cell in edit mode: the column's etTableCellEdit template, rendered with the\n editing feature's own context (the draft field). See registerCellEditing. -->\n <ng-container *ngTemplateOutlet=\"edit.template; context: edit.context\" />\n } @else if (cell.state === 'loading' && cellPlaceholder(); as placeholder) {\n <!-- A cell that is loading on its own (an inline edit saving) shows a feature's placeholder\n instead of its value; the row around it stays readable. Without one the value stays put\n and `data-state` carries the cue \u2014 see registerCellPlaceholder. -->\n <ng-container *ngComponentOutlet=\"placeholder.component; injector: placeholder.injector\" />\n } @else {\n @if (cell.state === 'error') {\n @if (cellErrorMark(); as mark) {\n <!-- A feature (etTableCellErrorTooltip) draws the mark instead, so the overlay runtime\n only ships when a table actually wants a tooltip. -->\n <ng-container\n *ngComponentOutlet=\"mark.component; inputs: { message: cell.message }; injector: mark.injector\"\n />\n } @else {\n <!-- Color-scoped here rather than on the cell: the mark is the only part that must read\n as an error, and a provider per errored cell is cheap where one per cell would not\n be. The message rides along as `title`, which costs nothing. -->\n <i\n [etProvideColor]=\"errorColorTheme\"\n [attr.title]=\"cell.message\"\n [attr.aria-label]=\"cell.message\"\n [attr.aria-hidden]=\"cell.message ? null : 'true'\"\n class=\"et-table-cell-error-icon\"\n etIcon=\"et-triangle-exclamation\"\n ></i>\n }\n }\n @if (cell.template; as bodyTemplate) {\n <ng-container *ngTemplateOutlet=\"bodyTemplate; context: cell.context\" />\n } @else {\n <span class=\"et-table-cell-text\">{{ cell.value }}</span>\n }\n }\n </div>\n }\n @if (hasFiller()) {\n <div class=\"et-table-cell et-table-filler-cell\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n </div>\n\n <!-- The detail row of an expanded row, from etTableRowExpansion \u2014 the whole row, its chrome and\n its animation belong to the feature, so a table that never expands carries none of them. -->\n @if (rowVm.detail; as detail) {\n <ng-container *ngComponentOutlet=\"detail.component; inputs: { row: rowVm.row }; injector: detail.injector\" />\n }\n } @empty {\n <div class=\"et-table-message-row\" role=\"row\">\n <div class=\"et-table-empty-cell\" role=\"gridcell\">\n @if (emptyTemplate(); as template) {\n <ng-container *ngTemplateOutlet=\"template; context: { $implicit: rows() }\" />\n } @else {\n <ng-content select=\"[etTableEmpty]\">{{ resolvedLabels().empty }}</ng-content>\n }\n </div>\n </div>\n }\n }\n\n @if (spacers(); as spacer) {\n <div [style.block-size.px]=\"spacer.end\" class=\"et-table-spacer\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n\n <!-- Edge gradients marking rows scrolled out of view horizontally. The layer is absolutely positioned\n over the whole grid \u2014 the full scroll extent, not just the viewport \u2014 which is what lets the two\n fades inside it hold their place with `position: sticky` for the entire scroll range. Their inline\n inset clears whatever columns are pinned at that edge, so the fade marks where rows actually\n disappear (a pinned column's inner edge) rather than the viewport's edge. -->\n <div class=\"et-table-scroll-fades\" role=\"presentation\" aria-hidden=\"true\">\n <div\n [style.inset-inline-start.px]=\"fadeInset().start\"\n [class.et-table-scroll-fade--visible]=\"scrollFades().start\"\n class=\"et-table-scroll-fade et-table-scroll-fade--start\"\n ></div>\n <div\n [style.inset-inline-end.px]=\"fadeInset().end\"\n [class.et-table-scroll-fade--visible]=\"scrollFades().end\"\n class=\"et-table-scroll-fade et-table-scroll-fade--end\"\n ></div>\n </div>\n\n @if (hasFooter()) {\n <div class=\"et-table-footer-row\" role=\"row\">\n @for (lead of leadCells(); track lead.key) {\n <div\n [class]=\"lead.cellClass\"\n [class.et-table-sticky-start]=\"lead.sticky\"\n [style.inset-inline-start.px]=\"lead.offset\"\n class=\"et-table-footer-cell\"\n role=\"gridcell\"\n aria-hidden=\"true\"\n ></div>\n }\n @for (cell of footerCells(); track cell.key) {\n <div\n [attr.data-align]=\"cell.align\"\n [class.et-table-sticky-start]=\"cell.stickyStart\"\n [class.et-table-sticky-end]=\"cell.stickyEnd\"\n [style.inset-inline-start.px]=\"cell.offsetStart\"\n [style.inset-inline-end.px]=\"cell.offsetEnd\"\n class=\"et-table-footer-cell\"\n role=\"gridcell\"\n >\n @if (cell.template; as footerTemplate) {\n <ng-container *ngTemplateOutlet=\"footerTemplate; context: { $implicit: rows() }\" />\n }\n </div>\n }\n @if (hasFiller()) {\n <div class=\"et-table-footer-cell et-table-filler-cell\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n </div>\n }\n</div>\n\n<!-- Full-width footer slot (paginator, page-size, etc.), pinned to the bottom of the scroll viewport.\n Rendered only when the consumer projects `[etTableFooter]`, so the chrome never shows empty. -->\n@if (footerSlot()) {\n <div class=\"et-table-footer\">\n <ng-content select=\"[etTableFooter]\" />\n </div>\n}\n\n<!-- Floating UI from opt-in features (the reorder drag ghost / drop indicator), stamped here so a\n feature can draw without having a view \u2014 or an element \u2014 of its own. -->\n@for (layer of layers(); track $index) {\n <ng-container *ngComponentOutlet=\"layer.component; injector: layer.injector\" />\n}\n", styles: ["@layer components{@property --et-table-cell-padding-block{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-table-cell-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 12px;}:where(.et-table-host){display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:1fr auto;overflow:auto;--_et-table-band: color-mix( in srgb, var(--et-surface-interaction-solid, gray) 7%, var(--et-surface-background-solid, Canvas) );--_et-table-header-bg: var(--et-surface-background-solid, Canvas);--_et-table-header-border: var(--et-surface-border-solid, rgb(128 128 128 / .3));--_et-table-row-divider: transparent;--_et-table-stripe-bg: transparent;--_et-table-stripe-solid: var(--et-surface-background-solid, Canvas)}.et-table-host:where([data-density=sm]){--et-table-cell-padding-block: 6px;--et-table-cell-padding-inline: 10px}.et-table-host:where([data-density=md]){--et-table-cell-padding-block: 10px;--et-table-cell-padding-inline: 12px}.et-table-host:where([data-density=lg]){--et-table-cell-padding-block: 15px;--et-table-cell-padding-inline: 16px}.et-table-host:where([data-appearance=enclosed],[data-appearance=zebra],[data-appearance=grid]){border:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .3));border-radius:10px}.et-table-host:where([data-appearance=enclosed]){--_et-table-header-bg: var(--_et-table-band);--_et-table-row-divider: var(--et-surface-border-solid, rgb(128 128 128 / .15));box-shadow:0 1px 2px #0000000a,0 6px 16px #0000000f}.et-table-host:where([data-appearance=divided]){--_et-table-row-divider: var(--et-surface-border-solid, rgb(128 128 128 / .15))}.et-table-host:where([data-appearance=zebra]){--_et-table-header-bg: var(--_et-table-band);--_et-table-stripe-bg: color-mix(in srgb, var(--et-surface-interaction-solid, gray) 4%, transparent);--_et-table-stripe-solid: color-mix( in srgb, var(--et-surface-interaction-solid, gray) 4%, var(--et-surface-background-solid, Canvas) )}.et-table-host:where([data-appearance=grid]){--_et-table-header-bg: var(--_et-table-band);--_et-table-row-divider: var(--et-surface-border-solid, rgb(128 128 128 / .15))}.et-table-host:where([data-appearance=bare]){--_et-table-header-border: transparent}.et-table{display:grid;position:relative;align-content:start;inline-size:min-content;min-inline-size:100%;background:var(--et-surface-background-solid, Canvas);color:var(--et-surface-color-solid, CanvasText);font-size:14px;line-height:1.4}.et-table-filler-cell{padding-inline:0}.et-table-header-row,.et-table-row{display:contents}.et-table-header-cell,.et-table-cell{display:flex;align-items:center;min-inline-size:0;overflow:hidden;padding:var(--et-table-cell-padding-block) var(--et-table-cell-padding-inline)}.et-table-cell-text{min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.et-table-header-cell{position:sticky;inset-block-start:max(0px,calc(var(--_et-table-group-h, 0px) - 1px));gap:4px;z-index:1;font-weight:600;color:var(--et-surface-color-muted-solid, CanvasText);background:var(--_et-table-header-bg);border-block-end:1px solid var(--_et-table-header-border)}.et-table-cell{border-block-end:1px solid var(--_et-table-row-divider)}.et-table-row--stripe .et-table-cell{background:var(--_et-table-stripe-bg)}.et-table-host:where([data-appearance=grid]) .et-table-header-cell,.et-table-host:where([data-appearance=grid]) .et-table-cell{border-inline-end:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .15))}.et-table-host:where([data-appearance=grid]) .et-table-header-row .et-table-header-cell:last-child,.et-table-host:where([data-appearance=grid]) .et-table-row .et-table-cell:last-child{border-inline-end:0}.et-table-sticky-start,.et-table-sticky-end{position:sticky;z-index:1}.et-table-sticky-start{box-shadow:4px 0 6px -4px #0000002e}.et-table-sticky-end{box-shadow:-4px 0 6px -4px #0000002e}.et-table-cell:where(.et-table-sticky-start,.et-table-sticky-end){background:var(--et-surface-background-solid, Canvas)}.et-table-row--stripe .et-table-cell.et-table-sticky-start,.et-table-row--stripe .et-table-cell.et-table-sticky-end{background:var(--_et-table-stripe-solid)}@media(hover:hover){.et-table-row:hover .et-table-cell.et-table-sticky-start,.et-table-row:hover .et-table-cell.et-table-sticky-end{background:color-mix(in srgb,var(--et-surface-interaction-solid, gray) 8%,var(--et-surface-background-solid, Canvas))}}.et-table-header-cell:where(.et-table-sticky-start,.et-table-sticky-end),.et-table-footer-cell:where(.et-table-sticky-start,.et-table-sticky-end){z-index:3}.et-table-footer-row{display:contents}.et-table-footer-cell{display:flex;align-items:center;min-inline-size:0;overflow:hidden;padding:var(--et-table-cell-padding-block) var(--et-table-cell-padding-inline);position:sticky;inset-block-end:0;z-index:1;font-weight:600;background:var(--_et-table-header-bg);border-block-start:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .3))}.et-table-footer-cell:where([data-align=center]){justify-content:center;text-align:center}.et-table-footer-cell:where([data-align=end]){justify-content:flex-end;text-align:end}.et-table-scroll-fades{position:absolute;inset:0;display:flex;justify-content:space-between;z-index:3;pointer-events:none}.et-table-scroll-fade{position:sticky;flex:none;inline-size:var(--et-table-scroll-fade-size, 28px);opacity:0;transition:opacity .15s ease}.et-table-scroll-fade--visible{opacity:1}.et-table-scroll-fade--start{background:linear-gradient(to right,#00000029,#0000)}.et-table-scroll-fade--end{background:linear-gradient(to left,#00000029,#0000)}@media(prefers-reduced-motion:reduce){.et-table-scroll-fade{transition:none}}.et-table-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;position:sticky;inset-block-end:0;inset-inline-start:0;z-index:4;padding:var(--et-table-cell-padding-block) var(--et-table-cell-padding-inline);background:var(--_et-table-header-bg);border-block-start:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .3))}.et-table-footer-label{margin:0;font-size:14px;color:var(--et-surface-color-muted-solid, CanvasText)}@media(pointer:coarse){.et-table-footer{gap:8px;padding:8px var(--et-table-cell-padding-inline)}}.et-table-header-cell:where([data-align=center]),.et-table-cell:where([data-align=center]){justify-content:center;text-align:center}.et-table-header-cell:where([data-align=end]),.et-table-cell:where([data-align=end]){justify-content:flex-end;text-align:end}.et-table-row--interactive .et-table-cell{cursor:pointer}@media(hover:hover){.et-table-row:hover .et-table-cell{background:color-mix(in srgb,var(--et-surface-interaction-solid, gray) 8%,transparent)}}.et-table-header-label{display:flex;align-items:center;gap:4px;flex:1;min-inline-size:0;margin:0;padding:0;font:inherit;color:inherit;text-align:inherit;background:none;border:none}.et-table-header-label:where(.et-table-header-label--sortable){cursor:pointer}.et-table-header-cell:where([data-align=center]) .et-table-header-label{justify-content:center}.et-table-header-cell:where([data-align=end]) .et-table-header-label{justify-content:flex-end}.et-table-sort-indicator{flex:none;inline-size:1.15em;block-size:1.15em;transform:translateY(-.045em);color:var(--et-theme-color-primary-solid, currentColor);transition:transform .2s var(--ease-out-5, ease)}.et-table-sort-indicator:where([data-direction=desc]){transform:translateY(-.045em) rotate(180deg)}.et-table-sort-indicator.et-table-sort-indicator--enter{animation:et-table-sort-in .15s ease}.et-table-sort-indicator.et-table-sort-indicator--leave{animation:et-table-sort-in .12s ease reverse forwards}@keyframes et-table-sort-in{0%{opacity:0}to{opacity:1}}@media(prefers-reduced-motion:reduce){.et-table-sort-indicator{transition:none}.et-table-sort-indicator.et-table-sort-indicator--enter,.et-table-sort-indicator.et-table-sort-indicator--leave{animation:none}}.et-table-message-row{display:contents}.et-table-empty-cell,.et-table-error-cell{grid-column:1 / -1;padding:32px var(--et-table-cell-padding-inline);color:var(--et-surface-color-muted-solid, CanvasText);text-align:center}.et-table-error-cell{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px}.et-table-error-icon{flex:none;inline-size:16px;block-size:16px;color:var(--et-theme-color-ink-solid, currentColor)}.et-table-cell:where([data-state=error]){gap:6px}.et-table-cell-error-icon{flex:none;inline-size:14px;block-size:14px;color:var(--et-theme-color-ink-solid, currentColor)}.et-table-cell:where([data-state=loading]){display:flex}.et-table-busy-bar{grid-column:1 / -1;block-size:2px;overflow:hidden;background:color-mix(in srgb,var(--et-surface-interaction-solid, gray) 10%,transparent)}.et-table-busy-bar:after{content:\"\";display:block;inline-size:40%;block-size:100%;border-radius:999px;background:var(--et-theme-color-primary-solid, currentColor);animation:et-table-busy-sweep 1.1s ease-in-out infinite}@keyframes et-table-busy-sweep{0%{transform:translate(-100%)}to{transform:translate(250%)}}@media(prefers-reduced-motion:reduce){.et-table-busy-bar:after{inline-size:100%;animation:none}}}\n"], dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor", "label"] }, { kind: "directive", type: ProvideColorDirective, selector: "[etProvideColor]", inputs: ["etProvideColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
61532
|
+
], queries: [{ propertyName: "footerSlot", first: true, predicate: TableFooterDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "headerCells", predicate: ["headerCell"], descendants: true, isSignal: true }, { propertyName: "bodyCells", predicate: ["bodyCell"], descendants: true, isSignal: true }, { propertyName: "leadHeaderCells", predicate: ["leadHeaderCell"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Every binding below reads a field off a render model (see the `\u2026Vm` types in the component):\n methods belong in event bindings, not in bindings the framework re-evaluates each pass. -->\n<div [style.grid-template-columns]=\"templateColumns()\" class=\"et-table\" role=\"grid\">\n <!-- Rows a feature renders above the column headers (etTableGroupHeaders' spanning group row). Each\n is display: contents and lays its own cells into these tracks \u2014 see registerHeaderRow. -->\n @for (headerRow of headerRows(); track $index) {\n <ng-container *ngComponentOutlet=\"headerRow.component; injector: headerRow.injector\" />\n }\n\n <div class=\"et-table-header-row\" role=\"row\">\n <!-- Leading utility columns (selection from a feature, the expander when expansion is on). The\n table owns the cell chrome; the feature only supplies what goes inside. -->\n @for (lead of leadCells(); track lead.key) {\n <div\n #leadHeaderCell\n [class]=\"lead.cellClass\"\n [class.et-table-sticky-start]=\"lead.sticky\"\n [style.inset-inline-start.px]=\"lead.offset\"\n [attr.aria-hidden]=\"lead.lead.headerComponent ? null : 'true'\"\n class=\"et-table-header-cell\"\n role=\"columnheader\"\n >\n @if (lead.lead.headerComponent; as headerComponent) {\n <ng-container *ngComponentOutlet=\"headerComponent; injector: lead.lead.injector\" />\n }\n </div>\n }\n @for (cell of headerCellVms(); track cell.key) {\n <div\n #headerCell\n [attr.data-align]=\"cell.align\"\n [attr.data-col-key]=\"cell.key\"\n [attr.aria-sort]=\"cell.ariaSort\"\n [class.et-table-sticky-start]=\"cell.stickyStart\"\n [class.et-table-sticky-end]=\"cell.stickyEnd\"\n [style.inset-inline-start.px]=\"cell.offsetStart\"\n [style.inset-inline-end.px]=\"cell.offsetEnd\"\n class=\"et-table-header-cell\"\n role=\"columnheader\"\n >\n <!-- Sorting is the whole header's job, not a control's: the label plus everything around it is\n one button, and the only sort affordance is the direction arrow, which appears once the\n column is actually sorted. Adornments sit outside it so their own clicks don't sort. -->\n @if (cell.sortable) {\n <button\n [attr.aria-label]=\"cell.sortLabel\"\n (click)=\"toggleSort(cell.key)\"\n class=\"et-table-header-label et-table-header-label--sortable\"\n type=\"button\"\n >\n @if (cell.template; as headerTemplate) {\n <ng-container *ngTemplateOutlet=\"headerTemplate; context: { $implicit: cell.column.header }\" />\n } @else {\n <span class=\"et-table-cell-text\">{{ cell.column.header }}</span>\n }\n @if (cell.direction; as direction) {\n <!-- Flipping direction keeps this element mounted, so the arrow turns over rather than\n swapping; only appearing and disappearing are the fade. -->\n <i\n [attr.data-direction]=\"direction\"\n class=\"et-table-sort-indicator\"\n animate.enter=\"et-table-sort-indicator--enter\"\n animate.leave=\"et-table-sort-indicator--leave\"\n etIcon=\"et-arrow-up\"\n ></i>\n }\n </button>\n } @else {\n <span class=\"et-table-header-label\">\n @if (cell.template; as headerTemplate) {\n <ng-container *ngTemplateOutlet=\"headerTemplate; context: { $implicit: cell.column.header }\" />\n } @else {\n <span class=\"et-table-cell-text\">{{ cell.column.header }}</span>\n }\n </span>\n }\n\n <!-- UI from opt-in features (filter menu, \u2026), each registered rather than referenced \u2014 see\n registerHeaderAdornment. Renders nothing when no feature is imported. -->\n @for (adornment of headerAdornments(); track $index) {\n <ng-container\n *ngComponentOutlet=\"adornment.component; inputs: { column: cell.column }; injector: adornment.injector\"\n />\n }\n </div>\n }\n <!-- Filler cell for the trailing slack track (see hasFiller): carries the header band to the\n panel's edge when every column is a rigid width. -->\n @if (hasFiller()) {\n <div class=\"et-table-header-cell et-table-filler-cell\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n </div>\n\n <!-- Refetching over rows that are already on screen: a 2px indeterminate bar right under the header,\n so the data stays readable and in place. Drawn here rather than with `et-progress-bar` \u2014 the base\n table takes no component dependencies, and this is 2px of chrome, not a control. -->\n @if (showBusyBar()) {\n <div class=\"et-table-busy-bar\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n\n @if (spacers(); as spacer) {\n <div [style.block-size.px]=\"spacer.start\" class=\"et-table-spacer\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n\n @if (hasError()) {\n <!-- The error state stands in for the whole body: rows are either trustworthy or absent. -->\n <div class=\"et-table-message-row\" role=\"row\">\n <div class=\"et-table-error-cell\" role=\"gridcell\" aria-live=\"polite\">\n @if (errorTemplate(); as template) {\n <ng-container *ngTemplateOutlet=\"template; context: { $implicit: error() }\" />\n } @else {\n <ng-content select=\"[etTableError]\">\n <i [etProvideColor]=\"errorColorTheme\" class=\"et-table-error-icon\" etIcon=\"et-triangle-exclamation\"></i>\n <span>{{ resolvedLabels().error }}</span>\n </ng-content>\n }\n </div>\n </div>\n } @else if (showPlaceholderRows()) {\n <!-- First load with nothing to show yet. What a loading body looks like belongs to a feature\n (etTableSkeleton draws placeholder rows in these tracks); with none the body stays blank rather\n than showing a misleading empty state \u2014 the host's `aria-busy` is the announcement. -->\n @if (bodyPlaceholder(); as placeholder) {\n <ng-container *ngComponentOutlet=\"placeholder.component; injector: placeholder.injector\" />\n }\n } @else {\n @for (rowVm of bodyRows(); track rowVm.key) {\n <!-- A linked row is not a tab stop of its own: its anchor is the one stop, and the one link. -->\n <div\n [class]=\"rowVm.classes\"\n [class.et-table-row--stripe]=\"rowVm.stripe\"\n [class.et-table-row--last]=\"rowVm.last\"\n [class.et-table-row--interactive]=\"rowInteractive()\"\n [class.et-table-row--box]=\"rowBox()\"\n [class.et-table-row--link]=\"rowVm.href !== null\"\n [attr.tabindex]=\"rowInteractive() && !cellNavigation() && rowVm.href === null ? 0 : null\"\n (click)=\"activateRow(rowVm.row, $event)\"\n (keydown.enter)=\"activateRow(rowVm.row, $event)\"\n (keydown.space)=\"activateRow(rowVm.row, $event)\"\n class=\"et-table-row\"\n role=\"row\"\n >\n @for (lead of rowVm.leads; track lead.key) {\n <div\n [class]=\"lead.cellClass\"\n [class.et-table-sticky-start]=\"lead.sticky\"\n [style.inset-inline-start.px]=\"lead.offset\"\n class=\"et-table-cell\"\n role=\"gridcell\"\n >\n <ng-container\n *ngComponentOutlet=\"lead.lead.bodyComponent; inputs: { row: rowVm.row }; injector: lead.lead.injector\"\n />\n </div>\n }\n @for (cell of rowVm.cells; track cell.key) {\n <div\n #bodyCell\n [attr.data-align]=\"cell.align\"\n [attr.data-col-key]=\"cell.key\"\n [attr.tabindex]=\"cellNavigation() ? -1 : null\"\n [attr.data-state]=\"cell.state\"\n [attr.id]=\"cell.linkHost ? rowVm.linkLabelId : null\"\n [class.et-table-cell--link]=\"cell.linkHost\"\n [class.et-table-cell--interactive]=\"cell.interactive\"\n [class.et-table-cell--editing]=\"cell.edit\"\n [class.et-skeleton--animated]=\"cell.state === 'loading'\"\n [class.et-table-sticky-start]=\"cell.stickyStart\"\n [class.et-table-sticky-end]=\"cell.stickyEnd\"\n [style.inset-inline-start.px]=\"cell.offsetStart\"\n [style.inset-inline-end.px]=\"cell.offsetEnd\"\n class=\"et-table-cell\"\n role=\"gridcell\"\n >\n @if (cell.edit; as edit) {\n <!-- The one cell in edit mode: the column's etTableCellEdit template, rendered with the\n editing feature's own context (the draft field). See registerCellEditing. -->\n <ng-container *ngTemplateOutlet=\"edit.template; context: edit.context\" />\n } @else if (cell.state === 'loading' && cellPlaceholder(); as placeholder) {\n <!-- A cell that is loading on its own (an inline edit saving) shows a feature's placeholder\n instead of its value; the row around it stays readable. Without one the value stays put\n and `data-state` carries the cue \u2014 see registerCellPlaceholder. -->\n <ng-container *ngComponentOutlet=\"placeholder.component; injector: placeholder.injector\" />\n } @else {\n @if (cell.state === 'error') {\n @if (cellErrorMark(); as mark) {\n <!-- A feature (etTableCellErrorTooltip) draws the mark instead, so the overlay runtime\n only ships when a table actually wants a tooltip. -->\n <ng-container\n *ngComponentOutlet=\"mark.component; inputs: { message: cell.message }; injector: mark.injector\"\n />\n } @else {\n <!-- Color-scoped here rather than on the cell: the mark is the only part that must read\n as an error, and a provider per errored cell is cheap where one per cell would not\n be. The message rides along as `title`, which costs nothing. -->\n <i\n [etProvideColor]=\"errorColorTheme\"\n [attr.title]=\"cell.message\"\n [attr.aria-label]=\"cell.message\"\n [attr.aria-hidden]=\"cell.message ? null : 'true'\"\n class=\"et-table-cell-error-icon\"\n etIcon=\"et-triangle-exclamation\"\n ></i>\n }\n }\n @if (cell.template; as bodyTemplate) {\n <ng-container *ngTemplateOutlet=\"bodyTemplate; context: cell.context\" />\n } @else {\n <span class=\"et-table-cell-text\">{{ cell.value }}</span>\n }\n }\n\n @if (cell.linkHost) {\n <!-- The row's link: one real anchor, stretched over the row box (see rowBox) rather than\n wrapping any content, so the cells stay exactly as a table without links renders them.\n It carries no text of its own and is named by this cell instead - `aria-labelledby`\n resolves to the cell's content, which is the row's identity. -->\n <!-- eslint-disable-next-line @angular-eslint/template/elements-content -- the rule's\n allowList knows `aria-label` but not `aria-labelledby`, which names it just as well. -->\n <a\n [attr.href]=\"rowVm.href\"\n [attr.aria-labelledby]=\"rowVm.linkLabelId\"\n (click)=\"activateRowLink(rowVm.link, $event)\"\n class=\"et-table-row-link\"\n ></a>\n }\n </div>\n }\n @if (hasFiller()) {\n <div class=\"et-table-cell et-table-filler-cell\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n </div>\n\n <!-- The detail row of an expanded row, from etTableRowExpansion \u2014 the whole row, its chrome and\n its animation belong to the feature, so a table that never expands carries none of them. -->\n @if (rowVm.detail; as detail) {\n <ng-container *ngComponentOutlet=\"detail.component; inputs: { row: rowVm.row }; injector: detail.injector\" />\n }\n } @empty {\n <div class=\"et-table-message-row\" role=\"row\">\n <div class=\"et-table-empty-cell\" role=\"gridcell\">\n @if (emptyTemplate(); as template) {\n <ng-container *ngTemplateOutlet=\"template; context: { $implicit: rows() }\" />\n } @else {\n <ng-content select=\"[etTableEmpty]\">{{ resolvedLabels().empty }}</ng-content>\n }\n </div>\n </div>\n }\n }\n\n @if (spacers(); as spacer) {\n <div [style.block-size.px]=\"spacer.end\" class=\"et-table-spacer\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n\n <!-- Edge gradients marking rows scrolled out of view horizontally. The layer is absolutely positioned\n over the whole grid \u2014 the full scroll extent, not just the viewport \u2014 which is what lets the two\n fades inside it hold their place with `position: sticky` for the entire scroll range. Their inline\n inset clears whatever columns are pinned at that edge, so the fade marks where rows actually\n disappear (a pinned column's inner edge) rather than the viewport's edge. -->\n <div class=\"et-table-scroll-fades\" role=\"presentation\" aria-hidden=\"true\">\n <div\n [style.inset-inline-start.px]=\"fadeInset().start\"\n [class.et-table-scroll-fade--visible]=\"scrollFades().start\"\n class=\"et-table-scroll-fade et-table-scroll-fade--start\"\n ></div>\n <div\n [style.inset-inline-end.px]=\"fadeInset().end\"\n [class.et-table-scroll-fade--visible]=\"scrollFades().end\"\n class=\"et-table-scroll-fade et-table-scroll-fade--end\"\n ></div>\n </div>\n\n @if (hasFooter()) {\n <div class=\"et-table-footer-row\" role=\"row\">\n @for (lead of leadCells(); track lead.key) {\n <div\n [class]=\"lead.cellClass\"\n [class.et-table-sticky-start]=\"lead.sticky\"\n [style.inset-inline-start.px]=\"lead.offset\"\n class=\"et-table-footer-cell\"\n role=\"gridcell\"\n aria-hidden=\"true\"\n ></div>\n }\n @for (cell of footerCells(); track cell.key) {\n <div\n [attr.data-align]=\"cell.align\"\n [class.et-table-sticky-start]=\"cell.stickyStart\"\n [class.et-table-sticky-end]=\"cell.stickyEnd\"\n [style.inset-inline-start.px]=\"cell.offsetStart\"\n [style.inset-inline-end.px]=\"cell.offsetEnd\"\n class=\"et-table-footer-cell\"\n role=\"gridcell\"\n >\n @if (cell.template; as footerTemplate) {\n <ng-container *ngTemplateOutlet=\"footerTemplate; context: { $implicit: rows() }\" />\n }\n </div>\n }\n @if (hasFiller()) {\n <div class=\"et-table-footer-cell et-table-filler-cell\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n </div>\n }\n</div>\n\n<!-- Full-width footer slot (paginator, page-size, etc.), pinned to the bottom of the scroll viewport.\n Rendered only when the consumer projects `[etTableFooter]`, so the chrome never shows empty. -->\n@if (footerSlot()) {\n <div class=\"et-table-footer\">\n <ng-content select=\"[etTableFooter]\" />\n </div>\n}\n\n<!-- Floating UI from opt-in features (the reorder drag ghost / drop indicator), stamped here so a\n feature can draw without having a view \u2014 or an element \u2014 of its own. -->\n@for (layer of layers(); track $index) {\n <ng-container *ngComponentOutlet=\"layer.component; injector: layer.injector\" />\n}\n", styles: ["@layer components{@property --et-table-cell-padding-block{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-table-cell-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 12px;}:where(.et-table-host){display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:1fr auto;overflow:auto;--_et-table-band: color-mix( in srgb, var(--et-surface-interaction-solid, gray) 7%, var(--et-surface-background-solid, Canvas) );--_et-table-header-bg: var(--et-surface-background-solid, Canvas);--_et-table-header-border: var(--et-surface-border-solid, rgb(128 128 128 / .3));--_et-table-row-divider: transparent;--_et-table-stripe-bg: transparent;--_et-table-stripe-solid: var(--et-surface-background-solid, Canvas);--_et-table-row-hover: color-mix(in srgb, var(--et-surface-interaction-solid, gray) 8%, transparent);--_et-table-row-hover-solid: color-mix( in srgb, var(--et-surface-interaction-solid, gray) 8%, var(--et-surface-background-solid, Canvas) )}.et-table-host:where([data-density=sm]){--et-table-cell-padding-block: 6px;--et-table-cell-padding-inline: 10px}.et-table-host:where([data-density=md]){--et-table-cell-padding-block: 10px;--et-table-cell-padding-inline: 12px}.et-table-host:where([data-density=lg]){--et-table-cell-padding-block: 15px;--et-table-cell-padding-inline: 16px}.et-table-host:where([data-appearance=enclosed],[data-appearance=zebra],[data-appearance=grid]){border:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .3));border-radius:10px}.et-table-host:where([data-appearance=enclosed]){--_et-table-header-bg: var(--_et-table-band);--_et-table-row-divider: var(--et-surface-border-solid, rgb(128 128 128 / .15));box-shadow:0 1px 2px #0000000a,0 6px 16px #0000000f}.et-table-host:where([data-appearance=divided]){--_et-table-row-divider: var(--et-surface-border-solid, rgb(128 128 128 / .15))}.et-table-host:where([data-appearance=zebra]){--_et-table-header-bg: var(--_et-table-band);--_et-table-stripe-bg: color-mix(in srgb, var(--et-surface-interaction-solid, gray) 4%, transparent);--_et-table-stripe-solid: color-mix( in srgb, var(--et-surface-interaction-solid, gray) 4%, var(--et-surface-background-solid, Canvas) )}.et-table-host:where([data-appearance=grid]){--_et-table-header-bg: var(--_et-table-band);--_et-table-row-divider: var(--et-surface-border-solid, rgb(128 128 128 / .15))}.et-table-host:where([data-appearance=bare]){--_et-table-header-border: transparent}.et-table-host:where([data-appearance=cards]){--_et-table-header-bg: var(--et-surface-background-solid, Canvas);--_et-table-row-divider: transparent;--_et-table-row-hover-solid: color-mix( in srgb, var(--et-surface-interaction-solid, gray) 8%, var(--_et-table-band) )}.et-table{display:grid;position:relative;align-content:start;inline-size:min-content;min-inline-size:100%;background:var(--et-surface-background-solid, Canvas);color:var(--et-surface-color-solid, CanvasText);font-size:14px;line-height:1.4}.et-table-filler-cell{padding-inline:0}.et-table-header-row,.et-table-row{display:contents}.et-table-header-cell,.et-table-cell{display:flex;align-items:center;min-inline-size:0;overflow:hidden;padding:var(--et-table-cell-padding-block) var(--et-table-cell-padding-inline)}.et-table-cell-text{min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.et-table-header-cell{position:sticky;inset-block-start:max(0px,calc(var(--_et-table-group-h, 0px) - 1px));gap:4px;z-index:1;font-weight:600;color:var(--et-surface-color-muted-solid, CanvasText);background:var(--_et-table-header-bg);border-block-end:1px solid var(--_et-table-header-border)}.et-table-cell{border-block-end:1px solid var(--_et-table-row-divider)}.et-table-row--last:not(:has(+.et-table-detail-row)) .et-table-cell{border-block-end:0}.et-table-row--stripe .et-table-cell{background:var(--_et-table-stripe-bg)}.et-table-host:where([data-appearance=grid]) .et-table-header-cell,.et-table-host:where([data-appearance=grid]) .et-table-cell{border-inline-end:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .15))}.et-table-host:where([data-appearance=grid]) .et-table-header-row .et-table-header-cell:last-child,.et-table-host:where([data-appearance=grid]) .et-table-row .et-table-cell:last-child{border-inline-end:0}.et-table-sticky-start,.et-table-sticky-end{position:sticky;z-index:1}.et-table-sticky-start{box-shadow:4px 0 6px -4px #0000002e}.et-table-sticky-end{box-shadow:-4px 0 6px -4px #0000002e}.et-table-cell:where(.et-table-sticky-start,.et-table-sticky-end){background:var(--et-surface-background-solid, Canvas)}.et-table-row--stripe .et-table-cell.et-table-sticky-start,.et-table-row--stripe .et-table-cell.et-table-sticky-end{background:var(--_et-table-stripe-solid)}@media(hover:hover){.et-table-row:hover .et-table-cell.et-table-sticky-start,.et-table-row:hover .et-table-cell.et-table-sticky-end{background:var(--_et-table-row-hover-solid)}}.et-table-header-cell:where(.et-table-sticky-start,.et-table-sticky-end),.et-table-footer-cell:where(.et-table-sticky-start,.et-table-sticky-end){z-index:3}.et-table-footer-row{display:contents}.et-table-footer-cell{display:flex;align-items:center;min-inline-size:0;overflow:hidden;padding:var(--et-table-cell-padding-block) var(--et-table-cell-padding-inline);position:sticky;inset-block-end:0;z-index:1;font-weight:600;background:var(--_et-table-header-bg);border-block-start:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .3))}.et-table-footer-cell:where([data-align=center]){justify-content:center;text-align:center}.et-table-footer-cell:where([data-align=end]){justify-content:flex-end;text-align:end}.et-table-scroll-fades{position:absolute;inset:0;display:flex;justify-content:space-between;z-index:3;pointer-events:none}.et-table-scroll-fade{position:sticky;flex:none;inline-size:var(--et-table-scroll-fade-size, 28px);opacity:0;transition:opacity .15s ease}.et-table-scroll-fade--visible{opacity:1}.et-table-scroll-fade--start{background:linear-gradient(to right,#00000029,#0000)}.et-table-scroll-fade--end{background:linear-gradient(to left,#00000029,#0000)}@media(prefers-reduced-motion:reduce){.et-table-scroll-fade{transition:none}}.et-table-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;position:sticky;inset-block-end:0;inset-inline-start:0;z-index:4;padding:var(--et-table-cell-padding-block) var(--et-table-cell-padding-inline);background:var(--_et-table-header-bg);border-block-start:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .3))}.et-table-footer-label{margin:0;font-size:14px;color:var(--et-surface-color-muted-solid, CanvasText)}@media(pointer:coarse){.et-table-footer{gap:8px;padding:8px var(--et-table-cell-padding-inline)}}.et-table-header-cell:where([data-align=center]),.et-table-cell:where([data-align=center]){justify-content:center;text-align:center}.et-table-header-cell:where([data-align=end]),.et-table-cell:where([data-align=end]){justify-content:flex-end;text-align:end}.et-table-row--interactive .et-table-cell{cursor:pointer}@media(hover:hover){.et-table-row:hover .et-table-cell{background:var(--_et-table-row-hover)}}.et-table-row--box{grid-column:1 / -1;display:grid;grid-template-columns:subgrid;position:relative;z-index:0}.et-table-cell--link{overflow:visible}.et-table-row-link{position:absolute;inset:0;cursor:pointer}.et-table-row-link:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:-2px}.et-table-row--link :where(.et-table-select-cell,.et-table-expander-cell,.et-table-cell--interactive){position:relative;z-index:1}.et-table-host:where([data-appearance=cards]) .et-table-row{margin-block-end:var(--et-table-row-gap, 8px);background:var(--_et-table-band);border:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .3));border-radius:var(--et-table-row-radius, 10px)}.et-table-host:where([data-appearance=cards]) .et-table-header-cell{margin-block-end:var(--et-table-row-gap, 8px)}.et-table-host:where([data-appearance=cards]) .et-table-row:not(.et-table-row--interactive,.et-table-row--link){--_et-table-row-hover: transparent;--_et-table-row-hover-solid: var(--_et-table-band)}.et-table-host:where([data-appearance=cards]) .et-table-row>:first-child{border-start-start-radius:inherit;border-end-start-radius:inherit}.et-table-host:where([data-appearance=cards]) .et-table-row>:last-child{border-start-end-radius:inherit;border-end-end-radius:inherit}.et-table-host:where([data-appearance=cards]) .et-table-cell:where(.et-table-sticky-start,.et-table-sticky-end){background:var(--_et-table-band)}.et-table-host:where([data-appearance=cards]) .et-table-row-link{border-radius:var(--et-table-row-radius, 10px)}.et-table-header-label{display:flex;align-items:center;gap:4px;flex:1;min-inline-size:0;margin:0;padding:0;font:inherit;color:inherit;text-align:inherit;background:none;border:none}.et-table-header-label:where(.et-table-header-label--sortable){cursor:pointer}.et-table-header-cell:where([data-align=center]) .et-table-header-label{justify-content:center}.et-table-header-cell:where([data-align=end]) .et-table-header-label{justify-content:flex-end}.et-table-sort-indicator{flex:none;inline-size:1.15em;block-size:1.15em;transform:translateY(-.045em);color:var(--et-theme-color-primary-solid, currentColor);transition:transform .2s var(--ease-out-5, ease)}.et-table-sort-indicator:where([data-direction=desc]){transform:translateY(-.045em) rotate(180deg)}.et-table-sort-indicator.et-table-sort-indicator--enter{animation:et-table-sort-in .15s ease}.et-table-sort-indicator.et-table-sort-indicator--leave{animation:et-table-sort-in .12s ease reverse forwards}@keyframes et-table-sort-in{0%{opacity:0}to{opacity:1}}@media(prefers-reduced-motion:reduce){.et-table-sort-indicator{transition:none}.et-table-sort-indicator.et-table-sort-indicator--enter,.et-table-sort-indicator.et-table-sort-indicator--leave{animation:none}}.et-table-message-row{display:contents}.et-table-empty-cell,.et-table-error-cell{grid-column:1 / -1;padding:32px var(--et-table-cell-padding-inline);color:var(--et-surface-color-muted-solid, CanvasText);text-align:center}.et-table-error-cell{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px}.et-table-error-icon{flex:none;inline-size:16px;block-size:16px;color:var(--et-theme-color-ink-solid, currentColor)}.et-table-cell:where([data-state=error]){gap:6px}.et-table-cell-error-icon{flex:none;inline-size:14px;block-size:14px;color:var(--et-theme-color-ink-solid, currentColor)}.et-table-cell:where([data-state=loading]){display:flex}.et-table-busy-bar{grid-column:1 / -1;block-size:2px;overflow:hidden;background:color-mix(in srgb,var(--et-surface-interaction-solid, gray) 10%,transparent)}.et-table-busy-bar:after{content:\"\";display:block;inline-size:40%;block-size:100%;border-radius:999px;background:var(--et-theme-color-primary-solid, currentColor);animation:et-table-busy-sweep 1.1s ease-in-out infinite}@keyframes et-table-busy-sweep{0%{transform:translate(-100%)}to{transform:translate(250%)}}@media(prefers-reduced-motion:reduce){.et-table-busy-bar:after{inline-size:100%;animation:none}}}\n"], dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: IconDirective, selector: "[etIcon]", inputs: ["etIcon", "variant", "allowHardcodedColor", "label"] }, { kind: "directive", type: ProvideColorDirective, selector: "[etProvideColor]", inputs: ["etProvideColor"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
61417
61533
|
}
|
|
61418
61534
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: TableComponent, decorators: [{
|
|
61419
61535
|
type: Component,
|
|
@@ -61426,8 +61542,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
61426
61542
|
'[attr.data-density]': 'density()',
|
|
61427
61543
|
'[attr.aria-busy]': 'resolvedLoading() ? "true" : null',
|
|
61428
61544
|
'(scroll)': 'syncScrollFades()',
|
|
61429
|
-
}, template: "<!-- Every binding below reads a field off a render model (see the `\u2026Vm` types in the component):\n methods belong in event bindings, not in bindings the framework re-evaluates each pass. -->\n<div [style.grid-template-columns]=\"templateColumns()\" class=\"et-table\" role=\"grid\">\n <!-- Rows a feature renders above the column headers (etTableGroupHeaders' spanning group row). Each\n is display: contents and lays its own cells into these tracks \u2014 see registerHeaderRow. -->\n @for (headerRow of headerRows(); track $index) {\n <ng-container *ngComponentOutlet=\"headerRow.component; injector: headerRow.injector\" />\n }\n\n <div class=\"et-table-header-row\" role=\"row\">\n <!-- Leading utility columns (selection from a feature, the expander when expansion is on). The\n table owns the cell chrome; the feature only supplies what goes inside. -->\n @for (lead of leadCells(); track lead.key) {\n <div\n #leadHeaderCell\n [class]=\"lead.cellClass\"\n [class.et-table-sticky-start]=\"lead.sticky\"\n [style.inset-inline-start.px]=\"lead.offset\"\n [attr.aria-hidden]=\"lead.lead.headerComponent ? null : 'true'\"\n class=\"et-table-header-cell\"\n role=\"columnheader\"\n >\n @if (lead.lead.headerComponent; as headerComponent) {\n <ng-container *ngComponentOutlet=\"headerComponent; injector: lead.lead.injector\" />\n }\n </div>\n }\n @for (cell of headerCellVms(); track cell.key) {\n <div\n #headerCell\n [attr.data-align]=\"cell.align\"\n [attr.data-col-key]=\"cell.key\"\n [attr.aria-sort]=\"cell.ariaSort\"\n [class.et-table-sticky-start]=\"cell.stickyStart\"\n [class.et-table-sticky-end]=\"cell.stickyEnd\"\n [style.inset-inline-start.px]=\"cell.offsetStart\"\n [style.inset-inline-end.px]=\"cell.offsetEnd\"\n class=\"et-table-header-cell\"\n role=\"columnheader\"\n >\n <!-- Sorting is the whole header's job, not a control's: the label plus everything around it is\n one button, and the only sort affordance is the direction arrow, which appears once the\n column is actually sorted. Adornments sit outside it so their own clicks don't sort. -->\n @if (cell.sortable) {\n <button\n [attr.aria-label]=\"cell.sortLabel\"\n (click)=\"toggleSort(cell.key)\"\n class=\"et-table-header-label et-table-header-label--sortable\"\n type=\"button\"\n >\n @if (cell.template; as headerTemplate) {\n <ng-container *ngTemplateOutlet=\"headerTemplate; context: { $implicit: cell.column.header }\" />\n } @else {\n <span class=\"et-table-cell-text\">{{ cell.column.header }}</span>\n }\n @if (cell.direction; as direction) {\n <!-- Flipping direction keeps this element mounted, so the arrow turns over rather than\n swapping; only appearing and disappearing are the fade. -->\n <i\n [attr.data-direction]=\"direction\"\n class=\"et-table-sort-indicator\"\n animate.enter=\"et-table-sort-indicator--enter\"\n animate.leave=\"et-table-sort-indicator--leave\"\n etIcon=\"et-arrow-up\"\n ></i>\n }\n </button>\n } @else {\n <span class=\"et-table-header-label\">\n @if (cell.template; as headerTemplate) {\n <ng-container *ngTemplateOutlet=\"headerTemplate; context: { $implicit: cell.column.header }\" />\n } @else {\n <span class=\"et-table-cell-text\">{{ cell.column.header }}</span>\n }\n </span>\n }\n\n <!-- UI from opt-in features (filter menu, \u2026), each registered rather than referenced \u2014 see\n registerHeaderAdornment. Renders nothing when no feature is imported. -->\n @for (adornment of headerAdornments(); track $index) {\n <ng-container\n *ngComponentOutlet=\"adornment.component; inputs: { column: cell.column }; injector: adornment.injector\"\n />\n }\n </div>\n }\n <!-- Filler cell for the trailing slack track (see hasFiller): carries the header band to the\n panel's edge when every column is a rigid width. -->\n @if (hasFiller()) {\n <div class=\"et-table-header-cell et-table-filler-cell\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n </div>\n\n <!-- Refetching over rows that are already on screen: a 2px indeterminate bar right under the header,\n so the data stays readable and in place. Drawn here rather than with `et-progress-bar` \u2014 the base\n table takes no component dependencies, and this is 2px of chrome, not a control. -->\n @if (showBusyBar()) {\n <div class=\"et-table-busy-bar\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n\n @if (spacers(); as spacer) {\n <div [style.block-size.px]=\"spacer.start\" class=\"et-table-spacer\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n\n @if (hasError()) {\n <!-- The error state stands in for the whole body: rows are either trustworthy or absent. -->\n <div class=\"et-table-message-row\" role=\"row\">\n <div class=\"et-table-error-cell\" role=\"gridcell\" aria-live=\"polite\">\n @if (errorTemplate(); as template) {\n <ng-container *ngTemplateOutlet=\"template; context: { $implicit: error() }\" />\n } @else {\n <ng-content select=\"[etTableError]\">\n <i [etProvideColor]=\"errorColorTheme\" class=\"et-table-error-icon\" etIcon=\"et-triangle-exclamation\"></i>\n <span>{{ resolvedLabels().error }}</span>\n </ng-content>\n }\n </div>\n </div>\n } @else if (showPlaceholderRows()) {\n <!-- First load with nothing to show yet. What a loading body looks like belongs to a feature\n (etTableSkeleton draws placeholder rows in these tracks); with none the body stays blank rather\n than showing a misleading empty state \u2014 the host's `aria-busy` is the announcement. -->\n @if (bodyPlaceholder(); as placeholder) {\n <ng-container *ngComponentOutlet=\"placeholder.component; injector: placeholder.injector\" />\n }\n } @else {\n @for (rowVm of bodyRows(); track rowVm.key) {\n <div\n [class]=\"rowVm.classes\"\n [class.et-table-row--stripe]=\"rowVm.stripe\"\n [class.et-table-row--interactive]=\"rowInteractive()\"\n [attr.tabindex]=\"rowInteractive() && !cellNavigation() ? 0 : null\"\n (click)=\"activateRow(rowVm.row, $event)\"\n (keydown.enter)=\"activateRow(rowVm.row, $event)\"\n (keydown.space)=\"activateRow(rowVm.row, $event)\"\n class=\"et-table-row\"\n role=\"row\"\n >\n @for (lead of rowVm.leads; track lead.key) {\n <div\n [class]=\"lead.cellClass\"\n [class.et-table-sticky-start]=\"lead.sticky\"\n [style.inset-inline-start.px]=\"lead.offset\"\n class=\"et-table-cell\"\n role=\"gridcell\"\n >\n <ng-container\n *ngComponentOutlet=\"lead.lead.bodyComponent; inputs: { row: rowVm.row }; injector: lead.lead.injector\"\n />\n </div>\n }\n @for (cell of rowVm.cells; track cell.key) {\n <div\n #bodyCell\n [attr.data-align]=\"cell.align\"\n [attr.data-col-key]=\"cell.key\"\n [attr.tabindex]=\"cellNavigation() ? -1 : null\"\n [attr.data-state]=\"cell.state\"\n [class.et-table-cell--editing]=\"cell.edit\"\n [class.et-skeleton--animated]=\"cell.state === 'loading'\"\n [class.et-table-sticky-start]=\"cell.stickyStart\"\n [class.et-table-sticky-end]=\"cell.stickyEnd\"\n [style.inset-inline-start.px]=\"cell.offsetStart\"\n [style.inset-inline-end.px]=\"cell.offsetEnd\"\n class=\"et-table-cell\"\n role=\"gridcell\"\n >\n @if (cell.edit; as edit) {\n <!-- The one cell in edit mode: the column's etTableCellEdit template, rendered with the\n editing feature's own context (the draft field). See registerCellEditing. -->\n <ng-container *ngTemplateOutlet=\"edit.template; context: edit.context\" />\n } @else if (cell.state === 'loading' && cellPlaceholder(); as placeholder) {\n <!-- A cell that is loading on its own (an inline edit saving) shows a feature's placeholder\n instead of its value; the row around it stays readable. Without one the value stays put\n and `data-state` carries the cue \u2014 see registerCellPlaceholder. -->\n <ng-container *ngComponentOutlet=\"placeholder.component; injector: placeholder.injector\" />\n } @else {\n @if (cell.state === 'error') {\n @if (cellErrorMark(); as mark) {\n <!-- A feature (etTableCellErrorTooltip) draws the mark instead, so the overlay runtime\n only ships when a table actually wants a tooltip. -->\n <ng-container\n *ngComponentOutlet=\"mark.component; inputs: { message: cell.message }; injector: mark.injector\"\n />\n } @else {\n <!-- Color-scoped here rather than on the cell: the mark is the only part that must read\n as an error, and a provider per errored cell is cheap where one per cell would not\n be. The message rides along as `title`, which costs nothing. -->\n <i\n [etProvideColor]=\"errorColorTheme\"\n [attr.title]=\"cell.message\"\n [attr.aria-label]=\"cell.message\"\n [attr.aria-hidden]=\"cell.message ? null : 'true'\"\n class=\"et-table-cell-error-icon\"\n etIcon=\"et-triangle-exclamation\"\n ></i>\n }\n }\n @if (cell.template; as bodyTemplate) {\n <ng-container *ngTemplateOutlet=\"bodyTemplate; context: cell.context\" />\n } @else {\n <span class=\"et-table-cell-text\">{{ cell.value }}</span>\n }\n }\n </div>\n }\n @if (hasFiller()) {\n <div class=\"et-table-cell et-table-filler-cell\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n </div>\n\n <!-- The detail row of an expanded row, from etTableRowExpansion \u2014 the whole row, its chrome and\n its animation belong to the feature, so a table that never expands carries none of them. -->\n @if (rowVm.detail; as detail) {\n <ng-container *ngComponentOutlet=\"detail.component; inputs: { row: rowVm.row }; injector: detail.injector\" />\n }\n } @empty {\n <div class=\"et-table-message-row\" role=\"row\">\n <div class=\"et-table-empty-cell\" role=\"gridcell\">\n @if (emptyTemplate(); as template) {\n <ng-container *ngTemplateOutlet=\"template; context: { $implicit: rows() }\" />\n } @else {\n <ng-content select=\"[etTableEmpty]\">{{ resolvedLabels().empty }}</ng-content>\n }\n </div>\n </div>\n }\n }\n\n @if (spacers(); as spacer) {\n <div [style.block-size.px]=\"spacer.end\" class=\"et-table-spacer\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n\n <!-- Edge gradients marking rows scrolled out of view horizontally. The layer is absolutely positioned\n over the whole grid \u2014 the full scroll extent, not just the viewport \u2014 which is what lets the two\n fades inside it hold their place with `position: sticky` for the entire scroll range. Their inline\n inset clears whatever columns are pinned at that edge, so the fade marks where rows actually\n disappear (a pinned column's inner edge) rather than the viewport's edge. -->\n <div class=\"et-table-scroll-fades\" role=\"presentation\" aria-hidden=\"true\">\n <div\n [style.inset-inline-start.px]=\"fadeInset().start\"\n [class.et-table-scroll-fade--visible]=\"scrollFades().start\"\n class=\"et-table-scroll-fade et-table-scroll-fade--start\"\n ></div>\n <div\n [style.inset-inline-end.px]=\"fadeInset().end\"\n [class.et-table-scroll-fade--visible]=\"scrollFades().end\"\n class=\"et-table-scroll-fade et-table-scroll-fade--end\"\n ></div>\n </div>\n\n @if (hasFooter()) {\n <div class=\"et-table-footer-row\" role=\"row\">\n @for (lead of leadCells(); track lead.key) {\n <div\n [class]=\"lead.cellClass\"\n [class.et-table-sticky-start]=\"lead.sticky\"\n [style.inset-inline-start.px]=\"lead.offset\"\n class=\"et-table-footer-cell\"\n role=\"gridcell\"\n aria-hidden=\"true\"\n ></div>\n }\n @for (cell of footerCells(); track cell.key) {\n <div\n [attr.data-align]=\"cell.align\"\n [class.et-table-sticky-start]=\"cell.stickyStart\"\n [class.et-table-sticky-end]=\"cell.stickyEnd\"\n [style.inset-inline-start.px]=\"cell.offsetStart\"\n [style.inset-inline-end.px]=\"cell.offsetEnd\"\n class=\"et-table-footer-cell\"\n role=\"gridcell\"\n >\n @if (cell.template; as footerTemplate) {\n <ng-container *ngTemplateOutlet=\"footerTemplate; context: { $implicit: rows() }\" />\n }\n </div>\n }\n @if (hasFiller()) {\n <div class=\"et-table-footer-cell et-table-filler-cell\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n </div>\n }\n</div>\n\n<!-- Full-width footer slot (paginator, page-size, etc.), pinned to the bottom of the scroll viewport.\n Rendered only when the consumer projects `[etTableFooter]`, so the chrome never shows empty. -->\n@if (footerSlot()) {\n <div class=\"et-table-footer\">\n <ng-content select=\"[etTableFooter]\" />\n </div>\n}\n\n<!-- Floating UI from opt-in features (the reorder drag ghost / drop indicator), stamped here so a\n feature can draw without having a view \u2014 or an element \u2014 of its own. -->\n@for (layer of layers(); track $index) {\n <ng-container *ngComponentOutlet=\"layer.component; injector: layer.injector\" />\n}\n", styles: ["@layer components{@property --et-table-cell-padding-block{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-table-cell-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 12px;}:where(.et-table-host){display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:1fr auto;overflow:auto;--_et-table-band: color-mix( in srgb, var(--et-surface-interaction-solid, gray) 7%, var(--et-surface-background-solid, Canvas) );--_et-table-header-bg: var(--et-surface-background-solid, Canvas);--_et-table-header-border: var(--et-surface-border-solid, rgb(128 128 128 / .3));--_et-table-row-divider: transparent;--_et-table-stripe-bg: transparent;--_et-table-stripe-solid: var(--et-surface-background-solid, Canvas)}.et-table-host:where([data-density=sm]){--et-table-cell-padding-block: 6px;--et-table-cell-padding-inline: 10px}.et-table-host:where([data-density=md]){--et-table-cell-padding-block: 10px;--et-table-cell-padding-inline: 12px}.et-table-host:where([data-density=lg]){--et-table-cell-padding-block: 15px;--et-table-cell-padding-inline: 16px}.et-table-host:where([data-appearance=enclosed],[data-appearance=zebra],[data-appearance=grid]){border:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .3));border-radius:10px}.et-table-host:where([data-appearance=enclosed]){--_et-table-header-bg: var(--_et-table-band);--_et-table-row-divider: var(--et-surface-border-solid, rgb(128 128 128 / .15));box-shadow:0 1px 2px #0000000a,0 6px 16px #0000000f}.et-table-host:where([data-appearance=divided]){--_et-table-row-divider: var(--et-surface-border-solid, rgb(128 128 128 / .15))}.et-table-host:where([data-appearance=zebra]){--_et-table-header-bg: var(--_et-table-band);--_et-table-stripe-bg: color-mix(in srgb, var(--et-surface-interaction-solid, gray) 4%, transparent);--_et-table-stripe-solid: color-mix( in srgb, var(--et-surface-interaction-solid, gray) 4%, var(--et-surface-background-solid, Canvas) )}.et-table-host:where([data-appearance=grid]){--_et-table-header-bg: var(--_et-table-band);--_et-table-row-divider: var(--et-surface-border-solid, rgb(128 128 128 / .15))}.et-table-host:where([data-appearance=bare]){--_et-table-header-border: transparent}.et-table{display:grid;position:relative;align-content:start;inline-size:min-content;min-inline-size:100%;background:var(--et-surface-background-solid, Canvas);color:var(--et-surface-color-solid, CanvasText);font-size:14px;line-height:1.4}.et-table-filler-cell{padding-inline:0}.et-table-header-row,.et-table-row{display:contents}.et-table-header-cell,.et-table-cell{display:flex;align-items:center;min-inline-size:0;overflow:hidden;padding:var(--et-table-cell-padding-block) var(--et-table-cell-padding-inline)}.et-table-cell-text{min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.et-table-header-cell{position:sticky;inset-block-start:max(0px,calc(var(--_et-table-group-h, 0px) - 1px));gap:4px;z-index:1;font-weight:600;color:var(--et-surface-color-muted-solid, CanvasText);background:var(--_et-table-header-bg);border-block-end:1px solid var(--_et-table-header-border)}.et-table-cell{border-block-end:1px solid var(--_et-table-row-divider)}.et-table-row--stripe .et-table-cell{background:var(--_et-table-stripe-bg)}.et-table-host:where([data-appearance=grid]) .et-table-header-cell,.et-table-host:where([data-appearance=grid]) .et-table-cell{border-inline-end:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .15))}.et-table-host:where([data-appearance=grid]) .et-table-header-row .et-table-header-cell:last-child,.et-table-host:where([data-appearance=grid]) .et-table-row .et-table-cell:last-child{border-inline-end:0}.et-table-sticky-start,.et-table-sticky-end{position:sticky;z-index:1}.et-table-sticky-start{box-shadow:4px 0 6px -4px #0000002e}.et-table-sticky-end{box-shadow:-4px 0 6px -4px #0000002e}.et-table-cell:where(.et-table-sticky-start,.et-table-sticky-end){background:var(--et-surface-background-solid, Canvas)}.et-table-row--stripe .et-table-cell.et-table-sticky-start,.et-table-row--stripe .et-table-cell.et-table-sticky-end{background:var(--_et-table-stripe-solid)}@media(hover:hover){.et-table-row:hover .et-table-cell.et-table-sticky-start,.et-table-row:hover .et-table-cell.et-table-sticky-end{background:color-mix(in srgb,var(--et-surface-interaction-solid, gray) 8%,var(--et-surface-background-solid, Canvas))}}.et-table-header-cell:where(.et-table-sticky-start,.et-table-sticky-end),.et-table-footer-cell:where(.et-table-sticky-start,.et-table-sticky-end){z-index:3}.et-table-footer-row{display:contents}.et-table-footer-cell{display:flex;align-items:center;min-inline-size:0;overflow:hidden;padding:var(--et-table-cell-padding-block) var(--et-table-cell-padding-inline);position:sticky;inset-block-end:0;z-index:1;font-weight:600;background:var(--_et-table-header-bg);border-block-start:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .3))}.et-table-footer-cell:where([data-align=center]){justify-content:center;text-align:center}.et-table-footer-cell:where([data-align=end]){justify-content:flex-end;text-align:end}.et-table-scroll-fades{position:absolute;inset:0;display:flex;justify-content:space-between;z-index:3;pointer-events:none}.et-table-scroll-fade{position:sticky;flex:none;inline-size:var(--et-table-scroll-fade-size, 28px);opacity:0;transition:opacity .15s ease}.et-table-scroll-fade--visible{opacity:1}.et-table-scroll-fade--start{background:linear-gradient(to right,#00000029,#0000)}.et-table-scroll-fade--end{background:linear-gradient(to left,#00000029,#0000)}@media(prefers-reduced-motion:reduce){.et-table-scroll-fade{transition:none}}.et-table-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;position:sticky;inset-block-end:0;inset-inline-start:0;z-index:4;padding:var(--et-table-cell-padding-block) var(--et-table-cell-padding-inline);background:var(--_et-table-header-bg);border-block-start:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .3))}.et-table-footer-label{margin:0;font-size:14px;color:var(--et-surface-color-muted-solid, CanvasText)}@media(pointer:coarse){.et-table-footer{gap:8px;padding:8px var(--et-table-cell-padding-inline)}}.et-table-header-cell:where([data-align=center]),.et-table-cell:where([data-align=center]){justify-content:center;text-align:center}.et-table-header-cell:where([data-align=end]),.et-table-cell:where([data-align=end]){justify-content:flex-end;text-align:end}.et-table-row--interactive .et-table-cell{cursor:pointer}@media(hover:hover){.et-table-row:hover .et-table-cell{background:color-mix(in srgb,var(--et-surface-interaction-solid, gray) 8%,transparent)}}.et-table-header-label{display:flex;align-items:center;gap:4px;flex:1;min-inline-size:0;margin:0;padding:0;font:inherit;color:inherit;text-align:inherit;background:none;border:none}.et-table-header-label:where(.et-table-header-label--sortable){cursor:pointer}.et-table-header-cell:where([data-align=center]) .et-table-header-label{justify-content:center}.et-table-header-cell:where([data-align=end]) .et-table-header-label{justify-content:flex-end}.et-table-sort-indicator{flex:none;inline-size:1.15em;block-size:1.15em;transform:translateY(-.045em);color:var(--et-theme-color-primary-solid, currentColor);transition:transform .2s var(--ease-out-5, ease)}.et-table-sort-indicator:where([data-direction=desc]){transform:translateY(-.045em) rotate(180deg)}.et-table-sort-indicator.et-table-sort-indicator--enter{animation:et-table-sort-in .15s ease}.et-table-sort-indicator.et-table-sort-indicator--leave{animation:et-table-sort-in .12s ease reverse forwards}@keyframes et-table-sort-in{0%{opacity:0}to{opacity:1}}@media(prefers-reduced-motion:reduce){.et-table-sort-indicator{transition:none}.et-table-sort-indicator.et-table-sort-indicator--enter,.et-table-sort-indicator.et-table-sort-indicator--leave{animation:none}}.et-table-message-row{display:contents}.et-table-empty-cell,.et-table-error-cell{grid-column:1 / -1;padding:32px var(--et-table-cell-padding-inline);color:var(--et-surface-color-muted-solid, CanvasText);text-align:center}.et-table-error-cell{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px}.et-table-error-icon{flex:none;inline-size:16px;block-size:16px;color:var(--et-theme-color-ink-solid, currentColor)}.et-table-cell:where([data-state=error]){gap:6px}.et-table-cell-error-icon{flex:none;inline-size:14px;block-size:14px;color:var(--et-theme-color-ink-solid, currentColor)}.et-table-cell:where([data-state=loading]){display:flex}.et-table-busy-bar{grid-column:1 / -1;block-size:2px;overflow:hidden;background:color-mix(in srgb,var(--et-surface-interaction-solid, gray) 10%,transparent)}.et-table-busy-bar:after{content:\"\";display:block;inline-size:40%;block-size:100%;border-radius:999px;background:var(--et-theme-color-primary-solid, currentColor);animation:et-table-busy-sweep 1.1s ease-in-out infinite}@keyframes et-table-busy-sweep{0%{transform:translate(-100%)}to{transform:translate(250%)}}@media(prefers-reduced-motion:reduce){.et-table-busy-bar:after{inline-size:100%;animation:none}}}\n"] }]
|
|
61430
|
-
}], ctorParameters: () => [], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], rowsSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowsSource", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], rowKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowKey", required: false }] }], labels: [{ type: i0.Input, args: [{ isSignal: true, alias: "labels", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], emptyTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyTemplate", required: false }] }], errorTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorTemplate", required: false }] }], cellState: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellState", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], density: [{ type: i0.Input, args: [{ isSignal: true, alias: "density", required: false }] }], sort: [{ type: i0.Input, args: [{ isSignal: true, alias: "sort", required: false }] }, { type: i0.Output, args: ["sortChange"] }], multiSort: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiSort", required: false }] }], sortMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortMode", required: false }] }], filters: [{ type: i0.Input, args: [{ isSignal: true, alias: "filters", required: false }] }, { type: i0.Output, args: ["filtersChange"] }], filterMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterMode", required: false }] }], expandedRowTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandedRowTemplate", required: false }] }], rowInteractive: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowInteractive", required: false }] }], rowClick: [{ type: i0.Output, args: ["rowClick"] }], footerSlot: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TableFooterDirective), { isSignal: true }] }], headerCells: [{ type: i0.ViewChildren, args: ['headerCell', { isSignal: true }] }], bodyCells: [{ type: i0.ViewChildren, args: ['bodyCell', { isSignal: true }] }], leadHeaderCells: [{ type: i0.ViewChildren, args: ['leadHeaderCell', { isSignal: true }] }] } });
|
|
61545
|
+
}, template: "<!-- Every binding below reads a field off a render model (see the `\u2026Vm` types in the component):\n methods belong in event bindings, not in bindings the framework re-evaluates each pass. -->\n<div [style.grid-template-columns]=\"templateColumns()\" class=\"et-table\" role=\"grid\">\n <!-- Rows a feature renders above the column headers (etTableGroupHeaders' spanning group row). Each\n is display: contents and lays its own cells into these tracks \u2014 see registerHeaderRow. -->\n @for (headerRow of headerRows(); track $index) {\n <ng-container *ngComponentOutlet=\"headerRow.component; injector: headerRow.injector\" />\n }\n\n <div class=\"et-table-header-row\" role=\"row\">\n <!-- Leading utility columns (selection from a feature, the expander when expansion is on). The\n table owns the cell chrome; the feature only supplies what goes inside. -->\n @for (lead of leadCells(); track lead.key) {\n <div\n #leadHeaderCell\n [class]=\"lead.cellClass\"\n [class.et-table-sticky-start]=\"lead.sticky\"\n [style.inset-inline-start.px]=\"lead.offset\"\n [attr.aria-hidden]=\"lead.lead.headerComponent ? null : 'true'\"\n class=\"et-table-header-cell\"\n role=\"columnheader\"\n >\n @if (lead.lead.headerComponent; as headerComponent) {\n <ng-container *ngComponentOutlet=\"headerComponent; injector: lead.lead.injector\" />\n }\n </div>\n }\n @for (cell of headerCellVms(); track cell.key) {\n <div\n #headerCell\n [attr.data-align]=\"cell.align\"\n [attr.data-col-key]=\"cell.key\"\n [attr.aria-sort]=\"cell.ariaSort\"\n [class.et-table-sticky-start]=\"cell.stickyStart\"\n [class.et-table-sticky-end]=\"cell.stickyEnd\"\n [style.inset-inline-start.px]=\"cell.offsetStart\"\n [style.inset-inline-end.px]=\"cell.offsetEnd\"\n class=\"et-table-header-cell\"\n role=\"columnheader\"\n >\n <!-- Sorting is the whole header's job, not a control's: the label plus everything around it is\n one button, and the only sort affordance is the direction arrow, which appears once the\n column is actually sorted. Adornments sit outside it so their own clicks don't sort. -->\n @if (cell.sortable) {\n <button\n [attr.aria-label]=\"cell.sortLabel\"\n (click)=\"toggleSort(cell.key)\"\n class=\"et-table-header-label et-table-header-label--sortable\"\n type=\"button\"\n >\n @if (cell.template; as headerTemplate) {\n <ng-container *ngTemplateOutlet=\"headerTemplate; context: { $implicit: cell.column.header }\" />\n } @else {\n <span class=\"et-table-cell-text\">{{ cell.column.header }}</span>\n }\n @if (cell.direction; as direction) {\n <!-- Flipping direction keeps this element mounted, so the arrow turns over rather than\n swapping; only appearing and disappearing are the fade. -->\n <i\n [attr.data-direction]=\"direction\"\n class=\"et-table-sort-indicator\"\n animate.enter=\"et-table-sort-indicator--enter\"\n animate.leave=\"et-table-sort-indicator--leave\"\n etIcon=\"et-arrow-up\"\n ></i>\n }\n </button>\n } @else {\n <span class=\"et-table-header-label\">\n @if (cell.template; as headerTemplate) {\n <ng-container *ngTemplateOutlet=\"headerTemplate; context: { $implicit: cell.column.header }\" />\n } @else {\n <span class=\"et-table-cell-text\">{{ cell.column.header }}</span>\n }\n </span>\n }\n\n <!-- UI from opt-in features (filter menu, \u2026), each registered rather than referenced \u2014 see\n registerHeaderAdornment. Renders nothing when no feature is imported. -->\n @for (adornment of headerAdornments(); track $index) {\n <ng-container\n *ngComponentOutlet=\"adornment.component; inputs: { column: cell.column }; injector: adornment.injector\"\n />\n }\n </div>\n }\n <!-- Filler cell for the trailing slack track (see hasFiller): carries the header band to the\n panel's edge when every column is a rigid width. -->\n @if (hasFiller()) {\n <div class=\"et-table-header-cell et-table-filler-cell\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n </div>\n\n <!-- Refetching over rows that are already on screen: a 2px indeterminate bar right under the header,\n so the data stays readable and in place. Drawn here rather than with `et-progress-bar` \u2014 the base\n table takes no component dependencies, and this is 2px of chrome, not a control. -->\n @if (showBusyBar()) {\n <div class=\"et-table-busy-bar\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n\n @if (spacers(); as spacer) {\n <div [style.block-size.px]=\"spacer.start\" class=\"et-table-spacer\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n\n @if (hasError()) {\n <!-- The error state stands in for the whole body: rows are either trustworthy or absent. -->\n <div class=\"et-table-message-row\" role=\"row\">\n <div class=\"et-table-error-cell\" role=\"gridcell\" aria-live=\"polite\">\n @if (errorTemplate(); as template) {\n <ng-container *ngTemplateOutlet=\"template; context: { $implicit: error() }\" />\n } @else {\n <ng-content select=\"[etTableError]\">\n <i [etProvideColor]=\"errorColorTheme\" class=\"et-table-error-icon\" etIcon=\"et-triangle-exclamation\"></i>\n <span>{{ resolvedLabels().error }}</span>\n </ng-content>\n }\n </div>\n </div>\n } @else if (showPlaceholderRows()) {\n <!-- First load with nothing to show yet. What a loading body looks like belongs to a feature\n (etTableSkeleton draws placeholder rows in these tracks); with none the body stays blank rather\n than showing a misleading empty state \u2014 the host's `aria-busy` is the announcement. -->\n @if (bodyPlaceholder(); as placeholder) {\n <ng-container *ngComponentOutlet=\"placeholder.component; injector: placeholder.injector\" />\n }\n } @else {\n @for (rowVm of bodyRows(); track rowVm.key) {\n <!-- A linked row is not a tab stop of its own: its anchor is the one stop, and the one link. -->\n <div\n [class]=\"rowVm.classes\"\n [class.et-table-row--stripe]=\"rowVm.stripe\"\n [class.et-table-row--last]=\"rowVm.last\"\n [class.et-table-row--interactive]=\"rowInteractive()\"\n [class.et-table-row--box]=\"rowBox()\"\n [class.et-table-row--link]=\"rowVm.href !== null\"\n [attr.tabindex]=\"rowInteractive() && !cellNavigation() && rowVm.href === null ? 0 : null\"\n (click)=\"activateRow(rowVm.row, $event)\"\n (keydown.enter)=\"activateRow(rowVm.row, $event)\"\n (keydown.space)=\"activateRow(rowVm.row, $event)\"\n class=\"et-table-row\"\n role=\"row\"\n >\n @for (lead of rowVm.leads; track lead.key) {\n <div\n [class]=\"lead.cellClass\"\n [class.et-table-sticky-start]=\"lead.sticky\"\n [style.inset-inline-start.px]=\"lead.offset\"\n class=\"et-table-cell\"\n role=\"gridcell\"\n >\n <ng-container\n *ngComponentOutlet=\"lead.lead.bodyComponent; inputs: { row: rowVm.row }; injector: lead.lead.injector\"\n />\n </div>\n }\n @for (cell of rowVm.cells; track cell.key) {\n <div\n #bodyCell\n [attr.data-align]=\"cell.align\"\n [attr.data-col-key]=\"cell.key\"\n [attr.tabindex]=\"cellNavigation() ? -1 : null\"\n [attr.data-state]=\"cell.state\"\n [attr.id]=\"cell.linkHost ? rowVm.linkLabelId : null\"\n [class.et-table-cell--link]=\"cell.linkHost\"\n [class.et-table-cell--interactive]=\"cell.interactive\"\n [class.et-table-cell--editing]=\"cell.edit\"\n [class.et-skeleton--animated]=\"cell.state === 'loading'\"\n [class.et-table-sticky-start]=\"cell.stickyStart\"\n [class.et-table-sticky-end]=\"cell.stickyEnd\"\n [style.inset-inline-start.px]=\"cell.offsetStart\"\n [style.inset-inline-end.px]=\"cell.offsetEnd\"\n class=\"et-table-cell\"\n role=\"gridcell\"\n >\n @if (cell.edit; as edit) {\n <!-- The one cell in edit mode: the column's etTableCellEdit template, rendered with the\n editing feature's own context (the draft field). See registerCellEditing. -->\n <ng-container *ngTemplateOutlet=\"edit.template; context: edit.context\" />\n } @else if (cell.state === 'loading' && cellPlaceholder(); as placeholder) {\n <!-- A cell that is loading on its own (an inline edit saving) shows a feature's placeholder\n instead of its value; the row around it stays readable. Without one the value stays put\n and `data-state` carries the cue \u2014 see registerCellPlaceholder. -->\n <ng-container *ngComponentOutlet=\"placeholder.component; injector: placeholder.injector\" />\n } @else {\n @if (cell.state === 'error') {\n @if (cellErrorMark(); as mark) {\n <!-- A feature (etTableCellErrorTooltip) draws the mark instead, so the overlay runtime\n only ships when a table actually wants a tooltip. -->\n <ng-container\n *ngComponentOutlet=\"mark.component; inputs: { message: cell.message }; injector: mark.injector\"\n />\n } @else {\n <!-- Color-scoped here rather than on the cell: the mark is the only part that must read\n as an error, and a provider per errored cell is cheap where one per cell would not\n be. The message rides along as `title`, which costs nothing. -->\n <i\n [etProvideColor]=\"errorColorTheme\"\n [attr.title]=\"cell.message\"\n [attr.aria-label]=\"cell.message\"\n [attr.aria-hidden]=\"cell.message ? null : 'true'\"\n class=\"et-table-cell-error-icon\"\n etIcon=\"et-triangle-exclamation\"\n ></i>\n }\n }\n @if (cell.template; as bodyTemplate) {\n <ng-container *ngTemplateOutlet=\"bodyTemplate; context: cell.context\" />\n } @else {\n <span class=\"et-table-cell-text\">{{ cell.value }}</span>\n }\n }\n\n @if (cell.linkHost) {\n <!-- The row's link: one real anchor, stretched over the row box (see rowBox) rather than\n wrapping any content, so the cells stay exactly as a table without links renders them.\n It carries no text of its own and is named by this cell instead - `aria-labelledby`\n resolves to the cell's content, which is the row's identity. -->\n <!-- eslint-disable-next-line @angular-eslint/template/elements-content -- the rule's\n allowList knows `aria-label` but not `aria-labelledby`, which names it just as well. -->\n <a\n [attr.href]=\"rowVm.href\"\n [attr.aria-labelledby]=\"rowVm.linkLabelId\"\n (click)=\"activateRowLink(rowVm.link, $event)\"\n class=\"et-table-row-link\"\n ></a>\n }\n </div>\n }\n @if (hasFiller()) {\n <div class=\"et-table-cell et-table-filler-cell\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n </div>\n\n <!-- The detail row of an expanded row, from etTableRowExpansion \u2014 the whole row, its chrome and\n its animation belong to the feature, so a table that never expands carries none of them. -->\n @if (rowVm.detail; as detail) {\n <ng-container *ngComponentOutlet=\"detail.component; inputs: { row: rowVm.row }; injector: detail.injector\" />\n }\n } @empty {\n <div class=\"et-table-message-row\" role=\"row\">\n <div class=\"et-table-empty-cell\" role=\"gridcell\">\n @if (emptyTemplate(); as template) {\n <ng-container *ngTemplateOutlet=\"template; context: { $implicit: rows() }\" />\n } @else {\n <ng-content select=\"[etTableEmpty]\">{{ resolvedLabels().empty }}</ng-content>\n }\n </div>\n </div>\n }\n }\n\n @if (spacers(); as spacer) {\n <div [style.block-size.px]=\"spacer.end\" class=\"et-table-spacer\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n\n <!-- Edge gradients marking rows scrolled out of view horizontally. The layer is absolutely positioned\n over the whole grid \u2014 the full scroll extent, not just the viewport \u2014 which is what lets the two\n fades inside it hold their place with `position: sticky` for the entire scroll range. Their inline\n inset clears whatever columns are pinned at that edge, so the fade marks where rows actually\n disappear (a pinned column's inner edge) rather than the viewport's edge. -->\n <div class=\"et-table-scroll-fades\" role=\"presentation\" aria-hidden=\"true\">\n <div\n [style.inset-inline-start.px]=\"fadeInset().start\"\n [class.et-table-scroll-fade--visible]=\"scrollFades().start\"\n class=\"et-table-scroll-fade et-table-scroll-fade--start\"\n ></div>\n <div\n [style.inset-inline-end.px]=\"fadeInset().end\"\n [class.et-table-scroll-fade--visible]=\"scrollFades().end\"\n class=\"et-table-scroll-fade et-table-scroll-fade--end\"\n ></div>\n </div>\n\n @if (hasFooter()) {\n <div class=\"et-table-footer-row\" role=\"row\">\n @for (lead of leadCells(); track lead.key) {\n <div\n [class]=\"lead.cellClass\"\n [class.et-table-sticky-start]=\"lead.sticky\"\n [style.inset-inline-start.px]=\"lead.offset\"\n class=\"et-table-footer-cell\"\n role=\"gridcell\"\n aria-hidden=\"true\"\n ></div>\n }\n @for (cell of footerCells(); track cell.key) {\n <div\n [attr.data-align]=\"cell.align\"\n [class.et-table-sticky-start]=\"cell.stickyStart\"\n [class.et-table-sticky-end]=\"cell.stickyEnd\"\n [style.inset-inline-start.px]=\"cell.offsetStart\"\n [style.inset-inline-end.px]=\"cell.offsetEnd\"\n class=\"et-table-footer-cell\"\n role=\"gridcell\"\n >\n @if (cell.template; as footerTemplate) {\n <ng-container *ngTemplateOutlet=\"footerTemplate; context: { $implicit: rows() }\" />\n }\n </div>\n }\n @if (hasFiller()) {\n <div class=\"et-table-footer-cell et-table-filler-cell\" role=\"presentation\" aria-hidden=\"true\"></div>\n }\n </div>\n }\n</div>\n\n<!-- Full-width footer slot (paginator, page-size, etc.), pinned to the bottom of the scroll viewport.\n Rendered only when the consumer projects `[etTableFooter]`, so the chrome never shows empty. -->\n@if (footerSlot()) {\n <div class=\"et-table-footer\">\n <ng-content select=\"[etTableFooter]\" />\n </div>\n}\n\n<!-- Floating UI from opt-in features (the reorder drag ghost / drop indicator), stamped here so a\n feature can draw without having a view \u2014 or an element \u2014 of its own. -->\n@for (layer of layers(); track $index) {\n <ng-container *ngComponentOutlet=\"layer.component; injector: layer.injector\" />\n}\n", styles: ["@layer components{@property --et-table-cell-padding-block{syntax: \"<length>\"; inherits: true; initial-value: 10px;}@property --et-table-cell-padding-inline{syntax: \"<length>\"; inherits: true; initial-value: 12px;}:where(.et-table-host){display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:1fr auto;overflow:auto;--_et-table-band: color-mix( in srgb, var(--et-surface-interaction-solid, gray) 7%, var(--et-surface-background-solid, Canvas) );--_et-table-header-bg: var(--et-surface-background-solid, Canvas);--_et-table-header-border: var(--et-surface-border-solid, rgb(128 128 128 / .3));--_et-table-row-divider: transparent;--_et-table-stripe-bg: transparent;--_et-table-stripe-solid: var(--et-surface-background-solid, Canvas);--_et-table-row-hover: color-mix(in srgb, var(--et-surface-interaction-solid, gray) 8%, transparent);--_et-table-row-hover-solid: color-mix( in srgb, var(--et-surface-interaction-solid, gray) 8%, var(--et-surface-background-solid, Canvas) )}.et-table-host:where([data-density=sm]){--et-table-cell-padding-block: 6px;--et-table-cell-padding-inline: 10px}.et-table-host:where([data-density=md]){--et-table-cell-padding-block: 10px;--et-table-cell-padding-inline: 12px}.et-table-host:where([data-density=lg]){--et-table-cell-padding-block: 15px;--et-table-cell-padding-inline: 16px}.et-table-host:where([data-appearance=enclosed],[data-appearance=zebra],[data-appearance=grid]){border:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .3));border-radius:10px}.et-table-host:where([data-appearance=enclosed]){--_et-table-header-bg: var(--_et-table-band);--_et-table-row-divider: var(--et-surface-border-solid, rgb(128 128 128 / .15));box-shadow:0 1px 2px #0000000a,0 6px 16px #0000000f}.et-table-host:where([data-appearance=divided]){--_et-table-row-divider: var(--et-surface-border-solid, rgb(128 128 128 / .15))}.et-table-host:where([data-appearance=zebra]){--_et-table-header-bg: var(--_et-table-band);--_et-table-stripe-bg: color-mix(in srgb, var(--et-surface-interaction-solid, gray) 4%, transparent);--_et-table-stripe-solid: color-mix( in srgb, var(--et-surface-interaction-solid, gray) 4%, var(--et-surface-background-solid, Canvas) )}.et-table-host:where([data-appearance=grid]){--_et-table-header-bg: var(--_et-table-band);--_et-table-row-divider: var(--et-surface-border-solid, rgb(128 128 128 / .15))}.et-table-host:where([data-appearance=bare]){--_et-table-header-border: transparent}.et-table-host:where([data-appearance=cards]){--_et-table-header-bg: var(--et-surface-background-solid, Canvas);--_et-table-row-divider: transparent;--_et-table-row-hover-solid: color-mix( in srgb, var(--et-surface-interaction-solid, gray) 8%, var(--_et-table-band) )}.et-table{display:grid;position:relative;align-content:start;inline-size:min-content;min-inline-size:100%;background:var(--et-surface-background-solid, Canvas);color:var(--et-surface-color-solid, CanvasText);font-size:14px;line-height:1.4}.et-table-filler-cell{padding-inline:0}.et-table-header-row,.et-table-row{display:contents}.et-table-header-cell,.et-table-cell{display:flex;align-items:center;min-inline-size:0;overflow:hidden;padding:var(--et-table-cell-padding-block) var(--et-table-cell-padding-inline)}.et-table-cell-text{min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.et-table-header-cell{position:sticky;inset-block-start:max(0px,calc(var(--_et-table-group-h, 0px) - 1px));gap:4px;z-index:1;font-weight:600;color:var(--et-surface-color-muted-solid, CanvasText);background:var(--_et-table-header-bg);border-block-end:1px solid var(--_et-table-header-border)}.et-table-cell{border-block-end:1px solid var(--_et-table-row-divider)}.et-table-row--last:not(:has(+.et-table-detail-row)) .et-table-cell{border-block-end:0}.et-table-row--stripe .et-table-cell{background:var(--_et-table-stripe-bg)}.et-table-host:where([data-appearance=grid]) .et-table-header-cell,.et-table-host:where([data-appearance=grid]) .et-table-cell{border-inline-end:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .15))}.et-table-host:where([data-appearance=grid]) .et-table-header-row .et-table-header-cell:last-child,.et-table-host:where([data-appearance=grid]) .et-table-row .et-table-cell:last-child{border-inline-end:0}.et-table-sticky-start,.et-table-sticky-end{position:sticky;z-index:1}.et-table-sticky-start{box-shadow:4px 0 6px -4px #0000002e}.et-table-sticky-end{box-shadow:-4px 0 6px -4px #0000002e}.et-table-cell:where(.et-table-sticky-start,.et-table-sticky-end){background:var(--et-surface-background-solid, Canvas)}.et-table-row--stripe .et-table-cell.et-table-sticky-start,.et-table-row--stripe .et-table-cell.et-table-sticky-end{background:var(--_et-table-stripe-solid)}@media(hover:hover){.et-table-row:hover .et-table-cell.et-table-sticky-start,.et-table-row:hover .et-table-cell.et-table-sticky-end{background:var(--_et-table-row-hover-solid)}}.et-table-header-cell:where(.et-table-sticky-start,.et-table-sticky-end),.et-table-footer-cell:where(.et-table-sticky-start,.et-table-sticky-end){z-index:3}.et-table-footer-row{display:contents}.et-table-footer-cell{display:flex;align-items:center;min-inline-size:0;overflow:hidden;padding:var(--et-table-cell-padding-block) var(--et-table-cell-padding-inline);position:sticky;inset-block-end:0;z-index:1;font-weight:600;background:var(--_et-table-header-bg);border-block-start:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .3))}.et-table-footer-cell:where([data-align=center]){justify-content:center;text-align:center}.et-table-footer-cell:where([data-align=end]){justify-content:flex-end;text-align:end}.et-table-scroll-fades{position:absolute;inset:0;display:flex;justify-content:space-between;z-index:3;pointer-events:none}.et-table-scroll-fade{position:sticky;flex:none;inline-size:var(--et-table-scroll-fade-size, 28px);opacity:0;transition:opacity .15s ease}.et-table-scroll-fade--visible{opacity:1}.et-table-scroll-fade--start{background:linear-gradient(to right,#00000029,#0000)}.et-table-scroll-fade--end{background:linear-gradient(to left,#00000029,#0000)}@media(prefers-reduced-motion:reduce){.et-table-scroll-fade{transition:none}}.et-table-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;position:sticky;inset-block-end:0;inset-inline-start:0;z-index:4;padding:var(--et-table-cell-padding-block) var(--et-table-cell-padding-inline);background:var(--_et-table-header-bg);border-block-start:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .3))}.et-table-footer-label{margin:0;font-size:14px;color:var(--et-surface-color-muted-solid, CanvasText)}@media(pointer:coarse){.et-table-footer{gap:8px;padding:8px var(--et-table-cell-padding-inline)}}.et-table-header-cell:where([data-align=center]),.et-table-cell:where([data-align=center]){justify-content:center;text-align:center}.et-table-header-cell:where([data-align=end]),.et-table-cell:where([data-align=end]){justify-content:flex-end;text-align:end}.et-table-row--interactive .et-table-cell{cursor:pointer}@media(hover:hover){.et-table-row:hover .et-table-cell{background:var(--_et-table-row-hover)}}.et-table-row--box{grid-column:1 / -1;display:grid;grid-template-columns:subgrid;position:relative;z-index:0}.et-table-cell--link{overflow:visible}.et-table-row-link{position:absolute;inset:0;cursor:pointer}.et-table-row-link:focus-visible{outline:2px solid var(--et-theme-color-primary-solid, currentColor);outline-offset:-2px}.et-table-row--link :where(.et-table-select-cell,.et-table-expander-cell,.et-table-cell--interactive){position:relative;z-index:1}.et-table-host:where([data-appearance=cards]) .et-table-row{margin-block-end:var(--et-table-row-gap, 8px);background:var(--_et-table-band);border:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .3));border-radius:var(--et-table-row-radius, 10px)}.et-table-host:where([data-appearance=cards]) .et-table-header-cell{margin-block-end:var(--et-table-row-gap, 8px)}.et-table-host:where([data-appearance=cards]) .et-table-row:not(.et-table-row--interactive,.et-table-row--link){--_et-table-row-hover: transparent;--_et-table-row-hover-solid: var(--_et-table-band)}.et-table-host:where([data-appearance=cards]) .et-table-row>:first-child{border-start-start-radius:inherit;border-end-start-radius:inherit}.et-table-host:where([data-appearance=cards]) .et-table-row>:last-child{border-start-end-radius:inherit;border-end-end-radius:inherit}.et-table-host:where([data-appearance=cards]) .et-table-cell:where(.et-table-sticky-start,.et-table-sticky-end){background:var(--_et-table-band)}.et-table-host:where([data-appearance=cards]) .et-table-row-link{border-radius:var(--et-table-row-radius, 10px)}.et-table-header-label{display:flex;align-items:center;gap:4px;flex:1;min-inline-size:0;margin:0;padding:0;font:inherit;color:inherit;text-align:inherit;background:none;border:none}.et-table-header-label:where(.et-table-header-label--sortable){cursor:pointer}.et-table-header-cell:where([data-align=center]) .et-table-header-label{justify-content:center}.et-table-header-cell:where([data-align=end]) .et-table-header-label{justify-content:flex-end}.et-table-sort-indicator{flex:none;inline-size:1.15em;block-size:1.15em;transform:translateY(-.045em);color:var(--et-theme-color-primary-solid, currentColor);transition:transform .2s var(--ease-out-5, ease)}.et-table-sort-indicator:where([data-direction=desc]){transform:translateY(-.045em) rotate(180deg)}.et-table-sort-indicator.et-table-sort-indicator--enter{animation:et-table-sort-in .15s ease}.et-table-sort-indicator.et-table-sort-indicator--leave{animation:et-table-sort-in .12s ease reverse forwards}@keyframes et-table-sort-in{0%{opacity:0}to{opacity:1}}@media(prefers-reduced-motion:reduce){.et-table-sort-indicator{transition:none}.et-table-sort-indicator.et-table-sort-indicator--enter,.et-table-sort-indicator.et-table-sort-indicator--leave{animation:none}}.et-table-message-row{display:contents}.et-table-empty-cell,.et-table-error-cell{grid-column:1 / -1;padding:32px var(--et-table-cell-padding-inline);color:var(--et-surface-color-muted-solid, CanvasText);text-align:center}.et-table-error-cell{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px}.et-table-error-icon{flex:none;inline-size:16px;block-size:16px;color:var(--et-theme-color-ink-solid, currentColor)}.et-table-cell:where([data-state=error]){gap:6px}.et-table-cell-error-icon{flex:none;inline-size:14px;block-size:14px;color:var(--et-theme-color-ink-solid, currentColor)}.et-table-cell:where([data-state=loading]){display:flex}.et-table-busy-bar{grid-column:1 / -1;block-size:2px;overflow:hidden;background:color-mix(in srgb,var(--et-surface-interaction-solid, gray) 10%,transparent)}.et-table-busy-bar:after{content:\"\";display:block;inline-size:40%;block-size:100%;border-radius:999px;background:var(--et-theme-color-primary-solid, currentColor);animation:et-table-busy-sweep 1.1s ease-in-out infinite}@keyframes et-table-busy-sweep{0%{transform:translate(-100%)}to{transform:translate(250%)}}@media(prefers-reduced-motion:reduce){.et-table-busy-bar:after{inline-size:100%;animation:none}}}\n"] }]
|
|
61546
|
+
}], ctorParameters: () => [], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], rowsSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowsSource", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], rowKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowKey", required: false }] }], labels: [{ type: i0.Input, args: [{ isSignal: true, alias: "labels", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], emptyTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyTemplate", required: false }] }], errorTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorTemplate", required: false }] }], cellState: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellState", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], density: [{ type: i0.Input, args: [{ isSignal: true, alias: "density", required: false }] }], sort: [{ type: i0.Input, args: [{ isSignal: true, alias: "sort", required: false }] }, { type: i0.Output, args: ["sortChange"] }], multiSort: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiSort", required: false }] }], sortMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortMode", required: false }] }], filters: [{ type: i0.Input, args: [{ isSignal: true, alias: "filters", required: false }] }, { type: i0.Output, args: ["filtersChange"] }], filterMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterMode", required: false }] }], expandedRowTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandedRowTemplate", required: false }] }], rowInteractive: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowInteractive", required: false }] }], rowLink: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowLink", required: false }] }], rowClick: [{ type: i0.Output, args: ["rowClick"] }], footerSlot: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TableFooterDirective), { isSignal: true }] }], headerCells: [{ type: i0.ViewChildren, args: ['headerCell', { isSignal: true }] }], bodyCells: [{ type: i0.ViewChildren, args: ['bodyCell', { isSignal: true }] }], leadHeaderCells: [{ type: i0.ViewChildren, args: ['leadHeaderCell', { isSignal: true }] }] } });
|
|
61431
61547
|
|
|
61432
61548
|
/**
|
|
61433
61549
|
* Opt-in persistence for a table's setup - column order, visibility, widths, sort, filters, expanded
|
|
@@ -62090,11 +62206,11 @@ const injectHostTable$1 = () => {
|
|
|
62090
62206
|
*/
|
|
62091
62207
|
class TableDetailStylesComponent {
|
|
62092
62208
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: TableDetailStylesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
62093
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.7", type: TableDetailStylesComponent, isStandalone: true, selector: "et-table-detail-styles", ngImport: i0, template: '', isInline: true, styles: ["@layer components{.et-table-detail-row{grid-column:1 / -1;display:grid;grid-template-rows:1fr;border-block-end:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .15))}.et-table-detail-row.et-table-detail--enter{animation:et-table-detail-in .18s ease}.et-table-detail-row.et-table-detail--leave{animation:et-table-detail-out .18s ease forwards}@keyframes et-table-detail-in{0%{grid-template-rows:0fr;opacity:0}to{grid-template-rows:1fr;opacity:1}}@keyframes et-table-detail-out{0%{grid-template-rows:1fr;opacity:1}to{grid-template-rows:0fr;opacity:0}}.et-table-detail-cell{min-block-size:0;overflow:hidden}.et-table-detail-body{padding:var(--et-table-cell-padding-block) var(--et-table-cell-padding-inline)}@media(prefers-reduced-motion:reduce){.et-table-detail-row.et-table-detail--enter,.et-table-detail-row.et-table-detail--leave{animation:none}}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
|
|
62209
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.7", type: TableDetailStylesComponent, isStandalone: true, selector: "et-table-detail-styles", ngImport: i0, template: '', isInline: true, styles: ["@layer components{.et-table-detail-row{grid-column:1 / -1;display:grid;grid-template-rows:1fr;border-block-end:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .15))}.et-table-host:where([data-appearance=cards]) .et-table-detail-row{border-block-end:0}.et-table-row--last+.et-table-detail-row{border-block-end:0}.et-table-detail-row.et-table-detail--enter{animation:et-table-detail-in .18s ease}.et-table-detail-row.et-table-detail--leave{animation:et-table-detail-out .18s ease forwards}@keyframes et-table-detail-in{0%{grid-template-rows:0fr;opacity:0}to{grid-template-rows:1fr;opacity:1}}@keyframes et-table-detail-out{0%{grid-template-rows:1fr;opacity:1}to{grid-template-rows:0fr;opacity:0}}.et-table-detail-cell{min-block-size:0;overflow:hidden}.et-table-detail-body{padding:var(--et-table-cell-padding-block) var(--et-table-cell-padding-inline)}@media(prefers-reduced-motion:reduce){.et-table-detail-row.et-table-detail--enter,.et-table-detail-row.et-table-detail--leave{animation:none}}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
|
|
62094
62210
|
}
|
|
62095
62211
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: TableDetailStylesComponent, decorators: [{
|
|
62096
62212
|
type: Component,
|
|
62097
|
-
args: [{ selector: 'et-table-detail-styles', template: '', encapsulation: ViewEncapsulation.None, styles: ["@layer components{.et-table-detail-row{grid-column:1 / -1;display:grid;grid-template-rows:1fr;border-block-end:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .15))}.et-table-detail-row.et-table-detail--enter{animation:et-table-detail-in .18s ease}.et-table-detail-row.et-table-detail--leave{animation:et-table-detail-out .18s ease forwards}@keyframes et-table-detail-in{0%{grid-template-rows:0fr;opacity:0}to{grid-template-rows:1fr;opacity:1}}@keyframes et-table-detail-out{0%{grid-template-rows:1fr;opacity:1}to{grid-template-rows:0fr;opacity:0}}.et-table-detail-cell{min-block-size:0;overflow:hidden}.et-table-detail-body{padding:var(--et-table-cell-padding-block) var(--et-table-cell-padding-inline)}@media(prefers-reduced-motion:reduce){.et-table-detail-row.et-table-detail--enter,.et-table-detail-row.et-table-detail--leave{animation:none}}}\n"] }]
|
|
62213
|
+
args: [{ selector: 'et-table-detail-styles', template: '', encapsulation: ViewEncapsulation.None, styles: ["@layer components{.et-table-detail-row{grid-column:1 / -1;display:grid;grid-template-rows:1fr;border-block-end:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .15))}.et-table-host:where([data-appearance=cards]) .et-table-detail-row{border-block-end:0}.et-table-row--last+.et-table-detail-row{border-block-end:0}.et-table-detail-row.et-table-detail--enter{animation:et-table-detail-in .18s ease}.et-table-detail-row.et-table-detail--leave{animation:et-table-detail-out .18s ease forwards}@keyframes et-table-detail-in{0%{grid-template-rows:0fr;opacity:0}to{grid-template-rows:1fr;opacity:1}}@keyframes et-table-detail-out{0%{grid-template-rows:1fr;opacity:1}to{grid-template-rows:0fr;opacity:0}}.et-table-detail-cell{min-block-size:0;overflow:hidden}.et-table-detail-body{padding:var(--et-table-cell-padding-block) var(--et-table-cell-padding-inline)}@media(prefers-reduced-motion:reduce){.et-table-detail-row.et-table-detail--enter,.et-table-detail-row.et-table-detail--leave{animation:none}}}\n"] }]
|
|
62098
62214
|
}] });
|
|
62099
62215
|
|
|
62100
62216
|
const clamp = (value, max) => Math.min(Math.max(value, 0), max);
|
|
@@ -63515,6 +63631,69 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
63515
63631
|
`, encapsulation: ViewEncapsulation.None, styles: ["@layer components{.et-table-host--reorderable .et-table-header-cell:not(.et-table-sticky-start,.et-table-sticky-end,.et-table-select-cell,.et-table-expander-cell){cursor:grab;-webkit-user-select:none;user-select:none}.et-table-header-cell:where(.et-table-header-cell--dragging){cursor:grabbing;opacity:.4}.et-table-drag-ghost{position:fixed;z-index:10;transform:translate(12px,8px);max-inline-size:256px;padding:var(--et-table-cell-padding-block) var(--et-table-cell-padding-inline);overflow:hidden;font-size:14px;font-weight:600;white-space:nowrap;text-overflow:ellipsis;color:var(--et-surface-color-solid, CanvasText);background:var(--et-surface-background-solid, Canvas);border:1px solid var(--et-surface-border-solid, rgb(128 128 128 / .3));border-radius:6px;box-shadow:0 8px 24px #0000002e;pointer-events:none}}\n"] }]
|
|
63516
63632
|
}] });
|
|
63517
63633
|
|
|
63634
|
+
/**
|
|
63635
|
+
* Whether the browser, not the router, should handle a click: a middle or right button, or any modifier
|
|
63636
|
+
* the user presses to open a link somewhere else. Exactly what `RouterLink` leaves alone, and the reason
|
|
63637
|
+
* the table renders a real `href` at all.
|
|
63638
|
+
*/
|
|
63639
|
+
const opensElsewhere = (event) => event.button !== 0 || event.ctrlKey || event.metaKey || event.shiftKey || event.altKey;
|
|
63640
|
+
/**
|
|
63641
|
+
* Opt-in Angular routing for an `et-table`'s [row links](/components/table#row-links): with it, a
|
|
63642
|
+
* `[rowLink]` may answer with router commands (`['/orders', order.id]`) instead of an `href` string, and
|
|
63643
|
+
* a plain click navigates through the router rather than loading the page again.
|
|
63644
|
+
*
|
|
63645
|
+
* The commands are resolved relative to the route the table sits on, the way `routerLink` resolves its
|
|
63646
|
+
* own. Modified clicks - middle button, Ctrl/Cmd/Shift - are left to the browser, which is what keeps
|
|
63647
|
+
* "open in a new tab" working on the same rows.
|
|
63648
|
+
*
|
|
63649
|
+
* It is a feature rather than part of the table because the base table depends on no router: a table that
|
|
63650
|
+
* links with plain `href` strings - or not at all - never pulls `@angular/router` into its bundle.
|
|
63651
|
+
*
|
|
63652
|
+
* @example
|
|
63653
|
+
* <et-table [data]="orders()" [columns]="COLUMNS" [rowLink]="orderLink" etTableRowRouterLink />
|
|
63654
|
+
*
|
|
63655
|
+
* protected orderLink = (order: Order) => ['/orders', order.id];
|
|
63656
|
+
*/
|
|
63657
|
+
class TableRowRouterLinkDirective {
|
|
63658
|
+
constructor() {
|
|
63659
|
+
this.table = injectTableFeatureHost('etTableRowRouterLink');
|
|
63660
|
+
this.router = inject(Router);
|
|
63661
|
+
// eslint-disable-next-line ethlete/no-angular-router-api
|
|
63662
|
+
this.route = inject(ActivatedRoute, { optional: true });
|
|
63663
|
+
/** See {@link TableRowRouterLinkConfig}. */
|
|
63664
|
+
this.config = input({}, { ...(ngDevMode ? { debugName: "config" } : /* istanbul ignore next */ {}), alias: 'etTableRowRouterLink',
|
|
63665
|
+
transform: (tableFeatureConfig) });
|
|
63666
|
+
this.table.registerRowNavigation({
|
|
63667
|
+
href: (commands) => this.href(commands),
|
|
63668
|
+
navigate: (commands, event) => this.navigate(commands, event),
|
|
63669
|
+
enabled: computed(() => this.config().enabled ?? true),
|
|
63670
|
+
});
|
|
63671
|
+
}
|
|
63672
|
+
/** The URL these commands resolve to - what the row's anchor carries as its `href`. */
|
|
63673
|
+
href(commands) {
|
|
63674
|
+
return this.router.serializeUrl(this.urlTree(commands));
|
|
63675
|
+
}
|
|
63676
|
+
/** Navigate to these commands, unless the click asked for the browser's own behaviour. */
|
|
63677
|
+
navigate(commands, event) {
|
|
63678
|
+
if (opensElsewhere(event))
|
|
63679
|
+
return false;
|
|
63680
|
+
this.router.navigateByUrl(this.urlTree(commands));
|
|
63681
|
+
return true;
|
|
63682
|
+
}
|
|
63683
|
+
urlTree(commands) {
|
|
63684
|
+
return this.router.createUrlTree([...commands], { relativeTo: this.route });
|
|
63685
|
+
}
|
|
63686
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: TableRowRouterLinkDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
63687
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: TableRowRouterLinkDirective, isStandalone: true, selector: "[etTableRowRouterLink]", inputs: { config: { classPropertyName: "config", publicName: "etTableRowRouterLink", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["etTableRowRouterLink"], ngImport: i0 }); }
|
|
63688
|
+
}
|
|
63689
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: TableRowRouterLinkDirective, decorators: [{
|
|
63690
|
+
type: Directive,
|
|
63691
|
+
args: [{
|
|
63692
|
+
selector: '[etTableRowRouterLink]',
|
|
63693
|
+
exportAs: 'etTableRowRouterLink',
|
|
63694
|
+
}]
|
|
63695
|
+
}], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "etTableRowRouterLink", required: false }] }] } });
|
|
63696
|
+
|
|
63518
63697
|
/**
|
|
63519
63698
|
* Opt-in column resizing for `et-table`: adds a grip to every header cell's trailing edge that drags
|
|
63520
63699
|
* the column's width, with a double-click to reset it.
|
|
@@ -64297,6 +64476,12 @@ const TABLE_SKELETON_IMPORTS = [TableSkeletonDirective, TableCellSkeletonDirecti
|
|
|
64297
64476
|
* why it is separate - a table that never expands a row pays for none of it.
|
|
64298
64477
|
*/
|
|
64299
64478
|
const TABLE_ROW_EXPANSION_IMPORTS = [TableRowExpansionDirective];
|
|
64479
|
+
/**
|
|
64480
|
+
* Angular routing for row links (`etTableRowRouterLink`): a `[rowLink]` may then answer with router
|
|
64481
|
+
* commands instead of an `href`, and a plain click navigates through the router. Separate because the
|
|
64482
|
+
* base table depends on no router - a table linking with plain `href` strings pays for none of it.
|
|
64483
|
+
*/
|
|
64484
|
+
const TABLE_ROW_ROUTER_LINK_IMPORTS = [TableRowRouterLinkDirective];
|
|
64300
64485
|
/**
|
|
64301
64486
|
* Tooltips on failed cells (`etTableCellErrorTooltip`): a `cellState` message is shown on hover/focus
|
|
64302
64487
|
* rather than as a native `title`. Pulls in the tooltip, and with it the overlay runtime.
|
|
@@ -66329,11 +66514,11 @@ const TREE_IMPORTS = [TreeComponent, TreeDirective, TreeNodeDirective, TreeNodeD
|
|
|
66329
66514
|
|
|
66330
66515
|
// Generated from package.json by tools/scripts/generate-version.js - do not edit.
|
|
66331
66516
|
/** The version of `@ethlete/components` this build was cut from. */
|
|
66332
|
-
const COMPONENTS_VERSION = '1.0.0-next.
|
|
66517
|
+
const COMPONENTS_VERSION = '1.0.0-next.54';
|
|
66333
66518
|
|
|
66334
66519
|
/**
|
|
66335
66520
|
* Generated bundle index. Do not edit.
|
|
66336
66521
|
*/
|
|
66337
66522
|
|
|
66338
|
-
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_ICON_ALIGNMENTS, BADGE_IMPORTS, BADGE_SIZES, 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, ButtonColorDirective, 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, COMPONENTS_VERSION, 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, ControlSuffixDirective, 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, DATE_TIME_RANGE_INPUT_ERROR_CODES, DATE_TIME_RANGE_INPUT_IMPORTS, 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, DESCRIPTION_LIST_VARIANTS, 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, DateTimeRangeInputComponent, DateTimeRangeInputDirective, DateTimeRangeInputFieldDirective, 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, FIELD_WARNINGS, FIELD_WARNING_KIND, 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, FORM_IMPORTS, FORM_WARNING_MESSAGE_RESOLVER, FabComponent, FacebookPlayerComponent, FacebookPlayerDirective, FacebookPlayerParamsDirective, FacebookPlayerSlotComponent, FilterOverlayResetDirective, FilterOverlaySubmitDirective, FloatingActionAnchorDirective, FloatingActionDirective, FloatingActionScopeDirective, FloatingActionTopDirective, FloatingActionTriggerDirective, FocusRingDirective, FormDirective, FormErrorComponent, FormFieldBarrierDirective, FormFieldComponent, FormFieldDirective, FormWarningComponent, 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, INHERIT_COLOR, 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, KBD_IMPORTS, KBD_PLATFORM, KICK_PLAYER_TOKEN, KbdComponent, 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, NavTabLinkStylesComponent, 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, OverlayNavTabLinkComponent, 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_STEPS_ORIENTATIONS, 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_ERROR_ERROR_CODES, QUERY_ERROR_IMPORTS, QUERY_ERROR_LABELS, QUERY_ERROR_TOKEN, QUOTE_ICON, 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_ADD_SURFACE_OVERLAY, 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_CARD_CONTROL_POSITIONS, 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, SchedulerAppointmentDragDirective, 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, SchedulerSwipeNavigationDirective, 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, TIMELINE_IMPORTS, TIMES_ICON, TIME_FORMAT, TIME_INPUT_ERROR_CODES, TIME_INPUT_IMPORTS, TIME_PICKER_ERROR_CODES, TIME_PICKER_IMPORTS, TIME_PICKER_LABELS, TIME_RANGE_INPUT_ERROR_CODES, TIME_RANGE_INPUT_IMPORTS, 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, TimeRangeInputComponent, TimeRangeInputDirective, TimeRangeInputFieldDirective, TimelineComponent, TimelineItemComponent, 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, WCAG_CONTRAST_RATIOS, 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, clearLeavingSupportStateOnExit, colorContrast, 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, detectKbdPlatform, dialogOverlayStrategy, disposeDropzoneEntry, doubleEliminationBracketLayout, dropzoneFiles, enableDragToDismiss, extractFirstImageUrl, filterOverlayLabelsForLocale, filterOverlayPreviewFromQuery, filterRows, findCollision, findNextRelevantHtmlElement, findScrollableAncestor, focusFirstInvalidField, formatDuration, formatFileSize, fromGridPosition, fullScreenDialogOverlayStrategy, generateBracketDataForEthlete, generateRoundTypeFromEthleteRoundType, generateTournamentModeFormEthleteRounds, getClosestOverlay, getColorContrastRatio, getOriginCoordinatesAndDimensions, hexColor, 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, kbdKeyLabel, kbdKeyName, leftSheetOverlayStrategy, legacyQueryErrorSource, mapGridLayout, mapLayoutToBreakpoint, matchCountryByDialCode, matchParticipantDisplayName, mergeOverlayBreakpointConfigs, mergeOverlayConfigs, mirroredDoubleEliminationBracketLayout, mirroredSingleEliminationBracketLayout, mountNavTabLinkStyles, mountRichTextEditorImageStyles, mountRichTextEditorTableStyles, nodesEqual$1 as nodesEqual, normalizeEthleteBracketMatch, normalizeEthleteGroupRanking, normalizeEthleteMatch, normalizeEthleteMatchStatus, normalizeEthleteMedia, normalizeEthleteParticipant, normalizeEthletePlacement, normalizePictureSizes, normalizePictureSource, numberInputStepMultiplierFrom, paginate, parseDuration, parseKbdKeys, 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, provideFormWarningMessageResolver, 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, rgbColor, 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, warn, wireFormSupport, withPictureBaseUrl };
|
|
66523
|
+
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_ICON_ALIGNMENTS, BADGE_IMPORTS, BADGE_SIZES, 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, ButtonColorDirective, 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, COMPONENTS_VERSION, 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, ControlSuffixDirective, 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, DATE_TIME_RANGE_INPUT_ERROR_CODES, DATE_TIME_RANGE_INPUT_IMPORTS, 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, DESCRIPTION_LIST_VARIANTS, 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, DateTimeRangeInputComponent, DateTimeRangeInputDirective, DateTimeRangeInputFieldDirective, 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, FIELD_WARNINGS, FIELD_WARNING_KIND, 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, FORM_IMPORTS, FORM_WARNING_MESSAGE_RESOLVER, FabComponent, FacebookPlayerComponent, FacebookPlayerDirective, FacebookPlayerParamsDirective, FacebookPlayerSlotComponent, FilterOverlayResetDirective, FilterOverlaySubmitDirective, FloatingActionAnchorDirective, FloatingActionDirective, FloatingActionScopeDirective, FloatingActionTopDirective, FloatingActionTriggerDirective, FocusRingDirective, FormDirective, FormErrorComponent, FormFieldBarrierDirective, FormFieldComponent, FormFieldDirective, FormWarningComponent, 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, INHERIT_COLOR, 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, KBD_IMPORTS, KBD_PLATFORM, KICK_PLAYER_TOKEN, KbdComponent, 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_STACK_OVERLAY_LAYER, NOTIFICATION_STATUS, NUMBER_INPUT_IMPORTS, NavTabLinkComponent, NavTabLinkDirective, NavTabLinkStylesComponent, 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, OverlayNavTabLinkComponent, 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_STEPS_ORIENTATIONS, 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_ERROR_ERROR_CODES, QUERY_ERROR_IMPORTS, QUERY_ERROR_LABELS, QUERY_ERROR_TOKEN, QUOTE_ICON, 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_ADD_SURFACE_OVERLAY, 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_CARD_CONTROL_POSITIONS, 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, SchedulerAppointmentDragDirective, 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, SchedulerSwipeNavigationDirective, 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_ROW_ROUTER_LINK_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, TIMELINE_IMPORTS, TIMES_ICON, TIME_FORMAT, TIME_INPUT_ERROR_CODES, TIME_INPUT_IMPORTS, TIME_PICKER_ERROR_CODES, TIME_PICKER_IMPORTS, TIME_PICKER_LABELS, TIME_RANGE_INPUT_ERROR_CODES, TIME_RANGE_INPUT_IMPORTS, 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, TableRowRouterLinkDirective, 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, TimeRangeInputComponent, TimeRangeInputDirective, TimeRangeInputFieldDirective, TimelineComponent, TimelineItemComponent, 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, WCAG_CONTRAST_RATIOS, 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, clearLeavingSupportStateOnExit, colorContrast, 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, detectKbdPlatform, dialogOverlayStrategy, disposeDropzoneEntry, doubleEliminationBracketLayout, dropzoneFiles, enableDragToDismiss, extractFirstImageUrl, filterOverlayLabelsForLocale, filterOverlayPreviewFromQuery, filterRows, findCollision, findNextRelevantHtmlElement, findScrollableAncestor, focusFirstInvalidField, formatDuration, formatFileSize, fromGridPosition, fullScreenDialogOverlayStrategy, generateBracketDataForEthlete, generateRoundTypeFromEthleteRoundType, generateTournamentModeFormEthleteRounds, getClosestOverlay, getColorContrastRatio, getOriginCoordinatesAndDimensions, hexColor, 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, kbdKeyLabel, kbdKeyName, leftSheetOverlayStrategy, legacyQueryErrorSource, mapGridLayout, mapLayoutToBreakpoint, matchCountryByDialCode, matchParticipantDisplayName, mergeOverlayBreakpointConfigs, mergeOverlayConfigs, mirroredDoubleEliminationBracketLayout, mirroredSingleEliminationBracketLayout, mountNavTabLinkStyles, mountRichTextEditorImageStyles, mountRichTextEditorTableStyles, nodesEqual$1 as nodesEqual, normalizeEthleteBracketMatch, normalizeEthleteGroupRanking, normalizeEthleteMatch, normalizeEthleteMatchStatus, normalizeEthleteMedia, normalizeEthleteParticipant, normalizeEthletePlacement, normalizePictureSizes, normalizePictureSource, numberInputStepMultiplierFrom, paginate, parseDuration, parseKbdKeys, 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, provideFormWarningMessageResolver, 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, rgbColor, 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, warn, wireFormSupport, withPictureBaseUrl };
|
|
66339
66524
|
//# sourceMappingURL=ethlete-components.mjs.map
|