@weeehaoooz/talos-ui 0.1.0 → 0.1.2

package/fesm2022/weeehaoooz-talos-ui-feedback.mjs

@@ -0,0 +1,2885 @@
+import * as i0 from '@angular/core';
+import { signal, TemplateRef, Injectable, Directive, input, output, computed, Component, inject, NgModule, InjectionToken, Injector, booleanAttribute, contentChild, ViewEncapsulation, ElementRef, Renderer2, ApplicationRef, EnvironmentInjector, effect, createComponent, DestroyRef } from '@angular/core';
+import { NgComponentOutlet, NgTemplateOutlet } from '@angular/common';
+import { LucideInfo, LucideCheckCircle2, LucideAlertTriangle, LucideCircleAlert, LucideAlertOctagon, LucideShieldAlert, LucideX, LucideAlertCircle } from '@lucide/angular';
+import { DialogRef, Dialog } from '@angular/cdk/dialog';
+import { TalosButtonDirective } from '@weeehaoooz/talos-ui/button';
+import { Overlay } from '@angular/cdk/overlay';
+import { ComponentPortal } from '@angular/cdk/portal';
+import { FocusMonitor } from '@angular/cdk/a11y';
+
+class TalosAlertService {
+    /** Reactive list of currently active programmatic alerts */
+    alerts = signal([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "alerts" }] : /* istanbul ignore next */ []));
+    /** Reactive list of currently active top-level banner alerts */
+    bannerAlerts = signal([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "bannerAlerts" }] : /* istanbul ignore next */ []));
+    idCounter = 0;
+    /** Default global configurations */
+    defaultConfig = {
+        severity: 'success',
+        appearance: 'subtle',
+        size: 'md',
+        showIcon: true,
+        dismissible: true
+    };
+    /**
+     * Override default global configurations.
+     */
+    setDefaultConfig(config) {
+        this.defaultConfig = { ...this.defaultConfig, ...config };
+    }
+    /**
+     * Main entry point to create a programmatic alert instance.
+     */
+    show(messageOrConfig, configOverrides = {}) {
+        let fullConfig;
+        if (typeof messageOrConfig === 'string' ||
+            messageOrConfig instanceof TemplateRef) {
+            fullConfig = {
+                message: messageOrConfig,
+                ...configOverrides
+            };
+        }
+        else {
+            fullConfig = {
+                ...messageOrConfig,
+                ...configOverrides
+            };
+        }
+        const instance = {
+            id: fullConfig.id || `talos-alert-${++this.idCounter}-${Date.now()}`,
+            severity: fullConfig.severity ?? this.defaultConfig.severity ?? 'success',
+            variant: fullConfig.variant,
+            appearance: fullConfig.appearance ?? this.defaultConfig.appearance ?? 'subtle',
+            size: fullConfig.size ?? this.defaultConfig.size ?? 'md',
+            showIcon: fullConfig.showIcon ?? this.defaultConfig.showIcon ?? true,
+            icon: fullConfig.icon,
+            showSeverityBadge: fullConfig.showSeverityBadge ?? false,
+            dismissible: fullConfig.dismissible ?? this.defaultConfig.dismissible ?? true,
+            title: fullConfig.title,
+            message: fullConfig.message,
+            actionLabel: fullConfig.actionLabel,
+            onAction: fullConfig.onAction,
+            onDismiss: fullConfig.onDismiss,
+            customClass: fullConfig.customClass,
+            bordered: fullConfig.bordered,
+            duration: fullConfig.duration,
+            data: fullConfig.data,
+            createdAt: Date.now()
+        };
+        this.alerts.update((current) => [...current, instance]);
+        if (instance.duration && instance.duration > 0) {
+            setTimeout(() => {
+                this.dismiss(instance.id);
+            }, instance.duration);
+        }
+        return {
+            id: instance.id,
+            dismiss: () => this.dismiss(instance.id)
+        };
+    }
+    /**
+     * Display a high-visibility global banner alert.
+     */
+    banner(messageOrConfig, configOverrides = {}) {
+        let fullConfig;
+        if (typeof messageOrConfig === 'string' ||
+            messageOrConfig instanceof TemplateRef) {
+            fullConfig = {
+                message: messageOrConfig,
+                appearance: 'filled',
+                severity: 'info',
+                ...configOverrides
+            };
+        }
+        else {
+            fullConfig = {
+                appearance: 'filled',
+                severity: 'info',
+                ...messageOrConfig,
+                ...configOverrides
+            };
+        }
+        const instance = {
+            id: fullConfig.id || `talos-banner-alert-${++this.idCounter}-${Date.now()}`,
+            severity: fullConfig.severity ?? 'info',
+            variant: fullConfig.variant,
+            appearance: fullConfig.appearance ?? 'filled',
+            size: fullConfig.size ?? 'md',
+            showIcon: fullConfig.showIcon ?? true,
+            icon: fullConfig.icon,
+            showSeverityBadge: fullConfig.showSeverityBadge ?? false,
+            dismissible: fullConfig.dismissible ?? true,
+            title: fullConfig.title,
+            message: fullConfig.message,
+            actionLabel: fullConfig.actionLabel,
+            onAction: fullConfig.onAction,
+            onDismiss: fullConfig.onDismiss,
+            customClass: fullConfig.customClass,
+            bordered: fullConfig.bordered,
+            duration: fullConfig.duration,
+            data: fullConfig.data,
+            createdAt: Date.now()
+        };
+        this.bannerAlerts.update((current) => [...current, instance]);
+        if (instance.duration && instance.duration > 0) {
+            setTimeout(() => {
+                this.dismissBanner(instance.id);
+            }, instance.duration);
+        }
+        return {
+            id: instance.id,
+            dismiss: () => this.dismissBanner(instance.id)
+        };
+    }
+    /** Convenience method for Success alerts (Default severity) */
+    success(message, config) {
+        return this.show(message, { ...config, severity: 'success' });
+    }
+    /** Convenience method for Info alerts */
+    info(message, config) {
+        return this.show(message, { ...config, severity: 'info' });
+    }
+    /** Convenience method for Warning alerts */
+    warning(message, config) {
+        return this.show(message, { ...config, severity: 'warning' });
+    }
+    /** Convenience method for Error alerts */
+    error(message, config) {
+        return this.show(message, { ...config, severity: 'error' });
+    }
+    /**
+     * Dismiss a specific programmatic alert by ID, or the oldest if no ID is provided.
+     */
+    dismiss(id) {
+        if (!id) {
+            const current = this.alerts();
+            if (current.length === 0)
+                return;
+            id = current[0].id;
+        }
+        const target = this.alerts().find((a) => a.id === id);
+        if (target?.onDismiss) {
+            target.onDismiss();
+        }
+        this.alerts.update((current) => current.filter((item) => item.id !== id));
+    }
+    /**
+     * Dismiss a banner alert by ID.
+     */
+    dismissBanner(id) {
+        if (!id) {
+            const current = this.bannerAlerts();
+            if (current.length === 0)
+                return;
+            id = current[0].id;
+        }
+        const target = this.bannerAlerts().find((a) => a.id === id);
+        if (target?.onDismiss) {
+            target.onDismiss();
+        }
+        this.bannerAlerts.update((current) => current.filter((item) => item.id !== id));
+    }
+    /**
+     * Dismiss all currently active alerts and banners.
+     */
+    dismissAll() {
+        this.alerts().forEach((a) => a.onDismiss?.());
+        this.bannerAlerts().forEach((b) => b.onDismiss?.());
+        this.alerts.set([]);
+        this.bannerAlerts.set([]);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+/**
+ * Structural / Slot directive for alert title projection.
+ *
+ * Usage:
+ * ```html
+ * <talos-alert>
+ *   <div talosAlertTitle>System Maintenance</div>
+ *   <div talosAlertDescription>All services will undergo updates tonight.</div>
+ * </talos-alert>
+ * ```
+ */
+class TalosAlertTitleDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.1", type: TalosAlertTitleDirective, isStandalone: true, selector: "[talosAlertTitle], talos-alert-title", host: { classAttribute: "talos-alert-title-directive" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertTitleDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[talosAlertTitle], talos-alert-title',
+                    host: {
+                        'class': 'talos-alert-title-directive'
+                    }
+                }]
+        }] });
+/**
+ * Slot directive for alert description / message body.
+ */
+class TalosAlertDescriptionDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertDescriptionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.1", type: TalosAlertDescriptionDirective, isStandalone: true, selector: "[talosAlertDescription], talos-alert-description", host: { classAttribute: "talos-alert-description-directive" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertDescriptionDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[talosAlertDescription], talos-alert-description',
+                    host: {
+                        'class': 'talos-alert-description-directive'
+                    }
+                }]
+        }] });
+/**
+ * Slot directive for custom alert actions / button group.
+ */
+class TalosAlertActionsDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertActionsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.1", type: TalosAlertActionsDirective, isStandalone: true, selector: "[talosAlertActions], talos-alert-actions", host: { classAttribute: "talos-alert-actions-directive" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertActionsDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[talosAlertActions], talos-alert-actions',
+                    host: {
+                        'class': 'talos-alert-actions-directive'
+                    }
+                }]
+        }] });
+/**
+ * Slot directive for custom alert icon.
+ */
+class TalosAlertIconDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertIconDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.1", type: TalosAlertIconDirective, isStandalone: true, selector: "[talosAlertIcon], talos-alert-icon", host: { classAttribute: "talos-alert-icon-directive" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertIconDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[talosAlertIcon], talos-alert-icon',
+                    host: {
+                        'class': 'talos-alert-icon-directive'
+                    }
+                }]
+        }] });
+
+class TalosAlertComponent {
+    /** Alert severity state: 'success' (default), 'info', 'warning', 'error' */
+    severity = input('success', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "severity" }] : /* istanbul ignore next */ []));
+    /** Visual variant theme fallback */
+    variant = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    /** Visual surface appearance style */
+    appearance = input('subtle', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "appearance" }] : /* istanbul ignore next */ []));
+    /** Sizing of padding and typography */
+    size = input('md', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** Header title text or custom TemplateRef */
+    title = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
+    /** Main message content or custom TemplateRef */
+    message = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "message" }] : /* istanbul ignore next */ []));
+    /** Whether to display the icon */
+    showIcon = input(true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "showIcon" }] : /* istanbul ignore next */ []));
+    /** Custom Lucide icon component, TemplateRef, or boolean */
+    icon = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
+    /** Whether to display a dedicated severity pill badge */
+    showSeverityBadge = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "showSeverityBadge" }] : /* istanbul ignore next */ []));
+    /** Whether the alert can be dismissed */
+    dismissible = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "dismissible" }] : /* istanbul ignore next */ []));
+    /** Action button text label */
+    actionLabel = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "actionLabel" }] : /* istanbul ignore next */ []));
+    /** Optional explicit border outline */
+    bordered = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "bordered" }] : /* istanbul ignore next */ []));
+    /** Additional CSS class */
+    customClass = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "customClass" }] : /* istanbul ignore next */ []));
+    /** Emitted when dismiss close button is clicked */
+    dismiss = output();
+    /** Emitted when action button is clicked */
+    action = output();
+    /** Emitted when dismiss animation has finished and alert is removed */
+    closed = output();
+    isDismissing = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isDismissing" }] : /* istanbul ignore next */ []));
+    isDismissed = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isDismissed" }] : /* istanbul ignore next */ []));
+    /** Resolved visual variant considering severity */
+    resolvedVariant = computed(() => {
+        const sev = this.severity();
+        if (sev) {
+            return sev;
+        }
+        return this.variant() ?? 'success';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedVariant" }] : /* istanbul ignore next */ []));
+    /** Severity display label for badge */
+    severityLabel = computed(() => {
+        const sev = this.severity();
+        if (sev)
+            return sev.toUpperCase();
+        return '';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "severityLabel" }] : /* istanbul ignore next */ []));
+    isTitleTemplate = computed(() => this.title() instanceof TemplateRef, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isTitleTemplate" }] : /* istanbul ignore next */ []));
+    titleTemplate = computed(() => this.title(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "titleTemplate" }] : /* istanbul ignore next */ []));
+    isMessageTemplate = computed(() => this.message() instanceof TemplateRef, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isMessageTemplate" }] : /* istanbul ignore next */ []));
+    messageTemplate = computed(() => this.message(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "messageTemplate" }] : /* istanbul ignore next */ []));
+    isIconTemplate = computed(() => this.icon() instanceof TemplateRef, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isIconTemplate" }] : /* istanbul ignore next */ []));
+    iconTemplate = computed(() => this.icon(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "iconTemplate" }] : /* istanbul ignore next */ []));
+    customIconComponent = computed(() => {
+        const ic = this.icon();
+        return typeof ic === 'function' ? ic : null;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "customIconComponent" }] : /* istanbul ignore next */ []));
+    ariaRole = computed(() => {
+        const v = this.resolvedVariant();
+        return v === 'error' || v === 'warning' || v === 'critical' ? 'alert' : 'status';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaRole" }] : /* istanbul ignore next */ []));
+    ariaLive = computed(() => {
+        const v = this.resolvedVariant();
+        return v === 'error' || v === 'critical' ? 'assertive' : 'polite';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaLive" }] : /* istanbul ignore next */ []));
+    onActionClick() {
+        this.action.emit();
+    }
+    onCloseClick() {
+        if (this.isDismissing() || this.isDismissed())
+            return;
+        this.isDismissing.set(true);
+        this.dismiss.emit();
+        setTimeout(() => {
+            this.isDismissed.set(true);
+            this.closed.emit();
+        }, 200);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: TalosAlertComponent, isStandalone: true, selector: "talos-alert", inputs: { severity: { classPropertyName: "severity", publicName: "severity", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, showSeverityBadge: { classPropertyName: "showSeverityBadge", publicName: "showSeverityBadge", isSignal: true, isRequired: false, transformFunction: null }, dismissible: { classPropertyName: "dismissible", publicName: "dismissible", isSignal: true, isRequired: false, transformFunction: null }, actionLabel: { classPropertyName: "actionLabel", publicName: "actionLabel", isSignal: true, isRequired: false, transformFunction: null }, bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null }, customClass: { classPropertyName: "customClass", publicName: "customClass", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dismiss: "dismiss", action: "action", closed: "closed" }, host: { properties: { "class.talos-alert-host": "true", "class.is-dismissing": "isDismissing()", "class.is-dismissed": "isDismissed()" } }, ngImport: i0, template: "@if (!isDismissed()) {\n<div\n  class=\"talos-alert\"\n  [class.variant-default]=\"resolvedVariant() === 'default'\"\n  [class.variant-info]=\"resolvedVariant() === 'info'\"\n  [class.variant-success]=\"resolvedVariant() === 'success'\"\n  [class.variant-warning]=\"resolvedVariant() === 'warning'\"\n  [class.variant-error]=\"resolvedVariant() === 'error'\"\n  [class.variant-primary]=\"resolvedVariant() === 'primary'\"\n  [class.variant-critical]=\"resolvedVariant() === 'critical'\"\n  [class.appearance-subtle]=\"appearance() === 'subtle'\"\n  [class.appearance-outline]=\"appearance() === 'outline'\"\n  [class.appearance-filled]=\"appearance() === 'filled'\"\n  [class.appearance-accent]=\"appearance() === 'accent'\"\n  [class.appearance-left-border]=\"appearance() === 'left-border'\"\n  [class.size-sm]=\"size() === 'sm'\"\n  [class.size-md]=\"size() === 'md'\"\n  [class.size-lg]=\"size() === 'lg'\"\n  [class.is-bordered]=\"bordered()\"\n  [class.is-dismissing]=\"isDismissing()\"\n  [class]=\"customClass()\"\n  [attr.role]=\"ariaRole()\"\n  [attr.aria-live]=\"ariaLive()\"\n>\n  <!-- Icon Section -->\n  @if (showIcon() && icon() !== false) {\n  <div class=\"talos-alert-icon\" aria-hidden=\"true\">\n    @if (isIconTemplate()) {\n      <ng-container *ngTemplateOutlet=\"iconTemplate()\"></ng-container>\n    } @else if (customIconComponent()) {\n      <ng-container *ngComponentOutlet=\"customIconComponent()\"></ng-container>\n    } @else {\n      <ng-content select=\"[talosAlertIcon], talos-alert-icon\"></ng-content>\n      @switch (resolvedVariant()) {\n        @case ('critical') {\n          <svg lucideAlertOctagon [size]=\"size() === 'sm' ? 16 : size() === 'lg' ? 24 : 20\"></svg>\n        }\n        @case ('error') {\n          <svg lucideCircleAlert [size]=\"size() === 'sm' ? 16 : size() === 'lg' ? 24 : 20\"></svg>\n        }\n        @case ('warning') {\n          <svg lucideAlertTriangle [size]=\"size() === 'sm' ? 16 : size() === 'lg' ? 24 : 20\"></svg>\n        }\n        @case ('success') {\n          <svg lucideCheckCircle2 [size]=\"size() === 'sm' ? 16 : size() === 'lg' ? 24 : 20\"></svg>\n        }\n        @case ('primary') {\n          <svg lucideShieldAlert [size]=\"size() === 'sm' ? 16 : size() === 'lg' ? 24 : 20\"></svg>\n        }\n        @default {\n          <svg lucideInfo [size]=\"size() === 'sm' ? 16 : size() === 'lg' ? 24 : 20\"></svg>\n        }\n      }\n    }\n  </div>\n  }\n\n  <!-- Main Alert Body & Details -->\n  <div class=\"talos-alert-body\">\n    <!-- Header: Title & Severity Badge -->\n    <div class=\"talos-alert-header\">\n      @if (title()) {\n        @if (isTitleTemplate()) {\n          <div class=\"talos-alert-title\">\n            <ng-container *ngTemplateOutlet=\"titleTemplate()\"></ng-container>\n          </div>\n        } @else {\n          <h4 class=\"talos-alert-title\">{{ title() }}</h4>\n        }\n      }\n      <ng-content select=\"[talosAlertTitle], talos-alert-title\"></ng-content>\n\n      @if (showSeverityBadge() && severityLabel()) {\n        <span class=\"talos-alert-severity-badge\" [attr.data-severity]=\"resolvedVariant()\">\n          {{ severityLabel() }}\n        </span>\n      }\n    </div>\n\n    <!-- Message Description Content -->\n    <div class=\"talos-alert-message\">\n      @if (message()) {\n        @if (isMessageTemplate()) {\n          <ng-container *ngTemplateOutlet=\"messageTemplate()\"></ng-container>\n        } @else {\n          <span>{{ message() }}</span>\n        }\n      }\n      <ng-content select=\"[talosAlertDescription], talos-alert-description\"></ng-content>\n      <ng-content></ng-content>\n    </div>\n  </div>\n\n  <!-- Actions & Close Button -->\n  <div class=\"talos-alert-actions\">\n    <ng-content select=\"[talosAlertActions], talos-alert-actions\"></ng-content>\n\n    @if (actionLabel()) {\n      <button type=\"button\" class=\"talos-alert-action-btn\" (click)=\"onActionClick()\">\n        {{ actionLabel() }}\n      </button>\n    }\n\n    @if (dismissible()) {\n      <button\n        type=\"button\"\n        class=\"talos-alert-close-btn\"\n        aria-label=\"Dismiss alert\"\n        (click)=\"onCloseClick()\"\n      >\n        <svg lucideX [size]=\"size() === 'sm' ? 14 : 16\"></svg>\n      </button>\n    }\n  </div>\n</div>\n}\n", styles: [":host{display:block;width:100%;transition:opacity .2s ease,transform .2s ease,max-height .2s ease,margin .2s ease}:host.is-dismissing{opacity:0;transform:translateY(-4px) scale(.98);pointer-events:none}:host.is-dismissed{display:none!important}.talos-alert{position:relative;display:flex;align-items:flex-start;gap:var(--talos-alert-gap, .75rem);width:100%;border-radius:var(--talos-alert-radius, .5rem);box-sizing:border-box;font-family:inherit;transition:all .2s ease-in-out}.talos-alert.size-sm{padding:var(--talos-alert-padding-sm, .5rem .75rem);font-size:.8125rem}.talos-alert.size-sm .talos-alert-title{font-size:.875rem}.talos-alert.size-md{padding:var(--talos-alert-padding-md, .75rem 1rem);font-size:.875rem}.talos-alert.size-md .talos-alert-title{font-size:.9375rem}.talos-alert.size-lg{padding:var(--talos-alert-padding-lg, 1rem 1.25rem);font-size:.9375rem}.talos-alert.size-lg .talos-alert-title{font-size:1.0625rem}.talos-alert.is-bordered{border-width:1px;border-style:solid}.talos-alert.appearance-subtle{border:1px solid transparent}.talos-alert.appearance-subtle.variant-default{background-color:var(--talos-alert-default-bg);border-color:var(--talos-alert-default-border);color:var(--talos-alert-default-text)}.talos-alert.appearance-subtle.variant-default .talos-alert-icon{color:var(--talos-alert-default-icon)}.talos-alert.appearance-subtle.variant-info{background-color:var(--talos-alert-info-bg);border-color:var(--talos-alert-info-border);color:var(--talos-alert-info-text)}.talos-alert.appearance-subtle.variant-info .talos-alert-icon{color:var(--talos-alert-info-icon)}.talos-alert.appearance-subtle.variant-success{background-color:var(--talos-alert-success-bg);border-color:var(--talos-alert-success-border);color:var(--talos-alert-success-text)}.talos-alert.appearance-subtle.variant-success .talos-alert-icon{color:var(--talos-alert-success-icon)}.talos-alert.appearance-subtle.variant-warning{background-color:var(--talos-alert-warning-bg);border-color:var(--talos-alert-warning-border);color:var(--talos-alert-warning-text)}.talos-alert.appearance-subtle.variant-warning .talos-alert-icon{color:var(--talos-alert-warning-icon)}.talos-alert.appearance-subtle.variant-error{background-color:var(--talos-alert-error-bg);border-color:var(--talos-alert-error-border);color:var(--talos-alert-error-text)}.talos-alert.appearance-subtle.variant-error .talos-alert-icon{color:var(--talos-alert-error-icon)}.talos-alert.appearance-subtle.variant-critical{background-color:var(--talos-alert-critical-bg);border-color:var(--talos-alert-critical-border);color:var(--talos-alert-critical-text)}.talos-alert.appearance-subtle.variant-critical .talos-alert-icon{color:var(--talos-alert-critical-icon)}.talos-alert.appearance-subtle.variant-primary{background-color:var(--talos-alert-primary-bg);border-color:var(--talos-alert-primary-border);color:var(--talos-alert-primary-text)}.talos-alert.appearance-subtle.variant-primary .talos-alert-icon{color:var(--talos-alert-primary-icon)}.talos-alert.appearance-outline{background-color:transparent;border:1px solid currentColor}.talos-alert.appearance-outline.variant-default{border-color:var(--talos-alert-default-border);color:var(--talos-alert-default-text)}.talos-alert.appearance-outline.variant-default .talos-alert-icon{color:var(--talos-alert-default-icon)}.talos-alert.appearance-outline.variant-info{border-color:var(--talos-alert-info-icon);color:var(--talos-alert-info-icon)}.talos-alert.appearance-outline.variant-info .talos-alert-body{color:var(--talos-text-color, #0f172a)}.talos-alert.appearance-outline.variant-info .talos-alert-icon{color:var(--talos-alert-info-icon)}.talos-alert.appearance-outline.variant-success{border-color:var(--talos-alert-success-icon);color:var(--talos-alert-success-icon)}.talos-alert.appearance-outline.variant-success .talos-alert-body{color:var(--talos-text-color, #0f172a)}.talos-alert.appearance-outline.variant-success .talos-alert-icon{color:var(--talos-alert-success-icon)}.talos-alert.appearance-outline.variant-warning{border-color:var(--talos-alert-warning-icon);color:var(--talos-alert-warning-icon)}.talos-alert.appearance-outline.variant-warning .talos-alert-body{color:var(--talos-text-color, #0f172a)}.talos-alert.appearance-outline.variant-warning .talos-alert-icon{color:var(--talos-alert-warning-icon)}.talos-alert.appearance-outline.variant-error{border-color:var(--talos-alert-error-icon);color:var(--talos-alert-error-icon)}.talos-alert.appearance-outline.variant-error .talos-alert-body{color:var(--talos-text-color, #0f172a)}.talos-alert.appearance-outline.variant-error .talos-alert-icon{color:var(--talos-alert-error-icon)}.talos-alert.appearance-outline.variant-critical{border-color:var(--talos-alert-critical-border);color:var(--talos-alert-critical-icon)}.talos-alert.appearance-outline.variant-critical .talos-alert-body{color:var(--talos-text-color, #0f172a)}.talos-alert.appearance-outline.variant-critical .talos-alert-icon{color:var(--talos-alert-critical-icon)}.talos-alert.appearance-outline.variant-primary{border-color:var(--talos-alert-primary-icon);color:var(--talos-alert-primary-icon)}.talos-alert.appearance-outline.variant-primary .talos-alert-body{color:var(--talos-text-color, #0f172a)}.talos-alert.appearance-outline.variant-primary .talos-alert-icon{color:var(--talos-alert-primary-icon)}.talos-alert.appearance-filled{border:1px solid transparent;color:#fff}.talos-alert.appearance-filled .talos-alert-icon,.talos-alert.appearance-filled .talos-alert-title{color:#fff}.talos-alert.appearance-filled .talos-alert-message{color:#ffffffeb}.talos-alert.appearance-filled.variant-default{background-color:#475569}.talos-alert.appearance-filled.variant-info{background-color:#2563eb}.talos-alert.appearance-filled.variant-success{background-color:#16a34a}.talos-alert.appearance-filled.variant-warning{background-color:#d97706}.talos-alert.appearance-filled.variant-error{background-color:#dc2626}.talos-alert.appearance-filled.variant-critical{background-color:#991b1b;box-shadow:0 0 15px #dc262666}.talos-alert.appearance-filled.variant-primary{background-color:#2563eb}.talos-alert.appearance-filled .talos-alert-action-btn{background-color:#fff3;color:#fff;border-color:#ffffff59}.talos-alert.appearance-filled .talos-alert-action-btn:hover{background-color:#ffffff4d}.talos-alert.appearance-filled .talos-alert-close-btn{color:#fffc}.talos-alert.appearance-filled .talos-alert-close-btn:hover{background-color:#fff3;color:#fff}.talos-alert.appearance-accent,.talos-alert.appearance-left-border{background-color:var(--talos-card-bg, #ffffff);border:1px solid var(--talos-border-color, #e2e8f0);border-left-width:4px;box-shadow:var(--talos-alert-shadow);color:var(--talos-text-color, #0f172a)}.talos-alert.appearance-accent.variant-default,.talos-alert.appearance-left-border.variant-default{border-left-color:var(--talos-alert-default-icon)}.talos-alert.appearance-accent.variant-default .talos-alert-icon,.talos-alert.appearance-left-border.variant-default .talos-alert-icon{color:var(--talos-alert-default-icon)}.talos-alert.appearance-accent.variant-info,.talos-alert.appearance-left-border.variant-info{border-left-color:var(--talos-alert-info-icon)}.talos-alert.appearance-accent.variant-info .talos-alert-icon,.talos-alert.appearance-left-border.variant-info .talos-alert-icon{color:var(--talos-alert-info-icon)}.talos-alert.appearance-accent.variant-success,.talos-alert.appearance-left-border.variant-success{border-left-color:var(--talos-alert-success-icon)}.talos-alert.appearance-accent.variant-success .talos-alert-icon,.talos-alert.appearance-left-border.variant-success .talos-alert-icon{color:var(--talos-alert-success-icon)}.talos-alert.appearance-accent.variant-warning,.talos-alert.appearance-left-border.variant-warning{border-left-color:var(--talos-alert-warning-icon)}.talos-alert.appearance-accent.variant-warning .talos-alert-icon,.talos-alert.appearance-left-border.variant-warning .talos-alert-icon{color:var(--talos-alert-warning-icon)}.talos-alert.appearance-accent.variant-error,.talos-alert.appearance-left-border.variant-error{border-left-color:var(--talos-alert-error-icon)}.talos-alert.appearance-accent.variant-error .talos-alert-icon,.talos-alert.appearance-left-border.variant-error .talos-alert-icon{color:var(--talos-alert-error-icon)}.talos-alert.appearance-accent.variant-critical,.talos-alert.appearance-left-border.variant-critical{border-left-color:#ef4444}.talos-alert.appearance-accent.variant-critical .talos-alert-icon,.talos-alert.appearance-left-border.variant-critical .talos-alert-icon{color:#ef4444}.talos-alert.appearance-accent.variant-primary,.talos-alert.appearance-left-border.variant-primary{border-left-color:var(--talos-alert-primary-icon)}.talos-alert.appearance-accent.variant-primary .talos-alert-icon,.talos-alert.appearance-left-border.variant-primary .talos-alert-icon{color:var(--talos-alert-primary-icon)}.talos-alert-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px;line-height:1}.talos-alert-icon svg{display:block}.talos-alert-body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:.25rem}.talos-alert-header{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem}.talos-alert-title{margin:0;font-weight:600;line-height:1.35;color:inherit}.talos-alert-message{line-height:1.45;color:inherit;opacity:.95}.talos-alert-severity-badge{display:inline-flex;align-items:center;padding:.125rem .4375rem;border-radius:9999px;font-size:.6875rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;background-color:#00000014;color:inherit}.talos-alert-severity-badge[data-severity=critical]{background-color:#ef4444;color:#fff}.talos-alert-severity-badge[data-severity=error]{background-color:#ef444433;color:#dc2626}.talos-alert-severity-badge[data-severity=warning]{background-color:#f59e0b33;color:#b45309}.talos-alert-severity-badge[data-severity=info]{background-color:#3b82f633;color:#1d4ed8}.talos-alert-severity-badge[data-severity=success]{background-color:#22c55e33;color:#15803d}.talos-alert-actions{display:flex;align-items:center;gap:.5rem;flex-shrink:0;margin-left:auto}.talos-alert-action-btn{display:inline-flex;align-items:center;justify-content:center;padding:.25rem .625rem;font-size:.75rem;font-weight:600;border-radius:var(--talos-border-radius, .375rem);border:1px solid currentColor;background-color:transparent;color:inherit;cursor:pointer;transition:all .15s ease}.talos-alert-action-btn:hover{background-color:#0000000f}.talos-alert-action-btn:active{transform:scale(.97)}.talos-alert-close-btn{display:inline-flex;align-items:center;justify-content:center;padding:.25rem;border:none;background:transparent;color:inherit;opacity:.7;border-radius:var(--talos-border-radius, .375rem);cursor:pointer;transition:all .15s ease}.talos-alert-close-btn:hover{opacity:1;background-color:#00000014}.talos-alert-close-btn:active{transform:scale(.92)}\n"], dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: LucideInfo, selector: "svg[lucideInfo]" }, { kind: "component", type: LucideCheckCircle2, selector: "svg[lucideCircleCheck], svg[lucideCheckCircle2]" }, { kind: "component", type: LucideAlertTriangle, selector: "svg[lucideTriangleAlert], svg[lucideAlertTriangle]" }, { kind: "component", type: LucideCircleAlert, selector: "svg[lucideCircleAlert], svg[lucideAlertCircle]" }, { kind: "component", type: LucideAlertOctagon, selector: "svg[lucideOctagonAlert], svg[lucideAlertOctagon]" }, { kind: "component", type: LucideShieldAlert, selector: "svg[lucideShieldAlert]" }, { kind: "component", type: LucideX, selector: "svg[lucideX]" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'talos-alert', imports: [
+                        NgComponentOutlet,
+                        NgTemplateOutlet,
+                        LucideInfo,
+                        LucideCheckCircle2,
+                        LucideAlertTriangle,
+                        LucideCircleAlert,
+                        LucideAlertOctagon,
+                        LucideShieldAlert,
+                        LucideX
+                    ], host: {
+                        '[class.talos-alert-host]': 'true',
+                        '[class.is-dismissing]': 'isDismissing()',
+                        '[class.is-dismissed]': 'isDismissed()'
+                    }, template: "@if (!isDismissed()) {\n<div\n  class=\"talos-alert\"\n  [class.variant-default]=\"resolvedVariant() === 'default'\"\n  [class.variant-info]=\"resolvedVariant() === 'info'\"\n  [class.variant-success]=\"resolvedVariant() === 'success'\"\n  [class.variant-warning]=\"resolvedVariant() === 'warning'\"\n  [class.variant-error]=\"resolvedVariant() === 'error'\"\n  [class.variant-primary]=\"resolvedVariant() === 'primary'\"\n  [class.variant-critical]=\"resolvedVariant() === 'critical'\"\n  [class.appearance-subtle]=\"appearance() === 'subtle'\"\n  [class.appearance-outline]=\"appearance() === 'outline'\"\n  [class.appearance-filled]=\"appearance() === 'filled'\"\n  [class.appearance-accent]=\"appearance() === 'accent'\"\n  [class.appearance-left-border]=\"appearance() === 'left-border'\"\n  [class.size-sm]=\"size() === 'sm'\"\n  [class.size-md]=\"size() === 'md'\"\n  [class.size-lg]=\"size() === 'lg'\"\n  [class.is-bordered]=\"bordered()\"\n  [class.is-dismissing]=\"isDismissing()\"\n  [class]=\"customClass()\"\n  [attr.role]=\"ariaRole()\"\n  [attr.aria-live]=\"ariaLive()\"\n>\n  <!-- Icon Section -->\n  @if (showIcon() && icon() !== false) {\n  <div class=\"talos-alert-icon\" aria-hidden=\"true\">\n    @if (isIconTemplate()) {\n      <ng-container *ngTemplateOutlet=\"iconTemplate()\"></ng-container>\n    } @else if (customIconComponent()) {\n      <ng-container *ngComponentOutlet=\"customIconComponent()\"></ng-container>\n    } @else {\n      <ng-content select=\"[talosAlertIcon], talos-alert-icon\"></ng-content>\n      @switch (resolvedVariant()) {\n        @case ('critical') {\n          <svg lucideAlertOctagon [size]=\"size() === 'sm' ? 16 : size() === 'lg' ? 24 : 20\"></svg>\n        }\n        @case ('error') {\n          <svg lucideCircleAlert [size]=\"size() === 'sm' ? 16 : size() === 'lg' ? 24 : 20\"></svg>\n        }\n        @case ('warning') {\n          <svg lucideAlertTriangle [size]=\"size() === 'sm' ? 16 : size() === 'lg' ? 24 : 20\"></svg>\n        }\n        @case ('success') {\n          <svg lucideCheckCircle2 [size]=\"size() === 'sm' ? 16 : size() === 'lg' ? 24 : 20\"></svg>\n        }\n        @case ('primary') {\n          <svg lucideShieldAlert [size]=\"size() === 'sm' ? 16 : size() === 'lg' ? 24 : 20\"></svg>\n        }\n        @default {\n          <svg lucideInfo [size]=\"size() === 'sm' ? 16 : size() === 'lg' ? 24 : 20\"></svg>\n        }\n      }\n    }\n  </div>\n  }\n\n  <!-- Main Alert Body & Details -->\n  <div class=\"talos-alert-body\">\n    <!-- Header: Title & Severity Badge -->\n    <div class=\"talos-alert-header\">\n      @if (title()) {\n        @if (isTitleTemplate()) {\n          <div class=\"talos-alert-title\">\n            <ng-container *ngTemplateOutlet=\"titleTemplate()\"></ng-container>\n          </div>\n        } @else {\n          <h4 class=\"talos-alert-title\">{{ title() }}</h4>\n        }\n      }\n      <ng-content select=\"[talosAlertTitle], talos-alert-title\"></ng-content>\n\n      @if (showSeverityBadge() && severityLabel()) {\n        <span class=\"talos-alert-severity-badge\" [attr.data-severity]=\"resolvedVariant()\">\n          {{ severityLabel() }}\n        </span>\n      }\n    </div>\n\n    <!-- Message Description Content -->\n    <div class=\"talos-alert-message\">\n      @if (message()) {\n        @if (isMessageTemplate()) {\n          <ng-container *ngTemplateOutlet=\"messageTemplate()\"></ng-container>\n        } @else {\n          <span>{{ message() }}</span>\n        }\n      }\n      <ng-content select=\"[talosAlertDescription], talos-alert-description\"></ng-content>\n      <ng-content></ng-content>\n    </div>\n  </div>\n\n  <!-- Actions & Close Button -->\n  <div class=\"talos-alert-actions\">\n    <ng-content select=\"[talosAlertActions], talos-alert-actions\"></ng-content>\n\n    @if (actionLabel()) {\n      <button type=\"button\" class=\"talos-alert-action-btn\" (click)=\"onActionClick()\">\n        {{ actionLabel() }}\n      </button>\n    }\n\n    @if (dismissible()) {\n      <button\n        type=\"button\"\n        class=\"talos-alert-close-btn\"\n        aria-label=\"Dismiss alert\"\n        (click)=\"onCloseClick()\"\n      >\n        <svg lucideX [size]=\"size() === 'sm' ? 14 : 16\"></svg>\n      </button>\n    }\n  </div>\n</div>\n}\n", styles: [":host{display:block;width:100%;transition:opacity .2s ease,transform .2s ease,max-height .2s ease,margin .2s ease}:host.is-dismissing{opacity:0;transform:translateY(-4px) scale(.98);pointer-events:none}:host.is-dismissed{display:none!important}.talos-alert{position:relative;display:flex;align-items:flex-start;gap:var(--talos-alert-gap, .75rem);width:100%;border-radius:var(--talos-alert-radius, .5rem);box-sizing:border-box;font-family:inherit;transition:all .2s ease-in-out}.talos-alert.size-sm{padding:var(--talos-alert-padding-sm, .5rem .75rem);font-size:.8125rem}.talos-alert.size-sm .talos-alert-title{font-size:.875rem}.talos-alert.size-md{padding:var(--talos-alert-padding-md, .75rem 1rem);font-size:.875rem}.talos-alert.size-md .talos-alert-title{font-size:.9375rem}.talos-alert.size-lg{padding:var(--talos-alert-padding-lg, 1rem 1.25rem);font-size:.9375rem}.talos-alert.size-lg .talos-alert-title{font-size:1.0625rem}.talos-alert.is-bordered{border-width:1px;border-style:solid}.talos-alert.appearance-subtle{border:1px solid transparent}.talos-alert.appearance-subtle.variant-default{background-color:var(--talos-alert-default-bg);border-color:var(--talos-alert-default-border);color:var(--talos-alert-default-text)}.talos-alert.appearance-subtle.variant-default .talos-alert-icon{color:var(--talos-alert-default-icon)}.talos-alert.appearance-subtle.variant-info{background-color:var(--talos-alert-info-bg);border-color:var(--talos-alert-info-border);color:var(--talos-alert-info-text)}.talos-alert.appearance-subtle.variant-info .talos-alert-icon{color:var(--talos-alert-info-icon)}.talos-alert.appearance-subtle.variant-success{background-color:var(--talos-alert-success-bg);border-color:var(--talos-alert-success-border);color:var(--talos-alert-success-text)}.talos-alert.appearance-subtle.variant-success .talos-alert-icon{color:var(--talos-alert-success-icon)}.talos-alert.appearance-subtle.variant-warning{background-color:var(--talos-alert-warning-bg);border-color:var(--talos-alert-warning-border);color:var(--talos-alert-warning-text)}.talos-alert.appearance-subtle.variant-warning .talos-alert-icon{color:var(--talos-alert-warning-icon)}.talos-alert.appearance-subtle.variant-error{background-color:var(--talos-alert-error-bg);border-color:var(--talos-alert-error-border);color:var(--talos-alert-error-text)}.talos-alert.appearance-subtle.variant-error .talos-alert-icon{color:var(--talos-alert-error-icon)}.talos-alert.appearance-subtle.variant-critical{background-color:var(--talos-alert-critical-bg);border-color:var(--talos-alert-critical-border);color:var(--talos-alert-critical-text)}.talos-alert.appearance-subtle.variant-critical .talos-alert-icon{color:var(--talos-alert-critical-icon)}.talos-alert.appearance-subtle.variant-primary{background-color:var(--talos-alert-primary-bg);border-color:var(--talos-alert-primary-border);color:var(--talos-alert-primary-text)}.talos-alert.appearance-subtle.variant-primary .talos-alert-icon{color:var(--talos-alert-primary-icon)}.talos-alert.appearance-outline{background-color:transparent;border:1px solid currentColor}.talos-alert.appearance-outline.variant-default{border-color:var(--talos-alert-default-border);color:var(--talos-alert-default-text)}.talos-alert.appearance-outline.variant-default .talos-alert-icon{color:var(--talos-alert-default-icon)}.talos-alert.appearance-outline.variant-info{border-color:var(--talos-alert-info-icon);color:var(--talos-alert-info-icon)}.talos-alert.appearance-outline.variant-info .talos-alert-body{color:var(--talos-text-color, #0f172a)}.talos-alert.appearance-outline.variant-info .talos-alert-icon{color:var(--talos-alert-info-icon)}.talos-alert.appearance-outline.variant-success{border-color:var(--talos-alert-success-icon);color:var(--talos-alert-success-icon)}.talos-alert.appearance-outline.variant-success .talos-alert-body{color:var(--talos-text-color, #0f172a)}.talos-alert.appearance-outline.variant-success .talos-alert-icon{color:var(--talos-alert-success-icon)}.talos-alert.appearance-outline.variant-warning{border-color:var(--talos-alert-warning-icon);color:var(--talos-alert-warning-icon)}.talos-alert.appearance-outline.variant-warning .talos-alert-body{color:var(--talos-text-color, #0f172a)}.talos-alert.appearance-outline.variant-warning .talos-alert-icon{color:var(--talos-alert-warning-icon)}.talos-alert.appearance-outline.variant-error{border-color:var(--talos-alert-error-icon);color:var(--talos-alert-error-icon)}.talos-alert.appearance-outline.variant-error .talos-alert-body{color:var(--talos-text-color, #0f172a)}.talos-alert.appearance-outline.variant-error .talos-alert-icon{color:var(--talos-alert-error-icon)}.talos-alert.appearance-outline.variant-critical{border-color:var(--talos-alert-critical-border);color:var(--talos-alert-critical-icon)}.talos-alert.appearance-outline.variant-critical .talos-alert-body{color:var(--talos-text-color, #0f172a)}.talos-alert.appearance-outline.variant-critical .talos-alert-icon{color:var(--talos-alert-critical-icon)}.talos-alert.appearance-outline.variant-primary{border-color:var(--talos-alert-primary-icon);color:var(--talos-alert-primary-icon)}.talos-alert.appearance-outline.variant-primary .talos-alert-body{color:var(--talos-text-color, #0f172a)}.talos-alert.appearance-outline.variant-primary .talos-alert-icon{color:var(--talos-alert-primary-icon)}.talos-alert.appearance-filled{border:1px solid transparent;color:#fff}.talos-alert.appearance-filled .talos-alert-icon,.talos-alert.appearance-filled .talos-alert-title{color:#fff}.talos-alert.appearance-filled .talos-alert-message{color:#ffffffeb}.talos-alert.appearance-filled.variant-default{background-color:#475569}.talos-alert.appearance-filled.variant-info{background-color:#2563eb}.talos-alert.appearance-filled.variant-success{background-color:#16a34a}.talos-alert.appearance-filled.variant-warning{background-color:#d97706}.talos-alert.appearance-filled.variant-error{background-color:#dc2626}.talos-alert.appearance-filled.variant-critical{background-color:#991b1b;box-shadow:0 0 15px #dc262666}.talos-alert.appearance-filled.variant-primary{background-color:#2563eb}.talos-alert.appearance-filled .talos-alert-action-btn{background-color:#fff3;color:#fff;border-color:#ffffff59}.talos-alert.appearance-filled .talos-alert-action-btn:hover{background-color:#ffffff4d}.talos-alert.appearance-filled .talos-alert-close-btn{color:#fffc}.talos-alert.appearance-filled .talos-alert-close-btn:hover{background-color:#fff3;color:#fff}.talos-alert.appearance-accent,.talos-alert.appearance-left-border{background-color:var(--talos-card-bg, #ffffff);border:1px solid var(--talos-border-color, #e2e8f0);border-left-width:4px;box-shadow:var(--talos-alert-shadow);color:var(--talos-text-color, #0f172a)}.talos-alert.appearance-accent.variant-default,.talos-alert.appearance-left-border.variant-default{border-left-color:var(--talos-alert-default-icon)}.talos-alert.appearance-accent.variant-default .talos-alert-icon,.talos-alert.appearance-left-border.variant-default .talos-alert-icon{color:var(--talos-alert-default-icon)}.talos-alert.appearance-accent.variant-info,.talos-alert.appearance-left-border.variant-info{border-left-color:var(--talos-alert-info-icon)}.talos-alert.appearance-accent.variant-info .talos-alert-icon,.talos-alert.appearance-left-border.variant-info .talos-alert-icon{color:var(--talos-alert-info-icon)}.talos-alert.appearance-accent.variant-success,.talos-alert.appearance-left-border.variant-success{border-left-color:var(--talos-alert-success-icon)}.talos-alert.appearance-accent.variant-success .talos-alert-icon,.talos-alert.appearance-left-border.variant-success .talos-alert-icon{color:var(--talos-alert-success-icon)}.talos-alert.appearance-accent.variant-warning,.talos-alert.appearance-left-border.variant-warning{border-left-color:var(--talos-alert-warning-icon)}.talos-alert.appearance-accent.variant-warning .talos-alert-icon,.talos-alert.appearance-left-border.variant-warning .talos-alert-icon{color:var(--talos-alert-warning-icon)}.talos-alert.appearance-accent.variant-error,.talos-alert.appearance-left-border.variant-error{border-left-color:var(--talos-alert-error-icon)}.talos-alert.appearance-accent.variant-error .talos-alert-icon,.talos-alert.appearance-left-border.variant-error .talos-alert-icon{color:var(--talos-alert-error-icon)}.talos-alert.appearance-accent.variant-critical,.talos-alert.appearance-left-border.variant-critical{border-left-color:#ef4444}.talos-alert.appearance-accent.variant-critical .talos-alert-icon,.talos-alert.appearance-left-border.variant-critical .talos-alert-icon{color:#ef4444}.talos-alert.appearance-accent.variant-primary,.talos-alert.appearance-left-border.variant-primary{border-left-color:var(--talos-alert-primary-icon)}.talos-alert.appearance-accent.variant-primary .talos-alert-icon,.talos-alert.appearance-left-border.variant-primary .talos-alert-icon{color:var(--talos-alert-primary-icon)}.talos-alert-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px;line-height:1}.talos-alert-icon svg{display:block}.talos-alert-body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:.25rem}.talos-alert-header{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem}.talos-alert-title{margin:0;font-weight:600;line-height:1.35;color:inherit}.talos-alert-message{line-height:1.45;color:inherit;opacity:.95}.talos-alert-severity-badge{display:inline-flex;align-items:center;padding:.125rem .4375rem;border-radius:9999px;font-size:.6875rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;background-color:#00000014;color:inherit}.talos-alert-severity-badge[data-severity=critical]{background-color:#ef4444;color:#fff}.talos-alert-severity-badge[data-severity=error]{background-color:#ef444433;color:#dc2626}.talos-alert-severity-badge[data-severity=warning]{background-color:#f59e0b33;color:#b45309}.talos-alert-severity-badge[data-severity=info]{background-color:#3b82f633;color:#1d4ed8}.talos-alert-severity-badge[data-severity=success]{background-color:#22c55e33;color:#15803d}.talos-alert-actions{display:flex;align-items:center;gap:.5rem;flex-shrink:0;margin-left:auto}.talos-alert-action-btn{display:inline-flex;align-items:center;justify-content:center;padding:.25rem .625rem;font-size:.75rem;font-weight:600;border-radius:var(--talos-border-radius, .375rem);border:1px solid currentColor;background-color:transparent;color:inherit;cursor:pointer;transition:all .15s ease}.talos-alert-action-btn:hover{background-color:#0000000f}.talos-alert-action-btn:active{transform:scale(.97)}.talos-alert-close-btn{display:inline-flex;align-items:center;justify-content:center;padding:.25rem;border:none;background:transparent;color:inherit;opacity:.7;border-radius:var(--talos-border-radius, .375rem);cursor:pointer;transition:all .15s ease}.talos-alert-close-btn:hover{opacity:1;background-color:#00000014}.talos-alert-close-btn:active{transform:scale(.92)}\n"] }]
+        }], propDecorators: { severity: [{ type: i0.Input, args: [{ isSignal: true, alias: "severity", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], message: [{ type: i0.Input, args: [{ isSignal: true, alias: "message", required: false }] }], showIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIcon", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], showSeverityBadge: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSeverityBadge", required: false }] }], dismissible: [{ type: i0.Input, args: [{ isSignal: true, alias: "dismissible", required: false }] }], actionLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionLabel", required: false }] }], bordered: [{ type: i0.Input, args: [{ isSignal: true, alias: "bordered", required: false }] }], customClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "customClass", required: false }] }], dismiss: [{ type: i0.Output, args: ["dismiss"] }], action: [{ type: i0.Output, args: ["action"] }], closed: [{ type: i0.Output, args: ["closed"] }] } });
+
+class TalosAlertContainerComponent {
+    alertService = inject(TalosAlertService);
+    /** Mode of alerts to render from the service ('inline', 'banner', or 'all') */
+    type = input('inline', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
+    targetAlerts = computed(() => {
+        const t = this.type();
+        if (t === 'banner') {
+            return this.alertService.bannerAlerts();
+        }
+        if (t === 'all') {
+            return [...this.alertService.bannerAlerts(), ...this.alertService.alerts()];
+        }
+        return this.alertService.alerts();
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "targetAlerts" }] : /* istanbul ignore next */ []));
+    onDismiss(id) {
+        if (this.type() === 'banner') {
+            this.alertService.dismissBanner(id);
+        }
+        else {
+            this.alertService.dismiss(id);
+        }
+    }
+    onAction(item) {
+        if (item.onAction) {
+            item.onAction();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: TalosAlertContainerComponent, isStandalone: true, selector: "talos-alert-container", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.talos-alert-container-host": "true" } }, ngImport: i0, template: `
+    @if (targetAlerts().length > 0) {
+      <div class="talos-alert-container-stack" [class.is-banner]="type() === 'banner'">
+        @for (item of targetAlerts(); track item.id) {
+          <talos-alert
+            [variant]="item.variant || 'default'"
+            [severity]="item.severity"
+            [appearance]="item.appearance || 'subtle'"
+            [size]="item.size || 'md'"
+            [title]="item.title"
+            [message]="item.message"
+            [showIcon]="item.showIcon ?? true"
+            [icon]="item.icon"
+            [showSeverityBadge]="item.showSeverityBadge ?? false"
+            [dismissible]="item.dismissible ?? true"
+            [actionLabel]="item.actionLabel"
+            [bordered]="item.bordered ?? false"
+            [customClass]="item.customClass || ''"
+            (dismiss)="onDismiss(item.id)"
+            (action)="onAction(item)"
+          />
+        }
+      </div>
+    }
+  `, isInline: true, styles: [":host{display:block;width:100%}.talos-alert-container-stack{display:flex;flex-direction:column;gap:.75rem;width:100%}.talos-alert-container-stack.is-banner{gap:.5rem}.talos-alert-container-stack.is-banner talos-alert{border-radius:0;box-shadow:0 2px 8px #0000001a}\n"], dependencies: [{ kind: "component", type: TalosAlertComponent, selector: "talos-alert", inputs: ["severity", "variant", "appearance", "size", "title", "message", "showIcon", "icon", "showSeverityBadge", "dismissible", "actionLabel", "bordered", "customClass"], outputs: ["dismiss", "action", "closed"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertContainerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'talos-alert-container', imports: [TalosAlertComponent], template: `
+    @if (targetAlerts().length > 0) {
+      <div class="talos-alert-container-stack" [class.is-banner]="type() === 'banner'">
+        @for (item of targetAlerts(); track item.id) {
+          <talos-alert
+            [variant]="item.variant || 'default'"
+            [severity]="item.severity"
+            [appearance]="item.appearance || 'subtle'"
+            [size]="item.size || 'md'"
+            [title]="item.title"
+            [message]="item.message"
+            [showIcon]="item.showIcon ?? true"
+            [icon]="item.icon"
+            [showSeverityBadge]="item.showSeverityBadge ?? false"
+            [dismissible]="item.dismissible ?? true"
+            [actionLabel]="item.actionLabel"
+            [bordered]="item.bordered ?? false"
+            [customClass]="item.customClass || ''"
+            (dismiss)="onDismiss(item.id)"
+            (action)="onAction(item)"
+          />
+        }
+      </div>
+    }
+  `, host: {
+                        '[class.talos-alert-container-host]': 'true'
+                    }, styles: [":host{display:block;width:100%}.talos-alert-container-stack{display:flex;flex-direction:column;gap:.75rem;width:100%}.talos-alert-container-stack.is-banner{gap:.5rem}.talos-alert-container-stack.is-banner talos-alert{border-radius:0;box-shadow:0 2px 8px #0000001a}\n"] }]
+        }], propDecorators: { type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }] } });
+
+/**
+ * Convenience NgModule wrapping standalone alert components and directives.
+ */
+class TalosAlertModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertModule, imports: [TalosAlertComponent,
+            TalosAlertContainerComponent,
+            TalosAlertTitleDirective,
+            TalosAlertDescriptionDirective,
+            TalosAlertActionsDirective,
+            TalosAlertIconDirective], exports: [TalosAlertComponent,
+            TalosAlertContainerComponent,
+            TalosAlertTitleDirective,
+            TalosAlertDescriptionDirective,
+            TalosAlertActionsDirective,
+            TalosAlertIconDirective] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertModule, imports: [TalosAlertComponent,
+            TalosAlertContainerComponent] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosAlertModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        TalosAlertComponent,
+                        TalosAlertContainerComponent,
+                        TalosAlertTitleDirective,
+                        TalosAlertDescriptionDirective,
+                        TalosAlertActionsDirective,
+                        TalosAlertIconDirective
+                    ],
+                    exports: [
+                        TalosAlertComponent,
+                        TalosAlertContainerComponent,
+                        TalosAlertTitleDirective,
+                        TalosAlertDescriptionDirective,
+                        TalosAlertActionsDirective,
+                        TalosAlertIconDirective
+                    ]
+                }]
+        }] });
+
+/** Injection token for data passed to a dialog component */
+const TALOS_DIALOG_DATA = new InjectionToken('TALOS_DIALOG_DATA');
+/** Injection token for dialog configuration */
+const TALOS_DIALOG_CONFIG = new InjectionToken('TALOS_DIALOG_CONFIG');
+/** Injection token for dialog reference */
+const TALOS_DIALOG_REF = new InjectionToken('TALOS_DIALOG_REF');
+
+/**
+ * Reference to an actively open dialog instance.
+ */
+class TalosDialogRef {
+    cdkDialogRef;
+    config;
+    data;
+    constructor(cdkDialogRef, config, data) {
+        this.cdkDialogRef = cdkDialogRef;
+        this.config = config;
+        this.data = data;
+    }
+    /** Unique identifier for the dialog */
+    get id() {
+        return this.cdkDialogRef.id;
+    }
+    /** Observable that emits when the dialog is closed with the result value */
+    get closed() {
+        return this.cdkDialogRef.closed;
+    }
+    /** Observable that emits when the backdrop overlay is clicked */
+    get backdropClick() {
+        return this.cdkDialogRef.backdropClick;
+    }
+    /** Observable that emits keyboard events received by the dialog overlay */
+    get keydownEvents() {
+        return this.cdkDialogRef.keydownEvents;
+    }
+    /**
+     * Close the dialog, optionally returning a result value to the opener.
+     */
+    close(result) {
+        this.cdkDialogRef.close(result);
+    }
+    /**
+     * Dynamically update the size of the dialog panel.
+     */
+    updateSize(width = '', height = '') {
+        this.cdkDialogRef.updateSize(width, height);
+        return this;
+    }
+    /**
+     * Add CSS class(es) to the dialog overlay panel.
+     */
+    addPanelClass(classes) {
+        this.cdkDialogRef.addPanelClass(classes);
+        return this;
+    }
+    /**
+     * Remove CSS class(es) from the dialog overlay panel.
+     */
+    removePanelClass(classes) {
+        this.cdkDialogRef.removePanelClass(classes);
+        return this;
+    }
+}
+
+let uniqueTitleId = 0;
+let uniqueDescId = 0;
+/**
+ * Directive for the dialog title element.
+ * Automatically handles accessible ARIA labeling.
+ */
+class TalosDialogTitleDirective {
+    /** Optional custom ID for accessibility linking */
+    id = input(`talos-dialog-title-${++uniqueTitleId}`, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
+    dialogRef = inject(DialogRef, { optional: true });
+    ngOnInit() {
+        if (this.dialogRef) {
+            // Allow CDK or parent container to associate the title ID
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.1", type: TalosDialogTitleDirective, isStandalone: true, selector: "[talosDialogTitle]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.id": "id()" }, classAttribute: "talos-dialog-title" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogTitleDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[talosDialogTitle]',
+                    host: {
+                        'class': 'talos-dialog-title',
+                        '[attr.id]': 'id()'
+                    }
+                }]
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
+/**
+ * Directive for the dialog description/subtitle element.
+ * Automatically handles accessible ARIA descriptions.
+ */
+class TalosDialogDescriptionDirective {
+    /** Optional custom ID for accessibility linking */
+    id = input(`talos-dialog-desc-${++uniqueDescId}`, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogDescriptionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.1", type: TalosDialogDescriptionDirective, isStandalone: true, selector: "[talosDialogDescription]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.id": "id()" }, classAttribute: "talos-dialog-description" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogDescriptionDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[talosDialogDescription]',
+                    host: {
+                        'class': 'talos-dialog-description',
+                        '[attr.id]': 'id()'
+                    }
+                }]
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
+/**
+ * Directive placed on buttons inside a dialog to trigger dismissal.
+ * Passes the optional [talosDialogClose] value as the dialog result.
+ */
+class TalosDialogCloseDirective {
+    /** Value returned when closing the dialog */
+    dialogResult = input(undefined, { ...(ngDevMode ? { debugName: "dialogResult" } : /* istanbul ignore next */ {}), alias: 'talosDialogClose' });
+    dialogRef = inject(DialogRef, { optional: true });
+    onClick(event) {
+        if (this.dialogRef) {
+            this.dialogRef.close(this.dialogResult());
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogCloseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.1", type: TalosDialogCloseDirective, isStandalone: true, selector: "[talosDialogClose]", inputs: { dialogResult: { classPropertyName: "dialogResult", publicName: "talosDialogClose", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick($event)" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogCloseDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[talosDialogClose]',
+                    host: {
+                        '(click)': 'onClick($event)'
+                    }
+                }]
+        }], propDecorators: { dialogResult: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosDialogClose", required: false }] }] } });
+
+class TalosDialogHeaderComponent {
+    /** Main dialog title */
+    title = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "title" }] : /* istanbul ignore next */ []));
+    /** Subtitle or helper description */
+    subtitle = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "subtitle" }] : /* istanbul ignore next */ []));
+    /** Visual accent variant */
+    variant = input('default', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    /** Whether to show a bottom divider line */
+    divider = input(true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "divider" }] : /* istanbul ignore next */ []));
+    /** Whether to show the top-right X close button */
+    showCloseButton = input(true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "showCloseButton" }] : /* istanbul ignore next */ []));
+    /** Accessible label for the close button */
+    closeButtonAriaLabel = input('Close dialog', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "closeButtonAriaLabel" }] : /* istanbul ignore next */ []));
+    /** Emitted when the close button is clicked */
+    closeClick = output();
+    dialogRef = inject(DialogRef, { optional: true });
+    handleClose(event) {
+        this.closeClick.emit(event);
+        if (this.dialogRef) {
+            this.dialogRef.close();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: TalosDialogHeaderComponent, isStandalone: true, selector: "talos-dialog-header, [talosDialogHeader]", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, divider: { classPropertyName: "divider", publicName: "divider", isSignal: true, isRequired: false, transformFunction: null }, showCloseButton: { classPropertyName: "showCloseButton", publicName: "showCloseButton", isSignal: true, isRequired: false, transformFunction: null }, closeButtonAriaLabel: { classPropertyName: "closeButtonAriaLabel", publicName: "closeButtonAriaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closeClick: "closeClick" }, host: { properties: { "class.has-divider": "divider()", "class.variant-danger": "variant() === \"danger\"", "class.variant-warning": "variant() === \"warning\"", "class.variant-info": "variant() === \"info\"", "class.variant-success": "variant() === \"success\"" }, classAttribute: "talos-dialog-header-host" }, ngImport: i0, template: "<div class=\"talos-dialog-header-inner\">\n  <div class=\"talos-dialog-header-left\">\n    <div class=\"talos-dialog-header-icon-slot\">\n      <ng-content select=\"[talos-dialog-icon], [dialog-icon], lucide-icon, svg\"></ng-content>\n    </div>\n\n    <div class=\"talos-dialog-header-text\">\n      @if (title()) {\n        <h2 talosDialogTitle class=\"talos-dialog-header-title\">{{ title() }}</h2>\n      } @else {\n        <ng-content select=\"[talosDialogTitle], h2, h3\"></ng-content>\n      }\n\n      @if (subtitle()) {\n        <p talosDialogDescription class=\"talos-dialog-header-subtitle\">{{ subtitle() }}</p>\n      } @else {\n        <ng-content select=\"[talosDialogDescription], p\"></ng-content>\n      }\n    </div>\n  </div>\n\n  <div class=\"talos-dialog-header-actions\">\n    <ng-content select=\"[talos-dialog-header-actions]\"></ng-content>\n\n    @if (showCloseButton()) {\n      <button\n        type=\"button\"\n        class=\"talos-dialog-header-close-btn\"\n        [attr.aria-label]=\"closeButtonAriaLabel()\"\n        (click)=\"handleClose($event)\"\n      >\n        <svg lucideX [size]=\"18\" aria-hidden=\"true\"></svg>\n      </button>\n    }\n  </div>\n</div>\n", styles: [":host{display:block;flex-shrink:0;position:relative;padding:1.25rem 1.5rem;box-sizing:border-box}:host.has-divider{border-bottom:1px solid var(--talos-dialog-border, var(--talos-border-color, #e2e8f0))}.talos-dialog-header-inner{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.talos-dialog-header-left{display:flex;align-items:flex-start;gap:.75rem;flex:1;min-width:0}.talos-dialog-header-icon-slot{display:flex;align-items:center;justify-content:center;flex-shrink:0}.talos-dialog-header-icon-slot:empty{display:none}.talos-dialog-header-text{display:flex;flex-direction:column;gap:.25rem;min-width:0;flex:1}.talos-dialog-header-title{margin:0;font-size:1.125rem;font-weight:600;line-height:1.4;color:var(--talos-dialog-title-color, var(--talos-text-color, #0f172a));letter-spacing:-.01em}.talos-dialog-header-subtitle{margin:0;font-size:.875rem;line-height:1.4;color:var(--talos-dialog-subtitle-color, var(--talos-text-muted, #64748b))}.talos-dialog-header-actions{display:flex;align-items:center;gap:.5rem;flex-shrink:0}.talos-dialog-header-close-btn{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;padding:0;border-radius:var(--talos-border-radius, .375rem);border:none;background:transparent;color:var(--talos-text-muted, #64748b);cursor:pointer;transition:background-color .15s ease,color .15s ease}.talos-dialog-header-close-btn:hover{background-color:var(--talos-bg-subtle, #f1f5f9);color:var(--talos-text-color, #0f172a)}.talos-dialog-header-close-btn:focus-visible{outline:none;box-shadow:var(--talos-focus-ring, 0 0 0 3px rgba(37, 99, 235, .15))}:host(.variant-danger) .talos-dialog-header-title{color:var(--talos-error-color, #ef4444)}:host(.variant-warning) .talos-dialog-header-title{color:var(--talos-warning-color, #d97706)}:host(.variant-info) .talos-dialog-header-title{color:var(--talos-primary-color, #2563eb)}:host(.variant-success) .talos-dialog-header-title{color:var(--talos-success-color, #16a34a)}\n"], dependencies: [{ kind: "component", type: LucideX, selector: "svg[lucideX]" }, { kind: "directive", type: TalosDialogTitleDirective, selector: "[talosDialogTitle]", inputs: ["id"] }, { kind: "directive", type: TalosDialogDescriptionDirective, selector: "[talosDialogDescription]", inputs: ["id"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogHeaderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'talos-dialog-header, [talosDialogHeader]', imports: [LucideX, TalosDialogTitleDirective, TalosDialogDescriptionDirective], host: {
+                        'class': 'talos-dialog-header-host',
+                        '[class.has-divider]': 'divider()',
+                        '[class.variant-danger]': 'variant() === "danger"',
+                        '[class.variant-warning]': 'variant() === "warning"',
+                        '[class.variant-info]': 'variant() === "info"',
+                        '[class.variant-success]': 'variant() === "success"'
+                    }, template: "<div class=\"talos-dialog-header-inner\">\n  <div class=\"talos-dialog-header-left\">\n    <div class=\"talos-dialog-header-icon-slot\">\n      <ng-content select=\"[talos-dialog-icon], [dialog-icon], lucide-icon, svg\"></ng-content>\n    </div>\n\n    <div class=\"talos-dialog-header-text\">\n      @if (title()) {\n        <h2 talosDialogTitle class=\"talos-dialog-header-title\">{{ title() }}</h2>\n      } @else {\n        <ng-content select=\"[talosDialogTitle], h2, h3\"></ng-content>\n      }\n\n      @if (subtitle()) {\n        <p talosDialogDescription class=\"talos-dialog-header-subtitle\">{{ subtitle() }}</p>\n      } @else {\n        <ng-content select=\"[talosDialogDescription], p\"></ng-content>\n      }\n    </div>\n  </div>\n\n  <div class=\"talos-dialog-header-actions\">\n    <ng-content select=\"[talos-dialog-header-actions]\"></ng-content>\n\n    @if (showCloseButton()) {\n      <button\n        type=\"button\"\n        class=\"talos-dialog-header-close-btn\"\n        [attr.aria-label]=\"closeButtonAriaLabel()\"\n        (click)=\"handleClose($event)\"\n      >\n        <svg lucideX [size]=\"18\" aria-hidden=\"true\"></svg>\n      </button>\n    }\n  </div>\n</div>\n", styles: [":host{display:block;flex-shrink:0;position:relative;padding:1.25rem 1.5rem;box-sizing:border-box}:host.has-divider{border-bottom:1px solid var(--talos-dialog-border, var(--talos-border-color, #e2e8f0))}.talos-dialog-header-inner{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.talos-dialog-header-left{display:flex;align-items:flex-start;gap:.75rem;flex:1;min-width:0}.talos-dialog-header-icon-slot{display:flex;align-items:center;justify-content:center;flex-shrink:0}.talos-dialog-header-icon-slot:empty{display:none}.talos-dialog-header-text{display:flex;flex-direction:column;gap:.25rem;min-width:0;flex:1}.talos-dialog-header-title{margin:0;font-size:1.125rem;font-weight:600;line-height:1.4;color:var(--talos-dialog-title-color, var(--talos-text-color, #0f172a));letter-spacing:-.01em}.talos-dialog-header-subtitle{margin:0;font-size:.875rem;line-height:1.4;color:var(--talos-dialog-subtitle-color, var(--talos-text-muted, #64748b))}.talos-dialog-header-actions{display:flex;align-items:center;gap:.5rem;flex-shrink:0}.talos-dialog-header-close-btn{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;padding:0;border-radius:var(--talos-border-radius, .375rem);border:none;background:transparent;color:var(--talos-text-muted, #64748b);cursor:pointer;transition:background-color .15s ease,color .15s ease}.talos-dialog-header-close-btn:hover{background-color:var(--talos-bg-subtle, #f1f5f9);color:var(--talos-text-color, #0f172a)}.talos-dialog-header-close-btn:focus-visible{outline:none;box-shadow:var(--talos-focus-ring, 0 0 0 3px rgba(37, 99, 235, .15))}:host(.variant-danger) .talos-dialog-header-title{color:var(--talos-error-color, #ef4444)}:host(.variant-warning) .talos-dialog-header-title{color:var(--talos-warning-color, #d97706)}:host(.variant-info) .talos-dialog-header-title{color:var(--talos-primary-color, #2563eb)}:host(.variant-success) .talos-dialog-header-title{color:var(--talos-success-color, #16a34a)}\n"] }]
+        }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], divider: [{ type: i0.Input, args: [{ isSignal: true, alias: "divider", required: false }] }], showCloseButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCloseButton", required: false }] }], closeButtonAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeButtonAriaLabel", required: false }] }], closeClick: [{ type: i0.Output, args: ["closeClick"] }] } });
+
+class TalosDialogContentComponent {
+    /** Internal padding size */
+    padding = input('md', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "padding" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: TalosDialogContentComponent, isStandalone: true, selector: "talos-dialog-content, [talosDialogContent]", inputs: { padding: { classPropertyName: "padding", publicName: "padding", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.padding-none": "padding() === \"none\"", "class.padding-sm": "padding() === \"sm\"", "class.padding-md": "padding() === \"md\"", "class.padding-lg": "padding() === \"lg\"" }, classAttribute: "talos-dialog-content-host" }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{display:block;flex:1 1 auto;overflow-y:auto;overflow-x:hidden;box-sizing:border-box;color:var(--talos-text-color, #0f172a);font-size:.9375rem;line-height:1.5;scrollbar-width:thin;scrollbar-color:var(--talos-border-color, #cbd5e1) transparent}:host::-webkit-scrollbar{width:6px;height:6px}:host::-webkit-scrollbar-track{background:transparent}:host::-webkit-scrollbar-thumb{background-color:var(--talos-border-color, #cbd5e1);border-radius:9999px}:host::-webkit-scrollbar-thumb:hover{background-color:var(--talos-border-hover, #64748b)}:host.padding-none{padding:0}:host.padding-sm{padding:1rem 1.25rem}:host.padding-md{padding:1.5rem}:host.padding-lg{padding:2rem}\n"] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogContentComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'talos-dialog-content, [talosDialogContent]', host: {
+                        'class': 'talos-dialog-content-host',
+                        '[class.padding-none]': 'padding() === "none"',
+                        '[class.padding-sm]': 'padding() === "sm"',
+                        '[class.padding-md]': 'padding() === "md"',
+                        '[class.padding-lg]': 'padding() === "lg"'
+                    }, template: "<ng-content></ng-content>\n", styles: [":host{display:block;flex:1 1 auto;overflow-y:auto;overflow-x:hidden;box-sizing:border-box;color:var(--talos-text-color, #0f172a);font-size:.9375rem;line-height:1.5;scrollbar-width:thin;scrollbar-color:var(--talos-border-color, #cbd5e1) transparent}:host::-webkit-scrollbar{width:6px;height:6px}:host::-webkit-scrollbar-track{background:transparent}:host::-webkit-scrollbar-thumb{background-color:var(--talos-border-color, #cbd5e1);border-radius:9999px}:host::-webkit-scrollbar-thumb:hover{background-color:var(--talos-border-hover, #64748b)}:host.padding-none{padding:0}:host.padding-sm{padding:1rem 1.25rem}:host.padding-md{padding:1.5rem}:host.padding-lg{padding:2rem}\n"] }]
+        }], propDecorators: { padding: [{ type: i0.Input, args: [{ isSignal: true, alias: "padding", required: false }] }] } });
+
+class TalosDialogFooterComponent {
+    /** Button alignment in footer */
+    align = input('end', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
+    /** Whether to show a top divider border */
+    divider = input(true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "divider" }] : /* istanbul ignore next */ []));
+    /** Whether the footer sticks to the bottom when content scrolls */
+    sticky = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "sticky" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: TalosDialogFooterComponent, isStandalone: true, selector: "talos-dialog-footer, [talosDialogFooter]", inputs: { align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, divider: { classPropertyName: "divider", publicName: "divider", isSignal: true, isRequired: false, transformFunction: null }, sticky: { classPropertyName: "sticky", publicName: "sticky", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.has-divider": "divider()", "class.is-sticky": "sticky()", "class.align-start": "align() === \"start\"", "class.align-center": "align() === \"center\"", "class.align-end": "align() === \"end\"", "class.align-space-between": "align() === \"space-between\"" }, classAttribute: "talos-dialog-footer-host" }, ngImport: i0, template: "<div class=\"talos-dialog-footer-inner\">\n  <ng-content></ng-content>\n</div>\n", styles: [":host{display:block;flex-shrink:0;padding:1rem 1.5rem;box-sizing:border-box;background-color:var(--talos-dialog-footer-bg, transparent)}:host.has-divider{border-top:1px solid var(--talos-dialog-border, var(--talos-border-color, #e2e8f0))}:host.is-sticky{position:sticky;bottom:0;z-index:10;background-color:var(--talos-dialog-bg, var(--talos-card-bg, #ffffff))}.talos-dialog-footer-inner{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}:host(.align-start) .talos-dialog-footer-inner{justify-content:flex-start}:host(.align-center) .talos-dialog-footer-inner{justify-content:center}:host(.align-end) .talos-dialog-footer-inner{justify-content:flex-end}:host(.align-space-between) .talos-dialog-footer-inner{justify-content:space-between}\n"] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogFooterComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'talos-dialog-footer, [talosDialogFooter]', host: {
+                        'class': 'talos-dialog-footer-host',
+                        '[class.has-divider]': 'divider()',
+                        '[class.is-sticky]': 'sticky()',
+                        '[class.align-start]': 'align() === "start"',
+                        '[class.align-center]': 'align() === "center"',
+                        '[class.align-end]': 'align() === "end"',
+                        '[class.align-space-between]': 'align() === "space-between"'
+                    }, template: "<div class=\"talos-dialog-footer-inner\">\n  <ng-content></ng-content>\n</div>\n", styles: [":host{display:block;flex-shrink:0;padding:1rem 1.5rem;box-sizing:border-box;background-color:var(--talos-dialog-footer-bg, transparent)}:host.has-divider{border-top:1px solid var(--talos-dialog-border, var(--talos-border-color, #e2e8f0))}:host.is-sticky{position:sticky;bottom:0;z-index:10;background-color:var(--talos-dialog-bg, var(--talos-card-bg, #ffffff))}.talos-dialog-footer-inner{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}:host(.align-start) .talos-dialog-footer-inner{justify-content:flex-start}:host(.align-center) .talos-dialog-footer-inner{justify-content:center}:host(.align-end) .talos-dialog-footer-inner{justify-content:flex-end}:host(.align-space-between) .talos-dialog-footer-inner{justify-content:space-between}\n"] }]
+        }], propDecorators: { align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }], divider: [{ type: i0.Input, args: [{ isSignal: true, alias: "divider", required: false }] }], sticky: [{ type: i0.Input, args: [{ isSignal: true, alias: "sticky", required: false }] }] } });
+
+class TalosConfirmDialogComponent {
+    data = inject(TALOS_DIALOG_DATA, { optional: true }) || {
+        title: 'Confirmation',
+        message: 'Are you sure you want to proceed?'
+    };
+    dialogRef = inject(DialogRef);
+    title = this.data.title;
+    message = this.data.message;
+    isTemplateMessage = typeof this.data.message !== 'string';
+    confirmText = this.data.confirmText ?? 'Confirm';
+    cancelText = this.data.cancelText ?? 'Cancel';
+    variant = this.data.variant ?? 'primary';
+    showCancel = this.data.showCancel ?? true;
+    get confirmButtonVariant() {
+        if (this.variant === 'danger')
+            return 'danger';
+        return 'primary';
+    }
+    onConfirm() {
+        this.dialogRef.close(true);
+    }
+    onCancel() {
+        this.dialogRef.close(false);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosConfirmDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: TalosConfirmDialogComponent, isStandalone: true, selector: "talos-confirm-dialog", host: { classAttribute: "talos-confirm-dialog-host" }, ngImport: i0, template: "<talos-dialog-header [title]=\"title\" [variant]=\"variant\" [divider]=\"false\">\n  <div class=\"confirm-icon-wrapper\" [class]=\"'variant-' + variant\" talos-dialog-icon>\n    @switch (variant) {\n      @case ('danger') {\n        <svg lucideAlertCircle [size]=\"22\"></svg>\n      }\n      @case ('warning') {\n        <svg lucideAlertTriangle [size]=\"22\"></svg>\n      }\n      @case ('success') {\n        <svg lucideCheckCircle2 [size]=\"22\"></svg>\n      }\n      @default {\n        <svg lucideInfo [size]=\"22\"></svg>\n      }\n    }\n  </div>\n</talos-dialog-header>\n\n<talos-dialog-content padding=\"sm\">\n  @if (isTemplateMessage) {\n    <ng-container [ngTemplateOutlet]=\"$any(message)\"></ng-container>\n  } @else {\n    <p class=\"confirm-message-text\">{{ message }}</p>\n  }\n</talos-dialog-content>\n\n<talos-dialog-footer [divider]=\"false\" align=\"end\">\n  @if (showCancel) {\n    <button talosButton variant=\"secondary\" size=\"md\" (click)=\"onCancel()\">\n      {{ cancelText }}\n    </button>\n  }\n  <button talosButton [variant]=\"confirmButtonVariant\" size=\"md\" (click)=\"onConfirm()\">\n    {{ confirmText }}\n  </button>\n</talos-dialog-footer>\n", styles: [":host{display:flex;flex-direction:column;box-sizing:border-box}.confirm-icon-wrapper{display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:9999px;flex-shrink:0}.confirm-icon-wrapper.variant-default,.confirm-icon-wrapper.variant-primary,.confirm-icon-wrapper.variant-info{background-color:var(--talos-primary-light, #eff6ff);color:var(--talos-primary-color, #2563eb)}.confirm-icon-wrapper.variant-danger{background-color:#ef44441f;color:var(--talos-error-color, #ef4444)}.confirm-icon-wrapper.variant-warning{background-color:#d977061f;color:var(--talos-warning-color, #d97706)}.confirm-icon-wrapper.variant-success{background-color:#16a34a1f;color:var(--talos-success-color, #16a34a)}.confirm-message-text{margin:0;color:var(--talos-text-muted, #64748b);font-size:.9375rem;line-height:1.55}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: TalosButtonDirective, selector: "button[talosButton], a[talosButton], button[talos-btn], a[talos-btn]", inputs: ["variant", "size", "iconOnly", "fullWidth", "pill", "loading", "disabled", "animation", "spinning", "popping", "feedback"] }, { kind: "component", type: TalosDialogHeaderComponent, selector: "talos-dialog-header, [talosDialogHeader]", inputs: ["title", "subtitle", "variant", "divider", "showCloseButton", "closeButtonAriaLabel"], outputs: ["closeClick"] }, { kind: "component", type: TalosDialogContentComponent, selector: "talos-dialog-content, [talosDialogContent]", inputs: ["padding"] }, { kind: "component", type: TalosDialogFooterComponent, selector: "talos-dialog-footer, [talosDialogFooter]", inputs: ["align", "divider", "sticky"] }, { kind: "component", type: LucideAlertTriangle, selector: "svg[lucideTriangleAlert], svg[lucideAlertTriangle]" }, { kind: "component", type: LucideInfo, selector: "svg[lucideInfo]" }, { kind: "component", type: LucideCheckCircle2, selector: "svg[lucideCircleCheck], svg[lucideCheckCircle2]" }, { kind: "component", type: LucideAlertCircle, selector: "svg[lucideCircleAlert], svg[lucideAlertCircle]" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosConfirmDialogComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'talos-confirm-dialog', imports: [
+                        NgTemplateOutlet,
+                        TalosButtonDirective,
+                        TalosDialogHeaderComponent,
+                        TalosDialogContentComponent,
+                        TalosDialogFooterComponent,
+                        LucideAlertTriangle,
+                        LucideInfo,
+                        LucideCheckCircle2,
+                        LucideAlertCircle
+                    ], host: {
+                        'class': 'talos-confirm-dialog-host'
+                    }, template: "<talos-dialog-header [title]=\"title\" [variant]=\"variant\" [divider]=\"false\">\n  <div class=\"confirm-icon-wrapper\" [class]=\"'variant-' + variant\" talos-dialog-icon>\n    @switch (variant) {\n      @case ('danger') {\n        <svg lucideAlertCircle [size]=\"22\"></svg>\n      }\n      @case ('warning') {\n        <svg lucideAlertTriangle [size]=\"22\"></svg>\n      }\n      @case ('success') {\n        <svg lucideCheckCircle2 [size]=\"22\"></svg>\n      }\n      @default {\n        <svg lucideInfo [size]=\"22\"></svg>\n      }\n    }\n  </div>\n</talos-dialog-header>\n\n<talos-dialog-content padding=\"sm\">\n  @if (isTemplateMessage) {\n    <ng-container [ngTemplateOutlet]=\"$any(message)\"></ng-container>\n  } @else {\n    <p class=\"confirm-message-text\">{{ message }}</p>\n  }\n</talos-dialog-content>\n\n<talos-dialog-footer [divider]=\"false\" align=\"end\">\n  @if (showCancel) {\n    <button talosButton variant=\"secondary\" size=\"md\" (click)=\"onCancel()\">\n      {{ cancelText }}\n    </button>\n  }\n  <button talosButton [variant]=\"confirmButtonVariant\" size=\"md\" (click)=\"onConfirm()\">\n    {{ confirmText }}\n  </button>\n</talos-dialog-footer>\n", styles: [":host{display:flex;flex-direction:column;box-sizing:border-box}.confirm-icon-wrapper{display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:9999px;flex-shrink:0}.confirm-icon-wrapper.variant-default,.confirm-icon-wrapper.variant-primary,.confirm-icon-wrapper.variant-info{background-color:var(--talos-primary-light, #eff6ff);color:var(--talos-primary-color, #2563eb)}.confirm-icon-wrapper.variant-danger{background-color:#ef44441f;color:var(--talos-error-color, #ef4444)}.confirm-icon-wrapper.variant-warning{background-color:#d977061f;color:var(--talos-warning-color, #d97706)}.confirm-icon-wrapper.variant-success{background-color:#16a34a1f;color:var(--talos-success-color, #16a34a)}.confirm-message-text{margin:0;color:var(--talos-text-muted, #64748b);font-size:.9375rem;line-height:1.55}\n"] }]
+        }] });
+
+class TalosDialogService {
+    cdkDialog = inject(Dialog);
+    injector = inject(Injector);
+    /** Signal of currently open dialog references */
+    openDialogs = signal([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "openDialogs" }] : /* istanbul ignore next */ []));
+    /**
+     * Open a component or template inside a modal dialog.
+     */
+    open(componentOrTemplate, config = {}) {
+        const size = config.size ?? 'md';
+        const backdropBlur = config.backdropBlur ?? false;
+        const panelClasses = ['talos-dialog-panel', `talos-dialog-size-${size}`];
+        if (config.panelClass) {
+            if (Array.isArray(config.panelClass)) {
+                panelClasses.push(...config.panelClass);
+            }
+            else {
+                panelClasses.push(config.panelClass);
+            }
+        }
+        const backdropClasses = ['talos-dialog-backdrop'];
+        if (backdropBlur === true || backdropBlur === 'md') {
+            backdropClasses.push('talos-dialog-backdrop-blur-md');
+        }
+        else if (backdropBlur === 'sm') {
+            backdropClasses.push('talos-dialog-backdrop-blur-sm');
+        }
+        else if (backdropBlur === 'lg') {
+            backdropClasses.push('talos-dialog-backdrop-blur-lg');
+        }
+        if (config.backdropClass) {
+            if (Array.isArray(config.backdropClass)) {
+                backdropClasses.push(...config.backdropClass);
+            }
+            else {
+                backdropClasses.push(config.backdropClass);
+            }
+        }
+        const disableClose = config.disableClose ?? false;
+        let talosRef = null;
+        const cdkConfig = {
+            panelClass: panelClasses,
+            backdropClass: backdropClasses,
+            hasBackdrop: config.hasBackdrop ?? true,
+            disableClose: disableClose,
+            closeOnNavigation: true,
+            autoFocus: config.autoFocus ?? 'first-tabbable',
+            restoreFocus: config.restoreFocus ?? true,
+            ariaLabel: config.ariaLabel,
+            ariaLabelledBy: config.ariaLabelledBy,
+            ariaDescribedBy: config.ariaDescribedBy,
+            role: config.role ?? 'dialog',
+            id: config.id,
+            width: config.width,
+            minWidth: config.minWidth,
+            maxWidth: config.maxWidth,
+            height: config.height,
+            minHeight: config.minHeight,
+            maxHeight: config.maxHeight,
+            data: config.data,
+            injector: this.injector,
+            providers: (cdkDialogRef) => {
+                talosRef = new TalosDialogRef(cdkDialogRef, config, config.data);
+                return [
+                    { provide: TalosDialogRef, useValue: talosRef },
+                    { provide: TALOS_DIALOG_REF, useValue: talosRef },
+                    { provide: TALOS_DIALOG_DATA, useValue: config.data },
+                    { provide: TALOS_DIALOG_CONFIG, useValue: config }
+                ];
+            }
+        };
+        const cdkRef = this.cdkDialog.open(componentOrTemplate, cdkConfig);
+        if (!talosRef) {
+            talosRef = new TalosDialogRef(cdkRef, config, config.data);
+        }
+        const resolvedTalosRef = talosRef;
+        // Track active dialogs
+        this.openDialogs.update(current => [...current, resolvedTalosRef]);
+        cdkRef.closed.subscribe(() => {
+            this.openDialogs.update(current => current.filter(d => d.id !== resolvedTalosRef.id));
+        });
+        return resolvedTalosRef;
+    }
+    /**
+     * Convenience helper to display a confirmation dialog.
+     */
+    confirm(options) {
+        return this.open(TalosConfirmDialogComponent, {
+            size: options.size ?? 'sm',
+            backdropBlur: options.backdropBlur ?? true,
+            disableClose: options.disableClose ?? false,
+            role: 'alertdialog',
+            data: options
+        });
+    }
+    /**
+     * Convenience helper to display an alert dialog.
+     */
+    alert(options) {
+        return this.open(TalosConfirmDialogComponent, {
+            size: options.size ?? 'sm',
+            backdropBlur: options.backdropBlur ?? true,
+            role: 'alertdialog',
+            data: {
+                ...options,
+                showCancel: false,
+                confirmText: options.okText ?? 'OK'
+            }
+        });
+    }
+    /**
+     * Close all currently open dialogs.
+     */
+    closeAll() {
+        this.cdkDialog.closeAll();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+const DIALOG_COMPONENTS = [
+    TalosDialogHeaderComponent,
+    TalosDialogContentComponent,
+    TalosDialogFooterComponent,
+    TalosConfirmDialogComponent,
+    TalosDialogTitleDirective,
+    TalosDialogDescriptionDirective,
+    TalosDialogCloseDirective
+];
+class TalosDialogModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogModule, imports: [TalosDialogHeaderComponent,
+            TalosDialogContentComponent,
+            TalosDialogFooterComponent,
+            TalosConfirmDialogComponent,
+            TalosDialogTitleDirective,
+            TalosDialogDescriptionDirective,
+            TalosDialogCloseDirective], exports: [TalosDialogHeaderComponent,
+            TalosDialogContentComponent,
+            TalosDialogFooterComponent,
+            TalosConfirmDialogComponent,
+            TalosDialogTitleDirective,
+            TalosDialogDescriptionDirective,
+            TalosDialogCloseDirective] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogModule, imports: [TalosDialogHeaderComponent,
+            TalosConfirmDialogComponent] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDialogModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [...DIALOG_COMPONENTS],
+                    exports: [...DIALOG_COMPONENTS]
+                }]
+        }] });
+
+/**
+ * Clamps a numeric value between a minimum and maximum threshold.
+ *
+ * @param value The value to clamp
+ * @param min The lower bound (inclusive)
+ * @param max The upper bound (inclusive)
+ * @returns Clamped numerical value
+ */
+function clampProgress(value, min, max) {
+    if (isNaN(value)) {
+        return min;
+    }
+    if (min >= max) {
+        return min;
+    }
+    return Math.min(Math.max(value, min), max);
+}
+/**
+ * Calculates percentage completion (0 to 100) based on value, min, and max.
+ *
+ * @param value Current progress value
+ * @param min Minimum possible value
+ * @param max Maximum possible value
+ * @returns Scaled percentage between 0 and 100
+ */
+function calculatePercentage(value, min, max) {
+    if (isNaN(value) || min >= max) {
+        return 0;
+    }
+    const clamped = clampProgress(value, min, max);
+    return ((clamped - min) / (max - min)) * 100;
+}
+/**
+ * Normalizes CSS dimension input (number converted to px string, or raw string).
+ *
+ * @param value Dimension input as string or number
+ * @returns CSS dimension string or undefined
+ */
+function resolveProgressDimension(value) {
+    if (value === null || value === undefined || value === '') {
+        return undefined;
+    }
+    if (typeof value === 'number') {
+        return `${value}px`;
+    }
+    const trimmed = value.trim();
+    if (/^\d+$/.test(trimmed)) {
+        return `${trimmed}px`;
+    }
+    return trimmed;
+}
+
+/**
+ * Directive for projecting custom header label content into a `<talos-progress-bar>`.
+ *
+ * @example
+ * ```html
+ * <talos-progress-bar [value]="uploadProgress()">
+ *   <div talosProgressLabel class="flex items-center gap-2">
+ *     <span>Uploading assets</span>
+ *     <span class="talos-badge talos-badge--sm talos-badge--info">Active</span>
+ *   </div>
+ * </talos-progress-bar>
+ * ```
+ */
+class TalosProgressLabelDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosProgressLabelDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.1", type: TalosProgressLabelDirective, isStandalone: true, selector: "[talosProgressLabel], talos-progress-label", host: { classAttribute: "talos-progress-label" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosProgressLabelDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[talosProgressLabel], talos-progress-label',
+                    host: {
+                        'class': 'talos-progress-label'
+                    }
+                }]
+        }] });
+/**
+ * Directive for projecting custom formatted value or badge indicator into a `<talos-progress-bar>`.
+ *
+ * @example
+ * ```html
+ * <talos-progress-bar [value]="75">
+ *   <span talosProgressValue class="font-mono text-xs">750 / 1,000 MB</span>
+ * </talos-progress-bar>
+ * ```
+ */
+class TalosProgressValueDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosProgressValueDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.1", type: TalosProgressValueDirective, isStandalone: true, selector: "[talosProgressValue], talos-progress-value", host: { classAttribute: "talos-progress-value" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosProgressValueDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[talosProgressValue], talos-progress-value',
+                    host: {
+                        'class': 'talos-progress-value'
+                    }
+                }]
+        }] });
+/**
+ * Directive for projecting auxiliary description, ETA, or subtext beneath a `<talos-progress-bar>`.
+ *
+ * @example
+ * ```html
+ * <talos-progress-bar [value]="42">
+ *   <span talosProgressHint>Estimated time remaining: 2 minutes 45 seconds</span>
+ * </talos-progress-bar>
+ * ```
+ */
+class TalosProgressHintDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosProgressHintDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.1", type: TalosProgressHintDirective, isStandalone: true, selector: "[talosProgressHint], talos-progress-hint", host: { classAttribute: "talos-progress-hint" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosProgressHintDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[talosProgressHint], talos-progress-hint',
+                    host: {
+                        'class': 'talos-progress-hint'
+                    }
+                }]
+        }] });
+
+/**
+ * Modern, accessible linear progress bar component for asynchronous task completion,
+ * asset uploads, streaming buffer states, and metric progress visualization.
+ *
+ * Fully reactive via Angular signals, with support for indeterminate/buffer modes,
+ * striped animated fills, semantic color variants, custom sizes, inside/inline labels,
+ * and comprehensive WCAG AA accessibility attributes.
+ *
+ * @example
+ * ```html
+ * <!-- Determinate task progress -->
+ * <talos-progress-bar [value]="65" label="Uploading telemetry" showValue />
+ *
+ * <!-- Indeterminate background worker -->
+ * <talos-progress-bar mode="indeterminate" variant="info" size="sm" />
+ *
+ * <!-- Streaming buffer mode -->
+ * <talos-progress-bar mode="buffer" [value]="35" [bufferValue]="75" variant="primary" />
+ *
+ * <!-- Animated striped bar with inside label -->
+ * <talos-progress-bar [value]="82" size="xl" striped animated variant="success" [showValue]="true" valuePosition="inside" />
+ * ```
+ */
+class TalosProgressBarComponent {
+    /**
+     * Current progress value, evaluated between `min` and `max`.
+     * @default 0
+     */
+    value = input(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /**
+     * Secondary buffer progress value for streaming or staged downloads.
+     * Only active when `mode` is 'buffer'.
+     */
+    bufferValue = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "bufferValue" }] : /* istanbul ignore next */ []));
+    /**
+     * Minimum possible numerical value.
+     * @default 0
+     */
+    min = input(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
+    /**
+     * Maximum possible numerical value.
+     * @default 100
+     */
+    max = input(100, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
+    /**
+     * Operational mode of the progress bar.
+     * @default 'determinate'
+     */
+    mode = input('determinate', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "mode" }] : /* istanbul ignore next */ []));
+    /**
+     * Semantic color theme variant.
+     * @default 'primary'
+     */
+    variant = input('primary', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    /**
+     * Track height size preset.
+     * @default 'md'
+     */
+    size = input('md', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /**
+     * Corner rounding shape of the progress track.
+     * @default 'rounded'
+     */
+    shape = input('rounded', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "shape" }] : /* istanbul ignore next */ []));
+    /**
+     * Whether to display diagonal textured stripes across the fill.
+     * @default false
+     */
+    striped = input(false, { ...(ngDevMode ? { debugName: "striped" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Whether to continuously animate the striped texture pattern.
+     * @default false
+     */
+    animated = input(false, { ...(ngDevMode ? { debugName: "animated" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Whether to display the calculated or formatted progress value label.
+     * @default false
+     */
+    showValue = input(false, { ...(ngDevMode ? { debugName: "showValue" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Positioning of the value indicator relative to the progress bar.
+     * @default 'end'
+     */
+    valuePosition = input('end', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "valuePosition" }] : /* istanbul ignore next */ []));
+    /**
+     * Optional custom formatting function for the displayed value.
+     * Receives current numerical value and calculated percentage.
+     */
+    valueFormatter = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "valueFormatter" }] : /* istanbul ignore next */ []));
+    /**
+     * Optional primary text label describing the progress context.
+     */
+    label = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /**
+     * Placement of the text label relative to the track.
+     * @default 'top'
+     */
+    labelPosition = input('top', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "labelPosition" }] : /* istanbul ignore next */ []));
+    /**
+     * Custom CSS color override for the fill bar (e.g. hex, rgb, or css variable).
+     */
+    color = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+    /**
+     * Custom CSS background color override for the track.
+     */
+    trackColor = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "trackColor" }] : /* istanbul ignore next */ []));
+    /**
+     * Custom CSS background color override for the buffer bar.
+     */
+    bufferColor = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "bufferColor" }] : /* istanbul ignore next */ []));
+    /**
+     * Custom explicit track height override (e.g., '14px', '1.25rem', or number in pixels).
+     */
+    height = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
+    /**
+     * Accessible description announced by screen readers.
+     * Falls back to `label` or 'Progress'.
+     */
+    ariaLabel = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    /**
+     * ID of an external DOM element that labels this progress bar.
+     */
+    ariaLabelledby = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaLabelledby" }] : /* istanbul ignore next */ []));
+    /** Numerical value safely clamped within [min, max] */
+    clampedValue = computed(() => {
+        return clampProgress(this.value(), this.min(), this.max());
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "clampedValue" }] : /* istanbul ignore next */ []));
+    /** Scaled percentage (0 - 100) of primary progress */
+    percentage = computed(() => {
+        return calculatePercentage(this.value(), this.min(), this.max());
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "percentage" }] : /* istanbul ignore next */ []));
+    /** Scaled percentage (0 - 100) of buffer progress */
+    bufferPercentage = computed(() => {
+        const buf = this.bufferValue();
+        if (buf === undefined || buf === null) {
+            return 0;
+        }
+        return calculatePercentage(buf, this.min(), this.max());
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "bufferPercentage" }] : /* istanbul ignore next */ []));
+    /** Whether the progress bar operates in buffer mode */
+    isBuffer = computed(() => {
+        return this.mode() === 'buffer' || (this.bufferValue() !== undefined && this.bufferValue() !== null && this.mode() === 'determinate');
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isBuffer" }] : /* istanbul ignore next */ []));
+    /** Whether the progress bar operates in an indeterminate state */
+    isIndeterminate = computed(() => {
+        const m = this.mode();
+        return m === 'indeterminate' || m === 'query';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isIndeterminate" }] : /* istanbul ignore next */ []));
+    /** Formatted display string for the progress value */
+    formattedValue = computed(() => {
+        const custom = this.valueFormatter();
+        const val = this.clampedValue();
+        const pct = this.percentage();
+        if (custom) {
+            return custom(val, pct);
+        }
+        return `${Math.round(pct)}%`;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "formattedValue" }] : /* istanbul ignore next */ []));
+    /** Resolved accessible label */
+    resolvedAriaLabel = computed(() => {
+        const custom = this.ariaLabel();
+        if (custom && custom.trim().length > 0) {
+            return custom.trim();
+        }
+        const lbl = this.label();
+        if (lbl && lbl.trim().length > 0) {
+            return lbl.trim();
+        }
+        return 'Progress';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedAriaLabel" }] : /* istanbul ignore next */ []));
+    /** Resolved track height override */
+    computedHeight = computed(() => {
+        return resolveProgressDimension(this.height()) ?? null;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "computedHeight" }] : /* istanbul ignore next */ []));
+    /** Whether the value is aligned inline (start or end) alongside the bar */
+    isInlineValueLayout = computed(() => {
+        if (!this.showValue()) {
+            return false;
+        }
+        const pos = this.valuePosition();
+        return pos === 'start' || pos === 'end';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isInlineValueLayout" }] : /* istanbul ignore next */ []));
+    /** Optional projected custom label directive */
+    customLabel = contentChild(TalosProgressLabelDirective, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "customLabel" }] : /* istanbul ignore next */ []));
+    /** Optional projected custom value directive */
+    customValue = contentChild(TalosProgressValueDirective, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "customValue" }] : /* istanbul ignore next */ []));
+    /** Optional projected custom hint directive */
+    customHint = contentChild(TalosProgressHintDirective, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "customHint" }] : /* istanbul ignore next */ []));
+    /** Whether top header container should render */
+    shouldRenderHeader = computed(() => {
+        const hasLabel = !!this.label() && this.labelPosition() === 'top';
+        const hasTopEndValue = this.showValue() && this.valuePosition() === 'top-end';
+        const hasProjected = !!this.customLabel() || !!this.customValue();
+        return hasLabel || hasTopEndValue || hasProjected;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "shouldRenderHeader" }] : /* istanbul ignore next */ []));
+    /** Whether bottom footer container should render */
+    shouldRenderFooter = computed(() => {
+        const hasBottomLabel = !!this.label() && this.labelPosition() === 'bottom';
+        const hasBottomEndValue = this.showValue() && this.valuePosition() === 'bottom-end';
+        const hasProjectedHint = !!this.customHint();
+        return hasBottomLabel || hasBottomEndValue || hasProjectedHint;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "shouldRenderFooter" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: TalosProgressBarComponent, isStandalone: true, selector: "talos-progress-bar, [talosProgressBar]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, bufferValue: { classPropertyName: "bufferValue", publicName: "bufferValue", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, striped: { classPropertyName: "striped", publicName: "striped", isSignal: true, isRequired: false, transformFunction: null }, animated: { classPropertyName: "animated", publicName: "animated", isSignal: true, isRequired: false, transformFunction: null }, showValue: { classPropertyName: "showValue", publicName: "showValue", isSignal: true, isRequired: false, transformFunction: null }, valuePosition: { classPropertyName: "valuePosition", publicName: "valuePosition", isSignal: true, isRequired: false, transformFunction: null }, valueFormatter: { classPropertyName: "valueFormatter", publicName: "valueFormatter", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelPosition: { classPropertyName: "labelPosition", publicName: "labelPosition", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, trackColor: { classPropertyName: "trackColor", publicName: "trackColor", isSignal: true, isRequired: false, transformFunction: null }, bufferColor: { classPropertyName: "bufferColor", publicName: "bufferColor", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "ariaLabelledby", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.talos-progress-bar--determinate": "mode() === \"determinate\"", "class.talos-progress-bar--indeterminate": "mode() === \"indeterminate\"", "class.talos-progress-bar--buffer": "mode() === \"buffer\"", "class.talos-progress-bar--query": "mode() === \"query\"", "class.talos-progress-bar--primary": "variant() === \"primary\"", "class.talos-progress-bar--secondary": "variant() === \"secondary\"", "class.talos-progress-bar--success": "variant() === \"success\"", "class.talos-progress-bar--warning": "variant() === \"warning\"", "class.talos-progress-bar--danger": "variant() === \"danger\" || variant() === \"error\"", "class.talos-progress-bar--error": "variant() === \"danger\" || variant() === \"error\"", "class.talos-progress-bar--info": "variant() === \"info\"", "class.talos-progress-bar--neutral": "variant() === \"neutral\"", "class.talos-progress-bar--gradient": "variant() === \"gradient\"", "class.talos-progress-bar--xs": "size() === \"xs\"", "class.talos-progress-bar--sm": "size() === \"sm\"", "class.talos-progress-bar--md": "size() === \"md\"", "class.talos-progress-bar--lg": "size() === \"lg\"", "class.talos-progress-bar--xl": "size() === \"xl\"", "class.talos-progress-bar--rounded": "shape() === \"rounded\"", "class.talos-progress-bar--square": "shape() === \"square\"", "class.talos-progress-bar--subtle": "shape() === \"subtle\"", "class.talos-progress-bar--striped": "striped()", "class.talos-progress-bar--animated": "animated()", "class.talos-progress-bar--inline-layout": "labelPosition() === \"inline\" || isInlineValueLayout()", "attr.role": "\"progressbar\"", "attr.aria-valuenow": "isIndeterminate() ? null : clampedValue()", "attr.aria-valuemin": "isIndeterminate() ? null : min()", "attr.aria-valuemax": "isIndeterminate() ? null : max()", "attr.aria-valuetext": "isIndeterminate() ? null : formattedValue()", "attr.aria-label": "resolvedAriaLabel()", "attr.aria-labelledby": "ariaLabelledby() ?? null", "style.--talos-progress-custom-color": "color() ?? null", "style.--talos-progress-custom-track": "trackColor() ?? null", "style.--talos-progress-custom-buffer": "bufferColor() ?? null", "style.--talos-progress-custom-height": "computedHeight()" }, classAttribute: "talos-progress-bar-host" }, queries: [{ propertyName: "customLabel", first: true, predicate: TalosProgressLabelDirective, descendants: true, isSignal: true }, { propertyName: "customValue", first: true, predicate: TalosProgressValueDirective, descendants: true, isSignal: true }, { propertyName: "customHint", first: true, predicate: TalosProgressHintDirective, descendants: true, isSignal: true }], ngImport: i0, template: "@if (shouldRenderHeader()) {\n  <div class=\"talos-progress-bar__header\">\n    <div class=\"talos-progress-bar__header-left\">\n      <ng-content select=\"[talosProgressLabel], talos-progress-label\"></ng-content>\n      @if (label() && labelPosition() === 'top') {\n        <span class=\"talos-progress-bar__label\">{{ label() }}</span>\n      }\n    </div>\n    <div class=\"talos-progress-bar__header-right\">\n      <ng-content select=\"[talosProgressValue], talos-progress-value\"></ng-content>\n      @if (showValue() && valuePosition() === 'top-end') {\n        <span class=\"talos-progress-bar__value talos-progress-bar__value--top-end\">{{ formattedValue() }}</span>\n      }\n    </div>\n  </div>\n}\n\n<div class=\"talos-progress-bar__row\">\n  @if (label() && labelPosition() === 'inline') {\n    <span class=\"talos-progress-bar__label talos-progress-bar__label--inline\">{{ label() }}</span>\n  }\n\n  @if (showValue() && valuePosition() === 'start') {\n    <span class=\"talos-progress-bar__value talos-progress-bar__value--start\">{{ formattedValue() }}</span>\n  }\n\n  <div class=\"talos-progress-bar__track\" aria-hidden=\"true\">\n    @if (isBuffer()) {\n      <div\n        class=\"talos-progress-bar__buffer-bar\"\n        [style.width.%]=\"bufferPercentage()\">\n      </div>\n    }\n\n    <div\n      class=\"talos-progress-bar__fill\"\n      [style.width.%]=\"isIndeterminate() ? null : percentage()\">\n      @if (showValue() && valuePosition() === 'inside' && !isIndeterminate()) {\n        <span class=\"talos-progress-bar__value talos-progress-bar__value--inside\">\n          {{ formattedValue() }}\n        </span>\n      }\n    </div>\n  </div>\n\n  @if (showValue() && valuePosition() === 'end') {\n    <span class=\"talos-progress-bar__value talos-progress-bar__value--end\">{{ formattedValue() }}</span>\n  }\n</div>\n\n@if (shouldRenderFooter()) {\n  <div class=\"talos-progress-bar__footer\">\n    <div class=\"talos-progress-bar__footer-left\">\n      @if (label() && labelPosition() === 'bottom') {\n        <span class=\"talos-progress-bar__label talos-progress-bar__label--bottom\">{{ label() }}</span>\n      }\n      <ng-content select=\"[talosProgressHint], talos-progress-hint\"></ng-content>\n    </div>\n    <div class=\"talos-progress-bar__footer-right\">\n      @if (showValue() && valuePosition() === 'bottom-end') {\n        <span class=\"talos-progress-bar__value talos-progress-bar__value--bottom-end\">{{ formattedValue() }}</span>\n      }\n    </div>\n  </div>\n} @else {\n  <ng-content select=\"[talosProgressHint], talos-progress-hint\"></ng-content>\n}\n", styles: ["@keyframes talos-progress-indeterminate{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes talos-progress-indeterminate-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}@keyframes talos-progress-query{0%{right:-35%;left:100%}60%{right:100%;left:-90%}to{right:100%;left:-90%}}@keyframes talos-progress-stripes{0%{background-position:40px 0}to{background-position:0 0}}:host{display:flex;flex-direction:column;box-sizing:border-box;width:100%;font-family:var(--talos-font-sans, system-ui, sans-serif);--talos-progress-track-bg: #e2e8f0;--talos-progress-fill-bg: var(--talos-primary, #2563eb);--talos-progress-buffer-bg: #93c5fd;--talos-progress-text-color: var(--talos-text-primary, #0f172a);--talos-progress-muted-color: var(--talos-text-muted, #64748b);--talos-progress-height: 8px;--talos-progress-radius: var(--talos-radius-full, 9999px);--talos-progress-transition: width .3s cubic-bezier(.4, 0, .2, 1)}:host .talos-progress-bar__header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.375rem;font-size:var(--talos-font-size-xs, .75rem);line-height:var(--talos-line-height-tight, 1.25)}:host .talos-progress-bar__header-left{display:inline-flex;align-items:center;gap:.5rem;color:var(--talos-progress-text-color);font-weight:var(--talos-font-weight-medium, 500)}:host .talos-progress-bar__header-right{display:inline-flex;align-items:center;gap:.5rem;color:var(--talos-progress-muted-color);font-weight:var(--talos-font-weight-medium, 500);font-variant-numeric:tabular-nums}:host .talos-progress-bar__row{display:flex;align-items:center;width:100%;gap:.625rem}:host .talos-progress-bar__track{position:relative;display:block;width:100%;height:var(--talos-progress-custom-height, var(--talos-progress-height));background-color:var(--talos-progress-custom-track, var(--talos-progress-track-bg));border-radius:var(--talos-progress-radius);overflow:hidden;box-sizing:border-box;transform:translateZ(0)}:host .talos-progress-bar__buffer-bar{position:absolute;top:0;bottom:0;left:0;height:100%;background-color:var(--talos-progress-custom-buffer, var(--talos-progress-buffer-bg));border-radius:inherit;transition:var(--talos-progress-transition)}:host .talos-progress-bar__fill{position:absolute;top:0;bottom:0;left:0;height:100%;background-color:var(--talos-progress-custom-color, var(--talos-progress-fill-bg));border-radius:inherit;transition:var(--talos-progress-transition);display:flex;align-items:center;justify-content:center;overflow:hidden}:host .talos-progress-bar__value{font-size:var(--talos-font-size-xs, .75rem);font-weight:var(--talos-font-weight-semibold, 600);color:var(--talos-progress-text-color);font-variant-numeric:tabular-nums;white-space:nowrap}:host .talos-progress-bar__value--start,:host .talos-progress-bar__value--end{flex-shrink:0;color:var(--talos-progress-muted-color)}:host .talos-progress-bar__value--inside{color:#fff;font-size:.6875rem;padding:0 .5rem;text-shadow:0 1px 2px rgba(0,0,0,.2)}:host .talos-progress-bar__label{font-size:var(--talos-font-size-xs, .75rem);font-weight:var(--talos-font-weight-medium, 500);color:var(--talos-progress-text-color);white-space:nowrap}:host .talos-progress-bar__label--inline{flex-shrink:0;color:var(--talos-progress-muted-color)}:host .talos-progress-bar__label--bottom{color:var(--talos-progress-muted-color)}:host .talos-progress-bar__footer{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-top:.375rem;font-size:var(--talos-font-size-xs, .75rem);line-height:var(--talos-line-height-tight, 1.25)}:host .talos-progress-bar__footer-left{display:inline-flex;align-items:center;gap:.5rem;color:var(--talos-progress-muted-color)}:host .talos-progress-bar__footer-right{display:inline-flex;align-items:center;gap:.5rem;color:var(--talos-progress-muted-color);font-variant-numeric:tabular-nums}:host.talos-progress-bar--xs{--talos-progress-height: 2px}:host.talos-progress-bar--sm{--talos-progress-height: 4px}:host.talos-progress-bar--md{--talos-progress-height: 8px}:host.talos-progress-bar--lg{--talos-progress-height: 12px}:host.talos-progress-bar--xl{--talos-progress-height: 18px}:host.talos-progress-bar--rounded{--talos-progress-radius: var(--talos-radius-full, 9999px)}:host.talos-progress-bar--square{--talos-progress-radius: var(--talos-radius-none, 0px)}:host.talos-progress-bar--subtle{--talos-progress-radius: var(--talos-radius-sm, .25rem)}:host.talos-progress-bar--primary{--talos-progress-fill-bg: var(--talos-primary, #2563eb);--talos-progress-buffer-bg: var(--talos-progress-buffer-primary, #93c5fd)}:host.talos-progress-bar--secondary,:host.talos-progress-bar--neutral{--talos-progress-fill-bg: var(--talos-neutral, #475569);--talos-progress-buffer-bg: var(--talos-progress-buffer-neutral, #94a3b8)}:host.talos-progress-bar--success{--talos-progress-fill-bg: var(--talos-success, #16a34a);--talos-progress-buffer-bg: var(--talos-progress-buffer-success, #86efac)}:host.talos-progress-bar--warning{--talos-progress-fill-bg: var(--talos-warning, #d97706);--talos-progress-buffer-bg: var(--talos-progress-buffer-warning, #fcd34d)}:host.talos-progress-bar--danger,:host.talos-progress-bar--error{--talos-progress-fill-bg: var(--talos-danger, #ef4444);--talos-progress-buffer-bg: var(--talos-progress-buffer-danger, #fca5a5)}:host.talos-progress-bar--info{--talos-progress-fill-bg: var(--talos-info, #0284c7);--talos-progress-buffer-bg: var(--talos-progress-buffer-info, #7dd3fc)}:host.talos-progress-bar--gradient{--talos-progress-fill-bg: linear-gradient(90deg, #2563eb 0%, #7c3aed 50%, #ec4899 100%);--talos-progress-buffer-bg: var(--talos-progress-buffer-gradient, #c4b5fd)}:host :host-context([data-theme=dark]),:host :host-context([data-mode=dark]),:host :host-context(.dark),:host :host-context(.dark-theme){--talos-progress-track-bg: rgba(255, 255, 255, .1);--talos-progress-fill-bg: var(--talos-primary, #3b82f6);--talos-progress-buffer-bg: rgba(59, 130, 246, .35);--talos-progress-text-color: var(--talos-text-primary, #f8fafc);--talos-progress-muted-color: var(--talos-text-muted, #94a3b8)}:host :host-context([data-theme=dark]).talos-progress-bar--primary,:host :host-context([data-mode=dark]).talos-progress-bar--primary,:host :host-context(.dark).talos-progress-bar--primary,:host :host-context(.dark-theme).talos-progress-bar--primary{--talos-progress-fill-bg: var(--talos-primary, #3b82f6);--talos-progress-buffer-bg: rgba(59, 130, 246, .35)}:host :host-context([data-theme=dark]).talos-progress-bar--secondary,:host :host-context([data-theme=dark]).talos-progress-bar--neutral,:host :host-context([data-mode=dark]).talos-progress-bar--secondary,:host :host-context([data-mode=dark]).talos-progress-bar--neutral,:host :host-context(.dark).talos-progress-bar--secondary,:host :host-context(.dark).talos-progress-bar--neutral,:host :host-context(.dark-theme).talos-progress-bar--secondary,:host :host-context(.dark-theme).talos-progress-bar--neutral{--talos-progress-fill-bg: #94a3b8;--talos-progress-buffer-bg: rgba(148, 163, 184, .25)}:host :host-context([data-theme=dark]).talos-progress-bar--success,:host :host-context([data-mode=dark]).talos-progress-bar--success,:host :host-context(.dark).talos-progress-bar--success,:host :host-context(.dark-theme).talos-progress-bar--success{--talos-progress-fill-bg: #22c55e;--talos-progress-buffer-bg: rgba(34, 197, 94, .35)}:host :host-context([data-theme=dark]).talos-progress-bar--warning,:host :host-context([data-mode=dark]).talos-progress-bar--warning,:host :host-context(.dark).talos-progress-bar--warning,:host :host-context(.dark-theme).talos-progress-bar--warning{--talos-progress-fill-bg: #f59e0b;--talos-progress-buffer-bg: rgba(245, 158, 11, .35)}:host :host-context([data-theme=dark]).talos-progress-bar--danger,:host :host-context([data-theme=dark]).talos-progress-bar--error,:host :host-context([data-mode=dark]).talos-progress-bar--danger,:host :host-context([data-mode=dark]).talos-progress-bar--error,:host :host-context(.dark).talos-progress-bar--danger,:host :host-context(.dark).talos-progress-bar--error,:host :host-context(.dark-theme).talos-progress-bar--danger,:host :host-context(.dark-theme).talos-progress-bar--error{--talos-progress-fill-bg: #ef4444;--talos-progress-buffer-bg: rgba(239, 68, 68, .35)}:host :host-context([data-theme=dark]).talos-progress-bar--info,:host :host-context([data-mode=dark]).talos-progress-bar--info,:host :host-context(.dark).talos-progress-bar--info,:host :host-context(.dark-theme).talos-progress-bar--info{--talos-progress-fill-bg: #0ea5e9;--talos-progress-buffer-bg: rgba(14, 165, 233, .35)}:host :host-context([data-theme=dark]).talos-progress-bar--gradient,:host :host-context([data-mode=dark]).talos-progress-bar--gradient,:host :host-context(.dark).talos-progress-bar--gradient,:host :host-context(.dark-theme).talos-progress-bar--gradient{--talos-progress-fill-bg: linear-gradient(90deg, #3b82f6 0%, #8b5cf6 50%, #ec4899 100%);--talos-progress-buffer-bg: rgba(99, 102, 241, .35)}:host.talos-progress-bar--striped .talos-progress-bar__fill{background-image:linear-gradient(45deg,rgba(255,255,255,.18) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.18) 50%,rgba(255,255,255,.18) 75%,transparent 75%,transparent);background-size:24px 24px}:host.talos-progress-bar--animated.talos-progress-bar--striped .talos-progress-bar__fill{animation:talos-progress-stripes 1s linear infinite}:host.talos-progress-bar--indeterminate .talos-progress-bar__fill{width:auto!important;animation:talos-progress-indeterminate 2s cubic-bezier(.65,.815,.735,.395) infinite}:host.talos-progress-bar--query .talos-progress-bar__fill{width:auto!important;animation:talos-progress-query 2s cubic-bezier(.65,.815,.735,.395) infinite}@media(prefers-reduced-motion:reduce){:host .talos-progress-bar__fill,:host .talos-progress-bar__buffer-bar{transition:none!important;animation:none!important}}\n"] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosProgressBarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'talos-progress-bar, [talosProgressBar]', host: {
+                        'class': 'talos-progress-bar-host',
+                        '[class.talos-progress-bar--determinate]': 'mode() === "determinate"',
+                        '[class.talos-progress-bar--indeterminate]': 'mode() === "indeterminate"',
+                        '[class.talos-progress-bar--buffer]': 'mode() === "buffer"',
+                        '[class.talos-progress-bar--query]': 'mode() === "query"',
+                        '[class.talos-progress-bar--primary]': 'variant() === "primary"',
+                        '[class.talos-progress-bar--secondary]': 'variant() === "secondary"',
+                        '[class.talos-progress-bar--success]': 'variant() === "success"',
+                        '[class.talos-progress-bar--warning]': 'variant() === "warning"',
+                        '[class.talos-progress-bar--danger]': 'variant() === "danger" || variant() === "error"',
+                        '[class.talos-progress-bar--error]': 'variant() === "danger" || variant() === "error"',
+                        '[class.talos-progress-bar--info]': 'variant() === "info"',
+                        '[class.talos-progress-bar--neutral]': 'variant() === "neutral"',
+                        '[class.talos-progress-bar--gradient]': 'variant() === "gradient"',
+                        '[class.talos-progress-bar--xs]': 'size() === "xs"',
+                        '[class.talos-progress-bar--sm]': 'size() === "sm"',
+                        '[class.talos-progress-bar--md]': 'size() === "md"',
+                        '[class.talos-progress-bar--lg]': 'size() === "lg"',
+                        '[class.talos-progress-bar--xl]': 'size() === "xl"',
+                        '[class.talos-progress-bar--rounded]': 'shape() === "rounded"',
+                        '[class.talos-progress-bar--square]': 'shape() === "square"',
+                        '[class.talos-progress-bar--subtle]': 'shape() === "subtle"',
+                        '[class.talos-progress-bar--striped]': 'striped()',
+                        '[class.talos-progress-bar--animated]': 'animated()',
+                        '[class.talos-progress-bar--inline-layout]': 'labelPosition() === "inline" || isInlineValueLayout()',
+                        '[attr.role]': '"progressbar"',
+                        '[attr.aria-valuenow]': 'isIndeterminate() ? null : clampedValue()',
+                        '[attr.aria-valuemin]': 'isIndeterminate() ? null : min()',
+                        '[attr.aria-valuemax]': 'isIndeterminate() ? null : max()',
+                        '[attr.aria-valuetext]': 'isIndeterminate() ? null : formattedValue()',
+                        '[attr.aria-label]': 'resolvedAriaLabel()',
+                        '[attr.aria-labelledby]': 'ariaLabelledby() ?? null',
+                        '[style.--talos-progress-custom-color]': 'color() ?? null',
+                        '[style.--talos-progress-custom-track]': 'trackColor() ?? null',
+                        '[style.--talos-progress-custom-buffer]': 'bufferColor() ?? null',
+                        '[style.--talos-progress-custom-height]': 'computedHeight()'
+                    }, template: "@if (shouldRenderHeader()) {\n  <div class=\"talos-progress-bar__header\">\n    <div class=\"talos-progress-bar__header-left\">\n      <ng-content select=\"[talosProgressLabel], talos-progress-label\"></ng-content>\n      @if (label() && labelPosition() === 'top') {\n        <span class=\"talos-progress-bar__label\">{{ label() }}</span>\n      }\n    </div>\n    <div class=\"talos-progress-bar__header-right\">\n      <ng-content select=\"[talosProgressValue], talos-progress-value\"></ng-content>\n      @if (showValue() && valuePosition() === 'top-end') {\n        <span class=\"talos-progress-bar__value talos-progress-bar__value--top-end\">{{ formattedValue() }}</span>\n      }\n    </div>\n  </div>\n}\n\n<div class=\"talos-progress-bar__row\">\n  @if (label() && labelPosition() === 'inline') {\n    <span class=\"talos-progress-bar__label talos-progress-bar__label--inline\">{{ label() }}</span>\n  }\n\n  @if (showValue() && valuePosition() === 'start') {\n    <span class=\"talos-progress-bar__value talos-progress-bar__value--start\">{{ formattedValue() }}</span>\n  }\n\n  <div class=\"talos-progress-bar__track\" aria-hidden=\"true\">\n    @if (isBuffer()) {\n      <div\n        class=\"talos-progress-bar__buffer-bar\"\n        [style.width.%]=\"bufferPercentage()\">\n      </div>\n    }\n\n    <div\n      class=\"talos-progress-bar__fill\"\n      [style.width.%]=\"isIndeterminate() ? null : percentage()\">\n      @if (showValue() && valuePosition() === 'inside' && !isIndeterminate()) {\n        <span class=\"talos-progress-bar__value talos-progress-bar__value--inside\">\n          {{ formattedValue() }}\n        </span>\n      }\n    </div>\n  </div>\n\n  @if (showValue() && valuePosition() === 'end') {\n    <span class=\"talos-progress-bar__value talos-progress-bar__value--end\">{{ formattedValue() }}</span>\n  }\n</div>\n\n@if (shouldRenderFooter()) {\n  <div class=\"talos-progress-bar__footer\">\n    <div class=\"talos-progress-bar__footer-left\">\n      @if (label() && labelPosition() === 'bottom') {\n        <span class=\"talos-progress-bar__label talos-progress-bar__label--bottom\">{{ label() }}</span>\n      }\n      <ng-content select=\"[talosProgressHint], talos-progress-hint\"></ng-content>\n    </div>\n    <div class=\"talos-progress-bar__footer-right\">\n      @if (showValue() && valuePosition() === 'bottom-end') {\n        <span class=\"talos-progress-bar__value talos-progress-bar__value--bottom-end\">{{ formattedValue() }}</span>\n      }\n    </div>\n  </div>\n} @else {\n  <ng-content select=\"[talosProgressHint], talos-progress-hint\"></ng-content>\n}\n", styles: ["@keyframes talos-progress-indeterminate{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes talos-progress-indeterminate-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}@keyframes talos-progress-query{0%{right:-35%;left:100%}60%{right:100%;left:-90%}to{right:100%;left:-90%}}@keyframes talos-progress-stripes{0%{background-position:40px 0}to{background-position:0 0}}:host{display:flex;flex-direction:column;box-sizing:border-box;width:100%;font-family:var(--talos-font-sans, system-ui, sans-serif);--talos-progress-track-bg: #e2e8f0;--talos-progress-fill-bg: var(--talos-primary, #2563eb);--talos-progress-buffer-bg: #93c5fd;--talos-progress-text-color: var(--talos-text-primary, #0f172a);--talos-progress-muted-color: var(--talos-text-muted, #64748b);--talos-progress-height: 8px;--talos-progress-radius: var(--talos-radius-full, 9999px);--talos-progress-transition: width .3s cubic-bezier(.4, 0, .2, 1)}:host .talos-progress-bar__header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.375rem;font-size:var(--talos-font-size-xs, .75rem);line-height:var(--talos-line-height-tight, 1.25)}:host .talos-progress-bar__header-left{display:inline-flex;align-items:center;gap:.5rem;color:var(--talos-progress-text-color);font-weight:var(--talos-font-weight-medium, 500)}:host .talos-progress-bar__header-right{display:inline-flex;align-items:center;gap:.5rem;color:var(--talos-progress-muted-color);font-weight:var(--talos-font-weight-medium, 500);font-variant-numeric:tabular-nums}:host .talos-progress-bar__row{display:flex;align-items:center;width:100%;gap:.625rem}:host .talos-progress-bar__track{position:relative;display:block;width:100%;height:var(--talos-progress-custom-height, var(--talos-progress-height));background-color:var(--talos-progress-custom-track, var(--talos-progress-track-bg));border-radius:var(--talos-progress-radius);overflow:hidden;box-sizing:border-box;transform:translateZ(0)}:host .talos-progress-bar__buffer-bar{position:absolute;top:0;bottom:0;left:0;height:100%;background-color:var(--talos-progress-custom-buffer, var(--talos-progress-buffer-bg));border-radius:inherit;transition:var(--talos-progress-transition)}:host .talos-progress-bar__fill{position:absolute;top:0;bottom:0;left:0;height:100%;background-color:var(--talos-progress-custom-color, var(--talos-progress-fill-bg));border-radius:inherit;transition:var(--talos-progress-transition);display:flex;align-items:center;justify-content:center;overflow:hidden}:host .talos-progress-bar__value{font-size:var(--talos-font-size-xs, .75rem);font-weight:var(--talos-font-weight-semibold, 600);color:var(--talos-progress-text-color);font-variant-numeric:tabular-nums;white-space:nowrap}:host .talos-progress-bar__value--start,:host .talos-progress-bar__value--end{flex-shrink:0;color:var(--talos-progress-muted-color)}:host .talos-progress-bar__value--inside{color:#fff;font-size:.6875rem;padding:0 .5rem;text-shadow:0 1px 2px rgba(0,0,0,.2)}:host .talos-progress-bar__label{font-size:var(--talos-font-size-xs, .75rem);font-weight:var(--talos-font-weight-medium, 500);color:var(--talos-progress-text-color);white-space:nowrap}:host .talos-progress-bar__label--inline{flex-shrink:0;color:var(--talos-progress-muted-color)}:host .talos-progress-bar__label--bottom{color:var(--talos-progress-muted-color)}:host .talos-progress-bar__footer{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-top:.375rem;font-size:var(--talos-font-size-xs, .75rem);line-height:var(--talos-line-height-tight, 1.25)}:host .talos-progress-bar__footer-left{display:inline-flex;align-items:center;gap:.5rem;color:var(--talos-progress-muted-color)}:host .talos-progress-bar__footer-right{display:inline-flex;align-items:center;gap:.5rem;color:var(--talos-progress-muted-color);font-variant-numeric:tabular-nums}:host.talos-progress-bar--xs{--talos-progress-height: 2px}:host.talos-progress-bar--sm{--talos-progress-height: 4px}:host.talos-progress-bar--md{--talos-progress-height: 8px}:host.talos-progress-bar--lg{--talos-progress-height: 12px}:host.talos-progress-bar--xl{--talos-progress-height: 18px}:host.talos-progress-bar--rounded{--talos-progress-radius: var(--talos-radius-full, 9999px)}:host.talos-progress-bar--square{--talos-progress-radius: var(--talos-radius-none, 0px)}:host.talos-progress-bar--subtle{--talos-progress-radius: var(--talos-radius-sm, .25rem)}:host.talos-progress-bar--primary{--talos-progress-fill-bg: var(--talos-primary, #2563eb);--talos-progress-buffer-bg: var(--talos-progress-buffer-primary, #93c5fd)}:host.talos-progress-bar--secondary,:host.talos-progress-bar--neutral{--talos-progress-fill-bg: var(--talos-neutral, #475569);--talos-progress-buffer-bg: var(--talos-progress-buffer-neutral, #94a3b8)}:host.talos-progress-bar--success{--talos-progress-fill-bg: var(--talos-success, #16a34a);--talos-progress-buffer-bg: var(--talos-progress-buffer-success, #86efac)}:host.talos-progress-bar--warning{--talos-progress-fill-bg: var(--talos-warning, #d97706);--talos-progress-buffer-bg: var(--talos-progress-buffer-warning, #fcd34d)}:host.talos-progress-bar--danger,:host.talos-progress-bar--error{--talos-progress-fill-bg: var(--talos-danger, #ef4444);--talos-progress-buffer-bg: var(--talos-progress-buffer-danger, #fca5a5)}:host.talos-progress-bar--info{--talos-progress-fill-bg: var(--talos-info, #0284c7);--talos-progress-buffer-bg: var(--talos-progress-buffer-info, #7dd3fc)}:host.talos-progress-bar--gradient{--talos-progress-fill-bg: linear-gradient(90deg, #2563eb 0%, #7c3aed 50%, #ec4899 100%);--talos-progress-buffer-bg: var(--talos-progress-buffer-gradient, #c4b5fd)}:host :host-context([data-theme=dark]),:host :host-context([data-mode=dark]),:host :host-context(.dark),:host :host-context(.dark-theme){--talos-progress-track-bg: rgba(255, 255, 255, .1);--talos-progress-fill-bg: var(--talos-primary, #3b82f6);--talos-progress-buffer-bg: rgba(59, 130, 246, .35);--talos-progress-text-color: var(--talos-text-primary, #f8fafc);--talos-progress-muted-color: var(--talos-text-muted, #94a3b8)}:host :host-context([data-theme=dark]).talos-progress-bar--primary,:host :host-context([data-mode=dark]).talos-progress-bar--primary,:host :host-context(.dark).talos-progress-bar--primary,:host :host-context(.dark-theme).talos-progress-bar--primary{--talos-progress-fill-bg: var(--talos-primary, #3b82f6);--talos-progress-buffer-bg: rgba(59, 130, 246, .35)}:host :host-context([data-theme=dark]).talos-progress-bar--secondary,:host :host-context([data-theme=dark]).talos-progress-bar--neutral,:host :host-context([data-mode=dark]).talos-progress-bar--secondary,:host :host-context([data-mode=dark]).talos-progress-bar--neutral,:host :host-context(.dark).talos-progress-bar--secondary,:host :host-context(.dark).talos-progress-bar--neutral,:host :host-context(.dark-theme).talos-progress-bar--secondary,:host :host-context(.dark-theme).talos-progress-bar--neutral{--talos-progress-fill-bg: #94a3b8;--talos-progress-buffer-bg: rgba(148, 163, 184, .25)}:host :host-context([data-theme=dark]).talos-progress-bar--success,:host :host-context([data-mode=dark]).talos-progress-bar--success,:host :host-context(.dark).talos-progress-bar--success,:host :host-context(.dark-theme).talos-progress-bar--success{--talos-progress-fill-bg: #22c55e;--talos-progress-buffer-bg: rgba(34, 197, 94, .35)}:host :host-context([data-theme=dark]).talos-progress-bar--warning,:host :host-context([data-mode=dark]).talos-progress-bar--warning,:host :host-context(.dark).talos-progress-bar--warning,:host :host-context(.dark-theme).talos-progress-bar--warning{--talos-progress-fill-bg: #f59e0b;--talos-progress-buffer-bg: rgba(245, 158, 11, .35)}:host :host-context([data-theme=dark]).talos-progress-bar--danger,:host :host-context([data-theme=dark]).talos-progress-bar--error,:host :host-context([data-mode=dark]).talos-progress-bar--danger,:host :host-context([data-mode=dark]).talos-progress-bar--error,:host :host-context(.dark).talos-progress-bar--danger,:host :host-context(.dark).talos-progress-bar--error,:host :host-context(.dark-theme).talos-progress-bar--danger,:host :host-context(.dark-theme).talos-progress-bar--error{--talos-progress-fill-bg: #ef4444;--talos-progress-buffer-bg: rgba(239, 68, 68, .35)}:host :host-context([data-theme=dark]).talos-progress-bar--info,:host :host-context([data-mode=dark]).talos-progress-bar--info,:host :host-context(.dark).talos-progress-bar--info,:host :host-context(.dark-theme).talos-progress-bar--info{--talos-progress-fill-bg: #0ea5e9;--talos-progress-buffer-bg: rgba(14, 165, 233, .35)}:host :host-context([data-theme=dark]).talos-progress-bar--gradient,:host :host-context([data-mode=dark]).talos-progress-bar--gradient,:host :host-context(.dark).talos-progress-bar--gradient,:host :host-context(.dark-theme).talos-progress-bar--gradient{--talos-progress-fill-bg: linear-gradient(90deg, #3b82f6 0%, #8b5cf6 50%, #ec4899 100%);--talos-progress-buffer-bg: rgba(99, 102, 241, .35)}:host.talos-progress-bar--striped .talos-progress-bar__fill{background-image:linear-gradient(45deg,rgba(255,255,255,.18) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.18) 50%,rgba(255,255,255,.18) 75%,transparent 75%,transparent);background-size:24px 24px}:host.talos-progress-bar--animated.talos-progress-bar--striped .talos-progress-bar__fill{animation:talos-progress-stripes 1s linear infinite}:host.talos-progress-bar--indeterminate .talos-progress-bar__fill{width:auto!important;animation:talos-progress-indeterminate 2s cubic-bezier(.65,.815,.735,.395) infinite}:host.talos-progress-bar--query .talos-progress-bar__fill{width:auto!important;animation:talos-progress-query 2s cubic-bezier(.65,.815,.735,.395) infinite}@media(prefers-reduced-motion:reduce){:host .talos-progress-bar__fill,:host .talos-progress-bar__buffer-bar{transition:none!important;animation:none!important}}\n"] }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], bufferValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "bufferValue", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], shape: [{ type: i0.Input, args: [{ isSignal: true, alias: "shape", required: false }] }], striped: [{ type: i0.Input, args: [{ isSignal: true, alias: "striped", required: false }] }], animated: [{ type: i0.Input, args: [{ isSignal: true, alias: "animated", required: false }] }], showValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "showValue", required: false }] }], valuePosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "valuePosition", required: false }] }], valueFormatter: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueFormatter", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], labelPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelPosition", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], trackColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "trackColor", required: false }] }], bufferColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "bufferColor", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], ariaLabelledby: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelledby", required: false }] }], customLabel: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TalosProgressLabelDirective), { isSignal: true }] }], customValue: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TalosProgressValueDirective), { isSignal: true }] }], customHint: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TalosProgressHintDirective), { isSignal: true }] }] } });
+
+const PROGRESS_BAR_DECLARATIONS = [
+    TalosProgressBarComponent,
+    TalosProgressLabelDirective,
+    TalosProgressValueDirective,
+    TalosProgressHintDirective
+];
+class TalosProgressBarModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosProgressBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.1", ngImport: i0, type: TalosProgressBarModule, imports: [TalosProgressBarComponent,
+            TalosProgressLabelDirective,
+            TalosProgressValueDirective,
+            TalosProgressHintDirective], exports: [TalosProgressBarComponent,
+            TalosProgressLabelDirective,
+            TalosProgressValueDirective,
+            TalosProgressHintDirective] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosProgressBarModule });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosProgressBarModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [...PROGRESS_BAR_DECLARATIONS],
+                    exports: [...PROGRESS_BAR_DECLARATIONS]
+                }]
+        }] });
+
+/**
+ * Normalizes CSS dimension input (number converted to px string, or raw string).
+ * @param value Dimension input as string or number
+ * @returns CSS dimension string or undefined
+ */
+function resolveCssDimension(value) {
+    if (value === null || value === undefined || value === '') {
+        return undefined;
+    }
+    if (typeof value === 'number') {
+        return `${value}px`;
+    }
+    const trimmed = value.trim();
+    if (/^\d+$/.test(trimmed)) {
+        return `${trimmed}px`;
+    }
+    return trimmed;
+}
+
+/**
+ * Directive that attaches skeleton loading state directly to any HTML tag or component.
+ *
+ * Conceals element content and text while preserving exact layout geometry and dimensions
+ * (0 Cumulative Layout Shift), while applying an animated shimmer or pulse placeholder mask.
+ *
+ * @example
+ * ```html
+ * <h3 [talosSkeleton]="isLoading()">{{ profile().name }}</h3>
+ * <button [talosSkeleton]="isSaving()" talosButton>Submit</button>
+ * <div [talosSkeleton]="loading()" talosSkeletonShape="circular" style="width: 48px; height: 48px;"></div>
+ * ```
+ */
+class TalosSkeletonDirective {
+    /**
+     * Whether the skeleton loading state is active.
+     * Accepts a boolean, string ('true'/'false'/empty attribute), or signal value.
+     */
+    talosSkeleton = input(true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "talosSkeleton" }] : /* istanbul ignore next */ []));
+    /**
+     * Animation style when skeleton state is active.
+     * @default 'shimmer'
+     */
+    animation = input('shimmer', { ...(ngDevMode ? { debugName: "animation" } : /* istanbul ignore next */ {}), alias: 'talosSkeletonAnimation' });
+    /**
+     * Visual shape variant of the attached skeleton mask.
+     * @default 'rounded'
+     */
+    shape = input('rounded', { ...(ngDevMode ? { debugName: "shape" } : /* istanbul ignore next */ {}), alias: 'talosSkeletonShape' });
+    /**
+     * Visual shape alias for consistency with variant.
+     */
+    variant = input(undefined, { ...(ngDevMode ? { debugName: "variant" } : /* istanbul ignore next */ {}), alias: 'talosSkeletonVariant' });
+    /**
+     * Explicit width override while loading.
+     */
+    width = input(undefined, { ...(ngDevMode ? { debugName: "width" } : /* istanbul ignore next */ {}), alias: 'talosSkeletonWidth' });
+    /**
+     * Explicit height override while loading.
+     */
+    height = input(undefined, { ...(ngDevMode ? { debugName: "height" } : /* istanbul ignore next */ {}), alias: 'talosSkeletonHeight' });
+    /**
+     * Explicit border-radius override while loading.
+     */
+    borderRadius = input(undefined, { ...(ngDevMode ? { debugName: "borderRadius" } : /* istanbul ignore next */ {}), alias: 'talosSkeletonRadius' });
+    /**
+     * Accessible description announced to assistive technology when busy.
+     * @default 'Loading content...'
+     */
+    ariaLabel = input('Loading content...', { ...(ngDevMode ? { debugName: "ariaLabel" } : /* istanbul ignore next */ {}), alias: 'talosSkeletonAriaLabel' });
+    /** Resolved active state boolean */
+    isActive = computed(() => {
+        const val = this.talosSkeleton();
+        if (val === '' || val === 'true') {
+            return true;
+        }
+        if (val === 'false' || val === false || val === null || val === undefined) {
+            return false;
+        }
+        return Boolean(val);
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isActive" }] : /* istanbul ignore next */ []));
+    /** Resolved active shape variant */
+    activeShape = computed(() => {
+        return this.variant() ?? this.shape();
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "activeShape" }] : /* istanbul ignore next */ []));
+    isCircular = computed(() => {
+        const s = this.activeShape();
+        return s === 'circular' || s === 'avatar';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isCircular" }] : /* istanbul ignore next */ []));
+    isRounded = computed(() => {
+        const s = this.activeShape();
+        return s === 'rounded' || s === 'button' || s === 'text';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isRounded" }] : /* istanbul ignore next */ []));
+    isRectangular = computed(() => {
+        return this.activeShape() === 'rectangular';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isRectangular" }] : /* istanbul ignore next */ []));
+    computedWidth = computed(() => {
+        if (!this.isActive()) {
+            return null;
+        }
+        return resolveCssDimension(this.width()) ?? null;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "computedWidth" }] : /* istanbul ignore next */ []));
+    computedHeight = computed(() => {
+        if (!this.isActive()) {
+            return null;
+        }
+        return resolveCssDimension(this.height()) ?? null;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "computedHeight" }] : /* istanbul ignore next */ []));
+    computedRadius = computed(() => {
+        if (!this.isActive()) {
+            return null;
+        }
+        const custom = resolveCssDimension(this.borderRadius());
+        if (custom) {
+            return custom;
+        }
+        if (this.isCircular()) {
+            return '50%';
+        }
+        return null;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "computedRadius" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSkeletonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.1", type: TalosSkeletonDirective, isStandalone: true, selector: "[talosSkeleton]", inputs: { talosSkeleton: { classPropertyName: "talosSkeleton", publicName: "talosSkeleton", isSignal: true, isRequired: false, transformFunction: null }, animation: { classPropertyName: "animation", publicName: "talosSkeletonAnimation", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "talosSkeletonShape", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "talosSkeletonVariant", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "talosSkeletonWidth", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "talosSkeletonHeight", isSignal: true, isRequired: false, transformFunction: null }, borderRadius: { classPropertyName: "borderRadius", publicName: "talosSkeletonRadius", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "talosSkeletonAriaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.talos-skeleton-active": "isActive()", "class.talos-skeleton--shimmer": "isActive() && animation() === \"shimmer\"", "class.talos-skeleton--pulse": "isActive() && animation() === \"pulse\"", "class.talos-skeleton--no-animation": "isActive() && animation() === \"none\"", "class.talos-skeleton--circular": "isActive() && isCircular()", "class.talos-skeleton--rounded": "isActive() && isRounded()", "class.talos-skeleton--rectangular": "isActive() && isRectangular()", "style.width": "computedWidth()", "style.height": "computedHeight()", "style.border-radius": "computedRadius()", "attr.aria-busy": "isActive() ? \"true\" : null", "attr.aria-live": "isActive() ? \"polite\" : null", "attr.aria-label": "isActive() ? ariaLabel() : null" }, classAttribute: "talos-skeleton-attached" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSkeletonDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[talosSkeleton]',
+                    host: {
+                        'class': 'talos-skeleton-attached',
+                        '[class.talos-skeleton-active]': 'isActive()',
+                        '[class.talos-skeleton--shimmer]': 'isActive() && animation() === "shimmer"',
+                        '[class.talos-skeleton--pulse]': 'isActive() && animation() === "pulse"',
+                        '[class.talos-skeleton--no-animation]': 'isActive() && animation() === "none"',
+                        '[class.talos-skeleton--circular]': 'isActive() && isCircular()',
+                        '[class.talos-skeleton--rounded]': 'isActive() && isRounded()',
+                        '[class.talos-skeleton--rectangular]': 'isActive() && isRectangular()',
+                        '[style.width]': 'computedWidth()',
+                        '[style.height]': 'computedHeight()',
+                        '[style.border-radius]': 'computedRadius()',
+                        '[attr.aria-busy]': 'isActive() ? "true" : null',
+                        '[attr.aria-live]': 'isActive() ? "polite" : null',
+                        '[attr.aria-label]': 'isActive() ? ariaLabel() : null'
+                    }
+                }]
+        }], propDecorators: { talosSkeleton: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosSkeleton", required: false }] }], animation: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosSkeletonAnimation", required: false }] }], shape: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosSkeletonShape", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosSkeletonVariant", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosSkeletonWidth", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosSkeletonHeight", required: false }] }], borderRadius: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosSkeletonRadius", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosSkeletonAriaLabel", required: false }] }] } });
+
+/**
+ * Modern, accessible skeleton loader placeholder component for asynchronous data loading states.
+ *
+ * Supports various geometric shapes, fluid shimmer/pulse animations, multi-line typography
+ * simulation with customizable last line tapering, and automatic content projection toggle.
+ *
+ * @example
+ * ```html
+ * <!-- Single line or custom shape -->
+ * <talos-skeleton variant="text" width="180px" />
+ * <talos-skeleton variant="circular" width="48px" height="48px" />
+ *
+ * <!-- Multi-line paragraph -->
+ * <talos-skeleton variant="text" [count]="3" lastLineWidth="65%" />
+ *
+ * <!-- Conditional content wrapper -->
+ * <talos-skeleton [loading]="isLoading()">
+ *   <div class="user-content">Loaded User Profile</div>
+ * </talos-skeleton>
+ * ```
+ */
+class TalosSkeletonComponent {
+    /**
+     * Visual shape variant of the skeleton.
+     * @default 'text'
+     */
+    variant = input('text', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    /**
+     * Animation style applied while loading.
+     * @default 'shimmer'
+     */
+    animation = input('shimmer', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "animation" }] : /* istanbul ignore next */ []));
+    /**
+     * Sizing scale preset for text and circular variants.
+     * @default 'md'
+     */
+    size = input('md', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /**
+     * Explicit width override (e.g., '100%', '240px', or number in pixels).
+     */
+    width = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
+    /**
+     * Explicit height override (e.g., '2rem', '48px', or number in pixels).
+     */
+    height = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
+    /**
+     * Custom border radius override (e.g., '6px', '50%').
+     */
+    borderRadius = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "borderRadius" }] : /* istanbul ignore next */ []));
+    /**
+     * Number of lines to render for multi-line text placeholders.
+     * @default 1
+     */
+    count = input(1, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "count" }] : /* istanbul ignore next */ []));
+    /**
+     * Width of the last line when `count` > 1 (e.g. '60%' for realistic paragraph tapering).
+     * @default '60%'
+     */
+    lastLineWidth = input('60%', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "lastLineWidth" }] : /* istanbul ignore next */ []));
+    /**
+     * Spacing gap between lines when `count` > 1.
+     * @default '0.5rem'
+     */
+    gap = input('0.5rem', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "gap" }] : /* istanbul ignore next */ []));
+    /**
+     * Whether the skeleton is actively in a loading state.
+     * When false, the skeleton hides and projects inner `<ng-content>`.
+     * @default true
+     */
+    loading = input(true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
+    /**
+     * Accessible description for screen readers during loading.
+     * @default 'Loading content...'
+     */
+    ariaLabel = input('Loading content...', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    /** Whether the component represents a circular shape (circle or avatar) */
+    isCircular = computed(() => {
+        const v = this.variant();
+        return v === 'circular' || v === 'avatar';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isCircular" }] : /* istanbul ignore next */ []));
+    /** Whether the component represents a rounded shape (rounded or button) */
+    isRounded = computed(() => {
+        const v = this.variant();
+        return v === 'rounded' || v === 'button';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isRounded" }] : /* istanbul ignore next */ []));
+    /** Whether this is a multi-line text skeleton */
+    isMultiLine = computed(() => {
+        return this.variant() === 'text' && this.count() > 1;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isMultiLine" }] : /* istanbul ignore next */ []));
+    /** Normalized line array for multi-line rendering */
+    lineIndices = computed(() => {
+        const c = Math.max(1, Math.floor(this.count()));
+        return Array.from({ length: c }, (_, i) => i);
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "lineIndices" }] : /* istanbul ignore next */ []));
+    /** Resolved CSS width string */
+    computedWidth = computed(() => resolveCssDimension(this.width()) ?? null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "computedWidth" }] : /* istanbul ignore next */ []));
+    /** Resolved CSS height string */
+    computedHeight = computed(() => resolveCssDimension(this.height()) ?? null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "computedHeight" }] : /* istanbul ignore next */ []));
+    /** Resolved CSS border radius string */
+    computedRadius = computed(() => {
+        const custom = resolveCssDimension(this.borderRadius());
+        if (custom) {
+            return custom;
+        }
+        if (this.isCircular()) {
+            return '50%';
+        }
+        return null;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "computedRadius" }] : /* istanbul ignore next */ []));
+    /** Resolved CSS gap string */
+    computedGap = computed(() => resolveCssDimension(this.gap()) ?? '0.5rem', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "computedGap" }] : /* istanbul ignore next */ []));
+    /**
+     * Computes the width for an individual line in multi-line text mode.
+     * @param index Line index (0-based)
+     */
+    getLineWidth(index) {
+        const total = this.count();
+        if (index === total - 1 && total > 1) {
+            return resolveCssDimension(this.lastLineWidth()) || '60%';
+        }
+        return resolveCssDimension(this.width()) || '100%';
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSkeletonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: TalosSkeletonComponent, isStandalone: true, selector: "talos-skeleton", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, animation: { classPropertyName: "animation", publicName: "animation", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, borderRadius: { classPropertyName: "borderRadius", publicName: "borderRadius", isSignal: true, isRequired: false, transformFunction: null }, count: { classPropertyName: "count", publicName: "count", isSignal: true, isRequired: false, transformFunction: null }, lastLineWidth: { classPropertyName: "lastLineWidth", publicName: "lastLineWidth", isSignal: true, isRequired: false, transformFunction: null }, gap: { classPropertyName: "gap", publicName: "gap", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.talos-skeleton--hidden": "!loading()", "class.talos-skeleton--text": "variant() === \"text\"", "class.talos-skeleton--circular": "isCircular()", "class.talos-skeleton--rectangular": "variant() === \"rectangular\"", "class.talos-skeleton--rounded": "isRounded()", "class.talos-skeleton--card": "variant() === \"card\"", "class.talos-skeleton--shimmer": "loading() && animation() === \"shimmer\"", "class.talos-skeleton--pulse": "loading() && animation() === \"pulse\"", "class.talos-skeleton--no-animation": "animation() === \"none\"", "class.talos-skeleton--xs": "size() === \"xs\"", "class.talos-skeleton--sm": "size() === \"sm\"", "class.talos-skeleton--md": "size() === \"md\"", "class.talos-skeleton--lg": "size() === \"lg\"", "class.talos-skeleton--multi": "isMultiLine()", "style.width": "!isMultiLine() ? computedWidth() : \"100%\"", "style.height": "!isMultiLine() ? computedHeight() : null", "style.border-radius": "!isMultiLine() ? computedRadius() : null", "style.gap": "isMultiLine() ? computedGap() : null", "attr.role": "loading() ? \"status\" : null", "attr.aria-busy": "loading() ? \"true\" : null", "attr.aria-live": "loading() ? \"polite\" : null", "attr.aria-label": "loading() ? ariaLabel() : null" }, classAttribute: "talos-skeleton-host" }, ngImport: i0, template: "@if (!loading()) {\n  <ng-content></ng-content>\n} @else {\n  @if (isMultiLine()) {\n    @for (index of lineIndices(); track index) {\n      <span\n        class=\"talos-skeleton__line\"\n        [style.width]=\"getLineWidth(index)\"\n        [style.height]=\"computedHeight()\"\n        aria-hidden=\"true\">\n      </span>\n    }\n    <span class=\"sr-only\">{{ ariaLabel() }}</span>\n  } @else if (variant() === 'card') {\n    <div class=\"talos-skeleton__card-wrapper\" aria-hidden=\"true\">\n      <div class=\"talos-skeleton__card-media\"></div>\n      <div class=\"talos-skeleton__card-body\">\n        <div class=\"talos-skeleton__card-row\">\n          <span class=\"talos-skeleton__avatar-circle\"></span>\n          <div class=\"talos-skeleton__card-lines\">\n            <span class=\"talos-skeleton__line\" style=\"width: 65%\"></span>\n            <span class=\"talos-skeleton__line\" style=\"width: 40%\"></span>\n          </div>\n        </div>\n        <div class=\"talos-skeleton__card-paragraphs\">\n          <span class=\"talos-skeleton__line\" style=\"width: 100%\"></span>\n          <span class=\"talos-skeleton__line\" style=\"width: 88%\"></span>\n          <span class=\"talos-skeleton__line\" style=\"width: 55%\"></span>\n        </div>\n      </div>\n    </div>\n    <span class=\"sr-only\">{{ ariaLabel() }}</span>\n  } @else {\n    <span class=\"talos-skeleton__inner\" aria-hidden=\"true\"></span>\n    <span class=\"sr-only\">{{ ariaLabel() }}</span>\n  }\n}\n", styles: [":host{display:block;box-sizing:border-box;position:relative;overflow:hidden;--talos-skeleton-bg: var(--talos-border-subtle, #e2e8f0);--talos-skeleton-shine: rgba(255, 255, 255, .85);--talos-skeleton-speed: 1.5s}:host.talos-skeleton--hidden{display:contents}:host:not(.talos-skeleton--multi):not(.talos-skeleton--card):not(.talos-skeleton--circular):not(.talos-skeleton--hidden){background-color:var(--talos-skeleton-bg);border-radius:var(--talos-radius-sm, .25rem);min-height:1rem;width:100%}:host:not(.talos-skeleton--circular):not(.talos-skeleton--multi):not(.talos-skeleton--card):not(.talos-skeleton--hidden).talos-skeleton--xs{height:.75rem}:host:not(.talos-skeleton--circular):not(.talos-skeleton--multi):not(.talos-skeleton--card):not(.talos-skeleton--hidden).talos-skeleton--sm{height:.875rem}:host:not(.talos-skeleton--circular):not(.talos-skeleton--multi):not(.talos-skeleton--card):not(.talos-skeleton--hidden).talos-skeleton--md{height:1.125rem}:host:not(.talos-skeleton--circular):not(.talos-skeleton--multi):not(.talos-skeleton--card):not(.talos-skeleton--hidden).talos-skeleton--lg{height:1.5rem}:host.talos-skeleton--circular{display:inline-block;background-color:var(--talos-skeleton-bg);border-radius:50%!important;aspect-ratio:1/1!important;flex-shrink:0;min-height:unset}:host.talos-skeleton--circular.talos-skeleton--xs{width:1.5rem;height:1.5rem}:host.talos-skeleton--circular.talos-skeleton--sm{width:2.25rem;height:2.25rem}:host.talos-skeleton--circular.talos-skeleton--md{width:3.5rem;height:3.5rem}:host.talos-skeleton--circular.talos-skeleton--lg{width:5rem;height:5rem}:host.talos-skeleton--text{border-radius:var(--talos-radius-sm, .25rem)}:host.talos-skeleton--rectangular{border-radius:var(--talos-radius-xs, .125rem);min-height:4rem}:host.talos-skeleton--rounded{border-radius:var(--talos-radius-md, .375rem);min-height:2.25rem}:host.talos-skeleton--multi{display:flex;flex-direction:column;align-items:flex-start;width:100%}:host.talos-skeleton--multi .talos-skeleton__line{display:block;background-color:var(--talos-skeleton-bg);border-radius:var(--talos-radius-sm, .25rem);height:1rem;position:relative;overflow:hidden;align-self:flex-start}:host.talos-skeleton--multi.talos-skeleton--xs .talos-skeleton__line{height:.75rem}:host.talos-skeleton--multi.talos-skeleton--sm .talos-skeleton__line{height:.875rem}:host.talos-skeleton--multi.talos-skeleton--md .talos-skeleton__line{height:1rem}:host.talos-skeleton--multi.talos-skeleton--lg .talos-skeleton__line{height:1.25rem}:host.talos-skeleton--card{display:block;width:100%;max-width:380px;background:var(--talos-card-bg, #ffffff);border:1px solid var(--talos-border-subtle, #e2e8f0);border-radius:var(--talos-radius-lg, .5rem);padding:1.25rem;box-shadow:var(--talos-shadow-xs, 0 1px 2px 0 rgba(0, 0, 0, .05));box-sizing:border-box}:host.talos-skeleton--card .talos-skeleton__card-wrapper{display:flex;flex-direction:column;gap:1rem;width:100%;box-sizing:border-box}:host.talos-skeleton--card .talos-skeleton__card-media{width:100%;height:9.5rem;border-radius:var(--talos-radius-md, .375rem);background-color:var(--talos-skeleton-bg);position:relative;overflow:hidden}:host.talos-skeleton--card .talos-skeleton__card-body{display:flex;flex-direction:column;gap:.875rem}:host.talos-skeleton--card .talos-skeleton__card-row{display:flex;align-items:center;gap:.75rem}:host.talos-skeleton--card .talos-skeleton__avatar-circle{width:2.5rem;height:2.5rem;border-radius:50%;background-color:var(--talos-skeleton-bg);flex-shrink:0;position:relative;overflow:hidden}:host.talos-skeleton--card .talos-skeleton__card-lines{display:flex;flex-direction:column;align-items:flex-start;gap:.375rem;flex:1}:host.talos-skeleton--card .talos-skeleton__card-lines .talos-skeleton__line{height:.875rem;border-radius:var(--talos-radius-xs, .125rem);background-color:var(--talos-skeleton-bg);position:relative;overflow:hidden;align-self:flex-start}:host.talos-skeleton--card .talos-skeleton__card-paragraphs{display:flex;flex-direction:column;align-items:flex-start;gap:.5rem}:host.talos-skeleton--card .talos-skeleton__card-paragraphs .talos-skeleton__line{height:.8125rem;border-radius:var(--talos-radius-xs, .125rem);background-color:var(--talos-skeleton-bg);position:relative;overflow:hidden;align-self:flex-start}:host.talos-skeleton--shimmer:not(.talos-skeleton--multi):not(.talos-skeleton--card){background:linear-gradient(90deg,var(--talos-skeleton-bg) 0%,var(--talos-skeleton-shine) 50%,var(--talos-skeleton-bg) 100%);background-size:200% 100%;animation:talos-skeleton-shimmer var(--talos-skeleton-speed) infinite linear}:host.talos-skeleton--shimmer .talos-skeleton__line,:host.talos-skeleton--shimmer .talos-skeleton__card-media,:host.talos-skeleton--shimmer .talos-skeleton__avatar-circle{background:linear-gradient(90deg,var(--talos-skeleton-bg) 0%,var(--talos-skeleton-shine) 50%,var(--talos-skeleton-bg) 100%);background-size:200% 100%;animation:talos-skeleton-shimmer var(--talos-skeleton-speed) infinite linear}:host.talos-skeleton--pulse:not(.talos-skeleton--multi):not(.talos-skeleton--card){animation:talos-skeleton-pulse 1.8s ease-in-out .5s infinite}:host.talos-skeleton--pulse .talos-skeleton__line,:host.talos-skeleton--pulse .talos-skeleton__card-media,:host.talos-skeleton--pulse .talos-skeleton__avatar-circle{animation:talos-skeleton-pulse 1.8s ease-in-out .5s infinite}:host.talos-skeleton--no-animation{animation:none!important}:host.talos-skeleton--no-animation *{animation:none!important}:host-context(.talos-skeleton-attached).talos-skeleton-active,.talos-skeleton-attached.talos-skeleton-active{position:relative!important;pointer-events:none!important;-webkit-user-select:none!important;user-select:none!important;cursor:default!important;color:transparent!important;background-color:var(--talos-bg-subtle, #f1f5f9)!important;border-color:transparent!important;box-shadow:none!important;overflow:hidden!important}:host-context(.talos-skeleton-attached).talos-skeleton-active>*,.talos-skeleton-attached.talos-skeleton-active>*{visibility:hidden!important}:host-context(.talos-skeleton-attached).talos-skeleton-active.talos-skeleton--circular,.talos-skeleton-attached.talos-skeleton-active.talos-skeleton--circular{border-radius:50%!important}:host-context(.talos-skeleton-attached).talos-skeleton-active.talos-skeleton--rounded,.talos-skeleton-attached.talos-skeleton-active.talos-skeleton--rounded{border-radius:var(--talos-radius-md, .375rem)!important}:host-context(.talos-skeleton-attached).talos-skeleton-active.talos-skeleton--rectangular,.talos-skeleton-attached.talos-skeleton-active.talos-skeleton--rectangular{border-radius:var(--talos-radius-xs, .125rem)!important}:host-context(.talos-skeleton-attached).talos-skeleton-active.talos-skeleton--shimmer,.talos-skeleton-attached.talos-skeleton-active.talos-skeleton--shimmer{background:linear-gradient(90deg,var(--talos-bg-subtle, #f1f5f9) 0%,rgba(255,255,255,.6) 50%,var(--talos-bg-subtle, #f1f5f9) 100%)!important;background-size:200% 100%!important;animation:talos-skeleton-shimmer 1.5s infinite linear!important}:host-context(.talos-skeleton-attached).talos-skeleton-active.talos-skeleton--pulse,.talos-skeleton-attached.talos-skeleton-active.talos-skeleton--pulse{animation:talos-skeleton-pulse 1.8s ease-in-out .5s infinite!important}:host-context(.talos-skeleton-attached).talos-skeleton-active.talos-skeleton--no-animation,.talos-skeleton-attached.talos-skeleton-active.talos-skeleton--no-animation{animation:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}@keyframes talos-skeleton-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes talos-skeleton-pulse{0%{opacity:1}50%{opacity:.45}to{opacity:1}}@media(prefers-reduced-motion:reduce){:host,.talos-skeleton__line,.talos-skeleton__card-media,.talos-skeleton__avatar-circle,.talos-skeleton-attached.talos-skeleton-active{animation:none!important;opacity:.85!important}}\n"] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSkeletonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'talos-skeleton', host: {
+                        'class': 'talos-skeleton-host',
+                        '[class.talos-skeleton--hidden]': '!loading()',
+                        '[class.talos-skeleton--text]': 'variant() === "text"',
+                        '[class.talos-skeleton--circular]': 'isCircular()',
+                        '[class.talos-skeleton--rectangular]': 'variant() === "rectangular"',
+                        '[class.talos-skeleton--rounded]': 'isRounded()',
+                        '[class.talos-skeleton--card]': 'variant() === "card"',
+                        '[class.talos-skeleton--shimmer]': 'loading() && animation() === "shimmer"',
+                        '[class.talos-skeleton--pulse]': 'loading() && animation() === "pulse"',
+                        '[class.talos-skeleton--no-animation]': 'animation() === "none"',
+                        '[class.talos-skeleton--xs]': 'size() === "xs"',
+                        '[class.talos-skeleton--sm]': 'size() === "sm"',
+                        '[class.talos-skeleton--md]': 'size() === "md"',
+                        '[class.talos-skeleton--lg]': 'size() === "lg"',
+                        '[class.talos-skeleton--multi]': 'isMultiLine()',
+                        '[style.width]': '!isMultiLine() ? computedWidth() : "100%"',
+                        '[style.height]': '!isMultiLine() ? computedHeight() : null',
+                        '[style.border-radius]': '!isMultiLine() ? computedRadius() : null',
+                        '[style.gap]': 'isMultiLine() ? computedGap() : null',
+                        '[attr.role]': 'loading() ? "status" : null',
+                        '[attr.aria-busy]': 'loading() ? "true" : null',
+                        '[attr.aria-live]': 'loading() ? "polite" : null',
+                        '[attr.aria-label]': 'loading() ? ariaLabel() : null'
+                    }, template: "@if (!loading()) {\n  <ng-content></ng-content>\n} @else {\n  @if (isMultiLine()) {\n    @for (index of lineIndices(); track index) {\n      <span\n        class=\"talos-skeleton__line\"\n        [style.width]=\"getLineWidth(index)\"\n        [style.height]=\"computedHeight()\"\n        aria-hidden=\"true\">\n      </span>\n    }\n    <span class=\"sr-only\">{{ ariaLabel() }}</span>\n  } @else if (variant() === 'card') {\n    <div class=\"talos-skeleton__card-wrapper\" aria-hidden=\"true\">\n      <div class=\"talos-skeleton__card-media\"></div>\n      <div class=\"talos-skeleton__card-body\">\n        <div class=\"talos-skeleton__card-row\">\n          <span class=\"talos-skeleton__avatar-circle\"></span>\n          <div class=\"talos-skeleton__card-lines\">\n            <span class=\"talos-skeleton__line\" style=\"width: 65%\"></span>\n            <span class=\"talos-skeleton__line\" style=\"width: 40%\"></span>\n          </div>\n        </div>\n        <div class=\"talos-skeleton__card-paragraphs\">\n          <span class=\"talos-skeleton__line\" style=\"width: 100%\"></span>\n          <span class=\"talos-skeleton__line\" style=\"width: 88%\"></span>\n          <span class=\"talos-skeleton__line\" style=\"width: 55%\"></span>\n        </div>\n      </div>\n    </div>\n    <span class=\"sr-only\">{{ ariaLabel() }}</span>\n  } @else {\n    <span class=\"talos-skeleton__inner\" aria-hidden=\"true\"></span>\n    <span class=\"sr-only\">{{ ariaLabel() }}</span>\n  }\n}\n", styles: [":host{display:block;box-sizing:border-box;position:relative;overflow:hidden;--talos-skeleton-bg: var(--talos-border-subtle, #e2e8f0);--talos-skeleton-shine: rgba(255, 255, 255, .85);--talos-skeleton-speed: 1.5s}:host.talos-skeleton--hidden{display:contents}:host:not(.talos-skeleton--multi):not(.talos-skeleton--card):not(.talos-skeleton--circular):not(.talos-skeleton--hidden){background-color:var(--talos-skeleton-bg);border-radius:var(--talos-radius-sm, .25rem);min-height:1rem;width:100%}:host:not(.talos-skeleton--circular):not(.talos-skeleton--multi):not(.talos-skeleton--card):not(.talos-skeleton--hidden).talos-skeleton--xs{height:.75rem}:host:not(.talos-skeleton--circular):not(.talos-skeleton--multi):not(.talos-skeleton--card):not(.talos-skeleton--hidden).talos-skeleton--sm{height:.875rem}:host:not(.talos-skeleton--circular):not(.talos-skeleton--multi):not(.talos-skeleton--card):not(.talos-skeleton--hidden).talos-skeleton--md{height:1.125rem}:host:not(.talos-skeleton--circular):not(.talos-skeleton--multi):not(.talos-skeleton--card):not(.talos-skeleton--hidden).talos-skeleton--lg{height:1.5rem}:host.talos-skeleton--circular{display:inline-block;background-color:var(--talos-skeleton-bg);border-radius:50%!important;aspect-ratio:1/1!important;flex-shrink:0;min-height:unset}:host.talos-skeleton--circular.talos-skeleton--xs{width:1.5rem;height:1.5rem}:host.talos-skeleton--circular.talos-skeleton--sm{width:2.25rem;height:2.25rem}:host.talos-skeleton--circular.talos-skeleton--md{width:3.5rem;height:3.5rem}:host.talos-skeleton--circular.talos-skeleton--lg{width:5rem;height:5rem}:host.talos-skeleton--text{border-radius:var(--talos-radius-sm, .25rem)}:host.talos-skeleton--rectangular{border-radius:var(--talos-radius-xs, .125rem);min-height:4rem}:host.talos-skeleton--rounded{border-radius:var(--talos-radius-md, .375rem);min-height:2.25rem}:host.talos-skeleton--multi{display:flex;flex-direction:column;align-items:flex-start;width:100%}:host.talos-skeleton--multi .talos-skeleton__line{display:block;background-color:var(--talos-skeleton-bg);border-radius:var(--talos-radius-sm, .25rem);height:1rem;position:relative;overflow:hidden;align-self:flex-start}:host.talos-skeleton--multi.talos-skeleton--xs .talos-skeleton__line{height:.75rem}:host.talos-skeleton--multi.talos-skeleton--sm .talos-skeleton__line{height:.875rem}:host.talos-skeleton--multi.talos-skeleton--md .talos-skeleton__line{height:1rem}:host.talos-skeleton--multi.talos-skeleton--lg .talos-skeleton__line{height:1.25rem}:host.talos-skeleton--card{display:block;width:100%;max-width:380px;background:var(--talos-card-bg, #ffffff);border:1px solid var(--talos-border-subtle, #e2e8f0);border-radius:var(--talos-radius-lg, .5rem);padding:1.25rem;box-shadow:var(--talos-shadow-xs, 0 1px 2px 0 rgba(0, 0, 0, .05));box-sizing:border-box}:host.talos-skeleton--card .talos-skeleton__card-wrapper{display:flex;flex-direction:column;gap:1rem;width:100%;box-sizing:border-box}:host.talos-skeleton--card .talos-skeleton__card-media{width:100%;height:9.5rem;border-radius:var(--talos-radius-md, .375rem);background-color:var(--talos-skeleton-bg);position:relative;overflow:hidden}:host.talos-skeleton--card .talos-skeleton__card-body{display:flex;flex-direction:column;gap:.875rem}:host.talos-skeleton--card .talos-skeleton__card-row{display:flex;align-items:center;gap:.75rem}:host.talos-skeleton--card .talos-skeleton__avatar-circle{width:2.5rem;height:2.5rem;border-radius:50%;background-color:var(--talos-skeleton-bg);flex-shrink:0;position:relative;overflow:hidden}:host.talos-skeleton--card .talos-skeleton__card-lines{display:flex;flex-direction:column;align-items:flex-start;gap:.375rem;flex:1}:host.talos-skeleton--card .talos-skeleton__card-lines .talos-skeleton__line{height:.875rem;border-radius:var(--talos-radius-xs, .125rem);background-color:var(--talos-skeleton-bg);position:relative;overflow:hidden;align-self:flex-start}:host.talos-skeleton--card .talos-skeleton__card-paragraphs{display:flex;flex-direction:column;align-items:flex-start;gap:.5rem}:host.talos-skeleton--card .talos-skeleton__card-paragraphs .talos-skeleton__line{height:.8125rem;border-radius:var(--talos-radius-xs, .125rem);background-color:var(--talos-skeleton-bg);position:relative;overflow:hidden;align-self:flex-start}:host.talos-skeleton--shimmer:not(.talos-skeleton--multi):not(.talos-skeleton--card){background:linear-gradient(90deg,var(--talos-skeleton-bg) 0%,var(--talos-skeleton-shine) 50%,var(--talos-skeleton-bg) 100%);background-size:200% 100%;animation:talos-skeleton-shimmer var(--talos-skeleton-speed) infinite linear}:host.talos-skeleton--shimmer .talos-skeleton__line,:host.talos-skeleton--shimmer .talos-skeleton__card-media,:host.talos-skeleton--shimmer .talos-skeleton__avatar-circle{background:linear-gradient(90deg,var(--talos-skeleton-bg) 0%,var(--talos-skeleton-shine) 50%,var(--talos-skeleton-bg) 100%);background-size:200% 100%;animation:talos-skeleton-shimmer var(--talos-skeleton-speed) infinite linear}:host.talos-skeleton--pulse:not(.talos-skeleton--multi):not(.talos-skeleton--card){animation:talos-skeleton-pulse 1.8s ease-in-out .5s infinite}:host.talos-skeleton--pulse .talos-skeleton__line,:host.talos-skeleton--pulse .talos-skeleton__card-media,:host.talos-skeleton--pulse .talos-skeleton__avatar-circle{animation:talos-skeleton-pulse 1.8s ease-in-out .5s infinite}:host.talos-skeleton--no-animation{animation:none!important}:host.talos-skeleton--no-animation *{animation:none!important}:host-context(.talos-skeleton-attached).talos-skeleton-active,.talos-skeleton-attached.talos-skeleton-active{position:relative!important;pointer-events:none!important;-webkit-user-select:none!important;user-select:none!important;cursor:default!important;color:transparent!important;background-color:var(--talos-bg-subtle, #f1f5f9)!important;border-color:transparent!important;box-shadow:none!important;overflow:hidden!important}:host-context(.talos-skeleton-attached).talos-skeleton-active>*,.talos-skeleton-attached.talos-skeleton-active>*{visibility:hidden!important}:host-context(.talos-skeleton-attached).talos-skeleton-active.talos-skeleton--circular,.talos-skeleton-attached.talos-skeleton-active.talos-skeleton--circular{border-radius:50%!important}:host-context(.talos-skeleton-attached).talos-skeleton-active.talos-skeleton--rounded,.talos-skeleton-attached.talos-skeleton-active.talos-skeleton--rounded{border-radius:var(--talos-radius-md, .375rem)!important}:host-context(.talos-skeleton-attached).talos-skeleton-active.talos-skeleton--rectangular,.talos-skeleton-attached.talos-skeleton-active.talos-skeleton--rectangular{border-radius:var(--talos-radius-xs, .125rem)!important}:host-context(.talos-skeleton-attached).talos-skeleton-active.talos-skeleton--shimmer,.talos-skeleton-attached.talos-skeleton-active.talos-skeleton--shimmer{background:linear-gradient(90deg,var(--talos-bg-subtle, #f1f5f9) 0%,rgba(255,255,255,.6) 50%,var(--talos-bg-subtle, #f1f5f9) 100%)!important;background-size:200% 100%!important;animation:talos-skeleton-shimmer 1.5s infinite linear!important}:host-context(.talos-skeleton-attached).talos-skeleton-active.talos-skeleton--pulse,.talos-skeleton-attached.talos-skeleton-active.talos-skeleton--pulse{animation:talos-skeleton-pulse 1.8s ease-in-out .5s infinite!important}:host-context(.talos-skeleton-attached).talos-skeleton-active.talos-skeleton--no-animation,.talos-skeleton-attached.talos-skeleton-active.talos-skeleton--no-animation{animation:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}@keyframes talos-skeleton-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes talos-skeleton-pulse{0%{opacity:1}50%{opacity:.45}to{opacity:1}}@media(prefers-reduced-motion:reduce){:host,.talos-skeleton__line,.talos-skeleton__card-media,.talos-skeleton__avatar-circle,.talos-skeleton-attached.talos-skeleton-active{animation:none!important;opacity:.85!important}}\n"] }]
+        }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], animation: [{ type: i0.Input, args: [{ isSignal: true, alias: "animation", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], borderRadius: [{ type: i0.Input, args: [{ isSignal: true, alias: "borderRadius", required: false }] }], count: [{ type: i0.Input, args: [{ isSignal: true, alias: "count", required: false }] }], lastLineWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "lastLineWidth", required: false }] }], gap: [{ type: i0.Input, args: [{ isSignal: true, alias: "gap", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
+
+const SKELETON_DECLARATIONS = [
+    TalosSkeletonComponent,
+    TalosSkeletonDirective
+];
+class TalosSkeletonModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSkeletonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.1", ngImport: i0, type: TalosSkeletonModule, imports: [TalosSkeletonComponent,
+            TalosSkeletonDirective], exports: [TalosSkeletonComponent,
+            TalosSkeletonDirective] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSkeletonModule });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSkeletonModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [...SKELETON_DECLARATIONS],
+                    exports: [...SKELETON_DECLARATIONS]
+                }]
+        }] });
+
+class TalosSnackbarComponent {
+    /** Snackbar instance data */
+    instance = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "instance" }] : /* istanbul ignore next */ []));
+    /** Event emitted when snackbar requests dismissal */
+    dismiss = output();
+    /** Event emitted when snackbar action button is clicked */
+    action = output();
+    isDismissing = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isDismissing" }] : /* istanbul ignore next */ []));
+    progressPercent = signal(100, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "progressPercent" }] : /* istanbul ignore next */ []));
+    Infinity = Infinity;
+    timerId = null;
+    remainingMs = 0;
+    lastTickMs = 0;
+    isTopPosition = computed(() => {
+        const pos = this.instance().position;
+        return pos ? pos.startsWith('top') : false;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isTopPosition" }] : /* istanbul ignore next */ []));
+    isTemplateMessage = computed(() => {
+        return this.instance().message instanceof TemplateRef;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isTemplateMessage" }] : /* istanbul ignore next */ []));
+    templateMessage = computed(() => {
+        return this.instance().message;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "templateMessage" }] : /* istanbul ignore next */ []));
+    customIconComponent = computed(() => {
+        const icon = this.instance().icon;
+        return typeof icon === 'function' ? icon : null;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "customIconComponent" }] : /* istanbul ignore next */ []));
+    ariaRole = computed(() => {
+        const variant = this.instance().variant;
+        return variant === 'error' || variant === 'warning' ? 'alert' : 'status';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaRole" }] : /* istanbul ignore next */ []));
+    ariaLive = computed(() => {
+        const variant = this.instance().variant;
+        return variant === 'error' || variant === 'warning' ? 'assertive' : 'polite';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaLive" }] : /* istanbul ignore next */ []));
+    ngOnInit() {
+        const duration = this.instance().duration;
+        if (duration > 0 && duration !== Infinity) {
+            this.remainingMs = duration;
+            this.startTimer();
+        }
+    }
+    ngOnDestroy() {
+        this.stopTimer();
+    }
+    startTimer() {
+        this.stopTimer();
+        const totalDuration = this.instance().duration;
+        this.lastTickMs = Date.now();
+        this.timerId = setInterval(() => {
+            if (this.instance().isPaused)
+                return;
+            const now = Date.now();
+            const delta = now - this.lastTickMs;
+            this.lastTickMs = now;
+            this.remainingMs -= delta;
+            if (this.remainingMs <= 0) {
+                this.progressPercent.set(0);
+                this.stopTimer();
+                this.onCloseClick();
+            }
+            else {
+                const pct = Math.max(0, (this.remainingMs / totalDuration) * 100);
+                this.progressPercent.set(pct);
+            }
+        }, 50);
+    }
+    stopTimer() {
+        if (this.timerId) {
+            clearInterval(this.timerId);
+            this.timerId = null;
+        }
+    }
+    onMouseEnter() {
+        if (this.instance().pauseOnHover) {
+            this.instance().isPaused = true;
+        }
+    }
+    onMouseLeave() {
+        if (this.instance().pauseOnHover) {
+            this.instance().isPaused = false;
+            this.lastTickMs = Date.now();
+        }
+    }
+    onActionClick() {
+        if (this.instance().onAction) {
+            this.instance().onAction();
+        }
+        this.action.emit(this.instance().id);
+        this.onCloseClick();
+    }
+    onCloseClick() {
+        if (this.isDismissing())
+            return;
+        this.isDismissing.set(true);
+        if (this.instance().onDismiss) {
+            this.instance().onDismiss();
+        }
+        setTimeout(() => {
+            this.dismiss.emit(this.instance().id);
+        }, 200);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSnackbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: TalosSnackbarComponent, isStandalone: true, selector: "talos-snackbar", inputs: { instance: { classPropertyName: "instance", publicName: "instance", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { dismiss: "dismiss", action: "action" }, ngImport: i0, template: "<div class=\"talos-snackbar\" [class.variant-default]=\"instance().variant === 'default'\"\n  [class.variant-info]=\"instance().variant === 'info'\" [class.variant-success]=\"instance().variant === 'success'\"\n  [class.variant-warning]=\"instance().variant === 'warning'\" [class.variant-error]=\"instance().variant === 'error'\"\n  [class.pos-top]=\"isTopPosition()\" [class.pos-bottom]=\"!isTopPosition()\" [class.is-dismissing]=\"isDismissing()\"\n  [class]=\"instance().customClass || ''\" [attr.role]=\"ariaRole()\" [attr.aria-live]=\"ariaLive()\"\n  (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\">\n  @if (instance().icon !== false) {\n  <div class=\"talos-snackbar-icon\">\n    @if (instance().icon && instance().icon !== true) {\n    <ng-container *ngComponentOutlet=\"customIconComponent()\"></ng-container>\n    } @else {\n    @switch (instance().variant) {\n    @case ('success') {\n    <svg lucideCheckCircle2 [size]=\"20\"></svg>\n    }\n    @case ('warning') {\n    <svg lucideAlertTriangle [size]=\"20\"></svg>\n    }\n    @case ('error') {\n    <svg lucideCircleAlert [size]=\"20\"></svg>\n    }\n    @default {\n    <svg lucideInfo [size]=\"20\"></svg>\n    }\n    }\n    }\n  </div>\n  }\n\n  <div class=\"talos-snackbar-content\">\n    @if (instance().title) {\n    <div class=\"talos-snackbar-title\">{{ instance().title }}</div>\n    }\n\n    <div class=\"talos-snackbar-message\">\n      @if (isTemplateMessage()) {\n      <ng-container\n        *ngTemplateOutlet=\"templateMessage(); context: { $implicit: instance().data, instance: instance() }\"></ng-container>\n      } @else {\n      {{ instance().message }}\n      }\n    </div>\n  </div>\n\n  <div class=\"talos-snackbar-actions\">\n    @if (instance().actionLabel) {\n    <button type=\"button\" class=\"talos-snackbar-action-btn\" (click)=\"onActionClick()\">\n      {{ instance().actionLabel }}\n    </button>\n    }\n\n    @if (instance().dismissible) {\n    <button type=\"button\" class=\"talos-snackbar-close-btn\" aria-label=\"Close notification\" (click)=\"onCloseClick()\">\n      <svg lucideX [size]=\"16\"></svg>\n    </button>\n    }\n  </div>\n\n  @if (instance().showProgressBar && instance().duration > 0 && instance().duration !== Infinity) {\n  <div class=\"talos-snackbar-progress\" [class.variant-success]=\"instance().variant === 'success'\"\n    [class.variant-warning]=\"instance().variant === 'warning'\" [class.variant-error]=\"instance().variant === 'error'\"\n    [style.width.%]=\"progressPercent()\"></div>\n  }\n</div>", styles: [":host{display:block;width:100%;max-width:440px;pointer-events:auto}.talos-snackbar{position:relative;display:flex;align-items:center;gap:.875rem;padding:.875rem 1rem;background-color:var(--talos-snackbar-bg, var(--talos-card-bg, #ffffff));color:var(--talos-snackbar-text, var(--talos-text-color, #0f172a));border:1px solid var(--talos-snackbar-border, var(--talos-border-color, #e2e8f0));border-radius:var(--talos-snackbar-border-radius, var(--talos-border-radius, .5rem));box-shadow:var(--talos-shadow-dropdown, 0 10px 25px -5px rgba(0, 0, 0, .08), 0 8px 10px -6px rgba(0, 0, 0, .04));overflow:hidden;box-sizing:border-box}.talos-snackbar.pos-top{animation:talos-snackbar-in-top .25s cubic-bezier(.16,1,.3,1) forwards}.talos-snackbar.pos-top.is-dismissing{animation:talos-snackbar-out-top .2s cubic-bezier(.4,0,1,1) forwards}.talos-snackbar.pos-bottom{animation:talos-snackbar-in-bottom .25s cubic-bezier(.16,1,.3,1) forwards}.talos-snackbar.pos-bottom.is-dismissing{animation:talos-snackbar-out-bottom .2s cubic-bezier(.4,0,1,1) forwards}.talos-snackbar .talos-snackbar-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:2.25rem;height:2.25rem;border-radius:var(--talos-border-radius, .5rem);transition:background-color .15s ease,color .15s ease}.talos-snackbar.variant-default .talos-snackbar-icon,.talos-snackbar.variant-info .talos-snackbar-icon{background-color:var(--talos-info-subtle-bg, var(--talos-primary-light, #eff6ff));color:var(--talos-info-text, var(--talos-primary-color, #2563eb))}.talos-snackbar.variant-success .talos-snackbar-icon{background-color:var(--talos-success-subtle-bg, rgba(22, 163, 74, .12));color:var(--talos-success-text, var(--talos-btn-success-bg, #16a34a))}.talos-snackbar.variant-warning .talos-snackbar-icon{background-color:var(--talos-warning-subtle-bg, rgba(217, 119, 6, .12));color:var(--talos-warning-text, var(--talos-warning-color, #d97706))}.talos-snackbar.variant-error .talos-snackbar-icon{background-color:var(--talos-danger-subtle-bg, rgba(239, 68, 68, .12));color:var(--talos-danger-text, var(--talos-error-color, #ef4444))}.talos-snackbar .talos-snackbar-content{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:.125rem}.talos-snackbar .talos-snackbar-content .talos-snackbar-title{font-size:var(--talos-control-font-size, .8125rem);font-weight:600;line-height:1.25rem;color:var(--talos-text-primary, var(--talos-text-color, #0f172a))}.talos-snackbar .talos-snackbar-content .talos-snackbar-message{font-size:.8125rem;line-height:1.25rem;color:var(--talos-text-muted, #64748b);word-break:break-word}.talos-snackbar .talos-snackbar-actions{display:flex;align-items:center;gap:.5rem;flex-shrink:0;margin-left:auto}.talos-snackbar .talos-snackbar-action-btn{border:none;background:transparent;color:var(--talos-primary-text, var(--talos-primary-color, #2563eb));font-size:.8125rem;font-weight:600;padding:.375rem .625rem;border-radius:var(--talos-border-radius, .375rem);cursor:pointer;transition:background-color .15s ease,color .15s ease}.talos-snackbar .talos-snackbar-action-btn:hover{background-color:var(--talos-primary-subtle-bg, #eff6ff);color:var(--talos-primary-hover, #1d4ed8)}.talos-snackbar .talos-snackbar-action-btn:focus-visible{outline:none;box-shadow:var(--talos-focus-ring, 0 0 0 3px rgba(37, 99, 235, .15))}.talos-snackbar .talos-snackbar-close-btn{display:flex;align-items:center;justify-content:center;border:none;background:transparent;color:var(--talos-text-muted, #94a3b8);padding:.375rem;border-radius:var(--talos-border-radius, .375rem);cursor:pointer;transition:color .15s ease,background-color .15s ease}.talos-snackbar .talos-snackbar-close-btn:hover{color:var(--talos-text-primary, #0f172a);background-color:var(--talos-bg-subtle, #f8fafc)}.talos-snackbar .talos-snackbar-close-btn:focus-visible{outline:none;box-shadow:var(--talos-focus-ring, 0 0 0 3px rgba(37, 99, 235, .15))}.talos-snackbar .talos-snackbar-progress{position:absolute;bottom:0;left:0;height:3px;background-color:var(--talos-primary-solid-bg, var(--talos-primary-color, #2563eb));transition:width .1s linear;border-bottom-left-radius:var(--talos-border-radius, .5rem)}.talos-snackbar .talos-snackbar-progress.variant-success{background-color:var(--talos-success-solid-bg, #16a34a)}.talos-snackbar .talos-snackbar-progress.variant-warning{background-color:var(--talos-warning-solid-bg, #d97706)}.talos-snackbar .talos-snackbar-progress.variant-error{background-color:var(--talos-danger-solid-bg, #ef4444)}@keyframes talos-snackbar-in-top{0%{opacity:0;transform:translateY(-16px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes talos-snackbar-out-top{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-16px) scale(.95)}}@keyframes talos-snackbar-in-bottom{0%{opacity:0;transform:translateY(16px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes talos-snackbar-out-bottom{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(16px) scale(.95)}}\n"], dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: LucideInfo, selector: "svg[lucideInfo]" }, { kind: "component", type: LucideCheckCircle2, selector: "svg[lucideCircleCheck], svg[lucideCheckCircle2]" }, { kind: "component", type: LucideAlertTriangle, selector: "svg[lucideTriangleAlert], svg[lucideAlertTriangle]" }, { kind: "component", type: LucideCircleAlert, selector: "svg[lucideCircleAlert], svg[lucideAlertCircle]" }, { kind: "component", type: LucideX, selector: "svg[lucideX]" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSnackbarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'talos-snackbar', imports: [
+                        NgComponentOutlet,
+                        NgTemplateOutlet,
+                        LucideInfo,
+                        LucideCheckCircle2,
+                        LucideAlertTriangle,
+                        LucideCircleAlert,
+                        LucideX
+                    ], template: "<div class=\"talos-snackbar\" [class.variant-default]=\"instance().variant === 'default'\"\n  [class.variant-info]=\"instance().variant === 'info'\" [class.variant-success]=\"instance().variant === 'success'\"\n  [class.variant-warning]=\"instance().variant === 'warning'\" [class.variant-error]=\"instance().variant === 'error'\"\n  [class.pos-top]=\"isTopPosition()\" [class.pos-bottom]=\"!isTopPosition()\" [class.is-dismissing]=\"isDismissing()\"\n  [class]=\"instance().customClass || ''\" [attr.role]=\"ariaRole()\" [attr.aria-live]=\"ariaLive()\"\n  (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\">\n  @if (instance().icon !== false) {\n  <div class=\"talos-snackbar-icon\">\n    @if (instance().icon && instance().icon !== true) {\n    <ng-container *ngComponentOutlet=\"customIconComponent()\"></ng-container>\n    } @else {\n    @switch (instance().variant) {\n    @case ('success') {\n    <svg lucideCheckCircle2 [size]=\"20\"></svg>\n    }\n    @case ('warning') {\n    <svg lucideAlertTriangle [size]=\"20\"></svg>\n    }\n    @case ('error') {\n    <svg lucideCircleAlert [size]=\"20\"></svg>\n    }\n    @default {\n    <svg lucideInfo [size]=\"20\"></svg>\n    }\n    }\n    }\n  </div>\n  }\n\n  <div class=\"talos-snackbar-content\">\n    @if (instance().title) {\n    <div class=\"talos-snackbar-title\">{{ instance().title }}</div>\n    }\n\n    <div class=\"talos-snackbar-message\">\n      @if (isTemplateMessage()) {\n      <ng-container\n        *ngTemplateOutlet=\"templateMessage(); context: { $implicit: instance().data, instance: instance() }\"></ng-container>\n      } @else {\n      {{ instance().message }}\n      }\n    </div>\n  </div>\n\n  <div class=\"talos-snackbar-actions\">\n    @if (instance().actionLabel) {\n    <button type=\"button\" class=\"talos-snackbar-action-btn\" (click)=\"onActionClick()\">\n      {{ instance().actionLabel }}\n    </button>\n    }\n\n    @if (instance().dismissible) {\n    <button type=\"button\" class=\"talos-snackbar-close-btn\" aria-label=\"Close notification\" (click)=\"onCloseClick()\">\n      <svg lucideX [size]=\"16\"></svg>\n    </button>\n    }\n  </div>\n\n  @if (instance().showProgressBar && instance().duration > 0 && instance().duration !== Infinity) {\n  <div class=\"talos-snackbar-progress\" [class.variant-success]=\"instance().variant === 'success'\"\n    [class.variant-warning]=\"instance().variant === 'warning'\" [class.variant-error]=\"instance().variant === 'error'\"\n    [style.width.%]=\"progressPercent()\"></div>\n  }\n</div>", styles: [":host{display:block;width:100%;max-width:440px;pointer-events:auto}.talos-snackbar{position:relative;display:flex;align-items:center;gap:.875rem;padding:.875rem 1rem;background-color:var(--talos-snackbar-bg, var(--talos-card-bg, #ffffff));color:var(--talos-snackbar-text, var(--talos-text-color, #0f172a));border:1px solid var(--talos-snackbar-border, var(--talos-border-color, #e2e8f0));border-radius:var(--talos-snackbar-border-radius, var(--talos-border-radius, .5rem));box-shadow:var(--talos-shadow-dropdown, 0 10px 25px -5px rgba(0, 0, 0, .08), 0 8px 10px -6px rgba(0, 0, 0, .04));overflow:hidden;box-sizing:border-box}.talos-snackbar.pos-top{animation:talos-snackbar-in-top .25s cubic-bezier(.16,1,.3,1) forwards}.talos-snackbar.pos-top.is-dismissing{animation:talos-snackbar-out-top .2s cubic-bezier(.4,0,1,1) forwards}.talos-snackbar.pos-bottom{animation:talos-snackbar-in-bottom .25s cubic-bezier(.16,1,.3,1) forwards}.talos-snackbar.pos-bottom.is-dismissing{animation:talos-snackbar-out-bottom .2s cubic-bezier(.4,0,1,1) forwards}.talos-snackbar .talos-snackbar-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:2.25rem;height:2.25rem;border-radius:var(--talos-border-radius, .5rem);transition:background-color .15s ease,color .15s ease}.talos-snackbar.variant-default .talos-snackbar-icon,.talos-snackbar.variant-info .talos-snackbar-icon{background-color:var(--talos-info-subtle-bg, var(--talos-primary-light, #eff6ff));color:var(--talos-info-text, var(--talos-primary-color, #2563eb))}.talos-snackbar.variant-success .talos-snackbar-icon{background-color:var(--talos-success-subtle-bg, rgba(22, 163, 74, .12));color:var(--talos-success-text, var(--talos-btn-success-bg, #16a34a))}.talos-snackbar.variant-warning .talos-snackbar-icon{background-color:var(--talos-warning-subtle-bg, rgba(217, 119, 6, .12));color:var(--talos-warning-text, var(--talos-warning-color, #d97706))}.talos-snackbar.variant-error .talos-snackbar-icon{background-color:var(--talos-danger-subtle-bg, rgba(239, 68, 68, .12));color:var(--talos-danger-text, var(--talos-error-color, #ef4444))}.talos-snackbar .talos-snackbar-content{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:.125rem}.talos-snackbar .talos-snackbar-content .talos-snackbar-title{font-size:var(--talos-control-font-size, .8125rem);font-weight:600;line-height:1.25rem;color:var(--talos-text-primary, var(--talos-text-color, #0f172a))}.talos-snackbar .talos-snackbar-content .talos-snackbar-message{font-size:.8125rem;line-height:1.25rem;color:var(--talos-text-muted, #64748b);word-break:break-word}.talos-snackbar .talos-snackbar-actions{display:flex;align-items:center;gap:.5rem;flex-shrink:0;margin-left:auto}.talos-snackbar .talos-snackbar-action-btn{border:none;background:transparent;color:var(--talos-primary-text, var(--talos-primary-color, #2563eb));font-size:.8125rem;font-weight:600;padding:.375rem .625rem;border-radius:var(--talos-border-radius, .375rem);cursor:pointer;transition:background-color .15s ease,color .15s ease}.talos-snackbar .talos-snackbar-action-btn:hover{background-color:var(--talos-primary-subtle-bg, #eff6ff);color:var(--talos-primary-hover, #1d4ed8)}.talos-snackbar .talos-snackbar-action-btn:focus-visible{outline:none;box-shadow:var(--talos-focus-ring, 0 0 0 3px rgba(37, 99, 235, .15))}.talos-snackbar .talos-snackbar-close-btn{display:flex;align-items:center;justify-content:center;border:none;background:transparent;color:var(--talos-text-muted, #94a3b8);padding:.375rem;border-radius:var(--talos-border-radius, .375rem);cursor:pointer;transition:color .15s ease,background-color .15s ease}.talos-snackbar .talos-snackbar-close-btn:hover{color:var(--talos-text-primary, #0f172a);background-color:var(--talos-bg-subtle, #f8fafc)}.talos-snackbar .talos-snackbar-close-btn:focus-visible{outline:none;box-shadow:var(--talos-focus-ring, 0 0 0 3px rgba(37, 99, 235, .15))}.talos-snackbar .talos-snackbar-progress{position:absolute;bottom:0;left:0;height:3px;background-color:var(--talos-primary-solid-bg, var(--talos-primary-color, #2563eb));transition:width .1s linear;border-bottom-left-radius:var(--talos-border-radius, .5rem)}.talos-snackbar .talos-snackbar-progress.variant-success{background-color:var(--talos-success-solid-bg, #16a34a)}.talos-snackbar .talos-snackbar-progress.variant-warning{background-color:var(--talos-warning-solid-bg, #d97706)}.talos-snackbar .talos-snackbar-progress.variant-error{background-color:var(--talos-danger-solid-bg, #ef4444)}@keyframes talos-snackbar-in-top{0%{opacity:0;transform:translateY(-16px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes talos-snackbar-out-top{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-16px) scale(.95)}}@keyframes talos-snackbar-in-bottom{0%{opacity:0;transform:translateY(16px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes talos-snackbar-out-bottom{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(16px) scale(.95)}}\n"] }]
+        }], propDecorators: { instance: [{ type: i0.Input, args: [{ isSignal: true, alias: "instance", required: true }] }], dismiss: [{ type: i0.Output, args: ["dismiss"] }], action: [{ type: i0.Output, args: ["action"] }] } });
+
+class TalosSnackbarContainerComponent {
+    snackbarService = inject(TalosSnackbarService);
+    positions = [
+        'top-left',
+        'top-center',
+        'top-right',
+        'bottom-left',
+        'bottom-center',
+        'bottom-right'
+    ];
+    groupedSnackbars = computed(() => {
+        const all = this.snackbarService.snackbars();
+        const map = {
+            'top-left': [],
+            'top-center': [],
+            'top-right': [],
+            'bottom-left': [],
+            'bottom-center': [],
+            'bottom-right': []
+        };
+        for (const item of all) {
+            const pos = item.position || 'bottom-right';
+            if (map[pos]) {
+                map[pos].push(item);
+            }
+            else {
+                map['bottom-right'].push(item);
+            }
+        }
+        return map;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "groupedSnackbars" }] : /* istanbul ignore next */ []));
+    onDismiss(id) {
+        this.snackbarService.dismiss(id);
+    }
+    onAction(id) {
+        // Action handled inside component and service
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSnackbarContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: TalosSnackbarContainerComponent, isStandalone: true, selector: "talos-snackbar-container", host: { classAttribute: "talos-snackbar-overlay-host" }, ngImport: i0, template: `
+    @for (pos of positions; track pos) {
+      @if (groupedSnackbars()[pos].length > 0) {
+        <div class="talos-snackbar-position-group" [class]="pos">
+          @for (item of groupedSnackbars()[pos]; track item.id) {
+            <talos-snackbar
+              [instance]="item"
+              (dismiss)="onDismiss($event)"
+              (action)="onAction($event)"
+            />
+          }
+        </div>
+      }
+    }
+  `, isInline: true, styles: [".cdk-overlay-container{z-index:10000!important;pointer-events:none!important}.cdk-global-overlay-wrapper{pointer-events:none!important}.cdk-overlay-pane.talos-snackbar-overlay-panel{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;max-width:100vw!important;max-height:100vh!important;pointer-events:none!important;margin:0!important;padding:0!important;border:none!important;background:transparent!important;z-index:10000!important}.talos-snackbar-overlay-host{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:10000;display:grid;grid-template-areas:\"top-left top-center top-right\" \". . .\" \"bottom-left bottom-center bottom-right\";grid-template-rows:auto 1fr auto;grid-template-columns:1fr auto 1fr;padding:1.5rem;box-sizing:border-box}@media(max-width:640px){.talos-snackbar-overlay-host{padding:.75rem}}.talos-snackbar-position-group{display:flex;flex-direction:column;gap:.75rem;max-width:440px;width:100%;pointer-events:none}.talos-snackbar-position-group.top-left{grid-area:top-left;align-items:flex-start;justify-self:flex-start}.talos-snackbar-position-group.top-center{grid-area:top-center;align-items:center;justify-self:center}.talos-snackbar-position-group.top-right{grid-area:top-right;align-items:flex-end;justify-self:flex-end}.talos-snackbar-position-group.bottom-left{grid-area:bottom-left;align-items:flex-start;justify-self:flex-start;flex-direction:column-reverse}.talos-snackbar-position-group.bottom-center{grid-area:bottom-center;align-items:center;justify-self:center;flex-direction:column-reverse}.talos-snackbar-position-group.bottom-right{grid-area:bottom-right;align-items:flex-end;justify-self:flex-end;flex-direction:column-reverse}\n"], dependencies: [{ kind: "component", type: TalosSnackbarComponent, selector: "talos-snackbar", inputs: ["instance"], outputs: ["dismiss", "action"] }], encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSnackbarContainerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'talos-snackbar-container', imports: [TalosSnackbarComponent], template: `
+    @for (pos of positions; track pos) {
+      @if (groupedSnackbars()[pos].length > 0) {
+        <div class="talos-snackbar-position-group" [class]="pos">
+          @for (item of groupedSnackbars()[pos]; track item.id) {
+            <talos-snackbar
+              [instance]="item"
+              (dismiss)="onDismiss($event)"
+              (action)="onAction($event)"
+            />
+          }
+        </div>
+      }
+    }
+  `, encapsulation: ViewEncapsulation.None, host: {
+                        'class': 'talos-snackbar-overlay-host'
+                    }, styles: [".cdk-overlay-container{z-index:10000!important;pointer-events:none!important}.cdk-global-overlay-wrapper{pointer-events:none!important}.cdk-overlay-pane.talos-snackbar-overlay-panel{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;max-width:100vw!important;max-height:100vh!important;pointer-events:none!important;margin:0!important;padding:0!important;border:none!important;background:transparent!important;z-index:10000!important}.talos-snackbar-overlay-host{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:10000;display:grid;grid-template-areas:\"top-left top-center top-right\" \". . .\" \"bottom-left bottom-center bottom-right\";grid-template-rows:auto 1fr auto;grid-template-columns:1fr auto 1fr;padding:1.5rem;box-sizing:border-box}@media(max-width:640px){.talos-snackbar-overlay-host{padding:.75rem}}.talos-snackbar-position-group{display:flex;flex-direction:column;gap:.75rem;max-width:440px;width:100%;pointer-events:none}.talos-snackbar-position-group.top-left{grid-area:top-left;align-items:flex-start;justify-self:flex-start}.talos-snackbar-position-group.top-center{grid-area:top-center;align-items:center;justify-self:center}.talos-snackbar-position-group.top-right{grid-area:top-right;align-items:flex-end;justify-self:flex-end}.talos-snackbar-position-group.bottom-left{grid-area:bottom-left;align-items:flex-start;justify-self:flex-start;flex-direction:column-reverse}.talos-snackbar-position-group.bottom-center{grid-area:bottom-center;align-items:center;justify-self:center;flex-direction:column-reverse}.talos-snackbar-position-group.bottom-right{grid-area:bottom-right;align-items:flex-end;justify-self:flex-end;flex-direction:column-reverse}\n"] }]
+        }] });
+
+class TalosSnackbarService {
+    overlay = inject(Overlay);
+    overlayRef = null;
+    /** Reactive list of currently active snackbar instances */
+    snackbars = signal([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "snackbars" }] : /* istanbul ignore next */ []));
+    idCounter = 0;
+    /** Global default configuration values */
+    defaultConfig = {
+        variant: 'default',
+        position: 'bottom-right',
+        duration: 4000,
+        dismissible: true,
+        showProgressBar: true,
+        pauseOnHover: true,
+        icon: true
+    };
+    /**
+     * Override default global configurations for all subsequent snackbars.
+     */
+    setDefaultConfig(config) {
+        this.defaultConfig = { ...this.defaultConfig, ...config };
+    }
+    /**
+     * Main entry point to open a configured snackbar.
+     */
+    show(messageOrConfig, configOverrides = {}) {
+        let fullConfig;
+        if (typeof messageOrConfig === 'string' ||
+            messageOrConfig instanceof TemplateRef) {
+            fullConfig = {
+                message: messageOrConfig,
+                ...configOverrides
+            };
+        }
+        else {
+            fullConfig = {
+                ...messageOrConfig,
+                ...configOverrides
+            };
+        }
+        const merged = {
+            id: `talos-sb-${++this.idCounter}-${Date.now()}`,
+            variant: fullConfig.variant ?? this.defaultConfig.variant ?? 'default',
+            position: fullConfig.position ?? this.defaultConfig.position ?? 'bottom-right',
+            duration: fullConfig.duration ?? this.defaultConfig.duration ?? 4000,
+            dismissible: fullConfig.dismissible ?? this.defaultConfig.dismissible ?? true,
+            showProgressBar: fullConfig.showProgressBar ?? this.defaultConfig.showProgressBar ?? true,
+            pauseOnHover: fullConfig.pauseOnHover ?? this.defaultConfig.pauseOnHover ?? true,
+            icon: fullConfig.icon ?? this.defaultConfig.icon ?? true,
+            message: fullConfig.message,
+            title: fullConfig.title,
+            actionLabel: fullConfig.actionLabel,
+            onAction: fullConfig.onAction,
+            onDismiss: fullConfig.onDismiss,
+            customClass: fullConfig.customClass,
+            data: fullConfig.data,
+            createdAt: Date.now(),
+            isPaused: false
+        };
+        this.ensureOverlayCreated();
+        this.snackbars.update((current) => [...current, merged]);
+        return {
+            id: merged.id,
+            dismiss: () => this.dismiss(merged.id)
+        };
+    }
+    /** Convenience method for Success variant snackbars */
+    success(message, config) {
+        return this.show(message, { ...config, variant: 'success' });
+    }
+    /** Convenience method for Error variant snackbars */
+    error(message, config) {
+        return this.show(message, { ...config, variant: 'error' });
+    }
+    /** Convenience method for Warning variant snackbars */
+    warning(message, config) {
+        return this.show(message, { ...config, variant: 'warning' });
+    }
+    /** Convenience method for Info variant snackbars */
+    info(message, config) {
+        return this.show(message, { ...config, variant: 'info' });
+    }
+    /**
+     * Dismiss a specific snackbar by ID, or the oldest active snackbar if no ID is specified.
+     */
+    dismiss(id) {
+        if (!id) {
+            const current = this.snackbars();
+            if (current.length === 0)
+                return;
+            id = current[0].id;
+        }
+        this.snackbars.update((current) => current.filter((item) => item.id !== id));
+        if (this.snackbars().length === 0) {
+            this.destroyOverlay();
+        }
+    }
+    /**
+     * Dismiss all currently active snackbars.
+     */
+    dismissAll() {
+        this.snackbars.set([]);
+        this.destroyOverlay();
+    }
+    ensureOverlayCreated() {
+        if (!this.overlayRef) {
+            const positionStrategy = this.overlay.position().global();
+            this.overlayRef = this.overlay.create({
+                positionStrategy,
+                hasBackdrop: false,
+                panelClass: 'talos-snackbar-overlay-panel'
+            });
+            const portal = new ComponentPortal(TalosSnackbarContainerComponent);
+            this.overlayRef.attach(portal);
+        }
+    }
+    destroyOverlay() {
+        if (this.overlayRef) {
+            this.overlayRef.dispose();
+            this.overlayRef = null;
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSnackbarService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSnackbarService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSnackbarService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+/**
+ * Convenience NgModule wrapping standalone snackbar components.
+ *
+ * Allows developers who prefer `TalosSnackbarModule` to import all snackbar elements in one go.
+ */
+class TalosSnackbarModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSnackbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.1", ngImport: i0, type: TalosSnackbarModule, imports: [TalosSnackbarComponent,
+            TalosSnackbarContainerComponent], exports: [TalosSnackbarComponent,
+            TalosSnackbarContainerComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSnackbarModule, imports: [TalosSnackbarComponent,
+            TalosSnackbarContainerComponent] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSnackbarModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        TalosSnackbarComponent,
+                        TalosSnackbarContainerComponent
+                    ],
+                    exports: [
+                        TalosSnackbarComponent,
+                        TalosSnackbarContainerComponent
+                    ]
+                }]
+        }] });
+
+/**
+ * Maps standard sizing presets to pixel dimensions.
+ */
+const SPINNER_SIZE_MAP = {
+    xs: 16,
+    sm: 20,
+    md: 28,
+    lg: 40,
+    xl: 56
+};
+/**
+ * Maps standard sizing presets to default stroke / track widths.
+ */
+const SPINNER_STROKE_MAP = {
+    xs: 2,
+    sm: 2.5,
+    md: 3,
+    lg: 4,
+    xl: 5
+};
+/**
+ * Normalizes CSS dimension input (number converted to px string, or raw string).
+ *
+ * @param value Dimension input as string or number
+ * @returns CSS dimension string or undefined
+ */
+function resolveSpinnerDimension(value) {
+    if (value === null || value === undefined || value === '') {
+        return undefined;
+    }
+    if (typeof value === 'number') {
+        return `${value}px`;
+    }
+    const trimmed = value.trim();
+    if (/^\d+$/.test(trimmed)) {
+        return `${trimmed}px`;
+    }
+    return trimmed;
+}
+/**
+ * Extracts a numeric pixel dimension or falls back to size preset lookup.
+ *
+ * @param size Preset or custom dimension
+ * @returns Numeric pixel size
+ */
+function resolveNumericSize(size) {
+    if (!size) {
+        return SPINNER_SIZE_MAP.md;
+    }
+    if (typeof size === 'number') {
+        return size;
+    }
+    if (size in SPINNER_SIZE_MAP) {
+        return SPINNER_SIZE_MAP[size];
+    }
+    const parsed = parseFloat(size);
+    return isNaN(parsed) ? SPINNER_SIZE_MAP.md : parsed;
+}
+
+/**
+ * Global singleton service for displaying full-page or application-level loading spinners.
+ *
+ * Implements reference-counting so concurrent asynchronous operations (such as parallel HTTP requests
+ * or multi-stage workflow transitions) can safely call `show()` and `hide()` without prematurely
+ * dismissing the indicator while other background tasks are still in progress.
+ *
+ * @example
+ * ```typescript
+ * const spinner = inject(TalosSpinnerService);
+ *
+ * // Basic usage
+ * spinner.show('Syncing database...');
+ * await syncData();
+ * spinner.hide();
+ *
+ * // Advanced configuration
+ * spinner.show({
+ *   message: 'Processing batch export...',
+ *   variant: 'primary',
+ *   size: 'lg',
+ *   blur: true
+ * });
+ * ```
+ */
+class TalosSpinnerService {
+    /** Active concurrent request counter */
+    requestCount = signal(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "requestCount" }] : /* istanbul ignore next */ []));
+    /** Current active spinner configuration */
+    currentConfig = signal(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "currentConfig" }] : /* istanbul ignore next */ []));
+    /** Whether the global spinner is currently active */
+    active = computed(() => this.requestCount() > 0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
+    /** The message currently displayed on the global spinner */
+    message = computed(() => this.currentConfig()?.message, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "message" }] : /* istanbul ignore next */ []));
+    /** The color variant currently used on the global spinner */
+    variant = computed(() => this.currentConfig()?.variant ?? 'primary', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    /** The size preset currently used on the global spinner */
+    size = computed(() => this.currentConfig()?.size ?? 'lg', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** The animation type currently used on the global spinner */
+    type = computed(() => this.currentConfig()?.type ?? 'circular', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
+    /** Whether backdrop blur is enabled for the global spinner */
+    blur = computed(() => this.currentConfig()?.blur ?? true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "blur" }] : /* istanbul ignore next */ []));
+    /** Accessible label announced to screen readers */
+    ariaLabel = computed(() => {
+        return this.currentConfig()?.ariaLabel || this.currentConfig()?.message || 'Loading, please wait...';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    /**
+     * Activates the global loading spinner or increments the active operation counter.
+     *
+     * @param configOrMessage Optional configuration object or text message string
+     */
+    show(configOrMessage) {
+        const config = typeof configOrMessage === 'string'
+            ? { message: configOrMessage }
+            : configOrMessage ?? {};
+        this.currentConfig.set({
+            variant: 'primary',
+            size: 'lg',
+            type: 'circular',
+            blur: true,
+            fullscreen: true,
+            ...config
+        });
+        this.requestCount.update(count => count + 1);
+    }
+    /**
+     * Decrements the active operation counter. Dismisses the global spinner once all operations have completed.
+     */
+    hide() {
+        this.requestCount.update(count => {
+            const next = Math.max(0, count - 1);
+            if (next === 0) {
+                this.currentConfig.set(null);
+            }
+            return next;
+        });
+    }
+    /**
+     * Immediately clears all active requests and forces the global spinner to hide.
+     */
+    forceHide() {
+        this.requestCount.set(0);
+        this.currentConfig.set(null);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSpinnerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSpinnerService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSpinnerService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+/**
+ * Modern, accessible loading spinner component for inline button indicators,
+ * contextual card loading overlays, and global asynchronous feedback.
+ *
+ * Fully reactive via Angular signals with support for circular, dots, ring,
+ * and orbital animations, standard sizing presets, semantic variants, and WCAG AA compliance.
+ *
+ * @example
+ * ```html
+ * <!-- Standard inline spinner -->
+ * <talos-spinner size="sm" variant="primary" />
+ *
+ * <!-- Centered card overlay with custom label -->
+ * <talos-spinner [overlay]="true" [loading]="isSyncing()" label="Synchronizing records...">
+ *   <div class="card-content">...</div>
+ * </talos-spinner>
+ *
+ * <!-- Bouncing dots variant for button states -->
+ * <talos-spinner type="dots" size="xs" variant="inherit" />
+ * ```
+ */
+class TalosSpinnerComponent {
+    /**
+     * Visual semantic variant palette for the spinner stroke and accents.
+     * @default 'primary'
+     */
+    variant = input('primary', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    /**
+     * Sizing preset ('xs' | 'sm' | 'md' | 'lg' | 'xl') or custom numerical / CSS dimension.
+     * @default 'md'
+     */
+    size = input('md', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /**
+     * Animation visual rendering type.
+     * @default 'circular'
+     */
+    type = input('circular', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
+    /**
+     * Cycle animation speed preset.
+     * @default 'normal'
+     */
+    speed = input('normal', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "speed" }] : /* istanbul ignore next */ []));
+    /**
+     * Custom stroke width in pixels for SVG circular / ring animations.
+     */
+    strokeWidth = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "strokeWidth" }] : /* istanbul ignore next */ []));
+    /**
+     * Custom CSS color override for the animated spinner fill.
+     */
+    color = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+    /**
+     * Custom CSS background color override for the subtle circular track ring.
+     */
+    trackColor = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "trackColor" }] : /* istanbul ignore next */ []));
+    /**
+     * Whether to render the secondary background track ring.
+     * @default true
+     */
+    showTrack = input(true, { ...(ngDevMode ? { debugName: "showTrack" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Optional visible text label displayed next to or below the spinner.
+     */
+    label = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /**
+     * Position of the label text relative to the spinner indicator.
+     * @default 'bottom'
+     */
+    labelPosition = input('bottom', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "labelPosition" }] : /* istanbul ignore next */ []));
+    /**
+     * Whether this spinner functions as a container wrapper overlay over projected content.
+     * @default false
+     */
+    overlay = input(false, { ...(ngDevMode ? { debugName: "overlay" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Active state when used as an overlay wrapper.
+     * @default true
+     */
+    loading = input(true, { ...(ngDevMode ? { debugName: "loading" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Whether to apply a frosted glassmorphic backdrop blur to the container overlay.
+     * @default false
+     */
+    blur = input(false, { ...(ngDevMode ? { debugName: "blur" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Whether this overlay covers the full viewport screen.
+     * @default false
+     */
+    fullscreen = input(false, { ...(ngDevMode ? { debugName: "fullscreen" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Accessible description announced to screen readers.
+     * Defaults to `label` or 'Loading, please wait...'.
+     */
+    ariaLabel = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    /** Projected custom label directive */
+    customLabel = contentChild(TalosSpinnerLabelDirective, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "customLabel" }] : /* istanbul ignore next */ []));
+    /** Evaluated numeric pixel diameter */
+    numericSize = computed(() => {
+        return resolveNumericSize(this.size());
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "numericSize" }] : /* istanbul ignore next */ []));
+    /** Computed CSS dimension string (e.g., '28px') */
+    computedDimension = computed(() => {
+        return resolveSpinnerDimension(this.size()) ?? null;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "computedDimension" }] : /* istanbul ignore next */ []));
+    /** Evaluated stroke width based on size or custom input */
+    computedStrokeWidth = computed(() => {
+        const custom = this.strokeWidth();
+        if (custom !== undefined && custom > 0) {
+            return custom;
+        }
+        const currentSize = this.size();
+        if (typeof currentSize === 'string' && currentSize in SPINNER_STROKE_MAP) {
+            return SPINNER_STROKE_MAP[currentSize];
+        }
+        const num = this.numericSize();
+        return Math.max(1.75, Math.round((num / 10) * 10) / 10);
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "computedStrokeWidth" }] : /* istanbul ignore next */ []));
+    /** Radius of SVG circle taking stroke into account */
+    computedRadius = computed(() => {
+        const stroke = this.computedStrokeWidth();
+        return Math.max(2, (48 - stroke) / 2);
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "computedRadius" }] : /* istanbul ignore next */ []));
+    /** Circumference of SVG circle for stroke dash animations */
+    computedCircumference = computed(() => {
+        return 2 * Math.PI * this.computedRadius();
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "computedCircumference" }] : /* istanbul ignore next */ []));
+    /** Dash array for SVG circular arc */
+    computedDashArray = computed(() => {
+        const circ = this.computedCircumference();
+        return `${circ * 0.75} ${circ * 0.25}`;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "computedDashArray" }] : /* istanbul ignore next */ []));
+    /** Dash offset for initial arc position */
+    computedDashOffset = computed(() => {
+        return this.computedCircumference() * 0.25;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "computedDashOffset" }] : /* istanbul ignore next */ []));
+    /** Resolved accessible label */
+    resolvedAriaLabel = computed(() => {
+        const custom = this.ariaLabel();
+        if (custom && custom.trim().length > 0) {
+            return custom.trim();
+        }
+        const lbl = this.label();
+        if (lbl && lbl.trim().length > 0) {
+            return lbl.trim();
+        }
+        return 'Loading, please wait...';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedAriaLabel" }] : /* istanbul ignore next */ []));
+    /** Whether the label is arranged in horizontal inline layout with the spinner */
+    isInlineLayout = computed(() => {
+        const pos = this.labelPosition();
+        return pos === 'inline' || pos === 'start' || pos === 'end';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isInlineLayout" }] : /* istanbul ignore next */ []));
+    /** Whether the overlay is actively showing */
+    isOverlayActive = computed(() => {
+        if (!this.overlay()) {
+            return true;
+        }
+        return this.loading();
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isOverlayActive" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: TalosSpinnerComponent, isStandalone: true, selector: "talos-spinner, talos-loading-spinner, [talosSpinner], [talosLoadingSpinner]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, speed: { classPropertyName: "speed", publicName: "speed", isSignal: true, isRequired: false, transformFunction: null }, strokeWidth: { classPropertyName: "strokeWidth", publicName: "strokeWidth", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, trackColor: { classPropertyName: "trackColor", publicName: "trackColor", isSignal: true, isRequired: false, transformFunction: null }, showTrack: { classPropertyName: "showTrack", publicName: "showTrack", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelPosition: { classPropertyName: "labelPosition", publicName: "labelPosition", isSignal: true, isRequired: false, transformFunction: null }, overlay: { classPropertyName: "overlay", publicName: "overlay", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, blur: { classPropertyName: "blur", publicName: "blur", isSignal: true, isRequired: false, transformFunction: null }, fullscreen: { classPropertyName: "fullscreen", publicName: "fullscreen", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.talos-spinner-host--overlay": "overlay()", "class.talos-spinner-host--active": "isOverlayActive()", "class.talos-spinner-host--blur": "blur()", "class.talos-spinner-host--fullscreen": "fullscreen()", "class.talos-spinner--primary": "variant() === \"primary\"", "class.talos-spinner--secondary": "variant() === \"secondary\"", "class.talos-spinner--success": "variant() === \"success\"", "class.talos-spinner--warning": "variant() === \"warning\"", "class.talos-spinner--danger": "variant() === \"danger\" || variant() === \"error\"", "class.talos-spinner--error": "variant() === \"danger\" || variant() === \"error\"", "class.talos-spinner--info": "variant() === \"info\"", "class.talos-spinner--neutral": "variant() === \"neutral\"", "class.talos-spinner--subtle": "variant() === \"subtle\"", "class.talos-spinner--outline": "variant() === \"outline\"", "class.talos-spinner--inherit": "variant() === \"inherit\"", "class.talos-spinner--xs": "size() === \"xs\"", "class.talos-spinner--sm": "size() === \"sm\"", "class.talos-spinner--md": "size() === \"md\"", "class.talos-spinner--lg": "size() === \"lg\"", "class.talos-spinner--xl": "size() === \"xl\"", "class.talos-spinner--circular": "type() === \"circular\"", "class.talos-spinner--dots": "type() === \"dots\"", "class.talos-spinner--ring": "type() === \"ring\"", "class.talos-spinner--orbit": "type() === \"orbit\"", "class.talos-spinner--slow": "speed() === \"slow\"", "class.talos-spinner--fast": "speed() === \"fast\"", "class.talos-spinner--inline": "isInlineLayout()", "attr.role": "overlay() ? null : \"status\"", "attr.aria-live": "overlay() ? null : \"polite\"", "attr.aria-busy": "overlay() ? (isOverlayActive() ? \"true\" : \"false\") : \"true\"", "attr.aria-label": "overlay() ? null : resolvedAriaLabel()", "style.--talos-spinner-custom-size": "computedDimension()", "style.--talos-spinner-custom-color": "color() ?? null", "style.--talos-spinner-custom-track": "trackColor() ?? null" }, classAttribute: "talos-spinner-host" }, queries: [{ propertyName: "customLabel", first: true, predicate: TalosSpinnerLabelDirective, descendants: true, isSignal: true }], ngImport: i0, template: "@if (overlay()) {\n  <!-- Wrapped content projection -->\n  <div class=\"talos-spinner__content-slot\" [class.talos-spinner__content-slot--blurred]=\"isOverlayActive() && blur()\">\n    <ng-content />\n  </div>\n\n  <!-- Active overlay backdrop scrim -->\n  @if (isOverlayActive()) {\n    <div\n      class=\"talos-spinner__overlay\"\n      [class.talos-spinner__overlay--fullscreen]=\"fullscreen()\"\n      [class.talos-spinner__overlay--blur]=\"blur()\"\n      role=\"status\"\n      aria-live=\"polite\"\n      [attr.aria-label]=\"resolvedAriaLabel()\"\n    >\n      <div class=\"talos-spinner__inner\" [class.talos-spinner__inner--inline]=\"isInlineLayout()\">\n        <!-- Label placed start / top -->\n        @if (labelPosition() === 'top' || labelPosition() === 'start') {\n          <ng-container *ngTemplateOutlet=\"labelTemplate\" />\n        }\n\n        <!-- Animated Spinner Core -->\n        <ng-container *ngTemplateOutlet=\"spinnerCoreTemplate\" />\n\n        <!-- Label placed end / bottom / inline -->\n        @if (labelPosition() === 'bottom' || labelPosition() === 'end' || labelPosition() === 'inline') {\n          <ng-container *ngTemplateOutlet=\"labelTemplate\" />\n        }\n      </div>\n    </div>\n  }\n} @else {\n  <!-- Inline / Standalone Spinner Presentation -->\n  <div class=\"talos-spinner__inner\" [class.talos-spinner__inner--inline]=\"isInlineLayout()\">\n    <!-- Label placed start / top -->\n    @if (labelPosition() === 'top' || labelPosition() === 'start') {\n      <ng-container *ngTemplateOutlet=\"labelTemplate\" />\n    }\n\n    <!-- Animated Spinner Core -->\n    <ng-container *ngTemplateOutlet=\"spinnerCoreTemplate\" />\n\n    <!-- Label placed end / bottom / inline -->\n    @if (labelPosition() === 'bottom' || labelPosition() === 'end' || labelPosition() === 'inline') {\n      <ng-container *ngTemplateOutlet=\"labelTemplate\" />\n    }\n  </div>\n\n  <!-- Screen reader fallback when no visible label exists -->\n  @if (!label() && !customLabel()) {\n    <span class=\"sr-only\">{{ resolvedAriaLabel() }}</span>\n  }\n}\n\n<!-- Reusable Spinner Core SVG / Graphics Template -->\n<ng-template #spinnerCoreTemplate>\n  <div class=\"talos-spinner__graphic\" [attr.aria-hidden]=\"true\">\n    @switch (type()) {\n      @case ('dots') {\n        <div class=\"talos-spinner__dots\">\n          <span class=\"talos-spinner__dot talos-spinner__dot--1\"></span>\n          <span class=\"talos-spinner__dot talos-spinner__dot--2\"></span>\n          <span class=\"talos-spinner__dot talos-spinner__dot--3\"></span>\n        </div>\n      }\n\n      @case ('ring') {\n        <svg\n          class=\"talos-spinner__svg talos-spinner__svg--ring\"\n          viewBox=\"0 0 48 48\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          @if (showTrack()) {\n            <circle\n              class=\"talos-spinner__track\"\n              cx=\"24\"\n              cy=\"24\"\n              [attr.r]=\"computedRadius()\"\n              [attr.stroke-width]=\"computedStrokeWidth()\"\n              fill=\"none\"\n            />\n          }\n          <circle\n            class=\"talos-spinner__ring-arc talos-spinner__ring-arc--top\"\n            cx=\"24\"\n            cy=\"24\"\n            [attr.r]=\"computedRadius()\"\n            [attr.stroke-width]=\"computedStrokeWidth()\"\n            fill=\"none\"\n            stroke-linecap=\"round\"\n          />\n          <circle\n            class=\"talos-spinner__ring-arc talos-spinner__ring-arc--bottom\"\n            cx=\"24\"\n            cy=\"24\"\n            [attr.r]=\"computedRadius()\"\n            [attr.stroke-width]=\"computedStrokeWidth()\"\n            fill=\"none\"\n            stroke-linecap=\"round\"\n          />\n        </svg>\n      }\n\n      @case ('orbit') {\n        <div class=\"talos-spinner__orbit\">\n          <span class=\"talos-spinner__orbit-core\"></span>\n          <span class=\"talos-spinner__orbit-satellite talos-spinner__orbit-satellite--1\"></span>\n          <span class=\"talos-spinner__orbit-satellite talos-spinner__orbit-satellite--2\"></span>\n        </div>\n      }\n\n      @default {\n        <!-- Default circular spinner -->\n        <svg\n          class=\"talos-spinner__svg talos-spinner__svg--circular\"\n          viewBox=\"0 0 48 48\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          @if (showTrack()) {\n            <circle\n              class=\"talos-spinner__track\"\n              cx=\"24\"\n              cy=\"24\"\n              [attr.r]=\"computedRadius()\"\n              [attr.stroke-width]=\"computedStrokeWidth()\"\n              fill=\"none\"\n            />\n          }\n          <circle\n            class=\"talos-spinner__arc\"\n            cx=\"24\"\n            cy=\"24\"\n            [attr.r]=\"computedRadius()\"\n            [attr.stroke-width]=\"computedStrokeWidth()\"\n            fill=\"none\"\n            stroke-linecap=\"round\"\n            [attr.stroke-dasharray]=\"computedDashArray()\"\n            [attr.stroke-dashoffset]=\"computedDashOffset()\"\n          />\n        </svg>\n      }\n    }\n  </div>\n</ng-template>\n\n<!-- Reusable Label Template -->\n<ng-template #labelTemplate>\n  @if (label() || customLabel()) {\n    <div\n      class=\"talos-spinner__label\"\n      [class.talos-spinner__label--top]=\"labelPosition() === 'top'\"\n      [class.talos-spinner__label--bottom]=\"labelPosition() === 'bottom'\"\n      [class.talos-spinner__label--start]=\"labelPosition() === 'start'\"\n      [class.talos-spinner__label--end]=\"labelPosition() === 'end'\"\n      [class.talos-spinner__label--inline]=\"labelPosition() === 'inline'\"\n    >\n      @if (label()) {\n        <span>{{ label() }}</span>\n      }\n      <ng-content select=\"[talosSpinnerLabel]\" />\n    </div>\n  }\n</ng-template>\n", styles: [":host{display:inline-flex;vertical-align:middle;box-sizing:border-box;--spinner-size: var(--talos-spinner-custom-size, 28px);--spinner-color: var(--talos-spinner-custom-color, var(--talos-primary-color, #2563eb));--spinner-track-color: var(--talos-spinner-custom-track, var(--talos-border-subtle, rgba(226, 232, 240, .8)));--spinner-speed: .85s}:host.talos-spinner--xs{--spinner-size: 16px}:host.talos-spinner--sm{--spinner-size: 20px}:host.talos-spinner--md{--spinner-size: 28px}:host.talos-spinner--lg{--spinner-size: 40px}:host.talos-spinner--xl{--spinner-size: 56px}:host.talos-spinner--primary{--spinner-color: var(--talos-primary-color, #2563eb);--spinner-track-color: var(--talos-primary-light, rgba(37, 99, 235, .15))}:host.talos-spinner--secondary{--spinner-color: var(--talos-secondary, #64748b);--spinner-track-color: rgba(100, 116, 139, .15)}:host.talos-spinner--success{--spinner-color: var(--talos-success-color, #16a34a);--spinner-track-color: var(--talos-success-light, rgba(22, 163, 74, .15))}:host.talos-spinner--warning{--spinner-color: var(--talos-warning-color, #d97706);--spinner-track-color: var(--talos-warning-light, rgba(217, 119, 6, .15))}:host.talos-spinner--danger,:host.talos-spinner--error{--spinner-color: var(--talos-danger-color, #dc2626);--spinner-track-color: var(--talos-danger-light, rgba(220, 38, 38, .15))}:host.talos-spinner--info{--spinner-color: var(--talos-info-color, #0284c7);--spinner-track-color: var(--talos-info-light, rgba(2, 132, 199, .15))}:host.talos-spinner--neutral{--spinner-color: var(--talos-neutral-color, #64748b);--spinner-track-color: rgba(100, 116, 139, .12)}:host.talos-spinner--subtle{--spinner-color: var(--talos-text-muted, #94a3b8);--spinner-track-color: rgba(148, 163, 184, .12)}:host.talos-spinner--outline{--spinner-color: currentColor;--spinner-track-color: transparent}:host.talos-spinner--inherit{--spinner-color: currentColor;--spinner-track-color: rgba(255, 255, 255, .2)}:host.talos-spinner--slow{--spinner-speed: 1.5s}:host.talos-spinner--fast{--spinner-speed: .5s}:host.talos-spinner-host--overlay{position:relative;display:block;width:100%}:host.talos-spinner-host--fullscreen{position:fixed;inset:0;z-index:var(--talos-z-index-modal, 9999)}.talos-spinner__inner{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center}.talos-spinner__inner--inline{flex-direction:row;align-items:center;gap:8px;text-align:left}.talos-spinner__graphic{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--spinner-size);height:var(--spinner-size);flex-shrink:0}.talos-spinner__svg{width:100%;height:100%;display:block;overflow:visible}.talos-spinner__svg--circular{animation:talos-spinner-rotate var(--spinner-speed) linear infinite;transform-origin:center center}.talos-spinner__svg--circular .talos-spinner__arc{animation:talos-spinner-dash calc(var(--spinner-speed) * 1.6) ease-in-out infinite}.talos-spinner__svg--ring{animation:talos-spinner-rotate var(--spinner-speed) linear infinite;transform-origin:center center}.talos-spinner__track{stroke:var(--spinner-track-color);opacity:.85}.talos-spinner__arc{stroke:var(--spinner-color);transform-origin:center center}.talos-spinner__ring-arc{stroke:var(--spinner-color)}.talos-spinner__ring-arc--top{stroke-dasharray:28 32}.talos-spinner__ring-arc--bottom{stroke-dasharray:18 42;opacity:.65}.talos-spinner__dots{display:inline-flex;align-items:center;justify-content:center;gap:calc(var(--spinner-size) * .15);height:100%}.talos-spinner__dot{display:block;width:calc(var(--spinner-size) * .28);height:calc(var(--spinner-size) * .28);border-radius:50%;background-color:var(--spinner-color);animation:talos-spinner-dot-bounce var(--spinner-speed) ease-in-out infinite both}.talos-spinner__dot--1{animation-delay:-.32s}.talos-spinner__dot--2{animation-delay:-.16s}.talos-spinner__dot--3{animation-delay:0s}.talos-spinner__orbit{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;animation:talos-spinner-rotate var(--spinner-speed) linear infinite}.talos-spinner__orbit-core{width:calc(var(--spinner-size) * .3);height:calc(var(--spinner-size) * .3);border-radius:50%;background-color:var(--spinner-color);box-shadow:0 0 calc(var(--spinner-size) * .2) var(--spinner-color)}.talos-spinner__orbit-satellite{position:absolute;border-radius:50%;background-color:var(--spinner-color)}.talos-spinner__orbit-satellite--1{top:0;left:50%;transform:translate(-50%);width:calc(var(--spinner-size) * .22);height:calc(var(--spinner-size) * .22)}.talos-spinner__orbit-satellite--2{bottom:0;left:50%;transform:translate(-50%);width:calc(var(--spinner-size) * .16);height:calc(var(--spinner-size) * .16);opacity:.6}.talos-spinner__label{font-size:var(--talos-font-size-sm, 13px);font-weight:500;line-height:1.4;color:var(--talos-text-color, #1e293b);transition:color .2s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;user-select:none}.talos-spinner__label--bottom{margin-top:2px}.talos-spinner__label--top{margin-bottom:2px}.talos-spinner__label--start{margin-right:2px}.talos-spinner__label--end,.talos-spinner__label--inline{margin-left:2px}.talos-spinner__content-slot{width:100%;transition:filter .2s cubic-bezier(.4,0,.2,1)}.talos-spinner__content-slot--blurred{filter:blur(2px);pointer-events:none;-webkit-user-select:none;user-select:none}.talos-spinner__overlay{position:absolute;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;padding:16px;background-color:var(--talos-spinner-overlay-bg, rgba(255, 255, 255, .72));-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:inherit;pointer-events:auto;animation:talos-spinner-fade .2s cubic-bezier(.4,0,.2,1)}.talos-spinner__overlay--blur{backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.talos-spinner__overlay--fullscreen{position:fixed;z-index:var(--talos-z-index-modal, 9999)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}@keyframes talos-spinner-rotate{to{transform:rotate(360deg)}}@keyframes talos-spinner-dash{0%{stroke-dasharray:1 120;stroke-dashoffset:0}50%{stroke-dasharray:90 120;stroke-dashoffset:-35}to{stroke-dasharray:90 120;stroke-dashoffset:-124}}@keyframes talos-spinner-dot-bounce{0%,80%,to{transform:scale(.6);opacity:.4}40%{transform:scale(1);opacity:1}}@keyframes talos-spinner-fade{0%{opacity:0}to{opacity:1}}[data-theme=dark] :host,[data-mode=dark] :host,.dark :host,.dark-theme :host{--spinner-track-color: var(--talos-spinner-custom-track, rgba(255, 255, 255, .12))}[data-theme=dark] :host .talos-spinner__label,[data-mode=dark] :host .talos-spinner__label,.dark :host .talos-spinner__label,.dark-theme :host .talos-spinner__label{color:var(--talos-text-color, #f1f5f9)}[data-theme=dark] :host .talos-spinner__overlay,[data-mode=dark] :host .talos-spinner__overlay,.dark :host .talos-spinner__overlay,.dark-theme :host .talos-spinner__overlay{background-color:var(--talos-spinner-overlay-bg-dark, rgba(15, 23, 42, .72))}@media(prefers-reduced-motion:reduce){.talos-spinner__svg,.talos-spinner__svg--circular,.talos-spinner__svg--ring,.talos-spinner__orbit{animation:talos-spinner-pulse 1.8s ease-in-out infinite!important}.talos-spinner__arc{animation:none!important;stroke-dasharray:80 40!important}.talos-spinner__dot{animation:talos-spinner-pulse 1.8s ease-in-out infinite!important}@keyframes talos-spinner-pulse{0%,to{opacity:1}50%{opacity:.3}}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSpinnerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'talos-spinner, talos-loading-spinner, [talosSpinner], [talosLoadingSpinner]', imports: [NgTemplateOutlet], host: {
+                        'class': 'talos-spinner-host',
+                        '[class.talos-spinner-host--overlay]': 'overlay()',
+                        '[class.talos-spinner-host--active]': 'isOverlayActive()',
+                        '[class.talos-spinner-host--blur]': 'blur()',
+                        '[class.talos-spinner-host--fullscreen]': 'fullscreen()',
+                        '[class.talos-spinner--primary]': 'variant() === "primary"',
+                        '[class.talos-spinner--secondary]': 'variant() === "secondary"',
+                        '[class.talos-spinner--success]': 'variant() === "success"',
+                        '[class.talos-spinner--warning]': 'variant() === "warning"',
+                        '[class.talos-spinner--danger]': 'variant() === "danger" || variant() === "error"',
+                        '[class.talos-spinner--error]': 'variant() === "danger" || variant() === "error"',
+                        '[class.talos-spinner--info]': 'variant() === "info"',
+                        '[class.talos-spinner--neutral]': 'variant() === "neutral"',
+                        '[class.talos-spinner--subtle]': 'variant() === "subtle"',
+                        '[class.talos-spinner--outline]': 'variant() === "outline"',
+                        '[class.talos-spinner--inherit]': 'variant() === "inherit"',
+                        '[class.talos-spinner--xs]': 'size() === "xs"',
+                        '[class.talos-spinner--sm]': 'size() === "sm"',
+                        '[class.talos-spinner--md]': 'size() === "md"',
+                        '[class.talos-spinner--lg]': 'size() === "lg"',
+                        '[class.talos-spinner--xl]': 'size() === "xl"',
+                        '[class.talos-spinner--circular]': 'type() === "circular"',
+                        '[class.talos-spinner--dots]': 'type() === "dots"',
+                        '[class.talos-spinner--ring]': 'type() === "ring"',
+                        '[class.talos-spinner--orbit]': 'type() === "orbit"',
+                        '[class.talos-spinner--slow]': 'speed() === "slow"',
+                        '[class.talos-spinner--fast]': 'speed() === "fast"',
+                        '[class.talos-spinner--inline]': 'isInlineLayout()',
+                        '[attr.role]': 'overlay() ? null : "status"',
+                        '[attr.aria-live]': 'overlay() ? null : "polite"',
+                        '[attr.aria-busy]': 'overlay() ? (isOverlayActive() ? "true" : "false") : "true"',
+                        '[attr.aria-label]': 'overlay() ? null : resolvedAriaLabel()',
+                        '[style.--talos-spinner-custom-size]': 'computedDimension()',
+                        '[style.--talos-spinner-custom-color]': 'color() ?? null',
+                        '[style.--talos-spinner-custom-track]': 'trackColor() ?? null'
+                    }, template: "@if (overlay()) {\n  <!-- Wrapped content projection -->\n  <div class=\"talos-spinner__content-slot\" [class.talos-spinner__content-slot--blurred]=\"isOverlayActive() && blur()\">\n    <ng-content />\n  </div>\n\n  <!-- Active overlay backdrop scrim -->\n  @if (isOverlayActive()) {\n    <div\n      class=\"talos-spinner__overlay\"\n      [class.talos-spinner__overlay--fullscreen]=\"fullscreen()\"\n      [class.talos-spinner__overlay--blur]=\"blur()\"\n      role=\"status\"\n      aria-live=\"polite\"\n      [attr.aria-label]=\"resolvedAriaLabel()\"\n    >\n      <div class=\"talos-spinner__inner\" [class.talos-spinner__inner--inline]=\"isInlineLayout()\">\n        <!-- Label placed start / top -->\n        @if (labelPosition() === 'top' || labelPosition() === 'start') {\n          <ng-container *ngTemplateOutlet=\"labelTemplate\" />\n        }\n\n        <!-- Animated Spinner Core -->\n        <ng-container *ngTemplateOutlet=\"spinnerCoreTemplate\" />\n\n        <!-- Label placed end / bottom / inline -->\n        @if (labelPosition() === 'bottom' || labelPosition() === 'end' || labelPosition() === 'inline') {\n          <ng-container *ngTemplateOutlet=\"labelTemplate\" />\n        }\n      </div>\n    </div>\n  }\n} @else {\n  <!-- Inline / Standalone Spinner Presentation -->\n  <div class=\"talos-spinner__inner\" [class.talos-spinner__inner--inline]=\"isInlineLayout()\">\n    <!-- Label placed start / top -->\n    @if (labelPosition() === 'top' || labelPosition() === 'start') {\n      <ng-container *ngTemplateOutlet=\"labelTemplate\" />\n    }\n\n    <!-- Animated Spinner Core -->\n    <ng-container *ngTemplateOutlet=\"spinnerCoreTemplate\" />\n\n    <!-- Label placed end / bottom / inline -->\n    @if (labelPosition() === 'bottom' || labelPosition() === 'end' || labelPosition() === 'inline') {\n      <ng-container *ngTemplateOutlet=\"labelTemplate\" />\n    }\n  </div>\n\n  <!-- Screen reader fallback when no visible label exists -->\n  @if (!label() && !customLabel()) {\n    <span class=\"sr-only\">{{ resolvedAriaLabel() }}</span>\n  }\n}\n\n<!-- Reusable Spinner Core SVG / Graphics Template -->\n<ng-template #spinnerCoreTemplate>\n  <div class=\"talos-spinner__graphic\" [attr.aria-hidden]=\"true\">\n    @switch (type()) {\n      @case ('dots') {\n        <div class=\"talos-spinner__dots\">\n          <span class=\"talos-spinner__dot talos-spinner__dot--1\"></span>\n          <span class=\"talos-spinner__dot talos-spinner__dot--2\"></span>\n          <span class=\"talos-spinner__dot talos-spinner__dot--3\"></span>\n        </div>\n      }\n\n      @case ('ring') {\n        <svg\n          class=\"talos-spinner__svg talos-spinner__svg--ring\"\n          viewBox=\"0 0 48 48\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          @if (showTrack()) {\n            <circle\n              class=\"talos-spinner__track\"\n              cx=\"24\"\n              cy=\"24\"\n              [attr.r]=\"computedRadius()\"\n              [attr.stroke-width]=\"computedStrokeWidth()\"\n              fill=\"none\"\n            />\n          }\n          <circle\n            class=\"talos-spinner__ring-arc talos-spinner__ring-arc--top\"\n            cx=\"24\"\n            cy=\"24\"\n            [attr.r]=\"computedRadius()\"\n            [attr.stroke-width]=\"computedStrokeWidth()\"\n            fill=\"none\"\n            stroke-linecap=\"round\"\n          />\n          <circle\n            class=\"talos-spinner__ring-arc talos-spinner__ring-arc--bottom\"\n            cx=\"24\"\n            cy=\"24\"\n            [attr.r]=\"computedRadius()\"\n            [attr.stroke-width]=\"computedStrokeWidth()\"\n            fill=\"none\"\n            stroke-linecap=\"round\"\n          />\n        </svg>\n      }\n\n      @case ('orbit') {\n        <div class=\"talos-spinner__orbit\">\n          <span class=\"talos-spinner__orbit-core\"></span>\n          <span class=\"talos-spinner__orbit-satellite talos-spinner__orbit-satellite--1\"></span>\n          <span class=\"talos-spinner__orbit-satellite talos-spinner__orbit-satellite--2\"></span>\n        </div>\n      }\n\n      @default {\n        <!-- Default circular spinner -->\n        <svg\n          class=\"talos-spinner__svg talos-spinner__svg--circular\"\n          viewBox=\"0 0 48 48\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          @if (showTrack()) {\n            <circle\n              class=\"talos-spinner__track\"\n              cx=\"24\"\n              cy=\"24\"\n              [attr.r]=\"computedRadius()\"\n              [attr.stroke-width]=\"computedStrokeWidth()\"\n              fill=\"none\"\n            />\n          }\n          <circle\n            class=\"talos-spinner__arc\"\n            cx=\"24\"\n            cy=\"24\"\n            [attr.r]=\"computedRadius()\"\n            [attr.stroke-width]=\"computedStrokeWidth()\"\n            fill=\"none\"\n            stroke-linecap=\"round\"\n            [attr.stroke-dasharray]=\"computedDashArray()\"\n            [attr.stroke-dashoffset]=\"computedDashOffset()\"\n          />\n        </svg>\n      }\n    }\n  </div>\n</ng-template>\n\n<!-- Reusable Label Template -->\n<ng-template #labelTemplate>\n  @if (label() || customLabel()) {\n    <div\n      class=\"talos-spinner__label\"\n      [class.talos-spinner__label--top]=\"labelPosition() === 'top'\"\n      [class.talos-spinner__label--bottom]=\"labelPosition() === 'bottom'\"\n      [class.talos-spinner__label--start]=\"labelPosition() === 'start'\"\n      [class.talos-spinner__label--end]=\"labelPosition() === 'end'\"\n      [class.talos-spinner__label--inline]=\"labelPosition() === 'inline'\"\n    >\n      @if (label()) {\n        <span>{{ label() }}</span>\n      }\n      <ng-content select=\"[talosSpinnerLabel]\" />\n    </div>\n  }\n</ng-template>\n", styles: [":host{display:inline-flex;vertical-align:middle;box-sizing:border-box;--spinner-size: var(--talos-spinner-custom-size, 28px);--spinner-color: var(--talos-spinner-custom-color, var(--talos-primary-color, #2563eb));--spinner-track-color: var(--talos-spinner-custom-track, var(--talos-border-subtle, rgba(226, 232, 240, .8)));--spinner-speed: .85s}:host.talos-spinner--xs{--spinner-size: 16px}:host.talos-spinner--sm{--spinner-size: 20px}:host.talos-spinner--md{--spinner-size: 28px}:host.talos-spinner--lg{--spinner-size: 40px}:host.talos-spinner--xl{--spinner-size: 56px}:host.talos-spinner--primary{--spinner-color: var(--talos-primary-color, #2563eb);--spinner-track-color: var(--talos-primary-light, rgba(37, 99, 235, .15))}:host.talos-spinner--secondary{--spinner-color: var(--talos-secondary, #64748b);--spinner-track-color: rgba(100, 116, 139, .15)}:host.talos-spinner--success{--spinner-color: var(--talos-success-color, #16a34a);--spinner-track-color: var(--talos-success-light, rgba(22, 163, 74, .15))}:host.talos-spinner--warning{--spinner-color: var(--talos-warning-color, #d97706);--spinner-track-color: var(--talos-warning-light, rgba(217, 119, 6, .15))}:host.talos-spinner--danger,:host.talos-spinner--error{--spinner-color: var(--talos-danger-color, #dc2626);--spinner-track-color: var(--talos-danger-light, rgba(220, 38, 38, .15))}:host.talos-spinner--info{--spinner-color: var(--talos-info-color, #0284c7);--spinner-track-color: var(--talos-info-light, rgba(2, 132, 199, .15))}:host.talos-spinner--neutral{--spinner-color: var(--talos-neutral-color, #64748b);--spinner-track-color: rgba(100, 116, 139, .12)}:host.talos-spinner--subtle{--spinner-color: var(--talos-text-muted, #94a3b8);--spinner-track-color: rgba(148, 163, 184, .12)}:host.talos-spinner--outline{--spinner-color: currentColor;--spinner-track-color: transparent}:host.talos-spinner--inherit{--spinner-color: currentColor;--spinner-track-color: rgba(255, 255, 255, .2)}:host.talos-spinner--slow{--spinner-speed: 1.5s}:host.talos-spinner--fast{--spinner-speed: .5s}:host.talos-spinner-host--overlay{position:relative;display:block;width:100%}:host.talos-spinner-host--fullscreen{position:fixed;inset:0;z-index:var(--talos-z-index-modal, 9999)}.talos-spinner__inner{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center}.talos-spinner__inner--inline{flex-direction:row;align-items:center;gap:8px;text-align:left}.talos-spinner__graphic{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--spinner-size);height:var(--spinner-size);flex-shrink:0}.talos-spinner__svg{width:100%;height:100%;display:block;overflow:visible}.talos-spinner__svg--circular{animation:talos-spinner-rotate var(--spinner-speed) linear infinite;transform-origin:center center}.talos-spinner__svg--circular .talos-spinner__arc{animation:talos-spinner-dash calc(var(--spinner-speed) * 1.6) ease-in-out infinite}.talos-spinner__svg--ring{animation:talos-spinner-rotate var(--spinner-speed) linear infinite;transform-origin:center center}.talos-spinner__track{stroke:var(--spinner-track-color);opacity:.85}.talos-spinner__arc{stroke:var(--spinner-color);transform-origin:center center}.talos-spinner__ring-arc{stroke:var(--spinner-color)}.talos-spinner__ring-arc--top{stroke-dasharray:28 32}.talos-spinner__ring-arc--bottom{stroke-dasharray:18 42;opacity:.65}.talos-spinner__dots{display:inline-flex;align-items:center;justify-content:center;gap:calc(var(--spinner-size) * .15);height:100%}.talos-spinner__dot{display:block;width:calc(var(--spinner-size) * .28);height:calc(var(--spinner-size) * .28);border-radius:50%;background-color:var(--spinner-color);animation:talos-spinner-dot-bounce var(--spinner-speed) ease-in-out infinite both}.talos-spinner__dot--1{animation-delay:-.32s}.talos-spinner__dot--2{animation-delay:-.16s}.talos-spinner__dot--3{animation-delay:0s}.talos-spinner__orbit{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;animation:talos-spinner-rotate var(--spinner-speed) linear infinite}.talos-spinner__orbit-core{width:calc(var(--spinner-size) * .3);height:calc(var(--spinner-size) * .3);border-radius:50%;background-color:var(--spinner-color);box-shadow:0 0 calc(var(--spinner-size) * .2) var(--spinner-color)}.talos-spinner__orbit-satellite{position:absolute;border-radius:50%;background-color:var(--spinner-color)}.talos-spinner__orbit-satellite--1{top:0;left:50%;transform:translate(-50%);width:calc(var(--spinner-size) * .22);height:calc(var(--spinner-size) * .22)}.talos-spinner__orbit-satellite--2{bottom:0;left:50%;transform:translate(-50%);width:calc(var(--spinner-size) * .16);height:calc(var(--spinner-size) * .16);opacity:.6}.talos-spinner__label{font-size:var(--talos-font-size-sm, 13px);font-weight:500;line-height:1.4;color:var(--talos-text-color, #1e293b);transition:color .2s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;user-select:none}.talos-spinner__label--bottom{margin-top:2px}.talos-spinner__label--top{margin-bottom:2px}.talos-spinner__label--start{margin-right:2px}.talos-spinner__label--end,.talos-spinner__label--inline{margin-left:2px}.talos-spinner__content-slot{width:100%;transition:filter .2s cubic-bezier(.4,0,.2,1)}.talos-spinner__content-slot--blurred{filter:blur(2px);pointer-events:none;-webkit-user-select:none;user-select:none}.talos-spinner__overlay{position:absolute;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;padding:16px;background-color:var(--talos-spinner-overlay-bg, rgba(255, 255, 255, .72));-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:inherit;pointer-events:auto;animation:talos-spinner-fade .2s cubic-bezier(.4,0,.2,1)}.talos-spinner__overlay--blur{backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.talos-spinner__overlay--fullscreen{position:fixed;z-index:var(--talos-z-index-modal, 9999)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}@keyframes talos-spinner-rotate{to{transform:rotate(360deg)}}@keyframes talos-spinner-dash{0%{stroke-dasharray:1 120;stroke-dashoffset:0}50%{stroke-dasharray:90 120;stroke-dashoffset:-35}to{stroke-dasharray:90 120;stroke-dashoffset:-124}}@keyframes talos-spinner-dot-bounce{0%,80%,to{transform:scale(.6);opacity:.4}40%{transform:scale(1);opacity:1}}@keyframes talos-spinner-fade{0%{opacity:0}to{opacity:1}}[data-theme=dark] :host,[data-mode=dark] :host,.dark :host,.dark-theme :host{--spinner-track-color: var(--talos-spinner-custom-track, rgba(255, 255, 255, .12))}[data-theme=dark] :host .talos-spinner__label,[data-mode=dark] :host .talos-spinner__label,.dark :host .talos-spinner__label,.dark-theme :host .talos-spinner__label{color:var(--talos-text-color, #f1f5f9)}[data-theme=dark] :host .talos-spinner__overlay,[data-mode=dark] :host .talos-spinner__overlay,.dark :host .talos-spinner__overlay,.dark-theme :host .talos-spinner__overlay{background-color:var(--talos-spinner-overlay-bg-dark, rgba(15, 23, 42, .72))}@media(prefers-reduced-motion:reduce){.talos-spinner__svg,.talos-spinner__svg--circular,.talos-spinner__svg--ring,.talos-spinner__orbit{animation:talos-spinner-pulse 1.8s ease-in-out infinite!important}.talos-spinner__arc{animation:none!important;stroke-dasharray:80 40!important}.talos-spinner__dot{animation:talos-spinner-pulse 1.8s ease-in-out infinite!important}@keyframes talos-spinner-pulse{0%,to{opacity:1}50%{opacity:.3}}}\n"] }]
+        }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], speed: [{ type: i0.Input, args: [{ isSignal: true, alias: "speed", required: false }] }], strokeWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "strokeWidth", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], trackColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "trackColor", required: false }] }], showTrack: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTrack", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], labelPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelPosition", required: false }] }], overlay: [{ type: i0.Input, args: [{ isSignal: true, alias: "overlay", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], blur: [{ type: i0.Input, args: [{ isSignal: true, alias: "blur", required: false }] }], fullscreen: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullscreen", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], customLabel: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TalosSpinnerLabelDirective), { isSignal: true }] }] } });
+/**
+ * Global overlay component connected to `TalosSpinnerService`.
+ *
+ * Can be placed in the root template (`app.component.html`) to provide a reactive,
+ * unified full-screen loading state for all global asynchronous background processes.
+ *
+ * @example
+ * ```html
+ * <!-- In app.component.html -->
+ * <talos-global-spinner />
+ * ```
+ */
+class TalosGlobalSpinnerComponent {
+    spinnerService = inject(TalosSpinnerService);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosGlobalSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: TalosGlobalSpinnerComponent, isStandalone: true, selector: "talos-global-spinner", ngImport: i0, template: `
+    @if (spinnerService.active()) {
+      <div
+        class="talos-global-spinner-backdrop"
+        [class.talos-global-spinner-backdrop--blur]="spinnerService.blur()"
+        role="dialog"
+        aria-modal="true"
+        [attr.aria-label]="spinnerService.ariaLabel()"
+      >
+        <talos-spinner
+          [variant]="spinnerService.variant()"
+          [size]="spinnerService.size()"
+          [type]="spinnerService.type()"
+          [label]="spinnerService.message()"
+          labelPosition="bottom"
+          [ariaLabel]="spinnerService.ariaLabel()"
+        />
+      </div>
+    }
+  `, isInline: true, styles: [":host{display:contents}.talos-global-spinner-backdrop{position:fixed;inset:0;z-index:var(--talos-z-index-modal, 9999);display:flex;align-items:center;justify-content:center;background-color:var(--talos-backdrop-bg, rgba(15, 23, 42, .45));-webkit-backdrop-filter:none;backdrop-filter:none;transition:opacity .2s cubic-bezier(.4,0,.2,1);animation:talos-spinner-fade-in .2s ease-out}.talos-global-spinner-backdrop.talos-global-spinner-backdrop--blur{backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}@keyframes talos-spinner-fade-in{0%{opacity:0}to{opacity:1}}\n"], dependencies: [{ kind: "component", type: TalosSpinnerComponent, selector: "talos-spinner, talos-loading-spinner, [talosSpinner], [talosLoadingSpinner]", inputs: ["variant", "size", "type", "speed", "strokeWidth", "color", "trackColor", "showTrack", "label", "labelPosition", "overlay", "loading", "blur", "fullscreen", "ariaLabel"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosGlobalSpinnerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'talos-global-spinner', imports: [TalosSpinnerComponent], template: `
+    @if (spinnerService.active()) {
+      <div
+        class="talos-global-spinner-backdrop"
+        [class.talos-global-spinner-backdrop--blur]="spinnerService.blur()"
+        role="dialog"
+        aria-modal="true"
+        [attr.aria-label]="spinnerService.ariaLabel()"
+      >
+        <talos-spinner
+          [variant]="spinnerService.variant()"
+          [size]="spinnerService.size()"
+          [type]="spinnerService.type()"
+          [label]="spinnerService.message()"
+          labelPosition="bottom"
+          [ariaLabel]="spinnerService.ariaLabel()"
+        />
+      </div>
+    }
+  `, styles: [":host{display:contents}.talos-global-spinner-backdrop{position:fixed;inset:0;z-index:var(--talos-z-index-modal, 9999);display:flex;align-items:center;justify-content:center;background-color:var(--talos-backdrop-bg, rgba(15, 23, 42, .45));-webkit-backdrop-filter:none;backdrop-filter:none;transition:opacity .2s cubic-bezier(.4,0,.2,1);animation:talos-spinner-fade-in .2s ease-out}.talos-global-spinner-backdrop.talos-global-spinner-backdrop--blur{backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}@keyframes talos-spinner-fade-in{0%{opacity:0}to{opacity:1}}\n"] }]
+        }] });
+
+/**
+ * Structural / content directive for marking custom spinner label templates.
+ *
+ * @example
+ * ```html
+ * <talos-spinner>
+ *   <span *talosSpinnerLabel class="custom-label">
+ *     Syncing <strong>24/100</strong> files...
+ *   </span>
+ * </talos-spinner>
+ * ```
+ */
+class TalosSpinnerLabelDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSpinnerLabelDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.1", type: TalosSpinnerLabelDirective, isStandalone: true, selector: "[talosSpinnerLabel]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSpinnerLabelDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[talosSpinnerLabel]'
+                }]
+        }] });
+/**
+ * Directive that attaches an accessible loading spinner overlay directly onto any container element
+ * (e.g., card, panel, table, or form section).
+ *
+ * When active, it dims the host container, applies an optional blur effect, disables interactions,
+ * and renders a centered spinner indicator with optional message.
+ *
+ * @example
+ * ```html
+ * <div [talosSpinnerOverlay]="isUpdating()" talosSpinnerMessage="Saving changes..." talosSpinnerVariant="primary">
+ *   <p>Card Content...</p>
+ * </div>
+ * ```
+ */
+class TalosSpinnerOverlayDirective {
+    elementRef = inject(ElementRef);
+    renderer = inject(Renderer2);
+    appRef = inject(ApplicationRef);
+    envInjector = inject(EnvironmentInjector);
+    overlayElement = null;
+    spinnerRef = null;
+    /**
+     * Whether the loading overlay is currently active.
+     */
+    talosSpinnerOverlay = input(false, { ...(ngDevMode ? { debugName: "talosSpinnerOverlay" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Alias input `talosLoading` for concise developer ergonomics.
+     */
+    talosLoading = input(false, { ...(ngDevMode ? { debugName: "talosLoading" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Optional loading message or status string to display below the spinner.
+     */
+    message = input(undefined, { ...(ngDevMode ? { debugName: "message" } : /* istanbul ignore next */ {}), alias: 'talosSpinnerMessage' });
+    /**
+     * Semantic color variant for the attached spinner overlay.
+     * @default 'primary'
+     */
+    variant = input('primary', { ...(ngDevMode ? { debugName: "variant" } : /* istanbul ignore next */ {}), alias: 'talosSpinnerVariant' });
+    /**
+     * Size preset for the attached spinner indicator.
+     * @default 'md'
+     */
+    size = input('md', { ...(ngDevMode ? { debugName: "size" } : /* istanbul ignore next */ {}), alias: 'talosSpinnerSize' });
+    /**
+     * Animation rendering type for the attached spinner indicator.
+     * @default 'circular'
+     */
+    type = input('circular', { ...(ngDevMode ? { debugName: "type" } : /* istanbul ignore next */ {}), alias: 'talosSpinnerType' });
+    /**
+     * Whether to apply a frosted glassmorphic backdrop blur effect.
+     * @default true
+     */
+    blur = input(true, { ...(ngDevMode ? { debugName: "blur" } : /* istanbul ignore next */ {}), alias: 'talosSpinnerBlur',
+        transform: booleanAttribute });
+    /**
+     * Accessible description announced by assistive technologies.
+     */
+    ariaLabel = input(undefined, { ...(ngDevMode ? { debugName: "ariaLabel" } : /* istanbul ignore next */ {}), alias: 'talosSpinnerAriaLabel' });
+    constructor() {
+        effect(() => {
+            const active = this.isActive();
+            if (active) {
+                this.renderOverlay();
+            }
+            else {
+                this.removeOverlay();
+            }
+        });
+    }
+    /**
+     * Computes whether the overlay is active from either primary input or alias.
+     */
+    isActive() {
+        return this.talosSpinnerOverlay() || this.talosLoading();
+    }
+    renderOverlay() {
+        if (!this.overlayElement) {
+            this.overlayElement = this.renderer.createElement('div');
+            this.renderer.addClass(this.overlayElement, 'talos-spinner-overlay');
+            if (this.blur()) {
+                this.renderer.addClass(this.overlayElement, 'talos-spinner-overlay--blur');
+            }
+            this.renderer.setAttribute(this.overlayElement, 'role', 'status');
+            this.renderer.setAttribute(this.overlayElement, 'aria-live', 'polite');
+            const label = this.ariaLabel() || this.message() || 'Loading, please wait...';
+            this.renderer.setAttribute(this.overlayElement, 'aria-label', label);
+            // Create component instance
+            this.spinnerRef = createComponent(TalosSpinnerComponent, {
+                environmentInjector: this.envInjector
+            });
+            this.updateSpinnerInputs();
+            this.appRef.attachView(this.spinnerRef.hostView);
+            this.renderer.appendChild(this.overlayElement, this.spinnerRef.location.nativeElement);
+            this.renderer.appendChild(this.elementRef.nativeElement, this.overlayElement);
+        }
+        else {
+            if (this.blur()) {
+                this.renderer.addClass(this.overlayElement, 'talos-spinner-overlay--blur');
+            }
+            else {
+                this.renderer.removeClass(this.overlayElement, 'talos-spinner-overlay--blur');
+            }
+            this.updateSpinnerInputs();
+        }
+    }
+    updateSpinnerInputs() {
+        if (!this.spinnerRef)
+            return;
+        this.spinnerRef.setInput('variant', this.variant());
+        this.spinnerRef.setInput('size', this.size());
+        this.spinnerRef.setInput('type', this.type());
+        this.spinnerRef.setInput('label', this.message());
+        this.spinnerRef.setInput('labelPosition', 'bottom');
+        if (this.ariaLabel()) {
+            this.spinnerRef.setInput('ariaLabel', this.ariaLabel());
+        }
+        this.spinnerRef.changeDetectorRef.detectChanges();
+    }
+    removeOverlay() {
+        if (this.spinnerRef) {
+            this.appRef.detachView(this.spinnerRef.hostView);
+            this.spinnerRef.destroy();
+            this.spinnerRef = null;
+        }
+        if (this.overlayElement && this.overlayElement.parentNode) {
+            this.renderer.removeChild(this.overlayElement.parentNode, this.overlayElement);
+            this.overlayElement = null;
+        }
+    }
+    ngOnDestroy() {
+        this.removeOverlay();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSpinnerOverlayDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.1", type: TalosSpinnerOverlayDirective, isStandalone: true, selector: "[talosSpinnerOverlay], [talosLoading]", inputs: { talosSpinnerOverlay: { classPropertyName: "talosSpinnerOverlay", publicName: "talosSpinnerOverlay", isSignal: true, isRequired: false, transformFunction: null }, talosLoading: { classPropertyName: "talosLoading", publicName: "talosLoading", isSignal: true, isRequired: false, transformFunction: null }, message: { classPropertyName: "message", publicName: "talosSpinnerMessage", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "talosSpinnerVariant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "talosSpinnerSize", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "talosSpinnerType", isSignal: true, isRequired: false, transformFunction: null }, blur: { classPropertyName: "blur", publicName: "talosSpinnerBlur", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "talosSpinnerAriaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.talos-spinner-overlay-host--active": "isActive()", "class.talos-spinner-overlay-host--blur": "isActive() && blur()", "attr.aria-busy": "isActive() ? \"true\" : null" }, classAttribute: "talos-spinner-overlay-host" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSpinnerOverlayDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[talosSpinnerOverlay], [talosLoading]',
+                    host: {
+                        'class': 'talos-spinner-overlay-host',
+                        '[class.talos-spinner-overlay-host--active]': 'isActive()',
+                        '[class.talos-spinner-overlay-host--blur]': 'isActive() && blur()',
+                        '[attr.aria-busy]': 'isActive() ? "true" : null'
+                    }
+                }]
+        }], ctorParameters: () => [], propDecorators: { talosSpinnerOverlay: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosSpinnerOverlay", required: false }] }], talosLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosLoading", required: false }] }], message: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosSpinnerMessage", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosSpinnerVariant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosSpinnerSize", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosSpinnerType", required: false }] }], blur: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosSpinnerBlur", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosSpinnerAriaLabel", required: false }] }] } });
+
+const SPINNER_DECLARATIONS = [
+    TalosSpinnerComponent,
+    TalosGlobalSpinnerComponent,
+    TalosSpinnerLabelDirective,
+    TalosSpinnerOverlayDirective
+];
+class TalosSpinnerModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSpinnerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.1", ngImport: i0, type: TalosSpinnerModule, imports: [TalosSpinnerComponent,
+            TalosGlobalSpinnerComponent,
+            TalosSpinnerLabelDirective,
+            TalosSpinnerOverlayDirective], exports: [TalosSpinnerComponent,
+            TalosGlobalSpinnerComponent,
+            TalosSpinnerLabelDirective,
+            TalosSpinnerOverlayDirective] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSpinnerModule });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSpinnerModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [...SPINNER_DECLARATIONS],
+                    exports: [...SPINNER_DECLARATIONS]
+                }]
+        }] });
+
+class TalosTooltipComponent {
+    text = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosTooltipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: TalosTooltipComponent, isStandalone: true, selector: "talos-tooltip-content", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "tooltip" }, classAttribute: "talos-tooltip-panel" }, ngImport: i0, template: `<div class="talos-tooltip-inner">{{ text() }}</div>`, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosTooltipComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'talos-tooltip-content',
+                    template: `<div class="talos-tooltip-inner">{{ text() }}</div>`,
+                    host: {
+                        'class': 'talos-tooltip-panel',
+                        'role': 'tooltip'
+                    }
+                }]
+        }], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }] } });
+class TalosTooltipDirective {
+    elementRef = inject(ElementRef);
+    overlay = inject(Overlay);
+    destroyRef = inject(DestroyRef);
+    injector = inject(Injector);
+    focusMonitor = inject(FocusMonitor);
+    tooltip = input('', { ...(ngDevMode ? { debugName: "tooltip" } : /* istanbul ignore next */ {}), alias: 'talosTooltip' });
+    tooltipContent = input('', { ...(ngDevMode ? { debugName: "tooltipContent" } : /* istanbul ignore next */ {}), alias: 'tooltip' });
+    position = input('top', { ...(ngDevMode ? { debugName: "position" } : /* istanbul ignore next */ {}), alias: 'tooltipPosition' });
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), alias: 'tooltipDisabled' });
+    overlayRef = null;
+    ngOnInit() {
+        this.focusMonitor.monitor(this.elementRef).subscribe((origin) => {
+            if (origin === 'keyboard') {
+                this.show();
+            }
+            else if (!origin) {
+                this.hide();
+            }
+        });
+        this.destroyRef.onDestroy(() => {
+            this.focusMonitor.stopMonitoring(this.elementRef);
+            this.hide();
+        });
+    }
+    get tooltipText() {
+        return this.tooltip() || this.tooltipContent() || '';
+    }
+    show() {
+        if (this.disabled() || !this.tooltipText || this.overlayRef?.hasAttached()) {
+            return;
+        }
+        const positionStrategy = this.createPositionStrategy();
+        this.overlayRef = this.overlay.create({
+            positionStrategy,
+            scrollStrategy: this.overlay.scrollStrategies.reposition(),
+            hasBackdrop: false
+        });
+        const portal = new ComponentPortal(TalosTooltipComponent, null, this.injector);
+        const componentRef = this.overlayRef.attach(portal);
+        componentRef.setInput('text', this.tooltipText);
+    }
+    hide() {
+        if (this.overlayRef) {
+            this.overlayRef.dispose();
+            this.overlayRef = null;
+        }
+    }
+    createPositionStrategy() {
+        const pos = this.position();
+        const strategy = this.overlay
+            .position()
+            .flexibleConnectedTo(this.elementRef)
+            .withFlexibleDimensions(false)
+            .withPush(false);
+        const positions = {
+            top: {
+                originX: 'center',
+                originY: 'top',
+                overlayX: 'center',
+                overlayY: 'bottom',
+                offsetY: -8
+            },
+            bottom: {
+                originX: 'center',
+                originY: 'bottom',
+                overlayX: 'center',
+                overlayY: 'top',
+                offsetY: 8
+            },
+            left: {
+                originX: 'start',
+                originY: 'center',
+                overlayX: 'end',
+                overlayY: 'center',
+                offsetX: -8
+            },
+            right: {
+                originX: 'end',
+                originY: 'center',
+                overlayX: 'start',
+                overlayY: 'center',
+                offsetX: 8
+            }
+        };
+        if (pos === 'top') {
+            strategy.withPositions([positions.top, positions.bottom, positions.left, positions.right]);
+        }
+        else if (pos === 'bottom') {
+            strategy.withPositions([positions.bottom, positions.top, positions.left, positions.right]);
+        }
+        else if (pos === 'left') {
+            strategy.withPositions([positions.left, positions.right, positions.top, positions.bottom]);
+        }
+        else if (pos === 'right') {
+            strategy.withPositions([positions.right, positions.left, positions.top, positions.bottom]);
+        }
+        else {
+            strategy.withPositions([positions.top, positions.bottom, positions.right, positions.left]);
+        }
+        return strategy;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosTooltipDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.1", type: TalosTooltipDirective, isStandalone: true, selector: "[talosTooltip], [tooltip]", inputs: { tooltip: { classPropertyName: "tooltip", publicName: "talosTooltip", isSignal: true, isRequired: false, transformFunction: null }, tooltipContent: { classPropertyName: "tooltipContent", publicName: "tooltip", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "tooltipPosition", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "tooltipDisabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "mouseenter": "show()", "mouseleave": "hide()", "click": "hide()", "keydown.escape": "hide()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosTooltipDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[talosTooltip], [tooltip]',
+                    host: {
+                        '(mouseenter)': 'show()',
+                        '(mouseleave)': 'hide()',
+                        '(click)': 'hide()',
+                        '(keydown.escape)': 'hide()'
+                    }
+                }]
+        }], propDecorators: { tooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosTooltip", required: false }] }], tooltipContent: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltip", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltipPosition", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltipDisabled", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SPINNER_SIZE_MAP, SPINNER_STROKE_MAP, TALOS_DIALOG_CONFIG, TALOS_DIALOG_DATA, TALOS_DIALOG_REF, TalosAlertActionsDirective, TalosAlertComponent, TalosAlertContainerComponent, TalosAlertDescriptionDirective, TalosAlertIconDirective, TalosAlertModule, TalosAlertService, TalosAlertTitleDirective, TalosConfirmDialogComponent, TalosDialogCloseDirective, TalosDialogContentComponent, TalosDialogDescriptionDirective, TalosDialogFooterComponent, TalosDialogHeaderComponent, TalosDialogModule, TalosDialogRef, TalosDialogService, TalosDialogTitleDirective, TalosGlobalSpinnerComponent, TalosProgressBarComponent, TalosProgressBarModule, TalosProgressHintDirective, TalosProgressLabelDirective, TalosProgressValueDirective, TalosSkeletonComponent, TalosSkeletonDirective, TalosSkeletonModule, TalosSnackbarComponent, TalosSnackbarContainerComponent, TalosSnackbarModule, TalosSnackbarService, TalosSpinnerComponent, TalosSpinnerLabelDirective, TalosSpinnerModule, TalosSpinnerOverlayDirective, TalosSpinnerService, TalosTooltipComponent, TalosTooltipDirective, calculatePercentage, clampProgress, resolveCssDimension, resolveNumericSize, resolveProgressDimension, resolveSpinnerDimension };
+//# sourceMappingURL=weeehaoooz-talos-ui-feedback.mjs.map