@filip.mazev/blocks 1.2.38 → 1.4.3

package/fesm2022/filip.mazev-blocks-core.mjs

@@ -1,761 +1,1121 @@
-import * as i0 from '@angular/core';
-import { inject, PLATFORM_ID, Injectable, NgZone, signal, computed, effect, input, isDevMode, Directive, InjectionToken } from '@angular/core';
-import { DOCUMENT, isPlatformBrowser } from '@angular/common';
-import { fromEvent } from 'rxjs';
-import { debounceTime, map, distinctUntilChanged } from 'rxjs/operators';
-import { toObservable } from '@angular/core/rxjs-interop';
-import { Overlay, ConnectionPositionPair } from '@angular/cdk/overlay';
-import { NgControl, Validators } from '@angular/forms';
-
+import * as i0 from "@angular/core";
+import { DOCUMENT, DestroyRef, Directive, Injectable, InjectionToken, NgZone, PLATFORM_ID, computed, effect, inject, input, isDevMode, signal } from "@angular/core";
+import { DOCUMENT as DOCUMENT$1, isPlatformBrowser } from "@angular/common";
+import { fromEvent } from "rxjs";
+import { debounceTime, distinctUntilChanged, map } from "rxjs/operators";
+import { toObservable } from "@angular/core/rxjs-interop";
+import { configureAppearance } from "@filip.mazev/blocks/effects/runtime";
+import { ConnectionPositionPair, Overlay } from "@angular/cdk/overlay";
+import { NgControl, Validators } from "@angular/forms";
 var DesktopOS;
-(function (DesktopOS) {
-    DesktopOS["Linux"] = "linux";
-    DesktopOS["MacOS"] = "mac_os";
-    DesktopOS["Unix"] = "unix";
-    DesktopOS["Unknown"] = "unknown";
-    DesktopOS["Windows"] = "windows";
+(function(DesktopOS) {
+	DesktopOS["Linux"] = "linux";
+	DesktopOS["MacOS"] = "mac_os";
+	DesktopOS["Unix"] = "unix";
+	DesktopOS["Unknown"] = "unknown";
+	DesktopOS["Windows"] = "windows";
 })(DesktopOS || (DesktopOS = {}));
-
 var MobileOS;
-(function (MobileOS) {
-    MobileOS["Android"] = "android";
-    MobileOS["iOS"] = "ios";
-    MobileOS["Unknown"] = "unknown";
-    MobileOS["WindowsPhone"] = "Windows Phone";
+(function(MobileOS) {
+	MobileOS["Android"] = "android";
+	MobileOS["iOS"] = "ios";
+	MobileOS["Unknown"] = "unknown";
+	MobileOS["WindowsPhone"] = "Windows Phone";
 })(MobileOS || (MobileOS = {}));
-
-class DeviceTypeService {
-    document = inject(DOCUMENT);
-    platformId = inject(PLATFORM_ID);
-    isBrowser = isPlatformBrowser(this.platformId);
-    screenOrientation = 'portrait-primary';
-    constructor() {
-        if (this.isBrowser) {
-            const win = this.document.defaultView;
-            const screenObj = win?.screen;
-            this.screenOrientation =
-                (screenObj?.orientation || {}).type ??
-                    screenObj?.mozOrientation ??
-                    screenObj?.msOrientation ??
-                    (!screenObj?.orientation && win?.matchMedia('(orientation: portrait)').matches ? 'portrait-primary' : 'landscape-primary');
-            if (screenObj?.orientation) {
-                screenObj.orientation.addEventListener('change', (ev) => {
-                    const orientation = ev.target;
-                    if (orientation?.type) {
-                        this.screenOrientation = orientation.type;
-                    }
-                });
-            }
-        }
-    }
-    get userAgent() {
-        if (!this.isBrowser)
-            return '';
-        const win = this.document.defaultView;
-        return win?.navigator?.userAgent || win?.navigator?.vendor || win?.opera || '';
-    }
-    get isDesktopDevice() {
-        return !this.isMobileDevice() && !this.isTabletDevice();
-    }
-    isLandscapeOrientation() {
-        return ['landscape-primary', 'landscape-secondary'].includes(this.screenOrientation);
-    }
-    isPortraitOrientation() {
-        return ['portrait-primary', 'portrait-secondary'].includes(this.screenOrientation);
-    }
-    getDeviceState() {
-        const isMobile = this.isMobileDevice();
-        const isTablet = this.isTabletDevice();
-        const isDesktop = this.isDesktopDevice;
-        const mobileOS = this.getMobileOS();
-        const desktopOS = this.getDesktopOS();
-        const deviceOS = mobileOS ?? desktopOS;
-        return {
-            isDesktop,
-            desktopOS,
-            isWindowsDesktop: deviceOS === DesktopOS.Windows,
-            isLinuxOrUnixDesktop: deviceOS === DesktopOS.Linux || deviceOS === DesktopOS.Unix,
-            isMobile,
-            mobileOS,
-            isAndroidDevice: deviceOS === MobileOS.Android,
-            isAppleDevice: deviceOS === MobileOS.iOS || deviceOS === DesktopOS.MacOS,
-            isUnknownMobileDevice: deviceOS === MobileOS.Unknown,
-            isTablet,
-            isLandscapeOrientation: () => this.isLandscapeOrientation(),
-            isPortraitOrientation: () => this.isPortraitOrientation()
-        };
-    }
-    isMobileDevice() {
-        const regexs = [/(Android)(.+)(Mobile)/i, /BlackBerry/i, /iPhone|iPod/i, /Opera Mini/i, /IEMobile/i];
-        return regexs.some((regex) => regex.test(this.userAgent));
-    }
-    isTabletDevice() {
-        const regex = /(ipad|tablet|(android(?!.*mobile))|(windows(?!.*phone)(.*touch))|kindle|playbook|silk|(puffin(?!.*(IP|AP|WP))))/i;
-        return regex.test(this.userAgent);
-    }
-    getMobileOS() {
-        if (this.isMobileDevice()) {
-            const ua = this.userAgent;
-            if (/windows phone/i.test(ua))
-                return MobileOS.WindowsPhone;
-            if (/android/i.test(ua))
-                return MobileOS.Android;
-            if (/iPad|iPhone|iPod/.test(ua) && !this.document.defaultView?.MSStream)
-                return MobileOS.iOS;
-            return MobileOS.Unknown;
-        }
-        return undefined;
-    }
-    getDesktopOS() {
-        if (this.isDesktopDevice) {
-            const ua = this.userAgent;
-            if (ua.includes('Win'))
-                return DesktopOS.Windows;
-            if (ua.includes('Mac'))
-                return DesktopOS.MacOS;
-            if (ua.includes('X11'))
-                return DesktopOS.Unix;
-            if (ua.includes('Linux'))
-                return DesktopOS.Linux;
-            return DesktopOS.Unknown;
-        }
-        return undefined;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DeviceTypeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DeviceTypeService, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DeviceTypeService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: () => [] });
-
+var DeviceTypeService = class DeviceTypeService {
+	document = inject(DOCUMENT$1);
+	platformId = inject(PLATFORM_ID);
+	isBrowser = isPlatformBrowser(this.platformId);
+	screenOrientation = "portrait-primary";
+	constructor() {
+		if (this.isBrowser) {
+			const win = this.document.defaultView;
+			const screenObj = win?.screen;
+			this.screenOrientation = (screenObj?.orientation || {}).type ?? screenObj?.mozOrientation ?? screenObj?.msOrientation ?? (!screenObj?.orientation && win?.matchMedia("(orientation: portrait)").matches ? "portrait-primary" : "landscape-primary");
+			if (screenObj?.orientation) screenObj.orientation.addEventListener("change", (ev) => {
+				const orientation = ev.target;
+				if (orientation?.type) this.screenOrientation = orientation.type;
+			});
+		}
+	}
+	isLandscapeOrientation() {
+		return ["landscape-primary", "landscape-secondary"].includes(this.screenOrientation);
+	}
+	isPortraitOrientation() {
+		return ["portrait-primary", "portrait-secondary"].includes(this.screenOrientation);
+	}
+	getDeviceState() {
+		const isMobile = this.isMobileDevice();
+		const isTablet = this.isTabletDevice();
+		const isDesktop = this.isDesktopDevice;
+		const mobileOS = this.getMobileOS();
+		const desktopOS = this.getDesktopOS();
+		const deviceOS = mobileOS ?? desktopOS;
+		return {
+			isDesktop,
+			desktopOS,
+			isWindowsDesktop: deviceOS === DesktopOS.Windows,
+			isLinuxOrUnixDesktop: deviceOS === DesktopOS.Linux || deviceOS === DesktopOS.Unix,
+			isMobile,
+			mobileOS,
+			isAndroidDevice: deviceOS === MobileOS.Android,
+			isAppleDevice: deviceOS === MobileOS.iOS || deviceOS === DesktopOS.MacOS,
+			isUnknownMobileDevice: deviceOS === MobileOS.Unknown,
+			isTablet,
+			isLandscapeOrientation: () => this.isLandscapeOrientation(),
+			isPortraitOrientation: () => this.isPortraitOrientation()
+		};
+	}
+	get userAgent() {
+		if (!this.isBrowser) return "";
+		const win = this.document.defaultView;
+		return win?.navigator?.userAgent || win?.navigator?.vendor || win?.opera || "";
+	}
+	get isDesktopDevice() {
+		return !this.isMobileDevice() && !this.isTabletDevice();
+	}
+	isMobileDevice() {
+		return [
+			/(Android)(.+)(Mobile)/i,
+			/BlackBerry/i,
+			/iPhone|iPod/i,
+			/Opera Mini/i,
+			/IEMobile/i
+		].some((regex) => regex.test(this.userAgent));
+	}
+	isTabletDevice() {
+		return /(ipad|tablet|(android(?!.*mobile))|(windows(?!.*phone)(.*touch))|kindle|playbook|silk|(puffin(?!.*(IP|AP|WP))))/i.test(this.userAgent);
+	}
+	getMobileOS() {
+		if (this.isMobileDevice()) {
+			const ua = this.userAgent;
+			if (/windows phone/i.test(ua)) return MobileOS.WindowsPhone;
+			if (/android/i.test(ua)) return MobileOS.Android;
+			if (/iPad|iPhone|iPod/.test(ua) && !this.document.defaultView?.MSStream) return MobileOS.iOS;
+			return MobileOS.Unknown;
+		}
+	}
+	getDesktopOS() {
+		if (this.isDesktopDevice) {
+			const ua = this.userAgent;
+			if (ua.includes("Win")) return DesktopOS.Windows;
+			if (ua.includes("Mac")) return DesktopOS.MacOS;
+			if (ua.includes("X11")) return DesktopOS.Unix;
+			if (ua.includes("Linux")) return DesktopOS.Linux;
+			return DesktopOS.Unknown;
+		}
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: DeviceTypeService,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: DeviceTypeService,
+		providedIn: "root"
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: DeviceTypeService,
+	decorators: [{
+		type: Injectable,
+		args: [{ providedIn: "root" }]
+	}],
+	ctorParameters: () => []
+});
 const BREAKPOINTS = {
-    xs: 360,
-    sm: 640,
-    md: 768,
-    lg: 1024,
-    xl: 1280,
-    '2xl': 1536,
-    '3xl': 1920,
-    '4xl': 2560
+	xs: 360,
+	sm: 640,
+	md: 768,
+	lg: 1024,
+	xl: 1280,
+	"2xl": 1536,
+	"3xl": 1920,
+	"4xl": 2560
 };
-
-class WindowDimensionsService {
-    ngZone = inject(NgZone);
-    platformId = inject(PLATFORM_ID);
-    isBrowser = isPlatformBrowser(this.platformId);
-    _dimensions = signal(this.getCurrentDimensions(), ...(ngDevMode ? [{ debugName: "_dimensions" }] : /* istanbul ignore next */ []));
-    dimensions = this._dimensions.asReadonly();
-    isMobile = computed(() => this.dimensions().width < BREAKPOINTS.md, ...(ngDevMode ? [{ debugName: "isMobile" }] : /* istanbul ignore next */ []));
-    isTablet = computed(() => this.dimensions().width >= BREAKPOINTS.md && this.dimensions().width < BREAKPOINTS.lg, ...(ngDevMode ? [{ debugName: "isTablet" }] : /* istanbul ignore next */ []));
-    isDesktop = computed(() => this.dimensions().width >= BREAKPOINTS.lg, ...(ngDevMode ? [{ debugName: "isDesktop" }] : /* istanbul ignore next */ []));
-    breakpoints = BREAKPOINTS;
-    constructor() {
-        this.initResizeListener();
-    }
-    getCurrentDimensions() {
-        if (!this.isBrowser) {
-            return { width: 0, height: 0 };
-        }
-        return {
-            width: window.innerWidth,
-            height: window.innerHeight
-        };
-    }
-    initResizeListener() {
-        if (!this.isBrowser)
-            return;
-        this.ngZone.runOutsideAngular(() => {
-            fromEvent(window, 'resize')
-                .pipe(debounceTime(150), map(() => this.getCurrentDimensions()), distinctUntilChanged((prev, curr) => prev.width === curr.width && prev.height === curr.height))
-                .subscribe((dims) => {
-                this.ngZone.run(() => {
-                    this._dimensions.set(dims);
-                });
-            });
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: WindowDimensionsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: WindowDimensionsService, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: WindowDimensionsService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: () => [] });
-
-class ScrollLockService {
-    platformId = inject(PLATFORM_ID);
-    deviceTypeService = inject(DeviceTypeService);
-    windowDimensionsService = inject(WindowDimensionsService);
-    isBrowser = isPlatformBrowser(this.platformId);
-    activeLocks = new Map();
-    boundHandleTouchMove = this.handleTouchMove.bind(this);
-    boundPreventDefault = this.preventDefault.bind(this);
-    _isScrollDisabled = signal(false, ...(ngDevMode ? [{ debugName: "_isScrollDisabled" }] : /* istanbul ignore next */ []));
-    isScrollDisabled = this._isScrollDisabled.asReadonly();
-    previousBodyPadding = null;
-    pendingListenerTimeout = null;
-    ngOnDestroy() {
-        if (!this.isBrowser)
-            return;
-        this.clearPendingTimeout();
-        this.forceCleanupAll();
-    }
-    disableScroll(usageId, config) {
-        if (!this.isBrowser)
-            return;
-        const wasDisabled = this._isScrollDisabled();
-        this.activeLocks.set(usageId, config);
-        this._isScrollDisabled.set(true);
-        if (wasDisabled)
-            return;
-        const documentWidth = document.documentElement.clientWidth;
-        const windowWidth = window.innerWidth;
-        const scrollBarWidth = windowWidth - documentWidth;
-        if (scrollBarWidth > 0) {
-            this.previousBodyPadding = document.body.style.paddingRight;
-            const computedPadding = parseInt(getComputedStyle(document.body).paddingRight, 10) || 0;
-            document.body.style.setProperty('padding-right', `${computedPadding + scrollBarWidth}px`, 'important');
-        }
-        document.body.style.setProperty('overflow', 'hidden', 'important');
-        if (config.handleTouchInput !== false) {
-            document.body.style.setProperty('touch-action', 'none', 'important');
-        }
-        this.clearPendingTimeout();
-        this.pendingListenerTimeout = window.setTimeout(() => {
-            if (!this._isScrollDisabled())
-                return;
-            if (config.handleTouchInput === true) {
-                document.body.addEventListener('touchmove', this.boundHandleTouchMove, { passive: false });
-            }
-            if (config.handleExtremeOverflow === true) {
-                const opt = { passive: false };
-                window.addEventListener('wheel', this.boundPreventDefault, opt);
-                window.addEventListener('mousewheel', this.boundPreventDefault, opt);
-                window.addEventListener('scroll', this.boundPreventDefault, opt);
-                window.addEventListener('DOMMouseScroll', this.boundPreventDefault, opt);
-            }
-        }, (config.animationDuration ?? 0) + 10);
-    }
-    enableScroll(usageId, extremeOverflow) {
-        if (!this.isBrowser)
-            return;
-        if (!this.activeLocks.has(usageId))
-            return;
-        this.activeLocks.delete(usageId);
-        if (this.activeLocks.size > 0)
-            return;
-        this.updateStateAndCleanup(extremeOverflow);
-    }
-    getActiveConfig() {
-        if (this.activeLocks.size === 0)
-            return null;
-        const keys = Array.from(this.activeLocks.keys());
-        return this.activeLocks.get(keys[keys.length - 1]) ?? null;
-    }
-    updateStateAndCleanup(extremeOverflow) {
-        if (!this.isBrowser)
-            return;
-        this.clearPendingTimeout();
-        this._isScrollDisabled.set(false);
-        document.body.style.removeProperty('overflow');
-        if (this.previousBodyPadding !== null) {
-            if (this.previousBodyPadding) {
-                document.body.style.setProperty('padding-right', this.previousBodyPadding);
-            }
-            else {
-                document.body.style.removeProperty('padding-right');
-            }
-            this.previousBodyPadding = null;
-        }
-        document.body.removeEventListener('touchmove', this.boundHandleTouchMove);
-        document.body.style.removeProperty('touch-action');
-        if (extremeOverflow !== false) {
-            window.removeEventListener('wheel', this.boundPreventDefault);
-            window.removeEventListener('mousewheel', this.boundPreventDefault);
-            window.removeEventListener('scroll', this.boundPreventDefault);
-            window.removeEventListener('DOMMouseScroll', this.boundPreventDefault);
-        }
-    }
-    forceCleanupAll() {
-        this.activeLocks.clear();
-        this.updateStateAndCleanup(true);
-    }
-    clearPendingTimeout() {
-        if (this.pendingListenerTimeout !== null) {
-            clearTimeout(this.pendingListenerTimeout);
-            this.pendingListenerTimeout = null;
-        }
-    }
-    handleTouchMove(event) {
-        const targetNode = event.target;
-        const cfg = this.getActiveConfig();
-        if (!this.isAllowedToScroll(targetNode) && (cfg === null || cfg.handleTouchInput !== false)) {
-            if (cfg === null ||
-                cfg.mobileOnlyTouchPrevention !== true ||
-                (cfg.mobileOnlyTouchPrevention === true &&
-                    (!this.deviceTypeService.getDeviceState().isMobile || !this.deviceTypeService.getDeviceState().isTablet) &&
-                    this.windowDimensionsService.dimensions().width < this.windowDimensionsService.breakpoints.sm)) {
-                event.preventDefault();
-                event.stopPropagation();
-            }
-        }
-    }
-    isAllowedToScroll(targetNode) {
-        const cfg = this.getActiveConfig();
-        const allow = cfg?.allowTouchInputOn;
-        if (!allow)
-            return true;
-        if (Array.isArray(allow)) {
-            if (allow.length === 0)
-                return true;
-            return allow.some((el) => el.contains(targetNode));
-        }
-        return false;
-    }
-    preventDefault(event) {
-        event.preventDefault();
-        event.stopPropagation();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ScrollLockService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ScrollLockService, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ScrollLockService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }] });
-
-class ThemingService {
-    platformId = inject(PLATFORM_ID);
-    isBrowser = isPlatformBrowser(this.platformId);
-    _systemTheme = signal('light', ...(ngDevMode ? [{ debugName: "_systemTheme" }] : /* istanbul ignore next */ []));
-    _applicationTheme = signal(null, ...(ngDevMode ? [{ debugName: "_applicationTheme" }] : /* istanbul ignore next */ []));
-    systemTheme = this._systemTheme.asReadonly();
-    applicationTheme = this._applicationTheme.asReadonly();
-    activeTheme = computed(() => this.applicationTheme() ?? this.systemTheme(), ...(ngDevMode ? [{ debugName: "activeTheme" }] : /* istanbul ignore next */ []));
-    systemTheme$ = toObservable(this._systemTheme);
-    applicationTheme$ = toObservable(this._applicationTheme);
-    mediaQueryList;
-    mediaQueryListener;
-    constructor() {
-        if (this.isBrowser) {
-            this._systemTheme.set(this.detectInitialSystemTheme());
-            const storedTheme = localStorage.getItem('theme');
-            if (storedTheme === 'dark' || storedTheme === 'light') {
-                this._applicationTheme.set(storedTheme);
-            }
-            this.initSystemThemeListener();
-        }
-    }
-    ngOnDestroy() {
-        if (this.mediaQueryList && this.mediaQueryListener) {
-            this.mediaQueryList.removeEventListener('change', this.mediaQueryListener);
-        }
-    }
-    setApplicationTheme(theme) {
-        this._applicationTheme.set(theme);
-        if (this.isBrowser) {
-            localStorage.setItem('theme', theme);
-        }
-    }
-    getSystemTheme$() {
-        return this.systemTheme$;
-    }
-    getApplicationTheme$() {
-        return this.applicationTheme$;
-    }
-    detectInitialSystemTheme() {
-        if (!this.isBrowser)
-            return 'light';
-        return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
-    }
-    initSystemThemeListener() {
-        this.mediaQueryList = window.matchMedia('(prefers-color-scheme: dark)');
-        this.mediaQueryListener = (event) => {
-            this._systemTheme.set(event.matches ? 'dark' : 'light');
-        };
-        this.mediaQueryList.addEventListener('change', this.mediaQueryListener);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ThemingService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ThemingService, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ThemingService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: () => [] });
-
-class BxA11yService {
-    document = inject(DOCUMENT);
-    platformId = inject(PLATFORM_ID);
-    osPrefersReducedMotion = signal(false, ...(ngDevMode ? [{ debugName: "osPrefersReducedMotion" }] : /* istanbul ignore next */ []));
-    manualOverride = signal(null, ...(ngDevMode ? [{ debugName: "manualOverride" }] : /* istanbul ignore next */ []));
-    isReducedMotion = computed(() => {
-        const manual = this.manualOverride();
-        if (manual !== null)
-            return manual;
-        return this.osPrefersReducedMotion();
-    }, ...(ngDevMode ? [{ debugName: "isReducedMotion" }] : /* istanbul ignore next */ []));
-    constructor() {
-        this.initMediaMatcher();
-        this.syncWithDOM();
-    }
-    setReducedMotion(reduce) {
-        this.manualOverride.set(reduce);
-    }
-    //#region Helpers
-    initMediaMatcher() {
-        if (!isPlatformBrowser(this.platformId))
-            return;
-        const mediaQuery = window.matchMedia('(prefers-reduced-motion: reduce)');
-        this.osPrefersReducedMotion.set(mediaQuery.matches);
-        mediaQuery.addEventListener('change', (e) => {
-            this.osPrefersReducedMotion.set(e.matches);
-        });
-    }
-    syncWithDOM() {
-        if (!isPlatformBrowser(this.platformId))
-            return;
-        effect(() => {
-            const isReduced = this.isReducedMotion();
-            const root = this.document.documentElement;
-            if (isReduced) {
-                root.classList.add('bx-reduce-motion-forced');
-                root.style.setProperty('--bx-reduced-motion', '1');
-            }
-            else {
-                root.classList.remove('bx-reduce-motion-forced');
-                root.style.setProperty('--bx-reduced-motion', '0');
-            }
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BxA11yService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BxA11yService, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BxA11yService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: () => [] });
-
-class BxOverlayPositionService {
-    overlay = inject(Overlay);
-    getElementStrategy(element, placement, offset = 8) {
-        return this.overlay.position()
-            .flexibleConnectedTo(element)
-            .withPositions(this.getPositions(placement, offset))
-            .withPush(true)
-            .withViewportMargin(8);
-    }
-    getCoordinateStrategy(x, y) {
-        return this.overlay.position()
-            .flexibleConnectedTo({ x, y })
-            .withPositions(this.getPositions('bottom', 2))
-            .withPush(true)
-            .withViewportMargin(8);
-    }
-    getPositions(placement, offset) {
-        const top = new ConnectionPositionPair({ originX: 'center', originY: 'top' }, { overlayX: 'center', overlayY: 'bottom' }, 0, -offset, ['bx-overlay-pos-top']);
-        const bottom = new ConnectionPositionPair({ originX: 'center', originY: 'bottom' }, { overlayX: 'center', overlayY: 'top' }, 0, offset, ['bx-overlay-pos-bottom']);
-        const left = new ConnectionPositionPair({ originX: 'start', originY: 'center' }, { overlayX: 'end', overlayY: 'center' }, -offset, 0, ['bx-overlay-pos-left']);
-        const right = new ConnectionPositionPair({ originX: 'end', originY: 'center' }, { overlayX: 'start', overlayY: 'center' }, offset, 0, ['bx-overlay-pos-right']);
-        switch (placement) {
-            case 'top': return [top, bottom, right, left];
-            case 'bottom': return [bottom, top, right, left];
-            case 'left': return [left, right, top, bottom];
-            case 'right': return [right, left, top, bottom];
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BxOverlayPositionService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BxOverlayPositionService, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BxOverlayPositionService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }] });
-
+var WindowDimensionsService = class WindowDimensionsService {
+	ngZone = inject(NgZone);
+	platformId = inject(PLATFORM_ID);
+	isBrowser = isPlatformBrowser(this.platformId);
+	_dimensions = signal(this.getCurrentDimensions(), ...ngDevMode ? [{ debugName: "_dimensions" }] : /* istanbul ignore next */ []);
+	dimensions = this._dimensions.asReadonly();
+	isMobile = computed(() => this.dimensions().width < BREAKPOINTS.md, ...ngDevMode ? [{ debugName: "isMobile" }] : /* istanbul ignore next */ []);
+	isTablet = computed(() => this.dimensions().width >= BREAKPOINTS.md && this.dimensions().width < BREAKPOINTS.lg, ...ngDevMode ? [{ debugName: "isTablet" }] : /* istanbul ignore next */ []);
+	isDesktop = computed(() => this.dimensions().width >= BREAKPOINTS.lg, ...ngDevMode ? [{ debugName: "isDesktop" }] : /* istanbul ignore next */ []);
+	breakpoints = BREAKPOINTS;
+	constructor() {
+		this.initResizeListener();
+	}
+	getCurrentDimensions() {
+		if (!this.isBrowser) return {
+			width: 0,
+			height: 0
+		};
+		return {
+			width: window.innerWidth,
+			height: window.innerHeight
+		};
+	}
+	initResizeListener() {
+		if (!this.isBrowser) return;
+		this.ngZone.runOutsideAngular(() => {
+			fromEvent(window, "resize").pipe(debounceTime(150), map(() => this.getCurrentDimensions()), distinctUntilChanged((prev, curr) => prev.width === curr.width && prev.height === curr.height)).subscribe((dims) => {
+				this.ngZone.run(() => {
+					this._dimensions.set(dims);
+				});
+			});
+		});
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: WindowDimensionsService,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: WindowDimensionsService,
+		providedIn: "root"
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: WindowDimensionsService,
+	decorators: [{
+		type: Injectable,
+		args: [{ providedIn: "root" }]
+	}],
+	ctorParameters: () => []
+});
+var ScrollLockService = class ScrollLockService {
+	platformId = inject(PLATFORM_ID);
+	deviceTypeService = inject(DeviceTypeService);
+	windowDimensionsService = inject(WindowDimensionsService);
+	isBrowser = isPlatformBrowser(this.platformId);
+	activeLocks = /* @__PURE__ */ new Map();
+	boundHandleTouchMove = this.handleTouchMove.bind(this);
+	boundPreventDefault = this.preventDefault.bind(this);
+	_isScrollDisabled = signal(false, ...ngDevMode ? [{ debugName: "_isScrollDisabled" }] : /* istanbul ignore next */ []);
+	isScrollDisabled = this._isScrollDisabled.asReadonly();
+	previousBodyPadding = null;
+	pendingListenerTimeout = null;
+	ngOnDestroy() {
+		if (!this.isBrowser) return;
+		this.clearPendingTimeout();
+		this.forceCleanupAll();
+	}
+	disableScroll(usageId, config) {
+		if (!this.isBrowser) return;
+		const wasDisabled = this._isScrollDisabled();
+		this.activeLocks.set(usageId, config);
+		this._isScrollDisabled.set(true);
+		if (wasDisabled) return;
+		const documentWidth = document.documentElement.clientWidth;
+		const scrollBarWidth = window.innerWidth - documentWidth;
+		if (scrollBarWidth > 0) {
+			this.previousBodyPadding = document.body.style.paddingRight;
+			const computedPadding = parseInt(getComputedStyle(document.body).paddingRight, 10) || 0;
+			document.body.style.setProperty("padding-right", `${computedPadding + scrollBarWidth}px`, "important");
+		}
+		document.body.style.setProperty("overflow", "hidden", "important");
+		if (config.handleTouchInput !== false) document.body.style.setProperty("touch-action", "none", "important");
+		this.clearPendingTimeout();
+		this.pendingListenerTimeout = window.setTimeout(() => {
+			if (!this._isScrollDisabled()) return;
+			if (config.handleTouchInput === true) document.body.addEventListener("touchmove", this.boundHandleTouchMove, { passive: false });
+			if (config.handleExtremeOverflow === true) {
+				const opt = { passive: false };
+				window.addEventListener("wheel", this.boundPreventDefault, opt);
+				window.addEventListener("mousewheel", this.boundPreventDefault, opt);
+				window.addEventListener("scroll", this.boundPreventDefault, opt);
+				window.addEventListener("DOMMouseScroll", this.boundPreventDefault, opt);
+			}
+		}, (config.animationDuration ?? 0) + 10);
+	}
+	enableScroll(usageId, extremeOverflow) {
+		if (!this.isBrowser) return;
+		if (!this.activeLocks.has(usageId)) return;
+		this.activeLocks.delete(usageId);
+		if (this.activeLocks.size > 0) return;
+		this.updateStateAndCleanup(extremeOverflow);
+	}
+	getActiveConfig() {
+		if (this.activeLocks.size === 0) return null;
+		const keys = Array.from(this.activeLocks.keys());
+		return this.activeLocks.get(keys[keys.length - 1]) ?? null;
+	}
+	updateStateAndCleanup(extremeOverflow) {
+		if (!this.isBrowser) return;
+		this.clearPendingTimeout();
+		this._isScrollDisabled.set(false);
+		document.body.style.removeProperty("overflow");
+		if (this.previousBodyPadding !== null) {
+			if (this.previousBodyPadding) document.body.style.setProperty("padding-right", this.previousBodyPadding);
+			else document.body.style.removeProperty("padding-right");
+			this.previousBodyPadding = null;
+		}
+		document.body.removeEventListener("touchmove", this.boundHandleTouchMove);
+		document.body.style.removeProperty("touch-action");
+		if (extremeOverflow !== false) {
+			window.removeEventListener("wheel", this.boundPreventDefault);
+			window.removeEventListener("mousewheel", this.boundPreventDefault);
+			window.removeEventListener("scroll", this.boundPreventDefault);
+			window.removeEventListener("DOMMouseScroll", this.boundPreventDefault);
+		}
+	}
+	forceCleanupAll() {
+		this.activeLocks.clear();
+		this.updateStateAndCleanup(true);
+	}
+	clearPendingTimeout() {
+		if (this.pendingListenerTimeout !== null) {
+			clearTimeout(this.pendingListenerTimeout);
+			this.pendingListenerTimeout = null;
+		}
+	}
+	handleTouchMove(event) {
+		const targetNode = event.target;
+		const cfg = this.getActiveConfig();
+		if (!this.isAllowedToScroll(targetNode) && (cfg === null || cfg.handleTouchInput !== false)) {
+			if (cfg === null || cfg.mobileOnlyTouchPrevention !== true || cfg.mobileOnlyTouchPrevention === true && (!this.deviceTypeService.getDeviceState().isMobile || !this.deviceTypeService.getDeviceState().isTablet) && this.windowDimensionsService.dimensions().width < this.windowDimensionsService.breakpoints.sm) {
+				event.preventDefault();
+				event.stopPropagation();
+			}
+		}
+	}
+	isAllowedToScroll(targetNode) {
+		const allow = this.getActiveConfig()?.allowTouchInputOn;
+		if (!allow) return true;
+		if (Array.isArray(allow)) {
+			if (allow.length === 0) return true;
+			return allow.some((el) => el.contains(targetNode));
+		}
+		return false;
+	}
+	preventDefault(event) {
+		event.preventDefault();
+		event.stopPropagation();
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: ScrollLockService,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: ScrollLockService,
+		providedIn: "root"
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: ScrollLockService,
+	decorators: [{
+		type: Injectable,
+		args: [{ providedIn: "root" }]
+	}]
+});
+const DEFAULT_APPEARANCE_CONFIG = Object.freeze({
+	material: "glass",
+	blur: 10,
+	tint: .4,
+	quality: "auto",
+	reducedTransparency: false
+});
+const THEME_PALETTES = [
+	{
+		id: "white",
+		label: "White",
+		className: "theme-white"
+	},
+	{
+		id: "purple",
+		label: "Purple",
+		className: "theme-purple"
+	},
+	{
+		id: "orange",
+		label: "Orange",
+		className: "theme-orange"
+	},
+	{
+		id: "red",
+		label: "Red",
+		className: "theme-red"
+	},
+	{
+		id: "green",
+		label: "Green",
+		className: "theme-green"
+	},
+	{
+		id: "cyberpunk",
+		label: "Cyberpunk",
+		className: "theme-cyberpunk"
+	},
+	{
+		id: "high-contrast",
+		label: "High contrast",
+		className: "high-contrast"
+	}
+];
+var BxA11yService = class BxA11yService {
+	document = inject(DOCUMENT$1);
+	platformId = inject(PLATFORM_ID);
+	osPrefersReducedMotion = signal(false, ...ngDevMode ? [{ debugName: "osPrefersReducedMotion" }] : /* istanbul ignore next */ []);
+	manualOverride = signal(null, ...ngDevMode ? [{ debugName: "manualOverride" }] : /* istanbul ignore next */ []);
+	isReducedMotion = computed(() => {
+		const manual = this.manualOverride();
+		if (manual !== null) return manual;
+		return this.osPrefersReducedMotion();
+	}, ...ngDevMode ? [{ debugName: "isReducedMotion" }] : /* istanbul ignore next */ []);
+	constructor() {
+		this.initMediaMatcher();
+		this.syncWithDOM();
+	}
+	setReducedMotion(reduce) {
+		this.manualOverride.set(reduce);
+	}
+	initMediaMatcher() {
+		if (!isPlatformBrowser(this.platformId)) return;
+		const mediaQuery = window.matchMedia("(prefers-reduced-motion: reduce)");
+		this.osPrefersReducedMotion.set(mediaQuery.matches);
+		const listener = (e) => this.osPrefersReducedMotion.set(e.matches);
+		mediaQuery.addEventListener("change", listener);
+		inject(DestroyRef).onDestroy(() => mediaQuery.removeEventListener("change", listener));
+	}
+	syncWithDOM() {
+		if (!isPlatformBrowser(this.platformId)) return;
+		effect(() => {
+			const isReduced = this.isReducedMotion();
+			const root = this.document.documentElement;
+			if (isReduced) {
+				root.classList.add("bx-reduce-motion-forced");
+				root.style.setProperty("--bx-reduced-motion", "1");
+			} else {
+				root.classList.remove("bx-reduce-motion-forced");
+				root.style.setProperty("--bx-reduced-motion", "0");
+			}
+		});
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: BxA11yService,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: BxA11yService,
+		providedIn: "root"
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: BxA11yService,
+	decorators: [{
+		type: Injectable,
+		args: [{ providedIn: "root" }]
+	}],
+	ctorParameters: () => []
+});
+var ThemingService = class ThemingService {
+	document = inject(DOCUMENT);
+	a11y = inject(BxA11yService);
+	_appearance = signal({ ...DEFAULT_APPEARANCE_CONFIG }, ...ngDevMode ? [{ debugName: "_appearance" }] : /* istanbul ignore next */ []);
+	appearance = this._appearance.asReadonly();
+	palettes = THEME_PALETTES;
+	_palette = signal("white", ...ngDevMode ? [{ debugName: "_palette" }] : /* istanbul ignore next */ []);
+	palette = this._palette.asReadonly();
+	paletteLabel = computed(() => this.palettes.find((item) => item.id === this.palette()).label, ...ngDevMode ? [{ debugName: "paletteLabel" }] : /* istanbul ignore next */ []);
+	platformId = inject(PLATFORM_ID);
+	isBrowser = isPlatformBrowser(this.platformId);
+	_systemTheme = signal("light", ...ngDevMode ? [{ debugName: "_systemTheme" }] : /* istanbul ignore next */ []);
+	_applicationTheme = signal(null, ...ngDevMode ? [{ debugName: "_applicationTheme" }] : /* istanbul ignore next */ []);
+	systemTheme = this._systemTheme.asReadonly();
+	applicationTheme = this._applicationTheme.asReadonly();
+	activeTheme = computed(() => this.applicationTheme() ?? this.systemTheme(), ...ngDevMode ? [{ debugName: "activeTheme" }] : /* istanbul ignore next */ []);
+	systemTheme$ = toObservable(this._systemTheme);
+	applicationTheme$ = toObservable(this._applicationTheme);
+	appearanceController;
+	mediaQueryList;
+	mediaQueryListener;
+	constructor() {
+		effect(() => {
+			const reducedMotion = this.a11y.isReducedMotion();
+			this.appearanceController?.update({ reducedMotion });
+		});
+		if (this.isBrowser) {
+			this._systemTheme.set(this.detectInitialSystemTheme());
+			const storedTheme = this.readStored("theme");
+			this.restoreAppearance();
+			const palette = this.readStored("theme-palette");
+			this.setPalette(this.palettes.some((item) => item.id === palette) ? palette : "white");
+			this.appearanceController = configureAppearance(this.document.documentElement, {
+				...this.appearance(),
+				reducedMotion: this.a11y.isReducedMotion()
+			});
+			if (storedTheme === "dark" || storedTheme === "light") this._applicationTheme.set(storedTheme);
+			this.initSystemThemeListener();
+		}
+	}
+	ngOnDestroy() {
+		this.appearanceController?.destroy();
+		if (this.mediaQueryList && this.mediaQueryListener) this.mediaQueryList.removeEventListener("change", this.mediaQueryListener);
+	}
+	setApplicationTheme(theme) {
+		this._applicationTheme.set(theme);
+		if (this.isBrowser) this.writeStored("theme", theme);
+	}
+	setPalette(palette) {
+		if (!this.palettes.some((item) => item.id === palette)) return;
+		this._palette.set(palette);
+		for (const item of this.palettes) this.document.documentElement.classList.toggle(item.className, item.id === palette);
+		if (this.isBrowser) this.writeStored("theme-palette", palette);
+	}
+	setAppearance(settings) {
+		const next = {
+			...this.appearance(),
+			...settings
+		};
+		const finite = (value, fallback, min, max) => Number.isFinite(value) ? Math.min(max, Math.max(min, value)) : fallback;
+		next.blur = finite(next.blur, DEFAULT_APPEARANCE_CONFIG.blur, 0, 40);
+		next.tint = finite(next.tint, DEFAULT_APPEARANCE_CONFIG.tint, 0, 1);
+		if (![
+			"glass",
+			"frosted",
+			"solid"
+		].includes(next.material)) next.material = "glass";
+		if (![
+			"auto",
+			"baseline",
+			"enhanced"
+		].includes(next.quality)) next.quality = "auto";
+		for (const key of Object.keys(next)) if (!(key in DEFAULT_APPEARANCE_CONFIG)) delete next[key];
+		next.reducedTransparency = next.reducedTransparency === true;
+		this._appearance.set(next);
+		this.appearanceController?.update(next);
+		if (this.isBrowser) this.writeStored("blocks-appearance", JSON.stringify(next));
+	}
+	resetAppearance() {
+		this.setAppearance({ ...DEFAULT_APPEARANCE_CONFIG });
+	}
+	getSystemTheme$() {
+		return this.systemTheme$;
+	}
+	getApplicationTheme$() {
+		return this.applicationTheme$;
+	}
+	restoreAppearance() {
+		try {
+			const stored = this.readStored("blocks-appearance");
+			if (stored) this.setAppearance(JSON.parse(stored));
+		} catch {}
+	}
+	readStored(key) {
+		try {
+			return this.document.defaultView?.localStorage.getItem(key) ?? null;
+		} catch {
+			return null;
+		}
+	}
+	writeStored(key, value) {
+		try {
+			this.document.defaultView?.localStorage.setItem(key, value);
+		} catch {}
+	}
+	detectInitialSystemTheme() {
+		if (!this.isBrowser) return "light";
+		return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+	}
+	initSystemThemeListener() {
+		this.mediaQueryList = window.matchMedia("(prefers-color-scheme: dark)");
+		this.mediaQueryListener = (event) => {
+			this._systemTheme.set(event.matches ? "dark" : "light");
+		};
+		this.mediaQueryList.addEventListener("change", this.mediaQueryListener);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: ThemingService,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: ThemingService,
+		providedIn: "root"
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: ThemingService,
+	decorators: [{
+		type: Injectable,
+		args: [{ providedIn: "root" }]
+	}],
+	ctorParameters: () => []
+});
+var BxOverlayPositionService = class BxOverlayPositionService {
+	overlay = inject(Overlay);
+	getElementStrategy(element, placement, offset = 8) {
+		return this.overlay.position().flexibleConnectedTo(element).withPositions(this.getPositions(placement, offset)).withPush(true).withViewportMargin(8);
+	}
+	getCoordinateStrategy(x, y) {
+		return this.overlay.position().flexibleConnectedTo({
+			x,
+			y
+		}).withPositions(this.getPositions("bottom", 2)).withPush(true).withViewportMargin(8);
+	}
+	getPositions(placement, offset) {
+		const top = new ConnectionPositionPair({
+			originX: "center",
+			originY: "top"
+		}, {
+			overlayX: "center",
+			overlayY: "bottom"
+		}, 0, -offset, ["bx-overlay-pos-top"]);
+		const bottom = new ConnectionPositionPair({
+			originX: "center",
+			originY: "bottom"
+		}, {
+			overlayX: "center",
+			overlayY: "top"
+		}, 0, offset, ["bx-overlay-pos-bottom"]);
+		const left = new ConnectionPositionPair({
+			originX: "start",
+			originY: "center"
+		}, {
+			overlayX: "end",
+			overlayY: "center"
+		}, -offset, 0, ["bx-overlay-pos-left"]);
+		const right = new ConnectionPositionPair({
+			originX: "end",
+			originY: "center"
+		}, {
+			overlayX: "start",
+			overlayY: "center"
+		}, offset, 0, ["bx-overlay-pos-right"]);
+		switch (placement) {
+			case "top": return [
+				top,
+				bottom,
+				right,
+				left
+			];
+			case "bottom": return [
+				bottom,
+				top,
+				right,
+				left
+			];
+			case "left": return [
+				left,
+				right,
+				top,
+				bottom
+			];
+			case "right": return [
+				right,
+				left,
+				top,
+				bottom
+			];
+		}
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: BxOverlayPositionService,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: BxOverlayPositionService,
+		providedIn: "root"
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: BxOverlayPositionService,
+	decorators: [{
+		type: Injectable,
+		args: [{ providedIn: "root" }]
+	}]
+});
 function isOSShortcut(val) {
-    return (typeof val === 'object' &&
-        val !== null &&
-        !Array.isArray(val) &&
-        'default' in val);
-}
-
-class BxShortcutService {
-    deviceTypeService = inject(DeviceTypeService);
-    resolve(shortcut) {
-        if (!shortcut)
-            return undefined;
-        let resolvedKey;
-        if (isOSShortcut(shortcut)) {
-            const state = this.deviceTypeService.getDeviceState();
-            if (state.isAppleDevice && shortcut.mac) {
-                resolvedKey = shortcut.mac;
-            }
-            else if (state.isWindowsDesktop && shortcut.windows) {
-                resolvedKey = shortcut.windows;
-            }
-            else if (state.isLinuxOrUnixDesktop && shortcut.linux) {
-                resolvedKey = shortcut.linux;
-            }
-            else {
-                resolvedKey = shortcut.default;
-            }
-        }
-        else {
-            resolvedKey = shortcut;
-        }
-        return Array.isArray(resolvedKey) ? resolvedKey : [resolvedKey];
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BxShortcutService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BxShortcutService, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BxShortcutService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }] });
-
-class BxBaseControl {
-    ngControl = inject(NgControl, { optional: true, self: true });
-    label = input(undefined, ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    placeholder = input(undefined, ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
-    tooltip = input(undefined, ...(ngDevMode ? [{ debugName: "tooltip" }] : /* istanbul ignore next */ []));
-    dataTestId = input(undefined, ...(ngDevMode ? [{ debugName: "dataTestId" }] : /* istanbul ignore next */ []));
-    ariaLabel = input(undefined, ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
-    errorMessages = input({}, ...(ngDevMode ? [{ debugName: "errorMessages" }] : /* istanbul ignore next */ []));
-    required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
-    loading = input(false, ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    isFieldRequired = computed(() => {
-        if (this.required && this.required())
-            return true;
-        const control = this.ngControl?.control;
-        return control?.hasValidator ? control.hasValidator(Validators.required) : false;
-    }, ...(ngDevMode ? [{ debugName: "isFieldRequired" }] : /* istanbul ignore next */ []));
-    internalValue = signal(null, ...(ngDevMode ? [{ debugName: "internalValue" }] : /* istanbul ignore next */ []));
-    isTouched = signal(false, ...(ngDevMode ? [{ debugName: "isTouched" }] : /* istanbul ignore next */ []));
-    isDisabled = signal(false, ...(ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []));
-    onChange = () => { };
-    onTouched = () => { };
-    constructor() {
-        if (this.ngControl) {
-            this.ngControl.valueAccessor = this;
-        }
-    }
-    ngOnInit() {
-        this.isDisabled.set(this.disabled());
-        if (isDevMode() && this.ngControl?.control?.validator) {
-            const hasMessages = Object.keys(this.errorMessages()).length > 0;
-            if (!hasMessages) {
-                console.error(`[Blocks UI Strict Mode] The form control for this field has validators, but the [errorMessages] input is empty. You must provide error messages for all applied validators.`);
-            }
-        }
-    }
-    writeValue(value) {
-        this.internalValue.set(value);
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.isDisabled.set(isDisabled);
-    }
-    updateValue(value) {
-        if (this.isDisabled())
-            return;
-        this.internalValue.set(value);
-        this.onChange(value);
-    }
-    markAsTouched() {
-        if (!this.isTouched()) {
-            this.isTouched.set(true);
-            this.onTouched();
-        }
-    }
-    get errorMessage() {
-        if (this.ngControl?.invalid && (this.ngControl.touched || this.ngControl.dirty)) {
-            const errors = this.ngControl.errors;
-            if (!errors)
-                return undefined;
-            const firstKey = Object.keys(errors)[0];
-            const customErrorMap = this.errorMessages();
-            if (customErrorMap && customErrorMap[firstKey]) {
-                return customErrorMap[firstKey];
-            }
-            if (typeof errors[firstKey] === 'string') {
-                return errors[firstKey];
-            }
-            if (isDevMode()) {
-                console.error(`[Blocks UI Strict Mode] Validation failed for key '${firstKey}', but no message was provided in [errorMessages].`);
-            }
-            return `[Missing error message: ${firstKey}]`;
-        }
-        return undefined;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BxBaseControl, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.9", type: BxBaseControl, isStandalone: true, inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: true, isRequired: false, transformFunction: null }, dataTestId: { classPropertyName: "dataTestId", publicName: "dataTestId", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, errorMessages: { classPropertyName: "errorMessages", publicName: "errorMessages", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+	return typeof val === "object" && val !== null && !Array.isArray(val) && "default" in val;
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BxBaseControl, decorators: [{
-            type: Directive
-        }], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], tooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltip", required: false }] }], dataTestId: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataTestId", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], errorMessages: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMessages", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
-
+var BxShortcutService = class BxShortcutService {
+	deviceTypeService = inject(DeviceTypeService);
+	resolve(shortcut) {
+		if (!shortcut) return void 0;
+		let resolvedKey;
+		if (isOSShortcut(shortcut)) {
+			const state = this.deviceTypeService.getDeviceState();
+			if (state.isAppleDevice && shortcut.mac) resolvedKey = shortcut.mac;
+			else if (state.isWindowsDesktop && shortcut.windows) resolvedKey = shortcut.windows;
+			else if (state.isLinuxOrUnixDesktop && shortcut.linux) resolvedKey = shortcut.linux;
+			else resolvedKey = shortcut.default;
+		} else resolvedKey = shortcut;
+		return Array.isArray(resolvedKey) ? resolvedKey : [resolvedKey];
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: BxShortcutService,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: BxShortcutService,
+		providedIn: "root"
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: BxShortcutService,
+	decorators: [{
+		type: Injectable,
+		args: [{ providedIn: "root" }]
+	}]
+});
+var BxBaseControl = class BxBaseControl {
+	isFieldRequired = computed(() => {
+		if (this.required && this.required()) return true;
+		const control = this.ngControl?.control;
+		return control?.hasValidator ? control.hasValidator(Validators.required) : false;
+	}, ...ngDevMode ? [{ debugName: "isFieldRequired" }] : /* istanbul ignore next */ []);
+	internalValue = signal(null, ...ngDevMode ? [{ debugName: "internalValue" }] : /* istanbul ignore next */ []);
+	isTouched = signal(false, ...ngDevMode ? [{ debugName: "isTouched" }] : /* istanbul ignore next */ []);
+	isDisabled = signal(false, ...ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []);
+	ngControl = inject(NgControl, {
+		optional: true,
+		self: true
+	});
+	label = input(void 0, ...ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []);
+	placeholder = input(void 0, ...ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []);
+	tooltip = input(void 0, ...ngDevMode ? [{ debugName: "tooltip" }] : /* istanbul ignore next */ []);
+	dataTestId = input(void 0, ...ngDevMode ? [{ debugName: "dataTestId" }] : /* istanbul ignore next */ []);
+	ariaLabel = input(void 0, ...ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []);
+	errorMessages = input({}, ...ngDevMode ? [{ debugName: "errorMessages" }] : /* istanbul ignore next */ []);
+	required = input(false, ...ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []);
+	loading = input(false, ...ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []);
+	disabled = input(false, ...ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []);
+	onChange = () => {};
+	onTouched = () => {};
+	constructor() {
+		if (this.ngControl) this.ngControl.valueAccessor = this;
+	}
+	ngOnInit() {
+		this.isDisabled.set(this.disabled() || this.ngControl?.disabled === true);
+		if (isDevMode() && this.ngControl?.control?.validator) {
+			if (!(Object.keys(this.errorMessages()).length > 0)) console.error(`[Blocks UI Strict Mode] The form control for this field has validators, but the [errorMessages] input is empty. You must provide error messages for all applied validators.`);
+		}
+	}
+	writeValue(value) {
+		this.internalValue.set(value);
+	}
+	registerOnChange(fn) {
+		this.onChange = fn;
+	}
+	registerOnTouched(fn) {
+		this.onTouched = fn;
+	}
+	setDisabledState(isDisabled) {
+		this.isDisabled.set(isDisabled);
+	}
+	updateValue(value) {
+		if (this.isDisabled()) return;
+		this.internalValue.set(value);
+		this.onChange(value);
+	}
+	markAsTouched() {
+		if (!this.isTouched()) {
+			this.isTouched.set(true);
+			this.onTouched();
+		}
+	}
+	get errorMessage() {
+		if (this.ngControl?.invalid && (this.ngControl.touched || this.ngControl.dirty)) {
+			const errors = this.ngControl.errors;
+			if (!errors) return void 0;
+			const firstKey = Object.keys(errors)[0];
+			const customErrorMap = this.errorMessages();
+			if (customErrorMap && customErrorMap[firstKey]) return customErrorMap[firstKey];
+			if (typeof errors[firstKey] === "string") return errors[firstKey];
+			if (isDevMode()) console.error(`[Blocks UI Strict Mode] Validation failed for key '${firstKey}', but no message was provided in [errorMessages].`);
+			return `[Missing error message: ${firstKey}]`;
+		}
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: BxBaseControl,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Directive
+	});
+	static ɵdir = i0.ɵɵngDeclareDirective({
+		minVersion: "17.1.0",
+		version: "22.2.3",
+		type: BxBaseControl,
+		isStandalone: true,
+		inputs: {
+			label: {
+				classPropertyName: "label",
+				publicName: "label",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			placeholder: {
+				classPropertyName: "placeholder",
+				publicName: "placeholder",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			tooltip: {
+				classPropertyName: "tooltip",
+				publicName: "tooltip",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			dataTestId: {
+				classPropertyName: "dataTestId",
+				publicName: "dataTestId",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			ariaLabel: {
+				classPropertyName: "ariaLabel",
+				publicName: "ariaLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			errorMessages: {
+				classPropertyName: "errorMessages",
+				publicName: "errorMessages",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			required: {
+				classPropertyName: "required",
+				publicName: "required",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			loading: {
+				classPropertyName: "loading",
+				publicName: "loading",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			disabled: {
+				classPropertyName: "disabled",
+				publicName: "disabled",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: BxBaseControl,
+	decorators: [{ type: Directive }],
+	ctorParameters: () => [],
+	propDecorators: {
+		label: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "label",
+				required: false
+			}]
+		}],
+		placeholder: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "placeholder",
+				required: false
+			}]
+		}],
+		tooltip: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "tooltip",
+				required: false
+			}]
+		}],
+		dataTestId: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "dataTestId",
+				required: false
+			}]
+		}],
+		ariaLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "ariaLabel",
+				required: false
+			}]
+		}],
+		errorMessages: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "errorMessages",
+				required: false
+			}]
+		}],
+		required: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "required",
+				required: false
+			}]
+		}],
+		loading: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "loading",
+				required: false
+			}]
+		}],
+		disabled: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disabled",
+				required: false
+			}]
+		}]
+	}
+});
 const DEFAULT_DEBOUNCE_TIME = 300;
-
-const SCROLL_LOCK_INSTANCE_IDENTIFIER = 'scroll_lock_instance_';
-
-const PALETTE_NAMES = ['orange', 'purple', 'red', 'green', 'danger', 'success', 'information', 'neutral'];
-const SHADE_NUMBERS = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 1000];
-const TOKEN_PREFIX = 'bx';
-const TOKEN_DELIMITER = '-';
-const TOKEN_COLOR_DELIMITER = 'color';
-const FALLBACK_COLOR = '#000000';
+const SCROLL_LOCK_INSTANCE_IDENTIFIER = "scroll_lock_instance_";
+const PALETTE_NAMES = [
+	"orange",
+	"purple",
+	"red",
+	"green",
+	"danger",
+	"success",
+	"information",
+	"neutral"
+];
+const SHADE_NUMBERS = [
+	50,
+	100,
+	200,
+	300,
+	400,
+	500,
+	600,
+	700,
+	800,
+	900,
+	1e3
+];
+const TOKEN_PREFIX = "bx";
+const TOKEN_DELIMITER = "-";
+const TOKEN_COLOR_DELIMITER = "color";
+const FALLBACK_COLOR = "#000000";
 const SEMANTIC_PAIRS = {
-    'bg-canvas': 'text-primary',
-    'bg-surface': 'text-primary',
-    'bg-surface-alt': 'text-primary',
-    'bg-element': 'text-primary',
-    'bg-element-hover': 'text-primary',
-    'text-heading': 'bg-element',
-    'text-primary': 'bg-element',
-    'text-secondary': 'bg-element',
-    'text-brand': 'bg-surface',
-    'text-inverse': 'primary',
-    'on-primary': 'primary',
-    primary: 'primary-subtle',
-    'primary-hover': 'on-primary',
-    'primary-active': 'on-primary',
-    'primary-subtle': 'text-primary',
-    'border-subtle': 'bg-surface',
-    'border-default': 'bg-surface',
-    'border-strong': 'bg-surface',
-    'border-brand': 'bg-surface',
-    'bg-info': 'text-info',
-    'bg-info-active': 'text-info',
-    'bg-info-hover': 'text-info',
-    'bg-info-disabled': 'border-info',
-    'bg-info-subtle': 'border-info',
-    'border-info': 'bg-info',
-    'text-info': 'bg-info',
-    'bg-success': 'text-success',
-    'bg-success-active': 'text-success',
-    'bg-success-hover': 'text-success',
-    'bg-success-disabled': 'border-success',
-    'bg-success-subtle': 'border-success',
-    'border-success': 'bg-success',
-    'text-success': 'bg-success',
-    'bg-warn': 'text-warn',
-    'bg-warn-active': 'text-warn',
-    'bg-warn-hover': 'text-warn',
-    'bg-warn-disabled': 'border-warn',
-    'bg-warn-subtle': 'border-warn',
-    'border-warn': 'bg-warn',
-    'text-warn': 'bg-warn',
-    'bg-danger': 'text-danger',
-    'bg-danger-active': 'text-danger',
-    'bg-danger-hover': 'text-danger',
-    'bg-danger-disabled': 'border-danger',
-    'bg-danger-subtle': 'border-danger',
-    'border-danger': 'bg-danger',
-    'text-danger': 'bg-danger',
-    'scroll-bg': 'bg-surface',
-    'scroll-thumb': 'scroll-bg',
-    'scroll-thumb-hover': 'scroll-bg'
+	"bg-canvas": "text-primary",
+	"bg-surface": "text-primary",
+	"bg-surface-alt": "text-primary",
+	"bg-element": "text-primary",
+	"bg-element-hover": "text-primary",
+	"text-heading": "bg-element",
+	"text-primary": "bg-element",
+	"text-secondary": "bg-element",
+	"text-brand": "bg-surface",
+	"text-inverse": "primary",
+	"on-primary": "primary",
+	primary: "primary-subtle",
+	"primary-hover": "on-primary",
+	"primary-active": "on-primary",
+	"primary-subtle": "text-primary",
+	"border-subtle": "bg-surface",
+	"border-default": "bg-surface",
+	"border-strong": "bg-surface",
+	"border-brand": "bg-surface",
+	"bg-info": "text-info",
+	"bg-info-active": "text-info",
+	"bg-info-hover": "text-info",
+	"bg-info-disabled": "border-info",
+	"bg-info-subtle": "border-info",
+	"border-info": "bg-info",
+	"text-info": "bg-info",
+	"bg-success": "text-success",
+	"bg-success-active": "text-success",
+	"bg-success-hover": "text-success",
+	"bg-success-disabled": "border-success",
+	"bg-success-subtle": "border-success",
+	"border-success": "bg-success",
+	"text-success": "bg-success",
+	"bg-warn": "text-warn",
+	"bg-warn-active": "text-warn",
+	"bg-warn-hover": "text-warn",
+	"bg-warn-disabled": "border-warn",
+	"bg-warn-subtle": "border-warn",
+	"border-warn": "bg-warn",
+	"text-warn": "bg-warn",
+	"bg-danger": "text-danger",
+	"bg-danger-active": "text-danger",
+	"bg-danger-hover": "text-danger",
+	"bg-danger-disabled": "border-danger",
+	"bg-danger-subtle": "border-danger",
+	"border-danger": "bg-danger",
+	"text-danger": "bg-danger",
+	"scroll-bg": "bg-surface",
+	"scroll-thumb": "scroll-bg",
+	"scroll-thumb-hover": "scroll-bg"
 };
-
-// THIS FILE IS AUTO-GENERATED. DO NOT EDIT DIRECTLY.
-// Update the $required-theme-keys in the _theme-engine.scss file instead.
-
-const BX_I18N = new InjectionToken('BX_I18N');
-
-/**
- * Type guard to check if a ResolvableText is an object with a 'key' property, indicating it's a translation key rather than a plain string.
-*/
+const BX_I18N = new InjectionToken("BX_I18N");
 function isTextWithKey(value) {
-    return typeof value === 'object' && value !== null && 'key' in value;
+	return typeof value === "object" && value !== null && "key" in value;
 }
-
-/**
- * Type Guard: Detects if a token is a static palette shade (e.g., 'orange-500')
- */
 function isPaletteToken(token) {
-    return /-\d+$/.test(token);
+	return /-\d+$/.test(token);
 }
-/**
- * Type Guard: Detects if the provided color is a ThemedColor configuration object.
- */
 function isThemedColor(color) {
-    return color !== null && typeof color === 'object' && 'light' in color;
+	return color !== null && typeof color === "object" && "light" in color;
 }
-/**
- * Returns the correct CSS variable string based on the token type.
- */
 function resolveTokenToCssVar(token) {
-    if (isPaletteToken(token)) {
-        return `var(--${TOKEN_PREFIX}${TOKEN_DELIMITER}${TOKEN_COLOR_DELIMITER}${TOKEN_DELIMITER}${token})`;
-    }
-    else {
-        return `var(--${TOKEN_PREFIX}${TOKEN_DELIMITER}${token})`;
-    }
+	if (isPaletteToken(token)) return `var(--bx-${TOKEN_COLOR_DELIMITER}-${token})`;
+	else return `var(--bx-${token})`;
 }
-/**
- * Smartly resolves the complementary background token.
- */
 function getComplementaryToken(token) {
-    if (!isPaletteToken(token)) {
-        return SEMANTIC_PAIRS[token] || 'surface';
-    }
-    const parts = token.split(TOKEN_DELIMITER);
-    const shade = parts.pop();
-    const palette = parts.join(TOKEN_DELIMITER);
-    const shadeNum = parseInt(shade || '500', 10);
-    const bgShade = shadeNum > 400 ? 50 : 900;
-    return `${palette}-${bgShade}`;
+	if (!isPaletteToken(token)) return SEMANTIC_PAIRS[token] || "surface";
+	const parts = token.split("-");
+	const shade = parts.pop();
+	return `${parts.join("-")}-${parseInt(shade || "500", 10) > 400 ? 50 : 900}`;
 }
-/**
- * Provides the inverted value of a given token color
- */
 function invertPaletteToken(token) {
-    const parts = token.split(TOKEN_DELIMITER);
-    if (parts.length < 2)
-        return token;
-    const shadeStr = parts.pop();
-    const base = parts.join(TOKEN_DELIMITER);
-    const shade = Number(shadeStr);
-    if (isNaN(shade))
-        return token;
-    let invertedShade;
-    if (shade === 50)
-        invertedShade = 900;
-    else if (shade === 1000)
-        invertedShade = 50;
-    else
-        invertedShade = 1000 - shade;
-    const finalShade = SHADE_NUMBERS.includes(invertedShade) ? invertedShade : shade;
-    return `${base}-${finalShade}`;
+	const parts = token.split("-");
+	if (parts.length < 2) return token;
+	const shadeStr = parts.pop();
+	const base = parts.join("-");
+	const shade = Number(shadeStr);
+	if (isNaN(shade)) return token;
+	let invertedShade;
+	if (shade === 50) invertedShade = 900;
+	else if (shade === 1e3) invertedShade = 50;
+	else invertedShade = 1e3 - shade;
+	return `${base}-${SHADE_NUMBERS.includes(invertedShade) ? invertedShade : shade}`;
 }
-
 function uuidv4() {
-    return '10000000-1000-4000-8000-100000000000'.replace(/[018]/g, (c) => (+c ^ (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (+c / 4)))).toString(16));
+	return "10000000-1000-4000-8000-100000000000".replace(/[018]/g, (c) => (+c ^ crypto.getRandomValues(/* @__PURE__ */ new Uint8Array(1))[0] & 15 >> +c / 4).toString(16));
 }
+function inheritOverlayTheme(source, pane) {
+	const win = source.ownerDocument.defaultView;
+	if (!win) return () => {};
+	const copied = /* @__PURE__ */ new Set();
+	const refresh = () => {
+		const styles = win.getComputedStyle(source);
+		const current = /* @__PURE__ */ new Set();
+		for (let index = 0; index < styles.length; index++) {
+			const property = styles.item(index);
+			if (property.startsWith("--bx-") && !property.startsWith("--bx-glass-")) {
+				pane.style.setProperty(property, styles.getPropertyValue(property));
+				current.add(property);
+			}
+		}
+		for (const property of copied) if (!current.has(property)) pane.style.removeProperty(property);
+		copied.clear();
+		current.forEach((property) => copied.add(property));
+		pane.style.setProperty("--bx-glass-surface", "var(--bx-bg-surface)");
+		pane.style.setProperty("--bx-glass-text", "var(--bx-text-primary)");
+		pane.style.setProperty("--bx-glass-edge", "var(--bx-border-subtle)");
+		pane.style.setProperty("--bx-glass-accent", "var(--bx-primary)");
+		pane.classList.toggle("bx-high-contrast-scope", !!source.closest(".high-contrast, .bx-high-contrast-scope"));
+		pane.style.color = "var(--bx-text-primary)";
+		pane.style.fontFamily = styles.fontFamily;
+		pane.style.colorScheme = styles.colorScheme;
+	};
+	refresh();
+	const observer = new MutationObserver(refresh);
+	observer.observe(source, {
+		attributes: true,
+		attributeFilter: ["class", "data-theme"]
+	});
+	for (let scope = source.parentElement; scope; scope = scope.parentElement) observer.observe(scope, {
+		attributes: true,
+		attributeFilter: [
+			"class",
+			"style",
+			"data-theme"
+		]
+	});
+	return () => observer.disconnect();
+}
+export { BREAKPOINTS, BX_I18N, BxA11yService, BxBaseControl, BxOverlayPositionService, BxShortcutService, DEFAULT_APPEARANCE_CONFIG, DEFAULT_DEBOUNCE_TIME, DesktopOS, DeviceTypeService, FALLBACK_COLOR, MobileOS, PALETTE_NAMES, SCROLL_LOCK_INSTANCE_IDENTIFIER, SEMANTIC_PAIRS, SHADE_NUMBERS, ScrollLockService, THEME_PALETTES, TOKEN_COLOR_DELIMITER, TOKEN_DELIMITER, TOKEN_PREFIX, ThemingService, WindowDimensionsService, getComplementaryToken, inheritOverlayTheme, invertPaletteToken, isOSShortcut, isPaletteToken, isTextWithKey, isThemedColor, resolveTokenToCssVar, uuidv4 };
 
-/*
- * Public API Surface of core
- */
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { BREAKPOINTS, BX_I18N, BxA11yService, BxBaseControl, BxOverlayPositionService, BxShortcutService, DEFAULT_DEBOUNCE_TIME, DesktopOS, DeviceTypeService, FALLBACK_COLOR, MobileOS, PALETTE_NAMES, SCROLL_LOCK_INSTANCE_IDENTIFIER, SEMANTIC_PAIRS, SHADE_NUMBERS, ScrollLockService, TOKEN_COLOR_DELIMITER, TOKEN_DELIMITER, TOKEN_PREFIX, ThemingService, WindowDimensionsService, getComplementaryToken, invertPaletteToken, isOSShortcut, isPaletteToken, isTextWithKey, isThemedColor, resolveTokenToCssVar, uuidv4 };
-//# sourceMappingURL=filip.mazev-blocks-core.mjs.map
+//# sourceMappingURL=filip.mazev-blocks-core.mjs.map