@eagami/ui 5.54.0 → 5.55.0

package/fesm2022/eagami-ui.mjs

@@ -1,5 +1,5 @@
 import * as i0 from "@angular/core";
-import { CSP_NONCE, ChangeDetectionStrategy, Component, DestroyRef, Directive, ElementRef, HostAttributeToken, HostBinding, HostListener, Injectable, InjectionToken, Injector, PLATFORM_ID, Renderer2, RendererStyleFlags2, TemplateRef, ViewContainerRef, ViewEncapsulation, afterNextRender, afterRenderEffect, computed, contentChild, effect, forwardRef, inject, input, linkedSignal, makeEnvironmentProviders, model, output, provideEnvironmentInitializer, signal, untracked, viewChild, viewChildren } from "@angular/core";
+import { ApplicationRef, CSP_NONCE, ChangeDetectionStrategy, Component, DOCUMENT, DestroyRef, Directive, ElementRef, EnvironmentInjector, HostAttributeToken, HostBinding, HostListener, Injectable, InjectionToken, Injector, PLATFORM_ID, Renderer2, RendererStyleFlags2, TemplateRef, ViewContainerRef, ViewEncapsulation, afterNextRender, afterRenderEffect, computed, contentChild, createComponent, effect, forwardRef, inject, input, linkedSignal, makeEnvironmentProviders, model, output, provideEnvironmentInitializer, signal, untracked, viewChild, viewChildren } from "@angular/core";
 import { NgClass, NgComponentOutlet, NgTemplateOutlet, isPlatformBrowser } from "@angular/common";
 import { NG_VALUE_ACCESSOR, NgControl, TouchedChangeEvent } from "@angular/forms";
 const EAGAMI_I18N_CONFIG = new InjectionToken("EAGAMI_I18N_CONFIG");
@@ -4769,6 +4769,9 @@ i0.ɵɵngDeclareClassMetadata({
 	}],
 	ctorParameters: () => []
 });
+function isInside(placement) {
+	return placement.startsWith("inside-");
+}
 function isCardinal(placement) {
 	return placement === "top" || placement === "bottom" || placement === "left" || placement === "right";
 }
@@ -4804,14 +4807,52 @@ function placeRaw(anchor, popover, placement, offset, rtl) {
 		left
 	};
 }
+function placeInside(anchor, popover, placement, inset, rtl) {
+	const edges = placement.slice(7);
+	let top = anchor.top + (anchor.height - popover.height) / 2;
+	if (edges.startsWith("top")) top = anchor.top + inset;
+	else if (edges.startsWith("bottom")) top = anchor.bottom - popover.height - inset;
+	let left = anchor.left + (anchor.width - popover.width) / 2;
+	if (edges.endsWith("start") || edges.endsWith("end")) left = edges.endsWith("start") !== rtl ? anchor.left + inset : anchor.right - popover.width - inset;
+	return {
+		top,
+		left
+	};
+}
+function clampAxis(value, size, extent, margin) {
+	return Math.max(margin, Math.min(value, Math.max(margin, extent - size - margin)));
+}
 function computePopoverPosition(anchorRect, popoverRect, viewport, options) {
 	const offset = options.offset ?? 4;
 	const margin = options.margin ?? 8;
 	const flip = options.flip ?? true;
 	const clamp = options.clamp ?? true;
 	const rtl = options.rtl ?? false;
-	let placement = options.placement;
-	let pos = placeRaw(anchorRect, popoverRect, placement, offset, rtl);
+	const point = options.point;
+	const anchor = point ? {
+		top: point.y,
+		bottom: point.y,
+		left: point.x,
+		right: point.x,
+		width: 0,
+		height: 0
+	} : anchorRect;
+	const sizing = {
+		anchorWidth: anchorRect.width,
+		...options.matchAnchorWidth ? { width: anchorRect.width } : {}
+	};
+	const requested = options.placement;
+	if (isInside(requested)) {
+		const inside = placeInside(anchor, popoverRect, requested, offset, rtl);
+		return {
+			top: clamp ? clampAxis(inside.top, popoverRect.height, viewport.height, margin) : inside.top,
+			left: clamp ? clampAxis(inside.left, popoverRect.width, viewport.width, margin) : inside.left,
+			placement: requested,
+			...sizing
+		};
+	}
+	let placement = requested;
+	let pos = placeRaw(anchor, popoverRect, placement, offset, rtl);
 	if (flip) {
 		const overflowsTop = pos.top < margin;
 		const overflowsBottom = pos.top + popoverRect.height > viewport.height - margin;
@@ -4820,7 +4861,7 @@ function computePopoverPosition(anchorRect, popoverRect, viewport, options) {
 		const s = side(placement);
 		if (s === "top" && overflowsTop || s === "bottom" && overflowsBottom || s === "left" && overflowsLeft || s === "right" && overflowsRight) {
 			const flipped = flipPlacement(placement);
-			const flippedPos = placeRaw(anchorRect, popoverRect, flipped, offset, rtl);
+			const flippedPos = placeRaw(anchor, popoverRect, flipped, offset, rtl);
 			if (s === "top" && flippedPos.top + popoverRect.height <= viewport.height - margin || s === "bottom" && flippedPos.top >= margin || s === "left" && flippedPos.left + popoverRect.width <= viewport.width - margin || s === "right" && flippedPos.left >= margin) {
 				placement = flipped;
 				pos = flippedPos;
@@ -4829,26 +4870,20 @@ function computePopoverPosition(anchorRect, popoverRect, viewport, options) {
 	}
 	if (clamp) {
 		const s = side(placement);
-		if (s === "top" || s === "bottom") {
-			const maxLeft = viewport.width - popoverRect.width - margin;
-			pos = {
-				top: pos.top,
-				left: Math.max(margin, Math.min(pos.left, Math.max(margin, maxLeft)))
-			};
-		} else {
-			const maxTop = viewport.height - popoverRect.height - margin;
-			pos = {
-				top: Math.max(margin, Math.min(pos.top, Math.max(margin, maxTop))),
-				left: pos.left
-			};
-		}
+		if (s === "top" || s === "bottom") pos = {
+			top: pos.top,
+			left: clampAxis(pos.left, popoverRect.width, viewport.width, margin)
+		};
+		else pos = {
+			top: clampAxis(pos.top, popoverRect.height, viewport.height, margin),
+			left: pos.left
+		};
 	}
 	return {
 		top: pos.top,
 		left: pos.left,
 		placement,
-		anchorWidth: anchorRect.width,
-		...options.matchAnchorWidth ? { width: anchorRect.width } : {}
+		...sizing
 	};
 }
 const HELP_GAP = 4;
@@ -5341,6 +5376,7 @@ var PopoverComponent = class PopoverComponent {
 	anchor = input.required(...ngDevMode ? [{ debugName: "anchor" }] : 	/* istanbul ignore next */ []);
 	open = input(false, ...ngDevMode ? [{ debugName: "open" }] : 	/* istanbul ignore next */ []);
 	placement = input("bottom-start", ...ngDevMode ? [{ debugName: "placement" }] : 	/* istanbul ignore next */ []);
+	anchorPoint = input(null, ...ngDevMode ? [{ debugName: "anchorPoint" }] : 	/* istanbul ignore next */ []);
 	role = input("dialog", ...ngDevMode ? [{ debugName: "role" }] : 	/* istanbul ignore next */ []);
 	ariaLabel = input(void 0, {
 		...ngDevMode ? { debugName: "ariaLabel" } : 		/* istanbul ignore next */ {},
@@ -5360,9 +5396,13 @@ var PopoverComponent = class PopoverComponent {
 	closeOnOutsideClick = input(true, ...ngDevMode ? [{ debugName: "closeOnOutsideClick" }] : 	/* istanbul ignore next */ []);
 	closeOnEscape = input(true, ...ngDevMode ? [{ debugName: "closeOnEscape" }] : 	/* istanbul ignore next */ []);
 	scrollBehavior = input("reposition", ...ngDevMode ? [{ debugName: "scrollBehavior" }] : 	/* istanbul ignore next */ []);
+	contextMenu = input(false, ...ngDevMode ? [{ debugName: "contextMenu" }] : 	/* istanbul ignore next */ []);
 	closeRequested = output();
+	openRequested = output();
 	position = signal(null, ...ngDevMode ? [{ debugName: "position" }] : 	/* istanbul ignore next */ []);
 	latched = null;
+	pointOffset = null;
+	focusReturn = null;
 	effectivePlacement = computed(() => this.position()?.placement ?? this.placement(), ...ngDevMode ? [{ debugName: "effectivePlacement" }] : 	/* istanbul ignore next */ []);
 	stable = signal(false, ...ngDevMode ? [{ debugName: "stable" }] : 	/* istanbul ignore next */ []);
 	isPositioned = computed(() => this.open() && this.position() !== null && this.stable(), ...ngDevMode ? [{ debugName: "isPositioned" }] : 	/* istanbul ignore next */ []);
@@ -5401,10 +5441,12 @@ var PopoverComponent = class PopoverComponent {
 				this.position.set(null);
 				this.stable.set(false);
 				this.latched = null;
+				this.pointOffset = null;
 				return;
 			}
 			enterTopLayer(surface, anchor);
 			this.placement();
+			this.anchorPoint();
 			this.offset();
 			this.flip();
 			this.clamp();
@@ -5448,11 +5490,32 @@ var PopoverComponent = class PopoverComponent {
 				window.removeEventListener("resize", onViewportChange);
 			});
 		}
+		if (typeof document !== "undefined") {
+			effect(() => {
+				const isOpen = this.open();
+				const asContextMenu = this.contextMenu();
+				untracked(() => this.trackFocusReturn(isOpen && asContextMenu));
+			});
+			afterRenderEffect(() => {
+				if (this.contextMenu() && this.isPositioned()) untracked(() => this.focusFirstElement());
+			});
+			const onContextMenu = (event) => {
+				if (!this.open() || !this.contextMenu() || !this.closeOnOutsideClick()) return;
+				const target = event.target instanceof Node ? event.target : null;
+				if (target && this.surfaceEl()?.nativeElement.contains(target)) return;
+				this.closeRequested.emit();
+			};
+			document.addEventListener("contextmenu", onContextMenu, true);
+			this.destroyRef.onDestroy(() => document.removeEventListener("contextmenu", onContextMenu, true));
+		}
 		this.destroyRef.onDestroy(() => {
 			const surface = this.surfaceEl()?.nativeElement;
 			surface?.parentNode?.removeChild(surface);
 		});
 	}
+	requestOpen(point) {
+		this.openRequested.emit({ point });
+	}
 	resolveAnchor() {
 		const a = this.anchor();
 		if (!a) return null;
@@ -5476,6 +5539,16 @@ var PopoverComponent = class PopoverComponent {
 		}
 		const anchorRect = anchor.getBoundingClientRect();
 		const surfaceRect = surface.getBoundingClientRect();
+		const point = this.anchorPoint();
+		if (point && this.pointOffset?.point !== point) {
+			this.pointOffset = {
+				point,
+				x: point.x - anchorRect.left,
+				y: point.y - anchorRect.top
+			};
+			this.latched = null;
+		}
+		const tracked = point ? this.pointOffset : null;
 		const requested = this.placement();
 		const placement = untracked(this.stable) && this.latched?.requested === requested ? this.latched.resolved : requested;
 		const result = computePopoverPosition(anchorRect, {
@@ -5490,7 +5563,11 @@ var PopoverComponent = class PopoverComponent {
 			flip: this.flip(),
 			clamp: this.clamp(),
 			matchAnchorWidth: this.matchAnchorWidth(),
-			rtl: isRtl(anchor)
+			rtl: isRtl(anchor),
+			point: tracked ? {
+				x: anchorRect.left + tracked.x,
+				y: anchorRect.top + tracked.y
+			} : null
 		});
 		this.latched = {
 			requested,
@@ -5502,7 +5579,7 @@ var PopoverComponent = class PopoverComponent {
 		if (!this.open() || !this.closeOnOutsideClick()) return;
 		const target = event.target;
 		if (!target) return;
-		const anchor = this.resolveAnchor();
+		const anchor = this.contextMenu() ? null : this.resolveAnchor();
 		const surface = this.surfaceEl()?.nativeElement;
 		if (anchor?.contains(target) || surface?.contains(target)) return;
 		if (this.press.touchedInside(anchor) || this.press.touchedInside(surface)) return;
@@ -5512,7 +5589,7 @@ var PopoverComponent = class PopoverComponent {
 		if (event.key !== "Tab" || !this.open() || !this.trapFocus()) return;
 		const surface = this.surfaceEl()?.nativeElement;
 		if (!surface) return;
-		const focusable = Array.from(surface.querySelectorAll("a[href], button, input, select, textarea, [tabindex]")).filter((el) => el.tabIndex >= 0 && !el.hasAttribute("disabled") && el.getClientRects().length > 0);
+		const focusable = this.focusableElements(surface);
 		if (focusable.length === 0) {
 			event.preventDefault();
 			return;
@@ -5530,6 +5607,27 @@ var PopoverComponent = class PopoverComponent {
 			first.focus();
 		}
 	}
+	focusableElements(surface) {
+		return Array.from(surface.querySelectorAll("a[href], button, input, select, textarea, [tabindex]")).filter((el) => el.tabIndex >= 0 && !el.hasAttribute("disabled") && el.getClientRects().length > 0);
+	}
+	focusFirstElement() {
+		const surface = this.surfaceEl()?.nativeElement;
+		if (!surface || surface.contains(document.activeElement)) return;
+		this.focusableElements(surface)[0]?.focus({ preventScroll: true });
+	}
+	trackFocusReturn(active) {
+		if (active) {
+			const focused = document.activeElement;
+			this.focusReturn ??= focused instanceof HTMLElement && focused !== document.body ? focused : null;
+			return;
+		}
+		const target = this.focusReturn;
+		this.focusReturn = null;
+		if (!target || this.open()) return;
+		const focused = document.activeElement;
+		const surface = this.surfaceEl()?.nativeElement;
+		if (!focused || focused === document.body || surface?.contains(focused)) target.focus({ preventScroll: true });
+	}
 	onEscape(event) {
 		if (!this.open() || !this.closeOnEscape()) return;
 		event.preventDefault();
@@ -5571,6 +5669,13 @@ var PopoverComponent = class PopoverComponent {
 				isRequired: false,
 				transformFunction: null
 			},
+			anchorPoint: {
+				classPropertyName: "anchorPoint",
+				publicName: "anchorPoint",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
 			role: {
 				classPropertyName: "role",
 				publicName: "role",
@@ -5661,9 +5766,19 @@ var PopoverComponent = class PopoverComponent {
 				isSignal: true,
 				isRequired: false,
 				transformFunction: null
+			},
+			contextMenu: {
+				classPropertyName: "contextMenu",
+				publicName: "contextMenu",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
 			}
 		},
-		outputs: { closeRequested: "closeRequested" },
+		outputs: {
+			closeRequested: "closeRequested",
+			openRequested: "openRequested"
+		},
 		host: {
 			listeners: {
 				"document:click": "onDocumentClick($event)",
@@ -5737,6 +5852,14 @@ i0.ɵɵngDeclareClassMetadata({
 				required: false
 			}]
 		}],
+		anchorPoint: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "anchorPoint",
+				required: false
+			}]
+		}],
 		role: [{
 			type: i0.Input,
 			args: [{
@@ -5841,10 +5964,22 @@ i0.ɵɵngDeclareClassMetadata({
 				required: false
 			}]
 		}],
+		contextMenu: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "contextMenu",
+				required: false
+			}]
+		}],
 		closeRequested: [{
 			type: i0.Output,
 			args: ["closeRequested"]
 		}],
+		openRequested: [{
+			type: i0.Output,
+			args: ["openRequested"]
+		}],
 		onDocumentClick: [{
 			type: HostListener,
 			args: ["document:click", ["$event"]]
@@ -6284,6 +6419,7 @@ var AutocompleteComponent = class AutocompleteComponent {
 					"anchor",
 					"open",
 					"placement",
+					"anchorPoint",
 					"role",
 					"aria-label",
 					"aria-labelledby",
@@ -6296,9 +6432,10 @@ var AutocompleteComponent = class AutocompleteComponent {
 					"maxWidth",
 					"closeOnOutsideClick",
 					"closeOnEscape",
-					"scrollBehavior"
+					"scrollBehavior",
+					"contextMenu"
 				],
-				outputs: ["closeRequested"]
+				outputs: ["closeRequested", "openRequested"]
 			}
 		],
 		changeDetection: i0.ChangeDetectionStrategy.OnPush
@@ -13204,6 +13341,7 @@ var ColorPickerComponent = class ColorPickerComponent {
 					"anchor",
 					"open",
 					"placement",
+					"anchorPoint",
 					"role",
 					"aria-label",
 					"aria-labelledby",
@@ -13216,9 +13354,10 @@ var ColorPickerComponent = class ColorPickerComponent {
 					"maxWidth",
 					"closeOnOutsideClick",
 					"closeOnEscape",
-					"scrollBehavior"
+					"scrollBehavior",
+					"contextMenu"
 				],
-				outputs: ["closeRequested"]
+				outputs: ["closeRequested", "openRequested"]
 			},
 			{
 				kind: "component",
@@ -13645,6 +13784,447 @@ function clampAlpha(value) {
 	if (value.endsWith("%")) return clamp01(parseFloat(value) / 100);
 	return clamp01(parseFloat(value));
 }
+var MenuComponent = class MenuComponent {
+	injector = inject(Injector);
+	i18n = inject(EagamiI18nService);
+	listEl = viewChild("listEl", ...ngDevMode ? [{ debugName: "listEl" }] : 	/* istanbul ignore next */ []);
+	placement = input("bottom-start", ...ngDevMode ? [{ debugName: "placement" }] : 	/* istanbul ignore next */ []);
+	size = input("md", ...ngDevMode ? [{ debugName: "size" }] : 	/* istanbul ignore next */ []);
+	maxHeight = input("20rem", ...ngDevMode ? [{ debugName: "maxHeight" }] : 	/* istanbul ignore next */ []);
+	disabled = input(false, ...ngDevMode ? [{ debugName: "disabled" }] : 	/* istanbul ignore next */ []);
+	ariaLabel = input(void 0, {
+		...ngDevMode ? { debugName: "ariaLabel" } : 		/* istanbul ignore next */ {},
+		alias: "aria-label"
+	});
+	id = input(uniqueId("ea-menu"), ...ngDevMode ? [{ debugName: "id" }] : 	/* istanbul ignore next */ []);
+	resolvedAriaLabel = computed(() => this.ariaLabel() ?? this.i18n.messages().menu.label, ...ngDevMode ? [{ debugName: "resolvedAriaLabel" }] : 	/* istanbul ignore next */ []);
+	open = model(false, ...ngDevMode ? [{ debugName: "open" }] : 	/* istanbul ignore next */ []);
+	opened = output();
+	closed = output();
+	triggerEl = signal(void 0, ...ngDevMode ? [{ debugName: "triggerEl" }] : 	/* istanbul ignore next */ []);
+	asContextMenu = signal(false, ...ngDevMode ? [{ debugName: "asContextMenu" }] : 	/* istanbul ignore next */ []);
+	anchorPoint = signal(null, ...ngDevMode ? [{ debugName: "anchorPoint" }] : 	/* istanbul ignore next */ []);
+	activeItemId = signal(null, ...ngDevMode ? [{ debugName: "activeItemId" }] : 	/* istanbul ignore next */ []);
+	constructor() {
+		effect(() => {
+			if (!this.open()) {
+				this.activeItemId.set(null);
+				this.asContextMenu.set(false);
+				this.anchorPoint.set(null);
+				return;
+			}
+			afterNextRender(() => {
+				if (this.open() && !this.activeItemId()) {
+					const first = this.getEnabledItems()[0];
+					if (first) this.activeItemId.set(first.id);
+				}
+			}, { injector: this.injector });
+		});
+	}
+	toggleAt(triggerEl) {
+		if (this.disabled()) return;
+		if (this.open()) this.close();
+		else this.openAt(triggerEl);
+	}
+	openAt(triggerEl) {
+		if (this.disabled()) return;
+		this.asContextMenu.set(false);
+		this.anchorPoint.set(null);
+		this.show(triggerEl);
+	}
+	openAsContextMenu(anchorEl, point = null) {
+		if (this.disabled()) return;
+		this.asContextMenu.set(true);
+		this.anchorPoint.set(point);
+		this.show(anchorEl);
+	}
+	show(triggerEl) {
+		this.triggerEl.set(triggerEl);
+		this.open.set(true);
+		this.opened.emit();
+		afterNextRender(() => this.focusFirstItem(), { injector: this.injector });
+	}
+	close(restoreFocus = false) {
+		if (!this.open()) return;
+		const focusTrigger = restoreFocus && !this.asContextMenu();
+		this.open.set(false);
+		this.closed.emit();
+		if (focusTrigger) this.triggerEl()?.focus({ preventScroll: true });
+	}
+	onPopoverCloseRequested() {
+		this.close();
+	}
+	getEnabledItems() {
+		const list = this.listEl()?.nativeElement;
+		if (!list) return [];
+		return Array.from(list.querySelectorAll("[role=\"menuitem\"]:not([disabled])"));
+	}
+	focusFirstItem() {
+		this.focusItem(this.getEnabledItems()[0]);
+	}
+	focusItem(item) {
+		if (!item) return;
+		this.activeItemId.set(item.id);
+		item.focus({ preventScroll: true });
+	}
+	onKeydown(event) {
+		if (!this.open()) return;
+		const list = this.listEl()?.nativeElement;
+		const active = document.activeElement;
+		if (!list || !active || !list.contains(active)) return;
+		const items = this.getEnabledItems();
+		if (items.length === 0) return;
+		const current = items.indexOf(active);
+		let next = -1;
+		switch (event.key) {
+			case "ArrowDown":
+				event.preventDefault();
+				next = current < items.length - 1 ? current + 1 : 0;
+				break;
+			case "ArrowUp":
+				event.preventDefault();
+				next = current > 0 ? current - 1 : items.length - 1;
+				break;
+			case "Home":
+				event.preventDefault();
+				next = 0;
+				break;
+			case "End":
+				event.preventDefault();
+				next = items.length - 1;
+				break;
+		}
+		if (next >= 0) this.focusItem(items[next]);
+	}
+	onEscape(event) {
+		if (!this.open()) return;
+		event.preventDefault();
+		this.close(true);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: MenuComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.2.0",
+		version: "22.2.0",
+		type: MenuComponent,
+		isStandalone: true,
+		selector: "ea-menu",
+		inputs: {
+			placement: {
+				classPropertyName: "placement",
+				publicName: "placement",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			size: {
+				classPropertyName: "size",
+				publicName: "size",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			maxHeight: {
+				classPropertyName: "maxHeight",
+				publicName: "maxHeight",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			disabled: {
+				classPropertyName: "disabled",
+				publicName: "disabled",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			ariaLabel: {
+				classPropertyName: "ariaLabel",
+				publicName: "aria-label",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			id: {
+				classPropertyName: "id",
+				publicName: "id",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			open: {
+				classPropertyName: "open",
+				publicName: "open",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: {
+			open: "openChange",
+			opened: "opened",
+			closed: "closed"
+		},
+		host: { listeners: {
+			"document:keydown": "onKeydown($event)",
+			"document:keydown.escape": "onEscape($event)"
+		} },
+		viewQueries: [{
+			propertyName: "listEl",
+			first: true,
+			predicate: ["listEl"],
+			descendants: true,
+			isSignal: true
+		}],
+		ngImport: i0,
+		template: "<ea-popover\n  [anchor]=\"triggerEl()\"\n  [open]=\"open()\"\n  [placement]=\"placement()\"\n  [anchorPoint]=\"anchorPoint()\"\n  [contextMenu]=\"asContextMenu()\"\n  role=\"menu\"\n  [surfaceId]=\"id()\"\n  [aria-label]=\"resolvedAriaLabel()\"\n  [closeOnEscape]=\"false\"\n  scrollBehavior=\"reposition\"\n  (closeRequested)=\"onPopoverCloseRequested()\">\n  <div\n    #listEl\n    class=\"ea-menu__list ea-menu__list--{{ size() }}\"\n    [style.max-height]=\"maxHeight()\">\n    <ng-content />\n  </div>\n</ea-popover>\n",
+		styles: [":host{display:contents}.ea-menu__list{min-width:10em;padding:.25em 0;overflow-y:auto;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);background-color:var(--ea-menu-list-background-color, var(--color-bg-elevated))}@media(forced-colors:active){.ea-menu__list{border:1px solid CanvasText}}.ea-menu__list--2xs{font-size:var(--font-size-2xs)}.ea-menu__list--xs{font-size:var(--font-size-xs)}.ea-menu__list--sm{font-size:var(--font-size-sm)}.ea-menu__list--md{font-size:var(--font-size-md)}.ea-menu__list--lg{font-size:var(--font-size-lg)}.ea-menu__list--xl{font-size:var(--font-size-xl)}\n"],
+		dependencies: [{
+			kind: "component",
+			type: PopoverComponent,
+			selector: "ea-popover",
+			inputs: [
+				"anchor",
+				"open",
+				"placement",
+				"anchorPoint",
+				"role",
+				"aria-label",
+				"aria-labelledby",
+				"trapFocus",
+				"surfaceId",
+				"offset",
+				"flip",
+				"clamp",
+				"matchAnchorWidth",
+				"maxWidth",
+				"closeOnOutsideClick",
+				"closeOnEscape",
+				"scrollBehavior",
+				"contextMenu"
+			],
+			outputs: ["closeRequested", "openRequested"]
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: MenuComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ea-menu",
+			imports: [PopoverComponent],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<ea-popover\n  [anchor]=\"triggerEl()\"\n  [open]=\"open()\"\n  [placement]=\"placement()\"\n  [anchorPoint]=\"anchorPoint()\"\n  [contextMenu]=\"asContextMenu()\"\n  role=\"menu\"\n  [surfaceId]=\"id()\"\n  [aria-label]=\"resolvedAriaLabel()\"\n  [closeOnEscape]=\"false\"\n  scrollBehavior=\"reposition\"\n  (closeRequested)=\"onPopoverCloseRequested()\">\n  <div\n    #listEl\n    class=\"ea-menu__list ea-menu__list--{{ size() }}\"\n    [style.max-height]=\"maxHeight()\">\n    <ng-content />\n  </div>\n</ea-popover>\n",
+			styles: [":host{display:contents}.ea-menu__list{min-width:10em;padding:.25em 0;overflow-y:auto;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);background-color:var(--ea-menu-list-background-color, var(--color-bg-elevated))}@media(forced-colors:active){.ea-menu__list{border:1px solid CanvasText}}.ea-menu__list--2xs{font-size:var(--font-size-2xs)}.ea-menu__list--xs{font-size:var(--font-size-xs)}.ea-menu__list--sm{font-size:var(--font-size-sm)}.ea-menu__list--md{font-size:var(--font-size-md)}.ea-menu__list--lg{font-size:var(--font-size-lg)}.ea-menu__list--xl{font-size:var(--font-size-xl)}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		listEl: [{
+			type: i0.ViewChild,
+			args: ["listEl", { isSignal: true }]
+		}],
+		placement: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "placement",
+				required: false
+			}]
+		}],
+		size: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "size",
+				required: false
+			}]
+		}],
+		maxHeight: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "maxHeight",
+				required: false
+			}]
+		}],
+		disabled: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disabled",
+				required: false
+			}]
+		}],
+		ariaLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "aria-label",
+				required: false
+			}]
+		}],
+		id: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "id",
+				required: false
+			}]
+		}],
+		open: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "open",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["openChange"]
+		}],
+		opened: [{
+			type: i0.Output,
+			args: ["opened"]
+		}],
+		closed: [{
+			type: i0.Output,
+			args: ["closed"]
+		}],
+		onKeydown: [{
+			type: HostListener,
+			args: ["document:keydown", ["$event"]]
+		}],
+		onEscape: [{
+			type: HostListener,
+			args: ["document:keydown.escape", ["$event"]]
+		}]
+	}
+});
+function isContextMenuShortcut(event) {
+	return event.key === "F10" && event.shiftKey && !event.ctrlKey && !event.altKey && !event.metaKey;
+}
+function contextMenuPoint(event, fallback) {
+	if (event instanceof MouseEvent && !fromKeyboard(event)) return {
+		x: event.clientX,
+		y: event.clientY
+	};
+	const focused = event.target instanceof Element ? event.target : fallback;
+	const rect = focused.getBoundingClientRect();
+	return {
+		x: isRtl(focused) ? rect.right : rect.left,
+		y: rect.bottom
+	};
+}
+function fromKeyboard(event) {
+	if (typeof PointerEvent !== "undefined" && event instanceof PointerEvent) return event.pointerType === "";
+	return event.button === 0 && event.buttons === 0;
+}
+var ContextMenuTriggerDirective = class ContextMenuTriggerDirective {
+	el = inject(ElementRef);
+	target = input(void 0, {
+		...ngDevMode ? { debugName: "target" } : 		/* istanbul ignore next */ {},
+		alias: "eaContextMenuTrigger"
+	});
+	contextMenuPosition = input("pointer", ...ngDevMode ? [{ debugName: "contextMenuPosition" }] : 	/* istanbul ignore next */ []);
+	onContextMenu(event) {
+		this.request(event);
+	}
+	onKeydown(event) {
+		if (isContextMenuShortcut(event)) this.request(event);
+	}
+	request(event) {
+		const target = this.target();
+		if (!target || event.defaultPrevented) return;
+		if (target instanceof MenuComponent && target.disabled()) return;
+		event.preventDefault();
+		const host = this.el.nativeElement;
+		const point = this.contextMenuPosition() === "pointer" ? contextMenuPoint(event, host) : null;
+		if (target instanceof MenuComponent) target.openAsContextMenu(host, point);
+		else target.requestOpen(point);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: ContextMenuTriggerDirective,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Directive
+	});
+	static ɵdir = i0.ɵɵngDeclareDirective({
+		minVersion: "17.1.0",
+		version: "22.2.0",
+		type: ContextMenuTriggerDirective,
+		isStandalone: true,
+		selector: "[eaContextMenuTrigger]",
+		inputs: {
+			target: {
+				classPropertyName: "target",
+				publicName: "eaContextMenuTrigger",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			contextMenuPosition: {
+				classPropertyName: "contextMenuPosition",
+				publicName: "contextMenuPosition",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: { listeners: {
+			"contextmenu": "onContextMenu($event)",
+			"keydown": "onKeydown($event)"
+		} },
+		ngImport: i0
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: ContextMenuTriggerDirective,
+	decorators: [{
+		type: Directive,
+		args: [{
+			selector: "[eaContextMenuTrigger]",
+			host: {
+				"(contextmenu)": "onContextMenu($event)",
+				"(keydown)": "onKeydown($event)"
+			}
+		}]
+	}],
+	propDecorators: {
+		target: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "eaContextMenuTrigger",
+				required: false
+			}]
+		}],
+		contextMenuPosition: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "contextMenuPosition",
+				required: false
+			}]
+		}]
+	}
+});
 var ArrowDownIconComponent = class ArrowDownIconComponent extends IconComponentBase {
 	static slug = "arrow-down";
 	static category = "feather";
@@ -13916,6 +14496,7 @@ var DataTableComponent = class DataTableComponent {
 		col: 0
 	}, ...ngDevMode ? [{ debugName: "activeCell" }] : 	/* istanbul ignore next */ []);
 	static PAGE_JUMP = 10;
+	keyboardRequestPending = false;
 	columns = input.required(...ngDevMode ? [{ debugName: "columns" }] : 	/* istanbul ignore next */ []);
 	data = input.required(...ngDevMode ? [{ debugName: "data" }] : 	/* istanbul ignore next */ []);
 	sizingRows = input([], ...ngDevMode ? [{ debugName: "sizingRows" }] : 	/* istanbul ignore next */ []);
@@ -13936,14 +14517,19 @@ var DataTableComponent = class DataTableComponent {
 	navigable = input(false, ...ngDevMode ? [{ debugName: "navigable" }] : 	/* istanbul ignore next */ []);
 	clickable = input(false, ...ngDevMode ? [{ debugName: "clickable" }] : 	/* istanbul ignore next */ []);
 	rowHref = input(void 0, ...ngDevMode ? [{ debugName: "rowHref" }] : 	/* istanbul ignore next */ []);
+	loading = input(false, ...ngDevMode ? [{ debugName: "loading" }] : 	/* istanbul ignore next */ []);
+	loadingRowCount = input(5, ...ngDevMode ? [{ debugName: "loadingRowCount" }] : 	/* istanbul ignore next */ []);
 	sort = model({
 		column: "",
 		direction: null
 	}, ...ngDevMode ? [{ debugName: "sort" }] : 	/* istanbul ignore next */ []);
 	sorted = output();
 	rowActivate = output();
+	rowContextMenu = output();
 	noDataTemplate = contentChild("noData", ...ngDevMode ? [{ debugName: "noDataTemplate" }] : 	/* istanbul ignore next */ []);
 	resolvedNoDataText = computed(() => this.noDataText() ?? this.i18n.messages().dataTable.noData, ...ngDevMode ? [{ debugName: "resolvedNoDataText" }] : 	/* istanbul ignore next */ []);
+	placeholderRows = computed(() => Array.from({ length: Math.max(0, Math.floor(this.loadingRowCount())) }, (_, i) => i), ...ngDevMode ? [{ debugName: "placeholderRows" }] : 	/* istanbul ignore next */ []);
+	bodyRowCount = computed(() => this.loading() ? 0 : this.sortedData().length, ...ngDevMode ? [{ debugName: "bodyRowCount" }] : 	/* istanbul ignore next */ []);
 	hostClasses = computed(() => ({
 		[`ea-data-table--${this.density()}`]: true,
 		[`ea-data-table--${this.size()}`]: true,
@@ -13958,7 +14544,7 @@ var DataTableComponent = class DataTableComponent {
 	}), ...ngDevMode ? [{ debugName: "hostClasses" }] : 	/* istanbul ignore next */ []);
 	constructor() {
 		effect(() => {
-			const rows = this.sortedData().length;
+			const rows = this.bodyRowCount();
 			const cols = this.columns().length;
 			const { row, col } = untracked(this.activeCell);
 			const nextRow = Math.min(row, rows);
@@ -14034,6 +14620,24 @@ var DataTableComponent = class DataTableComponent {
 		event?.preventDefault();
 		this.rowActivate.emit(row);
 	}
+	onRowContextMenu(row, rowElement, event) {
+		if (event instanceof KeyboardEvent) {
+			if (!isContextMenuShortcut(event)) return;
+		} else if (this.keyboardRequestPending) {
+			this.keyboardRequestPending = false;
+			return;
+		}
+		this.rowContextMenu.emit({
+			row,
+			rowElement,
+			point: contextMenuPoint(event, rowElement),
+			event
+		});
+		if (event instanceof KeyboardEvent && !event.defaultPrevented) this.keyboardRequestPending = true;
+	}
+	clearKeyboardRequest() {
+		this.keyboardRequestPending = false;
+	}
 	onCellFocus(row, col) {
 		if (!this.navigable()) return;
 		const active = this.activeCell();
@@ -14045,7 +14649,7 @@ var DataTableComponent = class DataTableComponent {
 	onGridKeydown(event) {
 		if (!this.navigable()) return;
 		const cols = this.columns().length;
-		const rows = this.sortedData().length;
+		const rows = this.bodyRowCount();
 		if (cols === 0) return;
 		const { row, col } = this.activeCell();
 		let nextRow = row;
@@ -14224,6 +14828,20 @@ var DataTableComponent = class DataTableComponent {
 				isRequired: false,
 				transformFunction: null
 			},
+			loading: {
+				classPropertyName: "loading",
+				publicName: "loading",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			loadingRowCount: {
+				classPropertyName: "loadingRowCount",
+				publicName: "loadingRowCount",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
 			sort: {
 				classPropertyName: "sort",
 				publicName: "sort",
@@ -14235,7 +14853,8 @@ var DataTableComponent = class DataTableComponent {
 		outputs: {
 			sort: "sortChange",
 			sorted: "sorted",
-			rowActivate: "rowActivate"
+			rowActivate: "rowActivate",
+			rowContextMenu: "rowContextMenu"
 		},
 		queries: [{
 			propertyName: "noDataTemplate",
@@ -14245,8 +14864,8 @@ var DataTableComponent = class DataTableComponent {
 			isSignal: true
 		}],
 		ngImport: i0,
-		template: "<ng-template\n  #cellContent\n  let-row\n  let-col=\"col\">\n  @if (col.cellTemplate) {\n    <ng-container\n      [ngTemplateOutlet]=\"col.cellTemplate\"\n      [ngTemplateOutletContext]=\"{ $implicit: row, value: getCellValue(row, col.key) }\" />\n  } @else if (col.format) {\n    {{ col.format(getCellValue(row, col.key)) }}\n  } @else {\n    {{ getCellValue(row, col.key) }}\n  }\n</ng-template>\n\n<div\n  class=\"ea-data-table\"\n  [ngClass]=\"hostClasses()\">\n  <div class=\"ea-data-table__scroll\">\n    <table\n      class=\"ea-data-table__table\"\n      [attr.role]=\"navigable() ? 'grid' : null\"\n      [attr.aria-label]=\"caption() ? null : (ariaLabel() ?? null)\"\n      (keydown)=\"onGridKeydown($event)\">\n      @if (caption(); as captionText) {\n        <caption class=\"ea-data-table__caption\">\n          {{ captionText }}\n        </caption>\n      }\n      <thead class=\"ea-data-table__head\">\n        <tr\n          class=\"ea-data-table__row ea-data-table__row--header\"\n          [attr.role]=\"navigable() ? 'row' : null\">\n          @for (col of columns(); track col.key; let colIndex = $index) {\n            <th\n              scope=\"col\"\n              class=\"ea-data-table__cell ea-data-table__cell--header\"\n              [attr.role]=\"navigable() ? 'columnheader' : null\"\n              [attr.data-ea-cell]=\"navigable() ? '0-' + colIndex : null\"\n              [class.ea-data-table__cell--sortable]=\"col.sortable\"\n              [class.ea-data-table__cell--sorted]=\"\n                sort().column === col.key && sort().direction\n              \"\n              [class.ea-data-table__cell--align-center]=\"col.align === 'center'\"\n              [class.ea-data-table__cell--align-right]=\"col.align === 'right'\"\n              [style.width]=\"col.width ?? null\"\n              [attr.aria-sort]=\"\n                sort().column === col.key && sort().direction === 'asc'\n                  ? 'ascending'\n                  : sort().column === col.key && sort().direction === 'desc'\n                    ? 'descending'\n                    : col.sortable\n                      ? 'none'\n                      : null\n              \"\n              (keydown.enter)=\"onHeaderKeydown($event, col)\"\n              (keydown.space)=\"onHeaderKeydown($event, col)\"\n              (focus)=\"onCellFocus(0, colIndex)\"\n              [attr.tabindex]=\"headerTabindex(colIndex)\">\n              @if (col.sortable) {\n                <button\n                  type=\"button\"\n                  class=\"ea-data-table__sort-button\"\n                  [attr.tabindex]=\"navigable() ? -1 : null\"\n                  (click)=\"onHeaderClick(col)\"\n                  (focus)=\"onCellFocus(0, colIndex)\">\n                  @if (col.headerTemplate) {\n                    <ng-container\n                      [ngTemplateOutlet]=\"col.headerTemplate\"\n                      [ngTemplateOutletContext]=\"{ $implicit: col }\" />\n                  } @else {\n                    <span class=\"ea-data-table__header-text\">{{ col.label }}</span>\n                  }\n                  <span class=\"ea-data-table__sort-icon\">\n                    @if (sort().column === col.key && sort().direction === 'asc') {\n                      <ea-icon-arrow-up />\n                    } @else if (\n                      sort().column === col.key && sort().direction === 'desc'\n                    ) {\n                      <ea-icon-arrow-down />\n                    } @else {\n                      <ea-icon-chevrons-up-down />\n                    }\n                  </span>\n                </button>\n              } @else if (col.headerTemplate) {\n                <ng-container\n                  [ngTemplateOutlet]=\"col.headerTemplate\"\n                  [ngTemplateOutletContext]=\"{ $implicit: col }\" />\n              } @else {\n                <span class=\"ea-data-table__header-text\">{{ col.label }}</span>\n              }\n            </th>\n          }\n        </tr>\n      </thead>\n      @if (sizingRows().length) {\n        <tbody\n          class=\"ea-data-table__sizing\"\n          aria-hidden=\"true\">\n          @for (row of sizingRows(); track $index) {\n            <tr class=\"ea-data-table__row ea-data-table__row--sizing\">\n              @for (col of columns(); track col.key) {\n                <td\n                  class=\"ea-data-table__cell ea-data-table__cell--sizing\"\n                  [style.width]=\"col.width ?? null\">\n                  <div class=\"ea-data-table__sizing-content\">\n                    <ng-container\n                      [ngTemplateOutlet]=\"cellContent\"\n                      [ngTemplateOutletContext]=\"{ $implicit: row, col }\" />\n                  </div>\n                </td>\n              }\n            </tr>\n          }\n        </tbody>\n      }\n      <tbody class=\"ea-data-table__body\">\n        @if (sortedData().length === 0) {\n          <tr\n            class=\"ea-data-table__row ea-data-table__row--empty\"\n            [attr.role]=\"navigable() ? 'row' : null\">\n            <td\n              class=\"ea-data-table__cell ea-data-table__cell--empty\"\n              [attr.role]=\"navigable() ? 'gridcell' : null\"\n              [attr.colspan]=\"columns().length\">\n              <div role=\"status\">\n                @if (noDataTemplate()) {\n                  <ng-container [ngTemplateOutlet]=\"noDataTemplate()!\" />\n                } @else {\n                  {{ resolvedNoDataText() }}\n                }\n              </div>\n            </td>\n          </tr>\n        } @else {\n          @for (\n            row of sortedData();\n            track trackByFn($index, row);\n            let rowIndex = $index\n          ) {\n            <tr\n              class=\"ea-data-table__row\"\n              [class.ea-data-table__row--inert]=\"isInert(row)\"\n              [attr.role]=\"navigable() ? 'row' : null\"\n              [attr.tabindex]=\"rowTabindex(row)\"\n              (click)=\"onRowActivate(row, $event)\"\n              (keydown.enter)=\"onRowActivate(row, $event)\"\n              (keydown.space)=\"onRowActivate(row, $event)\">\n              @for (col of columns(); track col.key; let colIndex = $index) {\n                <td\n                  class=\"ea-data-table__cell\"\n                  [class.ea-data-table__cell--align-center]=\"col.align === 'center'\"\n                  [class.ea-data-table__cell--align-right]=\"col.align === 'right'\"\n                  [style.width]=\"col.width ?? null\"\n                  [attr.role]=\"navigable() ? 'gridcell' : null\"\n                  [attr.data-ea-cell]=\"navigable() ? rowIndex + 1 + '-' + colIndex : null\"\n                  [attr.tabindex]=\"bodyCellTabindex(rowIndex + 1, colIndex)\"\n                  (focus)=\"onCellFocus(rowIndex + 1, colIndex)\">\n                  @if (rowHref()?.(row); as url) {\n                    <a\n                      class=\"ea-data-table__row-link\"\n                      [href]=\"url\"\n                      tabindex=\"-1\"\n                      [attr.aria-hidden]=\"colIndex > 0 ? true : null\">\n                      <ng-container\n                        [ngTemplateOutlet]=\"cellContent\"\n                        [ngTemplateOutletContext]=\"{ $implicit: row, col }\" />\n                    </a>\n                  } @else {\n                    <ng-container\n                      [ngTemplateOutlet]=\"cellContent\"\n                      [ngTemplateOutletContext]=\"{ $implicit: row, col }\" />\n                  }\n                </td>\n              }\n            </tr>\n          }\n        }\n      </tbody>\n    </table>\n  </div>\n  <ng-content select=\"ea-paginator\" />\n</div>\n",
-		styles: [".ea-data-table{--ea-data-table-font-size: var(--font-size-md);overflow:hidden;width:100%;border:var(--border-width-thin) solid var(--color-border-subtle);border-radius:var(--radius-lg);background-color:var(--ea-data-table-background-color, var(--color-bg-base))}.ea-data-table__scroll{overflow-x:auto}.ea-data-table--2xs{--ea-data-table-font-size: var(--font-size-2xs)}.ea-data-table--xs{--ea-data-table-font-size: var(--font-size-xs)}.ea-data-table--sm{--ea-data-table-font-size: var(--font-size-sm)}.ea-data-table--md{--ea-data-table-font-size: var(--font-size-md)}.ea-data-table--lg{--ea-data-table-font-size: var(--font-size-lg)}.ea-data-table--xl{--ea-data-table-font-size: var(--font-size-xl)}.ea-data-table__table{width:100%;border-spacing:0;border-collapse:collapse;font-family:var(--font-family-sans);font-size:var(--ea-data-table-font-size);color:var(--ea-data-table-color, var(--color-text-primary));table-layout:auto}.ea-data-table__caption{padding:calc(var(--ea-data-table-font-size) * .5) calc(var(--ea-data-table-font-size) * .75);text-align:start;font-weight:var(--font-weight-medium);color:var(--color-text-secondary);caption-side:top}.ea-data-table__head{background-color:var(--ea-data-table-header-background-color, var(--color-bg-stripe))}.ea-data-table__cell--header{position:relative;font-weight:var(--font-weight-medium);font-size:var(--ea-data-table-header-font-size, calc(var(--ea-data-table-font-size) * .75));line-height:var(--text-label-sm-lh);letter-spacing:var(--letter-spacing-wide);text-transform:var(--ea-data-table-header-text-transform, uppercase);text-align:start;white-space:nowrap;color:var(--ea-data-table-header-color, var(--color-text-secondary));border-bottom:var(--border-width-thin) solid var(--color-border-subtle);-webkit-user-select:none;user-select:none}.ea-data-table__cell--sortable{cursor:pointer;transition:var(--transition-colors)}.ea-data-table__cell--sortable:hover{color:var(--ea-data-table-header-hover-color, var(--color-text-primary));background-color:var(--ea-data-table-header-hover-background-color, var(--color-state-hover))}.ea-data-table__cell--sorted{color:var(--ea-data-table-header-sorted-color, var(--color-brand-text))}.ea-data-table__sort-button{display:inline-flex;align-items:center;width:100%;padding:0;margin:0;font:inherit;text-transform:inherit;letter-spacing:inherit;border:none;background:none;color:inherit;cursor:pointer}.ea-data-table__sort-button:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}@media(forced-colors:active){.ea-data-table__sort-button:focus-visible{outline:2px solid Highlight;outline-offset:2px}}.ea-data-table__cell--align-center .ea-data-table__sort-button{justify-content:center}.ea-data-table__cell--align-right .ea-data-table__sort-button{justify-content:flex-end}.ea-data-table__header-text{display:inline;vertical-align:middle}.ea-data-table__sort-icon{display:inline-flex;vertical-align:middle;width:1em;height:1em;margin-inline-start:calc(var(--ea-data-table-font-size) * .25);opacity:.5;transition:var(--transition-opacity)}.ea-data-table__cell--sortable:hover .ea-data-table__sort-icon,.ea-data-table__cell--sorted .ea-data-table__sort-icon{opacity:1}.ea-data-table__row{border-bottom:var(--border-width-thin) solid var(--ea-data-table-row-border-color, var(--color-border-subtle));transition:var(--transition-colors)}.ea-data-table__row:last-child{border-bottom-width:0}.ea-data-table__cell{text-align:start;vertical-align:middle}.ea-data-table__cell--align-center{text-align:center}.ea-data-table__cell--align-right{text-align:end}.ea-data-table__cell--empty{text-align:center;color:var(--color-text-tertiary);font-style:italic}.ea-data-table--compact .ea-data-table__cell{padding:calc(var(--ea-data-table-font-size) * .375) calc(var(--ea-data-table-font-size) * .75)}.ea-data-table--comfortable .ea-data-table__cell{padding:calc(var(--ea-data-table-font-size) * .625) var(--ea-data-table-font-size)}.ea-data-table--spacious .ea-data-table__cell{padding:var(--ea-data-table-font-size) calc(var(--ea-data-table-font-size) * 1.5)}.ea-data-table__sizing .ea-data-table__row{border-bottom:none}.ea-data-table__sizing .ea-data-table__cell{padding-top:0;padding-bottom:0}.ea-data-table__sizing-content{overflow:hidden;visibility:hidden;height:0}.ea-data-table--sticky .ea-data-table__sizing{display:none}.ea-data-table--sticky,.ea-data-table--sticky .ea-data-table__scroll{max-height:inherit;height:inherit}.ea-data-table--sticky .ea-data-table__table{display:flex;flex-direction:column;min-width:calc(var(--ea-data-table-font-size) * 32);max-height:inherit;height:inherit}.ea-data-table--sticky .ea-data-table__head{display:block;flex-shrink:0}.ea-data-table--sticky .ea-data-table__head .ea-data-table__row--header{display:table;width:100%;table-layout:fixed}.ea-data-table--sticky .ea-data-table__body{display:block;overflow-y:auto;flex:1 1 auto;min-height:0}.ea-data-table--sticky .ea-data-table__body .ea-data-table__row{display:table;width:100%;table-layout:fixed}.ea-data-table--striped .ea-data-table__body .ea-data-table__row:nth-child(2n){background-color:var(--ea-data-table-row-stripe-background-color, var(--color-bg-stripe-subtle))}.ea-data-table--hoverable .ea-data-table__body .ea-data-table__row:not(.ea-data-table__row--empty):not(.ea-data-table__row--inert):hover{background-color:var(--ea-data-table-row-hover-background-color, var(--color-state-hover))}@media(forced-colors:active){.ea-data-table--hoverable .ea-data-table__body .ea-data-table__row:not(.ea-data-table__row--empty):not(.ea-data-table__row--inert):hover{background-color:Highlight;color:HighlightText}.ea-data-table--hoverable .ea-data-table__body .ea-data-table__row:not(.ea-data-table__row--empty):not(.ea-data-table__row--inert):hover .ea-data-table__cell--sorted{color:HighlightText}}.ea-data-table--clickable .ea-data-table__body .ea-data-table__row:not(.ea-data-table__row--empty):not(.ea-data-table__row--inert){cursor:var(--ea-data-table-row-cursor, pointer)}.ea-data-table--linked .ea-data-table__cell{position:relative}.ea-data-table__row-link{text-decoration:none;color:inherit}.ea-data-table__row-link:hover{color:inherit}.ea-data-table__row-link:after{position:absolute;inset:0;content:\"\"}.ea-data-table--nowrap .ea-data-table__cell{white-space:nowrap}.ea-data-table--bordered .ea-data-table__cell{border-inline-end:var(--border-width-thin) solid var(--color-border-subtle)}.ea-data-table--bordered .ea-data-table__cell:last-child{border-inline-end:none}.ea-data-table--navigable .ea-data-table__cell:focus-visible{outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:calc(-1 * var(--border-width-medium));box-shadow:none}\n"],
+		template: "<ng-template\n  #cellContent\n  let-row\n  let-col=\"col\">\n  @if (col.cellTemplate) {\n    <ng-container\n      [ngTemplateOutlet]=\"col.cellTemplate\"\n      [ngTemplateOutletContext]=\"{ $implicit: row, value: getCellValue(row, col.key) }\" />\n  } @else if (col.format) {\n    {{ col.format(getCellValue(row, col.key)) }}\n  } @else {\n    {{ getCellValue(row, col.key) }}\n  }\n</ng-template>\n\n<div\n  class=\"ea-data-table\"\n  [ngClass]=\"hostClasses()\">\n  <div class=\"ea-data-table__scroll\">\n    <table\n      class=\"ea-data-table__table\"\n      [attr.role]=\"navigable() ? 'grid' : null\"\n      [attr.aria-label]=\"caption() ? null : (ariaLabel() ?? null)\"\n      [attr.aria-busy]=\"loading() ? 'true' : null\"\n      (keydown)=\"onGridKeydown($event)\"\n      (keyup)=\"clearKeyboardRequest()\"\n      (pointerdown)=\"clearKeyboardRequest()\">\n      @if (caption(); as captionText) {\n        <caption class=\"ea-data-table__caption\">\n          {{ captionText }}\n        </caption>\n      }\n      <thead class=\"ea-data-table__head\">\n        <tr\n          class=\"ea-data-table__row ea-data-table__row--header\"\n          [attr.role]=\"navigable() ? 'row' : null\">\n          @for (col of columns(); track col.key; let colIndex = $index) {\n            <th\n              scope=\"col\"\n              class=\"ea-data-table__cell ea-data-table__cell--header\"\n              [attr.role]=\"navigable() ? 'columnheader' : null\"\n              [attr.data-ea-cell]=\"navigable() ? '0-' + colIndex : null\"\n              [class.ea-data-table__cell--sortable]=\"col.sortable\"\n              [class.ea-data-table__cell--sorted]=\"\n                sort().column === col.key && sort().direction\n              \"\n              [class.ea-data-table__cell--align-center]=\"col.align === 'center'\"\n              [class.ea-data-table__cell--align-right]=\"col.align === 'right'\"\n              [style.width]=\"col.width ?? null\"\n              [attr.aria-sort]=\"\n                sort().column === col.key && sort().direction === 'asc'\n                  ? 'ascending'\n                  : sort().column === col.key && sort().direction === 'desc'\n                    ? 'descending'\n                    : col.sortable\n                      ? 'none'\n                      : null\n              \"\n              (keydown.enter)=\"onHeaderKeydown($event, col)\"\n              (keydown.space)=\"onHeaderKeydown($event, col)\"\n              (focus)=\"onCellFocus(0, colIndex)\"\n              [attr.tabindex]=\"headerTabindex(colIndex)\">\n              @if (col.sortable) {\n                <button\n                  type=\"button\"\n                  class=\"ea-data-table__sort-button\"\n                  [attr.tabindex]=\"navigable() ? -1 : null\"\n                  (click)=\"onHeaderClick(col)\"\n                  (focus)=\"onCellFocus(0, colIndex)\">\n                  @if (col.headerTemplate) {\n                    <ng-container\n                      [ngTemplateOutlet]=\"col.headerTemplate\"\n                      [ngTemplateOutletContext]=\"{ $implicit: col }\" />\n                  } @else {\n                    <span class=\"ea-data-table__header-text\">{{ col.label }}</span>\n                  }\n                  <span class=\"ea-data-table__sort-icon\">\n                    @if (sort().column === col.key && sort().direction === 'asc') {\n                      <ea-icon-arrow-up />\n                    } @else if (\n                      sort().column === col.key && sort().direction === 'desc'\n                    ) {\n                      <ea-icon-arrow-down />\n                    } @else {\n                      <ea-icon-chevrons-up-down />\n                    }\n                  </span>\n                </button>\n              } @else if (col.headerTemplate) {\n                <ng-container\n                  [ngTemplateOutlet]=\"col.headerTemplate\"\n                  [ngTemplateOutletContext]=\"{ $implicit: col }\" />\n              } @else {\n                <span class=\"ea-data-table__header-text\">{{ col.label }}</span>\n              }\n            </th>\n          }\n        </tr>\n      </thead>\n      @if (sizingRows().length) {\n        <tbody\n          class=\"ea-data-table__sizing\"\n          aria-hidden=\"true\">\n          @for (row of sizingRows(); track $index) {\n            <tr class=\"ea-data-table__row ea-data-table__row--sizing\">\n              @for (col of columns(); track col.key) {\n                <td\n                  class=\"ea-data-table__cell ea-data-table__cell--sizing\"\n                  [style.width]=\"col.width ?? null\">\n                  <div class=\"ea-data-table__sizing-content\">\n                    <ng-container\n                      [ngTemplateOutlet]=\"cellContent\"\n                      [ngTemplateOutletContext]=\"{ $implicit: row, col }\" />\n                  </div>\n                </td>\n              }\n            </tr>\n          }\n        </tbody>\n      }\n      <tbody class=\"ea-data-table__body\">\n        @if (loading()) {\n          @for (index of placeholderRows(); track index) {\n            <tr\n              class=\"ea-data-table__row ea-data-table__row--placeholder\"\n              aria-hidden=\"true\"\n              [attr.role]=\"navigable() ? 'row' : null\">\n              @for (col of columns(); track col.key) {\n                <td\n                  class=\"ea-data-table__cell\"\n                  [class.ea-data-table__cell--align-center]=\"col.align === 'center'\"\n                  [class.ea-data-table__cell--align-right]=\"col.align === 'right'\"\n                  [style.width]=\"col.width ?? null\"\n                  [attr.role]=\"navigable() ? 'gridcell' : null\">\n                  @if (col.placeholderTemplate) {\n                    <ng-container\n                      [ngTemplateOutlet]=\"col.placeholderTemplate\"\n                      [ngTemplateOutletContext]=\"{ $implicit: col, index }\" />\n                  } @else {\n                    <span class=\"ea-data-table__placeholder\">\n                      <ea-skeleton height=\"1em\" />\n                    </span>\n                  }\n                </td>\n              }\n            </tr>\n          }\n        } @else if (sortedData().length === 0) {\n          <tr\n            class=\"ea-data-table__row ea-data-table__row--empty\"\n            [attr.role]=\"navigable() ? 'row' : null\">\n            <td\n              class=\"ea-data-table__cell ea-data-table__cell--empty\"\n              [attr.role]=\"navigable() ? 'gridcell' : null\"\n              [attr.colspan]=\"columns().length\">\n              <div role=\"status\">\n                @if (noDataTemplate()) {\n                  <ng-container [ngTemplateOutlet]=\"noDataTemplate()!\" />\n                } @else {\n                  {{ resolvedNoDataText() }}\n                }\n              </div>\n            </td>\n          </tr>\n        } @else {\n          @for (\n            row of sortedData();\n            track trackByFn($index, row);\n            let rowIndex = $index\n          ) {\n            <tr\n              #rowEl\n              class=\"ea-data-table__row\"\n              [class.ea-data-table__row--inert]=\"isInert(row)\"\n              [attr.role]=\"navigable() ? 'row' : null\"\n              [attr.tabindex]=\"rowTabindex(row)\"\n              (click)=\"onRowActivate(row, $event)\"\n              (keydown.enter)=\"onRowActivate(row, $event)\"\n              (keydown.space)=\"onRowActivate(row, $event)\"\n              (keydown)=\"onRowContextMenu(row, rowEl, $event)\"\n              (contextmenu)=\"onRowContextMenu(row, rowEl, $event)\">\n              @for (col of columns(); track col.key; let colIndex = $index) {\n                <td\n                  class=\"ea-data-table__cell\"\n                  [class.ea-data-table__cell--align-center]=\"col.align === 'center'\"\n                  [class.ea-data-table__cell--align-right]=\"col.align === 'right'\"\n                  [style.width]=\"col.width ?? null\"\n                  [attr.role]=\"navigable() ? 'gridcell' : null\"\n                  [attr.data-ea-cell]=\"navigable() ? rowIndex + 1 + '-' + colIndex : null\"\n                  [attr.tabindex]=\"bodyCellTabindex(rowIndex + 1, colIndex)\"\n                  (focus)=\"onCellFocus(rowIndex + 1, colIndex)\">\n                  @if (rowHref()?.(row); as url) {\n                    <a\n                      class=\"ea-data-table__row-link\"\n                      [href]=\"url\"\n                      tabindex=\"-1\"\n                      [attr.aria-hidden]=\"colIndex > 0 ? true : null\">\n                      <ng-container\n                        [ngTemplateOutlet]=\"cellContent\"\n                        [ngTemplateOutletContext]=\"{ $implicit: row, col }\" />\n                    </a>\n                  } @else {\n                    <ng-container\n                      [ngTemplateOutlet]=\"cellContent\"\n                      [ngTemplateOutletContext]=\"{ $implicit: row, col }\" />\n                  }\n                </td>\n              }\n            </tr>\n          }\n        }\n      </tbody>\n    </table>\n  </div>\n  <ng-content select=\"ea-paginator\" />\n</div>\n",
+		styles: [".ea-data-table{--ea-data-table-font-size: var(--font-size-md);overflow:hidden;width:100%;border:var(--border-width-thin) solid var(--color-border-subtle);border-radius:var(--radius-lg);background-color:var(--ea-data-table-background-color, var(--color-bg-base))}.ea-data-table__scroll{overflow-x:auto}.ea-data-table--2xs{--ea-data-table-font-size: var(--font-size-2xs)}.ea-data-table--xs{--ea-data-table-font-size: var(--font-size-xs)}.ea-data-table--sm{--ea-data-table-font-size: var(--font-size-sm)}.ea-data-table--md{--ea-data-table-font-size: var(--font-size-md)}.ea-data-table--lg{--ea-data-table-font-size: var(--font-size-lg)}.ea-data-table--xl{--ea-data-table-font-size: var(--font-size-xl)}.ea-data-table__table{width:100%;border-spacing:0;border-collapse:collapse;font-family:var(--font-family-sans);font-size:var(--ea-data-table-font-size);color:var(--ea-data-table-color, var(--color-text-primary));table-layout:auto}.ea-data-table__caption{padding:calc(var(--ea-data-table-font-size) * .5) calc(var(--ea-data-table-font-size) * .75);text-align:start;font-weight:var(--font-weight-medium);color:var(--color-text-secondary);caption-side:top}.ea-data-table__head{background-color:var(--ea-data-table-header-background-color, var(--color-bg-stripe))}.ea-data-table__cell--header{position:relative;font-weight:var(--font-weight-medium);font-size:var(--ea-data-table-header-font-size, calc(var(--ea-data-table-font-size) * .75));line-height:var(--text-label-sm-lh);letter-spacing:var(--letter-spacing-wide);text-transform:var(--ea-data-table-header-text-transform, uppercase);text-align:start;white-space:nowrap;color:var(--ea-data-table-header-color, var(--color-text-secondary));border-bottom:var(--border-width-thin) solid var(--color-border-subtle);-webkit-user-select:none;user-select:none}.ea-data-table__cell--sortable{cursor:pointer;transition:var(--transition-colors)}.ea-data-table__cell--sortable:hover{color:var(--ea-data-table-header-hover-color, var(--color-text-primary));background-color:var(--ea-data-table-header-hover-background-color, var(--color-state-hover))}.ea-data-table__cell--sorted{color:var(--ea-data-table-header-sorted-color, var(--color-brand-text))}.ea-data-table__sort-button{display:inline-flex;align-items:center;width:100%;padding:0;margin:0;font:inherit;text-transform:inherit;letter-spacing:inherit;border:none;background:none;color:inherit;cursor:pointer}.ea-data-table__sort-button:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}@media(forced-colors:active){.ea-data-table__sort-button:focus-visible{outline:2px solid Highlight;outline-offset:2px}}.ea-data-table__cell--align-center .ea-data-table__sort-button{justify-content:center}.ea-data-table__cell--align-right .ea-data-table__sort-button{justify-content:flex-end}.ea-data-table__header-text{display:inline;vertical-align:middle}.ea-data-table__sort-icon{display:inline-flex;vertical-align:middle;width:1em;height:1em;margin-inline-start:calc(var(--ea-data-table-font-size) * .25);opacity:.5;transition:var(--transition-opacity)}.ea-data-table__cell--sortable:hover .ea-data-table__sort-icon,.ea-data-table__cell--sorted .ea-data-table__sort-icon{opacity:1}.ea-data-table__row{border-bottom:var(--border-width-thin) solid var(--ea-data-table-row-border-color, var(--color-border-subtle));transition:var(--transition-colors)}.ea-data-table__row:last-child{border-bottom-width:0}.ea-data-table__cell{text-align:start;vertical-align:middle}.ea-data-table__cell--align-center{text-align:center}.ea-data-table__cell--align-right{text-align:end}.ea-data-table__cell--empty{text-align:center;color:var(--color-text-tertiary);font-style:italic}.ea-data-table--compact .ea-data-table__cell{padding:calc(var(--ea-data-table-font-size) * .375) calc(var(--ea-data-table-font-size) * .75)}.ea-data-table--comfortable .ea-data-table__cell{padding:calc(var(--ea-data-table-font-size) * .625) var(--ea-data-table-font-size)}.ea-data-table--spacious .ea-data-table__cell{padding:var(--ea-data-table-font-size) calc(var(--ea-data-table-font-size) * 1.5)}.ea-data-table__sizing .ea-data-table__row{border-bottom:none}.ea-data-table__sizing .ea-data-table__cell{padding-top:0;padding-bottom:0}.ea-data-table__sizing-content{overflow:hidden;visibility:hidden;height:0}.ea-data-table--sticky .ea-data-table__sizing{display:none}.ea-data-table--sticky,.ea-data-table--sticky .ea-data-table__scroll{max-height:inherit;height:inherit}.ea-data-table--sticky .ea-data-table__table{display:flex;flex-direction:column;min-width:calc(var(--ea-data-table-font-size) * 32);max-height:inherit;height:inherit}.ea-data-table--sticky .ea-data-table__head{display:block;flex-shrink:0}.ea-data-table--sticky .ea-data-table__head .ea-data-table__row--header{display:table;width:100%;table-layout:fixed}.ea-data-table--sticky .ea-data-table__body{display:block;overflow-y:auto;flex:1 1 auto;min-height:0}.ea-data-table--sticky .ea-data-table__body .ea-data-table__row{display:table;width:100%;table-layout:fixed}.ea-data-table--striped .ea-data-table__body .ea-data-table__row:nth-child(2n){background-color:var(--ea-data-table-row-stripe-background-color, var(--color-bg-stripe-subtle))}.ea-data-table--hoverable .ea-data-table__body .ea-data-table__row:not(.ea-data-table__row--empty):not(.ea-data-table__row--inert):not(.ea-data-table__row--placeholder):hover{background-color:var(--ea-data-table-row-hover-background-color, var(--color-state-hover))}@media(forced-colors:active){.ea-data-table--hoverable .ea-data-table__body .ea-data-table__row:not(.ea-data-table__row--empty):not(.ea-data-table__row--inert):not(.ea-data-table__row--placeholder):hover{background-color:Highlight;color:HighlightText}.ea-data-table--hoverable .ea-data-table__body .ea-data-table__row:not(.ea-data-table__row--empty):not(.ea-data-table__row--inert):not(.ea-data-table__row--placeholder):hover .ea-data-table__cell--sorted{color:HighlightText}}.ea-data-table--clickable .ea-data-table__body .ea-data-table__row:not(.ea-data-table__row--empty):not(.ea-data-table__row--inert):not(.ea-data-table__row--placeholder){cursor:var(--ea-data-table-row-cursor, pointer)}.ea-data-table--linked .ea-data-table__cell{position:relative}.ea-data-table__row-link{text-decoration:none;color:inherit}.ea-data-table__row-link:hover{color:inherit}.ea-data-table__row-link:after{position:absolute;inset:0;content:\"\"}.ea-data-table__placeholder{display:inline-block;vertical-align:middle;width:100%}.ea-data-table--nowrap .ea-data-table__cell{white-space:nowrap}.ea-data-table--bordered .ea-data-table__cell{border-inline-end:var(--border-width-thin) solid var(--color-border-subtle)}.ea-data-table--bordered .ea-data-table__cell:last-child{border-inline-end:none}.ea-data-table--navigable .ea-data-table__cell:focus-visible{outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:calc(-1 * var(--border-width-medium));box-shadow:none}\n"],
 		dependencies: [
 			{
 				kind: "component",
@@ -14278,6 +14897,17 @@ var DataTableComponent = class DataTableComponent {
 					"ngTemplateOutlet",
 					"ngTemplateOutletInjector"
 				]
+			},
+			{
+				kind: "component",
+				type: SkeletonComponent,
+				selector: "ea-skeleton",
+				inputs: [
+					"variant",
+					"width",
+					"height",
+					"animated"
+				]
 			}
 		],
 		changeDetection: i0.ChangeDetectionStrategy.OnPush,
@@ -14298,12 +14928,13 @@ i0.ɵɵngDeclareClassMetadata({
 				ArrowUpIconComponent,
 				ChevronsUpDownIconComponent,
 				NgClass,
-				NgTemplateOutlet
+				NgTemplateOutlet,
+				SkeletonComponent
 			],
 			changeDetection: ChangeDetectionStrategy.OnPush,
 			encapsulation: ViewEncapsulation.None,
-			template: "<ng-template\n  #cellContent\n  let-row\n  let-col=\"col\">\n  @if (col.cellTemplate) {\n    <ng-container\n      [ngTemplateOutlet]=\"col.cellTemplate\"\n      [ngTemplateOutletContext]=\"{ $implicit: row, value: getCellValue(row, col.key) }\" />\n  } @else if (col.format) {\n    {{ col.format(getCellValue(row, col.key)) }}\n  } @else {\n    {{ getCellValue(row, col.key) }}\n  }\n</ng-template>\n\n<div\n  class=\"ea-data-table\"\n  [ngClass]=\"hostClasses()\">\n  <div class=\"ea-data-table__scroll\">\n    <table\n      class=\"ea-data-table__table\"\n      [attr.role]=\"navigable() ? 'grid' : null\"\n      [attr.aria-label]=\"caption() ? null : (ariaLabel() ?? null)\"\n      (keydown)=\"onGridKeydown($event)\">\n      @if (caption(); as captionText) {\n        <caption class=\"ea-data-table__caption\">\n          {{ captionText }}\n        </caption>\n      }\n      <thead class=\"ea-data-table__head\">\n        <tr\n          class=\"ea-data-table__row ea-data-table__row--header\"\n          [attr.role]=\"navigable() ? 'row' : null\">\n          @for (col of columns(); track col.key; let colIndex = $index) {\n            <th\n              scope=\"col\"\n              class=\"ea-data-table__cell ea-data-table__cell--header\"\n              [attr.role]=\"navigable() ? 'columnheader' : null\"\n              [attr.data-ea-cell]=\"navigable() ? '0-' + colIndex : null\"\n              [class.ea-data-table__cell--sortable]=\"col.sortable\"\n              [class.ea-data-table__cell--sorted]=\"\n                sort().column === col.key && sort().direction\n              \"\n              [class.ea-data-table__cell--align-center]=\"col.align === 'center'\"\n              [class.ea-data-table__cell--align-right]=\"col.align === 'right'\"\n              [style.width]=\"col.width ?? null\"\n              [attr.aria-sort]=\"\n                sort().column === col.key && sort().direction === 'asc'\n                  ? 'ascending'\n                  : sort().column === col.key && sort().direction === 'desc'\n                    ? 'descending'\n                    : col.sortable\n                      ? 'none'\n                      : null\n              \"\n              (keydown.enter)=\"onHeaderKeydown($event, col)\"\n              (keydown.space)=\"onHeaderKeydown($event, col)\"\n              (focus)=\"onCellFocus(0, colIndex)\"\n              [attr.tabindex]=\"headerTabindex(colIndex)\">\n              @if (col.sortable) {\n                <button\n                  type=\"button\"\n                  class=\"ea-data-table__sort-button\"\n                  [attr.tabindex]=\"navigable() ? -1 : null\"\n                  (click)=\"onHeaderClick(col)\"\n                  (focus)=\"onCellFocus(0, colIndex)\">\n                  @if (col.headerTemplate) {\n                    <ng-container\n                      [ngTemplateOutlet]=\"col.headerTemplate\"\n                      [ngTemplateOutletContext]=\"{ $implicit: col }\" />\n                  } @else {\n                    <span class=\"ea-data-table__header-text\">{{ col.label }}</span>\n                  }\n                  <span class=\"ea-data-table__sort-icon\">\n                    @if (sort().column === col.key && sort().direction === 'asc') {\n                      <ea-icon-arrow-up />\n                    } @else if (\n                      sort().column === col.key && sort().direction === 'desc'\n                    ) {\n                      <ea-icon-arrow-down />\n                    } @else {\n                      <ea-icon-chevrons-up-down />\n                    }\n                  </span>\n                </button>\n              } @else if (col.headerTemplate) {\n                <ng-container\n                  [ngTemplateOutlet]=\"col.headerTemplate\"\n                  [ngTemplateOutletContext]=\"{ $implicit: col }\" />\n              } @else {\n                <span class=\"ea-data-table__header-text\">{{ col.label }}</span>\n              }\n            </th>\n          }\n        </tr>\n      </thead>\n      @if (sizingRows().length) {\n        <tbody\n          class=\"ea-data-table__sizing\"\n          aria-hidden=\"true\">\n          @for (row of sizingRows(); track $index) {\n            <tr class=\"ea-data-table__row ea-data-table__row--sizing\">\n              @for (col of columns(); track col.key) {\n                <td\n                  class=\"ea-data-table__cell ea-data-table__cell--sizing\"\n                  [style.width]=\"col.width ?? null\">\n                  <div class=\"ea-data-table__sizing-content\">\n                    <ng-container\n                      [ngTemplateOutlet]=\"cellContent\"\n                      [ngTemplateOutletContext]=\"{ $implicit: row, col }\" />\n                  </div>\n                </td>\n              }\n            </tr>\n          }\n        </tbody>\n      }\n      <tbody class=\"ea-data-table__body\">\n        @if (sortedData().length === 0) {\n          <tr\n            class=\"ea-data-table__row ea-data-table__row--empty\"\n            [attr.role]=\"navigable() ? 'row' : null\">\n            <td\n              class=\"ea-data-table__cell ea-data-table__cell--empty\"\n              [attr.role]=\"navigable() ? 'gridcell' : null\"\n              [attr.colspan]=\"columns().length\">\n              <div role=\"status\">\n                @if (noDataTemplate()) {\n                  <ng-container [ngTemplateOutlet]=\"noDataTemplate()!\" />\n                } @else {\n                  {{ resolvedNoDataText() }}\n                }\n              </div>\n            </td>\n          </tr>\n        } @else {\n          @for (\n            row of sortedData();\n            track trackByFn($index, row);\n            let rowIndex = $index\n          ) {\n            <tr\n              class=\"ea-data-table__row\"\n              [class.ea-data-table__row--inert]=\"isInert(row)\"\n              [attr.role]=\"navigable() ? 'row' : null\"\n              [attr.tabindex]=\"rowTabindex(row)\"\n              (click)=\"onRowActivate(row, $event)\"\n              (keydown.enter)=\"onRowActivate(row, $event)\"\n              (keydown.space)=\"onRowActivate(row, $event)\">\n              @for (col of columns(); track col.key; let colIndex = $index) {\n                <td\n                  class=\"ea-data-table__cell\"\n                  [class.ea-data-table__cell--align-center]=\"col.align === 'center'\"\n                  [class.ea-data-table__cell--align-right]=\"col.align === 'right'\"\n                  [style.width]=\"col.width ?? null\"\n                  [attr.role]=\"navigable() ? 'gridcell' : null\"\n                  [attr.data-ea-cell]=\"navigable() ? rowIndex + 1 + '-' + colIndex : null\"\n                  [attr.tabindex]=\"bodyCellTabindex(rowIndex + 1, colIndex)\"\n                  (focus)=\"onCellFocus(rowIndex + 1, colIndex)\">\n                  @if (rowHref()?.(row); as url) {\n                    <a\n                      class=\"ea-data-table__row-link\"\n                      [href]=\"url\"\n                      tabindex=\"-1\"\n                      [attr.aria-hidden]=\"colIndex > 0 ? true : null\">\n                      <ng-container\n                        [ngTemplateOutlet]=\"cellContent\"\n                        [ngTemplateOutletContext]=\"{ $implicit: row, col }\" />\n                    </a>\n                  } @else {\n                    <ng-container\n                      [ngTemplateOutlet]=\"cellContent\"\n                      [ngTemplateOutletContext]=\"{ $implicit: row, col }\" />\n                  }\n                </td>\n              }\n            </tr>\n          }\n        }\n      </tbody>\n    </table>\n  </div>\n  <ng-content select=\"ea-paginator\" />\n</div>\n",
-			styles: [".ea-data-table{--ea-data-table-font-size: var(--font-size-md);overflow:hidden;width:100%;border:var(--border-width-thin) solid var(--color-border-subtle);border-radius:var(--radius-lg);background-color:var(--ea-data-table-background-color, var(--color-bg-base))}.ea-data-table__scroll{overflow-x:auto}.ea-data-table--2xs{--ea-data-table-font-size: var(--font-size-2xs)}.ea-data-table--xs{--ea-data-table-font-size: var(--font-size-xs)}.ea-data-table--sm{--ea-data-table-font-size: var(--font-size-sm)}.ea-data-table--md{--ea-data-table-font-size: var(--font-size-md)}.ea-data-table--lg{--ea-data-table-font-size: var(--font-size-lg)}.ea-data-table--xl{--ea-data-table-font-size: var(--font-size-xl)}.ea-data-table__table{width:100%;border-spacing:0;border-collapse:collapse;font-family:var(--font-family-sans);font-size:var(--ea-data-table-font-size);color:var(--ea-data-table-color, var(--color-text-primary));table-layout:auto}.ea-data-table__caption{padding:calc(var(--ea-data-table-font-size) * .5) calc(var(--ea-data-table-font-size) * .75);text-align:start;font-weight:var(--font-weight-medium);color:var(--color-text-secondary);caption-side:top}.ea-data-table__head{background-color:var(--ea-data-table-header-background-color, var(--color-bg-stripe))}.ea-data-table__cell--header{position:relative;font-weight:var(--font-weight-medium);font-size:var(--ea-data-table-header-font-size, calc(var(--ea-data-table-font-size) * .75));line-height:var(--text-label-sm-lh);letter-spacing:var(--letter-spacing-wide);text-transform:var(--ea-data-table-header-text-transform, uppercase);text-align:start;white-space:nowrap;color:var(--ea-data-table-header-color, var(--color-text-secondary));border-bottom:var(--border-width-thin) solid var(--color-border-subtle);-webkit-user-select:none;user-select:none}.ea-data-table__cell--sortable{cursor:pointer;transition:var(--transition-colors)}.ea-data-table__cell--sortable:hover{color:var(--ea-data-table-header-hover-color, var(--color-text-primary));background-color:var(--ea-data-table-header-hover-background-color, var(--color-state-hover))}.ea-data-table__cell--sorted{color:var(--ea-data-table-header-sorted-color, var(--color-brand-text))}.ea-data-table__sort-button{display:inline-flex;align-items:center;width:100%;padding:0;margin:0;font:inherit;text-transform:inherit;letter-spacing:inherit;border:none;background:none;color:inherit;cursor:pointer}.ea-data-table__sort-button:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}@media(forced-colors:active){.ea-data-table__sort-button:focus-visible{outline:2px solid Highlight;outline-offset:2px}}.ea-data-table__cell--align-center .ea-data-table__sort-button{justify-content:center}.ea-data-table__cell--align-right .ea-data-table__sort-button{justify-content:flex-end}.ea-data-table__header-text{display:inline;vertical-align:middle}.ea-data-table__sort-icon{display:inline-flex;vertical-align:middle;width:1em;height:1em;margin-inline-start:calc(var(--ea-data-table-font-size) * .25);opacity:.5;transition:var(--transition-opacity)}.ea-data-table__cell--sortable:hover .ea-data-table__sort-icon,.ea-data-table__cell--sorted .ea-data-table__sort-icon{opacity:1}.ea-data-table__row{border-bottom:var(--border-width-thin) solid var(--ea-data-table-row-border-color, var(--color-border-subtle));transition:var(--transition-colors)}.ea-data-table__row:last-child{border-bottom-width:0}.ea-data-table__cell{text-align:start;vertical-align:middle}.ea-data-table__cell--align-center{text-align:center}.ea-data-table__cell--align-right{text-align:end}.ea-data-table__cell--empty{text-align:center;color:var(--color-text-tertiary);font-style:italic}.ea-data-table--compact .ea-data-table__cell{padding:calc(var(--ea-data-table-font-size) * .375) calc(var(--ea-data-table-font-size) * .75)}.ea-data-table--comfortable .ea-data-table__cell{padding:calc(var(--ea-data-table-font-size) * .625) var(--ea-data-table-font-size)}.ea-data-table--spacious .ea-data-table__cell{padding:var(--ea-data-table-font-size) calc(var(--ea-data-table-font-size) * 1.5)}.ea-data-table__sizing .ea-data-table__row{border-bottom:none}.ea-data-table__sizing .ea-data-table__cell{padding-top:0;padding-bottom:0}.ea-data-table__sizing-content{overflow:hidden;visibility:hidden;height:0}.ea-data-table--sticky .ea-data-table__sizing{display:none}.ea-data-table--sticky,.ea-data-table--sticky .ea-data-table__scroll{max-height:inherit;height:inherit}.ea-data-table--sticky .ea-data-table__table{display:flex;flex-direction:column;min-width:calc(var(--ea-data-table-font-size) * 32);max-height:inherit;height:inherit}.ea-data-table--sticky .ea-data-table__head{display:block;flex-shrink:0}.ea-data-table--sticky .ea-data-table__head .ea-data-table__row--header{display:table;width:100%;table-layout:fixed}.ea-data-table--sticky .ea-data-table__body{display:block;overflow-y:auto;flex:1 1 auto;min-height:0}.ea-data-table--sticky .ea-data-table__body .ea-data-table__row{display:table;width:100%;table-layout:fixed}.ea-data-table--striped .ea-data-table__body .ea-data-table__row:nth-child(2n){background-color:var(--ea-data-table-row-stripe-background-color, var(--color-bg-stripe-subtle))}.ea-data-table--hoverable .ea-data-table__body .ea-data-table__row:not(.ea-data-table__row--empty):not(.ea-data-table__row--inert):hover{background-color:var(--ea-data-table-row-hover-background-color, var(--color-state-hover))}@media(forced-colors:active){.ea-data-table--hoverable .ea-data-table__body .ea-data-table__row:not(.ea-data-table__row--empty):not(.ea-data-table__row--inert):hover{background-color:Highlight;color:HighlightText}.ea-data-table--hoverable .ea-data-table__body .ea-data-table__row:not(.ea-data-table__row--empty):not(.ea-data-table__row--inert):hover .ea-data-table__cell--sorted{color:HighlightText}}.ea-data-table--clickable .ea-data-table__body .ea-data-table__row:not(.ea-data-table__row--empty):not(.ea-data-table__row--inert){cursor:var(--ea-data-table-row-cursor, pointer)}.ea-data-table--linked .ea-data-table__cell{position:relative}.ea-data-table__row-link{text-decoration:none;color:inherit}.ea-data-table__row-link:hover{color:inherit}.ea-data-table__row-link:after{position:absolute;inset:0;content:\"\"}.ea-data-table--nowrap .ea-data-table__cell{white-space:nowrap}.ea-data-table--bordered .ea-data-table__cell{border-inline-end:var(--border-width-thin) solid var(--color-border-subtle)}.ea-data-table--bordered .ea-data-table__cell:last-child{border-inline-end:none}.ea-data-table--navigable .ea-data-table__cell:focus-visible{outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:calc(-1 * var(--border-width-medium));box-shadow:none}\n"]
+			template: "<ng-template\n  #cellContent\n  let-row\n  let-col=\"col\">\n  @if (col.cellTemplate) {\n    <ng-container\n      [ngTemplateOutlet]=\"col.cellTemplate\"\n      [ngTemplateOutletContext]=\"{ $implicit: row, value: getCellValue(row, col.key) }\" />\n  } @else if (col.format) {\n    {{ col.format(getCellValue(row, col.key)) }}\n  } @else {\n    {{ getCellValue(row, col.key) }}\n  }\n</ng-template>\n\n<div\n  class=\"ea-data-table\"\n  [ngClass]=\"hostClasses()\">\n  <div class=\"ea-data-table__scroll\">\n    <table\n      class=\"ea-data-table__table\"\n      [attr.role]=\"navigable() ? 'grid' : null\"\n      [attr.aria-label]=\"caption() ? null : (ariaLabel() ?? null)\"\n      [attr.aria-busy]=\"loading() ? 'true' : null\"\n      (keydown)=\"onGridKeydown($event)\"\n      (keyup)=\"clearKeyboardRequest()\"\n      (pointerdown)=\"clearKeyboardRequest()\">\n      @if (caption(); as captionText) {\n        <caption class=\"ea-data-table__caption\">\n          {{ captionText }}\n        </caption>\n      }\n      <thead class=\"ea-data-table__head\">\n        <tr\n          class=\"ea-data-table__row ea-data-table__row--header\"\n          [attr.role]=\"navigable() ? 'row' : null\">\n          @for (col of columns(); track col.key; let colIndex = $index) {\n            <th\n              scope=\"col\"\n              class=\"ea-data-table__cell ea-data-table__cell--header\"\n              [attr.role]=\"navigable() ? 'columnheader' : null\"\n              [attr.data-ea-cell]=\"navigable() ? '0-' + colIndex : null\"\n              [class.ea-data-table__cell--sortable]=\"col.sortable\"\n              [class.ea-data-table__cell--sorted]=\"\n                sort().column === col.key && sort().direction\n              \"\n              [class.ea-data-table__cell--align-center]=\"col.align === 'center'\"\n              [class.ea-data-table__cell--align-right]=\"col.align === 'right'\"\n              [style.width]=\"col.width ?? null\"\n              [attr.aria-sort]=\"\n                sort().column === col.key && sort().direction === 'asc'\n                  ? 'ascending'\n                  : sort().column === col.key && sort().direction === 'desc'\n                    ? 'descending'\n                    : col.sortable\n                      ? 'none'\n                      : null\n              \"\n              (keydown.enter)=\"onHeaderKeydown($event, col)\"\n              (keydown.space)=\"onHeaderKeydown($event, col)\"\n              (focus)=\"onCellFocus(0, colIndex)\"\n              [attr.tabindex]=\"headerTabindex(colIndex)\">\n              @if (col.sortable) {\n                <button\n                  type=\"button\"\n                  class=\"ea-data-table__sort-button\"\n                  [attr.tabindex]=\"navigable() ? -1 : null\"\n                  (click)=\"onHeaderClick(col)\"\n                  (focus)=\"onCellFocus(0, colIndex)\">\n                  @if (col.headerTemplate) {\n                    <ng-container\n                      [ngTemplateOutlet]=\"col.headerTemplate\"\n                      [ngTemplateOutletContext]=\"{ $implicit: col }\" />\n                  } @else {\n                    <span class=\"ea-data-table__header-text\">{{ col.label }}</span>\n                  }\n                  <span class=\"ea-data-table__sort-icon\">\n                    @if (sort().column === col.key && sort().direction === 'asc') {\n                      <ea-icon-arrow-up />\n                    } @else if (\n                      sort().column === col.key && sort().direction === 'desc'\n                    ) {\n                      <ea-icon-arrow-down />\n                    } @else {\n                      <ea-icon-chevrons-up-down />\n                    }\n                  </span>\n                </button>\n              } @else if (col.headerTemplate) {\n                <ng-container\n                  [ngTemplateOutlet]=\"col.headerTemplate\"\n                  [ngTemplateOutletContext]=\"{ $implicit: col }\" />\n              } @else {\n                <span class=\"ea-data-table__header-text\">{{ col.label }}</span>\n              }\n            </th>\n          }\n        </tr>\n      </thead>\n      @if (sizingRows().length) {\n        <tbody\n          class=\"ea-data-table__sizing\"\n          aria-hidden=\"true\">\n          @for (row of sizingRows(); track $index) {\n            <tr class=\"ea-data-table__row ea-data-table__row--sizing\">\n              @for (col of columns(); track col.key) {\n                <td\n                  class=\"ea-data-table__cell ea-data-table__cell--sizing\"\n                  [style.width]=\"col.width ?? null\">\n                  <div class=\"ea-data-table__sizing-content\">\n                    <ng-container\n                      [ngTemplateOutlet]=\"cellContent\"\n                      [ngTemplateOutletContext]=\"{ $implicit: row, col }\" />\n                  </div>\n                </td>\n              }\n            </tr>\n          }\n        </tbody>\n      }\n      <tbody class=\"ea-data-table__body\">\n        @if (loading()) {\n          @for (index of placeholderRows(); track index) {\n            <tr\n              class=\"ea-data-table__row ea-data-table__row--placeholder\"\n              aria-hidden=\"true\"\n              [attr.role]=\"navigable() ? 'row' : null\">\n              @for (col of columns(); track col.key) {\n                <td\n                  class=\"ea-data-table__cell\"\n                  [class.ea-data-table__cell--align-center]=\"col.align === 'center'\"\n                  [class.ea-data-table__cell--align-right]=\"col.align === 'right'\"\n                  [style.width]=\"col.width ?? null\"\n                  [attr.role]=\"navigable() ? 'gridcell' : null\">\n                  @if (col.placeholderTemplate) {\n                    <ng-container\n                      [ngTemplateOutlet]=\"col.placeholderTemplate\"\n                      [ngTemplateOutletContext]=\"{ $implicit: col, index }\" />\n                  } @else {\n                    <span class=\"ea-data-table__placeholder\">\n                      <ea-skeleton height=\"1em\" />\n                    </span>\n                  }\n                </td>\n              }\n            </tr>\n          }\n        } @else if (sortedData().length === 0) {\n          <tr\n            class=\"ea-data-table__row ea-data-table__row--empty\"\n            [attr.role]=\"navigable() ? 'row' : null\">\n            <td\n              class=\"ea-data-table__cell ea-data-table__cell--empty\"\n              [attr.role]=\"navigable() ? 'gridcell' : null\"\n              [attr.colspan]=\"columns().length\">\n              <div role=\"status\">\n                @if (noDataTemplate()) {\n                  <ng-container [ngTemplateOutlet]=\"noDataTemplate()!\" />\n                } @else {\n                  {{ resolvedNoDataText() }}\n                }\n              </div>\n            </td>\n          </tr>\n        } @else {\n          @for (\n            row of sortedData();\n            track trackByFn($index, row);\n            let rowIndex = $index\n          ) {\n            <tr\n              #rowEl\n              class=\"ea-data-table__row\"\n              [class.ea-data-table__row--inert]=\"isInert(row)\"\n              [attr.role]=\"navigable() ? 'row' : null\"\n              [attr.tabindex]=\"rowTabindex(row)\"\n              (click)=\"onRowActivate(row, $event)\"\n              (keydown.enter)=\"onRowActivate(row, $event)\"\n              (keydown.space)=\"onRowActivate(row, $event)\"\n              (keydown)=\"onRowContextMenu(row, rowEl, $event)\"\n              (contextmenu)=\"onRowContextMenu(row, rowEl, $event)\">\n              @for (col of columns(); track col.key; let colIndex = $index) {\n                <td\n                  class=\"ea-data-table__cell\"\n                  [class.ea-data-table__cell--align-center]=\"col.align === 'center'\"\n                  [class.ea-data-table__cell--align-right]=\"col.align === 'right'\"\n                  [style.width]=\"col.width ?? null\"\n                  [attr.role]=\"navigable() ? 'gridcell' : null\"\n                  [attr.data-ea-cell]=\"navigable() ? rowIndex + 1 + '-' + colIndex : null\"\n                  [attr.tabindex]=\"bodyCellTabindex(rowIndex + 1, colIndex)\"\n                  (focus)=\"onCellFocus(rowIndex + 1, colIndex)\">\n                  @if (rowHref()?.(row); as url) {\n                    <a\n                      class=\"ea-data-table__row-link\"\n                      [href]=\"url\"\n                      tabindex=\"-1\"\n                      [attr.aria-hidden]=\"colIndex > 0 ? true : null\">\n                      <ng-container\n                        [ngTemplateOutlet]=\"cellContent\"\n                        [ngTemplateOutletContext]=\"{ $implicit: row, col }\" />\n                    </a>\n                  } @else {\n                    <ng-container\n                      [ngTemplateOutlet]=\"cellContent\"\n                      [ngTemplateOutletContext]=\"{ $implicit: row, col }\" />\n                  }\n                </td>\n              }\n            </tr>\n          }\n        }\n      </tbody>\n    </table>\n  </div>\n  <ng-content select=\"ea-paginator\" />\n</div>\n",
+			styles: [".ea-data-table{--ea-data-table-font-size: var(--font-size-md);overflow:hidden;width:100%;border:var(--border-width-thin) solid var(--color-border-subtle);border-radius:var(--radius-lg);background-color:var(--ea-data-table-background-color, var(--color-bg-base))}.ea-data-table__scroll{overflow-x:auto}.ea-data-table--2xs{--ea-data-table-font-size: var(--font-size-2xs)}.ea-data-table--xs{--ea-data-table-font-size: var(--font-size-xs)}.ea-data-table--sm{--ea-data-table-font-size: var(--font-size-sm)}.ea-data-table--md{--ea-data-table-font-size: var(--font-size-md)}.ea-data-table--lg{--ea-data-table-font-size: var(--font-size-lg)}.ea-data-table--xl{--ea-data-table-font-size: var(--font-size-xl)}.ea-data-table__table{width:100%;border-spacing:0;border-collapse:collapse;font-family:var(--font-family-sans);font-size:var(--ea-data-table-font-size);color:var(--ea-data-table-color, var(--color-text-primary));table-layout:auto}.ea-data-table__caption{padding:calc(var(--ea-data-table-font-size) * .5) calc(var(--ea-data-table-font-size) * .75);text-align:start;font-weight:var(--font-weight-medium);color:var(--color-text-secondary);caption-side:top}.ea-data-table__head{background-color:var(--ea-data-table-header-background-color, var(--color-bg-stripe))}.ea-data-table__cell--header{position:relative;font-weight:var(--font-weight-medium);font-size:var(--ea-data-table-header-font-size, calc(var(--ea-data-table-font-size) * .75));line-height:var(--text-label-sm-lh);letter-spacing:var(--letter-spacing-wide);text-transform:var(--ea-data-table-header-text-transform, uppercase);text-align:start;white-space:nowrap;color:var(--ea-data-table-header-color, var(--color-text-secondary));border-bottom:var(--border-width-thin) solid var(--color-border-subtle);-webkit-user-select:none;user-select:none}.ea-data-table__cell--sortable{cursor:pointer;transition:var(--transition-colors)}.ea-data-table__cell--sortable:hover{color:var(--ea-data-table-header-hover-color, var(--color-text-primary));background-color:var(--ea-data-table-header-hover-background-color, var(--color-state-hover))}.ea-data-table__cell--sorted{color:var(--ea-data-table-header-sorted-color, var(--color-brand-text))}.ea-data-table__sort-button{display:inline-flex;align-items:center;width:100%;padding:0;margin:0;font:inherit;text-transform:inherit;letter-spacing:inherit;border:none;background:none;color:inherit;cursor:pointer}.ea-data-table__sort-button:focus-visible{outline:none;box-shadow:var(--shadow-focus-ring)}@media(forced-colors:active){.ea-data-table__sort-button:focus-visible{outline:2px solid Highlight;outline-offset:2px}}.ea-data-table__cell--align-center .ea-data-table__sort-button{justify-content:center}.ea-data-table__cell--align-right .ea-data-table__sort-button{justify-content:flex-end}.ea-data-table__header-text{display:inline;vertical-align:middle}.ea-data-table__sort-icon{display:inline-flex;vertical-align:middle;width:1em;height:1em;margin-inline-start:calc(var(--ea-data-table-font-size) * .25);opacity:.5;transition:var(--transition-opacity)}.ea-data-table__cell--sortable:hover .ea-data-table__sort-icon,.ea-data-table__cell--sorted .ea-data-table__sort-icon{opacity:1}.ea-data-table__row{border-bottom:var(--border-width-thin) solid var(--ea-data-table-row-border-color, var(--color-border-subtle));transition:var(--transition-colors)}.ea-data-table__row:last-child{border-bottom-width:0}.ea-data-table__cell{text-align:start;vertical-align:middle}.ea-data-table__cell--align-center{text-align:center}.ea-data-table__cell--align-right{text-align:end}.ea-data-table__cell--empty{text-align:center;color:var(--color-text-tertiary);font-style:italic}.ea-data-table--compact .ea-data-table__cell{padding:calc(var(--ea-data-table-font-size) * .375) calc(var(--ea-data-table-font-size) * .75)}.ea-data-table--comfortable .ea-data-table__cell{padding:calc(var(--ea-data-table-font-size) * .625) var(--ea-data-table-font-size)}.ea-data-table--spacious .ea-data-table__cell{padding:var(--ea-data-table-font-size) calc(var(--ea-data-table-font-size) * 1.5)}.ea-data-table__sizing .ea-data-table__row{border-bottom:none}.ea-data-table__sizing .ea-data-table__cell{padding-top:0;padding-bottom:0}.ea-data-table__sizing-content{overflow:hidden;visibility:hidden;height:0}.ea-data-table--sticky .ea-data-table__sizing{display:none}.ea-data-table--sticky,.ea-data-table--sticky .ea-data-table__scroll{max-height:inherit;height:inherit}.ea-data-table--sticky .ea-data-table__table{display:flex;flex-direction:column;min-width:calc(var(--ea-data-table-font-size) * 32);max-height:inherit;height:inherit}.ea-data-table--sticky .ea-data-table__head{display:block;flex-shrink:0}.ea-data-table--sticky .ea-data-table__head .ea-data-table__row--header{display:table;width:100%;table-layout:fixed}.ea-data-table--sticky .ea-data-table__body{display:block;overflow-y:auto;flex:1 1 auto;min-height:0}.ea-data-table--sticky .ea-data-table__body .ea-data-table__row{display:table;width:100%;table-layout:fixed}.ea-data-table--striped .ea-data-table__body .ea-data-table__row:nth-child(2n){background-color:var(--ea-data-table-row-stripe-background-color, var(--color-bg-stripe-subtle))}.ea-data-table--hoverable .ea-data-table__body .ea-data-table__row:not(.ea-data-table__row--empty):not(.ea-data-table__row--inert):not(.ea-data-table__row--placeholder):hover{background-color:var(--ea-data-table-row-hover-background-color, var(--color-state-hover))}@media(forced-colors:active){.ea-data-table--hoverable .ea-data-table__body .ea-data-table__row:not(.ea-data-table__row--empty):not(.ea-data-table__row--inert):not(.ea-data-table__row--placeholder):hover{background-color:Highlight;color:HighlightText}.ea-data-table--hoverable .ea-data-table__body .ea-data-table__row:not(.ea-data-table__row--empty):not(.ea-data-table__row--inert):not(.ea-data-table__row--placeholder):hover .ea-data-table__cell--sorted{color:HighlightText}}.ea-data-table--clickable .ea-data-table__body .ea-data-table__row:not(.ea-data-table__row--empty):not(.ea-data-table__row--inert):not(.ea-data-table__row--placeholder){cursor:var(--ea-data-table-row-cursor, pointer)}.ea-data-table--linked .ea-data-table__cell{position:relative}.ea-data-table__row-link{text-decoration:none;color:inherit}.ea-data-table__row-link:hover{color:inherit}.ea-data-table__row-link:after{position:absolute;inset:0;content:\"\"}.ea-data-table__placeholder{display:inline-block;vertical-align:middle;width:100%}.ea-data-table--nowrap .ea-data-table__cell{white-space:nowrap}.ea-data-table--bordered .ea-data-table__cell{border-inline-end:var(--border-width-thin) solid var(--color-border-subtle)}.ea-data-table--bordered .ea-data-table__cell:last-child{border-inline-end:none}.ea-data-table--navigable .ea-data-table__cell:focus-visible{outline:var(--border-width-medium) solid var(--color-border-focus);outline-offset:calc(-1 * var(--border-width-medium));box-shadow:none}\n"]
 		}]
 	}],
 	ctorParameters: () => [],
@@ -14444,6 +15075,22 @@ i0.ɵɵngDeclareClassMetadata({
 				required: false
 			}]
 		}],
+		loading: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "loading",
+				required: false
+			}]
+		}],
+		loadingRowCount: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "loadingRowCount",
+				required: false
+			}]
+		}],
 		sort: [{
 			type: i0.Input,
 			args: [{
@@ -14463,6 +15110,10 @@ i0.ɵɵngDeclareClassMetadata({
 			type: i0.Output,
 			args: ["rowActivate"]
 		}],
+		rowContextMenu: [{
+			type: i0.Output,
+			args: ["rowContextMenu"]
+		}],
 		noDataTemplate: [{
 			type: i0.ContentChild,
 			args: ["noData", { isSignal: true }]
@@ -15814,6 +16465,7 @@ var DatePickerComponent = class DatePickerComponent {
 					"anchor",
 					"open",
 					"placement",
+					"anchorPoint",
 					"role",
 					"aria-label",
 					"aria-labelledby",
@@ -15826,9 +16478,10 @@ var DatePickerComponent = class DatePickerComponent {
 					"maxWidth",
 					"closeOnOutsideClick",
 					"closeOnEscape",
-					"scrollBehavior"
+					"scrollBehavior",
+					"contextMenu"
 				],
-				outputs: ["closeRequested"]
+				outputs: ["closeRequested", "openRequested"]
 			},
 			{
 				kind: "component",
@@ -16081,7 +16734,21 @@ i0.ɵɵngDeclareClassMetadata({
 		args: [{ providedIn: "root" }]
 	}]
 });
+var DialogRef = class {
+	isClosed = signal(false, ...ngDevMode ? [{ debugName: "isClosed" }] : 	/* istanbul ignore next */ []);
+	settler = { settle: () => void 0 };
+	closed = this.isClosed.asReadonly();
+	result = new Promise((resolve) => {
+		this.settler = { settle: resolve };
+	});
+	close(value) {
+		if (untracked(this.isClosed)) return;
+		this.isClosed.set(true);
+		this.settler.settle(value);
+	}
+};
 const FLOATING_SURFACES = "dialog, .ea-popover__surface, .ea-tooltip, .ea-toast";
+const boundRefs = /* @__PURE__ */ new WeakSet();
 var DialogComponent = class DialogComponent {
 	dialogEl = viewChild("dialogEl", ...ngDevMode ? [{ debugName: "dialogEl" }] : 	/* istanbul ignore next */ []);
 	headerEl = viewChild("headerEl", ...ngDevMode ? [{ debugName: "headerEl" }] : 	/* istanbul ignore next */ []);
@@ -16091,6 +16758,7 @@ var DialogComponent = class DialogComponent {
 	press = inject(PointerPressTracker);
 	scrollLock = inject(ScrollLock);
 	holdsScroll = false;
+	boundRef = null;
 	width = input("md", ...ngDevMode ? [{ debugName: "width" }] : 	/* istanbul ignore next */ []);
 	modal = input(true, ...ngDevMode ? [{ debugName: "modal" }] : 	/* istanbul ignore next */ []);
 	closeOnBackdrop = input(true, ...ngDevMode ? [{ debugName: "closeOnBackdrop" }] : 	/* istanbul ignore next */ []);
@@ -16114,6 +16782,12 @@ var DialogComponent = class DialogComponent {
 		this.hasHeader.set(!!header && (header.children.length > 0 || !!header.textContent?.trim()));
 	}
 	constructor() {
+		const ref = inject(DialogRef, { optional: true });
+		if (ref && !boundRefs.has(ref) && !untracked(ref.closed)) {
+			boundRefs.add(ref);
+			this.boundRef = ref;
+			this.open.set(true);
+		}
 		effect(() => {
 			const dialogRef = this.dialogEl()?.nativeElement;
 			const open = this.open();
@@ -16127,14 +16801,21 @@ var DialogComponent = class DialogComponent {
 					} else dialogRef.show();
 					this.opened.emit();
 				}
-			} else if (dialogRef.open) {
-				dialogRef.close();
-				this.dropScroll();
-				this.previouslyFocused?.focus?.();
-				this.previouslyFocused = null;
-			}
+			} else if (dialogRef.open) this.closeSurface();
+		});
+		inject(DestroyRef).onDestroy(() => {
+			if (this.boundRef) {
+				boundRefs.delete(this.boundRef);
+				this.closeSurface();
+			} else this.dropScroll();
 		});
-		inject(DestroyRef).onDestroy(() => this.dropScroll());
+	}
+	closeSurface() {
+		const dialog = this.dialogEl()?.nativeElement;
+		if (dialog?.open) dialog.close();
+		this.dropScroll();
+		this.previouslyFocused?.focus?.();
+		this.previouslyFocused = null;
 	}
 	holdScroll() {
 		if (!this.holdsScroll) {
@@ -16151,6 +16832,7 @@ var DialogComponent = class DialogComponent {
 	handleClose() {
 		this.open.set(false);
 		this.closed.emit();
+		this.boundRef?.close();
 	}
 	requestClose() {
 		if (this.manualClose()) {
@@ -16438,6 +17120,94 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
+var ServiceDialogRef = class extends DialogRef {
+	teardown;
+	constructor(teardown) {
+		super();
+		this.teardown = teardown;
+	}
+	close(value) {
+		if (untracked(this.closed)) return;
+		super.close(value);
+		this.teardown();
+	}
+};
+var DialogService = class DialogService {
+	appRef = inject(ApplicationRef);
+	document = inject(DOCUMENT);
+	injector = inject(Injector);
+	isBrowser = isPlatformBrowser(inject(PLATFORM_ID));
+	openDialogs = signal([], ...ngDevMode ? [{ debugName: "openDialogs" }] : 	/* istanbul ignore next */ []);
+	dialogs = this.openDialogs.asReadonly();
+	constructor() {
+		inject(DestroyRef).onDestroy(() => this.closeAll());
+	}
+	open(component, options = {}) {
+		let componentRef = null;
+		const ref = new ServiceDialogRef(() => {
+			this.openDialogs.update((open) => open.filter((dialog) => dialog !== ref));
+			if (componentRef) {
+				const host = componentRef.location.nativeElement;
+				componentRef.destroy();
+				host.remove();
+			}
+		});
+		if (!this.isBrowser) {
+			ref.close();
+			return ref;
+		}
+		const parent = options.injector ?? this.injector;
+		const created = createComponent(component, {
+			environmentInjector: parent.get(EnvironmentInjector),
+			elementInjector: Injector.create({
+				providers: [{
+					provide: DialogRef,
+					useValue: ref
+				}],
+				parent
+			})
+		});
+		if (untracked(ref.closed)) {
+			created.destroy();
+			return ref;
+		}
+		componentRef = created;
+		for (const [name, value] of Object.entries(options.inputs ?? {})) created.setInput(name, value);
+		this.appRef.attachView(created.hostView);
+		this.document.body.appendChild(created.location.nativeElement);
+		this.openDialogs.update((open) => [...open, ref]);
+		return ref;
+	}
+	closeAll() {
+		for (const ref of [...untracked(this.openDialogs)].reverse()) ref.close();
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: DialogService,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: DialogService,
+		providedIn: "root"
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: DialogService,
+	decorators: [{
+		type: Injectable,
+		args: [{ providedIn: "root" }]
+	}],
+	ctorParameters: () => []
+});
 const PUSH_PROPERTY = {
 	right: "padding-right",
 	left: "padding-left",
@@ -17339,6 +18109,7 @@ var DropdownComponent = class DropdownComponent {
 					"anchor",
 					"open",
 					"placement",
+					"anchorPoint",
 					"role",
 					"aria-label",
 					"aria-labelledby",
@@ -17351,9 +18122,10 @@ var DropdownComponent = class DropdownComponent {
 					"maxWidth",
 					"closeOnOutsideClick",
 					"closeOnEscape",
-					"scrollBehavior"
+					"scrollBehavior",
+					"contextMenu"
 				],
-				outputs: ["closeRequested"]
+				outputs: ["closeRequested", "openRequested"]
 			}
 		],
 		changeDetection: i0.ChangeDetectionStrategy.OnPush
@@ -21159,316 +21931,6 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
-var MenuComponent = class MenuComponent {
-	injector = inject(Injector);
-	i18n = inject(EagamiI18nService);
-	listEl = viewChild("listEl", ...ngDevMode ? [{ debugName: "listEl" }] : 	/* istanbul ignore next */ []);
-	placement = input("bottom-start", ...ngDevMode ? [{ debugName: "placement" }] : 	/* istanbul ignore next */ []);
-	size = input("md", ...ngDevMode ? [{ debugName: "size" }] : 	/* istanbul ignore next */ []);
-	maxHeight = input("20rem", ...ngDevMode ? [{ debugName: "maxHeight" }] : 	/* istanbul ignore next */ []);
-	disabled = input(false, ...ngDevMode ? [{ debugName: "disabled" }] : 	/* istanbul ignore next */ []);
-	ariaLabel = input(void 0, {
-		...ngDevMode ? { debugName: "ariaLabel" } : 		/* istanbul ignore next */ {},
-		alias: "aria-label"
-	});
-	id = input(uniqueId("ea-menu"), ...ngDevMode ? [{ debugName: "id" }] : 	/* istanbul ignore next */ []);
-	resolvedAriaLabel = computed(() => this.ariaLabel() ?? this.i18n.messages().menu.label, ...ngDevMode ? [{ debugName: "resolvedAriaLabel" }] : 	/* istanbul ignore next */ []);
-	open = model(false, ...ngDevMode ? [{ debugName: "open" }] : 	/* istanbul ignore next */ []);
-	opened = output();
-	closed = output();
-	triggerEl = signal(void 0, ...ngDevMode ? [{ debugName: "triggerEl" }] : 	/* istanbul ignore next */ []);
-	activeItemId = signal(null, ...ngDevMode ? [{ debugName: "activeItemId" }] : 	/* istanbul ignore next */ []);
-	constructor() {
-		effect(() => {
-			if (!this.open()) {
-				this.activeItemId.set(null);
-				return;
-			}
-			afterNextRender(() => {
-				if (this.open() && !this.activeItemId()) {
-					const first = this.getEnabledItems()[0];
-					if (first) this.activeItemId.set(first.id);
-				}
-			}, { injector: this.injector });
-		});
-	}
-	toggleAt(triggerEl) {
-		if (this.disabled()) return;
-		if (this.open()) this.close();
-		else this.openAt(triggerEl);
-	}
-	openAt(triggerEl) {
-		if (this.disabled()) return;
-		this.triggerEl.set(triggerEl);
-		this.open.set(true);
-		this.opened.emit();
-		afterNextRender(() => this.focusFirstItem(), { injector: this.injector });
-	}
-	close(restoreFocus = false) {
-		if (!this.open()) return;
-		this.open.set(false);
-		this.closed.emit();
-		if (restoreFocus) this.triggerEl()?.focus({ preventScroll: true });
-	}
-	onPopoverCloseRequested() {
-		this.close();
-	}
-	getEnabledItems() {
-		const list = this.listEl()?.nativeElement;
-		if (!list) return [];
-		return Array.from(list.querySelectorAll("[role=\"menuitem\"]:not([disabled])"));
-	}
-	focusFirstItem() {
-		this.focusItem(this.getEnabledItems()[0]);
-	}
-	focusItem(item) {
-		if (!item) return;
-		this.activeItemId.set(item.id);
-		item.focus({ preventScroll: true });
-	}
-	onKeydown(event) {
-		if (!this.open()) return;
-		const list = this.listEl()?.nativeElement;
-		const active = document.activeElement;
-		if (!list || !active || !list.contains(active)) return;
-		const items = this.getEnabledItems();
-		if (items.length === 0) return;
-		const current = items.indexOf(active);
-		let next = -1;
-		switch (event.key) {
-			case "ArrowDown":
-				event.preventDefault();
-				next = current < items.length - 1 ? current + 1 : 0;
-				break;
-			case "ArrowUp":
-				event.preventDefault();
-				next = current > 0 ? current - 1 : items.length - 1;
-				break;
-			case "Home":
-				event.preventDefault();
-				next = 0;
-				break;
-			case "End":
-				event.preventDefault();
-				next = items.length - 1;
-				break;
-		}
-		if (next >= 0) this.focusItem(items[next]);
-	}
-	onEscape(event) {
-		if (!this.open()) return;
-		event.preventDefault();
-		this.close(true);
-	}
-	static ɵfac = i0.ɵɵngDeclareFactory({
-		minVersion: "12.0.0",
-		version: "22.2.0",
-		ngImport: i0,
-		type: MenuComponent,
-		deps: [],
-		target: i0.ɵɵFactoryTarget.Component
-	});
-	static ɵcmp = i0.ɵɵngDeclareComponent({
-		minVersion: "17.2.0",
-		version: "22.2.0",
-		type: MenuComponent,
-		isStandalone: true,
-		selector: "ea-menu",
-		inputs: {
-			placement: {
-				classPropertyName: "placement",
-				publicName: "placement",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			},
-			size: {
-				classPropertyName: "size",
-				publicName: "size",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			},
-			maxHeight: {
-				classPropertyName: "maxHeight",
-				publicName: "maxHeight",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			},
-			disabled: {
-				classPropertyName: "disabled",
-				publicName: "disabled",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			},
-			ariaLabel: {
-				classPropertyName: "ariaLabel",
-				publicName: "aria-label",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			},
-			id: {
-				classPropertyName: "id",
-				publicName: "id",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			},
-			open: {
-				classPropertyName: "open",
-				publicName: "open",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			}
-		},
-		outputs: {
-			open: "openChange",
-			opened: "opened",
-			closed: "closed"
-		},
-		host: { listeners: {
-			"document:keydown": "onKeydown($event)",
-			"document:keydown.escape": "onEscape($event)"
-		} },
-		viewQueries: [{
-			propertyName: "listEl",
-			first: true,
-			predicate: ["listEl"],
-			descendants: true,
-			isSignal: true
-		}],
-		ngImport: i0,
-		template: "<ea-popover\n  [anchor]=\"triggerEl()\"\n  [open]=\"open()\"\n  [placement]=\"placement()\"\n  role=\"menu\"\n  [surfaceId]=\"id()\"\n  [aria-label]=\"resolvedAriaLabel()\"\n  [closeOnEscape]=\"false\"\n  scrollBehavior=\"reposition\"\n  (closeRequested)=\"onPopoverCloseRequested()\">\n  <div\n    #listEl\n    class=\"ea-menu__list ea-menu__list--{{ size() }}\"\n    [style.max-height]=\"maxHeight()\">\n    <ng-content />\n  </div>\n</ea-popover>\n",
-		styles: [":host{display:contents}.ea-menu__list{min-width:10em;padding:.25em 0;overflow-y:auto;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);background-color:var(--ea-menu-list-background-color, var(--color-bg-elevated))}@media(forced-colors:active){.ea-menu__list{border:1px solid CanvasText}}.ea-menu__list--2xs{font-size:var(--font-size-2xs)}.ea-menu__list--xs{font-size:var(--font-size-xs)}.ea-menu__list--sm{font-size:var(--font-size-sm)}.ea-menu__list--md{font-size:var(--font-size-md)}.ea-menu__list--lg{font-size:var(--font-size-lg)}.ea-menu__list--xl{font-size:var(--font-size-xl)}\n"],
-		dependencies: [{
-			kind: "component",
-			type: PopoverComponent,
-			selector: "ea-popover",
-			inputs: [
-				"anchor",
-				"open",
-				"placement",
-				"role",
-				"aria-label",
-				"aria-labelledby",
-				"trapFocus",
-				"surfaceId",
-				"offset",
-				"flip",
-				"clamp",
-				"matchAnchorWidth",
-				"maxWidth",
-				"closeOnOutsideClick",
-				"closeOnEscape",
-				"scrollBehavior"
-			],
-			outputs: ["closeRequested"]
-		}],
-		changeDetection: i0.ChangeDetectionStrategy.OnPush
-	});
-};
-i0.ɵɵngDeclareClassMetadata({
-	minVersion: "12.0.0",
-	version: "22.2.0",
-	ngImport: i0,
-	type: MenuComponent,
-	decorators: [{
-		type: Component,
-		args: [{
-			selector: "ea-menu",
-			imports: [PopoverComponent],
-			changeDetection: ChangeDetectionStrategy.OnPush,
-			template: "<ea-popover\n  [anchor]=\"triggerEl()\"\n  [open]=\"open()\"\n  [placement]=\"placement()\"\n  role=\"menu\"\n  [surfaceId]=\"id()\"\n  [aria-label]=\"resolvedAriaLabel()\"\n  [closeOnEscape]=\"false\"\n  scrollBehavior=\"reposition\"\n  (closeRequested)=\"onPopoverCloseRequested()\">\n  <div\n    #listEl\n    class=\"ea-menu__list ea-menu__list--{{ size() }}\"\n    [style.max-height]=\"maxHeight()\">\n    <ng-content />\n  </div>\n</ea-popover>\n",
-			styles: [":host{display:contents}.ea-menu__list{min-width:10em;padding:.25em 0;overflow-y:auto;border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);background-color:var(--ea-menu-list-background-color, var(--color-bg-elevated))}@media(forced-colors:active){.ea-menu__list{border:1px solid CanvasText}}.ea-menu__list--2xs{font-size:var(--font-size-2xs)}.ea-menu__list--xs{font-size:var(--font-size-xs)}.ea-menu__list--sm{font-size:var(--font-size-sm)}.ea-menu__list--md{font-size:var(--font-size-md)}.ea-menu__list--lg{font-size:var(--font-size-lg)}.ea-menu__list--xl{font-size:var(--font-size-xl)}\n"]
-		}]
-	}],
-	ctorParameters: () => [],
-	propDecorators: {
-		listEl: [{
-			type: i0.ViewChild,
-			args: ["listEl", { isSignal: true }]
-		}],
-		placement: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "placement",
-				required: false
-			}]
-		}],
-		size: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "size",
-				required: false
-			}]
-		}],
-		maxHeight: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "maxHeight",
-				required: false
-			}]
-		}],
-		disabled: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "disabled",
-				required: false
-			}]
-		}],
-		ariaLabel: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "aria-label",
-				required: false
-			}]
-		}],
-		id: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "id",
-				required: false
-			}]
-		}],
-		open: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "open",
-				required: false
-			}]
-		}, {
-			type: i0.Output,
-			args: ["openChange"]
-		}],
-		opened: [{
-			type: i0.Output,
-			args: ["opened"]
-		}],
-		closed: [{
-			type: i0.Output,
-			args: ["closed"]
-		}],
-		onKeydown: [{
-			type: HostListener,
-			args: ["document:keydown", ["$event"]]
-		}],
-		onEscape: [{
-			type: HostListener,
-			args: ["document:keydown.escape", ["$event"]]
-		}]
-	}
-});
 var MenuItemComponent = class MenuItemComponent {
 	menu = inject(MenuComponent, { optional: true });
 	itemId = uniqueId("ea-menu-item");
@@ -22596,6 +23058,7 @@ var MultiSelectComponent = class MultiSelectComponent {
 					"anchor",
 					"open",
 					"placement",
+					"anchorPoint",
 					"role",
 					"aria-label",
 					"aria-labelledby",
@@ -22608,9 +23071,10 @@ var MultiSelectComponent = class MultiSelectComponent {
 					"maxWidth",
 					"closeOnOutsideClick",
 					"closeOnEscape",
-					"scrollBehavior"
+					"scrollBehavior",
+					"contextMenu"
 				],
-				outputs: ["closeRequested"]
+				outputs: ["closeRequested", "openRequested"]
 			},
 			{
 				kind: "component",
@@ -29623,6 +30087,7 @@ var TimePickerComponent = class TimePickerComponent {
 					"anchor",
 					"open",
 					"placement",
+					"anchorPoint",
 					"role",
 					"aria-label",
 					"aria-labelledby",
@@ -29635,9 +30100,10 @@ var TimePickerComponent = class TimePickerComponent {
 					"maxWidth",
 					"closeOnOutsideClick",
 					"closeOnEscape",
-					"scrollBehavior"
+					"scrollBehavior",
+					"contextMenu"
 				],
-				outputs: ["closeRequested"]
+				outputs: ["closeRequested", "openRequested"]
 			},
 			{
 				kind: "component",
@@ -73353,6 +73819,6 @@ const ICONS = [
 	ZoomInIconComponent,
 	ZoomOutIconComponent
 ].sort((a, b) => a.slug.localeCompare(b.slug));
-export { AccessibilityIconComponent, AccordionComponent, AccordionItemComponent, ActivityIconComponent, AirplayIconComponent, AlarmClockIconComponent, AlertCircleIconComponent, AlertComponent, AlertOctagonIconComponent, AlertTriangleIconComponent, AlignCenterIconComponent, AlignJustifyIconComponent, AlignLeftIconComponent, AlignRightIconComponent, AnchorIconComponent, AndroidIconComponent, AngularIconComponent, AnthropicIconComponent, ApertureIconComponent, ArchiveIconComponent, ArrayIconComponent, ArrowDownCircleIconComponent, ArrowDownIconComponent, ArrowDownLeftIconComponent, ArrowDownRightIconComponent, ArrowLeftCircleIconComponent, ArrowLeftIconComponent, ArrowLeftRightIconComponent, ArrowRightCircleIconComponent, ArrowRightIconComponent, ArrowUpCircleIconComponent, ArrowUpDownIconComponent, ArrowUpIconComponent, ArrowUpLeftIconComponent, ArrowUpRightIconComponent, AspectRatioIconComponent, AtSignIconComponent, AutocompleteComponent, AvatarComponent, AvatarEditorComponent, AwardIconComponent, BadgeCheckIconComponent, BadgeComponent, BanIconComponent, BarChart2IconComponent, BarChartComponent, BarChartIconComponent, BatteryChargingIconComponent, BatteryIconComponent, BellIconComponent, BellOffIconComponent, BellRingIconComponent, BitcoinIconComponent, BlueskyIconComponent, BluetoothIconComponent, BoldIconComponent, BookIconComponent, BookOpenIconComponent, BookmarkCheckIconComponent, BookmarkIconComponent, BookmarkPlusIconComponent, BoomboxIconComponent, BotIconComponent, BottleIconComponent, BoxIconComponent, BrainIconComponent, BreadcrumbsComponent, BriefcaseIconComponent, BugIconComponent, BuildingIconComponent, ButtonComponent, ButtonLinkComponent, CalculatorIconComponent, CalendarCheckIconComponent, CalendarDaysIconComponent, CalendarIconComponent, CalendarPlusIconComponent, CameraIconComponent, CameraOffIconComponent, CandleIconComponent, CardComponent, CassetteTapeIconComponent, CastIconComponent, CheckCheckIconComponent, CheckCircleIconComponent, CheckIconComponent, CheckSquareIconComponent, CheckboxComponent, ChevronDownIconComponent, ChevronLeftIconComponent, ChevronRightIconComponent, ChevronUpIconComponent, ChevronsDownIconComponent, ChevronsLeftIconComponent, ChevronsRightIconComponent, ChevronsUpDownIconComponent, ChevronsUpIconComponent, ChromeIconComponent, CircleIconComponent, ClapperboardIconComponent, ClipboardCheckIconComponent, ClipboardIconComponent, ClipboardListIconComponent, ClipboardPasteIconComponent, ClockIconComponent, CloudDrizzleIconComponent, CloudIconComponent, CloudLightningIconComponent, CloudOffIconComponent, CloudRainIconComponent, CloudSnowIconComponent, CloudSunIconComponent, CloudflareIconComponent, CodeIconComponent, CodeInputComponent, CodepenIconComponent, CodesandboxIconComponent, CoffeeIconComponent, CoinsIconComponent, ColorPickerComponent, ColumnsIconComponent, CommandIconComponent, CommandPaletteComponent, CompassIconComponent, ContrastIconComponent, CookieIconComponent, CopyIconComponent, CornerDownLeftIconComponent, CornerDownRightIconComponent, CornerLeftDownIconComponent, CornerLeftUpIconComponent, CornerRightDownIconComponent, CornerRightUpIconComponent, CornerUpLeftIconComponent, CornerUpRightIconComponent, CosineWaveIconComponent, CpuIconComponent, CreditCardIconComponent, CropIconComponent, CrosshairIconComponent, CrownIconComponent, DEFAULT_PALETTE_ROLES, DataTableComponent, DatabaseIconComponent, DatePickerComponent, DeleteIconComponent, DialogComponent, DiamondIconComponent, Dice1IconComponent, Dice2IconComponent, Dice3IconComponent, Dice4IconComponent, Dice5IconComponent, Dice6IconComponent, DiscIconComponent, DiscordIconComponent, DivideCircleIconComponent, DivideIconComponent, DivideSquareIconComponent, DividerComponent, DockerIconComponent, DollarSignIconComponent, DoubleExclamationMarkIconComponent, DoubleQuestionMarkIconComponent, DownloadCloudIconComponent, DownloadIconComponent, DrawerComponent, DribbbleIconComponent, DropboxIconComponent, DropdownComponent, DropletIconComponent, EAGAMI_ALL_LOCALES, EAGAMI_I18N_CONFIG, EAGAMI_LOCALES, EAGAMI_LOCALE_META, EagamiI18nService, EagamiIconComponent, EagamiWordmarkComponent, Edit2IconComponent, Edit3IconComponent, EditIconComponent, EjectIconComponent, EmptyStateComponent, EuroIconComponent, ExclamationMarkIconComponent, ExclamationQuestionMarkIconComponent, ExternalLinkIconComponent, EyeIconComponent, EyeOffIconComponent, Facebook2IconComponent, FacebookIconComponent, FastForwardIconComponent, FeatherIconComponent, FieldLabelComponent, FieldMessagesComponent, Figma2IconComponent, FigmaIconComponent, FileAudioIconComponent, FileCheckIconComponent, FileCodeIconComponent, FileIconComponent, FileImageIconComponent, FileMinusIconComponent, FilePdfIconComponent, FilePlusIconComponent, FileTextIconComponent, FileUploaderComponent, FileVideoIconComponent, FilmIconComponent, FilterIconComponent, FilterXIconComponent, FingerprintIconComponent, FirstPlaceMedalIconComponent, FlagIconComponent, FlameIconComponent, FlaskConicalIconComponent, FolderIconComponent, FolderMinusIconComponent, FolderOpenIconComponent, FolderPlusIconComponent, FormFieldComponent, ForwardIconComponent, FramerIconComponent, FrownIconComponent, GaugeIconComponent, GeminiIconComponent, GiftIconComponent, GitBranchIconComponent, GitCommitIconComponent, GitCompareIconComponent, GitMergeIconComponent, GitPullRequestIconComponent, Github2IconComponent, GithubIconComponent, GitlabIconComponent, GlobeIconComponent, GoogleIconComponent, GraduationCapIconComponent, GridIconComponent, GripHorizontalIconComponent, GripVerticalIconComponent, HalfCircleIconComponent, HalfHeartIconComponent, HardDriveIconComponent, HashIconComponent, HeadphonesIconComponent, HeadsetIconComponent, HeartIconComponent, HelpCircleIconComponent, HeptagonIconComponent, HexagonIconComponent, HistoryIconComponent, HomeIconComponent, HourglassIconComponent, ICONS, IconComponentBase, ImageIconComponent, ImagePlayIconComponent, ImagePlusIconComponent, ImageSearchIconComponent, ImagesIconComponent, InboxIconComponent, InfoIconComponent, InputComponent, InstagramIconComponent, ItalicIconComponent, KeyIconComponent, KeyboardIconComponent, KeyframeIconComponent, KubernetesIconComponent, LampIconComponent, LanguagesIconComponent, LaptopIconComponent, LayersIconComponent, LayoutDashboardIconComponent, LayoutIconComponent, LeafIconComponent, LeftHalfStarIconComponent, LifeBuoyIconComponent, LightbulbIconComponent, LineChartComponent, Link2IconComponent, LinkIconComponent, Linkedin2IconComponent, LinkedinIconComponent, ListChecksIconComponent, ListIconComponent, ListOrderedIconComponent, LoaderIconComponent, LockIconComponent, LogInIconComponent, LogOutIconComponent, MailCheckIconComponent, MailIconComponent, MapIconComponent, MapPinIconComponent, MastercardIconComponent, Maximize2IconComponent, MaximizeIconComponent, MegaphoneIconComponent, MehIconComponent, MenuComponent, MenuIconComponent, MenuItemComponent, MenuTriggerDirective, MessageCircleIconComponent, MessageSquareIconComponent, MicIconComponent, MicOffIconComponent, MicVocalIconComponent, MicroscopeIconComponent, MicrosoftIconComponent, Minimize2IconComponent, MinimizeIconComponent, MinusCircleIconComponent, MinusIconComponent, MinusSquareIconComponent, MongodbIconComponent, MonitorIconComponent, MonitorPlayIconComponent, MoonIconComponent, MoreHorizontalIconComponent, MoreVerticalIconComponent, MousePointerIconComponent, MoveIconComponent, MultiSelectComponent, MusicIconComponent, Navigation2IconComponent, NavigationIconComponent, NetlifyIconComponent, NewspaperIconComponent, NodejsIconComponent, NotionIconComponent, NpmIconComponent, NumberInputComponent, OctagonIconComponent, PAGE_SIZE_ALL, PackageIconComponent, PaginatorComponent, PaletteIconComponent, PaperclipIconComponent, PauseCircleIconComponent, PauseIconComponent, PaypalIconComponent, PenToolIconComponent, PentagonIconComponent, PercentIconComponent, PhoneCallIconComponent, PhoneForwardedIconComponent, PhoneIconComponent, PhoneIncomingIconComponent, PhoneMissedIconComponent, PhoneOffIconComponent, PhoneOutgoingIconComponent, PictureInPictureIconComponent, PieChartComponent, PieChartIconComponent, PinIconComponent, PinterestIconComponent, PlaneIconComponent, PlayCircleIconComponent, PlayIconComponent, PlaylistIconComponent, PlugIconComponent, PlusCircleIconComponent, PlusIconComponent, PlusSquareIconComponent, PocketIconComponent, PodcastIconComponent, PopoverComponent, PowerIconComponent, PrinterIconComponent, ProgressBarComponent, ProjectorIconComponent, PythonIconComponent, QrCodeIconComponent, QuestionExclamationMarkIconComponent, QuestionMarkIconComponent, QuoteIconComponent, RadioComponent, RadioGroupComponent, RadioIconComponent, RadioReceiverIconComponent, RadioTowerIconComponent, RangeSliderComponent, RatingComponent, ReactIconComponent, ReceiptIconComponent, RecordIconComponent, RectangleHorizontalIconComponent, RectangleVerticalIconComponent, RedditIconComponent, RedoIconComponent, RefreshCcwIconComponent, RefreshCwIconComponent, Repeat1IconComponent, RepeatIconComponent, ReplyIconComponent, RewindIconComponent, RightHalfStarIconComponent, RocketIconComponent, RotateCcwIconComponent, RotateCcwSquareIconComponent, RotateCwIconComponent, RowsIconComponent, RssIconComponent, SaveIconComponent, ScanIconComponent, ScissorsIconComponent, ScreenShareIconComponent, SearchIconComponent, SecondPlaceMedalIconComponent, SegmentedComponent, SendIconComponent, ServerIconComponent, SettingsIconComponent, Share2IconComponent, ShareIconComponent, ShieldAlertIconComponent, ShieldCheckIconComponent, ShieldIconComponent, ShieldOffIconComponent, ShopifyIconComponent, ShoppingBagIconComponent, ShoppingCartIconComponent, ShuffleIconComponent, SidebarIconComponent, SineWaveIconComponent, SkeletonComponent, SkipBackIconComponent, SkipForwardIconComponent, Slack2IconComponent, SlackIconComponent, SlashIconComponent, SliderComponent, SlidersIconComponent, SmartphoneIconComponent, SmileIconComponent, SnowflakeIconComponent, SoccerBallIconComponent, SparklesIconComponent, SpeakerIconComponent, SpinnerComponent, SpotifyIconComponent, SquareIconComponent, SquarePlayIconComponent, StarIconComponent, StepBackIconComponent, StepComponent, StepForwardIconComponent, StepperComponent, StopCircleIconComponent, StrikethroughIconComponent, StripeIconComponent, SubtitlesIconComponent, SubtitlesOffIconComponent, SunIconComponent, SunriseIconComponent, SunsetIconComponent, SvelteIconComponent, SwitchCameraIconComponent, SwitchComponent, TabComponent, TableIconComponent, TabletIconComponent, TabsComponent, TagComponent, TagIconComponent, TailwindIconComponent, TargetIconComponent, TelegramIconComponent, TerminalIconComponent, TextareaComponent, ThermometerIconComponent, ThirdPlaceMedalIconComponent, ThreadsIconComponent, ThumbsDownIconComponent, ThumbsUpIconComponent, TiktokIconComponent, TimePickerComponent, TimecodeIconComponent, TimelineComponent, TimerIconComponent, ToastComponent, ToastService, ToggleLeftIconComponent, ToggleRightIconComponent, ToolIconComponent, TooltipDirective, TranscodeIconComponent, TransferListComponent, Trash2IconComponent, TrashIconComponent, TreeComponent, TrelloIconComponent, TrendingDownIconComponent, TrendingUpIconComponent, TriangleIconComponent, TrimIconComponent, TrophyIconComponent, TruckIconComponent, TvIconComponent, Twitch2IconComponent, TwitchIconComponent, TwitterIconComponent, TypeIconComponent, UmbrellaIconComponent, UnderlineIconComponent, UndoIconComponent, UnlinkIconComponent, UnlockIconComponent, UploadCloudIconComponent, UploadIconComponent, UserCheckIconComponent, UserCircleIconComponent, UserIconComponent, UserMinusIconComponent, UserPlusIconComponent, UserXIconComponent, UsersIconComponent, VercelIconComponent, VideoIconComponent, VideoOffIconComponent, VirtualListComponent, VoicemailIconComponent, Volume1IconComponent, Volume2IconComponent, VolumeIconComponent, VolumeXIconComponent, VueIconComponent, WCAG_AA, WalletIconComponent, WandIconComponent, WatchIconComponent, WaveformIconComponent, WebcamIconComponent, WhatsappIconComponent, WifiIconComponent, WifiOffIconComponent, WindIconComponent, WordpressIconComponent, XCircleIconComponent, XIconComponent, XOctagonIconComponent, XSquareIconComponent, XTwitterIconComponent, Youtube2IconComponent, YoutubeIconComponent, ZapIconComponent, ZapOffIconComponent, ZoomInIconComponent, ZoomOutIconComponent, applyPalette, ar, computePopoverPosition, contrastRatio, de, derivePalette, el, en, esES, formatViolations, frFR, frenchSpacing, he, hexToOklch, hi, iconDisplayName, is, isGrouped, nl, oklchToHex, pl, provideEagamiUi, ptBR, relativeLuminance, ru, uk, validatePalette, visibleNodeIds, walkTree, zhCN };
+export { AccessibilityIconComponent, AccordionComponent, AccordionItemComponent, ActivityIconComponent, AirplayIconComponent, AlarmClockIconComponent, AlertCircleIconComponent, AlertComponent, AlertOctagonIconComponent, AlertTriangleIconComponent, AlignCenterIconComponent, AlignJustifyIconComponent, AlignLeftIconComponent, AlignRightIconComponent, AnchorIconComponent, AndroidIconComponent, AngularIconComponent, AnthropicIconComponent, ApertureIconComponent, ArchiveIconComponent, ArrayIconComponent, ArrowDownCircleIconComponent, ArrowDownIconComponent, ArrowDownLeftIconComponent, ArrowDownRightIconComponent, ArrowLeftCircleIconComponent, ArrowLeftIconComponent, ArrowLeftRightIconComponent, ArrowRightCircleIconComponent, ArrowRightIconComponent, ArrowUpCircleIconComponent, ArrowUpDownIconComponent, ArrowUpIconComponent, ArrowUpLeftIconComponent, ArrowUpRightIconComponent, AspectRatioIconComponent, AtSignIconComponent, AutocompleteComponent, AvatarComponent, AvatarEditorComponent, AwardIconComponent, BadgeCheckIconComponent, BadgeComponent, BanIconComponent, BarChart2IconComponent, BarChartComponent, BarChartIconComponent, BatteryChargingIconComponent, BatteryIconComponent, BellIconComponent, BellOffIconComponent, BellRingIconComponent, BitcoinIconComponent, BlueskyIconComponent, BluetoothIconComponent, BoldIconComponent, BookIconComponent, BookOpenIconComponent, BookmarkCheckIconComponent, BookmarkIconComponent, BookmarkPlusIconComponent, BoomboxIconComponent, BotIconComponent, BottleIconComponent, BoxIconComponent, BrainIconComponent, BreadcrumbsComponent, BriefcaseIconComponent, BugIconComponent, BuildingIconComponent, ButtonComponent, ButtonLinkComponent, CalculatorIconComponent, CalendarCheckIconComponent, CalendarDaysIconComponent, CalendarIconComponent, CalendarPlusIconComponent, CameraIconComponent, CameraOffIconComponent, CandleIconComponent, CardComponent, CassetteTapeIconComponent, CastIconComponent, CheckCheckIconComponent, CheckCircleIconComponent, CheckIconComponent, CheckSquareIconComponent, CheckboxComponent, ChevronDownIconComponent, ChevronLeftIconComponent, ChevronRightIconComponent, ChevronUpIconComponent, ChevronsDownIconComponent, ChevronsLeftIconComponent, ChevronsRightIconComponent, ChevronsUpDownIconComponent, ChevronsUpIconComponent, ChromeIconComponent, CircleIconComponent, ClapperboardIconComponent, ClipboardCheckIconComponent, ClipboardIconComponent, ClipboardListIconComponent, ClipboardPasteIconComponent, ClockIconComponent, CloudDrizzleIconComponent, CloudIconComponent, CloudLightningIconComponent, CloudOffIconComponent, CloudRainIconComponent, CloudSnowIconComponent, CloudSunIconComponent, CloudflareIconComponent, CodeIconComponent, CodeInputComponent, CodepenIconComponent, CodesandboxIconComponent, CoffeeIconComponent, CoinsIconComponent, ColorPickerComponent, ColumnsIconComponent, CommandIconComponent, CommandPaletteComponent, CompassIconComponent, ContextMenuTriggerDirective, ContrastIconComponent, CookieIconComponent, CopyIconComponent, CornerDownLeftIconComponent, CornerDownRightIconComponent, CornerLeftDownIconComponent, CornerLeftUpIconComponent, CornerRightDownIconComponent, CornerRightUpIconComponent, CornerUpLeftIconComponent, CornerUpRightIconComponent, CosineWaveIconComponent, CpuIconComponent, CreditCardIconComponent, CropIconComponent, CrosshairIconComponent, CrownIconComponent, DEFAULT_PALETTE_ROLES, DataTableComponent, DatabaseIconComponent, DatePickerComponent, DeleteIconComponent, DialogComponent, DialogRef, DialogService, DiamondIconComponent, Dice1IconComponent, Dice2IconComponent, Dice3IconComponent, Dice4IconComponent, Dice5IconComponent, Dice6IconComponent, DiscIconComponent, DiscordIconComponent, DivideCircleIconComponent, DivideIconComponent, DivideSquareIconComponent, DividerComponent, DockerIconComponent, DollarSignIconComponent, DoubleExclamationMarkIconComponent, DoubleQuestionMarkIconComponent, DownloadCloudIconComponent, DownloadIconComponent, DrawerComponent, DribbbleIconComponent, DropboxIconComponent, DropdownComponent, DropletIconComponent, EAGAMI_ALL_LOCALES, EAGAMI_I18N_CONFIG, EAGAMI_LOCALES, EAGAMI_LOCALE_META, EagamiI18nService, EagamiIconComponent, EagamiWordmarkComponent, Edit2IconComponent, Edit3IconComponent, EditIconComponent, EjectIconComponent, EmptyStateComponent, EuroIconComponent, ExclamationMarkIconComponent, ExclamationQuestionMarkIconComponent, ExternalLinkIconComponent, EyeIconComponent, EyeOffIconComponent, Facebook2IconComponent, FacebookIconComponent, FastForwardIconComponent, FeatherIconComponent, FieldLabelComponent, FieldMessagesComponent, Figma2IconComponent, FigmaIconComponent, FileAudioIconComponent, FileCheckIconComponent, FileCodeIconComponent, FileIconComponent, FileImageIconComponent, FileMinusIconComponent, FilePdfIconComponent, FilePlusIconComponent, FileTextIconComponent, FileUploaderComponent, FileVideoIconComponent, FilmIconComponent, FilterIconComponent, FilterXIconComponent, FingerprintIconComponent, FirstPlaceMedalIconComponent, FlagIconComponent, FlameIconComponent, FlaskConicalIconComponent, FolderIconComponent, FolderMinusIconComponent, FolderOpenIconComponent, FolderPlusIconComponent, FormFieldComponent, ForwardIconComponent, FramerIconComponent, FrownIconComponent, GaugeIconComponent, GeminiIconComponent, GiftIconComponent, GitBranchIconComponent, GitCommitIconComponent, GitCompareIconComponent, GitMergeIconComponent, GitPullRequestIconComponent, Github2IconComponent, GithubIconComponent, GitlabIconComponent, GlobeIconComponent, GoogleIconComponent, GraduationCapIconComponent, GridIconComponent, GripHorizontalIconComponent, GripVerticalIconComponent, HalfCircleIconComponent, HalfHeartIconComponent, HardDriveIconComponent, HashIconComponent, HeadphonesIconComponent, HeadsetIconComponent, HeartIconComponent, HelpCircleIconComponent, HeptagonIconComponent, HexagonIconComponent, HistoryIconComponent, HomeIconComponent, HourglassIconComponent, ICONS, IconComponentBase, ImageIconComponent, ImagePlayIconComponent, ImagePlusIconComponent, ImageSearchIconComponent, ImagesIconComponent, InboxIconComponent, InfoIconComponent, InputComponent, InstagramIconComponent, ItalicIconComponent, KeyIconComponent, KeyboardIconComponent, KeyframeIconComponent, KubernetesIconComponent, LampIconComponent, LanguagesIconComponent, LaptopIconComponent, LayersIconComponent, LayoutDashboardIconComponent, LayoutIconComponent, LeafIconComponent, LeftHalfStarIconComponent, LifeBuoyIconComponent, LightbulbIconComponent, LineChartComponent, Link2IconComponent, LinkIconComponent, Linkedin2IconComponent, LinkedinIconComponent, ListChecksIconComponent, ListIconComponent, ListOrderedIconComponent, LoaderIconComponent, LockIconComponent, LogInIconComponent, LogOutIconComponent, MailCheckIconComponent, MailIconComponent, MapIconComponent, MapPinIconComponent, MastercardIconComponent, Maximize2IconComponent, MaximizeIconComponent, MegaphoneIconComponent, MehIconComponent, MenuComponent, MenuIconComponent, MenuItemComponent, MenuTriggerDirective, MessageCircleIconComponent, MessageSquareIconComponent, MicIconComponent, MicOffIconComponent, MicVocalIconComponent, MicroscopeIconComponent, MicrosoftIconComponent, Minimize2IconComponent, MinimizeIconComponent, MinusCircleIconComponent, MinusIconComponent, MinusSquareIconComponent, MongodbIconComponent, MonitorIconComponent, MonitorPlayIconComponent, MoonIconComponent, MoreHorizontalIconComponent, MoreVerticalIconComponent, MousePointerIconComponent, MoveIconComponent, MultiSelectComponent, MusicIconComponent, Navigation2IconComponent, NavigationIconComponent, NetlifyIconComponent, NewspaperIconComponent, NodejsIconComponent, NotionIconComponent, NpmIconComponent, NumberInputComponent, OctagonIconComponent, PAGE_SIZE_ALL, PackageIconComponent, PaginatorComponent, PaletteIconComponent, PaperclipIconComponent, PauseCircleIconComponent, PauseIconComponent, PaypalIconComponent, PenToolIconComponent, PentagonIconComponent, PercentIconComponent, PhoneCallIconComponent, PhoneForwardedIconComponent, PhoneIconComponent, PhoneIncomingIconComponent, PhoneMissedIconComponent, PhoneOffIconComponent, PhoneOutgoingIconComponent, PictureInPictureIconComponent, PieChartComponent, PieChartIconComponent, PinIconComponent, PinterestIconComponent, PlaneIconComponent, PlayCircleIconComponent, PlayIconComponent, PlaylistIconComponent, PlugIconComponent, PlusCircleIconComponent, PlusIconComponent, PlusSquareIconComponent, PocketIconComponent, PodcastIconComponent, PopoverComponent, PowerIconComponent, PrinterIconComponent, ProgressBarComponent, ProjectorIconComponent, PythonIconComponent, QrCodeIconComponent, QuestionExclamationMarkIconComponent, QuestionMarkIconComponent, QuoteIconComponent, RadioComponent, RadioGroupComponent, RadioIconComponent, RadioReceiverIconComponent, RadioTowerIconComponent, RangeSliderComponent, RatingComponent, ReactIconComponent, ReceiptIconComponent, RecordIconComponent, RectangleHorizontalIconComponent, RectangleVerticalIconComponent, RedditIconComponent, RedoIconComponent, RefreshCcwIconComponent, RefreshCwIconComponent, Repeat1IconComponent, RepeatIconComponent, ReplyIconComponent, RewindIconComponent, RightHalfStarIconComponent, RocketIconComponent, RotateCcwIconComponent, RotateCcwSquareIconComponent, RotateCwIconComponent, RowsIconComponent, RssIconComponent, SaveIconComponent, ScanIconComponent, ScissorsIconComponent, ScreenShareIconComponent, SearchIconComponent, SecondPlaceMedalIconComponent, SegmentedComponent, SendIconComponent, ServerIconComponent, SettingsIconComponent, Share2IconComponent, ShareIconComponent, ShieldAlertIconComponent, ShieldCheckIconComponent, ShieldIconComponent, ShieldOffIconComponent, ShopifyIconComponent, ShoppingBagIconComponent, ShoppingCartIconComponent, ShuffleIconComponent, SidebarIconComponent, SineWaveIconComponent, SkeletonComponent, SkipBackIconComponent, SkipForwardIconComponent, Slack2IconComponent, SlackIconComponent, SlashIconComponent, SliderComponent, SlidersIconComponent, SmartphoneIconComponent, SmileIconComponent, SnowflakeIconComponent, SoccerBallIconComponent, SparklesIconComponent, SpeakerIconComponent, SpinnerComponent, SpotifyIconComponent, SquareIconComponent, SquarePlayIconComponent, StarIconComponent, StepBackIconComponent, StepComponent, StepForwardIconComponent, StepperComponent, StopCircleIconComponent, StrikethroughIconComponent, StripeIconComponent, SubtitlesIconComponent, SubtitlesOffIconComponent, SunIconComponent, SunriseIconComponent, SunsetIconComponent, SvelteIconComponent, SwitchCameraIconComponent, SwitchComponent, TabComponent, TableIconComponent, TabletIconComponent, TabsComponent, TagComponent, TagIconComponent, TailwindIconComponent, TargetIconComponent, TelegramIconComponent, TerminalIconComponent, TextareaComponent, ThermometerIconComponent, ThirdPlaceMedalIconComponent, ThreadsIconComponent, ThumbsDownIconComponent, ThumbsUpIconComponent, TiktokIconComponent, TimePickerComponent, TimecodeIconComponent, TimelineComponent, TimerIconComponent, ToastComponent, ToastService, ToggleLeftIconComponent, ToggleRightIconComponent, ToolIconComponent, TooltipDirective, TranscodeIconComponent, TransferListComponent, Trash2IconComponent, TrashIconComponent, TreeComponent, TrelloIconComponent, TrendingDownIconComponent, TrendingUpIconComponent, TriangleIconComponent, TrimIconComponent, TrophyIconComponent, TruckIconComponent, TvIconComponent, Twitch2IconComponent, TwitchIconComponent, TwitterIconComponent, TypeIconComponent, UmbrellaIconComponent, UnderlineIconComponent, UndoIconComponent, UnlinkIconComponent, UnlockIconComponent, UploadCloudIconComponent, UploadIconComponent, UserCheckIconComponent, UserCircleIconComponent, UserIconComponent, UserMinusIconComponent, UserPlusIconComponent, UserXIconComponent, UsersIconComponent, VercelIconComponent, VideoIconComponent, VideoOffIconComponent, VirtualListComponent, VoicemailIconComponent, Volume1IconComponent, Volume2IconComponent, VolumeIconComponent, VolumeXIconComponent, VueIconComponent, WCAG_AA, WalletIconComponent, WandIconComponent, WatchIconComponent, WaveformIconComponent, WebcamIconComponent, WhatsappIconComponent, WifiIconComponent, WifiOffIconComponent, WindIconComponent, WordpressIconComponent, XCircleIconComponent, XIconComponent, XOctagonIconComponent, XSquareIconComponent, XTwitterIconComponent, Youtube2IconComponent, YoutubeIconComponent, ZapIconComponent, ZapOffIconComponent, ZoomInIconComponent, ZoomOutIconComponent, applyPalette, ar, computePopoverPosition, contrastRatio, de, derivePalette, el, en, esES, formatViolations, frFR, frenchSpacing, he, hexToOklch, hi, iconDisplayName, is, isGrouped, nl, oklchToHex, pl, provideEagamiUi, ptBR, relativeLuminance, ru, uk, validatePalette, visibleNodeIds, walkTree, zhCN };
 
 //# sourceMappingURL=eagami-ui.mjs.map