@flyos/design-system 2.0.0 → 2.2.0

package/fesm2022/flyos-design-system.mjs

@@ -3,7 +3,6 @@ import { InjectionToken, signal, computed, Injectable, inject, TemplateRef, View
 import { catchError, throwError, Subject, from, firstValueFrom, of, Observable, map, ReplaySubject, retry, timer, tap } from 'rxjs';
 import { HttpClient, HttpParams, HttpHeaders, HttpErrorResponse, HttpEventType } from '@angular/common/http';
 import { switchMap, debounceTime, distinctUntilChanged, filter, catchError as catchError$1 } from 'rxjs/operators';
-import { HubConnectionBuilder, HttpTransportType, LogLevel, HubConnectionState } from '@microsoft/signalr';
 import { Router, NavigationEnd } from '@angular/router';
 import * as i1$1 from '@angular/common';
 import { isPlatformBrowser, NgComponentOutlet, CommonModule, DOCUMENT, NgTemplateOutlet, NgClass, DatePipe } from '@angular/common';
@@ -48,7 +47,7 @@ import { CdkConnectedOverlay, CdkOverlayOrigin } from '@angular/cdk/overlay';
 // tools/publish-library.ps1 at bump time, and asserted by the spec beside this file.
 // Used only for the diagnostic message; the duplicate-instance detection itself is
 // version-agnostic, so a stale literal misnames a fork rather than hiding one.
-const FLY_DS_VERSION = '2.0.0';
+const FLY_DS_VERSION = '2.2.0';
 const FLY_DS_REGISTRY_KEY = '__FLY_DS_INSTANCES__';
 /**
  * Records this design-system instance on the shared `scope` and returns the
@@ -708,23 +707,42 @@ const FLY_STANDALONE_AUTH_CONFIG = new InjectionToken('FLY_STANDALONE_AUTH_CONFI
  * across replicas). The bearer rides as `?access_token=` via the {@link AuthService} token. Idempotent
  * `connect()`; safe to call once auth is established.</p>
  *
- * <p>Requires `@microsoft/signalr` (declared a peer dependency of the design system).</p>
+ * <p>Requires `@microsoft/signalr` (declared a peer dependency of the design system). The package is
+ * imported DYNAMICALLY on first `connect()`: this client sits in the core design system, which every
+ * boot loads, and a static import made `@microsoft/signalr` (~14 KB compressed) part of every boot's
+ * shared-module wave even though no bytes are needed until the hub actually connects. Under Native
+ * Federation the dynamic import resolves through the same import map / shared singleton as a static
+ * one — only the WHEN changes.</p>
  */
 class FlyHubClient {
     auth = inject(AuthService);
     connection = null;
+    /** In-flight first connect (module import + build + start). Guards double-connect. */
+    connecting = null;
+    /** Set when disconnect() arrives while the first connect is still importing/starting. */
+    abandonConnect = false;
     connected = signal(false, ...(ngDevMode ? [{ debugName: "connected" }] : /* istanbul ignore next */ []));
     _authRefresh$ = new Subject();
     /** Emits when the server signals this user's authorization shape changed. */
     authRefresh$ = this._authRefresh$.asObservable();
     /** Open the hub connection (idempotent). No-op without an access token. */
     connect() {
-        if (this.connection !== null)
+        if (this.connection !== null || this.connecting !== null)
             return;
         const token = this.auth.accessToken();
         if (!token)
             return;
-        this.connection = new HubConnectionBuilder()
+        this.abandonConnect = false;
+        this.connecting = this.doConnect()
+            .catch(() => this.connected.set(false))
+            .finally(() => { this.connecting = null; });
+    }
+    async doConnect() {
+        const { HubConnectionBuilder, HttpTransportType, LogLevel } = await import('@microsoft/signalr');
+        // A disconnect() may have raced the import — stay down.
+        if (this.abandonConnect)
+            return;
+        const connection = new HubConnectionBuilder()
             .withUrl('/hubs/fly', {
             accessTokenFactory: () => this.auth.accessToken() ?? '',
             skipNegotiation: true,
@@ -733,15 +751,25 @@ class FlyHubClient {
             .withAutomaticReconnect([0, 2000, 5000, 10000, 30000])
             .configureLogging(LogLevel.Warning)
             .build();
-        this.connection.on('AuthRefresh', (payload) => this._authRefresh$.next(payload ?? {}));
-        this.connection.onreconnected(() => this.connected.set(true));
-        this.connection.onreconnecting(() => this.connected.set(false));
-        this.connection.onclose(() => { this.connected.set(false); this.connection = null; });
-        this.connection.start()
+        this.connection = connection;
+        connection.on('AuthRefresh', (payload) => this._authRefresh$.next(payload ?? {}));
+        connection.onreconnected(() => this.connected.set(true));
+        connection.onreconnecting(() => this.connected.set(false));
+        connection.onclose(() => { this.connected.set(false); this.connection = null; });
+        await connection.start()
             .then(() => this.connected.set(true))
             .catch(() => this.connected.set(false));
     }
     async disconnect() {
+        // A first connect still importing/starting: mark it abandoned and wait it out,
+        // so a connection can't surface after the caller believed it closed.
+        if (this.connecting) {
+            this.abandonConnect = true;
+            try {
+                await this.connecting;
+            }
+            catch { /* connect failure — already down */ }
+        }
         if (this.connection) {
             const c = this.connection;
             this.connection = null;
@@ -753,7 +781,11 @@ class FlyHubClient {
         }
     }
     get isConnected() {
-        return this.connection?.state === HubConnectionState.Connected;
+        // String-compare instead of `=== HubConnectionState.Connected`: the enum is a
+        // VALUE import, and pulling it statically would re-create the eager edge this
+        // client exists to avoid. `HubConnectionState` is a string enum — its
+        // `Connected` member is the literal 'Connected'.
+        return this.connection?.state === 'Connected';
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FlyHubClient, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FlyHubClient, providedIn: 'root' });
@@ -1594,6 +1626,7 @@ const DS_BASELINE_LOCALES = {
         'currency_selector.clear': 'Clear selection',
         'currency_selector.pinned': 'Frequently used',
         'currency_selector.all': 'All currencies',
+        'currency_selector.locked_default_reason': 'This currency is locked and can’t be changed.',
         // chat composer (fly-chat-composer)
         'chat_composer.label.message': 'Message',
         'chat_composer.label.mention_suggestions': 'Mention suggestions',
@@ -1957,6 +1990,7 @@ const DS_BASELINE_LOCALES = {
         'currency_selector.clear': 'مسح التحديد',
         'currency_selector.pinned': 'الأكثر استخداماً',
         'currency_selector.all': 'كل العملات',
+        'currency_selector.locked_default_reason': 'هذه العملة مقفلة ولا يمكن تغييرها.',
         // chat composer (fly-chat-composer)
         'chat_composer.label.message': 'رسالة',
         'chat_composer.label.mention_suggestions': 'اقتراحات الإشارة',
@@ -2320,6 +2354,7 @@ const DS_BASELINE_LOCALES = {
         'currency_selector.clear': 'Effacer la sélection',
         'currency_selector.pinned': 'Fréquemment utilisées',
         'currency_selector.all': 'Toutes les devises',
+        'currency_selector.locked_default_reason': 'Cette devise est verrouillée et ne peut pas être modifiée.',
         // chat composer (fly-chat-composer)
         'chat_composer.label.message': 'Message',
         'chat_composer.label.mention_suggestions': 'Suggestions de mention',
@@ -2682,6 +2717,7 @@ const DS_BASELINE_LOCALES = {
         'currency_selector.clear': 'انتخاب صاف کریں',
         'currency_selector.pinned': 'کثرت سے استعمال شدہ',
         'currency_selector.all': 'تمام کرنسیاں',
+        'currency_selector.locked_default_reason': 'یہ کرنسی مقفل ہے اور اسے تبدیل نہیں کیا جا سکتا۔',
         // chat composer (fly-chat-composer)
         'chat_composer.label.message': 'پیغام',
         'chat_composer.label.mention_suggestions': 'تذکرے کی تجاویز',
@@ -4034,6 +4070,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
             args: [{ providedIn: 'root' }]
         }] });
 
+const ENTITY_LINK_LAUNCHER = new InjectionToken('ENTITY_LINK_LAUNCHER');
+
 /**
  * Publishes a {@link WindowHelpHint} for a window so the shell's titlebar Help
  * button deeplinks the help-center reader to the article most relevant to where
@@ -4582,6 +4620,22 @@ const _linkLayerSupported = typeof HTMLLinkElement !== 'undefined' && 'layer' in
 const _cspNonce = FLY_CSP_NONCE;
 /** In-flight fetch promises keyed by appId — prevents duplicate fetches. */
 const _inFlight = new Map();
+/** Upper bound on the optional bytes-applied wait — never holds a caller hostage. */
+const APPLY_CAP_MS = 4000;
+/** Resolves when `el` fires load/error, or after `capMs` — whichever is first. */
+function _awaitLoadCapped(el, capMs) {
+    return new Promise((resolve) => {
+        const timer = setTimeout(done, capMs);
+        function done() {
+            clearTimeout(timer);
+            el.removeEventListener('load', done);
+            el.removeEventListener('error', done);
+            resolve();
+        }
+        el.addEventListener('load', done);
+        el.addEventListener('error', done);
+    });
+}
 // ---------------------------------------------------------------------------
 // Layer order — injected immediately at module init (synchronous, runs once).
 // ---------------------------------------------------------------------------
@@ -4748,9 +4802,21 @@ function _validateHref(href, remoteBaseUrl) {
  * The `data-fly-href` attribute stores the discovered href separately from the
  * element content so idempotency checks can compare the URL without parsing CSS.
  */
-async function loadRemoteStyles(appId, remoteBaseUrl) {
+async function loadRemoteStyles(appId, remoteBaseUrl, opts = {}) {
     if (typeof document === 'undefined')
         return; // SSR guard
+    // Already-applied fast path — see the `preferApplied` option docs.
+    if (opts.preferApplied) {
+        const applied = document.head.querySelector(`link[data-fly-app="${CSS.escape(appId)}"], style[data-fly-app="${CSS.escape(appId)}"]`);
+        if (applied) {
+            // `.sheet` is non-null once the stylesheet is parsed — the bytes signal
+            // for an element whose load event may already have fired.
+            if (!opts.awaitApplied || applied.sheet)
+                return;
+            await _awaitLoadCapped(applied, APPLY_CAP_MS);
+            return;
+        }
+    }
     // Resolve relative remoteBaseUrl (e.g. '/circles-dev') against the current
     // page origin so all downstream URL operations (fetch, origin check) receive
     // an absolute URL. Absolute inputs are returned unchanged by new URL().
@@ -4767,7 +4833,9 @@ async function loadRemoteStyles(appId, remoteBaseUrl) {
     const href = await fetchPromise;
     _inFlight.delete(appId);
     if (!href) {
-        console.warn(`[FlyOS] loadRemoteStyles: no stylesheet found in ${absoluteBase}/index.html for appId="${appId}"`);
+        if (!opts.silent) {
+            console.warn(`[FlyOS] loadRemoteStyles: no stylesheet found in ${absoluteBase}/index.html for appId="${appId}"`);
+        }
         return;
     }
     // Check both <link> and <style> selectors — handle upgrades from the old fallback path.
@@ -4792,19 +4860,95 @@ async function loadRemoteStyles(appId, remoteBaseUrl) {
         if (_cspNonce)
             link.nonce = _cspNonce;
         document.head.appendChild(link);
+        // A stylesheet <link> fires load once its bytes are parsed — the direct signal.
+        if (opts.awaitApplied)
+            await _awaitLoadCapped(link, APPLY_CAP_MS);
     }
     else {
         // Fallback path: <style> with @import layer(remote) for older browsers.
         // CSS Cascade Level 5: `@import url("…") layer(remote)` is the only valid
         // way to place an @import inside a named cascade layer. Block-form
         // `@layer remote { @import … }` is invalid and silently dropped by browsers.
+        //
         const style = document.createElement('style');
         style.setAttribute('data-fly-app', appId);
         style.setAttribute('data-fly-href', href);
         style.textContent = `@import url("${href}") layer(remote);`;
         if (_cspNonce)
             style.nonce = _cspNonce;
+        // Appended synchronously after the `existing` check above — an `await`
+        // between check and append would let a concurrent caller double-inject.
         document.head.appendChild(style);
+        // A <style> element fires no load event for its @import, so for the
+        // bytes-applied guarantee we shadow the same href with a `<link
+        // rel="preload" as="style">`: it rides the @import's own in-flight fetch
+        // (same no-cors request key) and its load event is the byte signal.
+        // Deliberately NO crossorigin attribute — the @import request is no-cors,
+        // and a CORS-mode preload would create a non-matching cache entry
+        // (double fetch).
+        if (opts.awaitApplied) {
+            const preload = document.createElement('link');
+            preload.setAttribute('rel', 'preload');
+            preload.setAttribute('as', 'style');
+            preload.setAttribute('href', href);
+            if (_cspNonce)
+                preload.nonce = _cspNonce;
+            document.head.appendChild(preload);
+            await _awaitLoadCapped(preload, APPLY_CAP_MS);
+            preload.remove();
+        }
+    }
+}
+/**
+ * Warms a remote's stylesheet into the HTTP cache WITHOUT applying it.
+ *
+ * Discovery is identical to {@link loadRemoteStyles} (fetch the remote's
+ * `index.html`, scan for the hashed stylesheet, validate the href), but the
+ * CSS is then fetched with a plain `fetch()` and the body discarded — nothing
+ * is injected into `document.head`.
+ *
+ * Why this exists: applying a stylesheet registers its `@font-face` rules
+ * document-wide, and the browser then downloads every face some text in the
+ * document matches. The shell's deferred warm-up used to APPLY every
+ * registered-but-unopened remote's stylesheet, which on a Circles deep link
+ * pulled Thoughts' self-hosted Inter + Noto Kufi woff2 (~71 KB) into the LCP
+ * window — for an app with no open window (stg trace, 2026-08-15). A cache
+ * prefetch keeps the later real apply (window open, `loadRemoteStyles` with
+ * `awaitApplied`) near-instant while deferring the font cost to the first
+ * open, where the faces are actually about to be used.
+ *
+ * The fetch uses `mode: 'cors'` + `credentials: 'omit'` so its cache entry
+ * matches the apply path's `<link crossorigin="anonymous">` request. (The
+ * legacy `<style>@import` fallback path is no-cors and would not hit this
+ * entry — modern browsers all take the `link[layer]` path, so the fallback
+ * merely re-fetches, same as before.)
+ *
+ * Fail-soft and idempotent: errors are swallowed (the open path retries
+ * loudly), and an already-applied appId is a no-op.
+ */
+async function prefetchRemoteStyles(appId, remoteBaseUrl) {
+    if (typeof document === 'undefined')
+        return; // SSR guard
+    // Already applied — the bytes are necessarily present; nothing to warm.
+    const escapedId = CSS.escape(appId);
+    if (document.head.querySelector(`link[data-fly-app="${escapedId}"], style[data-fly-app="${escapedId}"]`)) {
+        return;
+    }
+    const absoluteBase = new URL(remoteBaseUrl, location.href).href.replace(/\/$/, '');
+    let fetchPromise = _inFlight.get(appId);
+    if (!fetchPromise) {
+        fetchPromise = _discoverStylesheetHref(appId, absoluteBase);
+        _inFlight.set(appId, fetchPromise);
+    }
+    const href = await fetchPromise;
+    _inFlight.delete(appId);
+    if (!href)
+        return;
+    try {
+        await fetch(href, { mode: 'cors', credentials: 'omit', cache: 'default' });
+    }
+    catch {
+        /* unreachable remote — the open path retries and reports */
     }
 }
 /**
@@ -5040,11 +5184,7 @@ class MockAuthService {
         // All signal/computed calls are inside the constructor body so Angular's
         // injection context and ngDevMode are fully set up before they execute.
         this._config = this.getConfig();
-        this._session = signal({
-            accessToken: this._config.token ?? 'mock-token',
-            user: this._config.user,
-            expiresAt: Date.now() + 24 * 60 * 60 * 1000,
-        }, ...(ngDevMode ? [{ debugName: "_session" }] : /* istanbul ignore next */ []));
+        this._session = signal(this.createSession(), ...(ngDevMode ? [{ debugName: "_session" }] : /* istanbul ignore next */ []));
         this.isAuthenticated = computed(() => {
             const s = this._session();
             return s !== null && s.expiresAt > Date.now();
@@ -5068,6 +5208,14 @@ class MockAuthService {
             return;
         this._session.set({ ...session, user: { ...session.user, ...patch } });
     }
+    /** A fresh 24h mock session from the app-supplied config — used at construction and by {@link startLogin}. */
+    createSession() {
+        return {
+            accessToken: this._config.token ?? 'mock-token',
+            user: this._config.user,
+            expiresAt: Date.now() + 24 * 60 * 60 * 1000,
+        };
+    }
     /** Override in subclass to supply app-specific mock data. */
     getConfig() {
         return {
@@ -5088,6 +5236,15 @@ class MockAuthService {
         // Mock mode: already authenticated, nothing to initialize.
     }
     startLogin() {
+        // Parity with a real STS round-trip: startLogin() must land the user back
+        // AUTHENTICATED. After logout() nulls the session, a guard-triggered
+        // startLogin() that only navigated would bounce off authGuard forever
+        // (navigate → guard sees no session → startLogin → navigate → …) and the
+        // login CTA would appear dead. Re-arming the session first makes every
+        // mock login an instant, self-healing "STS visit".
+        if (this._session() === null) {
+            this._session.set(this.createSession());
+        }
         this.router.navigate(this._config.loginRedirect ?? ['/']);
     }
     handleCallback(_code, _state) {
@@ -18618,6 +18775,21 @@ function unwrapCurrencies(res) {
  * i18n is self-sufficient through the `currency_selector.*` keys in `DS_BASELINE_LOCALES`
  * (en/ar/fr/ur); RTL works via logical CSS.
  *
+ * ## `locked`, vs `disabled`
+ * `disabled` is UI convention for "not applicable right now" — greyed out, no explanation,
+ * because none is owed (a form section that only exists once a prior step completes, say).
+ * `locked` is a different claim entirely: **the value is fixed on purpose**, because
+ * something downstream now depends on it (PPM freezes a project's currency the moment any
+ * financial row exists — changing it would silently re-denominate every stored amount).
+ * A dimmed control with no explanation is exactly the failure `skills/magic-bar-actions.md`
+ * §3.6 names for actions ("a vanishing action teaches the user nothing"); the same argument
+ * applies to a frozen field. So `locked` renders differently on purpose: full-opacity (never
+ * dimmed — the value is not "unavailable", it is authoritative), no dropdown affordance at
+ * all, and an always-visible reason caption instead of a hover-only tooltip, so the "why" is
+ * legible to a screen reader without requiring focus and to a sighted user without hovering.
+ * `locked` takes precedence when both are set — it is the more specific state and the
+ * `disabled` trigger markup (with its dropdown affordances) never renders underneath it.
+ *
  * @example
  * ```html
  * <!-- Loads /api/currencies/brief itself: -->
@@ -18628,6 +18800,12 @@ function unwrapCurrencies(res) {
  *   mode="multi"
  *   [allowedCodes]="tenantCurrencies()"
  *   (selectionDetailChange)="onCurrenciesPicked($event)" />
+ *
+ * <!-- Frozen once the project has financial rows — reason is an i18n KEY, never text: -->
+ * <fly-currency-selector
+ *   [(ngModel)]="project.currency"
+ *   [locked]="project.hasFinancialRows"
+ *   lockedReasonKey="projects.currency_locked_reason" />
  * ```
  */
 class FlyCurrencySelectorComponent {
@@ -18650,6 +18828,24 @@ class FlyCurrencySelectorComponent {
     pinnedCodes = input([], ...(ngDevMode ? [{ debugName: "pinnedCodes" }] : /* istanbul ignore next */ []));
     /** Disable the whole control (also driven by reactive-forms `setDisabledState`). */
     disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    /**
+     * Freeze the current selection because something downstream now depends on it — a
+     * DIFFERENT claim than `disabled`. See the class doc's "`locked`, vs `disabled`"
+     * section. Renders the current pick as a plain, non-interactive readout (no dropdown
+     * affordance at all) plus an always-visible reason caption — never a dimmed clickable-
+     * looking control. Takes precedence over `disabled` when both are set.
+     */
+    locked = input(false, ...(ngDevMode ? [{ debugName: "locked" }] : /* istanbul ignore next */ []));
+    /**
+     * i18n KEY (never resolved text — see `skills/magic-bar-actions.md` §3.4) explaining
+     * WHY the control is locked. Omit to use the localized `currency_selector.locked_default_reason`
+     * baseline key; supply your own only when that default reason is wrong for your case
+     * (mirrors `MagicBarActionSpec.disabledTipKey`'s "supply only when the default is wrong"
+     * contract). Ignored while `locked` is `false`.
+     */
+    lockedReasonKey = input(null, ...(ngDevMode ? [{ debugName: "lockedReasonKey" }] : /* istanbul ignore next */ []));
+    /** `I18nService.t()` params for `lockedReasonKey`, e.g. `{ date: frozenOn }`. */
+    lockedReasonParams = input(undefined, ...(ngDevMode ? [{ debugName: "lockedReasonParams" }] : /* istanbul ignore next */ []));
     /** Show the trigger clear (✕) affordance when there is a selection. */
     clearable = input(true, ...(ngDevMode ? [{ debugName: "clearable" }] : /* istanbul ignore next */ []));
     /** Trigger text when nothing is picked. Omit for the localized default. */
@@ -18669,6 +18865,8 @@ class FlyCurrencySelectorComponent {
     _uid = ++_flyCurrencySelectorUid;
     listboxId = `fly-currency-selector-${this._uid}-listbox`;
     triggerId = `fly-currency-selector-${this._uid}-trigger`;
+    /** id of the always-rendered locked-reason caption; `aria-describedby` target of the locked readout. */
+    lockedReasonId = `fly-currency-selector-${this._uid}-locked-reason`;
     isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
     searchTerm = signal('', ...(ngDevMode ? [{ debugName: "searchTerm" }] : /* istanbul ignore next */ []));
     activeIndex = signal(0, ...(ngDevMode ? [{ debugName: "activeIndex" }] : /* istanbul ignore next */ []));
@@ -18709,6 +18907,8 @@ class FlyCurrencySelectorComponent {
     clearText = computed(() => this._i18n.t('currency_selector.clear'), ...(ngDevMode ? [{ debugName: "clearText" }] : /* istanbul ignore next */ []));
     pinnedGroupText = computed(() => this._i18n.t('currency_selector.pinned'), ...(ngDevMode ? [{ debugName: "pinnedGroupText" }] : /* istanbul ignore next */ []));
     allGroupText = computed(() => this._i18n.t('currency_selector.all'), ...(ngDevMode ? [{ debugName: "allGroupText" }] : /* istanbul ignore next */ []));
+    /** Resolved locked-reason text — the default baseline key, or the host's `lockedReasonKey`. */
+    lockedReasonText = computed(() => this._i18n.t(this.lockedReasonKey() ?? 'currency_selector.locked_default_reason', this.lockedReasonParams()), ...(ngDevMode ? [{ debugName: "lockedReasonText" }] : /* istanbul ignore next */ []));
     /** Every offered row, after the `allowedCodes` restriction. */
     available = computed(() => {
         const rows = this.currencies() ?? this._loaded();
@@ -18788,7 +18988,7 @@ class FlyCurrencySelectorComponent {
     }
     // ── Open / close ───────────────────────────────────────────────────────────
     toggleOpen() {
-        if (this.effectiveDisabled())
+        if (this.effectiveDisabled() || this.locked())
             return;
         if (this.isOpen())
             this.close();
@@ -18796,7 +18996,7 @@ class FlyCurrencySelectorComponent {
             this.open();
     }
     open() {
-        if (this.effectiveDisabled() || this.isOpen())
+        if (this.effectiveDisabled() || this.locked() || this.isOpen())
             return;
         this.isOpen.set(true);
         this.activeIndex.set(0);
@@ -18815,7 +19015,7 @@ class FlyCurrencySelectorComponent {
     }
     // ── Selection ──────────────────────────────────────────────────────────────
     pick(currency) {
-        if (this.effectiveDisabled())
+        if (this.effectiveDisabled() || this.locked())
             return;
         if (!this.isMulti()) {
             this._commit([currency.code]);
@@ -18830,13 +19030,13 @@ class FlyCurrencySelectorComponent {
     }
     remove(code, event) {
         event?.stopPropagation();
-        if (this.effectiveDisabled())
+        if (this.effectiveDisabled() || this.locked())
             return;
         this._commit(this._selectedCodes().filter((c) => c.toUpperCase() !== code.toUpperCase()));
     }
     clear(event) {
         event?.stopPropagation();
-        if (this.effectiveDisabled())
+        if (this.effectiveDisabled() || this.locked())
             return;
         this._commit([]);
     }
@@ -18949,13 +19149,13 @@ class FlyCurrencySelectorComponent {
         this._onTouched();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FlyCurrencySelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FlyCurrencySelectorComponent, isStandalone: true, selector: "fly-currency-selector", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, currencies: { classPropertyName: "currencies", publicName: "currencies", isSignal: true, isRequired: false, transformFunction: null }, fetchFn: { classPropertyName: "fetchFn", publicName: "fetchFn", isSignal: true, isRequired: false, transformFunction: null }, allowedCodes: { classPropertyName: "allowedCodes", publicName: "allowedCodes", isSignal: true, isRequired: false, transformFunction: null }, pinnedCodes: { classPropertyName: "pinnedCodes", publicName: "pinnedCodes", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange", selectionDetailChange: "selectionDetailChange", openedChange: "openedChange" }, host: { properties: { "class.fly-currency-selector--open": "isOpen()", "class.fly-currency-selector--disabled": "effectiveDisabled()" }, classAttribute: "fly-currency-selector" }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FlyCurrencySelectorComponent, isStandalone: true, selector: "fly-currency-selector", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, currencies: { classPropertyName: "currencies", publicName: "currencies", isSignal: true, isRequired: false, transformFunction: null }, fetchFn: { classPropertyName: "fetchFn", publicName: "fetchFn", isSignal: true, isRequired: false, transformFunction: null }, allowedCodes: { classPropertyName: "allowedCodes", publicName: "allowedCodes", isSignal: true, isRequired: false, transformFunction: null }, pinnedCodes: { classPropertyName: "pinnedCodes", publicName: "pinnedCodes", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, locked: { classPropertyName: "locked", publicName: "locked", isSignal: true, isRequired: false, transformFunction: null }, lockedReasonKey: { classPropertyName: "lockedReasonKey", publicName: "lockedReasonKey", isSignal: true, isRequired: false, transformFunction: null }, lockedReasonParams: { classPropertyName: "lockedReasonParams", publicName: "lockedReasonParams", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange", selectionDetailChange: "selectionDetailChange", openedChange: "openedChange" }, host: { properties: { "class.fly-currency-selector--open": "isOpen()", "class.fly-currency-selector--disabled": "effectiveDisabled()", "class.fly-currency-selector--locked": "locked()" }, classAttribute: "fly-currency-selector" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => FlyCurrencySelectorComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "searchEl", first: true, predicate: ["searchRef"], descendants: true }, { propertyName: "triggerEl", first: true, predicate: ["triggerRef"], descendants: true }], ngImport: i0, template: "<div\r\n  class=\"fly-currency-selector__wrap\"\r\n  [flyClickOutsideEnabled]=\"isOpen()\"\r\n  (flyClickOutside)=\"close()\"\r\n>\r\n  <!-- \u2500\u2500 Trigger \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n       `aria-label` is never null: a `combobox` does NOT take its accessible name from its\r\n       contents the way a plain button does, so the chips/placeholder painted inside it name\r\n       nothing. Absent a consumer label the localized placeholder supplies the control's\r\n       purpose; its VALUE is still announced from the contents. -->\r\n  <button\r\n    #triggerRef\r\n    type=\"button\"\r\n    [id]=\"triggerId\"\r\n    class=\"fly-currency-selector__trigger\"\r\n    role=\"combobox\"\r\n    aria-haspopup=\"listbox\"\r\n    [attr.aria-expanded]=\"isOpen()\"\r\n    [attr.aria-controls]=\"listboxId\"\r\n    [attr.aria-label]=\"ariaLabel() || placeholderText()\"\r\n    [class.fly-currency-selector__trigger--empty]=\"!hasSelection()\"\r\n    [disabled]=\"effectiveDisabled()\"\r\n    (click)=\"toggleOpen()\"\r\n    (keydown)=\"onTriggerKeydown($event)\"\r\n  >\r\n    @if (selected().length === 0) {\r\n      <span class=\"fly-currency-selector__placeholder\">{{ placeholderText() }}</span>\r\n    } @else {\r\n      <span class=\"fly-currency-selector__chips\">\r\n        @for (c of selected(); track c.code) {\r\n          <span class=\"fly-currency-selector__chip\">\r\n            <span class=\"fly-currency-selector__tile\" aria-hidden=\"true\">\r\n              @if (flagsRenderable() && c.flag) {\r\n                <span class=\"fly-currency-selector__tile-flag\">{{ c.flag }}</span>\r\n              } @else {\r\n                <span class=\"fly-currency-selector__tile-code\">{{ tileCode(c) }}</span>\r\n              }\r\n            </span>\r\n            <span class=\"fly-currency-selector__chip-code\">{{ c.code }}</span>\r\n            <span class=\"fly-currency-selector__chip-symbol\" aria-hidden=\"true\">{{ c.symbol }}</span>\r\n            @if (isMulti() && !effectiveDisabled()) {\r\n              <span\r\n                class=\"fly-currency-selector__chip-remove\"\r\n                role=\"button\"\r\n                tabindex=\"-1\"\r\n                [attr.aria-label]=\"'\u2715 ' + c.code\"\r\n                (click)=\"remove(c.code, $event)\"\r\n                (mousedown)=\"$event.preventDefault()\"\r\n              >\u2715</span>\r\n            }\r\n          </span>\r\n        }\r\n      </span>\r\n    }\r\n\r\n    @if (clearable() && hasSelection() && !effectiveDisabled()) {\r\n      <span\r\n        class=\"fly-currency-selector__clear\"\r\n        role=\"button\"\r\n        tabindex=\"-1\"\r\n        [attr.aria-label]=\"clearText()\"\r\n        [title]=\"clearText()\"\r\n        (click)=\"clear($event)\"\r\n        (mousedown)=\"$event.preventDefault()\"\r\n      >\u2715</span>\r\n    }\r\n\r\n    <span class=\"fly-currency-selector__chevron\" aria-hidden=\"true\">\u25BE</span>\r\n  </button>\r\n\r\n  <!-- \u2500\u2500 Panel \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n  @if (isOpen()) {\r\n    <div class=\"fly-currency-selector__panel\" tabindex=\"-1\" (keydown)=\"onPanelKeydown($event)\">\r\n      <div class=\"fly-currency-selector__search\">\r\n        <input\r\n          #searchRef\r\n          type=\"text\"\r\n          class=\"fly-currency-selector__search-input\"\r\n          role=\"combobox\"\r\n          aria-autocomplete=\"list\"\r\n          [attr.aria-expanded]=\"true\"\r\n          [attr.aria-controls]=\"listboxId\"\r\n          [attr.aria-activedescendant]=\"activeDescendant() || null\"\r\n          [attr.aria-label]=\"searchPlaceholderText()\"\r\n          [placeholder]=\"searchPlaceholderText()\"\r\n          [value]=\"searchTerm()\"\r\n          (input)=\"onSearchInput($any($event.target).value)\"\r\n        />\r\n      </div>\r\n\r\n      @if (loading()) {\r\n        <div class=\"fly-currency-selector__status\" role=\"status\">{{ loadingText() }}</div>\r\n      } @else if (loadFailed()) {\r\n        <div class=\"fly-currency-selector__status fly-currency-selector__status--error\" role=\"alert\">\r\n          <span>{{ errorText() }}</span>\r\n          <button type=\"button\" class=\"fly-currency-selector__retry\" (click)=\"retry()\">\r\n            {{ retryText() }}\r\n          </button>\r\n        </div>\r\n      }\r\n\r\n      <div\r\n        class=\"fly-currency-selector__listbox\"\r\n        role=\"listbox\"\r\n        [id]=\"listboxId\"\r\n        [attr.aria-multiselectable]=\"isMulti() ? true : null\"\r\n        [attr.aria-activedescendant]=\"activeDescendant() || null\"\r\n        [attr.aria-label]=\"ariaLabel() || null\"\r\n      >\r\n        @if (pinned().length > 0) {\r\n          <div class=\"fly-currency-selector__group\" role=\"presentation\">{{ pinnedGroupText() }}</div>\r\n          @for (c of pinned(); track c.code) {\r\n            <ng-container *ngTemplateOutlet=\"row; context: { $implicit: c }\" />\r\n          }\r\n          @if (rest().length > 0) {\r\n            <div class=\"fly-currency-selector__group\" role=\"presentation\">{{ allGroupText() }}</div>\r\n          }\r\n        }\r\n        @for (c of rest(); track c.code) {\r\n          <ng-container *ngTemplateOutlet=\"row; context: { $implicit: c }\" />\r\n        }\r\n\r\n        @if (!loading() && !loadFailed() && filtered().length === 0) {\r\n          <div class=\"fly-currency-selector__status\" role=\"presentation\">{{ noResultsText() }}</div>\r\n        }\r\n      </div>\r\n    </div>\r\n  }\r\n</div>\r\n\r\n<!-- \u2500\u2500 One option row, shared by the pinned and full groups \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n<ng-template #row let-c>\r\n  <div\r\n    class=\"fly-currency-selector__option\"\r\n    role=\"option\"\r\n    tabindex=\"-1\"\r\n    [id]=\"optionId(navIndexOf(c.code))\"\r\n    [attr.aria-selected]=\"isSelected(c.code)\"\r\n    [class.fly-currency-selector__option--selected]=\"isSelected(c.code)\"\r\n    [class.fly-currency-selector__option--active]=\"navIndexOf(c.code) === activeIndex()\"\r\n    (click)=\"pick(c)\"\r\n    (keydown.enter)=\"pick(c)\"\r\n    (mouseenter)=\"onOptionHover(navIndexOf(c.code))\"\r\n  >\r\n    <span class=\"fly-currency-selector__tile\" aria-hidden=\"true\">\r\n      @if (flagsRenderable() && c.flag) {\r\n        <span class=\"fly-currency-selector__tile-flag\">{{ c.flag }}</span>\r\n      } @else {\r\n        <span class=\"fly-currency-selector__tile-code\">{{ tileCode(c) }}</span>\r\n      }\r\n    </span>\r\n\r\n    <span class=\"fly-currency-selector__option-text\">\r\n      <span class=\"fly-currency-selector__option-code\">{{ c.code }}</span>\r\n      <span class=\"fly-currency-selector__option-name\">{{ c.name }}</span>\r\n    </span>\r\n\r\n    <span class=\"fly-currency-selector__option-symbol\" aria-hidden=\"true\">{{ c.symbol }}</span>\r\n\r\n    <span class=\"fly-currency-selector__check\" aria-hidden=\"true\">\r\n      @if (isSelected(c.code)) { \u2713 }\r\n    </span>\r\n  </div>\r\n</ng-template>\r\n", styles: [":host,:host *,:host *:before,:host *:after{box-sizing:border-box}:host{--_surface: var(--surface-card, #fff);--_surface-panel: var(--glass-bg-elevated, var(--surface-card, #fff));--_panel-blur: var(--glass-blur, 40px);--_surface-hover: var(--surface-hover, #f1f5f9);--_surface-active: var(--surface-active, #eef2ff);--_border: var(--surface-border, #e2e8f0);--_text: var(--text-color, #0f172a);--_text-subtle: var(--text-color-secondary, #64748b);--_fill: var(--fill-tertiary, #f3f4f6);--_primary: var(--primary-color);--_danger: var(--system-red, #ef4444);--_radius: 8px;display:inline-block;inline-size:100%;min-inline-size:11rem;font-size:13px;color:var(--_text)}.fly-currency-selector__wrap{position:relative;inline-size:100%}.fly-currency-selector__trigger{display:flex;align-items:center;gap:8px;inline-size:100%;min-block-size:2.25rem;padding-block:4px;padding-inline:8px;border:1px solid var(--_border);border-radius:var(--_radius);background:var(--_surface);color:var(--_text);font:inherit;text-align:start;cursor:pointer}.fly-currency-selector__trigger:focus-visible{outline:2px solid var(--_primary);outline-offset:2px}.fly-currency-selector__trigger:disabled{opacity:.55;cursor:not-allowed}.fly-currency-selector__placeholder{flex:1 1 auto;padding-inline-start:4px;color:var(--_text-subtle);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.fly-currency-selector__chips{display:flex;flex:1 1 auto;flex-wrap:wrap;gap:4px;min-inline-size:0}.fly-currency-selector__chip{display:inline-flex;align-items:center;gap:5px;padding-block:2px;padding-inline:3px 7px;border-radius:999px;background:var(--_fill);font-size:12px}.fly-currency-selector__chip-code{font-weight:700;letter-spacing:.02em}.fly-currency-selector__chip-symbol{color:var(--_text-subtle)}.fly-currency-selector__chip-remove{padding:1px 3px;border-radius:50%;color:var(--_text-subtle);font-size:10px;line-height:1;cursor:pointer}.fly-currency-selector__chip-remove:hover{background:color-mix(in srgb,var(--_danger) 18%,transparent);color:var(--_danger)}.fly-currency-selector__clear,.fly-currency-selector__chevron{flex:none;color:var(--_text-subtle);font-size:11px;line-height:1}.fly-currency-selector__clear{padding:3px;border-radius:50%;cursor:pointer}.fly-currency-selector__clear:hover{background:var(--_surface-hover);color:var(--_text)}.fly-currency-selector__tile{display:inline-flex;flex:none;align-items:center;justify-content:center;inline-size:26px;block-size:19px;border-radius:4px;background:var(--_fill);overflow:hidden}.fly-currency-selector__tile-flag{font-size:15px;line-height:1}.fly-currency-selector__tile-code{font-size:9px;font-weight:800;letter-spacing:.04em;color:var(--_text-subtle);direction:ltr;unicode-bidi:isolate}.fly-currency-selector__panel{position:absolute;z-index:60;inset-inline:0;inset-block-start:calc(100% + 4px);display:flex;flex-direction:column;max-block-size:19rem;border:1px solid var(--_border);border-radius:var(--_radius);background:var(--_surface-panel);-webkit-backdrop-filter:blur(var(--_panel-blur));backdrop-filter:blur(var(--_panel-blur));box-shadow:0 12px 32px #0000002e;overflow:hidden}.fly-currency-selector__search{padding:6px;border-block-end:1px solid var(--_border)}.fly-currency-selector__search-input{inline-size:100%;padding-block:5px;padding-inline:8px;border:1px solid var(--_border);border-radius:6px;background:var(--_surface);color:var(--_text);font:inherit}.fly-currency-selector__search-input:focus-visible{outline:2px solid var(--_primary);outline-offset:-1px}.fly-currency-selector__listbox{flex:1 1 auto;overflow-y:auto;padding-block:4px}.fly-currency-selector__group{padding-block:6px 3px;padding-inline:10px;color:var(--_text-subtle);font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.fly-currency-selector__option{display:flex;align-items:center;gap:9px;padding-block:5px;padding-inline:10px;cursor:pointer}.fly-currency-selector__option--active{background:var(--_surface-hover)}.fly-currency-selector__option--selected{background:var(--_surface-active)}.fly-currency-selector__option-text{display:flex;flex:1 1 auto;align-items:baseline;gap:8px;min-inline-size:0}.fly-currency-selector__option-code{flex:none;font-weight:700;letter-spacing:.02em;direction:ltr;unicode-bidi:isolate}.fly-currency-selector__option-name{flex:1 1 auto;min-inline-size:0;color:var(--_text-subtle);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.fly-currency-selector__option-symbol{flex:none;min-inline-size:2.2em;color:var(--_text);text-align:end}.fly-currency-selector__check{flex:none;inline-size:1em;color:var(--_primary)}.fly-currency-selector__status{display:flex;align-items:center;gap:8px;padding-block:10px;padding-inline:10px;color:var(--_text-subtle)}.fly-currency-selector__status--error{color:var(--_danger)}.fly-currency-selector__retry{border:1px solid var(--_border);border-radius:6px;background:var(--_surface);padding-block:2px;padding-inline:8px;color:var(--_text);font:inherit;font-weight:600;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: FlyClickOutsideDirective, selector: "[flyClickOutside]", inputs: ["flyClickOutsideEnabled"], outputs: ["flyClickOutside"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        ], viewQueries: [{ propertyName: "searchEl", first: true, predicate: ["searchRef"], descendants: true }, { propertyName: "triggerEl", first: true, predicate: ["triggerRef"], descendants: true }], ngImport: i0, template: "<div\r\n  class=\"fly-currency-selector__wrap\"\r\n  [flyClickOutsideEnabled]=\"isOpen()\"\r\n  (flyClickOutside)=\"close()\"\r\n>\r\n  @if (locked()) {\r\n    <!-- \u2500\u2500 Locked readout \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n         NOT a dimmed `disabled` trigger: there is no dropdown affordance here at all \u2014 the\r\n         value is frozen on purpose, not merely unavailable right now. `role=\"group\"` +\r\n         `aria-label` name the field the way the combobox trigger's `aria-label` does; the\r\n         reason is REAL, always-rendered text (not a `title` attribute, which many screen\r\n         readers never announce and which no sighted user sees without hovering) and is\r\n         additionally wired via `aria-describedby` for AT that reads by relationship rather\r\n         than document order. -->\r\n    <div\r\n      class=\"fly-currency-selector__locked\"\r\n      role=\"group\"\r\n      [attr.aria-label]=\"ariaLabel() || placeholderText()\"\r\n      [attr.aria-describedby]=\"lockedReasonId\"\r\n    >\r\n      @if (selected().length === 0) {\r\n        <span class=\"fly-currency-selector__placeholder\">{{ placeholderText() }}</span>\r\n      } @else {\r\n        <span class=\"fly-currency-selector__chips\">\r\n          @for (c of selected(); track c.code) {\r\n            <span class=\"fly-currency-selector__chip\">\r\n              <span class=\"fly-currency-selector__tile\" aria-hidden=\"true\">\r\n                @if (flagsRenderable() && c.flag) {\r\n                  <span class=\"fly-currency-selector__tile-flag\">{{ c.flag }}</span>\r\n                } @else {\r\n                  <span class=\"fly-currency-selector__tile-code\">{{ tileCode(c) }}</span>\r\n                }\r\n              </span>\r\n              <span class=\"fly-currency-selector__chip-code\">{{ c.code }}</span>\r\n              <span class=\"fly-currency-selector__chip-symbol\" aria-hidden=\"true\">{{ c.symbol }}</span>\r\n            </span>\r\n          }\r\n        </span>\r\n      }\r\n      <span class=\"fly-currency-selector__lock-icon\" aria-hidden=\"true\">&#128274;</span>\r\n    </div>\r\n    <p class=\"fly-currency-selector__locked-reason\" [id]=\"lockedReasonId\">{{ lockedReasonText() }}</p>\r\n  } @else {\r\n\r\n  <!-- \u2500\u2500 Trigger \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n       `aria-label` is never null: a `combobox` does NOT take its accessible name from its\r\n       contents the way a plain button does, so the chips/placeholder painted inside it name\r\n       nothing. Absent a consumer label the localized placeholder supplies the control's\r\n       purpose; its VALUE is still announced from the contents. -->\r\n  <button\r\n    #triggerRef\r\n    type=\"button\"\r\n    [id]=\"triggerId\"\r\n    class=\"fly-currency-selector__trigger\"\r\n    role=\"combobox\"\r\n    aria-haspopup=\"listbox\"\r\n    [attr.aria-expanded]=\"isOpen()\"\r\n    [attr.aria-controls]=\"listboxId\"\r\n    [attr.aria-label]=\"ariaLabel() || placeholderText()\"\r\n    [class.fly-currency-selector__trigger--empty]=\"!hasSelection()\"\r\n    [disabled]=\"effectiveDisabled()\"\r\n    (click)=\"toggleOpen()\"\r\n    (keydown)=\"onTriggerKeydown($event)\"\r\n  >\r\n    @if (selected().length === 0) {\r\n      <span class=\"fly-currency-selector__placeholder\">{{ placeholderText() }}</span>\r\n    } @else {\r\n      <span class=\"fly-currency-selector__chips\">\r\n        @for (c of selected(); track c.code) {\r\n          <span class=\"fly-currency-selector__chip\">\r\n            <span class=\"fly-currency-selector__tile\" aria-hidden=\"true\">\r\n              @if (flagsRenderable() && c.flag) {\r\n                <span class=\"fly-currency-selector__tile-flag\">{{ c.flag }}</span>\r\n              } @else {\r\n                <span class=\"fly-currency-selector__tile-code\">{{ tileCode(c) }}</span>\r\n              }\r\n            </span>\r\n            <span class=\"fly-currency-selector__chip-code\">{{ c.code }}</span>\r\n            <span class=\"fly-currency-selector__chip-symbol\" aria-hidden=\"true\">{{ c.symbol }}</span>\r\n            @if (isMulti() && !effectiveDisabled()) {\r\n              <span\r\n                class=\"fly-currency-selector__chip-remove\"\r\n                role=\"button\"\r\n                tabindex=\"-1\"\r\n                [attr.aria-label]=\"'\u2715 ' + c.code\"\r\n                (click)=\"remove(c.code, $event)\"\r\n                (mousedown)=\"$event.preventDefault()\"\r\n              >\u2715</span>\r\n            }\r\n          </span>\r\n        }\r\n      </span>\r\n    }\r\n\r\n    @if (clearable() && hasSelection() && !effectiveDisabled()) {\r\n      <span\r\n        class=\"fly-currency-selector__clear\"\r\n        role=\"button\"\r\n        tabindex=\"-1\"\r\n        [attr.aria-label]=\"clearText()\"\r\n        [title]=\"clearText()\"\r\n        (click)=\"clear($event)\"\r\n        (mousedown)=\"$event.preventDefault()\"\r\n      >\u2715</span>\r\n    }\r\n\r\n    <span class=\"fly-currency-selector__chevron\" aria-hidden=\"true\">\u25BE</span>\r\n  </button>\r\n\r\n  <!-- \u2500\u2500 Panel \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n  @if (isOpen()) {\r\n    <div class=\"fly-currency-selector__panel\" tabindex=\"-1\" (keydown)=\"onPanelKeydown($event)\">\r\n      <div class=\"fly-currency-selector__search\">\r\n        <input\r\n          #searchRef\r\n          type=\"text\"\r\n          class=\"fly-currency-selector__search-input\"\r\n          role=\"combobox\"\r\n          aria-autocomplete=\"list\"\r\n          [attr.aria-expanded]=\"true\"\r\n          [attr.aria-controls]=\"listboxId\"\r\n          [attr.aria-activedescendant]=\"activeDescendant() || null\"\r\n          [attr.aria-label]=\"searchPlaceholderText()\"\r\n          [placeholder]=\"searchPlaceholderText()\"\r\n          [value]=\"searchTerm()\"\r\n          (input)=\"onSearchInput($any($event.target).value)\"\r\n        />\r\n      </div>\r\n\r\n      @if (loading()) {\r\n        <div class=\"fly-currency-selector__status\" role=\"status\">{{ loadingText() }}</div>\r\n      } @else if (loadFailed()) {\r\n        <div class=\"fly-currency-selector__status fly-currency-selector__status--error\" role=\"alert\">\r\n          <span>{{ errorText() }}</span>\r\n          <button type=\"button\" class=\"fly-currency-selector__retry\" (click)=\"retry()\">\r\n            {{ retryText() }}\r\n          </button>\r\n        </div>\r\n      }\r\n\r\n      <div\r\n        class=\"fly-currency-selector__listbox\"\r\n        role=\"listbox\"\r\n        [id]=\"listboxId\"\r\n        [attr.aria-multiselectable]=\"isMulti() ? true : null\"\r\n        [attr.aria-activedescendant]=\"activeDescendant() || null\"\r\n        [attr.aria-label]=\"ariaLabel() || null\"\r\n      >\r\n        @if (pinned().length > 0) {\r\n          <div class=\"fly-currency-selector__group\" role=\"presentation\">{{ pinnedGroupText() }}</div>\r\n          @for (c of pinned(); track c.code) {\r\n            <ng-container *ngTemplateOutlet=\"row; context: { $implicit: c }\" />\r\n          }\r\n          @if (rest().length > 0) {\r\n            <div class=\"fly-currency-selector__group\" role=\"presentation\">{{ allGroupText() }}</div>\r\n          }\r\n        }\r\n        @for (c of rest(); track c.code) {\r\n          <ng-container *ngTemplateOutlet=\"row; context: { $implicit: c }\" />\r\n        }\r\n\r\n        @if (!loading() && !loadFailed() && filtered().length === 0) {\r\n          <div class=\"fly-currency-selector__status\" role=\"presentation\">{{ noResultsText() }}</div>\r\n        }\r\n      </div>\r\n    </div>\r\n  }\r\n  }\r\n</div>\r\n\r\n<!-- \u2500\u2500 One option row, shared by the pinned and full groups \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n<ng-template #row let-c>\r\n  <div\r\n    class=\"fly-currency-selector__option\"\r\n    role=\"option\"\r\n    tabindex=\"-1\"\r\n    [id]=\"optionId(navIndexOf(c.code))\"\r\n    [attr.aria-selected]=\"isSelected(c.code)\"\r\n    [class.fly-currency-selector__option--selected]=\"isSelected(c.code)\"\r\n    [class.fly-currency-selector__option--active]=\"navIndexOf(c.code) === activeIndex()\"\r\n    (click)=\"pick(c)\"\r\n    (keydown.enter)=\"pick(c)\"\r\n    (mouseenter)=\"onOptionHover(navIndexOf(c.code))\"\r\n  >\r\n    <span class=\"fly-currency-selector__tile\" aria-hidden=\"true\">\r\n      @if (flagsRenderable() && c.flag) {\r\n        <span class=\"fly-currency-selector__tile-flag\">{{ c.flag }}</span>\r\n      } @else {\r\n        <span class=\"fly-currency-selector__tile-code\">{{ tileCode(c) }}</span>\r\n      }\r\n    </span>\r\n\r\n    <span class=\"fly-currency-selector__option-text\">\r\n      <span class=\"fly-currency-selector__option-code\">{{ c.code }}</span>\r\n      <span class=\"fly-currency-selector__option-name\">{{ c.name }}</span>\r\n    </span>\r\n\r\n    <span class=\"fly-currency-selector__option-symbol\" aria-hidden=\"true\">{{ c.symbol }}</span>\r\n\r\n    <span class=\"fly-currency-selector__check\" aria-hidden=\"true\">\r\n      @if (isSelected(c.code)) { \u2713 }\r\n    </span>\r\n  </div>\r\n</ng-template>\r\n", styles: [":host,:host *,:host *:before,:host *:after{box-sizing:border-box}:host{--_surface: var(--surface-card, #fff);--_surface-panel: var(--glass-bg-elevated, var(--surface-card, #fff));--_panel-blur: var(--glass-blur, 40px);--_surface-hover: var(--surface-hover, #f1f5f9);--_surface-active: var(--surface-active, #eef2ff);--_border: var(--surface-border, #e2e8f0);--_text: var(--text-color, #0f172a);--_text-subtle: var(--text-color-secondary, #64748b);--_fill: var(--fill-tertiary, #f3f4f6);--_primary: var(--primary-color);--_danger: var(--system-red, #ef4444);--_radius: 8px;display:inline-block;inline-size:100%;min-inline-size:11rem;font-size:13px;color:var(--_text)}.fly-currency-selector__wrap{position:relative;inline-size:100%}.fly-currency-selector__trigger{display:flex;align-items:center;gap:8px;inline-size:100%;min-block-size:2.25rem;padding-block:4px;padding-inline:8px;border:1px solid var(--_border);border-radius:var(--_radius);background:var(--_surface);color:var(--_text);font:inherit;text-align:start;cursor:pointer}.fly-currency-selector__trigger:focus-visible{outline:2px solid var(--_primary);outline-offset:2px}.fly-currency-selector__trigger:disabled{opacity:.55;cursor:not-allowed}.fly-currency-selector__placeholder{flex:1 1 auto;padding-inline-start:4px;color:var(--_text-subtle);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.fly-currency-selector__chips{display:flex;flex:1 1 auto;flex-wrap:wrap;gap:4px;min-inline-size:0}.fly-currency-selector__chip{display:inline-flex;align-items:center;gap:5px;padding-block:2px;padding-inline:3px 7px;border-radius:999px;background:var(--_fill);font-size:12px}.fly-currency-selector__chip-code{font-weight:700;letter-spacing:.02em}.fly-currency-selector__chip-symbol{color:var(--_text-subtle)}.fly-currency-selector__chip-remove{padding:1px 3px;border-radius:50%;color:var(--_text-subtle);font-size:10px;line-height:1;cursor:pointer}.fly-currency-selector__chip-remove:hover{background:color-mix(in srgb,var(--_danger) 18%,transparent);color:var(--_danger)}.fly-currency-selector__clear,.fly-currency-selector__chevron{flex:none;color:var(--_text-subtle);font-size:11px;line-height:1}.fly-currency-selector__clear{padding:3px;border-radius:50%;cursor:pointer}.fly-currency-selector__clear:hover{background:var(--_surface-hover);color:var(--_text)}.fly-currency-selector__tile{display:inline-flex;flex:none;align-items:center;justify-content:center;inline-size:26px;block-size:19px;border-radius:4px;background:var(--_fill);overflow:hidden}.fly-currency-selector__tile-flag{font-size:15px;line-height:1}.fly-currency-selector__tile-code{font-size:9px;font-weight:800;letter-spacing:.04em;color:var(--_text-subtle);direction:ltr;unicode-bidi:isolate}.fly-currency-selector__locked{display:flex;align-items:center;gap:8px;inline-size:100%;min-block-size:2.25rem;padding-block:4px;padding-inline:8px;border:1px dashed var(--_border);border-radius:var(--_radius);background:var(--_fill);color:var(--_text);cursor:default}.fly-currency-selector__lock-icon{flex:none;margin-inline-start:auto;font-size:12px;opacity:.7}.fly-currency-selector__locked-reason{margin:4px 0 0;color:var(--_text-subtle);font-size:11px;line-height:1.4}.fly-currency-selector__panel{position:absolute;z-index:60;inset-inline:0;inset-block-start:calc(100% + 4px);display:flex;flex-direction:column;max-block-size:19rem;border:1px solid var(--_border);border-radius:var(--_radius);background:var(--_surface-panel);-webkit-backdrop-filter:blur(var(--_panel-blur));backdrop-filter:blur(var(--_panel-blur));box-shadow:0 12px 32px #0000002e;overflow:hidden}.fly-currency-selector__search{padding:6px;border-block-end:1px solid var(--_border)}.fly-currency-selector__search-input{inline-size:100%;padding-block:5px;padding-inline:8px;border:1px solid var(--_border);border-radius:6px;background:var(--_surface);color:var(--_text);font:inherit}.fly-currency-selector__search-input:focus-visible{outline:2px solid var(--_primary);outline-offset:-1px}.fly-currency-selector__listbox{flex:1 1 auto;overflow-y:auto;padding-block:4px}.fly-currency-selector__group{padding-block:6px 3px;padding-inline:10px;color:var(--_text-subtle);font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.fly-currency-selector__option{display:flex;align-items:center;gap:9px;padding-block:5px;padding-inline:10px;cursor:pointer}.fly-currency-selector__option--active{background:var(--_surface-hover)}.fly-currency-selector__option--selected{background:var(--_surface-active)}.fly-currency-selector__option-text{display:flex;flex:1 1 auto;align-items:baseline;gap:8px;min-inline-size:0}.fly-currency-selector__option-code{flex:none;font-weight:700;letter-spacing:.02em;direction:ltr;unicode-bidi:isolate}.fly-currency-selector__option-name{flex:1 1 auto;min-inline-size:0;color:var(--_text-subtle);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.fly-currency-selector__option-symbol{flex:none;min-inline-size:2.2em;color:var(--_text);text-align:end}.fly-currency-selector__check{flex:none;inline-size:1em;color:var(--_primary)}.fly-currency-selector__status{display:flex;align-items:center;gap:8px;padding-block:10px;padding-inline:10px;color:var(--_text-subtle)}.fly-currency-selector__status--error{color:var(--_danger)}.fly-currency-selector__retry{border:1px solid var(--_border);border-radius:6px;background:var(--_surface);padding-block:2px;padding-inline:8px;color:var(--_text);font:inherit;font-weight:600;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: FlyClickOutsideDirective, selector: "[flyClickOutside]", inputs: ["flyClickOutsideEnabled"], outputs: ["flyClickOutside"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FlyCurrencySelectorComponent, decorators: [{
             type: Component,
@@ -18969,8 +19169,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
                         class: 'fly-currency-selector',
                         '[class.fly-currency-selector--open]': 'isOpen()',
                         '[class.fly-currency-selector--disabled]': 'effectiveDisabled()',
-                    }, template: "<div\r\n  class=\"fly-currency-selector__wrap\"\r\n  [flyClickOutsideEnabled]=\"isOpen()\"\r\n  (flyClickOutside)=\"close()\"\r\n>\r\n  <!-- \u2500\u2500 Trigger \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n       `aria-label` is never null: a `combobox` does NOT take its accessible name from its\r\n       contents the way a plain button does, so the chips/placeholder painted inside it name\r\n       nothing. Absent a consumer label the localized placeholder supplies the control's\r\n       purpose; its VALUE is still announced from the contents. -->\r\n  <button\r\n    #triggerRef\r\n    type=\"button\"\r\n    [id]=\"triggerId\"\r\n    class=\"fly-currency-selector__trigger\"\r\n    role=\"combobox\"\r\n    aria-haspopup=\"listbox\"\r\n    [attr.aria-expanded]=\"isOpen()\"\r\n    [attr.aria-controls]=\"listboxId\"\r\n    [attr.aria-label]=\"ariaLabel() || placeholderText()\"\r\n    [class.fly-currency-selector__trigger--empty]=\"!hasSelection()\"\r\n    [disabled]=\"effectiveDisabled()\"\r\n    (click)=\"toggleOpen()\"\r\n    (keydown)=\"onTriggerKeydown($event)\"\r\n  >\r\n    @if (selected().length === 0) {\r\n      <span class=\"fly-currency-selector__placeholder\">{{ placeholderText() }}</span>\r\n    } @else {\r\n      <span class=\"fly-currency-selector__chips\">\r\n        @for (c of selected(); track c.code) {\r\n          <span class=\"fly-currency-selector__chip\">\r\n            <span class=\"fly-currency-selector__tile\" aria-hidden=\"true\">\r\n              @if (flagsRenderable() && c.flag) {\r\n                <span class=\"fly-currency-selector__tile-flag\">{{ c.flag }}</span>\r\n              } @else {\r\n                <span class=\"fly-currency-selector__tile-code\">{{ tileCode(c) }}</span>\r\n              }\r\n            </span>\r\n            <span class=\"fly-currency-selector__chip-code\">{{ c.code }}</span>\r\n            <span class=\"fly-currency-selector__chip-symbol\" aria-hidden=\"true\">{{ c.symbol }}</span>\r\n            @if (isMulti() && !effectiveDisabled()) {\r\n              <span\r\n                class=\"fly-currency-selector__chip-remove\"\r\n                role=\"button\"\r\n                tabindex=\"-1\"\r\n                [attr.aria-label]=\"'\u2715 ' + c.code\"\r\n                (click)=\"remove(c.code, $event)\"\r\n                (mousedown)=\"$event.preventDefault()\"\r\n              >\u2715</span>\r\n            }\r\n          </span>\r\n        }\r\n      </span>\r\n    }\r\n\r\n    @if (clearable() && hasSelection() && !effectiveDisabled()) {\r\n      <span\r\n        class=\"fly-currency-selector__clear\"\r\n        role=\"button\"\r\n        tabindex=\"-1\"\r\n        [attr.aria-label]=\"clearText()\"\r\n        [title]=\"clearText()\"\r\n        (click)=\"clear($event)\"\r\n        (mousedown)=\"$event.preventDefault()\"\r\n      >\u2715</span>\r\n    }\r\n\r\n    <span class=\"fly-currency-selector__chevron\" aria-hidden=\"true\">\u25BE</span>\r\n  </button>\r\n\r\n  <!-- \u2500\u2500 Panel \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n  @if (isOpen()) {\r\n    <div class=\"fly-currency-selector__panel\" tabindex=\"-1\" (keydown)=\"onPanelKeydown($event)\">\r\n      <div class=\"fly-currency-selector__search\">\r\n        <input\r\n          #searchRef\r\n          type=\"text\"\r\n          class=\"fly-currency-selector__search-input\"\r\n          role=\"combobox\"\r\n          aria-autocomplete=\"list\"\r\n          [attr.aria-expanded]=\"true\"\r\n          [attr.aria-controls]=\"listboxId\"\r\n          [attr.aria-activedescendant]=\"activeDescendant() || null\"\r\n          [attr.aria-label]=\"searchPlaceholderText()\"\r\n          [placeholder]=\"searchPlaceholderText()\"\r\n          [value]=\"searchTerm()\"\r\n          (input)=\"onSearchInput($any($event.target).value)\"\r\n        />\r\n      </div>\r\n\r\n      @if (loading()) {\r\n        <div class=\"fly-currency-selector__status\" role=\"status\">{{ loadingText() }}</div>\r\n      } @else if (loadFailed()) {\r\n        <div class=\"fly-currency-selector__status fly-currency-selector__status--error\" role=\"alert\">\r\n          <span>{{ errorText() }}</span>\r\n          <button type=\"button\" class=\"fly-currency-selector__retry\" (click)=\"retry()\">\r\n            {{ retryText() }}\r\n          </button>\r\n        </div>\r\n      }\r\n\r\n      <div\r\n        class=\"fly-currency-selector__listbox\"\r\n        role=\"listbox\"\r\n        [id]=\"listboxId\"\r\n        [attr.aria-multiselectable]=\"isMulti() ? true : null\"\r\n        [attr.aria-activedescendant]=\"activeDescendant() || null\"\r\n        [attr.aria-label]=\"ariaLabel() || null\"\r\n      >\r\n        @if (pinned().length > 0) {\r\n          <div class=\"fly-currency-selector__group\" role=\"presentation\">{{ pinnedGroupText() }}</div>\r\n          @for (c of pinned(); track c.code) {\r\n            <ng-container *ngTemplateOutlet=\"row; context: { $implicit: c }\" />\r\n          }\r\n          @if (rest().length > 0) {\r\n            <div class=\"fly-currency-selector__group\" role=\"presentation\">{{ allGroupText() }}</div>\r\n          }\r\n        }\r\n        @for (c of rest(); track c.code) {\r\n          <ng-container *ngTemplateOutlet=\"row; context: { $implicit: c }\" />\r\n        }\r\n\r\n        @if (!loading() && !loadFailed() && filtered().length === 0) {\r\n          <div class=\"fly-currency-selector__status\" role=\"presentation\">{{ noResultsText() }}</div>\r\n        }\r\n      </div>\r\n    </div>\r\n  }\r\n</div>\r\n\r\n<!-- \u2500\u2500 One option row, shared by the pinned and full groups \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n<ng-template #row let-c>\r\n  <div\r\n    class=\"fly-currency-selector__option\"\r\n    role=\"option\"\r\n    tabindex=\"-1\"\r\n    [id]=\"optionId(navIndexOf(c.code))\"\r\n    [attr.aria-selected]=\"isSelected(c.code)\"\r\n    [class.fly-currency-selector__option--selected]=\"isSelected(c.code)\"\r\n    [class.fly-currency-selector__option--active]=\"navIndexOf(c.code) === activeIndex()\"\r\n    (click)=\"pick(c)\"\r\n    (keydown.enter)=\"pick(c)\"\r\n    (mouseenter)=\"onOptionHover(navIndexOf(c.code))\"\r\n  >\r\n    <span class=\"fly-currency-selector__tile\" aria-hidden=\"true\">\r\n      @if (flagsRenderable() && c.flag) {\r\n        <span class=\"fly-currency-selector__tile-flag\">{{ c.flag }}</span>\r\n      } @else {\r\n        <span class=\"fly-currency-selector__tile-code\">{{ tileCode(c) }}</span>\r\n      }\r\n    </span>\r\n\r\n    <span class=\"fly-currency-selector__option-text\">\r\n      <span class=\"fly-currency-selector__option-code\">{{ c.code }}</span>\r\n      <span class=\"fly-currency-selector__option-name\">{{ c.name }}</span>\r\n    </span>\r\n\r\n    <span class=\"fly-currency-selector__option-symbol\" aria-hidden=\"true\">{{ c.symbol }}</span>\r\n\r\n    <span class=\"fly-currency-selector__check\" aria-hidden=\"true\">\r\n      @if (isSelected(c.code)) { \u2713 }\r\n    </span>\r\n  </div>\r\n</ng-template>\r\n", styles: [":host,:host *,:host *:before,:host *:after{box-sizing:border-box}:host{--_surface: var(--surface-card, #fff);--_surface-panel: var(--glass-bg-elevated, var(--surface-card, #fff));--_panel-blur: var(--glass-blur, 40px);--_surface-hover: var(--surface-hover, #f1f5f9);--_surface-active: var(--surface-active, #eef2ff);--_border: var(--surface-border, #e2e8f0);--_text: var(--text-color, #0f172a);--_text-subtle: var(--text-color-secondary, #64748b);--_fill: var(--fill-tertiary, #f3f4f6);--_primary: var(--primary-color);--_danger: var(--system-red, #ef4444);--_radius: 8px;display:inline-block;inline-size:100%;min-inline-size:11rem;font-size:13px;color:var(--_text)}.fly-currency-selector__wrap{position:relative;inline-size:100%}.fly-currency-selector__trigger{display:flex;align-items:center;gap:8px;inline-size:100%;min-block-size:2.25rem;padding-block:4px;padding-inline:8px;border:1px solid var(--_border);border-radius:var(--_radius);background:var(--_surface);color:var(--_text);font:inherit;text-align:start;cursor:pointer}.fly-currency-selector__trigger:focus-visible{outline:2px solid var(--_primary);outline-offset:2px}.fly-currency-selector__trigger:disabled{opacity:.55;cursor:not-allowed}.fly-currency-selector__placeholder{flex:1 1 auto;padding-inline-start:4px;color:var(--_text-subtle);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.fly-currency-selector__chips{display:flex;flex:1 1 auto;flex-wrap:wrap;gap:4px;min-inline-size:0}.fly-currency-selector__chip{display:inline-flex;align-items:center;gap:5px;padding-block:2px;padding-inline:3px 7px;border-radius:999px;background:var(--_fill);font-size:12px}.fly-currency-selector__chip-code{font-weight:700;letter-spacing:.02em}.fly-currency-selector__chip-symbol{color:var(--_text-subtle)}.fly-currency-selector__chip-remove{padding:1px 3px;border-radius:50%;color:var(--_text-subtle);font-size:10px;line-height:1;cursor:pointer}.fly-currency-selector__chip-remove:hover{background:color-mix(in srgb,var(--_danger) 18%,transparent);color:var(--_danger)}.fly-currency-selector__clear,.fly-currency-selector__chevron{flex:none;color:var(--_text-subtle);font-size:11px;line-height:1}.fly-currency-selector__clear{padding:3px;border-radius:50%;cursor:pointer}.fly-currency-selector__clear:hover{background:var(--_surface-hover);color:var(--_text)}.fly-currency-selector__tile{display:inline-flex;flex:none;align-items:center;justify-content:center;inline-size:26px;block-size:19px;border-radius:4px;background:var(--_fill);overflow:hidden}.fly-currency-selector__tile-flag{font-size:15px;line-height:1}.fly-currency-selector__tile-code{font-size:9px;font-weight:800;letter-spacing:.04em;color:var(--_text-subtle);direction:ltr;unicode-bidi:isolate}.fly-currency-selector__panel{position:absolute;z-index:60;inset-inline:0;inset-block-start:calc(100% + 4px);display:flex;flex-direction:column;max-block-size:19rem;border:1px solid var(--_border);border-radius:var(--_radius);background:var(--_surface-panel);-webkit-backdrop-filter:blur(var(--_panel-blur));backdrop-filter:blur(var(--_panel-blur));box-shadow:0 12px 32px #0000002e;overflow:hidden}.fly-currency-selector__search{padding:6px;border-block-end:1px solid var(--_border)}.fly-currency-selector__search-input{inline-size:100%;padding-block:5px;padding-inline:8px;border:1px solid var(--_border);border-radius:6px;background:var(--_surface);color:var(--_text);font:inherit}.fly-currency-selector__search-input:focus-visible{outline:2px solid var(--_primary);outline-offset:-1px}.fly-currency-selector__listbox{flex:1 1 auto;overflow-y:auto;padding-block:4px}.fly-currency-selector__group{padding-block:6px 3px;padding-inline:10px;color:var(--_text-subtle);font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.fly-currency-selector__option{display:flex;align-items:center;gap:9px;padding-block:5px;padding-inline:10px;cursor:pointer}.fly-currency-selector__option--active{background:var(--_surface-hover)}.fly-currency-selector__option--selected{background:var(--_surface-active)}.fly-currency-selector__option-text{display:flex;flex:1 1 auto;align-items:baseline;gap:8px;min-inline-size:0}.fly-currency-selector__option-code{flex:none;font-weight:700;letter-spacing:.02em;direction:ltr;unicode-bidi:isolate}.fly-currency-selector__option-name{flex:1 1 auto;min-inline-size:0;color:var(--_text-subtle);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.fly-currency-selector__option-symbol{flex:none;min-inline-size:2.2em;color:var(--_text);text-align:end}.fly-currency-selector__check{flex:none;inline-size:1em;color:var(--_primary)}.fly-currency-selector__status{display:flex;align-items:center;gap:8px;padding-block:10px;padding-inline:10px;color:var(--_text-subtle)}.fly-currency-selector__status--error{color:var(--_danger)}.fly-currency-selector__retry{border:1px solid var(--_border);border-radius:6px;background:var(--_surface);padding-block:2px;padding-inline:8px;color:var(--_text);font:inherit;font-weight:600;cursor:pointer}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], currencies: [{ type: i0.Input, args: [{ isSignal: true, alias: "currencies", required: false }] }], fetchFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "fetchFn", required: false }] }], allowedCodes: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowedCodes", required: false }] }], pinnedCodes: [{ type: i0.Input, args: [{ isSignal: true, alias: "pinnedCodes", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], searchPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchPlaceholder", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }], selectionDetailChange: [{ type: i0.Output, args: ["selectionDetailChange"] }], openedChange: [{ type: i0.Output, args: ["openedChange"] }], searchEl: [{
+                        '[class.fly-currency-selector--locked]': 'locked()',
+                    }, template: "<div\r\n  class=\"fly-currency-selector__wrap\"\r\n  [flyClickOutsideEnabled]=\"isOpen()\"\r\n  (flyClickOutside)=\"close()\"\r\n>\r\n  @if (locked()) {\r\n    <!-- \u2500\u2500 Locked readout \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n         NOT a dimmed `disabled` trigger: there is no dropdown affordance here at all \u2014 the\r\n         value is frozen on purpose, not merely unavailable right now. `role=\"group\"` +\r\n         `aria-label` name the field the way the combobox trigger's `aria-label` does; the\r\n         reason is REAL, always-rendered text (not a `title` attribute, which many screen\r\n         readers never announce and which no sighted user sees without hovering) and is\r\n         additionally wired via `aria-describedby` for AT that reads by relationship rather\r\n         than document order. -->\r\n    <div\r\n      class=\"fly-currency-selector__locked\"\r\n      role=\"group\"\r\n      [attr.aria-label]=\"ariaLabel() || placeholderText()\"\r\n      [attr.aria-describedby]=\"lockedReasonId\"\r\n    >\r\n      @if (selected().length === 0) {\r\n        <span class=\"fly-currency-selector__placeholder\">{{ placeholderText() }}</span>\r\n      } @else {\r\n        <span class=\"fly-currency-selector__chips\">\r\n          @for (c of selected(); track c.code) {\r\n            <span class=\"fly-currency-selector__chip\">\r\n              <span class=\"fly-currency-selector__tile\" aria-hidden=\"true\">\r\n                @if (flagsRenderable() && c.flag) {\r\n                  <span class=\"fly-currency-selector__tile-flag\">{{ c.flag }}</span>\r\n                } @else {\r\n                  <span class=\"fly-currency-selector__tile-code\">{{ tileCode(c) }}</span>\r\n                }\r\n              </span>\r\n              <span class=\"fly-currency-selector__chip-code\">{{ c.code }}</span>\r\n              <span class=\"fly-currency-selector__chip-symbol\" aria-hidden=\"true\">{{ c.symbol }}</span>\r\n            </span>\r\n          }\r\n        </span>\r\n      }\r\n      <span class=\"fly-currency-selector__lock-icon\" aria-hidden=\"true\">&#128274;</span>\r\n    </div>\r\n    <p class=\"fly-currency-selector__locked-reason\" [id]=\"lockedReasonId\">{{ lockedReasonText() }}</p>\r\n  } @else {\r\n\r\n  <!-- \u2500\u2500 Trigger \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n       `aria-label` is never null: a `combobox` does NOT take its accessible name from its\r\n       contents the way a plain button does, so the chips/placeholder painted inside it name\r\n       nothing. Absent a consumer label the localized placeholder supplies the control's\r\n       purpose; its VALUE is still announced from the contents. -->\r\n  <button\r\n    #triggerRef\r\n    type=\"button\"\r\n    [id]=\"triggerId\"\r\n    class=\"fly-currency-selector__trigger\"\r\n    role=\"combobox\"\r\n    aria-haspopup=\"listbox\"\r\n    [attr.aria-expanded]=\"isOpen()\"\r\n    [attr.aria-controls]=\"listboxId\"\r\n    [attr.aria-label]=\"ariaLabel() || placeholderText()\"\r\n    [class.fly-currency-selector__trigger--empty]=\"!hasSelection()\"\r\n    [disabled]=\"effectiveDisabled()\"\r\n    (click)=\"toggleOpen()\"\r\n    (keydown)=\"onTriggerKeydown($event)\"\r\n  >\r\n    @if (selected().length === 0) {\r\n      <span class=\"fly-currency-selector__placeholder\">{{ placeholderText() }}</span>\r\n    } @else {\r\n      <span class=\"fly-currency-selector__chips\">\r\n        @for (c of selected(); track c.code) {\r\n          <span class=\"fly-currency-selector__chip\">\r\n            <span class=\"fly-currency-selector__tile\" aria-hidden=\"true\">\r\n              @if (flagsRenderable() && c.flag) {\r\n                <span class=\"fly-currency-selector__tile-flag\">{{ c.flag }}</span>\r\n              } @else {\r\n                <span class=\"fly-currency-selector__tile-code\">{{ tileCode(c) }}</span>\r\n              }\r\n            </span>\r\n            <span class=\"fly-currency-selector__chip-code\">{{ c.code }}</span>\r\n            <span class=\"fly-currency-selector__chip-symbol\" aria-hidden=\"true\">{{ c.symbol }}</span>\r\n            @if (isMulti() && !effectiveDisabled()) {\r\n              <span\r\n                class=\"fly-currency-selector__chip-remove\"\r\n                role=\"button\"\r\n                tabindex=\"-1\"\r\n                [attr.aria-label]=\"'\u2715 ' + c.code\"\r\n                (click)=\"remove(c.code, $event)\"\r\n                (mousedown)=\"$event.preventDefault()\"\r\n              >\u2715</span>\r\n            }\r\n          </span>\r\n        }\r\n      </span>\r\n    }\r\n\r\n    @if (clearable() && hasSelection() && !effectiveDisabled()) {\r\n      <span\r\n        class=\"fly-currency-selector__clear\"\r\n        role=\"button\"\r\n        tabindex=\"-1\"\r\n        [attr.aria-label]=\"clearText()\"\r\n        [title]=\"clearText()\"\r\n        (click)=\"clear($event)\"\r\n        (mousedown)=\"$event.preventDefault()\"\r\n      >\u2715</span>\r\n    }\r\n\r\n    <span class=\"fly-currency-selector__chevron\" aria-hidden=\"true\">\u25BE</span>\r\n  </button>\r\n\r\n  <!-- \u2500\u2500 Panel \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n  @if (isOpen()) {\r\n    <div class=\"fly-currency-selector__panel\" tabindex=\"-1\" (keydown)=\"onPanelKeydown($event)\">\r\n      <div class=\"fly-currency-selector__search\">\r\n        <input\r\n          #searchRef\r\n          type=\"text\"\r\n          class=\"fly-currency-selector__search-input\"\r\n          role=\"combobox\"\r\n          aria-autocomplete=\"list\"\r\n          [attr.aria-expanded]=\"true\"\r\n          [attr.aria-controls]=\"listboxId\"\r\n          [attr.aria-activedescendant]=\"activeDescendant() || null\"\r\n          [attr.aria-label]=\"searchPlaceholderText()\"\r\n          [placeholder]=\"searchPlaceholderText()\"\r\n          [value]=\"searchTerm()\"\r\n          (input)=\"onSearchInput($any($event.target).value)\"\r\n        />\r\n      </div>\r\n\r\n      @if (loading()) {\r\n        <div class=\"fly-currency-selector__status\" role=\"status\">{{ loadingText() }}</div>\r\n      } @else if (loadFailed()) {\r\n        <div class=\"fly-currency-selector__status fly-currency-selector__status--error\" role=\"alert\">\r\n          <span>{{ errorText() }}</span>\r\n          <button type=\"button\" class=\"fly-currency-selector__retry\" (click)=\"retry()\">\r\n            {{ retryText() }}\r\n          </button>\r\n        </div>\r\n      }\r\n\r\n      <div\r\n        class=\"fly-currency-selector__listbox\"\r\n        role=\"listbox\"\r\n        [id]=\"listboxId\"\r\n        [attr.aria-multiselectable]=\"isMulti() ? true : null\"\r\n        [attr.aria-activedescendant]=\"activeDescendant() || null\"\r\n        [attr.aria-label]=\"ariaLabel() || null\"\r\n      >\r\n        @if (pinned().length > 0) {\r\n          <div class=\"fly-currency-selector__group\" role=\"presentation\">{{ pinnedGroupText() }}</div>\r\n          @for (c of pinned(); track c.code) {\r\n            <ng-container *ngTemplateOutlet=\"row; context: { $implicit: c }\" />\r\n          }\r\n          @if (rest().length > 0) {\r\n            <div class=\"fly-currency-selector__group\" role=\"presentation\">{{ allGroupText() }}</div>\r\n          }\r\n        }\r\n        @for (c of rest(); track c.code) {\r\n          <ng-container *ngTemplateOutlet=\"row; context: { $implicit: c }\" />\r\n        }\r\n\r\n        @if (!loading() && !loadFailed() && filtered().length === 0) {\r\n          <div class=\"fly-currency-selector__status\" role=\"presentation\">{{ noResultsText() }}</div>\r\n        }\r\n      </div>\r\n    </div>\r\n  }\r\n  }\r\n</div>\r\n\r\n<!-- \u2500\u2500 One option row, shared by the pinned and full groups \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n<ng-template #row let-c>\r\n  <div\r\n    class=\"fly-currency-selector__option\"\r\n    role=\"option\"\r\n    tabindex=\"-1\"\r\n    [id]=\"optionId(navIndexOf(c.code))\"\r\n    [attr.aria-selected]=\"isSelected(c.code)\"\r\n    [class.fly-currency-selector__option--selected]=\"isSelected(c.code)\"\r\n    [class.fly-currency-selector__option--active]=\"navIndexOf(c.code) === activeIndex()\"\r\n    (click)=\"pick(c)\"\r\n    (keydown.enter)=\"pick(c)\"\r\n    (mouseenter)=\"onOptionHover(navIndexOf(c.code))\"\r\n  >\r\n    <span class=\"fly-currency-selector__tile\" aria-hidden=\"true\">\r\n      @if (flagsRenderable() && c.flag) {\r\n        <span class=\"fly-currency-selector__tile-flag\">{{ c.flag }}</span>\r\n      } @else {\r\n        <span class=\"fly-currency-selector__tile-code\">{{ tileCode(c) }}</span>\r\n      }\r\n    </span>\r\n\r\n    <span class=\"fly-currency-selector__option-text\">\r\n      <span class=\"fly-currency-selector__option-code\">{{ c.code }}</span>\r\n      <span class=\"fly-currency-selector__option-name\">{{ c.name }}</span>\r\n    </span>\r\n\r\n    <span class=\"fly-currency-selector__option-symbol\" aria-hidden=\"true\">{{ c.symbol }}</span>\r\n\r\n    <span class=\"fly-currency-selector__check\" aria-hidden=\"true\">\r\n      @if (isSelected(c.code)) { \u2713 }\r\n    </span>\r\n  </div>\r\n</ng-template>\r\n", styles: [":host,:host *,:host *:before,:host *:after{box-sizing:border-box}:host{--_surface: var(--surface-card, #fff);--_surface-panel: var(--glass-bg-elevated, var(--surface-card, #fff));--_panel-blur: var(--glass-blur, 40px);--_surface-hover: var(--surface-hover, #f1f5f9);--_surface-active: var(--surface-active, #eef2ff);--_border: var(--surface-border, #e2e8f0);--_text: var(--text-color, #0f172a);--_text-subtle: var(--text-color-secondary, #64748b);--_fill: var(--fill-tertiary, #f3f4f6);--_primary: var(--primary-color);--_danger: var(--system-red, #ef4444);--_radius: 8px;display:inline-block;inline-size:100%;min-inline-size:11rem;font-size:13px;color:var(--_text)}.fly-currency-selector__wrap{position:relative;inline-size:100%}.fly-currency-selector__trigger{display:flex;align-items:center;gap:8px;inline-size:100%;min-block-size:2.25rem;padding-block:4px;padding-inline:8px;border:1px solid var(--_border);border-radius:var(--_radius);background:var(--_surface);color:var(--_text);font:inherit;text-align:start;cursor:pointer}.fly-currency-selector__trigger:focus-visible{outline:2px solid var(--_primary);outline-offset:2px}.fly-currency-selector__trigger:disabled{opacity:.55;cursor:not-allowed}.fly-currency-selector__placeholder{flex:1 1 auto;padding-inline-start:4px;color:var(--_text-subtle);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.fly-currency-selector__chips{display:flex;flex:1 1 auto;flex-wrap:wrap;gap:4px;min-inline-size:0}.fly-currency-selector__chip{display:inline-flex;align-items:center;gap:5px;padding-block:2px;padding-inline:3px 7px;border-radius:999px;background:var(--_fill);font-size:12px}.fly-currency-selector__chip-code{font-weight:700;letter-spacing:.02em}.fly-currency-selector__chip-symbol{color:var(--_text-subtle)}.fly-currency-selector__chip-remove{padding:1px 3px;border-radius:50%;color:var(--_text-subtle);font-size:10px;line-height:1;cursor:pointer}.fly-currency-selector__chip-remove:hover{background:color-mix(in srgb,var(--_danger) 18%,transparent);color:var(--_danger)}.fly-currency-selector__clear,.fly-currency-selector__chevron{flex:none;color:var(--_text-subtle);font-size:11px;line-height:1}.fly-currency-selector__clear{padding:3px;border-radius:50%;cursor:pointer}.fly-currency-selector__clear:hover{background:var(--_surface-hover);color:var(--_text)}.fly-currency-selector__tile{display:inline-flex;flex:none;align-items:center;justify-content:center;inline-size:26px;block-size:19px;border-radius:4px;background:var(--_fill);overflow:hidden}.fly-currency-selector__tile-flag{font-size:15px;line-height:1}.fly-currency-selector__tile-code{font-size:9px;font-weight:800;letter-spacing:.04em;color:var(--_text-subtle);direction:ltr;unicode-bidi:isolate}.fly-currency-selector__locked{display:flex;align-items:center;gap:8px;inline-size:100%;min-block-size:2.25rem;padding-block:4px;padding-inline:8px;border:1px dashed var(--_border);border-radius:var(--_radius);background:var(--_fill);color:var(--_text);cursor:default}.fly-currency-selector__lock-icon{flex:none;margin-inline-start:auto;font-size:12px;opacity:.7}.fly-currency-selector__locked-reason{margin:4px 0 0;color:var(--_text-subtle);font-size:11px;line-height:1.4}.fly-currency-selector__panel{position:absolute;z-index:60;inset-inline:0;inset-block-start:calc(100% + 4px);display:flex;flex-direction:column;max-block-size:19rem;border:1px solid var(--_border);border-radius:var(--_radius);background:var(--_surface-panel);-webkit-backdrop-filter:blur(var(--_panel-blur));backdrop-filter:blur(var(--_panel-blur));box-shadow:0 12px 32px #0000002e;overflow:hidden}.fly-currency-selector__search{padding:6px;border-block-end:1px solid var(--_border)}.fly-currency-selector__search-input{inline-size:100%;padding-block:5px;padding-inline:8px;border:1px solid var(--_border);border-radius:6px;background:var(--_surface);color:var(--_text);font:inherit}.fly-currency-selector__search-input:focus-visible{outline:2px solid var(--_primary);outline-offset:-1px}.fly-currency-selector__listbox{flex:1 1 auto;overflow-y:auto;padding-block:4px}.fly-currency-selector__group{padding-block:6px 3px;padding-inline:10px;color:var(--_text-subtle);font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.fly-currency-selector__option{display:flex;align-items:center;gap:9px;padding-block:5px;padding-inline:10px;cursor:pointer}.fly-currency-selector__option--active{background:var(--_surface-hover)}.fly-currency-selector__option--selected{background:var(--_surface-active)}.fly-currency-selector__option-text{display:flex;flex:1 1 auto;align-items:baseline;gap:8px;min-inline-size:0}.fly-currency-selector__option-code{flex:none;font-weight:700;letter-spacing:.02em;direction:ltr;unicode-bidi:isolate}.fly-currency-selector__option-name{flex:1 1 auto;min-inline-size:0;color:var(--_text-subtle);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.fly-currency-selector__option-symbol{flex:none;min-inline-size:2.2em;color:var(--_text);text-align:end}.fly-currency-selector__check{flex:none;inline-size:1em;color:var(--_primary)}.fly-currency-selector__status{display:flex;align-items:center;gap:8px;padding-block:10px;padding-inline:10px;color:var(--_text-subtle)}.fly-currency-selector__status--error{color:var(--_danger)}.fly-currency-selector__retry{border:1px solid var(--_border);border-radius:6px;background:var(--_surface);padding-block:2px;padding-inline:8px;color:var(--_text);font:inherit;font-weight:600;cursor:pointer}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], currencies: [{ type: i0.Input, args: [{ isSignal: true, alias: "currencies", required: false }] }], fetchFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "fetchFn", required: false }] }], allowedCodes: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowedCodes", required: false }] }], pinnedCodes: [{ type: i0.Input, args: [{ isSignal: true, alias: "pinnedCodes", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], locked: [{ type: i0.Input, args: [{ isSignal: true, alias: "locked", required: false }] }], lockedReasonKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "lockedReasonKey", required: false }] }], lockedReasonParams: [{ type: i0.Input, args: [{ isSignal: true, alias: "lockedReasonParams", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], searchPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchPlaceholder", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }], selectionDetailChange: [{ type: i0.Output, args: ["selectionDetailChange"] }], openedChange: [{ type: i0.Output, args: ["openedChange"] }], searchEl: [{
                 type: ViewChild,
                 args: ['searchRef']
             }], triggerEl: [{
@@ -18979,144 +19180,572 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
             }] } });
 
 /**
- * Document-wide open-overlay stack — Escape arbitration for stacked overlays.
- *
- * Every layered overlay (drawer, modal, confirm dialog, menu, popover) listens for
- * Escape at the document level, so without arbitration one keypress closes the whole
- * pile — a confirm dialog opened over a drawer takes the drawer down with it on the
- * first Escape. Each overlay pushes a handle when it opens and removes it when it
- * closes or is destroyed; its Escape handler acts only while its handle is
- * top-of-stack. First Escape then closes the confirm, second the drawer.
- *
- * The stack is pure (no DOM, no DI) so the ordering rules are unit-testable, and the
- * shared {@link overlayStack} singleton spans the whole document — which is the point:
- * independently-owned overlays, including ones in different federated remotes, must
- * arbitrate globally or they cannot know about each other.
- *
- * ## Federation
- * Native Federation shares this package as a singleton, so every app in the shell
- * binds to one stack instance. A remote that forks its own DS copy would get its own
- * stack and lose arbitration against shell overlays — that is what the package's
- * federation singleton guard exists to catch.
+ * Locale-aware formatting primitives — numbers, byte sizes, relative time, and dates.
  *
- * @example
- * ```ts
- * export class MyDrawer {
- *   private handle: OverlayHandle | null = null;
+ * All of these are `Intl`-backed and take an explicit `locale`, which is the whole
+ * point: the estate is full of hand-rolled formatters that hardcode ASCII digits,
+ * English unit strings ("1.4 MB", "5m ago"), or the *browser's* default locale rather
+ * than the app's selected language. Under `ar` / `ur` those render wrong — and i18n is
+ * mandatory on this platform, so this is a correctness surface, not a convenience one.
  *
- *   open() { this.handle = overlayStack.push(); }
- *   close() { this.handle = overlayStack.remove(this.handle); }
+ * Pure functions here; the `| flyCompact`-style pipes in `format.pipes.ts` wrap them
+ * and default the locale to the active {@link I18nService} language.
  *
- *   onEscape() { if (overlayStack.isTop(this.handle)) this.close(); }
- * }
- * ```
+ * ## The em-dash convention
+ * Every formatter returns `'—'` (U+2014) for null / undefined / non-finite input rather
+ * than throwing, `'NaN'`, or an empty string. A visible placeholder keeps table columns
+ * aligned and makes "no value" legible; an empty string reads as a rendering bug.
  */
-class OverlayStack {
-    stack = [];
-    /** Registers an opening overlay; the returned handle identifies it for later calls. */
-    push() {
-        const handle = { overlay: true };
-        this.stack.push(handle);
-        return handle;
-    }
-    /**
-     * Unregisters a closing or destroyed overlay. Tolerates out-of-order removal (an
-     * inner overlay torn down after its parent), unknown handles, and `null`.
-     *
-     * Returns `null` so callers can clear their field in one statement:
-     * `this.handle = overlayStack.remove(this.handle)`.
-     */
-    remove(handle) {
-        if (!handle)
-            return null;
-        const index = this.stack.indexOf(handle);
-        if (index !== -1)
-            this.stack.splice(index, 1);
-        return null;
-    }
-    /** True when this handle is the topmost open overlay — its Escape handler may act. */
-    isTop(handle) {
-        return (handle !== null &&
-            this.stack.length > 0 &&
-            this.stack[this.stack.length - 1] === handle);
+/** Rendered for null / undefined / non-finite input across every formatter here. */
+const FLY_EMPTY_VALUE = '—';
+// ─── Numbers ─────────────────────────────────────────────────────────────────
+/** At or above this magnitude, switch from grouped-exact to compact (K/M/B) notation. */
+const FLY_COMPACT_THRESHOLD = 10_000;
+// Intl formatters are expensive to construct relative to how often these are called in
+// a table cell or chart label; cache one per distinct configuration.
+const compactCache = new Map();
+const integerCache = new Map();
+const decimalCache = new Map();
+function compactFormatter(locale) {
+    let f = compactCache.get(locale);
+    if (!f) {
+        f = new Intl.NumberFormat(locale, { notation: 'compact', maximumFractionDigits: 1 });
+        compactCache.set(locale, f);
     }
-    /** Number of currently-open overlays. Useful for scroll-lock refcounting. */
-    get depth() {
-        return this.stack.length;
+    return f;
+}
+function integerFormatter(locale) {
+    let f = integerCache.get(locale);
+    if (!f) {
+        f = new Intl.NumberFormat(locale, { maximumFractionDigits: 0 });
+        integerCache.set(locale, f);
     }
+    return f;
 }
 /**
- * The shared, document-wide stack. Import this rather than constructing an
- * `OverlayStack` — a private instance cannot arbitrate against anyone else's
- * overlays, which defeats the purpose.
- */
-const overlayStack = new OverlayStack();
-
-/**
- * Focus capture/restore for overlays — the other half of a correct dismiss story.
- *
- * When an overlay opens it moves focus inside itself; when it closes, focus must go
- * back to whatever opened it, or the keyboard user is dumped at the top of the
- * document and has to re-traverse the page. Every hand-rolled modal/drawer in the
- * estate re-implements this with a `restoreFocusTo` field and a `.focus()` call, and
- * most of them miss at least one of the edge cases below.
- *
- * @example
- * ```ts
- * private restore: FocusRestore | null = null;
+ * Compact, scannable form — grouped-exact below {@link FLY_COMPACT_THRESHOLD},
+ * unit-compacted above it.
  *
- * open()  { this.restore = captureFocus(); }
- * close() { this.restore = restoreFocus(this.restore); }
  * ```
+ * 6 042         → "6,042"    (exact; small buckets read best as real numbers)
+ * 12 400        → "12.4K"
+ * 1 900 787     → "1.9M"
+ * 2 300 000 000 → "2.3B"
+ * ```
+ *
+ * Pair with {@link flyFullNumber} in a tooltip or `aria-label` so the exact figure is
+ * always one hover away — compaction is a display affordance, not data loss.
  */
+function flyCompactNumber(value, locale = 'en') {
+    if (value == null || !Number.isFinite(value))
+        return FLY_EMPTY_VALUE;
+    return Math.abs(value) >= FLY_COMPACT_THRESHOLD
+        ? compactFormatter(locale).format(value)
+        : integerFormatter(locale).format(value);
+}
+/** Exact, fully-grouped integer form for tooltips / a11y (e.g. `"1,900,787"`). */
+function flyFullNumber(value, locale = 'en') {
+    if (value == null || !Number.isFinite(value))
+        return FLY_EMPTY_VALUE;
+    return integerFormatter(locale).format(value);
+}
 /**
- * Snapshots the currently-focused element so it can be refocused later.
- *
- * Returns a token even when nothing is focused (`document.body` is treated as "no
- * meaningful focus"), so callers never branch — {@link restoreFocus} no-ops on it.
+ * Fractional form for ratios where the decimal *is* the signal (avg depth 1.5,
+ * sparsity 0.25) — distinct from {@link flyFullNumber}, which floors to integers.
+ * Trailing zeros drop.
  */
-function captureFocus(doc = document) {
-    const active = doc.activeElement;
-    const element = active instanceof HTMLElement && active !== doc.body ? active : null;
-    return { element };
+function flyDecimalNumber(value, locale = 'en', maxFractionDigits = 2) {
+    if (value == null || !Number.isFinite(value))
+        return FLY_EMPTY_VALUE;
+    const key = `${locale}|${maxFractionDigits}`;
+    let f = decimalCache.get(key);
+    if (!f) {
+        f = new Intl.NumberFormat(locale, { maximumFractionDigits: maxFractionDigits });
+        decimalCache.set(key, f);
+    }
+    return f.format(value);
 }
 /**
- * Returns focus to the captured element, if it is still focusable.
- *
- * Guards the three cases that make naive `restoreFocusTo.focus()` misbehave:
- * - the element was removed from the DOM while the overlay was open (a row deleted by
- *   the very dialog that is closing) — `isConnected` is false, so we skip rather than
- *   throw focus to `<body>` via a detached node;
- * - it became disabled or `inert` while the overlay was open;
- * - nothing was focused when the overlay opened.
- *
- * `preventScroll` keeps the page from jumping when the trigger has scrolled out of
- * view behind the overlay — the caller decides whether the trigger should be scrolled
- * back into view, which is a product decision, not a focus one.
+ * Signed compact delta for "change since last poll" chips (`"+12.4K"`, `"−340"`).
+ * Returns an empty string for zero / non-finite so a no-change chip renders nothing
+ * rather than a meaningless "0".
  *
- * Returns `null` so callers can clear their field in one statement.
+ * Uses U+2212 MINUS SIGN, not a hyphen — it matches the plus glyph's width and weight,
+ * so a column of deltas stays visually aligned.
  */
-function restoreFocus(restore, options = {}) {
-    const element = restore?.element;
-    if (!element || !element.isConnected)
-        return null;
-    if (element.hasAttribute('disabled') || element.closest('[inert]'))
-        return null;
-    element.focus({ preventScroll: options.preventScroll ?? true });
-    return null;
+function flySignedCompact(delta, locale = 'en') {
+    if (!Number.isFinite(delta) || delta === 0)
+        return '';
+    const sign = delta > 0 ? '+' : '−';
+    return sign + flyCompactNumber(Math.abs(delta), locale);
 }
-
+// ─── Byte sizes ──────────────────────────────────────────────────────────────
+/** Binary unit ladder. Byte sizes are conventionally base-1024 in file UIs. */
+const BYTE_UNITS = ['byte', 'kilobyte', 'megabyte', 'gigabyte', 'terabyte'];
+const byteCache = new Map();
 /**
- * Debounce primitives — the shared replacement for the `setTimeout` / `clearTimeout`
- * pairs hand-rolled in every list screen and typeahead across the estate.
- *
- * Two entry points, for the two situations:
- * - {@link FlyDebouncer} — an object you hold and call, with `cancel()` and `flush()`.
- *   Use it in a component that debounces on a field (search boxes, reload-on-filter).
- * - {@link flyDebounced} — an injection-context factory that wires `cancel()` to the
- *   host's `DestroyRef` for you, so a pending call can never fire after teardown.
+ * Human-readable byte size (`"482 bytes"`, `"1.4 MB"`, `"2.3 GB"`), localized.
  *
- * ## Why not `debounceTime` from RxJS
+ * Base-1024 with a log-derived unit pick, clamped at TB so a bogus huge value degrades
+ * to a large TB figure instead of overflowing the ladder. Trailing zeros drop
+ * (`1.0 MB` → `1 MB`).
+ *
+ * Localization matters here and is the reason this supersedes the eight hand-rolled
+ * copies in the estate: those concatenate hardcoded English unit strings, so an Arabic
+ * user saw Latin "MB" beside Arabic-Indic digits. `Intl` unit formatting renders both
+ * the number and the unit in the active locale (French even gets "octets").
+ *
+ * Note the deliberate convention mismatch: the maths is base-1024 while the rendered
+ * symbols are the SI ones ("kB", "MB"), so 1024 bytes shows as "1 kB" rather than the
+ * pedantically-correct "1 KiB". Every mainstream file UI — Windows Explorer, Finder —
+ * does exactly this, and `Intl` has no binary-prefix units, so matching user
+ * expectation beats matching the standard here.
+ */
+function flyFormatBytes(bytes, locale = 'en') {
+    if (bytes == null || !Number.isFinite(bytes))
+        return FLY_EMPTY_VALUE;
+    if (bytes <= 0)
+        return formatByteValue(0, 'byte', locale);
+    const index = Math.min(Math.floor(Math.log(bytes) / Math.log(1024)), BYTE_UNITS.length - 1);
+    const value = bytes / Math.pow(1024, index);
+    // Bytes are whole things — never render "482.3 B".
+    const rounded = index === 0 ? Math.round(value) : parseFloat(value.toFixed(1));
+    return formatByteValue(rounded, BYTE_UNITS[index], locale);
+}
+function formatByteValue(value, unit, locale) {
+    const key = `${locale}|${unit}`;
+    let f = byteCache.get(key);
+    if (!f) {
+        f = new Intl.NumberFormat(locale, {
+            style: 'unit',
+            unit,
+            // Raw bytes read best spelled out and pluralized ("482 bytes", "1 byte" —
+            // and correctly "482 octets" in French). The larger units are universally
+            // recognised as symbols, where the spelled-out form ("1.4 megabytes") would
+            // be noise in a file list.
+            unitDisplay: unit === 'byte' ? 'long' : 'short',
+            maximumFractionDigits: 1,
+        });
+        byteCache.set(key, f);
+    }
+    return f.format(value);
+}
+// ─── Relative time ───────────────────────────────────────────────────────────
+/**
+ * Formats an instant as a localized relative age — `"2 minutes ago"` /
+ * `"منذ دقيقتين"` / `"il y a 2 minutes"`. Works for future instants too
+ * (`"in 3 days"`), which is what makes it usable for due dates and SLA countdowns.
+ *
+ * `now` is injectable so tests can pin the clock instead of sleeping or accepting
+ * flake around bucket boundaries.
+ */
+function flyRelativeTime(value, locale = 'en', now = new Date()) {
+    if (value == null || value === '')
+        return FLY_EMPTY_VALUE;
+    const then = value instanceof Date ? value : new Date(value);
+    const ms = then.getTime();
+    if (Number.isNaN(ms))
+        return FLY_EMPTY_VALUE;
+    const diffMs = ms - now.getTime();
+    const rtf = new Intl.RelativeTimeFormat(locale, { numeric: 'auto' });
+    const absSec = Math.abs(diffMs) / 1000;
+    // `numeric: 'auto'` is what yields "yesterday" / "now" instead of a stiff
+    // "1 day ago" / "0 seconds ago" at the bucket edges.
+    if (absSec < 60)
+        return rtf.format(Math.round(diffMs / 1000), 'second');
+    if (absSec < 3600)
+        return rtf.format(Math.round(diffMs / 60_000), 'minute');
+    if (absSec < 86_400)
+        return rtf.format(Math.round(diffMs / 3_600_000), 'hour');
+    if (absSec < 2_592_000)
+        return rtf.format(Math.round(diffMs / 86_400_000), 'day');
+    if (absSec < 31_536_000)
+        return rtf.format(Math.round(diffMs / 2_592_000_000), 'month');
+    return rtf.format(Math.round(diffMs / 31_536_000_000), 'year');
+}
+/**
+ * Formats a duration in seconds as a localized short unit string — `420` → `"7 min"`
+ * (en) / `"7 د"` (ar). Picks seconds / minutes / hours by magnitude.
+ */
+function flyDuration(seconds, locale = 'en') {
+    if (seconds == null || !Number.isFinite(seconds) || seconds < 0) {
+        return FLY_EMPTY_VALUE;
+    }
+    const fmt = (unit, v) => new Intl.NumberFormat(locale, {
+        style: 'unit',
+        unit,
+        unitDisplay: 'narrow',
+        maximumFractionDigits: 0,
+    }).format(v);
+    if (seconds < 60)
+        return fmt('second', seconds);
+    if (seconds < 3600)
+        return fmt('minute', seconds / 60);
+    return fmt('hour', seconds / 3600);
+}
+// ─── Dates ───────────────────────────────────────────────────────────────────
+/**
+ * Localized calendar date (no time). Pass `options` to override the default
+ * short-date presentation.
+ *
+ * Unlike the bare `toLocaleDateString()` calls it replaces, this takes an explicit
+ * locale — those used the *browser's* locale and so ignored the app's language setting
+ * entirely. Invalid input degrades to the em dash rather than `"Invalid Date"`.
+ */
+function flyFormatDate(value, locale = 'en', options = { dateStyle: 'medium' }) {
+    const date = toValidDate(value);
+    if (!date)
+        return FLY_EMPTY_VALUE;
+    try {
+        return new Intl.DateTimeFormat(locale, options).format(date);
+    }
+    catch {
+        // A malformed `options` object (or an unsupported locale extension) throws;
+        // degrade to the ISO date rather than taking the view down.
+        return date.toISOString().slice(0, 10);
+    }
+}
+/** Localized time of day (no date). */
+function flyFormatTime(value, locale = 'en', options = { timeStyle: 'short' }) {
+    return flyFormatDate(value, locale, options);
+}
+/** Localized date + time — the tooltip companion to a relative or short-date cell. */
+function flyFormatDateTime(value, locale = 'en', options = { dateStyle: 'medium', timeStyle: 'short' }) {
+    return flyFormatDate(value, locale, options);
+}
+/**
+ * Calendar date as `yyyy-MM-dd` — the wire/sort form, deliberately NOT localized.
+ *
+ * Use for `<input type="date">` values, query params, and sort keys. For anything a
+ * user reads, use {@link flyFormatDate}.
+ *
+ * Derived from the instant's **UTC** date so the value is stable across timezones —
+ * a local-date derivation shifts the day for users east/west of the source data.
+ */
+function flyToDateOnly(value) {
+    const date = toValidDate(value);
+    return date ? date.toISOString().slice(0, 10) : '';
+}
+function toValidDate(value) {
+    if (value == null || value === '')
+        return null;
+    const date = value instanceof Date ? value : new Date(value);
+    return Number.isNaN(date.getTime()) ? null : date;
+}
+
+/**
+ * ISO 4217 minor-unit EXCEPTIONS, used ONLY when `currency` is a bare code string with
+ * no matching `FlyCurrency` row to read `decimalDigits` from. This is deliberately a
+ * PARTIAL table — it mirrors exactly the two exception groups
+ * {@link FlyCurrency.decimalDigits}'s own doc comment names (0-decimal: JPY, KRW, the
+ * CFA francs; 3-decimal: the seven Gulf/MENA dinars/rials), not full ISO 4217 coverage.
+ * Every code outside these two sets defaults to 2, which is correct for the ISO 4217
+ * majority.
+ *
+ * This is the "explicit, documented fallback" D-B7-2 requires in place of a silent
+ * "assume 2" — but it is still a fallback, not a substitute for the real data. A caller
+ * that needs certainty for every currency (there are 0-decimal codes beyond the three
+ * listed here) should pass the `FlyCurrency` row instead of a bare code:
+ * `fly-currency-selector`'s `(selectionDetailChange)` emits the full row precisely so a
+ * host never has to guess.
+ */
+const ZERO_DECIMAL_FALLBACK_CODES = new Set(['JPY', 'KRW', 'XAF', 'XOF', 'XPF']);
+const THREE_DECIMAL_FALLBACK_CODES = new Set([
+    'BHD',
+    'IQD',
+    'JOD',
+    'KWD',
+    'LYD',
+    'OMR',
+    'TND',
+]);
+function fallbackDecimalDigits(code) {
+    if (ZERO_DECIMAL_FALLBACK_CODES.has(code))
+        return 0;
+    if (THREE_DECIMAL_FALLBACK_CODES.has(code))
+        return 3;
+    return 2;
+}
+/** Accepts a `FlyCurrency` row or a bare ISO 4217 code string; `null`/`undefined`/blank resolves to `null`. */
+function resolveCurrencyMeta(currency) {
+    if (currency && typeof currency === 'object') {
+        const digits = Number.isInteger(currency.decimalDigits) && currency.decimalDigits >= 0
+            ? currency.decimalDigits
+            : 2; // Defensive only — a malformed row should still render something rather than throw.
+        return { code: currency.code.trim().toUpperCase(), symbol: currency.symbol ?? null, decimalDigits: digits };
+    }
+    if (typeof currency === 'string' && currency.trim()) {
+        const code = currency.trim().toUpperCase();
+        return { code, symbol: null, decimalDigits: fallbackDecimalDigits(code) };
+    }
+    return null;
+}
+/** The text substituted for Intl's `currency` part, per `display`. `null` removes it entirely. */
+function displayLabel(meta, display) {
+    if (display === 'none')
+        return null;
+    if (display === 'code')
+        return meta.code;
+    // 'symbol' — degrade to the code when no symbol is known (the bare-code path), never
+    // an Intl-guessed symbol that might not match the platform's own catalogue.
+    return meta.symbol && meta.symbol.trim() ? meta.symbol : meta.code;
+}
+// Intl.NumberFormat construction is non-trivial; cache one per distinct (locale, code, digits).
+const moneyFormatterCache = new Map();
+/**
+ * Returns `null` when `code` is not well-formed enough for `Intl` to accept as a
+ * `currency` option (e.g. a malformed catalogue row) — the caller degrades to
+ * {@link manualFormat} rather than letting a `RangeError` take the view down.
+ */
+function currencyFormatter(locale, code, digits) {
+    const key = `${locale}|${code}|${digits}`;
+    const cached = moneyFormatterCache.get(key);
+    if (cached)
+        return cached;
+    try {
+        const f = new Intl.NumberFormat(locale, {
+            style: 'currency',
+            currency: code,
+            // Always 'code', regardless of the caller's `display` option — see the module
+            // doc comment on why this is the structural template rather than 'symbol'.
+            currencyDisplay: 'code',
+            minimumFractionDigits: digits,
+            maximumFractionDigits: digits,
+        });
+        moneyFormatterCache.set(key, f);
+        return f;
+    }
+    catch {
+        return null;
+    }
+}
+const plainDecimalCache = new Map();
+function plainDecimalFormatter(locale, digits) {
+    const key = `${locale}|${digits}`;
+    let f = plainDecimalCache.get(key);
+    if (!f) {
+        f = new Intl.NumberFormat(locale, { minimumFractionDigits: digits, maximumFractionDigits: digits });
+        plainDecimalCache.set(key, f);
+    }
+    return f;
+}
+/** Manual `"<label> <number>"` construction for the rare case Intl rejects the code outright. */
+function manualFormat(amount, meta, display, locale) {
+    const number = plainDecimalFormatter(locale, meta.decimalDigits).format(amount);
+    const label = displayLabel(meta, display);
+    return label ? `${label} ${number}` : number;
+}
+/**
+ * Formats `amount` in `currency`, localized to `options.locale`.
+ *
+ * ```ts
+ * flyFormatMoney(1234.5, kwdRow)                          // "د.ك 1,234.500" (KWD is 3-decimal)
+ * flyFormatMoney(1234, 'JPY')                              // "JPY 1,234"     (bare code, no symbol to read — degrades to the code)
+ * flyFormatMoney(-42, usdRow, { display: 'code' })         // "-USD 42.00"
+ * flyFormatMoney(99.9, eurRow, { display: 'none' })        // "99.90"         (currency named elsewhere on screen)
+ * flyFormatMoney(null, usdRow)                             // "—"             (never "NaN")
+ * ```
+ *
+ * `amount == null` or non-finite (`NaN`, `Infinity`), or an unresolvable `currency`,
+ * renders {@link FLY_EMPTY_VALUE} — the same placeholder every other `format.ts`
+ * primitive uses, so a money cell in a mixed table degrades exactly like its neighbours
+ * instead of introducing a second "no value" convention.
+ */
+function flyFormatMoney(amount, currency, options = {}) {
+    if (amount == null || !Number.isFinite(amount))
+        return FLY_EMPTY_VALUE;
+    const meta = resolveCurrencyMeta(currency);
+    if (!meta)
+        return FLY_EMPTY_VALUE;
+    const { display = 'symbol', locale = 'en' } = options;
+    const formatter = currencyFormatter(locale, meta.code, meta.decimalDigits);
+    if (!formatter)
+        return manualFormat(amount, meta, display, locale);
+    const label = displayLabel(meta, display);
+    return formatter
+        .formatToParts(amount)
+        .map((part) => (part.type === 'currency' ? (label ?? '') : part.value))
+        // Removing the currency part (display: 'none') leaves its adjacent literal
+        // separator behind (Intl emits currency+space as two parts) — collapse and trim
+        // rather than special-casing every locale's separator placement.
+        .join('')
+        .replace(/\s+/g, ' ')
+        .trim();
+}
+
+/**
+ * `{{ amount | flyMoney: currencyRow }}` → `"$1,234.50"` / `{{ amount | flyMoney: 'KWD' }}`
+ * → `"KD 1,234.500"`.
+ *
+ * Template wrapper over {@link flyFormatMoney}, defaulting the locale to the active
+ * {@link I18nService} language the same way every other `Fly*Pipe` in `format.pipes.ts`
+ * does — see that file's doc comment for the "pass the locale signal explicitly in a
+ * view that must react live to the language switcher" caveat, which applies here too.
+ *
+ * A separate file from `format.pipes.ts` on purpose: this pipe's `currency` argument
+ * depends on `FlyCurrency` (the currency-selector's data contract), a domain type the
+ * pure number/byte/date formatters in `format.pipes.ts` have no reason to import.
+ *
+ * ```html
+ * {{ invoice.total | flyMoney: invoice.currency }}
+ * {{ invoice.total | flyMoney: invoice.currency : { display: 'code' } }}
+ * ```
+ */
+class FlyMoneyPipe {
+    i18n = inject(I18nService);
+    transform(amount, currency, options) {
+        return flyFormatMoney(amount, currency, {
+            display: options?.display,
+            locale: options?.locale ?? this.i18n.locale(),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FlyMoneyPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.19", ngImport: i0, type: FlyMoneyPipe, isStandalone: true, name: "flyMoney" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FlyMoneyPipe, decorators: [{
+            type: Pipe,
+            args: [{ name: 'flyMoney', standalone: true }]
+        }] });
+
+/**
+ * Document-wide open-overlay stack — Escape arbitration for stacked overlays.
+ *
+ * Every layered overlay (drawer, modal, confirm dialog, menu, popover) listens for
+ * Escape at the document level, so without arbitration one keypress closes the whole
+ * pile — a confirm dialog opened over a drawer takes the drawer down with it on the
+ * first Escape. Each overlay pushes a handle when it opens and removes it when it
+ * closes or is destroyed; its Escape handler acts only while its handle is
+ * top-of-stack. First Escape then closes the confirm, second the drawer.
+ *
+ * The stack is pure (no DOM, no DI) so the ordering rules are unit-testable, and the
+ * shared {@link overlayStack} singleton spans the whole document — which is the point:
+ * independently-owned overlays, including ones in different federated remotes, must
+ * arbitrate globally or they cannot know about each other.
+ *
+ * ## Federation
+ * Native Federation shares this package as a singleton, so every app in the shell
+ * binds to one stack instance. A remote that forks its own DS copy would get its own
+ * stack and lose arbitration against shell overlays — that is what the package's
+ * federation singleton guard exists to catch.
+ *
+ * @example
+ * ```ts
+ * export class MyDrawer {
+ *   private handle: OverlayHandle | null = null;
+ *
+ *   open() { this.handle = overlayStack.push(); }
+ *   close() { this.handle = overlayStack.remove(this.handle); }
+ *
+ *   onEscape() { if (overlayStack.isTop(this.handle)) this.close(); }
+ * }
+ * ```
+ */
+class OverlayStack {
+    stack = [];
+    /** Registers an opening overlay; the returned handle identifies it for later calls. */
+    push() {
+        const handle = { overlay: true };
+        this.stack.push(handle);
+        return handle;
+    }
+    /**
+     * Unregisters a closing or destroyed overlay. Tolerates out-of-order removal (an
+     * inner overlay torn down after its parent), unknown handles, and `null`.
+     *
+     * Returns `null` so callers can clear their field in one statement:
+     * `this.handle = overlayStack.remove(this.handle)`.
+     */
+    remove(handle) {
+        if (!handle)
+            return null;
+        const index = this.stack.indexOf(handle);
+        if (index !== -1)
+            this.stack.splice(index, 1);
+        return null;
+    }
+    /** True when this handle is the topmost open overlay — its Escape handler may act. */
+    isTop(handle) {
+        return (handle !== null &&
+            this.stack.length > 0 &&
+            this.stack[this.stack.length - 1] === handle);
+    }
+    /** Number of currently-open overlays. Useful for scroll-lock refcounting. */
+    get depth() {
+        return this.stack.length;
+    }
+}
+/**
+ * The shared, document-wide stack. Import this rather than constructing an
+ * `OverlayStack` — a private instance cannot arbitrate against anyone else's
+ * overlays, which defeats the purpose.
+ */
+const overlayStack = new OverlayStack();
+
+/**
+ * Focus capture/restore for overlays — the other half of a correct dismiss story.
+ *
+ * When an overlay opens it moves focus inside itself; when it closes, focus must go
+ * back to whatever opened it, or the keyboard user is dumped at the top of the
+ * document and has to re-traverse the page. Every hand-rolled modal/drawer in the
+ * estate re-implements this with a `restoreFocusTo` field and a `.focus()` call, and
+ * most of them miss at least one of the edge cases below.
+ *
+ * @example
+ * ```ts
+ * private restore: FocusRestore | null = null;
+ *
+ * open()  { this.restore = captureFocus(); }
+ * close() { this.restore = restoreFocus(this.restore); }
+ * ```
+ */
+/**
+ * Snapshots the currently-focused element so it can be refocused later.
+ *
+ * Returns a token even when nothing is focused (`document.body` is treated as "no
+ * meaningful focus"), so callers never branch — {@link restoreFocus} no-ops on it.
+ */
+function captureFocus(doc = document) {
+    const active = doc.activeElement;
+    const element = active instanceof HTMLElement && active !== doc.body ? active : null;
+    return { element };
+}
+/**
+ * Returns focus to the captured element, if it is still focusable.
+ *
+ * Guards the three cases that make naive `restoreFocusTo.focus()` misbehave:
+ * - the element was removed from the DOM while the overlay was open (a row deleted by
+ *   the very dialog that is closing) — `isConnected` is false, so we skip rather than
+ *   throw focus to `<body>` via a detached node;
+ * - it became disabled or `inert` while the overlay was open;
+ * - nothing was focused when the overlay opened.
+ *
+ * `preventScroll` keeps the page from jumping when the trigger has scrolled out of
+ * view behind the overlay — the caller decides whether the trigger should be scrolled
+ * back into view, which is a product decision, not a focus one.
+ *
+ * Returns `null` so callers can clear their field in one statement.
+ */
+function restoreFocus(restore, options = {}) {
+    const element = restore?.element;
+    if (!element || !element.isConnected)
+        return null;
+    if (element.hasAttribute('disabled') || element.closest('[inert]'))
+        return null;
+    element.focus({ preventScroll: options.preventScroll ?? true });
+    return null;
+}
+
+/**
+ * Debounce primitives — the shared replacement for the `setTimeout` / `clearTimeout`
+ * pairs hand-rolled in every list screen and typeahead across the estate.
+ *
+ * Two entry points, for the two situations:
+ * - {@link FlyDebouncer} — an object you hold and call, with `cancel()` and `flush()`.
+ *   Use it in a component that debounces on a field (search boxes, reload-on-filter).
+ * - {@link flyDebounced} — an injection-context factory that wires `cancel()` to the
+ *   host's `DestroyRef` for you, so a pending call can never fire after teardown.
+ *
+ * ## Why not `debounceTime` from RxJS
  * Nothing wrong with it when the input is already a stream. But the common case here
  * is a signal-based component with an `(input)` handler and no Subject in sight, and
  * standing up a `Subject` + `takeUntilDestroyed` + `subscribe` to debounce one field is
@@ -19800,260 +20429,6 @@ function presenceColorFor(seed) {
     return PRESENCE_COLORS[Math.abs(hash) % PRESENCE_COLORS.length];
 }
 
-/**
- * Locale-aware formatting primitives — numbers, byte sizes, relative time, and dates.
- *
- * All of these are `Intl`-backed and take an explicit `locale`, which is the whole
- * point: the estate is full of hand-rolled formatters that hardcode ASCII digits,
- * English unit strings ("1.4 MB", "5m ago"), or the *browser's* default locale rather
- * than the app's selected language. Under `ar` / `ur` those render wrong — and i18n is
- * mandatory on this platform, so this is a correctness surface, not a convenience one.
- *
- * Pure functions here; the `| flyCompact`-style pipes in `format.pipes.ts` wrap them
- * and default the locale to the active {@link I18nService} language.
- *
- * ## The em-dash convention
- * Every formatter returns `'—'` (U+2014) for null / undefined / non-finite input rather
- * than throwing, `'NaN'`, or an empty string. A visible placeholder keeps table columns
- * aligned and makes "no value" legible; an empty string reads as a rendering bug.
- */
-/** Rendered for null / undefined / non-finite input across every formatter here. */
-const FLY_EMPTY_VALUE = '—';
-// ─── Numbers ─────────────────────────────────────────────────────────────────
-/** At or above this magnitude, switch from grouped-exact to compact (K/M/B) notation. */
-const FLY_COMPACT_THRESHOLD = 10_000;
-// Intl formatters are expensive to construct relative to how often these are called in
-// a table cell or chart label; cache one per distinct configuration.
-const compactCache = new Map();
-const integerCache = new Map();
-const decimalCache = new Map();
-function compactFormatter(locale) {
-    let f = compactCache.get(locale);
-    if (!f) {
-        f = new Intl.NumberFormat(locale, { notation: 'compact', maximumFractionDigits: 1 });
-        compactCache.set(locale, f);
-    }
-    return f;
-}
-function integerFormatter(locale) {
-    let f = integerCache.get(locale);
-    if (!f) {
-        f = new Intl.NumberFormat(locale, { maximumFractionDigits: 0 });
-        integerCache.set(locale, f);
-    }
-    return f;
-}
-/**
- * Compact, scannable form — grouped-exact below {@link FLY_COMPACT_THRESHOLD},
- * unit-compacted above it.
- *
- * ```
- * 6 042         → "6,042"    (exact; small buckets read best as real numbers)
- * 12 400        → "12.4K"
- * 1 900 787     → "1.9M"
- * 2 300 000 000 → "2.3B"
- * ```
- *
- * Pair with {@link flyFullNumber} in a tooltip or `aria-label` so the exact figure is
- * always one hover away — compaction is a display affordance, not data loss.
- */
-function flyCompactNumber(value, locale = 'en') {
-    if (value == null || !Number.isFinite(value))
-        return FLY_EMPTY_VALUE;
-    return Math.abs(value) >= FLY_COMPACT_THRESHOLD
-        ? compactFormatter(locale).format(value)
-        : integerFormatter(locale).format(value);
-}
-/** Exact, fully-grouped integer form for tooltips / a11y (e.g. `"1,900,787"`). */
-function flyFullNumber(value, locale = 'en') {
-    if (value == null || !Number.isFinite(value))
-        return FLY_EMPTY_VALUE;
-    return integerFormatter(locale).format(value);
-}
-/**
- * Fractional form for ratios where the decimal *is* the signal (avg depth 1.5,
- * sparsity 0.25) — distinct from {@link flyFullNumber}, which floors to integers.
- * Trailing zeros drop.
- */
-function flyDecimalNumber(value, locale = 'en', maxFractionDigits = 2) {
-    if (value == null || !Number.isFinite(value))
-        return FLY_EMPTY_VALUE;
-    const key = `${locale}|${maxFractionDigits}`;
-    let f = decimalCache.get(key);
-    if (!f) {
-        f = new Intl.NumberFormat(locale, { maximumFractionDigits: maxFractionDigits });
-        decimalCache.set(key, f);
-    }
-    return f.format(value);
-}
-/**
- * Signed compact delta for "change since last poll" chips (`"+12.4K"`, `"−340"`).
- * Returns an empty string for zero / non-finite so a no-change chip renders nothing
- * rather than a meaningless "0".
- *
- * Uses U+2212 MINUS SIGN, not a hyphen — it matches the plus glyph's width and weight,
- * so a column of deltas stays visually aligned.
- */
-function flySignedCompact(delta, locale = 'en') {
-    if (!Number.isFinite(delta) || delta === 0)
-        return '';
-    const sign = delta > 0 ? '+' : '−';
-    return sign + flyCompactNumber(Math.abs(delta), locale);
-}
-// ─── Byte sizes ──────────────────────────────────────────────────────────────
-/** Binary unit ladder. Byte sizes are conventionally base-1024 in file UIs. */
-const BYTE_UNITS = ['byte', 'kilobyte', 'megabyte', 'gigabyte', 'terabyte'];
-const byteCache = new Map();
-/**
- * Human-readable byte size (`"482 bytes"`, `"1.4 MB"`, `"2.3 GB"`), localized.
- *
- * Base-1024 with a log-derived unit pick, clamped at TB so a bogus huge value degrades
- * to a large TB figure instead of overflowing the ladder. Trailing zeros drop
- * (`1.0 MB` → `1 MB`).
- *
- * Localization matters here and is the reason this supersedes the eight hand-rolled
- * copies in the estate: those concatenate hardcoded English unit strings, so an Arabic
- * user saw Latin "MB" beside Arabic-Indic digits. `Intl` unit formatting renders both
- * the number and the unit in the active locale (French even gets "octets").
- *
- * Note the deliberate convention mismatch: the maths is base-1024 while the rendered
- * symbols are the SI ones ("kB", "MB"), so 1024 bytes shows as "1 kB" rather than the
- * pedantically-correct "1 KiB". Every mainstream file UI — Windows Explorer, Finder —
- * does exactly this, and `Intl` has no binary-prefix units, so matching user
- * expectation beats matching the standard here.
- */
-function flyFormatBytes(bytes, locale = 'en') {
-    if (bytes == null || !Number.isFinite(bytes))
-        return FLY_EMPTY_VALUE;
-    if (bytes <= 0)
-        return formatByteValue(0, 'byte', locale);
-    const index = Math.min(Math.floor(Math.log(bytes) / Math.log(1024)), BYTE_UNITS.length - 1);
-    const value = bytes / Math.pow(1024, index);
-    // Bytes are whole things — never render "482.3 B".
-    const rounded = index === 0 ? Math.round(value) : parseFloat(value.toFixed(1));
-    return formatByteValue(rounded, BYTE_UNITS[index], locale);
-}
-function formatByteValue(value, unit, locale) {
-    const key = `${locale}|${unit}`;
-    let f = byteCache.get(key);
-    if (!f) {
-        f = new Intl.NumberFormat(locale, {
-            style: 'unit',
-            unit,
-            // Raw bytes read best spelled out and pluralized ("482 bytes", "1 byte" —
-            // and correctly "482 octets" in French). The larger units are universally
-            // recognised as symbols, where the spelled-out form ("1.4 megabytes") would
-            // be noise in a file list.
-            unitDisplay: unit === 'byte' ? 'long' : 'short',
-            maximumFractionDigits: 1,
-        });
-        byteCache.set(key, f);
-    }
-    return f.format(value);
-}
-// ─── Relative time ───────────────────────────────────────────────────────────
-/**
- * Formats an instant as a localized relative age — `"2 minutes ago"` /
- * `"منذ دقيقتين"` / `"il y a 2 minutes"`. Works for future instants too
- * (`"in 3 days"`), which is what makes it usable for due dates and SLA countdowns.
- *
- * `now` is injectable so tests can pin the clock instead of sleeping or accepting
- * flake around bucket boundaries.
- */
-function flyRelativeTime(value, locale = 'en', now = new Date()) {
-    if (value == null || value === '')
-        return FLY_EMPTY_VALUE;
-    const then = value instanceof Date ? value : new Date(value);
-    const ms = then.getTime();
-    if (Number.isNaN(ms))
-        return FLY_EMPTY_VALUE;
-    const diffMs = ms - now.getTime();
-    const rtf = new Intl.RelativeTimeFormat(locale, { numeric: 'auto' });
-    const absSec = Math.abs(diffMs) / 1000;
-    // `numeric: 'auto'` is what yields "yesterday" / "now" instead of a stiff
-    // "1 day ago" / "0 seconds ago" at the bucket edges.
-    if (absSec < 60)
-        return rtf.format(Math.round(diffMs / 1000), 'second');
-    if (absSec < 3600)
-        return rtf.format(Math.round(diffMs / 60_000), 'minute');
-    if (absSec < 86_400)
-        return rtf.format(Math.round(diffMs / 3_600_000), 'hour');
-    if (absSec < 2_592_000)
-        return rtf.format(Math.round(diffMs / 86_400_000), 'day');
-    if (absSec < 31_536_000)
-        return rtf.format(Math.round(diffMs / 2_592_000_000), 'month');
-    return rtf.format(Math.round(diffMs / 31_536_000_000), 'year');
-}
-/**
- * Formats a duration in seconds as a localized short unit string — `420` → `"7 min"`
- * (en) / `"7 د"` (ar). Picks seconds / minutes / hours by magnitude.
- */
-function flyDuration(seconds, locale = 'en') {
-    if (seconds == null || !Number.isFinite(seconds) || seconds < 0) {
-        return FLY_EMPTY_VALUE;
-    }
-    const fmt = (unit, v) => new Intl.NumberFormat(locale, {
-        style: 'unit',
-        unit,
-        unitDisplay: 'narrow',
-        maximumFractionDigits: 0,
-    }).format(v);
-    if (seconds < 60)
-        return fmt('second', seconds);
-    if (seconds < 3600)
-        return fmt('minute', seconds / 60);
-    return fmt('hour', seconds / 3600);
-}
-// ─── Dates ───────────────────────────────────────────────────────────────────
-/**
- * Localized calendar date (no time). Pass `options` to override the default
- * short-date presentation.
- *
- * Unlike the bare `toLocaleDateString()` calls it replaces, this takes an explicit
- * locale — those used the *browser's* locale and so ignored the app's language setting
- * entirely. Invalid input degrades to the em dash rather than `"Invalid Date"`.
- */
-function flyFormatDate(value, locale = 'en', options = { dateStyle: 'medium' }) {
-    const date = toValidDate(value);
-    if (!date)
-        return FLY_EMPTY_VALUE;
-    try {
-        return new Intl.DateTimeFormat(locale, options).format(date);
-    }
-    catch {
-        // A malformed `options` object (or an unsupported locale extension) throws;
-        // degrade to the ISO date rather than taking the view down.
-        return date.toISOString().slice(0, 10);
-    }
-}
-/** Localized time of day (no date). */
-function flyFormatTime(value, locale = 'en', options = { timeStyle: 'short' }) {
-    return flyFormatDate(value, locale, options);
-}
-/** Localized date + time — the tooltip companion to a relative or short-date cell. */
-function flyFormatDateTime(value, locale = 'en', options = { dateStyle: 'medium', timeStyle: 'short' }) {
-    return flyFormatDate(value, locale, options);
-}
-/**
- * Calendar date as `yyyy-MM-dd` — the wire/sort form, deliberately NOT localized.
- *
- * Use for `<input type="date">` values, query params, and sort keys. For anything a
- * user reads, use {@link flyFormatDate}.
- *
- * Derived from the instant's **UTC** date so the value is stable across timezones —
- * a local-date derivation shifts the day for users east/west of the source data.
- */
-function flyToDateOnly(value) {
-    const date = toValidDate(value);
-    return date ? date.toISOString().slice(0, 10) : '';
-}
-function toValidDate(value) {
-    if (value == null || value === '')
-        return null;
-    const date = value instanceof Date ? value : new Date(value);
-    return Number.isNaN(date.getTime()) ? null : date;
-}
-
 /**
  * Template wrappers over the `format.ts` primitives. Each defaults its locale to the
  * active {@link I18nService} language, so the common case is `{{ value | flyBytes }}`
@@ -21858,8 +22233,22 @@ class FlyAppTopbarComponent {
     pendingFocus = signal(false, ...(ngDevMode ? [{ debugName: "pendingFocus" }] : /* istanbul ignore next */ []));
     flat = computed(() => flattenModules(this.sections()), ...(ngDevMode ? [{ debugName: "flat" }] : /* istanbul ignore next */ []));
     activeModule = computed(() => resolveActiveModule(this.sections(), this.activeKey()), ...(ngDevMode ? [{ debugName: "activeModule" }] : /* istanbul ignore next */ []));
-    brandAriaLabel = computed(() => this.i18n.t('ui.nav.home'), ...(ngDevMode ? [{ debugName: "brandAriaLabel" }] : /* istanbul ignore next */ []));
+    // Both trigger names must START with the button's visible text ("Circles",
+    // "Signals") — voice-control users activate controls by saying what they see,
+    // so a name that omits it fails WCAG 2.5.3 Label in Name. The action context
+    // is appended after the visible text; the popover menu keeps the plain
+    // "Switch module" name since it renders no visible text of its own.
+    brandAriaLabel = computed(() => {
+        const home = this.i18n.t('ui.nav.home');
+        const key = this.brandLabelKey();
+        return key ? `${this.i18n.t(key)}, ${home}` : home;
+    }, ...(ngDevMode ? [{ debugName: "brandAriaLabel" }] : /* istanbul ignore next */ []));
     switchAriaLabel = computed(() => this.i18n.t('ui.nav.switchModule'), ...(ngDevMode ? [{ debugName: "switchAriaLabel" }] : /* istanbul ignore next */ []));
+    triggerAriaLabel = computed(() => {
+        const active = this.activeModule();
+        const visible = active ? this.i18n.t(active.labelKey) : this.i18n.t('ui.nav.selectModule');
+        return `${visible}, ${this.i18n.t('ui.nav.switchModule')}`;
+    }, ...(ngDevMode ? [{ debugName: "triggerAriaLabel" }] : /* istanbul ignore next */ []));
     constructor() {
         inject(DestroyRef).onDestroy(() => overlayStack.remove(this.stackHandle));
         effect(() => {
@@ -21965,11 +22354,11 @@ class FlyAppTopbarComponent {
         this.rows()[index]?.nativeElement.focus();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FlyAppTopbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FlyAppTopbarComponent, isStandalone: true, selector: "fly-app-topbar", inputs: { brandLabelKey: { classPropertyName: "brandLabelKey", publicName: "brandLabelKey", isSignal: true, isRequired: false, transformFunction: null }, sections: { classPropertyName: "sections", publicName: "sections", isSignal: true, isRequired: false, transformFunction: null }, activeKey: { classPropertyName: "activeKey", publicName: "activeKey", isSignal: true, isRequired: false, transformFunction: null }, footerLabel: { classPropertyName: "footerLabel", publicName: "footerLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { moduleSelected: "moduleSelected", brandSelected: "brandSelected" }, host: { listeners: { "document:keydown.escape": "onEscape()" } }, queries: [{ propertyName: "icons", predicate: FlyModuleIconDirective, isSignal: true }], viewQueries: [{ propertyName: "rows", predicate: ["row"], descendants: true, isSignal: true }, { propertyName: "trigger", predicate: ["trigger"], descendants: true, isSignal: true }], ngImport: i0, template: "<header class=\"fly-topbar\">\r\n  <div class=\"fly-topbar__lead\">\r\n    <button\r\n      type=\"button\"\r\n      class=\"fly-topbar__brand\"\r\n      (click)=\"brandSelected.emit()\"\r\n      [attr.aria-label]=\"brandAriaLabel()\"\r\n    >\r\n      <span class=\"fly-topbar__brand-mark\"><ng-content select=\"[app-topbar-brand]\" /></span>\r\n      @if (brandLabelKey(); as key) {\r\n        <span class=\"fly-topbar__brand-name\">{{ key | translate }}</span>\r\n      }\r\n    </button>\r\n\r\n    @if (activeModule()) {\r\n      <span class=\"fly-topbar__sep\" aria-hidden=\"true\">/</span>\r\n    }\r\n\r\n    <div class=\"fly-topbar__anchor\" (flyClickOutside)=\"close()\" [flyClickOutsideEnabled]=\"open()\">\r\n      <button\r\n        #trigger\r\n        type=\"button\"\r\n        class=\"fly-topbar__module\"\r\n        [class.fly-topbar__module--on]=\"open()\"\r\n        (click)=\"toggle()\"\r\n        (keydown)=\"onTriggerKeydown($event)\"\r\n        aria-haspopup=\"menu\"\r\n        [attr.aria-expanded]=\"open()\"\r\n        [attr.aria-label]=\"switchAriaLabel()\"\r\n      >\r\n        @if (activeModule(); as active) {\r\n          <span class=\"fly-topbar__module-icon\">\r\n            @if (iconFor(active.key); as tpl) {\r\n              <ng-container *ngTemplateOutlet=\"tpl\" />\r\n            } @else if (active.iconClass) {\r\n              <i [class]=\"active.iconClass\" aria-hidden=\"true\"></i>\r\n            }\r\n          </span>\r\n          <span class=\"fly-topbar__module-label\">{{ active.labelKey | translate }}</span>\r\n        } @else {\r\n          <span class=\"fly-topbar__module-label fly-topbar__module-label--empty\">\r\n            {{ 'ui.nav.selectModule' | translate }}\r\n          </span>\r\n        }\r\n        <svg class=\"fly-topbar__chevron\" width=\"11\" height=\"11\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n             stroke=\"currentColor\" stroke-width=\"2.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n             aria-hidden=\"true\">\r\n          <polyline points=\"6 9 12 15 18 9\" />\r\n        </svg>\r\n      </button>\r\n\r\n      @if (open()) {\r\n        <div class=\"fly-topbar__pop\" role=\"menu\" [attr.aria-label]=\"switchAriaLabel()\">\r\n          <div class=\"fly-topbar__cols\">\r\n            @for (section of sections(); track $index) {\r\n              <div class=\"fly-topbar__col\">\r\n                @if (section.titleKey; as titleKey) {\r\n                  <div class=\"fly-topbar__col-title\">{{ titleKey | translate }}</div>\r\n                }\r\n                @for (mod of section.modules; track mod.key) {\r\n                  <button\r\n                    #row\r\n                    type=\"button\"\r\n                    class=\"fly-topbar__item\"\r\n                    [class.fly-topbar__item--on]=\"mod.key === activeKey()\"\r\n                    role=\"menuitem\"\r\n                    [disabled]=\"mod.disabled ?? false\"\r\n                    [attr.tabindex]=\"indexOf(mod) === focusIndex() ? 0 : -1\"\r\n                    [attr.aria-current]=\"mod.key === activeKey() ? 'page' : null\"\r\n                    (click)=\"select(mod)\"\r\n                    (keydown)=\"onRowKeydown($event)\"\r\n                  >\r\n                    <span class=\"fly-topbar__item-icon\">\r\n                      @if (iconFor(mod.key); as tpl) {\r\n                        <ng-container *ngTemplateOutlet=\"tpl\" />\r\n                      } @else if (mod.iconClass) {\r\n                        <i [class]=\"mod.iconClass\" aria-hidden=\"true\"></i>\r\n                      }\r\n                    </span>\r\n                    <span class=\"fly-topbar__item-main\">\r\n                      <span class=\"fly-topbar__item-label\">{{ mod.labelKey | translate }}</span>\r\n                      @if (mod.descKey; as descKey) {\r\n                        <span class=\"fly-topbar__item-desc\">{{ descKey | translate }}</span>\r\n                      }\r\n                    </span>\r\n                  </button>\r\n                }\r\n              </div>\r\n            }\r\n          </div>\r\n          @if (footerLabel()) {\r\n            <div class=\"fly-topbar__foot\">{{ footerLabel() }}</div>\r\n          }\r\n        </div>\r\n      }\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"fly-topbar__actions\"><ng-content select=\"[app-topbar-actions]\" /></div>\r\n</header>\r\n", styles: [":host{display:block;position:relative;z-index:var(--z-sticky)}.fly-topbar{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);padding:var(--sp-2) var(--sp-3);border-block-end:1px solid var(--line);background:var(--bg-3)}.fly-topbar__lead{display:flex;align-items:center;gap:var(--sp-2);min-inline-size:0}.fly-topbar__brand,.fly-topbar__module{display:inline-flex;align-items:center;gap:var(--sp-2);appearance:none;border:0;background:transparent;cursor:pointer;font:inherit;color:var(--ink);padding:var(--sp-1) var(--sp-2);border-radius:var(--r-md);transition:background var(--t-state)}.fly-topbar__brand:hover,.fly-topbar__module:hover{background:var(--bg-hover)}.fly-topbar__brand:focus-visible,.fly-topbar__module:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.fly-topbar__brand-name{font-weight:var(--fw-semibold);white-space:nowrap}.fly-topbar__brand-mark{display:inline-flex;align-items:center;max-block-size:var(--icon-lg)}.fly-topbar__sep{color:var(--ink-4);-webkit-user-select:none;user-select:none}.fly-topbar__module{min-inline-size:0}.fly-topbar__module--on{background:var(--bg-hover)}.fly-topbar__module-label{font-weight:var(--fw-medium);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fly-topbar__module-label--empty{color:var(--ink-3)}.fly-topbar__module-icon,.fly-topbar__item-icon{display:inline-flex;align-items:center;justify-content:center;inline-size:var(--icon-md);block-size:var(--icon-md);flex:0 0 auto;color:var(--accent)}.fly-topbar__chevron{flex:0 0 auto;color:var(--ink-3);transition:transform var(--t-state)}.fly-topbar__module--on .fly-topbar__chevron{transform:rotate(180deg)}.fly-topbar__anchor{position:relative}.fly-topbar__pop{position:absolute;inset-block-start:calc(100% + var(--sp-1));inset-inline-start:0;z-index:var(--z-overlay);min-inline-size:260px;max-inline-size:min(680px,92vw);padding:var(--sp-3);border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg-2);box-shadow:var(--shadow-panel)}.fly-topbar__cols{display:flex;gap:var(--sp-4);align-items:flex-start}@media(width<=720px){.fly-topbar__cols{flex-direction:column;gap:var(--sp-3)}}.fly-topbar__col{display:flex;flex-direction:column;gap:2px;min-inline-size:220px;flex:1 1 0}.fly-topbar__col-title{font-size:var(--text-2xs);font-weight:var(--fw-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--ink-3);padding:var(--sp-2) var(--sp-2) var(--sp-1)}.fly-topbar__item{display:flex;align-items:flex-start;gap:var(--sp-2);inline-size:100%;text-align:start;appearance:none;border:0;background:transparent;cursor:pointer;font:inherit;color:var(--ink);padding:var(--sp-2);border-radius:var(--r-md);transition:background var(--t-state)}.fly-topbar__item:hover:not(:disabled){background:var(--bg-hover)}.fly-topbar__item:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px}.fly-topbar__item:disabled{opacity:.5;cursor:default}.fly-topbar__item--on{background:var(--accent-soft);color:var(--on-accent-soft);box-shadow:inset 2px 0 0 0 var(--accent)}.fly-topbar__item-main{display:flex;flex-direction:column;gap:1px;min-inline-size:0}.fly-topbar__item-label{font-weight:var(--fw-medium);line-height:1.3}.fly-topbar__item-desc{font-size:var(--text-xs);color:var(--ink-3);line-height:1.35}.fly-topbar__foot{margin-block-start:var(--sp-3);padding-block-start:var(--sp-2);border-block-start:1px solid var(--line-3);font-size:var(--text-2xs);color:var(--ink-4)}.fly-topbar__actions{display:flex;align-items:center;gap:var(--sp-2);flex:0 0 auto}@media(forced-colors:active){.fly-topbar__item--on{border-inline-start:2px solid CanvasText}}@media(prefers-reduced-motion:reduce){.fly-topbar__brand,.fly-topbar__module,.fly-topbar__item,.fly-topbar__chevron{transition:none}}\n"], dependencies: [{ kind: "directive", type: FlyClickOutsideDirective, selector: "[flyClickOutside]", inputs: ["flyClickOutsideEnabled"], outputs: ["flyClickOutside"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FlyAppTopbarComponent, isStandalone: true, selector: "fly-app-topbar", inputs: { brandLabelKey: { classPropertyName: "brandLabelKey", publicName: "brandLabelKey", isSignal: true, isRequired: false, transformFunction: null }, sections: { classPropertyName: "sections", publicName: "sections", isSignal: true, isRequired: false, transformFunction: null }, activeKey: { classPropertyName: "activeKey", publicName: "activeKey", isSignal: true, isRequired: false, transformFunction: null }, footerLabel: { classPropertyName: "footerLabel", publicName: "footerLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { moduleSelected: "moduleSelected", brandSelected: "brandSelected" }, host: { listeners: { "document:keydown.escape": "onEscape()" } }, queries: [{ propertyName: "icons", predicate: FlyModuleIconDirective, isSignal: true }], viewQueries: [{ propertyName: "rows", predicate: ["row"], descendants: true, isSignal: true }, { propertyName: "trigger", predicate: ["trigger"], descendants: true, isSignal: true }], ngImport: i0, template: "<header class=\"fly-topbar\">\r\n  <div class=\"fly-topbar__lead\">\r\n    <button\r\n      type=\"button\"\r\n      class=\"fly-topbar__brand\"\r\n      (click)=\"brandSelected.emit()\"\r\n      [attr.aria-label]=\"brandAriaLabel()\"\r\n    >\r\n      <span class=\"fly-topbar__brand-mark\"><ng-content select=\"[app-topbar-brand]\" /></span>\r\n      @if (brandLabelKey(); as key) {\r\n        <span class=\"fly-topbar__brand-name\">{{ key | translate }}</span>\r\n      }\r\n    </button>\r\n\r\n    @if (activeModule()) {\r\n      <span class=\"fly-topbar__sep\" aria-hidden=\"true\">/</span>\r\n    }\r\n\r\n    <div class=\"fly-topbar__anchor\" (flyClickOutside)=\"close()\" [flyClickOutsideEnabled]=\"open()\">\r\n      <button\r\n        #trigger\r\n        type=\"button\"\r\n        class=\"fly-topbar__module\"\r\n        [class.fly-topbar__module--on]=\"open()\"\r\n        (click)=\"toggle()\"\r\n        (keydown)=\"onTriggerKeydown($event)\"\r\n        aria-haspopup=\"menu\"\r\n        [attr.aria-expanded]=\"open()\"\r\n        [attr.aria-label]=\"triggerAriaLabel()\"\r\n      >\r\n        @if (activeModule(); as active) {\r\n          <span class=\"fly-topbar__module-icon\">\r\n            @if (iconFor(active.key); as tpl) {\r\n              <ng-container *ngTemplateOutlet=\"tpl\" />\r\n            } @else if (active.iconClass) {\r\n              <i [class]=\"active.iconClass\" aria-hidden=\"true\"></i>\r\n            }\r\n          </span>\r\n          <span class=\"fly-topbar__module-label\">{{ active.labelKey | translate }}</span>\r\n        } @else {\r\n          <span class=\"fly-topbar__module-label fly-topbar__module-label--empty\">\r\n            {{ 'ui.nav.selectModule' | translate }}\r\n          </span>\r\n        }\r\n        <svg class=\"fly-topbar__chevron\" width=\"11\" height=\"11\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n             stroke=\"currentColor\" stroke-width=\"2.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n             aria-hidden=\"true\">\r\n          <polyline points=\"6 9 12 15 18 9\" />\r\n        </svg>\r\n      </button>\r\n\r\n      @if (open()) {\r\n        <div class=\"fly-topbar__pop\" role=\"menu\" [attr.aria-label]=\"switchAriaLabel()\">\r\n          <div class=\"fly-topbar__cols\">\r\n            @for (section of sections(); track $index) {\r\n              <div class=\"fly-topbar__col\">\r\n                @if (section.titleKey; as titleKey) {\r\n                  <div class=\"fly-topbar__col-title\">{{ titleKey | translate }}</div>\r\n                }\r\n                @for (mod of section.modules; track mod.key) {\r\n                  <button\r\n                    #row\r\n                    type=\"button\"\r\n                    class=\"fly-topbar__item\"\r\n                    [class.fly-topbar__item--on]=\"mod.key === activeKey()\"\r\n                    role=\"menuitem\"\r\n                    [disabled]=\"mod.disabled ?? false\"\r\n                    [attr.tabindex]=\"indexOf(mod) === focusIndex() ? 0 : -1\"\r\n                    [attr.aria-current]=\"mod.key === activeKey() ? 'page' : null\"\r\n                    (click)=\"select(mod)\"\r\n                    (keydown)=\"onRowKeydown($event)\"\r\n                  >\r\n                    <span class=\"fly-topbar__item-icon\">\r\n                      @if (iconFor(mod.key); as tpl) {\r\n                        <ng-container *ngTemplateOutlet=\"tpl\" />\r\n                      } @else if (mod.iconClass) {\r\n                        <i [class]=\"mod.iconClass\" aria-hidden=\"true\"></i>\r\n                      }\r\n                    </span>\r\n                    <span class=\"fly-topbar__item-main\">\r\n                      <span class=\"fly-topbar__item-label\">{{ mod.labelKey | translate }}</span>\r\n                      @if (mod.descKey; as descKey) {\r\n                        <span class=\"fly-topbar__item-desc\">{{ descKey | translate }}</span>\r\n                      }\r\n                    </span>\r\n                  </button>\r\n                }\r\n              </div>\r\n            }\r\n          </div>\r\n          @if (footerLabel()) {\r\n            <div class=\"fly-topbar__foot\">{{ footerLabel() }}</div>\r\n          }\r\n        </div>\r\n      }\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"fly-topbar__actions\"><ng-content select=\"[app-topbar-actions]\" /></div>\r\n</header>\r\n", styles: [":host{display:block;position:relative;z-index:var(--z-sticky)}.fly-topbar{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);padding:var(--sp-2) var(--sp-3);border-block-end:1px solid var(--line);background:var(--bg-3)}.fly-topbar__lead{display:flex;align-items:center;gap:var(--sp-2);min-inline-size:0}.fly-topbar__brand,.fly-topbar__module{display:inline-flex;align-items:center;gap:var(--sp-2);appearance:none;border:0;background:transparent;cursor:pointer;font:inherit;color:var(--ink);padding:var(--sp-1) var(--sp-2);border-radius:var(--r-md);transition:background var(--t-state)}.fly-topbar__brand:hover,.fly-topbar__module:hover{background:var(--bg-hover)}.fly-topbar__brand:focus-visible,.fly-topbar__module:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.fly-topbar__brand-name{font-weight:var(--fw-semibold);white-space:nowrap}.fly-topbar__brand-mark{display:inline-flex;align-items:center;max-block-size:var(--icon-lg)}.fly-topbar__sep{color:var(--ink-4);-webkit-user-select:none;user-select:none}.fly-topbar__module{min-inline-size:0}.fly-topbar__module--on{background:var(--bg-hover)}.fly-topbar__module-label{font-weight:var(--fw-medium);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fly-topbar__module-label--empty{color:var(--ink-3)}.fly-topbar__module-icon,.fly-topbar__item-icon{display:inline-flex;align-items:center;justify-content:center;inline-size:var(--icon-md);block-size:var(--icon-md);flex:0 0 auto;color:var(--accent)}.fly-topbar__chevron{flex:0 0 auto;color:var(--ink-3);transition:transform var(--t-state)}.fly-topbar__module--on .fly-topbar__chevron{transform:rotate(180deg)}.fly-topbar__anchor{position:relative}.fly-topbar__pop{position:absolute;inset-block-start:calc(100% + var(--sp-1));inset-inline-start:0;z-index:var(--z-overlay);min-inline-size:260px;max-inline-size:min(680px,92vw);padding:var(--sp-3);border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg-2);box-shadow:var(--shadow-panel)}.fly-topbar__cols{display:flex;gap:var(--sp-4);align-items:flex-start}@media(width<=720px){.fly-topbar__cols{flex-direction:column;gap:var(--sp-3)}}.fly-topbar__col{display:flex;flex-direction:column;gap:2px;min-inline-size:220px;flex:1 1 0}.fly-topbar__col-title{font-size:var(--text-2xs);font-weight:var(--fw-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--ink-3);padding:var(--sp-2) var(--sp-2) var(--sp-1)}.fly-topbar__item{display:flex;align-items:flex-start;gap:var(--sp-2);inline-size:100%;text-align:start;appearance:none;border:0;background:transparent;cursor:pointer;font:inherit;color:var(--ink);padding:var(--sp-2);border-radius:var(--r-md);transition:background var(--t-state)}.fly-topbar__item:hover:not(:disabled){background:var(--bg-hover)}.fly-topbar__item:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px}.fly-topbar__item:disabled{opacity:.5;cursor:default}.fly-topbar__item--on{background:var(--accent-soft);color:var(--on-accent-soft);box-shadow:inset 2px 0 0 0 var(--accent)}.fly-topbar__item-main{display:flex;flex-direction:column;gap:1px;min-inline-size:0}.fly-topbar__item-label{font-weight:var(--fw-medium);line-height:1.3}.fly-topbar__item-desc{font-size:var(--text-xs);color:var(--ink-3);line-height:1.35}.fly-topbar__foot{margin-block-start:var(--sp-3);padding-block-start:var(--sp-2);border-block-start:1px solid var(--line-3);font-size:var(--text-2xs);color:var(--ink-4)}.fly-topbar__actions{display:flex;align-items:center;gap:var(--sp-2);flex:0 0 auto}@media(forced-colors:active){.fly-topbar__item--on{border-inline-start:2px solid CanvasText}}@media(prefers-reduced-motion:reduce){.fly-topbar__brand,.fly-topbar__module,.fly-topbar__item,.fly-topbar__chevron{transition:none}}\n"], dependencies: [{ kind: "directive", type: FlyClickOutsideDirective, selector: "[flyClickOutside]", inputs: ["flyClickOutsideEnabled"], outputs: ["flyClickOutside"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FlyAppTopbarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fly-app-topbar', standalone: true, imports: [TranslatePipe, FlyClickOutsideDirective, NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, host: { '(document:keydown.escape)': 'onEscape()' }, template: "<header class=\"fly-topbar\">\r\n  <div class=\"fly-topbar__lead\">\r\n    <button\r\n      type=\"button\"\r\n      class=\"fly-topbar__brand\"\r\n      (click)=\"brandSelected.emit()\"\r\n      [attr.aria-label]=\"brandAriaLabel()\"\r\n    >\r\n      <span class=\"fly-topbar__brand-mark\"><ng-content select=\"[app-topbar-brand]\" /></span>\r\n      @if (brandLabelKey(); as key) {\r\n        <span class=\"fly-topbar__brand-name\">{{ key | translate }}</span>\r\n      }\r\n    </button>\r\n\r\n    @if (activeModule()) {\r\n      <span class=\"fly-topbar__sep\" aria-hidden=\"true\">/</span>\r\n    }\r\n\r\n    <div class=\"fly-topbar__anchor\" (flyClickOutside)=\"close()\" [flyClickOutsideEnabled]=\"open()\">\r\n      <button\r\n        #trigger\r\n        type=\"button\"\r\n        class=\"fly-topbar__module\"\r\n        [class.fly-topbar__module--on]=\"open()\"\r\n        (click)=\"toggle()\"\r\n        (keydown)=\"onTriggerKeydown($event)\"\r\n        aria-haspopup=\"menu\"\r\n        [attr.aria-expanded]=\"open()\"\r\n        [attr.aria-label]=\"switchAriaLabel()\"\r\n      >\r\n        @if (activeModule(); as active) {\r\n          <span class=\"fly-topbar__module-icon\">\r\n            @if (iconFor(active.key); as tpl) {\r\n              <ng-container *ngTemplateOutlet=\"tpl\" />\r\n            } @else if (active.iconClass) {\r\n              <i [class]=\"active.iconClass\" aria-hidden=\"true\"></i>\r\n            }\r\n          </span>\r\n          <span class=\"fly-topbar__module-label\">{{ active.labelKey | translate }}</span>\r\n        } @else {\r\n          <span class=\"fly-topbar__module-label fly-topbar__module-label--empty\">\r\n            {{ 'ui.nav.selectModule' | translate }}\r\n          </span>\r\n        }\r\n        <svg class=\"fly-topbar__chevron\" width=\"11\" height=\"11\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n             stroke=\"currentColor\" stroke-width=\"2.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n             aria-hidden=\"true\">\r\n          <polyline points=\"6 9 12 15 18 9\" />\r\n        </svg>\r\n      </button>\r\n\r\n      @if (open()) {\r\n        <div class=\"fly-topbar__pop\" role=\"menu\" [attr.aria-label]=\"switchAriaLabel()\">\r\n          <div class=\"fly-topbar__cols\">\r\n            @for (section of sections(); track $index) {\r\n              <div class=\"fly-topbar__col\">\r\n                @if (section.titleKey; as titleKey) {\r\n                  <div class=\"fly-topbar__col-title\">{{ titleKey | translate }}</div>\r\n                }\r\n                @for (mod of section.modules; track mod.key) {\r\n                  <button\r\n                    #row\r\n                    type=\"button\"\r\n                    class=\"fly-topbar__item\"\r\n                    [class.fly-topbar__item--on]=\"mod.key === activeKey()\"\r\n                    role=\"menuitem\"\r\n                    [disabled]=\"mod.disabled ?? false\"\r\n                    [attr.tabindex]=\"indexOf(mod) === focusIndex() ? 0 : -1\"\r\n                    [attr.aria-current]=\"mod.key === activeKey() ? 'page' : null\"\r\n                    (click)=\"select(mod)\"\r\n                    (keydown)=\"onRowKeydown($event)\"\r\n                  >\r\n                    <span class=\"fly-topbar__item-icon\">\r\n                      @if (iconFor(mod.key); as tpl) {\r\n                        <ng-container *ngTemplateOutlet=\"tpl\" />\r\n                      } @else if (mod.iconClass) {\r\n                        <i [class]=\"mod.iconClass\" aria-hidden=\"true\"></i>\r\n                      }\r\n                    </span>\r\n                    <span class=\"fly-topbar__item-main\">\r\n                      <span class=\"fly-topbar__item-label\">{{ mod.labelKey | translate }}</span>\r\n                      @if (mod.descKey; as descKey) {\r\n                        <span class=\"fly-topbar__item-desc\">{{ descKey | translate }}</span>\r\n                      }\r\n                    </span>\r\n                  </button>\r\n                }\r\n              </div>\r\n            }\r\n          </div>\r\n          @if (footerLabel()) {\r\n            <div class=\"fly-topbar__foot\">{{ footerLabel() }}</div>\r\n          }\r\n        </div>\r\n      }\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"fly-topbar__actions\"><ng-content select=\"[app-topbar-actions]\" /></div>\r\n</header>\r\n", styles: [":host{display:block;position:relative;z-index:var(--z-sticky)}.fly-topbar{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);padding:var(--sp-2) var(--sp-3);border-block-end:1px solid var(--line);background:var(--bg-3)}.fly-topbar__lead{display:flex;align-items:center;gap:var(--sp-2);min-inline-size:0}.fly-topbar__brand,.fly-topbar__module{display:inline-flex;align-items:center;gap:var(--sp-2);appearance:none;border:0;background:transparent;cursor:pointer;font:inherit;color:var(--ink);padding:var(--sp-1) var(--sp-2);border-radius:var(--r-md);transition:background var(--t-state)}.fly-topbar__brand:hover,.fly-topbar__module:hover{background:var(--bg-hover)}.fly-topbar__brand:focus-visible,.fly-topbar__module:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.fly-topbar__brand-name{font-weight:var(--fw-semibold);white-space:nowrap}.fly-topbar__brand-mark{display:inline-flex;align-items:center;max-block-size:var(--icon-lg)}.fly-topbar__sep{color:var(--ink-4);-webkit-user-select:none;user-select:none}.fly-topbar__module{min-inline-size:0}.fly-topbar__module--on{background:var(--bg-hover)}.fly-topbar__module-label{font-weight:var(--fw-medium);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fly-topbar__module-label--empty{color:var(--ink-3)}.fly-topbar__module-icon,.fly-topbar__item-icon{display:inline-flex;align-items:center;justify-content:center;inline-size:var(--icon-md);block-size:var(--icon-md);flex:0 0 auto;color:var(--accent)}.fly-topbar__chevron{flex:0 0 auto;color:var(--ink-3);transition:transform var(--t-state)}.fly-topbar__module--on .fly-topbar__chevron{transform:rotate(180deg)}.fly-topbar__anchor{position:relative}.fly-topbar__pop{position:absolute;inset-block-start:calc(100% + var(--sp-1));inset-inline-start:0;z-index:var(--z-overlay);min-inline-size:260px;max-inline-size:min(680px,92vw);padding:var(--sp-3);border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg-2);box-shadow:var(--shadow-panel)}.fly-topbar__cols{display:flex;gap:var(--sp-4);align-items:flex-start}@media(width<=720px){.fly-topbar__cols{flex-direction:column;gap:var(--sp-3)}}.fly-topbar__col{display:flex;flex-direction:column;gap:2px;min-inline-size:220px;flex:1 1 0}.fly-topbar__col-title{font-size:var(--text-2xs);font-weight:var(--fw-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--ink-3);padding:var(--sp-2) var(--sp-2) var(--sp-1)}.fly-topbar__item{display:flex;align-items:flex-start;gap:var(--sp-2);inline-size:100%;text-align:start;appearance:none;border:0;background:transparent;cursor:pointer;font:inherit;color:var(--ink);padding:var(--sp-2);border-radius:var(--r-md);transition:background var(--t-state)}.fly-topbar__item:hover:not(:disabled){background:var(--bg-hover)}.fly-topbar__item:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px}.fly-topbar__item:disabled{opacity:.5;cursor:default}.fly-topbar__item--on{background:var(--accent-soft);color:var(--on-accent-soft);box-shadow:inset 2px 0 0 0 var(--accent)}.fly-topbar__item-main{display:flex;flex-direction:column;gap:1px;min-inline-size:0}.fly-topbar__item-label{font-weight:var(--fw-medium);line-height:1.3}.fly-topbar__item-desc{font-size:var(--text-xs);color:var(--ink-3);line-height:1.35}.fly-topbar__foot{margin-block-start:var(--sp-3);padding-block-start:var(--sp-2);border-block-start:1px solid var(--line-3);font-size:var(--text-2xs);color:var(--ink-4)}.fly-topbar__actions{display:flex;align-items:center;gap:var(--sp-2);flex:0 0 auto}@media(forced-colors:active){.fly-topbar__item--on{border-inline-start:2px solid CanvasText}}@media(prefers-reduced-motion:reduce){.fly-topbar__brand,.fly-topbar__module,.fly-topbar__item,.fly-topbar__chevron{transition:none}}\n"] }]
+            args: [{ selector: 'fly-app-topbar', standalone: true, imports: [TranslatePipe, FlyClickOutsideDirective, NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, host: { '(document:keydown.escape)': 'onEscape()' }, template: "<header class=\"fly-topbar\">\r\n  <div class=\"fly-topbar__lead\">\r\n    <button\r\n      type=\"button\"\r\n      class=\"fly-topbar__brand\"\r\n      (click)=\"brandSelected.emit()\"\r\n      [attr.aria-label]=\"brandAriaLabel()\"\r\n    >\r\n      <span class=\"fly-topbar__brand-mark\"><ng-content select=\"[app-topbar-brand]\" /></span>\r\n      @if (brandLabelKey(); as key) {\r\n        <span class=\"fly-topbar__brand-name\">{{ key | translate }}</span>\r\n      }\r\n    </button>\r\n\r\n    @if (activeModule()) {\r\n      <span class=\"fly-topbar__sep\" aria-hidden=\"true\">/</span>\r\n    }\r\n\r\n    <div class=\"fly-topbar__anchor\" (flyClickOutside)=\"close()\" [flyClickOutsideEnabled]=\"open()\">\r\n      <button\r\n        #trigger\r\n        type=\"button\"\r\n        class=\"fly-topbar__module\"\r\n        [class.fly-topbar__module--on]=\"open()\"\r\n        (click)=\"toggle()\"\r\n        (keydown)=\"onTriggerKeydown($event)\"\r\n        aria-haspopup=\"menu\"\r\n        [attr.aria-expanded]=\"open()\"\r\n        [attr.aria-label]=\"triggerAriaLabel()\"\r\n      >\r\n        @if (activeModule(); as active) {\r\n          <span class=\"fly-topbar__module-icon\">\r\n            @if (iconFor(active.key); as tpl) {\r\n              <ng-container *ngTemplateOutlet=\"tpl\" />\r\n            } @else if (active.iconClass) {\r\n              <i [class]=\"active.iconClass\" aria-hidden=\"true\"></i>\r\n            }\r\n          </span>\r\n          <span class=\"fly-topbar__module-label\">{{ active.labelKey | translate }}</span>\r\n        } @else {\r\n          <span class=\"fly-topbar__module-label fly-topbar__module-label--empty\">\r\n            {{ 'ui.nav.selectModule' | translate }}\r\n          </span>\r\n        }\r\n        <svg class=\"fly-topbar__chevron\" width=\"11\" height=\"11\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n             stroke=\"currentColor\" stroke-width=\"2.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n             aria-hidden=\"true\">\r\n          <polyline points=\"6 9 12 15 18 9\" />\r\n        </svg>\r\n      </button>\r\n\r\n      @if (open()) {\r\n        <div class=\"fly-topbar__pop\" role=\"menu\" [attr.aria-label]=\"switchAriaLabel()\">\r\n          <div class=\"fly-topbar__cols\">\r\n            @for (section of sections(); track $index) {\r\n              <div class=\"fly-topbar__col\">\r\n                @if (section.titleKey; as titleKey) {\r\n                  <div class=\"fly-topbar__col-title\">{{ titleKey | translate }}</div>\r\n                }\r\n                @for (mod of section.modules; track mod.key) {\r\n                  <button\r\n                    #row\r\n                    type=\"button\"\r\n                    class=\"fly-topbar__item\"\r\n                    [class.fly-topbar__item--on]=\"mod.key === activeKey()\"\r\n                    role=\"menuitem\"\r\n                    [disabled]=\"mod.disabled ?? false\"\r\n                    [attr.tabindex]=\"indexOf(mod) === focusIndex() ? 0 : -1\"\r\n                    [attr.aria-current]=\"mod.key === activeKey() ? 'page' : null\"\r\n                    (click)=\"select(mod)\"\r\n                    (keydown)=\"onRowKeydown($event)\"\r\n                  >\r\n                    <span class=\"fly-topbar__item-icon\">\r\n                      @if (iconFor(mod.key); as tpl) {\r\n                        <ng-container *ngTemplateOutlet=\"tpl\" />\r\n                      } @else if (mod.iconClass) {\r\n                        <i [class]=\"mod.iconClass\" aria-hidden=\"true\"></i>\r\n                      }\r\n                    </span>\r\n                    <span class=\"fly-topbar__item-main\">\r\n                      <span class=\"fly-topbar__item-label\">{{ mod.labelKey | translate }}</span>\r\n                      @if (mod.descKey; as descKey) {\r\n                        <span class=\"fly-topbar__item-desc\">{{ descKey | translate }}</span>\r\n                      }\r\n                    </span>\r\n                  </button>\r\n                }\r\n              </div>\r\n            }\r\n          </div>\r\n          @if (footerLabel()) {\r\n            <div class=\"fly-topbar__foot\">{{ footerLabel() }}</div>\r\n          }\r\n        </div>\r\n      }\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"fly-topbar__actions\"><ng-content select=\"[app-topbar-actions]\" /></div>\r\n</header>\r\n", styles: [":host{display:block;position:relative;z-index:var(--z-sticky)}.fly-topbar{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);padding:var(--sp-2) var(--sp-3);border-block-end:1px solid var(--line);background:var(--bg-3)}.fly-topbar__lead{display:flex;align-items:center;gap:var(--sp-2);min-inline-size:0}.fly-topbar__brand,.fly-topbar__module{display:inline-flex;align-items:center;gap:var(--sp-2);appearance:none;border:0;background:transparent;cursor:pointer;font:inherit;color:var(--ink);padding:var(--sp-1) var(--sp-2);border-radius:var(--r-md);transition:background var(--t-state)}.fly-topbar__brand:hover,.fly-topbar__module:hover{background:var(--bg-hover)}.fly-topbar__brand:focus-visible,.fly-topbar__module:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.fly-topbar__brand-name{font-weight:var(--fw-semibold);white-space:nowrap}.fly-topbar__brand-mark{display:inline-flex;align-items:center;max-block-size:var(--icon-lg)}.fly-topbar__sep{color:var(--ink-4);-webkit-user-select:none;user-select:none}.fly-topbar__module{min-inline-size:0}.fly-topbar__module--on{background:var(--bg-hover)}.fly-topbar__module-label{font-weight:var(--fw-medium);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fly-topbar__module-label--empty{color:var(--ink-3)}.fly-topbar__module-icon,.fly-topbar__item-icon{display:inline-flex;align-items:center;justify-content:center;inline-size:var(--icon-md);block-size:var(--icon-md);flex:0 0 auto;color:var(--accent)}.fly-topbar__chevron{flex:0 0 auto;color:var(--ink-3);transition:transform var(--t-state)}.fly-topbar__module--on .fly-topbar__chevron{transform:rotate(180deg)}.fly-topbar__anchor{position:relative}.fly-topbar__pop{position:absolute;inset-block-start:calc(100% + var(--sp-1));inset-inline-start:0;z-index:var(--z-overlay);min-inline-size:260px;max-inline-size:min(680px,92vw);padding:var(--sp-3);border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg-2);box-shadow:var(--shadow-panel)}.fly-topbar__cols{display:flex;gap:var(--sp-4);align-items:flex-start}@media(width<=720px){.fly-topbar__cols{flex-direction:column;gap:var(--sp-3)}}.fly-topbar__col{display:flex;flex-direction:column;gap:2px;min-inline-size:220px;flex:1 1 0}.fly-topbar__col-title{font-size:var(--text-2xs);font-weight:var(--fw-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--ink-3);padding:var(--sp-2) var(--sp-2) var(--sp-1)}.fly-topbar__item{display:flex;align-items:flex-start;gap:var(--sp-2);inline-size:100%;text-align:start;appearance:none;border:0;background:transparent;cursor:pointer;font:inherit;color:var(--ink);padding:var(--sp-2);border-radius:var(--r-md);transition:background var(--t-state)}.fly-topbar__item:hover:not(:disabled){background:var(--bg-hover)}.fly-topbar__item:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px}.fly-topbar__item:disabled{opacity:.5;cursor:default}.fly-topbar__item--on{background:var(--accent-soft);color:var(--on-accent-soft);box-shadow:inset 2px 0 0 0 var(--accent)}.fly-topbar__item-main{display:flex;flex-direction:column;gap:1px;min-inline-size:0}.fly-topbar__item-label{font-weight:var(--fw-medium);line-height:1.3}.fly-topbar__item-desc{font-size:var(--text-xs);color:var(--ink-3);line-height:1.35}.fly-topbar__foot{margin-block-start:var(--sp-3);padding-block-start:var(--sp-2);border-block-start:1px solid var(--line-3);font-size:var(--text-2xs);color:var(--ink-4)}.fly-topbar__actions{display:flex;align-items:center;gap:var(--sp-2);flex:0 0 auto}@media(forced-colors:active){.fly-topbar__item--on{border-inline-start:2px solid CanvasText}}@media(prefers-reduced-motion:reduce){.fly-topbar__brand,.fly-topbar__module,.fly-topbar__item,.fly-topbar__chevron{transition:none}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { brandLabelKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "brandLabelKey", required: false }] }], sections: [{ type: i0.Input, args: [{ isSignal: true, alias: "sections", required: false }] }], activeKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeKey", required: false }] }], footerLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "footerLabel", required: false }] }], moduleSelected: [{ type: i0.Output, args: ["moduleSelected"] }], brandSelected: [{ type: i0.Output, args: ["brandSelected"] }], icons: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => FlyModuleIconDirective), { isSignal: true }] }], rows: [{ type: i0.ViewChildren, args: ['row', { isSignal: true }] }], trigger: [{ type: i0.ViewChildren, args: ['trigger', { isSignal: true }] }] } });
 
 /**
@@ -24450,5 +24839,5 @@ const AUDIENCE_ERROR_CODES = {
  * Generated bundle index. Do not edit.
  */
 
-export { AGENT_DRAG_MIME, AGENT_PAYLOAD_VERSION, APP_LOOKUP, AUDIENCE_ERROR_CODES, AUDIENCE_LIMITS, AUDIENCE_PRESETS, AUDIENCE_TERM_KINDS, AgentActionBus, AgentActionUnsupportedDispatchError, AgentCommandRegistry, AgentDropRegistry, AgentFlightAnimator, AgentLookupRegistry, AgentPayloadOversizeError, AudienceBuilderComponent, AuthService, BilingualFieldComponent, CRON_MODES, CRON_WEEKDAYS, ContextMenuComponent, DEFAULT_AGENT_PAYLOAD_LIMITS, DEFAULT_FLY_THEME_MODE, DS_BASELINE_LOCALES, DashboardKpiComponent, DialogResult, EntityLookupComponent, FLYOS_LAUNCH_EVENT, FLYOS_LAUNCH_REQUEST_EVENT, FLYOS_REMOTE_ROUTE_EVENT, FLY_ACCENT_PROPERTY, FLY_ADMIN_ROLES, FLY_CHUNK_RELOAD_FLAG, FLY_COMPACT_THRESHOLD, FLY_COUNTRIES, FLY_EMOJI_BY_ID, FLY_EMOJI_CATEGORIES, FLY_EMOJI_CATEGORY_BY_ID, FLY_EMOJI_DEFAULT_CATEGORIES, FLY_EMOJI_PACK, FLY_EMOJI_PACK_MISSING_MESSAGE, FLY_EMOJI_PREVIEW_COUNT, FLY_EMPTY_VALUE, FLY_LOCALE_CATALOG, FLY_MAGIC_BAR_EVENT, FLY_MAGIC_BAR_ICONS, FLY_MAGIC_BAR_STORE_KEY, FLY_NF_CACHE_HEAL_FLAG, FLY_RELOAD_DEBOUNCE_MS, FLY_RELOAD_REARM_MS, FLY_REMOTE_BASE_PATH, FLY_REMOTE_CONTEXT_EVENT, FLY_REMOTE_CONTEXT_STORE_KEY, FLY_REMOTE_ROUTES, FLY_SCAN_PENDING_DEFAULT_DELAY_MS, FLY_SCAN_PENDING_MAX_RETRIES, FLY_SCAN_PENDING_STATUS, FLY_SEARCH_DEBOUNCE_MS, FLY_SKIN_TONES, FLY_STANDALONE_AUTH_CONFIG, FLY_THEME_MODE_IDS, FLY_VIEWPORT_IS_MOBILE, FLY_WINDOW_HELP_HINT_EVENT, FLY_WINDOW_PAGE_TITLE_EVENT, FlyAchievementProgressComponent, FlyActionMenuComponent, FlyActionStackComponent, FlyAgentDraggableDirective, FlyAnimatedEmojiComponent, FlyAppHomeComponent, FlyAppTopbarComponent, FlyAuthLiveRefresh, FlyBadgeWallComponent, FlyBlockUiComponent, FlyBreadcrumbComponent, FlyButtonComponent, FlyBytesPipe, FlyCaptchaComponent, FlyCardActionsComponent, FlyCardBodyComponent, FlyCardComponent, FlyCardFooterComponent, FlyCardGridComponent, FlyCardMediaComponent, FlyCardMetaComponent, FlyCardStatusComponent, FlyCardTitleComponent, FlyCellDirective, FlyCheckboxComponent, FlyChipComponent, FlyChunkReloadErrorHandler, FlyClickOutsideDirective, FlyCollapsibleComponent, FlyCommentThreadComponent, FlyCompactNumberPipe, FlyConfirmDialogComponent, FlyControlDirective, FlyCronBuilderComponent, FlyCurrencySelectorComponent, FlyDataTableComponent, FlyDatePipe, FlyDateTimePipe, FlyDebouncer, FlyDecimalNumberPipe, FlyDetailCardComponent, FlyDetailShellComponent, FlyDrawerComponent, FlyDurationPipe, FlyDynamicFormComponent, FlyEmojiPickerComponent, FlyFieldComponent, FlyFileDownloadService, FlyFileUploadComponent, FlyFilterPanelComponent, FlyFormBannerComponent, FlyFormFooterComponent, FlyFormGridComponent, FlyFormSectionComponent, FlyFullNumberPipe, FlyGanttComponent, FlyHubClient, FlyIconButtonComponent, FlyIfAdminDirective, FlyIfRoleDirective, FlyImageUploadComponent, FlyLeaderboardComponent, FlyMagicActionsComponent, FlyMetaListComponent, FlyModalComponent, FlyModerationQueueComponent, FlyModuleIconDirective, FlyPaginationComponent, FlyPeoplePickerComponent, FlyPointsTierComponent, FlyProgressComponent, FlyRelativeTimePipe, FlyRemoteContextService, FlyRemoteRouter, FlyRemoteRouterOutletComponent, FlySearchInputComponent, FlySectionHeaderComponent, FlySecureSrcDirective, FlySegmentedComponent, FlySelectComponent, FlySkeletonComponent, FlySliderComponent, FlySparklineComponent, FlySpinnerComponent, FlyStandaloneAuthCallbackComponent, FlyStandaloneAuthService, FlyStateMessageComponent, FlyDynamicFormComponent as FlySurveyFormComponent, FlyTabComponent, FlyTabsComponent, FlyTagsInputComponent, FlyThemeService, FlyTimePipe, FlyToastService, FlyToggleComponent, FlyTooltipDirective, FlyTreeNavComponent, FlyTypeaheadComponent, FlyUserDirectoryService, FlyWindowHelpService, FlyWindowTitleService, FlyosPendingLaunchesGlobalKey, FlyosShellHandlesLaunchRequestsGlobalKey, FlyosShellOwnsHistoryGlobalKey, GANTT_ZOOMS, I18nService, LAUNCH_CONTEXT, MAGIC_BAR_SEARCH_WIDTH_DEFAULT, MAGIC_BAR_SEARCH_WIDTH_MAX, MAGIC_BAR_SEARCH_WIDTH_MIN, MagicBarRegistry, MessageBoxButtons, MessageBoxComponent, MessageBoxIcon, MessageBoxService, MockAuthService, NOVA_PRIORITY_TONE, NOVA_STATUS_TONE, NOVA_TONE_FALLBACK, OverlayStack, PRESENCE_COLORS, PageHeaderComponent, RTL_LOCALE_SET, SHARE_ORG_CHART_SYSTEM_KEY_APPS, SHARE_ORG_CHART_SYSTEM_KEY_DEFAULT, SHARE_PANEL_DEFAULT_FILE_LEVELS, STATE_DEFAULT_ICONS, STATE_DEFAULT_MESSAGE_KEYS, STEP_UP_CODE, STEP_UP_REAUTH_HANDLER, STEP_UP_RETURN_KEY, SUPPORTED_AGENT_PAYLOAD_VERSIONS, SharePanelComponent, SourceAppResolver, StandaloneWindowManagerService, StatusBadgeComponent, StepUpService, ToastHostComponent, TranslatePipe, WINDOW_DATA, WINDOW_HELP_HINT, WindowManagerService, applySkinTone, applySuggestion, ariaSort, buildCron, canConfirm, canGoNext, canGoPrev, captureFocus, clampMagicBarSearchWidth, clampPage, clampSliderValue, connectRemoteLaunch, enterActivatesNatively, filterGroup, filterSuggestions, findLocaleByDialect, findLocaleByPrefix, firstEnabledIndex, firstModuleIndex, flattenModules, flyAdminGuard, flyApiErrorMessage, flyCaptchaBase64Utf8, flyCaptchaBuildToken, flyCaptchaSha256Hex, flyCompactNumber, flyDebounced, flyDecimalNumber, flyDownloadBlob, flyDuration, flyEmojiFor, flyEmojiIsTonable, flyEmojiPackUrl, flyExportFileName, flyFirstEnabledIndex, flyFormatBytes, flyFormatDate, flyFormatDateTime, flyFormatTime, flyFullNumber, flyNextEnabledIndex, flyNextSegmentIndex, flyRelativeTime, flyResolveActiveTab, flyRoleGuard, flyScanPendingDelayMs, flyScanRetry, flySignedCompact, flySkinToneLabelKey, flyStandaloneAuthGuard, flyStandaloneAuthInterceptor, flyToDateOnly, flyToPage, flyUnwrap, flyUnwrapLenient, hasAnyRoleIn, healNativeFederationCacheOnce, initialExpanded, isAccentColor, isChunkLoadError, isFlyAuthStorePopulated, isNativeFederationCacheError, isRtlLocale, isRtlLocaleEntry, isValidCron, isValidSingleField, loadRemoteStyles, magicBarOwnerKey, magicBarSearchText, matchFlyRoutePattern, nextEnabledIndex, nextModuleIndex, nextSegmentIndex, nextSort, normalizeFlyTheme, normalizeRoles, novaPriorityToneVar, novaStatusToneVar, overlayStack, parseCron, parseStepUpChallenge, parseTags, presenceColorFor, printConsoleSecurityWarning, provideFlyChunkReloadRecovery, provideFlyEmojiPack, provideFlyStandaloneAuth, reloadOnceForChunkError, requestAppLaunch, resolveActiveModule, resolveActiveSection, resolveActiveTab, resolveCellValue, resolveStateIcon, resolveStateMessageKey, restoreFocus, sameTags, sectionHintKey, sectionLayout, sliderTrackGradient, sparklinePath, sparklinePoints, stepUpInterceptor, stepUpReturnKey, trimAgentPayload, trimAgentString, unloadRemoteStyles, utf8ByteLength, validateAgentPayload, warnIfEmbeddedSessionMissing };
+export { AGENT_DRAG_MIME, AGENT_PAYLOAD_VERSION, APP_LOOKUP, AUDIENCE_ERROR_CODES, AUDIENCE_LIMITS, AUDIENCE_PRESETS, AUDIENCE_TERM_KINDS, AgentActionBus, AgentActionUnsupportedDispatchError, AgentCommandRegistry, AgentDropRegistry, AgentFlightAnimator, AgentLookupRegistry, AgentPayloadOversizeError, AudienceBuilderComponent, AuthService, BilingualFieldComponent, CRON_MODES, CRON_WEEKDAYS, ContextMenuComponent, DEFAULT_AGENT_PAYLOAD_LIMITS, DEFAULT_FLY_THEME_MODE, DS_BASELINE_LOCALES, DashboardKpiComponent, DialogResult, ENTITY_LINK_LAUNCHER, EntityLookupComponent, FLYOS_LAUNCH_EVENT, FLYOS_LAUNCH_REQUEST_EVENT, FLYOS_REMOTE_ROUTE_EVENT, FLY_ACCENT_PROPERTY, FLY_ADMIN_ROLES, FLY_CHUNK_RELOAD_FLAG, FLY_COMPACT_THRESHOLD, FLY_COUNTRIES, FLY_EMOJI_BY_ID, FLY_EMOJI_CATEGORIES, FLY_EMOJI_CATEGORY_BY_ID, FLY_EMOJI_DEFAULT_CATEGORIES, FLY_EMOJI_PACK, FLY_EMOJI_PACK_MISSING_MESSAGE, FLY_EMOJI_PREVIEW_COUNT, FLY_EMPTY_VALUE, FLY_LOCALE_CATALOG, FLY_MAGIC_BAR_EVENT, FLY_MAGIC_BAR_ICONS, FLY_MAGIC_BAR_STORE_KEY, FLY_NF_CACHE_HEAL_FLAG, FLY_RELOAD_DEBOUNCE_MS, FLY_RELOAD_REARM_MS, FLY_REMOTE_BASE_PATH, FLY_REMOTE_CONTEXT_EVENT, FLY_REMOTE_CONTEXT_STORE_KEY, FLY_REMOTE_ROUTES, FLY_SCAN_PENDING_DEFAULT_DELAY_MS, FLY_SCAN_PENDING_MAX_RETRIES, FLY_SCAN_PENDING_STATUS, FLY_SEARCH_DEBOUNCE_MS, FLY_SKIN_TONES, FLY_STANDALONE_AUTH_CONFIG, FLY_THEME_MODE_IDS, FLY_VIEWPORT_IS_MOBILE, FLY_WINDOW_HELP_HINT_EVENT, FLY_WINDOW_PAGE_TITLE_EVENT, FlyAchievementProgressComponent, FlyActionMenuComponent, FlyActionStackComponent, FlyAgentDraggableDirective, FlyAnimatedEmojiComponent, FlyAppHomeComponent, FlyAppTopbarComponent, FlyAuthLiveRefresh, FlyBadgeWallComponent, FlyBlockUiComponent, FlyBreadcrumbComponent, FlyButtonComponent, FlyBytesPipe, FlyCaptchaComponent, FlyCardActionsComponent, FlyCardBodyComponent, FlyCardComponent, FlyCardFooterComponent, FlyCardGridComponent, FlyCardMediaComponent, FlyCardMetaComponent, FlyCardStatusComponent, FlyCardTitleComponent, FlyCellDirective, FlyCheckboxComponent, FlyChipComponent, FlyChunkReloadErrorHandler, FlyClickOutsideDirective, FlyCollapsibleComponent, FlyCommentThreadComponent, FlyCompactNumberPipe, FlyConfirmDialogComponent, FlyControlDirective, FlyCronBuilderComponent, FlyCurrencySelectorComponent, FlyDataTableComponent, FlyDatePipe, FlyDateTimePipe, FlyDebouncer, FlyDecimalNumberPipe, FlyDetailCardComponent, FlyDetailShellComponent, FlyDrawerComponent, FlyDurationPipe, FlyDynamicFormComponent, FlyEmojiPickerComponent, FlyFieldComponent, FlyFileDownloadService, FlyFileUploadComponent, FlyFilterPanelComponent, FlyFormBannerComponent, FlyFormFooterComponent, FlyFormGridComponent, FlyFormSectionComponent, FlyFullNumberPipe, FlyGanttComponent, FlyHubClient, FlyIconButtonComponent, FlyIfAdminDirective, FlyIfRoleDirective, FlyImageUploadComponent, FlyLeaderboardComponent, FlyMagicActionsComponent, FlyMetaListComponent, FlyModalComponent, FlyModerationQueueComponent, FlyModuleIconDirective, FlyMoneyPipe, FlyPaginationComponent, FlyPeoplePickerComponent, FlyPointsTierComponent, FlyProgressComponent, FlyRelativeTimePipe, FlyRemoteContextService, FlyRemoteRouter, FlyRemoteRouterOutletComponent, FlySearchInputComponent, FlySectionHeaderComponent, FlySecureSrcDirective, FlySegmentedComponent, FlySelectComponent, FlySkeletonComponent, FlySliderComponent, FlySparklineComponent, FlySpinnerComponent, FlyStandaloneAuthCallbackComponent, FlyStandaloneAuthService, FlyStateMessageComponent, FlyDynamicFormComponent as FlySurveyFormComponent, FlyTabComponent, FlyTabsComponent, FlyTagsInputComponent, FlyThemeService, FlyTimePipe, FlyToastService, FlyToggleComponent, FlyTooltipDirective, FlyTreeNavComponent, FlyTypeaheadComponent, FlyUserDirectoryService, FlyWindowHelpService, FlyWindowTitleService, FlyosPendingLaunchesGlobalKey, FlyosShellHandlesLaunchRequestsGlobalKey, FlyosShellOwnsHistoryGlobalKey, GANTT_ZOOMS, I18nService, LAUNCH_CONTEXT, MAGIC_BAR_SEARCH_WIDTH_DEFAULT, MAGIC_BAR_SEARCH_WIDTH_MAX, MAGIC_BAR_SEARCH_WIDTH_MIN, MagicBarRegistry, MessageBoxButtons, MessageBoxComponent, MessageBoxIcon, MessageBoxService, MockAuthService, NOVA_PRIORITY_TONE, NOVA_STATUS_TONE, NOVA_TONE_FALLBACK, OverlayStack, PRESENCE_COLORS, PageHeaderComponent, RTL_LOCALE_SET, SHARE_ORG_CHART_SYSTEM_KEY_APPS, SHARE_ORG_CHART_SYSTEM_KEY_DEFAULT, SHARE_PANEL_DEFAULT_FILE_LEVELS, STATE_DEFAULT_ICONS, STATE_DEFAULT_MESSAGE_KEYS, STEP_UP_CODE, STEP_UP_REAUTH_HANDLER, STEP_UP_RETURN_KEY, SUPPORTED_AGENT_PAYLOAD_VERSIONS, SharePanelComponent, SourceAppResolver, StandaloneWindowManagerService, StatusBadgeComponent, StepUpService, ToastHostComponent, TranslatePipe, WINDOW_DATA, WINDOW_HELP_HINT, WindowManagerService, applySkinTone, applySuggestion, ariaSort, buildCron, canConfirm, canGoNext, canGoPrev, captureFocus, clampMagicBarSearchWidth, clampPage, clampSliderValue, connectRemoteLaunch, enterActivatesNatively, filterGroup, filterSuggestions, findLocaleByDialect, findLocaleByPrefix, firstEnabledIndex, firstModuleIndex, flattenModules, flyAdminGuard, flyApiErrorMessage, flyCaptchaBase64Utf8, flyCaptchaBuildToken, flyCaptchaSha256Hex, flyCompactNumber, flyDebounced, flyDecimalNumber, flyDownloadBlob, flyDuration, flyEmojiFor, flyEmojiIsTonable, flyEmojiPackUrl, flyExportFileName, flyFirstEnabledIndex, flyFormatBytes, flyFormatDate, flyFormatDateTime, flyFormatMoney, flyFormatTime, flyFullNumber, flyNextEnabledIndex, flyNextSegmentIndex, flyRelativeTime, flyResolveActiveTab, flyRoleGuard, flyScanPendingDelayMs, flyScanRetry, flySignedCompact, flySkinToneLabelKey, flyStandaloneAuthGuard, flyStandaloneAuthInterceptor, flyToDateOnly, flyToPage, flyUnwrap, flyUnwrapLenient, hasAnyRoleIn, healNativeFederationCacheOnce, initialExpanded, isAccentColor, isChunkLoadError, isFlyAuthStorePopulated, isNativeFederationCacheError, isRtlLocale, isRtlLocaleEntry, isValidCron, isValidSingleField, loadRemoteStyles, magicBarOwnerKey, magicBarSearchText, matchFlyRoutePattern, nextEnabledIndex, nextModuleIndex, nextSegmentIndex, nextSort, normalizeFlyTheme, normalizeRoles, novaPriorityToneVar, novaStatusToneVar, overlayStack, parseCron, parseStepUpChallenge, parseTags, prefetchRemoteStyles, presenceColorFor, printConsoleSecurityWarning, provideFlyChunkReloadRecovery, provideFlyEmojiPack, provideFlyStandaloneAuth, reloadOnceForChunkError, requestAppLaunch, resolveActiveModule, resolveActiveSection, resolveActiveTab, resolveCellValue, resolveStateIcon, resolveStateMessageKey, restoreFocus, sameTags, sectionHintKey, sectionLayout, sliderTrackGradient, sparklinePath, sparklinePoints, stepUpInterceptor, stepUpReturnKey, trimAgentPayload, trimAgentString, unloadRemoteStyles, utf8ByteLength, validateAgentPayload, warnIfEmbeddedSessionMissing };
 //# sourceMappingURL=flyos-design-system.mjs.map