platform-core-ng 21.1.0 → 21.1.2-rc.0

package/fesm2022/platform-core-ng.mjs

@@ -1,13 +1,13 @@
-import { from, timeout, materialize, delay, dematerialize, tap, catchError, finalize, throwError, fromEvent, Subject } from 'rxjs';
+import { from, timeout, materialize, delay, dematerialize, tap, catchError, finalize, throwError, fromEvent, Subject, ReplaySubject } from 'rxjs';
 import * as i0 from '@angular/core';
-import { InjectionToken, inject, signal, computed, Directive, Injectable, ErrorHandler, makeEnvironmentProviders, ElementRef, Renderer2, input, effect, ChangeDetectionStrategy, Component, output, Input, booleanAttribute, viewChild, TemplateRef, DestroyRef, contentChildren, EnvironmentInjector, NgZone, viewChildren, afterRenderEffect, forwardRef, model, ViewEncapsulation, ChangeDetectorRef, NgModule, contentChild, ContentChild, EventEmitter, ViewChild, Output, Injector, Pipe } from '@angular/core';
+import { InjectionToken, inject, Injectable, DestroyRef, makeEnvironmentProviders, ENVIRONMENT_INITIALIZER, signal, computed, Directive, ErrorHandler, ElementRef, Renderer2, input, booleanAttribute, effect, ChangeDetectionStrategy, Component, output, Input, viewChild, TemplateRef, contentChildren, EnvironmentInjector, NgZone, viewChildren, afterRenderEffect, forwardRef, model, ViewEncapsulation, ChangeDetectorRef, NgModule, contentChild, ContentChild, PLATFORM_ID, EventEmitter, ViewChild, Output, Injector, Pipe } from '@angular/core';
 import { Router, RouterOutlet, RouterLink, RouterLinkActive } from '@angular/router';
 import { __decorate } from 'tslib';
 import { PaginationResponse, PageRequestDTO, WithSelected, BusinessException, HttpCustomException, HttpStatusException, getHttpStatusMessage } from 'platform-core-ts';
-import { HttpContextToken, HttpContext, HttpResponse, HttpErrorResponse } from '@angular/common/http';
-import { DOCUMENT, NgTemplateOutlet, NgOptimizedImage, NgComponentOutlet } from '@angular/common';
+import { HttpContextToken, HttpContext, HttpResponse, HttpErrorResponse, provideHttpClient, withInterceptors, withRequestsMadeViaParent } from '@angular/common/http';
+import { DOCUMENT, NgTemplateOutlet, NgOptimizedImage, isPlatformBrowser, NgComponentOutlet } from '@angular/common';
 import * as i1 from 'lucide-angular';
-import { SearchIcon, XIcon, EllipsisIcon, CheckIcon, MinimizeIcon, MaximizeIcon, BellIcon, MonitorCogIcon, GlobeIcon, LucideAngularModule, Settings2Icon, BlocksIcon, KeyRoundIcon, ShieldIcon, UsersIcon, GaugeIcon, CalendarDaysIcon, UserRoundIcon, PlusIcon, ChevronLeftIcon, ChevronRightIcon, ChevronDownIcon, SignalHighIcon, WifiHighIcon, BatteryFullIcon, EyeIcon, EyeOffIcon, LanguagesIcon, EllipsisVerticalIcon, CircleXIcon, SquareArrowOutUpRightIcon, FileIcon, ImageIcon, Trash2Icon, PencilIcon, RotateCcwIcon, UploadCloudIcon, CircleCheckIcon, InfoIcon, CircleHelpIcon, TriangleAlertIcon } from 'lucide-angular';
+import { SearchIcon, XIcon, EllipsisIcon, CheckIcon, MinimizeIcon, MaximizeIcon, BellIcon, MonitorCogIcon, GlobeIcon, LucideAngularModule, Settings2Icon, BlocksIcon, KeyRoundIcon, ShieldIcon, UsersIcon, GaugeIcon, CalendarDaysIcon, UserRoundIcon, PlusIcon, ChevronLeftIcon, ChevronRightIcon, ImageIcon, RotateCcwIcon, RotateCwIcon, MinusIcon, ChevronDownIcon, SignalHighIcon, WifiHighIcon, BatteryFullIcon, EyeIcon, EyeOffIcon, LanguagesIcon, EllipsisVerticalIcon, CircleXIcon, SquareArrowOutUpRightIcon, FileIcon, Trash2Icon, PencilIcon, UploadCloudIcon, CircleCheckIcon, InfoIcon, CircleHelpIcon, TriangleAlertIcon } from 'lucide-angular';
 import * as i1$1 from '@angular/forms';
 import { FormsModule, NG_VALUE_ACCESSOR, FormControl, ReactiveFormsModule } from '@angular/forms';
 import * as i1$2 from '@angular/cdk/overlay';
@@ -17,6 +17,7 @@ import { Listbox, Option } from '@angular/aria/listbox';
 import { Combobox, ComboboxPopupContainer, ComboboxInput } from '@angular/aria/combobox';
 import { MenuItem, Menu, MenuContent } from '@angular/aria/menu';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { EditorComponent, TINYMCE_SCRIPT_SRC } from '@tinymce/tinymce-angular';
 
 /**
  * @description 用于在 Electron 环境中发送IPC请求
@@ -106,6 +107,231 @@ const coreGuestOnlyGuard = (route) => {
     return router.createUrlTree([redirect]);
 };
 
+const HOSTED_AUTH_MESSAGE_CHANNEL = 'platform:auth';
+const HOSTED_AUTH_MESSAGE_VERSION = 1;
+const HOSTED_AUTH_WINDOW_EVENT_NAMES = {
+    AUTH_EXPIRED: 'platform:auth:expired',
+    LOGOUT_REQUEST: 'platform:auth:logout-request',
+};
+const DEFAULT_HOSTED_AUTH_EVENT_LISTENER_CONFIG = {
+    acceptedSources: [],
+    acceptAnySource: false,
+    acceptedOrigins: [],
+    acceptAnyOrigin: false,
+    acceptedMessageSources: [],
+    acceptAnyMessageSource: false,
+    requireSameOrigin: true,
+};
+const HOSTED_AUTH_EVENT_HANDLER = new InjectionToken('HOSTED_AUTH_EVENT_HANDLER', {
+    factory: () => null,
+});
+const HOSTED_AUTH_EVENT_LISTENER_CONFIG = new InjectionToken('HOSTED_AUTH_EVENT_LISTENER_CONFIG', {
+    factory: () => DEFAULT_HOSTED_AUTH_EVENT_LISTENER_CONFIG,
+});
+class HostedAuthTrustedMessageSourceRegistry {
+    sources = new Set();
+    register(source) {
+        if (!source) {
+            return () => undefined;
+        }
+        this.sources.add(source);
+        return () => {
+            this.sources.delete(source);
+        };
+    }
+    has(source) {
+        return !!source && this.sources.has(source);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: HostedAuthTrustedMessageSourceRegistry, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: HostedAuthTrustedMessageSourceRegistry, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: HostedAuthTrustedMessageSourceRegistry, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+class HostedAuthBridgeService {
+    emitAuthExpired(source, error, config = {}) {
+        this.emit('AUTH_EXPIRED', {
+            source,
+            status: error?.status,
+            url: error?.url ?? null,
+        }, config);
+    }
+    emitLogoutRequest(source, config = {}) {
+        this.emit('LOGOUT_REQUEST', { source }, config);
+    }
+    emit(type, detail, config = {}) {
+        if (typeof window === 'undefined') {
+            return;
+        }
+        window.dispatchEvent(new CustomEvent(HOSTED_AUTH_WINDOW_EVENT_NAMES[type], { detail }));
+        if (window.parent && window.parent !== window) {
+            window.parent.postMessage(createHostedAuthMessage(type, detail), config.targetOrigin ?? window.location.origin);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: HostedAuthBridgeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: HostedAuthBridgeService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: HostedAuthBridgeService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+class HostedAuthEventListenerService {
+    config = inject(HOSTED_AUTH_EVENT_LISTENER_CONFIG);
+    destroyRef = inject(DestroyRef);
+    handler = inject(HOSTED_AUTH_EVENT_HANDLER);
+    trustedMessageSources = inject(HostedAuthTrustedMessageSourceRegistry);
+    started = false;
+    start() {
+        if (this.started || typeof window === 'undefined') {
+            return;
+        }
+        this.started = true;
+        for (const eventName of Object.values(HOSTED_AUTH_WINDOW_EVENT_NAMES)) {
+            window.addEventListener(eventName, this.handleWindowAuthEvent);
+        }
+        window.addEventListener('message', this.handlePostMessage);
+        this.destroyRef.onDestroy(() => this.stop());
+    }
+    stop() {
+        if (!this.started || typeof window === 'undefined') {
+            return;
+        }
+        this.started = false;
+        for (const eventName of Object.values(HOSTED_AUTH_WINDOW_EVENT_NAMES)) {
+            window.removeEventListener(eventName, this.handleWindowAuthEvent);
+        }
+        window.removeEventListener('message', this.handlePostMessage);
+    }
+    handleWindowAuthEvent = (event) => {
+        const type = getHostedAuthEventTypeFromWindowEventName(event.type);
+        if (!(event instanceof CustomEvent) || !type) {
+            return;
+        }
+        this.handleAuthEvent(type, event.detail);
+    };
+    handlePostMessage = (event) => {
+        if (!this.isAcceptedOrigin(event.origin) || !this.isAcceptedMessageSource(event.source)) {
+            return;
+        }
+        if (!isHostedAuthMessage(event.data)) {
+            return;
+        }
+        this.handleAuthEvent(event.data.type, event.data.detail);
+    };
+    handleAuthEvent(type, detail) {
+        if (!isHostedAuthEventPayload(detail) || !this.isAcceptedSource(detail.source)) {
+            return;
+        }
+        void this.handler?.({
+            type,
+            detail,
+        });
+    }
+    isAcceptedSource(source) {
+        return this.config.acceptAnySource || this.config.acceptedSources.includes(source);
+    }
+    isAcceptedOrigin(origin) {
+        if (this.config.acceptAnyOrigin || (this.config.acceptedOrigins ?? []).includes(origin)) {
+            return true;
+        }
+        return (this.config.requireSameOrigin &&
+            typeof window !== 'undefined' &&
+            origin === window.location.origin);
+    }
+    isAcceptedMessageSource(source) {
+        if (this.config.acceptAnyMessageSource) {
+            return true;
+        }
+        if (source && (this.config.acceptedMessageSources ?? []).includes(source)) {
+            return true;
+        }
+        if (this.trustedMessageSources.has(source)) {
+            return true;
+        }
+        return typeof window !== 'undefined' && (source === window || source === window.parent);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: HostedAuthEventListenerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: HostedAuthEventListenerService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: HostedAuthEventListenerService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+function provideHostedAuthEventHandler(handlerFactory, config = {}) {
+    return makeEnvironmentProviders([
+        {
+            provide: HOSTED_AUTH_EVENT_HANDLER,
+            useFactory: handlerFactory,
+        },
+        {
+            provide: HOSTED_AUTH_EVENT_LISTENER_CONFIG,
+            useValue: normalizeHostedAuthEventListenerConfig(config),
+        },
+        {
+            provide: ENVIRONMENT_INITIALIZER,
+            multi: true,
+            useValue: () => inject(HostedAuthEventListenerService).start(),
+        },
+    ]);
+}
+function normalizeHostedAuthEventListenerConfig(config) {
+    return {
+        acceptedSources: config.acceptedSources ?? DEFAULT_HOSTED_AUTH_EVENT_LISTENER_CONFIG.acceptedSources,
+        acceptAnySource: config.acceptAnySource ?? DEFAULT_HOSTED_AUTH_EVENT_LISTENER_CONFIG.acceptAnySource,
+        acceptedOrigins: config.acceptedOrigins ?? DEFAULT_HOSTED_AUTH_EVENT_LISTENER_CONFIG.acceptedOrigins,
+        acceptAnyOrigin: config.acceptAnyOrigin ?? DEFAULT_HOSTED_AUTH_EVENT_LISTENER_CONFIG.acceptAnyOrigin,
+        acceptedMessageSources: config.acceptedMessageSources ??
+            DEFAULT_HOSTED_AUTH_EVENT_LISTENER_CONFIG.acceptedMessageSources,
+        acceptAnyMessageSource: config.acceptAnyMessageSource ??
+            DEFAULT_HOSTED_AUTH_EVENT_LISTENER_CONFIG.acceptAnyMessageSource,
+        requireSameOrigin: config.requireSameOrigin ?? DEFAULT_HOSTED_AUTH_EVENT_LISTENER_CONFIG.requireSameOrigin,
+    };
+}
+function createHostedAuthMessage(type, detail) {
+    return {
+        channel: HOSTED_AUTH_MESSAGE_CHANNEL,
+        version: HOSTED_AUTH_MESSAGE_VERSION,
+        type,
+        detail,
+    };
+}
+function getHostedAuthEventTypeFromWindowEventName(eventName) {
+    switch (eventName) {
+        case HOSTED_AUTH_WINDOW_EVENT_NAMES.AUTH_EXPIRED:
+            return 'AUTH_EXPIRED';
+        case HOSTED_AUTH_WINDOW_EVENT_NAMES.LOGOUT_REQUEST:
+            return 'LOGOUT_REQUEST';
+        default:
+            return null;
+    }
+}
+function isHostedAuthEventType(value) {
+    return value === 'AUTH_EXPIRED' || value === 'LOGOUT_REQUEST';
+}
+function isHostedAuthMessage(value) {
+    return (typeof value === 'object' &&
+        value !== null &&
+        value.channel === HOSTED_AUTH_MESSAGE_CHANNEL &&
+        value.version === HOSTED_AUTH_MESSAGE_VERSION &&
+        isHostedAuthEventType(value.type) &&
+        isHostedAuthEventPayload(value.detail));
+}
+function isHostedAuthEventPayload(value) {
+    return (typeof value === 'object' &&
+        value !== null &&
+        typeof value.source === 'string' &&
+        value.source.trim().length > 0 &&
+        isOptionalNumber(value.status) &&
+        isOptionalNullableString(value.url));
+}
+function isOptionalNumber(value) {
+    return value === undefined || (typeof value === 'number' && Number.isFinite(value));
+}
+function isOptionalNullableString(value) {
+    return value === undefined || value === null || typeof value === 'string';
+}
+
 /**
  * 加载状态存储
  * @author Chen Yu
@@ -625,7 +851,7 @@ function catchErrorResponse(httpRequest, error, unauthorizedHandler, config) {
         return throwError(() => new BusinessException(httpErrorResponse.error?.message));
     }
     if (httpErrorResponse.status === 401) {
-        unauthorizedHandler?.();
+        unauthorizedHandler?.(httpErrorResponse);
     }
     logHttpError(errorDetails, config);
     return throwError(() => new HttpCustomException(httpErrorResponse.status, message, httpRequest.method, httpRequest.url, errorDetails.requestHeaders, errorDetails.requestBody, errorDetails.responseBody));
@@ -808,6 +1034,63 @@ const APP_RUNTIME_CONTEXT = new InjectionToken('APP_RUNTIME_CONTEXT', {
     factory: () => DEFAULT_APP_RUNTIME_CONTEXT,
 });
 
+const HOSTED_WORKSPACE_VIEWPORTS = new InjectionToken('HOSTED_WORKSPACE_VIEWPORTS', { factory: () => [] });
+function createAppRuntimeProviders(options) {
+    const hostedWorkspaceViewports = toHostedWorkspaceViewports(options.hostedWorkspaceViewport);
+    const provideApp = (config) => makeEnvironmentProviders([
+        {
+            provide: options.runtimeConfigToken,
+            useValue: normalizeRuntimeConfig(config, options.hostedRouteBasePath),
+        },
+    ]);
+    return {
+        provideApp,
+        provideStandaloneApp: (appOptions = {}) => {
+            const { httpInterceptors = [], ...runtimeOptions } = appOptions;
+            return makeEnvironmentProviders([
+                provideHttpClient(withInterceptors([...httpInterceptors, requestInterceptor, responseInterceptor])),
+                provideApp({ ...runtimeOptions, runtime: 'standalone' }),
+            ]);
+        },
+        provideHostedApp: (appOptions = {}) => {
+            const { httpInterceptors = [], ...runtimeOptions } = appOptions;
+            return makeEnvironmentProviders([
+                provideApp({ ...runtimeOptions, runtime: 'hosted' }),
+                provideHostedHttp(httpInterceptors),
+                ...hostedWorkspaceViewports.map((viewport) => ({
+                    provide: HOSTED_WORKSPACE_VIEWPORTS,
+                    multi: true,
+                    useValue: viewport,
+                })),
+            ]);
+        },
+        provideHostedHttp,
+    };
+    function provideHostedHttp(interceptors = []) {
+        return makeEnvironmentProviders([
+            provideHttpClient(withInterceptors([...interceptors]), withRequestsMadeViaParent()),
+        ]);
+    }
+}
+function toHostedWorkspaceViewports(viewport) {
+    if (!viewport) {
+        return [];
+    }
+    return isHostedWorkspaceViewportArray(viewport) ? viewport : [viewport];
+}
+function isHostedWorkspaceViewportArray(value) {
+    return Array.isArray(value);
+}
+function normalizeRuntimeConfig(config, hostedRouteBasePath) {
+    return {
+        runtime: config.runtime,
+        routeBasePath: normalizeRouteBasePath(config.routeBasePath ?? (config.runtime === 'hosted' ? hostedRouteBasePath : '')),
+    };
+}
+function normalizeRouteBasePath(value) {
+    return value.replace(/\/+$/, '');
+}
+
 function provideRuntimeContext(context) {
     return makeEnvironmentProviders([
         {
@@ -900,32 +1183,190 @@ class HasPermissionDirective {
     elementRef = inject((ElementRef));
     renderer = inject(Renderer2);
     permissionService = inject(PermissionService);
+    destroyRef = inject(DestroyRef);
+    permissionDisabled = false;
+    hadAriaDisabledBeforePermission = false;
+    ariaDisabledBeforePermission = null;
+    hadDisabledAttributeBeforePermission = false;
+    disabledAttributeBeforePermission = null;
+    disabledPropertyBeforePermission = null;
     hasPermission = input(undefined, ...(ngDevMode ? [{ debugName: "hasPermission" }] : /* istanbul ignore next */ []));
     vHasPermission = input(undefined, { ...(ngDevMode ? { debugName: "vHasPermission" } : /* istanbul ignore next */ {}), alias: 'vHasPermission' });
     vHasPermissionKebab = input(undefined, { ...(ngDevMode ? { debugName: "vHasPermissionKebab" } : /* istanbul ignore next */ {}), alias: 'v-has-permission' });
+    hasPermissionMode = input('hide', ...(ngDevMode ? [{ debugName: "hasPermissionMode" }] : /* istanbul ignore next */ []));
+    hasPermissionDisabled = input(false, { ...(ngDevMode ? { debugName: "hasPermissionDisabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     constructor() {
+        const removeClickListener = this.renderer.listen(this.elementRef.nativeElement, 'click', (event) => this.preventInteraction(event), { capture: true });
+        const removeKeydownListener = this.renderer.listen(this.elementRef.nativeElement, 'keydown', (event) => this.preventKeyboardInteraction(event), { capture: true });
+        this.destroyRef.onDestroy(() => {
+            removeClickListener();
+            removeKeydownListener();
+        });
         effect(() => {
             const required = this.hasPermission() ?? this.vHasPermission() ?? this.vHasPermissionKebab();
-            const visible = this.permissionService.hasPermission(required);
-            if (visible) {
-                this.renderer.removeStyle(this.elementRef.nativeElement, 'display');
-                this.renderer.removeAttribute(this.elementRef.nativeElement, 'aria-hidden');
+            const permitted = this.permissionService.hasPermission(required);
+            if (permitted) {
+                this.showElement();
+            }
+            else if (this.deniedMode() === 'disable') {
+                this.disableElement();
             }
             else {
-                this.renderer.setStyle(this.elementRef.nativeElement, 'display', 'none');
-                this.renderer.setAttribute(this.elementRef.nativeElement, 'aria-hidden', 'true');
+                this.hideElement();
             }
         });
     }
+    deniedMode() {
+        return this.hasPermissionDisabled() ? 'disable' : this.hasPermissionMode();
+    }
+    showElement() {
+        const element = this.elementRef.nativeElement;
+        this.renderer.removeStyle(element, 'display');
+        this.renderer.removeAttribute(element, 'aria-hidden');
+        this.clearDisabledState();
+    }
+    hideElement() {
+        const element = this.elementRef.nativeElement;
+        this.clearDisabledState();
+        this.renderer.setStyle(element, 'display', 'none');
+        this.renderer.setAttribute(element, 'aria-hidden', 'true');
+    }
+    disableElement() {
+        const element = this.elementRef.nativeElement;
+        if (!this.permissionDisabled) {
+            this.rememberDisabledState(element);
+        }
+        this.permissionDisabled = true;
+        this.renderer.removeStyle(element, 'display');
+        this.renderer.removeAttribute(element, 'aria-hidden');
+        this.renderer.setAttribute(element, 'aria-disabled', 'true');
+        this.renderer.setAttribute(element, 'disabled', '');
+        this.renderer.setProperty(element, 'disabled', true);
+    }
+    clearDisabledState() {
+        const element = this.elementRef.nativeElement;
+        if (!this.permissionDisabled) {
+            return;
+        }
+        if (this.hadAriaDisabledBeforePermission) {
+            this.renderer.setAttribute(element, 'aria-disabled', this.ariaDisabledBeforePermission ?? '');
+        }
+        else {
+            this.renderer.removeAttribute(element, 'aria-disabled');
+        }
+        if (this.hadDisabledAttributeBeforePermission) {
+            this.renderer.setAttribute(element, 'disabled', this.disabledAttributeBeforePermission ?? '');
+        }
+        else {
+            this.renderer.removeAttribute(element, 'disabled');
+        }
+        if (this.disabledPropertyBeforePermission !== null) {
+            this.renderer.setProperty(element, 'disabled', this.disabledPropertyBeforePermission);
+        }
+        this.permissionDisabled = false;
+        this.disabledPropertyBeforePermission = null;
+    }
+    rememberDisabledState(element) {
+        this.hadAriaDisabledBeforePermission = element.hasAttribute('aria-disabled');
+        this.ariaDisabledBeforePermission = element.getAttribute('aria-disabled');
+        this.hadDisabledAttributeBeforePermission = element.hasAttribute('disabled');
+        this.disabledAttributeBeforePermission = element.getAttribute('disabled');
+        this.disabledPropertyBeforePermission = this.readDisabledProperty(element);
+    }
+    readDisabledProperty(element) {
+        const value = element.disabled;
+        return typeof value === 'boolean' ? value : null;
+    }
+    preventKeyboardInteraction(event) {
+        if (event.key === 'Enter' || event.key === ' ') {
+            this.preventInteraction(event);
+        }
+    }
+    preventInteraction(event) {
+        if (!this.permissionDisabled) {
+            return;
+        }
+        event.preventDefault();
+        event.stopImmediatePropagation();
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: HasPermissionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.8", type: HasPermissionDirective, isStandalone: true, selector: "[hasPermission],[vHasPermission],[v-has-permission]", inputs: { hasPermission: { classPropertyName: "hasPermission", publicName: "hasPermission", isSignal: true, isRequired: false, transformFunction: null }, vHasPermission: { classPropertyName: "vHasPermission", publicName: "vHasPermission", isSignal: true, isRequired: false, transformFunction: null }, vHasPermissionKebab: { classPropertyName: "vHasPermissionKebab", publicName: "v-has-permission", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.8", type: HasPermissionDirective, isStandalone: true, selector: "[hasPermission],[vHasPermission],[v-has-permission]", inputs: { hasPermission: { classPropertyName: "hasPermission", publicName: "hasPermission", isSignal: true, isRequired: false, transformFunction: null }, vHasPermission: { classPropertyName: "vHasPermission", publicName: "vHasPermission", isSignal: true, isRequired: false, transformFunction: null }, vHasPermissionKebab: { classPropertyName: "vHasPermissionKebab", publicName: "v-has-permission", isSignal: true, isRequired: false, transformFunction: null }, hasPermissionMode: { classPropertyName: "hasPermissionMode", publicName: "hasPermissionMode", isSignal: true, isRequired: false, transformFunction: null }, hasPermissionDisabled: { classPropertyName: "hasPermissionDisabled", publicName: "hasPermissionDisabled", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: HasPermissionDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hasPermission],[vHasPermission],[v-has-permission]',
                 }]
-        }], ctorParameters: () => [], propDecorators: { hasPermission: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasPermission", required: false }] }], vHasPermission: [{ type: i0.Input, args: [{ isSignal: true, alias: "vHasPermission", required: false }] }], vHasPermissionKebab: [{ type: i0.Input, args: [{ isSignal: true, alias: "v-has-permission", required: false }] }] } });
+        }], ctorParameters: () => [], propDecorators: { hasPermission: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasPermission", required: false }] }], vHasPermission: [{ type: i0.Input, args: [{ isSignal: true, alias: "vHasPermission", required: false }] }], vHasPermissionKebab: [{ type: i0.Input, args: [{ isSignal: true, alias: "v-has-permission", required: false }] }], hasPermissionMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasPermissionMode", required: false }] }], hasPermissionDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasPermissionDisabled", required: false }] }] } });
+
+const PLATFORM_SCROLLBAR_STYLE_ELEMENT_ID = 'platform-core-ng-scrollbar';
+const PLATFORM_SCROLLBAR_VARIABLES = [
+    { name: '--platform-scrollbar-size', fallback: '0.375rem' },
+    { name: '--platform-scrollbar-track', fallback: 'transparent' },
+    { name: '--platform-scrollbar-thumb', fallback: 'rgba(102, 120, 138, 0.42)' },
+    { name: '--platform-scrollbar-thumb-hover', fallback: 'rgba(102, 120, 138, 0.58)' },
+];
+function syncPlatformScrollbarStylesToIframe(iframe, options = {}) {
+    try {
+        syncPlatformScrollbarStyles(iframe?.contentDocument, options);
+    }
+    catch {
+        // Cross-origin frames cannot be styled from the host. In those cases the
+        // embedded application must load platform scrollbar styles itself.
+    }
+}
+function syncPlatformScrollbarStyles(targetDocument, options = {}) {
+    if (!targetDocument?.head) {
+        return;
+    }
+    const style = getOrCreateStyleElement(targetDocument, options.styleElementId ?? PLATFORM_SCROLLBAR_STYLE_ELEMENT_ID);
+    style.textContent = createPlatformScrollbarStyles(options.sourceElement);
+}
+function getOrCreateStyleElement(targetDocument, id) {
+    const existingStyle = targetDocument.getElementById(id);
+    if (existingStyle?.tagName.toLowerCase() === 'style') {
+        return existingStyle;
+    }
+    const style = targetDocument.createElement('style');
+    style.id = id;
+    targetDocument.head.append(style);
+    return style;
+}
+function createPlatformScrollbarStyles(sourceElement) {
+    const sourceWindow = sourceElement?.ownerDocument.defaultView;
+    const sourceStyle = sourceElement && sourceWindow ? sourceWindow.getComputedStyle(sourceElement) : null;
+    const variableDeclarations = PLATFORM_SCROLLBAR_VARIABLES
+        .map(({ name, fallback }) => `${name}: ${sourceStyle?.getPropertyValue(name).trim() || fallback};`)
+        .join('\n');
+    return `
+:root {
+${variableDeclarations}
+}
+
+* {
+  scrollbar-color: var(--platform-scrollbar-thumb) var(--platform-scrollbar-track);
+  scrollbar-width: thin;
+}
+
+*::-webkit-scrollbar {
+  width: var(--platform-scrollbar-size);
+  height: var(--platform-scrollbar-size);
+}
+
+*::-webkit-scrollbar-track {
+  background: var(--platform-scrollbar-track);
+}
+
+*::-webkit-scrollbar-thumb {
+  border-radius: 999px;
+  background: var(--platform-scrollbar-thumb);
+}
+
+*::-webkit-scrollbar-thumb:hover {
+  background: var(--platform-scrollbar-thumb-hover);
+}
+`.trim();
+}
 
 /**
  * Shell配置相关的类型定义和工具函数
@@ -2273,6 +2714,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
             args: [{ selector: 's-base-list', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<nav class=\"nav\">\r\n  <ng-content select=\"[list-actions]\"></ng-content>\r\n</nav>\r\n\r\n<main class=\"content\">\r\n  <ng-content select=\"[list-table]\"></ng-content>\r\n</main>\r\n\r\n<footer>\r\n  <ng-content select=\"[list-pagination]\"></ng-content>\r\n</footer>\r\n", styles: [":host{display:block;background-color:var(--color-surface);padding:var(--space-4);height:calc(100% - 2 * var(--space-4));min-width:0}.content{display:block;max-width:100%;min-width:0;overflow-x:auto}.nav{border-color:var(--color-border);padding:var(--space-2) 0;display:flex;flex-direction:column}footer{width:100%;max-width:100%;min-width:0}@media(max-width:768px){:host{display:block;min-width:0;background:none;padding:0}.nav{padding-left:0;padding-right:0}}\n"] }]
         }] });
 
+class OverlayHostRegistry {
+    hosts = new Map();
+    register(name, element) {
+        this.hosts.set(name, element);
+    }
+    unregister(name, element) {
+        if (element && this.hosts.get(name) !== element) {
+            return;
+        }
+        this.hosts.delete(name);
+    }
+    get(name) {
+        return this.hosts.get(name);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: OverlayHostRegistry, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: OverlayHostRegistry, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: OverlayHostRegistry, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
 const PLATFORM_OVERLAY_VIEW_CONTAINER_REF = new InjectionToken('PLATFORM_OVERLAY_VIEW_CONTAINER_REF', {
     providedIn: 'root',
     factory: () => null,
@@ -2280,6 +2745,7 @@ const PLATFORM_OVERLAY_VIEW_CONTAINER_REF = new InjectionToken('PLATFORM_OVERLAY
 class PlatformOverlayPortalHost {
     document = inject(DOCUMENT);
     overlay = inject(Overlay);
+    hostRegistry = inject(OverlayHostRegistry);
     defaultViewContainerRef = inject(PLATFORM_OVERLAY_VIEW_CONTAINER_REF);
     attachComponent(component, options = {}) {
         if (!this.document.body) {
@@ -2290,6 +2756,12 @@ class PlatformOverlayPortalHost {
             scrollStrategy: this.overlay.scrollStrategies.noop(),
             ...options.config,
         });
+        const container = this.resolveContainer(options);
+        if (container) {
+            container.appendChild(overlayRef.hostElement);
+            this.applyHostedOverlayPosition(overlayRef);
+        }
+        this.applyOverlayMetadata(overlayRef, options);
         const componentRef = overlayRef.attach(new ComponentPortal(component, options.viewContainerRef ?? this.defaultViewContainerRef, options.injector ?? null));
         return {
             overlayRef,
@@ -2297,6 +2769,44 @@ class PlatformOverlayPortalHost {
             dispose: () => overlayRef.dispose(),
         };
     }
+    resolveContainer(options) {
+        if (options.container) {
+            return options.container;
+        }
+        if (options.host) {
+            return this.hostRegistry.get(options.host) ?? this.document.body;
+        }
+        return null;
+    }
+    applyHostedOverlayPosition(overlayRef) {
+        const hostElement = overlayRef.hostElement;
+        this.disableTopLayerPopover(hostElement);
+        hostElement.classList.add('platform-overlay-hosted');
+        hostElement.style.position = 'absolute';
+        hostElement.style.inset = '0';
+        hostElement.style.width = '100%';
+        hostElement.style.height = '100%';
+    }
+    disableTopLayerPopover(hostElement) {
+        const popoverElement = hostElement;
+        try {
+            popoverElement.hidePopover?.();
+        }
+        catch {
+            // Hosted overlays are intentionally contained in their app host.
+        }
+        hostElement.removeAttribute('popover');
+    }
+    applyOverlayMetadata(overlayRef, options) {
+        if (options.scope) {
+            overlayRef.hostElement.dataset['overlayScope'] = options.scope;
+            overlayRef.overlayElement.dataset['overlayScope'] = options.scope;
+        }
+        if (options.owner) {
+            overlayRef.hostElement.dataset['overlayOwner'] = options.owner;
+            overlayRef.overlayElement.dataset['overlayOwner'] = options.owner;
+        }
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PlatformOverlayPortalHost, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PlatformOverlayPortalHost, providedIn: 'root' });
 }
@@ -2379,7 +2889,7 @@ class BsMessageContainer {
         this.action.emit({ itemId, actionId });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: BsMessageContainer, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: BsMessageContainer, isStandalone: true, selector: "s-message-container", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { close: "close", detail: "detail", action: "action" }, host: { attributes: { "aria-live": "polite", "aria-relevant": "additions removals" }, classAttribute: "bs-message-host" }, ngImport: i0, template: "@for (item of viewItems(); track item.id) {\r\n  <div\r\n    class=\"bs-message\"\r\n    role=\"status\"\r\n    [class.bs-message--solid]=\"item.variant === 'solid'\"\r\n    [class.bs-message--has-actions]=\"item.actions.length > 0\"\r\n    [class.bs-message--info]=\"item.type === 'info' || item.type === 'help' || item.type === 'loading'\"\r\n    [class.bs-message--success]=\"item.type === 'success'\"\r\n    [class.bs-message--warning]=\"item.type === 'warning'\"\r\n    [class.bs-message--error]=\"item.type === 'error'\"\r\n  >\r\n    @if (item.showIcon) {\r\n      <span class=\"bs-message__icon\" [class]=\"'bs-message__icon ' + iconClass(item.type)\" aria-hidden=\"true\">\r\n        @switch (item.type) {\r\n          @case ('success') {\r\n            <svg viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"currentColor\"></circle>\r\n              <path stroke=\"#fff\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.6\" d=\"M4.4 8.2 6.7 10.5 11.8 5.5\"></path>\r\n            </svg>\r\n          }\r\n          @case ('warning') {\r\n            <svg viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <path fill=\"currentColor\" d=\"M7.13 2.05a1 1 0 0 1 1.74 0l6.05 10.5A1 1 0 0 1 14.05 14H1.95a1 1 0 0 1-.87-1.5l6.05-10.45Z\"></path>\r\n              <path stroke=\"#fff\" stroke-linecap=\"round\" stroke-width=\"1.4\" d=\"M8 5.55v4\"></path>\r\n              <circle cx=\"8\" cy=\"11.8\" r=\".75\" fill=\"#fff\"></circle>\r\n            </svg>\r\n          }\r\n          @case ('error') {\r\n            <svg viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"currentColor\"></circle>\r\n              <path stroke=\"#fff\" stroke-linecap=\"round\" stroke-width=\"1.6\" d=\"m5.5 5.5 5 5M10.5 5.5l-5 5\"></path>\r\n            </svg>\r\n          }\r\n          @case ('loading') {\r\n            <span class=\"bs-message__icon-dot\"></span>\r\n          }\r\n          @default {\r\n            <svg viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"currentColor\"></circle>\r\n              <path stroke=\"#fff\" stroke-linecap=\"round\" stroke-width=\"1.4\" d=\"M8 7.1v4\"></path>\r\n              <circle cx=\"8\" cy=\"4.8\" r=\".75\" fill=\"#fff\"></circle>\r\n            </svg>\r\n          }\r\n        }\r\n      </span>\r\n    }\r\n\r\n    <div class=\"bs-message__body\">\r\n      <div class=\"bs-message__headline\">\r\n        <div class=\"bs-message__title-wrap\">\r\n          <div class=\"bs-message__title\">{{ item.title }}</div>\r\n\r\n          @if (item.repeatCount > 1) {\r\n            <span class=\"bs-message__repeat\" aria-label=\"Repeated {{ item.repeatCount }} times\">\r\n              * {{ item.repeatCount }}\r\n            </span>\r\n          }\r\n        </div>\r\n\r\n        @if (item.detailText && !item.description) {\r\n          <button\r\n            type=\"button\"\r\n            class=\"bs-message__detail\"\r\n            (click)=\"onDetail(item.id)\"\r\n          >\r\n            {{ item.detailText }}\r\n          </button>\r\n        }\r\n      </div>\r\n\r\n      @if (item.description) {\r\n        <div class=\"bs-message__description\">\r\n          <span class=\"bs-message__description-text\">{{ item.description }}</span>\r\n\r\n          @if (item.detailText) {\r\n            <button\r\n              type=\"button\"\r\n              class=\"bs-message__detail\"\r\n              (click)=\"onDetail(item.id)\"\r\n            >\r\n              {{ item.detailText }}\r\n            </button>\r\n          }\r\n        </div>\r\n      }\r\n\r\n    </div>\r\n\r\n    @if (item.actions.length) {\r\n      <div class=\"bs-message__actions\">\r\n        @for (action of item.actions; track action.id) {\r\n          <button\r\n            type=\"button\"\r\n            class=\"bs-message__action\"\r\n            [class.bs-message__action--primary]=\"action.tone === 'primary'\"\r\n            (click)=\"onAction(item.id, action.id)\"\r\n          >\r\n            {{ action.label }}\r\n          </button>\r\n        }\r\n      </div>\r\n    }\r\n\r\n    @if (item.closable) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"bs-message__close\"\r\n        aria-label=\"Close\"\r\n        (click)=\"close.emit(item.id)\"\r\n      >\r\n        <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" aria-hidden=\"true\">\r\n          <path stroke-linecap=\"round\" d=\"m4 4 8 8M12 4 4 12\"></path>\r\n        </svg>\r\n      </button>\r\n    }\r\n  </div>\r\n}\r\n", styles: [":host{position:fixed;top:16px;left:50%;z-index:1000;display:flex;flex-direction:column;gap:8px;width:min(640px,100vw - 32px);transform:translate(-50%);pointer-events:none}.bs-message{--bs-message-bg: color-mix(in srgb, var(--color-info) 10%, #fff);--bs-message-border: color-mix(in srgb, var(--color-info) 28%, #fff);--bs-message-accent: var(--color-info);--bs-message-text: var(--color-text-primary);--bs-message-muted: var(--color-text-secondary);box-sizing:border-box;width:100%;padding:15px 16px;border:1px solid var(--bs-message-border);border-radius:8px;background:var(--bs-message-bg);color:var(--bs-message-text);display:flex;align-items:flex-start;gap:12px;font-size:14px;line-height:20px;pointer-events:auto}.bs-message--solid{--bs-message-bg: var(--bs-message-accent);--bs-message-border: var(--bs-message-accent);--bs-message-text: #fff;--bs-message-muted: rgba(255, 255, 255, .84)}.bs-message--success{--bs-message-bg: color-mix(in srgb, var(--color-success) 10%, #fff);--bs-message-border: color-mix(in srgb, var(--color-success) 28%, #fff);--bs-message-accent: var(--color-success)}.bs-message--warning{--bs-message-bg: color-mix(in srgb, var(--color-warning) 12%, #fff);--bs-message-border: color-mix(in srgb, var(--color-warning) 30%, #fff);--bs-message-accent: var(--color-warning)}.bs-message--error{--bs-message-bg: color-mix(in srgb, var(--color-error) 10%, #fff);--bs-message-border: color-mix(in srgb, var(--color-error) 28%, #fff);--bs-message-accent: var(--color-error)}.bs-message__icon{width:16px;height:16px;margin-top:2px;color:var(--bs-message-accent);display:inline-flex;flex:0 0 auto}.bs-message__icon svg{width:16px;height:16px}.bs-message__icon-dot{width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:999px;animation:bs-message-spin .8s linear infinite}.bs-message__body,.bs-message__title-wrap,.bs-message__headline{min-width:0}.bs-message__body{flex:1 1 auto}.bs-message__headline,.bs-message__title-wrap{display:flex;align-items:center}.bs-message__headline{gap:12px}.bs-message__title-wrap{gap:4px}.bs-message__title{min-width:0;font-weight:var(--font-weight-semibold);word-break:break-word}.bs-message__repeat,.bs-message__description,.bs-message__action,.bs-message__close{color:var(--bs-message-muted)}.bs-message__repeat{flex:0 0 auto;white-space:nowrap}.bs-message__description{margin-top:4px}.bs-message__description-text{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:break-word}:is(.bs-message__detail,.bs-message__action,.bs-message__close){padding:0;border:0;background:transparent;font:inherit;font-weight:var(--font-weight-semibold);cursor:pointer}.bs-message__detail,.bs-message__action--primary{color:var(--bs-message-accent)}.bs-message__description .bs-message__detail{margin-left:8px}.bs-message__actions{margin-left:16px;display:flex;align-items:center;justify-content:flex-end;gap:16px;align-self:center;flex:0 0 auto;max-width:44%}.bs-message__action{height:24px;white-space:nowrap}.bs-message__action:hover{color:var(--bs-message-text)}.bs-message__close{width:20px;height:20px;margin-left:4px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}.bs-message__close svg{width:16px;height:16px}.bs-message__close:hover{background:color-mix(in srgb,var(--bs-message-text) 6%,transparent);color:var(--bs-message-text)}:is(.bs-message__detail,.bs-message__action,.bs-message__close):focus-visible{outline:2px solid color-mix(in srgb,var(--bs-message-accent) 42%,transparent);outline-offset:2px}@media(max-width:520px){.bs-message{gap:8px;padding-right:12px;padding-left:12px}.bs-message--has-actions{flex-wrap:wrap}.bs-message--has-actions .bs-message__close{margin-left:auto;order:2}.bs-message--has-actions .bs-message__actions{order:3;width:100%;max-width:none;margin-left:28px;justify-content:flex-start}}@keyframes bs-message-spin{to{transform:rotate(360deg)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: BsMessageContainer, isStandalone: true, selector: "s-message-container", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { close: "close", detail: "detail", action: "action" }, host: { attributes: { "aria-live": "polite", "aria-relevant": "additions removals" }, classAttribute: "bs-message-host" }, ngImport: i0, template: "@for (item of viewItems(); track item.id) {\r\n  <div\r\n    class=\"bs-message\"\r\n    role=\"status\"\r\n    [class.bs-message--solid]=\"item.variant === 'solid'\"\r\n    [class.bs-message--has-actions]=\"item.actions.length > 0\"\r\n    [class.bs-message--info]=\"item.type === 'info' || item.type === 'help' || item.type === 'loading'\"\r\n    [class.bs-message--success]=\"item.type === 'success'\"\r\n    [class.bs-message--warning]=\"item.type === 'warning'\"\r\n    [class.bs-message--error]=\"item.type === 'error'\"\r\n  >\r\n    @if (item.showIcon) {\r\n      <span class=\"bs-message__icon\" [class]=\"'bs-message__icon ' + iconClass(item.type)\" aria-hidden=\"true\">\r\n        @switch (item.type) {\r\n          @case ('success') {\r\n            <svg viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"currentColor\"></circle>\r\n              <path stroke=\"#fff\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.6\" d=\"M4.4 8.2 6.7 10.5 11.8 5.5\"></path>\r\n            </svg>\r\n          }\r\n          @case ('warning') {\r\n            <svg viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <path fill=\"currentColor\" d=\"M7.13 2.05a1 1 0 0 1 1.74 0l6.05 10.5A1 1 0 0 1 14.05 14H1.95a1 1 0 0 1-.87-1.5l6.05-10.45Z\"></path>\r\n              <path stroke=\"#fff\" stroke-linecap=\"round\" stroke-width=\"1.4\" d=\"M8 5.55v4\"></path>\r\n              <circle cx=\"8\" cy=\"11.8\" r=\".75\" fill=\"#fff\"></circle>\r\n            </svg>\r\n          }\r\n          @case ('error') {\r\n            <svg viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"currentColor\"></circle>\r\n              <path stroke=\"#fff\" stroke-linecap=\"round\" stroke-width=\"1.6\" d=\"m5.5 5.5 5 5M10.5 5.5l-5 5\"></path>\r\n            </svg>\r\n          }\r\n          @case ('loading') {\r\n            <span class=\"bs-message__icon-dot\"></span>\r\n          }\r\n          @default {\r\n            <svg viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"currentColor\"></circle>\r\n              <path stroke=\"#fff\" stroke-linecap=\"round\" stroke-width=\"1.4\" d=\"M8 7.1v4\"></path>\r\n              <circle cx=\"8\" cy=\"4.8\" r=\".75\" fill=\"#fff\"></circle>\r\n            </svg>\r\n          }\r\n        }\r\n      </span>\r\n    }\r\n\r\n    <div class=\"bs-message__body\">\r\n      <div class=\"bs-message__headline\">\r\n        <div class=\"bs-message__title-wrap\">\r\n          <div class=\"bs-message__title\">{{ item.title }}</div>\r\n\r\n          @if (item.repeatCount > 1) {\r\n            <span class=\"bs-message__repeat\" aria-label=\"Repeated {{ item.repeatCount }} times\">\r\n              * {{ item.repeatCount }}\r\n            </span>\r\n          }\r\n        </div>\r\n\r\n        @if (item.detailText && !item.description) {\r\n          <button\r\n            type=\"button\"\r\n            class=\"bs-message__detail\"\r\n            (click)=\"onDetail(item.id)\"\r\n          >\r\n            {{ item.detailText }}\r\n          </button>\r\n        }\r\n      </div>\r\n\r\n      @if (item.description) {\r\n        <div class=\"bs-message__description\">\r\n          <span class=\"bs-message__description-text\">{{ item.description }}</span>\r\n\r\n          @if (item.detailText) {\r\n            <button\r\n              type=\"button\"\r\n              class=\"bs-message__detail\"\r\n              (click)=\"onDetail(item.id)\"\r\n            >\r\n              {{ item.detailText }}\r\n            </button>\r\n          }\r\n        </div>\r\n      }\r\n\r\n    </div>\r\n\r\n    @if (item.actions.length) {\r\n      <div class=\"bs-message__actions\">\r\n        @for (action of item.actions; track action.id) {\r\n          <button\r\n            type=\"button\"\r\n            class=\"bs-message__action\"\r\n            [class.bs-message__action--primary]=\"action.tone === 'primary'\"\r\n            (click)=\"onAction(item.id, action.id)\"\r\n          >\r\n            {{ action.label }}\r\n          </button>\r\n        }\r\n      </div>\r\n    }\r\n\r\n    @if (item.closable) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"bs-message__close\"\r\n        aria-label=\"Close\"\r\n        (click)=\"close.emit(item.id)\"\r\n      >\r\n        <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" aria-hidden=\"true\">\r\n          <path stroke-linecap=\"round\" d=\"m4 4 8 8M12 4 4 12\"></path>\r\n        </svg>\r\n      </button>\r\n    }\r\n  </div>\r\n}\r\n", styles: [":host{position:fixed;top:16px;left:50%;z-index:2000;display:flex;flex-direction:column;gap:8px;width:min(640px,100vw - 32px);transform:translate(-50%);pointer-events:none}.bs-message{--bs-message-bg: color-mix(in srgb, var(--color-info) 10%, #fff);--bs-message-border: color-mix(in srgb, var(--color-info) 28%, #fff);--bs-message-accent: var(--color-info);--bs-message-text: var(--color-text-primary);--bs-message-muted: var(--color-text-secondary);box-sizing:border-box;width:100%;padding:15px 16px;border:1px solid var(--bs-message-border);border-radius:8px;background:var(--bs-message-bg);color:var(--bs-message-text);display:flex;align-items:flex-start;gap:12px;font-size:14px;line-height:20px;pointer-events:auto}.bs-message--solid{--bs-message-bg: var(--bs-message-accent);--bs-message-border: var(--bs-message-accent);--bs-message-text: #fff;--bs-message-muted: rgba(255, 255, 255, .84)}.bs-message--success{--bs-message-bg: color-mix(in srgb, var(--color-success) 10%, #fff);--bs-message-border: color-mix(in srgb, var(--color-success) 28%, #fff);--bs-message-accent: var(--color-success)}.bs-message--warning{--bs-message-bg: color-mix(in srgb, var(--color-warning) 12%, #fff);--bs-message-border: color-mix(in srgb, var(--color-warning) 30%, #fff);--bs-message-accent: var(--color-warning)}.bs-message--error{--bs-message-bg: color-mix(in srgb, var(--color-error) 10%, #fff);--bs-message-border: color-mix(in srgb, var(--color-error) 28%, #fff);--bs-message-accent: var(--color-error)}.bs-message__icon{width:16px;height:16px;margin-top:2px;color:var(--bs-message-accent);display:inline-flex;flex:0 0 auto}.bs-message__icon svg{width:16px;height:16px}.bs-message__icon-dot{width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:999px;animation:bs-message-spin .8s linear infinite}.bs-message__body,.bs-message__title-wrap,.bs-message__headline{min-width:0}.bs-message__body{flex:1 1 auto}.bs-message__headline,.bs-message__title-wrap{display:flex;align-items:center}.bs-message__headline{gap:12px}.bs-message__title-wrap{gap:4px}.bs-message__title{min-width:0;font-weight:var(--font-weight-semibold);word-break:break-word}.bs-message__repeat,.bs-message__description,.bs-message__action,.bs-message__close{color:var(--bs-message-muted)}.bs-message__repeat{flex:0 0 auto;white-space:nowrap}.bs-message__description{margin-top:4px}.bs-message__description-text{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:break-word}:is(.bs-message__detail,.bs-message__action,.bs-message__close){padding:0;border:0;background:transparent;font:inherit;font-weight:var(--font-weight-semibold);cursor:pointer}.bs-message__detail,.bs-message__action--primary{color:var(--bs-message-accent)}.bs-message__description .bs-message__detail{margin-left:8px}.bs-message__actions{margin-left:16px;display:flex;align-items:center;justify-content:flex-end;gap:16px;align-self:center;flex:0 0 auto;max-width:44%}.bs-message__action{height:24px;white-space:nowrap}.bs-message__action:hover{color:var(--bs-message-text)}.bs-message__close{width:20px;height:20px;margin-left:4px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}.bs-message__close svg{width:16px;height:16px}.bs-message__close:hover{background:color-mix(in srgb,var(--bs-message-text) 6%,transparent);color:var(--bs-message-text)}:is(.bs-message__detail,.bs-message__action,.bs-message__close):focus-visible{outline:2px solid color-mix(in srgb,var(--bs-message-accent) 42%,transparent);outline-offset:2px}@media(max-width:520px){.bs-message{gap:8px;padding-right:12px;padding-left:12px}.bs-message--has-actions{flex-wrap:wrap}.bs-message--has-actions .bs-message__close{margin-left:auto;order:2}.bs-message--has-actions .bs-message__actions{order:3;width:100%;max-width:none;margin-left:28px;justify-content:flex-start}}@keyframes bs-message-spin{to{transform:rotate(360deg)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: BsMessageContainer, decorators: [{
             type: Component,
@@ -2390,7 +2900,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
                         'aria-live': 'polite',
                         // 无障碍属性：关注添加和删除的内容
                         'aria-relevant': 'additions removals',
-                    }, template: "@for (item of viewItems(); track item.id) {\r\n  <div\r\n    class=\"bs-message\"\r\n    role=\"status\"\r\n    [class.bs-message--solid]=\"item.variant === 'solid'\"\r\n    [class.bs-message--has-actions]=\"item.actions.length > 0\"\r\n    [class.bs-message--info]=\"item.type === 'info' || item.type === 'help' || item.type === 'loading'\"\r\n    [class.bs-message--success]=\"item.type === 'success'\"\r\n    [class.bs-message--warning]=\"item.type === 'warning'\"\r\n    [class.bs-message--error]=\"item.type === 'error'\"\r\n  >\r\n    @if (item.showIcon) {\r\n      <span class=\"bs-message__icon\" [class]=\"'bs-message__icon ' + iconClass(item.type)\" aria-hidden=\"true\">\r\n        @switch (item.type) {\r\n          @case ('success') {\r\n            <svg viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"currentColor\"></circle>\r\n              <path stroke=\"#fff\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.6\" d=\"M4.4 8.2 6.7 10.5 11.8 5.5\"></path>\r\n            </svg>\r\n          }\r\n          @case ('warning') {\r\n            <svg viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <path fill=\"currentColor\" d=\"M7.13 2.05a1 1 0 0 1 1.74 0l6.05 10.5A1 1 0 0 1 14.05 14H1.95a1 1 0 0 1-.87-1.5l6.05-10.45Z\"></path>\r\n              <path stroke=\"#fff\" stroke-linecap=\"round\" stroke-width=\"1.4\" d=\"M8 5.55v4\"></path>\r\n              <circle cx=\"8\" cy=\"11.8\" r=\".75\" fill=\"#fff\"></circle>\r\n            </svg>\r\n          }\r\n          @case ('error') {\r\n            <svg viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"currentColor\"></circle>\r\n              <path stroke=\"#fff\" stroke-linecap=\"round\" stroke-width=\"1.6\" d=\"m5.5 5.5 5 5M10.5 5.5l-5 5\"></path>\r\n            </svg>\r\n          }\r\n          @case ('loading') {\r\n            <span class=\"bs-message__icon-dot\"></span>\r\n          }\r\n          @default {\r\n            <svg viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"currentColor\"></circle>\r\n              <path stroke=\"#fff\" stroke-linecap=\"round\" stroke-width=\"1.4\" d=\"M8 7.1v4\"></path>\r\n              <circle cx=\"8\" cy=\"4.8\" r=\".75\" fill=\"#fff\"></circle>\r\n            </svg>\r\n          }\r\n        }\r\n      </span>\r\n    }\r\n\r\n    <div class=\"bs-message__body\">\r\n      <div class=\"bs-message__headline\">\r\n        <div class=\"bs-message__title-wrap\">\r\n          <div class=\"bs-message__title\">{{ item.title }}</div>\r\n\r\n          @if (item.repeatCount > 1) {\r\n            <span class=\"bs-message__repeat\" aria-label=\"Repeated {{ item.repeatCount }} times\">\r\n              * {{ item.repeatCount }}\r\n            </span>\r\n          }\r\n        </div>\r\n\r\n        @if (item.detailText && !item.description) {\r\n          <button\r\n            type=\"button\"\r\n            class=\"bs-message__detail\"\r\n            (click)=\"onDetail(item.id)\"\r\n          >\r\n            {{ item.detailText }}\r\n          </button>\r\n        }\r\n      </div>\r\n\r\n      @if (item.description) {\r\n        <div class=\"bs-message__description\">\r\n          <span class=\"bs-message__description-text\">{{ item.description }}</span>\r\n\r\n          @if (item.detailText) {\r\n            <button\r\n              type=\"button\"\r\n              class=\"bs-message__detail\"\r\n              (click)=\"onDetail(item.id)\"\r\n            >\r\n              {{ item.detailText }}\r\n            </button>\r\n          }\r\n        </div>\r\n      }\r\n\r\n    </div>\r\n\r\n    @if (item.actions.length) {\r\n      <div class=\"bs-message__actions\">\r\n        @for (action of item.actions; track action.id) {\r\n          <button\r\n            type=\"button\"\r\n            class=\"bs-message__action\"\r\n            [class.bs-message__action--primary]=\"action.tone === 'primary'\"\r\n            (click)=\"onAction(item.id, action.id)\"\r\n          >\r\n            {{ action.label }}\r\n          </button>\r\n        }\r\n      </div>\r\n    }\r\n\r\n    @if (item.closable) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"bs-message__close\"\r\n        aria-label=\"Close\"\r\n        (click)=\"close.emit(item.id)\"\r\n      >\r\n        <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" aria-hidden=\"true\">\r\n          <path stroke-linecap=\"round\" d=\"m4 4 8 8M12 4 4 12\"></path>\r\n        </svg>\r\n      </button>\r\n    }\r\n  </div>\r\n}\r\n", styles: [":host{position:fixed;top:16px;left:50%;z-index:1000;display:flex;flex-direction:column;gap:8px;width:min(640px,100vw - 32px);transform:translate(-50%);pointer-events:none}.bs-message{--bs-message-bg: color-mix(in srgb, var(--color-info) 10%, #fff);--bs-message-border: color-mix(in srgb, var(--color-info) 28%, #fff);--bs-message-accent: var(--color-info);--bs-message-text: var(--color-text-primary);--bs-message-muted: var(--color-text-secondary);box-sizing:border-box;width:100%;padding:15px 16px;border:1px solid var(--bs-message-border);border-radius:8px;background:var(--bs-message-bg);color:var(--bs-message-text);display:flex;align-items:flex-start;gap:12px;font-size:14px;line-height:20px;pointer-events:auto}.bs-message--solid{--bs-message-bg: var(--bs-message-accent);--bs-message-border: var(--bs-message-accent);--bs-message-text: #fff;--bs-message-muted: rgba(255, 255, 255, .84)}.bs-message--success{--bs-message-bg: color-mix(in srgb, var(--color-success) 10%, #fff);--bs-message-border: color-mix(in srgb, var(--color-success) 28%, #fff);--bs-message-accent: var(--color-success)}.bs-message--warning{--bs-message-bg: color-mix(in srgb, var(--color-warning) 12%, #fff);--bs-message-border: color-mix(in srgb, var(--color-warning) 30%, #fff);--bs-message-accent: var(--color-warning)}.bs-message--error{--bs-message-bg: color-mix(in srgb, var(--color-error) 10%, #fff);--bs-message-border: color-mix(in srgb, var(--color-error) 28%, #fff);--bs-message-accent: var(--color-error)}.bs-message__icon{width:16px;height:16px;margin-top:2px;color:var(--bs-message-accent);display:inline-flex;flex:0 0 auto}.bs-message__icon svg{width:16px;height:16px}.bs-message__icon-dot{width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:999px;animation:bs-message-spin .8s linear infinite}.bs-message__body,.bs-message__title-wrap,.bs-message__headline{min-width:0}.bs-message__body{flex:1 1 auto}.bs-message__headline,.bs-message__title-wrap{display:flex;align-items:center}.bs-message__headline{gap:12px}.bs-message__title-wrap{gap:4px}.bs-message__title{min-width:0;font-weight:var(--font-weight-semibold);word-break:break-word}.bs-message__repeat,.bs-message__description,.bs-message__action,.bs-message__close{color:var(--bs-message-muted)}.bs-message__repeat{flex:0 0 auto;white-space:nowrap}.bs-message__description{margin-top:4px}.bs-message__description-text{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:break-word}:is(.bs-message__detail,.bs-message__action,.bs-message__close){padding:0;border:0;background:transparent;font:inherit;font-weight:var(--font-weight-semibold);cursor:pointer}.bs-message__detail,.bs-message__action--primary{color:var(--bs-message-accent)}.bs-message__description .bs-message__detail{margin-left:8px}.bs-message__actions{margin-left:16px;display:flex;align-items:center;justify-content:flex-end;gap:16px;align-self:center;flex:0 0 auto;max-width:44%}.bs-message__action{height:24px;white-space:nowrap}.bs-message__action:hover{color:var(--bs-message-text)}.bs-message__close{width:20px;height:20px;margin-left:4px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}.bs-message__close svg{width:16px;height:16px}.bs-message__close:hover{background:color-mix(in srgb,var(--bs-message-text) 6%,transparent);color:var(--bs-message-text)}:is(.bs-message__detail,.bs-message__action,.bs-message__close):focus-visible{outline:2px solid color-mix(in srgb,var(--bs-message-accent) 42%,transparent);outline-offset:2px}@media(max-width:520px){.bs-message{gap:8px;padding-right:12px;padding-left:12px}.bs-message--has-actions{flex-wrap:wrap}.bs-message--has-actions .bs-message__close{margin-left:auto;order:2}.bs-message--has-actions .bs-message__actions{order:3;width:100%;max-width:none;margin-left:28px;justify-content:flex-start}}@keyframes bs-message-spin{to{transform:rotate(360deg)}}\n"] }]
+                    }, template: "@for (item of viewItems(); track item.id) {\r\n  <div\r\n    class=\"bs-message\"\r\n    role=\"status\"\r\n    [class.bs-message--solid]=\"item.variant === 'solid'\"\r\n    [class.bs-message--has-actions]=\"item.actions.length > 0\"\r\n    [class.bs-message--info]=\"item.type === 'info' || item.type === 'help' || item.type === 'loading'\"\r\n    [class.bs-message--success]=\"item.type === 'success'\"\r\n    [class.bs-message--warning]=\"item.type === 'warning'\"\r\n    [class.bs-message--error]=\"item.type === 'error'\"\r\n  >\r\n    @if (item.showIcon) {\r\n      <span class=\"bs-message__icon\" [class]=\"'bs-message__icon ' + iconClass(item.type)\" aria-hidden=\"true\">\r\n        @switch (item.type) {\r\n          @case ('success') {\r\n            <svg viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"currentColor\"></circle>\r\n              <path stroke=\"#fff\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.6\" d=\"M4.4 8.2 6.7 10.5 11.8 5.5\"></path>\r\n            </svg>\r\n          }\r\n          @case ('warning') {\r\n            <svg viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <path fill=\"currentColor\" d=\"M7.13 2.05a1 1 0 0 1 1.74 0l6.05 10.5A1 1 0 0 1 14.05 14H1.95a1 1 0 0 1-.87-1.5l6.05-10.45Z\"></path>\r\n              <path stroke=\"#fff\" stroke-linecap=\"round\" stroke-width=\"1.4\" d=\"M8 5.55v4\"></path>\r\n              <circle cx=\"8\" cy=\"11.8\" r=\".75\" fill=\"#fff\"></circle>\r\n            </svg>\r\n          }\r\n          @case ('error') {\r\n            <svg viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"currentColor\"></circle>\r\n              <path stroke=\"#fff\" stroke-linecap=\"round\" stroke-width=\"1.6\" d=\"m5.5 5.5 5 5M10.5 5.5l-5 5\"></path>\r\n            </svg>\r\n          }\r\n          @case ('loading') {\r\n            <span class=\"bs-message__icon-dot\"></span>\r\n          }\r\n          @default {\r\n            <svg viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"currentColor\"></circle>\r\n              <path stroke=\"#fff\" stroke-linecap=\"round\" stroke-width=\"1.4\" d=\"M8 7.1v4\"></path>\r\n              <circle cx=\"8\" cy=\"4.8\" r=\".75\" fill=\"#fff\"></circle>\r\n            </svg>\r\n          }\r\n        }\r\n      </span>\r\n    }\r\n\r\n    <div class=\"bs-message__body\">\r\n      <div class=\"bs-message__headline\">\r\n        <div class=\"bs-message__title-wrap\">\r\n          <div class=\"bs-message__title\">{{ item.title }}</div>\r\n\r\n          @if (item.repeatCount > 1) {\r\n            <span class=\"bs-message__repeat\" aria-label=\"Repeated {{ item.repeatCount }} times\">\r\n              * {{ item.repeatCount }}\r\n            </span>\r\n          }\r\n        </div>\r\n\r\n        @if (item.detailText && !item.description) {\r\n          <button\r\n            type=\"button\"\r\n            class=\"bs-message__detail\"\r\n            (click)=\"onDetail(item.id)\"\r\n          >\r\n            {{ item.detailText }}\r\n          </button>\r\n        }\r\n      </div>\r\n\r\n      @if (item.description) {\r\n        <div class=\"bs-message__description\">\r\n          <span class=\"bs-message__description-text\">{{ item.description }}</span>\r\n\r\n          @if (item.detailText) {\r\n            <button\r\n              type=\"button\"\r\n              class=\"bs-message__detail\"\r\n              (click)=\"onDetail(item.id)\"\r\n            >\r\n              {{ item.detailText }}\r\n            </button>\r\n          }\r\n        </div>\r\n      }\r\n\r\n    </div>\r\n\r\n    @if (item.actions.length) {\r\n      <div class=\"bs-message__actions\">\r\n        @for (action of item.actions; track action.id) {\r\n          <button\r\n            type=\"button\"\r\n            class=\"bs-message__action\"\r\n            [class.bs-message__action--primary]=\"action.tone === 'primary'\"\r\n            (click)=\"onAction(item.id, action.id)\"\r\n          >\r\n            {{ action.label }}\r\n          </button>\r\n        }\r\n      </div>\r\n    }\r\n\r\n    @if (item.closable) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"bs-message__close\"\r\n        aria-label=\"Close\"\r\n        (click)=\"close.emit(item.id)\"\r\n      >\r\n        <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" aria-hidden=\"true\">\r\n          <path stroke-linecap=\"round\" d=\"m4 4 8 8M12 4 4 12\"></path>\r\n        </svg>\r\n      </button>\r\n    }\r\n  </div>\r\n}\r\n", styles: [":host{position:fixed;top:16px;left:50%;z-index:2000;display:flex;flex-direction:column;gap:8px;width:min(640px,100vw - 32px);transform:translate(-50%);pointer-events:none}.bs-message{--bs-message-bg: color-mix(in srgb, var(--color-info) 10%, #fff);--bs-message-border: color-mix(in srgb, var(--color-info) 28%, #fff);--bs-message-accent: var(--color-info);--bs-message-text: var(--color-text-primary);--bs-message-muted: var(--color-text-secondary);box-sizing:border-box;width:100%;padding:15px 16px;border:1px solid var(--bs-message-border);border-radius:8px;background:var(--bs-message-bg);color:var(--bs-message-text);display:flex;align-items:flex-start;gap:12px;font-size:14px;line-height:20px;pointer-events:auto}.bs-message--solid{--bs-message-bg: var(--bs-message-accent);--bs-message-border: var(--bs-message-accent);--bs-message-text: #fff;--bs-message-muted: rgba(255, 255, 255, .84)}.bs-message--success{--bs-message-bg: color-mix(in srgb, var(--color-success) 10%, #fff);--bs-message-border: color-mix(in srgb, var(--color-success) 28%, #fff);--bs-message-accent: var(--color-success)}.bs-message--warning{--bs-message-bg: color-mix(in srgb, var(--color-warning) 12%, #fff);--bs-message-border: color-mix(in srgb, var(--color-warning) 30%, #fff);--bs-message-accent: var(--color-warning)}.bs-message--error{--bs-message-bg: color-mix(in srgb, var(--color-error) 10%, #fff);--bs-message-border: color-mix(in srgb, var(--color-error) 28%, #fff);--bs-message-accent: var(--color-error)}.bs-message__icon{width:16px;height:16px;margin-top:2px;color:var(--bs-message-accent);display:inline-flex;flex:0 0 auto}.bs-message__icon svg{width:16px;height:16px}.bs-message__icon-dot{width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:999px;animation:bs-message-spin .8s linear infinite}.bs-message__body,.bs-message__title-wrap,.bs-message__headline{min-width:0}.bs-message__body{flex:1 1 auto}.bs-message__headline,.bs-message__title-wrap{display:flex;align-items:center}.bs-message__headline{gap:12px}.bs-message__title-wrap{gap:4px}.bs-message__title{min-width:0;font-weight:var(--font-weight-semibold);word-break:break-word}.bs-message__repeat,.bs-message__description,.bs-message__action,.bs-message__close{color:var(--bs-message-muted)}.bs-message__repeat{flex:0 0 auto;white-space:nowrap}.bs-message__description{margin-top:4px}.bs-message__description-text{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:break-word}:is(.bs-message__detail,.bs-message__action,.bs-message__close){padding:0;border:0;background:transparent;font:inherit;font-weight:var(--font-weight-semibold);cursor:pointer}.bs-message__detail,.bs-message__action--primary{color:var(--bs-message-accent)}.bs-message__description .bs-message__detail{margin-left:8px}.bs-message__actions{margin-left:16px;display:flex;align-items:center;justify-content:flex-end;gap:16px;align-self:center;flex:0 0 auto;max-width:44%}.bs-message__action{height:24px;white-space:nowrap}.bs-message__action:hover{color:var(--bs-message-text)}.bs-message__close{width:20px;height:20px;margin-left:4px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}.bs-message__close svg{width:16px;height:16px}.bs-message__close:hover{background:color-mix(in srgb,var(--bs-message-text) 6%,transparent);color:var(--bs-message-text)}:is(.bs-message__detail,.bs-message__action,.bs-message__close):focus-visible{outline:2px solid color-mix(in srgb,var(--bs-message-accent) 42%,transparent);outline-offset:2px}@media(max-width:520px){.bs-message{gap:8px;padding-right:12px;padding-left:12px}.bs-message--has-actions{flex-wrap:wrap}.bs-message--has-actions .bs-message__close{margin-left:auto;order:2}.bs-message--has-actions .bs-message__actions{order:3;width:100%;max-width:none;margin-left:28px;justify-content:flex-start}}@keyframes bs-message-spin{to{transform:rotate(360deg)}}\n"] }]
         }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], close: [{ type: i0.Output, args: ["close"] }], detail: [{ type: i0.Output, args: ["detail"] }], action: [{ type: i0.Output, args: ["action"] }] } });
 
 function uid() {
@@ -2636,6 +3146,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
         }] });
 
 class BsSelect {
+    destroyRef = inject(DestroyRef);
+    ngZone = inject(NgZone);
     listBox = viewChild(Listbox, ...(ngDevMode ? [{ debugName: "listBox" }] : /* istanbul ignore next */ []));
     optionRefs = viewChildren(Option, ...(ngDevMode ? [{ debugName: "optionRefs" }] : /* istanbul ignore next */ []));
     combobox = viewChild(Combobox, ...(ngDevMode ? [{ debugName: "combobox" }] : /* istanbul ignore next */ []));
@@ -2686,9 +3198,15 @@ class BsSelect {
     isDisabled = computed(() => this.disabled() || this.disabledFromCva(), ...(ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []));
     selectedValues = signal([], ...(ngDevMode ? [{ debugName: "selectedValues" }] : /* istanbul ignore next */ []));
     disabledFromCva = signal(false, ...(ngDevMode ? [{ debugName: "disabledFromCva" }] : /* istanbul ignore next */ []));
+    pendingSingleValues = null;
+    pendingSingleTimer = null;
+    activeOverlay = null;
+    scrollListenerCleanup = null;
+    repositionFrame = null;
     onChange = () => { };
     onTouched = () => { };
     constructor() {
+        this.destroyRef.onDestroy(() => this.teardownOverlayScrollListener());
         afterRenderEffect(() => {
             const option = this.optionRefs().find((opt) => opt.active());
             setTimeout(() => option?.element.scrollIntoView({ block: 'nearest' }), 50);
@@ -2700,6 +3218,28 @@ class BsSelect {
         });
     }
     onListboxValueChange(values) {
+        if (this.multiple()) {
+            this.commitValues(values);
+            return;
+        }
+        if (!values.length && this.selectedValues().length) {
+            return;
+        }
+        this.pendingSingleValues = values;
+        if (this.pendingSingleTimer) {
+            return;
+        }
+        this.pendingSingleTimer = setTimeout(() => {
+            const nextValues = this.pendingSingleValues ?? [];
+            this.pendingSingleValues = null;
+            this.pendingSingleTimer = null;
+            this.commitValues(nextValues);
+        });
+    }
+    commitValues(values) {
+        if (this.areSameValues(this.selectedValues(), values)) {
+            return;
+        }
         this.selectedValues.set(values);
         this.onChange(this.multiple() ? values : (values[0] ?? null));
         this.onTouched();
@@ -2707,6 +3247,15 @@ class BsSelect {
             this.scheduleClose();
         }
     }
+    onOverlayAttached(overlay) {
+        this.activeOverlay = overlay;
+        this.installOverlayScrollListener();
+        this.queueOverlayReposition();
+    }
+    onOverlayDetached() {
+        this.activeOverlay = null;
+        this.teardownOverlayScrollListener();
+    }
     onOptionClick(option) {
         if (option.disabled) {
             return;
@@ -2735,6 +3284,17 @@ class BsSelect {
         this.onChange(nextValues);
         this.onTouched();
     }
+    clearSelectedValue(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        if (this.isDisabled() || !this.hasValue()) {
+            return;
+        }
+        this.selectedValues.set([]);
+        this.onChange(null);
+        this.onTouched();
+        this.combobox()?.close();
+    }
     writeValue(value) {
         if (this.multiple()) {
             this.selectedValues.set(Array.isArray(value) ? value : this.isEmptyValue(value) ? [] : [value]);
@@ -2754,9 +3314,53 @@ class BsSelect {
     scheduleClose() {
         setTimeout(() => this.combobox()?.close());
     }
+    installOverlayScrollListener() {
+        if (this.scrollListenerCleanup || typeof document === 'undefined') {
+            return;
+        }
+        this.ngZone.runOutsideAngular(() => {
+            const updatePosition = () => this.queueOverlayReposition();
+            const options = { capture: true, passive: true };
+            document.addEventListener('scroll', updatePosition, options);
+            window.addEventListener('resize', updatePosition, options);
+            this.scrollListenerCleanup = () => {
+                document.removeEventListener('scroll', updatePosition, options);
+                window.removeEventListener('resize', updatePosition, options);
+            };
+        });
+    }
+    teardownOverlayScrollListener() {
+        this.scrollListenerCleanup?.();
+        this.scrollListenerCleanup = null;
+        if (this.repositionFrame !== null && typeof cancelAnimationFrame !== 'undefined') {
+            cancelAnimationFrame(this.repositionFrame);
+        }
+        this.repositionFrame = null;
+    }
+    queueOverlayReposition() {
+        if (!this.activeOverlay?.open) {
+            return;
+        }
+        if (typeof requestAnimationFrame === 'undefined') {
+            this.activeOverlay.overlayRef.updatePosition();
+            return;
+        }
+        if (this.repositionFrame !== null) {
+            return;
+        }
+        this.repositionFrame = requestAnimationFrame(() => {
+            this.repositionFrame = null;
+            if (this.activeOverlay?.open) {
+                this.activeOverlay.overlayRef.updatePosition();
+            }
+        });
+    }
     isEmptyValue(value) {
         return value == null || value === '';
     }
+    areSameValues(currentValues, nextValues) {
+        return currentValues.length === nextValues.length && currentValues.every((value, index) => Object.is(value, nextValues[index]));
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: BsSelect, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: BsSelect, isStandalone: true, selector: "s-select", inputs: { labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, matchTriggerWidth: { classPropertyName: "matchTriggerWidth", publicName: "matchTriggerWidth", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
             {
@@ -2764,7 +3368,7 @@ class BsSelect {
                 useExisting: forwardRef(() => BsSelect),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "listBox", first: true, predicate: Listbox, descendants: true, isSignal: true }, { propertyName: "optionRefs", predicate: Option, descendants: true, isSignal: true }, { propertyName: "combobox", first: true, predicate: Combobox, descendants: true, isSignal: true }], ngImport: i0, template: "<div\r\n  class=\"bs-select\"\r\n  ngCombobox\r\n  readonly\r\n  [class.bs-select--selected]=\"hasValue()\"\r\n  [class.bs-select--disabled]=\"isDisabled()\"\r\n>\r\n  <div #origin class=\"bs-select__trigger\">\r\n    <span class=\"bs-select__label\">\n      @if (multiple() && selectedOptions().length) {\n        <span class=\"bs-select__tags\">\n          <button type=\"button\" class=\"bs-select__add\" (click)=\"openCombobox($event)\">\n            <lucide-icon aria-hidden=\"true\" [img]=\"plusIcon\" [size]=\"13\" [strokeWidth]=\"2\" />\n            <span>{{ placeholder() }}</span>\n          </button>\n          @for (option of visibleSelectedOptions(); track option.value) {\n            <span class=\"bs-select__tag\">\n              <span class=\"bs-select__tag-text\">{{ option.label }}</span>\n              <button\n                type=\"button\"\n                class=\"bs-select__tag-remove\"\n                [attr.aria-label]=\"'Remove ' + option.label\"\n                (click)=\"removeSelectedValue(option.value, $event)\"\n              >\n                <lucide-icon aria-hidden=\"true\" [img]=\"closeIcon\" [size]=\"12\" [strokeWidth]=\"2\" />\n              </button>\n            </span>\n          }\n          @if (hiddenSelectedCount()) {\n            <span class=\"bs-select__tag bs-select__tag--ellipsis\" aria-hidden=\"true\">...</span>\n          }\n        </span>\n      } @else {\n        <span class=\"bs-select__label-text\">{{ displayValue() }}</span>\n      }\n    </span>\n    <input\r\n      [attr.aria-label]=\"ariaLabel()\"\r\n      [placeholder]=\"placeholder()\"\r\n      [disabled]=\"isDisabled()\"\r\n      ngComboboxInput\r\n    />\r\n    <span class=\"bs-select__arrow\" aria-hidden=\"true\"></span>\r\n  </div>\r\n  <ng-template ngComboboxPopupContainer>\r\n    <ng-template\r\n      [cdkConnectedOverlay]=\"{ origin, usePopover: 'inline', matchWidth: matchTriggerWidth() }\"\r\n      [cdkConnectedOverlayOpen]=\"combobox()?.expanded() ?? false\"\r\n      cdkAttachPopoverAsChild\r\n    >\r\n      <div class=\"bs-select__popup\">\r\n        <div\r\n          ngListbox\n          [values]=\"selectedValues()\"\n          (valuesChange)=\"onListboxValueChange($event)\"\n          [multi]=\"multiple()\"\n          [disabled]=\"isDisabled()\"\n        >\n          @for (option of normalizedOptions(); track option.value) {\r\n            <div\r\n              ngOption\r\n              [value]=\"option.value\"\r\n              [label]=\"option.label\"\r\n              [disabled]=\"option.disabled ?? false\"\r\n              (click)=\"onOptionClick(option)\"\r\n            >\r\n              <span class=\"bs-select__option-text\">{{ option.label }}</span>\r\n              <span class=\"bs-select__check\" aria-hidden=\"true\"></span>\r\n            </div>\r\n          }\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n  </ng-template>\r\n</div>\r\n", styles: [":host{display:inline-block;width:var(--bs-select-width, var(--platform-control-width, 10rem));min-width:var(--bs-select-min-width, var(--platform-control-width, 10rem));max-width:100%;--bs-select-height: var(--platform-control-height, 2rem);--bs-select-radius: var(--platform-control-radius, var(--radius-common-m));--bs-select-padding-x: var(--platform-control-padding-x, .625rem);--bs-select-indicator-offset: var(--platform-control-padding-x, .625rem);--bs-select-font-size: var(--platform-control-font-size, 13px);--bs-select-line-height: var(--platform-control-line-height, 20px);--bs-select-trigger-width: 100%;--bs-select-trigger-min-width: 0;--bs-select-popup-min-width: 100%}.bs-select{display:block}.bs-select.bs-select--disabled{pointer-events:none}.bs-select__trigger{position:relative;display:flex;align-items:center;box-sizing:border-box;width:var(--bs-select-trigger-width);min-width:var(--bs-select-trigger-min-width);height:var(--bs-select-height);min-height:var(--bs-select-height);color:var(--platform-control-placeholder, var(--color-text-placeholder));background-color:var(--platform-control-bg, var(--color-surface));border:1px solid var(--platform-control-border, var(--color-border));border-radius:var(--bs-select-radius);transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease}.bs-select__trigger:hover{background-color:var(--platform-control-bg-hover, var(--color-surface-soft))}.bs-select:focus-within .bs-select__trigger{border-color:var(--platform-control-focus, var(--color-primary));box-shadow:0 0 0 2px var(--platform-control-focus-ring, var(--color-primary-subtle))}.bs-select.bs-select--disabled .bs-select__trigger,.bs-select:has([ngComboboxInput][aria-disabled=true]) .bs-select__trigger{opacity:.6;cursor:default;background-color:var(--platform-control-bg-hover, var(--color-surface-soft))}[ngComboboxInput]{position:relative;z-index:0;width:100%;min-width:0;height:var(--bs-select-height);padding:0 calc(var(--bs-select-indicator-offset) + 1.75rem) 0 var(--bs-select-padding-x);border:0;outline:none;opacity:0;cursor:pointer;background:transparent}.bs-select__label{position:absolute;z-index:1;inset:0;display:flex;align-items:center;padding:0 calc(var(--bs-select-indicator-offset) + 1.75rem) 0 var(--bs-select-padding-x);pointer-events:none}.bs-select__tags{display:flex;align-items:center;gap:4px;min-width:0;width:100%;overflow:hidden;pointer-events:auto}.bs-select__add,.bs-select__tag{display:inline-flex;align-items:center;flex:0 0 auto;min-width:0;max-width:8rem;height:calc(var(--bs-select-height) - 10px);min-height:20px;padding:0 8px;border:1px solid var(--color-border);border-radius:calc(var(--bs-select-radius) - 2px);background-color:var(--color-surface-soft);color:var(--platform-control-color, var(--color-text-primary));font-size:var(--bs-select-font-size);font-family:inherit;line-height:1;white-space:nowrap}.bs-select__add{max-width:6rem;color:var(--color-primary);background-color:var(--color-surface);gap:3px;cursor:pointer}.bs-select__tag-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bs-select__tag--ellipsis{flex:0 0 auto;width:28px;justify-content:center;padding:0;color:var(--color-text-muted)}.bs-select__tag-remove{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:14px;height:14px;margin-left:4px;padding:0;color:var(--color-text-muted);background:transparent;border:0;cursor:pointer;line-height:1;pointer-events:auto}.bs-select__tag-remove:hover{color:var(--color-text-primary)}.bs-select__label-text{overflow:hidden;color:var(--platform-control-placeholder, var(--color-text-placeholder));font-size:var(--bs-select-font-size);line-height:var(--bs-select-line-height);text-overflow:ellipsis;white-space:nowrap}.bs-select.bs-select--selected .bs-select__label-text{color:var(--platform-control-color, var(--color-text-primary))}.bs-select__arrow{position:absolute;z-index:2;right:var(--bs-select-indicator-offset);width:0;height:0;pointer-events:none;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid var(--platform-control-placeholder, var(--color-text-placeholder));transition:transform .15s ease-in-out}[ngComboboxInput][aria-expanded=true]~.bs-select__arrow{transform:rotate(180deg)}.bs-select__popup{width:100%;min-width:var(--bs-select-popup-min-width);margin-top:var(--space-2);padding:var(--space-2);border:1px solid var(--color-border);border-radius:var(--bs-select-radius);background-color:var(--color-surface);box-shadow:var(--shadow-common-m);max-height:11rem;overflow:hidden}[ngListbox]{display:flex;flex-direction:column;gap:2px;height:100%;overflow:auto}[ngOption]{display:flex;align-items:center;min-height:var(--bs-select-height);margin:1px;padding:0 var(--space-2);border-radius:var(--bs-select-radius);cursor:pointer;transition:background-color .15s ease,color .15s ease,outline-color .15s ease}[ngOption]:hover{background-color:var(--color-surface-soft)}[ngOption][data-active=true]{outline:2px solid var(--color-primary);outline-offset:-2px}[ngOption][aria-selected=true]{color:var(--color-primary);background-color:var(--color-primary-subtle)}[ngOption][aria-disabled=true]{opacity:.5;cursor:default}.bs-select__option-text{flex:1;min-width:0;font-size:var(--bs-select-font-size);line-height:var(--bs-select-line-height)}[ngOption]:not([aria-selected=true]) .bs-select__check{display:none}.bs-select__check{position:relative;width:1rem;height:1rem;display:inline-block;flex:0 0 1rem;align-self:center;color:var(--color-primary);line-height:0;vertical-align:middle}.bs-select__check:before{position:absolute;top:50%;left:50%;content:\"\";width:6px;height:10px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translate(-50%,-73%) rotate(45deg);transform-origin:center}\n"], dependencies: [{ kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$2.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: Option, selector: "[ngOption]", inputs: ["id", "value", "disabled", "label"], exportAs: ["ngOption"] }, { kind: "directive", type: ComboboxPopupContainer, selector: "ng-template[ngComboboxPopupContainer]", exportAs: ["ngComboboxPopupContainer"] }, { kind: "directive", type: Combobox, selector: "[ngCombobox]", inputs: ["filterMode", "disabled", "readonly", "firstMatch", "alwaysExpanded"], exportAs: ["ngCombobox"] }, { kind: "directive", type: ComboboxInput, selector: "input[ngComboboxInput]", inputs: ["value"], outputs: ["valueChange"], exportAs: ["ngComboboxInput"] }, { kind: "directive", type: Listbox, selector: "[ngListbox]", inputs: ["id", "orientation", "multi", "wrap", "softDisabled", "focusMode", "selectionMode", "typeaheadDelay", "disabled", "readonly", "values"], outputs: ["valuesChange"], exportAs: ["ngListbox"] }, { kind: "ngmodule", type: LucideAngularModule }, { kind: "component", type: i1.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        ], viewQueries: [{ propertyName: "listBox", first: true, predicate: Listbox, descendants: true, isSignal: true }, { propertyName: "optionRefs", predicate: Option, descendants: true, isSignal: true }, { propertyName: "combobox", first: true, predicate: Combobox, descendants: true, isSignal: true }], ngImport: i0, template: "<div\r\n  class=\"bs-select\"\r\n  ngCombobox\r\n  readonly\r\n  [class.bs-select--selected]=\"hasValue()\"\r\n  [class.bs-select--disabled]=\"isDisabled()\"\r\n>\r\n  <div #origin class=\"bs-select__trigger\">\r\n    <span class=\"bs-select__label\">\r\n      @if (multiple() && selectedOptions().length) {\r\n        <span class=\"bs-select__tags\">\r\n          <button type=\"button\" class=\"bs-select__add\" (click)=\"openCombobox($event)\">\r\n            <lucide-icon aria-hidden=\"true\" [img]=\"plusIcon\" [size]=\"13\" [strokeWidth]=\"2\" />\r\n            <span>{{ placeholder() }}</span>\r\n          </button>\r\n          @for (option of visibleSelectedOptions(); track option.value) {\r\n            <span class=\"bs-select__tag\">\r\n              <span class=\"bs-select__tag-text\">{{ option.label }}</span>\r\n              <button\r\n                type=\"button\"\r\n                class=\"bs-select__tag-remove\"\r\n                [attr.aria-label]=\"'Remove ' + option.label\"\r\n                (click)=\"removeSelectedValue(option.value, $event)\"\r\n              >\r\n                <lucide-icon aria-hidden=\"true\" [img]=\"closeIcon\" [size]=\"12\" [strokeWidth]=\"2\" />\r\n              </button>\r\n            </span>\r\n          }\r\n          @if (hiddenSelectedCount()) {\r\n            <span class=\"bs-select__tag bs-select__tag--ellipsis\" aria-hidden=\"true\">...</span>\r\n          }\r\n        </span>\r\n      } @else {\r\n        <span class=\"bs-select__label-text\">{{ displayValue() }}</span>\r\n      }\r\n    </span>\r\n    <input\r\n      [attr.aria-label]=\"ariaLabel()\"\r\n      [placeholder]=\"placeholder()\"\r\n      [disabled]=\"isDisabled()\"\r\n      ngComboboxInput\r\n    />\r\n    @if (!multiple() && hasValue()) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"bs-select__clear\"\r\n        aria-label=\"Clear selected option\"\r\n        (click)=\"clearSelectedValue($event)\"\r\n      >\r\n        <lucide-icon aria-hidden=\"true\" [img]=\"closeIcon\" [size]=\"13\" [strokeWidth]=\"2\" />\r\n      </button>\r\n    }\r\n    <span class=\"bs-select__arrow\" aria-hidden=\"true\"></span>\r\n  </div>\r\n  <ng-template ngComboboxPopupContainer>\r\n    <ng-template\r\n      #selectOverlay=\"cdkConnectedOverlay\"\r\n      [cdkConnectedOverlay]=\"{ origin, usePopover: 'inline', matchWidth: matchTriggerWidth() }\"\r\n      [cdkConnectedOverlayOpen]=\"combobox()?.expanded() ?? false\"\r\n      cdkAttachPopoverAsChild\r\n      (attach)=\"onOverlayAttached(selectOverlay)\"\r\n      (detach)=\"onOverlayDetached()\"\r\n    >\r\n      <div class=\"bs-select__popup\">\r\n        <div\r\n          ngListbox\r\n          [values]=\"selectedValues()\"\r\n          (valuesChange)=\"onListboxValueChange($event)\"\r\n          [multi]=\"multiple()\"\r\n          [disabled]=\"isDisabled()\"\r\n        >\r\n          @for (option of normalizedOptions(); track option.value) {\r\n            <div\r\n              ngOption\r\n              [value]=\"option.value\"\r\n              [label]=\"option.label\"\r\n              [disabled]=\"option.disabled ?? false\"\r\n              (click)=\"onOptionClick(option)\"\r\n            >\r\n              <span class=\"bs-select__option-text\">{{ option.label }}</span>\r\n              <span class=\"bs-select__check\" aria-hidden=\"true\"></span>\r\n            </div>\r\n          }\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n  </ng-template>\r\n</div>\r\n", styles: [":host{display:inline-block;width:var(--bs-select-width, var(--platform-control-width, 10rem));min-width:var(--bs-select-min-width, var(--platform-control-width, 10rem));max-width:100%;--bs-select-height: var(--platform-control-height, 2rem);--bs-select-radius: var(--platform-control-radius, var(--radius-common-m));--bs-select-padding-x: var(--platform-control-padding-x, .625rem);--bs-select-indicator-offset: var(--platform-control-padding-x, .625rem);--bs-select-font-size: var(--platform-control-font-size, 13px);--bs-select-line-height: var(--platform-control-line-height, 20px);--bs-select-trigger-width: 100%;--bs-select-trigger-min-width: 0;--bs-select-popup-min-width: 100%}.bs-select{display:block}.bs-select.bs-select--disabled{pointer-events:none}.bs-select__trigger{position:relative;display:flex;align-items:center;box-sizing:border-box;width:var(--bs-select-trigger-width);min-width:var(--bs-select-trigger-min-width);height:var(--bs-select-height);min-height:var(--bs-select-height);color:var(--platform-control-placeholder, var(--color-text-placeholder));background-color:var(--platform-control-bg, var(--color-surface));border:1px solid var(--platform-control-border, var(--color-border));border-radius:var(--bs-select-radius);transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease}.bs-select__trigger:hover{background-color:var(--platform-control-bg-hover, var(--color-surface-soft))}.bs-select:focus-within .bs-select__trigger{border-color:var(--platform-control-focus, var(--color-primary));box-shadow:0 0 0 2px var(--platform-control-focus-ring, var(--color-primary-subtle))}.bs-select.bs-select--disabled .bs-select__trigger,.bs-select:has([ngComboboxInput][aria-disabled=true]) .bs-select__trigger{opacity:.6;cursor:default;background-color:var(--platform-control-bg-hover, var(--color-surface-soft))}[ngComboboxInput]{position:relative;z-index:0;width:100%;min-width:0;height:var(--bs-select-height);padding:0 calc(var(--bs-select-indicator-offset) + 1.75rem) 0 var(--bs-select-padding-x);border:0;outline:none;opacity:0;cursor:pointer;background:transparent}.bs-select__label{position:absolute;z-index:1;inset:0;display:flex;align-items:center;padding:0 calc(var(--bs-select-indicator-offset) + 1.75rem) 0 var(--bs-select-padding-x);pointer-events:none}.bs-select__tags{display:flex;align-items:center;gap:4px;min-width:0;width:100%;overflow:hidden;pointer-events:auto}.bs-select__add,.bs-select__tag{display:inline-flex;align-items:center;flex:0 0 auto;min-width:0;max-width:8rem;height:calc(var(--bs-select-height) - 10px);min-height:20px;padding:0 8px;border:1px solid var(--color-border);border-radius:calc(var(--bs-select-radius) - 2px);background-color:var(--color-surface-soft);color:var(--platform-control-color, var(--color-text-primary));font-size:var(--bs-select-font-size);font-family:inherit;line-height:1;white-space:nowrap}.bs-select__add{max-width:6rem;color:var(--color-primary);background-color:var(--color-surface);gap:3px;cursor:pointer}.bs-select__tag-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bs-select__tag--ellipsis{flex:0 0 auto;width:28px;justify-content:center;padding:0;color:var(--color-text-muted)}.bs-select__tag-remove{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:14px;height:14px;margin-left:4px;padding:0;color:var(--color-text-muted);background:transparent;border:0;cursor:pointer;line-height:1;pointer-events:auto}.bs-select__tag-remove:hover{color:var(--color-text-primary)}.bs-select__label-text{overflow:hidden;color:var(--platform-control-placeholder, var(--color-text-placeholder));font-size:var(--bs-select-font-size);line-height:var(--bs-select-line-height);text-overflow:ellipsis;white-space:nowrap}.bs-select.bs-select--selected .bs-select__label-text{color:var(--platform-control-color, var(--color-text-primary))}.bs-select__arrow{position:absolute;z-index:2;right:var(--bs-select-indicator-offset);width:0;height:0;pointer-events:none;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid var(--platform-control-placeholder, var(--color-text-placeholder));transition:opacity .12s ease,transform .15s ease-in-out}[ngComboboxInput][aria-expanded=true]~.bs-select__arrow{transform:rotate(180deg)}.bs-select__clear{position:absolute;top:50%;right:calc(var(--bs-select-indicator-offset) - 5px);z-index:3;display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;color:var(--platform-control-placeholder, var(--color-text-placeholder));background:transparent;border:0;border-radius:50%;cursor:pointer;line-height:0;opacity:0;pointer-events:none;transform:translateY(-50%);transition:background-color .12s ease,color .12s ease,opacity .12s ease}.bs-select__clear:hover,.bs-select__clear:focus-visible{color:var(--platform-control-color, var(--color-text-primary));background-color:var(--platform-control-bg-hover, var(--color-surface-soft));opacity:1;outline:none}.bs-select.bs-select--selected:not(.bs-select--disabled) .bs-select__clear,.bs-select.bs-select--selected:not(.bs-select--disabled) .bs-select__clear:focus-visible{pointer-events:auto}.bs-select__clear:hover~.bs-select__arrow,.bs-select__clear:focus-visible~.bs-select__arrow{opacity:0}.bs-select__popup{width:100%;min-width:var(--bs-select-popup-min-width);margin-top:var(--space-2);padding:var(--space-2);border:1px solid var(--color-border);border-radius:var(--bs-select-radius);background-color:var(--color-surface);box-shadow:var(--shadow-common-m);max-height:11rem;overflow:hidden}[ngListbox]{display:flex;flex-direction:column;gap:2px;height:100%;overflow:auto}[ngOption]{display:flex;align-items:center;min-height:var(--bs-select-height);margin:1px;padding:0 var(--space-2);border-radius:var(--bs-select-radius);cursor:pointer;transition:background-color .15s ease,color .15s ease,outline-color .15s ease}[ngOption]:hover{background-color:var(--color-surface-soft)}[ngOption][data-active=true]{outline:2px solid var(--color-primary);outline-offset:-2px}[ngOption][aria-selected=true]{color:var(--color-primary);background-color:var(--color-primary-subtle)}[ngOption][aria-disabled=true]{opacity:.5;cursor:default}.bs-select__option-text{flex:1;min-width:0;font-size:var(--bs-select-font-size);line-height:var(--bs-select-line-height)}[ngOption]:not([aria-selected=true]) .bs-select__check{display:none}.bs-select__check{position:relative;width:1rem;height:1rem;display:inline-block;flex:0 0 1rem;align-self:center;color:var(--color-primary);line-height:0;vertical-align:middle}.bs-select__check:before{position:absolute;top:50%;left:50%;content:\"\";width:6px;height:10px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translate(-50%,-73%) rotate(45deg);transform-origin:center}\n"], dependencies: [{ kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$2.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: Option, selector: "[ngOption]", inputs: ["id", "value", "disabled", "label"], exportAs: ["ngOption"] }, { kind: "directive", type: ComboboxPopupContainer, selector: "ng-template[ngComboboxPopupContainer]", exportAs: ["ngComboboxPopupContainer"] }, { kind: "directive", type: Combobox, selector: "[ngCombobox]", inputs: ["filterMode", "disabled", "readonly", "firstMatch", "alwaysExpanded"], exportAs: ["ngCombobox"] }, { kind: "directive", type: ComboboxInput, selector: "input[ngComboboxInput]", inputs: ["value"], outputs: ["valueChange"], exportAs: ["ngComboboxInput"] }, { kind: "directive", type: Listbox, selector: "[ngListbox]", inputs: ["id", "orientation", "multi", "wrap", "softDisabled", "focusMode", "selectionMode", "typeaheadDelay", "disabled", "readonly", "values"], outputs: ["valuesChange"], exportAs: ["ngListbox"] }, { kind: "ngmodule", type: LucideAngularModule }, { kind: "component", type: i1.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: BsSelect, decorators: [{
             type: Component,
@@ -2782,7 +3386,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
                             useExisting: forwardRef(() => BsSelect),
                             multi: true,
                         },
-                    ], template: "<div\r\n  class=\"bs-select\"\r\n  ngCombobox\r\n  readonly\r\n  [class.bs-select--selected]=\"hasValue()\"\r\n  [class.bs-select--disabled]=\"isDisabled()\"\r\n>\r\n  <div #origin class=\"bs-select__trigger\">\r\n    <span class=\"bs-select__label\">\n      @if (multiple() && selectedOptions().length) {\n        <span class=\"bs-select__tags\">\n          <button type=\"button\" class=\"bs-select__add\" (click)=\"openCombobox($event)\">\n            <lucide-icon aria-hidden=\"true\" [img]=\"plusIcon\" [size]=\"13\" [strokeWidth]=\"2\" />\n            <span>{{ placeholder() }}</span>\n          </button>\n          @for (option of visibleSelectedOptions(); track option.value) {\n            <span class=\"bs-select__tag\">\n              <span class=\"bs-select__tag-text\">{{ option.label }}</span>\n              <button\n                type=\"button\"\n                class=\"bs-select__tag-remove\"\n                [attr.aria-label]=\"'Remove ' + option.label\"\n                (click)=\"removeSelectedValue(option.value, $event)\"\n              >\n                <lucide-icon aria-hidden=\"true\" [img]=\"closeIcon\" [size]=\"12\" [strokeWidth]=\"2\" />\n              </button>\n            </span>\n          }\n          @if (hiddenSelectedCount()) {\n            <span class=\"bs-select__tag bs-select__tag--ellipsis\" aria-hidden=\"true\">...</span>\n          }\n        </span>\n      } @else {\n        <span class=\"bs-select__label-text\">{{ displayValue() }}</span>\n      }\n    </span>\n    <input\r\n      [attr.aria-label]=\"ariaLabel()\"\r\n      [placeholder]=\"placeholder()\"\r\n      [disabled]=\"isDisabled()\"\r\n      ngComboboxInput\r\n    />\r\n    <span class=\"bs-select__arrow\" aria-hidden=\"true\"></span>\r\n  </div>\r\n  <ng-template ngComboboxPopupContainer>\r\n    <ng-template\r\n      [cdkConnectedOverlay]=\"{ origin, usePopover: 'inline', matchWidth: matchTriggerWidth() }\"\r\n      [cdkConnectedOverlayOpen]=\"combobox()?.expanded() ?? false\"\r\n      cdkAttachPopoverAsChild\r\n    >\r\n      <div class=\"bs-select__popup\">\r\n        <div\r\n          ngListbox\n          [values]=\"selectedValues()\"\n          (valuesChange)=\"onListboxValueChange($event)\"\n          [multi]=\"multiple()\"\n          [disabled]=\"isDisabled()\"\n        >\n          @for (option of normalizedOptions(); track option.value) {\r\n            <div\r\n              ngOption\r\n              [value]=\"option.value\"\r\n              [label]=\"option.label\"\r\n              [disabled]=\"option.disabled ?? false\"\r\n              (click)=\"onOptionClick(option)\"\r\n            >\r\n              <span class=\"bs-select__option-text\">{{ option.label }}</span>\r\n              <span class=\"bs-select__check\" aria-hidden=\"true\"></span>\r\n            </div>\r\n          }\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n  </ng-template>\r\n</div>\r\n", styles: [":host{display:inline-block;width:var(--bs-select-width, var(--platform-control-width, 10rem));min-width:var(--bs-select-min-width, var(--platform-control-width, 10rem));max-width:100%;--bs-select-height: var(--platform-control-height, 2rem);--bs-select-radius: var(--platform-control-radius, var(--radius-common-m));--bs-select-padding-x: var(--platform-control-padding-x, .625rem);--bs-select-indicator-offset: var(--platform-control-padding-x, .625rem);--bs-select-font-size: var(--platform-control-font-size, 13px);--bs-select-line-height: var(--platform-control-line-height, 20px);--bs-select-trigger-width: 100%;--bs-select-trigger-min-width: 0;--bs-select-popup-min-width: 100%}.bs-select{display:block}.bs-select.bs-select--disabled{pointer-events:none}.bs-select__trigger{position:relative;display:flex;align-items:center;box-sizing:border-box;width:var(--bs-select-trigger-width);min-width:var(--bs-select-trigger-min-width);height:var(--bs-select-height);min-height:var(--bs-select-height);color:var(--platform-control-placeholder, var(--color-text-placeholder));background-color:var(--platform-control-bg, var(--color-surface));border:1px solid var(--platform-control-border, var(--color-border));border-radius:var(--bs-select-radius);transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease}.bs-select__trigger:hover{background-color:var(--platform-control-bg-hover, var(--color-surface-soft))}.bs-select:focus-within .bs-select__trigger{border-color:var(--platform-control-focus, var(--color-primary));box-shadow:0 0 0 2px var(--platform-control-focus-ring, var(--color-primary-subtle))}.bs-select.bs-select--disabled .bs-select__trigger,.bs-select:has([ngComboboxInput][aria-disabled=true]) .bs-select__trigger{opacity:.6;cursor:default;background-color:var(--platform-control-bg-hover, var(--color-surface-soft))}[ngComboboxInput]{position:relative;z-index:0;width:100%;min-width:0;height:var(--bs-select-height);padding:0 calc(var(--bs-select-indicator-offset) + 1.75rem) 0 var(--bs-select-padding-x);border:0;outline:none;opacity:0;cursor:pointer;background:transparent}.bs-select__label{position:absolute;z-index:1;inset:0;display:flex;align-items:center;padding:0 calc(var(--bs-select-indicator-offset) + 1.75rem) 0 var(--bs-select-padding-x);pointer-events:none}.bs-select__tags{display:flex;align-items:center;gap:4px;min-width:0;width:100%;overflow:hidden;pointer-events:auto}.bs-select__add,.bs-select__tag{display:inline-flex;align-items:center;flex:0 0 auto;min-width:0;max-width:8rem;height:calc(var(--bs-select-height) - 10px);min-height:20px;padding:0 8px;border:1px solid var(--color-border);border-radius:calc(var(--bs-select-radius) - 2px);background-color:var(--color-surface-soft);color:var(--platform-control-color, var(--color-text-primary));font-size:var(--bs-select-font-size);font-family:inherit;line-height:1;white-space:nowrap}.bs-select__add{max-width:6rem;color:var(--color-primary);background-color:var(--color-surface);gap:3px;cursor:pointer}.bs-select__tag-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bs-select__tag--ellipsis{flex:0 0 auto;width:28px;justify-content:center;padding:0;color:var(--color-text-muted)}.bs-select__tag-remove{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:14px;height:14px;margin-left:4px;padding:0;color:var(--color-text-muted);background:transparent;border:0;cursor:pointer;line-height:1;pointer-events:auto}.bs-select__tag-remove:hover{color:var(--color-text-primary)}.bs-select__label-text{overflow:hidden;color:var(--platform-control-placeholder, var(--color-text-placeholder));font-size:var(--bs-select-font-size);line-height:var(--bs-select-line-height);text-overflow:ellipsis;white-space:nowrap}.bs-select.bs-select--selected .bs-select__label-text{color:var(--platform-control-color, var(--color-text-primary))}.bs-select__arrow{position:absolute;z-index:2;right:var(--bs-select-indicator-offset);width:0;height:0;pointer-events:none;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid var(--platform-control-placeholder, var(--color-text-placeholder));transition:transform .15s ease-in-out}[ngComboboxInput][aria-expanded=true]~.bs-select__arrow{transform:rotate(180deg)}.bs-select__popup{width:100%;min-width:var(--bs-select-popup-min-width);margin-top:var(--space-2);padding:var(--space-2);border:1px solid var(--color-border);border-radius:var(--bs-select-radius);background-color:var(--color-surface);box-shadow:var(--shadow-common-m);max-height:11rem;overflow:hidden}[ngListbox]{display:flex;flex-direction:column;gap:2px;height:100%;overflow:auto}[ngOption]{display:flex;align-items:center;min-height:var(--bs-select-height);margin:1px;padding:0 var(--space-2);border-radius:var(--bs-select-radius);cursor:pointer;transition:background-color .15s ease,color .15s ease,outline-color .15s ease}[ngOption]:hover{background-color:var(--color-surface-soft)}[ngOption][data-active=true]{outline:2px solid var(--color-primary);outline-offset:-2px}[ngOption][aria-selected=true]{color:var(--color-primary);background-color:var(--color-primary-subtle)}[ngOption][aria-disabled=true]{opacity:.5;cursor:default}.bs-select__option-text{flex:1;min-width:0;font-size:var(--bs-select-font-size);line-height:var(--bs-select-line-height)}[ngOption]:not([aria-selected=true]) .bs-select__check{display:none}.bs-select__check{position:relative;width:1rem;height:1rem;display:inline-block;flex:0 0 1rem;align-self:center;color:var(--color-primary);line-height:0;vertical-align:middle}.bs-select__check:before{position:absolute;top:50%;left:50%;content:\"\";width:6px;height:10px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translate(-50%,-73%) rotate(45deg);transform-origin:center}\n"] }]
+                    ], template: "<div\r\n  class=\"bs-select\"\r\n  ngCombobox\r\n  readonly\r\n  [class.bs-select--selected]=\"hasValue()\"\r\n  [class.bs-select--disabled]=\"isDisabled()\"\r\n>\r\n  <div #origin class=\"bs-select__trigger\">\r\n    <span class=\"bs-select__label\">\r\n      @if (multiple() && selectedOptions().length) {\r\n        <span class=\"bs-select__tags\">\r\n          <button type=\"button\" class=\"bs-select__add\" (click)=\"openCombobox($event)\">\r\n            <lucide-icon aria-hidden=\"true\" [img]=\"plusIcon\" [size]=\"13\" [strokeWidth]=\"2\" />\r\n            <span>{{ placeholder() }}</span>\r\n          </button>\r\n          @for (option of visibleSelectedOptions(); track option.value) {\r\n            <span class=\"bs-select__tag\">\r\n              <span class=\"bs-select__tag-text\">{{ option.label }}</span>\r\n              <button\r\n                type=\"button\"\r\n                class=\"bs-select__tag-remove\"\r\n                [attr.aria-label]=\"'Remove ' + option.label\"\r\n                (click)=\"removeSelectedValue(option.value, $event)\"\r\n              >\r\n                <lucide-icon aria-hidden=\"true\" [img]=\"closeIcon\" [size]=\"12\" [strokeWidth]=\"2\" />\r\n              </button>\r\n            </span>\r\n          }\r\n          @if (hiddenSelectedCount()) {\r\n            <span class=\"bs-select__tag bs-select__tag--ellipsis\" aria-hidden=\"true\">...</span>\r\n          }\r\n        </span>\r\n      } @else {\r\n        <span class=\"bs-select__label-text\">{{ displayValue() }}</span>\r\n      }\r\n    </span>\r\n    <input\r\n      [attr.aria-label]=\"ariaLabel()\"\r\n      [placeholder]=\"placeholder()\"\r\n      [disabled]=\"isDisabled()\"\r\n      ngComboboxInput\r\n    />\r\n    @if (!multiple() && hasValue()) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"bs-select__clear\"\r\n        aria-label=\"Clear selected option\"\r\n        (click)=\"clearSelectedValue($event)\"\r\n      >\r\n        <lucide-icon aria-hidden=\"true\" [img]=\"closeIcon\" [size]=\"13\" [strokeWidth]=\"2\" />\r\n      </button>\r\n    }\r\n    <span class=\"bs-select__arrow\" aria-hidden=\"true\"></span>\r\n  </div>\r\n  <ng-template ngComboboxPopupContainer>\r\n    <ng-template\r\n      #selectOverlay=\"cdkConnectedOverlay\"\r\n      [cdkConnectedOverlay]=\"{ origin, usePopover: 'inline', matchWidth: matchTriggerWidth() }\"\r\n      [cdkConnectedOverlayOpen]=\"combobox()?.expanded() ?? false\"\r\n      cdkAttachPopoverAsChild\r\n      (attach)=\"onOverlayAttached(selectOverlay)\"\r\n      (detach)=\"onOverlayDetached()\"\r\n    >\r\n      <div class=\"bs-select__popup\">\r\n        <div\r\n          ngListbox\r\n          [values]=\"selectedValues()\"\r\n          (valuesChange)=\"onListboxValueChange($event)\"\r\n          [multi]=\"multiple()\"\r\n          [disabled]=\"isDisabled()\"\r\n        >\r\n          @for (option of normalizedOptions(); track option.value) {\r\n            <div\r\n              ngOption\r\n              [value]=\"option.value\"\r\n              [label]=\"option.label\"\r\n              [disabled]=\"option.disabled ?? false\"\r\n              (click)=\"onOptionClick(option)\"\r\n            >\r\n              <span class=\"bs-select__option-text\">{{ option.label }}</span>\r\n              <span class=\"bs-select__check\" aria-hidden=\"true\"></span>\r\n            </div>\r\n          }\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n  </ng-template>\r\n</div>\r\n", styles: [":host{display:inline-block;width:var(--bs-select-width, var(--platform-control-width, 10rem));min-width:var(--bs-select-min-width, var(--platform-control-width, 10rem));max-width:100%;--bs-select-height: var(--platform-control-height, 2rem);--bs-select-radius: var(--platform-control-radius, var(--radius-common-m));--bs-select-padding-x: var(--platform-control-padding-x, .625rem);--bs-select-indicator-offset: var(--platform-control-padding-x, .625rem);--bs-select-font-size: var(--platform-control-font-size, 13px);--bs-select-line-height: var(--platform-control-line-height, 20px);--bs-select-trigger-width: 100%;--bs-select-trigger-min-width: 0;--bs-select-popup-min-width: 100%}.bs-select{display:block}.bs-select.bs-select--disabled{pointer-events:none}.bs-select__trigger{position:relative;display:flex;align-items:center;box-sizing:border-box;width:var(--bs-select-trigger-width);min-width:var(--bs-select-trigger-min-width);height:var(--bs-select-height);min-height:var(--bs-select-height);color:var(--platform-control-placeholder, var(--color-text-placeholder));background-color:var(--platform-control-bg, var(--color-surface));border:1px solid var(--platform-control-border, var(--color-border));border-radius:var(--bs-select-radius);transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease}.bs-select__trigger:hover{background-color:var(--platform-control-bg-hover, var(--color-surface-soft))}.bs-select:focus-within .bs-select__trigger{border-color:var(--platform-control-focus, var(--color-primary));box-shadow:0 0 0 2px var(--platform-control-focus-ring, var(--color-primary-subtle))}.bs-select.bs-select--disabled .bs-select__trigger,.bs-select:has([ngComboboxInput][aria-disabled=true]) .bs-select__trigger{opacity:.6;cursor:default;background-color:var(--platform-control-bg-hover, var(--color-surface-soft))}[ngComboboxInput]{position:relative;z-index:0;width:100%;min-width:0;height:var(--bs-select-height);padding:0 calc(var(--bs-select-indicator-offset) + 1.75rem) 0 var(--bs-select-padding-x);border:0;outline:none;opacity:0;cursor:pointer;background:transparent}.bs-select__label{position:absolute;z-index:1;inset:0;display:flex;align-items:center;padding:0 calc(var(--bs-select-indicator-offset) + 1.75rem) 0 var(--bs-select-padding-x);pointer-events:none}.bs-select__tags{display:flex;align-items:center;gap:4px;min-width:0;width:100%;overflow:hidden;pointer-events:auto}.bs-select__add,.bs-select__tag{display:inline-flex;align-items:center;flex:0 0 auto;min-width:0;max-width:8rem;height:calc(var(--bs-select-height) - 10px);min-height:20px;padding:0 8px;border:1px solid var(--color-border);border-radius:calc(var(--bs-select-radius) - 2px);background-color:var(--color-surface-soft);color:var(--platform-control-color, var(--color-text-primary));font-size:var(--bs-select-font-size);font-family:inherit;line-height:1;white-space:nowrap}.bs-select__add{max-width:6rem;color:var(--color-primary);background-color:var(--color-surface);gap:3px;cursor:pointer}.bs-select__tag-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bs-select__tag--ellipsis{flex:0 0 auto;width:28px;justify-content:center;padding:0;color:var(--color-text-muted)}.bs-select__tag-remove{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:14px;height:14px;margin-left:4px;padding:0;color:var(--color-text-muted);background:transparent;border:0;cursor:pointer;line-height:1;pointer-events:auto}.bs-select__tag-remove:hover{color:var(--color-text-primary)}.bs-select__label-text{overflow:hidden;color:var(--platform-control-placeholder, var(--color-text-placeholder));font-size:var(--bs-select-font-size);line-height:var(--bs-select-line-height);text-overflow:ellipsis;white-space:nowrap}.bs-select.bs-select--selected .bs-select__label-text{color:var(--platform-control-color, var(--color-text-primary))}.bs-select__arrow{position:absolute;z-index:2;right:var(--bs-select-indicator-offset);width:0;height:0;pointer-events:none;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid var(--platform-control-placeholder, var(--color-text-placeholder));transition:opacity .12s ease,transform .15s ease-in-out}[ngComboboxInput][aria-expanded=true]~.bs-select__arrow{transform:rotate(180deg)}.bs-select__clear{position:absolute;top:50%;right:calc(var(--bs-select-indicator-offset) - 5px);z-index:3;display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;color:var(--platform-control-placeholder, var(--color-text-placeholder));background:transparent;border:0;border-radius:50%;cursor:pointer;line-height:0;opacity:0;pointer-events:none;transform:translateY(-50%);transition:background-color .12s ease,color .12s ease,opacity .12s ease}.bs-select__clear:hover,.bs-select__clear:focus-visible{color:var(--platform-control-color, var(--color-text-primary));background-color:var(--platform-control-bg-hover, var(--color-surface-soft));opacity:1;outline:none}.bs-select.bs-select--selected:not(.bs-select--disabled) .bs-select__clear,.bs-select.bs-select--selected:not(.bs-select--disabled) .bs-select__clear:focus-visible{pointer-events:auto}.bs-select__clear:hover~.bs-select__arrow,.bs-select__clear:focus-visible~.bs-select__arrow{opacity:0}.bs-select__popup{width:100%;min-width:var(--bs-select-popup-min-width);margin-top:var(--space-2);padding:var(--space-2);border:1px solid var(--color-border);border-radius:var(--bs-select-radius);background-color:var(--color-surface);box-shadow:var(--shadow-common-m);max-height:11rem;overflow:hidden}[ngListbox]{display:flex;flex-direction:column;gap:2px;height:100%;overflow:auto}[ngOption]{display:flex;align-items:center;min-height:var(--bs-select-height);margin:1px;padding:0 var(--space-2);border-radius:var(--bs-select-radius);cursor:pointer;transition:background-color .15s ease,color .15s ease,outline-color .15s ease}[ngOption]:hover{background-color:var(--color-surface-soft)}[ngOption][data-active=true]{outline:2px solid var(--color-primary);outline-offset:-2px}[ngOption][aria-selected=true]{color:var(--color-primary);background-color:var(--color-primary-subtle)}[ngOption][aria-disabled=true]{opacity:.5;cursor:default}.bs-select__option-text{flex:1;min-width:0;font-size:var(--bs-select-font-size);line-height:var(--bs-select-line-height)}[ngOption]:not([aria-selected=true]) .bs-select__check{display:none}.bs-select__check{position:relative;width:1rem;height:1rem;display:inline-block;flex:0 0 1rem;align-self:center;color:var(--color-primary);line-height:0;vertical-align:middle}.bs-select__check:before{position:absolute;top:50%;left:50%;content:\"\";width:6px;height:10px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translate(-50%,-73%) rotate(45deg);transform-origin:center}\n"] }]
         }], ctorParameters: () => [], propDecorators: { listBox: [{ type: i0.ViewChild, args: [i0.forwardRef(() => Listbox), { isSignal: true }] }], optionRefs: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => Option), { isSignal: true }] }], combobox: [{ type: i0.ViewChild, args: [i0.forwardRef(() => Combobox), { isSignal: true }] }], labels: [{ type: i0.Input, args: [{ isSignal: true, alias: "labels", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], matchTriggerWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "matchTriggerWidth", required: false }] }] } });
 
 class Card {
@@ -2790,6 +3394,7 @@ class Card {
     title = input('', ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
     content = input('', ...(ngDevMode ? [{ debugName: "content" }] : /* istanbul ignore next */ []));
     hoverable = input(false, ...(ngDevMode ? [{ debugName: "hoverable" }] : /* istanbul ignore next */ []));
+    fill = input(false, ...(ngDevMode ? [{ debugName: "fill" }] : /* istanbul ignore next */ []));
     actionText = input('', ...(ngDevMode ? [{ debugName: "actionText" }] : /* istanbul ignore next */ []));
     actionTextAriaLabel = input('', ...(ngDevMode ? [{ debugName: "actionTextAriaLabel" }] : /* istanbul ignore next */ []));
     menuItems = input([], ...(ngDevMode ? [{ debugName: "menuItems" }] : /* istanbul ignore next */ []));
@@ -2842,16 +3447,20 @@ class Card {
         return action.id;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: Card, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: Card, isStandalone: true, selector: "s-card", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, hoverable: { classPropertyName: "hoverable", publicName: "hoverable", isSignal: true, isRequired: false, transformFunction: null }, actionText: { classPropertyName: "actionText", publicName: "actionText", isSignal: true, isRequired: false, transformFunction: null }, actionTextAriaLabel: { classPropertyName: "actionTextAriaLabel", publicName: "actionTextAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, menuItems: { classPropertyName: "menuItems", publicName: "menuItems", isSignal: true, isRequired: false, transformFunction: null }, iconActions: { classPropertyName: "iconActions", publicName: "iconActions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { actionTriggered: "actionTriggered", menuItemSelected: "menuItemSelected", iconActionSelected: "iconActionSelected" }, host: { listeners: { "document:click": "onDocumentClick($event)", "document:keydown.escape": "closeMenu()" } }, ngImport: i0, template: "<article class=\"card\" [class.card--hoverable]=\"hoverable()\">\r\n  <div class=\"card__cover\">\r\n    <ng-content select=\"[cardCover]\" />\r\n  </div>\r\n\r\n  @if (hasHeader()) {\r\n    <header class=\"card__header\">\r\n      <div class=\"card__header-main\">\r\n        <ng-content select=\"[cardHeaderStart]\" />\r\n\r\n        @if (title()) {\r\n          <div class=\"card__title\">{{ title() }}</div>\r\n        }\r\n      </div>\r\n\r\n      <div class=\"card__actions\">\r\n        <ng-content select=\"[cardHeaderEnd]\" />\r\n\r\n        @if (actionText()) {\r\n          <button\r\n            type=\"button\"\r\n            class=\"card__action-text\"\r\n            [attr.aria-label]=\"actionTextAriaLabel() || actionText()\"\r\n            (click)=\"onActionTextClick()\"\r\n          >\r\n            {{ actionText() }}\r\n          </button>\r\n        }\r\n\r\n        @if (hasMenu()) {\r\n          <div class=\"card__menu\">\r\n            <button\r\n              type=\"button\"\r\n              class=\"card__icon-button\"\r\n              aria-label=\"\u6253\u5F00\u66F4\u591A\u64CD\u4F5C\"\r\n              (click)=\"onMenuTriggerClick($event)\"\r\n            >\r\n              <i-lucide [img]=\"moreIcon\" class=\"card__icon\"></i-lucide>\r\n            </button>\r\n\r\n            @if (isMenuOpen()) {\r\n              <div class=\"card__menu-panel\" role=\"menu\" aria-label=\"\u66F4\u591A\u64CD\u4F5C\">\r\n                @for (item of menuItems(); track trackByMenuId($index, item)) {\r\n                  <button\r\n                    type=\"button\"\r\n                    class=\"card__menu-item\"\r\n                    [disabled]=\"item.disabled\"\r\n                    (click)=\"onMenuItemClick(item)\"\r\n                  >\r\n                    {{ item.label }}\r\n                  </button>\r\n                }\r\n              </div>\r\n            }\r\n          </div>\r\n        }\r\n\r\n        @if (hasIconActions()) {\r\n          <div class=\"card__icon-actions\">\r\n            @for (action of iconActions(); track trackByActionId($index, action)) {\r\n              <button\r\n                type=\"button\"\r\n                class=\"card__icon-button\"\r\n                [attr.aria-label]=\"action.ariaLabel\"\r\n                [disabled]=\"action.disabled\"\r\n                (click)=\"onIconActionClick(action)\"\r\n              >\r\n                <i-lucide [img]=\"action.icon\" class=\"card__icon\"></i-lucide>\r\n              </button>\r\n            }\r\n          </div>\r\n        }\r\n      </div>\r\n    </header>\r\n  }\r\n\r\n  <div class=\"card__subheader\">\r\n    <ng-content select=\"[cardSubheader]\" />\r\n  </div>\r\n\r\n  <div class=\"card__body\">\r\n    <div class=\"card__body-main\">\r\n      <ng-content select=\"[cardBody]\" />\r\n\r\n      @if (content()) {\r\n        <p class=\"card__text\">{{ content() }}</p>\r\n      } @else {\r\n        <ng-content />\r\n      }\r\n    </div>\r\n\r\n    <aside class=\"card__aside\">\r\n      <ng-content select=\"[cardAside]\" />\r\n    </aside>\r\n  </div>\r\n\r\n  <footer class=\"card__footer\">\r\n    <ng-content select=\"[cardFooter]\" />\r\n  </footer>\r\n</article>\r\n", styles: [":host{display:block}.card{border:1px solid var(--color-border);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:none;overflow:hidden;transition:box-shadow .16s ease,transform .16s ease,border-color .16s ease}.card--hoverable:hover{box-shadow:var(--shadow-common-l);border-color:var(--color-line-light)}.card--fill{height:100%;min-height:0;display:flex;flex-direction:column}.card--fill>.card__body{flex:1 1 auto;min-height:0}.card__cover:empty,.card__subheader:empty,.card__footer:empty,.card__aside:empty{display:none}.card__cover{border-bottom:1px solid var(--color-border)}.card__header{min-height:64px;padding:0 28px;border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;gap:16px}.card__header-main{min-width:0;flex:1 1 auto}.card__title{color:var(--color-text-primary);font-size:18px;font-weight:var(--font-weight-medium);line-height:25px}.card__actions{display:inline-flex;align-items:center;gap:12px;flex:0 0 auto}.card__actions--toolbar{display:flex;flex-wrap:wrap;gap:.5rem;padding:.5rem;border:1px solid var(--color-border);border-radius:var(--radius-common-m);background:var(--color-surface-soft)}.card__action-text{padding:0;border:0;background:transparent;color:var(--color-link);font-size:17px;font-weight:var(--font-weight-medium);line-height:22px;cursor:pointer}.card__action-text:hover{color:var(--color-link-hover)}.card__action-text:active{color:var(--color-link-active)}.card__menu,.card__icon-actions{position:relative;display:inline-flex;align-items:center;gap:4px}.card__icon-button{width:28px;height:28px;padding:0;border:0;border-radius:var(--radius-common-s);background:transparent;color:var(--color-text-secondary);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:color .16s ease,background-color .16s ease}.card__icon-button:hover:not(:disabled){background:var(--color-overlay-hover);color:var(--color-text-primary)}.card__icon-button:active:not(:disabled){background:var(--color-overlay-press)}.card__icon-button:disabled{color:var(--color-text-disabled);cursor:not-allowed}.card__icon{width:18px;height:18px;stroke-width:1.8}.card__menu-panel{position:absolute;top:calc(100% + 12px);right:0;min-width:112px;padding:8px;border:1px solid var(--color-border);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:var(--shadow-common-l);display:grid;gap:2px;z-index:10}.card__menu-item{min-height:44px;padding:0 12px;border:0;border-radius:var(--radius-common-m);background:transparent;color:var(--color-text-primary);font-size:17px;line-height:22px;text-align:left;cursor:pointer}.card__menu-item:hover:not(:disabled){background:var(--color-surface-soft)}.card__menu-item:disabled{color:var(--color-text-disabled);cursor:not-allowed}.card__subheader{padding:0 28px;border-bottom:1px solid var(--color-border)}.card__body{padding:22px 28px 28px;display:flex;align-items:flex-start;justify-content:space-between;gap:24px}.card__body-main{min-width:0;flex:1 1 auto}.card__aside{flex:0 0 auto}.card__text{margin:0;color:var(--color-text-secondary);font-size:17px;line-height:22px}.card__text--rich{overflow-x:auto;overflow-wrap:anywhere;line-height:1.7}.card__text--rich :where(p,div,blockquote){max-width:100%}.card__text--rich :where(img){display:block;max-width:100%;height:auto;object-fit:contain}.card__footer{min-height:60px;padding:0 28px;border-top:1px solid var(--color-border);display:flex;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: LucideAngularModule }, { kind: "component", type: i1.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: Card, isStandalone: true, selector: "s-card", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, hoverable: { classPropertyName: "hoverable", publicName: "hoverable", isSignal: true, isRequired: false, transformFunction: null }, fill: { classPropertyName: "fill", publicName: "fill", isSignal: true, isRequired: false, transformFunction: null }, actionText: { classPropertyName: "actionText", publicName: "actionText", isSignal: true, isRequired: false, transformFunction: null }, actionTextAriaLabel: { classPropertyName: "actionTextAriaLabel", publicName: "actionTextAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, menuItems: { classPropertyName: "menuItems", publicName: "menuItems", isSignal: true, isRequired: false, transformFunction: null }, iconActions: { classPropertyName: "iconActions", publicName: "iconActions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { actionTriggered: "actionTriggered", menuItemSelected: "menuItemSelected", iconActionSelected: "iconActionSelected" }, host: { listeners: { "document:click": "onDocumentClick($event)", "document:keydown.escape": "closeMenu()" } }, ngImport: i0, template: "<article class=\"card\" [class.card--hoverable]=\"hoverable()\" [class.card--fill]=\"fill()\">\n  <div class=\"card__cover\">\r\n    <ng-content select=\"[cardCover]\" />\r\n  </div>\r\n\r\n  @if (hasHeader()) {\r\n    <header class=\"card__header\">\r\n      <div class=\"card__header-main\">\r\n        <ng-content select=\"[cardHeaderStart]\" />\r\n\r\n        @if (title()) {\r\n          <div class=\"card__title\">{{ title() }}</div>\r\n        }\r\n      </div>\r\n\r\n      <div class=\"card__actions\">\r\n        <ng-content select=\"[cardHeaderEnd]\" />\r\n\r\n        @if (actionText()) {\r\n          <button\r\n            type=\"button\"\r\n            class=\"card__action-text\"\r\n            [attr.aria-label]=\"actionTextAriaLabel() || actionText()\"\r\n            (click)=\"onActionTextClick()\"\r\n          >\r\n            {{ actionText() }}\r\n          </button>\r\n        }\r\n\r\n        @if (hasMenu()) {\r\n          <div class=\"card__menu\">\r\n            <button\r\n              type=\"button\"\r\n              class=\"card__icon-button\"\r\n              aria-label=\"\u6253\u5F00\u66F4\u591A\u64CD\u4F5C\"\r\n              (click)=\"onMenuTriggerClick($event)\"\r\n            >\r\n              <i-lucide [img]=\"moreIcon\" class=\"card__icon\"></i-lucide>\r\n            </button>\r\n\r\n            @if (isMenuOpen()) {\r\n              <div class=\"card__menu-panel\" role=\"menu\" aria-label=\"\u66F4\u591A\u64CD\u4F5C\">\r\n                @for (item of menuItems(); track trackByMenuId($index, item)) {\r\n                  <button\r\n                    type=\"button\"\r\n                    class=\"card__menu-item\"\r\n                    [disabled]=\"item.disabled\"\r\n                    (click)=\"onMenuItemClick(item)\"\r\n                  >\r\n                    {{ item.label }}\r\n                  </button>\r\n                }\r\n              </div>\r\n            }\r\n          </div>\r\n        }\r\n\r\n        @if (hasIconActions()) {\r\n          <div class=\"card__icon-actions\">\r\n            @for (action of iconActions(); track trackByActionId($index, action)) {\r\n              <button\r\n                type=\"button\"\r\n                class=\"card__icon-button\"\r\n                [attr.aria-label]=\"action.ariaLabel\"\r\n                [disabled]=\"action.disabled\"\r\n                (click)=\"onIconActionClick(action)\"\r\n              >\r\n                <i-lucide [img]=\"action.icon\" class=\"card__icon\"></i-lucide>\r\n              </button>\r\n            }\r\n          </div>\r\n        }\r\n      </div>\r\n    </header>\r\n  }\r\n\r\n  <div class=\"card__subheader\">\r\n    <ng-content select=\"[cardSubheader]\" />\r\n  </div>\r\n\r\n  <div class=\"card__body\">\r\n    <div class=\"card__body-main\">\r\n      <ng-content select=\"[cardBody]\" />\r\n\r\n      @if (content()) {\r\n        <p class=\"card__text\">{{ content() }}</p>\r\n      } @else {\r\n        <ng-content />\r\n      }\r\n    </div>\r\n\r\n    <aside class=\"card__aside\">\r\n      <ng-content select=\"[cardAside]\" />\r\n    </aside>\r\n  </div>\r\n\r\n  <footer class=\"card__footer\">\r\n    <ng-content select=\"[cardFooter]\" />\r\n  </footer>\r\n</article>\r\n", styles: [":host{display:block}.card{border:1px solid var(--color-border);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:none;overflow:hidden;transition:box-shadow .16s ease,transform .16s ease,border-color .16s ease}.card--hoverable:hover{box-shadow:var(--shadow-common-l);border-color:var(--color-line-light)}.card--fill{height:100%;min-height:0;display:flex;flex-direction:column}.card--fill>.card__body{flex:1 1 auto;min-height:0;align-items:stretch}.card--fill>.card__body>.card__body-main{height:100%;min-height:0}.card__cover:empty,.card__subheader:empty,.card__footer:empty,.card__aside:empty{display:none}.card__cover{border-bottom:1px solid var(--color-border)}.card__header{min-height:48px;padding:0 14px;border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;gap:14px}.card__header-main{min-width:0;flex:1 1 auto}.card__title{color:var(--color-text-primary);font-size:18px;font-weight:var(--font-weight-medium);line-height:25px}.card__actions{display:inline-flex;align-items:center;gap:12px;flex:0 0 auto}.card__actions--toolbar{display:flex;flex-wrap:wrap;gap:.5rem;padding:.5rem;border:1px solid var(--color-border);border-radius:var(--radius-common-m);background:var(--color-surface-soft)}.card__action-text{padding:0;border:0;background:transparent;color:var(--color-link);font-size:17px;font-weight:var(--font-weight-medium);line-height:22px;cursor:pointer}.card__action-text:hover{color:var(--color-link-hover)}.card__action-text:active{color:var(--color-link-active)}.card__menu,.card__icon-actions{position:relative;display:inline-flex;align-items:center;gap:4px}.card__icon-button{width:28px;height:28px;padding:0;border:0;border-radius:var(--radius-common-s);background:transparent;color:var(--color-text-secondary);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:color .16s ease,background-color .16s ease}.card__icon-button:hover:not(:disabled){background:var(--color-overlay-hover);color:var(--color-text-primary)}.card__icon-button:active:not(:disabled){background:var(--color-overlay-press)}.card__icon-button:disabled{color:var(--color-text-disabled);cursor:not-allowed}.card__icon{width:18px;height:18px;stroke-width:1.8}.card__menu-panel{position:absolute;top:calc(100% + 12px);right:0;min-width:112px;padding:8px;border:1px solid var(--color-border);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:var(--shadow-common-l);display:grid;gap:2px;z-index:10}.card__menu-item{min-height:44px;padding:0 12px;border:0;border-radius:var(--radius-common-m);background:transparent;color:var(--color-text-primary);font-size:17px;line-height:22px;text-align:left;cursor:pointer}.card__menu-item:hover:not(:disabled){background:var(--color-surface-soft)}.card__menu-item:disabled{color:var(--color-text-disabled);cursor:not-allowed}.card__subheader{padding:0 14px;border-bottom:1px solid var(--color-border)}.card__body{padding:12px;display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.card__body-main{min-width:0;flex:1 1 auto}.card__aside{flex:0 0 auto}.card__text{margin:0;color:var(--color-text-secondary);font-size:17px;line-height:22px}.card__text--rich{overflow-x:auto;overflow-wrap:anywhere;line-height:1.7}.card__text--rich :where(p,div,blockquote){max-width:100%}.card__text--rich :where(img){display:block;max-width:100%;height:auto;object-fit:contain}.card__footer{min-height:48px;padding:0 14px;border-top:1px solid var(--color-border);display:flex;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: LucideAngularModule }, { kind: "component", type: i1.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: Card, decorators: [{
             type: Component,
             args: [{ selector: 's-card', imports: [LucideAngularModule], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '(document:click)': 'onDocumentClick($event)',
                         '(document:keydown.escape)': 'closeMenu()',
-                    }, template: "<article class=\"card\" [class.card--hoverable]=\"hoverable()\">\r\n  <div class=\"card__cover\">\r\n    <ng-content select=\"[cardCover]\" />\r\n  </div>\r\n\r\n  @if (hasHeader()) {\r\n    <header class=\"card__header\">\r\n      <div class=\"card__header-main\">\r\n        <ng-content select=\"[cardHeaderStart]\" />\r\n\r\n        @if (title()) {\r\n          <div class=\"card__title\">{{ title() }}</div>\r\n        }\r\n      </div>\r\n\r\n      <div class=\"card__actions\">\r\n        <ng-content select=\"[cardHeaderEnd]\" />\r\n\r\n        @if (actionText()) {\r\n          <button\r\n            type=\"button\"\r\n            class=\"card__action-text\"\r\n            [attr.aria-label]=\"actionTextAriaLabel() || actionText()\"\r\n            (click)=\"onActionTextClick()\"\r\n          >\r\n            {{ actionText() }}\r\n          </button>\r\n        }\r\n\r\n        @if (hasMenu()) {\r\n          <div class=\"card__menu\">\r\n            <button\r\n              type=\"button\"\r\n              class=\"card__icon-button\"\r\n              aria-label=\"\u6253\u5F00\u66F4\u591A\u64CD\u4F5C\"\r\n              (click)=\"onMenuTriggerClick($event)\"\r\n            >\r\n              <i-lucide [img]=\"moreIcon\" class=\"card__icon\"></i-lucide>\r\n            </button>\r\n\r\n            @if (isMenuOpen()) {\r\n              <div class=\"card__menu-panel\" role=\"menu\" aria-label=\"\u66F4\u591A\u64CD\u4F5C\">\r\n                @for (item of menuItems(); track trackByMenuId($index, item)) {\r\n                  <button\r\n                    type=\"button\"\r\n                    class=\"card__menu-item\"\r\n                    [disabled]=\"item.disabled\"\r\n                    (click)=\"onMenuItemClick(item)\"\r\n                  >\r\n                    {{ item.label }}\r\n                  </button>\r\n                }\r\n              </div>\r\n            }\r\n          </div>\r\n        }\r\n\r\n        @if (hasIconActions()) {\r\n          <div class=\"card__icon-actions\">\r\n            @for (action of iconActions(); track trackByActionId($index, action)) {\r\n              <button\r\n                type=\"button\"\r\n                class=\"card__icon-button\"\r\n                [attr.aria-label]=\"action.ariaLabel\"\r\n                [disabled]=\"action.disabled\"\r\n                (click)=\"onIconActionClick(action)\"\r\n              >\r\n                <i-lucide [img]=\"action.icon\" class=\"card__icon\"></i-lucide>\r\n              </button>\r\n            }\r\n          </div>\r\n        }\r\n      </div>\r\n    </header>\r\n  }\r\n\r\n  <div class=\"card__subheader\">\r\n    <ng-content select=\"[cardSubheader]\" />\r\n  </div>\r\n\r\n  <div class=\"card__body\">\r\n    <div class=\"card__body-main\">\r\n      <ng-content select=\"[cardBody]\" />\r\n\r\n      @if (content()) {\r\n        <p class=\"card__text\">{{ content() }}</p>\r\n      } @else {\r\n        <ng-content />\r\n      }\r\n    </div>\r\n\r\n    <aside class=\"card__aside\">\r\n      <ng-content select=\"[cardAside]\" />\r\n    </aside>\r\n  </div>\r\n\r\n  <footer class=\"card__footer\">\r\n    <ng-content select=\"[cardFooter]\" />\r\n  </footer>\r\n</article>\r\n", styles: [":host{display:block}.card{border:1px solid var(--color-border);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:none;overflow:hidden;transition:box-shadow .16s ease,transform .16s ease,border-color .16s ease}.card--hoverable:hover{box-shadow:var(--shadow-common-l);border-color:var(--color-line-light)}.card--fill{height:100%;min-height:0;display:flex;flex-direction:column}.card--fill>.card__body{flex:1 1 auto;min-height:0}.card__cover:empty,.card__subheader:empty,.card__footer:empty,.card__aside:empty{display:none}.card__cover{border-bottom:1px solid var(--color-border)}.card__header{min-height:64px;padding:0 28px;border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;gap:16px}.card__header-main{min-width:0;flex:1 1 auto}.card__title{color:var(--color-text-primary);font-size:18px;font-weight:var(--font-weight-medium);line-height:25px}.card__actions{display:inline-flex;align-items:center;gap:12px;flex:0 0 auto}.card__actions--toolbar{display:flex;flex-wrap:wrap;gap:.5rem;padding:.5rem;border:1px solid var(--color-border);border-radius:var(--radius-common-m);background:var(--color-surface-soft)}.card__action-text{padding:0;border:0;background:transparent;color:var(--color-link);font-size:17px;font-weight:var(--font-weight-medium);line-height:22px;cursor:pointer}.card__action-text:hover{color:var(--color-link-hover)}.card__action-text:active{color:var(--color-link-active)}.card__menu,.card__icon-actions{position:relative;display:inline-flex;align-items:center;gap:4px}.card__icon-button{width:28px;height:28px;padding:0;border:0;border-radius:var(--radius-common-s);background:transparent;color:var(--color-text-secondary);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:color .16s ease,background-color .16s ease}.card__icon-button:hover:not(:disabled){background:var(--color-overlay-hover);color:var(--color-text-primary)}.card__icon-button:active:not(:disabled){background:var(--color-overlay-press)}.card__icon-button:disabled{color:var(--color-text-disabled);cursor:not-allowed}.card__icon{width:18px;height:18px;stroke-width:1.8}.card__menu-panel{position:absolute;top:calc(100% + 12px);right:0;min-width:112px;padding:8px;border:1px solid var(--color-border);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:var(--shadow-common-l);display:grid;gap:2px;z-index:10}.card__menu-item{min-height:44px;padding:0 12px;border:0;border-radius:var(--radius-common-m);background:transparent;color:var(--color-text-primary);font-size:17px;line-height:22px;text-align:left;cursor:pointer}.card__menu-item:hover:not(:disabled){background:var(--color-surface-soft)}.card__menu-item:disabled{color:var(--color-text-disabled);cursor:not-allowed}.card__subheader{padding:0 28px;border-bottom:1px solid var(--color-border)}.card__body{padding:22px 28px 28px;display:flex;align-items:flex-start;justify-content:space-between;gap:24px}.card__body-main{min-width:0;flex:1 1 auto}.card__aside{flex:0 0 auto}.card__text{margin:0;color:var(--color-text-secondary);font-size:17px;line-height:22px}.card__text--rich{overflow-x:auto;overflow-wrap:anywhere;line-height:1.7}.card__text--rich :where(p,div,blockquote){max-width:100%}.card__text--rich :where(img){display:block;max-width:100%;height:auto;object-fit:contain}.card__footer{min-height:60px;padding:0 28px;border-top:1px solid var(--color-border);display:flex;align-items:center}\n"] }]
-        }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }], hoverable: [{ type: i0.Input, args: [{ isSignal: true, alias: "hoverable", required: false }] }], actionText: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionText", required: false }] }], actionTextAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionTextAriaLabel", required: false }] }], menuItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "menuItems", required: false }] }], iconActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconActions", required: false }] }], actionTriggered: [{ type: i0.Output, args: ["actionTriggered"] }], menuItemSelected: [{ type: i0.Output, args: ["menuItemSelected"] }], iconActionSelected: [{ type: i0.Output, args: ["iconActionSelected"] }] } });
+                    }, template: "<article class=\"card\" [class.card--hoverable]=\"hoverable()\" [class.card--fill]=\"fill()\">\n  <div class=\"card__cover\">\r\n    <ng-content select=\"[cardCover]\" />\r\n  </div>\r\n\r\n  @if (hasHeader()) {\r\n    <header class=\"card__header\">\r\n      <div class=\"card__header-main\">\r\n        <ng-content select=\"[cardHeaderStart]\" />\r\n\r\n        @if (title()) {\r\n          <div class=\"card__title\">{{ title() }}</div>\r\n        }\r\n      </div>\r\n\r\n      <div class=\"card__actions\">\r\n        <ng-content select=\"[cardHeaderEnd]\" />\r\n\r\n        @if (actionText()) {\r\n          <button\r\n            type=\"button\"\r\n            class=\"card__action-text\"\r\n            [attr.aria-label]=\"actionTextAriaLabel() || actionText()\"\r\n            (click)=\"onActionTextClick()\"\r\n          >\r\n            {{ actionText() }}\r\n          </button>\r\n        }\r\n\r\n        @if (hasMenu()) {\r\n          <div class=\"card__menu\">\r\n            <button\r\n              type=\"button\"\r\n              class=\"card__icon-button\"\r\n              aria-label=\"\u6253\u5F00\u66F4\u591A\u64CD\u4F5C\"\r\n              (click)=\"onMenuTriggerClick($event)\"\r\n            >\r\n              <i-lucide [img]=\"moreIcon\" class=\"card__icon\"></i-lucide>\r\n            </button>\r\n\r\n            @if (isMenuOpen()) {\r\n              <div class=\"card__menu-panel\" role=\"menu\" aria-label=\"\u66F4\u591A\u64CD\u4F5C\">\r\n                @for (item of menuItems(); track trackByMenuId($index, item)) {\r\n                  <button\r\n                    type=\"button\"\r\n                    class=\"card__menu-item\"\r\n                    [disabled]=\"item.disabled\"\r\n                    (click)=\"onMenuItemClick(item)\"\r\n                  >\r\n                    {{ item.label }}\r\n                  </button>\r\n                }\r\n              </div>\r\n            }\r\n          </div>\r\n        }\r\n\r\n        @if (hasIconActions()) {\r\n          <div class=\"card__icon-actions\">\r\n            @for (action of iconActions(); track trackByActionId($index, action)) {\r\n              <button\r\n                type=\"button\"\r\n                class=\"card__icon-button\"\r\n                [attr.aria-label]=\"action.ariaLabel\"\r\n                [disabled]=\"action.disabled\"\r\n                (click)=\"onIconActionClick(action)\"\r\n              >\r\n                <i-lucide [img]=\"action.icon\" class=\"card__icon\"></i-lucide>\r\n              </button>\r\n            }\r\n          </div>\r\n        }\r\n      </div>\r\n    </header>\r\n  }\r\n\r\n  <div class=\"card__subheader\">\r\n    <ng-content select=\"[cardSubheader]\" />\r\n  </div>\r\n\r\n  <div class=\"card__body\">\r\n    <div class=\"card__body-main\">\r\n      <ng-content select=\"[cardBody]\" />\r\n\r\n      @if (content()) {\r\n        <p class=\"card__text\">{{ content() }}</p>\r\n      } @else {\r\n        <ng-content />\r\n      }\r\n    </div>\r\n\r\n    <aside class=\"card__aside\">\r\n      <ng-content select=\"[cardAside]\" />\r\n    </aside>\r\n  </div>\r\n\r\n  <footer class=\"card__footer\">\r\n    <ng-content select=\"[cardFooter]\" />\r\n  </footer>\r\n</article>\r\n", styles: [":host{display:block}.card{border:1px solid var(--color-border);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:none;overflow:hidden;transition:box-shadow .16s ease,transform .16s ease,border-color .16s ease}.card--hoverable:hover{box-shadow:var(--shadow-common-l);border-color:var(--color-line-light)}.card--fill{height:100%;min-height:0;display:flex;flex-direction:column}.card--fill>.card__body{flex:1 1 auto;min-height:0;align-items:stretch}.card--fill>.card__body>.card__body-main{height:100%;min-height:0}.card__cover:empty,.card__subheader:empty,.card__footer:empty,.card__aside:empty{display:none}.card__cover{border-bottom:1px solid var(--color-border)}.card__header{min-height:48px;padding:0 14px;border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;gap:14px}.card__header-main{min-width:0;flex:1 1 auto}.card__title{color:var(--color-text-primary);font-size:18px;font-weight:var(--font-weight-medium);line-height:25px}.card__actions{display:inline-flex;align-items:center;gap:12px;flex:0 0 auto}.card__actions--toolbar{display:flex;flex-wrap:wrap;gap:.5rem;padding:.5rem;border:1px solid var(--color-border);border-radius:var(--radius-common-m);background:var(--color-surface-soft)}.card__action-text{padding:0;border:0;background:transparent;color:var(--color-link);font-size:17px;font-weight:var(--font-weight-medium);line-height:22px;cursor:pointer}.card__action-text:hover{color:var(--color-link-hover)}.card__action-text:active{color:var(--color-link-active)}.card__menu,.card__icon-actions{position:relative;display:inline-flex;align-items:center;gap:4px}.card__icon-button{width:28px;height:28px;padding:0;border:0;border-radius:var(--radius-common-s);background:transparent;color:var(--color-text-secondary);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:color .16s ease,background-color .16s ease}.card__icon-button:hover:not(:disabled){background:var(--color-overlay-hover);color:var(--color-text-primary)}.card__icon-button:active:not(:disabled){background:var(--color-overlay-press)}.card__icon-button:disabled{color:var(--color-text-disabled);cursor:not-allowed}.card__icon{width:18px;height:18px;stroke-width:1.8}.card__menu-panel{position:absolute;top:calc(100% + 12px);right:0;min-width:112px;padding:8px;border:1px solid var(--color-border);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:var(--shadow-common-l);display:grid;gap:2px;z-index:10}.card__menu-item{min-height:44px;padding:0 12px;border:0;border-radius:var(--radius-common-m);background:transparent;color:var(--color-text-primary);font-size:17px;line-height:22px;text-align:left;cursor:pointer}.card__menu-item:hover:not(:disabled){background:var(--color-surface-soft)}.card__menu-item:disabled{color:var(--color-text-disabled);cursor:not-allowed}.card__subheader{padding:0 14px;border-bottom:1px solid var(--color-border)}.card__body{padding:12px;display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.card__body-main{min-width:0;flex:1 1 auto}.card__aside{flex:0 0 auto}.card__text{margin:0;color:var(--color-text-secondary);font-size:17px;line-height:22px}.card__text--rich{overflow-x:auto;overflow-wrap:anywhere;line-height:1.7}.card__text--rich :where(p,div,blockquote){max-width:100%}.card__text--rich :where(img){display:block;max-width:100%;height:auto;object-fit:contain}.card__footer{min-height:48px;padding:0 14px;border-top:1px solid var(--color-border);display:flex;align-items:center}\n"] }]
+        }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }], hoverable: [{ type: i0.Input, args: [{ isSignal: true, alias: "hoverable", required: false }] }], fill: [{ type: i0.Input, args: [{ isSignal: true, alias: "fill", required: false }] }], actionText: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionText", required: false }] }], actionTextAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionTextAriaLabel", required: false }] }], menuItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "menuItems", required: false }] }], iconActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconActions", required: false }] }], actionTriggered: [{ type: i0.Output, args: ["actionTriggered"] }], menuItemSelected: [{ type: i0.Output, args: ["menuItemSelected"] }], iconActionSelected: [{ type: i0.Output, args: ["iconActionSelected"] }] } });
 
+const YEAR_PANEL_SIZE = 12;
+function getYearPanelStart(year) {
+    return Math.floor(year / YEAR_PANEL_SIZE) * YEAR_PANEL_SIZE;
+}
 function startOfDay(value) {
     return new Date(value.getFullYear(), value.getMonth(), value.getDate());
 }
@@ -2930,6 +3539,25 @@ class DatePicker {
     rangeHoverDate = signal(null, ...(ngDevMode ? [{ debugName: "rangeHoverDate" }] : /* istanbul ignore next */ []));
     rangeSelectingPart = signal('start', ...(ngDevMode ? [{ debugName: "rangeSelectingPart" }] : /* istanbul ignore next */ []));
     viewDate = signal(this.getInitialViewDate(), ...(ngDevMode ? [{ debugName: "viewDate" }] : /* istanbul ignore next */ []));
+    shortcutText = computed(() => this.mode() === 'year' ? this.thisYearText() : this.todayText(), ...(ngDevMode ? [{ debugName: "shortcutText" }] : /* istanbul ignore next */ []));
+    previousPanelLabel = computed(() => {
+        if (this.mode() === 'year') {
+            return '上一组年份';
+        }
+        if (this.mode() === 'month' || this.mode() === 'quarter') {
+            return '上一年';
+        }
+        return '上一个月';
+    }, ...(ngDevMode ? [{ debugName: "previousPanelLabel" }] : /* istanbul ignore next */ []));
+    nextPanelLabel = computed(() => {
+        if (this.mode() === 'year') {
+            return '下一组年份';
+        }
+        if (this.mode() === 'month' || this.mode() === 'quarter') {
+            return '下一年';
+        }
+        return '下一个月';
+    }, ...(ngDevMode ? [{ debugName: "nextPanelLabel" }] : /* istanbul ignore next */ []));
     displayValue = computed(() => {
         if (this.mode() === 'range') {
             const range = normalizeRangeValue(this.rangeValue());
@@ -2946,6 +3574,9 @@ class DatePicker {
         if (!value) {
             return '';
         }
+        if (this.mode() === 'year') {
+            return `${value.getFullYear()}年`;
+        }
         if (this.mode() === 'quarter') {
             return `${value.getFullYear()}年 Q${Math.floor(value.getMonth() / 3) + 1}`;
         }
@@ -2968,6 +3599,10 @@ class DatePicker {
     }, ...(ngDevMode ? [{ debugName: "displayValue" }] : /* istanbul ignore next */ []));
     title = computed(() => {
         const currentViewDate = this.viewDate();
+        if (this.mode() === 'year') {
+            const startYear = getYearPanelStart(currentViewDate.getFullYear());
+            return `${startYear}年 - ${startYear + YEAR_PANEL_SIZE - 1}年`;
+        }
         if (this.mode() === 'month' || this.mode() === 'quarter') {
             return `${currentViewDate.getFullYear()}年`;
         }
@@ -3023,6 +3658,17 @@ class DatePicker {
             { quarter: 4, label: 'Q4', date: new Date(year, 9, 1) },
         ];
     }, ...(ngDevMode ? [{ debugName: "quarterCells" }] : /* istanbul ignore next */ []));
+    yearCells = computed(() => {
+        const startYear = getYearPanelStart(this.viewDate().getFullYear());
+        return Array.from({ length: YEAR_PANEL_SIZE }, (_, index) => {
+            const year = startYear + index;
+            return {
+                year,
+                label: `${year}年`,
+                date: new Date(year, 0, 1),
+            };
+        });
+    }, ...(ngDevMode ? [{ debugName: "yearCells" }] : /* istanbul ignore next */ []));
     toggle() {
         if (this.disabled()) {
             return;
@@ -3080,6 +3726,16 @@ class DatePicker {
     selectQuarter(cell) {
         this.pendingDate.set(cell.date);
     }
+    selectYear(cell) {
+        this.pendingDate.set(cell.date);
+    }
+    selectShortcut() {
+        if (this.mode() === 'year') {
+            this.selectThisYear();
+            return;
+        }
+        this.selectToday();
+    }
     selectToday() {
         if (this.isDateDisabled(this.today)) {
             this.viewDate.set(this.today);
@@ -3108,6 +3764,12 @@ class DatePicker {
             return;
         }
         const currentPendingDate = this.pendingDate() ?? this.today;
+        if (this.mode() === 'year') {
+            const selectedDate = new Date(currentYear, 0, 1);
+            this.pendingDate.set(selectedDate);
+            this.viewDate.set(selectedDate);
+            return;
+        }
         const selectedDate = new Date(currentYear, currentPendingDate.getMonth(), 1);
         this.pendingDate.set(selectedDate);
         this.viewDate.set(new Date(currentYear, this.viewDate().getMonth(), 1));
@@ -3127,6 +3789,10 @@ class DatePicker {
     }
     prev() {
         const current = this.viewDate();
+        if (this.mode() === 'year') {
+            this.viewDate.set(new Date(current.getFullYear() - YEAR_PANEL_SIZE, 0, 1));
+            return;
+        }
         if (this.mode() === 'month' || this.mode() === 'quarter') {
             this.viewDate.set(new Date(current.getFullYear() - 1, current.getMonth(), 1));
             return;
@@ -3135,6 +3801,10 @@ class DatePicker {
     }
     next() {
         const current = this.viewDate();
+        if (this.mode() === 'year') {
+            this.viewDate.set(new Date(current.getFullYear() + YEAR_PANEL_SIZE, 0, 1));
+            return;
+        }
         if (this.mode() === 'month' || this.mode() === 'quarter') {
             this.viewDate.set(new Date(current.getFullYear() + 1, current.getMonth(), 1));
             return;
@@ -3169,6 +3839,10 @@ class DatePicker {
             currentPendingDate.getFullYear() === cell.date.getFullYear() &&
             Math.floor(currentPendingDate.getMonth() / 3) + 1 === cell.quarter);
     }
+    isYearSelected(cell) {
+        const currentPendingDate = this.pendingDate();
+        return !!currentPendingDate && currentPendingDate.getFullYear() === cell.year;
+    }
     isRangeStart(cell) {
         if (this.mode() !== 'range') {
             return false;
@@ -3328,7 +4002,7 @@ class DatePicker {
         return Number.isFinite(parsedValue) ? parsedValue : fallback;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: DatePicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: DatePicker, isStandalone: true, selector: "s-date-picker", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, rangeValue: { classPropertyName: "rangeValue", publicName: "rangeValue", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, rangeSeparator: { classPropertyName: "rangeSeparator", publicName: "rangeSeparator", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: true, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: true, isRequired: false, transformFunction: null }, confirmText: { classPropertyName: "confirmText", publicName: "confirmText", isSignal: true, isRequired: false, transformFunction: null }, cancelText: { classPropertyName: "cancelText", publicName: "cancelText", isSignal: true, isRequired: false, transformFunction: null }, todayText: { classPropertyName: "todayText", publicName: "todayText", isSignal: true, isRequired: false, transformFunction: null }, thisYearText: { classPropertyName: "thisYearText", publicName: "thisYearText", isSignal: true, isRequired: false, transformFunction: null }, startPlaceholder: { classPropertyName: "startPlaceholder", publicName: "startPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, endPlaceholder: { classPropertyName: "endPlaceholder", publicName: "endPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, iconSize: { classPropertyName: "iconSize", publicName: "iconSize", isSignal: true, isRequired: false, transformFunction: null }, weekDayLabels: { classPropertyName: "weekDayLabels", publicName: "weekDayLabels", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", rangeValue: "rangeValueChange" }, host: { listeners: { "document:click": "onDocumentClick($event)", "document:keydown": "onDocumentKeydown($event)", "window:resize": "onWindowResize()" }, properties: { "class.date-picker-host--range": "mode() === 'range'", "class.date-picker-host--open": "isOpen()" } }, ngImport: i0, template: "<div\r\n  class=\"date-picker s-date-range-picker\"\r\n  [class.date-picker--disabled]=\"disabled()\"\r\n  [class.s-date-range-picker--range]=\"mode() === 'range'\"\r\n>\r\n  <button\r\n    type=\"button\"\r\n    class=\"date-picker__trigger s-date-range-picker__trigger\"\r\n    [disabled]=\"disabled()\"\r\n    (click)=\"toggle()\"\r\n  >\r\n    <span\r\n      class=\"date-picker__value\"\r\n      [class.date-picker__value--placeholder]=\"mode() !== 'range' && !displayValue()\"\r\n      [class.date-picker__value--range]=\"mode() === 'range'\"\r\n    >\r\n      @if (mode() === 'range') {\r\n        <span class=\"date-picker__range-part\" [class.date-picker__range-part--placeholder]=\"!rangeValue()?.start\">\r\n          {{ rangeValue()?.start ? displayValue().split(' ' + rangeSeparator() + ' ')[0] : startPlaceholder() }}\r\n        </span>\r\n        <span class=\"date-picker__range-separator\">{{ rangeSeparator() }}</span>\r\n        <span class=\"date-picker__range-part\" [class.date-picker__range-part--placeholder]=\"!rangeValue()?.end\">\r\n          {{ rangeValue()?.end ? displayValue().split(' ' + rangeSeparator() + ' ')[1] : endPlaceholder() }}\r\n        </span>\r\n      } @else {\r\n        {{ displayValue() || placeholder() }}\r\n      }\r\n    </span>\r\n    @if (shouldShowClear()) {\r\n      <span\r\n        class=\"date-picker__trigger-icon date-picker__trigger-icon--clear\"\r\n        role=\"button\"\r\n        tabindex=\"-1\"\r\n        aria-label=\"\u6E05\u7A7A\u65E5\u671F\"\r\n        (click)=\"clearSelection($event)\"\r\n      >\r\n        <i-lucide [img]=\"clearIcon\" [size]=\"iconSize()\"></i-lucide>\r\n      </span>\r\n    } @else {\r\n      <span class=\"date-picker__trigger-icon\" aria-hidden=\"true\">\r\n        <i-lucide [img]=\"calendarIcon\" [size]=\"iconSize()\"></i-lucide>\r\n      </span>\r\n    }\r\n  </button>\r\n\r\n  @if (isOpen()) {\r\n    <div\r\n      class=\"date-picker__panel s-date-range-picker__panel\"\r\n      [style.top.px]=\"panelPosition().top\"\r\n      [style.left.px]=\"panelPosition().left\"\r\n    >\r\n      <div class=\"date-picker__header s-date-range-picker__header\">\r\n        <button type=\"button\" class=\"date-picker__nav-btn\" (click)=\"prev()\" aria-label=\"\u4E0A\u4E00\u4E2A\u6708\">\r\n          <i-lucide [img]=\"prevIcon\"></i-lucide>\r\n        </button>\r\n        <div class=\"date-picker__title\">{{ title() }}</div>\r\n        <button type=\"button\" class=\"date-picker__nav-btn\" (click)=\"next()\" aria-label=\"\u4E0B\u4E00\u4E2A\u6708\">\r\n          <i-lucide [img]=\"nextIcon\"></i-lucide>\r\n        </button>\r\n      </div>\r\n\r\n      @if (mode() === 'month') {\r\n        <div class=\"date-picker__months\">\r\n          @for (cell of monthCells(); track cell.month) {\r\n            <button\r\n              type=\"button\"\r\n              class=\"date-picker__month-cell\"\r\n              [class.date-picker__month-cell--selected]=\"isMonthSelected(cell)\"\r\n              (click)=\"selectMonth(cell)\"\r\n            >\r\n              {{ cell.label }}\r\n            </button>\r\n          }\r\n        </div>\r\n      } @else if (mode() === 'quarter') {\r\n        <div class=\"date-picker__quarters\">\r\n          @for (cell of quarterCells(); track cell.quarter) {\r\n            <button\r\n              type=\"button\"\r\n              class=\"date-picker__quarter-cell\"\r\n              [class.date-picker__quarter-cell--selected]=\"isQuarterSelected(cell)\"\r\n              (click)=\"selectQuarter(cell)\"\r\n            >\r\n              {{ cell.label }}\r\n            </button>\r\n          }\r\n        </div>\r\n      } @else {\r\n        <div class=\"date-picker__weekdays s-date-range-picker__week\">\r\n          @for (label of weekDayLabels(); track label) {\r\n            <div class=\"date-picker__weekday\">{{ label }}</div>\r\n          }\r\n        </div>\r\n\r\n        <div\r\n          class=\"date-picker__grid s-date-range-picker__grid\"\r\n          [class.date-picker__grid--range-preview]=\"hasRangePreviewEnd()\"\r\n        >\r\n          @for (row of rows(); track trackByRow($index, row)) {\r\n            <div class=\"date-picker__row\" [class.date-picker__row--selected]=\"isWeekSelected(row)\">\r\n              @for (cell of row.cells; track trackByIso($index, cell)) {\r\n                <button\r\n                  type=\"button\"\r\n                  class=\"date-picker__cell s-date-range-picker__cell s-calendar-cell\"\r\n                  [class.date-picker__cell--muted]=\"!cell.inCurrentMonth\"\r\n                  [class.date-picker__cell--disabled]=\"cell.isDisabled\"\r\n                  [class.date-picker__cell--today]=\"isTodayCell(cell)\"\r\n                  [class.date-picker__cell--selected]=\"isSelected(cell)\"\r\n                  [class.date-picker__cell--week-anchor]=\"isWeekAnchor(cell)\"\r\n                  [class.date-picker__cell--range-start]=\"isRangeStart(cell)\"\r\n                  [class.date-picker__cell--range-end]=\"isRangeEnd(cell)\"\r\n                  [class.date-picker__cell--range-middle]=\"isRangeInBetween(cell)\"\r\n                  [class.s-calendar-cell--outside]=\"!cell.inCurrentMonth\"\r\n                  [class.s-calendar-cell--disabled]=\"cell.isDisabled\"\r\n                  [class.s-calendar-cell--today]=\"isTodayCell(cell)\"\r\n                  [class.s-calendar-cell--selected-start]=\"isRangeStart(cell)\"\r\n                  [class.s-calendar-cell--selected-end]=\"isRangeEnd(cell)\"\r\n                  [class.s-calendar-cell--in-range]=\"isRangeInBetween(cell)\"\r\n                  [disabled]=\"cell.isDisabled\"\r\n                  (click)=\"mode() === 'week' ? selectWeek(row) : selectDate(cell.date)\"\r\n                  (mouseenter)=\"onCellHover(cell.date)\"\r\n                  (mouseleave)=\"onCellHover(null)\"\r\n                >\r\n                  <span class=\"date-picker__cell-label\">{{ cell.label }}</span>\r\n                </button>\r\n              }\r\n            </div>\r\n          }\r\n        </div>\r\n      }\r\n\r\n      <div class=\"date-picker__footer s-date-range-picker__footer\">\r\n        <button type=\"button\" class=\"date-picker__today-btn\" (click)=\"selectToday()\">\r\n          {{ todayText() }}\r\n        </button>\r\n        <div class=\"date-picker__footer-actions\">\r\n          <button type=\"button\" class=\"date-picker__footer-btn\" (click)=\"cancel()\">{{ cancelText() }}</button>\r\n          <button type=\"button\" class=\"date-picker__footer-btn date-picker__footer-btn--primary\" (click)=\"confirm()\">\r\n            {{ confirmText() }}\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [":host{position:relative;display:inline-block;width:var(--date-picker-width, var(--platform-control-width, 10rem));min-width:var(--date-picker-min-width, var(--platform-control-width, 10rem));max-width:100%;--date-primary: #0A84FF;--date-primary-hover: #0077E6;--date-primary-active: #006FD6;--date-primary-soft: rgba(10,132,255,.14);--date-primary-hover-soft: rgba(10,132,255,.08);--date-bg: #FFFFFF;--date-trigger-bg: #F8FAFC;--date-border: rgba(60,60,67,.1);--date-border-strong: rgba(60,60,67,.16);--date-text: #111827;--date-text-secondary: rgba(60,60,67,.68);--date-text-muted: rgba(60,60,67,.36);--date-text-disabled: rgba(60,60,67,.22);--date-shadow: 0 12px 32px rgba(0,0,0,.12);--date-trigger-height: 36px;--date-trigger-radius: 10px;--date-trigger-padding-x: 12px;--date-trigger-min-width: 252px;--date-panel-size: 252px;--date-panel-radius: 12px;--date-header-height: 32px;--date-week-height: 24px;--date-grid-height: 140px;--date-footer-height: 44px;--date-cell-height: 28px;--date-cell-dot-size: 28px;--date-button-width: 56px;--date-button-height: 32px;--date-button-radius: 8px;--date-picker-height: var(--date-trigger-height);--date-picker-radius: var(--date-trigger-radius);--date-picker-padding-x: var(--date-trigger-padding-x);--date-picker-indicator-offset: var(--date-trigger-padding-x);--date-picker-panel-padding-x: 12px;--date-picker-range-bg: var(--date-primary-soft);--calendar-selected-bg: var(--date-primary);--calendar-muted-color: rgba(60,60,67,.28)}:host(.date-picker-host--open){z-index:1000}:host([mode=range]),:host(.date-picker-host--range){width:var(--date-picker-range-width, var(--date-trigger-min-width));min-width:var(--date-picker-range-min-width, var(--date-trigger-min-width))}.date-picker{position:relative;display:inline-flex;flex-direction:column;width:100%}.date-picker__trigger,.date-picker__header,.date-picker__weekdays,.date-picker__grid,.date-picker__months,.date-picker__quarters,.date-picker__cell,.date-picker__footer,.date-picker__footer-btn,.date-picker__month-cell,.date-picker__quarter-cell{box-sizing:border-box}.date-picker__trigger{position:relative;width:100%;min-width:0;height:var(--date-picker-height);padding:0 calc(var(--date-picker-indicator-offset) + 20px) 0 var(--date-picker-padding-x);border:1px solid rgba(60,60,67,.14);border-radius:var(--date-picker-radius);background:var(--date-trigger-bg);color:var(--date-text);display:inline-flex;align-items:center;cursor:pointer;transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease}.date-picker__trigger:hover{background:#fff;border-color:var(--date-border-strong)}.date-picker__trigger:focus-visible{outline:0;border-color:var(--date-primary);box-shadow:0 0 0 3px #0a84ff29}.date-picker__value{flex:1;min-width:0;overflow:hidden;color:var(--date-text);font-size:14px;font-weight:400;line-height:20px;letter-spacing:0;text-align:left;text-overflow:ellipsis;white-space:nowrap}.date-picker__value--placeholder,.date-picker__range-part--placeholder,.date-picker__range-separator{color:var(--date-text-muted)}.date-picker__value--range{display:inline-flex;align-items:center;justify-content:space-between;gap:8px;width:100%;white-space:nowrap}.date-picker__range-part{flex:0 1 auto;min-width:0;overflow:hidden;color:var(--date-text);text-overflow:ellipsis}.date-picker__range-separator{flex:0 0 auto}.date-picker__trigger-icon,.date-picker__nav-btn,.date-picker__weekday,.date-picker__cell,.date-picker__cell-label,.date-picker__month-cell,.date-picker__quarter-cell,.date-picker__footer,.date-picker__today-btn,.date-picker__footer-actions,.date-picker__footer-btn{display:inline-flex;align-items:center;justify-content:center}.date-picker__trigger-icon{position:absolute;top:50%;right:var(--date-picker-indicator-offset);width:16px;height:16px;color:var(--date-text-muted);pointer-events:none;line-height:0;transform:translateY(-50%)}.date-picker__trigger-icon svg{width:12px;height:12px}.date-picker__trigger-icon--clear{pointer-events:auto;color:var(--date-text-secondary);cursor:pointer}.date-picker__trigger-icon--clear:hover{color:var(--date-text)}.date-picker__panel{position:fixed;width:var(--date-panel-size);height:var(--date-panel-size);overflow:hidden;border:1px solid var(--date-border);border-radius:var(--date-panel-radius);background:var(--date-bg);box-shadow:var(--date-shadow);z-index:1000}.date-picker__header,.date-picker__weekdays,.date-picker__grid{padding-right:var(--date-picker-panel-padding-x);padding-left:var(--date-picker-panel-padding-x)}.date-picker__header{display:grid;grid-template-columns:24px minmax(0,1fr) 24px;align-items:center;height:var(--date-header-height)}.date-picker__title{min-width:0;overflow:hidden;color:var(--date-text);font-size:16px;font-weight:600;line-height:22px;text-align:center;text-overflow:ellipsis;white-space:nowrap}.date-picker__nav-btn{width:24px;height:24px;padding:0;border:0;border-radius:6px;background:transparent;color:var(--date-text-secondary);cursor:pointer}.date-picker__nav-btn:hover{background:#3c3c430f;color:var(--date-text)}.date-picker__nav-btn:active{background:#3c3c431a}.date-picker__nav-btn:disabled{opacity:.35;cursor:default}.date-picker__nav-btn i-lucide{display:block}.date-picker__nav-btn svg{display:block;width:14px;height:14px}.date-picker__weekdays{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));height:var(--date-week-height);margin-top:4px}.date-picker__weekday{height:100%;color:var(--date-text-muted);font-size:12px;font-weight:400;line-height:1}.date-picker__grid{display:flex;flex-direction:column;height:var(--date-grid-height);margin-bottom:8px}.date-picker__row{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));flex:1 1 0;min-height:0}.date-picker__row--selected{background:var(--date-picker-range-bg)}.date-picker__cell{position:relative;isolation:isolate;width:100%;height:100%;min-width:0;min-height:0;padding:0;border:0;border-radius:0;background:transparent;color:var(--date-text);font-size:14px;font-weight:400;line-height:1;cursor:pointer}.date-picker__cell:before{content:\"\";position:absolute;top:50%;right:0;left:0;height:min(var(--date-cell-height),100%);background:transparent;transform:translateY(-50%);z-index:0}.date-picker__cell-label{position:relative;z-index:1;height:min(var(--date-cell-dot-size),100%);aspect-ratio:1;border-radius:8px}.date-picker__cell:hover:not(:disabled):not(.date-picker__cell--selected):not(.date-picker__cell--range-start):not(.date-picker__cell--range-end) .date-picker__cell-label{background:var(--date-primary-hover-soft);color:var(--date-primary)}.date-picker__cell--muted{color:var(--calendar-muted-color)}.date-picker__cell--today .date-picker__cell-label,.date-picker__cell--week-anchor .date-picker__cell-label{border-radius:999px;color:var(--date-primary);box-shadow:inset 0 0 0 1px var(--date-primary)}.date-picker__cell--selected .date-picker__cell-label,.date-picker__cell--range-start .date-picker__cell-label,.date-picker__cell--range-end .date-picker__cell-label{border-radius:999px;background:var(--calendar-selected-bg);color:#fff;box-shadow:none}.date-picker__grid--range-preview .date-picker__cell--range-start:before,.date-picker__grid--range-preview .date-picker__cell--range-end:before,.date-picker__cell--range-middle:before{background:var(--date-picker-range-bg)}.date-picker__cell--range-middle{color:var(--date-primary)}.date-picker__grid--range-preview .date-picker__cell--range-start:before{left:50%}.date-picker__grid--range-preview .date-picker__cell--range-end:before{right:50%}.date-picker__cell--disabled,.date-picker__cell:disabled{color:var(--date-text-disabled);cursor:not-allowed}.date-picker__cell--disabled .date-picker__cell-label,.date-picker__cell:disabled .date-picker__cell-label{background:transparent;color:var(--date-text-disabled);box-shadow:none}.date-picker__months,.date-picker__quarters{display:grid;align-content:center;height:calc(var(--date-panel-size) - var(--date-header-height) - var(--date-footer-height));gap:8px;padding:8px var(--date-picker-panel-padding-x)}.date-picker__months{grid-template-columns:repeat(3,minmax(0,1fr))}.date-picker__quarters{grid-template-columns:repeat(4,minmax(0,1fr))}.date-picker__month-cell,.date-picker__quarter-cell{height:32px;padding:0;border:0;background:transparent;color:var(--date-text);font-size:14px;line-height:1;cursor:pointer}.date-picker__month-cell:hover,.date-picker__quarter-cell:hover{background:var(--date-primary-hover-soft);color:var(--date-primary)}.date-picker__month-cell{border-radius:8px}.date-picker__quarter-cell{border-radius:999px}.date-picker__month-cell--selected{background:var(--date-primary-soft);color:var(--date-primary)}.date-picker__quarter-cell--selected{background:var(--date-primary);color:#fff}.date-picker__footer{display:flex;width:100%;height:var(--date-footer-height);padding:0 var(--date-picker-panel-padding-x);border-top:1px solid var(--date-border);justify-content:space-between}.date-picker__today-btn{height:var(--date-button-height);padding:0 8px;border:0;border-radius:var(--date-button-radius);background:transparent;color:var(--date-primary);font-size:14px;font-weight:500;line-height:1;cursor:pointer}.date-picker__today-btn:hover{background:var(--date-primary-hover-soft)}.date-picker__footer-actions{gap:8px}.date-picker__footer-btn{width:var(--date-button-width);height:var(--date-button-height);padding:0;border:1px solid var(--date-border-strong);border-radius:var(--date-button-radius);background:#fff;color:var(--date-text);font-size:14px;font-weight:500;line-height:1;cursor:pointer}.date-picker__footer-btn:hover{background:#f8fafc}.date-picker__footer-btn--primary{border-color:transparent;background:var(--date-primary);color:#fff}.date-picker__footer-btn--primary:hover{background:var(--date-primary-hover)}.date-picker__footer-btn--primary:active{background:var(--date-primary-active)}.date-picker--disabled .date-picker__trigger{opacity:.6;cursor:default;background:var(--date-trigger-bg)}\n"], dependencies: [{ kind: "ngmodule", type: LucideAngularModule }, { kind: "component", type: i1.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: DatePicker, isStandalone: true, selector: "s-date-picker", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, rangeValue: { classPropertyName: "rangeValue", publicName: "rangeValue", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, rangeSeparator: { classPropertyName: "rangeSeparator", publicName: "rangeSeparator", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: true, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: true, isRequired: false, transformFunction: null }, confirmText: { classPropertyName: "confirmText", publicName: "confirmText", isSignal: true, isRequired: false, transformFunction: null }, cancelText: { classPropertyName: "cancelText", publicName: "cancelText", isSignal: true, isRequired: false, transformFunction: null }, todayText: { classPropertyName: "todayText", publicName: "todayText", isSignal: true, isRequired: false, transformFunction: null }, thisYearText: { classPropertyName: "thisYearText", publicName: "thisYearText", isSignal: true, isRequired: false, transformFunction: null }, startPlaceholder: { classPropertyName: "startPlaceholder", publicName: "startPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, endPlaceholder: { classPropertyName: "endPlaceholder", publicName: "endPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, iconSize: { classPropertyName: "iconSize", publicName: "iconSize", isSignal: true, isRequired: false, transformFunction: null }, weekDayLabels: { classPropertyName: "weekDayLabels", publicName: "weekDayLabels", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", rangeValue: "rangeValueChange" }, host: { listeners: { "document:click": "onDocumentClick($event)", "document:keydown": "onDocumentKeydown($event)", "window:resize": "onWindowResize()" }, properties: { "class.date-picker-host--range": "mode() === 'range'", "class.date-picker-host--open": "isOpen()" } }, ngImport: i0, template: "<div\r\n  class=\"date-picker s-date-range-picker\"\r\n  [class.date-picker--disabled]=\"disabled()\"\r\n  [class.s-date-range-picker--range]=\"mode() === 'range'\"\r\n>\r\n  <button\r\n    type=\"button\"\r\n    class=\"date-picker__trigger s-date-range-picker__trigger\"\r\n    [disabled]=\"disabled()\"\r\n    (click)=\"toggle()\"\r\n  >\r\n    <span\r\n      class=\"date-picker__value\"\r\n      [class.date-picker__value--placeholder]=\"mode() !== 'range' && !displayValue()\"\r\n      [class.date-picker__value--range]=\"mode() === 'range'\"\r\n    >\r\n      @if (mode() === 'range') {\r\n        <span class=\"date-picker__range-part\" [class.date-picker__range-part--placeholder]=\"!rangeValue()?.start\">\r\n          {{ rangeValue()?.start ? displayValue().split(' ' + rangeSeparator() + ' ')[0] : startPlaceholder() }}\r\n        </span>\r\n        <span class=\"date-picker__range-separator\">{{ rangeSeparator() }}</span>\r\n        <span class=\"date-picker__range-part\" [class.date-picker__range-part--placeholder]=\"!rangeValue()?.end\">\r\n          {{ rangeValue()?.end ? displayValue().split(' ' + rangeSeparator() + ' ')[1] : endPlaceholder() }}\r\n        </span>\r\n      } @else {\r\n        {{ displayValue() || placeholder() }}\r\n      }\r\n    </span>\r\n    @if (shouldShowClear()) {\r\n      <span\r\n        class=\"date-picker__trigger-icon date-picker__trigger-icon--clear\"\r\n        role=\"button\"\r\n        tabindex=\"-1\"\r\n        aria-label=\"\u6E05\u7A7A\u65E5\u671F\"\r\n        (click)=\"clearSelection($event)\"\r\n      >\r\n        <i-lucide [img]=\"clearIcon\" [size]=\"iconSize()\"></i-lucide>\r\n      </span>\r\n    } @else {\r\n      <span class=\"date-picker__trigger-icon\" aria-hidden=\"true\">\r\n        <i-lucide [img]=\"calendarIcon\" [size]=\"iconSize()\"></i-lucide>\r\n      </span>\r\n    }\r\n  </button>\r\n\r\n  @if (isOpen()) {\r\n    <div\r\n      class=\"date-picker__panel s-date-range-picker__panel\"\r\n      [style.top.px]=\"panelPosition().top\"\r\n      [style.left.px]=\"panelPosition().left\"\n    >\n      <div class=\"date-picker__header s-date-range-picker__header\">\n        <button type=\"button\" class=\"date-picker__nav-btn\" (click)=\"prev()\" [attr.aria-label]=\"previousPanelLabel()\">\n          <i-lucide [img]=\"prevIcon\"></i-lucide>\n        </button>\n        <div class=\"date-picker__title\">{{ title() }}</div>\n        <button type=\"button\" class=\"date-picker__nav-btn\" (click)=\"next()\" [attr.aria-label]=\"nextPanelLabel()\">\n          <i-lucide [img]=\"nextIcon\"></i-lucide>\n        </button>\n      </div>\n\n      @if (mode() === 'year') {\n        <div class=\"date-picker__years\">\n          @for (cell of yearCells(); track cell.year) {\n            <button\n              type=\"button\"\n              class=\"date-picker__year-cell\"\n              [class.date-picker__year-cell--selected]=\"isYearSelected(cell)\"\n              (click)=\"selectYear(cell)\"\n            >\n              {{ cell.label }}\n            </button>\n          }\n        </div>\n      } @else if (mode() === 'month') {\n        <div class=\"date-picker__months\">\n          @for (cell of monthCells(); track cell.month) {\n            <button\n              type=\"button\"\r\n              class=\"date-picker__month-cell\"\r\n              [class.date-picker__month-cell--selected]=\"isMonthSelected(cell)\"\r\n              (click)=\"selectMonth(cell)\"\r\n            >\r\n              {{ cell.label }}\r\n            </button>\r\n          }\r\n        </div>\r\n      } @else if (mode() === 'quarter') {\r\n        <div class=\"date-picker__quarters\">\r\n          @for (cell of quarterCells(); track cell.quarter) {\r\n            <button\r\n              type=\"button\"\r\n              class=\"date-picker__quarter-cell\"\r\n              [class.date-picker__quarter-cell--selected]=\"isQuarterSelected(cell)\"\r\n              (click)=\"selectQuarter(cell)\"\r\n            >\r\n              {{ cell.label }}\r\n            </button>\r\n          }\r\n        </div>\r\n      } @else {\r\n        <div class=\"date-picker__weekdays s-date-range-picker__week\">\r\n          @for (label of weekDayLabels(); track label) {\r\n            <div class=\"date-picker__weekday\">{{ label }}</div>\r\n          }\r\n        </div>\r\n\r\n        <div\r\n          class=\"date-picker__grid s-date-range-picker__grid\"\r\n          [class.date-picker__grid--range-preview]=\"hasRangePreviewEnd()\"\r\n        >\r\n          @for (row of rows(); track trackByRow($index, row)) {\r\n            <div class=\"date-picker__row\" [class.date-picker__row--selected]=\"isWeekSelected(row)\">\r\n              @for (cell of row.cells; track trackByIso($index, cell)) {\r\n                <button\r\n                  type=\"button\"\r\n                  class=\"date-picker__cell s-date-range-picker__cell s-calendar-cell\"\r\n                  [class.date-picker__cell--muted]=\"!cell.inCurrentMonth\"\r\n                  [class.date-picker__cell--disabled]=\"cell.isDisabled\"\r\n                  [class.date-picker__cell--today]=\"isTodayCell(cell)\"\r\n                  [class.date-picker__cell--selected]=\"isSelected(cell)\"\r\n                  [class.date-picker__cell--week-anchor]=\"isWeekAnchor(cell)\"\r\n                  [class.date-picker__cell--range-start]=\"isRangeStart(cell)\"\r\n                  [class.date-picker__cell--range-end]=\"isRangeEnd(cell)\"\r\n                  [class.date-picker__cell--range-middle]=\"isRangeInBetween(cell)\"\r\n                  [class.s-calendar-cell--outside]=\"!cell.inCurrentMonth\"\r\n                  [class.s-calendar-cell--disabled]=\"cell.isDisabled\"\r\n                  [class.s-calendar-cell--today]=\"isTodayCell(cell)\"\r\n                  [class.s-calendar-cell--selected-start]=\"isRangeStart(cell)\"\r\n                  [class.s-calendar-cell--selected-end]=\"isRangeEnd(cell)\"\r\n                  [class.s-calendar-cell--in-range]=\"isRangeInBetween(cell)\"\r\n                  [disabled]=\"cell.isDisabled\"\r\n                  (click)=\"mode() === 'week' ? selectWeek(row) : selectDate(cell.date)\"\r\n                  (mouseenter)=\"onCellHover(cell.date)\"\r\n                  (mouseleave)=\"onCellHover(null)\"\r\n                >\r\n                  <span class=\"date-picker__cell-label\">{{ cell.label }}</span>\r\n                </button>\r\n              }\r\n            </div>\r\n          }\r\n        </div>\r\n      }\r\n\n      <div class=\"date-picker__footer s-date-range-picker__footer\">\n        <button type=\"button\" class=\"date-picker__today-btn\" (click)=\"selectShortcut()\">\n          {{ shortcutText() }}\n        </button>\n        <div class=\"date-picker__footer-actions\">\n          <button type=\"button\" class=\"date-picker__footer-btn\" (click)=\"cancel()\">{{ cancelText() }}</button>\r\n          <button type=\"button\" class=\"date-picker__footer-btn date-picker__footer-btn--primary\" (click)=\"confirm()\">\r\n            {{ confirmText() }}\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [":host{position:relative;display:inline-block;width:var(--date-picker-width, var(--platform-control-width, 10rem));min-width:var(--date-picker-min-width, var(--platform-control-width, 10rem));max-width:100%;--date-primary: var(--color-primary, #0A84FF);--date-primary-hover: var(--color-primary-hover, #0077E6);--date-primary-active: var(--color-primary-active, #006FD6);--date-primary-soft: var(--calendar-range-bg, rgba(10,132,255,.14));--date-primary-hover-soft: var(--button-primary-soft-bg-hover, rgba(10,132,255,.08));--date-bg: var(--color-surface, #FFFFFF);--date-trigger-bg: var(--platform-control-bg, var(--input-bg, #FFFFFF));--date-border: var(--platform-control-border, var(--input-border, rgba(60,60,67,.1)));--date-border-strong: var(--platform-control-border-hover, var(--input-hover-border, rgba(60,60,67,.16)));--date-text: var(--platform-control-color, var(--input-text, #111827));--date-text-secondary: var(--color-text-secondary, rgba(60,60,67,.68));--date-text-muted: var(--platform-control-placeholder, var(--input-placeholder, rgba(60,60,67,.36)));--date-text-disabled: var(--platform-control-disabled-color, var(--input-disabled-text, rgba(60,60,67,.22)));--date-shadow: var(--shadow-common-l, 0 12px 32px rgba(0,0,0,.12));--date-trigger-height: var(--platform-control-height, var(--input-height, 32px));--date-trigger-radius: var(--platform-control-radius, var(--input-radius, 8px));--date-trigger-padding-x: var(--platform-control-padding-x, var(--input-padding-x, 12px));--date-trigger-min-width: var(--platform-control-range-width, 15rem);--date-panel-size: 252px;--date-panel-radius: 12px;--date-header-height: 32px;--date-week-height: 24px;--date-grid-height: 140px;--date-footer-height: 44px;--date-cell-height: 28px;--date-cell-dot-size: 28px;--date-button-width: 56px;--date-button-height: 32px;--date-button-radius: 8px;--date-picker-height: var(--date-trigger-height);--date-picker-radius: var(--date-trigger-radius);--date-picker-padding-x: var(--date-trigger-padding-x);--date-picker-indicator-offset: var(--date-trigger-padding-x);--date-picker-panel-padding-x: 12px;--date-picker-range-bg: var(--date-primary-soft);--calendar-selected-bg: var(--date-primary);--calendar-muted-color: rgba(60,60,67,.28)}:host(.date-picker-host--open){z-index:1000}:host([mode=range]),:host(.date-picker-host--range){width:var(--date-picker-range-width, var(--date-trigger-min-width));min-width:var(--date-picker-range-min-width, var(--date-trigger-min-width))}.date-picker{position:relative;display:inline-flex;flex-direction:column;width:100%}.date-picker__trigger,.date-picker__header,.date-picker__weekdays,.date-picker__grid,.date-picker__years,.date-picker__months,.date-picker__quarters,.date-picker__cell,.date-picker__footer,.date-picker__footer-btn,.date-picker__year-cell,.date-picker__month-cell,.date-picker__quarter-cell{box-sizing:border-box}.date-picker__trigger{position:relative;width:100%;min-width:0;height:var(--date-picker-height);padding:0 calc(var(--date-picker-indicator-offset) + 20px) 0 var(--date-picker-padding-x);border:1px solid var(--date-border);border-radius:var(--date-picker-radius);background:var(--date-trigger-bg);color:var(--date-text);display:inline-flex;align-items:center;cursor:pointer;transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease}.date-picker__trigger:hover{background:var(--platform-control-bg-hover, var(--date-bg));border-color:var(--date-border-strong)}.date-picker__trigger:focus-visible{outline:0;border-color:var(--platform-control-focus, var(--date-primary));box-shadow:0 0 0 2px var(--platform-control-focus-ring, rgba(10, 132, 255, .16))}.date-picker__value{flex:1;min-width:0;overflow:hidden;color:var(--date-text);font-size:var(--platform-control-font-size, var(--input-font-size, 13px));font-weight:400;line-height:var(--platform-control-line-height, 20px);letter-spacing:0;text-align:left;text-overflow:ellipsis;white-space:nowrap}.date-picker__value--placeholder,.date-picker__range-separator{color:var(--date-text-muted)}.date-picker__value--range{display:inline-flex;align-items:center;justify-content:space-between;gap:8px;width:100%;white-space:nowrap}.date-picker__range-part{flex:0 1 auto;min-width:0;overflow:hidden;color:var(--date-text);text-overflow:ellipsis}.date-picker__range-part--placeholder{color:var(--date-text-muted)}.date-picker__range-separator{flex:0 0 auto}.date-picker__trigger-icon,.date-picker__nav-btn,.date-picker__weekday,.date-picker__cell,.date-picker__cell-label,.date-picker__year-cell,.date-picker__month-cell,.date-picker__quarter-cell,.date-picker__footer,.date-picker__today-btn,.date-picker__footer-actions,.date-picker__footer-btn{display:inline-flex;align-items:center;justify-content:center}.date-picker__trigger-icon{position:absolute;top:50%;right:var(--date-picker-indicator-offset);width:16px;height:16px;color:var(--date-text-muted);pointer-events:none;line-height:0;transform:translateY(-50%)}.date-picker__trigger-icon svg{width:12px;height:12px}.date-picker__trigger-icon--clear{pointer-events:auto;color:var(--date-text-secondary);cursor:pointer}.date-picker__trigger-icon--clear:hover{color:var(--date-text)}.date-picker__panel{position:fixed;width:var(--date-panel-size);height:var(--date-panel-size);overflow:hidden;border:1px solid var(--date-border);border-radius:var(--date-panel-radius);background:var(--date-bg);box-shadow:var(--date-shadow);z-index:1000}.date-picker__header,.date-picker__weekdays,.date-picker__grid{padding-right:var(--date-picker-panel-padding-x);padding-left:var(--date-picker-panel-padding-x)}.date-picker__header{display:grid;grid-template-columns:24px minmax(0,1fr) 24px;align-items:center;height:var(--date-header-height)}.date-picker__title{min-width:0;overflow:hidden;color:var(--date-text);font-size:16px;font-weight:600;line-height:22px;text-align:center;text-overflow:ellipsis;white-space:nowrap}.date-picker__nav-btn{width:24px;height:24px;padding:0;border:0;border-radius:6px;background:transparent;color:var(--date-text-secondary);cursor:pointer}.date-picker__nav-btn:hover{background:#3c3c430f;color:var(--date-text)}.date-picker__nav-btn:active{background:#3c3c431a}.date-picker__nav-btn:disabled{opacity:.35;cursor:default}.date-picker__nav-btn i-lucide{display:block}.date-picker__nav-btn svg{display:block;width:14px;height:14px}.date-picker__weekdays{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));height:var(--date-week-height);margin-top:4px}.date-picker__weekday{height:100%;color:var(--date-text-muted);font-size:12px;font-weight:400;line-height:1}.date-picker__grid{display:flex;flex-direction:column;height:var(--date-grid-height);margin-bottom:8px}.date-picker__row{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));flex:1 1 0;min-height:0}.date-picker__row--selected{background:var(--date-picker-range-bg)}.date-picker__cell{position:relative;isolation:isolate;width:100%;height:100%;min-width:0;min-height:0;padding:0;border:0;border-radius:0;background:transparent;color:var(--date-text);font-size:14px;font-weight:400;line-height:1;cursor:pointer}.date-picker__cell:before{content:\"\";position:absolute;top:50%;right:0;left:0;height:min(var(--date-cell-height),100%);background:transparent;transform:translateY(-50%);z-index:0}.date-picker__cell-label{position:relative;z-index:1;height:min(var(--date-cell-dot-size),100%);aspect-ratio:1;border-radius:8px}.date-picker__cell:hover:not(:disabled):not(.date-picker__cell--selected):not(.date-picker__cell--range-start):not(.date-picker__cell--range-end) .date-picker__cell-label{background:var(--date-primary-hover-soft);color:var(--date-primary)}.date-picker__cell--muted{color:var(--calendar-muted-color)}.date-picker__cell--today .date-picker__cell-label,.date-picker__cell--week-anchor .date-picker__cell-label{border-radius:999px;color:var(--date-primary);box-shadow:inset 0 0 0 1px var(--date-primary)}.date-picker__cell--selected .date-picker__cell-label,.date-picker__cell--range-start .date-picker__cell-label,.date-picker__cell--range-end .date-picker__cell-label{border-radius:999px;background:var(--calendar-selected-bg);color:#fff;box-shadow:none}.date-picker__grid--range-preview .date-picker__cell--range-start:before,.date-picker__grid--range-preview .date-picker__cell--range-end:before,.date-picker__cell--range-middle:before{background:var(--date-picker-range-bg)}.date-picker__cell--range-middle{color:var(--date-primary)}.date-picker__grid--range-preview .date-picker__cell--range-start:before{left:50%}.date-picker__grid--range-preview .date-picker__cell--range-end:before{right:50%}.date-picker__cell--disabled,.date-picker__cell:disabled{color:var(--date-text-disabled);cursor:not-allowed}.date-picker__cell--disabled .date-picker__cell-label,.date-picker__cell:disabled .date-picker__cell-label{background:transparent;color:var(--date-text-disabled);box-shadow:none}.date-picker__years,.date-picker__months,.date-picker__quarters{display:grid;align-content:center;height:calc(var(--date-panel-size) - var(--date-header-height) - var(--date-footer-height));gap:8px;padding:8px var(--date-picker-panel-padding-x)}.date-picker__years,.date-picker__months{grid-template-columns:repeat(3,minmax(0,1fr))}.date-picker__quarters{grid-template-columns:repeat(4,minmax(0,1fr))}.date-picker__year-cell,.date-picker__month-cell,.date-picker__quarter-cell{height:32px;padding:0;border:0;background:transparent;color:var(--date-text);font-size:14px;line-height:1;cursor:pointer}.date-picker__year-cell:hover,.date-picker__month-cell:hover,.date-picker__quarter-cell:hover{background:var(--date-primary-hover-soft);color:var(--date-primary)}.date-picker__year-cell,.date-picker__month-cell{border-radius:8px}.date-picker__quarter-cell{border-radius:999px}.date-picker__year-cell--selected{background:var(--date-primary);color:#fff}.date-picker__month-cell--selected{background:var(--date-primary-soft);color:var(--date-primary)}.date-picker__quarter-cell--selected{background:var(--date-primary);color:#fff}.date-picker__footer{display:flex;width:100%;height:var(--date-footer-height);padding:0 var(--date-picker-panel-padding-x);border-top:1px solid var(--date-border);justify-content:space-between}.date-picker__today-btn{height:var(--date-button-height);padding:0 8px;border:0;border-radius:var(--date-button-radius);background:transparent;color:var(--date-primary);font-size:14px;font-weight:500;line-height:1;cursor:pointer}.date-picker__today-btn:hover{background:var(--date-primary-hover-soft)}.date-picker__footer-actions{gap:8px}.date-picker__footer-btn{width:var(--date-button-width);height:var(--date-button-height);padding:0;border:1px solid var(--date-border-strong);border-radius:var(--date-button-radius);background:#fff;color:var(--date-text);font-size:14px;font-weight:500;line-height:1;cursor:pointer}.date-picker__footer-btn:hover{background:#f8fafc}.date-picker__footer-btn--primary{border-color:transparent;background:var(--date-primary);color:#fff}.date-picker__footer-btn--primary:hover{background:var(--date-primary-hover)}.date-picker__footer-btn--primary:active{background:var(--date-primary-active)}.date-picker--disabled .date-picker__trigger{opacity:.6;cursor:default;background:var(--date-trigger-bg)}\n"], dependencies: [{ kind: "ngmodule", type: LucideAngularModule }, { kind: "component", type: i1.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: DatePicker, decorators: [{
             type: Component,
@@ -3338,16 +4012,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
                         '(window:resize)': 'onWindowResize()',
                         '[class.date-picker-host--range]': "mode() === 'range'",
                         '[class.date-picker-host--open]': 'isOpen()',
-                    }, template: "<div\r\n  class=\"date-picker s-date-range-picker\"\r\n  [class.date-picker--disabled]=\"disabled()\"\r\n  [class.s-date-range-picker--range]=\"mode() === 'range'\"\r\n>\r\n  <button\r\n    type=\"button\"\r\n    class=\"date-picker__trigger s-date-range-picker__trigger\"\r\n    [disabled]=\"disabled()\"\r\n    (click)=\"toggle()\"\r\n  >\r\n    <span\r\n      class=\"date-picker__value\"\r\n      [class.date-picker__value--placeholder]=\"mode() !== 'range' && !displayValue()\"\r\n      [class.date-picker__value--range]=\"mode() === 'range'\"\r\n    >\r\n      @if (mode() === 'range') {\r\n        <span class=\"date-picker__range-part\" [class.date-picker__range-part--placeholder]=\"!rangeValue()?.start\">\r\n          {{ rangeValue()?.start ? displayValue().split(' ' + rangeSeparator() + ' ')[0] : startPlaceholder() }}\r\n        </span>\r\n        <span class=\"date-picker__range-separator\">{{ rangeSeparator() }}</span>\r\n        <span class=\"date-picker__range-part\" [class.date-picker__range-part--placeholder]=\"!rangeValue()?.end\">\r\n          {{ rangeValue()?.end ? displayValue().split(' ' + rangeSeparator() + ' ')[1] : endPlaceholder() }}\r\n        </span>\r\n      } @else {\r\n        {{ displayValue() || placeholder() }}\r\n      }\r\n    </span>\r\n    @if (shouldShowClear()) {\r\n      <span\r\n        class=\"date-picker__trigger-icon date-picker__trigger-icon--clear\"\r\n        role=\"button\"\r\n        tabindex=\"-1\"\r\n        aria-label=\"\u6E05\u7A7A\u65E5\u671F\"\r\n        (click)=\"clearSelection($event)\"\r\n      >\r\n        <i-lucide [img]=\"clearIcon\" [size]=\"iconSize()\"></i-lucide>\r\n      </span>\r\n    } @else {\r\n      <span class=\"date-picker__trigger-icon\" aria-hidden=\"true\">\r\n        <i-lucide [img]=\"calendarIcon\" [size]=\"iconSize()\"></i-lucide>\r\n      </span>\r\n    }\r\n  </button>\r\n\r\n  @if (isOpen()) {\r\n    <div\r\n      class=\"date-picker__panel s-date-range-picker__panel\"\r\n      [style.top.px]=\"panelPosition().top\"\r\n      [style.left.px]=\"panelPosition().left\"\r\n    >\r\n      <div class=\"date-picker__header s-date-range-picker__header\">\r\n        <button type=\"button\" class=\"date-picker__nav-btn\" (click)=\"prev()\" aria-label=\"\u4E0A\u4E00\u4E2A\u6708\">\r\n          <i-lucide [img]=\"prevIcon\"></i-lucide>\r\n        </button>\r\n        <div class=\"date-picker__title\">{{ title() }}</div>\r\n        <button type=\"button\" class=\"date-picker__nav-btn\" (click)=\"next()\" aria-label=\"\u4E0B\u4E00\u4E2A\u6708\">\r\n          <i-lucide [img]=\"nextIcon\"></i-lucide>\r\n        </button>\r\n      </div>\r\n\r\n      @if (mode() === 'month') {\r\n        <div class=\"date-picker__months\">\r\n          @for (cell of monthCells(); track cell.month) {\r\n            <button\r\n              type=\"button\"\r\n              class=\"date-picker__month-cell\"\r\n              [class.date-picker__month-cell--selected]=\"isMonthSelected(cell)\"\r\n              (click)=\"selectMonth(cell)\"\r\n            >\r\n              {{ cell.label }}\r\n            </button>\r\n          }\r\n        </div>\r\n      } @else if (mode() === 'quarter') {\r\n        <div class=\"date-picker__quarters\">\r\n          @for (cell of quarterCells(); track cell.quarter) {\r\n            <button\r\n              type=\"button\"\r\n              class=\"date-picker__quarter-cell\"\r\n              [class.date-picker__quarter-cell--selected]=\"isQuarterSelected(cell)\"\r\n              (click)=\"selectQuarter(cell)\"\r\n            >\r\n              {{ cell.label }}\r\n            </button>\r\n          }\r\n        </div>\r\n      } @else {\r\n        <div class=\"date-picker__weekdays s-date-range-picker__week\">\r\n          @for (label of weekDayLabels(); track label) {\r\n            <div class=\"date-picker__weekday\">{{ label }}</div>\r\n          }\r\n        </div>\r\n\r\n        <div\r\n          class=\"date-picker__grid s-date-range-picker__grid\"\r\n          [class.date-picker__grid--range-preview]=\"hasRangePreviewEnd()\"\r\n        >\r\n          @for (row of rows(); track trackByRow($index, row)) {\r\n            <div class=\"date-picker__row\" [class.date-picker__row--selected]=\"isWeekSelected(row)\">\r\n              @for (cell of row.cells; track trackByIso($index, cell)) {\r\n                <button\r\n                  type=\"button\"\r\n                  class=\"date-picker__cell s-date-range-picker__cell s-calendar-cell\"\r\n                  [class.date-picker__cell--muted]=\"!cell.inCurrentMonth\"\r\n                  [class.date-picker__cell--disabled]=\"cell.isDisabled\"\r\n                  [class.date-picker__cell--today]=\"isTodayCell(cell)\"\r\n                  [class.date-picker__cell--selected]=\"isSelected(cell)\"\r\n                  [class.date-picker__cell--week-anchor]=\"isWeekAnchor(cell)\"\r\n                  [class.date-picker__cell--range-start]=\"isRangeStart(cell)\"\r\n                  [class.date-picker__cell--range-end]=\"isRangeEnd(cell)\"\r\n                  [class.date-picker__cell--range-middle]=\"isRangeInBetween(cell)\"\r\n                  [class.s-calendar-cell--outside]=\"!cell.inCurrentMonth\"\r\n                  [class.s-calendar-cell--disabled]=\"cell.isDisabled\"\r\n                  [class.s-calendar-cell--today]=\"isTodayCell(cell)\"\r\n                  [class.s-calendar-cell--selected-start]=\"isRangeStart(cell)\"\r\n                  [class.s-calendar-cell--selected-end]=\"isRangeEnd(cell)\"\r\n                  [class.s-calendar-cell--in-range]=\"isRangeInBetween(cell)\"\r\n                  [disabled]=\"cell.isDisabled\"\r\n                  (click)=\"mode() === 'week' ? selectWeek(row) : selectDate(cell.date)\"\r\n                  (mouseenter)=\"onCellHover(cell.date)\"\r\n                  (mouseleave)=\"onCellHover(null)\"\r\n                >\r\n                  <span class=\"date-picker__cell-label\">{{ cell.label }}</span>\r\n                </button>\r\n              }\r\n            </div>\r\n          }\r\n        </div>\r\n      }\r\n\r\n      <div class=\"date-picker__footer s-date-range-picker__footer\">\r\n        <button type=\"button\" class=\"date-picker__today-btn\" (click)=\"selectToday()\">\r\n          {{ todayText() }}\r\n        </button>\r\n        <div class=\"date-picker__footer-actions\">\r\n          <button type=\"button\" class=\"date-picker__footer-btn\" (click)=\"cancel()\">{{ cancelText() }}</button>\r\n          <button type=\"button\" class=\"date-picker__footer-btn date-picker__footer-btn--primary\" (click)=\"confirm()\">\r\n            {{ confirmText() }}\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [":host{position:relative;display:inline-block;width:var(--date-picker-width, var(--platform-control-width, 10rem));min-width:var(--date-picker-min-width, var(--platform-control-width, 10rem));max-width:100%;--date-primary: #0A84FF;--date-primary-hover: #0077E6;--date-primary-active: #006FD6;--date-primary-soft: rgba(10,132,255,.14);--date-primary-hover-soft: rgba(10,132,255,.08);--date-bg: #FFFFFF;--date-trigger-bg: #F8FAFC;--date-border: rgba(60,60,67,.1);--date-border-strong: rgba(60,60,67,.16);--date-text: #111827;--date-text-secondary: rgba(60,60,67,.68);--date-text-muted: rgba(60,60,67,.36);--date-text-disabled: rgba(60,60,67,.22);--date-shadow: 0 12px 32px rgba(0,0,0,.12);--date-trigger-height: 36px;--date-trigger-radius: 10px;--date-trigger-padding-x: 12px;--date-trigger-min-width: 252px;--date-panel-size: 252px;--date-panel-radius: 12px;--date-header-height: 32px;--date-week-height: 24px;--date-grid-height: 140px;--date-footer-height: 44px;--date-cell-height: 28px;--date-cell-dot-size: 28px;--date-button-width: 56px;--date-button-height: 32px;--date-button-radius: 8px;--date-picker-height: var(--date-trigger-height);--date-picker-radius: var(--date-trigger-radius);--date-picker-padding-x: var(--date-trigger-padding-x);--date-picker-indicator-offset: var(--date-trigger-padding-x);--date-picker-panel-padding-x: 12px;--date-picker-range-bg: var(--date-primary-soft);--calendar-selected-bg: var(--date-primary);--calendar-muted-color: rgba(60,60,67,.28)}:host(.date-picker-host--open){z-index:1000}:host([mode=range]),:host(.date-picker-host--range){width:var(--date-picker-range-width, var(--date-trigger-min-width));min-width:var(--date-picker-range-min-width, var(--date-trigger-min-width))}.date-picker{position:relative;display:inline-flex;flex-direction:column;width:100%}.date-picker__trigger,.date-picker__header,.date-picker__weekdays,.date-picker__grid,.date-picker__months,.date-picker__quarters,.date-picker__cell,.date-picker__footer,.date-picker__footer-btn,.date-picker__month-cell,.date-picker__quarter-cell{box-sizing:border-box}.date-picker__trigger{position:relative;width:100%;min-width:0;height:var(--date-picker-height);padding:0 calc(var(--date-picker-indicator-offset) + 20px) 0 var(--date-picker-padding-x);border:1px solid rgba(60,60,67,.14);border-radius:var(--date-picker-radius);background:var(--date-trigger-bg);color:var(--date-text);display:inline-flex;align-items:center;cursor:pointer;transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease}.date-picker__trigger:hover{background:#fff;border-color:var(--date-border-strong)}.date-picker__trigger:focus-visible{outline:0;border-color:var(--date-primary);box-shadow:0 0 0 3px #0a84ff29}.date-picker__value{flex:1;min-width:0;overflow:hidden;color:var(--date-text);font-size:14px;font-weight:400;line-height:20px;letter-spacing:0;text-align:left;text-overflow:ellipsis;white-space:nowrap}.date-picker__value--placeholder,.date-picker__range-part--placeholder,.date-picker__range-separator{color:var(--date-text-muted)}.date-picker__value--range{display:inline-flex;align-items:center;justify-content:space-between;gap:8px;width:100%;white-space:nowrap}.date-picker__range-part{flex:0 1 auto;min-width:0;overflow:hidden;color:var(--date-text);text-overflow:ellipsis}.date-picker__range-separator{flex:0 0 auto}.date-picker__trigger-icon,.date-picker__nav-btn,.date-picker__weekday,.date-picker__cell,.date-picker__cell-label,.date-picker__month-cell,.date-picker__quarter-cell,.date-picker__footer,.date-picker__today-btn,.date-picker__footer-actions,.date-picker__footer-btn{display:inline-flex;align-items:center;justify-content:center}.date-picker__trigger-icon{position:absolute;top:50%;right:var(--date-picker-indicator-offset);width:16px;height:16px;color:var(--date-text-muted);pointer-events:none;line-height:0;transform:translateY(-50%)}.date-picker__trigger-icon svg{width:12px;height:12px}.date-picker__trigger-icon--clear{pointer-events:auto;color:var(--date-text-secondary);cursor:pointer}.date-picker__trigger-icon--clear:hover{color:var(--date-text)}.date-picker__panel{position:fixed;width:var(--date-panel-size);height:var(--date-panel-size);overflow:hidden;border:1px solid var(--date-border);border-radius:var(--date-panel-radius);background:var(--date-bg);box-shadow:var(--date-shadow);z-index:1000}.date-picker__header,.date-picker__weekdays,.date-picker__grid{padding-right:var(--date-picker-panel-padding-x);padding-left:var(--date-picker-panel-padding-x)}.date-picker__header{display:grid;grid-template-columns:24px minmax(0,1fr) 24px;align-items:center;height:var(--date-header-height)}.date-picker__title{min-width:0;overflow:hidden;color:var(--date-text);font-size:16px;font-weight:600;line-height:22px;text-align:center;text-overflow:ellipsis;white-space:nowrap}.date-picker__nav-btn{width:24px;height:24px;padding:0;border:0;border-radius:6px;background:transparent;color:var(--date-text-secondary);cursor:pointer}.date-picker__nav-btn:hover{background:#3c3c430f;color:var(--date-text)}.date-picker__nav-btn:active{background:#3c3c431a}.date-picker__nav-btn:disabled{opacity:.35;cursor:default}.date-picker__nav-btn i-lucide{display:block}.date-picker__nav-btn svg{display:block;width:14px;height:14px}.date-picker__weekdays{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));height:var(--date-week-height);margin-top:4px}.date-picker__weekday{height:100%;color:var(--date-text-muted);font-size:12px;font-weight:400;line-height:1}.date-picker__grid{display:flex;flex-direction:column;height:var(--date-grid-height);margin-bottom:8px}.date-picker__row{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));flex:1 1 0;min-height:0}.date-picker__row--selected{background:var(--date-picker-range-bg)}.date-picker__cell{position:relative;isolation:isolate;width:100%;height:100%;min-width:0;min-height:0;padding:0;border:0;border-radius:0;background:transparent;color:var(--date-text);font-size:14px;font-weight:400;line-height:1;cursor:pointer}.date-picker__cell:before{content:\"\";position:absolute;top:50%;right:0;left:0;height:min(var(--date-cell-height),100%);background:transparent;transform:translateY(-50%);z-index:0}.date-picker__cell-label{position:relative;z-index:1;height:min(var(--date-cell-dot-size),100%);aspect-ratio:1;border-radius:8px}.date-picker__cell:hover:not(:disabled):not(.date-picker__cell--selected):not(.date-picker__cell--range-start):not(.date-picker__cell--range-end) .date-picker__cell-label{background:var(--date-primary-hover-soft);color:var(--date-primary)}.date-picker__cell--muted{color:var(--calendar-muted-color)}.date-picker__cell--today .date-picker__cell-label,.date-picker__cell--week-anchor .date-picker__cell-label{border-radius:999px;color:var(--date-primary);box-shadow:inset 0 0 0 1px var(--date-primary)}.date-picker__cell--selected .date-picker__cell-label,.date-picker__cell--range-start .date-picker__cell-label,.date-picker__cell--range-end .date-picker__cell-label{border-radius:999px;background:var(--calendar-selected-bg);color:#fff;box-shadow:none}.date-picker__grid--range-preview .date-picker__cell--range-start:before,.date-picker__grid--range-preview .date-picker__cell--range-end:before,.date-picker__cell--range-middle:before{background:var(--date-picker-range-bg)}.date-picker__cell--range-middle{color:var(--date-primary)}.date-picker__grid--range-preview .date-picker__cell--range-start:before{left:50%}.date-picker__grid--range-preview .date-picker__cell--range-end:before{right:50%}.date-picker__cell--disabled,.date-picker__cell:disabled{color:var(--date-text-disabled);cursor:not-allowed}.date-picker__cell--disabled .date-picker__cell-label,.date-picker__cell:disabled .date-picker__cell-label{background:transparent;color:var(--date-text-disabled);box-shadow:none}.date-picker__months,.date-picker__quarters{display:grid;align-content:center;height:calc(var(--date-panel-size) - var(--date-header-height) - var(--date-footer-height));gap:8px;padding:8px var(--date-picker-panel-padding-x)}.date-picker__months{grid-template-columns:repeat(3,minmax(0,1fr))}.date-picker__quarters{grid-template-columns:repeat(4,minmax(0,1fr))}.date-picker__month-cell,.date-picker__quarter-cell{height:32px;padding:0;border:0;background:transparent;color:var(--date-text);font-size:14px;line-height:1;cursor:pointer}.date-picker__month-cell:hover,.date-picker__quarter-cell:hover{background:var(--date-primary-hover-soft);color:var(--date-primary)}.date-picker__month-cell{border-radius:8px}.date-picker__quarter-cell{border-radius:999px}.date-picker__month-cell--selected{background:var(--date-primary-soft);color:var(--date-primary)}.date-picker__quarter-cell--selected{background:var(--date-primary);color:#fff}.date-picker__footer{display:flex;width:100%;height:var(--date-footer-height);padding:0 var(--date-picker-panel-padding-x);border-top:1px solid var(--date-border);justify-content:space-between}.date-picker__today-btn{height:var(--date-button-height);padding:0 8px;border:0;border-radius:var(--date-button-radius);background:transparent;color:var(--date-primary);font-size:14px;font-weight:500;line-height:1;cursor:pointer}.date-picker__today-btn:hover{background:var(--date-primary-hover-soft)}.date-picker__footer-actions{gap:8px}.date-picker__footer-btn{width:var(--date-button-width);height:var(--date-button-height);padding:0;border:1px solid var(--date-border-strong);border-radius:var(--date-button-radius);background:#fff;color:var(--date-text);font-size:14px;font-weight:500;line-height:1;cursor:pointer}.date-picker__footer-btn:hover{background:#f8fafc}.date-picker__footer-btn--primary{border-color:transparent;background:var(--date-primary);color:#fff}.date-picker__footer-btn--primary:hover{background:var(--date-primary-hover)}.date-picker__footer-btn--primary:active{background:var(--date-primary-active)}.date-picker--disabled .date-picker__trigger{opacity:.6;cursor:default;background:var(--date-trigger-bg)}\n"] }]
+                    }, template: "<div\r\n  class=\"date-picker s-date-range-picker\"\r\n  [class.date-picker--disabled]=\"disabled()\"\r\n  [class.s-date-range-picker--range]=\"mode() === 'range'\"\r\n>\r\n  <button\r\n    type=\"button\"\r\n    class=\"date-picker__trigger s-date-range-picker__trigger\"\r\n    [disabled]=\"disabled()\"\r\n    (click)=\"toggle()\"\r\n  >\r\n    <span\r\n      class=\"date-picker__value\"\r\n      [class.date-picker__value--placeholder]=\"mode() !== 'range' && !displayValue()\"\r\n      [class.date-picker__value--range]=\"mode() === 'range'\"\r\n    >\r\n      @if (mode() === 'range') {\r\n        <span class=\"date-picker__range-part\" [class.date-picker__range-part--placeholder]=\"!rangeValue()?.start\">\r\n          {{ rangeValue()?.start ? displayValue().split(' ' + rangeSeparator() + ' ')[0] : startPlaceholder() }}\r\n        </span>\r\n        <span class=\"date-picker__range-separator\">{{ rangeSeparator() }}</span>\r\n        <span class=\"date-picker__range-part\" [class.date-picker__range-part--placeholder]=\"!rangeValue()?.end\">\r\n          {{ rangeValue()?.end ? displayValue().split(' ' + rangeSeparator() + ' ')[1] : endPlaceholder() }}\r\n        </span>\r\n      } @else {\r\n        {{ displayValue() || placeholder() }}\r\n      }\r\n    </span>\r\n    @if (shouldShowClear()) {\r\n      <span\r\n        class=\"date-picker__trigger-icon date-picker__trigger-icon--clear\"\r\n        role=\"button\"\r\n        tabindex=\"-1\"\r\n        aria-label=\"\u6E05\u7A7A\u65E5\u671F\"\r\n        (click)=\"clearSelection($event)\"\r\n      >\r\n        <i-lucide [img]=\"clearIcon\" [size]=\"iconSize()\"></i-lucide>\r\n      </span>\r\n    } @else {\r\n      <span class=\"date-picker__trigger-icon\" aria-hidden=\"true\">\r\n        <i-lucide [img]=\"calendarIcon\" [size]=\"iconSize()\"></i-lucide>\r\n      </span>\r\n    }\r\n  </button>\r\n\r\n  @if (isOpen()) {\r\n    <div\r\n      class=\"date-picker__panel s-date-range-picker__panel\"\r\n      [style.top.px]=\"panelPosition().top\"\r\n      [style.left.px]=\"panelPosition().left\"\n    >\n      <div class=\"date-picker__header s-date-range-picker__header\">\n        <button type=\"button\" class=\"date-picker__nav-btn\" (click)=\"prev()\" [attr.aria-label]=\"previousPanelLabel()\">\n          <i-lucide [img]=\"prevIcon\"></i-lucide>\n        </button>\n        <div class=\"date-picker__title\">{{ title() }}</div>\n        <button type=\"button\" class=\"date-picker__nav-btn\" (click)=\"next()\" [attr.aria-label]=\"nextPanelLabel()\">\n          <i-lucide [img]=\"nextIcon\"></i-lucide>\n        </button>\n      </div>\n\n      @if (mode() === 'year') {\n        <div class=\"date-picker__years\">\n          @for (cell of yearCells(); track cell.year) {\n            <button\n              type=\"button\"\n              class=\"date-picker__year-cell\"\n              [class.date-picker__year-cell--selected]=\"isYearSelected(cell)\"\n              (click)=\"selectYear(cell)\"\n            >\n              {{ cell.label }}\n            </button>\n          }\n        </div>\n      } @else if (mode() === 'month') {\n        <div class=\"date-picker__months\">\n          @for (cell of monthCells(); track cell.month) {\n            <button\n              type=\"button\"\r\n              class=\"date-picker__month-cell\"\r\n              [class.date-picker__month-cell--selected]=\"isMonthSelected(cell)\"\r\n              (click)=\"selectMonth(cell)\"\r\n            >\r\n              {{ cell.label }}\r\n            </button>\r\n          }\r\n        </div>\r\n      } @else if (mode() === 'quarter') {\r\n        <div class=\"date-picker__quarters\">\r\n          @for (cell of quarterCells(); track cell.quarter) {\r\n            <button\r\n              type=\"button\"\r\n              class=\"date-picker__quarter-cell\"\r\n              [class.date-picker__quarter-cell--selected]=\"isQuarterSelected(cell)\"\r\n              (click)=\"selectQuarter(cell)\"\r\n            >\r\n              {{ cell.label }}\r\n            </button>\r\n          }\r\n        </div>\r\n      } @else {\r\n        <div class=\"date-picker__weekdays s-date-range-picker__week\">\r\n          @for (label of weekDayLabels(); track label) {\r\n            <div class=\"date-picker__weekday\">{{ label }}</div>\r\n          }\r\n        </div>\r\n\r\n        <div\r\n          class=\"date-picker__grid s-date-range-picker__grid\"\r\n          [class.date-picker__grid--range-preview]=\"hasRangePreviewEnd()\"\r\n        >\r\n          @for (row of rows(); track trackByRow($index, row)) {\r\n            <div class=\"date-picker__row\" [class.date-picker__row--selected]=\"isWeekSelected(row)\">\r\n              @for (cell of row.cells; track trackByIso($index, cell)) {\r\n                <button\r\n                  type=\"button\"\r\n                  class=\"date-picker__cell s-date-range-picker__cell s-calendar-cell\"\r\n                  [class.date-picker__cell--muted]=\"!cell.inCurrentMonth\"\r\n                  [class.date-picker__cell--disabled]=\"cell.isDisabled\"\r\n                  [class.date-picker__cell--today]=\"isTodayCell(cell)\"\r\n                  [class.date-picker__cell--selected]=\"isSelected(cell)\"\r\n                  [class.date-picker__cell--week-anchor]=\"isWeekAnchor(cell)\"\r\n                  [class.date-picker__cell--range-start]=\"isRangeStart(cell)\"\r\n                  [class.date-picker__cell--range-end]=\"isRangeEnd(cell)\"\r\n                  [class.date-picker__cell--range-middle]=\"isRangeInBetween(cell)\"\r\n                  [class.s-calendar-cell--outside]=\"!cell.inCurrentMonth\"\r\n                  [class.s-calendar-cell--disabled]=\"cell.isDisabled\"\r\n                  [class.s-calendar-cell--today]=\"isTodayCell(cell)\"\r\n                  [class.s-calendar-cell--selected-start]=\"isRangeStart(cell)\"\r\n                  [class.s-calendar-cell--selected-end]=\"isRangeEnd(cell)\"\r\n                  [class.s-calendar-cell--in-range]=\"isRangeInBetween(cell)\"\r\n                  [disabled]=\"cell.isDisabled\"\r\n                  (click)=\"mode() === 'week' ? selectWeek(row) : selectDate(cell.date)\"\r\n                  (mouseenter)=\"onCellHover(cell.date)\"\r\n                  (mouseleave)=\"onCellHover(null)\"\r\n                >\r\n                  <span class=\"date-picker__cell-label\">{{ cell.label }}</span>\r\n                </button>\r\n              }\r\n            </div>\r\n          }\r\n        </div>\r\n      }\r\n\n      <div class=\"date-picker__footer s-date-range-picker__footer\">\n        <button type=\"button\" class=\"date-picker__today-btn\" (click)=\"selectShortcut()\">\n          {{ shortcutText() }}\n        </button>\n        <div class=\"date-picker__footer-actions\">\n          <button type=\"button\" class=\"date-picker__footer-btn\" (click)=\"cancel()\">{{ cancelText() }}</button>\r\n          <button type=\"button\" class=\"date-picker__footer-btn date-picker__footer-btn--primary\" (click)=\"confirm()\">\r\n            {{ confirmText() }}\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [":host{position:relative;display:inline-block;width:var(--date-picker-width, var(--platform-control-width, 10rem));min-width:var(--date-picker-min-width, var(--platform-control-width, 10rem));max-width:100%;--date-primary: var(--color-primary, #0A84FF);--date-primary-hover: var(--color-primary-hover, #0077E6);--date-primary-active: var(--color-primary-active, #006FD6);--date-primary-soft: var(--calendar-range-bg, rgba(10,132,255,.14));--date-primary-hover-soft: var(--button-primary-soft-bg-hover, rgba(10,132,255,.08));--date-bg: var(--color-surface, #FFFFFF);--date-trigger-bg: var(--platform-control-bg, var(--input-bg, #FFFFFF));--date-border: var(--platform-control-border, var(--input-border, rgba(60,60,67,.1)));--date-border-strong: var(--platform-control-border-hover, var(--input-hover-border, rgba(60,60,67,.16)));--date-text: var(--platform-control-color, var(--input-text, #111827));--date-text-secondary: var(--color-text-secondary, rgba(60,60,67,.68));--date-text-muted: var(--platform-control-placeholder, var(--input-placeholder, rgba(60,60,67,.36)));--date-text-disabled: var(--platform-control-disabled-color, var(--input-disabled-text, rgba(60,60,67,.22)));--date-shadow: var(--shadow-common-l, 0 12px 32px rgba(0,0,0,.12));--date-trigger-height: var(--platform-control-height, var(--input-height, 32px));--date-trigger-radius: var(--platform-control-radius, var(--input-radius, 8px));--date-trigger-padding-x: var(--platform-control-padding-x, var(--input-padding-x, 12px));--date-trigger-min-width: var(--platform-control-range-width, 15rem);--date-panel-size: 252px;--date-panel-radius: 12px;--date-header-height: 32px;--date-week-height: 24px;--date-grid-height: 140px;--date-footer-height: 44px;--date-cell-height: 28px;--date-cell-dot-size: 28px;--date-button-width: 56px;--date-button-height: 32px;--date-button-radius: 8px;--date-picker-height: var(--date-trigger-height);--date-picker-radius: var(--date-trigger-radius);--date-picker-padding-x: var(--date-trigger-padding-x);--date-picker-indicator-offset: var(--date-trigger-padding-x);--date-picker-panel-padding-x: 12px;--date-picker-range-bg: var(--date-primary-soft);--calendar-selected-bg: var(--date-primary);--calendar-muted-color: rgba(60,60,67,.28)}:host(.date-picker-host--open){z-index:1000}:host([mode=range]),:host(.date-picker-host--range){width:var(--date-picker-range-width, var(--date-trigger-min-width));min-width:var(--date-picker-range-min-width, var(--date-trigger-min-width))}.date-picker{position:relative;display:inline-flex;flex-direction:column;width:100%}.date-picker__trigger,.date-picker__header,.date-picker__weekdays,.date-picker__grid,.date-picker__years,.date-picker__months,.date-picker__quarters,.date-picker__cell,.date-picker__footer,.date-picker__footer-btn,.date-picker__year-cell,.date-picker__month-cell,.date-picker__quarter-cell{box-sizing:border-box}.date-picker__trigger{position:relative;width:100%;min-width:0;height:var(--date-picker-height);padding:0 calc(var(--date-picker-indicator-offset) + 20px) 0 var(--date-picker-padding-x);border:1px solid var(--date-border);border-radius:var(--date-picker-radius);background:var(--date-trigger-bg);color:var(--date-text);display:inline-flex;align-items:center;cursor:pointer;transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease}.date-picker__trigger:hover{background:var(--platform-control-bg-hover, var(--date-bg));border-color:var(--date-border-strong)}.date-picker__trigger:focus-visible{outline:0;border-color:var(--platform-control-focus, var(--date-primary));box-shadow:0 0 0 2px var(--platform-control-focus-ring, rgba(10, 132, 255, .16))}.date-picker__value{flex:1;min-width:0;overflow:hidden;color:var(--date-text);font-size:var(--platform-control-font-size, var(--input-font-size, 13px));font-weight:400;line-height:var(--platform-control-line-height, 20px);letter-spacing:0;text-align:left;text-overflow:ellipsis;white-space:nowrap}.date-picker__value--placeholder,.date-picker__range-separator{color:var(--date-text-muted)}.date-picker__value--range{display:inline-flex;align-items:center;justify-content:space-between;gap:8px;width:100%;white-space:nowrap}.date-picker__range-part{flex:0 1 auto;min-width:0;overflow:hidden;color:var(--date-text);text-overflow:ellipsis}.date-picker__range-part--placeholder{color:var(--date-text-muted)}.date-picker__range-separator{flex:0 0 auto}.date-picker__trigger-icon,.date-picker__nav-btn,.date-picker__weekday,.date-picker__cell,.date-picker__cell-label,.date-picker__year-cell,.date-picker__month-cell,.date-picker__quarter-cell,.date-picker__footer,.date-picker__today-btn,.date-picker__footer-actions,.date-picker__footer-btn{display:inline-flex;align-items:center;justify-content:center}.date-picker__trigger-icon{position:absolute;top:50%;right:var(--date-picker-indicator-offset);width:16px;height:16px;color:var(--date-text-muted);pointer-events:none;line-height:0;transform:translateY(-50%)}.date-picker__trigger-icon svg{width:12px;height:12px}.date-picker__trigger-icon--clear{pointer-events:auto;color:var(--date-text-secondary);cursor:pointer}.date-picker__trigger-icon--clear:hover{color:var(--date-text)}.date-picker__panel{position:fixed;width:var(--date-panel-size);height:var(--date-panel-size);overflow:hidden;border:1px solid var(--date-border);border-radius:var(--date-panel-radius);background:var(--date-bg);box-shadow:var(--date-shadow);z-index:1000}.date-picker__header,.date-picker__weekdays,.date-picker__grid{padding-right:var(--date-picker-panel-padding-x);padding-left:var(--date-picker-panel-padding-x)}.date-picker__header{display:grid;grid-template-columns:24px minmax(0,1fr) 24px;align-items:center;height:var(--date-header-height)}.date-picker__title{min-width:0;overflow:hidden;color:var(--date-text);font-size:16px;font-weight:600;line-height:22px;text-align:center;text-overflow:ellipsis;white-space:nowrap}.date-picker__nav-btn{width:24px;height:24px;padding:0;border:0;border-radius:6px;background:transparent;color:var(--date-text-secondary);cursor:pointer}.date-picker__nav-btn:hover{background:#3c3c430f;color:var(--date-text)}.date-picker__nav-btn:active{background:#3c3c431a}.date-picker__nav-btn:disabled{opacity:.35;cursor:default}.date-picker__nav-btn i-lucide{display:block}.date-picker__nav-btn svg{display:block;width:14px;height:14px}.date-picker__weekdays{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));height:var(--date-week-height);margin-top:4px}.date-picker__weekday{height:100%;color:var(--date-text-muted);font-size:12px;font-weight:400;line-height:1}.date-picker__grid{display:flex;flex-direction:column;height:var(--date-grid-height);margin-bottom:8px}.date-picker__row{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));flex:1 1 0;min-height:0}.date-picker__row--selected{background:var(--date-picker-range-bg)}.date-picker__cell{position:relative;isolation:isolate;width:100%;height:100%;min-width:0;min-height:0;padding:0;border:0;border-radius:0;background:transparent;color:var(--date-text);font-size:14px;font-weight:400;line-height:1;cursor:pointer}.date-picker__cell:before{content:\"\";position:absolute;top:50%;right:0;left:0;height:min(var(--date-cell-height),100%);background:transparent;transform:translateY(-50%);z-index:0}.date-picker__cell-label{position:relative;z-index:1;height:min(var(--date-cell-dot-size),100%);aspect-ratio:1;border-radius:8px}.date-picker__cell:hover:not(:disabled):not(.date-picker__cell--selected):not(.date-picker__cell--range-start):not(.date-picker__cell--range-end) .date-picker__cell-label{background:var(--date-primary-hover-soft);color:var(--date-primary)}.date-picker__cell--muted{color:var(--calendar-muted-color)}.date-picker__cell--today .date-picker__cell-label,.date-picker__cell--week-anchor .date-picker__cell-label{border-radius:999px;color:var(--date-primary);box-shadow:inset 0 0 0 1px var(--date-primary)}.date-picker__cell--selected .date-picker__cell-label,.date-picker__cell--range-start .date-picker__cell-label,.date-picker__cell--range-end .date-picker__cell-label{border-radius:999px;background:var(--calendar-selected-bg);color:#fff;box-shadow:none}.date-picker__grid--range-preview .date-picker__cell--range-start:before,.date-picker__grid--range-preview .date-picker__cell--range-end:before,.date-picker__cell--range-middle:before{background:var(--date-picker-range-bg)}.date-picker__cell--range-middle{color:var(--date-primary)}.date-picker__grid--range-preview .date-picker__cell--range-start:before{left:50%}.date-picker__grid--range-preview .date-picker__cell--range-end:before{right:50%}.date-picker__cell--disabled,.date-picker__cell:disabled{color:var(--date-text-disabled);cursor:not-allowed}.date-picker__cell--disabled .date-picker__cell-label,.date-picker__cell:disabled .date-picker__cell-label{background:transparent;color:var(--date-text-disabled);box-shadow:none}.date-picker__years,.date-picker__months,.date-picker__quarters{display:grid;align-content:center;height:calc(var(--date-panel-size) - var(--date-header-height) - var(--date-footer-height));gap:8px;padding:8px var(--date-picker-panel-padding-x)}.date-picker__years,.date-picker__months{grid-template-columns:repeat(3,minmax(0,1fr))}.date-picker__quarters{grid-template-columns:repeat(4,minmax(0,1fr))}.date-picker__year-cell,.date-picker__month-cell,.date-picker__quarter-cell{height:32px;padding:0;border:0;background:transparent;color:var(--date-text);font-size:14px;line-height:1;cursor:pointer}.date-picker__year-cell:hover,.date-picker__month-cell:hover,.date-picker__quarter-cell:hover{background:var(--date-primary-hover-soft);color:var(--date-primary)}.date-picker__year-cell,.date-picker__month-cell{border-radius:8px}.date-picker__quarter-cell{border-radius:999px}.date-picker__year-cell--selected{background:var(--date-primary);color:#fff}.date-picker__month-cell--selected{background:var(--date-primary-soft);color:var(--date-primary)}.date-picker__quarter-cell--selected{background:var(--date-primary);color:#fff}.date-picker__footer{display:flex;width:100%;height:var(--date-footer-height);padding:0 var(--date-picker-panel-padding-x);border-top:1px solid var(--date-border);justify-content:space-between}.date-picker__today-btn{height:var(--date-button-height);padding:0 8px;border:0;border-radius:var(--date-button-radius);background:transparent;color:var(--date-primary);font-size:14px;font-weight:500;line-height:1;cursor:pointer}.date-picker__today-btn:hover{background:var(--date-primary-hover-soft)}.date-picker__footer-actions{gap:8px}.date-picker__footer-btn{width:var(--date-button-width);height:var(--date-button-height);padding:0;border:1px solid var(--date-border-strong);border-radius:var(--date-button-radius);background:#fff;color:var(--date-text);font-size:14px;font-weight:500;line-height:1;cursor:pointer}.date-picker__footer-btn:hover{background:#f8fafc}.date-picker__footer-btn--primary{border-color:transparent;background:var(--date-primary);color:#fff}.date-picker__footer-btn--primary:hover{background:var(--date-primary-hover)}.date-picker__footer-btn--primary:active{background:var(--date-primary-active)}.date-picker--disabled .date-picker__trigger{opacity:.6;cursor:default;background:var(--date-trigger-bg)}\n"] }]
         }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], rangeValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "rangeValue", required: false }] }, { type: i0.Output, args: ["rangeValueChange"] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], rangeSeparator: [{ type: i0.Input, args: [{ isSignal: true, alias: "rangeSeparator", required: false }] }], locale: [{ type: i0.Input, args: [{ isSignal: true, alias: "locale", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], minDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "minDate", required: false }] }], maxDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxDate", required: false }] }], confirmText: [{ type: i0.Input, args: [{ isSignal: true, alias: "confirmText", required: false }] }], cancelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "cancelText", required: false }] }], todayText: [{ type: i0.Input, args: [{ isSignal: true, alias: "todayText", required: false }] }], thisYearText: [{ type: i0.Input, args: [{ isSignal: true, alias: "thisYearText", required: false }] }], startPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "startPlaceholder", required: false }] }], endPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "endPlaceholder", required: false }] }], iconSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconSize", required: false }] }], weekDayLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "weekDayLabels", required: false }] }] } });
 
 class PlatformDrawerForm {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PlatformDrawerForm, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.8", type: PlatformDrawerForm, isStandalone: true, selector: "platform-drawer-form", ngImport: i0, template: '<ng-content />', isInline: true, styles: ["platform-drawer-form{min-height:100%;width:100%;max-width:100%;min-width:0;box-sizing:border-box;display:flex;flex-direction:column;overflow-x:hidden;background:var(--color-surface)}platform-drawer-form form,platform-drawer-form .platform-drawer-form__native{display:contents}platform-drawer-section{display:block;min-width:0}platform-drawer-section>.platform-drawer-section__title{min-height:32px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 20px;background:#f8fafc;color:#667085;font-size:12px;font-weight:400;line-height:1}platform-drawer-section>.platform-drawer-section__title.platform-drawer-section__title--muted{justify-content:flex-start}platform-drawer-section>.platform-drawer-section__title button,platform-drawer-section>.platform-drawer-section__title [platformDrawerSectionAction]{padding:0;border:0;background:transparent;color:var(--color-primary);font-size:12px;line-height:1;cursor:pointer}platform-drawer-section>.platform-drawer-section__content{display:grid;grid-template-columns:1fr;gap:0;padding:18px 20px 2px}platform-drawer-section>.platform-drawer-section__content.platform-drawer-section__content--plain{display:block;padding:18px 20px}platform-drawer-field{display:block;min-width:0}platform-drawer-field>.platform-drawer-field{min-width:0;display:grid;gap:7px;align-items:start;margin-bottom:16px;padding:0}platform-drawer-field>.platform-drawer-field.platform-drawer-field--full{grid-column:auto}platform-drawer-field>.platform-drawer-field.platform-drawer-field--invalid input,platform-drawer-field>.platform-drawer-field.platform-drawer-field--invalid textarea{border-color:#ff4d4f}platform-drawer-field>.platform-drawer-field.platform-drawer-field--switch{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:12px}platform-drawer-field>.platform-drawer-field textarea{min-height:80px;height:auto;padding:8px 10px;resize:vertical;line-height:1.4}platform-drawer-field .platform-drawer-field__label{color:#4b5563;font-size:13px;font-weight:400;line-height:1.4}platform-drawer-field .platform-drawer-field__label em{color:#ef4444;font-style:normal}platform-drawer-field .platform-drawer-field__switch-copy{min-width:0;display:grid;gap:2px}platform-drawer-field .platform-drawer-field__switch-copy>span{color:#4b5563;font-size:13px}platform-drawer-field .platform-drawer-field__switch-copy>small{color:#b6bdc8;font-size:12px;line-height:1.4}platform-drawer-error{display:block;color:#ff4d4f;font-size:12px;line-height:1.4}platform-drawer-error>.platform-drawer-error{display:block;color:inherit;font-size:inherit;line-height:inherit}platform-prefixed-input{position:relative;width:100%;min-width:0;display:block}platform-prefixed-input input{padding-left:3.25rem}platform-prefixed-input>.platform-prefixed-input__prefix{position:absolute;top:50%;left:.75rem;z-index:1;transform:translateY(-50%);color:#8a919f;font-family:inherit;font-size:13px;font-weight:400;line-height:normal;pointer-events:none;white-space:nowrap;-webkit-user-select:none;user-select:none}platform-drawer-checkbox-group{display:flex;flex-wrap:wrap;gap:.5rem .75rem}platform-drawer-checkbox-group.platform-drawer-checkbox-group--panel{max-height:14rem;overflow:auto;display:grid;grid-template-columns:1fr;gap:.125rem;padding:.5rem;border:1px solid #d9dee7;border-radius:.25rem;background:#fbfcfe}platform-drawer-checkbox{display:inline-flex;align-items:center;gap:.375rem;color:#1f2329;font-size:13px;line-height:1.4;cursor:pointer}platform-drawer-checkbox>.platform-drawer-checkbox{display:inline-flex;align-items:center;gap:.375rem;color:#1f2329;font-size:13px;line-height:1.4;cursor:pointer}platform-drawer-empty{display:block;color:#8a919f;font-size:13px}platform-drawer-table{min-width:0;max-height:var(--platform-drawer-table-max-height, 24rem);min-height:0;display:block;overflow:auto;border:1px solid var(--color-divider);border-radius:4px}platform-drawer-table table{width:100%;min-width:var(--platform-drawer-table-min-width, 36rem);border-collapse:collapse}platform-drawer-input-action{position:relative;width:100%;min-width:0;display:block}platform-drawer-input-action input{padding-right:2.5rem}platform-drawer-input-action>.platform-drawer-input-action__button{position:absolute;top:50%;right:.375rem;width:1.75rem;height:1.75rem;display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;color:#8a919f;cursor:pointer;transform:translateY(-50%)}platform-drawer-input-action>.platform-drawer-input-action__button:hover,platform-drawer-input-action>.platform-drawer-input-action__button:focus-visible{color:#1677ff;outline:none}platform-switch{position:relative;display:inline-flex;align-items:center;cursor:pointer}platform-switch>.platform-switch__input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}platform-switch>.platform-switch__input:checked+.platform-switch__track{border-color:#1677ff;background:#1677ff}platform-switch>.platform-switch__input:checked+.platform-switch__track .platform-switch__thumb{border-color:#fff;transform:translate(18px)}platform-switch>.platform-switch__track{width:46px;height:28px;border:1px solid #c6ccd3;border-radius:999px;display:inline-flex;align-items:center;padding:0 2px;box-sizing:border-box;background:#d7dbe0;transition:background-color .2s ease}platform-switch .platform-switch__thumb{width:22px;height:22px;border:1px solid #c7ced7;border-radius:999px;background:#fff;box-shadow:0 1px 2px #0f172a2e;transform:translate(0);transition:transform .2s ease}platform-switch.platform-switch--disabled>.platform-switch__track{opacity:.7}platform-drawer-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:24px;margin:0;padding:4px 20px 12px;color:var(--color-text-secondary);font-size:13px}platform-drawer-toolbar label{display:inline-flex;align-items:center;gap:6px;margin:0;white-space:nowrap}platform-drawer-tree{max-height:388px;min-width:0;overflow:auto;display:block;margin:0 20px;padding:.5rem .75rem;border:1px solid var(--color-divider);border-radius:.25rem}platform-drawer-tree-item{display:block}platform-drawer-tree-item>.platform-drawer-tree-item{min-height:2rem;min-width:0;display:flex;align-items:center;gap:.5rem;color:var(--color-text-primary);font-size:14px}platform-drawer-tree-item>.platform-drawer-tree-item .platform-drawer-tree-toggle{width:1rem;height:1rem;display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;color:var(--color-text-disabled);font-size:12px;line-height:1;cursor:pointer}platform-drawer-tree-item>.platform-drawer-tree-item .platform-drawer-tree-toggle.platform-drawer-tree-toggle--hidden{visibility:hidden;pointer-events:none}platform-drawer-component-bar{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 56px;gap:8px;align-items:center;padding:4px 20px 12px}platform-drawer-component-bar button{width:56px;min-width:56px;height:32px;padding:0}platform-drawer-component-list{min-width:0;display:block;margin:0 20px;border:1px solid var(--color-divider);border-radius:.25rem}platform-drawer-component-item{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:.75rem;align-items:center;padding:.625rem .75rem;border-bottom:1px solid var(--color-divider);color:var(--color-text-primary);font-size:14px}platform-drawer-component-item>span{min-width:0;overflow-wrap:anywhere}platform-drawer-component-item:last-child{border-bottom:0}platform-drawer-footer{display:flex;justify-content:flex-end;gap:8px;margin-top:auto;padding:10px 20px;border-top:1px solid #edf1f5;background:var(--color-surface)}platform-drawer-footer button{min-width:58px;height:32px;padding:0 10px;border-radius:3px;font-size:13px}platform-drawer-footer .primary{border-color:#1677ff;background:#1677ff;color:#fff}@media(max-width:640px){platform-drawer-component-bar,platform-drawer-component-item{grid-template-columns:1fr}platform-drawer-footer{justify-content:stretch}platform-drawer-footer>button{flex:1 1 auto}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.8", type: PlatformDrawerForm, isStandalone: true, selector: "platform-drawer-form", ngImport: i0, template: '<ng-content />', isInline: true, styles: ["@charset \"UTF-8\";platform-drawer-form{min-height:100%;width:100%;max-width:100%;min-width:0;box-sizing:border-box;display:flex;flex-direction:column;overflow-x:hidden;background:var(--color-surface)}platform-drawer-form form,platform-drawer-form .platform-drawer-form__native{display:contents}platform-drawer-section{display:block;min-width:0}platform-drawer-section>.platform-drawer-section__title{min-height:32px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 20px;background:#f8fafc;color:#667085;font-size:12px;font-weight:400;line-height:1}platform-drawer-section>.platform-drawer-section__title.platform-drawer-section__title--muted{justify-content:flex-start}platform-drawer-section>.platform-drawer-section__title button,platform-drawer-section>.platform-drawer-section__title [platformDrawerSectionAction]{padding:0;border:0;background:transparent;color:var(--color-primary);font-size:12px;line-height:1;cursor:pointer}platform-drawer-section>.platform-drawer-section__content{display:grid;grid-template-columns:1fr;gap:0;padding:18px 20px 2px}platform-drawer-section>.platform-drawer-section__content.platform-drawer-section__content--plain{display:block;padding:18px 20px}platform-drawer-field{display:block;min-width:0}platform-drawer-field>.platform-drawer-field{min-width:0;display:grid;gap:7px;align-items:start;margin-bottom:16px;padding:0}platform-drawer-field>.platform-drawer-field.platform-drawer-field--full{grid-column:auto}platform-drawer-field>.platform-drawer-field.platform-drawer-field--invalid input,platform-drawer-field>.platform-drawer-field.platform-drawer-field--invalid textarea{border-color:#ff4d4f}platform-drawer-field>.platform-drawer-field.platform-drawer-field--switch{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:12px}platform-drawer-field>.platform-drawer-field textarea{min-height:80px;height:auto;padding:8px 10px;resize:vertical;line-height:1.4}platform-drawer-field .platform-drawer-field__label{color:#4b5563;font-size:13px;font-weight:400;line-height:1.4}platform-drawer-field .platform-drawer-field__label em{color:#ef4444;font-style:normal}platform-drawer-field .platform-drawer-field__switch-copy{min-width:0;display:grid;gap:2px}platform-drawer-field .platform-drawer-field__switch-copy>span{color:#4b5563;font-size:13px}platform-drawer-field .platform-drawer-field__switch-copy>small{color:#b6bdc8;font-size:12px;line-height:1.4}platform-drawer-error{display:block;color:#ff4d4f;font-size:12px;line-height:1.4}platform-drawer-error>.platform-drawer-error{display:block;color:inherit;font-size:inherit;line-height:inherit}platform-prefixed-input{position:relative;width:100%;min-width:0;display:block}platform-prefixed-input input{padding-left:3.25rem}platform-prefixed-input>.platform-prefixed-input__prefix{position:absolute;top:50%;left:.75rem;z-index:1;transform:translateY(-50%);color:#8a919f;font-family:inherit;font-size:13px;font-weight:400;line-height:normal;pointer-events:none;white-space:nowrap;-webkit-user-select:none;user-select:none}platform-drawer-checkbox-group{display:flex;flex-wrap:wrap;gap:.5rem .75rem}platform-drawer-checkbox-group.platform-drawer-checkbox-group--panel{max-height:14rem;overflow:auto;display:grid;grid-template-columns:1fr;gap:.125rem;padding:.5rem;border:1px solid #d9dee7;border-radius:.25rem;background:#fbfcfe}platform-drawer-checkbox{display:inline-flex;align-items:center;gap:.375rem;color:#1f2329;font-size:13px;line-height:1.4;cursor:pointer}platform-drawer-checkbox>.platform-drawer-checkbox{display:inline-flex;align-items:center;gap:.375rem;color:#1f2329;font-size:13px;line-height:1.4;cursor:pointer}platform-drawer-empty{display:block;color:#8a919f;font-size:13px}platform-drawer-table{min-width:0;max-height:var(--platform-drawer-table-max-height, 24rem);min-height:0;display:block;overflow:auto;border:1px solid var(--color-divider);border-radius:4px}platform-drawer-table table{width:100%;min-width:var(--platform-drawer-table-min-width, 36rem);border-collapse:collapse}platform-drawer-input-action{position:relative;width:100%;min-width:0;display:block}platform-drawer-input-action input{padding-right:2.5rem}platform-drawer-input-action>.platform-drawer-input-action__button{position:absolute;top:50%;right:.375rem;width:1.75rem;height:1.75rem;display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;color:#8a919f;cursor:pointer;transform:translateY(-50%)}platform-drawer-input-action>.platform-drawer-input-action__button:hover,platform-drawer-input-action>.platform-drawer-input-action__button:focus-visible{color:#1677ff;outline:none}platform-drawer-input-action:has(>.platform-drawer-input-action__button[aria-label*=\\9009\\62e9]){display:grid;grid-template-columns:32px minmax(0,1fr);align-items:stretch}platform-drawer-input-action:has(>.platform-drawer-input-action__button[aria-label*=\\9009\\62e9]) input{order:2;padding-right:10px;border-radius:0 4px 4px 0;cursor:pointer}platform-drawer-input-action:has(>.platform-drawer-input-action__button[aria-label*=\\9009\\62e9])>.platform-drawer-input-action__button{position:static;order:1;width:32px;height:32px;border:1px solid #dfe5ec;border-right:0;border-radius:4px 0 0 4px;background:#fff;color:#667085;transform:none}platform-switch{position:relative;display:inline-flex;align-items:center;cursor:pointer}platform-switch>.platform-switch__input{position:absolute;top:0;left:0;z-index:1;width:46px;height:28px;margin:0;opacity:0;pointer-events:none}platform-switch>.platform-switch__input:checked+.platform-switch__track{border-color:#1677ff;background:#1677ff}platform-switch>.platform-switch__input:checked+.platform-switch__track .platform-switch__thumb{border-color:#fff;transform:translate(18px)}platform-switch>.platform-switch__track{width:46px;height:28px;border:1px solid #c6ccd3;border-radius:999px;display:inline-flex;align-items:center;padding:0 2px;box-sizing:border-box;background:#d7dbe0;transition:background-color .2s ease}platform-switch .platform-switch__thumb{width:22px;height:22px;border:1px solid #c7ced7;border-radius:999px;background:#fff;box-shadow:0 1px 2px #0f172a2e;transform:translate(0);transition:transform .2s ease}platform-switch.platform-switch--disabled>.platform-switch__track{opacity:.7}platform-drawer-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:24px;margin:0;padding:4px 20px 12px;color:var(--color-text-secondary);font-size:13px}platform-drawer-toolbar label{display:inline-flex;align-items:center;gap:6px;margin:0;white-space:nowrap}platform-drawer-tree{max-height:388px;min-width:0;overflow:auto;display:block;margin:0 20px;padding:.5rem .75rem;border:1px solid var(--color-divider);border-radius:.25rem}platform-drawer-tree-item{display:block}platform-drawer-tree-item>.platform-drawer-tree-item{min-height:2rem;min-width:0;display:flex;align-items:center;gap:.5rem;color:var(--color-text-primary);font-size:14px}platform-drawer-tree-item>.platform-drawer-tree-item .platform-drawer-tree-toggle{width:1rem;height:1rem;display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;color:var(--color-text-disabled);font-size:12px;line-height:1;cursor:pointer}platform-drawer-tree-item>.platform-drawer-tree-item .platform-drawer-tree-toggle.platform-drawer-tree-toggle--hidden{visibility:hidden;pointer-events:none}platform-drawer-component-bar{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 56px;gap:8px;align-items:center;padding:4px 20px 12px}platform-drawer-component-bar button{width:56px;min-width:56px;height:32px;padding:0}platform-drawer-component-list{min-width:0;display:block;margin:0 20px;border:1px solid var(--color-divider);border-radius:.25rem}platform-drawer-component-item{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:.75rem;align-items:center;padding:.625rem .75rem;border-bottom:1px solid var(--color-divider);color:var(--color-text-primary);font-size:14px}platform-drawer-component-item>span{min-width:0;overflow-wrap:anywhere}platform-drawer-component-item:last-child{border-bottom:0}platform-drawer-footer{display:flex;justify-content:flex-end;gap:8px;margin-top:auto;padding:10px 20px;border-top:1px solid #edf1f5;background:var(--color-surface)}platform-drawer-footer button{min-width:58px;height:32px;padding:0 10px;border-radius:3px;font-size:13px}platform-drawer-footer .primary{border-color:#1677ff;background:#1677ff;color:#fff}@media(max-width:640px){platform-drawer-component-bar,platform-drawer-component-item{grid-template-columns:1fr}platform-drawer-footer{justify-content:stretch}platform-drawer-footer>button{flex:1 1 auto}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PlatformDrawerForm, decorators: [{
             type: Component,
-            args: [{ selector: 'platform-drawer-form', template: '<ng-content />', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: ["platform-drawer-form{min-height:100%;width:100%;max-width:100%;min-width:0;box-sizing:border-box;display:flex;flex-direction:column;overflow-x:hidden;background:var(--color-surface)}platform-drawer-form form,platform-drawer-form .platform-drawer-form__native{display:contents}platform-drawer-section{display:block;min-width:0}platform-drawer-section>.platform-drawer-section__title{min-height:32px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 20px;background:#f8fafc;color:#667085;font-size:12px;font-weight:400;line-height:1}platform-drawer-section>.platform-drawer-section__title.platform-drawer-section__title--muted{justify-content:flex-start}platform-drawer-section>.platform-drawer-section__title button,platform-drawer-section>.platform-drawer-section__title [platformDrawerSectionAction]{padding:0;border:0;background:transparent;color:var(--color-primary);font-size:12px;line-height:1;cursor:pointer}platform-drawer-section>.platform-drawer-section__content{display:grid;grid-template-columns:1fr;gap:0;padding:18px 20px 2px}platform-drawer-section>.platform-drawer-section__content.platform-drawer-section__content--plain{display:block;padding:18px 20px}platform-drawer-field{display:block;min-width:0}platform-drawer-field>.platform-drawer-field{min-width:0;display:grid;gap:7px;align-items:start;margin-bottom:16px;padding:0}platform-drawer-field>.platform-drawer-field.platform-drawer-field--full{grid-column:auto}platform-drawer-field>.platform-drawer-field.platform-drawer-field--invalid input,platform-drawer-field>.platform-drawer-field.platform-drawer-field--invalid textarea{border-color:#ff4d4f}platform-drawer-field>.platform-drawer-field.platform-drawer-field--switch{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:12px}platform-drawer-field>.platform-drawer-field textarea{min-height:80px;height:auto;padding:8px 10px;resize:vertical;line-height:1.4}platform-drawer-field .platform-drawer-field__label{color:#4b5563;font-size:13px;font-weight:400;line-height:1.4}platform-drawer-field .platform-drawer-field__label em{color:#ef4444;font-style:normal}platform-drawer-field .platform-drawer-field__switch-copy{min-width:0;display:grid;gap:2px}platform-drawer-field .platform-drawer-field__switch-copy>span{color:#4b5563;font-size:13px}platform-drawer-field .platform-drawer-field__switch-copy>small{color:#b6bdc8;font-size:12px;line-height:1.4}platform-drawer-error{display:block;color:#ff4d4f;font-size:12px;line-height:1.4}platform-drawer-error>.platform-drawer-error{display:block;color:inherit;font-size:inherit;line-height:inherit}platform-prefixed-input{position:relative;width:100%;min-width:0;display:block}platform-prefixed-input input{padding-left:3.25rem}platform-prefixed-input>.platform-prefixed-input__prefix{position:absolute;top:50%;left:.75rem;z-index:1;transform:translateY(-50%);color:#8a919f;font-family:inherit;font-size:13px;font-weight:400;line-height:normal;pointer-events:none;white-space:nowrap;-webkit-user-select:none;user-select:none}platform-drawer-checkbox-group{display:flex;flex-wrap:wrap;gap:.5rem .75rem}platform-drawer-checkbox-group.platform-drawer-checkbox-group--panel{max-height:14rem;overflow:auto;display:grid;grid-template-columns:1fr;gap:.125rem;padding:.5rem;border:1px solid #d9dee7;border-radius:.25rem;background:#fbfcfe}platform-drawer-checkbox{display:inline-flex;align-items:center;gap:.375rem;color:#1f2329;font-size:13px;line-height:1.4;cursor:pointer}platform-drawer-checkbox>.platform-drawer-checkbox{display:inline-flex;align-items:center;gap:.375rem;color:#1f2329;font-size:13px;line-height:1.4;cursor:pointer}platform-drawer-empty{display:block;color:#8a919f;font-size:13px}platform-drawer-table{min-width:0;max-height:var(--platform-drawer-table-max-height, 24rem);min-height:0;display:block;overflow:auto;border:1px solid var(--color-divider);border-radius:4px}platform-drawer-table table{width:100%;min-width:var(--platform-drawer-table-min-width, 36rem);border-collapse:collapse}platform-drawer-input-action{position:relative;width:100%;min-width:0;display:block}platform-drawer-input-action input{padding-right:2.5rem}platform-drawer-input-action>.platform-drawer-input-action__button{position:absolute;top:50%;right:.375rem;width:1.75rem;height:1.75rem;display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;color:#8a919f;cursor:pointer;transform:translateY(-50%)}platform-drawer-input-action>.platform-drawer-input-action__button:hover,platform-drawer-input-action>.platform-drawer-input-action__button:focus-visible{color:#1677ff;outline:none}platform-switch{position:relative;display:inline-flex;align-items:center;cursor:pointer}platform-switch>.platform-switch__input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}platform-switch>.platform-switch__input:checked+.platform-switch__track{border-color:#1677ff;background:#1677ff}platform-switch>.platform-switch__input:checked+.platform-switch__track .platform-switch__thumb{border-color:#fff;transform:translate(18px)}platform-switch>.platform-switch__track{width:46px;height:28px;border:1px solid #c6ccd3;border-radius:999px;display:inline-flex;align-items:center;padding:0 2px;box-sizing:border-box;background:#d7dbe0;transition:background-color .2s ease}platform-switch .platform-switch__thumb{width:22px;height:22px;border:1px solid #c7ced7;border-radius:999px;background:#fff;box-shadow:0 1px 2px #0f172a2e;transform:translate(0);transition:transform .2s ease}platform-switch.platform-switch--disabled>.platform-switch__track{opacity:.7}platform-drawer-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:24px;margin:0;padding:4px 20px 12px;color:var(--color-text-secondary);font-size:13px}platform-drawer-toolbar label{display:inline-flex;align-items:center;gap:6px;margin:0;white-space:nowrap}platform-drawer-tree{max-height:388px;min-width:0;overflow:auto;display:block;margin:0 20px;padding:.5rem .75rem;border:1px solid var(--color-divider);border-radius:.25rem}platform-drawer-tree-item{display:block}platform-drawer-tree-item>.platform-drawer-tree-item{min-height:2rem;min-width:0;display:flex;align-items:center;gap:.5rem;color:var(--color-text-primary);font-size:14px}platform-drawer-tree-item>.platform-drawer-tree-item .platform-drawer-tree-toggle{width:1rem;height:1rem;display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;color:var(--color-text-disabled);font-size:12px;line-height:1;cursor:pointer}platform-drawer-tree-item>.platform-drawer-tree-item .platform-drawer-tree-toggle.platform-drawer-tree-toggle--hidden{visibility:hidden;pointer-events:none}platform-drawer-component-bar{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 56px;gap:8px;align-items:center;padding:4px 20px 12px}platform-drawer-component-bar button{width:56px;min-width:56px;height:32px;padding:0}platform-drawer-component-list{min-width:0;display:block;margin:0 20px;border:1px solid var(--color-divider);border-radius:.25rem}platform-drawer-component-item{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:.75rem;align-items:center;padding:.625rem .75rem;border-bottom:1px solid var(--color-divider);color:var(--color-text-primary);font-size:14px}platform-drawer-component-item>span{min-width:0;overflow-wrap:anywhere}platform-drawer-component-item:last-child{border-bottom:0}platform-drawer-footer{display:flex;justify-content:flex-end;gap:8px;margin-top:auto;padding:10px 20px;border-top:1px solid #edf1f5;background:var(--color-surface)}platform-drawer-footer button{min-width:58px;height:32px;padding:0 10px;border-radius:3px;font-size:13px}platform-drawer-footer .primary{border-color:#1677ff;background:#1677ff;color:#fff}@media(max-width:640px){platform-drawer-component-bar,platform-drawer-component-item{grid-template-columns:1fr}platform-drawer-footer{justify-content:stretch}platform-drawer-footer>button{flex:1 1 auto}}\n"] }]
+            args: [{ selector: 'platform-drawer-form', template: '<ng-content />', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: ["@charset \"UTF-8\";platform-drawer-form{min-height:100%;width:100%;max-width:100%;min-width:0;box-sizing:border-box;display:flex;flex-direction:column;overflow-x:hidden;background:var(--color-surface)}platform-drawer-form form,platform-drawer-form .platform-drawer-form__native{display:contents}platform-drawer-section{display:block;min-width:0}platform-drawer-section>.platform-drawer-section__title{min-height:32px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 20px;background:#f8fafc;color:#667085;font-size:12px;font-weight:400;line-height:1}platform-drawer-section>.platform-drawer-section__title.platform-drawer-section__title--muted{justify-content:flex-start}platform-drawer-section>.platform-drawer-section__title button,platform-drawer-section>.platform-drawer-section__title [platformDrawerSectionAction]{padding:0;border:0;background:transparent;color:var(--color-primary);font-size:12px;line-height:1;cursor:pointer}platform-drawer-section>.platform-drawer-section__content{display:grid;grid-template-columns:1fr;gap:0;padding:18px 20px 2px}platform-drawer-section>.platform-drawer-section__content.platform-drawer-section__content--plain{display:block;padding:18px 20px}platform-drawer-field{display:block;min-width:0}platform-drawer-field>.platform-drawer-field{min-width:0;display:grid;gap:7px;align-items:start;margin-bottom:16px;padding:0}platform-drawer-field>.platform-drawer-field.platform-drawer-field--full{grid-column:auto}platform-drawer-field>.platform-drawer-field.platform-drawer-field--invalid input,platform-drawer-field>.platform-drawer-field.platform-drawer-field--invalid textarea{border-color:#ff4d4f}platform-drawer-field>.platform-drawer-field.platform-drawer-field--switch{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:12px}platform-drawer-field>.platform-drawer-field textarea{min-height:80px;height:auto;padding:8px 10px;resize:vertical;line-height:1.4}platform-drawer-field .platform-drawer-field__label{color:#4b5563;font-size:13px;font-weight:400;line-height:1.4}platform-drawer-field .platform-drawer-field__label em{color:#ef4444;font-style:normal}platform-drawer-field .platform-drawer-field__switch-copy{min-width:0;display:grid;gap:2px}platform-drawer-field .platform-drawer-field__switch-copy>span{color:#4b5563;font-size:13px}platform-drawer-field .platform-drawer-field__switch-copy>small{color:#b6bdc8;font-size:12px;line-height:1.4}platform-drawer-error{display:block;color:#ff4d4f;font-size:12px;line-height:1.4}platform-drawer-error>.platform-drawer-error{display:block;color:inherit;font-size:inherit;line-height:inherit}platform-prefixed-input{position:relative;width:100%;min-width:0;display:block}platform-prefixed-input input{padding-left:3.25rem}platform-prefixed-input>.platform-prefixed-input__prefix{position:absolute;top:50%;left:.75rem;z-index:1;transform:translateY(-50%);color:#8a919f;font-family:inherit;font-size:13px;font-weight:400;line-height:normal;pointer-events:none;white-space:nowrap;-webkit-user-select:none;user-select:none}platform-drawer-checkbox-group{display:flex;flex-wrap:wrap;gap:.5rem .75rem}platform-drawer-checkbox-group.platform-drawer-checkbox-group--panel{max-height:14rem;overflow:auto;display:grid;grid-template-columns:1fr;gap:.125rem;padding:.5rem;border:1px solid #d9dee7;border-radius:.25rem;background:#fbfcfe}platform-drawer-checkbox{display:inline-flex;align-items:center;gap:.375rem;color:#1f2329;font-size:13px;line-height:1.4;cursor:pointer}platform-drawer-checkbox>.platform-drawer-checkbox{display:inline-flex;align-items:center;gap:.375rem;color:#1f2329;font-size:13px;line-height:1.4;cursor:pointer}platform-drawer-empty{display:block;color:#8a919f;font-size:13px}platform-drawer-table{min-width:0;max-height:var(--platform-drawer-table-max-height, 24rem);min-height:0;display:block;overflow:auto;border:1px solid var(--color-divider);border-radius:4px}platform-drawer-table table{width:100%;min-width:var(--platform-drawer-table-min-width, 36rem);border-collapse:collapse}platform-drawer-input-action{position:relative;width:100%;min-width:0;display:block}platform-drawer-input-action input{padding-right:2.5rem}platform-drawer-input-action>.platform-drawer-input-action__button{position:absolute;top:50%;right:.375rem;width:1.75rem;height:1.75rem;display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;color:#8a919f;cursor:pointer;transform:translateY(-50%)}platform-drawer-input-action>.platform-drawer-input-action__button:hover,platform-drawer-input-action>.platform-drawer-input-action__button:focus-visible{color:#1677ff;outline:none}platform-drawer-input-action:has(>.platform-drawer-input-action__button[aria-label*=\\9009\\62e9]){display:grid;grid-template-columns:32px minmax(0,1fr);align-items:stretch}platform-drawer-input-action:has(>.platform-drawer-input-action__button[aria-label*=\\9009\\62e9]) input{order:2;padding-right:10px;border-radius:0 4px 4px 0;cursor:pointer}platform-drawer-input-action:has(>.platform-drawer-input-action__button[aria-label*=\\9009\\62e9])>.platform-drawer-input-action__button{position:static;order:1;width:32px;height:32px;border:1px solid #dfe5ec;border-right:0;border-radius:4px 0 0 4px;background:#fff;color:#667085;transform:none}platform-switch{position:relative;display:inline-flex;align-items:center;cursor:pointer}platform-switch>.platform-switch__input{position:absolute;top:0;left:0;z-index:1;width:46px;height:28px;margin:0;opacity:0;pointer-events:none}platform-switch>.platform-switch__input:checked+.platform-switch__track{border-color:#1677ff;background:#1677ff}platform-switch>.platform-switch__input:checked+.platform-switch__track .platform-switch__thumb{border-color:#fff;transform:translate(18px)}platform-switch>.platform-switch__track{width:46px;height:28px;border:1px solid #c6ccd3;border-radius:999px;display:inline-flex;align-items:center;padding:0 2px;box-sizing:border-box;background:#d7dbe0;transition:background-color .2s ease}platform-switch .platform-switch__thumb{width:22px;height:22px;border:1px solid #c7ced7;border-radius:999px;background:#fff;box-shadow:0 1px 2px #0f172a2e;transform:translate(0);transition:transform .2s ease}platform-switch.platform-switch--disabled>.platform-switch__track{opacity:.7}platform-drawer-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:24px;margin:0;padding:4px 20px 12px;color:var(--color-text-secondary);font-size:13px}platform-drawer-toolbar label{display:inline-flex;align-items:center;gap:6px;margin:0;white-space:nowrap}platform-drawer-tree{max-height:388px;min-width:0;overflow:auto;display:block;margin:0 20px;padding:.5rem .75rem;border:1px solid var(--color-divider);border-radius:.25rem}platform-drawer-tree-item{display:block}platform-drawer-tree-item>.platform-drawer-tree-item{min-height:2rem;min-width:0;display:flex;align-items:center;gap:.5rem;color:var(--color-text-primary);font-size:14px}platform-drawer-tree-item>.platform-drawer-tree-item .platform-drawer-tree-toggle{width:1rem;height:1rem;display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;color:var(--color-text-disabled);font-size:12px;line-height:1;cursor:pointer}platform-drawer-tree-item>.platform-drawer-tree-item .platform-drawer-tree-toggle.platform-drawer-tree-toggle--hidden{visibility:hidden;pointer-events:none}platform-drawer-component-bar{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 56px;gap:8px;align-items:center;padding:4px 20px 12px}platform-drawer-component-bar button{width:56px;min-width:56px;height:32px;padding:0}platform-drawer-component-list{min-width:0;display:block;margin:0 20px;border:1px solid var(--color-divider);border-radius:.25rem}platform-drawer-component-item{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:.75rem;align-items:center;padding:.625rem .75rem;border-bottom:1px solid var(--color-divider);color:var(--color-text-primary);font-size:14px}platform-drawer-component-item>span{min-width:0;overflow-wrap:anywhere}platform-drawer-component-item:last-child{border-bottom:0}platform-drawer-footer{display:flex;justify-content:flex-end;gap:8px;margin-top:auto;padding:10px 20px;border-top:1px solid #edf1f5;background:var(--color-surface)}platform-drawer-footer button{min-width:58px;height:32px;padding:0 10px;border-radius:3px;font-size:13px}platform-drawer-footer .primary{border-color:#1677ff;background:#1677ff;color:#fff}@media(max-width:640px){platform-drawer-component-bar,platform-drawer-component-item{grid-template-columns:1fr}platform-drawer-footer{justify-content:stretch}platform-drawer-footer>button{flex:1 1 auto}}\n"] }]
         }] });
 class PlatformDrawerSection {
     title = input('', ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
@@ -3700,6 +4374,11 @@ class PlatformSwitch {
             this.handleChange(target.checked);
         }
     }
+    handleTrackClick() {
+        if (this.isDisabled)
+            return;
+        this.handleChange(!this.checked);
+    }
     handleTouched() {
         this.onTouched();
     }
@@ -3720,7 +4399,7 @@ class PlatformSwitch {
       (change)="handleInputChange($event)"
       (blur)="handleTouched()"
     />
-    <span class="platform-switch__track" aria-hidden="true">
+    <span class="platform-switch__track" aria-hidden="true" (click)="handleTrackClick()">
       <span class="platform-switch__thumb"></span>
     </span>
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
@@ -3739,7 +4418,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
       (change)="handleInputChange($event)"
       (blur)="handleTouched()"
     />
-    <span class="platform-switch__track" aria-hidden="true">
+    <span class="platform-switch__track" aria-hidden="true" (click)="handleTrackClick()">
       <span class="platform-switch__thumb"></span>
     </span>
   `,
@@ -3903,11 +4582,11 @@ class EmojiPicker {
         this.tabSelected.emit(value);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: EmojiPicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: EmojiPicker, isStandalone: true, selector: "s-emoji-picker", inputs: { panelId: { classPropertyName: "panelId", publicName: "panelId", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, headerLabel: { classPropertyName: "headerLabel", publicName: "headerLabel", isSignal: true, isRequired: false, transformFunction: null }, gridLabel: { classPropertyName: "gridLabel", publicName: "gridLabel", isSignal: true, isRequired: false, transformFunction: null }, tabsLabel: { classPropertyName: "tabsLabel", publicName: "tabsLabel", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, tabs: { classPropertyName: "tabs", publicName: "tabs", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { emojiSelected: "emojiSelected", tabSelected: "tabSelected" }, ngImport: i0, template: "<section\r\n  [id]=\"panelId()\"\r\n  class=\"emoji-picker\"\r\n  role=\"dialog\"\r\n  [attr.aria-label]=\"ariaLabel()\"\r\n>\r\n  <header class=\"emoji-picker__header\">{{ headerLabel() }}</header>\r\n  <div class=\"emoji-picker__grid\" [attr.aria-label]=\"gridLabel()\">\r\n    @for (emoji of activeOptions(); track emoji.value) {\r\n      <button\r\n        class=\"emoji-picker__item\"\r\n        type=\"button\"\r\n        [attr.aria-label]=\"emoji.label\"\r\n        (click)=\"selectEmoji(emoji.value)\"\r\n      >\r\n        {{ emoji.value }}\r\n      </button>\r\n    }\r\n  </div>\r\n  <footer class=\"emoji-picker__tabs\" [attr.aria-label]=\"tabsLabel()\">\r\n    @for (tab of tabs(); track tab.value) {\r\n      <button\r\n        class=\"emoji-picker__tab\"\r\n        type=\"button\"\r\n        [class.emoji-picker__tab--active]=\"tab.value === activeTab()\"\r\n        [attr.aria-label]=\"tab.label\"\r\n        (click)=\"selectTab(tab.value)\"\r\n      >\r\n        {{ tab.icon }}\r\n      </button>\r\n    }\r\n  </footer>\r\n</section>\r\n", styles: [":host{display:contents}.emoji-picker{position:absolute;left:14px;bottom:60px;z-index:20;display:grid;grid-template-rows:auto minmax(0,1fr) auto;width:min(460px,100% - 28px);max-width:calc(100% - 28px);max-height:min(360px,100vh - 220px);overflow:hidden;border:1px solid #dce7f3;border-radius:8px;background:#fff;box-shadow:0 18px 44px #0f172a29}.emoji-picker__header{padding:12px 16px 8px;color:#667085;font-size:13px;font-weight:700}.emoji-picker__grid{display:grid;grid-template-columns:repeat(10,34px);gap:8px;overflow:auto;padding:8px 14px 12px}.emoji-picker__item{display:grid;place-items:center;width:34px;height:34px;padding:0;border:0;border-radius:7px;background:transparent;font:inherit;font-size:22px;line-height:1;cursor:pointer}.emoji-picker__item:hover{background:#e7f1ff}.emoji-picker__tabs{display:flex;align-items:center;gap:6px;height:48px;padding:0 10px;border-top:1px solid #e6edf5;background:#f7f9fc}.emoji-picker__tab{display:grid;place-items:center;width:50px;height:40px;padding:0;border:0;border-radius:8px;background:transparent;font:inherit;font-size:22px;line-height:1;cursor:pointer}.emoji-picker__tab:hover,.emoji-picker__tab--active{background:#fff;box-shadow:0 1px 6px #0f172a14}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: EmojiPicker, isStandalone: true, selector: "s-emoji-picker", inputs: { panelId: { classPropertyName: "panelId", publicName: "panelId", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, headerLabel: { classPropertyName: "headerLabel", publicName: "headerLabel", isSignal: true, isRequired: false, transformFunction: null }, gridLabel: { classPropertyName: "gridLabel", publicName: "gridLabel", isSignal: true, isRequired: false, transformFunction: null }, tabsLabel: { classPropertyName: "tabsLabel", publicName: "tabsLabel", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, tabs: { classPropertyName: "tabs", publicName: "tabs", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { emojiSelected: "emojiSelected", tabSelected: "tabSelected" }, ngImport: i0, template: "<section\r\n  [id]=\"panelId()\"\r\n  class=\"emoji-picker\"\r\n  role=\"dialog\"\r\n  [attr.aria-label]=\"ariaLabel()\"\r\n>\r\n  <header class=\"emoji-picker__header\">{{ headerLabel() }}</header>\r\n  <div class=\"emoji-picker__grid\" [attr.aria-label]=\"gridLabel()\">\r\n    @for (emoji of activeOptions(); track emoji.value) {\r\n      <button\r\n        class=\"emoji-picker__item\"\r\n        type=\"button\"\r\n        [attr.aria-label]=\"emoji.label\"\r\n        (click)=\"selectEmoji(emoji.value)\"\r\n      >\r\n        {{ emoji.value }}\r\n      </button>\r\n    }\r\n  </div>\r\n  <footer class=\"emoji-picker__tabs\" [attr.aria-label]=\"tabsLabel()\">\r\n    @for (tab of tabs(); track tab.value) {\r\n      <button\r\n        class=\"emoji-picker__tab\"\r\n        type=\"button\"\r\n        [class.emoji-picker__tab--active]=\"tab.value === activeTab()\"\r\n        [attr.aria-label]=\"tab.label\"\r\n        (click)=\"selectTab(tab.value)\"\r\n      >\r\n        {{ tab.icon }}\r\n      </button>\r\n    }\r\n  </footer>\r\n</section>\r\n", styles: [":host{display:contents}.emoji-picker{position:absolute;left:14px;bottom:60px;z-index:998;display:grid;grid-template-rows:auto minmax(0,1fr) auto;width:min(460px,100% - 28px);max-width:calc(100% - 28px);max-height:min(360px,100vh - 220px);overflow:hidden;border:1px solid #dce7f3;border-radius:8px;background:#fff;box-shadow:0 18px 44px #0f172a29}.emoji-picker__header{padding:12px 16px 8px;color:#667085;font-size:13px;font-weight:700}.emoji-picker__grid{display:grid;grid-template-columns:repeat(10,34px);gap:8px;overflow:auto;padding:8px 14px 12px}.emoji-picker__item{display:grid;place-items:center;width:34px;height:34px;padding:0;border:0;border-radius:7px;background:transparent;font:inherit;font-size:22px;line-height:1;cursor:pointer}.emoji-picker__item:hover{background:#e7f1ff}.emoji-picker__tabs{display:flex;align-items:center;gap:6px;height:48px;padding:0 10px;border-top:1px solid #e6edf5;background:#f7f9fc}.emoji-picker__tab{display:grid;place-items:center;width:50px;height:40px;padding:0;border:0;border-radius:8px;background:transparent;font:inherit;font-size:22px;line-height:1;cursor:pointer}.emoji-picker__tab:hover,.emoji-picker__tab--active{background:#fff;box-shadow:0 1px 6px #0f172a14}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: EmojiPicker, decorators: [{
             type: Component,
-            args: [{ selector: 's-emoji-picker', changeDetection: ChangeDetectionStrategy.OnPush, template: "<section\r\n  [id]=\"panelId()\"\r\n  class=\"emoji-picker\"\r\n  role=\"dialog\"\r\n  [attr.aria-label]=\"ariaLabel()\"\r\n>\r\n  <header class=\"emoji-picker__header\">{{ headerLabel() }}</header>\r\n  <div class=\"emoji-picker__grid\" [attr.aria-label]=\"gridLabel()\">\r\n    @for (emoji of activeOptions(); track emoji.value) {\r\n      <button\r\n        class=\"emoji-picker__item\"\r\n        type=\"button\"\r\n        [attr.aria-label]=\"emoji.label\"\r\n        (click)=\"selectEmoji(emoji.value)\"\r\n      >\r\n        {{ emoji.value }}\r\n      </button>\r\n    }\r\n  </div>\r\n  <footer class=\"emoji-picker__tabs\" [attr.aria-label]=\"tabsLabel()\">\r\n    @for (tab of tabs(); track tab.value) {\r\n      <button\r\n        class=\"emoji-picker__tab\"\r\n        type=\"button\"\r\n        [class.emoji-picker__tab--active]=\"tab.value === activeTab()\"\r\n        [attr.aria-label]=\"tab.label\"\r\n        (click)=\"selectTab(tab.value)\"\r\n      >\r\n        {{ tab.icon }}\r\n      </button>\r\n    }\r\n  </footer>\r\n</section>\r\n", styles: [":host{display:contents}.emoji-picker{position:absolute;left:14px;bottom:60px;z-index:20;display:grid;grid-template-rows:auto minmax(0,1fr) auto;width:min(460px,100% - 28px);max-width:calc(100% - 28px);max-height:min(360px,100vh - 220px);overflow:hidden;border:1px solid #dce7f3;border-radius:8px;background:#fff;box-shadow:0 18px 44px #0f172a29}.emoji-picker__header{padding:12px 16px 8px;color:#667085;font-size:13px;font-weight:700}.emoji-picker__grid{display:grid;grid-template-columns:repeat(10,34px);gap:8px;overflow:auto;padding:8px 14px 12px}.emoji-picker__item{display:grid;place-items:center;width:34px;height:34px;padding:0;border:0;border-radius:7px;background:transparent;font:inherit;font-size:22px;line-height:1;cursor:pointer}.emoji-picker__item:hover{background:#e7f1ff}.emoji-picker__tabs{display:flex;align-items:center;gap:6px;height:48px;padding:0 10px;border-top:1px solid #e6edf5;background:#f7f9fc}.emoji-picker__tab{display:grid;place-items:center;width:50px;height:40px;padding:0;border:0;border-radius:8px;background:transparent;font:inherit;font-size:22px;line-height:1;cursor:pointer}.emoji-picker__tab:hover,.emoji-picker__tab--active{background:#fff;box-shadow:0 1px 6px #0f172a14}\n"] }]
+            args: [{ selector: 's-emoji-picker', changeDetection: ChangeDetectionStrategy.OnPush, template: "<section\r\n  [id]=\"panelId()\"\r\n  class=\"emoji-picker\"\r\n  role=\"dialog\"\r\n  [attr.aria-label]=\"ariaLabel()\"\r\n>\r\n  <header class=\"emoji-picker__header\">{{ headerLabel() }}</header>\r\n  <div class=\"emoji-picker__grid\" [attr.aria-label]=\"gridLabel()\">\r\n    @for (emoji of activeOptions(); track emoji.value) {\r\n      <button\r\n        class=\"emoji-picker__item\"\r\n        type=\"button\"\r\n        [attr.aria-label]=\"emoji.label\"\r\n        (click)=\"selectEmoji(emoji.value)\"\r\n      >\r\n        {{ emoji.value }}\r\n      </button>\r\n    }\r\n  </div>\r\n  <footer class=\"emoji-picker__tabs\" [attr.aria-label]=\"tabsLabel()\">\r\n    @for (tab of tabs(); track tab.value) {\r\n      <button\r\n        class=\"emoji-picker__tab\"\r\n        type=\"button\"\r\n        [class.emoji-picker__tab--active]=\"tab.value === activeTab()\"\r\n        [attr.aria-label]=\"tab.label\"\r\n        (click)=\"selectTab(tab.value)\"\r\n      >\r\n        {{ tab.icon }}\r\n      </button>\r\n    }\r\n  </footer>\r\n</section>\r\n", styles: [":host{display:contents}.emoji-picker{position:absolute;left:14px;bottom:60px;z-index:998;display:grid;grid-template-rows:auto minmax(0,1fr) auto;width:min(460px,100% - 28px);max-width:calc(100% - 28px);max-height:min(360px,100vh - 220px);overflow:hidden;border:1px solid #dce7f3;border-radius:8px;background:#fff;box-shadow:0 18px 44px #0f172a29}.emoji-picker__header{padding:12px 16px 8px;color:#667085;font-size:13px;font-weight:700}.emoji-picker__grid{display:grid;grid-template-columns:repeat(10,34px);gap:8px;overflow:auto;padding:8px 14px 12px}.emoji-picker__item{display:grid;place-items:center;width:34px;height:34px;padding:0;border:0;border-radius:7px;background:transparent;font:inherit;font-size:22px;line-height:1;cursor:pointer}.emoji-picker__item:hover{background:#e7f1ff}.emoji-picker__tabs{display:flex;align-items:center;gap:6px;height:48px;padding:0 10px;border-top:1px solid #e6edf5;background:#f7f9fc}.emoji-picker__tab{display:grid;place-items:center;width:50px;height:40px;padding:0;border:0;border-radius:8px;background:transparent;font:inherit;font-size:22px;line-height:1;cursor:pointer}.emoji-picker__tab:hover,.emoji-picker__tab--active{background:#fff;box-shadow:0 1px 6px #0f172a14}\n"] }]
         }], propDecorators: { panelId: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelId", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], headerLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerLabel", required: false }] }], gridLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "gridLabel", required: false }] }], tabsLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabsLabel", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], tabs: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabs", required: false }] }], emojiSelected: [{ type: i0.Output, args: ["emojiSelected"] }], tabSelected: [{ type: i0.Output, args: ["tabSelected"] }] } });
 
 class FilterSummary {
@@ -3979,33 +4658,203 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
                     }, template: "<button\r\n  type=\"button\"\r\n  [class]=\"buttonClass()\"\r\n  [disabled]=\"disabled()\"\r\n  [attr.aria-busy]=\"ariaBusy()\"\r\n  (click)=\"openFileDialog()\"\r\n>\r\n  <ng-content />\r\n</button>\r\n\r\n<input\r\n  #fileInput\r\n  class=\"file-upload-button__input\"\r\n  type=\"file\"\r\n  [accept]=\"accept()\"\r\n  [multiple]=\"multiple()\"\r\n  (change)=\"onFileChange($event)\"\r\n/>\r\n", styles: [":host{display:contents}:host(.file-upload-button-host--disabled){cursor:not-allowed}.file-upload-button__input{display:none}\n"] }]
         }], propDecorators: { accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], buttonClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonClass", required: false }] }], ariaBusy: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaBusy", required: false }] }], filesSelected: [{ type: i0.Output, args: ["filesSelected"] }], fileInput: [{ type: i0.ViewChild, args: ['fileInput', { isSignal: true }] }] } });
 
-class Header {
-    ariaLabel = input('顶部导航', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
-    title = input('', ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
-    description = input('', ...(ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []));
-    titleAlign = input('left', ...(ngDevMode ? [{ debugName: "titleAlign" }] : /* istanbul ignore next */ []));
-    size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    surface = input('transparent', ...(ngDevMode ? [{ debugName: "surface" }] : /* istanbul ignore next */ []));
-    inset = input('none', ...(ngDevMode ? [{ debugName: "inset" }] : /* istanbul ignore next */ []));
-    showBack = input(false, ...(ngDevMode ? [{ debugName: "showBack" }] : /* istanbul ignore next */ []));
-    showDropdown = input(false, ...(ngDevMode ? [{ debugName: "showDropdown" }] : /* istanbul ignore next */ []));
-    showDescriptionDropdown = input(false, ...(ngDevMode ? [{ debugName: "showDescriptionDropdown" }] : /* istanbul ignore next */ []));
-    showStatusBar = input(false, ...(ngDevMode ? [{ debugName: "showStatusBar" }] : /* istanbul ignore next */ []));
-    statusTime = input('10:00', ...(ngDevMode ? [{ debugName: "statusTime" }] : /* istanbul ignore next */ []));
-    actions = input([], ...(ngDevMode ? [{ debugName: "actions" }] : /* istanbul ignore next */ []));
-    backClicked = output();
-    titleClicked = output();
-    actionSelected = output();
-    backIcon = ChevronLeftIcon;
-    downIcon = ChevronDownIcon;
-    signalIcon = SignalHighIcon;
-    wifiIcon = WifiHighIcon;
-    batteryIcon = BatteryFullIcon;
-    hasActions = computed(() => this.actions().length > 0, ...(ngDevMode ? [{ debugName: "hasActions" }] : /* istanbul ignore next */ []));
-    hasStart = computed(() => this.showBack(), ...(ngDevMode ? [{ debugName: "hasStart" }] : /* istanbul ignore next */ []));
-    isTitleInteractive = computed(() => this.showDropdown() || this.showDescriptionDropdown(), ...(ngDevMode ? [{ debugName: "isTitleInteractive" }] : /* istanbul ignore next */ []));
-    titleButtonAriaLabel = computed(() => this.showDropdown() || this.showDescriptionDropdown()
-        ? `${this.title() || '标题'}，展开`
+class ImagePreview {
+    items = input([], ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
+    initialIndex = input(0, ...(ngDevMode ? [{ debugName: "initialIndex" }] : /* istanbul ignore next */ []));
+    thumbnailSize = input(88, ...(ngDevMode ? [{ debugName: "thumbnailSize" }] : /* istanbul ignore next */ []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    showCounter = input(true, ...(ngDevMode ? [{ debugName: "showCounter" }] : /* istanbul ignore next */ []));
+    showTitle = input(true, ...(ngDevMode ? [{ debugName: "showTitle" }] : /* istanbul ignore next */ []));
+    showThumbnails = input(true, ...(ngDevMode ? [{ debugName: "showThumbnails" }] : /* istanbul ignore next */ []));
+    closeOnMaskClick = input(true, ...(ngDevMode ? [{ debugName: "closeOnMaskClick" }] : /* istanbul ignore next */ []));
+    zoomStep = input(0.2, ...(ngDevMode ? [{ debugName: "zoomStep" }] : /* istanbul ignore next */ []));
+    minZoom = input(0.4, ...(ngDevMode ? [{ debugName: "minZoom" }] : /* istanbul ignore next */ []));
+    maxZoom = input(3, ...(ngDevMode ? [{ debugName: "maxZoom" }] : /* istanbul ignore next */ []));
+    emptyText = input('暂无图片', ...(ngDevMode ? [{ debugName: "emptyText" }] : /* istanbul ignore next */ []));
+    opened = output();
+    closed = output();
+    indexChange = output();
+    imageError = output();
+    closeIcon = XIcon;
+    emptyIcon = ImageIcon;
+    nextIcon = ChevronRightIcon;
+    prevIcon = ChevronLeftIcon;
+    rotateLeftIcon = RotateCcwIcon;
+    rotateRightIcon = RotateCwIcon;
+    zoomInIcon = PlusIcon;
+    zoomOutIcon = MinusIcon;
+    isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
+    activeIndex = signal(0, ...(ngDevMode ? [{ debugName: "activeIndex" }] : /* istanbul ignore next */ []));
+    zoom = signal(1, ...(ngDevMode ? [{ debugName: "zoom" }] : /* istanbul ignore next */ []));
+    rotation = signal(0, ...(ngDevMode ? [{ debugName: "rotation" }] : /* istanbul ignore next */ []));
+    failedSources = signal(new Set(), ...(ngDevMode ? [{ debugName: "failedSources" }] : /* istanbul ignore next */ []));
+    closeButton = viewChild('closeButton', ...(ngDevMode ? [{ debugName: "closeButton" }] : /* istanbul ignore next */ []));
+    hasItems = computed(() => this.items().length > 0, ...(ngDevMode ? [{ debugName: "hasItems" }] : /* istanbul ignore next */ []));
+    activeItem = computed(() => this.items()[this.safeIndex(this.activeIndex())] ?? null, ...(ngDevMode ? [{ debugName: "activeItem" }] : /* istanbul ignore next */ []));
+    canGoPrev = computed(() => this.items().length > 1, ...(ngDevMode ? [{ debugName: "canGoPrev" }] : /* istanbul ignore next */ []));
+    canGoNext = computed(() => this.items().length > 1, ...(ngDevMode ? [{ debugName: "canGoNext" }] : /* istanbul ignore next */ []));
+    canZoomIn = computed(() => this.zoom() < this.normalizedMaxZoom(), ...(ngDevMode ? [{ debugName: "canZoomIn" }] : /* istanbul ignore next */ []));
+    canZoomOut = computed(() => this.zoom() > this.normalizedMinZoom(), ...(ngDevMode ? [{ debugName: "canZoomOut" }] : /* istanbul ignore next */ []));
+    imageTransform = computed(() => `scale(${this.zoom()}) rotate(${this.rotation()}deg)`, ...(ngDevMode ? [{ debugName: "imageTransform" }] : /* istanbul ignore next */ []));
+    zoomPercent = computed(() => `${Math.round(this.zoom() * 100)}%`, ...(ngDevMode ? [{ debugName: "zoomPercent" }] : /* istanbul ignore next */ []));
+    trackBySrc(index, item) {
+        return item.src || `${index}`;
+    }
+    open(index) {
+        if (this.disabled() || !this.hasItems()) {
+            return;
+        }
+        this.activeIndex.set(this.safeIndex(index));
+        this.resetTransform();
+        this.isOpen.set(true);
+        this.emitForIndex(this.opened, this.activeIndex());
+        queueMicrotask(() => this.closeButton()?.nativeElement.focus());
+    }
+    close() {
+        if (!this.isOpen()) {
+            return;
+        }
+        this.isOpen.set(false);
+        this.resetTransform();
+        this.closed.emit();
+    }
+    closeFromMask(event) {
+        if (!this.closeOnMaskClick() || event.target !== event.currentTarget) {
+            return;
+        }
+        this.close();
+    }
+    previous() {
+        this.move(-1);
+    }
+    next() {
+        this.move(1);
+    }
+    select(index) {
+        const safeIndex = this.safeIndex(index);
+        if (safeIndex === this.activeIndex()) {
+            return;
+        }
+        this.activeIndex.set(safeIndex);
+        this.resetTransform();
+        this.emitForIndex(this.indexChange, safeIndex);
+    }
+    zoomIn() {
+        this.zoom.update((value) => this.clampZoom(value + this.normalizedZoomStep()));
+    }
+    zoomOut() {
+        this.zoom.update((value) => this.clampZoom(value - this.normalizedZoomStep()));
+    }
+    rotateLeft() {
+        this.rotation.update((value) => value - 90);
+    }
+    rotateRight() {
+        this.rotation.update((value) => value + 90);
+    }
+    resetTransform() {
+        this.zoom.set(1);
+        this.rotation.set(0);
+    }
+    isFailed(src) {
+        return this.failedSources().has(src);
+    }
+    onImageError(index, item, source = item.src) {
+        this.failedSources.update((sources) => new Set(sources).add(source));
+        this.imageError.emit({ index: this.safeIndex(index), item });
+    }
+    onDocumentKeydown(event) {
+        if (!this.isOpen()) {
+            return;
+        }
+        switch (event.key) {
+            case 'Escape':
+                event.preventDefault();
+                this.close();
+                break;
+            case 'ArrowLeft':
+                event.preventDefault();
+                this.previous();
+                break;
+            case 'ArrowRight':
+                event.preventDefault();
+                this.next();
+                break;
+        }
+    }
+    move(offset) {
+        const length = this.items().length;
+        if (length < 2) {
+            return;
+        }
+        const nextIndex = (this.activeIndex() + offset + length) % length;
+        this.select(nextIndex);
+    }
+    safeIndex(index) {
+        const length = this.items().length;
+        if (!length) {
+            return 0;
+        }
+        return Math.max(0, Math.min(length - 1, Math.trunc(index)));
+    }
+    clampZoom(value) {
+        return Math.max(this.normalizedMinZoom(), Math.min(this.normalizedMaxZoom(), Number(value.toFixed(2))));
+    }
+    normalizedZoomStep() {
+        return this.positiveNumberOrDefault(this.zoomStep(), 0.2);
+    }
+    normalizedMinZoom() {
+        return this.positiveNumberOrDefault(this.minZoom(), 0.4);
+    }
+    normalizedMaxZoom() {
+        return Math.max(this.normalizedMinZoom(), this.positiveNumberOrDefault(this.maxZoom(), 3));
+    }
+    positiveNumberOrDefault(value, fallback) {
+        return Number.isFinite(value) && value > 0 ? value : fallback;
+    }
+    emitForIndex(emitter, index) {
+        const item = this.items()[index];
+        if (!item) {
+            return;
+        }
+        emitter.emit({ index, item });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: ImagePreview, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: ImagePreview, isStandalone: true, selector: "s-image-preview", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, initialIndex: { classPropertyName: "initialIndex", publicName: "initialIndex", isSignal: true, isRequired: false, transformFunction: null }, thumbnailSize: { classPropertyName: "thumbnailSize", publicName: "thumbnailSize", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, showCounter: { classPropertyName: "showCounter", publicName: "showCounter", isSignal: true, isRequired: false, transformFunction: null }, showTitle: { classPropertyName: "showTitle", publicName: "showTitle", isSignal: true, isRequired: false, transformFunction: null }, showThumbnails: { classPropertyName: "showThumbnails", publicName: "showThumbnails", isSignal: true, isRequired: false, transformFunction: null }, closeOnMaskClick: { classPropertyName: "closeOnMaskClick", publicName: "closeOnMaskClick", isSignal: true, isRequired: false, transformFunction: null }, zoomStep: { classPropertyName: "zoomStep", publicName: "zoomStep", isSignal: true, isRequired: false, transformFunction: null }, minZoom: { classPropertyName: "minZoom", publicName: "minZoom", isSignal: true, isRequired: false, transformFunction: null }, maxZoom: { classPropertyName: "maxZoom", publicName: "maxZoom", isSignal: true, isRequired: false, transformFunction: null }, emptyText: { classPropertyName: "emptyText", publicName: "emptyText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { opened: "opened", closed: "closed", indexChange: "indexChange", imageError: "imageError" }, host: { listeners: { "document:keydown": "onDocumentKeydown($event)" } }, viewQueries: [{ propertyName: "closeButton", first: true, predicate: ["closeButton"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"image-preview\"\n  [class.image-preview--disabled]=\"disabled()\"\n  [style.--image-preview-thumb-size.px]=\"thumbnailSize()\"\n>\n  @if (hasItems()) {\n    <div class=\"image-preview__grid\" role=\"list\">\n      @for (item of items(); track trackBySrc($index, item)) {\n        <button\n          type=\"button\"\n          class=\"image-preview__thumb\"\n          role=\"listitem\"\n          [disabled]=\"disabled()\"\n          [attr.aria-label]=\"item.alt || item.title || '\u9884\u89C8\u56FE\u7247'\"\n          (click)=\"open($index)\"\n        >\n          @if (!isFailed(item.thumbnailSrc || item.src)) {\n            <img\n              class=\"image-preview__thumb-image\"\n              [src]=\"item.thumbnailSrc || item.src\"\n              [alt]=\"item.alt || item.title || ''\"\n              (error)=\"onImageError($index, item, item.thumbnailSrc || item.src)\"\n            />\n          } @else {\n            <span class=\"image-preview__thumb-fallback\" aria-hidden=\"true\">\n              <i-lucide [img]=\"emptyIcon\"></i-lucide>\n            </span>\n          }\n        </button>\n      }\n    </div>\n  } @else {\n    <div class=\"image-preview__empty\">\n      <i-lucide [img]=\"emptyIcon\" aria-hidden=\"true\"></i-lucide>\n      <span>{{ emptyText() }}</span>\n    </div>\n  }\n</div>\n\n@if (isOpen() && activeItem(); as item) {\n  <div\n    class=\"image-preview-modal\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n    [attr.aria-label]=\"item.alt || item.title || '\u56FE\u7247\u9884\u89C8'\"\n    (click)=\"closeFromMask($event)\"\n  >\n    <div class=\"image-preview-modal__bar\">\n      <div class=\"image-preview-modal__meta\">\n        @if (showTitle() && item.title) {\n          <div class=\"image-preview-modal__title\">{{ item.title }}</div>\n        }\n        @if (showCounter()) {\n          <div class=\"image-preview-modal__counter\">{{ activeIndex() + 1 }} / {{ items().length }}</div>\n        }\n      </div>\n\n      <div class=\"image-preview-modal__tools\" role=\"toolbar\" aria-label=\"\u56FE\u7247\u5DE5\u5177\u680F\">\n        <button type=\"button\" class=\"image-preview-modal__tool\" [disabled]=\"!canZoomOut()\" (click)=\"zoomOut()\" aria-label=\"\u7F29\u5C0F\">\n          <i-lucide [img]=\"zoomOutIcon\"></i-lucide>\n        </button>\n        <span class=\"image-preview-modal__zoom\">{{ zoomPercent() }}</span>\n        <button type=\"button\" class=\"image-preview-modal__tool\" [disabled]=\"!canZoomIn()\" (click)=\"zoomIn()\" aria-label=\"\u653E\u5927\">\n          <i-lucide [img]=\"zoomInIcon\"></i-lucide>\n        </button>\n        <button type=\"button\" class=\"image-preview-modal__tool\" (click)=\"rotateLeft()\" aria-label=\"\u5411\u5DE6\u65CB\u8F6C\">\n          <i-lucide [img]=\"rotateLeftIcon\"></i-lucide>\n        </button>\n        <button type=\"button\" class=\"image-preview-modal__tool\" (click)=\"rotateRight()\" aria-label=\"\u5411\u53F3\u65CB\u8F6C\">\n          <i-lucide [img]=\"rotateRightIcon\"></i-lucide>\n        </button>\n        <button type=\"button\" class=\"image-preview-modal__tool\" (click)=\"resetTransform()\" aria-label=\"\u91CD\u7F6E\">\n          <span>1:1</span>\n        </button>\n        <button #closeButton type=\"button\" class=\"image-preview-modal__tool\" (click)=\"close()\" aria-label=\"\u5173\u95ED\">\n          <i-lucide [img]=\"closeIcon\"></i-lucide>\n        </button>\n      </div>\n    </div>\n\n    <div class=\"image-preview-modal__stage\">\n      @if (canGoPrev()) {\n        <button type=\"button\" class=\"image-preview-modal__nav image-preview-modal__nav--prev\" (click)=\"previous()\" aria-label=\"\u4E0A\u4E00\u5F20\">\n          <i-lucide [img]=\"prevIcon\"></i-lucide>\n        </button>\n      }\n\n      @if (!isFailed(item.src)) {\n        <img\n          class=\"image-preview-modal__image\"\n          [src]=\"item.src\"\n          [alt]=\"item.alt || item.title || ''\"\n          [style.transform]=\"imageTransform()\"\n          (error)=\"onImageError(activeIndex(), item, item.src)\"\n        />\n      } @else {\n        <div class=\"image-preview-modal__fallback\">\n          <i-lucide [img]=\"emptyIcon\" aria-hidden=\"true\"></i-lucide>\n          <span>\u56FE\u7247\u52A0\u8F7D\u5931\u8D25</span>\n        </div>\n      }\n\n      @if (canGoNext()) {\n        <button type=\"button\" class=\"image-preview-modal__nav image-preview-modal__nav--next\" (click)=\"next()\" aria-label=\"\u4E0B\u4E00\u5F20\">\n          <i-lucide [img]=\"nextIcon\"></i-lucide>\n        </button>\n      }\n    </div>\n\n    @if (showThumbnails() && items().length > 1) {\n      <div class=\"image-preview-modal__strip\" role=\"list\" aria-label=\"\u56FE\u7247\u7F29\u7565\u56FE\">\n        @for (previewItem of items(); track trackBySrc($index, previewItem)) {\n          <button\n            type=\"button\"\n            class=\"image-preview-modal__strip-item\"\n            role=\"listitem\"\n            [class.image-preview-modal__strip-item--active]=\"$index === activeIndex()\"\n            [attr.aria-current]=\"$index === activeIndex() ? 'true' : null\"\n            [attr.aria-label]=\"previewItem.alt || previewItem.title || '\u5207\u6362\u56FE\u7247'\"\n            (click)=\"select($index)\"\n          >\n            @if (!isFailed(previewItem.thumbnailSrc || previewItem.src)) {\n              <img\n                [src]=\"previewItem.thumbnailSrc || previewItem.src\"\n                [alt]=\"previewItem.alt || previewItem.title || ''\"\n                (error)=\"onImageError($index, previewItem, previewItem.thumbnailSrc || previewItem.src)\"\n              />\n            } @else {\n              <i-lucide [img]=\"emptyIcon\" aria-hidden=\"true\"></i-lucide>\n            }\n          </button>\n        }\n      </div>\n    }\n  </div>\n}\n", styles: [":host{display:block}.image-preview{--image-preview-thumb-size: 88px;color:var(--color-text-primary)}.image-preview__grid{display:flex;flex-wrap:wrap;gap:12px}.image-preview__thumb{width:var(--image-preview-thumb-size);height:var(--image-preview-thumb-size);padding:0;border:1px solid var(--color-border);border-radius:var(--radius-common-m);background:var(--color-surface-soft);overflow:hidden;cursor:pointer}.image-preview__thumb:hover:not(:disabled),.image-preview__thumb:focus-visible{border-color:var(--color-primary);outline:none;box-shadow:0 0 0 3px #1677ff2e}.image-preview__thumb:disabled{cursor:not-allowed;opacity:.65}.image-preview__thumb-image,.image-preview-modal__strip-item img{width:100%;height:100%;display:block;object-fit:cover}.image-preview__thumb-fallback,.image-preview__empty,.image-preview-modal__tool,.image-preview-modal__nav,.image-preview-modal__fallback,.image-preview-modal__strip-item{display:inline-flex;align-items:center;justify-content:center}.image-preview__thumb-fallback{width:100%;height:100%;color:var(--color-text-muted)}.image-preview__thumb-fallback i-lucide,.image-preview__empty i-lucide,.image-preview-modal__fallback i-lucide{width:28px;height:28px}.image-preview__empty{min-height:96px;border:1px dashed var(--color-border);border-radius:var(--radius-common-m);background:var(--color-surface-soft);color:var(--color-text-secondary);gap:8px;font-size:14px}.image-preview-modal{position:fixed;inset:0;z-index:1200;padding:16px;background:#000000d6;color:#fff;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:16px}.image-preview-modal__bar{min-height:44px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px}.image-preview-modal__meta{min-width:0}.image-preview-modal__title{max-width:min(560px,58vw);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:var(--font-weight-semibold);line-height:24px}.image-preview-modal__counter{color:#ffffffb8;font-size:13px;line-height:20px}.image-preview-modal__tools{display:flex;align-items:center;gap:8px}.image-preview-modal__tool,.image-preview-modal__nav,.image-preview-modal__strip-item{border:0;color:var(--color-surface);cursor:pointer}.image-preview-modal__tool{min-width:36px;height:36px;padding:0 9px;border-radius:var(--radius-common-s);background:#ffffff24}.image-preview-modal__tool:hover,.image-preview-modal__tool:focus-visible,.image-preview-modal__nav:hover,.image-preview-modal__nav:focus-visible{background:#ffffff38;outline:none}.image-preview-modal__tool:disabled{cursor:not-allowed;opacity:.45}.image-preview-modal__tool i-lucide,.image-preview-modal__nav i-lucide{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;line-height:0}.image-preview-modal__tool span{line-height:18px}.image-preview-modal__zoom{min-width:48px;text-align:center;font-size:13px;line-height:20px}.image-preview-modal__stage{min-height:0;position:relative;display:grid;place-items:center;overflow:hidden}.image-preview-modal__image{max-width:min(100%,1200px);max-height:100%;display:block;object-fit:contain;transform-origin:center;transition:transform .14s ease;-webkit-user-select:none;user-select:none}.image-preview-modal__nav{position:absolute;top:50%;z-index:1;width:44px;height:64px;border-radius:var(--radius-common-m);background:#00000057;transform:translateY(-50%)}.image-preview-modal__nav--prev{left:0}.image-preview-modal__nav--next{right:0}.image-preview-modal__fallback{width:min(420px,100%);min-height:220px;border:1px dashed rgba(255,255,255,.22);border-radius:var(--radius-common-m);background:#ffffff14;flex-direction:column;gap:10px;color:#ffffffb8}.image-preview-modal__strip{max-width:100%;justify-self:center;display:flex;gap:10px;overflow-x:auto;padding:4px 2px}.image-preview-modal__strip-item{width:58px;height:58px;flex:0 0 auto;padding:0;border:2px solid transparent;border-radius:var(--radius-common-s);background:#ffffff24;overflow:hidden}.image-preview-modal__strip-item--active,.image-preview-modal__strip-item:focus-visible{border-color:var(--color-primary);outline:none}\n"], dependencies: [{ kind: "ngmodule", type: LucideAngularModule }, { kind: "component", type: i1.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: ImagePreview, decorators: [{
+            type: Component,
+            args: [{ selector: 's-image-preview', imports: [LucideAngularModule], changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '(document:keydown)': 'onDocumentKeydown($event)',
+                    }, template: "<div\n  class=\"image-preview\"\n  [class.image-preview--disabled]=\"disabled()\"\n  [style.--image-preview-thumb-size.px]=\"thumbnailSize()\"\n>\n  @if (hasItems()) {\n    <div class=\"image-preview__grid\" role=\"list\">\n      @for (item of items(); track trackBySrc($index, item)) {\n        <button\n          type=\"button\"\n          class=\"image-preview__thumb\"\n          role=\"listitem\"\n          [disabled]=\"disabled()\"\n          [attr.aria-label]=\"item.alt || item.title || '\u9884\u89C8\u56FE\u7247'\"\n          (click)=\"open($index)\"\n        >\n          @if (!isFailed(item.thumbnailSrc || item.src)) {\n            <img\n              class=\"image-preview__thumb-image\"\n              [src]=\"item.thumbnailSrc || item.src\"\n              [alt]=\"item.alt || item.title || ''\"\n              (error)=\"onImageError($index, item, item.thumbnailSrc || item.src)\"\n            />\n          } @else {\n            <span class=\"image-preview__thumb-fallback\" aria-hidden=\"true\">\n              <i-lucide [img]=\"emptyIcon\"></i-lucide>\n            </span>\n          }\n        </button>\n      }\n    </div>\n  } @else {\n    <div class=\"image-preview__empty\">\n      <i-lucide [img]=\"emptyIcon\" aria-hidden=\"true\"></i-lucide>\n      <span>{{ emptyText() }}</span>\n    </div>\n  }\n</div>\n\n@if (isOpen() && activeItem(); as item) {\n  <div\n    class=\"image-preview-modal\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n    [attr.aria-label]=\"item.alt || item.title || '\u56FE\u7247\u9884\u89C8'\"\n    (click)=\"closeFromMask($event)\"\n  >\n    <div class=\"image-preview-modal__bar\">\n      <div class=\"image-preview-modal__meta\">\n        @if (showTitle() && item.title) {\n          <div class=\"image-preview-modal__title\">{{ item.title }}</div>\n        }\n        @if (showCounter()) {\n          <div class=\"image-preview-modal__counter\">{{ activeIndex() + 1 }} / {{ items().length }}</div>\n        }\n      </div>\n\n      <div class=\"image-preview-modal__tools\" role=\"toolbar\" aria-label=\"\u56FE\u7247\u5DE5\u5177\u680F\">\n        <button type=\"button\" class=\"image-preview-modal__tool\" [disabled]=\"!canZoomOut()\" (click)=\"zoomOut()\" aria-label=\"\u7F29\u5C0F\">\n          <i-lucide [img]=\"zoomOutIcon\"></i-lucide>\n        </button>\n        <span class=\"image-preview-modal__zoom\">{{ zoomPercent() }}</span>\n        <button type=\"button\" class=\"image-preview-modal__tool\" [disabled]=\"!canZoomIn()\" (click)=\"zoomIn()\" aria-label=\"\u653E\u5927\">\n          <i-lucide [img]=\"zoomInIcon\"></i-lucide>\n        </button>\n        <button type=\"button\" class=\"image-preview-modal__tool\" (click)=\"rotateLeft()\" aria-label=\"\u5411\u5DE6\u65CB\u8F6C\">\n          <i-lucide [img]=\"rotateLeftIcon\"></i-lucide>\n        </button>\n        <button type=\"button\" class=\"image-preview-modal__tool\" (click)=\"rotateRight()\" aria-label=\"\u5411\u53F3\u65CB\u8F6C\">\n          <i-lucide [img]=\"rotateRightIcon\"></i-lucide>\n        </button>\n        <button type=\"button\" class=\"image-preview-modal__tool\" (click)=\"resetTransform()\" aria-label=\"\u91CD\u7F6E\">\n          <span>1:1</span>\n        </button>\n        <button #closeButton type=\"button\" class=\"image-preview-modal__tool\" (click)=\"close()\" aria-label=\"\u5173\u95ED\">\n          <i-lucide [img]=\"closeIcon\"></i-lucide>\n        </button>\n      </div>\n    </div>\n\n    <div class=\"image-preview-modal__stage\">\n      @if (canGoPrev()) {\n        <button type=\"button\" class=\"image-preview-modal__nav image-preview-modal__nav--prev\" (click)=\"previous()\" aria-label=\"\u4E0A\u4E00\u5F20\">\n          <i-lucide [img]=\"prevIcon\"></i-lucide>\n        </button>\n      }\n\n      @if (!isFailed(item.src)) {\n        <img\n          class=\"image-preview-modal__image\"\n          [src]=\"item.src\"\n          [alt]=\"item.alt || item.title || ''\"\n          [style.transform]=\"imageTransform()\"\n          (error)=\"onImageError(activeIndex(), item, item.src)\"\n        />\n      } @else {\n        <div class=\"image-preview-modal__fallback\">\n          <i-lucide [img]=\"emptyIcon\" aria-hidden=\"true\"></i-lucide>\n          <span>\u56FE\u7247\u52A0\u8F7D\u5931\u8D25</span>\n        </div>\n      }\n\n      @if (canGoNext()) {\n        <button type=\"button\" class=\"image-preview-modal__nav image-preview-modal__nav--next\" (click)=\"next()\" aria-label=\"\u4E0B\u4E00\u5F20\">\n          <i-lucide [img]=\"nextIcon\"></i-lucide>\n        </button>\n      }\n    </div>\n\n    @if (showThumbnails() && items().length > 1) {\n      <div class=\"image-preview-modal__strip\" role=\"list\" aria-label=\"\u56FE\u7247\u7F29\u7565\u56FE\">\n        @for (previewItem of items(); track trackBySrc($index, previewItem)) {\n          <button\n            type=\"button\"\n            class=\"image-preview-modal__strip-item\"\n            role=\"listitem\"\n            [class.image-preview-modal__strip-item--active]=\"$index === activeIndex()\"\n            [attr.aria-current]=\"$index === activeIndex() ? 'true' : null\"\n            [attr.aria-label]=\"previewItem.alt || previewItem.title || '\u5207\u6362\u56FE\u7247'\"\n            (click)=\"select($index)\"\n          >\n            @if (!isFailed(previewItem.thumbnailSrc || previewItem.src)) {\n              <img\n                [src]=\"previewItem.thumbnailSrc || previewItem.src\"\n                [alt]=\"previewItem.alt || previewItem.title || ''\"\n                (error)=\"onImageError($index, previewItem, previewItem.thumbnailSrc || previewItem.src)\"\n              />\n            } @else {\n              <i-lucide [img]=\"emptyIcon\" aria-hidden=\"true\"></i-lucide>\n            }\n          </button>\n        }\n      </div>\n    }\n  </div>\n}\n", styles: [":host{display:block}.image-preview{--image-preview-thumb-size: 88px;color:var(--color-text-primary)}.image-preview__grid{display:flex;flex-wrap:wrap;gap:12px}.image-preview__thumb{width:var(--image-preview-thumb-size);height:var(--image-preview-thumb-size);padding:0;border:1px solid var(--color-border);border-radius:var(--radius-common-m);background:var(--color-surface-soft);overflow:hidden;cursor:pointer}.image-preview__thumb:hover:not(:disabled),.image-preview__thumb:focus-visible{border-color:var(--color-primary);outline:none;box-shadow:0 0 0 3px #1677ff2e}.image-preview__thumb:disabled{cursor:not-allowed;opacity:.65}.image-preview__thumb-image,.image-preview-modal__strip-item img{width:100%;height:100%;display:block;object-fit:cover}.image-preview__thumb-fallback,.image-preview__empty,.image-preview-modal__tool,.image-preview-modal__nav,.image-preview-modal__fallback,.image-preview-modal__strip-item{display:inline-flex;align-items:center;justify-content:center}.image-preview__thumb-fallback{width:100%;height:100%;color:var(--color-text-muted)}.image-preview__thumb-fallback i-lucide,.image-preview__empty i-lucide,.image-preview-modal__fallback i-lucide{width:28px;height:28px}.image-preview__empty{min-height:96px;border:1px dashed var(--color-border);border-radius:var(--radius-common-m);background:var(--color-surface-soft);color:var(--color-text-secondary);gap:8px;font-size:14px}.image-preview-modal{position:fixed;inset:0;z-index:1200;padding:16px;background:#000000d6;color:#fff;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:16px}.image-preview-modal__bar{min-height:44px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px}.image-preview-modal__meta{min-width:0}.image-preview-modal__title{max-width:min(560px,58vw);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:var(--font-weight-semibold);line-height:24px}.image-preview-modal__counter{color:#ffffffb8;font-size:13px;line-height:20px}.image-preview-modal__tools{display:flex;align-items:center;gap:8px}.image-preview-modal__tool,.image-preview-modal__nav,.image-preview-modal__strip-item{border:0;color:var(--color-surface);cursor:pointer}.image-preview-modal__tool{min-width:36px;height:36px;padding:0 9px;border-radius:var(--radius-common-s);background:#ffffff24}.image-preview-modal__tool:hover,.image-preview-modal__tool:focus-visible,.image-preview-modal__nav:hover,.image-preview-modal__nav:focus-visible{background:#ffffff38;outline:none}.image-preview-modal__tool:disabled{cursor:not-allowed;opacity:.45}.image-preview-modal__tool i-lucide,.image-preview-modal__nav i-lucide{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;line-height:0}.image-preview-modal__tool span{line-height:18px}.image-preview-modal__zoom{min-width:48px;text-align:center;font-size:13px;line-height:20px}.image-preview-modal__stage{min-height:0;position:relative;display:grid;place-items:center;overflow:hidden}.image-preview-modal__image{max-width:min(100%,1200px);max-height:100%;display:block;object-fit:contain;transform-origin:center;transition:transform .14s ease;-webkit-user-select:none;user-select:none}.image-preview-modal__nav{position:absolute;top:50%;z-index:1;width:44px;height:64px;border-radius:var(--radius-common-m);background:#00000057;transform:translateY(-50%)}.image-preview-modal__nav--prev{left:0}.image-preview-modal__nav--next{right:0}.image-preview-modal__fallback{width:min(420px,100%);min-height:220px;border:1px dashed rgba(255,255,255,.22);border-radius:var(--radius-common-m);background:#ffffff14;flex-direction:column;gap:10px;color:#ffffffb8}.image-preview-modal__strip{max-width:100%;justify-self:center;display:flex;gap:10px;overflow-x:auto;padding:4px 2px}.image-preview-modal__strip-item{width:58px;height:58px;flex:0 0 auto;padding:0;border:2px solid transparent;border-radius:var(--radius-common-s);background:#ffffff24;overflow:hidden}.image-preview-modal__strip-item--active,.image-preview-modal__strip-item:focus-visible{border-color:var(--color-primary);outline:none}\n"] }]
+        }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], initialIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialIndex", required: false }] }], thumbnailSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "thumbnailSize", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], showCounter: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCounter", required: false }] }], showTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTitle", required: false }] }], showThumbnails: [{ type: i0.Input, args: [{ isSignal: true, alias: "showThumbnails", required: false }] }], closeOnMaskClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnMaskClick", required: false }] }], zoomStep: [{ type: i0.Input, args: [{ isSignal: true, alias: "zoomStep", required: false }] }], minZoom: [{ type: i0.Input, args: [{ isSignal: true, alias: "minZoom", required: false }] }], maxZoom: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxZoom", required: false }] }], emptyText: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyText", required: false }] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }], indexChange: [{ type: i0.Output, args: ["indexChange"] }], imageError: [{ type: i0.Output, args: ["imageError"] }], closeButton: [{ type: i0.ViewChild, args: ['closeButton', { isSignal: true }] }] } });
+
+class Header {
+    ariaLabel = input('顶部导航', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    title = input('', ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
+    description = input('', ...(ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []));
+    titleAlign = input('left', ...(ngDevMode ? [{ debugName: "titleAlign" }] : /* istanbul ignore next */ []));
+    size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    surface = input('transparent', ...(ngDevMode ? [{ debugName: "surface" }] : /* istanbul ignore next */ []));
+    inset = input('none', ...(ngDevMode ? [{ debugName: "inset" }] : /* istanbul ignore next */ []));
+    showBack = input(false, ...(ngDevMode ? [{ debugName: "showBack" }] : /* istanbul ignore next */ []));
+    showDropdown = input(false, ...(ngDevMode ? [{ debugName: "showDropdown" }] : /* istanbul ignore next */ []));
+    showDescriptionDropdown = input(false, ...(ngDevMode ? [{ debugName: "showDescriptionDropdown" }] : /* istanbul ignore next */ []));
+    showStatusBar = input(false, ...(ngDevMode ? [{ debugName: "showStatusBar" }] : /* istanbul ignore next */ []));
+    statusTime = input('10:00', ...(ngDevMode ? [{ debugName: "statusTime" }] : /* istanbul ignore next */ []));
+    actions = input([], ...(ngDevMode ? [{ debugName: "actions" }] : /* istanbul ignore next */ []));
+    backClicked = output();
+    titleClicked = output();
+    actionSelected = output();
+    backIcon = ChevronLeftIcon;
+    downIcon = ChevronDownIcon;
+    signalIcon = SignalHighIcon;
+    wifiIcon = WifiHighIcon;
+    batteryIcon = BatteryFullIcon;
+    hasActions = computed(() => this.actions().length > 0, ...(ngDevMode ? [{ debugName: "hasActions" }] : /* istanbul ignore next */ []));
+    hasStart = computed(() => this.showBack(), ...(ngDevMode ? [{ debugName: "hasStart" }] : /* istanbul ignore next */ []));
+    isTitleInteractive = computed(() => this.showDropdown() || this.showDescriptionDropdown(), ...(ngDevMode ? [{ debugName: "isTitleInteractive" }] : /* istanbul ignore next */ []));
+    titleButtonAriaLabel = computed(() => this.showDropdown() || this.showDescriptionDropdown()
+        ? `${this.title() || '标题'}，展开`
         : this.title() || '标题', ...(ngDevMode ? [{ debugName: "titleButtonAriaLabel" }] : /* istanbul ignore next */ []));
     onBackClick() {
         this.backClicked.emit();
@@ -4467,19 +5316,17 @@ class ListPageLayoutComponent {
     sidebarSlot = contentChild(ListPageSidebarSlotDirective, ...(ngDevMode ? [{ debugName: "sidebarSlot" }] : /* istanbul ignore next */ []));
     sidebarComponent = contentChild(ListPageSidebarComponent, ...(ngDevMode ? [{ debugName: "sidebarComponent" }] : /* istanbul ignore next */ []));
     paginationTemplate = contentChild(ListPagePaginationSlotDirective, { ...(ngDevMode ? { debugName: "paginationTemplate" } : /* istanbul ignore next */ {}), read: TemplateRef });
-    paginationComponent = contentChild(ListPagePaginationComponent, ...(ngDevMode ? [{ debugName: "paginationComponent" }] : /* istanbul ignore next */ []));
     desktopContentTemplate = contentChild(ListPageContentDesktopSlotDirective, { ...(ngDevMode ? { debugName: "desktopContentTemplate" } : /* istanbul ignore next */ {}), read: TemplateRef });
     hasSidebar = computed(() => !!this.sidebarSlot() || !!this.sidebarComponent(), ...(ngDevMode ? [{ debugName: "hasSidebar" }] : /* istanbul ignore next */ []));
-    hasPagination = computed(() => !!this.paginationTemplate() || !!this.paginationComponent(), ...(ngDevMode ? [{ debugName: "hasPagination" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: ListPageLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: ListPageLayoutComponent, isStandalone: true, selector: "s-list-page-layout", queries: [{ propertyName: "sidebarSlot", first: true, predicate: ListPageSidebarSlotDirective, descendants: true, isSignal: true }, { propertyName: "sidebarComponent", first: true, predicate: ListPageSidebarComponent, descendants: true, isSignal: true }, { propertyName: "paginationTemplate", first: true, predicate: ListPagePaginationSlotDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "paginationComponent", first: true, predicate: ListPagePaginationComponent, descendants: true, isSignal: true }, { propertyName: "desktopContentTemplate", first: true, predicate: ListPageContentDesktopSlotDirective, descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: "<header>\r\n  <ng-content select=\"[SListPageHeader]\"/>\r\n  <ng-content select=\"s-list-page-header\"/>\r\n  <ng-content select=\"[SListPageSummary]\"/>\r\n  <ng-content select=\"s-filter-summary\"/>\r\n</header>\r\n<main>\r\n  @if (hasSidebar()) {\r\n    <aside>\r\n      <ng-content select=\"[SListPageSidebar]\"/>\r\n      <ng-content select=\"s-list-page-sidebar\"/>\r\n    </aside>\r\n  }\r\n  <section>\r\n    @if (desktopContentTemplate(); as contentTemplate) {\r\n      <ng-container [ngTemplateOutlet]=\"contentTemplate\"/>\r\n    }\r\n    <ng-content select=\"s-list-page-content-desktop\"/>\r\n  </section>\r\n</main>\r\n@if (hasPagination()) {\r\n  <footer>\r\n    @if (paginationTemplate(); as footerTemplate) {\r\n      <ng-container [ngTemplateOutlet]=\"footerTemplate\"/>\r\n    }\r\n    <ng-content select=\"s-list-page-pagination\"/>\r\n  </footer>\r\n}\r\n\r\n", styles: ["s-list-page-layout{display:flex;flex-direction:column;height:100%;min-height:0;padding:var(--space-3);box-sizing:border-box;gap:var(--space-3);background:var(--color-bg);overflow:hidden}s-list-page-layout>header{flex:0 0 auto;position:sticky;top:0;z-index:2;border:1px solid var(--color-divider);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:var(--shadow-common-s)}s-list-page-layout>main{flex:1 1 auto;display:flex;min-height:0;border:1px solid var(--color-divider);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:var(--shadow-common-s);overflow:hidden}s-list-page-layout>main>aside{display:flex;flex:0 0 240px;width:240px;min-width:0;padding:16px;border-right:1px solid var(--color-border);background:var(--color-surface);overflow:hidden;box-sizing:border-box}s-list-page-layout>main>section{flex:1 1 auto;min-width:0;padding:16px;background:var(--color-surface);overflow:auto;box-sizing:border-box}s-list-page-layout>footer{flex:0 0 auto;height:50px;display:flex;align-items:center;padding:0 16px;border:1px solid var(--color-divider);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:var(--shadow-common-s)}s-list-page-layout>main>aside>s-list-page-sidebar,s-list-page-layout>main>aside>[SListPageSidebar]{display:flex;flex:1 1 auto;flex-direction:column;gap:var(--space-3);min-width:0;min-height:0}s-list-page-layout [SListPageSidebarSearch]{position:sticky;top:0;z-index:1;flex:0 0 auto;background:var(--color-surface)}s-list-page-layout [SListPageSidebarTree]{flex:1 1 auto;min-height:0;overflow:auto}s-list-page-layout [SListPageHeaderLayout]{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:flex-start;gap:var(--space-4);padding:var(--space-4);min-width:0;background:var(--color-surface)}s-list-page-layout [SListPageHeaderFilters]{min-width:0}s-list-page-layout [SListPageHeaderLayout]>[SListPageHeaderFilters],s-list-page-layout [SListPageHeaderLayout]>:has([SListPageHeaderFilters]){justify-self:stretch;min-width:0}s-list-page-layout [SListPageHeaderLayout]>:not([SListPageHeaderFilters]):not(:has([SListPageHeaderFilters])){justify-self:end;min-width:0}s-list-page-layout [SListPageSummary]{display:block;width:auto;margin:var(--space-2) var(--space-4) var(--space-3)}s-list-page-layout [SListPageHeaderActions]{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:var(--space-3);min-width:0;margin-left:auto}s-list-page-layout [SListPageFilterGrid]{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3) var(--space-4);min-width:0}s-list-page-layout [SListPageFilterField]{display:inline-flex;align-items:center;gap:var(--space-2);min-width:0;color:var(--color-text-primary);font-size:var(--font-size-sm);line-height:var(--line-height-sm)}s-list-page-layout [SListPageFilterLabel],s-list-page-layout [SListPageFilterField]>span:first-child{color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-sm);white-space:nowrap;flex:0 0 auto}s-list-page-layout [SListPageFilterLabel]{display:none}s-list-page-layout [SListPageFilterControl],s-list-page-layout [SListPageFilterField] input,s-list-page-layout [SListPageFilterField] select,s-list-page-layout [SListPageFilterField] s-select,s-list-page-layout [SListPageFilterField] s-date-picker{min-width:0}s-list-page-layout [SListPageFilterActions]{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);min-width:0}s-list-page-layout [SListPageTableWrap]{width:100%;min-height:auto;overflow-x:auto;overflow-y:visible;border:0;border-radius:var(--radius-common-m);background:var(--color-surface);box-sizing:border-box}s-list-page-layout [SListPageTableWrap][data-with-tabs]{min-height:0;height:100%;display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden}s-list-page-layout [SListPageTabs]{display:flex;align-items:center;gap:var(--list-page-status-tabs-gap, 1.5rem);min-height:var(--list-page-status-tabs-height, 3.375rem);padding:var(--list-page-status-tabs-padding, 0 .75rem);border-bottom:1px solid var(--list-page-status-tabs-border-color, var(--color-divider));box-sizing:border-box}s-list-page-layout [SListPageTab]{position:relative;height:var(--list-page-status-tabs-height, 3.375rem);padding:0;border:0;background:transparent;color:var(--list-page-status-tabs-color, var(--color-text-secondary));font:inherit;cursor:pointer}s-list-page-layout [SListPageTab]:is(.is-active,[aria-selected=true]){color:var(--list-page-status-tabs-active-color, var(--color-primary))}s-list-page-layout [SListPageTab]:is(.is-active,[aria-selected=true]):after{position:absolute;right:0;bottom:0;left:0;height:2px;background:var(--list-page-status-tabs-active-color, var(--color-primary));content:\"\"}s-list-page-layout [SListPageTableScroll]{min-height:0;overflow:auto}s-list-page-layout table[SListPageTable]{width:100%;min-width:var(--list-page-table-min-width, 48rem);table-layout:fixed}s-list-page-layout [SListPageCellText]{display:block;width:100%;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}s-list-page-layout [SListPageCheckboxCol]{width:var(--list-page-checkbox-col-width, 3.5rem);min-width:var(--list-page-checkbox-col-width, 3.5rem);text-align:center}s-list-page-layout [SListPageActionCol]{width:var(--list-page-action-col-width, 5rem);min-width:var(--list-page-action-col-width, 5rem);white-space:nowrap}s-list-page-layout table[SListPageTable]:has(tbody td:last-child[SListPageActionCol]) thead th:last-child,s-list-page-layout table[SListPageTable]:has(tbody td:last-child[SListPageActionCol]) tbody td:last-child[SListPageActionCol]{width:var(--list-page-action-col-width, 5rem);min-width:var(--list-page-action-col-width, 5rem)}s-list-page-layout [SListPageEmpty]{height:8rem;color:var(--color-text-secondary);text-align:center}s-list-page-layout [SListPageRowActions]{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2)}s-list-page-layout [SListPageRowActionTrigger]{min-height:1.75rem;padding:0 var(--space-2);border:0;border-radius:var(--radius-common-s);background:transparent;color:var(--color-primary);font-size:var(--font-size-xs);font-family:inherit;cursor:pointer}s-list-page-layout [SListPageRowActionDanger]{color:var(--list-page-danger-action-color, var(--color-error))}s-list-page-layout [SListPageIconButton]{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-1);line-height:1}s-list-page-layout [SListPageFileAction]{cursor:pointer}s-list-page-layout [SListPageFileAction] input{display:none}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: ListPageLayoutComponent, isStandalone: true, selector: "s-list-page-layout", queries: [{ propertyName: "sidebarSlot", first: true, predicate: ListPageSidebarSlotDirective, descendants: true, isSignal: true }, { propertyName: "sidebarComponent", first: true, predicate: ListPageSidebarComponent, descendants: true, isSignal: true }, { propertyName: "paginationTemplate", first: true, predicate: ListPagePaginationSlotDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "desktopContentTemplate", first: true, predicate: ListPageContentDesktopSlotDirective, descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: "<header>\r\n  <ng-content select=\"[SListPageHeader]\"/>\r\n  <ng-content select=\"s-list-page-header\"/>\r\n  <ng-content select=\"[SListPageSummary]\"/>\r\n  <ng-content select=\"s-filter-summary\"/>\r\n</header>\r\n<main>\r\n  @if (hasSidebar()) {\r\n    <aside>\r\n      <ng-content select=\"[SListPageSidebar]\"/>\r\n      <ng-content select=\"s-list-page-sidebar\"/>\r\n    </aside>\r\n  }\r\n  <section>\r\n    @if (desktopContentTemplate(); as contentTemplate) {\r\n      <ng-container [ngTemplateOutlet]=\"contentTemplate\"/>\r\n    }\r\n    <ng-content select=\"s-list-page-content-desktop\"/>\r\n  </section>\r\n</main>\r\n<footer>\r\n  @if (paginationTemplate(); as footerTemplate) {\r\n    <ng-container [ngTemplateOutlet]=\"footerTemplate\"/>\r\n  }\r\n  <ng-content select=\"s-list-page-pagination\"/>\r\n</footer>\r\n\r\n", styles: ["s-list-page-layout{display:flex;flex-direction:column;height:100%;min-height:0;padding:var(--space-3);box-sizing:border-box;gap:var(--space-3);background:var(--color-bg);overflow:hidden}s-list-page-layout>header{flex:0 0 auto;position:sticky;top:0;z-index:2;border:1px solid var(--color-divider);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:var(--shadow-common-s)}s-list-page-layout>main{flex:1 1 auto;display:flex;min-height:0;border:1px solid var(--color-divider);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:var(--shadow-common-s);overflow:hidden}s-list-page-layout>main>aside{display:flex;flex:0 0 240px;width:240px;min-width:0;padding:16px;border-right:1px solid var(--color-border);background:var(--color-surface);overflow:hidden;box-sizing:border-box}s-list-page-layout>main>section{flex:1 1 auto;min-width:0;padding:16px;background:var(--color-surface);overflow:auto;box-sizing:border-box}s-list-page-layout>footer{flex:0 0 auto;height:50px;display:flex;align-items:center;padding:0 16px;border:1px solid var(--color-divider);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:var(--shadow-common-s)}s-list-page-layout>footer:empty{display:none}s-list-page-layout>main>aside>s-list-page-sidebar,s-list-page-layout>main>aside>[SListPageSidebar]{display:flex;flex:1 1 auto;flex-direction:column;gap:var(--space-3);min-width:0;min-height:0}s-list-page-layout [SListPageSidebarSearch]{position:sticky;top:0;z-index:1;flex:0 0 auto;background:var(--color-surface)}s-list-page-layout [SListPageSidebarTree]{flex:1 1 auto;min-height:0;overflow:auto}s-list-page-layout [SListPageHeaderLayout]{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:flex-start;gap:var(--space-4);padding:var(--space-4);min-width:0;background:var(--color-surface)}s-list-page-layout [SListPageHeaderFilters]{min-width:0}s-list-page-layout [SListPageHeaderLayout]>[SListPageHeaderFilters],s-list-page-layout [SListPageHeaderLayout]>:has([SListPageHeaderFilters]){justify-self:stretch;min-width:0}s-list-page-layout [SListPageHeaderLayout]>:not([SListPageHeaderFilters]):not(:has([SListPageHeaderFilters])){justify-self:end;min-width:0}s-list-page-layout [SListPageSummary]{display:block;width:auto;margin:var(--space-2) var(--space-4) var(--space-3)}s-list-page-layout [SListPageHeaderActions]{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:var(--space-3);min-width:0;margin-left:auto}s-list-page-layout [SListPageFilterGrid]{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3) var(--space-4);min-width:0}s-list-page-layout [SListPageFilterField]{display:inline-flex;align-items:center;gap:var(--space-2);min-width:0;color:var(--color-text-primary);font-size:var(--font-size-sm);line-height:var(--line-height-sm)}s-list-page-layout [SListPageFilterLabel],s-list-page-layout [SListPageFilterField]>span:first-child{color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-sm);white-space:nowrap;flex:0 0 auto}s-list-page-layout [SListPageFilterLabel]{display:none}s-list-page-layout [SListPageFilterControl],s-list-page-layout [SListPageFilterField] input,s-list-page-layout [SListPageFilterField] select,s-list-page-layout [SListPageFilterField] s-select,s-list-page-layout [SListPageFilterField] s-date-picker{min-width:0}s-list-page-layout [SListPageFilterActions]{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);min-width:0}s-list-page-layout [SListPageTableWrap]{width:100%;min-height:auto;overflow-x:auto;overflow-y:visible;border:0;border-radius:var(--radius-common-m);background:var(--color-surface);box-sizing:border-box}s-list-page-layout [SListPageTableWrap][data-with-tabs]{min-height:0;height:100%;display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden}s-list-page-layout [SListPageTabs]{display:flex;align-items:center;gap:var(--list-page-status-tabs-gap, 1.5rem);min-height:var(--list-page-status-tabs-height, 3.375rem);padding:var(--list-page-status-tabs-padding, 0 .75rem);border-bottom:1px solid var(--list-page-status-tabs-border-color, var(--color-divider));box-sizing:border-box}s-list-page-layout [SListPageTab]{position:relative;height:var(--list-page-status-tabs-height, 3.375rem);padding:0;border:0;background:transparent;color:var(--list-page-status-tabs-color, var(--color-text-secondary));font:inherit;cursor:pointer}s-list-page-layout [SListPageTab]:is(.is-active,[aria-selected=true]){color:var(--list-page-status-tabs-active-color, var(--color-primary))}s-list-page-layout [SListPageTab]:is(.is-active,[aria-selected=true]):after{position:absolute;right:0;bottom:0;left:0;height:2px;background:var(--list-page-status-tabs-active-color, var(--color-primary));content:\"\"}s-list-page-layout [SListPageTableScroll]{min-height:0;overflow:auto}s-list-page-layout table[SListPageTable]{width:100%;min-width:var(--list-page-table-min-width, 48rem);table-layout:fixed}s-list-page-layout [SListPageCellText]{display:block;width:100%;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}s-list-page-layout [SListPageCheckboxCol]{width:var(--list-page-checkbox-col-width, 3.5rem);min-width:var(--list-page-checkbox-col-width, 3.5rem);text-align:center}s-list-page-layout [SListPageActionCol]{width:var(--list-page-action-col-width, 5rem);min-width:var(--list-page-action-col-width, 5rem);white-space:nowrap}s-list-page-layout table[SListPageTable]:has(tbody td:last-child[SListPageActionCol]) thead th:last-child,s-list-page-layout table[SListPageTable]:has(tbody td:last-child[SListPageActionCol]) tbody td:last-child[SListPageActionCol]{width:var(--list-page-action-col-width, 5rem);min-width:var(--list-page-action-col-width, 5rem)}s-list-page-layout [SListPageEmpty]{height:8rem;color:var(--color-text-secondary);text-align:center}s-list-page-layout [SListPageRowActions]{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2)}s-list-page-layout [SListPageRowActionTrigger]{min-height:1.75rem;padding:0 var(--space-2);border:0;border-radius:var(--radius-common-s);background:transparent;color:var(--color-primary);font-size:var(--font-size-xs);font-family:inherit;cursor:pointer}s-list-page-layout [SListPageRowActionDanger]{color:var(--list-page-danger-action-color, var(--color-error))}s-list-page-layout [SListPageIconButton]{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-1);line-height:1}s-list-page-layout [SListPageFileAction]{cursor:pointer}s-list-page-layout [SListPageFileAction] input{display:none}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: ListPageLayoutComponent, decorators: [{
             type: Component,
-            args: [{ selector: 's-list-page-layout', imports: [NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<header>\r\n  <ng-content select=\"[SListPageHeader]\"/>\r\n  <ng-content select=\"s-list-page-header\"/>\r\n  <ng-content select=\"[SListPageSummary]\"/>\r\n  <ng-content select=\"s-filter-summary\"/>\r\n</header>\r\n<main>\r\n  @if (hasSidebar()) {\r\n    <aside>\r\n      <ng-content select=\"[SListPageSidebar]\"/>\r\n      <ng-content select=\"s-list-page-sidebar\"/>\r\n    </aside>\r\n  }\r\n  <section>\r\n    @if (desktopContentTemplate(); as contentTemplate) {\r\n      <ng-container [ngTemplateOutlet]=\"contentTemplate\"/>\r\n    }\r\n    <ng-content select=\"s-list-page-content-desktop\"/>\r\n  </section>\r\n</main>\r\n@if (hasPagination()) {\r\n  <footer>\r\n    @if (paginationTemplate(); as footerTemplate) {\r\n      <ng-container [ngTemplateOutlet]=\"footerTemplate\"/>\r\n    }\r\n    <ng-content select=\"s-list-page-pagination\"/>\r\n  </footer>\r\n}\r\n\r\n", styles: ["s-list-page-layout{display:flex;flex-direction:column;height:100%;min-height:0;padding:var(--space-3);box-sizing:border-box;gap:var(--space-3);background:var(--color-bg);overflow:hidden}s-list-page-layout>header{flex:0 0 auto;position:sticky;top:0;z-index:2;border:1px solid var(--color-divider);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:var(--shadow-common-s)}s-list-page-layout>main{flex:1 1 auto;display:flex;min-height:0;border:1px solid var(--color-divider);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:var(--shadow-common-s);overflow:hidden}s-list-page-layout>main>aside{display:flex;flex:0 0 240px;width:240px;min-width:0;padding:16px;border-right:1px solid var(--color-border);background:var(--color-surface);overflow:hidden;box-sizing:border-box}s-list-page-layout>main>section{flex:1 1 auto;min-width:0;padding:16px;background:var(--color-surface);overflow:auto;box-sizing:border-box}s-list-page-layout>footer{flex:0 0 auto;height:50px;display:flex;align-items:center;padding:0 16px;border:1px solid var(--color-divider);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:var(--shadow-common-s)}s-list-page-layout>main>aside>s-list-page-sidebar,s-list-page-layout>main>aside>[SListPageSidebar]{display:flex;flex:1 1 auto;flex-direction:column;gap:var(--space-3);min-width:0;min-height:0}s-list-page-layout [SListPageSidebarSearch]{position:sticky;top:0;z-index:1;flex:0 0 auto;background:var(--color-surface)}s-list-page-layout [SListPageSidebarTree]{flex:1 1 auto;min-height:0;overflow:auto}s-list-page-layout [SListPageHeaderLayout]{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:flex-start;gap:var(--space-4);padding:var(--space-4);min-width:0;background:var(--color-surface)}s-list-page-layout [SListPageHeaderFilters]{min-width:0}s-list-page-layout [SListPageHeaderLayout]>[SListPageHeaderFilters],s-list-page-layout [SListPageHeaderLayout]>:has([SListPageHeaderFilters]){justify-self:stretch;min-width:0}s-list-page-layout [SListPageHeaderLayout]>:not([SListPageHeaderFilters]):not(:has([SListPageHeaderFilters])){justify-self:end;min-width:0}s-list-page-layout [SListPageSummary]{display:block;width:auto;margin:var(--space-2) var(--space-4) var(--space-3)}s-list-page-layout [SListPageHeaderActions]{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:var(--space-3);min-width:0;margin-left:auto}s-list-page-layout [SListPageFilterGrid]{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3) var(--space-4);min-width:0}s-list-page-layout [SListPageFilterField]{display:inline-flex;align-items:center;gap:var(--space-2);min-width:0;color:var(--color-text-primary);font-size:var(--font-size-sm);line-height:var(--line-height-sm)}s-list-page-layout [SListPageFilterLabel],s-list-page-layout [SListPageFilterField]>span:first-child{color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-sm);white-space:nowrap;flex:0 0 auto}s-list-page-layout [SListPageFilterLabel]{display:none}s-list-page-layout [SListPageFilterControl],s-list-page-layout [SListPageFilterField] input,s-list-page-layout [SListPageFilterField] select,s-list-page-layout [SListPageFilterField] s-select,s-list-page-layout [SListPageFilterField] s-date-picker{min-width:0}s-list-page-layout [SListPageFilterActions]{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);min-width:0}s-list-page-layout [SListPageTableWrap]{width:100%;min-height:auto;overflow-x:auto;overflow-y:visible;border:0;border-radius:var(--radius-common-m);background:var(--color-surface);box-sizing:border-box}s-list-page-layout [SListPageTableWrap][data-with-tabs]{min-height:0;height:100%;display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden}s-list-page-layout [SListPageTabs]{display:flex;align-items:center;gap:var(--list-page-status-tabs-gap, 1.5rem);min-height:var(--list-page-status-tabs-height, 3.375rem);padding:var(--list-page-status-tabs-padding, 0 .75rem);border-bottom:1px solid var(--list-page-status-tabs-border-color, var(--color-divider));box-sizing:border-box}s-list-page-layout [SListPageTab]{position:relative;height:var(--list-page-status-tabs-height, 3.375rem);padding:0;border:0;background:transparent;color:var(--list-page-status-tabs-color, var(--color-text-secondary));font:inherit;cursor:pointer}s-list-page-layout [SListPageTab]:is(.is-active,[aria-selected=true]){color:var(--list-page-status-tabs-active-color, var(--color-primary))}s-list-page-layout [SListPageTab]:is(.is-active,[aria-selected=true]):after{position:absolute;right:0;bottom:0;left:0;height:2px;background:var(--list-page-status-tabs-active-color, var(--color-primary));content:\"\"}s-list-page-layout [SListPageTableScroll]{min-height:0;overflow:auto}s-list-page-layout table[SListPageTable]{width:100%;min-width:var(--list-page-table-min-width, 48rem);table-layout:fixed}s-list-page-layout [SListPageCellText]{display:block;width:100%;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}s-list-page-layout [SListPageCheckboxCol]{width:var(--list-page-checkbox-col-width, 3.5rem);min-width:var(--list-page-checkbox-col-width, 3.5rem);text-align:center}s-list-page-layout [SListPageActionCol]{width:var(--list-page-action-col-width, 5rem);min-width:var(--list-page-action-col-width, 5rem);white-space:nowrap}s-list-page-layout table[SListPageTable]:has(tbody td:last-child[SListPageActionCol]) thead th:last-child,s-list-page-layout table[SListPageTable]:has(tbody td:last-child[SListPageActionCol]) tbody td:last-child[SListPageActionCol]{width:var(--list-page-action-col-width, 5rem);min-width:var(--list-page-action-col-width, 5rem)}s-list-page-layout [SListPageEmpty]{height:8rem;color:var(--color-text-secondary);text-align:center}s-list-page-layout [SListPageRowActions]{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2)}s-list-page-layout [SListPageRowActionTrigger]{min-height:1.75rem;padding:0 var(--space-2);border:0;border-radius:var(--radius-common-s);background:transparent;color:var(--color-primary);font-size:var(--font-size-xs);font-family:inherit;cursor:pointer}s-list-page-layout [SListPageRowActionDanger]{color:var(--list-page-danger-action-color, var(--color-error))}s-list-page-layout [SListPageIconButton]{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-1);line-height:1}s-list-page-layout [SListPageFileAction]{cursor:pointer}s-list-page-layout [SListPageFileAction] input{display:none}\n"] }]
+            args: [{ selector: 's-list-page-layout', imports: [NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<header>\r\n  <ng-content select=\"[SListPageHeader]\"/>\r\n  <ng-content select=\"s-list-page-header\"/>\r\n  <ng-content select=\"[SListPageSummary]\"/>\r\n  <ng-content select=\"s-filter-summary\"/>\r\n</header>\r\n<main>\r\n  @if (hasSidebar()) {\r\n    <aside>\r\n      <ng-content select=\"[SListPageSidebar]\"/>\r\n      <ng-content select=\"s-list-page-sidebar\"/>\r\n    </aside>\r\n  }\r\n  <section>\r\n    @if (desktopContentTemplate(); as contentTemplate) {\r\n      <ng-container [ngTemplateOutlet]=\"contentTemplate\"/>\r\n    }\r\n    <ng-content select=\"s-list-page-content-desktop\"/>\r\n  </section>\r\n</main>\r\n<footer>\r\n  @if (paginationTemplate(); as footerTemplate) {\r\n    <ng-container [ngTemplateOutlet]=\"footerTemplate\"/>\r\n  }\r\n  <ng-content select=\"s-list-page-pagination\"/>\r\n</footer>\r\n\r\n", styles: ["s-list-page-layout{display:flex;flex-direction:column;height:100%;min-height:0;padding:var(--space-3);box-sizing:border-box;gap:var(--space-3);background:var(--color-bg);overflow:hidden}s-list-page-layout>header{flex:0 0 auto;position:sticky;top:0;z-index:2;border:1px solid var(--color-divider);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:var(--shadow-common-s)}s-list-page-layout>main{flex:1 1 auto;display:flex;min-height:0;border:1px solid var(--color-divider);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:var(--shadow-common-s);overflow:hidden}s-list-page-layout>main>aside{display:flex;flex:0 0 240px;width:240px;min-width:0;padding:16px;border-right:1px solid var(--color-border);background:var(--color-surface);overflow:hidden;box-sizing:border-box}s-list-page-layout>main>section{flex:1 1 auto;min-width:0;padding:16px;background:var(--color-surface);overflow:auto;box-sizing:border-box}s-list-page-layout>footer{flex:0 0 auto;height:50px;display:flex;align-items:center;padding:0 16px;border:1px solid var(--color-divider);border-radius:var(--radius-common-l);background:var(--color-surface);box-shadow:var(--shadow-common-s)}s-list-page-layout>footer:empty{display:none}s-list-page-layout>main>aside>s-list-page-sidebar,s-list-page-layout>main>aside>[SListPageSidebar]{display:flex;flex:1 1 auto;flex-direction:column;gap:var(--space-3);min-width:0;min-height:0}s-list-page-layout [SListPageSidebarSearch]{position:sticky;top:0;z-index:1;flex:0 0 auto;background:var(--color-surface)}s-list-page-layout [SListPageSidebarTree]{flex:1 1 auto;min-height:0;overflow:auto}s-list-page-layout [SListPageHeaderLayout]{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:flex-start;gap:var(--space-4);padding:var(--space-4);min-width:0;background:var(--color-surface)}s-list-page-layout [SListPageHeaderFilters]{min-width:0}s-list-page-layout [SListPageHeaderLayout]>[SListPageHeaderFilters],s-list-page-layout [SListPageHeaderLayout]>:has([SListPageHeaderFilters]){justify-self:stretch;min-width:0}s-list-page-layout [SListPageHeaderLayout]>:not([SListPageHeaderFilters]):not(:has([SListPageHeaderFilters])){justify-self:end;min-width:0}s-list-page-layout [SListPageSummary]{display:block;width:auto;margin:var(--space-2) var(--space-4) var(--space-3)}s-list-page-layout [SListPageHeaderActions]{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:var(--space-3);min-width:0;margin-left:auto}s-list-page-layout [SListPageFilterGrid]{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3) var(--space-4);min-width:0}s-list-page-layout [SListPageFilterField]{display:inline-flex;align-items:center;gap:var(--space-2);min-width:0;color:var(--color-text-primary);font-size:var(--font-size-sm);line-height:var(--line-height-sm)}s-list-page-layout [SListPageFilterLabel],s-list-page-layout [SListPageFilterField]>span:first-child{color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-sm);white-space:nowrap;flex:0 0 auto}s-list-page-layout [SListPageFilterLabel]{display:none}s-list-page-layout [SListPageFilterControl],s-list-page-layout [SListPageFilterField] input,s-list-page-layout [SListPageFilterField] select,s-list-page-layout [SListPageFilterField] s-select,s-list-page-layout [SListPageFilterField] s-date-picker{min-width:0}s-list-page-layout [SListPageFilterActions]{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);min-width:0}s-list-page-layout [SListPageTableWrap]{width:100%;min-height:auto;overflow-x:auto;overflow-y:visible;border:0;border-radius:var(--radius-common-m);background:var(--color-surface);box-sizing:border-box}s-list-page-layout [SListPageTableWrap][data-with-tabs]{min-height:0;height:100%;display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden}s-list-page-layout [SListPageTabs]{display:flex;align-items:center;gap:var(--list-page-status-tabs-gap, 1.5rem);min-height:var(--list-page-status-tabs-height, 3.375rem);padding:var(--list-page-status-tabs-padding, 0 .75rem);border-bottom:1px solid var(--list-page-status-tabs-border-color, var(--color-divider));box-sizing:border-box}s-list-page-layout [SListPageTab]{position:relative;height:var(--list-page-status-tabs-height, 3.375rem);padding:0;border:0;background:transparent;color:var(--list-page-status-tabs-color, var(--color-text-secondary));font:inherit;cursor:pointer}s-list-page-layout [SListPageTab]:is(.is-active,[aria-selected=true]){color:var(--list-page-status-tabs-active-color, var(--color-primary))}s-list-page-layout [SListPageTab]:is(.is-active,[aria-selected=true]):after{position:absolute;right:0;bottom:0;left:0;height:2px;background:var(--list-page-status-tabs-active-color, var(--color-primary));content:\"\"}s-list-page-layout [SListPageTableScroll]{min-height:0;overflow:auto}s-list-page-layout table[SListPageTable]{width:100%;min-width:var(--list-page-table-min-width, 48rem);table-layout:fixed}s-list-page-layout [SListPageCellText]{display:block;width:100%;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}s-list-page-layout [SListPageCheckboxCol]{width:var(--list-page-checkbox-col-width, 3.5rem);min-width:var(--list-page-checkbox-col-width, 3.5rem);text-align:center}s-list-page-layout [SListPageActionCol]{width:var(--list-page-action-col-width, 5rem);min-width:var(--list-page-action-col-width, 5rem);white-space:nowrap}s-list-page-layout table[SListPageTable]:has(tbody td:last-child[SListPageActionCol]) thead th:last-child,s-list-page-layout table[SListPageTable]:has(tbody td:last-child[SListPageActionCol]) tbody td:last-child[SListPageActionCol]{width:var(--list-page-action-col-width, 5rem);min-width:var(--list-page-action-col-width, 5rem)}s-list-page-layout [SListPageEmpty]{height:8rem;color:var(--color-text-secondary);text-align:center}s-list-page-layout [SListPageRowActions]{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2)}s-list-page-layout [SListPageRowActionTrigger]{min-height:1.75rem;padding:0 var(--space-2);border:0;border-radius:var(--radius-common-s);background:transparent;color:var(--color-primary);font-size:var(--font-size-xs);font-family:inherit;cursor:pointer}s-list-page-layout [SListPageRowActionDanger]{color:var(--list-page-danger-action-color, var(--color-error))}s-list-page-layout [SListPageIconButton]{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-1);line-height:1}s-list-page-layout [SListPageFileAction]{cursor:pointer}s-list-page-layout [SListPageFileAction] input{display:none}\n"] }]
         }], propDecorators: { sidebarSlot: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ListPageSidebarSlotDirective), { isSignal: true }] }], sidebarComponent: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ListPageSidebarComponent), { isSignal: true }] }], paginationTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ListPagePaginationSlotDirective), { ...{
                             read: TemplateRef,
-                        }, isSignal: true }] }], paginationComponent: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ListPagePaginationComponent), { isSignal: true }] }], desktopContentTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ListPageContentDesktopSlotDirective), { ...{
+                        }, isSignal: true }] }], desktopContentTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ListPageContentDesktopSlotDirective), { ...{
                             read: TemplateRef,
                         }, isSignal: true }] }] } });
 
@@ -4530,6 +5377,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
 
 class PlatformLoginPage {
     brandMark = input('OA', ...(ngDevMode ? [{ debugName: "brandMark" }] : /* istanbul ignore next */ []));
+    brandLogo = input('', ...(ngDevMode ? [{ debugName: "brandLogo" }] : /* istanbul ignore next */ []));
     brandName = input('Workspace', ...(ngDevMode ? [{ debugName: "brandName" }] : /* istanbul ignore next */ []));
     productName = input('智能办公平台', ...(ngDevMode ? [{ debugName: "productName" }] : /* istanbul ignore next */ []));
     heroAriaLabel = input('工作台登录页', ...(ngDevMode ? [{ debugName: "heroAriaLabel" }] : /* istanbul ignore next */ []));
@@ -4558,6 +5406,7 @@ class PlatformLoginPage {
     errorMessage = input('', ...(ngDevMode ? [{ debugName: "errorMessage" }] : /* istanbul ignore next */ []));
     submitting = input(false, ...(ngDevMode ? [{ debugName: "submitting" }] : /* istanbul ignore next */ []));
     defaultUsername = input('', ...(ngDevMode ? [{ debugName: "defaultUsername" }] : /* istanbul ignore next */ []));
+    defaultPassword = input('', ...(ngDevMode ? [{ debugName: "defaultPassword" }] : /* istanbul ignore next */ []));
     rememberDefault = input(true, ...(ngDevMode ? [{ debugName: "rememberDefault" }] : /* istanbul ignore next */ []));
     showForgotPassword = input(true, ...(ngDevMode ? [{ debugName: "showForgotPassword" }] : /* istanbul ignore next */ []));
     showRegister = input(true, ...(ngDevMode ? [{ debugName: "showRegister" }] : /* istanbul ignore next */ []));
@@ -4578,9 +5427,17 @@ class PlatformLoginPage {
     rememberMe = signal(true, ...(ngDevMode ? [{ debugName: "rememberMe" }] : /* istanbul ignore next */ []));
     showPassword = signal(false, ...(ngDevMode ? [{ debugName: "showPassword" }] : /* istanbul ignore next */ []));
     localErrorMessage = signal('', ...(ngDevMode ? [{ debugName: "localErrorMessage" }] : /* istanbul ignore next */ []));
+    brandLogoLabel = computed(() => {
+        const label = [this.brandName(), this.productName()]
+            .map((value) => value.trim())
+            .filter(Boolean)
+            .join(' ');
+        return label || this.brandMark();
+    }, ...(ngDevMode ? [{ debugName: "brandLogoLabel" }] : /* istanbul ignore next */ []));
     visibleErrorMessage = computed(() => this.errorMessage() || this.localErrorMessage(), ...(ngDevMode ? [{ debugName: "visibleErrorMessage" }] : /* istanbul ignore next */ []));
     ngOnInit() {
         this.username.set(this.defaultUsername());
+        this.password.set(this.defaultPassword());
         this.rememberMe.set(this.rememberDefault());
     }
     togglePassword() {
@@ -4625,15 +5482,16 @@ class PlatformLoginPage {
         return provider.label.trim().slice(0, 1).toUpperCase() || '?';
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PlatformLoginPage, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: PlatformLoginPage, isStandalone: true, selector: "s-login-page", inputs: { brandMark: { classPropertyName: "brandMark", publicName: "brandMark", isSignal: true, isRequired: false, transformFunction: null }, brandName: { classPropertyName: "brandName", publicName: "brandName", isSignal: true, isRequired: false, transformFunction: null }, productName: { classPropertyName: "productName", publicName: "productName", isSignal: true, isRequired: false, transformFunction: null }, heroAriaLabel: { classPropertyName: "heroAriaLabel", publicName: "heroAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, heroEyebrow: { classPropertyName: "heroEyebrow", publicName: "heroEyebrow", isSignal: true, isRequired: false, transformFunction: null }, heroTitle: { classPropertyName: "heroTitle", publicName: "heroTitle", isSignal: true, isRequired: false, transformFunction: null }, heroText: { classPropertyName: "heroText", publicName: "heroText", isSignal: true, isRequired: false, transformFunction: null }, features: { classPropertyName: "features", publicName: "features", isSignal: true, isRequired: false, transformFunction: null }, showLanguageSwitcher: { classPropertyName: "showLanguageSwitcher", publicName: "showLanguageSwitcher", isSignal: true, isRequired: false, transformFunction: null }, languageLabel: { classPropertyName: "languageLabel", publicName: "languageLabel", isSignal: true, isRequired: false, transformFunction: null }, panelEyebrow: { classPropertyName: "panelEyebrow", publicName: "panelEyebrow", isSignal: true, isRequired: false, transformFunction: null }, panelTitle: { classPropertyName: "panelTitle", publicName: "panelTitle", isSignal: true, isRequired: false, transformFunction: null }, panelSubtitle: { classPropertyName: "panelSubtitle", publicName: "panelSubtitle", isSignal: true, isRequired: false, transformFunction: null }, usernameLabel: { classPropertyName: "usernameLabel", publicName: "usernameLabel", isSignal: true, isRequired: false, transformFunction: null }, passwordLabel: { classPropertyName: "passwordLabel", publicName: "passwordLabel", isSignal: true, isRequired: false, transformFunction: null }, usernamePlaceholder: { classPropertyName: "usernamePlaceholder", publicName: "usernamePlaceholder", isSignal: true, isRequired: false, transformFunction: null }, passwordPlaceholder: { classPropertyName: "passwordPlaceholder", publicName: "passwordPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, rememberLabel: { classPropertyName: "rememberLabel", publicName: "rememberLabel", isSignal: true, isRequired: false, transformFunction: null }, forgotPasswordText: { classPropertyName: "forgotPasswordText", publicName: "forgotPasswordText", isSignal: true, isRequired: false, transformFunction: null }, dividerText: { classPropertyName: "dividerText", publicName: "dividerText", isSignal: true, isRequired: false, transformFunction: null }, registerPrompt: { classPropertyName: "registerPrompt", publicName: "registerPrompt", isSignal: true, isRequired: false, transformFunction: null }, registerText: { classPropertyName: "registerText", publicName: "registerText", isSignal: true, isRequired: false, transformFunction: null }, metaText: { classPropertyName: "metaText", publicName: "metaText", isSignal: true, isRequired: false, transformFunction: null }, submitText: { classPropertyName: "submitText", publicName: "submitText", isSignal: true, isRequired: false, transformFunction: null }, submittingText: { classPropertyName: "submittingText", publicName: "submittingText", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, submitting: { classPropertyName: "submitting", publicName: "submitting", isSignal: true, isRequired: false, transformFunction: null }, defaultUsername: { classPropertyName: "defaultUsername", publicName: "defaultUsername", isSignal: true, isRequired: false, transformFunction: null }, rememberDefault: { classPropertyName: "rememberDefault", publicName: "rememberDefault", isSignal: true, isRequired: false, transformFunction: null }, showForgotPassword: { classPropertyName: "showForgotPassword", publicName: "showForgotPassword", isSignal: true, isRequired: false, transformFunction: null }, showRegister: { classPropertyName: "showRegister", publicName: "showRegister", isSignal: true, isRequired: false, transformFunction: null }, socialProviders: { classPropertyName: "socialProviders", publicName: "socialProviders", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { loginSubmit: "loginSubmit", forgotPasswordClick: "forgotPasswordClick", registerClick: "registerClick", languageClick: "languageClick", socialLogin: "socialLogin" }, ngImport: i0, template: "<main class=\"platform-login\">\r\n  <section class=\"platform-login__stage\" [attr.aria-label]=\"heroAriaLabel()\">\r\n    @if (showLanguageSwitcher()) {\r\n      <button\r\n        class=\"platform-login__language\"\r\n        type=\"button\"\r\n        aria-label=\"\u5207\u6362\u8BED\u8A00\"\r\n        (click)=\"emitLanguageClick()\"\r\n      >\r\n        <lucide-icon [img]=\"languagesIcon\" size=\"16\" aria-hidden=\"true\" />\r\n        <span>{{ languageLabel() }}</span>\r\n        <lucide-icon [img]=\"chevronDownIcon\" size=\"14\" aria-hidden=\"true\" />\r\n      </button>\r\n    }\r\n\r\n    <div class=\"platform-login__content\">\r\n      <section class=\"platform-login__hero\">\r\n        <div class=\"platform-login__brand\">\r\n          <div class=\"platform-login__mark\" aria-hidden=\"true\">\r\n            <span>{{ brandMark() }}</span>\r\n          </div>\r\n          <div>\r\n            <p>{{ brandName() }}</p>\r\n            <h1>{{ productName() }}</h1>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"platform-login__hero-copy\">\r\n          @if (heroEyebrow()) {\r\n            <p class=\"platform-login__eyebrow\">{{ heroEyebrow() }}</p>\r\n          }\r\n          <h2>{{ heroTitle() }}</h2>\r\n          <p>{{ heroText() }}</p>\r\n        </div>\r\n\r\n        <div class=\"platform-login__visual\" aria-hidden=\"true\">\r\n          <div class=\"platform-login__device\">\r\n            <span class=\"platform-login__device-dot platform-login__device-dot--blue\"></span>\r\n            <span class=\"platform-login__device-dot platform-login__device-dot--green\"></span>\r\n            <div class=\"platform-login__device-row platform-login__device-row--short\"></div>\r\n            <div class=\"platform-login__device-card platform-login__device-card--primary\">\r\n              <span></span>\r\n              <strong></strong>\r\n            </div>\r\n            <div class=\"platform-login__device-card platform-login__device-card--floating\">\r\n              <span></span>\r\n              <strong></strong>\r\n            </div>\r\n            <div class=\"platform-login__device-list\">\r\n              <span></span>\r\n              <span></span>\r\n              <span></span>\r\n            </div>\r\n          </div>\r\n          <div class=\"platform-login__chart\">\r\n            <span></span>\r\n            <span></span>\r\n            <span></span>\r\n          </div>\r\n          <div class=\"platform-login__avatar\"></div>\r\n        </div>\r\n\r\n        @if (features().length > 0) {\r\n          <div class=\"platform-login__features\" aria-label=\"\u767B\u5F55\u9875\u7279\u6027\">\r\n            @for (feature of features(); track feature.label) {\r\n              <div [class]=\"featureClass(feature.toneClass)\">\r\n                @if (feature.icon) {\r\n                  <lucide-icon [img]=\"feature.icon\" size=\"20\" aria-hidden=\"true\" />\r\n                }\r\n                <span>{{ feature.label }}</span>\r\n                @if (feature.description) {\r\n                  <small>{{ feature.description }}</small>\r\n                }\r\n              </div>\r\n            }\r\n          </div>\r\n        }\r\n      </section>\r\n\r\n      <section class=\"platform-login__panel\" aria-labelledby=\"platform-login-title\">\r\n        <div class=\"platform-login__header\">\r\n          @if (panelEyebrow()) {\r\n            <p>{{ panelEyebrow() }}</p>\r\n          }\r\n          <h2 id=\"platform-login-title\">{{ panelTitle() }}</h2>\r\n          <span>{{ panelSubtitle() }}</span>\r\n        </div>\r\n\r\n        @if (visibleErrorMessage()) {\r\n          <p class=\"platform-login__error\" role=\"alert\">{{ visibleErrorMessage() }}</p>\r\n        }\r\n\r\n        <form class=\"platform-login__form\" (ngSubmit)=\"submit()\">\r\n          <label class=\"platform-login__field\">\r\n            <span>{{ usernameLabel() }}</span>\r\n            <div class=\"platform-login__control\">\r\n              <lucide-icon [img]=\"userIcon\" size=\"17\" aria-hidden=\"true\" />\r\n              <input\r\n                type=\"text\"\r\n                data-platform-input=\"bare\"\r\n                autocomplete=\"username\"\r\n                [placeholder]=\"usernamePlaceholder()\"\r\n                [ngModel]=\"username()\"\r\n                (ngModelChange)=\"username.set($event)\"\r\n                name=\"username\"\r\n              />\r\n            </div>\r\n          </label>\r\n\r\n          <label class=\"platform-login__field\">\r\n            <span>{{ passwordLabel() }}</span>\r\n            <div class=\"platform-login__control\">\r\n              <lucide-icon [img]=\"keyIcon\" size=\"17\" aria-hidden=\"true\" />\r\n              <input\r\n                [type]=\"showPassword() ? 'text' : 'password'\"\r\n                data-platform-input=\"bare\"\r\n                autocomplete=\"current-password\"\r\n                [placeholder]=\"passwordPlaceholder()\"\r\n                [ngModel]=\"password()\"\r\n                (ngModelChange)=\"password.set($event)\"\r\n                name=\"password\"\r\n              />\r\n              <button\r\n                class=\"platform-login__icon-button\"\r\n                type=\"button\"\r\n                [attr.aria-label]=\"showPassword() ? '\u9690\u85CF\u5BC6\u7801' : '\u663E\u793A\u5BC6\u7801'\"\r\n                (click)=\"togglePassword()\"\r\n              >\r\n                <lucide-icon [img]=\"showPassword() ? eyeOffIcon : eyeIcon\" size=\"17\" aria-hidden=\"true\" />\r\n              </button>\r\n            </div>\r\n          </label>\r\n\r\n          <div class=\"platform-login__options\">\r\n            <label class=\"platform-login__remember\">\r\n              <input\r\n                type=\"checkbox\"\r\n                [ngModel]=\"rememberMe()\"\r\n                (ngModelChange)=\"rememberMe.set($event)\"\r\n                name=\"rememberMe\"\r\n              />\r\n              <span>{{ rememberLabel() }}</span>\r\n            </label>\r\n            @if (showForgotPassword()) {\r\n              <button class=\"platform-login__link\" type=\"button\" (click)=\"emitForgotPassword()\">\r\n                {{ forgotPasswordText() }}\r\n              </button>\r\n            } @else if (metaText()) {\r\n              <span>{{ metaText() }}</span>\r\n            }\r\n          </div>\r\n\r\n          @if (metaText() && showForgotPassword()) {\r\n            <p class=\"platform-login__meta\">{{ metaText() }}</p>\r\n          }\r\n\r\n          <button class=\"platform-login__submit\" type=\"submit\" [disabled]=\"submitting()\">\r\n            {{ submitting() ? submittingText() : submitText() }}\r\n          </button>\r\n        </form>\r\n\r\n        @if (socialProviders().length > 0) {\r\n          <div class=\"platform-login__social\">\r\n            <div class=\"platform-login__divider\">\r\n              <span>{{ dividerText() }}</span>\r\n            </div>\r\n            <div class=\"platform-login__social-list\">\r\n              @for (provider of socialProviders(); track provider.id) {\r\n                <button\r\n                  [class]=\"socialProviderClass(provider.toneClass)\"\r\n                  type=\"button\"\r\n                  [disabled]=\"provider.disabled\"\r\n                  [attr.aria-label]=\"provider.label\"\r\n                  (click)=\"emitSocialLogin(provider)\"\r\n                >\r\n                  @if (provider.icon) {\r\n                    <lucide-icon [img]=\"provider.icon\" size=\"22\" aria-hidden=\"true\" />\r\n                    <span class=\"platform-login__social-label\">{{ provider.label }}</span>\r\n                  } @else {\r\n                    <span>{{ socialProviderInitial(provider) }}</span>\r\n                  }\r\n                </button>\r\n              }\r\n            </div>\r\n          </div>\r\n        }\r\n\r\n        @if (showRegister()) {\r\n          <p class=\"platform-login__register\">\r\n            <span>{{ registerPrompt() }}</span>\r\n            <button class=\"platform-login__link\" type=\"button\" (click)=\"emitRegister()\">\r\n              {{ registerText() }}\r\n            </button>\r\n          </p>\r\n        }\r\n      </section>\r\n    </div>\r\n  </section>\r\n</main>\r\n", styles: [":host{display:block;height:100dvh;min-height:100dvh;overflow:auto;color:var(--platform-login-text, #111827);font-family:Inter,SF Pro Display,PingFang SC,Microsoft YaHei,sans-serif}.platform-login,.platform-login *{box-sizing:border-box}.platform-login{--platform-login-available-height: calc(100dvh - (var(--platform-login-page-padding, 1.875rem) * 2));height:100%;min-height:0;display:grid;place-items:center;padding:var(--platform-login-page-padding, 1.875rem);background:linear-gradient(180deg,#fffffff2,#f7fbffeb),linear-gradient(135deg,#f8fbff,#edf5ff 48%,#f6f9ff);overflow:hidden}.platform-login__stage{position:relative;width:min(100%,var(--platform-login-stage-width, 90rem));height:min(50rem,var(--platform-login-available-height));min-height:min(42rem,var(--platform-login-available-height));overflow:hidden;border:1px solid var(--platform-login-stage-border, rgba(126, 164, 232, .34));border-radius:var(--platform-login-stage-radius, 1.5rem);background:linear-gradient(110deg,#ffffffb8,#e8f2ffbd 45%,#d6e6ffdb),#eef6ff;box-shadow:var(--platform-login-stage-shadow, 0 1.375rem 3.25rem rgba(66, 111, 180, .18));isolation:isolate}.platform-login__stage:before{content:\"\";position:absolute;inset:13% -14% auto auto;width:52%;height:78%;border:1px solid rgba(255,255,255,.66);border-radius:50%;background:linear-gradient(135deg,#ffffff52,#b9d3ff26);transform:rotate(-19deg);z-index:-1}.platform-login__stage:after{content:\"\";position:absolute;inset:auto -8% -28% 44%;height:76%;border:1px solid rgba(103,151,230,.18);border-radius:50% 50% 0 0;transform:rotate(11deg);z-index:-1}.platform-login__language{position:absolute;top:2rem;right:2.375rem;z-index:2;display:inline-flex;align-items:center;gap:.375rem;min-height:2.25rem;padding:0 .375rem;border:0;border-radius:.75rem;background:transparent;color:var(--platform-login-muted, #475569);cursor:pointer;font:inherit;font-size:.875rem}.platform-login__language:hover{background:#ffffff7a;color:var(--platform-login-primary, #1677ff)}.platform-login__content{height:100%;min-height:0;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(21rem,27rem);align-items:center;gap:clamp(2rem,6vw,6.5rem);padding:5.625rem clamp(2rem,6vw,5.625rem) 3.625rem}.platform-login__hero{min-width:0;display:grid;gap:1.5rem;align-content:center}.platform-login__brand,.platform-login__options,.platform-login__remember,.platform-login__social-list,.platform-login__register,.platform-login__divider{display:flex;align-items:center}.platform-login__brand{gap:.875rem}.platform-login__mark{position:relative;width:2.75rem;height:2.75rem;display:grid;place-items:center;color:#1677ff;font-size:.8125rem;font-weight:800}.platform-login__mark:before,.platform-login__mark:after{content:\"\";position:absolute;inset:.25rem;border:.25rem solid currentColor;border-radius:.75rem;transform:rotate(30deg)}.platform-login__mark:after{inset:.6875rem;border-width:.1875rem;color:#1677ff3d;transform:rotate(-30deg)}.platform-login__mark span{position:relative;z-index:1;transform:translateY(.0625rem)}.platform-login__brand p,.platform-login__brand h1,.platform-login__hero-copy p,.platform-login__hero-copy h2,.platform-login__header p,.platform-login__header h2,.platform-login__header span,.platform-login__error,.platform-login__meta,.platform-login__register{margin:0}.platform-login__brand p{color:var(--platform-login-muted, #64748b);font-size:.875rem;line-height:1.3}.platform-login__brand h1{margin-top:.25rem;color:var(--platform-login-text, #0f172a);font-size:1.75rem;line-height:1.2;font-weight:800;letter-spacing:0}.platform-login__hero-copy{max-width:35rem}.platform-login__eyebrow,.platform-login__header p{color:var(--platform-login-primary, #1677ff);font-size:.8125rem;line-height:1.5;font-weight:700}.platform-login__hero-copy h2{color:var(--platform-login-text, #0f172a);font-size:1.75rem;line-height:1.22;font-weight:800;letter-spacing:0}.platform-login__hero-copy>p:last-child{margin-top:.75rem;color:var(--platform-login-soft, #475569);font-size:1rem;line-height:1.7}.platform-login__visual{position:relative;width:min(100%,28.75rem);aspect-ratio:1.42;margin:.375rem 0 0 2rem;border-radius:2rem;background:linear-gradient(180deg,#ffffff4d,#c9dcff1f),linear-gradient(155deg,#5f91ff14,#ffffff6b);transform:perspective(54rem) rotateX(58deg) rotate(-18deg);transform-origin:50% 70%;box-shadow:0 1.625rem 3.125rem #3b76e638,inset 0 0 0 1px #ffffffa8}.platform-login__visual:before{content:\"\";position:absolute;inset:8% 8% 12%;border-radius:1.375rem;border:1px solid rgba(255,255,255,.72)}.platform-login__device{position:absolute;left:33%;bottom:18%;width:38%;height:78%;border:1px solid rgba(132,170,240,.56);border-radius:.75rem;background:linear-gradient(180deg,#ffffffd6,#dceaffa3),#f6faff;box-shadow:0 1.25rem 2.5rem #3571e033,inset 0 0 1rem #ffffffc7}.platform-login__device-dot,.platform-login__device-row,.platform-login__device-card,.platform-login__device-list,.platform-login__chart,.platform-login__avatar{position:absolute}.platform-login__device-dot{top:12%;width:.625rem;height:.625rem;border-radius:50%}.platform-login__device-dot--blue{left:13%;background:#1677ff}.platform-login__device-dot--green{left:26%;background:#00b42a}.platform-login__device-row{left:39%;right:10%;top:13%;height:.5rem;border-radius:999px;background:#96b4eb47}.platform-login__device-card{display:grid;align-items:center;grid-template-columns:2.125rem minmax(0,1fr);gap:.625rem;padding:.625rem .75rem;border-radius:.75rem;background:#ffffffc7;box-shadow:0 .875rem 1.75rem #3870dc2e,inset 0 0 0 1px #ffffffd1}.platform-login__device-card span{display:block;width:1.625rem;height:1.625rem;border-radius:50%;background:linear-gradient(135deg,#7ca3ed,#cfe0ff)}.platform-login__device-card strong{display:block;height:.5625rem;border-radius:999px;background:linear-gradient(90deg,#7aa7ff,#7aa7ff40)}.platform-login__device-card--primary{left:20%;right:-20%;top:34%}.platform-login__device-card--floating{left:72%;right:-32%;top:58%}.platform-login__device-list{left:24%;right:20%;bottom:15%;display:grid;gap:.5rem}.platform-login__device-list span{height:.4375rem;border-radius:999px;background:#759eec47}.platform-login__device-list span:nth-child(2){width:72%}.platform-login__device-list span:nth-child(3){width:86%}.platform-login__chart{left:11%;bottom:18%;width:22%;height:42%;display:flex;align-items:flex-end;justify-content:center;gap:.5rem;padding:.875rem .625rem;border:1px solid rgba(132,170,240,.48);border-radius:.875rem;background:#ffffffc7;box-shadow:0 1rem 1.875rem #3870dc2e}.platform-login__chart span{width:.625rem;border-radius:999px 999px .25rem .25rem;background:linear-gradient(180deg,#7aa7ff,#2b79ff)}.platform-login__chart span:nth-child(1){height:38%}.platform-login__chart span:nth-child(2){height:62%}.platform-login__chart span:nth-child(3){height:82%}.platform-login__avatar{left:27%;bottom:46%;width:2.5rem;height:2.5rem;border:.375rem solid rgba(255,255,255,.8);border-radius:50%;background:linear-gradient(135deg,#3182ff,#b5d0ff);box-shadow:0 .75rem 1.625rem #3182ff47}.platform-login__features{width:min(100%,34rem);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}.platform-login__feature{min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;align-items:center;gap:.125rem .625rem;padding:.75rem .875rem;border:1px solid rgba(255,255,255,.72);border-radius:1rem;background:#ffffff80;box-shadow:0 .625rem 1.25rem #406eb414;color:#1677ff}.platform-login__feature lucide-icon{grid-row:1/span 2;width:2.375rem;height:2.375rem;display:grid;place-items:center;border-radius:50%;background:#1677ff1a}.platform-login__feature span{min-width:0;overflow:hidden;color:var(--platform-login-text, #111827);font-size:.875rem;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.platform-login__feature small{min-width:0;overflow:hidden;color:var(--platform-login-soft, #64748b);font-size:.75rem;line-height:1.4;text-overflow:ellipsis;white-space:nowrap}.platform-login__feature.is-green{color:#00b42a}.platform-login__feature.is-green lucide-icon{background:#00b42a1a}.platform-login__feature.is-amber{color:#ff9500}.platform-login__feature.is-amber lucide-icon{background:#ff95001f}.platform-login__feature.is-violet{color:#7c3aed}.platform-login__feature.is-violet lucide-icon{background:#7c3aed1a}.platform-login__panel{width:100%;align-self:center;display:grid;gap:1.125rem;padding:3rem 2.625rem 2.25rem;border:1px solid rgba(255,255,255,.72);border-radius:var(--platform-login-panel-radius, 1.5rem);background:var(--platform-login-panel-bg, rgba(255, 255, 255, .88));box-shadow:var(--platform-login-panel-shadow, 0 1.25rem 3rem rgba(42, 82, 142, .14));-webkit-backdrop-filter:blur(1.25rem);backdrop-filter:blur(1.25rem)}.platform-login__header{display:grid;gap:.5rem}.platform-login__header h2{color:var(--platform-login-text, #111827);font-size:1.625rem;line-height:1.25;font-weight:800;letter-spacing:0}.platform-login__header span{color:var(--platform-login-soft, #64748b);font-size:.875rem;line-height:1.5}.platform-login__error{padding:.625rem .75rem;border:1px solid rgba(239,68,68,.22);border-radius:.75rem;background:#fff1f2;color:#dc2626;font-size:.8125rem;line-height:1.5}.platform-login__form{display:grid;gap:1rem}.platform-login__field{display:grid;gap:.5rem}.platform-login__field>span{color:var(--platform-login-label, #1f2937);font-size:.8125rem;font-weight:700;line-height:1.5}.platform-login__control{min-height:2.75rem;display:flex;align-items:center;gap:.5rem;padding:0 .75rem;border:1px solid var(--platform-login-input-border, #d8e1ee);border-radius:var(--platform-login-input-radius, .75rem);background:var(--platform-login-input-bg, rgba(255, 255, 255, .92));color:var(--platform-login-muted, #72819a);transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}.platform-login__control:focus-within{border-color:var(--platform-login-primary, #1677ff);background:#fff;box-shadow:0 0 0 .1875rem #1677ff1f}.platform-login__control input{appearance:none;width:100%;min-width:0;height:2.625rem;padding:0!important;padding-inline:0!important;border:0!important;border-radius:0;outline:0;background:transparent;box-shadow:none!important;color:var(--platform-login-text, #111827);font:inherit;font-size:.875rem}.platform-login__control input::placeholder{color:#9aa8ba}.platform-login__icon-button,.platform-login__link,.platform-login__submit,.platform-login__social-button{font:inherit}.platform-login__icon-button{width:2rem;height:2rem;flex:0 0 auto;display:grid;place-items:center;padding:0;border:0;border-radius:.625rem;background:transparent;color:var(--platform-login-muted, #72819a);cursor:pointer}.platform-login__icon-button:hover{background:#f1f6ff;color:var(--platform-login-primary, #1677ff)}.platform-login__options{justify-content:space-between;gap:.75rem;color:var(--platform-login-soft, #64748b);font-size:.8125rem}.platform-login__remember{gap:.4375rem;min-width:0}.platform-login__remember input{width:.9375rem;height:.9375rem;margin:0;accent-color:var(--platform-login-primary, #1677ff)}.platform-login__remember span{white-space:nowrap}.platform-login__link{display:inline-flex;align-items:center;min-height:1.5rem;padding:0;border:0;background:transparent;color:var(--platform-login-primary, #1677ff);cursor:pointer;font-size:.8125rem;font-weight:700}.platform-login__link:hover{color:#0958d9}.platform-login__meta{color:var(--platform-login-soft, #64748b);font-size:.75rem;line-height:1.5}.platform-login__submit{min-height:2.75rem;border:0;border-radius:var(--platform-login-button-radius, .75rem);background:var(--platform-login-button-bg, linear-gradient(180deg, #2385ff 0%, #1677ff 100%));color:#fff;box-shadow:var(--platform-login-button-shadow, 0 .875rem 1.625rem rgba(22, 119, 255, .22));cursor:pointer;font-size:.9375rem;font-weight:800}.platform-login__submit:hover:not(:disabled){background:linear-gradient(180deg,#3390ff,#0f6be8)}.platform-login__submit:disabled{cursor:progress;opacity:.72}.platform-login__social{display:grid;gap:1rem}.platform-login__divider{gap:.875rem;color:var(--platform-login-soft, #64748b);font-size:.8125rem;line-height:1.5;white-space:nowrap}.platform-login__divider:before,.platform-login__divider:after{content:\"\";height:1px;flex:1 1 auto;background:#e6edf6}.platform-login__social-list{justify-content:center;gap:1rem}.platform-login__social-button{position:relative;width:2.75rem;height:2.75rem;display:grid;place-items:center;padding:0;border:1px solid rgba(217,225,237,.86);border-radius:50%;background:#fff;color:#111827;box-shadow:0 .625rem 1.25rem #2a528e14;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.platform-login__social-button:hover:not(:disabled){border-color:#1677ff52;box-shadow:0 .875rem 1.625rem #2a528e1f;transform:translateY(-.125rem)}.platform-login__social-button:disabled{cursor:not-allowed;opacity:.5}.platform-login__social-button.is-wechat{color:#00b42a}.platform-login__social-button.is-dingtalk{color:#24a8ff}.platform-login__social-button.is-apple{color:#111827}.platform-login__social-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.platform-login__register{justify-content:center;gap:.375rem;color:var(--platform-login-soft, #64748b);font-size:.875rem}.platform-login__language:focus-visible,.platform-login__icon-button:focus-visible,.platform-login__link:focus-visible,.platform-login__submit:focus-visible,.platform-login__social-button:focus-visible{outline:2px solid var(--platform-login-primary, #1677ff);outline-offset:2px}@media(min-width:72rem){.platform-login__hero-copy h2{font-size:2rem}}@media(min-width:64.01rem)and (max-height:52rem){.platform-login__content{gap:clamp(1.5rem,4vw,4rem);padding:4.25rem clamp(1.75rem,5vw,4.75rem) 2.5rem}.platform-login__hero{gap:1.125rem}.platform-login__visual{width:min(100%,24rem);margin-top:0}.platform-login__panel{gap:1rem;padding:2.5rem 2.375rem 2rem}}@media(min-width:64.01rem)and (max-height:42rem){.platform-login{height:auto;min-height:100%;overflow:auto}.platform-login__stage{height:auto;min-height:var(--platform-login-available-height)}.platform-login__content{height:auto;min-height:inherit}}@media(max-width:64rem){.platform-login{height:auto;min-height:100%;padding:1rem;overflow:auto}.platform-login__stage{height:auto;min-height:calc(100dvh - 2rem)}.platform-login__content{height:auto;min-height:inherit;grid-template-columns:1fr;gap:2rem;padding:5rem 1.5rem 1.5rem}.platform-login__hero{justify-items:center;text-align:center}.platform-login__brand{justify-content:center}.platform-login__visual{width:min(100%,25rem);margin:0}.platform-login__features{width:min(100%,40rem)}.platform-login__panel{width:min(100%,27rem);justify-self:center}}@media(max-width:40rem){.platform-login{place-items:start center;padding:0}.platform-login__stage{width:100%;min-height:100dvh;overflow:visible;border-width:0;border-radius:0;box-shadow:none}.platform-login__language{top:1rem;right:1rem}.platform-login__content{padding:4.25rem .875rem 1rem}.platform-login__brand h1{font-size:1.375rem}.platform-login__hero-copy h2{font-size:1.5rem}.platform-login__hero-copy>p:last-child{font-size:.9375rem}.platform-login__visual{width:min(100%,17rem)}.platform-login__features{grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}.platform-login__feature{grid-template-columns:1fr;justify-items:center;gap:.375rem;padding:.625rem .375rem;text-align:center}.platform-login__feature lucide-icon{grid-row:auto;width:2rem;height:2rem}.platform-login__feature span{font-size:.75rem}.platform-login__feature small{display:none}.platform-login__panel{padding:1.5rem 1.125rem;border-radius:1.125rem}.platform-login__options{align-items:flex-start;flex-direction:column}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: LucideAngularModule }, { kind: "component", type: i1.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: PlatformLoginPage, isStandalone: true, selector: "s-login-page", inputs: { brandMark: { classPropertyName: "brandMark", publicName: "brandMark", isSignal: true, isRequired: false, transformFunction: null }, brandLogo: { classPropertyName: "brandLogo", publicName: "brandLogo", isSignal: true, isRequired: false, transformFunction: null }, brandName: { classPropertyName: "brandName", publicName: "brandName", isSignal: true, isRequired: false, transformFunction: null }, productName: { classPropertyName: "productName", publicName: "productName", isSignal: true, isRequired: false, transformFunction: null }, heroAriaLabel: { classPropertyName: "heroAriaLabel", publicName: "heroAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, heroEyebrow: { classPropertyName: "heroEyebrow", publicName: "heroEyebrow", isSignal: true, isRequired: false, transformFunction: null }, heroTitle: { classPropertyName: "heroTitle", publicName: "heroTitle", isSignal: true, isRequired: false, transformFunction: null }, heroText: { classPropertyName: "heroText", publicName: "heroText", isSignal: true, isRequired: false, transformFunction: null }, features: { classPropertyName: "features", publicName: "features", isSignal: true, isRequired: false, transformFunction: null }, showLanguageSwitcher: { classPropertyName: "showLanguageSwitcher", publicName: "showLanguageSwitcher", isSignal: true, isRequired: false, transformFunction: null }, languageLabel: { classPropertyName: "languageLabel", publicName: "languageLabel", isSignal: true, isRequired: false, transformFunction: null }, panelEyebrow: { classPropertyName: "panelEyebrow", publicName: "panelEyebrow", isSignal: true, isRequired: false, transformFunction: null }, panelTitle: { classPropertyName: "panelTitle", publicName: "panelTitle", isSignal: true, isRequired: false, transformFunction: null }, panelSubtitle: { classPropertyName: "panelSubtitle", publicName: "panelSubtitle", isSignal: true, isRequired: false, transformFunction: null }, usernameLabel: { classPropertyName: "usernameLabel", publicName: "usernameLabel", isSignal: true, isRequired: false, transformFunction: null }, passwordLabel: { classPropertyName: "passwordLabel", publicName: "passwordLabel", isSignal: true, isRequired: false, transformFunction: null }, usernamePlaceholder: { classPropertyName: "usernamePlaceholder", publicName: "usernamePlaceholder", isSignal: true, isRequired: false, transformFunction: null }, passwordPlaceholder: { classPropertyName: "passwordPlaceholder", publicName: "passwordPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, rememberLabel: { classPropertyName: "rememberLabel", publicName: "rememberLabel", isSignal: true, isRequired: false, transformFunction: null }, forgotPasswordText: { classPropertyName: "forgotPasswordText", publicName: "forgotPasswordText", isSignal: true, isRequired: false, transformFunction: null }, dividerText: { classPropertyName: "dividerText", publicName: "dividerText", isSignal: true, isRequired: false, transformFunction: null }, registerPrompt: { classPropertyName: "registerPrompt", publicName: "registerPrompt", isSignal: true, isRequired: false, transformFunction: null }, registerText: { classPropertyName: "registerText", publicName: "registerText", isSignal: true, isRequired: false, transformFunction: null }, metaText: { classPropertyName: "metaText", publicName: "metaText", isSignal: true, isRequired: false, transformFunction: null }, submitText: { classPropertyName: "submitText", publicName: "submitText", isSignal: true, isRequired: false, transformFunction: null }, submittingText: { classPropertyName: "submittingText", publicName: "submittingText", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, submitting: { classPropertyName: "submitting", publicName: "submitting", isSignal: true, isRequired: false, transformFunction: null }, defaultUsername: { classPropertyName: "defaultUsername", publicName: "defaultUsername", isSignal: true, isRequired: false, transformFunction: null }, defaultPassword: { classPropertyName: "defaultPassword", publicName: "defaultPassword", isSignal: true, isRequired: false, transformFunction: null }, rememberDefault: { classPropertyName: "rememberDefault", publicName: "rememberDefault", isSignal: true, isRequired: false, transformFunction: null }, showForgotPassword: { classPropertyName: "showForgotPassword", publicName: "showForgotPassword", isSignal: true, isRequired: false, transformFunction: null }, showRegister: { classPropertyName: "showRegister", publicName: "showRegister", isSignal: true, isRequired: false, transformFunction: null }, socialProviders: { classPropertyName: "socialProviders", publicName: "socialProviders", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { loginSubmit: "loginSubmit", forgotPasswordClick: "forgotPasswordClick", registerClick: "registerClick", languageClick: "languageClick", socialLogin: "socialLogin" }, ngImport: i0, template: "<main class=\"platform-login\">\r\n  <section class=\"platform-login__stage\" [attr.aria-label]=\"heroAriaLabel()\">\r\n    @if (showLanguageSwitcher()) {\r\n      <button\r\n        class=\"platform-login__language\"\r\n        type=\"button\"\r\n        aria-label=\"\u5207\u6362\u8BED\u8A00\"\r\n        (click)=\"emitLanguageClick()\"\r\n      >\r\n        <lucide-icon [img]=\"languagesIcon\" size=\"16\" aria-hidden=\"true\" />\r\n        <span>{{ languageLabel() }}</span>\r\n        <lucide-icon [img]=\"chevronDownIcon\" size=\"14\" aria-hidden=\"true\" />\r\n      </button>\r\n    }\r\n\r\n    <div class=\"platform-login__content\">\r\n      <section class=\"platform-login__hero\">\n        <div class=\"platform-login__brand\">\n          @if (brandLogo()) {\n            <div class=\"platform-login__brand-logo-frame\">\n              <img\n                class=\"platform-login__brand-logo\"\n                [ngSrc]=\"brandLogo()\"\n                width=\"315\"\n                height=\"95\"\n                [alt]=\"brandLogoLabel()\"\n                draggable=\"false\"\n                priority\n              />\n            </div>\n          } @else {\n            <div class=\"platform-login__mark\" aria-hidden=\"true\">\n              <span>{{ brandMark() }}</span>\n            </div>\n            <div>\n              <p>{{ brandName() }}</p>\n              <h1>{{ productName() }}</h1>\n            </div>\n          }\n        </div>\n\r\n        <div class=\"platform-login__hero-copy\">\r\n          @if (heroEyebrow()) {\r\n            <p class=\"platform-login__eyebrow\">{{ heroEyebrow() }}</p>\r\n          }\r\n          <h2>{{ heroTitle() }}</h2>\r\n          <p>{{ heroText() }}</p>\r\n        </div>\r\n\r\n        <div class=\"platform-login__visual\" aria-hidden=\"true\">\r\n          <div class=\"platform-login__device\">\r\n            <span class=\"platform-login__device-dot platform-login__device-dot--blue\"></span>\r\n            <span class=\"platform-login__device-dot platform-login__device-dot--green\"></span>\r\n            <div class=\"platform-login__device-row platform-login__device-row--short\"></div>\r\n            <div class=\"platform-login__device-card platform-login__device-card--primary\">\r\n              <span></span>\r\n              <strong></strong>\r\n            </div>\r\n            <div class=\"platform-login__device-card platform-login__device-card--floating\">\r\n              <span></span>\r\n              <strong></strong>\r\n            </div>\r\n            <div class=\"platform-login__device-list\">\r\n              <span></span>\r\n              <span></span>\r\n              <span></span>\r\n            </div>\r\n          </div>\r\n          <div class=\"platform-login__chart\">\r\n            <span></span>\r\n            <span></span>\r\n            <span></span>\r\n          </div>\r\n          <div class=\"platform-login__avatar\"></div>\r\n        </div>\r\n\r\n        @if (features().length > 0) {\r\n          <div class=\"platform-login__features\" aria-label=\"\u767B\u5F55\u9875\u7279\u6027\">\r\n            @for (feature of features(); track feature.label) {\r\n              <div [class]=\"featureClass(feature.toneClass)\">\r\n                @if (feature.icon) {\r\n                  <lucide-icon [img]=\"feature.icon\" size=\"20\" aria-hidden=\"true\" />\r\n                }\r\n                <span>{{ feature.label }}</span>\r\n                @if (feature.description) {\r\n                  <small>{{ feature.description }}</small>\r\n                }\r\n              </div>\r\n            }\r\n          </div>\r\n        }\r\n      </section>\r\n\r\n      <section class=\"platform-login__panel\" aria-labelledby=\"platform-login-title\">\r\n        <div class=\"platform-login__header\">\r\n          @if (panelEyebrow()) {\r\n            <p>{{ panelEyebrow() }}</p>\r\n          }\r\n          <h2 id=\"platform-login-title\">{{ panelTitle() }}</h2>\r\n          <span>{{ panelSubtitle() }}</span>\r\n        </div>\r\n\r\n        @if (visibleErrorMessage()) {\r\n          <p class=\"platform-login__error\" role=\"alert\">{{ visibleErrorMessage() }}</p>\r\n        }\r\n\r\n        <form class=\"platform-login__form\" (ngSubmit)=\"submit()\">\r\n          <label class=\"platform-login__field\">\r\n            <span>{{ usernameLabel() }}</span>\r\n            <div class=\"platform-login__control\">\r\n              <lucide-icon [img]=\"userIcon\" size=\"17\" aria-hidden=\"true\" />\r\n              <input\r\n                type=\"text\"\r\n                data-platform-input=\"bare\"\r\n                autocomplete=\"username\"\r\n                [placeholder]=\"usernamePlaceholder()\"\r\n                [ngModel]=\"username()\"\r\n                (ngModelChange)=\"username.set($event)\"\r\n                name=\"username\"\r\n              />\r\n            </div>\r\n          </label>\r\n\r\n          <label class=\"platform-login__field\">\r\n            <span>{{ passwordLabel() }}</span>\r\n            <div class=\"platform-login__control\">\r\n              <lucide-icon [img]=\"keyIcon\" size=\"17\" aria-hidden=\"true\" />\r\n              <input\r\n                [type]=\"showPassword() ? 'text' : 'password'\"\r\n                data-platform-input=\"bare\"\r\n                autocomplete=\"current-password\"\r\n                [placeholder]=\"passwordPlaceholder()\"\r\n                [ngModel]=\"password()\"\r\n                (ngModelChange)=\"password.set($event)\"\r\n                name=\"password\"\r\n              />\r\n              <button\r\n                class=\"platform-login__icon-button\"\r\n                type=\"button\"\r\n                [attr.aria-label]=\"showPassword() ? '\u9690\u85CF\u5BC6\u7801' : '\u663E\u793A\u5BC6\u7801'\"\r\n                (click)=\"togglePassword()\"\r\n              >\r\n                <lucide-icon [img]=\"showPassword() ? eyeOffIcon : eyeIcon\" size=\"17\" aria-hidden=\"true\" />\r\n              </button>\r\n            </div>\r\n          </label>\r\n\r\n          <div class=\"platform-login__options\">\r\n            <label class=\"platform-login__remember\">\r\n              <input\r\n                type=\"checkbox\"\r\n                [ngModel]=\"rememberMe()\"\r\n                (ngModelChange)=\"rememberMe.set($event)\"\r\n                name=\"rememberMe\"\r\n              />\r\n              <span>{{ rememberLabel() }}</span>\r\n            </label>\r\n            @if (showForgotPassword()) {\r\n              <button class=\"platform-login__link\" type=\"button\" (click)=\"emitForgotPassword()\">\r\n                {{ forgotPasswordText() }}\r\n              </button>\r\n            } @else if (metaText()) {\r\n              <span>{{ metaText() }}</span>\r\n            }\r\n          </div>\r\n\r\n          @if (metaText() && showForgotPassword()) {\r\n            <p class=\"platform-login__meta\">{{ metaText() }}</p>\r\n          }\r\n\r\n          <button class=\"platform-login__submit\" type=\"submit\" [disabled]=\"submitting()\">\r\n            {{ submitting() ? submittingText() : submitText() }}\r\n          </button>\r\n        </form>\r\n\r\n        @if (socialProviders().length > 0) {\r\n          <div class=\"platform-login__social\">\r\n            <div class=\"platform-login__divider\">\r\n              <span>{{ dividerText() }}</span>\r\n            </div>\r\n            <div class=\"platform-login__social-list\">\r\n              @for (provider of socialProviders(); track provider.id) {\r\n                <button\r\n                  [class]=\"socialProviderClass(provider.toneClass)\"\r\n                  type=\"button\"\r\n                  [disabled]=\"provider.disabled\"\r\n                  [attr.aria-label]=\"provider.label\"\r\n                  (click)=\"emitSocialLogin(provider)\"\r\n                >\r\n                  @if (provider.icon) {\r\n                    <lucide-icon [img]=\"provider.icon\" size=\"22\" aria-hidden=\"true\" />\r\n                    <span class=\"platform-login__social-label\">{{ provider.label }}</span>\r\n                  } @else {\r\n                    <span>{{ socialProviderInitial(provider) }}</span>\r\n                  }\r\n                </button>\r\n              }\r\n            </div>\r\n          </div>\r\n        }\r\n\r\n        @if (showRegister()) {\r\n          <p class=\"platform-login__register\">\r\n            <span>{{ registerPrompt() }}</span>\r\n            <button class=\"platform-login__link\" type=\"button\" (click)=\"emitRegister()\">\r\n              {{ registerText() }}\r\n            </button>\r\n          </p>\r\n        }\r\n      </section>\r\n    </div>\r\n  </section>\r\n</main>\r\n", styles: [":host{display:block;height:100dvh;min-height:100dvh;overflow:auto;color:var(--platform-login-text, #111827);font-family:Inter,SF Pro Display,PingFang SC,Microsoft YaHei,sans-serif}.platform-login,.platform-login *{box-sizing:border-box}.platform-login{--platform-login-available-height: calc(100dvh - (var(--platform-login-page-padding, 1.875rem) * 2));height:100%;min-height:0;display:grid;place-items:center;padding:var(--platform-login-page-padding, 1.875rem);background:linear-gradient(180deg,#fffffff2,#f7fbffeb),linear-gradient(135deg,#f8fbff,#edf5ff 48%,#f6f9ff);overflow:hidden}.platform-login__stage{position:relative;width:min(100%,var(--platform-login-stage-width, 90rem));height:min(50rem,var(--platform-login-available-height));min-height:min(42rem,var(--platform-login-available-height));overflow:hidden;border:1px solid var(--platform-login-stage-border, rgba(126, 164, 232, .34));border-radius:var(--platform-login-stage-radius, 1.5rem);background:linear-gradient(110deg,#ffffffb8,#e8f2ffbd 45%,#d6e6ffdb),#eef6ff;box-shadow:var(--platform-login-stage-shadow, 0 1.375rem 3.25rem rgba(66, 111, 180, .18));isolation:isolate}.platform-login__stage:before{content:\"\";position:absolute;inset:13% -14% auto auto;width:52%;height:78%;border:1px solid rgba(255,255,255,.66);border-radius:50%;background:linear-gradient(135deg,#ffffff52,#b9d3ff26);transform:rotate(-19deg);z-index:-1}.platform-login__stage:after{content:\"\";position:absolute;inset:auto -8% -28% 44%;height:76%;border:1px solid rgba(103,151,230,.18);border-radius:50% 50% 0 0;transform:rotate(11deg);z-index:-1}.platform-login__language{position:absolute;top:2rem;right:2.375rem;z-index:2;display:inline-flex;align-items:center;gap:.375rem;min-height:2.25rem;padding:0 .375rem;border:0;border-radius:.75rem;background:transparent;color:var(--platform-login-muted, #475569);cursor:pointer;font:inherit;font-size:.875rem}.platform-login__language:hover{background:#ffffff7a;color:var(--platform-login-primary, #1677ff)}.platform-login__content{height:100%;min-height:0;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(21rem,27rem);align-items:center;gap:clamp(2rem,6vw,6.5rem);padding:5.625rem clamp(2rem,6vw,5.625rem) 3.625rem}.platform-login__hero{min-width:0;display:grid;gap:1.5rem;align-content:center}.platform-login__brand,.platform-login__options,.platform-login__remember,.platform-login__social-list,.platform-login__register,.platform-login__divider{display:flex;align-items:center}.platform-login__brand{gap:.875rem}.platform-login__mark{position:relative;width:2.75rem;height:2.75rem;display:grid;place-items:center;color:#1677ff;font-size:.8125rem;font-weight:800}.platform-login__mark:before,.platform-login__mark:after{content:\"\";position:absolute;inset:.25rem;border:.25rem solid currentColor;border-radius:.75rem;transform:rotate(30deg)}.platform-login__mark:after{inset:.6875rem;border-width:.1875rem;color:#1677ff3d;transform:rotate(-30deg)}.platform-login__mark span{position:relative;z-index:1;transform:translateY(.0625rem)}.platform-login__brand-logo-frame{width:min(100%,16.5rem);padding:var(--platform-login-brand-logo-frame-padding, .375rem .625rem .375rem .3125rem);border:var(--platform-login-brand-logo-frame-border, 1px solid rgba(255, 255, 255, .38));border-radius:var(--platform-login-brand-logo-frame-radius, 1rem);background:var(--platform-login-brand-logo-frame-bg, linear-gradient(135deg, rgba(18, 57, 112, .96), rgba(20, 137, 132, .95)));box-shadow:var(--platform-login-brand-logo-frame-shadow, 0 .875rem 1.875rem rgba(32, 91, 151, .18))}.platform-login__brand-logo{display:block;width:100%;height:auto;object-fit:contain;object-position:left center;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.platform-login__brand p,.platform-login__brand h1,.platform-login__hero-copy p,.platform-login__hero-copy h2,.platform-login__header p,.platform-login__header h2,.platform-login__header span,.platform-login__error,.platform-login__meta,.platform-login__register{margin:0}.platform-login__brand p{color:var(--platform-login-muted, #64748b);font-size:.875rem;line-height:1.3}.platform-login__brand h1{margin-top:.25rem;color:var(--platform-login-text, #0f172a);font-size:1.75rem;line-height:1.2;font-weight:800;letter-spacing:0}.platform-login__hero-copy{max-width:35rem}.platform-login__eyebrow,.platform-login__header p{color:var(--platform-login-primary, #1677ff);font-size:.8125rem;line-height:1.5;font-weight:700}.platform-login__hero-copy h2{color:var(--platform-login-text, #0f172a);font-size:1.75rem;line-height:1.22;font-weight:800;letter-spacing:0}.platform-login__hero-copy>p:last-child{margin-top:.75rem;color:var(--platform-login-soft, #475569);font-size:1rem;line-height:1.7}.platform-login__visual{position:relative;width:min(100%,28.75rem);aspect-ratio:1.42;margin:.375rem 0 0 2rem;border-radius:2rem;background:linear-gradient(180deg,#ffffff4d,#c9dcff1f),linear-gradient(155deg,#5f91ff14,#ffffff6b);transform:perspective(54rem) rotateX(58deg) rotate(-18deg);transform-origin:50% 70%;box-shadow:0 1.625rem 3.125rem #3b76e638,inset 0 0 0 1px #ffffffa8}.platform-login__visual:before{content:\"\";position:absolute;inset:8% 8% 12%;border-radius:1.375rem;border:1px solid rgba(255,255,255,.72)}.platform-login__device{position:absolute;left:33%;bottom:18%;width:38%;height:78%;border:1px solid rgba(132,170,240,.56);border-radius:.75rem;background:linear-gradient(180deg,#ffffffd6,#dceaffa3),#f6faff;box-shadow:0 1.25rem 2.5rem #3571e033,inset 0 0 1rem #ffffffc7}.platform-login__device-dot,.platform-login__device-row,.platform-login__device-card,.platform-login__device-list,.platform-login__chart,.platform-login__avatar{position:absolute}.platform-login__device-dot{top:12%;width:.625rem;height:.625rem;border-radius:50%}.platform-login__device-dot--blue{left:13%;background:#1677ff}.platform-login__device-dot--green{left:26%;background:#00b42a}.platform-login__device-row{left:39%;right:10%;top:13%;height:.5rem;border-radius:999px;background:#96b4eb47}.platform-login__device-card{display:grid;align-items:center;grid-template-columns:2.125rem minmax(0,1fr);gap:.625rem;padding:.625rem .75rem;border-radius:.75rem;background:#ffffffc7;box-shadow:0 .875rem 1.75rem #3870dc2e,inset 0 0 0 1px #ffffffd1}.platform-login__device-card span{display:block;width:1.625rem;height:1.625rem;border-radius:50%;background:linear-gradient(135deg,#7ca3ed,#cfe0ff)}.platform-login__device-card strong{display:block;height:.5625rem;border-radius:999px;background:linear-gradient(90deg,#7aa7ff,#7aa7ff40)}.platform-login__device-card--primary{left:20%;right:-20%;top:34%}.platform-login__device-card--floating{left:72%;right:-32%;top:58%}.platform-login__device-list{left:24%;right:20%;bottom:15%;display:grid;gap:.5rem}.platform-login__device-list span{height:.4375rem;border-radius:999px;background:#759eec47}.platform-login__device-list span:nth-child(2){width:72%}.platform-login__device-list span:nth-child(3){width:86%}.platform-login__chart{left:11%;bottom:18%;width:22%;height:42%;display:flex;align-items:flex-end;justify-content:center;gap:.5rem;padding:.875rem .625rem;border:1px solid rgba(132,170,240,.48);border-radius:.875rem;background:#ffffffc7;box-shadow:0 1rem 1.875rem #3870dc2e}.platform-login__chart span{width:.625rem;border-radius:999px 999px .25rem .25rem;background:linear-gradient(180deg,#7aa7ff,#2b79ff)}.platform-login__chart span:nth-child(1){height:38%}.platform-login__chart span:nth-child(2){height:62%}.platform-login__chart span:nth-child(3){height:82%}.platform-login__avatar{left:27%;bottom:46%;width:2.5rem;height:2.5rem;border:.375rem solid rgba(255,255,255,.8);border-radius:50%;background:linear-gradient(135deg,#3182ff,#b5d0ff);box-shadow:0 .75rem 1.625rem #3182ff47}.platform-login__features{width:min(100%,34rem);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}.platform-login__feature{min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;align-items:center;gap:.125rem .625rem;padding:.75rem .875rem;border:1px solid rgba(255,255,255,.72);border-radius:1rem;background:#ffffff80;box-shadow:0 .625rem 1.25rem #406eb414;color:#1677ff}.platform-login__feature lucide-icon{grid-row:1/span 2;width:2.375rem;height:2.375rem;display:grid;place-items:center;border-radius:50%;background:#1677ff1a}.platform-login__feature span{min-width:0;overflow:hidden;color:var(--platform-login-text, #111827);font-size:.875rem;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.platform-login__feature small{min-width:0;color:var(--platform-login-soft, #64748b);font-size:.75rem;line-height:1.4;overflow-wrap:anywhere}.platform-login__feature.is-green{color:#00b42a}.platform-login__feature.is-green lucide-icon{background:#00b42a1a}.platform-login__feature.is-amber{color:#ff9500}.platform-login__feature.is-amber lucide-icon{background:#ff95001f}.platform-login__feature.is-violet{color:#7c3aed}.platform-login__feature.is-violet lucide-icon{background:#7c3aed1a}.platform-login__panel{width:100%;align-self:center;display:grid;gap:1.125rem;padding:3rem 2.625rem 2.25rem;border:1px solid rgba(255,255,255,.72);border-radius:var(--platform-login-panel-radius, 1.5rem);background:var(--platform-login-panel-bg, rgba(255, 255, 255, .88));box-shadow:var(--platform-login-panel-shadow, 0 1.25rem 3rem rgba(42, 82, 142, .14));-webkit-backdrop-filter:blur(1.25rem);backdrop-filter:blur(1.25rem)}.platform-login__header{display:grid;gap:.5rem}.platform-login__header h2{color:var(--platform-login-text, #111827);font-size:1.625rem;line-height:1.25;font-weight:800;letter-spacing:0}.platform-login__header span{color:var(--platform-login-soft, #64748b);font-size:.875rem;line-height:1.5}.platform-login__error{padding:.625rem .75rem;border:1px solid rgba(239,68,68,.22);border-radius:.75rem;background:#fff1f2;color:#dc2626;font-size:.8125rem;line-height:1.5}.platform-login__form{display:grid;gap:1rem}.platform-login__field{display:grid;gap:.5rem}.platform-login__field>span{color:var(--platform-login-label, #1f2937);font-size:.8125rem;font-weight:700;line-height:1.5}.platform-login__control{min-height:2.75rem;display:flex;align-items:center;gap:.5rem;padding:0 .75rem;border:1px solid var(--platform-login-input-border, #d8e1ee);border-radius:var(--platform-login-input-radius, .75rem);background:var(--platform-login-input-bg, rgba(255, 255, 255, .92));color:var(--platform-login-muted, #72819a);transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}.platform-login__control:focus-within{border-color:var(--platform-login-primary, #1677ff);background:#fff;box-shadow:0 0 0 .1875rem #1677ff1f}.platform-login__control input{appearance:none;width:100%;min-width:0;height:2.625rem;padding:0!important;padding-inline:0!important;border:0!important;border-radius:0;outline:0;background:transparent;box-shadow:none!important;color:var(--platform-login-text, #111827);font:inherit;font-size:.875rem}.platform-login__control input::placeholder{color:#9aa8ba}.platform-login__icon-button,.platform-login__link,.platform-login__submit,.platform-login__social-button{font:inherit}.platform-login__icon-button{width:2rem;height:2rem;flex:0 0 auto;display:grid;place-items:center;padding:0;border:0;border-radius:.625rem;background:transparent;color:var(--platform-login-muted, #72819a);cursor:pointer}.platform-login__icon-button:hover{background:#f1f6ff;color:var(--platform-login-primary, #1677ff)}.platform-login__options{justify-content:space-between;gap:.75rem;color:var(--platform-login-soft, #64748b);font-size:.8125rem}.platform-login__remember{gap:.4375rem;min-width:0}.platform-login__remember input{width:.9375rem;height:.9375rem;margin:0;accent-color:var(--platform-login-primary, #1677ff)}.platform-login__remember span{white-space:nowrap}.platform-login__link{display:inline-flex;align-items:center;min-height:1.5rem;padding:0;border:0;background:transparent;color:var(--platform-login-primary, #1677ff);cursor:pointer;font-size:.8125rem;font-weight:700}.platform-login__link:hover{color:#0958d9}.platform-login__meta{color:var(--platform-login-soft, #64748b);font-size:.75rem;line-height:1.5}.platform-login__submit{min-height:2.75rem;border:0;border-radius:var(--platform-login-button-radius, .75rem);background:var(--platform-login-button-bg, linear-gradient(180deg, #2385ff 0%, #1677ff 100%));color:#fff;box-shadow:var(--platform-login-button-shadow, 0 .875rem 1.625rem rgba(22, 119, 255, .22));cursor:pointer;font-size:.9375rem;font-weight:800}.platform-login__submit:hover:not(:disabled){background:linear-gradient(180deg,#3390ff,#0f6be8)}.platform-login__submit:disabled{cursor:progress;opacity:.72}.platform-login__social{display:grid;gap:1rem}.platform-login__divider{gap:.875rem;color:var(--platform-login-soft, #64748b);font-size:.8125rem;line-height:1.5;white-space:nowrap}.platform-login__divider:before,.platform-login__divider:after{content:\"\";height:1px;flex:1 1 auto;background:#e6edf6}.platform-login__social-list{justify-content:center;gap:1rem}.platform-login__social-button{position:relative;width:2.75rem;height:2.75rem;display:grid;place-items:center;padding:0;border:1px solid rgba(217,225,237,.86);border-radius:50%;background:#fff;color:#111827;box-shadow:0 .625rem 1.25rem #2a528e14;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.platform-login__social-button:hover:not(:disabled){border-color:#1677ff52;box-shadow:0 .875rem 1.625rem #2a528e1f;transform:translateY(-.125rem)}.platform-login__social-button:disabled{cursor:not-allowed;opacity:.5}.platform-login__social-button.is-wechat{color:#00b42a}.platform-login__social-button.is-dingtalk{color:#24a8ff}.platform-login__social-button.is-apple{color:#111827}.platform-login__social-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.platform-login__register{justify-content:center;gap:.375rem;color:var(--platform-login-soft, #64748b);font-size:.875rem}.platform-login__language:focus-visible,.platform-login__icon-button:focus-visible,.platform-login__link:focus-visible,.platform-login__submit:focus-visible,.platform-login__social-button:focus-visible{outline:2px solid var(--platform-login-primary, #1677ff);outline-offset:2px}@media(min-width:72rem){.platform-login__hero-copy h2{font-size:2rem}}@media(min-width:64.01rem)and (max-height:52rem){.platform-login__content{gap:clamp(1.5rem,4vw,4rem);padding:4.25rem clamp(1.75rem,5vw,4.75rem) 2.5rem}.platform-login__hero{gap:1.125rem}.platform-login__visual{width:min(100%,24rem);margin-top:0}.platform-login__panel{gap:1rem;padding:2.5rem 2.375rem 2rem}}@media(min-width:64.01rem)and (max-height:42rem){.platform-login{height:auto;min-height:100%;overflow:auto}.platform-login__stage{height:auto;min-height:var(--platform-login-available-height)}.platform-login__content{height:auto;min-height:inherit}}@media(max-width:64rem){.platform-login{height:auto;min-height:100%;padding:1rem;overflow:auto}.platform-login__stage{height:auto;min-height:calc(100dvh - 2rem)}.platform-login__content{height:auto;min-height:inherit;grid-template-columns:1fr;gap:2rem;padding:5rem 1.5rem 1.5rem}.platform-login__hero{justify-items:center;text-align:center}.platform-login__brand{justify-content:center}.platform-login__visual{width:min(100%,25rem);margin:0}.platform-login__features{width:min(100%,40rem)}.platform-login__panel{width:min(100%,27rem);justify-self:center}}@media(max-width:40rem){.platform-login{place-items:start center;padding:0}.platform-login__stage{width:100%;min-height:100dvh;overflow:visible;border-width:0;border-radius:0;box-shadow:none}.platform-login__language{top:1rem;right:1rem}.platform-login__content{padding:4.25rem .875rem 1rem}.platform-login__brand h1{font-size:1.375rem}.platform-login__hero-copy h2{font-size:1.5rem}.platform-login__hero-copy>p:last-child{font-size:.9375rem}.platform-login__visual{width:min(100%,17rem)}.platform-login__features{grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}.platform-login__feature{grid-template-columns:1fr;justify-items:center;gap:.375rem;padding:.625rem .375rem;text-align:center}.platform-login__feature lucide-icon{grid-row:auto;width:2rem;height:2rem}.platform-login__feature span{font-size:.75rem}.platform-login__feature small{display:none}.platform-login__panel{padding:1.5rem 1.125rem;border-radius:1.125rem}.platform-login__options{align-items:flex-start;flex-direction:column}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: LucideAngularModule }, { kind: "component", type: i1.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PlatformLoginPage, decorators: [{
             type: Component,
-            args: [{ selector: 's-login-page', imports: [FormsModule, LucideAngularModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<main class=\"platform-login\">\r\n  <section class=\"platform-login__stage\" [attr.aria-label]=\"heroAriaLabel()\">\r\n    @if (showLanguageSwitcher()) {\r\n      <button\r\n        class=\"platform-login__language\"\r\n        type=\"button\"\r\n        aria-label=\"\u5207\u6362\u8BED\u8A00\"\r\n        (click)=\"emitLanguageClick()\"\r\n      >\r\n        <lucide-icon [img]=\"languagesIcon\" size=\"16\" aria-hidden=\"true\" />\r\n        <span>{{ languageLabel() }}</span>\r\n        <lucide-icon [img]=\"chevronDownIcon\" size=\"14\" aria-hidden=\"true\" />\r\n      </button>\r\n    }\r\n\r\n    <div class=\"platform-login__content\">\r\n      <section class=\"platform-login__hero\">\r\n        <div class=\"platform-login__brand\">\r\n          <div class=\"platform-login__mark\" aria-hidden=\"true\">\r\n            <span>{{ brandMark() }}</span>\r\n          </div>\r\n          <div>\r\n            <p>{{ brandName() }}</p>\r\n            <h1>{{ productName() }}</h1>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"platform-login__hero-copy\">\r\n          @if (heroEyebrow()) {\r\n            <p class=\"platform-login__eyebrow\">{{ heroEyebrow() }}</p>\r\n          }\r\n          <h2>{{ heroTitle() }}</h2>\r\n          <p>{{ heroText() }}</p>\r\n        </div>\r\n\r\n        <div class=\"platform-login__visual\" aria-hidden=\"true\">\r\n          <div class=\"platform-login__device\">\r\n            <span class=\"platform-login__device-dot platform-login__device-dot--blue\"></span>\r\n            <span class=\"platform-login__device-dot platform-login__device-dot--green\"></span>\r\n            <div class=\"platform-login__device-row platform-login__device-row--short\"></div>\r\n            <div class=\"platform-login__device-card platform-login__device-card--primary\">\r\n              <span></span>\r\n              <strong></strong>\r\n            </div>\r\n            <div class=\"platform-login__device-card platform-login__device-card--floating\">\r\n              <span></span>\r\n              <strong></strong>\r\n            </div>\r\n            <div class=\"platform-login__device-list\">\r\n              <span></span>\r\n              <span></span>\r\n              <span></span>\r\n            </div>\r\n          </div>\r\n          <div class=\"platform-login__chart\">\r\n            <span></span>\r\n            <span></span>\r\n            <span></span>\r\n          </div>\r\n          <div class=\"platform-login__avatar\"></div>\r\n        </div>\r\n\r\n        @if (features().length > 0) {\r\n          <div class=\"platform-login__features\" aria-label=\"\u767B\u5F55\u9875\u7279\u6027\">\r\n            @for (feature of features(); track feature.label) {\r\n              <div [class]=\"featureClass(feature.toneClass)\">\r\n                @if (feature.icon) {\r\n                  <lucide-icon [img]=\"feature.icon\" size=\"20\" aria-hidden=\"true\" />\r\n                }\r\n                <span>{{ feature.label }}</span>\r\n                @if (feature.description) {\r\n                  <small>{{ feature.description }}</small>\r\n                }\r\n              </div>\r\n            }\r\n          </div>\r\n        }\r\n      </section>\r\n\r\n      <section class=\"platform-login__panel\" aria-labelledby=\"platform-login-title\">\r\n        <div class=\"platform-login__header\">\r\n          @if (panelEyebrow()) {\r\n            <p>{{ panelEyebrow() }}</p>\r\n          }\r\n          <h2 id=\"platform-login-title\">{{ panelTitle() }}</h2>\r\n          <span>{{ panelSubtitle() }}</span>\r\n        </div>\r\n\r\n        @if (visibleErrorMessage()) {\r\n          <p class=\"platform-login__error\" role=\"alert\">{{ visibleErrorMessage() }}</p>\r\n        }\r\n\r\n        <form class=\"platform-login__form\" (ngSubmit)=\"submit()\">\r\n          <label class=\"platform-login__field\">\r\n            <span>{{ usernameLabel() }}</span>\r\n            <div class=\"platform-login__control\">\r\n              <lucide-icon [img]=\"userIcon\" size=\"17\" aria-hidden=\"true\" />\r\n              <input\r\n                type=\"text\"\r\n                data-platform-input=\"bare\"\r\n                autocomplete=\"username\"\r\n                [placeholder]=\"usernamePlaceholder()\"\r\n                [ngModel]=\"username()\"\r\n                (ngModelChange)=\"username.set($event)\"\r\n                name=\"username\"\r\n              />\r\n            </div>\r\n          </label>\r\n\r\n          <label class=\"platform-login__field\">\r\n            <span>{{ passwordLabel() }}</span>\r\n            <div class=\"platform-login__control\">\r\n              <lucide-icon [img]=\"keyIcon\" size=\"17\" aria-hidden=\"true\" />\r\n              <input\r\n                [type]=\"showPassword() ? 'text' : 'password'\"\r\n                data-platform-input=\"bare\"\r\n                autocomplete=\"current-password\"\r\n                [placeholder]=\"passwordPlaceholder()\"\r\n                [ngModel]=\"password()\"\r\n                (ngModelChange)=\"password.set($event)\"\r\n                name=\"password\"\r\n              />\r\n              <button\r\n                class=\"platform-login__icon-button\"\r\n                type=\"button\"\r\n                [attr.aria-label]=\"showPassword() ? '\u9690\u85CF\u5BC6\u7801' : '\u663E\u793A\u5BC6\u7801'\"\r\n                (click)=\"togglePassword()\"\r\n              >\r\n                <lucide-icon [img]=\"showPassword() ? eyeOffIcon : eyeIcon\" size=\"17\" aria-hidden=\"true\" />\r\n              </button>\r\n            </div>\r\n          </label>\r\n\r\n          <div class=\"platform-login__options\">\r\n            <label class=\"platform-login__remember\">\r\n              <input\r\n                type=\"checkbox\"\r\n                [ngModel]=\"rememberMe()\"\r\n                (ngModelChange)=\"rememberMe.set($event)\"\r\n                name=\"rememberMe\"\r\n              />\r\n              <span>{{ rememberLabel() }}</span>\r\n            </label>\r\n            @if (showForgotPassword()) {\r\n              <button class=\"platform-login__link\" type=\"button\" (click)=\"emitForgotPassword()\">\r\n                {{ forgotPasswordText() }}\r\n              </button>\r\n            } @else if (metaText()) {\r\n              <span>{{ metaText() }}</span>\r\n            }\r\n          </div>\r\n\r\n          @if (metaText() && showForgotPassword()) {\r\n            <p class=\"platform-login__meta\">{{ metaText() }}</p>\r\n          }\r\n\r\n          <button class=\"platform-login__submit\" type=\"submit\" [disabled]=\"submitting()\">\r\n            {{ submitting() ? submittingText() : submitText() }}\r\n          </button>\r\n        </form>\r\n\r\n        @if (socialProviders().length > 0) {\r\n          <div class=\"platform-login__social\">\r\n            <div class=\"platform-login__divider\">\r\n              <span>{{ dividerText() }}</span>\r\n            </div>\r\n            <div class=\"platform-login__social-list\">\r\n              @for (provider of socialProviders(); track provider.id) {\r\n                <button\r\n                  [class]=\"socialProviderClass(provider.toneClass)\"\r\n                  type=\"button\"\r\n                  [disabled]=\"provider.disabled\"\r\n                  [attr.aria-label]=\"provider.label\"\r\n                  (click)=\"emitSocialLogin(provider)\"\r\n                >\r\n                  @if (provider.icon) {\r\n                    <lucide-icon [img]=\"provider.icon\" size=\"22\" aria-hidden=\"true\" />\r\n                    <span class=\"platform-login__social-label\">{{ provider.label }}</span>\r\n                  } @else {\r\n                    <span>{{ socialProviderInitial(provider) }}</span>\r\n                  }\r\n                </button>\r\n              }\r\n            </div>\r\n          </div>\r\n        }\r\n\r\n        @if (showRegister()) {\r\n          <p class=\"platform-login__register\">\r\n            <span>{{ registerPrompt() }}</span>\r\n            <button class=\"platform-login__link\" type=\"button\" (click)=\"emitRegister()\">\r\n              {{ registerText() }}\r\n            </button>\r\n          </p>\r\n        }\r\n      </section>\r\n    </div>\r\n  </section>\r\n</main>\r\n", styles: [":host{display:block;height:100dvh;min-height:100dvh;overflow:auto;color:var(--platform-login-text, #111827);font-family:Inter,SF Pro Display,PingFang SC,Microsoft YaHei,sans-serif}.platform-login,.platform-login *{box-sizing:border-box}.platform-login{--platform-login-available-height: calc(100dvh - (var(--platform-login-page-padding, 1.875rem) * 2));height:100%;min-height:0;display:grid;place-items:center;padding:var(--platform-login-page-padding, 1.875rem);background:linear-gradient(180deg,#fffffff2,#f7fbffeb),linear-gradient(135deg,#f8fbff,#edf5ff 48%,#f6f9ff);overflow:hidden}.platform-login__stage{position:relative;width:min(100%,var(--platform-login-stage-width, 90rem));height:min(50rem,var(--platform-login-available-height));min-height:min(42rem,var(--platform-login-available-height));overflow:hidden;border:1px solid var(--platform-login-stage-border, rgba(126, 164, 232, .34));border-radius:var(--platform-login-stage-radius, 1.5rem);background:linear-gradient(110deg,#ffffffb8,#e8f2ffbd 45%,#d6e6ffdb),#eef6ff;box-shadow:var(--platform-login-stage-shadow, 0 1.375rem 3.25rem rgba(66, 111, 180, .18));isolation:isolate}.platform-login__stage:before{content:\"\";position:absolute;inset:13% -14% auto auto;width:52%;height:78%;border:1px solid rgba(255,255,255,.66);border-radius:50%;background:linear-gradient(135deg,#ffffff52,#b9d3ff26);transform:rotate(-19deg);z-index:-1}.platform-login__stage:after{content:\"\";position:absolute;inset:auto -8% -28% 44%;height:76%;border:1px solid rgba(103,151,230,.18);border-radius:50% 50% 0 0;transform:rotate(11deg);z-index:-1}.platform-login__language{position:absolute;top:2rem;right:2.375rem;z-index:2;display:inline-flex;align-items:center;gap:.375rem;min-height:2.25rem;padding:0 .375rem;border:0;border-radius:.75rem;background:transparent;color:var(--platform-login-muted, #475569);cursor:pointer;font:inherit;font-size:.875rem}.platform-login__language:hover{background:#ffffff7a;color:var(--platform-login-primary, #1677ff)}.platform-login__content{height:100%;min-height:0;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(21rem,27rem);align-items:center;gap:clamp(2rem,6vw,6.5rem);padding:5.625rem clamp(2rem,6vw,5.625rem) 3.625rem}.platform-login__hero{min-width:0;display:grid;gap:1.5rem;align-content:center}.platform-login__brand,.platform-login__options,.platform-login__remember,.platform-login__social-list,.platform-login__register,.platform-login__divider{display:flex;align-items:center}.platform-login__brand{gap:.875rem}.platform-login__mark{position:relative;width:2.75rem;height:2.75rem;display:grid;place-items:center;color:#1677ff;font-size:.8125rem;font-weight:800}.platform-login__mark:before,.platform-login__mark:after{content:\"\";position:absolute;inset:.25rem;border:.25rem solid currentColor;border-radius:.75rem;transform:rotate(30deg)}.platform-login__mark:after{inset:.6875rem;border-width:.1875rem;color:#1677ff3d;transform:rotate(-30deg)}.platform-login__mark span{position:relative;z-index:1;transform:translateY(.0625rem)}.platform-login__brand p,.platform-login__brand h1,.platform-login__hero-copy p,.platform-login__hero-copy h2,.platform-login__header p,.platform-login__header h2,.platform-login__header span,.platform-login__error,.platform-login__meta,.platform-login__register{margin:0}.platform-login__brand p{color:var(--platform-login-muted, #64748b);font-size:.875rem;line-height:1.3}.platform-login__brand h1{margin-top:.25rem;color:var(--platform-login-text, #0f172a);font-size:1.75rem;line-height:1.2;font-weight:800;letter-spacing:0}.platform-login__hero-copy{max-width:35rem}.platform-login__eyebrow,.platform-login__header p{color:var(--platform-login-primary, #1677ff);font-size:.8125rem;line-height:1.5;font-weight:700}.platform-login__hero-copy h2{color:var(--platform-login-text, #0f172a);font-size:1.75rem;line-height:1.22;font-weight:800;letter-spacing:0}.platform-login__hero-copy>p:last-child{margin-top:.75rem;color:var(--platform-login-soft, #475569);font-size:1rem;line-height:1.7}.platform-login__visual{position:relative;width:min(100%,28.75rem);aspect-ratio:1.42;margin:.375rem 0 0 2rem;border-radius:2rem;background:linear-gradient(180deg,#ffffff4d,#c9dcff1f),linear-gradient(155deg,#5f91ff14,#ffffff6b);transform:perspective(54rem) rotateX(58deg) rotate(-18deg);transform-origin:50% 70%;box-shadow:0 1.625rem 3.125rem #3b76e638,inset 0 0 0 1px #ffffffa8}.platform-login__visual:before{content:\"\";position:absolute;inset:8% 8% 12%;border-radius:1.375rem;border:1px solid rgba(255,255,255,.72)}.platform-login__device{position:absolute;left:33%;bottom:18%;width:38%;height:78%;border:1px solid rgba(132,170,240,.56);border-radius:.75rem;background:linear-gradient(180deg,#ffffffd6,#dceaffa3),#f6faff;box-shadow:0 1.25rem 2.5rem #3571e033,inset 0 0 1rem #ffffffc7}.platform-login__device-dot,.platform-login__device-row,.platform-login__device-card,.platform-login__device-list,.platform-login__chart,.platform-login__avatar{position:absolute}.platform-login__device-dot{top:12%;width:.625rem;height:.625rem;border-radius:50%}.platform-login__device-dot--blue{left:13%;background:#1677ff}.platform-login__device-dot--green{left:26%;background:#00b42a}.platform-login__device-row{left:39%;right:10%;top:13%;height:.5rem;border-radius:999px;background:#96b4eb47}.platform-login__device-card{display:grid;align-items:center;grid-template-columns:2.125rem minmax(0,1fr);gap:.625rem;padding:.625rem .75rem;border-radius:.75rem;background:#ffffffc7;box-shadow:0 .875rem 1.75rem #3870dc2e,inset 0 0 0 1px #ffffffd1}.platform-login__device-card span{display:block;width:1.625rem;height:1.625rem;border-radius:50%;background:linear-gradient(135deg,#7ca3ed,#cfe0ff)}.platform-login__device-card strong{display:block;height:.5625rem;border-radius:999px;background:linear-gradient(90deg,#7aa7ff,#7aa7ff40)}.platform-login__device-card--primary{left:20%;right:-20%;top:34%}.platform-login__device-card--floating{left:72%;right:-32%;top:58%}.platform-login__device-list{left:24%;right:20%;bottom:15%;display:grid;gap:.5rem}.platform-login__device-list span{height:.4375rem;border-radius:999px;background:#759eec47}.platform-login__device-list span:nth-child(2){width:72%}.platform-login__device-list span:nth-child(3){width:86%}.platform-login__chart{left:11%;bottom:18%;width:22%;height:42%;display:flex;align-items:flex-end;justify-content:center;gap:.5rem;padding:.875rem .625rem;border:1px solid rgba(132,170,240,.48);border-radius:.875rem;background:#ffffffc7;box-shadow:0 1rem 1.875rem #3870dc2e}.platform-login__chart span{width:.625rem;border-radius:999px 999px .25rem .25rem;background:linear-gradient(180deg,#7aa7ff,#2b79ff)}.platform-login__chart span:nth-child(1){height:38%}.platform-login__chart span:nth-child(2){height:62%}.platform-login__chart span:nth-child(3){height:82%}.platform-login__avatar{left:27%;bottom:46%;width:2.5rem;height:2.5rem;border:.375rem solid rgba(255,255,255,.8);border-radius:50%;background:linear-gradient(135deg,#3182ff,#b5d0ff);box-shadow:0 .75rem 1.625rem #3182ff47}.platform-login__features{width:min(100%,34rem);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}.platform-login__feature{min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;align-items:center;gap:.125rem .625rem;padding:.75rem .875rem;border:1px solid rgba(255,255,255,.72);border-radius:1rem;background:#ffffff80;box-shadow:0 .625rem 1.25rem #406eb414;color:#1677ff}.platform-login__feature lucide-icon{grid-row:1/span 2;width:2.375rem;height:2.375rem;display:grid;place-items:center;border-radius:50%;background:#1677ff1a}.platform-login__feature span{min-width:0;overflow:hidden;color:var(--platform-login-text, #111827);font-size:.875rem;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.platform-login__feature small{min-width:0;overflow:hidden;color:var(--platform-login-soft, #64748b);font-size:.75rem;line-height:1.4;text-overflow:ellipsis;white-space:nowrap}.platform-login__feature.is-green{color:#00b42a}.platform-login__feature.is-green lucide-icon{background:#00b42a1a}.platform-login__feature.is-amber{color:#ff9500}.platform-login__feature.is-amber lucide-icon{background:#ff95001f}.platform-login__feature.is-violet{color:#7c3aed}.platform-login__feature.is-violet lucide-icon{background:#7c3aed1a}.platform-login__panel{width:100%;align-self:center;display:grid;gap:1.125rem;padding:3rem 2.625rem 2.25rem;border:1px solid rgba(255,255,255,.72);border-radius:var(--platform-login-panel-radius, 1.5rem);background:var(--platform-login-panel-bg, rgba(255, 255, 255, .88));box-shadow:var(--platform-login-panel-shadow, 0 1.25rem 3rem rgba(42, 82, 142, .14));-webkit-backdrop-filter:blur(1.25rem);backdrop-filter:blur(1.25rem)}.platform-login__header{display:grid;gap:.5rem}.platform-login__header h2{color:var(--platform-login-text, #111827);font-size:1.625rem;line-height:1.25;font-weight:800;letter-spacing:0}.platform-login__header span{color:var(--platform-login-soft, #64748b);font-size:.875rem;line-height:1.5}.platform-login__error{padding:.625rem .75rem;border:1px solid rgba(239,68,68,.22);border-radius:.75rem;background:#fff1f2;color:#dc2626;font-size:.8125rem;line-height:1.5}.platform-login__form{display:grid;gap:1rem}.platform-login__field{display:grid;gap:.5rem}.platform-login__field>span{color:var(--platform-login-label, #1f2937);font-size:.8125rem;font-weight:700;line-height:1.5}.platform-login__control{min-height:2.75rem;display:flex;align-items:center;gap:.5rem;padding:0 .75rem;border:1px solid var(--platform-login-input-border, #d8e1ee);border-radius:var(--platform-login-input-radius, .75rem);background:var(--platform-login-input-bg, rgba(255, 255, 255, .92));color:var(--platform-login-muted, #72819a);transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}.platform-login__control:focus-within{border-color:var(--platform-login-primary, #1677ff);background:#fff;box-shadow:0 0 0 .1875rem #1677ff1f}.platform-login__control input{appearance:none;width:100%;min-width:0;height:2.625rem;padding:0!important;padding-inline:0!important;border:0!important;border-radius:0;outline:0;background:transparent;box-shadow:none!important;color:var(--platform-login-text, #111827);font:inherit;font-size:.875rem}.platform-login__control input::placeholder{color:#9aa8ba}.platform-login__icon-button,.platform-login__link,.platform-login__submit,.platform-login__social-button{font:inherit}.platform-login__icon-button{width:2rem;height:2rem;flex:0 0 auto;display:grid;place-items:center;padding:0;border:0;border-radius:.625rem;background:transparent;color:var(--platform-login-muted, #72819a);cursor:pointer}.platform-login__icon-button:hover{background:#f1f6ff;color:var(--platform-login-primary, #1677ff)}.platform-login__options{justify-content:space-between;gap:.75rem;color:var(--platform-login-soft, #64748b);font-size:.8125rem}.platform-login__remember{gap:.4375rem;min-width:0}.platform-login__remember input{width:.9375rem;height:.9375rem;margin:0;accent-color:var(--platform-login-primary, #1677ff)}.platform-login__remember span{white-space:nowrap}.platform-login__link{display:inline-flex;align-items:center;min-height:1.5rem;padding:0;border:0;background:transparent;color:var(--platform-login-primary, #1677ff);cursor:pointer;font-size:.8125rem;font-weight:700}.platform-login__link:hover{color:#0958d9}.platform-login__meta{color:var(--platform-login-soft, #64748b);font-size:.75rem;line-height:1.5}.platform-login__submit{min-height:2.75rem;border:0;border-radius:var(--platform-login-button-radius, .75rem);background:var(--platform-login-button-bg, linear-gradient(180deg, #2385ff 0%, #1677ff 100%));color:#fff;box-shadow:var(--platform-login-button-shadow, 0 .875rem 1.625rem rgba(22, 119, 255, .22));cursor:pointer;font-size:.9375rem;font-weight:800}.platform-login__submit:hover:not(:disabled){background:linear-gradient(180deg,#3390ff,#0f6be8)}.platform-login__submit:disabled{cursor:progress;opacity:.72}.platform-login__social{display:grid;gap:1rem}.platform-login__divider{gap:.875rem;color:var(--platform-login-soft, #64748b);font-size:.8125rem;line-height:1.5;white-space:nowrap}.platform-login__divider:before,.platform-login__divider:after{content:\"\";height:1px;flex:1 1 auto;background:#e6edf6}.platform-login__social-list{justify-content:center;gap:1rem}.platform-login__social-button{position:relative;width:2.75rem;height:2.75rem;display:grid;place-items:center;padding:0;border:1px solid rgba(217,225,237,.86);border-radius:50%;background:#fff;color:#111827;box-shadow:0 .625rem 1.25rem #2a528e14;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.platform-login__social-button:hover:not(:disabled){border-color:#1677ff52;box-shadow:0 .875rem 1.625rem #2a528e1f;transform:translateY(-.125rem)}.platform-login__social-button:disabled{cursor:not-allowed;opacity:.5}.platform-login__social-button.is-wechat{color:#00b42a}.platform-login__social-button.is-dingtalk{color:#24a8ff}.platform-login__social-button.is-apple{color:#111827}.platform-login__social-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.platform-login__register{justify-content:center;gap:.375rem;color:var(--platform-login-soft, #64748b);font-size:.875rem}.platform-login__language:focus-visible,.platform-login__icon-button:focus-visible,.platform-login__link:focus-visible,.platform-login__submit:focus-visible,.platform-login__social-button:focus-visible{outline:2px solid var(--platform-login-primary, #1677ff);outline-offset:2px}@media(min-width:72rem){.platform-login__hero-copy h2{font-size:2rem}}@media(min-width:64.01rem)and (max-height:52rem){.platform-login__content{gap:clamp(1.5rem,4vw,4rem);padding:4.25rem clamp(1.75rem,5vw,4.75rem) 2.5rem}.platform-login__hero{gap:1.125rem}.platform-login__visual{width:min(100%,24rem);margin-top:0}.platform-login__panel{gap:1rem;padding:2.5rem 2.375rem 2rem}}@media(min-width:64.01rem)and (max-height:42rem){.platform-login{height:auto;min-height:100%;overflow:auto}.platform-login__stage{height:auto;min-height:var(--platform-login-available-height)}.platform-login__content{height:auto;min-height:inherit}}@media(max-width:64rem){.platform-login{height:auto;min-height:100%;padding:1rem;overflow:auto}.platform-login__stage{height:auto;min-height:calc(100dvh - 2rem)}.platform-login__content{height:auto;min-height:inherit;grid-template-columns:1fr;gap:2rem;padding:5rem 1.5rem 1.5rem}.platform-login__hero{justify-items:center;text-align:center}.platform-login__brand{justify-content:center}.platform-login__visual{width:min(100%,25rem);margin:0}.platform-login__features{width:min(100%,40rem)}.platform-login__panel{width:min(100%,27rem);justify-self:center}}@media(max-width:40rem){.platform-login{place-items:start center;padding:0}.platform-login__stage{width:100%;min-height:100dvh;overflow:visible;border-width:0;border-radius:0;box-shadow:none}.platform-login__language{top:1rem;right:1rem}.platform-login__content{padding:4.25rem .875rem 1rem}.platform-login__brand h1{font-size:1.375rem}.platform-login__hero-copy h2{font-size:1.5rem}.platform-login__hero-copy>p:last-child{font-size:.9375rem}.platform-login__visual{width:min(100%,17rem)}.platform-login__features{grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}.platform-login__feature{grid-template-columns:1fr;justify-items:center;gap:.375rem;padding:.625rem .375rem;text-align:center}.platform-login__feature lucide-icon{grid-row:auto;width:2rem;height:2rem}.platform-login__feature span{font-size:.75rem}.platform-login__feature small{display:none}.platform-login__panel{padding:1.5rem 1.125rem;border-radius:1.125rem}.platform-login__options{align-items:flex-start;flex-direction:column}}\n"] }]
-        }], propDecorators: { brandMark: [{ type: i0.Input, args: [{ isSignal: true, alias: "brandMark", required: false }] }], brandName: [{ type: i0.Input, args: [{ isSignal: true, alias: "brandName", required: false }] }], productName: [{ type: i0.Input, args: [{ isSignal: true, alias: "productName", required: false }] }], heroAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "heroAriaLabel", required: false }] }], heroEyebrow: [{ type: i0.Input, args: [{ isSignal: true, alias: "heroEyebrow", required: false }] }], heroTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "heroTitle", required: false }] }], heroText: [{ type: i0.Input, args: [{ isSignal: true, alias: "heroText", required: false }] }], features: [{ type: i0.Input, args: [{ isSignal: true, alias: "features", required: false }] }], showLanguageSwitcher: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLanguageSwitcher", required: false }] }], languageLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "languageLabel", required: false }] }], panelEyebrow: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelEyebrow", required: false }] }], panelTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelTitle", required: false }] }], panelSubtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelSubtitle", required: false }] }], usernameLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "usernameLabel", required: false }] }], passwordLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "passwordLabel", required: false }] }], usernamePlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "usernamePlaceholder", required: false }] }], passwordPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "passwordPlaceholder", required: false }] }], rememberLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "rememberLabel", required: false }] }], forgotPasswordText: [{ type: i0.Input, args: [{ isSignal: true, alias: "forgotPasswordText", required: false }] }], dividerText: [{ type: i0.Input, args: [{ isSignal: true, alias: "dividerText", required: false }] }], registerPrompt: [{ type: i0.Input, args: [{ isSignal: true, alias: "registerPrompt", required: false }] }], registerText: [{ type: i0.Input, args: [{ isSignal: true, alias: "registerText", required: false }] }], metaText: [{ type: i0.Input, args: [{ isSignal: true, alias: "metaText", required: false }] }], submitText: [{ type: i0.Input, args: [{ isSignal: true, alias: "submitText", required: false }] }], submittingText: [{ type: i0.Input, args: [{ isSignal: true, alias: "submittingText", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], errorMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMessage", required: false }] }], submitting: [{ type: i0.Input, args: [{ isSignal: true, alias: "submitting", required: false }] }], defaultUsername: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultUsername", required: false }] }], rememberDefault: [{ type: i0.Input, args: [{ isSignal: true, alias: "rememberDefault", required: false }] }], showForgotPassword: [{ type: i0.Input, args: [{ isSignal: true, alias: "showForgotPassword", required: false }] }], showRegister: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRegister", required: false }] }], socialProviders: [{ type: i0.Input, args: [{ isSignal: true, alias: "socialProviders", required: false }] }], loginSubmit: [{ type: i0.Output, args: ["loginSubmit"] }], forgotPasswordClick: [{ type: i0.Output, args: ["forgotPasswordClick"] }], registerClick: [{ type: i0.Output, args: ["registerClick"] }], languageClick: [{ type: i0.Output, args: ["languageClick"] }], socialLogin: [{ type: i0.Output, args: ["socialLogin"] }] } });
+            args: [{ selector: 's-login-page', imports: [FormsModule, LucideAngularModule, NgOptimizedImage], changeDetection: ChangeDetectionStrategy.OnPush, template: "<main class=\"platform-login\">\r\n  <section class=\"platform-login__stage\" [attr.aria-label]=\"heroAriaLabel()\">\r\n    @if (showLanguageSwitcher()) {\r\n      <button\r\n        class=\"platform-login__language\"\r\n        type=\"button\"\r\n        aria-label=\"\u5207\u6362\u8BED\u8A00\"\r\n        (click)=\"emitLanguageClick()\"\r\n      >\r\n        <lucide-icon [img]=\"languagesIcon\" size=\"16\" aria-hidden=\"true\" />\r\n        <span>{{ languageLabel() }}</span>\r\n        <lucide-icon [img]=\"chevronDownIcon\" size=\"14\" aria-hidden=\"true\" />\r\n      </button>\r\n    }\r\n\r\n    <div class=\"platform-login__content\">\r\n      <section class=\"platform-login__hero\">\n        <div class=\"platform-login__brand\">\n          @if (brandLogo()) {\n            <div class=\"platform-login__brand-logo-frame\">\n              <img\n                class=\"platform-login__brand-logo\"\n                [ngSrc]=\"brandLogo()\"\n                width=\"315\"\n                height=\"95\"\n                [alt]=\"brandLogoLabel()\"\n                draggable=\"false\"\n                priority\n              />\n            </div>\n          } @else {\n            <div class=\"platform-login__mark\" aria-hidden=\"true\">\n              <span>{{ brandMark() }}</span>\n            </div>\n            <div>\n              <p>{{ brandName() }}</p>\n              <h1>{{ productName() }}</h1>\n            </div>\n          }\n        </div>\n\r\n        <div class=\"platform-login__hero-copy\">\r\n          @if (heroEyebrow()) {\r\n            <p class=\"platform-login__eyebrow\">{{ heroEyebrow() }}</p>\r\n          }\r\n          <h2>{{ heroTitle() }}</h2>\r\n          <p>{{ heroText() }}</p>\r\n        </div>\r\n\r\n        <div class=\"platform-login__visual\" aria-hidden=\"true\">\r\n          <div class=\"platform-login__device\">\r\n            <span class=\"platform-login__device-dot platform-login__device-dot--blue\"></span>\r\n            <span class=\"platform-login__device-dot platform-login__device-dot--green\"></span>\r\n            <div class=\"platform-login__device-row platform-login__device-row--short\"></div>\r\n            <div class=\"platform-login__device-card platform-login__device-card--primary\">\r\n              <span></span>\r\n              <strong></strong>\r\n            </div>\r\n            <div class=\"platform-login__device-card platform-login__device-card--floating\">\r\n              <span></span>\r\n              <strong></strong>\r\n            </div>\r\n            <div class=\"platform-login__device-list\">\r\n              <span></span>\r\n              <span></span>\r\n              <span></span>\r\n            </div>\r\n          </div>\r\n          <div class=\"platform-login__chart\">\r\n            <span></span>\r\n            <span></span>\r\n            <span></span>\r\n          </div>\r\n          <div class=\"platform-login__avatar\"></div>\r\n        </div>\r\n\r\n        @if (features().length > 0) {\r\n          <div class=\"platform-login__features\" aria-label=\"\u767B\u5F55\u9875\u7279\u6027\">\r\n            @for (feature of features(); track feature.label) {\r\n              <div [class]=\"featureClass(feature.toneClass)\">\r\n                @if (feature.icon) {\r\n                  <lucide-icon [img]=\"feature.icon\" size=\"20\" aria-hidden=\"true\" />\r\n                }\r\n                <span>{{ feature.label }}</span>\r\n                @if (feature.description) {\r\n                  <small>{{ feature.description }}</small>\r\n                }\r\n              </div>\r\n            }\r\n          </div>\r\n        }\r\n      </section>\r\n\r\n      <section class=\"platform-login__panel\" aria-labelledby=\"platform-login-title\">\r\n        <div class=\"platform-login__header\">\r\n          @if (panelEyebrow()) {\r\n            <p>{{ panelEyebrow() }}</p>\r\n          }\r\n          <h2 id=\"platform-login-title\">{{ panelTitle() }}</h2>\r\n          <span>{{ panelSubtitle() }}</span>\r\n        </div>\r\n\r\n        @if (visibleErrorMessage()) {\r\n          <p class=\"platform-login__error\" role=\"alert\">{{ visibleErrorMessage() }}</p>\r\n        }\r\n\r\n        <form class=\"platform-login__form\" (ngSubmit)=\"submit()\">\r\n          <label class=\"platform-login__field\">\r\n            <span>{{ usernameLabel() }}</span>\r\n            <div class=\"platform-login__control\">\r\n              <lucide-icon [img]=\"userIcon\" size=\"17\" aria-hidden=\"true\" />\r\n              <input\r\n                type=\"text\"\r\n                data-platform-input=\"bare\"\r\n                autocomplete=\"username\"\r\n                [placeholder]=\"usernamePlaceholder()\"\r\n                [ngModel]=\"username()\"\r\n                (ngModelChange)=\"username.set($event)\"\r\n                name=\"username\"\r\n              />\r\n            </div>\r\n          </label>\r\n\r\n          <label class=\"platform-login__field\">\r\n            <span>{{ passwordLabel() }}</span>\r\n            <div class=\"platform-login__control\">\r\n              <lucide-icon [img]=\"keyIcon\" size=\"17\" aria-hidden=\"true\" />\r\n              <input\r\n                [type]=\"showPassword() ? 'text' : 'password'\"\r\n                data-platform-input=\"bare\"\r\n                autocomplete=\"current-password\"\r\n                [placeholder]=\"passwordPlaceholder()\"\r\n                [ngModel]=\"password()\"\r\n                (ngModelChange)=\"password.set($event)\"\r\n                name=\"password\"\r\n              />\r\n              <button\r\n                class=\"platform-login__icon-button\"\r\n                type=\"button\"\r\n                [attr.aria-label]=\"showPassword() ? '\u9690\u85CF\u5BC6\u7801' : '\u663E\u793A\u5BC6\u7801'\"\r\n                (click)=\"togglePassword()\"\r\n              >\r\n                <lucide-icon [img]=\"showPassword() ? eyeOffIcon : eyeIcon\" size=\"17\" aria-hidden=\"true\" />\r\n              </button>\r\n            </div>\r\n          </label>\r\n\r\n          <div class=\"platform-login__options\">\r\n            <label class=\"platform-login__remember\">\r\n              <input\r\n                type=\"checkbox\"\r\n                [ngModel]=\"rememberMe()\"\r\n                (ngModelChange)=\"rememberMe.set($event)\"\r\n                name=\"rememberMe\"\r\n              />\r\n              <span>{{ rememberLabel() }}</span>\r\n            </label>\r\n            @if (showForgotPassword()) {\r\n              <button class=\"platform-login__link\" type=\"button\" (click)=\"emitForgotPassword()\">\r\n                {{ forgotPasswordText() }}\r\n              </button>\r\n            } @else if (metaText()) {\r\n              <span>{{ metaText() }}</span>\r\n            }\r\n          </div>\r\n\r\n          @if (metaText() && showForgotPassword()) {\r\n            <p class=\"platform-login__meta\">{{ metaText() }}</p>\r\n          }\r\n\r\n          <button class=\"platform-login__submit\" type=\"submit\" [disabled]=\"submitting()\">\r\n            {{ submitting() ? submittingText() : submitText() }}\r\n          </button>\r\n        </form>\r\n\r\n        @if (socialProviders().length > 0) {\r\n          <div class=\"platform-login__social\">\r\n            <div class=\"platform-login__divider\">\r\n              <span>{{ dividerText() }}</span>\r\n            </div>\r\n            <div class=\"platform-login__social-list\">\r\n              @for (provider of socialProviders(); track provider.id) {\r\n                <button\r\n                  [class]=\"socialProviderClass(provider.toneClass)\"\r\n                  type=\"button\"\r\n                  [disabled]=\"provider.disabled\"\r\n                  [attr.aria-label]=\"provider.label\"\r\n                  (click)=\"emitSocialLogin(provider)\"\r\n                >\r\n                  @if (provider.icon) {\r\n                    <lucide-icon [img]=\"provider.icon\" size=\"22\" aria-hidden=\"true\" />\r\n                    <span class=\"platform-login__social-label\">{{ provider.label }}</span>\r\n                  } @else {\r\n                    <span>{{ socialProviderInitial(provider) }}</span>\r\n                  }\r\n                </button>\r\n              }\r\n            </div>\r\n          </div>\r\n        }\r\n\r\n        @if (showRegister()) {\r\n          <p class=\"platform-login__register\">\r\n            <span>{{ registerPrompt() }}</span>\r\n            <button class=\"platform-login__link\" type=\"button\" (click)=\"emitRegister()\">\r\n              {{ registerText() }}\r\n            </button>\r\n          </p>\r\n        }\r\n      </section>\r\n    </div>\r\n  </section>\r\n</main>\r\n", styles: [":host{display:block;height:100dvh;min-height:100dvh;overflow:auto;color:var(--platform-login-text, #111827);font-family:Inter,SF Pro Display,PingFang SC,Microsoft YaHei,sans-serif}.platform-login,.platform-login *{box-sizing:border-box}.platform-login{--platform-login-available-height: calc(100dvh - (var(--platform-login-page-padding, 1.875rem) * 2));height:100%;min-height:0;display:grid;place-items:center;padding:var(--platform-login-page-padding, 1.875rem);background:linear-gradient(180deg,#fffffff2,#f7fbffeb),linear-gradient(135deg,#f8fbff,#edf5ff 48%,#f6f9ff);overflow:hidden}.platform-login__stage{position:relative;width:min(100%,var(--platform-login-stage-width, 90rem));height:min(50rem,var(--platform-login-available-height));min-height:min(42rem,var(--platform-login-available-height));overflow:hidden;border:1px solid var(--platform-login-stage-border, rgba(126, 164, 232, .34));border-radius:var(--platform-login-stage-radius, 1.5rem);background:linear-gradient(110deg,#ffffffb8,#e8f2ffbd 45%,#d6e6ffdb),#eef6ff;box-shadow:var(--platform-login-stage-shadow, 0 1.375rem 3.25rem rgba(66, 111, 180, .18));isolation:isolate}.platform-login__stage:before{content:\"\";position:absolute;inset:13% -14% auto auto;width:52%;height:78%;border:1px solid rgba(255,255,255,.66);border-radius:50%;background:linear-gradient(135deg,#ffffff52,#b9d3ff26);transform:rotate(-19deg);z-index:-1}.platform-login__stage:after{content:\"\";position:absolute;inset:auto -8% -28% 44%;height:76%;border:1px solid rgba(103,151,230,.18);border-radius:50% 50% 0 0;transform:rotate(11deg);z-index:-1}.platform-login__language{position:absolute;top:2rem;right:2.375rem;z-index:2;display:inline-flex;align-items:center;gap:.375rem;min-height:2.25rem;padding:0 .375rem;border:0;border-radius:.75rem;background:transparent;color:var(--platform-login-muted, #475569);cursor:pointer;font:inherit;font-size:.875rem}.platform-login__language:hover{background:#ffffff7a;color:var(--platform-login-primary, #1677ff)}.platform-login__content{height:100%;min-height:0;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(21rem,27rem);align-items:center;gap:clamp(2rem,6vw,6.5rem);padding:5.625rem clamp(2rem,6vw,5.625rem) 3.625rem}.platform-login__hero{min-width:0;display:grid;gap:1.5rem;align-content:center}.platform-login__brand,.platform-login__options,.platform-login__remember,.platform-login__social-list,.platform-login__register,.platform-login__divider{display:flex;align-items:center}.platform-login__brand{gap:.875rem}.platform-login__mark{position:relative;width:2.75rem;height:2.75rem;display:grid;place-items:center;color:#1677ff;font-size:.8125rem;font-weight:800}.platform-login__mark:before,.platform-login__mark:after{content:\"\";position:absolute;inset:.25rem;border:.25rem solid currentColor;border-radius:.75rem;transform:rotate(30deg)}.platform-login__mark:after{inset:.6875rem;border-width:.1875rem;color:#1677ff3d;transform:rotate(-30deg)}.platform-login__mark span{position:relative;z-index:1;transform:translateY(.0625rem)}.platform-login__brand-logo-frame{width:min(100%,16.5rem);padding:var(--platform-login-brand-logo-frame-padding, .375rem .625rem .375rem .3125rem);border:var(--platform-login-brand-logo-frame-border, 1px solid rgba(255, 255, 255, .38));border-radius:var(--platform-login-brand-logo-frame-radius, 1rem);background:var(--platform-login-brand-logo-frame-bg, linear-gradient(135deg, rgba(18, 57, 112, .96), rgba(20, 137, 132, .95)));box-shadow:var(--platform-login-brand-logo-frame-shadow, 0 .875rem 1.875rem rgba(32, 91, 151, .18))}.platform-login__brand-logo{display:block;width:100%;height:auto;object-fit:contain;object-position:left center;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.platform-login__brand p,.platform-login__brand h1,.platform-login__hero-copy p,.platform-login__hero-copy h2,.platform-login__header p,.platform-login__header h2,.platform-login__header span,.platform-login__error,.platform-login__meta,.platform-login__register{margin:0}.platform-login__brand p{color:var(--platform-login-muted, #64748b);font-size:.875rem;line-height:1.3}.platform-login__brand h1{margin-top:.25rem;color:var(--platform-login-text, #0f172a);font-size:1.75rem;line-height:1.2;font-weight:800;letter-spacing:0}.platform-login__hero-copy{max-width:35rem}.platform-login__eyebrow,.platform-login__header p{color:var(--platform-login-primary, #1677ff);font-size:.8125rem;line-height:1.5;font-weight:700}.platform-login__hero-copy h2{color:var(--platform-login-text, #0f172a);font-size:1.75rem;line-height:1.22;font-weight:800;letter-spacing:0}.platform-login__hero-copy>p:last-child{margin-top:.75rem;color:var(--platform-login-soft, #475569);font-size:1rem;line-height:1.7}.platform-login__visual{position:relative;width:min(100%,28.75rem);aspect-ratio:1.42;margin:.375rem 0 0 2rem;border-radius:2rem;background:linear-gradient(180deg,#ffffff4d,#c9dcff1f),linear-gradient(155deg,#5f91ff14,#ffffff6b);transform:perspective(54rem) rotateX(58deg) rotate(-18deg);transform-origin:50% 70%;box-shadow:0 1.625rem 3.125rem #3b76e638,inset 0 0 0 1px #ffffffa8}.platform-login__visual:before{content:\"\";position:absolute;inset:8% 8% 12%;border-radius:1.375rem;border:1px solid rgba(255,255,255,.72)}.platform-login__device{position:absolute;left:33%;bottom:18%;width:38%;height:78%;border:1px solid rgba(132,170,240,.56);border-radius:.75rem;background:linear-gradient(180deg,#ffffffd6,#dceaffa3),#f6faff;box-shadow:0 1.25rem 2.5rem #3571e033,inset 0 0 1rem #ffffffc7}.platform-login__device-dot,.platform-login__device-row,.platform-login__device-card,.platform-login__device-list,.platform-login__chart,.platform-login__avatar{position:absolute}.platform-login__device-dot{top:12%;width:.625rem;height:.625rem;border-radius:50%}.platform-login__device-dot--blue{left:13%;background:#1677ff}.platform-login__device-dot--green{left:26%;background:#00b42a}.platform-login__device-row{left:39%;right:10%;top:13%;height:.5rem;border-radius:999px;background:#96b4eb47}.platform-login__device-card{display:grid;align-items:center;grid-template-columns:2.125rem minmax(0,1fr);gap:.625rem;padding:.625rem .75rem;border-radius:.75rem;background:#ffffffc7;box-shadow:0 .875rem 1.75rem #3870dc2e,inset 0 0 0 1px #ffffffd1}.platform-login__device-card span{display:block;width:1.625rem;height:1.625rem;border-radius:50%;background:linear-gradient(135deg,#7ca3ed,#cfe0ff)}.platform-login__device-card strong{display:block;height:.5625rem;border-radius:999px;background:linear-gradient(90deg,#7aa7ff,#7aa7ff40)}.platform-login__device-card--primary{left:20%;right:-20%;top:34%}.platform-login__device-card--floating{left:72%;right:-32%;top:58%}.platform-login__device-list{left:24%;right:20%;bottom:15%;display:grid;gap:.5rem}.platform-login__device-list span{height:.4375rem;border-radius:999px;background:#759eec47}.platform-login__device-list span:nth-child(2){width:72%}.platform-login__device-list span:nth-child(3){width:86%}.platform-login__chart{left:11%;bottom:18%;width:22%;height:42%;display:flex;align-items:flex-end;justify-content:center;gap:.5rem;padding:.875rem .625rem;border:1px solid rgba(132,170,240,.48);border-radius:.875rem;background:#ffffffc7;box-shadow:0 1rem 1.875rem #3870dc2e}.platform-login__chart span{width:.625rem;border-radius:999px 999px .25rem .25rem;background:linear-gradient(180deg,#7aa7ff,#2b79ff)}.platform-login__chart span:nth-child(1){height:38%}.platform-login__chart span:nth-child(2){height:62%}.platform-login__chart span:nth-child(3){height:82%}.platform-login__avatar{left:27%;bottom:46%;width:2.5rem;height:2.5rem;border:.375rem solid rgba(255,255,255,.8);border-radius:50%;background:linear-gradient(135deg,#3182ff,#b5d0ff);box-shadow:0 .75rem 1.625rem #3182ff47}.platform-login__features{width:min(100%,34rem);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}.platform-login__feature{min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;align-items:center;gap:.125rem .625rem;padding:.75rem .875rem;border:1px solid rgba(255,255,255,.72);border-radius:1rem;background:#ffffff80;box-shadow:0 .625rem 1.25rem #406eb414;color:#1677ff}.platform-login__feature lucide-icon{grid-row:1/span 2;width:2.375rem;height:2.375rem;display:grid;place-items:center;border-radius:50%;background:#1677ff1a}.platform-login__feature span{min-width:0;overflow:hidden;color:var(--platform-login-text, #111827);font-size:.875rem;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.platform-login__feature small{min-width:0;color:var(--platform-login-soft, #64748b);font-size:.75rem;line-height:1.4;overflow-wrap:anywhere}.platform-login__feature.is-green{color:#00b42a}.platform-login__feature.is-green lucide-icon{background:#00b42a1a}.platform-login__feature.is-amber{color:#ff9500}.platform-login__feature.is-amber lucide-icon{background:#ff95001f}.platform-login__feature.is-violet{color:#7c3aed}.platform-login__feature.is-violet lucide-icon{background:#7c3aed1a}.platform-login__panel{width:100%;align-self:center;display:grid;gap:1.125rem;padding:3rem 2.625rem 2.25rem;border:1px solid rgba(255,255,255,.72);border-radius:var(--platform-login-panel-radius, 1.5rem);background:var(--platform-login-panel-bg, rgba(255, 255, 255, .88));box-shadow:var(--platform-login-panel-shadow, 0 1.25rem 3rem rgba(42, 82, 142, .14));-webkit-backdrop-filter:blur(1.25rem);backdrop-filter:blur(1.25rem)}.platform-login__header{display:grid;gap:.5rem}.platform-login__header h2{color:var(--platform-login-text, #111827);font-size:1.625rem;line-height:1.25;font-weight:800;letter-spacing:0}.platform-login__header span{color:var(--platform-login-soft, #64748b);font-size:.875rem;line-height:1.5}.platform-login__error{padding:.625rem .75rem;border:1px solid rgba(239,68,68,.22);border-radius:.75rem;background:#fff1f2;color:#dc2626;font-size:.8125rem;line-height:1.5}.platform-login__form{display:grid;gap:1rem}.platform-login__field{display:grid;gap:.5rem}.platform-login__field>span{color:var(--platform-login-label, #1f2937);font-size:.8125rem;font-weight:700;line-height:1.5}.platform-login__control{min-height:2.75rem;display:flex;align-items:center;gap:.5rem;padding:0 .75rem;border:1px solid var(--platform-login-input-border, #d8e1ee);border-radius:var(--platform-login-input-radius, .75rem);background:var(--platform-login-input-bg, rgba(255, 255, 255, .92));color:var(--platform-login-muted, #72819a);transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}.platform-login__control:focus-within{border-color:var(--platform-login-primary, #1677ff);background:#fff;box-shadow:0 0 0 .1875rem #1677ff1f}.platform-login__control input{appearance:none;width:100%;min-width:0;height:2.625rem;padding:0!important;padding-inline:0!important;border:0!important;border-radius:0;outline:0;background:transparent;box-shadow:none!important;color:var(--platform-login-text, #111827);font:inherit;font-size:.875rem}.platform-login__control input::placeholder{color:#9aa8ba}.platform-login__icon-button,.platform-login__link,.platform-login__submit,.platform-login__social-button{font:inherit}.platform-login__icon-button{width:2rem;height:2rem;flex:0 0 auto;display:grid;place-items:center;padding:0;border:0;border-radius:.625rem;background:transparent;color:var(--platform-login-muted, #72819a);cursor:pointer}.platform-login__icon-button:hover{background:#f1f6ff;color:var(--platform-login-primary, #1677ff)}.platform-login__options{justify-content:space-between;gap:.75rem;color:var(--platform-login-soft, #64748b);font-size:.8125rem}.platform-login__remember{gap:.4375rem;min-width:0}.platform-login__remember input{width:.9375rem;height:.9375rem;margin:0;accent-color:var(--platform-login-primary, #1677ff)}.platform-login__remember span{white-space:nowrap}.platform-login__link{display:inline-flex;align-items:center;min-height:1.5rem;padding:0;border:0;background:transparent;color:var(--platform-login-primary, #1677ff);cursor:pointer;font-size:.8125rem;font-weight:700}.platform-login__link:hover{color:#0958d9}.platform-login__meta{color:var(--platform-login-soft, #64748b);font-size:.75rem;line-height:1.5}.platform-login__submit{min-height:2.75rem;border:0;border-radius:var(--platform-login-button-radius, .75rem);background:var(--platform-login-button-bg, linear-gradient(180deg, #2385ff 0%, #1677ff 100%));color:#fff;box-shadow:var(--platform-login-button-shadow, 0 .875rem 1.625rem rgba(22, 119, 255, .22));cursor:pointer;font-size:.9375rem;font-weight:800}.platform-login__submit:hover:not(:disabled){background:linear-gradient(180deg,#3390ff,#0f6be8)}.platform-login__submit:disabled{cursor:progress;opacity:.72}.platform-login__social{display:grid;gap:1rem}.platform-login__divider{gap:.875rem;color:var(--platform-login-soft, #64748b);font-size:.8125rem;line-height:1.5;white-space:nowrap}.platform-login__divider:before,.platform-login__divider:after{content:\"\";height:1px;flex:1 1 auto;background:#e6edf6}.platform-login__social-list{justify-content:center;gap:1rem}.platform-login__social-button{position:relative;width:2.75rem;height:2.75rem;display:grid;place-items:center;padding:0;border:1px solid rgba(217,225,237,.86);border-radius:50%;background:#fff;color:#111827;box-shadow:0 .625rem 1.25rem #2a528e14;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.platform-login__social-button:hover:not(:disabled){border-color:#1677ff52;box-shadow:0 .875rem 1.625rem #2a528e1f;transform:translateY(-.125rem)}.platform-login__social-button:disabled{cursor:not-allowed;opacity:.5}.platform-login__social-button.is-wechat{color:#00b42a}.platform-login__social-button.is-dingtalk{color:#24a8ff}.platform-login__social-button.is-apple{color:#111827}.platform-login__social-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.platform-login__register{justify-content:center;gap:.375rem;color:var(--platform-login-soft, #64748b);font-size:.875rem}.platform-login__language:focus-visible,.platform-login__icon-button:focus-visible,.platform-login__link:focus-visible,.platform-login__submit:focus-visible,.platform-login__social-button:focus-visible{outline:2px solid var(--platform-login-primary, #1677ff);outline-offset:2px}@media(min-width:72rem){.platform-login__hero-copy h2{font-size:2rem}}@media(min-width:64.01rem)and (max-height:52rem){.platform-login__content{gap:clamp(1.5rem,4vw,4rem);padding:4.25rem clamp(1.75rem,5vw,4.75rem) 2.5rem}.platform-login__hero{gap:1.125rem}.platform-login__visual{width:min(100%,24rem);margin-top:0}.platform-login__panel{gap:1rem;padding:2.5rem 2.375rem 2rem}}@media(min-width:64.01rem)and (max-height:42rem){.platform-login{height:auto;min-height:100%;overflow:auto}.platform-login__stage{height:auto;min-height:var(--platform-login-available-height)}.platform-login__content{height:auto;min-height:inherit}}@media(max-width:64rem){.platform-login{height:auto;min-height:100%;padding:1rem;overflow:auto}.platform-login__stage{height:auto;min-height:calc(100dvh - 2rem)}.platform-login__content{height:auto;min-height:inherit;grid-template-columns:1fr;gap:2rem;padding:5rem 1.5rem 1.5rem}.platform-login__hero{justify-items:center;text-align:center}.platform-login__brand{justify-content:center}.platform-login__visual{width:min(100%,25rem);margin:0}.platform-login__features{width:min(100%,40rem)}.platform-login__panel{width:min(100%,27rem);justify-self:center}}@media(max-width:40rem){.platform-login{place-items:start center;padding:0}.platform-login__stage{width:100%;min-height:100dvh;overflow:visible;border-width:0;border-radius:0;box-shadow:none}.platform-login__language{top:1rem;right:1rem}.platform-login__content{padding:4.25rem .875rem 1rem}.platform-login__brand h1{font-size:1.375rem}.platform-login__hero-copy h2{font-size:1.5rem}.platform-login__hero-copy>p:last-child{font-size:.9375rem}.platform-login__visual{width:min(100%,17rem)}.platform-login__features{grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}.platform-login__feature{grid-template-columns:1fr;justify-items:center;gap:.375rem;padding:.625rem .375rem;text-align:center}.platform-login__feature lucide-icon{grid-row:auto;width:2rem;height:2rem}.platform-login__feature span{font-size:.75rem}.platform-login__feature small{display:none}.platform-login__panel{padding:1.5rem 1.125rem;border-radius:1.125rem}.platform-login__options{align-items:flex-start;flex-direction:column}}\n"] }]
+        }], propDecorators: { brandMark: [{ type: i0.Input, args: [{ isSignal: true, alias: "brandMark", required: false }] }], brandLogo: [{ type: i0.Input, args: [{ isSignal: true, alias: "brandLogo", required: false }] }], brandName: [{ type: i0.Input, args: [{ isSignal: true, alias: "brandName", required: false }] }], productName: [{ type: i0.Input, args: [{ isSignal: true, alias: "productName", required: false }] }], heroAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "heroAriaLabel", required: false }] }], heroEyebrow: [{ type: i0.Input, args: [{ isSignal: true, alias: "heroEyebrow", required: false }] }], heroTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "heroTitle", required: false }] }], heroText: [{ type: i0.Input, args: [{ isSignal: true, alias: "heroText", required: false }] }], features: [{ type: i0.Input, args: [{ isSignal: true, alias: "features", required: false }] }], showLanguageSwitcher: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLanguageSwitcher", required: false }] }], languageLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "languageLabel", required: false }] }], panelEyebrow: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelEyebrow", required: false }] }], panelTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelTitle", required: false }] }], panelSubtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelSubtitle", required: false }] }], usernameLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "usernameLabel", required: false }] }], passwordLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "passwordLabel", required: false }] }], usernamePlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "usernamePlaceholder", required: false }] }], passwordPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "passwordPlaceholder", required: false }] }], rememberLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "rememberLabel", required: false }] }], forgotPasswordText: [{ type: i0.Input, args: [{ isSignal: true, alias: "forgotPasswordText", required: false }] }], dividerText: [{ type: i0.Input, args: [{ isSignal: true, alias: "dividerText", required: false }] }], registerPrompt: [{ type: i0.Input, args: [{ isSignal: true, alias: "registerPrompt", required: false }] }], registerText: [{ type: i0.Input, args: [{ isSignal: true, alias: "registerText", required: false }] }], metaText: [{ type: i0.Input, args: [{ isSignal: true, alias: "metaText", required: false }] }], submitText: [{ type: i0.Input, args: [{ isSignal: true, alias: "submitText", required: false }] }], submittingText: [{ type: i0.Input, args: [{ isSignal: true, alias: "submittingText", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], errorMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMessage", required: false }] }], submitting: [{ type: i0.Input, args: [{ isSignal: true, alias: "submitting", required: false }] }], defaultUsername: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultUsername", required: false }] }], defaultPassword: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultPassword", required: false }] }], rememberDefault: [{ type: i0.Input, args: [{ isSignal: true, alias: "rememberDefault", required: false }] }], showForgotPassword: [{ type: i0.Input, args: [{ isSignal: true, alias: "showForgotPassword", required: false }] }], showRegister: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRegister", required: false }] }], socialProviders: [{ type: i0.Input, args: [{ isSignal: true, alias: "socialProviders", required: false }] }], loginSubmit: [{ type: i0.Output, args: ["loginSubmit"] }], forgotPasswordClick: [{ type: i0.Output, args: ["forgotPasswordClick"] }], registerClick: [{ type: i0.Output, args: ["registerClick"] }], languageClick: [{ type: i0.Output, args: ["languageClick"] }], socialLogin: [{ type: i0.Output, args: ["socialLogin"] }] } });
 
 const DEFAULT_MENU_POSITIONS = [
     { originX: 'start', originY: 'bottom', overlayX: 'start', overlayY: 'top', offsetY: 4 },
+    { originX: 'end', originY: 'bottom', overlayX: 'end', overlayY: 'top', offsetY: 4 },
 ];
 class MenuItemComponent {
     closeMenu = null;
@@ -4732,11 +5590,11 @@ class MenuComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: MenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.8", type: MenuComponent, isStandalone: true, selector: "s-menu", inputs: { origin: { classPropertyName: "origin", publicName: "origin", isSignal: true, isRequired: true, transformFunction: null }, trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: true, transformFunction: null }, positions: { classPropertyName: "positions", publicName: "positions", isSignal: true, isRequired: false, transformFunction: null }, panelWidth: { classPropertyName: "panelWidth", publicName: "panelWidth", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "menuItems", predicate: MenuItemComponent, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "formatMenu", first: true, predicate: ["formatMenu"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template\r\n  [cdkConnectedOverlayOpen]=\"trigger().expanded()\"\r\n  [cdkConnectedOverlay]=\"{ origin: origin(), usePopover: 'inline' }\"\r\n  [cdkConnectedOverlayPositions]=\"positions()\"\r\n  cdkAttachPopoverAsChild\r\n>\r\n  <div ngMenu class=\"menu\" #formatMenu=\"ngMenu\" [style.width]=\"panelWidth()\">\r\n    <ng-template ngMenuContent>\r\n      <ng-content />\r\n    </ng-template>\r\n  </div>\r\n</ng-template>\r\n", styles: [":host{display:contents}[ngMenu]{margin:0;width:15rem;padding:.25rem;border-radius:.5rem;border:1px solid var(--color-border-strong);background-color:var(--color-surface);color:var(--color-text-primary)}[ngMenu][data-visible=false]{display:none}[ngMenuItem]{color:var(--color-text-primary);outline:none;display:flex;cursor:pointer;align-items:center;gap:.5rem;padding:.5rem;font-size:.875rem;border-radius:.25rem}[ngMenuItem]:hover,[ngMenuItem][data-active=true]{background:var(--color-surface-soft);outline:1.5px solid var(--color-primary)}[ngMenuItem]:focus{outline:2px solid var(--color-link)}[ngMenuItem] .icon{opacity:.875;font-size:1.25rem}[ngMenuItem] .label{flex:1;opacity:.875;font-size:.875rem}[ngMenu] .separator{border-top:1px solid var(--color-border);margin:.25rem 0;opacity:.25}.menu-item--danger{color:var(--color-error)}\n"], dependencies: [{ kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$2.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: Menu, selector: "[ngMenu]", inputs: ["id", "wrap", "typeaheadDelay", "disabled", "expansionDelay"], outputs: ["itemSelected"], exportAs: ["ngMenu"] }, { kind: "directive", type: MenuContent, selector: "ng-template[ngMenuContent]", exportAs: ["ngMenuContent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.8", type: MenuComponent, isStandalone: true, selector: "s-menu", inputs: { origin: { classPropertyName: "origin", publicName: "origin", isSignal: true, isRequired: true, transformFunction: null }, trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: true, transformFunction: null }, positions: { classPropertyName: "positions", publicName: "positions", isSignal: true, isRequired: false, transformFunction: null }, panelWidth: { classPropertyName: "panelWidth", publicName: "panelWidth", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "menuItems", predicate: MenuItemComponent, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "formatMenu", first: true, predicate: ["formatMenu"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template\n  [cdkConnectedOverlayOpen]=\"trigger().expanded()\"\n  [cdkConnectedOverlay]=\"{ origin: origin(), usePopover: 'inline' }\"\n  [cdkConnectedOverlayPositions]=\"positions()\"\n  cdkAttachPopoverAsChild\n>\n  <div ngMenu class=\"menu\" #formatMenu=\"ngMenu\" [style.width]=\"panelWidth()\">\n    <ng-template ngMenuContent>\n      <ng-content />\n    </ng-template>\n  </div>\n</ng-template>\n", styles: [":host{display:contents}[ngMenu]{margin:0;width:15rem;padding:.25rem;border-radius:.5rem;border:1px solid var(--color-border-strong);background-color:var(--color-surface);color:var(--color-text-primary)}[ngMenu][data-visible=false]{display:none}[ngMenuItem]{color:var(--color-text-primary);outline:none;display:flex;cursor:pointer;align-items:center;gap:.5rem;padding:.5rem;font-size:.875rem;border-radius:.25rem}[ngMenuItem]:hover,[ngMenuItem][data-active=true]{background:var(--color-surface-soft);outline:1.5px solid var(--color-primary)}[ngMenuItem]:focus{outline:2px solid var(--color-link)}[ngMenuItem] .icon{opacity:.875;font-size:1.25rem}[ngMenuItem] .label{flex:1;opacity:.875;font-size:.875rem}[ngMenu] .separator{border-top:1px solid var(--color-border);margin:.25rem 0;opacity:.25}.menu-item--danger{color:var(--color-error)}\n"], dependencies: [{ kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$2.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: Menu, selector: "[ngMenu]", inputs: ["id", "wrap", "typeaheadDelay", "disabled", "expansionDelay"], outputs: ["itemSelected"], exportAs: ["ngMenu"] }, { kind: "directive", type: MenuContent, selector: "ng-template[ngMenuContent]", exportAs: ["ngMenuContent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: MenuComponent, decorators: [{
             type: Component,
-            args: [{ selector: 's-menu', imports: [OverlayModule, Menu, MenuContent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template\r\n  [cdkConnectedOverlayOpen]=\"trigger().expanded()\"\r\n  [cdkConnectedOverlay]=\"{ origin: origin(), usePopover: 'inline' }\"\r\n  [cdkConnectedOverlayPositions]=\"positions()\"\r\n  cdkAttachPopoverAsChild\r\n>\r\n  <div ngMenu class=\"menu\" #formatMenu=\"ngMenu\" [style.width]=\"panelWidth()\">\r\n    <ng-template ngMenuContent>\r\n      <ng-content />\r\n    </ng-template>\r\n  </div>\r\n</ng-template>\r\n", styles: [":host{display:contents}[ngMenu]{margin:0;width:15rem;padding:.25rem;border-radius:.5rem;border:1px solid var(--color-border-strong);background-color:var(--color-surface);color:var(--color-text-primary)}[ngMenu][data-visible=false]{display:none}[ngMenuItem]{color:var(--color-text-primary);outline:none;display:flex;cursor:pointer;align-items:center;gap:.5rem;padding:.5rem;font-size:.875rem;border-radius:.25rem}[ngMenuItem]:hover,[ngMenuItem][data-active=true]{background:var(--color-surface-soft);outline:1.5px solid var(--color-primary)}[ngMenuItem]:focus{outline:2px solid var(--color-link)}[ngMenuItem] .icon{opacity:.875;font-size:1.25rem}[ngMenuItem] .label{flex:1;opacity:.875;font-size:.875rem}[ngMenu] .separator{border-top:1px solid var(--color-border);margin:.25rem 0;opacity:.25}.menu-item--danger{color:var(--color-error)}\n"] }]
+            args: [{ selector: 's-menu', imports: [OverlayModule, Menu, MenuContent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template\n  [cdkConnectedOverlayOpen]=\"trigger().expanded()\"\n  [cdkConnectedOverlay]=\"{ origin: origin(), usePopover: 'inline' }\"\n  [cdkConnectedOverlayPositions]=\"positions()\"\n  cdkAttachPopoverAsChild\n>\n  <div ngMenu class=\"menu\" #formatMenu=\"ngMenu\" [style.width]=\"panelWidth()\">\n    <ng-template ngMenuContent>\n      <ng-content />\n    </ng-template>\n  </div>\n</ng-template>\n", styles: [":host{display:contents}[ngMenu]{margin:0;width:15rem;padding:.25rem;border-radius:.5rem;border:1px solid var(--color-border-strong);background-color:var(--color-surface);color:var(--color-text-primary)}[ngMenu][data-visible=false]{display:none}[ngMenuItem]{color:var(--color-text-primary);outline:none;display:flex;cursor:pointer;align-items:center;gap:.5rem;padding:.5rem;font-size:.875rem;border-radius:.25rem}[ngMenuItem]:hover,[ngMenuItem][data-active=true]{background:var(--color-surface-soft);outline:1.5px solid var(--color-primary)}[ngMenuItem]:focus{outline:2px solid var(--color-link)}[ngMenuItem] .icon{opacity:.875;font-size:1.25rem}[ngMenuItem] .label{flex:1;opacity:.875;font-size:.875rem}[ngMenu] .separator{border-top:1px solid var(--color-border);margin:.25rem 0;opacity:.25}.menu-item--danger{color:var(--color-error)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { origin: [{ type: i0.Input, args: [{ isSignal: true, alias: "origin", required: true }] }], trigger: [{ type: i0.Input, args: [{ isSignal: true, alias: "trigger", required: true }] }], positions: [{ type: i0.Input, args: [{ isSignal: true, alias: "positions", required: false }] }], panelWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelWidth", required: false }] }], formatMenu: [{ type: i0.ViewChild, args: ['formatMenu', { isSignal: true }] }], menuItems: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => MenuItemComponent), { ...{ descendants: true }, isSignal: true }] }] } });
 
 class MerchantCard {
@@ -5252,6 +6110,7 @@ class MItem {
     active = input(false, ...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
     disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     itemClick = output();
+    itemContextMenu = output();
     prefixSlot;
     avatarSlot;
     titleSlot;
@@ -5270,19 +6129,26 @@ class MItem {
         }
         this.itemClick.emit(event);
     }
+    onContextMenu(event) {
+        if (this.disabled()) {
+            return;
+        }
+        this.itemContextMenu.emit(event);
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: MItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: MItem, isStandalone: true, selector: "m-item", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, layout: { classPropertyName: "layout", publicName: "layout", isSignal: true, isRequired: false, transformFunction: null }, status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, statusLabel: { classPropertyName: "statusLabel", publicName: "statusLabel", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, time: { classPropertyName: "time", publicName: "time", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, extra: { classPropertyName: "extra", publicName: "extra", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, avatarSrc: { classPropertyName: "avatarSrc", publicName: "avatarSrc", isSignal: true, isRequired: false, transformFunction: null }, avatarText: { classPropertyName: "avatarText", publicName: "avatarText", isSignal: true, isRequired: false, transformFunction: null }, avatarAlt: { classPropertyName: "avatarAlt", publicName: "avatarAlt", isSignal: true, isRequired: false, transformFunction: null }, avatarSize: { classPropertyName: "avatarSize", publicName: "avatarSize", isSignal: true, isRequired: false, transformFunction: null }, avatarShape: { classPropertyName: "avatarShape", publicName: "avatarShape", isSignal: true, isRequired: false, transformFunction: null }, avatarIndicator: { classPropertyName: "avatarIndicator", publicName: "avatarIndicator", isSignal: true, isRequired: false, transformFunction: null }, avatarIndicatorType: { classPropertyName: "avatarIndicatorType", publicName: "avatarIndicatorType", isSignal: true, isRequired: false, transformFunction: null }, clickable: { classPropertyName: "clickable", publicName: "clickable", isSignal: true, isRequired: false, transformFunction: null }, bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, showFooter: { classPropertyName: "showFooter", publicName: "showFooter", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick" }, host: { listeners: { "click": "onActivate($event)", "keydown.enter": "onActivate($event)", "keydown.space": "onActivate($event)" }, properties: { "attr.tabindex": "clickable() ? 0 : null", "attr.role": "\"listitem\"" } }, queries: [{ propertyName: "prefixSlot", first: true, predicate: MItemPrefixSlot, descendants: true }, { propertyName: "avatarSlot", first: true, predicate: MItemAvatarSlot, descendants: true }, { propertyName: "titleSlot", first: true, predicate: MItemTitleSlot, descendants: true }, { propertyName: "summarySlot", first: true, predicate: MItemSummarySlot, descendants: true }, { propertyName: "metaSlot", first: true, predicate: MItemMetaSlot, descendants: true }, { propertyName: "footerSlot", first: true, predicate: MItemFooterSlot, descendants: true }, { propertyName: "trailingSlot", first: true, predicate: MItemTrailingSlot, descendants: true }, { propertyName: "statusSlot", first: true, predicate: MItemStatusSlot, descendants: true }, { propertyName: "actionsSlot", first: true, predicate: MItemActionsSlot, descendants: true }], ngImport: i0, template: "<article\n  class=\"m-item\"\n  [class.m-item--compact]=\"compact()\"\n  [class.m-item--clickable]=\"clickable() && !disabled()\"\n  [class.m-item--bordered]=\"bordered()\"\n  [class.m-item--selectable]=\"selectable()\"\n  [class.m-item--selected]=\"selected()\"\n  [class.m-item--active]=\"active()\"\n  [class.m-item--disabled]=\"disabled()\"\n  [class.m-item--layout-one-line]=\"layout() === 'one-line'\"\n  [class.m-item--layout-three-line]=\"layout() === 'three-line'\"\n  [class.m-item--variant-workflow]=\"variant() === 'workflow'\"\n  [class.m-item--variant-mail]=\"variant() === 'mail'\"\n  [class.m-item--variant-activity]=\"variant() === 'activity'\"\n  [class.m-item--variant-menu]=\"variant() === 'menu'\"\n  [class.m-item--variant-request]=\"variant() === 'request'\"\n  [class.m-item--variant-shortcut]=\"variant() === 'shortcut'\"\n  [class.m-item--status-unread]=\"status() === 'unread'\"\n  [class.m-item--status-todo]=\"status() === 'todo'\"\n  [class.m-item--status-processing]=\"status() === 'processing'\"\n  [class.m-item--status-warning]=\"status() === 'warning'\"\n  [style.--m-item-avatar-size]=\"avatarSize() === null ? null : avatarSize() + 'px'\"\n>\n  <div class=\"m-item__start\">\n    <div class=\"m-item__prefix\">\n      @if (prefixSlot) {\n        <ng-container [ngTemplateOutlet]=\"prefixSlot.template\" />\n      } @else {\n        <ng-content select=\"[m-item-prefix]\" />\n        <ng-content select=\"[mItemPrefix]\" />\n      }\n    </div>\n\n    <div class=\"m-item__media\">\n      @if (avatarSlot) {\n        <ng-container [ngTemplateOutlet]=\"avatarSlot.template\" />\n      } @else if (avatarSrc() || avatarText()) {\n        <s-avatar\n          class=\"m-item__default-avatar\"\n          [shape]=\"avatarShape()\"\n          [size]=\"avatarSize() ?? 48\"\n          [src]=\"avatarSrc()\"\n          [alt]=\"avatarAlt() || title()\"\n          [text]=\"avatarText() || title()\"\n          [indicator]=\"avatarIndicator()\"\n          [indicatorType]=\"avatarIndicatorType()\"\n        />\n      } @else {\n        <ng-content select=\"[m-item-start]\" />\n        <ng-content select=\"[mItemStart]\" />\n        <ng-content select=\"[m-item-avatar]\" />\n        <ng-content select=\"[mItemAvatar]\" />\n      }\n    </div>\n  </div>\n\n  <div class=\"m-item__body\">\n    <div class=\"m-item__row m-item__row--primary\">\n      <div class=\"m-item__title-wrap\">\n        <div class=\"m-item__title\">\n          @if (titleSlot) {\n            <ng-container [ngTemplateOutlet]=\"titleSlot.template\" />\n          } @else if (title()) {\n            {{ title() }}\n          } @else {\n            <ng-content select=\"[m-item-title]\" />\n            <ng-content select=\"[mItemTitle]\" />\n            <ng-content select=\"[m-item-title-text]\" />\n            <ng-content select=\"[mItemTitleText]\" />\n          }\n        </div>\n\n        @if (subtitle()) {\n          <div class=\"m-item__subtitle\">{{ subtitle() }}</div>\n        }\n      </div>\n\n      <div class=\"m-item__meta\">\n        @if (trailingSlot) {\n          <ng-container [ngTemplateOutlet]=\"trailingSlot.template\" />\n        } @else if (time()) {\n          {{ time() }}\n        } @else {\n          <ng-content select=\"[m-item-meta]\" />\n          <ng-content select=\"[mItemMeta]\" />\n          <ng-content select=\"[m-item-time]\" />\n          <ng-content select=\"[mItemTime]\" />\n        }\n      </div>\n    </div>\n\n    <div class=\"m-item__row m-item__row--secondary\">\n      <div class=\"m-item__description\">\n        @if (summarySlot) {\n          <ng-container [ngTemplateOutlet]=\"summarySlot.template\" />\n        } @else if (content()) {\n          {{ content() }}\n        } @else {\n          <ng-content select=\"[m-item-description]\" />\n          <ng-content select=\"[mItemDescription]\" />\n          <ng-content select=\"[m-item-content]\" />\n          <ng-content select=\"[mItemContent]\" />\n          <ng-content select=\"[m-item-content-text]\" />\n          <ng-content select=\"[mItemContentText]\" />\n        }\n      </div>\n\n      <div class=\"m-item__actions\">\n        @if (statusSlot) {\n          <ng-container [ngTemplateOutlet]=\"statusSlot.template\" />\n        } @else if (status() === 'todo' || status() === 'processing' || status() === 'warning') {\n          <span class=\"m-item__status-badge\">{{ statusLabel() || status() }}</span>\n        } @else if (status() === 'unread' || status() === 'read') {\n          <span class=\"m-item__status-dot\" [attr.aria-label]=\"statusLabel() || status()\"></span>\n        }\n\n        @if (actionsSlot) {\n          <ng-container [ngTemplateOutlet]=\"actionsSlot.template\" />\n        } @else if (extra()) {\n          {{ extra() }}\n        } @else {\n          <ng-content select=\"[m-item-actions]\" />\n          <ng-content select=\"[mItemActions]\" />\n          <ng-content select=\"[m-item-end]\" />\n          <ng-content select=\"[mItemEnd]\" />\n          <ng-content select=\"[m-item-extra]\" />\n          <ng-content select=\"[mItemExtra]\" />\n          <ng-content select=\"[m-item-extra-text]\" />\n          <ng-content select=\"[mItemExtraText]\" />\n          <ng-content select=\"[m-item-append]\" />\n          <ng-content select=\"[mItemAppend]\" />\n        }\n      </div>\n    </div>\n\n    @if (showFooter()) {\n      <div class=\"m-item__footer\">\n        @if (footerSlot) {\n          <ng-container [ngTemplateOutlet]=\"footerSlot.template\" />\n        } @else if (metaSlot) {\n          <ng-container [ngTemplateOutlet]=\"metaSlot.template\" />\n        } @else {\n          <ng-content select=\"[m-item-footer]\" />\n          <ng-content select=\"[mItemFooter]\" />\n        }\n      </div>\n    }\n  </div>\n</article>\n", styles: [":host{display:block}:host(:focus-visible){outline:none}:host(:focus-visible) .m-item--clickable{background:var(--color-surface-soft);box-shadow:inset 0 0 0 2px var(--color-primary)}:host(:last-child) .m-item--bordered:after{display:none}.m-item{--m-item-pad-x: var(--m-list-item-pad-x, 16px);--m-item-pad-y: var(--m-list-item-pad-y, 12px);--m-item-gap: var(--m-list-item-gap, 12px);--m-item-prefix-size: var(--m-list-item-prefix-size, 18px);--m-item-avatar-size: var(--m-list-item-avatar-size, 48px);--m-item-min-height: var(--m-list-item-min-height, 72px);--m-item-tone: linear-gradient(135deg, #0f8df2, #16b8a2);position:relative;display:flex;align-items:flex-start;gap:var(--m-item-gap);width:100%;min-width:0;max-width:100%;min-height:var(--m-item-min-height);box-sizing:border-box;padding:var(--m-item-pad-y) var(--m-item-pad-x);background:var(--color-surface)}.m-item--clickable{cursor:pointer}.m-item--clickable:hover{background:var(--color-surface-soft)}.m-item--clickable:active{background:var(--color-fg-press)}.m-item--active{background:var(--color-surface-soft)}.m-item--selected{box-shadow:inset 0 0 0 1px #2563eb2e}.m-item--disabled{cursor:not-allowed;opacity:.48}.m-item--variant-mail{--m-item-tone: linear-gradient(135deg, #7c3aed, #a855f7)}.m-item--variant-activity{--m-item-tone: linear-gradient(135deg, #f97316, #f59e0b)}.m-item--bordered:after{content:\"\";position:absolute;right:0;bottom:0;left:var(--m-item-pad-x);height:1px;background:#0000000a}.m-item--bordered:has(.m-item__media:not(:empty)):after{left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap))}.m-item--compact{--m-item-pad-x: 12px;--m-item-pad-y: 10px;--m-item-gap: 10px;--m-item-prefix-size: 18px;--m-item-avatar-size: 38px;--m-item-min-height: 68px}.m-item--variant-menu{--m-item-pad-x: var(--m-list-item-pad-x, 20px);--m-item-pad-y: 0;--m-item-gap: 14px;--m-item-avatar-size: 28px;--m-item-min-height: var(--m-list-item-min-height, 58px);align-items:center}.m-item--variant-menu.m-item--bordered:after{right:var(--m-item-pad-x);left:var(--m-item-pad-x);background:#eef1f5}.m-item--variant-menu .m-item__start,.m-item--variant-menu .m-item__prefix,.m-item--variant-menu .m-item__media{min-height:var(--m-item-min-height);align-items:center}.m-item--variant-menu .m-item__body{align-self:stretch;gap:0}.m-item--variant-menu .m-item__row--primary{min-height:var(--m-item-min-height);align-items:center;column-gap:14px}.m-item--variant-menu .m-item__row--secondary,.m-item--variant-menu .m-item__footer{display:none}.m-item--variant-menu .m-item__title{color:#151515;font-size:16px;font-weight:680;line-height:24px}.m-item--variant-menu .m-item__meta{max-width:44px;display:inline-flex;align-items:center;justify-content:flex-end;color:#98a1af;font-size:16px;line-height:24px}.m-item--variant-request{--m-item-pad-x: 16px;--m-item-pad-y: 20px;--m-item-gap: 12px;--m-item-avatar-size: 48px;--m-item-min-height: 120px}.m-item--variant-request.m-item--bordered:after,.m-item--variant-request.m-item--bordered:has(.m-item__media:not(:empty)):after{right:16px;left:88px;background:#f0f1f3;transform:none}.m-item--variant-request .m-item__body{gap:6px;padding-top:0}.m-item--variant-request .m-item__row{column-gap:12px}.m-item--variant-request .m-item__row--secondary{align-items:flex-start}.m-item--variant-request .m-item__title{color:#111;font-size:17px;font-weight:600;line-height:24px}.m-item--variant-request .m-item__meta{max-width:64px;padding-top:0;color:#8a94a6;font-size:14px;line-height:20px}.m-item--variant-request .m-item__description{color:#8a94a6;font-size:15px;line-height:22px}.m-item--variant-request .m-item__actions{max-width:180px;gap:10px;overflow:visible}.m-item--variant-shortcut{--m-item-pad-x: 16px;--m-item-pad-y: 8px;--m-item-gap: 16px;--m-item-avatar-size: 40px;--m-item-min-height: 56px;align-items:center}.m-item--variant-shortcut.m-item--bordered:after{right:var(--m-item-pad-x);left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap));background:#0000000f}.m-item--variant-shortcut .m-item__start,.m-item--variant-shortcut .m-item__prefix,.m-item--variant-shortcut .m-item__media{min-height:var(--m-item-avatar-size);align-items:center}.m-item--variant-shortcut .m-item__body{align-self:center;gap:0}.m-item--variant-shortcut .m-item__row--primary{min-height:var(--m-item-avatar-size);align-items:center;column-gap:12px}.m-item--variant-shortcut .m-item__row--secondary,.m-item--variant-shortcut .m-item__footer{display:none}.m-item--variant-shortcut .m-item__title{color:#111827;font-size:16px;font-weight:700;line-height:24px}.m-item--layout-one-line .m-item__row--secondary,.m-item--layout-one-line .m-item__footer,.m-item--layout-three-line .m-item__footer:empty{display:none}.m-item__start{flex:0 0 auto;display:flex;align-items:flex-start;gap:var(--m-item-gap);min-height:var(--m-item-avatar-size)}.m-item__start:has(.m-item__prefix:empty):has(.m-item__media:empty){display:none}.m-item__prefix{flex:0 0 var(--m-item-prefix-size);width:var(--m-item-prefix-size);min-height:var(--m-item-avatar-size);display:flex;align-items:flex-start;justify-content:center}.m-item__prefix:empty{display:none}.m-item__media{flex:0 0 var(--m-item-avatar-size);width:var(--m-item-avatar-size);min-height:var(--m-item-avatar-size);display:flex;align-items:flex-start;justify-content:center}.m-item__media:empty{display:none}.m-item__default-avatar{width:100%}.m-item__body{flex:1 1 auto;min-width:0;display:grid;gap:3px}.m-item__row{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:flex-start;column-gap:12px}.m-item__row--secondary{min-height:20px;align-items:center}.m-item__row--secondary:has(.m-item__description:empty):has(.m-item__actions:empty){display:none}.m-item__title-wrap{min-width:0}.m-item__title{display:block;min-width:0;overflow:hidden;color:var(--color-text-primary);font-size:16px;font-weight:600;line-height:22px;text-overflow:ellipsis;white-space:nowrap}.m-item__subtitle{margin-top:2px;color:#6b7280;font-size:12px;line-height:18px}.m-item__meta{max-width:78px;min-width:0;padding-top:0;overflow:hidden;color:#6b7280;font-size:13px;line-height:18px;text-align:right;text-overflow:ellipsis;white-space:nowrap}.m-item__meta:empty{display:none}.m-item__description{min-width:0;max-width:100%;overflow:hidden;color:#6b7280;font-size:14px;line-height:20px;text-overflow:ellipsis;white-space:nowrap}.m-item__description:empty{display:none}:host ::ng-deep .m-item__description>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.m-item__actions{max-width:112px;min-width:0;display:inline-flex;align-items:center;justify-content:flex-end;gap:8px;overflow:hidden;color:#00000073;font-size:12px;line-height:18px;white-space:nowrap}.m-item__actions:empty{display:none}.m-item__status-badge{min-width:18px;max-width:52px;height:18px;padding:0 5px;overflow:hidden;box-sizing:border-box;border-radius:9px;background:#3b82f61f;color:#2563eb;font-size:11px;font-weight:600;line-height:18px;text-overflow:ellipsis;white-space:nowrap}.m-item__status-dot{width:6px;height:6px;border-radius:999px;background:#cbd5e1}.m-item--status-unread .m-item__status-dot{background:#f43f5e}.m-item--status-processing .m-item__status-badge{background:#10b9811f;color:#047857}.m-item--status-warning .m-item__status-badge{background:#f59e0b24;color:#b45309}.m-item__footer{min-width:0;overflow:hidden;color:#00000073;font-size:12px;line-height:18px;text-overflow:ellipsis;white-space:nowrap}.m-item__footer:empty{display:none}:host ::ng-deep .m-item__default-avatar .avatar{--avatar-size: var(--m-item-avatar-size) !important}:host ::ng-deep .m-item__default-avatar .avatar__content{background:var(--m-item-tone)}:host ::ng-deep :where([m-item-start],[mItemStart],[m-item-avatar],[mItemAvatar]){display:inline-flex;width:var(--m-item-avatar-size);height:var(--m-item-avatar-size);flex:0 0 var(--m-item-avatar-size);align-items:center;justify-content:center;overflow:visible}\n"], dependencies: [{ kind: "component", type: Avatar, selector: "s-avatar", inputs: ["src", "alt", "text", "shape", "status", "size", "indicator", "indicatorType"], outputs: ["imageError"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: MItem, isStandalone: true, selector: "m-item", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, layout: { classPropertyName: "layout", publicName: "layout", isSignal: true, isRequired: false, transformFunction: null }, status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, statusLabel: { classPropertyName: "statusLabel", publicName: "statusLabel", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, time: { classPropertyName: "time", publicName: "time", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, extra: { classPropertyName: "extra", publicName: "extra", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, avatarSrc: { classPropertyName: "avatarSrc", publicName: "avatarSrc", isSignal: true, isRequired: false, transformFunction: null }, avatarText: { classPropertyName: "avatarText", publicName: "avatarText", isSignal: true, isRequired: false, transformFunction: null }, avatarAlt: { classPropertyName: "avatarAlt", publicName: "avatarAlt", isSignal: true, isRequired: false, transformFunction: null }, avatarSize: { classPropertyName: "avatarSize", publicName: "avatarSize", isSignal: true, isRequired: false, transformFunction: null }, avatarShape: { classPropertyName: "avatarShape", publicName: "avatarShape", isSignal: true, isRequired: false, transformFunction: null }, avatarIndicator: { classPropertyName: "avatarIndicator", publicName: "avatarIndicator", isSignal: true, isRequired: false, transformFunction: null }, avatarIndicatorType: { classPropertyName: "avatarIndicatorType", publicName: "avatarIndicatorType", isSignal: true, isRequired: false, transformFunction: null }, clickable: { classPropertyName: "clickable", publicName: "clickable", isSignal: true, isRequired: false, transformFunction: null }, bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, showFooter: { classPropertyName: "showFooter", publicName: "showFooter", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick", itemContextMenu: "itemContextMenu" }, host: { listeners: { "click": "onActivate($event)", "contextmenu": "onContextMenu($event)", "keydown.enter": "onActivate($event)", "keydown.space": "onActivate($event)" }, properties: { "attr.tabindex": "clickable() ? 0 : null", "attr.role": "\"listitem\"" } }, queries: [{ propertyName: "prefixSlot", first: true, predicate: MItemPrefixSlot, descendants: true }, { propertyName: "avatarSlot", first: true, predicate: MItemAvatarSlot, descendants: true }, { propertyName: "titleSlot", first: true, predicate: MItemTitleSlot, descendants: true }, { propertyName: "summarySlot", first: true, predicate: MItemSummarySlot, descendants: true }, { propertyName: "metaSlot", first: true, predicate: MItemMetaSlot, descendants: true }, { propertyName: "footerSlot", first: true, predicate: MItemFooterSlot, descendants: true }, { propertyName: "trailingSlot", first: true, predicate: MItemTrailingSlot, descendants: true }, { propertyName: "statusSlot", first: true, predicate: MItemStatusSlot, descendants: true }, { propertyName: "actionsSlot", first: true, predicate: MItemActionsSlot, descendants: true }], ngImport: i0, template: "<article\n  class=\"m-item\"\n  [class.m-item--compact]=\"compact()\"\n  [class.m-item--clickable]=\"clickable() && !disabled()\"\n  [class.m-item--bordered]=\"bordered()\"\n  [class.m-item--selectable]=\"selectable()\"\n  [class.m-item--selected]=\"selected()\"\n  [class.m-item--active]=\"active()\"\n  [class.m-item--disabled]=\"disabled()\"\n  [class.m-item--layout-one-line]=\"layout() === 'one-line'\"\n  [class.m-item--layout-three-line]=\"layout() === 'three-line'\"\n  [class.m-item--variant-workflow]=\"variant() === 'workflow'\"\n  [class.m-item--variant-mail]=\"variant() === 'mail'\"\n  [class.m-item--variant-activity]=\"variant() === 'activity'\"\n  [class.m-item--variant-menu]=\"variant() === 'menu'\"\n  [class.m-item--variant-request]=\"variant() === 'request'\"\n  [class.m-item--variant-shortcut]=\"variant() === 'shortcut'\"\n  [class.m-item--status-unread]=\"status() === 'unread'\"\n  [class.m-item--status-todo]=\"status() === 'todo'\"\n  [class.m-item--status-processing]=\"status() === 'processing'\"\n  [class.m-item--status-warning]=\"status() === 'warning'\"\n  [style.--m-item-avatar-size]=\"avatarSize() === null ? null : avatarSize() + 'px'\"\n>\n  <div class=\"m-item__start\">\n    <div class=\"m-item__prefix\">\n      @if (prefixSlot) {\n        <ng-container [ngTemplateOutlet]=\"prefixSlot.template\" />\n      } @else {\n        <ng-content select=\"[m-item-prefix]\" />\n        <ng-content select=\"[mItemPrefix]\" />\n      }\n    </div>\n\n    <div class=\"m-item__media\">\n      @if (avatarSlot) {\n        <ng-container [ngTemplateOutlet]=\"avatarSlot.template\" />\n      } @else if (avatarSrc() || avatarText()) {\n        <s-avatar\n          class=\"m-item__default-avatar\"\n          [shape]=\"avatarShape()\"\n          [size]=\"avatarSize() ?? 48\"\n          [src]=\"avatarSrc()\"\n          [alt]=\"avatarAlt() || title()\"\n          [text]=\"avatarText() || title()\"\n          [indicator]=\"avatarIndicator()\"\n          [indicatorType]=\"avatarIndicatorType()\"\n        />\n      } @else {\n        <ng-content select=\"[m-item-start]\" />\n        <ng-content select=\"[mItemStart]\" />\n        <ng-content select=\"[m-item-avatar]\" />\n        <ng-content select=\"[mItemAvatar]\" />\n      }\n    </div>\n  </div>\n\n  <div class=\"m-item__body\">\n    <div class=\"m-item__row m-item__row--primary\">\n      <div class=\"m-item__title-wrap\">\n        <div class=\"m-item__title\">\n          @if (titleSlot) {\n            <ng-container [ngTemplateOutlet]=\"titleSlot.template\" />\n          } @else if (title()) {\n            {{ title() }}\n          } @else {\n            <ng-content select=\"[m-item-title]\" />\n            <ng-content select=\"[mItemTitle]\" />\n            <ng-content select=\"[m-item-title-text]\" />\n            <ng-content select=\"[mItemTitleText]\" />\n          }\n        </div>\n\n        @if (subtitle()) {\n          <div class=\"m-item__subtitle\">{{ subtitle() }}</div>\n        }\n      </div>\n\n      <div class=\"m-item__meta\">\n        @if (trailingSlot) {\n          <ng-container [ngTemplateOutlet]=\"trailingSlot.template\" />\n        } @else if (time()) {\n          {{ time() }}\n        } @else {\n          <ng-content select=\"[m-item-meta]\" />\n          <ng-content select=\"[mItemMeta]\" />\n          <ng-content select=\"[m-item-time]\" />\n          <ng-content select=\"[mItemTime]\" />\n        }\n      </div>\n    </div>\n\n    <div class=\"m-item__row m-item__row--secondary\">\n      <div class=\"m-item__description\">\n        @if (summarySlot) {\n          <ng-container [ngTemplateOutlet]=\"summarySlot.template\" />\n        } @else if (content()) {\n          {{ content() }}\n        } @else {\n          <ng-content select=\"[m-item-description]\" />\n          <ng-content select=\"[mItemDescription]\" />\n          <ng-content select=\"[m-item-content]\" />\n          <ng-content select=\"[mItemContent]\" />\n          <ng-content select=\"[m-item-content-text]\" />\n          <ng-content select=\"[mItemContentText]\" />\n        }\n      </div>\n\n      <div class=\"m-item__actions\">\n        @if (statusSlot) {\n          <ng-container [ngTemplateOutlet]=\"statusSlot.template\" />\n        } @else if (status() === 'todo' || status() === 'processing' || status() === 'warning') {\n          <span class=\"m-item__status-badge\">{{ statusLabel() || status() }}</span>\n        } @else if (status() === 'unread' || status() === 'read') {\n          <span class=\"m-item__status-dot\" [attr.aria-label]=\"statusLabel() || status()\"></span>\n        }\n\n        @if (actionsSlot) {\n          <ng-container [ngTemplateOutlet]=\"actionsSlot.template\" />\n        } @else if (extra()) {\n          {{ extra() }}\n        } @else {\n          <ng-content select=\"[m-item-actions]\" />\n          <ng-content select=\"[mItemActions]\" />\n          <ng-content select=\"[m-item-end]\" />\n          <ng-content select=\"[mItemEnd]\" />\n          <ng-content select=\"[m-item-extra]\" />\n          <ng-content select=\"[mItemExtra]\" />\n          <ng-content select=\"[m-item-extra-text]\" />\n          <ng-content select=\"[mItemExtraText]\" />\n          <ng-content select=\"[m-item-append]\" />\n          <ng-content select=\"[mItemAppend]\" />\n        }\n      </div>\n    </div>\n\n    @if (showFooter()) {\n      <div class=\"m-item__footer\">\n        @if (footerSlot) {\n          <ng-container [ngTemplateOutlet]=\"footerSlot.template\" />\n        } @else if (metaSlot) {\n          <ng-container [ngTemplateOutlet]=\"metaSlot.template\" />\n        } @else {\n          <ng-content select=\"[m-item-footer]\" />\n          <ng-content select=\"[mItemFooter]\" />\n        }\n      </div>\n    }\n  </div>\n</article>\n", styles: [":host{display:block}:host(:focus-visible){outline:none}:host(:focus-visible) .m-item--clickable{background:var(--m-item-focus-bg, var(--color-surface-soft));box-shadow:var(--m-item-focus-shadow, inset 0 0 0 2px var(--color-primary))}:host(:last-child) .m-item--bordered:after{display:none}.m-item{--m-item-pad-x: var(--m-list-item-pad-x, 16px);--m-item-pad-y: var(--m-list-item-pad-y, 12px);--m-item-gap: var(--m-list-item-gap, 12px);--m-item-prefix-size: var(--m-list-item-prefix-size, 18px);--m-item-avatar-size: var(--m-list-item-avatar-size, 48px);--m-item-min-height: var(--m-list-item-min-height, 72px);--m-item-tone: linear-gradient(135deg, #0f8df2, #16b8a2);position:relative;display:flex;align-items:flex-start;gap:var(--m-item-gap);width:100%;min-width:0;max-width:100%;min-height:var(--m-item-min-height);box-sizing:border-box;padding:var(--m-item-pad-y) var(--m-item-pad-x);background:var(--color-surface)}.m-item--clickable{cursor:pointer}.m-item--clickable:hover{background:var(--color-surface-soft)}.m-item--clickable:active{background:var(--color-fg-press)}.m-item--active{background:var(--m-item-active-bg, var(--color-surface-soft));box-shadow:var(--m-item-active-shadow, none)}:host(:focus-visible) .m-item--clickable.m-item--active{background:var(--m-item-active-focus-bg, var(--m-item-active-bg, var(--color-surface-soft)));box-shadow:var(--m-item-active-focus-shadow, var(--m-item-active-shadow, inset 0 0 0 2px var(--color-primary)))}.m-item--selected{box-shadow:inset 0 0 0 1px #2563eb2e}.m-item--disabled{cursor:not-allowed;opacity:.48}.m-item--variant-mail{--m-item-tone: linear-gradient(135deg, #7c3aed, #a855f7)}.m-item--variant-activity{--m-item-tone: linear-gradient(135deg, #f97316, #f59e0b)}.m-item--bordered:after{content:\"\";position:absolute;right:0;bottom:0;left:var(--m-item-pad-x);height:1px;background:#0000000a}.m-item--bordered:has(.m-item__media:not(:empty)):after{left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap))}.m-item--compact{--m-item-pad-x: 12px;--m-item-pad-y: 10px;--m-item-gap: 10px;--m-item-prefix-size: 18px;--m-item-avatar-size: 38px;--m-item-min-height: 68px}.m-item--variant-menu{--m-item-pad-x: var(--m-list-item-pad-x, 20px);--m-item-pad-y: 0;--m-item-gap: 14px;--m-item-avatar-size: 28px;--m-item-min-height: var(--m-list-item-min-height, 58px);align-items:center}.m-item--variant-menu.m-item--bordered:after{right:var(--m-item-pad-x);left:var(--m-item-pad-x);background:#eef1f5}.m-item--variant-menu .m-item__start,.m-item--variant-menu .m-item__prefix,.m-item--variant-menu .m-item__media{min-height:var(--m-item-min-height);align-items:center}.m-item--variant-menu .m-item__body{align-self:stretch;gap:0}.m-item--variant-menu .m-item__row--primary{min-height:var(--m-item-min-height);align-items:center;column-gap:14px}.m-item--variant-menu .m-item__row--secondary,.m-item--variant-menu .m-item__footer{display:none}.m-item--variant-menu .m-item__title{color:#151515;font-size:16px;font-weight:680;line-height:24px}.m-item--variant-menu .m-item__meta{max-width:44px;display:inline-flex;align-items:center;justify-content:flex-end;color:#98a1af;font-size:16px;line-height:24px}.m-item--variant-request{--m-item-pad-x: 16px;--m-item-pad-y: 20px;--m-item-gap: 12px;--m-item-avatar-size: 48px;--m-item-min-height: 120px}.m-item--variant-request.m-item--bordered:after,.m-item--variant-request.m-item--bordered:has(.m-item__media:not(:empty)):after{right:16px;left:88px;background:#f0f1f3;transform:none}.m-item--variant-request .m-item__body{gap:6px;padding-top:0}.m-item--variant-request .m-item__row{column-gap:12px}.m-item--variant-request .m-item__row--secondary{align-items:flex-start}.m-item--variant-request .m-item__title{color:#111;font-size:17px;font-weight:600;line-height:24px}.m-item--variant-request .m-item__meta{max-width:64px;padding-top:0;color:#8a94a6;font-size:14px;line-height:20px}.m-item--variant-request .m-item__description{color:#8a94a6;font-size:15px;line-height:22px}.m-item--variant-request .m-item__actions{max-width:180px;gap:10px;overflow:visible}.m-item--variant-shortcut{--m-item-pad-x: 16px;--m-item-pad-y: 8px;--m-item-gap: 16px;--m-item-avatar-size: 40px;--m-item-min-height: 56px;align-items:center}.m-item--variant-shortcut.m-item--bordered:after{right:var(--m-item-pad-x);left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap));background:#0000000f}.m-item--variant-shortcut .m-item__start,.m-item--variant-shortcut .m-item__prefix,.m-item--variant-shortcut .m-item__media{min-height:var(--m-item-avatar-size);align-items:center}.m-item--variant-shortcut .m-item__body{align-self:center;gap:0}.m-item--variant-shortcut .m-item__row--primary{min-height:var(--m-item-avatar-size);align-items:center;column-gap:12px}.m-item--variant-shortcut .m-item__row--secondary,.m-item--variant-shortcut .m-item__footer{display:none}.m-item--variant-shortcut .m-item__title{color:#111827;font-size:16px;font-weight:700;line-height:24px}.m-item--layout-one-line .m-item__row--secondary,.m-item--layout-one-line .m-item__footer,.m-item--layout-three-line .m-item__footer:empty{display:none}.m-item__start{flex:0 0 auto;display:flex;align-items:flex-start;gap:var(--m-item-gap);min-height:var(--m-item-avatar-size)}.m-item__start:has(.m-item__prefix:empty):has(.m-item__media:empty){display:none}.m-item__prefix{flex:0 0 var(--m-item-prefix-size);width:var(--m-item-prefix-size);min-height:var(--m-item-avatar-size);display:flex;align-items:flex-start;justify-content:center}.m-item__prefix:empty{display:none}.m-item__media{flex:0 0 var(--m-item-avatar-size);width:var(--m-item-avatar-size);min-height:var(--m-item-avatar-size);display:flex;align-items:flex-start;justify-content:center}.m-item__media:empty{display:none}.m-item__default-avatar{width:100%}.m-item__body{flex:1 1 auto;min-width:0;display:grid;gap:3px}.m-item__row{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:flex-start;column-gap:12px}.m-item__row--secondary{min-height:20px;align-items:center}.m-item__row--secondary:has(.m-item__description:empty):has(.m-item__actions:empty){display:none}.m-item__title-wrap{min-width:0}.m-item__title{display:block;min-width:0;overflow:hidden;color:var(--color-text-primary);font-size:16px;font-weight:600;line-height:22px;text-overflow:ellipsis;white-space:nowrap}.m-item__subtitle{margin-top:2px;color:#6b7280;font-size:12px;line-height:18px}.m-item__meta{max-width:78px;min-width:0;padding-top:0;overflow:hidden;color:#6b7280;font-size:13px;line-height:18px;text-align:right;text-overflow:ellipsis;white-space:nowrap}.m-item__meta:empty{display:none}.m-item__description{min-width:0;max-width:100%;overflow:hidden;color:#6b7280;font-size:14px;line-height:20px;text-overflow:ellipsis;white-space:nowrap}.m-item__description:empty{display:none}:host ::ng-deep .m-item__description>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.m-item__actions{max-width:112px;min-width:0;display:inline-flex;align-items:center;justify-content:flex-end;gap:8px;overflow:hidden;color:#00000073;font-size:12px;line-height:18px;white-space:nowrap}.m-item__actions:empty{display:none}.m-item__status-badge{min-width:18px;max-width:52px;height:18px;padding:0 5px;overflow:hidden;box-sizing:border-box;border-radius:9px;background:#3b82f61f;color:#2563eb;font-size:11px;font-weight:600;line-height:18px;text-overflow:ellipsis;white-space:nowrap}.m-item__status-dot{width:6px;height:6px;border-radius:999px;background:#cbd5e1}.m-item--status-unread .m-item__status-dot{background:#f43f5e}.m-item--status-processing .m-item__status-badge{background:#10b9811f;color:#047857}.m-item--status-warning .m-item__status-badge{background:#f59e0b24;color:#b45309}.m-item__footer{min-width:0;overflow:hidden;color:#00000073;font-size:12px;line-height:18px;text-overflow:ellipsis;white-space:nowrap}.m-item__footer:empty{display:none}:host ::ng-deep .m-item__default-avatar .avatar{--avatar-size: var(--m-item-avatar-size) !important}:host ::ng-deep .m-item__default-avatar .avatar__content{background:var(--m-item-tone)}:host ::ng-deep :where([m-item-start],[mItemStart],[m-item-avatar],[mItemAvatar]){display:inline-flex;width:var(--m-item-avatar-size);height:var(--m-item-avatar-size);flex:0 0 var(--m-item-avatar-size);align-items:center;justify-content:center;overflow:visible}\n"], dependencies: [{ kind: "component", type: Avatar, selector: "s-avatar", inputs: ["src", "alt", "text", "shape", "status", "size", "indicator", "indicatorType"], outputs: ["imageError"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: MItem, decorators: [{
             type: Component,
             args: [{ selector: 'm-item', imports: [Avatar, NgTemplateOutlet, M_ITEM_SLOT_DIRECTIVES], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '(click)': 'onActivate($event)',
+                        '(contextmenu)': 'onContextMenu($event)',
                         '(keydown.enter)': 'onActivate($event)',
                         '(keydown.space)': 'onActivate($event)',
                         '[attr.tabindex]': 'clickable() ? 0 : null',
                         '[attr.role]': '"listitem"',
-                    }, template: "<article\n  class=\"m-item\"\n  [class.m-item--compact]=\"compact()\"\n  [class.m-item--clickable]=\"clickable() && !disabled()\"\n  [class.m-item--bordered]=\"bordered()\"\n  [class.m-item--selectable]=\"selectable()\"\n  [class.m-item--selected]=\"selected()\"\n  [class.m-item--active]=\"active()\"\n  [class.m-item--disabled]=\"disabled()\"\n  [class.m-item--layout-one-line]=\"layout() === 'one-line'\"\n  [class.m-item--layout-three-line]=\"layout() === 'three-line'\"\n  [class.m-item--variant-workflow]=\"variant() === 'workflow'\"\n  [class.m-item--variant-mail]=\"variant() === 'mail'\"\n  [class.m-item--variant-activity]=\"variant() === 'activity'\"\n  [class.m-item--variant-menu]=\"variant() === 'menu'\"\n  [class.m-item--variant-request]=\"variant() === 'request'\"\n  [class.m-item--variant-shortcut]=\"variant() === 'shortcut'\"\n  [class.m-item--status-unread]=\"status() === 'unread'\"\n  [class.m-item--status-todo]=\"status() === 'todo'\"\n  [class.m-item--status-processing]=\"status() === 'processing'\"\n  [class.m-item--status-warning]=\"status() === 'warning'\"\n  [style.--m-item-avatar-size]=\"avatarSize() === null ? null : avatarSize() + 'px'\"\n>\n  <div class=\"m-item__start\">\n    <div class=\"m-item__prefix\">\n      @if (prefixSlot) {\n        <ng-container [ngTemplateOutlet]=\"prefixSlot.template\" />\n      } @else {\n        <ng-content select=\"[m-item-prefix]\" />\n        <ng-content select=\"[mItemPrefix]\" />\n      }\n    </div>\n\n    <div class=\"m-item__media\">\n      @if (avatarSlot) {\n        <ng-container [ngTemplateOutlet]=\"avatarSlot.template\" />\n      } @else if (avatarSrc() || avatarText()) {\n        <s-avatar\n          class=\"m-item__default-avatar\"\n          [shape]=\"avatarShape()\"\n          [size]=\"avatarSize() ?? 48\"\n          [src]=\"avatarSrc()\"\n          [alt]=\"avatarAlt() || title()\"\n          [text]=\"avatarText() || title()\"\n          [indicator]=\"avatarIndicator()\"\n          [indicatorType]=\"avatarIndicatorType()\"\n        />\n      } @else {\n        <ng-content select=\"[m-item-start]\" />\n        <ng-content select=\"[mItemStart]\" />\n        <ng-content select=\"[m-item-avatar]\" />\n        <ng-content select=\"[mItemAvatar]\" />\n      }\n    </div>\n  </div>\n\n  <div class=\"m-item__body\">\n    <div class=\"m-item__row m-item__row--primary\">\n      <div class=\"m-item__title-wrap\">\n        <div class=\"m-item__title\">\n          @if (titleSlot) {\n            <ng-container [ngTemplateOutlet]=\"titleSlot.template\" />\n          } @else if (title()) {\n            {{ title() }}\n          } @else {\n            <ng-content select=\"[m-item-title]\" />\n            <ng-content select=\"[mItemTitle]\" />\n            <ng-content select=\"[m-item-title-text]\" />\n            <ng-content select=\"[mItemTitleText]\" />\n          }\n        </div>\n\n        @if (subtitle()) {\n          <div class=\"m-item__subtitle\">{{ subtitle() }}</div>\n        }\n      </div>\n\n      <div class=\"m-item__meta\">\n        @if (trailingSlot) {\n          <ng-container [ngTemplateOutlet]=\"trailingSlot.template\" />\n        } @else if (time()) {\n          {{ time() }}\n        } @else {\n          <ng-content select=\"[m-item-meta]\" />\n          <ng-content select=\"[mItemMeta]\" />\n          <ng-content select=\"[m-item-time]\" />\n          <ng-content select=\"[mItemTime]\" />\n        }\n      </div>\n    </div>\n\n    <div class=\"m-item__row m-item__row--secondary\">\n      <div class=\"m-item__description\">\n        @if (summarySlot) {\n          <ng-container [ngTemplateOutlet]=\"summarySlot.template\" />\n        } @else if (content()) {\n          {{ content() }}\n        } @else {\n          <ng-content select=\"[m-item-description]\" />\n          <ng-content select=\"[mItemDescription]\" />\n          <ng-content select=\"[m-item-content]\" />\n          <ng-content select=\"[mItemContent]\" />\n          <ng-content select=\"[m-item-content-text]\" />\n          <ng-content select=\"[mItemContentText]\" />\n        }\n      </div>\n\n      <div class=\"m-item__actions\">\n        @if (statusSlot) {\n          <ng-container [ngTemplateOutlet]=\"statusSlot.template\" />\n        } @else if (status() === 'todo' || status() === 'processing' || status() === 'warning') {\n          <span class=\"m-item__status-badge\">{{ statusLabel() || status() }}</span>\n        } @else if (status() === 'unread' || status() === 'read') {\n          <span class=\"m-item__status-dot\" [attr.aria-label]=\"statusLabel() || status()\"></span>\n        }\n\n        @if (actionsSlot) {\n          <ng-container [ngTemplateOutlet]=\"actionsSlot.template\" />\n        } @else if (extra()) {\n          {{ extra() }}\n        } @else {\n          <ng-content select=\"[m-item-actions]\" />\n          <ng-content select=\"[mItemActions]\" />\n          <ng-content select=\"[m-item-end]\" />\n          <ng-content select=\"[mItemEnd]\" />\n          <ng-content select=\"[m-item-extra]\" />\n          <ng-content select=\"[mItemExtra]\" />\n          <ng-content select=\"[m-item-extra-text]\" />\n          <ng-content select=\"[mItemExtraText]\" />\n          <ng-content select=\"[m-item-append]\" />\n          <ng-content select=\"[mItemAppend]\" />\n        }\n      </div>\n    </div>\n\n    @if (showFooter()) {\n      <div class=\"m-item__footer\">\n        @if (footerSlot) {\n          <ng-container [ngTemplateOutlet]=\"footerSlot.template\" />\n        } @else if (metaSlot) {\n          <ng-container [ngTemplateOutlet]=\"metaSlot.template\" />\n        } @else {\n          <ng-content select=\"[m-item-footer]\" />\n          <ng-content select=\"[mItemFooter]\" />\n        }\n      </div>\n    }\n  </div>\n</article>\n", styles: [":host{display:block}:host(:focus-visible){outline:none}:host(:focus-visible) .m-item--clickable{background:var(--color-surface-soft);box-shadow:inset 0 0 0 2px var(--color-primary)}:host(:last-child) .m-item--bordered:after{display:none}.m-item{--m-item-pad-x: var(--m-list-item-pad-x, 16px);--m-item-pad-y: var(--m-list-item-pad-y, 12px);--m-item-gap: var(--m-list-item-gap, 12px);--m-item-prefix-size: var(--m-list-item-prefix-size, 18px);--m-item-avatar-size: var(--m-list-item-avatar-size, 48px);--m-item-min-height: var(--m-list-item-min-height, 72px);--m-item-tone: linear-gradient(135deg, #0f8df2, #16b8a2);position:relative;display:flex;align-items:flex-start;gap:var(--m-item-gap);width:100%;min-width:0;max-width:100%;min-height:var(--m-item-min-height);box-sizing:border-box;padding:var(--m-item-pad-y) var(--m-item-pad-x);background:var(--color-surface)}.m-item--clickable{cursor:pointer}.m-item--clickable:hover{background:var(--color-surface-soft)}.m-item--clickable:active{background:var(--color-fg-press)}.m-item--active{background:var(--color-surface-soft)}.m-item--selected{box-shadow:inset 0 0 0 1px #2563eb2e}.m-item--disabled{cursor:not-allowed;opacity:.48}.m-item--variant-mail{--m-item-tone: linear-gradient(135deg, #7c3aed, #a855f7)}.m-item--variant-activity{--m-item-tone: linear-gradient(135deg, #f97316, #f59e0b)}.m-item--bordered:after{content:\"\";position:absolute;right:0;bottom:0;left:var(--m-item-pad-x);height:1px;background:#0000000a}.m-item--bordered:has(.m-item__media:not(:empty)):after{left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap))}.m-item--compact{--m-item-pad-x: 12px;--m-item-pad-y: 10px;--m-item-gap: 10px;--m-item-prefix-size: 18px;--m-item-avatar-size: 38px;--m-item-min-height: 68px}.m-item--variant-menu{--m-item-pad-x: var(--m-list-item-pad-x, 20px);--m-item-pad-y: 0;--m-item-gap: 14px;--m-item-avatar-size: 28px;--m-item-min-height: var(--m-list-item-min-height, 58px);align-items:center}.m-item--variant-menu.m-item--bordered:after{right:var(--m-item-pad-x);left:var(--m-item-pad-x);background:#eef1f5}.m-item--variant-menu .m-item__start,.m-item--variant-menu .m-item__prefix,.m-item--variant-menu .m-item__media{min-height:var(--m-item-min-height);align-items:center}.m-item--variant-menu .m-item__body{align-self:stretch;gap:0}.m-item--variant-menu .m-item__row--primary{min-height:var(--m-item-min-height);align-items:center;column-gap:14px}.m-item--variant-menu .m-item__row--secondary,.m-item--variant-menu .m-item__footer{display:none}.m-item--variant-menu .m-item__title{color:#151515;font-size:16px;font-weight:680;line-height:24px}.m-item--variant-menu .m-item__meta{max-width:44px;display:inline-flex;align-items:center;justify-content:flex-end;color:#98a1af;font-size:16px;line-height:24px}.m-item--variant-request{--m-item-pad-x: 16px;--m-item-pad-y: 20px;--m-item-gap: 12px;--m-item-avatar-size: 48px;--m-item-min-height: 120px}.m-item--variant-request.m-item--bordered:after,.m-item--variant-request.m-item--bordered:has(.m-item__media:not(:empty)):after{right:16px;left:88px;background:#f0f1f3;transform:none}.m-item--variant-request .m-item__body{gap:6px;padding-top:0}.m-item--variant-request .m-item__row{column-gap:12px}.m-item--variant-request .m-item__row--secondary{align-items:flex-start}.m-item--variant-request .m-item__title{color:#111;font-size:17px;font-weight:600;line-height:24px}.m-item--variant-request .m-item__meta{max-width:64px;padding-top:0;color:#8a94a6;font-size:14px;line-height:20px}.m-item--variant-request .m-item__description{color:#8a94a6;font-size:15px;line-height:22px}.m-item--variant-request .m-item__actions{max-width:180px;gap:10px;overflow:visible}.m-item--variant-shortcut{--m-item-pad-x: 16px;--m-item-pad-y: 8px;--m-item-gap: 16px;--m-item-avatar-size: 40px;--m-item-min-height: 56px;align-items:center}.m-item--variant-shortcut.m-item--bordered:after{right:var(--m-item-pad-x);left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap));background:#0000000f}.m-item--variant-shortcut .m-item__start,.m-item--variant-shortcut .m-item__prefix,.m-item--variant-shortcut .m-item__media{min-height:var(--m-item-avatar-size);align-items:center}.m-item--variant-shortcut .m-item__body{align-self:center;gap:0}.m-item--variant-shortcut .m-item__row--primary{min-height:var(--m-item-avatar-size);align-items:center;column-gap:12px}.m-item--variant-shortcut .m-item__row--secondary,.m-item--variant-shortcut .m-item__footer{display:none}.m-item--variant-shortcut .m-item__title{color:#111827;font-size:16px;font-weight:700;line-height:24px}.m-item--layout-one-line .m-item__row--secondary,.m-item--layout-one-line .m-item__footer,.m-item--layout-three-line .m-item__footer:empty{display:none}.m-item__start{flex:0 0 auto;display:flex;align-items:flex-start;gap:var(--m-item-gap);min-height:var(--m-item-avatar-size)}.m-item__start:has(.m-item__prefix:empty):has(.m-item__media:empty){display:none}.m-item__prefix{flex:0 0 var(--m-item-prefix-size);width:var(--m-item-prefix-size);min-height:var(--m-item-avatar-size);display:flex;align-items:flex-start;justify-content:center}.m-item__prefix:empty{display:none}.m-item__media{flex:0 0 var(--m-item-avatar-size);width:var(--m-item-avatar-size);min-height:var(--m-item-avatar-size);display:flex;align-items:flex-start;justify-content:center}.m-item__media:empty{display:none}.m-item__default-avatar{width:100%}.m-item__body{flex:1 1 auto;min-width:0;display:grid;gap:3px}.m-item__row{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:flex-start;column-gap:12px}.m-item__row--secondary{min-height:20px;align-items:center}.m-item__row--secondary:has(.m-item__description:empty):has(.m-item__actions:empty){display:none}.m-item__title-wrap{min-width:0}.m-item__title{display:block;min-width:0;overflow:hidden;color:var(--color-text-primary);font-size:16px;font-weight:600;line-height:22px;text-overflow:ellipsis;white-space:nowrap}.m-item__subtitle{margin-top:2px;color:#6b7280;font-size:12px;line-height:18px}.m-item__meta{max-width:78px;min-width:0;padding-top:0;overflow:hidden;color:#6b7280;font-size:13px;line-height:18px;text-align:right;text-overflow:ellipsis;white-space:nowrap}.m-item__meta:empty{display:none}.m-item__description{min-width:0;max-width:100%;overflow:hidden;color:#6b7280;font-size:14px;line-height:20px;text-overflow:ellipsis;white-space:nowrap}.m-item__description:empty{display:none}:host ::ng-deep .m-item__description>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.m-item__actions{max-width:112px;min-width:0;display:inline-flex;align-items:center;justify-content:flex-end;gap:8px;overflow:hidden;color:#00000073;font-size:12px;line-height:18px;white-space:nowrap}.m-item__actions:empty{display:none}.m-item__status-badge{min-width:18px;max-width:52px;height:18px;padding:0 5px;overflow:hidden;box-sizing:border-box;border-radius:9px;background:#3b82f61f;color:#2563eb;font-size:11px;font-weight:600;line-height:18px;text-overflow:ellipsis;white-space:nowrap}.m-item__status-dot{width:6px;height:6px;border-radius:999px;background:#cbd5e1}.m-item--status-unread .m-item__status-dot{background:#f43f5e}.m-item--status-processing .m-item__status-badge{background:#10b9811f;color:#047857}.m-item--status-warning .m-item__status-badge{background:#f59e0b24;color:#b45309}.m-item__footer{min-width:0;overflow:hidden;color:#00000073;font-size:12px;line-height:18px;text-overflow:ellipsis;white-space:nowrap}.m-item__footer:empty{display:none}:host ::ng-deep .m-item__default-avatar .avatar{--avatar-size: var(--m-item-avatar-size) !important}:host ::ng-deep .m-item__default-avatar .avatar__content{background:var(--m-item-tone)}:host ::ng-deep :where([m-item-start],[mItemStart],[m-item-avatar],[mItemAvatar]){display:inline-flex;width:var(--m-item-avatar-size);height:var(--m-item-avatar-size);flex:0 0 var(--m-item-avatar-size);align-items:center;justify-content:center;overflow:visible}\n"] }]
-        }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], layout: [{ type: i0.Input, args: [{ isSignal: true, alias: "layout", required: false }] }], status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }], statusLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "statusLabel", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], time: [{ type: i0.Input, args: [{ isSignal: true, alias: "time", required: false }] }], content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }], extra: [{ type: i0.Input, args: [{ isSignal: true, alias: "extra", required: false }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }], avatarSrc: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarSrc", required: false }] }], avatarText: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarText", required: false }] }], avatarAlt: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarAlt", required: false }] }], avatarSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarSize", required: false }] }], avatarShape: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarShape", required: false }] }], avatarIndicator: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarIndicator", required: false }] }], avatarIndicatorType: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarIndicatorType", required: false }] }], clickable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clickable", required: false }] }], bordered: [{ type: i0.Input, args: [{ isSignal: true, alias: "bordered", required: false }] }], compact: [{ type: i0.Input, args: [{ isSignal: true, alias: "compact", required: false }] }], showFooter: [{ type: i0.Input, args: [{ isSignal: true, alias: "showFooter", required: false }] }], selectable: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectable", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }], prefixSlot: [{
+                    }, template: "<article\n  class=\"m-item\"\n  [class.m-item--compact]=\"compact()\"\n  [class.m-item--clickable]=\"clickable() && !disabled()\"\n  [class.m-item--bordered]=\"bordered()\"\n  [class.m-item--selectable]=\"selectable()\"\n  [class.m-item--selected]=\"selected()\"\n  [class.m-item--active]=\"active()\"\n  [class.m-item--disabled]=\"disabled()\"\n  [class.m-item--layout-one-line]=\"layout() === 'one-line'\"\n  [class.m-item--layout-three-line]=\"layout() === 'three-line'\"\n  [class.m-item--variant-workflow]=\"variant() === 'workflow'\"\n  [class.m-item--variant-mail]=\"variant() === 'mail'\"\n  [class.m-item--variant-activity]=\"variant() === 'activity'\"\n  [class.m-item--variant-menu]=\"variant() === 'menu'\"\n  [class.m-item--variant-request]=\"variant() === 'request'\"\n  [class.m-item--variant-shortcut]=\"variant() === 'shortcut'\"\n  [class.m-item--status-unread]=\"status() === 'unread'\"\n  [class.m-item--status-todo]=\"status() === 'todo'\"\n  [class.m-item--status-processing]=\"status() === 'processing'\"\n  [class.m-item--status-warning]=\"status() === 'warning'\"\n  [style.--m-item-avatar-size]=\"avatarSize() === null ? null : avatarSize() + 'px'\"\n>\n  <div class=\"m-item__start\">\n    <div class=\"m-item__prefix\">\n      @if (prefixSlot) {\n        <ng-container [ngTemplateOutlet]=\"prefixSlot.template\" />\n      } @else {\n        <ng-content select=\"[m-item-prefix]\" />\n        <ng-content select=\"[mItemPrefix]\" />\n      }\n    </div>\n\n    <div class=\"m-item__media\">\n      @if (avatarSlot) {\n        <ng-container [ngTemplateOutlet]=\"avatarSlot.template\" />\n      } @else if (avatarSrc() || avatarText()) {\n        <s-avatar\n          class=\"m-item__default-avatar\"\n          [shape]=\"avatarShape()\"\n          [size]=\"avatarSize() ?? 48\"\n          [src]=\"avatarSrc()\"\n          [alt]=\"avatarAlt() || title()\"\n          [text]=\"avatarText() || title()\"\n          [indicator]=\"avatarIndicator()\"\n          [indicatorType]=\"avatarIndicatorType()\"\n        />\n      } @else {\n        <ng-content select=\"[m-item-start]\" />\n        <ng-content select=\"[mItemStart]\" />\n        <ng-content select=\"[m-item-avatar]\" />\n        <ng-content select=\"[mItemAvatar]\" />\n      }\n    </div>\n  </div>\n\n  <div class=\"m-item__body\">\n    <div class=\"m-item__row m-item__row--primary\">\n      <div class=\"m-item__title-wrap\">\n        <div class=\"m-item__title\">\n          @if (titleSlot) {\n            <ng-container [ngTemplateOutlet]=\"titleSlot.template\" />\n          } @else if (title()) {\n            {{ title() }}\n          } @else {\n            <ng-content select=\"[m-item-title]\" />\n            <ng-content select=\"[mItemTitle]\" />\n            <ng-content select=\"[m-item-title-text]\" />\n            <ng-content select=\"[mItemTitleText]\" />\n          }\n        </div>\n\n        @if (subtitle()) {\n          <div class=\"m-item__subtitle\">{{ subtitle() }}</div>\n        }\n      </div>\n\n      <div class=\"m-item__meta\">\n        @if (trailingSlot) {\n          <ng-container [ngTemplateOutlet]=\"trailingSlot.template\" />\n        } @else if (time()) {\n          {{ time() }}\n        } @else {\n          <ng-content select=\"[m-item-meta]\" />\n          <ng-content select=\"[mItemMeta]\" />\n          <ng-content select=\"[m-item-time]\" />\n          <ng-content select=\"[mItemTime]\" />\n        }\n      </div>\n    </div>\n\n    <div class=\"m-item__row m-item__row--secondary\">\n      <div class=\"m-item__description\">\n        @if (summarySlot) {\n          <ng-container [ngTemplateOutlet]=\"summarySlot.template\" />\n        } @else if (content()) {\n          {{ content() }}\n        } @else {\n          <ng-content select=\"[m-item-description]\" />\n          <ng-content select=\"[mItemDescription]\" />\n          <ng-content select=\"[m-item-content]\" />\n          <ng-content select=\"[mItemContent]\" />\n          <ng-content select=\"[m-item-content-text]\" />\n          <ng-content select=\"[mItemContentText]\" />\n        }\n      </div>\n\n      <div class=\"m-item__actions\">\n        @if (statusSlot) {\n          <ng-container [ngTemplateOutlet]=\"statusSlot.template\" />\n        } @else if (status() === 'todo' || status() === 'processing' || status() === 'warning') {\n          <span class=\"m-item__status-badge\">{{ statusLabel() || status() }}</span>\n        } @else if (status() === 'unread' || status() === 'read') {\n          <span class=\"m-item__status-dot\" [attr.aria-label]=\"statusLabel() || status()\"></span>\n        }\n\n        @if (actionsSlot) {\n          <ng-container [ngTemplateOutlet]=\"actionsSlot.template\" />\n        } @else if (extra()) {\n          {{ extra() }}\n        } @else {\n          <ng-content select=\"[m-item-actions]\" />\n          <ng-content select=\"[mItemActions]\" />\n          <ng-content select=\"[m-item-end]\" />\n          <ng-content select=\"[mItemEnd]\" />\n          <ng-content select=\"[m-item-extra]\" />\n          <ng-content select=\"[mItemExtra]\" />\n          <ng-content select=\"[m-item-extra-text]\" />\n          <ng-content select=\"[mItemExtraText]\" />\n          <ng-content select=\"[m-item-append]\" />\n          <ng-content select=\"[mItemAppend]\" />\n        }\n      </div>\n    </div>\n\n    @if (showFooter()) {\n      <div class=\"m-item__footer\">\n        @if (footerSlot) {\n          <ng-container [ngTemplateOutlet]=\"footerSlot.template\" />\n        } @else if (metaSlot) {\n          <ng-container [ngTemplateOutlet]=\"metaSlot.template\" />\n        } @else {\n          <ng-content select=\"[m-item-footer]\" />\n          <ng-content select=\"[mItemFooter]\" />\n        }\n      </div>\n    }\n  </div>\n</article>\n", styles: [":host{display:block}:host(:focus-visible){outline:none}:host(:focus-visible) .m-item--clickable{background:var(--m-item-focus-bg, var(--color-surface-soft));box-shadow:var(--m-item-focus-shadow, inset 0 0 0 2px var(--color-primary))}:host(:last-child) .m-item--bordered:after{display:none}.m-item{--m-item-pad-x: var(--m-list-item-pad-x, 16px);--m-item-pad-y: var(--m-list-item-pad-y, 12px);--m-item-gap: var(--m-list-item-gap, 12px);--m-item-prefix-size: var(--m-list-item-prefix-size, 18px);--m-item-avatar-size: var(--m-list-item-avatar-size, 48px);--m-item-min-height: var(--m-list-item-min-height, 72px);--m-item-tone: linear-gradient(135deg, #0f8df2, #16b8a2);position:relative;display:flex;align-items:flex-start;gap:var(--m-item-gap);width:100%;min-width:0;max-width:100%;min-height:var(--m-item-min-height);box-sizing:border-box;padding:var(--m-item-pad-y) var(--m-item-pad-x);background:var(--color-surface)}.m-item--clickable{cursor:pointer}.m-item--clickable:hover{background:var(--color-surface-soft)}.m-item--clickable:active{background:var(--color-fg-press)}.m-item--active{background:var(--m-item-active-bg, var(--color-surface-soft));box-shadow:var(--m-item-active-shadow, none)}:host(:focus-visible) .m-item--clickable.m-item--active{background:var(--m-item-active-focus-bg, var(--m-item-active-bg, var(--color-surface-soft)));box-shadow:var(--m-item-active-focus-shadow, var(--m-item-active-shadow, inset 0 0 0 2px var(--color-primary)))}.m-item--selected{box-shadow:inset 0 0 0 1px #2563eb2e}.m-item--disabled{cursor:not-allowed;opacity:.48}.m-item--variant-mail{--m-item-tone: linear-gradient(135deg, #7c3aed, #a855f7)}.m-item--variant-activity{--m-item-tone: linear-gradient(135deg, #f97316, #f59e0b)}.m-item--bordered:after{content:\"\";position:absolute;right:0;bottom:0;left:var(--m-item-pad-x);height:1px;background:#0000000a}.m-item--bordered:has(.m-item__media:not(:empty)):after{left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap))}.m-item--compact{--m-item-pad-x: 12px;--m-item-pad-y: 10px;--m-item-gap: 10px;--m-item-prefix-size: 18px;--m-item-avatar-size: 38px;--m-item-min-height: 68px}.m-item--variant-menu{--m-item-pad-x: var(--m-list-item-pad-x, 20px);--m-item-pad-y: 0;--m-item-gap: 14px;--m-item-avatar-size: 28px;--m-item-min-height: var(--m-list-item-min-height, 58px);align-items:center}.m-item--variant-menu.m-item--bordered:after{right:var(--m-item-pad-x);left:var(--m-item-pad-x);background:#eef1f5}.m-item--variant-menu .m-item__start,.m-item--variant-menu .m-item__prefix,.m-item--variant-menu .m-item__media{min-height:var(--m-item-min-height);align-items:center}.m-item--variant-menu .m-item__body{align-self:stretch;gap:0}.m-item--variant-menu .m-item__row--primary{min-height:var(--m-item-min-height);align-items:center;column-gap:14px}.m-item--variant-menu .m-item__row--secondary,.m-item--variant-menu .m-item__footer{display:none}.m-item--variant-menu .m-item__title{color:#151515;font-size:16px;font-weight:680;line-height:24px}.m-item--variant-menu .m-item__meta{max-width:44px;display:inline-flex;align-items:center;justify-content:flex-end;color:#98a1af;font-size:16px;line-height:24px}.m-item--variant-request{--m-item-pad-x: 16px;--m-item-pad-y: 20px;--m-item-gap: 12px;--m-item-avatar-size: 48px;--m-item-min-height: 120px}.m-item--variant-request.m-item--bordered:after,.m-item--variant-request.m-item--bordered:has(.m-item__media:not(:empty)):after{right:16px;left:88px;background:#f0f1f3;transform:none}.m-item--variant-request .m-item__body{gap:6px;padding-top:0}.m-item--variant-request .m-item__row{column-gap:12px}.m-item--variant-request .m-item__row--secondary{align-items:flex-start}.m-item--variant-request .m-item__title{color:#111;font-size:17px;font-weight:600;line-height:24px}.m-item--variant-request .m-item__meta{max-width:64px;padding-top:0;color:#8a94a6;font-size:14px;line-height:20px}.m-item--variant-request .m-item__description{color:#8a94a6;font-size:15px;line-height:22px}.m-item--variant-request .m-item__actions{max-width:180px;gap:10px;overflow:visible}.m-item--variant-shortcut{--m-item-pad-x: 16px;--m-item-pad-y: 8px;--m-item-gap: 16px;--m-item-avatar-size: 40px;--m-item-min-height: 56px;align-items:center}.m-item--variant-shortcut.m-item--bordered:after{right:var(--m-item-pad-x);left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap));background:#0000000f}.m-item--variant-shortcut .m-item__start,.m-item--variant-shortcut .m-item__prefix,.m-item--variant-shortcut .m-item__media{min-height:var(--m-item-avatar-size);align-items:center}.m-item--variant-shortcut .m-item__body{align-self:center;gap:0}.m-item--variant-shortcut .m-item__row--primary{min-height:var(--m-item-avatar-size);align-items:center;column-gap:12px}.m-item--variant-shortcut .m-item__row--secondary,.m-item--variant-shortcut .m-item__footer{display:none}.m-item--variant-shortcut .m-item__title{color:#111827;font-size:16px;font-weight:700;line-height:24px}.m-item--layout-one-line .m-item__row--secondary,.m-item--layout-one-line .m-item__footer,.m-item--layout-three-line .m-item__footer:empty{display:none}.m-item__start{flex:0 0 auto;display:flex;align-items:flex-start;gap:var(--m-item-gap);min-height:var(--m-item-avatar-size)}.m-item__start:has(.m-item__prefix:empty):has(.m-item__media:empty){display:none}.m-item__prefix{flex:0 0 var(--m-item-prefix-size);width:var(--m-item-prefix-size);min-height:var(--m-item-avatar-size);display:flex;align-items:flex-start;justify-content:center}.m-item__prefix:empty{display:none}.m-item__media{flex:0 0 var(--m-item-avatar-size);width:var(--m-item-avatar-size);min-height:var(--m-item-avatar-size);display:flex;align-items:flex-start;justify-content:center}.m-item__media:empty{display:none}.m-item__default-avatar{width:100%}.m-item__body{flex:1 1 auto;min-width:0;display:grid;gap:3px}.m-item__row{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:flex-start;column-gap:12px}.m-item__row--secondary{min-height:20px;align-items:center}.m-item__row--secondary:has(.m-item__description:empty):has(.m-item__actions:empty){display:none}.m-item__title-wrap{min-width:0}.m-item__title{display:block;min-width:0;overflow:hidden;color:var(--color-text-primary);font-size:16px;font-weight:600;line-height:22px;text-overflow:ellipsis;white-space:nowrap}.m-item__subtitle{margin-top:2px;color:#6b7280;font-size:12px;line-height:18px}.m-item__meta{max-width:78px;min-width:0;padding-top:0;overflow:hidden;color:#6b7280;font-size:13px;line-height:18px;text-align:right;text-overflow:ellipsis;white-space:nowrap}.m-item__meta:empty{display:none}.m-item__description{min-width:0;max-width:100%;overflow:hidden;color:#6b7280;font-size:14px;line-height:20px;text-overflow:ellipsis;white-space:nowrap}.m-item__description:empty{display:none}:host ::ng-deep .m-item__description>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.m-item__actions{max-width:112px;min-width:0;display:inline-flex;align-items:center;justify-content:flex-end;gap:8px;overflow:hidden;color:#00000073;font-size:12px;line-height:18px;white-space:nowrap}.m-item__actions:empty{display:none}.m-item__status-badge{min-width:18px;max-width:52px;height:18px;padding:0 5px;overflow:hidden;box-sizing:border-box;border-radius:9px;background:#3b82f61f;color:#2563eb;font-size:11px;font-weight:600;line-height:18px;text-overflow:ellipsis;white-space:nowrap}.m-item__status-dot{width:6px;height:6px;border-radius:999px;background:#cbd5e1}.m-item--status-unread .m-item__status-dot{background:#f43f5e}.m-item--status-processing .m-item__status-badge{background:#10b9811f;color:#047857}.m-item--status-warning .m-item__status-badge{background:#f59e0b24;color:#b45309}.m-item__footer{min-width:0;overflow:hidden;color:#00000073;font-size:12px;line-height:18px;text-overflow:ellipsis;white-space:nowrap}.m-item__footer:empty{display:none}:host ::ng-deep .m-item__default-avatar .avatar{--avatar-size: var(--m-item-avatar-size) !important}:host ::ng-deep .m-item__default-avatar .avatar__content{background:var(--m-item-tone)}:host ::ng-deep :where([m-item-start],[mItemStart],[m-item-avatar],[mItemAvatar]){display:inline-flex;width:var(--m-item-avatar-size);height:var(--m-item-avatar-size);flex:0 0 var(--m-item-avatar-size);align-items:center;justify-content:center;overflow:visible}\n"] }]
+        }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], layout: [{ type: i0.Input, args: [{ isSignal: true, alias: "layout", required: false }] }], status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }], statusLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "statusLabel", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], time: [{ type: i0.Input, args: [{ isSignal: true, alias: "time", required: false }] }], content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }], extra: [{ type: i0.Input, args: [{ isSignal: true, alias: "extra", required: false }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }], avatarSrc: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarSrc", required: false }] }], avatarText: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarText", required: false }] }], avatarAlt: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarAlt", required: false }] }], avatarSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarSize", required: false }] }], avatarShape: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarShape", required: false }] }], avatarIndicator: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarIndicator", required: false }] }], avatarIndicatorType: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarIndicatorType", required: false }] }], clickable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clickable", required: false }] }], bordered: [{ type: i0.Input, args: [{ isSignal: true, alias: "bordered", required: false }] }], compact: [{ type: i0.Input, args: [{ isSignal: true, alias: "compact", required: false }] }], showFooter: [{ type: i0.Input, args: [{ isSignal: true, alias: "showFooter", required: false }] }], selectable: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectable", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }], itemContextMenu: [{ type: i0.Output, args: ["itemContextMenu"] }], prefixSlot: [{
                 type: ContentChild,
                 args: [MItemPrefixSlot]
             }], avatarSlot: [{
@@ -5312,9 +6178,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
             }] } });
 
 let nextMListId = 0;
+const DEFAULT_SKELETON_ROWS = [0, 1, 2, 3];
+const FEED_SKELETON_ROWS = [0, 1, 2, 3, 4];
+const MENU_SKELETON_ROWS = [0, 1, 2, 3, 4];
+const REQUEST_SKELETON_ROWS = [0, 1, 2];
 class MList {
     defaultSectionTitleId = `m-list-section-title-${nextMListId++}`;
     variant = input('plain', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    skeletonType = input('auto', ...(ngDevMode ? [{ debugName: "skeletonType" }] : /* istanbul ignore next */ []));
     density = input('default', ...(ngDevMode ? [{ debugName: "density" }] : /* istanbul ignore next */ []));
     divider = input('inset', ...(ngDevMode ? [{ debugName: "divider" }] : /* istanbul ignore next */ []));
     card = input(true, ...(ngDevMode ? [{ debugName: "card" }] : /* istanbul ignore next */ []));
@@ -5338,15 +6209,34 @@ class MList {
     isRequest = computed(() => this.variant() === 'request', ...(ngDevMode ? [{ debugName: "isRequest" }] : /* istanbul ignore next */ []));
     isProfile = computed(() => this.variant() === 'profile', ...(ngDevMode ? [{ debugName: "isProfile" }] : /* istanbul ignore next */ []));
     isShortcut = computed(() => this.variant() === 'shortcut', ...(ngDevMode ? [{ debugName: "isShortcut" }] : /* istanbul ignore next */ []));
+    resolvedSkeletonType = computed(() => {
+        const skeletonType = this.skeletonType();
+        return skeletonType === 'auto' ? this.variant() : skeletonType;
+    }, ...(ngDevMode ? [{ debugName: "resolvedSkeletonType" }] : /* istanbul ignore next */ []));
+    skeletonClass = computed(() => `m-list__skeleton m-list__skeleton--${this.resolvedSkeletonType()}`, ...(ngDevMode ? [{ debugName: "skeletonClass" }] : /* istanbul ignore next */ []));
+    skeletonRows = computed(() => {
+        switch (this.resolvedSkeletonType()) {
+            case 'feed':
+                return FEED_SKELETON_ROWS;
+            case 'menu':
+            case 'profile':
+            case 'shortcut':
+                return MENU_SKELETON_ROWS;
+            case 'request':
+                return REQUEST_SKELETON_ROWS;
+            default:
+                return DEFAULT_SKELETON_ROWS;
+        }
+    }, ...(ngDevMode ? [{ debugName: "skeletonRows" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: MList, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: MList, isStandalone: true, selector: "m-list", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, density: { classPropertyName: "density", publicName: "density", isSignal: true, isRequired: false, transformFunction: null }, divider: { classPropertyName: "divider", publicName: "divider", isSignal: true, isRequired: false, transformFunction: null }, card: { classPropertyName: "card", publicName: "card", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, isolated: { classPropertyName: "isolated", publicName: "isolated", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, empty: { classPropertyName: "empty", publicName: "empty", isSignal: true, isRequired: false, transformFunction: null }, emptyText: { classPropertyName: "emptyText", publicName: "emptyText", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, sectionTitle: { classPropertyName: "sectionTitle", publicName: "sectionTitle", isSignal: true, isRequired: false, transformFunction: null }, sectionTitleId: { classPropertyName: "sectionTitleId", publicName: "sectionTitleId", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.m-list-host--profile": "isProfile()" } }, ngImport: i0, template: "@if (sectionTitle()) {\r\n  <h2 class=\"m-list__section-title\" [id]=\"resolvedSectionTitleId()\">\r\n    {{ sectionTitle() }}\r\n  </h2>\r\n}\r\n\r\n<section\r\n  class=\"m-list\"\r\n  role=\"list\"\r\n  [attr.aria-label]=\"resolvedAriaLabel()\"\r\n  [attr.aria-labelledby]=\"sectionTitle() ? resolvedSectionTitleId() : null\"\r\n  [class.m-list--card]=\"isCard()\"\r\n  [class.m-list--compact]=\"isCompact()\"\r\n  [class.m-list--comfortable]=\"isComfortable()\"\r\n  [class.m-list--isolated]=\"isIsolated()\"\r\n  [class.m-list--feed]=\"isFeed()\"\n  [class.m-list--menu]=\"isMenu()\"\r\n  [class.m-list--request]=\"isRequest()\"\r\n  [class.m-list--profile]=\"isProfile()\"\n  [class.m-list--shortcut]=\"isShortcut()\"\r\n  [class.m-list--divider-none]=\"divider() === 'none'\"\r\n  [class.m-list--divider-full]=\"divider() === 'full'\"\r\n  [class.m-list--selectable]=\"selectable()\"\r\n  [class.m-list--loading]=\"loading()\"\r\n>\r\n  @if (loading()) {\r\n    <div class=\"m-list__skeleton\" aria-hidden=\"true\">\r\n      <span></span>\r\n      <span></span>\r\n      <span></span>\r\n    </div>\r\n  } @else if (empty()) {\r\n    <div class=\"m-list__empty\">{{ emptyText() }}</div>\r\n  } @else {\r\n    <ng-content />\r\n  }\r\n</section>\r\n", styles: [":host{display:block}.m-list__section-title{margin:0 0 10px;color:#8c94a3;font-size:13px;font-weight:700;line-height:18px}:host(.m-list-host--profile) .m-list__section-title{margin:0 16px 8px;font-weight:650}.m-list{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 12px;--m-list-item-gap: 12px;--m-list-item-prefix-size: 18px;--m-list-item-avatar-size: 48px;--m-list-item-min-height: 72px;width:auto;max-width:100%;box-sizing:border-box;margin:0;padding:0;list-style:none;border:1px solid rgba(0,0,0,.04);border-radius:14px;overflow:hidden;background:var(--color-surface)}.m-list--card{margin:8px;border-color:transparent;box-shadow:0 1px 2px #0000000a,0 8px 24px #00000008}.m-list--compact{--m-list-item-pad-x: 12px;--m-list-item-pad-y: 10px;--m-list-item-gap: 10px;--m-list-item-prefix-size: 18px;--m-list-item-avatar-size: 38px;--m-list-item-min-height: 68px;border-radius:10px}.m-list--comfortable{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 16px;--m-list-item-gap: 14px;--m-list-item-avatar-size: 48px;--m-list-item-min-height: 88px}.m-list--isolated{display:grid;gap:12px;margin:0;border:0;overflow:visible;background:transparent;box-shadow:none}:host ::ng-deep .m-list--isolated .m-item{border-radius:14px;background:#ffffffe0;box-shadow:0 8px 24px #0f172a0d}:host ::ng-deep .m-list--isolated .m-item--bordered:after{display:none}.m-list--menu{--m-list-item-pad-x: 20px;--m-list-item-pad-y: 0;--m-list-item-gap: 14px;--m-list-item-avatar-size: 28px;--m-list-item-min-height: 58px;margin:0;border:1px solid #eef1f5;border-radius:8px;overflow:hidden;background:#fff;box-shadow:0 12px 34px #0f172a0b}.m-list--menu.m-list--compact{--m-list-item-pad-x: 20px;--m-list-item-min-height: 50px;border-radius:8px}.m-list--menu.m-list--comfortable{--m-list-item-pad-x: 20px;--m-list-item-min-height: 58px;border-radius:8px}:host ::ng-deep .m-list--menu .m-item{align-items:center;padding-block:0}:host ::ng-deep .m-list--menu .m-item--bordered:after{right:var(--m-item-pad-x);left:var(--m-item-pad-x);background:#eef1f5}:host ::ng-deep .m-list--menu.m-list--divider-full .m-item--bordered:after{right:0;left:0}:host ::ng-deep .m-list--menu .m-item--bordered:has(.m-item__media:not(:empty)):after{left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap))}:host ::ng-deep .m-list--menu.m-list--divider-full .m-item--bordered:has(.m-item__media:not(:empty)):after{left:0}:host ::ng-deep .m-list--menu .m-item__start,:host ::ng-deep .m-list--menu .m-item__prefix,:host ::ng-deep .m-list--menu .m-item__media{min-height:var(--m-item-min-height);align-items:center}:host ::ng-deep .m-list--menu .m-item__body{align-self:stretch;gap:0}:host ::ng-deep .m-list--menu .m-item__row--primary{min-height:var(--m-item-min-height);align-items:center;column-gap:14px}:host ::ng-deep .m-list--menu .m-item__row--secondary,:host ::ng-deep .m-list--menu .m-item__footer{display:none}:host ::ng-deep .m-list--menu .m-item__title{color:#151515;font-size:16px;font-weight:680;letter-spacing:0;line-height:24px}:host ::ng-deep .m-list--menu .m-item__meta{max-width:44px;padding-top:0;display:inline-flex;align-items:center;justify-content:flex-end;color:#98a1af;font-size:16px;line-height:24px}.m-list--profile{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 8px;--m-list-item-gap: 12px;--m-list-item-avatar-size: 40px;--m-list-item-min-height: 56px;margin:0;border:0;border-radius:0;overflow:hidden;background:#fff;box-shadow:none}:host ::ng-deep .m-list--profile .m-item{align-items:center;padding-block:var(--m-item-pad-y)}:host ::ng-deep .m-list--profile .m-item--bordered:after{right:var(--m-item-pad-x);left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap));background:#0000000f}:host ::ng-deep .m-list--profile.m-list--divider-full .m-item--bordered:after{right:0;left:0}:host ::ng-deep .m-list--profile .m-item__start,:host ::ng-deep .m-list--profile .m-item__prefix,:host ::ng-deep .m-list--profile .m-item__media{min-height:var(--m-item-avatar-size);align-items:center}:host ::ng-deep .m-list--profile .m-item__body{align-self:center;gap:0}:host ::ng-deep .m-list--profile .m-item__row--primary{min-height:var(--m-item-avatar-size);align-items:center;column-gap:12px}:host ::ng-deep .m-list--profile .m-item__row--secondary,:host ::ng-deep .m-list--profile .m-item__footer{display:none}:host ::ng-deep .m-list--profile .m-item__title{color:#111827;font-size:17px;font-weight:500;line-height:24px}.m-list--shortcut{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 8px;--m-list-item-gap: 16px;--m-list-item-avatar-size: 40px;--m-list-item-min-height: 56px;margin:0;border:0;border-radius:0;overflow:hidden;background:#fff;box-shadow:none}:host ::ng-deep .m-list--shortcut .m-item{align-items:center;padding-block:var(--m-item-pad-y)}:host ::ng-deep .m-list--shortcut .m-item--bordered:after{right:var(--m-item-pad-x);left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap));background:#0000000f}:host ::ng-deep .m-list--shortcut.m-list--divider-full .m-item--bordered:after{right:0;left:0}:host ::ng-deep .m-list--shortcut .m-item__start,:host ::ng-deep .m-list--shortcut .m-item__prefix,:host ::ng-deep .m-list--shortcut .m-item__media{min-height:var(--m-item-avatar-size);align-items:center}:host ::ng-deep .m-list--shortcut .m-item__body{align-self:center;gap:0}:host ::ng-deep .m-list--shortcut .m-item__row--primary{min-height:var(--m-item-avatar-size);align-items:center;column-gap:12px}:host ::ng-deep .m-list--shortcut .m-item__row--secondary,:host ::ng-deep .m-list--shortcut .m-item__footer{display:none}:host ::ng-deep .m-list--shortcut .m-item__title{color:#111827;font-size:16px;font-weight:700;line-height:24px}.m-list--request{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 20px;--m-list-item-gap: 12px;--m-list-item-avatar-size: 48px;--m-list-item-min-height: 120px;margin:0;border:0;border-radius:0;overflow:hidden;background:#fff;box-shadow:none}.m-list--request.m-list--compact{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 14px;--m-list-item-avatar-size: 46px;--m-list-item-min-height: 96px}.m-list--request.m-list--comfortable{--m-list-item-pad-x: 20px;--m-list-item-pad-y: 20px;--m-list-item-avatar-size: 56px;--m-list-item-min-height: 124px}:host ::ng-deep .m-list--request .m-item--bordered:after,:host ::ng-deep .m-list--request .m-item--bordered:has(.m-item__media:not(:empty)):after{right:16px;left:88px;background:#f0f1f3;transform:none}:host ::ng-deep .m-list--request.m-list--divider-full .m-item--bordered:after,:host ::ng-deep .m-list--request.m-list--divider-full .m-item--bordered:has(.m-item__media:not(:empty)):after{right:0;left:0}:host ::ng-deep .m-list--request .m-item__body{gap:6px;padding-top:0}:host ::ng-deep .m-list--request .m-item__row{column-gap:12px}:host ::ng-deep .m-list--request .m-item__row--secondary{align-items:flex-start}:host ::ng-deep .m-list--request .m-item__title{color:#111;font-size:17px;font-weight:600;line-height:24px}:host ::ng-deep .m-list--request .m-item__meta{max-width:64px;padding-top:0;color:#8a94a6;font-size:14px;line-height:20px}:host ::ng-deep .m-list--request .m-item__description{color:#8a94a6;font-size:15px;line-height:22px}:host ::ng-deep .m-list--request .m-item__actions{max-width:180px;gap:10px;overflow:visible}.m-list--divider-none{border-color:transparent}:host ::ng-deep .m-list--divider-none .m-item--bordered:after{display:none}:host ::ng-deep .m-list--divider-full .m-item--bordered:after{left:0}.m-list__empty{padding:24px 16px;color:var(--color-text-muted);font-size:14px;text-align:center}.m-list__skeleton{display:grid;gap:10px;padding:10px}.m-list__skeleton span{height:var(--m-list-item-min-height);border-radius:12px;background:linear-gradient(90deg,#f3f6fa,#edf1f6,#f3f6fa)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: MList, isStandalone: true, selector: "m-list", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, skeletonType: { classPropertyName: "skeletonType", publicName: "skeletonType", isSignal: true, isRequired: false, transformFunction: null }, density: { classPropertyName: "density", publicName: "density", isSignal: true, isRequired: false, transformFunction: null }, divider: { classPropertyName: "divider", publicName: "divider", isSignal: true, isRequired: false, transformFunction: null }, card: { classPropertyName: "card", publicName: "card", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, isolated: { classPropertyName: "isolated", publicName: "isolated", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, empty: { classPropertyName: "empty", publicName: "empty", isSignal: true, isRequired: false, transformFunction: null }, emptyText: { classPropertyName: "emptyText", publicName: "emptyText", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, sectionTitle: { classPropertyName: "sectionTitle", publicName: "sectionTitle", isSignal: true, isRequired: false, transformFunction: null }, sectionTitleId: { classPropertyName: "sectionTitleId", publicName: "sectionTitleId", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.m-list-host--profile": "isProfile()" } }, ngImport: i0, template: "@if (sectionTitle()) {\n  <h2 class=\"m-list__section-title\" [id]=\"resolvedSectionTitleId()\">\n    {{ sectionTitle() }}\n  </h2>\n}\n\n<section\n  class=\"m-list\"\n  role=\"list\"\n  [attr.aria-label]=\"resolvedAriaLabel()\"\n  [attr.aria-labelledby]=\"sectionTitle() ? resolvedSectionTitleId() : null\"\n  [class.m-list--card]=\"isCard()\"\n  [class.m-list--compact]=\"isCompact()\"\n  [class.m-list--comfortable]=\"isComfortable()\"\n  [class.m-list--isolated]=\"isIsolated()\"\n  [class.m-list--feed]=\"isFeed()\"\n  [class.m-list--menu]=\"isMenu()\"\n  [class.m-list--request]=\"isRequest()\"\n  [class.m-list--profile]=\"isProfile()\"\n  [class.m-list--shortcut]=\"isShortcut()\"\n  [class.m-list--divider-none]=\"divider() === 'none'\"\n  [class.m-list--divider-full]=\"divider() === 'full'\"\n  [class.m-list--selectable]=\"selectable()\"\n  [class.m-list--loading]=\"loading()\"\n>\n  @if (loading()) {\n    <div [class]=\"skeletonClass()\" aria-hidden=\"true\">\n      @for (row of skeletonRows(); track row) {\n        <div class=\"m-list__skeleton-row\">\n          <span class=\"m-list__skeleton-avatar\"></span>\n          <span class=\"m-list__skeleton-content\">\n            <span class=\"m-list__skeleton-title\"></span>\n            <span class=\"m-list__skeleton-subtitle\"></span>\n          </span>\n          <span class=\"m-list__skeleton-meta\"></span>\n        </div>\n      }\n    </div>\n  } @else if (empty()) {\n    <div class=\"m-list__empty\">{{ emptyText() }}</div>\n  } @else {\n    <ng-content />\n  }\n</section>\n", styles: [":host{display:block}.m-list__section-title{margin:0 0 10px;color:#8c94a3;font-size:13px;font-weight:700;line-height:18px}:host(.m-list-host--profile) .m-list__section-title{margin:0 16px 8px;font-weight:650}.m-list{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 12px;--m-list-item-gap: 12px;--m-list-item-prefix-size: 18px;--m-list-item-avatar-size: 48px;--m-list-item-min-height: 72px;width:auto;max-width:100%;box-sizing:border-box;margin:0;padding:0;list-style:none;border:1px solid rgba(0,0,0,.04);border-radius:14px;overflow:hidden;background:var(--color-surface)}.m-list--card{margin:8px;border-color:transparent;box-shadow:0 1px 2px #0000000a,0 8px 24px #00000008}.m-list--compact{--m-list-item-pad-x: 12px;--m-list-item-pad-y: 10px;--m-list-item-gap: 10px;--m-list-item-prefix-size: 18px;--m-list-item-avatar-size: 38px;--m-list-item-min-height: 68px;border-radius:10px}.m-list--comfortable{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 16px;--m-list-item-gap: 14px;--m-list-item-avatar-size: 48px;--m-list-item-min-height: 88px}.m-list--isolated{display:grid;gap:12px;margin:0;border:0;overflow:visible;background:transparent;box-shadow:none}:host ::ng-deep .m-list--isolated .m-item{border-radius:14px;background:#ffffffe0;box-shadow:0 8px 24px #0f172a0d}:host ::ng-deep .m-list--isolated .m-item--bordered:after{display:none}.m-list--menu{--m-list-item-pad-x: 20px;--m-list-item-pad-y: 0;--m-list-item-gap: 14px;--m-list-item-avatar-size: 28px;--m-list-item-min-height: 58px;margin:0;border:1px solid #eef1f5;border-radius:8px;overflow:hidden;background:#fff;box-shadow:0 12px 34px #0f172a0b}.m-list--menu.m-list--compact{--m-list-item-pad-x: 20px;--m-list-item-min-height: 50px;border-radius:8px}.m-list--menu.m-list--comfortable{--m-list-item-pad-x: 20px;--m-list-item-min-height: 58px;border-radius:8px}:host ::ng-deep .m-list--menu .m-item{align-items:center;padding-block:0}:host ::ng-deep .m-list--menu .m-item--bordered:after{right:var(--m-item-pad-x);left:var(--m-item-pad-x);background:#eef1f5}:host ::ng-deep .m-list--menu.m-list--divider-full .m-item--bordered:after{right:0;left:0}:host ::ng-deep .m-list--menu .m-item--bordered:has(.m-item__media:not(:empty)):after{left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap))}:host ::ng-deep .m-list--menu.m-list--divider-full .m-item--bordered:has(.m-item__media:not(:empty)):after{left:0}:host ::ng-deep .m-list--menu .m-item__start,:host ::ng-deep .m-list--menu .m-item__prefix,:host ::ng-deep .m-list--menu .m-item__media{min-height:var(--m-item-min-height);align-items:center}:host ::ng-deep .m-list--menu .m-item__body{align-self:stretch;gap:0}:host ::ng-deep .m-list--menu .m-item__row--primary{min-height:var(--m-item-min-height);align-items:center;column-gap:14px}:host ::ng-deep .m-list--menu .m-item__row--secondary,:host ::ng-deep .m-list--menu .m-item__footer{display:none}:host ::ng-deep .m-list--menu .m-item__title{color:#151515;font-size:16px;font-weight:680;letter-spacing:0;line-height:24px}:host ::ng-deep .m-list--menu .m-item__meta{max-width:44px;padding-top:0;display:inline-flex;align-items:center;justify-content:flex-end;color:#98a1af;font-size:16px;line-height:24px}.m-list--profile{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 8px;--m-list-item-gap: 12px;--m-list-item-avatar-size: 40px;--m-list-item-min-height: 56px;margin:0;border:0;border-radius:0;overflow:hidden;background:#fff;box-shadow:none}:host ::ng-deep .m-list--profile .m-item{align-items:center;padding-block:var(--m-item-pad-y)}:host ::ng-deep .m-list--profile .m-item--bordered:after{right:var(--m-item-pad-x);left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap));background:#0000000f}:host ::ng-deep .m-list--profile.m-list--divider-full .m-item--bordered:after{right:0;left:0}:host ::ng-deep .m-list--profile .m-item__start,:host ::ng-deep .m-list--profile .m-item__prefix,:host ::ng-deep .m-list--profile .m-item__media{min-height:var(--m-item-avatar-size);align-items:center}:host ::ng-deep .m-list--profile .m-item__body{align-self:center;gap:0}:host ::ng-deep .m-list--profile .m-item__row--primary{min-height:var(--m-item-avatar-size);align-items:center;column-gap:12px}:host ::ng-deep .m-list--profile .m-item__row--secondary,:host ::ng-deep .m-list--profile .m-item__footer{display:none}:host ::ng-deep .m-list--profile .m-item__title{color:#111827;font-size:17px;font-weight:500;line-height:24px}.m-list--shortcut{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 8px;--m-list-item-gap: 16px;--m-list-item-avatar-size: 40px;--m-list-item-min-height: 56px;margin:0;border:0;border-radius:0;overflow:hidden;background:#fff;box-shadow:none}:host ::ng-deep .m-list--shortcut .m-item{align-items:center;padding-block:var(--m-item-pad-y)}:host ::ng-deep .m-list--shortcut .m-item--bordered:after{right:var(--m-item-pad-x);left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap));background:#0000000f}:host ::ng-deep .m-list--shortcut.m-list--divider-full .m-item--bordered:after{right:0;left:0}:host ::ng-deep .m-list--shortcut .m-item__start,:host ::ng-deep .m-list--shortcut .m-item__prefix,:host ::ng-deep .m-list--shortcut .m-item__media{min-height:var(--m-item-avatar-size);align-items:center}:host ::ng-deep .m-list--shortcut .m-item__body{align-self:center;gap:0}:host ::ng-deep .m-list--shortcut .m-item__row--primary{min-height:var(--m-item-avatar-size);align-items:center;column-gap:12px}:host ::ng-deep .m-list--shortcut .m-item__row--secondary,:host ::ng-deep .m-list--shortcut .m-item__footer{display:none}:host ::ng-deep .m-list--shortcut .m-item__title{color:#111827;font-size:16px;font-weight:700;line-height:24px}.m-list--request{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 20px;--m-list-item-gap: 12px;--m-list-item-avatar-size: 48px;--m-list-item-min-height: 120px;margin:0;border:0;border-radius:0;overflow:hidden;background:#fff;box-shadow:none}.m-list--request.m-list--compact{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 14px;--m-list-item-avatar-size: 46px;--m-list-item-min-height: 96px}.m-list--request.m-list--comfortable{--m-list-item-pad-x: 20px;--m-list-item-pad-y: 20px;--m-list-item-avatar-size: 56px;--m-list-item-min-height: 124px}:host ::ng-deep .m-list--request .m-item--bordered:after,:host ::ng-deep .m-list--request .m-item--bordered:has(.m-item__media:not(:empty)):after{right:16px;left:88px;background:#f0f1f3;transform:none}:host ::ng-deep .m-list--request.m-list--divider-full .m-item--bordered:after,:host ::ng-deep .m-list--request.m-list--divider-full .m-item--bordered:has(.m-item__media:not(:empty)):after{right:0;left:0}:host ::ng-deep .m-list--request .m-item__body{gap:6px;padding-top:0}:host ::ng-deep .m-list--request .m-item__row{column-gap:12px}:host ::ng-deep .m-list--request .m-item__row--secondary{align-items:flex-start}:host ::ng-deep .m-list--request .m-item__title{color:#111;font-size:17px;font-weight:600;line-height:24px}:host ::ng-deep .m-list--request .m-item__meta{max-width:64px;padding-top:0;color:#8a94a6;font-size:14px;line-height:20px}:host ::ng-deep .m-list--request .m-item__description{color:#8a94a6;font-size:15px;line-height:22px}:host ::ng-deep .m-list--request .m-item__actions{max-width:180px;gap:10px;overflow:visible}.m-list--divider-none{border-color:transparent}:host ::ng-deep .m-list--divider-none .m-item--bordered:after{display:none}:host ::ng-deep .m-list--divider-full .m-item--bordered:after{left:0}.m-list__empty{padding:24px 16px;color:var(--color-text-muted);font-size:14px;text-align:center}.m-list__skeleton{--sk-a: var(--m-list-skeleton-avatar-size, var(--m-list-item-avatar-size));--sk-h: var(--m-list-skeleton-row-min-height, var(--m-list-item-min-height));--sk-r: var(--m-list-skeleton-avatar-radius, 10px);--sk-tw: min(58%, 220px);--sk-sw: min(34%, 140px);--sk-sh: 12px;--sk-gap: 8px;--sk-track: 22px;--sk-mw: 10px;--sk-mh: 10px;--sk-mr: 999px;--sk-sd: block;--sk-md: block;display:grid;gap:0;padding:4px 0}.m-list__skeleton-row{display:grid;grid-template-columns:var(--sk-a) minmax(0,1fr) var(--sk-track);align-items:center;gap:var(--m-list-item-gap);min-height:var(--sk-h);padding:var(--m-list-item-pad-y) var(--m-list-item-pad-x);box-sizing:border-box}.m-list__skeleton-avatar,.m-list__skeleton-title,.m-list__skeleton-subtitle,.m-list__skeleton-meta{display:block;background:linear-gradient(90deg,#f3f6fa,#edf1f6 52%,#f3f6fa);background-size:220% 100%;animation:m-list-skeleton-shimmer 1.2s ease-in-out infinite}.m-list__skeleton-avatar{width:var(--sk-a);height:var(--sk-a);border-radius:var(--sk-r)}.m-list__skeleton-content{display:grid;gap:var(--sk-gap);min-width:0}.m-list__skeleton-title{width:var(--sk-tw);height:16px;border-radius:999px}.m-list__skeleton-subtitle{display:var(--sk-sd);width:var(--sk-sw);height:var(--sk-sh);border-radius:999px}.m-list__skeleton-meta{display:var(--sk-md);width:var(--sk-mw);height:var(--sk-mh);border-radius:var(--sk-mr);opacity:.78}.m-list__skeleton--feed{--sk-a: var(--m-list-skeleton-avatar-size, 48px);--sk-h: var(--m-list-skeleton-row-min-height, 72px);--sk-r: 14px;--sk-tw: min(56%, 210px);--sk-sw: min(78%, 300px);--sk-mw: 28px;--sk-mh: 12px}.m-list__skeleton--menu{--sk-a: var(--m-list-skeleton-avatar-size, 28px);--sk-h: var(--m-list-skeleton-row-min-height, 58px);--sk-r: 8px;--sk-gap: 0;--sk-tw: min(48%, 180px);--sk-sd: none;--sk-mw: 8px;--sk-mh: 18px;--sk-mr: 6px;padding:0}.m-list__skeleton--profile,.m-list__skeleton--shortcut{--sk-a: var(--m-list-skeleton-avatar-size, 40px);--sk-h: var(--m-list-skeleton-row-min-height, 56px);--sk-r: 12px;--sk-gap: 0;--sk-tw: min(42%, 180px);--sk-sd: none;--sk-md: none;--sk-track: 0;padding:0}.m-list__skeleton--request{--sk-a: var(--m-list-skeleton-avatar-size, 48px);--sk-h: var(--m-list-skeleton-row-min-height, 120px);--sk-r: 14px;--sk-gap: 10px;--sk-tw: min(46%, 220px);--sk-sw: min(86%, 420px);--sk-sh: 14px;--sk-mw: 64px;--sk-mh: 24px;padding:0}@keyframes m-list-skeleton-shimmer{0%{background-position:120% 0}to{background-position:-120% 0}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: MList, decorators: [{
             type: Component,
             args: [{ selector: 'm-list', imports: [], host: {
                         '[class.m-list-host--profile]': 'isProfile()',
-                    }, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (sectionTitle()) {\r\n  <h2 class=\"m-list__section-title\" [id]=\"resolvedSectionTitleId()\">\r\n    {{ sectionTitle() }}\r\n  </h2>\r\n}\r\n\r\n<section\r\n  class=\"m-list\"\r\n  role=\"list\"\r\n  [attr.aria-label]=\"resolvedAriaLabel()\"\r\n  [attr.aria-labelledby]=\"sectionTitle() ? resolvedSectionTitleId() : null\"\r\n  [class.m-list--card]=\"isCard()\"\r\n  [class.m-list--compact]=\"isCompact()\"\r\n  [class.m-list--comfortable]=\"isComfortable()\"\r\n  [class.m-list--isolated]=\"isIsolated()\"\r\n  [class.m-list--feed]=\"isFeed()\"\n  [class.m-list--menu]=\"isMenu()\"\r\n  [class.m-list--request]=\"isRequest()\"\r\n  [class.m-list--profile]=\"isProfile()\"\n  [class.m-list--shortcut]=\"isShortcut()\"\r\n  [class.m-list--divider-none]=\"divider() === 'none'\"\r\n  [class.m-list--divider-full]=\"divider() === 'full'\"\r\n  [class.m-list--selectable]=\"selectable()\"\r\n  [class.m-list--loading]=\"loading()\"\r\n>\r\n  @if (loading()) {\r\n    <div class=\"m-list__skeleton\" aria-hidden=\"true\">\r\n      <span></span>\r\n      <span></span>\r\n      <span></span>\r\n    </div>\r\n  } @else if (empty()) {\r\n    <div class=\"m-list__empty\">{{ emptyText() }}</div>\r\n  } @else {\r\n    <ng-content />\r\n  }\r\n</section>\r\n", styles: [":host{display:block}.m-list__section-title{margin:0 0 10px;color:#8c94a3;font-size:13px;font-weight:700;line-height:18px}:host(.m-list-host--profile) .m-list__section-title{margin:0 16px 8px;font-weight:650}.m-list{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 12px;--m-list-item-gap: 12px;--m-list-item-prefix-size: 18px;--m-list-item-avatar-size: 48px;--m-list-item-min-height: 72px;width:auto;max-width:100%;box-sizing:border-box;margin:0;padding:0;list-style:none;border:1px solid rgba(0,0,0,.04);border-radius:14px;overflow:hidden;background:var(--color-surface)}.m-list--card{margin:8px;border-color:transparent;box-shadow:0 1px 2px #0000000a,0 8px 24px #00000008}.m-list--compact{--m-list-item-pad-x: 12px;--m-list-item-pad-y: 10px;--m-list-item-gap: 10px;--m-list-item-prefix-size: 18px;--m-list-item-avatar-size: 38px;--m-list-item-min-height: 68px;border-radius:10px}.m-list--comfortable{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 16px;--m-list-item-gap: 14px;--m-list-item-avatar-size: 48px;--m-list-item-min-height: 88px}.m-list--isolated{display:grid;gap:12px;margin:0;border:0;overflow:visible;background:transparent;box-shadow:none}:host ::ng-deep .m-list--isolated .m-item{border-radius:14px;background:#ffffffe0;box-shadow:0 8px 24px #0f172a0d}:host ::ng-deep .m-list--isolated .m-item--bordered:after{display:none}.m-list--menu{--m-list-item-pad-x: 20px;--m-list-item-pad-y: 0;--m-list-item-gap: 14px;--m-list-item-avatar-size: 28px;--m-list-item-min-height: 58px;margin:0;border:1px solid #eef1f5;border-radius:8px;overflow:hidden;background:#fff;box-shadow:0 12px 34px #0f172a0b}.m-list--menu.m-list--compact{--m-list-item-pad-x: 20px;--m-list-item-min-height: 50px;border-radius:8px}.m-list--menu.m-list--comfortable{--m-list-item-pad-x: 20px;--m-list-item-min-height: 58px;border-radius:8px}:host ::ng-deep .m-list--menu .m-item{align-items:center;padding-block:0}:host ::ng-deep .m-list--menu .m-item--bordered:after{right:var(--m-item-pad-x);left:var(--m-item-pad-x);background:#eef1f5}:host ::ng-deep .m-list--menu.m-list--divider-full .m-item--bordered:after{right:0;left:0}:host ::ng-deep .m-list--menu .m-item--bordered:has(.m-item__media:not(:empty)):after{left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap))}:host ::ng-deep .m-list--menu.m-list--divider-full .m-item--bordered:has(.m-item__media:not(:empty)):after{left:0}:host ::ng-deep .m-list--menu .m-item__start,:host ::ng-deep .m-list--menu .m-item__prefix,:host ::ng-deep .m-list--menu .m-item__media{min-height:var(--m-item-min-height);align-items:center}:host ::ng-deep .m-list--menu .m-item__body{align-self:stretch;gap:0}:host ::ng-deep .m-list--menu .m-item__row--primary{min-height:var(--m-item-min-height);align-items:center;column-gap:14px}:host ::ng-deep .m-list--menu .m-item__row--secondary,:host ::ng-deep .m-list--menu .m-item__footer{display:none}:host ::ng-deep .m-list--menu .m-item__title{color:#151515;font-size:16px;font-weight:680;letter-spacing:0;line-height:24px}:host ::ng-deep .m-list--menu .m-item__meta{max-width:44px;padding-top:0;display:inline-flex;align-items:center;justify-content:flex-end;color:#98a1af;font-size:16px;line-height:24px}.m-list--profile{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 8px;--m-list-item-gap: 12px;--m-list-item-avatar-size: 40px;--m-list-item-min-height: 56px;margin:0;border:0;border-radius:0;overflow:hidden;background:#fff;box-shadow:none}:host ::ng-deep .m-list--profile .m-item{align-items:center;padding-block:var(--m-item-pad-y)}:host ::ng-deep .m-list--profile .m-item--bordered:after{right:var(--m-item-pad-x);left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap));background:#0000000f}:host ::ng-deep .m-list--profile.m-list--divider-full .m-item--bordered:after{right:0;left:0}:host ::ng-deep .m-list--profile .m-item__start,:host ::ng-deep .m-list--profile .m-item__prefix,:host ::ng-deep .m-list--profile .m-item__media{min-height:var(--m-item-avatar-size);align-items:center}:host ::ng-deep .m-list--profile .m-item__body{align-self:center;gap:0}:host ::ng-deep .m-list--profile .m-item__row--primary{min-height:var(--m-item-avatar-size);align-items:center;column-gap:12px}:host ::ng-deep .m-list--profile .m-item__row--secondary,:host ::ng-deep .m-list--profile .m-item__footer{display:none}:host ::ng-deep .m-list--profile .m-item__title{color:#111827;font-size:17px;font-weight:500;line-height:24px}.m-list--shortcut{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 8px;--m-list-item-gap: 16px;--m-list-item-avatar-size: 40px;--m-list-item-min-height: 56px;margin:0;border:0;border-radius:0;overflow:hidden;background:#fff;box-shadow:none}:host ::ng-deep .m-list--shortcut .m-item{align-items:center;padding-block:var(--m-item-pad-y)}:host ::ng-deep .m-list--shortcut .m-item--bordered:after{right:var(--m-item-pad-x);left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap));background:#0000000f}:host ::ng-deep .m-list--shortcut.m-list--divider-full .m-item--bordered:after{right:0;left:0}:host ::ng-deep .m-list--shortcut .m-item__start,:host ::ng-deep .m-list--shortcut .m-item__prefix,:host ::ng-deep .m-list--shortcut .m-item__media{min-height:var(--m-item-avatar-size);align-items:center}:host ::ng-deep .m-list--shortcut .m-item__body{align-self:center;gap:0}:host ::ng-deep .m-list--shortcut .m-item__row--primary{min-height:var(--m-item-avatar-size);align-items:center;column-gap:12px}:host ::ng-deep .m-list--shortcut .m-item__row--secondary,:host ::ng-deep .m-list--shortcut .m-item__footer{display:none}:host ::ng-deep .m-list--shortcut .m-item__title{color:#111827;font-size:16px;font-weight:700;line-height:24px}.m-list--request{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 20px;--m-list-item-gap: 12px;--m-list-item-avatar-size: 48px;--m-list-item-min-height: 120px;margin:0;border:0;border-radius:0;overflow:hidden;background:#fff;box-shadow:none}.m-list--request.m-list--compact{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 14px;--m-list-item-avatar-size: 46px;--m-list-item-min-height: 96px}.m-list--request.m-list--comfortable{--m-list-item-pad-x: 20px;--m-list-item-pad-y: 20px;--m-list-item-avatar-size: 56px;--m-list-item-min-height: 124px}:host ::ng-deep .m-list--request .m-item--bordered:after,:host ::ng-deep .m-list--request .m-item--bordered:has(.m-item__media:not(:empty)):after{right:16px;left:88px;background:#f0f1f3;transform:none}:host ::ng-deep .m-list--request.m-list--divider-full .m-item--bordered:after,:host ::ng-deep .m-list--request.m-list--divider-full .m-item--bordered:has(.m-item__media:not(:empty)):after{right:0;left:0}:host ::ng-deep .m-list--request .m-item__body{gap:6px;padding-top:0}:host ::ng-deep .m-list--request .m-item__row{column-gap:12px}:host ::ng-deep .m-list--request .m-item__row--secondary{align-items:flex-start}:host ::ng-deep .m-list--request .m-item__title{color:#111;font-size:17px;font-weight:600;line-height:24px}:host ::ng-deep .m-list--request .m-item__meta{max-width:64px;padding-top:0;color:#8a94a6;font-size:14px;line-height:20px}:host ::ng-deep .m-list--request .m-item__description{color:#8a94a6;font-size:15px;line-height:22px}:host ::ng-deep .m-list--request .m-item__actions{max-width:180px;gap:10px;overflow:visible}.m-list--divider-none{border-color:transparent}:host ::ng-deep .m-list--divider-none .m-item--bordered:after{display:none}:host ::ng-deep .m-list--divider-full .m-item--bordered:after{left:0}.m-list__empty{padding:24px 16px;color:var(--color-text-muted);font-size:14px;text-align:center}.m-list__skeleton{display:grid;gap:10px;padding:10px}.m-list__skeleton span{height:var(--m-list-item-min-height);border-radius:12px;background:linear-gradient(90deg,#f3f6fa,#edf1f6,#f3f6fa)}\n"] }]
-        }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], density: [{ type: i0.Input, args: [{ isSignal: true, alias: "density", required: false }] }], divider: [{ type: i0.Input, args: [{ isSignal: true, alias: "divider", required: false }] }], card: [{ type: i0.Input, args: [{ isSignal: true, alias: "card", required: false }] }], compact: [{ type: i0.Input, args: [{ isSignal: true, alias: "compact", required: false }] }], isolated: [{ type: i0.Input, args: [{ isSignal: true, alias: "isolated", required: false }] }], selectable: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectable", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], empty: [{ type: i0.Input, args: [{ isSignal: true, alias: "empty", required: false }] }], emptyText: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyText", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], sectionTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "sectionTitle", required: false }] }], sectionTitleId: [{ type: i0.Input, args: [{ isSignal: true, alias: "sectionTitleId", required: false }] }] } });
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (sectionTitle()) {\n  <h2 class=\"m-list__section-title\" [id]=\"resolvedSectionTitleId()\">\n    {{ sectionTitle() }}\n  </h2>\n}\n\n<section\n  class=\"m-list\"\n  role=\"list\"\n  [attr.aria-label]=\"resolvedAriaLabel()\"\n  [attr.aria-labelledby]=\"sectionTitle() ? resolvedSectionTitleId() : null\"\n  [class.m-list--card]=\"isCard()\"\n  [class.m-list--compact]=\"isCompact()\"\n  [class.m-list--comfortable]=\"isComfortable()\"\n  [class.m-list--isolated]=\"isIsolated()\"\n  [class.m-list--feed]=\"isFeed()\"\n  [class.m-list--menu]=\"isMenu()\"\n  [class.m-list--request]=\"isRequest()\"\n  [class.m-list--profile]=\"isProfile()\"\n  [class.m-list--shortcut]=\"isShortcut()\"\n  [class.m-list--divider-none]=\"divider() === 'none'\"\n  [class.m-list--divider-full]=\"divider() === 'full'\"\n  [class.m-list--selectable]=\"selectable()\"\n  [class.m-list--loading]=\"loading()\"\n>\n  @if (loading()) {\n    <div [class]=\"skeletonClass()\" aria-hidden=\"true\">\n      @for (row of skeletonRows(); track row) {\n        <div class=\"m-list__skeleton-row\">\n          <span class=\"m-list__skeleton-avatar\"></span>\n          <span class=\"m-list__skeleton-content\">\n            <span class=\"m-list__skeleton-title\"></span>\n            <span class=\"m-list__skeleton-subtitle\"></span>\n          </span>\n          <span class=\"m-list__skeleton-meta\"></span>\n        </div>\n      }\n    </div>\n  } @else if (empty()) {\n    <div class=\"m-list__empty\">{{ emptyText() }}</div>\n  } @else {\n    <ng-content />\n  }\n</section>\n", styles: [":host{display:block}.m-list__section-title{margin:0 0 10px;color:#8c94a3;font-size:13px;font-weight:700;line-height:18px}:host(.m-list-host--profile) .m-list__section-title{margin:0 16px 8px;font-weight:650}.m-list{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 12px;--m-list-item-gap: 12px;--m-list-item-prefix-size: 18px;--m-list-item-avatar-size: 48px;--m-list-item-min-height: 72px;width:auto;max-width:100%;box-sizing:border-box;margin:0;padding:0;list-style:none;border:1px solid rgba(0,0,0,.04);border-radius:14px;overflow:hidden;background:var(--color-surface)}.m-list--card{margin:8px;border-color:transparent;box-shadow:0 1px 2px #0000000a,0 8px 24px #00000008}.m-list--compact{--m-list-item-pad-x: 12px;--m-list-item-pad-y: 10px;--m-list-item-gap: 10px;--m-list-item-prefix-size: 18px;--m-list-item-avatar-size: 38px;--m-list-item-min-height: 68px;border-radius:10px}.m-list--comfortable{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 16px;--m-list-item-gap: 14px;--m-list-item-avatar-size: 48px;--m-list-item-min-height: 88px}.m-list--isolated{display:grid;gap:12px;margin:0;border:0;overflow:visible;background:transparent;box-shadow:none}:host ::ng-deep .m-list--isolated .m-item{border-radius:14px;background:#ffffffe0;box-shadow:0 8px 24px #0f172a0d}:host ::ng-deep .m-list--isolated .m-item--bordered:after{display:none}.m-list--menu{--m-list-item-pad-x: 20px;--m-list-item-pad-y: 0;--m-list-item-gap: 14px;--m-list-item-avatar-size: 28px;--m-list-item-min-height: 58px;margin:0;border:1px solid #eef1f5;border-radius:8px;overflow:hidden;background:#fff;box-shadow:0 12px 34px #0f172a0b}.m-list--menu.m-list--compact{--m-list-item-pad-x: 20px;--m-list-item-min-height: 50px;border-radius:8px}.m-list--menu.m-list--comfortable{--m-list-item-pad-x: 20px;--m-list-item-min-height: 58px;border-radius:8px}:host ::ng-deep .m-list--menu .m-item{align-items:center;padding-block:0}:host ::ng-deep .m-list--menu .m-item--bordered:after{right:var(--m-item-pad-x);left:var(--m-item-pad-x);background:#eef1f5}:host ::ng-deep .m-list--menu.m-list--divider-full .m-item--bordered:after{right:0;left:0}:host ::ng-deep .m-list--menu .m-item--bordered:has(.m-item__media:not(:empty)):after{left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap))}:host ::ng-deep .m-list--menu.m-list--divider-full .m-item--bordered:has(.m-item__media:not(:empty)):after{left:0}:host ::ng-deep .m-list--menu .m-item__start,:host ::ng-deep .m-list--menu .m-item__prefix,:host ::ng-deep .m-list--menu .m-item__media{min-height:var(--m-item-min-height);align-items:center}:host ::ng-deep .m-list--menu .m-item__body{align-self:stretch;gap:0}:host ::ng-deep .m-list--menu .m-item__row--primary{min-height:var(--m-item-min-height);align-items:center;column-gap:14px}:host ::ng-deep .m-list--menu .m-item__row--secondary,:host ::ng-deep .m-list--menu .m-item__footer{display:none}:host ::ng-deep .m-list--menu .m-item__title{color:#151515;font-size:16px;font-weight:680;letter-spacing:0;line-height:24px}:host ::ng-deep .m-list--menu .m-item__meta{max-width:44px;padding-top:0;display:inline-flex;align-items:center;justify-content:flex-end;color:#98a1af;font-size:16px;line-height:24px}.m-list--profile{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 8px;--m-list-item-gap: 12px;--m-list-item-avatar-size: 40px;--m-list-item-min-height: 56px;margin:0;border:0;border-radius:0;overflow:hidden;background:#fff;box-shadow:none}:host ::ng-deep .m-list--profile .m-item{align-items:center;padding-block:var(--m-item-pad-y)}:host ::ng-deep .m-list--profile .m-item--bordered:after{right:var(--m-item-pad-x);left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap));background:#0000000f}:host ::ng-deep .m-list--profile.m-list--divider-full .m-item--bordered:after{right:0;left:0}:host ::ng-deep .m-list--profile .m-item__start,:host ::ng-deep .m-list--profile .m-item__prefix,:host ::ng-deep .m-list--profile .m-item__media{min-height:var(--m-item-avatar-size);align-items:center}:host ::ng-deep .m-list--profile .m-item__body{align-self:center;gap:0}:host ::ng-deep .m-list--profile .m-item__row--primary{min-height:var(--m-item-avatar-size);align-items:center;column-gap:12px}:host ::ng-deep .m-list--profile .m-item__row--secondary,:host ::ng-deep .m-list--profile .m-item__footer{display:none}:host ::ng-deep .m-list--profile .m-item__title{color:#111827;font-size:17px;font-weight:500;line-height:24px}.m-list--shortcut{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 8px;--m-list-item-gap: 16px;--m-list-item-avatar-size: 40px;--m-list-item-min-height: 56px;margin:0;border:0;border-radius:0;overflow:hidden;background:#fff;box-shadow:none}:host ::ng-deep .m-list--shortcut .m-item{align-items:center;padding-block:var(--m-item-pad-y)}:host ::ng-deep .m-list--shortcut .m-item--bordered:after{right:var(--m-item-pad-x);left:calc(var(--m-item-pad-x) + var(--m-item-avatar-size) + var(--m-item-gap));background:#0000000f}:host ::ng-deep .m-list--shortcut.m-list--divider-full .m-item--bordered:after{right:0;left:0}:host ::ng-deep .m-list--shortcut .m-item__start,:host ::ng-deep .m-list--shortcut .m-item__prefix,:host ::ng-deep .m-list--shortcut .m-item__media{min-height:var(--m-item-avatar-size);align-items:center}:host ::ng-deep .m-list--shortcut .m-item__body{align-self:center;gap:0}:host ::ng-deep .m-list--shortcut .m-item__row--primary{min-height:var(--m-item-avatar-size);align-items:center;column-gap:12px}:host ::ng-deep .m-list--shortcut .m-item__row--secondary,:host ::ng-deep .m-list--shortcut .m-item__footer{display:none}:host ::ng-deep .m-list--shortcut .m-item__title{color:#111827;font-size:16px;font-weight:700;line-height:24px}.m-list--request{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 20px;--m-list-item-gap: 12px;--m-list-item-avatar-size: 48px;--m-list-item-min-height: 120px;margin:0;border:0;border-radius:0;overflow:hidden;background:#fff;box-shadow:none}.m-list--request.m-list--compact{--m-list-item-pad-x: 16px;--m-list-item-pad-y: 14px;--m-list-item-avatar-size: 46px;--m-list-item-min-height: 96px}.m-list--request.m-list--comfortable{--m-list-item-pad-x: 20px;--m-list-item-pad-y: 20px;--m-list-item-avatar-size: 56px;--m-list-item-min-height: 124px}:host ::ng-deep .m-list--request .m-item--bordered:after,:host ::ng-deep .m-list--request .m-item--bordered:has(.m-item__media:not(:empty)):after{right:16px;left:88px;background:#f0f1f3;transform:none}:host ::ng-deep .m-list--request.m-list--divider-full .m-item--bordered:after,:host ::ng-deep .m-list--request.m-list--divider-full .m-item--bordered:has(.m-item__media:not(:empty)):after{right:0;left:0}:host ::ng-deep .m-list--request .m-item__body{gap:6px;padding-top:0}:host ::ng-deep .m-list--request .m-item__row{column-gap:12px}:host ::ng-deep .m-list--request .m-item__row--secondary{align-items:flex-start}:host ::ng-deep .m-list--request .m-item__title{color:#111;font-size:17px;font-weight:600;line-height:24px}:host ::ng-deep .m-list--request .m-item__meta{max-width:64px;padding-top:0;color:#8a94a6;font-size:14px;line-height:20px}:host ::ng-deep .m-list--request .m-item__description{color:#8a94a6;font-size:15px;line-height:22px}:host ::ng-deep .m-list--request .m-item__actions{max-width:180px;gap:10px;overflow:visible}.m-list--divider-none{border-color:transparent}:host ::ng-deep .m-list--divider-none .m-item--bordered:after{display:none}:host ::ng-deep .m-list--divider-full .m-item--bordered:after{left:0}.m-list__empty{padding:24px 16px;color:var(--color-text-muted);font-size:14px;text-align:center}.m-list__skeleton{--sk-a: var(--m-list-skeleton-avatar-size, var(--m-list-item-avatar-size));--sk-h: var(--m-list-skeleton-row-min-height, var(--m-list-item-min-height));--sk-r: var(--m-list-skeleton-avatar-radius, 10px);--sk-tw: min(58%, 220px);--sk-sw: min(34%, 140px);--sk-sh: 12px;--sk-gap: 8px;--sk-track: 22px;--sk-mw: 10px;--sk-mh: 10px;--sk-mr: 999px;--sk-sd: block;--sk-md: block;display:grid;gap:0;padding:4px 0}.m-list__skeleton-row{display:grid;grid-template-columns:var(--sk-a) minmax(0,1fr) var(--sk-track);align-items:center;gap:var(--m-list-item-gap);min-height:var(--sk-h);padding:var(--m-list-item-pad-y) var(--m-list-item-pad-x);box-sizing:border-box}.m-list__skeleton-avatar,.m-list__skeleton-title,.m-list__skeleton-subtitle,.m-list__skeleton-meta{display:block;background:linear-gradient(90deg,#f3f6fa,#edf1f6 52%,#f3f6fa);background-size:220% 100%;animation:m-list-skeleton-shimmer 1.2s ease-in-out infinite}.m-list__skeleton-avatar{width:var(--sk-a);height:var(--sk-a);border-radius:var(--sk-r)}.m-list__skeleton-content{display:grid;gap:var(--sk-gap);min-width:0}.m-list__skeleton-title{width:var(--sk-tw);height:16px;border-radius:999px}.m-list__skeleton-subtitle{display:var(--sk-sd);width:var(--sk-sw);height:var(--sk-sh);border-radius:999px}.m-list__skeleton-meta{display:var(--sk-md);width:var(--sk-mw);height:var(--sk-mh);border-radius:var(--sk-mr);opacity:.78}.m-list__skeleton--feed{--sk-a: var(--m-list-skeleton-avatar-size, 48px);--sk-h: var(--m-list-skeleton-row-min-height, 72px);--sk-r: 14px;--sk-tw: min(56%, 210px);--sk-sw: min(78%, 300px);--sk-mw: 28px;--sk-mh: 12px}.m-list__skeleton--menu{--sk-a: var(--m-list-skeleton-avatar-size, 28px);--sk-h: var(--m-list-skeleton-row-min-height, 58px);--sk-r: 8px;--sk-gap: 0;--sk-tw: min(48%, 180px);--sk-sd: none;--sk-mw: 8px;--sk-mh: 18px;--sk-mr: 6px;padding:0}.m-list__skeleton--profile,.m-list__skeleton--shortcut{--sk-a: var(--m-list-skeleton-avatar-size, 40px);--sk-h: var(--m-list-skeleton-row-min-height, 56px);--sk-r: 12px;--sk-gap: 0;--sk-tw: min(42%, 180px);--sk-sd: none;--sk-md: none;--sk-track: 0;padding:0}.m-list__skeleton--request{--sk-a: var(--m-list-skeleton-avatar-size, 48px);--sk-h: var(--m-list-skeleton-row-min-height, 120px);--sk-r: 14px;--sk-gap: 10px;--sk-tw: min(46%, 220px);--sk-sw: min(86%, 420px);--sk-sh: 14px;--sk-mw: 64px;--sk-mh: 24px;padding:0}@keyframes m-list-skeleton-shimmer{0%{background-position:120% 0}to{background-position:-120% 0}}\n"] }]
+        }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], skeletonType: [{ type: i0.Input, args: [{ isSignal: true, alias: "skeletonType", required: false }] }], density: [{ type: i0.Input, args: [{ isSignal: true, alias: "density", required: false }] }], divider: [{ type: i0.Input, args: [{ isSignal: true, alias: "divider", required: false }] }], card: [{ type: i0.Input, args: [{ isSignal: true, alias: "card", required: false }] }], compact: [{ type: i0.Input, args: [{ isSignal: true, alias: "compact", required: false }] }], isolated: [{ type: i0.Input, args: [{ isSignal: true, alias: "isolated", required: false }] }], selectable: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectable", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], empty: [{ type: i0.Input, args: [{ isSignal: true, alias: "empty", required: false }] }], emptyText: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyText", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], sectionTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "sectionTitle", required: false }] }], sectionTitleId: [{ type: i0.Input, args: [{ isSignal: true, alias: "sectionTitleId", required: false }] }] } });
 
 class MobilePageHeaderSlotDirective {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: MobilePageHeaderSlotDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
@@ -5454,6 +6344,121 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
                     }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"m-page__frame\">\r\n  <header class=\"m-page__header\">\r\n    <ng-content select=\"m-header,[mPageHeader]\" />\r\n  </header>\r\n\r\n  <main class=\"m-page__content\">\r\n    <ng-content select=\"m-content,[mPageContent]\" />\r\n  </main>\r\n\r\n  <footer class=\"m-page__footer\">\r\n    <ng-content select=\"m-footer,[mPageFooter]\" />\r\n  </footer>\r\n\r\n  <ng-content />\r\n</section>\r\n", styles: ["m-page{display:block;width:100%;min-width:0;min-height:100%;height:var(--m-page-height, 100%);box-sizing:border-box}m-page .m-page__frame{width:100%;min-width:0;min-height:100%;height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:var(--m-page-gap, 0);padding:var(--m-page-padding, 0);overflow:var(--m-page-overflow, hidden);background:var(--m-page-bg, var(--color-bg));color:var(--m-page-color, var(--color-text-primary));box-sizing:border-box}m-page .m-page__header,m-page .m-page__content,m-page .m-page__footer{min-width:0;box-sizing:border-box}m-page .m-page__header{z-index:var(--m-page-header-z-index, 1);background:var(--m-page-header-bg, transparent)}m-page .m-page__header:not(:has(>*)),m-page .m-page__footer:not(:has(>*)){display:none}m-page .m-page__content{min-height:0;overflow:var(--m-page-content-overflow, auto);padding:var(--m-page-content-padding, 0);background:var(--m-page-content-bg, transparent)}m-page .m-page__footer{z-index:var(--m-page-footer-z-index, 1);padding:var(--m-page-footer-padding, 0);background:var(--m-page-footer-bg, transparent)}m-page .m-page__header>*,m-page .m-page__content>*,m-page .m-page__footer>*{min-width:0}m-page .m-page__content>m-content,m-page .m-page__content>[mPageContent]{min-height:100%}\n"] }]
         }], propDecorators: { padding: [{ type: i0.Input, args: [{ isSignal: true, alias: "padding", required: false }] }] } });
 
+const DEFAULT_P_MENU_POSITIONS = [
+    { originX: 'start', originY: 'bottom', overlayX: 'start', overlayY: 'top', offsetY: 8 },
+    { originX: 'end', originY: 'bottom', overlayX: 'end', overlayY: 'top', offsetY: 8 },
+];
+class PMenuItemComponent {
+    closeMenu = null;
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    tone = input('default', ...(ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []));
+    value = input('', ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    icon = input(null, ...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
+    select = output();
+    menuItem = viewChild(MenuItem, ...(ngDevMode ? [{ debugName: "menuItem" }] : /* istanbul ignore next */ []));
+    setCloseMenu(closeMenu) {
+        this.closeMenu = closeMenu;
+    }
+    isTextIcon(icon) {
+        return typeof icon === 'string';
+    }
+    handleSelect() {
+        if (!this.disabled()) {
+            this.select.emit();
+            this.menuItem()?.close();
+            this.closeMenu?.();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: PMenuItemComponent, isStandalone: true, selector: "p-menu-item", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, tone: { classPropertyName: "tone", publicName: "tone", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { select: "select" }, viewQueries: [{ propertyName: "menuItem", first: true, predicate: MenuItem, descendants: true, isSignal: true }], ngImport: i0, template: `
+    <div
+      ngMenuItem
+      class="p-menu-item"
+      [class.p-menu-item--danger]="tone() === 'danger'"
+      [value]="value()"
+      [disabled]="disabled()"
+      (click)="handleSelect()"
+    >
+      @if (icon(); as menuIcon) {
+        @if (isTextIcon(menuIcon)) {
+          <span class="icon" translate="no" aria-hidden="true">{{ menuIcon }}</span>
+        } @else {
+          <lucide-icon
+            class="icon"
+            [img]="menuIcon"
+            [size]="20"
+            [strokeWidth]="1.85"
+            aria-hidden="true"
+          />
+        }
+      }
+      <span class="label">
+        <ng-content />
+      </span>
+    </div>
+  `, isInline: true, styles: [":host{display:contents}[ngMenu]{margin:0;width:14rem;padding:.5rem;border:1px solid rgba(226,232,240,.9);border-radius:.5rem;background:var(--color-surface);color:var(--color-text-primary);box-shadow:0 18px 40px #0f172a24,0 2px 8px #0f172a0f}[ngMenu][data-visible=false]{display:none}[ngMenuItem]{display:flex;align-items:center;gap:.75rem;min-height:2.75rem;padding:.5rem .75rem;border-radius:.375rem;color:var(--color-text-primary);cursor:pointer;font-size:1rem;font-weight:500;line-height:1.35;outline:none;transition:background-color .16s ease,color .16s ease,box-shadow .16s ease}[ngMenuItem]:hover,[ngMenuItem][data-active=true]{background:#1677ff1f;color:var(--color-primary)}[ngMenuItem]:focus-visible{box-shadow:0 0 0 2px #1677ff38}[ngMenuItem] .icon{flex:0 0 auto;width:1.375rem;min-width:1.375rem;color:#7a7f87;font-size:1.375rem;line-height:1;transition:color .16s ease}[ngMenuItem]:hover .icon,[ngMenuItem][data-active=true] .icon{color:var(--color-primary)}[ngMenuItem] .label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.separator{height:1px;margin:.25rem .75rem;border:0;background:#d1d5dbb8;transform:scaleY(.5);transform-origin:center}.p-menu-item--danger{color:var(--color-error)}.p-menu-item--danger:hover,.p-menu-item--danger[data-active=true]{background:#ef44441a;color:var(--color-error)}.p-menu-item--danger:hover .icon,.p-menu-item--danger[data-active=true] .icon{color:var(--color-error)}[ngMenuItem][aria-disabled=true],[ngMenuItem][data-disabled=true]{cursor:not-allowed;background:transparent;color:var(--color-text-disabled)}\n"], dependencies: [{ kind: "directive", type: MenuItem, selector: "[ngMenuItem]", inputs: ["id", "value", "disabled", "searchTerm", "submenu"], outputs: ["searchTermChange"], exportAs: ["ngMenuItem"] }, { kind: "ngmodule", type: LucideAngularModule }, { kind: "component", type: i1.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PMenuItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'p-menu-item', imports: [MenuItem, LucideAngularModule], template: `
+    <div
+      ngMenuItem
+      class="p-menu-item"
+      [class.p-menu-item--danger]="tone() === 'danger'"
+      [value]="value()"
+      [disabled]="disabled()"
+      (click)="handleSelect()"
+    >
+      @if (icon(); as menuIcon) {
+        @if (isTextIcon(menuIcon)) {
+          <span class="icon" translate="no" aria-hidden="true">{{ menuIcon }}</span>
+        } @else {
+          <lucide-icon
+            class="icon"
+            [img]="menuIcon"
+            [size]="20"
+            [strokeWidth]="1.85"
+            aria-hidden="true"
+          />
+        }
+      }
+      <span class="label">
+        <ng-content />
+      </span>
+    </div>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:contents}[ngMenu]{margin:0;width:14rem;padding:.5rem;border:1px solid rgba(226,232,240,.9);border-radius:.5rem;background:var(--color-surface);color:var(--color-text-primary);box-shadow:0 18px 40px #0f172a24,0 2px 8px #0f172a0f}[ngMenu][data-visible=false]{display:none}[ngMenuItem]{display:flex;align-items:center;gap:.75rem;min-height:2.75rem;padding:.5rem .75rem;border-radius:.375rem;color:var(--color-text-primary);cursor:pointer;font-size:1rem;font-weight:500;line-height:1.35;outline:none;transition:background-color .16s ease,color .16s ease,box-shadow .16s ease}[ngMenuItem]:hover,[ngMenuItem][data-active=true]{background:#1677ff1f;color:var(--color-primary)}[ngMenuItem]:focus-visible{box-shadow:0 0 0 2px #1677ff38}[ngMenuItem] .icon{flex:0 0 auto;width:1.375rem;min-width:1.375rem;color:#7a7f87;font-size:1.375rem;line-height:1;transition:color .16s ease}[ngMenuItem]:hover .icon,[ngMenuItem][data-active=true] .icon{color:var(--color-primary)}[ngMenuItem] .label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.separator{height:1px;margin:.25rem .75rem;border:0;background:#d1d5dbb8;transform:scaleY(.5);transform-origin:center}.p-menu-item--danger{color:var(--color-error)}.p-menu-item--danger:hover,.p-menu-item--danger[data-active=true]{background:#ef44441a;color:var(--color-error)}.p-menu-item--danger:hover .icon,.p-menu-item--danger[data-active=true] .icon{color:var(--color-error)}[ngMenuItem][aria-disabled=true],[ngMenuItem][data-disabled=true]{cursor:not-allowed;background:transparent;color:var(--color-text-disabled)}\n"] }]
+        }], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], tone: [{ type: i0.Input, args: [{ isSignal: true, alias: "tone", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], select: [{ type: i0.Output, args: ["select"] }], menuItem: [{ type: i0.ViewChild, args: [i0.forwardRef(() => MenuItem), { isSignal: true }] }] } });
+class PMenuSeparatorComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PMenuSeparatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.8", type: PMenuSeparatorComponent, isStandalone: true, selector: "p-menu-separator", ngImport: i0, template: '<div class="separator" role="separator" aria-orientation="horizontal"></div>', isInline: true, styles: [":host{display:contents}[ngMenu]{margin:0;width:14rem;padding:.5rem;border:1px solid rgba(226,232,240,.9);border-radius:.5rem;background:var(--color-surface);color:var(--color-text-primary);box-shadow:0 18px 40px #0f172a24,0 2px 8px #0f172a0f}[ngMenu][data-visible=false]{display:none}[ngMenuItem]{display:flex;align-items:center;gap:.75rem;min-height:2.75rem;padding:.5rem .75rem;border-radius:.375rem;color:var(--color-text-primary);cursor:pointer;font-size:1rem;font-weight:500;line-height:1.35;outline:none;transition:background-color .16s ease,color .16s ease,box-shadow .16s ease}[ngMenuItem]:hover,[ngMenuItem][data-active=true]{background:#1677ff1f;color:var(--color-primary)}[ngMenuItem]:focus-visible{box-shadow:0 0 0 2px #1677ff38}[ngMenuItem] .icon{flex:0 0 auto;width:1.375rem;min-width:1.375rem;color:#7a7f87;font-size:1.375rem;line-height:1;transition:color .16s ease}[ngMenuItem]:hover .icon,[ngMenuItem][data-active=true] .icon{color:var(--color-primary)}[ngMenuItem] .label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.separator{height:1px;margin:.25rem .75rem;border:0;background:#d1d5dbb8;transform:scaleY(.5);transform-origin:center}.p-menu-item--danger{color:var(--color-error)}.p-menu-item--danger:hover,.p-menu-item--danger[data-active=true]{background:#ef44441a;color:var(--color-error)}.p-menu-item--danger:hover .icon,.p-menu-item--danger[data-active=true] .icon{color:var(--color-error)}[ngMenuItem][aria-disabled=true],[ngMenuItem][data-disabled=true]{cursor:not-allowed;background:transparent;color:var(--color-text-disabled)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PMenuSeparatorComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'p-menu-separator', template: '<div class="separator" role="separator" aria-orientation="horizontal"></div>', changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:contents}[ngMenu]{margin:0;width:14rem;padding:.5rem;border:1px solid rgba(226,232,240,.9);border-radius:.5rem;background:var(--color-surface);color:var(--color-text-primary);box-shadow:0 18px 40px #0f172a24,0 2px 8px #0f172a0f}[ngMenu][data-visible=false]{display:none}[ngMenuItem]{display:flex;align-items:center;gap:.75rem;min-height:2.75rem;padding:.5rem .75rem;border-radius:.375rem;color:var(--color-text-primary);cursor:pointer;font-size:1rem;font-weight:500;line-height:1.35;outline:none;transition:background-color .16s ease,color .16s ease,box-shadow .16s ease}[ngMenuItem]:hover,[ngMenuItem][data-active=true]{background:#1677ff1f;color:var(--color-primary)}[ngMenuItem]:focus-visible{box-shadow:0 0 0 2px #1677ff38}[ngMenuItem] .icon{flex:0 0 auto;width:1.375rem;min-width:1.375rem;color:#7a7f87;font-size:1.375rem;line-height:1;transition:color .16s ease}[ngMenuItem]:hover .icon,[ngMenuItem][data-active=true] .icon{color:var(--color-primary)}[ngMenuItem] .label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.separator{height:1px;margin:.25rem .75rem;border:0;background:#d1d5dbb8;transform:scaleY(.5);transform-origin:center}.p-menu-item--danger{color:var(--color-error)}.p-menu-item--danger:hover,.p-menu-item--danger[data-active=true]{background:#ef44441a;color:var(--color-error)}.p-menu-item--danger:hover .icon,.p-menu-item--danger[data-active=true] .icon{color:var(--color-error)}[ngMenuItem][aria-disabled=true],[ngMenuItem][data-disabled=true]{cursor:not-allowed;background:transparent;color:var(--color-text-disabled)}\n"] }]
+        }] });
+class PMenuComponent {
+    origin = input.required(...(ngDevMode ? [{ debugName: "origin" }] : /* istanbul ignore next */ []));
+    trigger = input.required(...(ngDevMode ? [{ debugName: "trigger" }] : /* istanbul ignore next */ []));
+    positions = input(DEFAULT_P_MENU_POSITIONS, ...(ngDevMode ? [{ debugName: "positions" }] : /* istanbul ignore next */ []));
+    panelWidth = input('14rem', ...(ngDevMode ? [{ debugName: "panelWidth" }] : /* istanbul ignore next */ []));
+    formatMenu = viewChild('formatMenu', ...(ngDevMode ? [{ debugName: "formatMenu" }] : /* istanbul ignore next */ []));
+    menuItems = contentChildren(PMenuItemComponent, { ...(ngDevMode ? { debugName: "menuItems" } : /* istanbul ignore next */ {}), descendants: true });
+    constructor() {
+        effect(() => {
+            const closeMenu = () => this.trigger().close();
+            for (const item of this.menuItems()) {
+                item.setCloseMenu(closeMenu);
+            }
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.8", type: PMenuComponent, isStandalone: true, selector: "p-menu", inputs: { origin: { classPropertyName: "origin", publicName: "origin", isSignal: true, isRequired: true, transformFunction: null }, trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: true, transformFunction: null }, positions: { classPropertyName: "positions", publicName: "positions", isSignal: true, isRequired: false, transformFunction: null }, panelWidth: { classPropertyName: "panelWidth", publicName: "panelWidth", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "menuItems", predicate: PMenuItemComponent, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "formatMenu", first: true, predicate: ["formatMenu"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template\n  [cdkConnectedOverlayOpen]=\"true\"\n  [cdkConnectedOverlay]=\"{ origin: origin(), usePopover: 'inline' }\"\n  [cdkConnectedOverlayPositions]=\"positions()\"\n  cdkAttachPopoverAsChild\n>\n  <div\n    ngMenu\n    class=\"p-menu\"\n    #formatMenu=\"ngMenu\"\n    [attr.data-visible]=\"trigger().expanded()\"\n    [style.width]=\"panelWidth()\"\n  >\n    <ng-content />\n  </div>\n</ng-template>\n", styles: [":host{display:contents}[ngMenu]{margin:0;width:14rem;padding:.5rem;border:1px solid rgba(226,232,240,.9);border-radius:.5rem;background:var(--color-surface);color:var(--color-text-primary);box-shadow:0 18px 40px #0f172a24,0 2px 8px #0f172a0f}[ngMenu][data-visible=false]{display:none}[ngMenuItem]{display:flex;align-items:center;gap:.75rem;min-height:2.75rem;padding:.5rem .75rem;border-radius:.375rem;color:var(--color-text-primary);cursor:pointer;font-size:1rem;font-weight:500;line-height:1.35;outline:none;transition:background-color .16s ease,color .16s ease,box-shadow .16s ease}[ngMenuItem]:hover,[ngMenuItem][data-active=true]{background:#1677ff1f;color:var(--color-primary)}[ngMenuItem]:focus-visible{box-shadow:0 0 0 2px #1677ff38}[ngMenuItem] .icon{flex:0 0 auto;width:1.375rem;min-width:1.375rem;color:#7a7f87;font-size:1.375rem;line-height:1;transition:color .16s ease}[ngMenuItem]:hover .icon,[ngMenuItem][data-active=true] .icon{color:var(--color-primary)}[ngMenuItem] .label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.separator{height:1px;margin:.25rem .75rem;border:0;background:#d1d5dbb8;transform:scaleY(.5);transform-origin:center}.p-menu-item--danger{color:var(--color-error)}.p-menu-item--danger:hover,.p-menu-item--danger[data-active=true]{background:#ef44441a;color:var(--color-error)}.p-menu-item--danger:hover .icon,.p-menu-item--danger[data-active=true] .icon{color:var(--color-error)}[ngMenuItem][aria-disabled=true],[ngMenuItem][data-disabled=true]{cursor:not-allowed;background:transparent;color:var(--color-text-disabled)}\n"], dependencies: [{ kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$2.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: Menu, selector: "[ngMenu]", inputs: ["id", "wrap", "typeaheadDelay", "disabled", "expansionDelay"], outputs: ["itemSelected"], exportAs: ["ngMenu"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: PMenuComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'p-menu', imports: [OverlayModule, Menu], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template\n  [cdkConnectedOverlayOpen]=\"true\"\n  [cdkConnectedOverlay]=\"{ origin: origin(), usePopover: 'inline' }\"\n  [cdkConnectedOverlayPositions]=\"positions()\"\n  cdkAttachPopoverAsChild\n>\n  <div\n    ngMenu\n    class=\"p-menu\"\n    #formatMenu=\"ngMenu\"\n    [attr.data-visible]=\"trigger().expanded()\"\n    [style.width]=\"panelWidth()\"\n  >\n    <ng-content />\n  </div>\n</ng-template>\n", styles: [":host{display:contents}[ngMenu]{margin:0;width:14rem;padding:.5rem;border:1px solid rgba(226,232,240,.9);border-radius:.5rem;background:var(--color-surface);color:var(--color-text-primary);box-shadow:0 18px 40px #0f172a24,0 2px 8px #0f172a0f}[ngMenu][data-visible=false]{display:none}[ngMenuItem]{display:flex;align-items:center;gap:.75rem;min-height:2.75rem;padding:.5rem .75rem;border-radius:.375rem;color:var(--color-text-primary);cursor:pointer;font-size:1rem;font-weight:500;line-height:1.35;outline:none;transition:background-color .16s ease,color .16s ease,box-shadow .16s ease}[ngMenuItem]:hover,[ngMenuItem][data-active=true]{background:#1677ff1f;color:var(--color-primary)}[ngMenuItem]:focus-visible{box-shadow:0 0 0 2px #1677ff38}[ngMenuItem] .icon{flex:0 0 auto;width:1.375rem;min-width:1.375rem;color:#7a7f87;font-size:1.375rem;line-height:1;transition:color .16s ease}[ngMenuItem]:hover .icon,[ngMenuItem][data-active=true] .icon{color:var(--color-primary)}[ngMenuItem] .label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.separator{height:1px;margin:.25rem .75rem;border:0;background:#d1d5dbb8;transform:scaleY(.5);transform-origin:center}.p-menu-item--danger{color:var(--color-error)}.p-menu-item--danger:hover,.p-menu-item--danger[data-active=true]{background:#ef44441a;color:var(--color-error)}.p-menu-item--danger:hover .icon,.p-menu-item--danger[data-active=true] .icon{color:var(--color-error)}[ngMenuItem][aria-disabled=true],[ngMenuItem][data-disabled=true]{cursor:not-allowed;background:transparent;color:var(--color-text-disabled)}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { origin: [{ type: i0.Input, args: [{ isSignal: true, alias: "origin", required: true }] }], trigger: [{ type: i0.Input, args: [{ isSignal: true, alias: "trigger", required: true }] }], positions: [{ type: i0.Input, args: [{ isSignal: true, alias: "positions", required: false }] }], panelWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelWidth", required: false }] }], formatMenu: [{ type: i0.ViewChild, args: ['formatMenu', { isSignal: true }] }], menuItems: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => PMenuItemComponent), { ...{ descendants: true }, isSignal: true }] }] } });
+
 function coerceContentGap(value) {
     if (value === null || value === undefined || value === '') {
         return null;
@@ -5590,47 +6595,85 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
                     }, template: "<button\r\n  class=\"m-person-card-layer__backdrop\"\r\n  type=\"button\"\r\n  [attr.aria-label]=\"closeAriaLabel()\"\r\n  [attr.title]=\"closeAriaLabel()\"\r\n  (click)=\"closeRequested.emit()\"\r\n></button>\r\n\r\n<article\r\n  class=\"m-person-card-layer__panel\"\r\n  role=\"dialog\"\r\n  [attr.aria-label]=\"ariaLabel()\"\r\n  (click)=\"$event.stopPropagation()\"\r\n>\r\n  <ng-content />\r\n</article>\r\n", styles: [":host{color:#141824;pointer-events:auto}.m-person-card-layer__backdrop{padding:0;border:0;background:transparent}.m-person-card-layer__panel{display:grid;align-content:start;gap:16px;min-width:0;background:#f7f9fc}:host(.m-person-card-layer--desktop){position:absolute;inset:0;z-index:60;display:block;pointer-events:none}:host(.m-person-card-layer--desktop) .m-person-card-layer__backdrop{position:fixed;inset:0;z-index:0;width:100%;height:100%;pointer-events:auto}:host(.m-person-card-layer--desktop) .m-person-card-layer__panel{position:absolute;top:68px;left:26px;z-index:1;width:min(372px,100% - 52px);max-height:min(680px,100% - 92px);padding:12px;overflow:auto;border:1px solid #e7ebf2;border-radius:8px;box-shadow:0 22px 54px #0f172a2e;opacity:0;pointer-events:auto;transform:translate3d(-10px,-6px,0) scale(.96);transition:opacity .22s cubic-bezier(.22,1,.36,1),transform .22s cubic-bezier(.22,1,.36,1)}:host(.m-person-card-layer--desktop.m-person-card-layer--active) .m-person-card-layer__panel{opacity:1;transform:translateZ(0) scale(1)}:host(.m-person-card-layer--mobile){position:fixed;inset:0;z-index:1000;display:block;overflow:auto;background:#fff;scrollbar-width:none}:host(.m-person-card-layer--mobile)::-webkit-scrollbar{display:none}:host(.m-person-card-layer--mobile) .m-person-card-layer__panel{min-height:100%;padding:max(4px,env(safe-area-inset-top,0px)) 16px calc(28px + env(safe-area-inset-bottom,0px));background:#fff;transform:translate3d(100%,0,0);transition:transform .34s cubic-bezier(.36,.66,.04,1)}:host(.m-person-card-layer--mobile.m-person-card-layer--active) .m-person-card-layer__panel{transform:translateZ(0)}:host(.m-person-card-layer--mobile:not(.m-person-card-layer--active)) .m-person-card-layer__panel{transition-duration:.26s;transition-timing-function:cubic-bezier(.4,0,.2,1)}\n"] }]
         }], propDecorators: { active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], closeAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeAriaLabel", required: false }] }], closeRequested: [{ type: i0.Output, args: ["closeRequested"] }] } });
 
-class MProductShellRailSlot {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: MProductShellRailSlot, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.8", type: MProductShellRailSlot, isStandalone: true, selector: "[mProductShellRail]", ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: MProductShellRailSlot, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[mProductShellRail]',
-                }]
-        }] });
-class MProductShellMainSlot {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: MProductShellMainSlot, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.8", type: MProductShellMainSlot, isStandalone: true, selector: "[mProductShellMain]", ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: MProductShellMainSlot, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[mProductShellMain]',
-                }]
-        }] });
-class MProductShellBottomSlot {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: MProductShellBottomSlot, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.8", type: MProductShellBottomSlot, isStandalone: true, selector: "[mProductShellBottom]", ngImport: i0 });
+const emptySlide = {
+    id: '',
+    title: '',
+};
+class NoticeCarousel {
+    slides = input([], ...(ngDevMode ? [{ debugName: "slides" }] : /* istanbul ignore next */ []));
+    ariaLabel = input('置顶公告', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    actionText = input('查看详情', ...(ngDevMode ? [{ debugName: "actionText" }] : /* istanbul ignore next */ []));
+    intervalMs = input(4200, ...(ngDevMode ? [{ debugName: "intervalMs" }] : /* istanbul ignore next */ []));
+    detailSelected = output();
+    activeIndex = signal(0, ...(ngDevMode ? [{ debugName: "activeIndex" }] : /* istanbul ignore next */ []));
+    activeSlide = computed(() => this.slides()[this.activeIndex()] ?? this.slides()[0] ?? emptySlide, ...(ngDevMode ? [{ debugName: "activeSlide" }] : /* istanbul ignore next */ []));
+    activeMeta = computed(() => this.activeSlide().meta ?? [], ...(ngDevMode ? [{ debugName: "activeMeta" }] : /* istanbul ignore next */ []));
+    chevronRightIcon = ChevronRightIcon;
+    slideTimer = null;
+    constructor() {
+        effect((onCleanup) => {
+            const slides = this.slides();
+            const intervalMs = this.intervalMs();
+            this.stopCarousel();
+            if (slides.length <= 1) {
+                return;
+            }
+            this.slideTimer = setInterval(() => {
+                const length = this.slides().length;
+                this.activeIndex.update((index) => (index + 1) % Math.max(length, 1));
+            }, intervalMs);
+            onCleanup(() => this.stopCarousel());
+        });
+    }
+    ngOnDestroy() {
+        this.stopCarousel();
+    }
+    selectSlide(index) {
+        this.activeIndex.set(index);
+        this.restartCarousel();
+    }
+    pauseCarousel() {
+        this.stopCarousel();
+    }
+    resumeCarousel() {
+        this.restartCarousel();
+    }
+    selectDetail() {
+        this.detailSelected.emit(this.activeSlide());
+    }
+    metaTone(index) {
+        return this.activeSlide().metaTones?.[index] ?? null;
+    }
+    slideTrackKey(index, slide) {
+        if (typeof slide.id === 'string' && slide.id.trim().length === 0) {
+            return `slide-${index}`;
+        }
+        return slide.id;
+    }
+    restartCarousel() {
+        this.stopCarousel();
+        if (this.slides().length <= 1) {
+            return;
+        }
+        this.slideTimer = setInterval(() => {
+            const length = this.slides().length;
+            this.activeIndex.update((index) => (index + 1) % Math.max(length, 1));
+        }, this.intervalMs());
+    }
+    stopCarousel() {
+        if (!this.slideTimer) {
+            return;
+        }
+        clearInterval(this.slideTimer);
+        this.slideTimer = null;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NoticeCarousel, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: NoticeCarousel, isStandalone: true, selector: "s-notice-carousel", inputs: { slides: { classPropertyName: "slides", publicName: "slides", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, actionText: { classPropertyName: "actionText", publicName: "actionText", isSignal: true, isRequired: false, transformFunction: null }, intervalMs: { classPropertyName: "intervalMs", publicName: "intervalMs", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { detailSelected: "detailSelected" }, ngImport: i0, template: "@if (slides().length) {\n  <section\n    class=\"s-notice-carousel\"\n    [class.s-notice-carousel--text-only]=\"!activeSlide().image\"\n    [attr.aria-label]=\"ariaLabel()\"\n    (mouseenter)=\"pauseCarousel()\"\n    (mouseleave)=\"resumeCarousel()\"\n  >\n    @for (slide of slides(); track slideTrackKey($index, slide); let index = $index) {\n      @if (slide.image) {\n        <img\n          class=\"s-notice-carousel__image\"\n          [class.s-notice-carousel__image--active]=\"index === activeIndex()\"\n          [src]=\"slide.image\"\n          [alt]=\"slide.title\"\n        />\n      }\n    }\n\n    <div class=\"s-notice-carousel__shade\"></div>\n\n    <div class=\"s-notice-carousel__content\">\n      <h1>{{ activeSlide().title }}</h1>\n      @if (activeSlide().summary) {\n        <p>{{ activeSlide().summary }}</p>\n      }\n      @if (activeMeta().length) {\n        <div class=\"s-notice-carousel__meta\">\n          @for (item of activeMeta(); track $index; let first = $first; let index = $index) {\n            <span\n              [class.s-notice-carousel__tag]=\"first\"\n              [attr.data-notice-tone]=\"first ? metaTone(index) : null\"\n            >\n              {{ item }}\n            </span>\n          }\n        </div>\n      }\n\n      <div class=\"s-notice-carousel__dots\" role=\"tablist\" [attr.aria-label]=\"ariaLabel() + '\u8F6E\u64AD'\">\n        @for (slide of slides(); track slideTrackKey($index, slide); let index = $index) {\n          <button\n            class=\"s-notice-carousel__dot\"\n            [class.s-notice-carousel__dot--active]=\"index === activeIndex()\"\n            type=\"button\"\n            role=\"tab\"\n            [attr.aria-selected]=\"index === activeIndex()\"\n            [attr.aria-label]=\"'\u5207\u6362' + ariaLabel() + ' ' + (index + 1)\"\n            (click)=\"selectSlide(index)\"\n          ></button>\n        }\n      </div>\n    </div>\n\n    <button class=\"s-notice-carousel__action\" type=\"button\" (click)=\"selectDetail()\">\n      {{ actionText() }}\n      <lucide-icon aria-hidden=\"true\" [img]=\"chevronRightIcon\" [size]=\"16\" [strokeWidth]=\"2\" />\n    </button>\n  </section>\n}\n", styles: [":host{display:block;--notice-carousel-height: 252px;--notice-carousel-radius: 8px;--notice-carousel-content-max-width: 620px;--notice-carousel-content-padding: 32px 28px 74px;--notice-carousel-title-size: 26px;--notice-carousel-action-right: 20px;--notice-carousel-action-bottom: 20px;--notice-carousel-dots-left: 28px;--notice-carousel-dots-bottom: 22px}.s-notice-carousel{position:relative;display:block;height:var(--notice-carousel-height);overflow:hidden;border:0;border-radius:var(--notice-carousel-radius);background:#0e1726}.s-notice-carousel__image{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center;opacity:0;transform:scale(1.015);transition:opacity .36s ease,transform .68s ease}.s-notice-carousel__image--active{opacity:1;transform:scale(1)}.s-notice-carousel__shade{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#071123e6,#07112380 58%,#0711231f)}.s-notice-carousel__content{position:relative;z-index:2;box-sizing:border-box;height:100%;max-width:var(--notice-carousel-content-max-width);padding:var(--notice-carousel-content-padding)}.s-notice-carousel h1{margin:0;color:#fff;font-size:var(--notice-carousel-title-size);font-weight:900;line-height:1.35}.s-notice-carousel p{display:-webkit-box;overflow:hidden;margin:9px 0 0;color:#ffffffdb;font-size:14px;line-height:1.65;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3}.s-notice-carousel__meta{position:absolute;bottom:calc(var(--notice-carousel-dots-bottom) + 32px);left:var(--notice-carousel-dots-left);display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;max-width:calc(100% - var(--notice-carousel-dots-left) - 24px);margin:0;color:#ffffffb8;font-size:13px;line-height:1.4}.s-notice-carousel__tag{display:inline-flex;min-height:18px;align-items:center;padding:1px 7px;border-radius:6px;background:#fff4e6;color:#f28705;font-size:11px;font-weight:800;line-height:1.2}.s-notice-carousel__tag[data-notice-tone=notice]{background:#e8f1ff;color:#0b72ff}.s-notice-carousel__tag[data-notice-tone=announcement]{background:#fff7ed;color:#c2410c}.s-notice-carousel__tag[data-notice-tone=publicity]{background:#ecfeff;color:#0e7490}.s-notice-carousel__tag[data-notice-tone=focus]{background:#fef3c7;color:#b45309}.s-notice-carousel__tag[data-notice-tone=vision]{background:#ecfeff;color:#0e7490}.s-notice-carousel__tag[data-notice-tone=quality]{background:#ecfdf5;color:#047857}.s-notice-carousel__tag[data-notice-tone=confidentiality]{background:#f5f3ff;color:#6d28d9}.s-notice-carousel__tag[data-notice-tone=industry]{background:#eef2ff;color:#4338ca}.s-notice-carousel__tag[data-notice-tone=subsidiary]{background:#fdf2f8;color:#be185d}.s-notice-carousel__meta span+span:before{display:inline-block;width:4px;height:4px;margin-right:10px;border-radius:999px;background:#ffffff6b;content:\"\";vertical-align:2px}.s-notice-carousel__dots{position:absolute;bottom:var(--notice-carousel-dots-bottom);left:var(--notice-carousel-dots-left);z-index:3;display:inline-flex;gap:10px}.s-notice-carousel__dot{position:relative;width:22px;height:14px;padding:0;border:0;border-radius:999px;background:transparent;cursor:pointer;transition:width .18s ease,transform .18s ease}.s-notice-carousel__dot:before{position:absolute;inset:4px 0 5px;border-radius:inherit;background:#ffffff85;content:\"\";transition:background-color .18s ease}.s-notice-carousel__dot:hover,.s-notice-carousel__dot:focus-visible{transform:translateY(-1px)}.s-notice-carousel__dot:hover:before,.s-notice-carousel__dot:focus-visible:before{background:#ffffffd1}.s-notice-carousel__dot:focus-visible{outline:2px solid rgba(255,255,255,.9);outline-offset:3px}.s-notice-carousel__dot--active{width:28px}.s-notice-carousel__dot--active:before{background:#1683ff}.s-notice-carousel__action{position:absolute;right:var(--notice-carousel-action-right);bottom:var(--notice-carousel-action-bottom);z-index:2;display:inline-flex;height:36px;align-items:center;gap:4px;padding:0 14px;border:0;border-radius:8px;background:#0b72ff;color:#fff;cursor:pointer;font-size:14px;font-weight:800;white-space:nowrap}.s-notice-carousel--text-only{border:1px solid rgba(226,232,240,.82);background:#fff}.s-notice-carousel--text-only .s-notice-carousel__shade{display:none}.s-notice-carousel--text-only .s-notice-carousel__content{max-width:780px}.s-notice-carousel--text-only h1{color:#111827}.s-notice-carousel--text-only p{color:#334155}.s-notice-carousel--text-only .s-notice-carousel__meta{color:#64748b}.s-notice-carousel--text-only .s-notice-carousel__meta span+span:before,.s-notice-carousel--text-only .s-notice-carousel__dot:before{background:#cbd5e1}.s-notice-carousel--text-only .s-notice-carousel__dot:hover:before,.s-notice-carousel--text-only .s-notice-carousel__dot:focus-visible:before{background:#94a3b8}.s-notice-carousel--text-only .s-notice-carousel__dot:focus-visible{outline-color:#0b72ff59}.s-notice-carousel--text-only .s-notice-carousel__dot--active:before{background:#0b72ff}\n"], dependencies: [{ kind: "ngmodule", type: LucideAngularModule }, { kind: "component", type: i1.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: MProductShellBottomSlot, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[mProductShellBottom]',
-                }]
-        }] });
-class MProductShell {
-    hosted = input(false, ...(ngDevMode ? [{ debugName: "hosted" }] : /* istanbul ignore next */ []));
-    mobile = input(false, ...(ngDevMode ? [{ debugName: "mobile" }] : /* istanbul ignore next */ []));
-    mobileSubpage = input(false, ...(ngDevMode ? [{ debugName: "mobileSubpage" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: MProductShell, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.8", type: MProductShell, isStandalone: true, selector: "m-product-shell", inputs: { hosted: { classPropertyName: "hosted", publicName: "hosted", isSignal: true, isRequired: false, transformFunction: null }, mobile: { classPropertyName: "mobile", publicName: "mobile", isSignal: true, isRequired: false, transformFunction: null }, mobileSubpage: { classPropertyName: "mobileSubpage", publicName: "mobileSubpage", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<section\r\n  class=\"m-product-shell\"\r\n  [class.m-product-shell--hosted]=\"hosted()\"\r\n  [class.m-product-shell--mobile]=\"mobile()\"\r\n  [class.m-product-shell--mobile-subpage]=\"mobileSubpage()\"\r\n>\r\n  <ng-content select=\"[mProductShellRail]\" />\r\n\r\n  <main class=\"m-product-shell__main\">\r\n    <ng-content select=\"[mProductShellMain]\" />\r\n  </main>\r\n\r\n  <footer class=\"m-product-shell__bottom-dock\">\r\n    <ng-content select=\"[mProductShellBottom]\" />\r\n  </footer>\r\n</section>\r\n", styles: ["m-product-shell{display:block;height:100%;min-height:0}m-product-shell,m-product-shell *{box-sizing:border-box}.m-product-shell{--m-header-gap: 16px;--m-header-min-height: auto;--m-header-padding-y: 0px;--m-header-toolbar-padding-y: 10px;--m-header-toolbar-padding-bottom: 0px;--m-header-title-size: 26px;--m-header-title-weight: 820;--m-header-title-line-height: 1.2;--m-header-description-color: var(--app-muted, #667085);--m-header-description-size: 13px;--m-header-description-gap: 5px;--m-header-icon-size: 34px;--m-header-icon-radius: 999px;--m-header-icon-hover-bg: #f1f4fb;--m-header-icon-active-bg: #f0f2f6;--m-header-action-gap: 10px;--app-border: #d8e1ec;--app-border-strong: #bfccd9;--app-bg: #eef2f7;--app-panel: #f8fafc;--app-panel-strong: #ffffff;--app-primary: var(--color-primary);--app-primary-soft: #e2f0ff;--app-text: #172033;--app-muted: #667085;display:grid;grid-template-columns:78px minmax(0,1fr);height:100%;min-height:0;overflow:hidden;background:var(--app-bg);color:var(--app-text);line-height:1.4}.m-product-shell--hosted{grid-template-columns:minmax(0,1fr)}.m-product-shell__main{min-width:0;min-height:0;overflow:hidden}.m-product-shell__main>router-outlet+*{display:block;height:100%;min-height:0}.m-product-shell--mobile{--m-product-shell-mobile-page-x: 20px;--m-header-min-height: 44px;--m-header-toolbar-row-height: 44px;--m-header-title-color: #111318;--m-header-title-size: 28px;--m-header-title-weight: 850;--m-header-title-line-height: 36px;--m-header-icon-size: 38px;--m-header-icon-hover-bg: transparent;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;width:100%;max-width:100vw;height:100dvh;min-height:100dvh;overflow:hidden;background:var(--app-panel-strong)}.m-product-shell--hosted.m-product-shell--mobile,.m-product-shell--mobile-subpage{grid-template-rows:minmax(0,1fr)}.m-product-shell--mobile .m-product-shell__main{grid-row:1}.m-product-shell--mobile m-header .m-header__actions{gap:12px;margin-right:-4px}.m-product-shell--mobile m-page>.m-page__frame>.m-page__header>m-header:not(.sidebar-top):not(.m-header--sidebar){--m-header-padding-x: var(--m-product-shell-mobile-page-x)}.m-product-shell__bottom-dock{position:relative;z-index:20;grid-row:2;min-width:0;min-height:76px;border-top:1px solid #f1f2f6;background:#fff}.m-product-shell__bottom-dock:empty{display:none}.m-product-shell--mobile-subpage .m-product-shell__bottom-dock{display:none}.m-product-shell--mobile>.m-product-shell__bottom-dock m-bottom-nav{--bottom-nav-shadow: none;--bottom-nav-tabs-grid-auto-columns: minmax(0, 1fr);--bottom-nav-tabs-padding: 6px 14px calc(7px + env(safe-area-inset-bottom, 0px)) ;--bottom-nav-tabs-item-gap: 4px;--bottom-nav-tabs-item-min-height: 58px;--bottom-nav-tabs-item-padding: 4px 0 0;--bottom-nav-tabs-color: #6f7787;--bottom-nav-tabs-active-color: #6257ff;--bottom-nav-tabs-icon-size: 25px;--bottom-nav-tabs-icon-stroke-width: 1.8;--bottom-nav-tabs-font-size: 12px;--bottom-nav-tabs-font-weight: 600;--bottom-nav-tabs-label-overflow: visible;--bottom-nav-tabs-label-text-overflow: clip;display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: MProductShell, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NoticeCarousel, decorators: [{
             type: Component,
-            args: [{ selector: 'm-product-shell', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<section\r\n  class=\"m-product-shell\"\r\n  [class.m-product-shell--hosted]=\"hosted()\"\r\n  [class.m-product-shell--mobile]=\"mobile()\"\r\n  [class.m-product-shell--mobile-subpage]=\"mobileSubpage()\"\r\n>\r\n  <ng-content select=\"[mProductShellRail]\" />\r\n\r\n  <main class=\"m-product-shell__main\">\r\n    <ng-content select=\"[mProductShellMain]\" />\r\n  </main>\r\n\r\n  <footer class=\"m-product-shell__bottom-dock\">\r\n    <ng-content select=\"[mProductShellBottom]\" />\r\n  </footer>\r\n</section>\r\n", styles: ["m-product-shell{display:block;height:100%;min-height:0}m-product-shell,m-product-shell *{box-sizing:border-box}.m-product-shell{--m-header-gap: 16px;--m-header-min-height: auto;--m-header-padding-y: 0px;--m-header-toolbar-padding-y: 10px;--m-header-toolbar-padding-bottom: 0px;--m-header-title-size: 26px;--m-header-title-weight: 820;--m-header-title-line-height: 1.2;--m-header-description-color: var(--app-muted, #667085);--m-header-description-size: 13px;--m-header-description-gap: 5px;--m-header-icon-size: 34px;--m-header-icon-radius: 999px;--m-header-icon-hover-bg: #f1f4fb;--m-header-icon-active-bg: #f0f2f6;--m-header-action-gap: 10px;--app-border: #d8e1ec;--app-border-strong: #bfccd9;--app-bg: #eef2f7;--app-panel: #f8fafc;--app-panel-strong: #ffffff;--app-primary: var(--color-primary);--app-primary-soft: #e2f0ff;--app-text: #172033;--app-muted: #667085;display:grid;grid-template-columns:78px minmax(0,1fr);height:100%;min-height:0;overflow:hidden;background:var(--app-bg);color:var(--app-text);line-height:1.4}.m-product-shell--hosted{grid-template-columns:minmax(0,1fr)}.m-product-shell__main{min-width:0;min-height:0;overflow:hidden}.m-product-shell__main>router-outlet+*{display:block;height:100%;min-height:0}.m-product-shell--mobile{--m-product-shell-mobile-page-x: 20px;--m-header-min-height: 44px;--m-header-toolbar-row-height: 44px;--m-header-title-color: #111318;--m-header-title-size: 28px;--m-header-title-weight: 850;--m-header-title-line-height: 36px;--m-header-icon-size: 38px;--m-header-icon-hover-bg: transparent;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;width:100%;max-width:100vw;height:100dvh;min-height:100dvh;overflow:hidden;background:var(--app-panel-strong)}.m-product-shell--hosted.m-product-shell--mobile,.m-product-shell--mobile-subpage{grid-template-rows:minmax(0,1fr)}.m-product-shell--mobile .m-product-shell__main{grid-row:1}.m-product-shell--mobile m-header .m-header__actions{gap:12px;margin-right:-4px}.m-product-shell--mobile m-page>.m-page__frame>.m-page__header>m-header:not(.sidebar-top):not(.m-header--sidebar){--m-header-padding-x: var(--m-product-shell-mobile-page-x)}.m-product-shell__bottom-dock{position:relative;z-index:20;grid-row:2;min-width:0;min-height:76px;border-top:1px solid #f1f2f6;background:#fff}.m-product-shell__bottom-dock:empty{display:none}.m-product-shell--mobile-subpage .m-product-shell__bottom-dock{display:none}.m-product-shell--mobile>.m-product-shell__bottom-dock m-bottom-nav{--bottom-nav-shadow: none;--bottom-nav-tabs-grid-auto-columns: minmax(0, 1fr);--bottom-nav-tabs-padding: 6px 14px calc(7px + env(safe-area-inset-bottom, 0px)) ;--bottom-nav-tabs-item-gap: 4px;--bottom-nav-tabs-item-min-height: 58px;--bottom-nav-tabs-item-padding: 4px 0 0;--bottom-nav-tabs-color: #6f7787;--bottom-nav-tabs-active-color: #6257ff;--bottom-nav-tabs-icon-size: 25px;--bottom-nav-tabs-icon-stroke-width: 1.8;--bottom-nav-tabs-font-size: 12px;--bottom-nav-tabs-font-weight: 600;--bottom-nav-tabs-label-overflow: visible;--bottom-nav-tabs-label-text-overflow: clip;display:block}\n"] }]
-        }], propDecorators: { hosted: [{ type: i0.Input, args: [{ isSignal: true, alias: "hosted", required: false }] }], mobile: [{ type: i0.Input, args: [{ isSignal: true, alias: "mobile", required: false }] }], mobileSubpage: [{ type: i0.Input, args: [{ isSignal: true, alias: "mobileSubpage", required: false }] }] } });
+            args: [{ selector: 's-notice-carousel', imports: [LucideAngularModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (slides().length) {\n  <section\n    class=\"s-notice-carousel\"\n    [class.s-notice-carousel--text-only]=\"!activeSlide().image\"\n    [attr.aria-label]=\"ariaLabel()\"\n    (mouseenter)=\"pauseCarousel()\"\n    (mouseleave)=\"resumeCarousel()\"\n  >\n    @for (slide of slides(); track slideTrackKey($index, slide); let index = $index) {\n      @if (slide.image) {\n        <img\n          class=\"s-notice-carousel__image\"\n          [class.s-notice-carousel__image--active]=\"index === activeIndex()\"\n          [src]=\"slide.image\"\n          [alt]=\"slide.title\"\n        />\n      }\n    }\n\n    <div class=\"s-notice-carousel__shade\"></div>\n\n    <div class=\"s-notice-carousel__content\">\n      <h1>{{ activeSlide().title }}</h1>\n      @if (activeSlide().summary) {\n        <p>{{ activeSlide().summary }}</p>\n      }\n      @if (activeMeta().length) {\n        <div class=\"s-notice-carousel__meta\">\n          @for (item of activeMeta(); track $index; let first = $first; let index = $index) {\n            <span\n              [class.s-notice-carousel__tag]=\"first\"\n              [attr.data-notice-tone]=\"first ? metaTone(index) : null\"\n            >\n              {{ item }}\n            </span>\n          }\n        </div>\n      }\n\n      <div class=\"s-notice-carousel__dots\" role=\"tablist\" [attr.aria-label]=\"ariaLabel() + '\u8F6E\u64AD'\">\n        @for (slide of slides(); track slideTrackKey($index, slide); let index = $index) {\n          <button\n            class=\"s-notice-carousel__dot\"\n            [class.s-notice-carousel__dot--active]=\"index === activeIndex()\"\n            type=\"button\"\n            role=\"tab\"\n            [attr.aria-selected]=\"index === activeIndex()\"\n            [attr.aria-label]=\"'\u5207\u6362' + ariaLabel() + ' ' + (index + 1)\"\n            (click)=\"selectSlide(index)\"\n          ></button>\n        }\n      </div>\n    </div>\n\n    <button class=\"s-notice-carousel__action\" type=\"button\" (click)=\"selectDetail()\">\n      {{ actionText() }}\n      <lucide-icon aria-hidden=\"true\" [img]=\"chevronRightIcon\" [size]=\"16\" [strokeWidth]=\"2\" />\n    </button>\n  </section>\n}\n", styles: [":host{display:block;--notice-carousel-height: 252px;--notice-carousel-radius: 8px;--notice-carousel-content-max-width: 620px;--notice-carousel-content-padding: 32px 28px 74px;--notice-carousel-title-size: 26px;--notice-carousel-action-right: 20px;--notice-carousel-action-bottom: 20px;--notice-carousel-dots-left: 28px;--notice-carousel-dots-bottom: 22px}.s-notice-carousel{position:relative;display:block;height:var(--notice-carousel-height);overflow:hidden;border:0;border-radius:var(--notice-carousel-radius);background:#0e1726}.s-notice-carousel__image{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center;opacity:0;transform:scale(1.015);transition:opacity .36s ease,transform .68s ease}.s-notice-carousel__image--active{opacity:1;transform:scale(1)}.s-notice-carousel__shade{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#071123e6,#07112380 58%,#0711231f)}.s-notice-carousel__content{position:relative;z-index:2;box-sizing:border-box;height:100%;max-width:var(--notice-carousel-content-max-width);padding:var(--notice-carousel-content-padding)}.s-notice-carousel h1{margin:0;color:#fff;font-size:var(--notice-carousel-title-size);font-weight:900;line-height:1.35}.s-notice-carousel p{display:-webkit-box;overflow:hidden;margin:9px 0 0;color:#ffffffdb;font-size:14px;line-height:1.65;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3}.s-notice-carousel__meta{position:absolute;bottom:calc(var(--notice-carousel-dots-bottom) + 32px);left:var(--notice-carousel-dots-left);display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;max-width:calc(100% - var(--notice-carousel-dots-left) - 24px);margin:0;color:#ffffffb8;font-size:13px;line-height:1.4}.s-notice-carousel__tag{display:inline-flex;min-height:18px;align-items:center;padding:1px 7px;border-radius:6px;background:#fff4e6;color:#f28705;font-size:11px;font-weight:800;line-height:1.2}.s-notice-carousel__tag[data-notice-tone=notice]{background:#e8f1ff;color:#0b72ff}.s-notice-carousel__tag[data-notice-tone=announcement]{background:#fff7ed;color:#c2410c}.s-notice-carousel__tag[data-notice-tone=publicity]{background:#ecfeff;color:#0e7490}.s-notice-carousel__tag[data-notice-tone=focus]{background:#fef3c7;color:#b45309}.s-notice-carousel__tag[data-notice-tone=vision]{background:#ecfeff;color:#0e7490}.s-notice-carousel__tag[data-notice-tone=quality]{background:#ecfdf5;color:#047857}.s-notice-carousel__tag[data-notice-tone=confidentiality]{background:#f5f3ff;color:#6d28d9}.s-notice-carousel__tag[data-notice-tone=industry]{background:#eef2ff;color:#4338ca}.s-notice-carousel__tag[data-notice-tone=subsidiary]{background:#fdf2f8;color:#be185d}.s-notice-carousel__meta span+span:before{display:inline-block;width:4px;height:4px;margin-right:10px;border-radius:999px;background:#ffffff6b;content:\"\";vertical-align:2px}.s-notice-carousel__dots{position:absolute;bottom:var(--notice-carousel-dots-bottom);left:var(--notice-carousel-dots-left);z-index:3;display:inline-flex;gap:10px}.s-notice-carousel__dot{position:relative;width:22px;height:14px;padding:0;border:0;border-radius:999px;background:transparent;cursor:pointer;transition:width .18s ease,transform .18s ease}.s-notice-carousel__dot:before{position:absolute;inset:4px 0 5px;border-radius:inherit;background:#ffffff85;content:\"\";transition:background-color .18s ease}.s-notice-carousel__dot:hover,.s-notice-carousel__dot:focus-visible{transform:translateY(-1px)}.s-notice-carousel__dot:hover:before,.s-notice-carousel__dot:focus-visible:before{background:#ffffffd1}.s-notice-carousel__dot:focus-visible{outline:2px solid rgba(255,255,255,.9);outline-offset:3px}.s-notice-carousel__dot--active{width:28px}.s-notice-carousel__dot--active:before{background:#1683ff}.s-notice-carousel__action{position:absolute;right:var(--notice-carousel-action-right);bottom:var(--notice-carousel-action-bottom);z-index:2;display:inline-flex;height:36px;align-items:center;gap:4px;padding:0 14px;border:0;border-radius:8px;background:#0b72ff;color:#fff;cursor:pointer;font-size:14px;font-weight:800;white-space:nowrap}.s-notice-carousel--text-only{border:1px solid rgba(226,232,240,.82);background:#fff}.s-notice-carousel--text-only .s-notice-carousel__shade{display:none}.s-notice-carousel--text-only .s-notice-carousel__content{max-width:780px}.s-notice-carousel--text-only h1{color:#111827}.s-notice-carousel--text-only p{color:#334155}.s-notice-carousel--text-only .s-notice-carousel__meta{color:#64748b}.s-notice-carousel--text-only .s-notice-carousel__meta span+span:before,.s-notice-carousel--text-only .s-notice-carousel__dot:before{background:#cbd5e1}.s-notice-carousel--text-only .s-notice-carousel__dot:hover:before,.s-notice-carousel--text-only .s-notice-carousel__dot:focus-visible:before{background:#94a3b8}.s-notice-carousel--text-only .s-notice-carousel__dot:focus-visible{outline-color:#0b72ff59}.s-notice-carousel--text-only .s-notice-carousel__dot--active:before{background:#0b72ff}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { slides: [{ type: i0.Input, args: [{ isSignal: true, alias: "slides", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], actionText: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionText", required: false }] }], intervalMs: [{ type: i0.Input, args: [{ isSignal: true, alias: "intervalMs", required: false }] }], detailSelected: [{ type: i0.Output, args: ["detailSelected"] }] } });
 
 const DEFAULT_PAGE_SIZE_OPTIONS = [10, 20, 50, 100];
 function coerceTotalItems(value) {
@@ -5787,6 +6830,864 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
             args: [{ selector: 's-pagination', imports: [FormsModule, ReactiveFormsModule, BsSelect, LucideAngularModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"pagination-bar\" [class.pagination-bar--compact]=\"isCompact()\">\r\n  <div class=\"pagination-controls\">\r\n    <div class=\"pagination-total\">\u5171 {{ totalItems() }} \u6761</div>\r\n    <button\r\n      type=\"button\"\r\n      class=\"pagination-nav-btn pagination-nav-btn--prev\"\r\n      [class.pagination-nav-btn--compact]=\"isCompact()\"\r\n      [disabled]=\"!canGoPrev()\"\r\n      (click)=\"prevPage()\"\r\n      aria-label=\"\u4E0A\u4E00\u9875\"\r\n    >\r\n      <lucide-icon [img]=\"prevIcon\" [size]=\"16\" [strokeWidth]=\"2\" aria-hidden=\"true\"></lucide-icon>\r\n    </button>\r\n    @for (page of pages(); track trackPage($index, page)) {\r\n      @if (page === '...') {\r\n        <span class=\"pagination-ellipsis\" [class.pagination-ellipsis--compact]=\"isCompact()\">...</span>\r\n      } @else {\r\n        <button\r\n          type=\"button\"\r\n          class=\"pagination-page-btn\"\r\n          [class.pagination-page-btn--compact]=\"isCompact()\"\r\n          [class.pagination-page-btn--active]=\"page === currentPage()\"\r\n          [disabled]=\"disabled()\"\r\n          (click)=\"goToPage(page)\"\r\n        >\r\n          {{ page }}\r\n        </button>\r\n      }\r\n    }\r\n    <button\r\n      type=\"button\"\r\n      class=\"pagination-nav-btn\"\r\n      [class.pagination-nav-btn--compact]=\"isCompact()\"\r\n      [disabled]=\"!canGoNext()\"\r\n      (click)=\"nextPage()\"\r\n      aria-label=\"\u4E0B\u4E00\u9875\"\r\n    >\r\n      <lucide-icon [img]=\"nextIcon\" [size]=\"16\" [strokeWidth]=\"2\" aria-hidden=\"true\"></lucide-icon>\r\n    </button>\r\n    @if (showSizeChanger()) {\r\n      <div class=\"pagination-size\" [class.pagination-size--compact]=\"isCompact()\">\r\n        <s-select\r\n          class=\"pagination-size-select\"\r\n          [options]=\"pageSizeSelectOptions()\"\r\n          [formControl]=\"pageSizeControl\"\r\n          placeholder=\"\u6761\u6570/\u9875\"\r\n          ariaLabel=\"\u6BCF\u9875\u6761\u6570\"\r\n          [matchTriggerWidth]=\"false\"\r\n        />\r\n      </div>\r\n    }\r\n    @if (showQuickJumper()) {\r\n      <label class=\"pagination-jumper\" [class.pagination-jumper--compact]=\"isCompact()\">\r\n        <span class=\"pagination-jumper__label\">\u8DF3\u81F3</span>\r\n        <input\r\n          type=\"number\"\r\n          min=\"1\"\r\n          class=\"pagination-jumper__input\"\r\n          [formControl]=\"quickJumpControl\"\r\n          (blur)=\"quickJump()\"\r\n          (keydown.enter)=\"quickJump()\"\r\n        />\r\n        <span class=\"pagination-jumper__suffix\">\u9875</span>\r\n      </label>\r\n    }\r\n  </div>\r\n</div>\r\n", styles: [":host{display:block;width:100%;max-width:100%;min-width:0}.pagination-bar{box-sizing:border-box;width:100%;max-width:100%;min-width:0}.pagination-controls{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap;min-width:0}.pagination-total,.pagination-jumper__label,.pagination-jumper__suffix{color:var(--color-text-secondary);font-size:13px;line-height:22px}.pagination-nav-btn,.pagination-page-btn,.pagination-size-select,.pagination-jumper__input{box-sizing:border-box;height:30px;border-radius:6px;font-size:13px;line-height:20px;transition:border-color .16s ease,color .16s ease,background-color .16s ease,box-shadow .16s ease}.pagination-nav-btn,.pagination-page-btn{min-width:30px;padding:0 6px;border:1px solid transparent;background:transparent;color:var(--color-text-secondary);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.pagination-nav-btn{width:30px;padding-left:0;padding-right:0}.pagination-nav-btn lucide-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.pagination-nav-btn:hover:not(:disabled),.pagination-page-btn:hover:not(:disabled),.pagination-size-select:hover:not(:disabled),.pagination-jumper__input:hover:not(:disabled){border-color:var(--color-border);background:var(--color-surface-soft);color:var(--color-text-primary)}.pagination-nav-btn:focus-visible,.pagination-page-btn:focus-visible,.pagination-jumper__input:focus-visible{border-color:var(--color-primary);outline:none;box-shadow:0 0 0 2px var(--color-primary-subtle)}.pagination-nav-btn:disabled,.pagination-page-btn:disabled,.pagination-size-select:disabled,.pagination-jumper__input:disabled{color:rgba(var(--color-text-secondary),.35);border-color:rgba(var(--color-border),.8);background:var(--color-surface-soft);cursor:not-allowed}.pagination-page-btn--active{border-color:var(--color-primary-subtle);background:var(--color-primary-subtle);color:var(--color-primary);font-weight:var(--font-weight-medium)}.pagination-page-btn--active:hover:not(:disabled){border-color:var(--color-primary-subtle);background:var(--color-primary-subtle);color:var(--color-primary)}.pagination-ellipsis{min-width:30px;height:30px;padding:0 6px;display:inline-flex;align-items:center;justify-content:center;color:var(--color-text-secondary);font-size:13px;line-height:22px}.pagination-size{display:inline-flex;align-items:center;margin-left:4px;height:30px}.pagination-size-select{display:inline-flex;align-items:center;vertical-align:middle;--bs-select-height: 30px;--bs-select-radius: 6px;--bs-select-padding-x: 9px;--bs-select-indicator-offset: 10px;--bs-select-font-size: 13px;--bs-select-line-height: 20px;--bs-select-trigger-width: 6.25rem;--bs-select-trigger-min-width: 6.25rem;--bs-select-popup-min-width: 7.25rem;--platform-control-border: var(--color-border);--platform-control-bg-hover: var(--color-surface);--platform-control-focus-ring: transparent}.pagination-size-select ::ng-deep .bs-select__trigger{align-items:center}.pagination-size-select ::ng-deep .bs-select__label{align-items:center}.pagination-jumper{display:inline-flex;align-items:center;gap:4px;margin-left:4px}.pagination-jumper__input{width:62px;padding:0 12px;border:1px solid transparent;background:var(--color-surface);color:var(--color-text-primary);outline:none}.pagination-jumper__input:focus{border-color:var(--color-primary)}.pagination-jumper__input::-webkit-outer-spin-button,.pagination-jumper__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.pagination-jumper__input[type=number]{-moz-appearance:textfield}.pagination-bar--compact .pagination-controls{justify-content:flex-start;gap:12px}.pagination-nav-btn--compact,.pagination-page-btn--compact{min-width:auto;height:auto;padding:0;border:0;background:transparent}.pagination-nav-btn--compact{width:24px}.pagination-page-btn--compact{width:auto;padding:0 8px}.pagination-page-btn--compact.pagination-page-btn--active{min-width:30px;height:30px;padding:0 12px;border:1px solid var(--color-primary-subtle);border-radius:6px;background:var(--color-primary-subtle)}.pagination-ellipsis--compact{min-width:auto;height:auto}.pagination-size--compact,.pagination-jumper--compact{margin-left:0}@media(max-width:768px){.pagination-controls{justify-content:flex-start;gap:6px}.pagination-total{width:100%}.pagination-bar--compact .pagination-total{width:auto}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { currentPage: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentPage", required: false }] }, { type: i0.Output, args: ["currentPageChange"] }], pageSizeOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSizeOptions", required: false }] }], totalItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalItems", required: false }] }], maxVisiblePages: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxVisiblePages", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], showSizeChanger: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSizeChanger", required: false }] }], showQuickJumper: [{ type: i0.Input, args: [{ isSignal: true, alias: "showQuickJumper", required: false }] }], pageChange: [{ type: i0.Output, args: ["pageChange"] }], pageSizeChange: [{ type: i0.Output, args: ["pageSizeChange"] }] } });
 
+const S_RICH_EDITOR_PAGEBREAK_SEPARATOR = '<!-- pagebreak -->';
+const S_RICH_EDITOR_DOCUMENT_ZOOM_TOOLBAR = 'sRichEditorZoomOut sRichEditorZoomReset sRichEditorZoomIn';
+const S_RICH_EDITOR_DOCUMENT_PAGE_METRICS = {
+    width: 794,
+    height: 1123,
+    gap: 32,
+    padding: {
+        top: 88,
+        right: 80,
+        bottom: 72,
+        left: 80,
+    },
+};
+const DOCUMENT_ZOOM_STEPS = [
+    0.5, 0.67, 0.75, 0.85, 1, 1.1, 1.25, 1.5, 1.75, 2,
+];
+const DOCUMENT_ZOOM_EVENT = 'sRichEditorDocumentZoomChange';
+const PAGEBREAK_SELECTOR = 'img.mce-pagebreak';
+const PAGEBREAK_SPACER_CLASS = 's-rich-editor-document-pagebreak';
+const AUTO_PAGEBREAK_CLASS = 's-rich-editor-document-auto-pagebreak';
+const PAGEBREAK_EPSILON = 6;
+const CONTENT_PAGEBREAK_PATTERN = /(?:<!--\s*pagebreak\s*-->|<img[^>]*class=["'][^"']*\bmce-pagebreak\b[^"']*["'][^>]*>)/gi;
+function splitRichEditorDocumentPages(html) {
+    const pages = html
+        .split(CONTENT_PAGEBREAK_PATTERN)
+        .map((page) => page.trim())
+        .filter(Boolean);
+    return pages.length ? pages : [''];
+}
+function setupRichEditorDocumentPagination(editor) {
+    let animationFrame = 0;
+    let resizeObserver = null;
+    const cancelScheduledSync = () => {
+        if (!animationFrame) {
+            return;
+        }
+        const editorWindow = getEditorWindow(editor);
+        editorWindow?.cancelAnimationFrame(animationFrame);
+        animationFrame = 0;
+    };
+    const scheduleSync = () => {
+        const editorWindow = getEditorWindow(editor);
+        if (!editorWindow) {
+            return;
+        }
+        cancelScheduledSync();
+        animationFrame = editorWindow.requestAnimationFrame(() => {
+            animationFrame = 0;
+            syncRichEditorDocumentPageBreaks(editor);
+        });
+    };
+    editor.on(`init SetContent LoadContent Change Input Undo Redo ExecCommand NodeChange ${DOCUMENT_ZOOM_EVENT}`, scheduleSync);
+    editor.on('init', () => {
+        const editorWindow = getEditorWindow(editor);
+        const ResizeObserverCtor = editorWindow?.ResizeObserver;
+        if (!editorWindow) {
+            return;
+        }
+        editorWindow.addEventListener('resize', scheduleSync);
+        if (ResizeObserverCtor) {
+            const nextResizeObserver = new ResizeObserverCtor(scheduleSync);
+            resizeObserver = nextResizeObserver;
+            nextResizeObserver.observe(editor.getBody());
+        }
+    });
+    editor.on('remove', () => {
+        cancelScheduledSync();
+        resizeObserver?.disconnect();
+        getEditorWindow(editor)?.removeEventListener('resize', scheduleSync);
+    });
+}
+function setupRichEditorDocumentZoom(editor) {
+    let zoom = 1;
+    let wheelTarget = null;
+    const applyZoom = (nextZoom) => {
+        zoom = normalizeDocumentZoom(nextZoom);
+        setRichEditorDocumentZoom(editor, zoom);
+        editor.dispatch(DOCUMENT_ZOOM_EVENT, { zoom });
+    };
+    const updateZoomByStep = (direction) => {
+        applyZoom(readNextDocumentZoomStep(zoom, direction));
+    };
+    const onWheel = (event) => {
+        if (!event.ctrlKey && !event.metaKey) {
+            return;
+        }
+        event.preventDefault();
+        updateZoomByStep(event.deltaY < 0 ? 1 : -1);
+    };
+    editor.ui.registry.addButton('sRichEditorZoomOut', {
+        icon: 'zoom-out',
+        tooltip: 'Zoom out',
+        onAction: () => updateZoomByStep(-1),
+        onSetup: (api) => {
+            const updateState = () => {
+                api.setEnabled(zoom > DOCUMENT_ZOOM_STEPS[0]);
+            };
+            editor.on(DOCUMENT_ZOOM_EVENT, updateState);
+            updateState();
+            return () => editor.off(DOCUMENT_ZOOM_EVENT, updateState);
+        },
+    });
+    editor.ui.registry.addButton('sRichEditorZoomReset', {
+        text: '100%',
+        tooltip: 'Reset zoom',
+        onAction: () => applyZoom(1),
+        onSetup: (api) => {
+            const updateState = () => {
+                api.setText(`${Math.round(zoom * 100)}%`);
+            };
+            editor.on(DOCUMENT_ZOOM_EVENT, updateState);
+            updateState();
+            return () => editor.off(DOCUMENT_ZOOM_EVENT, updateState);
+        },
+    });
+    editor.ui.registry.addButton('sRichEditorZoomIn', {
+        icon: 'zoom-in',
+        tooltip: 'Zoom in',
+        onAction: () => updateZoomByStep(1),
+        onSetup: (api) => {
+            const updateState = () => {
+                api.setEnabled(zoom < DOCUMENT_ZOOM_STEPS[DOCUMENT_ZOOM_STEPS.length - 1]);
+            };
+            editor.on(DOCUMENT_ZOOM_EVENT, updateState);
+            updateState();
+            return () => editor.off(DOCUMENT_ZOOM_EVENT, updateState);
+        },
+    });
+    editor.on('init', () => {
+        wheelTarget = editor.getBody();
+        wheelTarget.addEventListener('wheel', onWheel, { passive: false });
+        applyZoom(zoom);
+    });
+    editor.on('remove', () => {
+        wheelTarget?.removeEventListener('wheel', onWheel);
+        wheelTarget = null;
+    });
+}
+function getEditorWindow(editor) {
+    try {
+        return editor.getWin();
+    }
+    catch {
+        return null;
+    }
+}
+function syncRichEditorDocumentPageBreaks(editor) {
+    const body = editor.getBody();
+    const zoom = readDocumentZoom(body);
+    const metrics = scaleDocumentPageMetrics(readDocumentPageMetrics(body), zoom);
+    removeAutoPageBreaks(body);
+    syncManualPageBreaks(body, metrics, zoom);
+    insertAutoPageBreaks(body, metrics, zoom);
+    syncManualPageBreaks(body, metrics, zoom);
+}
+function syncManualPageBreaks(body, metrics, zoom) {
+    const bodyRect = body.getBoundingClientRect();
+    const pageBreaks = Array.from(body.querySelectorAll(PAGEBREAK_SELECTOR));
+    const pageStride = metrics.height + metrics.gap;
+    let pageStart = 0;
+    for (const pageBreak of pageBreaks) {
+        const spacer = resolvePageBreakSpacer(pageBreak);
+        const top = spacer.getBoundingClientRect().top - bodyRect.top;
+        const naturalPageStart = Math.floor(Math.max(top, 0) / pageStride) * pageStride;
+        pageStart = Math.max(pageStart, naturalPageStart);
+        const fillHeight = Math.max(0, pageStart + metrics.height - top);
+        const pageBreakHeight = fillHeight + metrics.gap + metrics.padding.top;
+        setPageBreakStyle(spacer, fillHeight, pageBreakHeight, zoom);
+        pageStart += pageStride;
+    }
+}
+function insertAutoPageBreaks(body, metrics, zoom) {
+    const maxAutoPageBreaks = Math.max(1, body.children.length);
+    for (let index = 0; index < maxAutoPageBreaks; index += 1) {
+        const pageBreak = findAutoPageBreakTarget(body, metrics);
+        if (!pageBreak) {
+            return;
+        }
+        const spacer = createAutoPageBreak(body.ownerDocument);
+        pageBreak.element.before(spacer);
+        setPageBreakStyle(spacer, pageBreak.fillHeight, pageBreak.height, zoom);
+    }
+}
+function findAutoPageBreakTarget(body, metrics) {
+    const bodyRect = body.getBoundingClientRect();
+    const pageStride = metrics.height + metrics.gap;
+    let pageStart = 0;
+    for (const childElement of Array.from(body.children)) {
+        const child = childElement;
+        const rect = child.getBoundingClientRect();
+        const top = rect.top - bodyRect.top;
+        const bottom = rect.bottom - bodyRect.top;
+        if (child.classList.contains(PAGEBREAK_SPACER_CLASS)) {
+            pageStart = Math.max(pageStart + pageStride, Math.floor(Math.max(bottom, 0) / pageStride) * pageStride);
+            continue;
+        }
+        if (!isPaginationElement(child)) {
+            continue;
+        }
+        while (top >= pageStart + pageStride + metrics.padding.top) {
+            pageStart += pageStride;
+        }
+        const pageContentTop = pageStart + metrics.padding.top;
+        const pageContentBottom = pageStart + metrics.height - metrics.padding.bottom;
+        if (top > pageContentTop + PAGEBREAK_EPSILON &&
+            bottom > pageContentBottom + PAGEBREAK_EPSILON) {
+            const fillHeight = Math.max(0, pageStart + metrics.height - top);
+            return {
+                element: child,
+                fillHeight,
+                height: fillHeight + metrics.gap + metrics.padding.top,
+            };
+        }
+    }
+    return null;
+}
+function isPaginationElement(element) {
+    if (element.classList.contains(AUTO_PAGEBREAK_CLASS)) {
+        return false;
+    }
+    if (element.getAttribute('data-mce-bogus') === 'all') {
+        return false;
+    }
+    return element.getBoundingClientRect().height > 0;
+}
+function createAutoPageBreak(document) {
+    const spacer = document.createElement('div');
+    spacer.classList.add(PAGEBREAK_SPACER_CLASS, AUTO_PAGEBREAK_CLASS);
+    spacer.setAttribute('contenteditable', 'false');
+    spacer.setAttribute('data-mce-contenteditable', 'false');
+    spacer.setAttribute('data-mce-bogus', 'all');
+    spacer.setAttribute('aria-hidden', 'true');
+    return spacer;
+}
+function removeAutoPageBreaks(body) {
+    for (const pageBreak of Array.from(body.querySelectorAll(`.${AUTO_PAGEBREAK_CLASS}`))) {
+        pageBreak.remove();
+    }
+}
+function resolvePageBreakSpacer(pageBreak) {
+    const parent = pageBreak.parentElement;
+    if (parent &&
+        parent.children.length === 1 &&
+        parent.textContent?.trim() === '') {
+        preparePageBreakSpacer(parent, pageBreak);
+        return parent;
+    }
+    preparePageBreakSpacer(pageBreak, pageBreak);
+    return pageBreak;
+}
+function preparePageBreakSpacer(spacer, pageBreak) {
+    spacer.classList.add(PAGEBREAK_SPACER_CLASS);
+    spacer.setAttribute('contenteditable', 'false');
+    spacer.setAttribute('data-mce-contenteditable', 'false');
+    pageBreak.setAttribute('aria-hidden', 'true');
+}
+function setRichEditorDocumentZoom(editor, zoom) {
+    const body = editor.getBody();
+    const normalizedZoom = formatZoom(zoom);
+    body.style.setProperty('--s-rich-editor-document-zoom', normalizedZoom);
+    body.style.setProperty('zoom', normalizedZoom);
+}
+function readNextDocumentZoomStep(currentZoom, direction) {
+    const normalizedZoom = normalizeDocumentZoom(currentZoom);
+    if (direction > 0) {
+        return (DOCUMENT_ZOOM_STEPS.find((step) => step > normalizedZoom + 0.001) ??
+            DOCUMENT_ZOOM_STEPS[DOCUMENT_ZOOM_STEPS.length - 1]);
+    }
+    return ([...DOCUMENT_ZOOM_STEPS]
+        .reverse()
+        .find((step) => step < normalizedZoom - 0.001) ??
+        DOCUMENT_ZOOM_STEPS[0]);
+}
+function normalizeDocumentZoom(zoom) {
+    const minZoom = DOCUMENT_ZOOM_STEPS[0];
+    const maxZoom = DOCUMENT_ZOOM_STEPS[DOCUMENT_ZOOM_STEPS.length - 1];
+    const nextZoom = Number.isFinite(zoom) ? zoom : 1;
+    return Math.max(minZoom, Math.min(maxZoom, Number(nextZoom.toFixed(2))));
+}
+function formatZoom(zoom) {
+    return `${normalizeDocumentZoom(zoom)}`;
+}
+function scaleDocumentPageMetrics(metrics, zoom) {
+    return {
+        width: scaleCssPixel(metrics.width, zoom),
+        height: scaleCssPixel(metrics.height, zoom),
+        gap: scaleCssPixel(metrics.gap, zoom),
+        padding: {
+            top: scaleCssPixel(metrics.padding.top, zoom),
+            right: scaleCssPixel(metrics.padding.right, zoom),
+            bottom: scaleCssPixel(metrics.padding.bottom, zoom),
+            left: scaleCssPixel(metrics.padding.left, zoom),
+        },
+    };
+}
+function scaleCssPixel(value, zoom) {
+    return Number((value * zoom).toFixed(2));
+}
+function readDocumentZoom(body) {
+    const styles = body.ownerDocument.defaultView?.getComputedStyle(body);
+    if (!styles) {
+        return 1;
+    }
+    const parsedZoom = Number.parseFloat(styles.getPropertyValue('--s-rich-editor-document-zoom'));
+    return normalizeDocumentZoom(Number.isFinite(parsedZoom) ? parsedZoom : 1);
+}
+function readDocumentPageMetrics(body) {
+    const styles = body.ownerDocument.defaultView?.getComputedStyle(body);
+    const fallback = S_RICH_EDITOR_DOCUMENT_PAGE_METRICS;
+    if (!styles) {
+        return fallback;
+    }
+    return {
+        width: readCssPixel(styles, '--s-rich-editor-document-page-width', fallback.width),
+        height: readCssPixel(styles, '--s-rich-editor-document-page-height', fallback.height),
+        gap: readCssPixel(styles, '--s-rich-editor-document-page-gap', fallback.gap),
+        padding: {
+            top: readCssPixel(styles, '--s-rich-editor-document-padding-top', fallback.padding.top),
+            right: readCssPixel(styles, '--s-rich-editor-document-padding-right', fallback.padding.right),
+            bottom: readCssPixel(styles, '--s-rich-editor-document-padding-bottom', fallback.padding.bottom),
+            left: readCssPixel(styles, '--s-rich-editor-document-padding-left', fallback.padding.left),
+        },
+    };
+}
+function readCssPixel(styles, propertyName, fallback) {
+    const parsedValue = Number.parseFloat(styles.getPropertyValue(propertyName));
+    return Number.isFinite(parsedValue) ? parsedValue : fallback;
+}
+function setPageBreakStyle(pageBreak, fillHeight, pageBreakHeight, zoom) {
+    const zoomFactor = zoom > 0 ? 1 / zoom : 1;
+    pageBreak.style.setProperty('--s-rich-editor-pagebreak-fill', `${Math.round(fillHeight * zoomFactor)}px`);
+    pageBreak.style.setProperty('--s-rich-editor-pagebreak-height', `${Math.round(pageBreakHeight * zoomFactor)}px`);
+}
+
+const S_RICH_EDITOR_DEFAULT_MODEL_EVENTS = 'change input undo redo';
+const S_RICH_EDITOR_DEFAULT_CLOUD_CHANNEL = '8';
+const S_RICH_EDITOR_DEFAULT_OUTPUT_FORMAT = 'html';
+const S_RICH_EDITOR_DEFAULT_CONFIG = {
+    apiKey: 'no-api-key',
+    cloudChannel: S_RICH_EDITOR_DEFAULT_CLOUD_CHANNEL,
+    licenseKey: 'gpl',
+    modelEvents: S_RICH_EDITOR_DEFAULT_MODEL_EVENTS,
+    outputFormat: S_RICH_EDITOR_DEFAULT_OUTPUT_FORMAT,
+};
+const S_RICH_EDITOR_CONFIG = new InjectionToken('S_RICH_EDITOR_CONFIG', {
+    providedIn: 'root',
+    factory: () => S_RICH_EDITOR_DEFAULT_CONFIG,
+});
+const S_RICH_EDITOR_CONTENT_STYLE = `
+body {
+  color: #1f2937;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+  font-size: 14px;
+  line-height: 1.65;
+  margin: 16px;
+}
+a { color: #2563eb; }
+img { height: auto; max-width: 100%; }
+table { border-collapse: collapse; width: 100%; }
+td, th { border: 1px solid #d1d5db; padding: 6px 8px; }
+blockquote {
+  border-left: 3px solid #d1d5db;
+  color: #4b5563;
+  margin: 12px 0;
+  padding-left: 12px;
+}
+`;
+const S_RICH_EDITOR_DOCUMENT_BODY_CLASS = 's-rich-editor-document';
+const page = S_RICH_EDITOR_DOCUMENT_PAGE_METRICS;
+const S_RICH_EDITOR_DOCUMENT_CONTENT_STYLE = `
+html {
+  min-height: 100%;
+  background: #eef2f7;
+  overflow: auto;
+}
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS} {
+  --s-rich-editor-document-zoom: 1;
+  --s-rich-editor-document-page-width: ${page.width}px;
+  --s-rich-editor-document-page-height: ${page.height}px;
+  --s-rich-editor-document-page-gap: ${page.gap}px;
+  --s-rich-editor-document-padding-top: ${page.padding.top}px;
+  --s-rich-editor-document-padding-right: ${page.padding.right}px;
+  --s-rich-editor-document-padding-bottom: ${page.padding.bottom}px;
+  --s-rich-editor-document-padding-left: ${page.padding.left}px;
+  box-sizing: border-box;
+  width: var(--s-rich-editor-document-page-width);
+  min-height: var(--s-rich-editor-document-page-height);
+  margin: 32px auto;
+  padding:
+    var(--s-rich-editor-document-padding-top)
+    var(--s-rich-editor-document-padding-right)
+    var(--s-rich-editor-document-padding-bottom)
+    var(--s-rich-editor-document-padding-left);
+  background: #ffffff;
+  color: #111827;
+  border: 1px solid #e5e7eb;
+  box-shadow: 0 1px 0 rgb(15 23 42 / 6%), 0 22px 48px rgb(15 23 42 / 16%);
+  font-family: "Times New Roman", "SimSun", serif;
+  font-size: 14px;
+  line-height: 1.7;
+  zoom: var(--s-rich-editor-document-zoom);
+  overflow-wrap: anywhere;
+}
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS} :where(h1, h2, h3, h4, h5, h6, p, ul, ol, blockquote, figure, table) {
+  display: block;
+  color: inherit;
+}
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS} :where(h1, h2, h3, h4, h5, h6) {
+  margin: 0 0 12px;
+  font-family: "Times New Roman", "SimSun", serif;
+  font-weight: 700;
+  line-height: 1.35;
+}
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS} h1 { font-size: 28px; }
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS} h2 { font-size: 22px; }
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS} h3 { font-size: 18px; }
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS} p {
+  margin: 0 0 10px;
+  font-size: inherit;
+  line-height: inherit;
+}
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS} :where(ul, ol) {
+  margin: 0 0 12px;
+  padding-left: 24px;
+}
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS} li {
+  margin: 0 0 6px;
+}
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS} blockquote {
+  margin: 14px 0;
+  padding: 8px 14px;
+  border-left: 3px solid #9ca3af;
+  color: #374151;
+  background: #f9fafb;
+}
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS} table {
+  width: 100%;
+  margin: 12px 0;
+  border-collapse: collapse;
+}
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS} :where(th, td) {
+  padding: 6px 8px;
+  border: 1px solid #d1d5db;
+  vertical-align: top;
+}
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS} img {
+  max-width: 100%;
+  height: auto;
+}
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS} > :first-child {
+  margin-top: 0;
+}
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS} > :last-child {
+  margin-bottom: 0;
+}
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS} .s-rich-editor-document-pagebreak {
+  box-sizing: border-box;
+  display: block;
+  position: relative;
+  width: calc(
+    100% + var(--s-rich-editor-document-padding-left) +
+      var(--s-rich-editor-document-padding-right)
+  );
+  max-width: none !important;
+  height: var(
+    --s-rich-editor-pagebreak-height,
+    calc(
+      var(--s-rich-editor-document-padding-bottom) +
+        var(--s-rich-editor-document-page-gap) +
+        var(--s-rich-editor-document-padding-top)
+    )
+  ) !important;
+  min-height: calc(
+    var(--s-rich-editor-document-padding-bottom) +
+      var(--s-rich-editor-document-page-gap) +
+      var(--s-rich-editor-document-padding-top)
+  );
+  margin:
+    0 calc(var(--s-rich-editor-document-padding-right) * -1) 0
+    calc(var(--s-rich-editor-document-padding-left) * -1);
+  padding: 0;
+  border: 0;
+  background:
+    linear-gradient(
+      to bottom,
+      #ffffff 0,
+      #ffffff var(--s-rich-editor-pagebreak-fill, 0px),
+      #d7dee8 var(--s-rich-editor-pagebreak-fill, 0px),
+      #d7dee8 calc(var(--s-rich-editor-pagebreak-fill, 0px) + 1px),
+      #eef2f7 calc(var(--s-rich-editor-pagebreak-fill, 0px) + 1px),
+      #eef2f7
+        calc(
+          var(--s-rich-editor-pagebreak-fill, 0px) +
+            var(--s-rich-editor-document-page-gap)
+        ),
+      #d7dee8
+        calc(
+          var(--s-rich-editor-pagebreak-fill, 0px) +
+            var(--s-rich-editor-document-page-gap)
+        ),
+      #d7dee8
+        calc(
+          var(--s-rich-editor-pagebreak-fill, 0px) +
+            var(--s-rich-editor-document-page-gap) + 1px
+        ),
+      #ffffff
+        calc(
+          var(--s-rich-editor-pagebreak-fill, 0px) +
+            var(--s-rich-editor-document-page-gap) + 1px
+        ),
+      #ffffff 100%
+    );
+  cursor: default;
+  line-height: 0;
+  user-select: none;
+}
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS} .s-rich-editor-document-pagebreak > img.mce-pagebreak,
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS} img.s-rich-editor-document-pagebreak {
+  box-sizing: border-box;
+  display: block;
+  position: absolute;
+  top: calc(var(--s-rich-editor-pagebreak-fill, 0px) + 1px);
+  left: var(--s-rich-editor-document-padding-left);
+  width: 1px !important;
+  max-width: 1px !important;
+  height: 1px !important;
+  min-height: 0;
+  margin: 0 !important;
+  padding: 0;
+  border: 0;
+  opacity: 0;
+  pointer-events: none;
+  vertical-align: middle;
+}
+body.${S_RICH_EDITOR_DOCUMENT_BODY_CLASS}.mce-content-body[data-mce-placeholder]:not(.mce-visualblocks)::before {
+  left: var(--s-rich-editor-document-padding-left);
+  top: var(--s-rich-editor-document-padding-top);
+  color: #9ca3af;
+}
+`;
+const S_RICH_EDITOR_BASE_INIT = {
+    branding: false,
+    browser_spellcheck: true,
+    contextmenu: 'link image table',
+    convert_urls: false,
+    content_style: S_RICH_EDITOR_CONTENT_STYLE,
+    entity_encoding: 'raw',
+    menubar: false,
+    promotion: false,
+    statusbar: true,
+    toolbar_mode: 'sliding',
+};
+const S_RICH_EDITOR_PRESET_CONFIGS = {
+    basic: {
+        height: 280,
+        plugins: 'autolink link lists autoresize wordcount',
+        toolbar: 'undo redo | bold italic underline | bullist numlist | link removeformat',
+    },
+    email: {
+        autoresize_bottom_margin: 16,
+        height: 320,
+        min_height: 220,
+        paste_data_images: true,
+        plugins: 'autolink autoresize image link lists table quickbars wordcount',
+        toolbar: 'undo redo | bold italic underline forecolor | bullist numlist | link image table | removeformat',
+    },
+    news: {
+        block_formats: 'Paragraph=p; Heading 2=h2; Heading 3=h3; Heading 4=h4; Quote=blockquote',
+        height: 480,
+        min_height: 360,
+        paste_data_images: true,
+        plugins: 'autolink charmap code image link lists media pagebreak preview quickbars searchreplace table wordcount',
+        toolbar: [
+            'undo redo | blocks fontfamily fontsize | bold italic underline forecolor backcolor',
+            'alignleft aligncenter alignright alignjustify | bullist numlist outdent indent',
+            'link image media table pagebreak | removeformat code preview',
+        ],
+    },
+    full: {
+        block_formats: 'Paragraph=p; Heading 1=h1; Heading 2=h2; Heading 3=h3; Heading 4=h4; Preformatted=pre',
+        height: 560,
+        min_height: 420,
+        paste_data_images: true,
+        plugins: 'advlist anchor autolink charmap code codesample fullscreen image insertdatetime link lists media nonbreaking pagebreak preview quickbars searchreplace table visualblocks visualchars wordcount',
+        toolbar: [
+            'undo redo | blocks fontfamily fontsize | bold italic underline strikethrough forecolor backcolor',
+            'alignleft aligncenter alignright alignjustify | bullist numlist outdent indent',
+            'link image media table pagebreak codesample charmap | visualblocks fullscreen preview code removeformat',
+        ],
+    },
+};
+function getRichEditorPresetInit(preset) {
+    return S_RICH_EDITOR_PRESET_CONFIGS[preset];
+}
+function mergeRichEditorInit(...initList) {
+    return Object.assign({}, ...initList.filter(isRichEditorInit));
+}
+function collectRichEditorSetup(...initList) {
+    return initList
+        .map((init) => init?.setup)
+        .filter((setup) => Boolean(setup));
+}
+function isRichEditorInit(init) {
+    return Boolean(init);
+}
+
+const S_RICH_EDITOR_UPLOAD_ADAPTER = new InjectionToken('S_RICH_EDITOR_UPLOAD_ADAPTER');
+function provideSRichEditorUploadAdapter(adapter) {
+    return {
+        provide: S_RICH_EDITOR_UPLOAD_ADAPTER,
+        useValue: adapter,
+    };
+}
+
+let richEditorId = 0;
+class SRichEditorComponent {
+    globalConfig = inject(S_RICH_EDITOR_CONFIG);
+    injectedUploadAdapter = inject(S_RICH_EDITOR_UPLOAD_ADAPTER, {
+        optional: true,
+    });
+    platformId = inject(PLATFORM_ID);
+    editorId = input(`s-rich-editor-${++richEditorId}`, { ...(ngDevMode ? { debugName: "editorId" } : /* istanbul ignore next */ {}), alias: 'id' });
+    preset = input('news', ...(ngDevMode ? [{ debugName: "preset" }] : /* istanbul ignore next */ []));
+    layout = input('compact', ...(ngDevMode ? [{ debugName: "layout" }] : /* istanbul ignore next */ []));
+    init = input({}, ...(ngDevMode ? [{ debugName: "init" }] : /* istanbul ignore next */ []));
+    apiKey = input(null, ...(ngDevMode ? [{ debugName: "apiKey" }] : /* istanbul ignore next */ []));
+    cloudChannel = input(null, ...(ngDevMode ? [{ debugName: "cloudChannel" }] : /* istanbul ignore next */ []));
+    licenseKey = input(null, ...(ngDevMode ? [{ debugName: "licenseKey" }] : /* istanbul ignore next */ []));
+    outputFormat = input(null, ...(ngDevMode ? [{ debugName: "outputFormat" }] : /* istanbul ignore next */ []));
+    modelEvents = input(null, ...(ngDevMode ? [{ debugName: "modelEvents" }] : /* istanbul ignore next */ []));
+    placeholder = input('Start writing...', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    ariaLabel = input('Rich text editor', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    height = input(null, ...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
+    minHeight = input(null, ...(ngDevMode ? [{ debugName: "minHeight" }] : /* istanbul ignore next */ []));
+    maxHeight = input(null, ...(ngDevMode ? [{ debugName: "maxHeight" }] : /* istanbul ignore next */ []));
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    editorReadonly = input(false, { ...(ngDevMode ? { debugName: "editorReadonly" } : /* istanbul ignore next */ {}), alias: 'readonly',
+        transform: booleanAttribute });
+    uploadAdapter = input(null, ...(ngDevMode ? [{ debugName: "uploadAdapter" }] : /* istanbul ignore next */ []));
+    editorReady = output();
+    editorBlur = output();
+    valueChange = output();
+    value = signal('', ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    disabledFromCva = signal(false, ...(ngDevMode ? [{ debugName: "disabledFromCva" }] : /* istanbul ignore next */ []));
+    isBrowser = isPlatformBrowser(this.platformId);
+    isDisabled = computed(() => this.disabled() || this.disabledFromCva(), ...(ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []));
+    effectiveApiKey = computed(() => this.apiKey() ?? this.globalConfig.apiKey ?? 'no-api-key', ...(ngDevMode ? [{ debugName: "effectiveApiKey" }] : /* istanbul ignore next */ []));
+    effectiveCloudChannel = computed(() => this.cloudChannel() ?? this.globalConfig.cloudChannel ?? '8', ...(ngDevMode ? [{ debugName: "effectiveCloudChannel" }] : /* istanbul ignore next */ []));
+    effectiveLicenseKey = computed(() => this.licenseKey() ?? this.globalConfig.licenseKey ?? 'gpl', ...(ngDevMode ? [{ debugName: "effectiveLicenseKey" }] : /* istanbul ignore next */ []));
+    effectiveOutputFormat = computed(() => this.outputFormat() ?? this.globalConfig.outputFormat ?? 'html', ...(ngDevMode ? [{ debugName: "effectiveOutputFormat" }] : /* istanbul ignore next */ []));
+    effectiveModelEvents = computed(() => this.modelEvents() ??
+        this.globalConfig.modelEvents ??
+        'change input undo redo', ...(ngDevMode ? [{ debugName: "effectiveModelEvents" }] : /* istanbul ignore next */ []));
+    editorInit = computed(() => this.createEditorInit(), ...(ngDevMode ? [{ debugName: "editorInit" }] : /* istanbul ignore next */ []));
+    currentEditor = null;
+    onChange = () => { };
+    onTouched = () => { };
+    writeValue(value) {
+        this.value.set(value ?? '');
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.disabledFromCva.set(isDisabled);
+    }
+    focus() {
+        this.currentEditor?.focus();
+    }
+    getContent() {
+        return this.currentEditor?.getContent() ?? this.value();
+    }
+    setContent(value) {
+        this.value.set(value);
+        this.currentEditor?.setContent(value);
+        this.emitValue(value);
+    }
+    onEditorModelChange(value) {
+        const nextValue = value ?? '';
+        if (nextValue === this.value()) {
+            return;
+        }
+        this.value.set(nextValue);
+        this.emitValue(nextValue);
+    }
+    onEditorInit(event) {
+        this.currentEditor = event.editor;
+        this.editorReady.emit(event);
+    }
+    onEditorBlur(event) {
+        this.onTouched();
+        this.editorBlur.emit({
+            event: event.event,
+            editor: event.editor,
+            value: this.value(),
+        });
+    }
+    createEditorInit() {
+        const presetInit = getRichEditorPresetInit(this.preset());
+        const globalInit = this.globalConfig.init ?? {};
+        const inputInit = this.init();
+        const editorInit = mergeRichEditorInit(S_RICH_EDITOR_BASE_INIT, presetInit, globalInit, inputInit);
+        const setupCallbacks = collectRichEditorSetup(S_RICH_EDITOR_BASE_INIT, presetInit, globalInit, inputInit);
+        const uploadAdapter = this.resolveUploadAdapter();
+        editorInit.placeholder = this.placeholder();
+        editorInit.iframe_aria_text = this.ariaLabel();
+        if (this.layout() === 'document') {
+            editorInit.body_class = appendClassName(editorInit.body_class, S_RICH_EDITOR_DOCUMENT_BODY_CLASS);
+            editorInit.content_style = appendContentStyle(editorInit.content_style, S_RICH_EDITOR_DOCUMENT_CONTENT_STYLE);
+            editorInit.plugins = appendTinyMcePlugin(editorInit.plugins, 'pagebreak');
+            editorInit.toolbar = appendTinyMceToolbarGroup(editorInit.toolbar, S_RICH_EDITOR_DOCUMENT_ZOOM_TOOLBAR);
+            editorInit['pagebreak_separator'] = S_RICH_EDITOR_PAGEBREAK_SEPARATOR;
+            editorInit['pagebreak_split_block'] = true;
+            editorInit.statusbar = false;
+            setupCallbacks.push(setupRichEditorDocumentZoom);
+            setupCallbacks.push(setupRichEditorDocumentPagination);
+        }
+        const height = this.height();
+        if (height !== null) {
+            editorInit.height = height;
+        }
+        const minHeight = this.minHeight();
+        if (minHeight !== null) {
+            editorInit.min_height = minHeight;
+        }
+        const maxHeight = this.maxHeight();
+        if (maxHeight !== null) {
+            editorInit.max_height = maxHeight;
+        }
+        if (setupCallbacks.length) {
+            editorInit.setup = (editor) => {
+                for (const setup of setupCallbacks) {
+                    setup(editor);
+                }
+            };
+        }
+        if (uploadAdapter && !editorInit.images_upload_handler) {
+            editorInit.automatic_uploads = true;
+            editorInit.images_upload_handler = (blobInfo, progress) => this.uploadImage(blobInfo, progress, uploadAdapter);
+        }
+        return editorInit;
+    }
+    resolveUploadAdapter() {
+        return (this.uploadAdapter() ??
+            this.injectedUploadAdapter ??
+            this.globalConfig.uploadAdapter ??
+            null);
+    }
+    async uploadImage(blobInfo, progress, uploadAdapter) {
+        const response = await uploadAdapter.uploadImage({
+            editor: this.currentEditor,
+            blobInfo,
+            file: blobInfo.blob(),
+            filename: blobInfo.filename(),
+            progress,
+        });
+        return typeof response === 'string' ? response : response.url;
+    }
+    emitValue(value) {
+        this.onChange(value);
+        this.valueChange.emit(value);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SRichEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: SRichEditorComponent, isStandalone: true, selector: "s-rich-editor", inputs: { editorId: { classPropertyName: "editorId", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, preset: { classPropertyName: "preset", publicName: "preset", isSignal: true, isRequired: false, transformFunction: null }, layout: { classPropertyName: "layout", publicName: "layout", isSignal: true, isRequired: false, transformFunction: null }, init: { classPropertyName: "init", publicName: "init", isSignal: true, isRequired: false, transformFunction: null }, apiKey: { classPropertyName: "apiKey", publicName: "apiKey", isSignal: true, isRequired: false, transformFunction: null }, cloudChannel: { classPropertyName: "cloudChannel", publicName: "cloudChannel", isSignal: true, isRequired: false, transformFunction: null }, licenseKey: { classPropertyName: "licenseKey", publicName: "licenseKey", isSignal: true, isRequired: false, transformFunction: null }, outputFormat: { classPropertyName: "outputFormat", publicName: "outputFormat", isSignal: true, isRequired: false, transformFunction: null }, modelEvents: { classPropertyName: "modelEvents", publicName: "modelEvents", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, editorReadonly: { classPropertyName: "editorReadonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, uploadAdapter: { classPropertyName: "uploadAdapter", publicName: "uploadAdapter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { editorReady: "editorReady", editorBlur: "editorBlur", valueChange: "valueChange" }, host: { properties: { "class.s-rich-editor-host--disabled": "isDisabled()", "class.s-rich-editor-host--document": "layout() === \"document\"", "class.s-rich-editor-host--readonly": "editorReadonly()" } }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => SRichEditorComponent),
+                multi: true,
+            },
+        ], ngImport: i0, template: "<div\n  class=\"s-rich-editor\"\n  [class.s-rich-editor--disabled]=\"isDisabled()\"\n  [class.s-rich-editor--readonly]=\"editorReadonly()\"\n>\n  @if (isBrowser) {\n    <editor\n      class=\"s-rich-editor__editor\"\n      [id]=\"editorId()\"\n      [apiKey]=\"effectiveApiKey()\"\n      [cloudChannel]=\"effectiveCloudChannel()\"\n      [licenseKey]=\"effectiveLicenseKey()\"\n      [init]=\"editorInit()\"\n      [outputFormat]=\"effectiveOutputFormat()\"\n      [modelEvents]=\"effectiveModelEvents()\"\n      [disabled]=\"isDisabled()\"\n      [readonly]=\"editorReadonly()\"\n      [ngModel]=\"value()\"\n      (ngModelChange)=\"onEditorModelChange($event)\"\n      (onInit)=\"onEditorInit($event)\"\n      (onBlur)=\"onEditorBlur($event)\"\n    ></editor>\n  } @else {\n    <textarea\n      class=\"s-rich-editor__fallback\"\n      [attr.aria-label]=\"ariaLabel()\"\n      [value]=\"value()\"\n      readonly\n    ></textarea>\n  }\n</div>\n", styles: [":host{display:block;width:100%;--s-rich-editor-border: var(--platform-control-border, var(--color-border));--s-rich-editor-radius: var( --platform-control-radius, var(--radius-common-m) );--s-rich-editor-focus: var(--platform-control-focus, var(--color-primary));--s-rich-editor-focus-ring: var( --platform-control-focus-ring, var(--color-primary-subtle) );--s-rich-editor-surface: var(--platform-control-bg, var(--color-surface));--s-rich-editor-surface-soft: var( --platform-control-bg-hover, var(--color-surface-soft) );--s-rich-editor-text: var( --platform-control-color, var(--color-text-primary) );--s-rich-editor-muted: var( --platform-control-placeholder, var(--color-text-placeholder) )}.s-rich-editor{display:block;min-width:0;color:var(--s-rich-editor-text)}.s-rich-editor--disabled{opacity:.68}.s-rich-editor__editor{display:block;min-width:0}.s-rich-editor__fallback{box-sizing:border-box;display:block;width:100%;min-height:16rem;padding:var(--space-3);color:var(--s-rich-editor-text);background:var(--s-rich-editor-surface);border:1px solid var(--s-rich-editor-border);border-radius:var(--s-rich-editor-radius);font:inherit;line-height:1.6;resize:vertical}:host ::ng-deep .s-rich-editor .tox.tox-tinymce{border:1px solid var(--s-rich-editor-border);border-radius:var(--s-rich-editor-radius);box-shadow:none;transition:border-color .15s ease,box-shadow .15s ease}:host ::ng-deep .s-rich-editor .tox.tox-tinymce:focus-within{border-color:var(--s-rich-editor-focus);box-shadow:0 0 0 2px var(--s-rich-editor-focus-ring)}:host ::ng-deep .s-rich-editor .tox .tox-editor-header{background:var(--s-rich-editor-surface);border-bottom:1px solid var(--s-rich-editor-border);box-shadow:none}:host ::ng-deep .s-rich-editor .tox .tox-toolbar-overlord,:host ::ng-deep .s-rich-editor .tox .tox-toolbar,:host ::ng-deep .s-rich-editor .tox .tox-toolbar__primary,:host ::ng-deep .s-rich-editor .tox .tox-toolbar__overflow{background:var(--s-rich-editor-surface)}:host ::ng-deep .s-rich-editor .tox .tox-tbtn,:host ::ng-deep .s-rich-editor .tox .tox-split-button{border-radius:calc(var(--s-rich-editor-radius) - 2px)}:host ::ng-deep .s-rich-editor .tox .tox-tbtn:hover,:host ::ng-deep .s-rich-editor .tox .tox-tbtn:focus,:host ::ng-deep .s-rich-editor .tox .tox-split-button:hover{background:var(--s-rich-editor-surface-soft)}:host ::ng-deep .s-rich-editor .tox .tox-statusbar{color:var(--s-rich-editor-muted);background:var(--s-rich-editor-surface);border-top:1px solid var(--s-rich-editor-border)}:host(.s-rich-editor-host--document) ::ng-deep .s-rich-editor .tox.tox-tinymce{border:0;box-shadow:none}:host(.s-rich-editor-host--document) ::ng-deep .s-rich-editor .tox.tox-tinymce:focus-within{border:0;box-shadow:none}:host(.s-rich-editor-host--document) ::ng-deep .s-rich-editor .tox .tox-edit-area:before{border:0}:host(.s-rich-editor-host--document) ::ng-deep .s-rich-editor .tox .tox-edit-area__iframe{background:#eef2f7}:host ::ng-deep .s-rich-editor--readonly .tox .tox-editor-header,:host ::ng-deep .s-rich-editor--disabled .tox .tox-editor-header,:host ::ng-deep .s-rich-editor--readonly .tox .tox-statusbar,:host ::ng-deep .s-rich-editor--disabled .tox .tox-statusbar{background:var(--s-rich-editor-surface-soft)}\n"], dependencies: [{ kind: "component", type: EditorComponent, selector: "editor", inputs: ["cloudChannel", "apiKey", "licenseKey", "init", "id", "initialValue", "outputFormat", "inline", "tagName", "plugins", "toolbar", "modelEvents", "allowedEvents", "ignoreEvents", "readonly", "disabled"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SRichEditorComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 's-rich-editor', imports: [EditorComponent, FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => SRichEditorComponent),
+                            multi: true,
+                        },
+                    ], host: {
+                        '[class.s-rich-editor-host--disabled]': 'isDisabled()',
+                        '[class.s-rich-editor-host--document]': 'layout() === "document"',
+                        '[class.s-rich-editor-host--readonly]': 'editorReadonly()',
+                    }, template: "<div\n  class=\"s-rich-editor\"\n  [class.s-rich-editor--disabled]=\"isDisabled()\"\n  [class.s-rich-editor--readonly]=\"editorReadonly()\"\n>\n  @if (isBrowser) {\n    <editor\n      class=\"s-rich-editor__editor\"\n      [id]=\"editorId()\"\n      [apiKey]=\"effectiveApiKey()\"\n      [cloudChannel]=\"effectiveCloudChannel()\"\n      [licenseKey]=\"effectiveLicenseKey()\"\n      [init]=\"editorInit()\"\n      [outputFormat]=\"effectiveOutputFormat()\"\n      [modelEvents]=\"effectiveModelEvents()\"\n      [disabled]=\"isDisabled()\"\n      [readonly]=\"editorReadonly()\"\n      [ngModel]=\"value()\"\n      (ngModelChange)=\"onEditorModelChange($event)\"\n      (onInit)=\"onEditorInit($event)\"\n      (onBlur)=\"onEditorBlur($event)\"\n    ></editor>\n  } @else {\n    <textarea\n      class=\"s-rich-editor__fallback\"\n      [attr.aria-label]=\"ariaLabel()\"\n      [value]=\"value()\"\n      readonly\n    ></textarea>\n  }\n</div>\n", styles: [":host{display:block;width:100%;--s-rich-editor-border: var(--platform-control-border, var(--color-border));--s-rich-editor-radius: var( --platform-control-radius, var(--radius-common-m) );--s-rich-editor-focus: var(--platform-control-focus, var(--color-primary));--s-rich-editor-focus-ring: var( --platform-control-focus-ring, var(--color-primary-subtle) );--s-rich-editor-surface: var(--platform-control-bg, var(--color-surface));--s-rich-editor-surface-soft: var( --platform-control-bg-hover, var(--color-surface-soft) );--s-rich-editor-text: var( --platform-control-color, var(--color-text-primary) );--s-rich-editor-muted: var( --platform-control-placeholder, var(--color-text-placeholder) )}.s-rich-editor{display:block;min-width:0;color:var(--s-rich-editor-text)}.s-rich-editor--disabled{opacity:.68}.s-rich-editor__editor{display:block;min-width:0}.s-rich-editor__fallback{box-sizing:border-box;display:block;width:100%;min-height:16rem;padding:var(--space-3);color:var(--s-rich-editor-text);background:var(--s-rich-editor-surface);border:1px solid var(--s-rich-editor-border);border-radius:var(--s-rich-editor-radius);font:inherit;line-height:1.6;resize:vertical}:host ::ng-deep .s-rich-editor .tox.tox-tinymce{border:1px solid var(--s-rich-editor-border);border-radius:var(--s-rich-editor-radius);box-shadow:none;transition:border-color .15s ease,box-shadow .15s ease}:host ::ng-deep .s-rich-editor .tox.tox-tinymce:focus-within{border-color:var(--s-rich-editor-focus);box-shadow:0 0 0 2px var(--s-rich-editor-focus-ring)}:host ::ng-deep .s-rich-editor .tox .tox-editor-header{background:var(--s-rich-editor-surface);border-bottom:1px solid var(--s-rich-editor-border);box-shadow:none}:host ::ng-deep .s-rich-editor .tox .tox-toolbar-overlord,:host ::ng-deep .s-rich-editor .tox .tox-toolbar,:host ::ng-deep .s-rich-editor .tox .tox-toolbar__primary,:host ::ng-deep .s-rich-editor .tox .tox-toolbar__overflow{background:var(--s-rich-editor-surface)}:host ::ng-deep .s-rich-editor .tox .tox-tbtn,:host ::ng-deep .s-rich-editor .tox .tox-split-button{border-radius:calc(var(--s-rich-editor-radius) - 2px)}:host ::ng-deep .s-rich-editor .tox .tox-tbtn:hover,:host ::ng-deep .s-rich-editor .tox .tox-tbtn:focus,:host ::ng-deep .s-rich-editor .tox .tox-split-button:hover{background:var(--s-rich-editor-surface-soft)}:host ::ng-deep .s-rich-editor .tox .tox-statusbar{color:var(--s-rich-editor-muted);background:var(--s-rich-editor-surface);border-top:1px solid var(--s-rich-editor-border)}:host(.s-rich-editor-host--document) ::ng-deep .s-rich-editor .tox.tox-tinymce{border:0;box-shadow:none}:host(.s-rich-editor-host--document) ::ng-deep .s-rich-editor .tox.tox-tinymce:focus-within{border:0;box-shadow:none}:host(.s-rich-editor-host--document) ::ng-deep .s-rich-editor .tox .tox-edit-area:before{border:0}:host(.s-rich-editor-host--document) ::ng-deep .s-rich-editor .tox .tox-edit-area__iframe{background:#eef2f7}:host ::ng-deep .s-rich-editor--readonly .tox .tox-editor-header,:host ::ng-deep .s-rich-editor--disabled .tox .tox-editor-header,:host ::ng-deep .s-rich-editor--readonly .tox .tox-statusbar,:host ::ng-deep .s-rich-editor--disabled .tox .tox-statusbar{background:var(--s-rich-editor-surface-soft)}\n"] }]
+        }], propDecorators: { editorId: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], preset: [{ type: i0.Input, args: [{ isSignal: true, alias: "preset", required: false }] }], layout: [{ type: i0.Input, args: [{ isSignal: true, alias: "layout", required: false }] }], init: [{ type: i0.Input, args: [{ isSignal: true, alias: "init", required: false }] }], apiKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "apiKey", required: false }] }], cloudChannel: [{ type: i0.Input, args: [{ isSignal: true, alias: "cloudChannel", required: false }] }], licenseKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "licenseKey", required: false }] }], outputFormat: [{ type: i0.Input, args: [{ isSignal: true, alias: "outputFormat", required: false }] }], modelEvents: [{ type: i0.Input, args: [{ isSignal: true, alias: "modelEvents", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], minHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "minHeight", required: false }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], editorReadonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], uploadAdapter: [{ type: i0.Input, args: [{ isSignal: true, alias: "uploadAdapter", required: false }] }], editorReady: [{ type: i0.Output, args: ["editorReady"] }], editorBlur: [{ type: i0.Output, args: ["editorBlur"] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }] } });
+function appendClassName(value, className) {
+    const classNames = new Set((value ?? '').split(/\s+/).filter(Boolean));
+    classNames.add(className);
+    return Array.from(classNames).join(' ');
+}
+function appendContentStyle(value, contentStyle) {
+    return [value, contentStyle].filter(Boolean).join('\n');
+}
+function appendTinyMcePlugin(value, plugin) {
+    if (Array.isArray(value)) {
+        return value.includes(plugin) ? value : [...value, plugin];
+    }
+    const plugins = new Set((value ?? '').split(/\s+/).filter(Boolean));
+    plugins.add(plugin);
+    return Array.from(plugins).join(' ');
+}
+function appendTinyMceToolbarGroup(value, toolbarGroup) {
+    if (typeof value === 'string') {
+        return `${value} | ${toolbarGroup}`;
+    }
+    if (!Array.isArray(value)) {
+        return toolbarGroup;
+    }
+    if (value.every(isToolbarRow)) {
+        const rows = [...value];
+        const lastRow = rows.pop();
+        return lastRow ? [...rows, `${lastRow} | ${toolbarGroup}`] : [toolbarGroup];
+    }
+    return [
+        ...value,
+        {
+            name: 'Zoom',
+            items: toolbarGroup.split(/\s+/),
+        },
+    ];
+}
+function isToolbarRow(value) {
+    return typeof value === 'string';
+}
+
+function provideSRichEditor(config = {}) {
+    const normalizedConfig = normalizeRichEditorConfig(config);
+    const providers = [
+        {
+            provide: S_RICH_EDITOR_CONFIG,
+            useValue: normalizedConfig,
+        },
+    ];
+    if (normalizedConfig.scriptSrc) {
+        providers.push({
+            provide: TINYMCE_SCRIPT_SRC,
+            useValue: normalizedConfig.scriptSrc,
+        });
+    }
+    if (normalizedConfig.uploadAdapter) {
+        providers.push({
+            provide: S_RICH_EDITOR_UPLOAD_ADAPTER,
+            useValue: normalizedConfig.uploadAdapter,
+        });
+    }
+    return makeEnvironmentProviders(providers);
+}
+function normalizeRichEditorConfig(config) {
+    return {
+        ...S_RICH_EDITOR_DEFAULT_CONFIG,
+        ...config,
+        init: mergeRichEditorInit(S_RICH_EDITOR_DEFAULT_CONFIG.init, config.init),
+    };
+}
+
 class MRailNav {
     router = inject(Router, { optional: true });
     ariaLabel = input('应用导航', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
@@ -6811,10 +8712,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
             args: [{ selector: 's-upload', imports: [LucideAngularModule, NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n  class=\"upload\"\r\n  [class.upload--disabled]=\"disabled()\"\r\n  [class.upload--picture-card]=\"variant() === 'picture-card'\"\r\n  [class.upload--file-list]=\"variant() === 'file-list'\"\r\n  [class.upload--dropzone]=\"variant() === 'dropzone'\"\r\n  [class.upload--button]=\"variant() === 'button'\"\r\n  [style.--upload-card-size.px]=\"cardSize()\"\r\n  [style.--upload-card-width.px]=\"cardWidth() ?? cardSize()\"\r\n  [style.--upload-card-height.px]=\"cardHeight() ?? cardSize()\"\r\n>\r\n  @if (variant() === 'dropzone') {\r\n  <button\r\n    type=\"button\"\r\n    class=\"upload-dropzone\"\r\n    [class.upload-dropzone--drag-over]=\"dragOver()\"\r\n    [disabled]=\"!canAddMore()\"\r\n    (click)=\"openFileDialog()\"\r\n    (dragenter)=\"onDragEnter($event)\"\r\n    (dragover)=\"onDragOver($event)\"\r\n    (dragleave)=\"onDragLeave($event)\"\r\n    (drop)=\"onDrop($event)\"\r\n  >\r\n    <i-lucide [img]=\"uploadIcon\" class=\"upload-dropzone__icon\"></i-lucide>\r\n    <span class=\"upload-dropzone__title\">{{ dropTitle() }}</span>\r\n    <span class=\"upload-dropzone__description\">{{ dropDescription() }}</span>\r\n  </button>\r\n\r\n  @if (hint() && showHint()) {\r\n  <div class=\"upload__hint\">{{ hint() }}</div>\r\n  } @if (showList() && items().length) {\r\n  <ng-container [ngTemplateOutlet]=\"fileList\"></ng-container>\r\n  } } @else if (variant() === 'file-list') {\r\n  <div class=\"upload__toolbar\">\r\n    @if (canAddMore()) {\r\n    <ng-container [ngTemplateOutlet]=\"buttonTrigger\"></ng-container>\r\n    } @if (hint() && showHint()) {\r\n    <div class=\"upload__hint\">{{ hint() }}</div>\r\n    }\r\n  </div>\r\n\r\n  <ng-container [ngTemplateOutlet]=\"fileList\"></ng-container>\r\n  } @else if (variant() === 'button') {\r\n  <ng-container [ngTemplateOutlet]=\"buttonTrigger\"></ng-container>\r\n\r\n  @if (hint() && showHint()) {\r\n  <div class=\"upload__hint\">{{ hint() }}</div>\r\n  } @if (showList() && items().length) {\r\n  <ng-container [ngTemplateOutlet]=\"fileList\"></ng-container>\r\n  } } @else {\r\n  <div class=\"upload-picture-grid\">\r\n    @for (item of items(); track trackById($index, item)) { @let status =\r\n    itemStatus(item);\r\n\r\n    <div\r\n      class=\"upload-picture\"\r\n      [class.upload-picture--uploading]=\"status === 'uploading'\"\r\n      [class.upload-picture--error]=\"status === 'error'\"\r\n      [class.upload-picture--active]=\"item.active\"\r\n      [class.upload-picture--interactive]=\"status !== 'uploading' && !item.disabled && !disabled()\"\r\n      (click)=\"status === 'error' ? retryItem(item) : previewItem(item)\"\r\n    >\r\n      @if (item.thumbnailSrc) {\r\n      <img\r\n        class=\"upload-picture__image\"\r\n        [src]=\"item.thumbnailSrc\"\r\n        [alt]=\"item.alt || itemName(item)\"\r\n      />\r\n      } @else {\r\n      <div class=\"upload-picture__placeholder\">\r\n        <i-lucide\r\n          [img]=\"imageIcon\"\r\n          class=\"upload-picture__placeholder-icon\"\r\n        ></i-lucide>\r\n      </div>\r\n      } @if (showRemove() && isDoneStatus(item) && !showPictureSuccessMark(item)\r\n      && !item.active) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"upload-picture__remove\"\r\n        (click)=\"removeItem(item, $event)\"\r\n        aria-label=\"Remove\"\r\n      >\r\n        <i-lucide [img]=\"closeIcon\"></i-lucide>\r\n      </button>\r\n      } @if (status === 'uploading') {\r\n      <div class=\"upload-picture__mask upload-picture__mask--uploading\">\r\n        <div\r\n          class=\"upload-picture__circle\"\r\n          [style.--upload-progress]=\"itemProgress(item) + '%'\"\r\n        >\r\n          <span>{{ itemProgress(item) }}%</span>\r\n        </div>\r\n        <div class=\"upload-picture__status-text\">{{ uploadingLabel() }}</div>\r\n      </div>\r\n      } @if (status === 'error') {\r\n      <div class=\"upload-picture__mask upload-picture__mask--error\">\r\n        <div class=\"upload-picture__error-main\">\r\n          <i-lucide\r\n            [img]=\"imageIcon\"\r\n            class=\"upload-picture__error-icon\"\r\n          ></i-lucide>\r\n          <div class=\"upload-picture__error-text\">\r\n            {{ itemErrorText(item) }}\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"upload-picture__actions\">\r\n          <button\r\n            type=\"button\"\r\n            class=\"upload-picture__action\"\r\n            (click)=\"retryItem(item, $event)\"\r\n            aria-label=\"Retry\"\r\n          >\r\n            <i-lucide [img]=\"retryIcon\"></i-lucide>\r\n          </button>\r\n          @if (showRemove()) {\r\n          <button\r\n            type=\"button\"\r\n            class=\"upload-picture__action\"\r\n            (click)=\"removeItem(item, $event)\"\r\n            aria-label=\"Remove\"\r\n          >\r\n            <i-lucide [img]=\"removeIcon\"></i-lucide>\r\n          </button>\r\n          }\r\n        </div>\r\n      </div>\r\n      } @if (isDoneStatus(item)) { @if (showPictureSuccessMark(item)) {\r\n      <span class=\"upload-picture__success\" aria-hidden=\"true\">\r\n        <i-lucide [img]=\"checkIcon\"></i-lucide>\r\n      </span>\r\n      } @if (showPreview() || showReplace() || (showRemove() &&\r\n      showPictureSuccessMark(item))) {\r\n      <div class=\"upload-picture__mask upload-picture__mask--hover\">\r\n        <div class=\"upload-picture__actions\">\r\n          @if (showPreview()) {\r\n          <button\r\n            type=\"button\"\r\n            class=\"upload-picture__action\"\r\n            (click)=\"previewItem(item, $event)\"\r\n            aria-label=\"Preview\"\r\n          >\r\n            <i-lucide [img]=\"previewIcon\"></i-lucide>\r\n            <span>\u9884\u89C8</span>\r\n          </button>\r\n          } @if (showReplace()) {\r\n          <button\r\n            type=\"button\"\r\n            class=\"upload-picture__action\"\r\n            (click)=\"openReplaceDialog(item, $event)\"\r\n            aria-label=\"Replace\"\r\n          >\r\n            <i-lucide [img]=\"replaceIcon\"></i-lucide>\r\n            <span>\u66FF\u6362</span>\r\n          </button>\r\n          } @if (showRemove() && showPictureSuccessMark(item)) {\r\n          <button\r\n            type=\"button\"\r\n            class=\"upload-picture__action upload-picture__action--icon\"\r\n            (click)=\"removeItem(item, $event)\"\r\n            aria-label=\"Remove\"\r\n          >\r\n            <i-lucide [img]=\"removeIcon\"></i-lucide>\r\n          </button>\r\n          }\r\n        </div>\r\n      </div>\r\n      } }\r\n    </div>\r\n    } @if (canAddMore()) {\r\n    <button\r\n      type=\"button\"\r\n      class=\"upload-picture__add\"\r\n      (click)=\"openFileDialog()\"\r\n    >\r\n      <i-lucide [img]=\"addIcon\" class=\"upload-picture__add-icon\"></i-lucide>\r\n      <span class=\"upload-picture__add-label\">{{ addLabel() }}</span>\r\n    </button>\r\n    }\r\n  </div>\r\n\r\n  @if (hint() && showHint()) {\r\n  <div class=\"upload__hint\">{{ hint() }}</div>\r\n  } }\r\n\r\n  <input\r\n    #fileInput\r\n    class=\"upload__input\"\r\n    type=\"file\"\r\n    [accept]=\"accept()\"\r\n    [multiple]=\"multiple()\"\r\n    (change)=\"onFileChange($event)\"\r\n  />\r\n</div>\r\n\r\n<ng-template #buttonTrigger>\r\n  <button\r\n    type=\"button\"\r\n    class=\"upload-trigger\"\n    [class.upload-trigger--primary]=\"buttonVariant() === 'primary'\"\n    [class.upload-trigger--icon]=\"buttonVariant() === 'icon'\"\n    [class.upload-trigger--soft-icon]=\"buttonVariant() === 'soft-icon'\"\n    [disabled]=\"!canAddMore()\"\n    [attr.aria-label]=\"buttonVariant() === 'icon' || buttonVariant() === 'soft-icon' ? buttonLabel() : null\"\n    (click)=\"openFileDialog()\"\n  >\n    <i-lucide\r\n      [img]=\"buttonVariant() === 'icon' ? uploadIcon : addIcon\"\r\n      class=\"upload-trigger__icon\"\r\n    ></i-lucide>\r\n    @if (buttonVariant() !== 'icon' && buttonVariant() !== 'soft-icon') {\n    <span>{{ buttonLabel() }}</span>\n    }\n  </button>\n</ng-template>\r\n\r\n<ng-template #fileList>\r\n  <div class=\"upload-file-list\" role=\"list\">\r\n    @for (item of items(); track trackById($index, item)) { @let status =\r\n    itemStatus(item); @let kind = itemKind(item);\r\n\r\n    <div\r\n      class=\"upload-file\"\r\n      role=\"listitem\"\r\n      [class.upload-file--uploading]=\"status === 'uploading'\"\r\n      [class.upload-file--error]=\"status === 'error'\"\r\n      [class.upload-file--done]=\"isDoneStatus(item)\"\r\n      [class.upload-file--interactive]=\"status !== 'uploading' && !item.disabled && !disabled()\"\r\n      (click)=\"status === 'error' ? retryItem(item) : previewItem(item)\"\r\n    >\r\n      <div\r\n        class=\"upload-file__icon\"\r\n        [class]=\"'upload-file__icon upload-file__icon--' + kind\"\r\n      >\r\n        @if (kind === 'image' && item.thumbnailSrc) {\r\n        <img [src]=\"item.thumbnailSrc\" [alt]=\"item.alt || itemName(item)\" />\r\n        } @else {\r\n        <span>{{ itemKindLabel(item) }}</span>\r\n        }\r\n      </div>\r\n\r\n      <div class=\"upload-file__body\">\r\n        <div class=\"upload-file__name\">{{ itemName(item) }}</div>\r\n        <div class=\"upload-file__meta\">\r\n          @if (status === 'error') {\r\n          <span class=\"upload-file__error-text\">{{ itemErrorText(item) }}</span>\r\n          } @else {\r\n          <span>{{ itemMeta(item) }}</span>\r\n          }\r\n        </div>\r\n\r\n        @if (status === 'uploading') {\r\n        <div class=\"upload-file__progress\" aria-hidden=\"true\">\r\n          <div\r\n            class=\"upload-file__progress-bar\"\r\n            [style.width.%]=\"itemProgress(item)\"\r\n          ></div>\r\n        </div>\r\n        }\r\n      </div>\r\n\r\n      <div class=\"upload-file__actions\">\r\n        @if (status === 'uploading') {\r\n        <span class=\"upload-file__percent\">{{ itemProgress(item) }}%</span>\r\n        @if (showRemove()) {\r\n        <button\r\n          type=\"button\"\r\n          class=\"upload-file__action\"\r\n          (click)=\"removeItem(item, $event)\"\r\n          aria-label=\"Cancel\"\r\n        >\r\n          <i-lucide [img]=\"closeIcon\"></i-lucide>\r\n        </button>\r\n        } } @else if (status === 'error') {\r\n        <button\r\n          type=\"button\"\r\n          class=\"upload-file__action upload-file__action--retry\"\r\n          (click)=\"retryItem(item, $event)\"\r\n          aria-label=\"Retry\"\r\n        >\r\n          <i-lucide [img]=\"retryIcon\"></i-lucide>\r\n        </button>\r\n        @if (showRemove()) {\r\n        <button\r\n          type=\"button\"\r\n          class=\"upload-file__action\"\r\n          (click)=\"removeItem(item, $event)\"\r\n          aria-label=\"Remove\"\r\n        >\r\n          <i-lucide [img]=\"removeIcon\"></i-lucide>\r\n        </button>\r\n        } } @else { @if (showSuccessMark()) {\r\n        <i-lucide [img]=\"checkIcon\" class=\"upload-file__success\"></i-lucide>\r\n        } @if (showRemove()) {\r\n        <button\r\n          type=\"button\"\r\n          class=\"upload-file__action\"\r\n          (click)=\"removeItem(item, $event)\"\r\n          aria-label=\"Remove\"\r\n        >\r\n          <i-lucide [img]=\"removeIcon\"></i-lucide>\r\n        </button>\r\n        } }\r\n      </div>\r\n    </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: [":host{display:block}.upload{--upload-card-size: 120px;--upload-card-width: var(--upload-card-size);--upload-card-height: var(--upload-card-size);display:grid;gap:12px;color:var(--color-text-primary)}.upload__toolbar,.upload-picture-grid,.upload-picture__actions,.upload-file__actions,.upload-trigger{display:flex;align-items:center}.upload__toolbar,.upload-file__actions{gap:12px}.upload-picture-grid{flex-wrap:wrap;gap:16px}.upload__hint{color:var(--color-text-secondary);font-size:13px;line-height:20px}.upload__input{display:none}.upload-picture,.upload-picture__add{position:relative;width:var(--upload-card-width);height:var(--upload-card-height);border-radius:var(--radius-common-m);overflow:hidden;flex:0 0 auto}.upload-picture{border:1px solid var(--color-border);background:var(--color-surface)}.upload-picture--interactive,.upload-file--interactive,.upload-picture__add,.upload-trigger,.upload-dropzone,.upload-file__action,.upload-picture__action{cursor:pointer}.upload-picture__image,.upload-picture__placeholder{width:100%;height:100%}.upload-picture__image,.upload-file__icon img{display:block;object-fit:cover}.upload-picture__image,.upload-file__icon img{width:100%;height:100%}.upload-picture__placeholder,.upload-picture__add,.upload-picture__success,.upload-picture__action,.upload-trigger,.upload-file__icon,.upload-file__action{display:inline-flex;align-items:center;justify-content:center}.upload-picture__placeholder,.upload-picture__add{background:var(--color-surface-soft)}.upload-picture__placeholder-icon{width:34px;height:34px;color:var(--color-text-muted)}.upload-picture__mask{position:absolute;inset:0;display:flex}.upload-picture__mask--hover{align-items:center;justify-content:center;background:color-mix(in srgb,var(--color-text-primary) 58%,transparent);opacity:0;transition:opacity .16s ease}.upload-picture--interactive:hover .upload-picture__mask--hover,.upload-picture--active .upload-picture__mask--hover{opacity:1}.upload-picture--interactive:hover .upload-picture__remove{opacity:0;pointer-events:none}.upload-picture__mask--uploading,.upload-picture__mask--error{background:color-mix(in srgb,var(--color-text-primary) 58%,transparent)}.upload-picture__mask--uploading{flex-direction:column;align-items:center;justify-content:center;padding:18px;color:var(--color-surface)}.upload-picture__circle{--upload-progress: 0%;width:52px;height:52px;border-radius:999px;background:conic-gradient(var(--color-primary) var(--upload-progress),color-mix(in srgb,var(--color-surface) 42%,transparent) 0);display:inline-flex;align-items:center;justify-content:center;position:relative}.upload-picture__circle:before{content:\"\";position:absolute;inset:6px;border-radius:inherit;background:color-mix(in srgb,var(--color-text-primary) 58%,transparent)}.upload-picture__circle span{position:relative;font-size:17px;font-weight:var(--font-weight-semibold);line-height:22px;z-index:1}.upload-picture__status-text{margin-top:8px;font-size:13px;font-weight:var(--font-weight-medium);line-height:18px}.upload-picture__error-text,.upload-file__meta{font-size:12px;line-height:18px}.upload-picture__progress,.upload-file__progress{width:100%;height:3px;border-radius:999px;overflow:hidden}.upload-picture__progress{margin-top:14px;background:color-mix(in srgb,var(--color-surface) 34%,transparent)}.upload-file__progress{margin-top:4px;background:var(--color-surface-muted)}.upload-picture__progress-bar,.upload-file__progress-bar{height:100%;border-radius:inherit;background:var(--color-primary)}.upload-picture__mask--error{flex-direction:column;justify-content:space-between;padding:14px}.upload-picture__error-main{display:grid;place-items:center;gap:8px;height:100%}.upload-picture__error-icon,.upload-picture__error-text,.upload-file__error-text{color:var(--color-danger)}.upload-picture__error-icon{width:30px;height:30px}.upload-picture__success{position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:999px;background:var(--color-success);color:var(--color-surface);z-index:1}.upload-picture__success i-lucide{width:14px;height:14px}.upload-picture__remove{position:absolute;top:6px;right:6px;width:28px;height:28px;padding:0;border:0;border-radius:999px;background:color-mix(in srgb,var(--color-surface) 92%,transparent);color:var(--color-text-primary);display:inline-flex;align-items:center;justify-content:center;box-shadow:var(--shadow-common-s);cursor:pointer;z-index:2}.upload-picture__remove i-lucide{width:18px;height:18px}.upload-picture__actions{justify-content:center;gap:10px}.upload-picture__action{min-width:34px;height:34px;padding:0 8px;border:0;border-radius:var(--radius-common-s);background:color-mix(in srgb,var(--color-surface) 16%,transparent);color:var(--color-surface);gap:4px;font-size:12px;line-height:16px}.upload-picture__action--icon{width:34px;padding:0}.upload-picture__action i-lucide,.upload-trigger__icon,.upload-file__action i-lucide,.upload-file__success{width:16px;height:16px}.upload-picture__mask--hover .upload-picture__actions{gap:28px}.upload-picture__mask--hover .upload-picture__action{width:48px;min-width:48px;height:auto;padding:0;flex-direction:column;border-radius:0;background:transparent;gap:8px;font-size:14px;font-weight:var(--font-weight-medium);line-height:20px}.upload-picture__mask--hover .upload-picture__action i-lucide{width:42px;height:42px;padding:10px;border-radius:999px;background:color-mix(in srgb,var(--color-text-primary) 72%,transparent);box-sizing:border-box}.upload-trigger__icon{flex:0 0 16px;display:inline-flex;align-items:center;justify-content:center;line-height:0}.upload-trigger span{line-height:20px}.upload-picture__add{flex-direction:column;gap:10px;border:1px dashed color-mix(in srgb,var(--color-border-strong) 55%,transparent);color:var(--color-text-secondary)}.upload-picture__add:hover{border-color:var(--color-primary);color:var(--color-primary);background:var(--color-primary-subtle)}.upload-picture__add-icon{width:28px;height:28px}.upload-picture__add-label,.upload-dropzone__title,.upload-file__name{font-size:14px;line-height:20px}.upload-trigger{width:fit-content;min-height:var(--button-height-md);padding:0 18px;border:1px solid var(--button-outline-border);border-radius:var(--button-radius);background:var(--button-neutral-bg);color:var(--color-text-primary);justify-content:center;gap:8px;font-size:var(--button-font-size);font-weight:var(--button-font-weight);line-height:1}.upload-trigger:hover:not(:disabled){border-color:var(--button-outline-border-hover);color:var(--color-primary)}.upload-trigger--primary,.upload-trigger--primary:hover:not(:disabled){border-color:var(--button-primary-bg);background:var(--button-primary-bg);color:var(--color-primary-contrast)}.upload-trigger--icon,.upload-trigger--soft-icon{width:42px;min-width:42px;height:42px;min-height:42px;padding:0}.upload-trigger--soft-icon{border:0;border-radius:var(--radius-common-m);background:var(--color-surface-soft);color:var(--color-text-secondary)}.upload-dropzone{min-height:120px;padding:22px 24px;border:1px dashed color-mix(in srgb,var(--color-border-strong) 55%,transparent);border-radius:var(--radius-common-m);background:var(--color-surface-soft);color:var(--color-text-secondary);display:grid;place-items:center;gap:6px;text-align:center}.upload-dropzone:hover:not(:disabled),.upload-dropzone--drag-over{border-color:var(--color-primary);background:var(--color-primary-subtle);color:var(--color-primary)}.upload-dropzone__icon{width:34px;height:34px}.upload-dropzone__title{color:var(--color-text-primary);font-weight:var(--font-weight-medium)}.upload-file-list{display:grid;gap:8px}.upload-file{min-height:56px;padding:9px 12px;border:1px solid var(--color-border);border-radius:var(--radius-common-m);background:var(--color-surface);display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px}.upload-file--error{border-color:var(--color-danger-border)}.upload-file__icon{--upload-file-icon-bg: var(--color-surface-soft);--upload-file-icon-color: var(--color-text-secondary);width:32px;height:32px;border-radius:var(--radius-common-s);background:var(--upload-file-icon-bg);color:var(--upload-file-icon-color);overflow:hidden}.upload-file__icon span{font-size:10px;font-weight:var(--font-weight-semibold);line-height:1}.upload-file__icon--word{--upload-file-icon-bg: var(--color-primary);--upload-file-icon-color: var(--color-primary-contrast)}.upload-file__icon--pdf{--upload-file-icon-bg: var(--color-danger);--upload-file-icon-color: var(--color-surface)}.upload-file__icon--ppt{--upload-file-icon-bg: var(--color-warning);--upload-file-icon-color: var(--color-surface)}.upload-file__icon--sheet{--upload-file-icon-bg: var(--color-success);--upload-file-icon-color: var(--color-surface)}.upload-file__body{min-width:0}.upload-file__name,.upload-file__meta{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.upload-file__name{font-weight:var(--font-weight-medium)}.upload-file__meta,.upload-file__percent{color:var(--color-text-secondary)}.upload-file__actions{justify-content:flex-end;gap:8px}.upload-file__percent{font-size:12px;line-height:18px;text-align:right}.upload-file__success{color:var(--color-success)}.upload-file__action{width:28px;height:28px;padding:0;border:0;border-radius:var(--radius-common-s);background:transparent;color:var(--color-text-secondary)}.upload-file__action--retry{color:var(--color-primary)}.upload--disabled :is(.upload-picture,.upload-picture__add,.upload-trigger,.upload-file),.upload-trigger:disabled,.upload-dropzone:disabled{cursor:not-allowed;opacity:.7}\n"] }]
         }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], buttonVariant: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonVariant", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], maxCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxCount", required: false }] }], cardSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardSize", required: false }] }], cardWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardWidth", required: false }] }], cardHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardHeight", required: false }] }], addLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "addLabel", required: false }] }], buttonLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonLabel", required: false }] }], uploadingLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "uploadingLabel", required: false }] }], errorFallbackText: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorFallbackText", required: false }] }], emptyFileName: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyFileName", required: false }] }], dropTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropTitle", required: false }] }], dropDescription: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropDescription", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], showHint: [{ type: i0.Input, args: [{ isSignal: true, alias: "showHint", required: false }] }], showList: [{ type: i0.Input, args: [{ isSignal: true, alias: "showList", required: false }] }], showPreview: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPreview", required: false }] }], showRemove: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRemove", required: false }] }], showReplace: [{ type: i0.Input, args: [{ isSignal: true, alias: "showReplace", required: false }] }], showSuccessMark: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSuccessMark", required: false }] }], filesSelected: [{ type: i0.Output, args: ["filesSelected"] }], itemPreview: [{ type: i0.Output, args: ["itemPreview"] }], itemRemove: [{ type: i0.Output, args: ["itemRemove"] }], itemRetry: [{ type: i0.Output, args: ["itemRetry"] }], itemReplace: [{ type: i0.Output, args: ["itemReplace"] }], fileInput: [{ type: i0.ViewChild, args: ['fileInput', { isSignal: true }] }] } });
 
+class WebLayoutSideNavComponent {
+    title = input(null, ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: WebLayoutSideNavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.8", type: WebLayoutSideNavComponent, isStandalone: true, selector: "app-web-layout-side-nav", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<aside class=\"web-layout-side-nav\">\n  <div class=\"web-layout-side-nav__body\">\n    <ng-content></ng-content>\n  </div>\n</aside>\n", styles: [":host{display:block;height:100%}.web-layout-side-nav{height:100%;min-height:0;display:flex;flex-direction:column;background:#fff}.web-layout-side-nav__body{flex:1 1 auto;min-width:0;min-height:0;padding:.625rem .375rem .875rem;overflow-x:hidden;overflow-y:auto}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: WebLayoutSideNavComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-web-layout-side-nav', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<aside class=\"web-layout-side-nav\">\n  <div class=\"web-layout-side-nav__body\">\n    <ng-content></ng-content>\n  </div>\n</aside>\n", styles: [":host{display:block;height:100%}.web-layout-side-nav{height:100%;min-height:0;display:flex;flex-direction:column;background:#fff}.web-layout-side-nav__body{flex:1 1 auto;min-width:0;min-height:0;padding:.625rem .375rem .875rem;overflow-x:hidden;overflow-y:auto}\n"] }]
+        }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }] } });
+
 class DialogContainerRef {
     subject = new Subject();
+    closed = false;
     afterClosed$ = this.subject.asObservable();
+    afterClosed() {
+        return this.afterClosed$;
+    }
     close(result) {
+        if (this.closed) {
+            return;
+        }
+        this.closed = true;
         this.subject.next(result ?? null);
         this.subject.complete();
     }
@@ -6920,29 +8839,87 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
                     }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"confirm-dialog__panel\">\r\n  @if (showClose) {\r\n    <button type=\"button\" class=\"confirm-dialog__close\" aria-label=\"\u5173\u95ED\u5F39\u7A97\" (click)=\"cancel()\">\r\n      <lucide-icon [img]=\"closeIcon\" [size]=\"18\" [strokeWidth]=\"1.8\" aria-hidden=\"true\" />\r\n    </button>\r\n  }\r\n\r\n  <div class=\"confirm-dialog__main\">\r\n    <div class=\"confirm-dialog__icon\" aria-hidden=\"true\">\r\n      <lucide-icon [img]=\"icon\" [size]=\"28\" [strokeWidth]=\"1.9\" />\r\n    </div>\r\n\r\n    <div class=\"confirm-dialog__content\">\r\n      <h2 class=\"confirm-dialog__title\">{{ title }}</h2>\r\n      <p class=\"confirm-dialog__message\">{{ message }}</p>\r\n\r\n      @if (details.length > 0) {\r\n        <dl class=\"confirm-dialog__details\" aria-label=\"\u8BE6\u60C5\u4FE1\u606F\">\r\n          @for (detail of details; track detail.label) {\r\n            <div class=\"confirm-dialog__detail-row\">\r\n              <dt>{{ detail.label }}</dt>\r\n              <dd>{{ detail.value }}</dd>\r\n            </div>\r\n          }\r\n        </dl>\r\n      }\r\n    </div>\r\n  </div>\r\n\r\n  <footer class=\"confirm-dialog__footer\">\r\n    @if (showCancel) {\r\n      <button type=\"button\" class=\"confirm-dialog__button confirm-dialog__button--secondary\" (click)=\"cancel()\">\r\n        {{ cancelText }}\r\n      </button>\r\n    }\r\n    <button\r\n      type=\"button\"\r\n      class=\"confirm-dialog__button confirm-dialog__button--primary\"\r\n      [class.confirm-dialog__button--danger]=\"primaryButtonVariant === 'danger'\"\r\n      [class.confirm-dialog__button--warning]=\"primaryButtonVariant === 'warning'\"\r\n      [class.confirm-dialog__button--success]=\"primaryButtonVariant === 'success'\"\r\n      (click)=\"confirm()\"\r\n    >\r\n      {{ confirmText }}\r\n    </button>\r\n  </footer>\r\n</div>\r\n", styles: [":host{display:block;width:min(420px,100vw - 32px);min-width:0;background:#fff;color:#0f1f3d;--confirm-dialog-accent: #1677ff;--confirm-dialog-accent-soft: rgba(22, 119, 255, .12);--confirm-dialog-button: #1677ff;--confirm-dialog-button-hover: #3b82f6}.confirm-dialog__panel{position:relative;min-height:172px;padding:28px 28px 24px;background:radial-gradient(circle at 20% 10%,#fffffff0,#fff0 34%),linear-gradient(180deg,#f8fbfff0,#fff 60%)}:host(.confirm-dialog--danger){--confirm-dialog-accent: #ff3b30;--confirm-dialog-accent-soft: rgba(255, 59, 48, .12);--confirm-dialog-button: #ff3b30;--confirm-dialog-button-hover: #ff5157}:host(.confirm-dialog--warning){--confirm-dialog-accent: #ff9500;--confirm-dialog-accent-soft: rgba(255, 149, 0, .12);--confirm-dialog-button: #ff9500;--confirm-dialog-button-hover: #ffab2e}:host(.confirm-dialog--success){--confirm-dialog-accent: #34c759;--confirm-dialog-accent-soft: rgba(52, 199, 89, .13);--confirm-dialog-button: #f5f5f7;--confirm-dialog-button-hover: #e5e7eb}.confirm-dialog__close{position:absolute;top:18px;right:18px;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:0;border-radius:50%;background:transparent;color:#8a93a5;cursor:pointer;transition:background-color .16s ease,color .16s ease}.confirm-dialog__close:hover{background:#f2f5fa;color:#334155}.confirm-dialog__main{display:flex;align-items:flex-start;gap:20px;padding-right:32px}.confirm-dialog__icon{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;width:56px;height:56px;border-radius:999px;background:var(--confirm-dialog-accent-soft);color:var(--confirm-dialog-accent);box-shadow:inset 0 0 0 1px #ffffffb3}.confirm-dialog__content{min-width:0;padding-top:3px}.confirm-dialog__title{margin:0;color:#0f1f3d;font-size:18px;font-weight:700;letter-spacing:0;line-height:1.2}.confirm-dialog__message{margin:10px 0 0;color:#31415e;font-size:14px;font-weight:400;line-height:1.7;white-space:pre-line}.confirm-dialog__details{display:grid;gap:0;margin:16px 0 0;padding:12px 14px;border:1px solid #edf1f7;border-radius:8px;background:#f8fafce0}.confirm-dialog__detail-row{display:grid;grid-template-columns:minmax(64px,max-content) minmax(0,1fr);gap:16px;min-height:26px;align-items:center}.confirm-dialog__detail-row dt,.confirm-dialog__detail-row dd{margin:0;font-size:13px;line-height:1}.confirm-dialog__detail-row dt{color:#5b667a;font-weight:500}.confirm-dialog__detail-row dd{min-width:0;color:#15223b;font-weight:500;overflow-wrap:anywhere}.confirm-dialog__footer{display:flex;justify-content:flex-end;gap:12px;margin-top:28px}.confirm-dialog__button{display:inline-flex;align-items:center;justify-content:center;min-width:76px;height:36px;padding:0 18px;border:1px solid transparent;border-radius:8px;cursor:pointer;font-size:14px;font-weight:600;letter-spacing:0;line-height:1;transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease,color .16s ease}.confirm-dialog__button:focus-visible,.confirm-dialog__close:focus-visible{outline:2px solid rgba(22,119,255,.32);outline-offset:2px}.confirm-dialog__button--secondary{border-color:#dce2ec;background:#f5f5f7;color:#2f3a4f}.confirm-dialog__button--secondary:hover{border-color:#ccd5e3;background:#eef2f7}.confirm-dialog__button--primary{background:var(--confirm-dialog-button);color:#fff;box-shadow:0 8px 18px #1677ff38}.confirm-dialog__button--primary:hover{background:var(--confirm-dialog-button-hover)}.confirm-dialog__button--danger{box-shadow:0 8px 18px #ff3b303d}.confirm-dialog__button--warning{color:#fff;box-shadow:0 8px 18px #ff95003d}.confirm-dialog__button--success{border-color:#dce2ec;color:#2f3a4f;box-shadow:none}@media(max-width:480px){:host{width:calc(100vw - 32px)}.confirm-dialog__panel{padding:24px 20px 20px}.confirm-dialog__main{gap:14px;padding-right:24px}.confirm-dialog__icon{width:48px;height:48px}.confirm-dialog__footer{justify-content:stretch}.confirm-dialog__button{flex:1 1 0;min-width:0}}\n"] }]
         }] });
 
+function toOverlayCssSize(value) {
+    if (typeof value === 'number') {
+        return `${value}px`;
+    }
+    return value ?? '';
+}
+function toOverlayClassName(value) {
+    return Array.isArray(value) ? value.filter(Boolean).join(' ') : value ?? '';
+}
+
 class DialogContainerComponent {
     title = '';
     showHeader = true;
     size = 'small';
+    panelClass = '';
+    width = '';
+    modal = true;
+    closeOnEsc = true;
+    closeOnMaskClick = false;
     component;
     injector;
     close = new EventEmitter();
     dialogRef;
     ngAfterViewInit() {
-        this.dialogRef.nativeElement.showModal();
+        if (this.modal) {
+            this.dialogRef.nativeElement.showModal();
+            return;
+        }
+        this.dialogRef.nativeElement.show();
+    }
+    get dialogClasses() {
+        return ['rounded-lg shadow-lg p-6 z-50', this.panelClass].filter(Boolean).join(' ');
+    }
+    handleCancel(event) {
+        if (!this.closeOnEsc) {
+            event.preventDefault();
+        }
+    }
+    handleMaskClick() {
+        if (!this.closeOnMaskClick) {
+            return;
+        }
+        this.dialogRef.nativeElement.close();
+    }
+    handleDialogClick(event) {
+        if (!this.closeOnMaskClick || event.target !== this.dialogRef.nativeElement) {
+            return;
+        }
+        const rect = this.dialogRef.nativeElement.getBoundingClientRect();
+        const clickedInside = event.clientX >= rect.left
+            && event.clientX <= rect.right
+            && event.clientY >= rect.top
+            && event.clientY <= rect.bottom;
+        if (!clickedInside) {
+            this.dialogRef.nativeElement.close();
+        }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: DialogContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: DialogContainerComponent, isStandalone: true, selector: "s-dialog-container", inputs: { title: "title", showHeader: "showHeader", size: "size", component: "component", injector: "injector" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "dialogRef", first: true, predicate: ["dialog"], descendants: true, static: true }], ngImport: i0, template: "<dialog\r\n  #dialog\r\n  class=\"rounded-lg shadow-lg p-6 z-50\"\r\n  [class.dialog--chrome-content]=\"!showHeader\"\r\n  [class.dialog--size-small]=\"size === 'small'\"\r\n  [class.dialog--size-standard]=\"size === 'standard'\"\r\n  [class.dialog--size-large]=\"size === 'large'\"\r\n  [attr.aria-label]=\"title || '\u5F39\u7A97'\"\r\n  (close)=\"close.emit()\"\r\n>\r\n  @if (showHeader) {\r\n  <div class=\"flex justify-between items-center mb-6 px-4 py-3.5 dialog-header-bg\">\r\n    <div class=\"dialog-title text-xl font-bold translate-y-[3px]\">{{ title }}</div>\r\n    <button\r\n      id=\"closeDialog\"\r\n      class=\"dialog-close text-xl cursor-pointer test-sm\"\r\n      type=\"button\"\r\n      aria-label=\"\u5173\u95ED\u5F39\u7A97\"\r\n      (click)=\"dialog.close()\"\r\n    >\r\n      <i class=\"iconfont icon-window-close test-sm\"></i>\r\n    </button>\r\n  </div>\r\n  }\r\n  <ng-container *ngComponentOutlet=\"component; injector: injector\"></ng-container>\r\n</dialog>\r\n", styles: ["dialog{margin:auto;position:fixed;z-index:var(--dialog-z-index, 1000);inset:0;width:min(420px,100vw - 32px);min-width:0;max-width:calc(100vw - 32px);max-height:90vh;padding:0;border:0;border-radius:8px;background:#fff;box-shadow:0 16px 40px #0f172a2e}form{display:flex;flex-direction:column;gap:10px;flex:1}menu{display:flex;justify-content:flex-end;gap:10px;margin-top:15px;padding:0}dialog::backdrop{background:#0f172a14}dialog.dialog--size-small{width:min(420px,100vw - 32px)}dialog.dialog--size-standard{width:min(680px,100vw - 32px)}dialog.dialog--size-large{width:min(960px,100vw - 32px)}dialog.dialog--chrome-content{border-radius:20px;overflow:hidden;box-shadow:0 24px 64px #0f172a24,0 8px 24px #0f172a14}dialog.dialog--workspace{width:min(62rem,100vw - 2rem);height:min(46rem,100vh - 2rem);min-height:32rem;max-height:calc(100vh - 2rem)}dialog.dialog--workspace>.card{height:100%;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto}dialog.dialog--workspace>.card>.card__body{min-height:0;overflow:auto}dialog.dialog--workspace .input-text[contenteditable=true]{min-height:14rem;overflow:auto;line-height:1.7}.dialog-header-bg{display:flex;align-items:center;justify-content:space-between;height:45px;min-height:45px;max-height:45px;margin:0;padding:0 16px;border-bottom:1px solid #edf1f5;background:#fff;box-sizing:border-box}.dialog-title{color:#1f2937;font-size:14px;font-weight:500;line-height:20px;transform:none}.dialog-close{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;padding:0;border:0;background:transparent;color:#9ca3af;font-size:16px;line-height:1;cursor:pointer}.dialog-close i{font-size:16px;line-height:1}.dialog-close:hover{color:#1f2937}\n"], dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "ngmodule", type: FormsModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: DialogContainerComponent, isStandalone: true, selector: "s-dialog-container", inputs: { title: "title", showHeader: "showHeader", size: "size", panelClass: "panelClass", width: "width", modal: "modal", closeOnEsc: "closeOnEsc", closeOnMaskClick: "closeOnMaskClick", component: "component", injector: "injector" }, outputs: { close: "close" }, host: { properties: { "class.dialog-container--contained": "!modal" } }, viewQueries: [{ propertyName: "dialogRef", first: true, predicate: ["dialog"], descendants: true, static: true }], ngImport: i0, template: "@if (!modal) {\n  <div class=\"dialog-container__mask\" (click)=\"handleMaskClick()\"></div>\n}\n\n<dialog\n  #dialog\n  [class]=\"dialogClasses\"\n  [class.dialog--chrome-content]=\"!showHeader\"\n  [class.dialog--size-small]=\"size === 'small'\"\n  [class.dialog--size-standard]=\"size === 'standard'\"\n  [class.dialog--size-large]=\"size === 'large'\"\n  [style.width]=\"width || null\"\n  [attr.aria-label]=\"title || '\u5F39\u7A97'\"\n  (cancel)=\"handleCancel($event)\"\n  (close)=\"close.emit()\"\n  (click)=\"handleDialogClick($event)\"\n>\n  @if (showHeader) {\r\n  <div class=\"flex justify-between items-center mb-6 px-4 py-3.5 dialog-header-bg\">\r\n    <div class=\"dialog-title text-xl font-bold translate-y-[3px]\">{{ title }}</div>\r\n    <button\r\n      id=\"closeDialog\"\r\n      class=\"dialog-close text-xl cursor-pointer test-sm\"\r\n      type=\"button\"\r\n      aria-label=\"\u5173\u95ED\u5F39\u7A97\"\r\n      (click)=\"dialog.close()\"\r\n    >\r\n      <i class=\"iconfont icon-window-close test-sm\"></i>\r\n    </button>\r\n  </div>\r\n  }\r\n  <ng-container *ngComponentOutlet=\"component; injector: injector\"></ng-container>\r\n</dialog>\r\n", styles: [":host.dialog-container--contained{position:absolute;inset:0;display:block;pointer-events:none}.dialog-container__mask{position:absolute;inset:0;background:#0f172a14;pointer-events:auto}dialog{margin:auto;position:fixed;z-index:var(--dialog-z-index, 1000);inset:0;width:min(420px,100vw - 32px);min-width:0;max-width:calc(100vw - 32px);max-height:90vh;padding:0;border:0;border-radius:8px;background:#fff;box-shadow:0 16px 40px #0f172a2e;pointer-events:auto}:host.dialog-container--contained dialog{position:absolute;inset:50% auto auto 50%;max-width:calc(100% - 48px);max-height:calc(100% - 48px);margin:0;transform:translate(-50%,-50%)}form{display:flex;flex-direction:column;gap:10px;flex:1}menu{display:flex;justify-content:flex-end;gap:10px;margin-top:15px;padding:0}dialog::backdrop{background:#0f172a14}dialog.dialog--size-small{width:min(420px,100vw - 32px)}dialog.dialog--size-standard{width:min(680px,100vw - 32px)}dialog.dialog--size-large{width:min(960px,100vw - 32px)}dialog.dialog--chrome-content{border-radius:20px;overflow:hidden;box-shadow:0 24px 64px #0f172a24,0 8px 24px #0f172a14}dialog.dialog--workspace{width:min(62rem,100vw - 2rem);height:min(46rem,100vh - 2rem);min-height:32rem;max-height:calc(100vh - 2rem)}dialog.dialog--workspace>.card{height:100%;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto}dialog.dialog--workspace>.card>.card__body{min-height:0;overflow:auto}dialog.dialog--workspace .input-text[contenteditable=true]{min-height:14rem;overflow:auto;line-height:1.7}.dialog-header-bg{display:flex;align-items:center;justify-content:space-between;height:45px;min-height:45px;max-height:45px;margin:0;padding:0 16px;border-bottom:1px solid #edf1f5;background:#fff;box-sizing:border-box}.dialog-title{color:#1f2937;font-size:14px;font-weight:500;line-height:20px;transform:none}.dialog-close{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;padding:0;border:0;background:transparent;color:#9ca3af;font-size:16px;line-height:1;cursor:pointer}.dialog-close i{font-size:16px;line-height:1}.dialog-close:hover{color:#1f2937}\n"], dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "ngmodule", type: FormsModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: DialogContainerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 's-dialog-container', imports: [NgComponentOutlet, FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<dialog\r\n  #dialog\r\n  class=\"rounded-lg shadow-lg p-6 z-50\"\r\n  [class.dialog--chrome-content]=\"!showHeader\"\r\n  [class.dialog--size-small]=\"size === 'small'\"\r\n  [class.dialog--size-standard]=\"size === 'standard'\"\r\n  [class.dialog--size-large]=\"size === 'large'\"\r\n  [attr.aria-label]=\"title || '\u5F39\u7A97'\"\r\n  (close)=\"close.emit()\"\r\n>\r\n  @if (showHeader) {\r\n  <div class=\"flex justify-between items-center mb-6 px-4 py-3.5 dialog-header-bg\">\r\n    <div class=\"dialog-title text-xl font-bold translate-y-[3px]\">{{ title }}</div>\r\n    <button\r\n      id=\"closeDialog\"\r\n      class=\"dialog-close text-xl cursor-pointer test-sm\"\r\n      type=\"button\"\r\n      aria-label=\"\u5173\u95ED\u5F39\u7A97\"\r\n      (click)=\"dialog.close()\"\r\n    >\r\n      <i class=\"iconfont icon-window-close test-sm\"></i>\r\n    </button>\r\n  </div>\r\n  }\r\n  <ng-container *ngComponentOutlet=\"component; injector: injector\"></ng-container>\r\n</dialog>\r\n", styles: ["dialog{margin:auto;position:fixed;z-index:var(--dialog-z-index, 1000);inset:0;width:min(420px,100vw - 32px);min-width:0;max-width:calc(100vw - 32px);max-height:90vh;padding:0;border:0;border-radius:8px;background:#fff;box-shadow:0 16px 40px #0f172a2e}form{display:flex;flex-direction:column;gap:10px;flex:1}menu{display:flex;justify-content:flex-end;gap:10px;margin-top:15px;padding:0}dialog::backdrop{background:#0f172a14}dialog.dialog--size-small{width:min(420px,100vw - 32px)}dialog.dialog--size-standard{width:min(680px,100vw - 32px)}dialog.dialog--size-large{width:min(960px,100vw - 32px)}dialog.dialog--chrome-content{border-radius:20px;overflow:hidden;box-shadow:0 24px 64px #0f172a24,0 8px 24px #0f172a14}dialog.dialog--workspace{width:min(62rem,100vw - 2rem);height:min(46rem,100vh - 2rem);min-height:32rem;max-height:calc(100vh - 2rem)}dialog.dialog--workspace>.card{height:100%;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto}dialog.dialog--workspace>.card>.card__body{min-height:0;overflow:auto}dialog.dialog--workspace .input-text[contenteditable=true]{min-height:14rem;overflow:auto;line-height:1.7}.dialog-header-bg{display:flex;align-items:center;justify-content:space-between;height:45px;min-height:45px;max-height:45px;margin:0;padding:0 16px;border-bottom:1px solid #edf1f5;background:#fff;box-sizing:border-box}.dialog-title{color:#1f2937;font-size:14px;font-weight:500;line-height:20px;transform:none}.dialog-close{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;padding:0;border:0;background:transparent;color:#9ca3af;font-size:16px;line-height:1;cursor:pointer}.dialog-close i{font-size:16px;line-height:1}.dialog-close:hover{color:#1f2937}\n"] }]
+            args: [{ selector: 's-dialog-container', imports: [NgComponentOutlet, FormsModule], host: {
+                        '[class.dialog-container--contained]': '!modal',
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (!modal) {\n  <div class=\"dialog-container__mask\" (click)=\"handleMaskClick()\"></div>\n}\n\n<dialog\n  #dialog\n  [class]=\"dialogClasses\"\n  [class.dialog--chrome-content]=\"!showHeader\"\n  [class.dialog--size-small]=\"size === 'small'\"\n  [class.dialog--size-standard]=\"size === 'standard'\"\n  [class.dialog--size-large]=\"size === 'large'\"\n  [style.width]=\"width || null\"\n  [attr.aria-label]=\"title || '\u5F39\u7A97'\"\n  (cancel)=\"handleCancel($event)\"\n  (close)=\"close.emit()\"\n  (click)=\"handleDialogClick($event)\"\n>\n  @if (showHeader) {\r\n  <div class=\"flex justify-between items-center mb-6 px-4 py-3.5 dialog-header-bg\">\r\n    <div class=\"dialog-title text-xl font-bold translate-y-[3px]\">{{ title }}</div>\r\n    <button\r\n      id=\"closeDialog\"\r\n      class=\"dialog-close text-xl cursor-pointer test-sm\"\r\n      type=\"button\"\r\n      aria-label=\"\u5173\u95ED\u5F39\u7A97\"\r\n      (click)=\"dialog.close()\"\r\n    >\r\n      <i class=\"iconfont icon-window-close test-sm\"></i>\r\n    </button>\r\n  </div>\r\n  }\r\n  <ng-container *ngComponentOutlet=\"component; injector: injector\"></ng-container>\r\n</dialog>\r\n", styles: [":host.dialog-container--contained{position:absolute;inset:0;display:block;pointer-events:none}.dialog-container__mask{position:absolute;inset:0;background:#0f172a14;pointer-events:auto}dialog{margin:auto;position:fixed;z-index:var(--dialog-z-index, 1000);inset:0;width:min(420px,100vw - 32px);min-width:0;max-width:calc(100vw - 32px);max-height:90vh;padding:0;border:0;border-radius:8px;background:#fff;box-shadow:0 16px 40px #0f172a2e;pointer-events:auto}:host.dialog-container--contained dialog{position:absolute;inset:50% auto auto 50%;max-width:calc(100% - 48px);max-height:calc(100% - 48px);margin:0;transform:translate(-50%,-50%)}form{display:flex;flex-direction:column;gap:10px;flex:1}menu{display:flex;justify-content:flex-end;gap:10px;margin-top:15px;padding:0}dialog::backdrop{background:#0f172a14}dialog.dialog--size-small{width:min(420px,100vw - 32px)}dialog.dialog--size-standard{width:min(680px,100vw - 32px)}dialog.dialog--size-large{width:min(960px,100vw - 32px)}dialog.dialog--chrome-content{border-radius:20px;overflow:hidden;box-shadow:0 24px 64px #0f172a24,0 8px 24px #0f172a14}dialog.dialog--workspace{width:min(62rem,100vw - 2rem);height:min(46rem,100vh - 2rem);min-height:32rem;max-height:calc(100vh - 2rem)}dialog.dialog--workspace>.card{height:100%;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto}dialog.dialog--workspace>.card>.card__body{min-height:0;overflow:auto}dialog.dialog--workspace .input-text[contenteditable=true]{min-height:14rem;overflow:auto;line-height:1.7}.dialog-header-bg{display:flex;align-items:center;justify-content:space-between;height:45px;min-height:45px;max-height:45px;margin:0;padding:0 16px;border-bottom:1px solid #edf1f5;background:#fff;box-sizing:border-box}.dialog-title{color:#1f2937;font-size:14px;font-weight:500;line-height:20px;transform:none}.dialog-close{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;padding:0;border:0;background:transparent;color:#9ca3af;font-size:16px;line-height:1;cursor:pointer}.dialog-close i{font-size:16px;line-height:1}.dialog-close:hover{color:#1f2937}\n"] }]
         }], propDecorators: { title: [{
                 type: Input
             }], showHeader: [{
                 type: Input
             }], size: [{
                 type: Input
+            }], panelClass: [{
+                type: Input
+            }], width: [{
+                type: Input
+            }], modal: [{
+                type: Input
+            }], closeOnEsc: [{
+                type: Input
+            }], closeOnMaskClick: [{
+                type: Input
             }], component: [{
                 type: Input
             }], injector: [{
@@ -6963,8 +8940,13 @@ class DialogContainerService {
         const attachedRef = this.overlayHost.attachComponent(DialogContainerComponent, {
             injector: this.injector,
             viewContainerRef: config?.viewContainerRef,
+            container: config?.container,
+            host: config?.host,
+            scope: config?.scope,
+            owner: config?.owner,
             config: {
-                disposeOnNavigation: true,
+                disposeOnNavigation: config?.closeOnRouteLeave ?? true,
+                panelClass: config?.panelClass,
             },
         });
         if (!attachedRef) {
@@ -6974,6 +8956,11 @@ class DialogContainerService {
         containerRef.instance.title = config?.title ?? '';
         containerRef.instance.showHeader = config?.showHeader ?? contentComponent.dialogChrome !== 'content';
         containerRef.instance.size = config?.size ?? contentComponent.dialogSize ?? 'small';
+        containerRef.instance.panelClass = toOverlayClassName(config?.panelClass);
+        containerRef.instance.width = toOverlayCssSize(config?.width);
+        containerRef.instance.modal = !config?.container && !config?.host;
+        containerRef.instance.closeOnEsc = config?.closeOnEsc ?? true;
+        containerRef.instance.closeOnMaskClick = config?.closeOnMaskClick ?? false;
         containerRef.instance.component = component;
         containerRef.instance.injector = Injector.create({
             providers: [
@@ -6986,6 +8973,16 @@ class DialogContainerService {
         dialogRef.afterClosed$.subscribe(() => {
             attachedRef.dispose();
         });
+        attachedRef.overlayRef.detachments().subscribe(() => dialogRef.close());
+        if (config?.closeOnEsc ?? true) {
+            attachedRef.overlayRef.keydownEvents().subscribe((event) => {
+                if (event.key !== 'Escape') {
+                    return;
+                }
+                event.preventDefault();
+                dialogRef.close();
+            });
+        }
         containerRef.instance.close.subscribe(() => dialogRef.close());
         return dialogRef;
     }
@@ -6999,12 +8996,54 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
                 }]
         }] });
 
+class AppOverlayHostDirective {
+    name = input('global', { ...(ngDevMode ? { debugName: "name" } : /* istanbul ignore next */ {}), alias: 'appOverlayHost' });
+    elementRef = inject(ElementRef);
+    registry = inject(OverlayHostRegistry);
+    ngOnInit() {
+        this.registry.register(this.name(), this.elementRef.nativeElement);
+    }
+    ngOnDestroy() {
+        this.registry.unregister(this.name(), this.elementRef.nativeElement);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: AppOverlayHostDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.8", type: AppOverlayHostDirective, isStandalone: true, selector: "[appOverlayHost]", inputs: { name: { classPropertyName: "name", publicName: "appOverlayHost", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: AppOverlayHostDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[appOverlayHost]',
+                }]
+        }], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "appOverlayHost", required: false }] }] } });
+
 class SideDrawerRef {
     subject = new Subject();
+    componentInstanceSubject = new ReplaySubject(1);
+    componentInstance;
+    closed = false;
     afterClosed$ = this.subject.asObservable();
+    componentInstance$ = this.componentInstanceSubject.asObservable();
+    get instance() {
+        return this.componentInstance;
+    }
+    afterClosed() {
+        return this.afterClosed$;
+    }
+    attachComponentInstance(instance) {
+        if (this.closed) {
+            return;
+        }
+        this.componentInstance = instance;
+        this.componentInstanceSubject.next(instance);
+    }
     close(result) {
+        if (this.closed) {
+            return;
+        }
+        this.closed = true;
         this.subject.next(result ?? null);
         this.subject.complete();
+        this.componentInstanceSubject.complete();
     }
 }
 
@@ -7012,9 +9051,14 @@ class SideDrawerContainerComponent {
     static footerSelector = 'platform-drawer-footer';
     elementRef = inject(ElementRef);
     footerObserver;
+    attachedComponentInstance;
+    componentAttached = output();
+    contentOutlet;
     title = input('', ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
     closeLabel = input('关闭', ...(ngDevMode ? [{ debugName: "closeLabel" }] : /* istanbul ignore next */ []));
     drawerWidth = input('', ...(ngDevMode ? [{ debugName: "drawerWidth" }] : /* istanbul ignore next */ []));
+    maskClass = input('', ...(ngDevMode ? [{ debugName: "maskClass" }] : /* istanbul ignore next */ []));
+    contained = input(false, ...(ngDevMode ? [{ debugName: "contained" }] : /* istanbul ignore next */ []));
     component = input.required(...(ngDevMode ? [{ debugName: "component" }] : /* istanbul ignore next */ []));
     injector = input.required(...(ngDevMode ? [{ debugName: "injector" }] : /* istanbul ignore next */ []));
     closeOnMask = input(false, ...(ngDevMode ? [{ debugName: "closeOnMask" }] : /* istanbul ignore next */ []));
@@ -7025,6 +9069,14 @@ class SideDrawerContainerComponent {
             this.observeBodyChanges();
         });
     }
+    ngAfterViewChecked() {
+        const componentInstance = this.contentOutlet?.componentInstance;
+        if (!componentInstance || componentInstance === this.attachedComponentInstance) {
+            return;
+        }
+        this.attachedComponentInstance = componentInstance;
+        this.componentAttached.emit(componentInstance);
+    }
     ngOnDestroy() {
         this.footerObserver?.disconnect();
     }
@@ -7055,16 +9107,22 @@ class SideDrawerContainerComponent {
         footerHost.replaceChildren(footer);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SideDrawerContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.8", type: SideDrawerContainerComponent, isStandalone: true, selector: "s-side-drawer-container", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, closeLabel: { classPropertyName: "closeLabel", publicName: "closeLabel", isSignal: true, isRequired: false, transformFunction: null }, drawerWidth: { classPropertyName: "drawerWidth", publicName: "drawerWidth", isSignal: true, isRequired: false, transformFunction: null }, component: { classPropertyName: "component", publicName: "component", isSignal: true, isRequired: true, transformFunction: null }, injector: { classPropertyName: "injector", publicName: "injector", isSignal: true, isRequired: true, transformFunction: null }, closeOnMask: { classPropertyName: "closeOnMask", publicName: "closeOnMask", isSignal: true, isRequired: false, transformFunction: null }, onClose: { classPropertyName: "onClose", publicName: "onClose", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"side-drawer-mask\">\r\n  <aside\r\n    class=\"side-drawer\"\r\n    role=\"dialog\"\r\n    aria-modal=\"true\"\r\n    [attr.aria-label]=\"title()\"\r\n    [style.width]=\"drawerWidth() || null\"\r\n    (click)=\"$event.stopPropagation()\"\r\n  >\r\n    <header class=\"side-drawer__header\">\r\n      <h2>{{ title() }}</h2>\r\n      <button\r\n        type=\"button\"\r\n        class=\"side-drawer__close\"\r\n        [attr.aria-label]=\"closeLabel()\"\r\n        (click)=\"handleCloseClick()\"\r\n      >\r\n        \u00D7\r\n      </button>\r\n    </header>\r\n\r\n    <div class=\"side-drawer__body\">\r\n      <ng-container\r\n        *ngComponentOutlet=\"component(); injector: injector()\"\r\n      ></ng-container>\r\n    </div>\r\n    <div class=\"side-drawer__footer-host\"></div>\r\n  </aside>\r\n</div>\r\n", styles: [":host{position:fixed;inset:0;z-index:1300;display:flex;justify-content:flex-end}.side-drawer-mask{width:100%;display:flex;justify-content:flex-end;background:#0f172a14}.side-drawer{width:min(388px,100%);height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;border-left:1px solid #ebeef3;background:var(--color-surface);box-shadow:none}.side-drawer__header{min-height:42px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid #edf1f5;box-sizing:border-box}.side-drawer__header h2{margin:0;color:#1f2937;font-size:14px;font-weight:500;line-height:1.4}.side-drawer__close{border:0;background:transparent;color:#9ca3af;line-height:1;cursor:pointer}.side-drawer__body{min-height:0;overflow:auto}.side-drawer__footer-host:empty{display:none}\n"], dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.8", type: SideDrawerContainerComponent, isStandalone: true, selector: "s-side-drawer-container", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, closeLabel: { classPropertyName: "closeLabel", publicName: "closeLabel", isSignal: true, isRequired: false, transformFunction: null }, drawerWidth: { classPropertyName: "drawerWidth", publicName: "drawerWidth", isSignal: true, isRequired: false, transformFunction: null }, maskClass: { classPropertyName: "maskClass", publicName: "maskClass", isSignal: true, isRequired: false, transformFunction: null }, contained: { classPropertyName: "contained", publicName: "contained", isSignal: true, isRequired: false, transformFunction: null }, component: { classPropertyName: "component", publicName: "component", isSignal: true, isRequired: true, transformFunction: null }, injector: { classPropertyName: "injector", publicName: "injector", isSignal: true, isRequired: true, transformFunction: null }, closeOnMask: { classPropertyName: "closeOnMask", publicName: "closeOnMask", isSignal: true, isRequired: false, transformFunction: null }, onClose: { classPropertyName: "onClose", publicName: "onClose", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { componentAttached: "componentAttached" }, host: { properties: { "class.side-drawer-container--contained": "contained()" } }, viewQueries: [{ propertyName: "contentOutlet", first: true, predicate: NgComponentOutlet, descendants: true }], ngImport: i0, template: "<div class=\"side-drawer-mask {{ maskClass() }}\" (click)=\"handleMaskClick()\">\n  <aside\r\n    class=\"side-drawer\"\r\n    role=\"dialog\"\r\n    aria-modal=\"true\"\r\n    [attr.aria-label]=\"title()\"\r\n    [style.width]=\"drawerWidth() || null\"\r\n    (click)=\"$event.stopPropagation()\"\r\n  >\r\n    <header class=\"side-drawer__header\">\r\n      <h2>{{ title() }}</h2>\r\n      <button\r\n        type=\"button\"\r\n        class=\"side-drawer__close\"\r\n        [attr.aria-label]=\"closeLabel()\"\r\n        (click)=\"handleCloseClick()\"\r\n      >\r\n        \u00D7\r\n      </button>\r\n    </header>\r\n\r\n    <div class=\"side-drawer__body\">\r\n      <ng-container *ngComponentOutlet=\"component(); injector: injector()\"></ng-container>\n    </div>\r\n    <div class=\"side-drawer__footer-host\"></div>\r\n  </aside>\r\n</div>\r\n", styles: [":host{position:fixed;inset:0;z-index:var(--side-drawer-z-index, 1300);display:flex;justify-content:flex-end}:host.side-drawer-container--contained{position:absolute}.side-drawer-mask{width:100%;display:flex;justify-content:flex-end;background:#0f172a14}.side-drawer{width:min(388px,100%);height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;border-left:1px solid #ebeef3;background:var(--color-surface);box-shadow:none}.side-drawer__header{min-height:42px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid #edf1f5;box-sizing:border-box}.side-drawer__header h2{margin:0;color:#1f2937;font-size:14px;font-weight:500;line-height:1.4}.side-drawer__close{border:0;background:transparent;color:#9ca3af;line-height:1;cursor:pointer}.side-drawer__body{min-height:0;overflow:auto}.side-drawer__footer-host:empty{display:none}\n"], dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SideDrawerContainerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 's-side-drawer-container', imports: [NgComponentOutlet], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"side-drawer-mask\">\r\n  <aside\r\n    class=\"side-drawer\"\r\n    role=\"dialog\"\r\n    aria-modal=\"true\"\r\n    [attr.aria-label]=\"title()\"\r\n    [style.width]=\"drawerWidth() || null\"\r\n    (click)=\"$event.stopPropagation()\"\r\n  >\r\n    <header class=\"side-drawer__header\">\r\n      <h2>{{ title() }}</h2>\r\n      <button\r\n        type=\"button\"\r\n        class=\"side-drawer__close\"\r\n        [attr.aria-label]=\"closeLabel()\"\r\n        (click)=\"handleCloseClick()\"\r\n      >\r\n        \u00D7\r\n      </button>\r\n    </header>\r\n\r\n    <div class=\"side-drawer__body\">\r\n      <ng-container\r\n        *ngComponentOutlet=\"component(); injector: injector()\"\r\n      ></ng-container>\r\n    </div>\r\n    <div class=\"side-drawer__footer-host\"></div>\r\n  </aside>\r\n</div>\r\n", styles: [":host{position:fixed;inset:0;z-index:1300;display:flex;justify-content:flex-end}.side-drawer-mask{width:100%;display:flex;justify-content:flex-end;background:#0f172a14}.side-drawer{width:min(388px,100%);height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;border-left:1px solid #ebeef3;background:var(--color-surface);box-shadow:none}.side-drawer__header{min-height:42px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid #edf1f5;box-sizing:border-box}.side-drawer__header h2{margin:0;color:#1f2937;font-size:14px;font-weight:500;line-height:1.4}.side-drawer__close{border:0;background:transparent;color:#9ca3af;line-height:1;cursor:pointer}.side-drawer__body{min-height:0;overflow:auto}.side-drawer__footer-host:empty{display:none}\n"] }]
-        }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], closeLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeLabel", required: false }] }], drawerWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "drawerWidth", required: false }] }], component: [{ type: i0.Input, args: [{ isSignal: true, alias: "component", required: true }] }], injector: [{ type: i0.Input, args: [{ isSignal: true, alias: "injector", required: true }] }], closeOnMask: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnMask", required: false }] }], onClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "onClose", required: false }] }] } });
+            args: [{ selector: 's-side-drawer-container', imports: [NgComponentOutlet], host: {
+                        '[class.side-drawer-container--contained]': 'contained()',
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"side-drawer-mask {{ maskClass() }}\" (click)=\"handleMaskClick()\">\n  <aside\r\n    class=\"side-drawer\"\r\n    role=\"dialog\"\r\n    aria-modal=\"true\"\r\n    [attr.aria-label]=\"title()\"\r\n    [style.width]=\"drawerWidth() || null\"\r\n    (click)=\"$event.stopPropagation()\"\r\n  >\r\n    <header class=\"side-drawer__header\">\r\n      <h2>{{ title() }}</h2>\r\n      <button\r\n        type=\"button\"\r\n        class=\"side-drawer__close\"\r\n        [attr.aria-label]=\"closeLabel()\"\r\n        (click)=\"handleCloseClick()\"\r\n      >\r\n        \u00D7\r\n      </button>\r\n    </header>\r\n\r\n    <div class=\"side-drawer__body\">\r\n      <ng-container *ngComponentOutlet=\"component(); injector: injector()\"></ng-container>\n    </div>\r\n    <div class=\"side-drawer__footer-host\"></div>\r\n  </aside>\r\n</div>\r\n", styles: [":host{position:fixed;inset:0;z-index:var(--side-drawer-z-index, 1300);display:flex;justify-content:flex-end}:host.side-drawer-container--contained{position:absolute}.side-drawer-mask{width:100%;display:flex;justify-content:flex-end;background:#0f172a14}.side-drawer{width:min(388px,100%);height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;border-left:1px solid #ebeef3;background:var(--color-surface);box-shadow:none}.side-drawer__header{min-height:42px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid #edf1f5;box-sizing:border-box}.side-drawer__header h2{margin:0;color:#1f2937;font-size:14px;font-weight:500;line-height:1.4}.side-drawer__close{border:0;background:transparent;color:#9ca3af;line-height:1;cursor:pointer}.side-drawer__body{min-height:0;overflow:auto}.side-drawer__footer-host:empty{display:none}\n"] }]
+        }], propDecorators: { componentAttached: [{ type: i0.Output, args: ["componentAttached"] }], contentOutlet: [{
+                type: ViewChild,
+                args: [NgComponentOutlet]
+            }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], closeLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeLabel", required: false }] }], drawerWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "drawerWidth", required: false }] }], maskClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "maskClass", required: false }] }], contained: [{ type: i0.Input, args: [{ isSignal: true, alias: "contained", required: false }] }], component: [{ type: i0.Input, args: [{ isSignal: true, alias: "component", required: true }] }], injector: [{ type: i0.Input, args: [{ isSignal: true, alias: "injector", required: true }] }], closeOnMask: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnMask", required: false }] }], onClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "onClose", required: false }] }] } });
 
 const SIDE_DRAWER_DATA = new InjectionToken('SIDE_DRAWER_DATA');
 
 class SideDrawerService {
+    document = inject(DOCUMENT);
     injector = inject(Injector);
     overlayHost = inject(PlatformOverlayPortalHost);
     open(component, config) {
@@ -7072,19 +9130,29 @@ class SideDrawerService {
         const attachedRef = this.overlayHost.attachComponent(SideDrawerContainerComponent, {
             injector: this.injector,
             viewContainerRef: config?.viewContainerRef,
+            container: config?.container,
+            host: config?.host,
+            scope: config?.scope,
+            owner: config?.owner,
             config: {
-                disposeOnNavigation: true,
+                disposeOnNavigation: config?.closeOnRouteLeave ?? true,
+                panelClass: config?.panelClass,
             },
         });
         if (!attachedRef) {
             return drawerRef;
         }
         const containerRef = attachedRef.componentRef;
+        containerRef.instance.componentAttached.subscribe((instance) => {
+            drawerRef.attachComponentInstance(instance);
+        });
         containerRef.setInput('title', config?.title ?? '');
         containerRef.setInput('closeLabel', config?.closeLabel ?? '关闭');
-        containerRef.setInput('drawerWidth', config?.drawerWidth ?? '');
+        containerRef.setInput('drawerWidth', toOverlayCssSize(config?.width) || (config?.drawerWidth ?? ''));
+        containerRef.setInput('maskClass', toOverlayClassName(config?.maskClass));
+        containerRef.setInput('contained', Boolean(config?.container || config?.host));
         containerRef.setInput('component', component);
-        containerRef.setInput('closeOnMask', config?.closeOnMask ?? false);
+        containerRef.setInput('closeOnMask', config?.closeOnMaskClick ?? config?.closeOnMask ?? false);
         containerRef.setInput('onClose', () => drawerRef.close());
         containerRef.setInput('injector', Injector.create({
             providers: [
@@ -7096,8 +9164,31 @@ class SideDrawerService {
         drawerRef.afterClosed$.subscribe(() => {
             attachedRef.dispose();
         });
+        attachedRef.overlayRef.detachments().subscribe(() => drawerRef.close());
+        if (config?.closeOnEsc ?? true) {
+            attachedRef.overlayRef.keydownEvents().subscribe((event) => {
+                if (event.key !== 'Escape') {
+                    return;
+                }
+                if (this.isEscapeFromNativeDialog(event)) {
+                    return;
+                }
+                event.preventDefault();
+                drawerRef.close();
+            });
+        }
         return drawerRef;
     }
+    isEscapeFromNativeDialog(event) {
+        const dialogElement = this.document.defaultView?.HTMLDialogElement;
+        if (!dialogElement) {
+            return false;
+        }
+        if (this.document.querySelector('dialog[open]')) {
+            return true;
+        }
+        return event.composedPath().some((target) => target instanceof dialogElement);
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SideDrawerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SideDrawerService, providedIn: 'root' });
 }
@@ -7135,5 +9226,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { APP_RUNTIME_CONTEXT, AUTHENTICATED_STATE_GETTER, ActionMenuComponent, AppFooter, AppHeader, AppShell, Aside, Avatar, AvatarGroup, Badge, BaseListComponent, BottomNav, Breadcrumb, BreadcrumbItemComponent, BsBaseList, BsLoadingDirective, BsMessage, BsMessageService, BsSelect, CORE_AUTH_GUARD_CONFIG, Card, DeleteConfirmDialogComponent as ConfirmDialogComponent, Content, DEFAULT_APP_RUNTIME_CONTEXT, DEFAULT_EMOJI_PICKER_OPTIONS, DEFAULT_EMOJI_PICKER_TABS, DEFAULT_HTTP_RESPONSE_INTERCEPTOR_CONFIG, DEFAULT_HTTP_SUCCESS_MESSAGES, DIALOG_DATA, DatePicker, DeleteConfirmDialogComponent, DialogContainerRef, DialogContainerService, ElectronRequest, EmojiPicker, EmptyFooter, EmptySidebar, EnumPicePipe, FileUploadButtonComponent, FilterSummary, FlexColumnFillDirective, GlobalErrorHandler, HTTP_AUTH_TOKEN_GETTER, HTTP_CONFIG, HTTP_RESPONSE_INTERCEPTOR_CONFIG, HTTP_SUCCESS_MESSAGE, HTTP_UNAUTHORIZED_HANDLER, HasPermissionDirective, Header, HttpConfig, ListPageActionColDirective, ListPageCellTextDirective, ListPageCheckboxColDirective, ListPageColumnDirective, ListPageContentDesktopComponent, ListPageContentDesktopSlotDirective, ListPageEmptyDirective, ListPageFileActionDirective, ListPageFilterActionsDirective, ListPageFilterControlDirective, ListPageFilterFieldDirective, ListPageFilterGridDirective, ListPageFilterLabelDirective, ListPageFilterPanelComponent, ListPageHeaderActionsDirective, ListPageHeaderComponent, ListPageHeaderFiltersDirective, ListPageHeaderLayoutDirective, ListPageHeaderRowComponent, ListPageHeaderSlotDirective, ListPageIconButtonDirective, ListPageLayoutComponent, ListPagePaginationComponent, ListPagePaginationSlotDirective, ListPageRowActionDangerDirective, ListPageRowActionTriggerDirective, ListPageRowActionsDirective, ListPageSidebarComponent, ListPageSidebarSearchDirective, ListPageSidebarSlotDirective, ListPageSidebarTreeDirective, ListPageSummarySlotDirective, ListPageTabDirective, ListPageTableDirective, ListPageTableScrollDirective, ListPageTableWrapDirective, ListPageTabsDirective, ListPageTreeIndentDirective, ListPageTreeToggleDirective, ListSearchPanel, MAlphabet, MContent, MESSAGE_SERVICE, MFooter, MItem, MItemActionsSlot, MItemAvatarFaceDirective, MItemAvatarFrameDirective, MItemAvatarGroupDirective, MItemAvatarIconDirective, MItemAvatarPortraitDirective, MItemAvatarSlot, MItemBadgeDirective, MItemFooterSlot, MItemIndicatorDirective, MItemMarkerDirective, MItemMenuChevronDirective, MItemMenuIconDirective, MItemMetaSlot, MItemPrefixSlot, MItemPresenceDirective, MItemProfileAvatarDirective, MItemProfileNameDirective, MItemProfileTitleDirective, MItemStatusSlot, MItemSummarySlot, MItemTitleSlot, MItemTrailingSlot, MItemUnreadDotDirective, MList, MPage, MobilePageContentSlotDirective as MPageContentSlotDirective, MobilePageFooterSlotDirective as MPageFooterSlotDirective, MobilePageHeaderSlotDirective as MPageHeaderSlotDirective, MPersonCardDesktopLayer, MPersonCardMobileLayer, MProductShell, MProductShellBottomSlot, MProductShellMainSlot, MProductShellRailSlot, MRailNav, MTabs, MToolbar, M_ALPHABET_DEFAULT_LETTERS, M_ITEM_APPEARANCE_DIRECTIVES, M_ITEM_SLOT_DIRECTIVES, MenuComponent, MenuItemComponent, MerchantCard, MinimalHeader, MobilePageContentSlotDirective, MobilePageFooterSlotDirective, MobilePageHeaderSlotDirective, MobilePageLayoutComponent, NotificationCenter, Outlets, PContent, PFooter, PLATFORM_OVERLAY_VIEW_CONTAINER_REF, PPage, PPageContentSlotDirective, PPageFooterSlotDirective, PPageHeaderSlotDirective, PPageSidebarSlotDirective, PSidebar, PToolbar, Pagination, PermissionService, PlatformDrawerCheckbox, PlatformDrawerCheckboxGroup, PlatformDrawerComponentBar, PlatformDrawerComponentItem, PlatformDrawerComponentList, PlatformDrawerEmpty, PlatformDrawerError, PlatformDrawerField, PlatformDrawerFooter, PlatformDrawerForm, PlatformDrawerFormModule, PlatformDrawerInputAction, PlatformDrawerInputActionButton, PlatformDrawerSection, PlatformDrawerTable, PlatformDrawerToolbar, PlatformDrawerTree, PlatformDrawerTreeItem, PlatformDrawerTreeToggle, PlatformInputDirective, PlatformLoginPage, PlatformOverlayPortalHost, PlatformPrefixedInput, PlatformSearchComponent, PlatformSwitch, RoutePlaceholderPageComponent, RuntimeService, SHELL_CONFIG, SIDE_DRAWER_DATA, SearchBar, SectionNav, Segmented, ShellLayout, SideDrawerRef, SideDrawerService, SidebarHeaderLayout, StatusDot, Steps, Tabs, Tag, ThrowException, Timeline, TopNavHeader, TopNavLayout, Tree, TreeSelect, Upload, coreAuthGuard, coreGuestOnlyGuard, decreaseLoading, increaseLoading, injectShellConfig, isLoading, provideAuthenticatedStateGetter, provideCoreAuthGuardConfig, provideGlobalErrorHandler, provideHttpAuthTokenGetter, provideHttpConfig, provideHttpResponseInterceptorConfig, provideHttpUnauthorizedHandler, provideIMessageService, provideRuntimeContext, provideShellConfig, provideShellConfigFactory, requestInterceptor, resolveShellParts, responseInterceptor, withHttpSuccessMessage, withoutHttpSuccessMessage };
+export { APP_RUNTIME_CONTEXT, AUTHENTICATED_STATE_GETTER, ActionMenuComponent, AppFooter, AppHeader, AppOverlayHostDirective, AppShell, Aside, Avatar, AvatarGroup, Badge, BaseListComponent, BottomNav, Breadcrumb, BreadcrumbItemComponent, BsBaseList, BsLoadingDirective, BsMessage, BsMessageService, BsSelect, CORE_AUTH_GUARD_CONFIG, Card, DeleteConfirmDialogComponent as ConfirmDialogComponent, Content, DEFAULT_APP_RUNTIME_CONTEXT, DEFAULT_EMOJI_PICKER_OPTIONS, DEFAULT_EMOJI_PICKER_TABS, DEFAULT_HTTP_RESPONSE_INTERCEPTOR_CONFIG, DEFAULT_HTTP_SUCCESS_MESSAGES, DIALOG_DATA, DatePicker, DeleteConfirmDialogComponent, DialogContainerRef, DialogContainerService, ElectronRequest, EmojiPicker, EmptyFooter, EmptySidebar, EnumPicePipe, FileUploadButtonComponent, FilterSummary, FlexColumnFillDirective, GlobalErrorHandler, HOSTED_AUTH_EVENT_HANDLER, HOSTED_AUTH_EVENT_LISTENER_CONFIG, HOSTED_AUTH_MESSAGE_CHANNEL, HOSTED_AUTH_MESSAGE_VERSION, HOSTED_AUTH_WINDOW_EVENT_NAMES, HOSTED_WORKSPACE_VIEWPORTS, HTTP_AUTH_TOKEN_GETTER, HTTP_CONFIG, HTTP_RESPONSE_INTERCEPTOR_CONFIG, HTTP_SUCCESS_MESSAGE, HTTP_UNAUTHORIZED_HANDLER, HasPermissionDirective, Header, HostedAuthBridgeService, HostedAuthEventListenerService, HostedAuthTrustedMessageSourceRegistry, HttpConfig, ImagePreview, ListPageActionColDirective, ListPageCellTextDirective, ListPageCheckboxColDirective, ListPageColumnDirective, ListPageContentDesktopComponent, ListPageContentDesktopSlotDirective, ListPageEmptyDirective, ListPageFileActionDirective, ListPageFilterActionsDirective, ListPageFilterControlDirective, ListPageFilterFieldDirective, ListPageFilterGridDirective, ListPageFilterLabelDirective, ListPageFilterPanelComponent, ListPageHeaderActionsDirective, ListPageHeaderComponent, ListPageHeaderFiltersDirective, ListPageHeaderLayoutDirective, ListPageHeaderRowComponent, ListPageHeaderSlotDirective, ListPageIconButtonDirective, ListPageLayoutComponent, ListPagePaginationComponent, ListPagePaginationSlotDirective, ListPageRowActionDangerDirective, ListPageRowActionTriggerDirective, ListPageRowActionsDirective, ListPageSidebarComponent, ListPageSidebarSearchDirective, ListPageSidebarSlotDirective, ListPageSidebarTreeDirective, ListPageSummarySlotDirective, ListPageTabDirective, ListPageTableDirective, ListPageTableScrollDirective, ListPageTableWrapDirective, ListPageTabsDirective, ListPageTreeIndentDirective, ListPageTreeToggleDirective, ListSearchPanel, MAlphabet, MContent, MESSAGE_SERVICE, MFooter, MItem, MItemActionsSlot, MItemAvatarFaceDirective, MItemAvatarFrameDirective, MItemAvatarGroupDirective, MItemAvatarIconDirective, MItemAvatarPortraitDirective, MItemAvatarSlot, MItemBadgeDirective, MItemFooterSlot, MItemIndicatorDirective, MItemMarkerDirective, MItemMenuChevronDirective, MItemMenuIconDirective, MItemMetaSlot, MItemPrefixSlot, MItemPresenceDirective, MItemProfileAvatarDirective, MItemProfileNameDirective, MItemProfileTitleDirective, MItemStatusSlot, MItemSummarySlot, MItemTitleSlot, MItemTrailingSlot, MItemUnreadDotDirective, MList, MPage, MobilePageContentSlotDirective as MPageContentSlotDirective, MobilePageFooterSlotDirective as MPageFooterSlotDirective, MobilePageHeaderSlotDirective as MPageHeaderSlotDirective, MPersonCardDesktopLayer, MPersonCardMobileLayer, MRailNav, MTabs, MToolbar, M_ALPHABET_DEFAULT_LETTERS, M_ITEM_APPEARANCE_DIRECTIVES, M_ITEM_SLOT_DIRECTIVES, MenuComponent, MenuItemComponent, MerchantCard, MinimalHeader, MobilePageContentSlotDirective, MobilePageFooterSlotDirective, MobilePageHeaderSlotDirective, MobilePageLayoutComponent, NoticeCarousel, NotificationCenter, Outlets, OverlayHostRegistry, PContent, PFooter, PLATFORM_OVERLAY_VIEW_CONTAINER_REF, PMenuComponent, PMenuItemComponent, PMenuSeparatorComponent, PPage, PPageContentSlotDirective, PPageFooterSlotDirective, PPageHeaderSlotDirective, PPageSidebarSlotDirective, PSidebar, PToolbar, Pagination, PermissionService, PlatformDrawerCheckbox, PlatformDrawerCheckboxGroup, PlatformDrawerComponentBar, PlatformDrawerComponentItem, PlatformDrawerComponentList, PlatformDrawerEmpty, PlatformDrawerError, PlatformDrawerField, PlatformDrawerFooter, PlatformDrawerForm, PlatformDrawerFormModule, PlatformDrawerInputAction, PlatformDrawerInputActionButton, PlatformDrawerSection, PlatformDrawerTable, PlatformDrawerToolbar, PlatformDrawerTree, PlatformDrawerTreeItem, PlatformDrawerTreeToggle, PlatformInputDirective, PlatformLoginPage, PlatformOverlayPortalHost, PlatformPrefixedInput, PlatformSearchComponent, PlatformSwitch, RoutePlaceholderPageComponent, RuntimeService, SHELL_CONFIG, SIDE_DRAWER_DATA, SRichEditorComponent, S_RICH_EDITOR_BASE_INIT, S_RICH_EDITOR_CONFIG, S_RICH_EDITOR_CONTENT_STYLE, S_RICH_EDITOR_DEFAULT_CLOUD_CHANNEL, S_RICH_EDITOR_DEFAULT_CONFIG, S_RICH_EDITOR_DEFAULT_MODEL_EVENTS, S_RICH_EDITOR_DEFAULT_OUTPUT_FORMAT, S_RICH_EDITOR_DOCUMENT_BODY_CLASS, S_RICH_EDITOR_DOCUMENT_CONTENT_STYLE, S_RICH_EDITOR_DOCUMENT_PAGE_METRICS, S_RICH_EDITOR_DOCUMENT_ZOOM_TOOLBAR, S_RICH_EDITOR_PAGEBREAK_SEPARATOR, S_RICH_EDITOR_PRESET_CONFIGS, S_RICH_EDITOR_UPLOAD_ADAPTER, SearchBar, SectionNav, Segmented, ShellLayout, SideDrawerRef, SideDrawerService, SidebarHeaderLayout, StatusDot, Steps, Tabs, Tag, ThrowException, Timeline, TopNavHeader, TopNavLayout, Tree, TreeSelect, Upload, WebLayoutSideNavComponent, collectRichEditorSetup, coreAuthGuard, coreGuestOnlyGuard, createAppRuntimeProviders, decreaseLoading, getRichEditorPresetInit, increaseLoading, injectShellConfig, isLoading, mergeRichEditorInit, provideAuthenticatedStateGetter, provideCoreAuthGuardConfig, provideGlobalErrorHandler, provideHostedAuthEventHandler, provideHttpAuthTokenGetter, provideHttpConfig, provideHttpResponseInterceptorConfig, provideHttpUnauthorizedHandler, provideIMessageService, provideRuntimeContext, provideSRichEditor, provideSRichEditorUploadAdapter, provideShellConfig, provideShellConfigFactory, requestInterceptor, resolveShellParts, responseInterceptor, setupRichEditorDocumentPagination, setupRichEditorDocumentZoom, splitRichEditorDocumentPages, syncPlatformScrollbarStyles, syncPlatformScrollbarStylesToIframe, toOverlayClassName, toOverlayCssSize, withHttpSuccessMessage, withoutHttpSuccessMessage };
 //# sourceMappingURL=platform-core-ng.mjs.map