@hyalo/angular 0.1.0 → 0.3.1

package/fesm2022/hyalo-angular-core.mjs

@@ -0,0 +1,424 @@
+import * as i0 from "@angular/core";
+import { DOCUMENT, DestroyRef, Directive, ElementRef, Injectable, InjectionToken, PLATFORM_ID, afterNextRender, afterRenderEffect, booleanAttribute, computed, effect, inject, input, signal } from "@angular/core";
+import { FocusMonitor, _IdGenerator } from "@angular/cdk/a11y";
+import { isPlatformBrowser } from "@angular/common";
+const DEFAULTS = {
+	material: "frosted",
+	size: "md",
+	tone: "primary"
+};
+const HY_CONFIG = new InjectionToken("HY_CONFIG", {
+	providedIn: "root",
+	factory: () => DEFAULTS
+});
+function provideHyalo(config = {}) {
+	return {
+		provide: HY_CONFIG,
+		useFactory: () => {
+			return {
+				...inject(HY_CONFIG, {
+					skipSelf: true,
+					optional: true
+				}) ?? DEFAULTS,
+				...config
+			};
+		}
+	};
+}
+function injectId(prefix) {
+	return inject(_IdGenerator).getId(`hy-${prefix}-`);
+}
+function injectIsBrowser() {
+	return isPlatformBrowser(inject(PLATFORM_ID));
+}
+function matchesMedia(query) {
+	return typeof matchMedia === "function" && matchMedia(query).matches;
+}
+function detectFidelity(nav) {
+	if (nav.connection?.saveData) return "low";
+	const memory = nav.deviceMemory ?? 8, cores = nav.hardwareConcurrency ?? 8;
+	if (memory <= 2 || cores <= 2) return "low";
+	if (memory <= 4 || cores <= 4 || matchesMedia("(pointer: coarse)")) return "medium";
+	return "high";
+}
+var HyFidelity = class HyFidelity {
+	config = inject(HY_CONFIG);
+	document = inject(DOCUMENT);
+	detectedTier = signal("medium", ...ngDevMode ? [{ debugName: "detectedTier" }] : /* istanbul ignore next */ []);
+	selectedTier = signal(this.config.fidelity ?? null, ...ngDevMode ? [{ debugName: "selectedTier" }] : /* istanbul ignore next */ []);
+	detected = this.detectedTier.asReadonly();
+	override = this.selectedTier.asReadonly();
+	tier = computed(() => this.selectedTier() ?? this.detectedTier(), ...ngDevMode ? [{ debugName: "tier" }] : /* istanbul ignore next */ []);
+	constructor() {
+		if (!injectIsBrowser()) return;
+		afterNextRender(() => this.detectedTier.set(detectFidelity(navigator)));
+		effect(() => this.document.documentElement.setAttribute("data-hy-fidelity", this.tier()));
+	}
+	setTier(tier) {
+		this.selectedTier.set(tier);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyFidelity,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyFidelity,
+		providedIn: "root"
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyFidelity,
+	decorators: [{
+		type: Injectable,
+		args: [{ providedIn: "root" }]
+	}],
+	ctorParameters: () => []
+});
+var HyAppearance = class HyAppearance {
+	material = signal(null, ...ngDevMode ? [{ debugName: "material" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyAppearance,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyAppearance,
+		providedIn: "root"
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyAppearance,
+	decorators: [{
+		type: Injectable,
+		args: [{ providedIn: "root" }]
+	}]
+});
+var HyLocale = class HyLocale {
+	locale = signal(inject(HY_CONFIG).locale ?? "en", ...ngDevMode ? [{ debugName: "locale" }] : /* istanbul ignore next */ []);
+	setLocale(value) {
+		this.locale.set(Intl.getCanonicalLocales(value)[0] ?? "en");
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyLocale,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyLocale,
+		providedIn: "root"
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyLocale,
+	decorators: [{
+		type: Injectable,
+		args: [{ providedIn: "root" }]
+	}]
+});
+var HyMaterialDirective = class HyMaterialDirective {
+	config = inject(HY_CONFIG);
+	appearance = inject(HyAppearance);
+	fidelity = inject(HyFidelity);
+	material = input(void 0, {
+		...ngDevMode ? { debugName: "material" } : /* istanbul ignore next */ {},
+		alias: "hyMaterial"
+	});
+	thickness = input("regular", ...ngDevMode ? [{ debugName: "thickness" }] : /* istanbul ignore next */ []);
+	resolved = computed(() => {
+		if (this.fidelity.tier() === "low") return "solid";
+		return this.appearance.material() ?? (this.material() || this.config.material);
+	}, ...ngDevMode ? [{ debugName: "resolved" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyMaterialDirective,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Directive
+	});
+	static ɵdir = i0.ɵɵngDeclareDirective({
+		minVersion: "17.1.0",
+		version: "22.2.3",
+		type: HyMaterialDirective,
+		isStandalone: true,
+		selector: "[hyMaterial]",
+		inputs: {
+			material: {
+				classPropertyName: "material",
+				publicName: "hyMaterial",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			thickness: {
+				classPropertyName: "thickness",
+				publicName: "thickness",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: {
+			properties: {
+				"attr.data-material": "resolved()",
+				"attr.data-thickness": "thickness() === \"regular\" ? null : thickness()"
+			},
+			classAttribute: "hy-glass"
+		},
+		ngImport: i0
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyMaterialDirective,
+	decorators: [{
+		type: Directive,
+		args: [{
+			selector: "[hyMaterial]",
+			host: {
+				class: "hy-glass",
+				"[attr.data-material]": "resolved()",
+				"[attr.data-thickness]": "thickness() === \"regular\" ? null : thickness()"
+			}
+		}]
+	}],
+	propDecorators: {
+		material: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "hyMaterial",
+				required: false
+			}]
+		}],
+		thickness: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "thickness",
+				required: false
+			}]
+		}]
+	}
+});
+var HyInteractive = class HyInteractive {
+	host = inject(ElementRef);
+	focusMonitor = inject(FocusMonitor);
+	hovered = signal(false, ...ngDevMode ? [{ debugName: "hovered" }] : /* istanbul ignore next */ []);
+	pressed = signal(false, ...ngDevMode ? [{ debugName: "pressed" }] : /* istanbul ignore next */ []);
+	focusVisible = signal(false, ...ngDevMode ? [{ debugName: "focusVisible" }] : /* istanbul ignore next */ []);
+	constructor() {
+		afterNextRender(() => {
+			this.focusMonitor.monitor(this.host).subscribe((origin) => {
+				this.focusVisible.set(origin === "keyboard");
+			});
+		});
+		inject(DestroyRef).onDestroy(() => this.focusMonitor.stopMonitoring(this.host));
+	}
+	onEnter(event) {
+		if (event.pointerType !== "touch") this.hovered.set(true);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyInteractive,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Directive
+	});
+	static ɵdir = i0.ɵɵngDeclareDirective({
+		minVersion: "14.0.0",
+		version: "22.2.3",
+		type: HyInteractive,
+		isStandalone: true,
+		selector: "[hyInteractive]",
+		host: {
+			listeners: {
+				"pointerenter": "onEnter($event)",
+				"pointerleave": "hovered.set(false); pressed.set(false)",
+				"pointerdown": "pressed.set(true)",
+				"pointerup": "pressed.set(false)",
+				"pointercancel": "pressed.set(false)"
+			},
+			properties: {
+				"attr.data-hover": "hovered() || null",
+				"attr.data-press": "pressed() || null",
+				"attr.data-focus-visible": "focusVisible() || null"
+			}
+		},
+		ngImport: i0
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyInteractive,
+	decorators: [{
+		type: Directive,
+		args: [{
+			selector: "[hyInteractive]",
+			host: {
+				"[attr.data-hover]": "hovered() || null",
+				"[attr.data-press]": "pressed() || null",
+				"[attr.data-focus-visible]": "focusVisible() || null",
+				"(pointerenter)": "onEnter($event)",
+				"(pointerleave)": "hovered.set(false); pressed.set(false)",
+				"(pointerdown)": "pressed.set(true)",
+				"(pointerup)": "pressed.set(false)",
+				"(pointercancel)": "pressed.set(false)"
+			}
+		}]
+	}],
+	ctorParameters: () => []
+});
+function trackIndicator(container, selected) {
+	const ready = signal(false, ...ngDevMode ? [{ debugName: "ready" }] : /* istanbul ignore next */ []);
+	const size = signal(0, ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
+	const destroyRef = inject(DestroyRef);
+	let frame = 0;
+	destroyRef.onDestroy(() => {
+		if (frame) cancelAnimationFrame(frame);
+	});
+	afterNextRender(() => {
+		const row = container()?.nativeElement;
+		if (!row || typeof ResizeObserver !== "function") return;
+		const observer = new ResizeObserver(() => size.update((v) => v + 1));
+		observer.observe(row);
+		destroyRef.onDestroy(() => observer.disconnect());
+	});
+	afterRenderEffect({
+		earlyRead: () => {
+			size();
+			const row = container()?.nativeElement;
+			const item = selected();
+			if (!row || !item) return null;
+			const rowRect = row.getBoundingClientRect();
+			const rect = item.getBoundingClientRect();
+			const scale = row.offsetWidth ? rowRect.width / row.offsetWidth : 1;
+			return {
+				row,
+				x: (rect.left - rowRect.left) / scale + row.scrollLeft,
+				size: rect.width / scale
+			};
+		},
+		write: (measured) => {
+			const m = measured();
+			if (!m) return;
+			m.row.style.setProperty("--hy-ind-x", `${m.x}px`);
+			m.row.style.setProperty("--hy-ind-size", `${m.size}px`);
+			if (!ready() && !frame) frame = requestAnimationFrame(() => {
+				frame = 0;
+				ready.set(true);
+			});
+		}
+	});
+	return ready.asReadonly();
+}
+function normalizeDigits(value) {
+	return value.replace(/[\u0660-\u0669\u06f0-\u06f9]/gu, (digit) => String(digit.charCodeAt(0) - (digit.charCodeAt(0) >= 1776 ? 1776 : 1632)));
+}
+var HyDigits = class HyDigits {
+	hyDigits = input(true, {
+		...ngDevMode ? { debugName: "hyDigits" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	el = inject(ElementRef).nativeElement;
+	normalize(event) {
+		if (!this.hyDigits() || "isComposing" in event && event.isComposing) return;
+		const before = this.el.value;
+		const after = normalizeDigits(before);
+		if (before === after) return;
+		const start = this.el.selectionStart, end = this.el.selectionEnd;
+		this.el.value = after;
+		if (start !== null && end !== null) this.el.setSelectionRange(start, end);
+		this.el.dispatchEvent(new Event("input", { bubbles: true }));
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyDigits,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Directive
+	});
+	static ɵdir = i0.ɵɵngDeclareDirective({
+		minVersion: "17.1.0",
+		version: "22.2.3",
+		type: HyDigits,
+		isStandalone: true,
+		selector: "input[hyDigits],textarea[hyDigits]",
+		inputs: { hyDigits: {
+			classPropertyName: "hyDigits",
+			publicName: "hyDigits",
+			isSignal: true,
+			isRequired: false,
+			transformFunction: null
+		} },
+		host: { listeners: {
+			"input": "normalize($event)",
+			"compositionend": "normalize($event)"
+		} },
+		ngImport: i0
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyDigits,
+	decorators: [{
+		type: Directive,
+		args: [{
+			selector: "input[hyDigits],textarea[hyDigits]",
+			host: {
+				"(input)": "normalize($event)",
+				"(compositionend)": "normalize($event)"
+			}
+		}]
+	}],
+	propDecorators: { hyDigits: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "hyDigits",
+			required: false
+		}]
+	}] }
+});
+function normalizeSearch(value, locale) {
+	return value.normalize("NFKD").replace(/[\u0300-\u036f]/gu, "").replace(/\u064a/gu, "ی").replace(/\u0643/gu, "ک").toLocaleLowerCase(locale);
+}
+export { HY_CONFIG, HyAppearance, HyDigits, HyFidelity, HyInteractive, HyLocale, HyMaterialDirective, detectFidelity, injectId, normalizeDigits, normalizeSearch, provideHyalo, injectIsBrowser as ɵinjectIsBrowser, matchesMedia as ɵmatchesMedia, trackIndicator as ɵtrackIndicator };
+
+//# sourceMappingURL=hyalo-angular-core.mjs.map

package/fesm2022/hyalo-angular-core.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"hyalo-angular-core.mjs","names":[],"sources":["../../../projects/hyalo/core/lib/core/config.ts","../../../projects/hyalo/core/lib/core/ids.ts","../../../projects/hyalo/core/lib/core/platform.ts","../../../projects/hyalo/core/lib/fidelity/fidelity.ts","../../../projects/hyalo/core/appearance.ts","../../../projects/hyalo/core/lib/material/material.ts","../../../projects/hyalo/core/lib/interaction/state.ts","../../../projects/hyalo/core/lib/core/indicator.ts","../../../projects/hyalo/core/digits.ts","../../../projects/hyalo/core/search.ts"],"sourcesContent":["import { InjectionToken, Provider, inject } from '@angular/core';\r\nimport type { HyFidelityTier, HyMaterial, HySize, HyTone } from './axes';\r\nimport type { HyGsapLoader } from './gsap';\r\n\r\n/** Global defaults read by every Hyalo component. */\r\nexport interface HyConfig {\r\n  readonly locale?: string;\r\n  /** Default material for glass surfaces. */\r\n  readonly material: HyMaterial;\r\n  /** Default control size. */\r\n  readonly size: HySize;\r\n  /** Default tone for buttons and other coloured controls. */\r\n  readonly tone: HyTone;\r\n  /**\r\n   * Forces a fidelity tier instead of detecting it. Handy for tests,\r\n   * screenshots and low-end kiosks.\r\n   */\r\n  readonly fidelity?: HyFidelityTier;\r\n  /**\r\n   * Loads GSAP on demand. Without it, Hyalo falls back to CSS transitions,\r\n   * so GSAP stays an optional dependency.\r\n   *\r\n   * ```ts\r\n   * provideHyalo({ gsap: () => import('gsap').then((m) => m.gsap) })\r\n   * ```\r\n   */\r\n  readonly gsap?: HyGsapLoader;\r\n  /**\r\n   * Maps a palette name to its stylesheet URL for HyPalette. Defaults to\r\n   * `palette-<name>.css`, which is what a non-injected `bundleName` entry\r\n   * in angular.json produces.\r\n   */\r\n  readonly paletteHref?: (name: string) => string;\r\n}\r\n\r\nconst DEFAULTS: HyConfig = {\r\n  material: 'frosted',\r\n  size: 'md',\r\n  tone: 'primary',\r\n};\r\n\r\n/** Resolved Hyalo configuration. Use {@link provideHyalo} to change it. */\r\nexport const HY_CONFIG = new InjectionToken<HyConfig>('HY_CONFIG', {\r\n  providedIn: 'root',\r\n  factory: () => DEFAULTS,\r\n});\r\n\r\n/**\r\n * Sets Hyalo defaults. Works in `app.config.ts` and in a component's\r\n * `providers`, where it merges with whatever the parent injector provides.\r\n * That makes it easy to switch one section of a page to `solid`, for example.\r\n */\r\nexport function provideHyalo(config: Partial<HyConfig> = {}): Provider {\r\n  return {\r\n    provide: HY_CONFIG,\r\n    useFactory: (): HyConfig => {\r\n      const parent = inject(HY_CONFIG, { skipSelf: true, optional: true }) ?? DEFAULTS;\r\n      return { ...parent, ...config };\r\n    },\r\n  };\r\n}\r\n","import { inject } from '@angular/core';\r\nimport { _IdGenerator } from '@angular/cdk/a11y';\r\n\r\n/**\r\n * Returns a unique id with the given prefix. The counter is per application,\r\n * so the server and the client produce the same ids during hydration.\r\n */\r\nexport function injectId(prefix: string): string {\r\n  return inject(_IdGenerator).getId(`hy-${prefix}-`);\r\n}\r\n","import { PLATFORM_ID, inject } from '@angular/core';\r\nimport { isPlatformBrowser } from '@angular/common';\r\n\r\n/** True in the browser, false during server rendering. Call in an injection context. */\r\nexport function injectIsBrowser(): boolean {\r\n  return isPlatformBrowser(inject(PLATFORM_ID));\r\n}\r\n\r\n/** Reads a media query once. Always false on the server. */\r\nexport function matchesMedia(query: string): boolean {\r\n  return typeof matchMedia === 'function' && matchMedia(query).matches;\r\n}\r\n","import {\r\n  DOCUMENT,\r\n  Injectable,\r\n  afterNextRender,\r\n  computed,\r\n  effect,\r\n  inject,\r\n  signal,\r\n} from '@angular/core';\r\nimport { HY_CONFIG } from '../core/config';\r\nimport type { HyFidelityTier } from '../core/axes';\r\nimport { injectIsBrowser, matchesMedia } from '../core/platform';\r\nexport type { HyFidelityTier };\r\ninterface NavigatorHints {\r\n  readonly deviceMemory?: number;\r\n  readonly hardwareConcurrency?: number;\r\n  readonly connection?: { readonly saveData?: boolean };\r\n}\r\nexport function detectFidelity(nav: NavigatorHints): HyFidelityTier {\r\n  if (nav.connection?.saveData) return 'low';\r\n  const memory = nav.deviceMemory ?? 8,\r\n    cores = nav.hardwareConcurrency ?? 8;\r\n  if (memory <= 2 || cores <= 2) return 'low';\r\n  if (memory <= 4 || cores <= 4 || matchesMedia('(pointer: coarse)')) return 'medium';\r\n  return 'high';\r\n}\r\n@Injectable({ providedIn: 'root' })\r\nexport class HyFidelity {\r\n  private readonly config = inject(HY_CONFIG);\r\n  private readonly document = inject(DOCUMENT);\r\n  private readonly detectedTier = signal<HyFidelityTier>('medium');\r\n  private readonly selectedTier = signal<HyFidelityTier | null>(this.config.fidelity ?? null);\r\n  readonly detected = this.detectedTier.asReadonly();\r\n  readonly override = this.selectedTier.asReadonly();\r\n  readonly tier = computed(() => this.selectedTier() ?? this.detectedTier());\r\n  constructor() {\r\n    if (!injectIsBrowser()) return;\r\n    afterNextRender(() => this.detectedTier.set(detectFidelity(navigator as NavigatorHints)));\r\n    effect(() => this.document.documentElement.setAttribute('data-hy-fidelity', this.tier()));\r\n  }\r\n  setTier(tier: HyFidelityTier | null): void {\r\n    this.selectedTier.set(tier);\r\n  }\r\n}\r\n","import { HY_CONFIG } from './lib/core/config';\r\nimport { Injectable, inject, signal } from '@angular/core';\r\nimport type { HyMaterial } from './lib/core/axes';\r\n\r\n/** Scoped preview override; null preserves each component's own material choice. */\r\n@Injectable({ providedIn: 'root' })\r\nexport class HyAppearance {\r\n  readonly material = signal<HyMaterial | null>(null);\r\n}\r\n\r\n@Injectable({ providedIn: 'root' })\r\nexport class HyLocale {\r\n  readonly locale = signal(inject(HY_CONFIG).locale ?? 'en');\r\n  setLocale(value: string): void {\r\n    this.locale.set(Intl.getCanonicalLocales(value)[0] ?? 'en');\r\n  }\r\n}\r\n","import { Directive, computed, inject, input } from '@angular/core';\r\nimport { HY_CONFIG } from '../core/config';\r\nimport type { HyMaterial, HyThickness } from '../core/axes';\r\nimport { HyFidelity } from '../fidelity/fidelity';\r\nimport { HyAppearance } from '../../appearance';\r\n\r\n/**\r\n * Turns any element into a glass surface.\r\n *\r\n * ```html\r\n * <aside hyMaterial=\"clear\">...</aside>\r\n * <section hyMaterial thickness=\"thick\">...</section>\r\n * ```\r\n *\r\n * The look lives in CSS (`.hy-glass[data-material]`), so effects stay cheap\r\n * and themeable. On the low fidelity tier every material renders as `solid`,\r\n * because backdrop blur is the most expensive thing on the page.\r\n */\r\n@Directive({\r\n  selector: '[hyMaterial]',\r\n  host: {\r\n    class: 'hy-glass',\r\n    '[attr.data-material]': 'resolved()',\r\n    '[attr.data-thickness]': 'thickness() === \"regular\" ? null : thickness()',\r\n  },\r\n})\r\nexport class HyMaterialDirective {\r\n  private readonly config = inject(HY_CONFIG);\r\n  private readonly appearance = inject(HyAppearance);\r\n  private readonly fidelity = inject(HyFidelity);\r\n\r\n  /** The material. An empty attribute uses the configured default. */\r\n  readonly material = input<HyMaterial | '' | undefined>(undefined, { alias: 'hyMaterial' });\r\n  /** How heavy the glass reads. Use `thick` for large surfaces. */\r\n  readonly thickness = input<HyThickness>('regular');\r\n\r\n  /** The material that is actually rendered after fidelity is applied. */\r\n  readonly resolved = computed<HyMaterial>(() => {\r\n    if (this.fidelity.tier() === 'low') return 'solid';\r\n    return this.appearance.material() ?? (this.material() || this.config.material);\r\n  });\r\n}\r\n","import { Directive, DestroyRef, ElementRef, afterNextRender, inject, signal } from '@angular/core';\r\nimport { FocusMonitor } from '@angular/cdk/a11y';\r\n\r\n/**\r\n * Mirrors interaction state to data attributes so glass effects can stay in\r\n * CSS: `data-hover`, `data-press` and `data-focus-visible`.\r\n *\r\n * Hover is only reported for mouse and pen, so touch screens never get a\r\n * stuck hover state.\r\n */\r\n@Directive({\r\n  selector: '[hyInteractive]',\r\n  host: {\r\n    '[attr.data-hover]': 'hovered() || null',\r\n    '[attr.data-press]': 'pressed() || null',\r\n    '[attr.data-focus-visible]': 'focusVisible() || null',\r\n    '(pointerenter)': 'onEnter($event)',\r\n    '(pointerleave)': 'hovered.set(false); pressed.set(false)',\r\n    '(pointerdown)': 'pressed.set(true)',\r\n    '(pointerup)': 'pressed.set(false)',\r\n    '(pointercancel)': 'pressed.set(false)',\r\n  },\r\n})\r\nexport class HyInteractive {\r\n  private readonly host = inject<ElementRef<HTMLElement>>(ElementRef);\r\n  private readonly focusMonitor = inject(FocusMonitor);\r\n\r\n  protected readonly hovered = signal(false);\r\n  protected readonly pressed = signal(false);\r\n  protected readonly focusVisible = signal(false);\r\n\r\n  constructor() {\r\n    afterNextRender(() => {\r\n      this.focusMonitor.monitor(this.host).subscribe((origin) => {\r\n        this.focusVisible.set(origin === 'keyboard');\r\n      });\r\n    });\r\n    inject(DestroyRef).onDestroy(() => this.focusMonitor.stopMonitoring(this.host));\r\n  }\r\n\r\n  protected onEnter(event: PointerEvent): void {\r\n    if (event.pointerType !== 'touch') this.hovered.set(true);\r\n  }\r\n}\r\n","import {\n  DestroyRef,\n  ElementRef,\n  afterNextRender,\n  afterRenderEffect,\n  inject,\n  signal,\n  type Signal,\n} from '@angular/core';\n\n/**\n * Keeps a sliding indicator under the selected item of a row by writing\n * `--hy-ind-x` and `--hy-ind-size` on the row. The offset is physical (from\n * the left edge) and the indicator is placed physically too, so the same\n * numbers work in both directions.\n *\n * Returns a signal that turns true after the first placement, so CSS can\n * enable the transition only from then on.\n */\nexport function trackIndicator(\n  container: Signal<ElementRef<HTMLElement> | undefined>,\n  selected: () => HTMLElement | null,\n): Signal<boolean> {\n  const ready = signal(false);\n  // Bumped when the row resizes, for example after web fonts load.\n  const size = signal(0);\n  const destroyRef = inject(DestroyRef);\n  let frame = 0;\n  destroyRef.onDestroy(() => {\n    if (frame) cancelAnimationFrame(frame);\n  });\n\n  afterNextRender(() => {\n    const row = container()?.nativeElement;\n    if (!row || typeof ResizeObserver !== 'function') return;\n    const observer = new ResizeObserver(() => size.update((v) => v + 1));\n    observer.observe(row);\n    destroyRef.onDestroy(() => observer.disconnect());\n  });\n\n  afterRenderEffect({\n    earlyRead: () => {\n      size();\n      const row = container()?.nativeElement;\n      const item = selected();\n      if (!row || !item) return null;\n      const rowRect = row.getBoundingClientRect();\n      const rect = item.getBoundingClientRect();\n      // Rects are in screen pixels, after any zoom or scale on an ancestor,\n      // but the custom properties are read in the row's own pixels.\n      const scale = row.offsetWidth ? rowRect.width / row.offsetWidth : 1;\n      return {\n        row,\n        x: (rect.left - rowRect.left) / scale + row.scrollLeft,\n        size: rect.width / scale,\n      };\n    },\n    write: (measured) => {\n      const m = measured();\n      if (!m) return;\n      m.row.style.setProperty('--hy-ind-x', `${m.x}px`);\n      m.row.style.setProperty('--hy-ind-size', `${m.size}px`);\n      if (!ready() && !frame)\n        frame = requestAnimationFrame(() => {\n          frame = 0;\n          ready.set(true);\n        });\n    },\n  });\n\n  return ready.asReadonly();\n}\n","import { booleanAttribute, Directive, ElementRef, inject, input } from '@angular/core';\r\n\r\nexport function normalizeDigits(value: string): string {\r\n  return value.replace(/[\\u0660-\\u0669\\u06f0-\\u06f9]/gu, (digit) =>\r\n    String(digit.charCodeAt(0) - (digit.charCodeAt(0) >= 0x06f0 ? 0x06f0 : 0x0660)),\r\n  );\r\n}\r\n\r\n/** Keeps identifier strings intact, including leading zeros; it does not parse numbers. */\r\n@Directive({\r\n  selector: 'input[hyDigits],textarea[hyDigits]',\r\n  host: {\r\n    '(input)': 'normalize($event)',\r\n    '(compositionend)': 'normalize($event)',\r\n  },\r\n})\r\nexport class HyDigits {\r\n  readonly hyDigits = input(true, { transform: booleanAttribute });\r\n  private readonly el =\r\n    inject<ElementRef<HTMLInputElement | HTMLTextAreaElement>>(ElementRef).nativeElement;\r\n  protected normalize(event: Event): void {\r\n    if (!this.hyDigits() || ('isComposing' in event && event.isComposing)) return;\r\n    const before = this.el.value;\r\n    const after = normalizeDigits(before);\r\n    if (before === after) return;\r\n    const start = this.el.selectionStart,\r\n      end = this.el.selectionEnd;\r\n    this.el.value = after;\r\n    if (start !== null && end !== null) this.el.setSelectionRange(start, end);\r\n    // Re-dispatch after normalization so every value accessor sees the canonical text.\r\n    this.el.dispatchEvent(new Event('input', { bubbles: true }));\r\n  }\r\n}\r\n","export function normalizeSearch(value: string, locale?: string): string {\r\n  return value\r\n    .normalize('NFKD')\r\n    .replace(/[\\u0300-\\u036f]/gu, '')\r\n    .replace(/\\u064a/gu, '\\u06cc')\r\n    .replace(/\\u0643/gu, '\\u06a9')\r\n    .toLocaleLowerCase(locale);\r\n}\r\n"],"mappings":"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"}

package/fesm2022/hyalo-angular-description-list.mjs

@@ -0,0 +1,57 @@
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, input } from "@angular/core";
+var HyDescriptionList = class HyDescriptionList {
+	items = input.required(...ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyDescriptionList,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.3",
+		type: HyDescriptionList,
+		isStandalone: true,
+		selector: "hy-description-list",
+		inputs: { items: {
+			classPropertyName: "items",
+			publicName: "items",
+			isSignal: true,
+			isRequired: true,
+			transformFunction: null
+		} },
+		ngImport: i0,
+		template: "<dl>\r\n  @for (item of items(); track $index) {\r\n    <div>\r\n      <dt>{{ item.term }}</dt>\r\n      <dd>{{ item.detail }}</dd>\r\n    </div>\r\n  }\r\n</dl>\r\n",
+		styles: [":host{display:block}dl{margin:0}dl>div{display:grid;grid-template-columns:minmax(7rem,1fr) minmax(0,2fr);gap:1rem;padding-block:1rem;border-block-end:1px solid var(--hy-line)}dt{color:var(--hy-ink-2)}dd{margin:0;color:var(--hy-ink);overflow-wrap:anywhere}@media(max-width:30rem){dl>div{grid-template-columns:1fr;gap:.25rem}}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyDescriptionList,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "hy-description-list",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<dl>\r\n  @for (item of items(); track $index) {\r\n    <div>\r\n      <dt>{{ item.term }}</dt>\r\n      <dd>{{ item.detail }}</dd>\r\n    </div>\r\n  }\r\n</dl>\r\n",
+			styles: [":host{display:block}dl{margin:0}dl>div{display:grid;grid-template-columns:minmax(7rem,1fr) minmax(0,2fr);gap:1rem;padding-block:1rem;border-block-end:1px solid var(--hy-line)}dt{color:var(--hy-ink-2)}dd{margin:0;color:var(--hy-ink);overflow-wrap:anywhere}@media(max-width:30rem){dl>div{grid-template-columns:1fr;gap:.25rem}}\n"]
+		}]
+	}],
+	propDecorators: { items: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "items",
+			required: true
+		}]
+	}] }
+});
+export { HyDescriptionList };
+
+//# sourceMappingURL=hyalo-angular-description-list.mjs.map

package/fesm2022/hyalo-angular-description-list.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"hyalo-angular-description-list.mjs","names":[],"sources":["../../../projects/hyalo/description-list/description-list.ts","../../../projects/hyalo/description-list/description-list.html"],"sourcesContent":["import { ChangeDetectionStrategy, Component, input } from '@angular/core';\r\nexport interface HyDescription {\r\n  readonly term: string;\r\n  readonly detail: string;\r\n}\r\n@Component({\r\n  selector: 'hy-description-list',\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  templateUrl: './description-list.html',\r\n  styleUrl: './description-list.css',\r\n})\r\nexport class HyDescriptionList {\r\n  readonly items = input.required<readonly HyDescription[]>();\r\n}\r\n","<dl>\r\n  @for (item of items(); track $index) {\r\n    <div>\r\n      <dt>{{ item.term }}</dt>\r\n      <dd>{{ item.detail }}</dd>\r\n    </div>\r\n  }\r\n</dl>\r\n"],"mappings":";;AAWA,IAAa,oBAAb,MAAa,kBAAiB;CACnB,QAAQ,MAAM,SAAoC,GAAA,YAAA,CAAA,EAAA,WAAA,QAAA,CAAA,+BAAA,CAAA,CAAA;CADhD,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAiB,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAAjB,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAiB,cAAA;EAAA,UAAA;EAAA,QAAA,EAAA,OAAA;GAAA,mBAAA;GAAA,YAAA;GAAA,UAAA;GAAA,YAAA;GAAA,mBAAA;EAAA,EAAA;EAAA,UAAA;EAAA,UCX9B;EAQA,QAAA,CAAA,wUAAA;EAAA,iBAAA,GAAA,wBAAA;CAAA,CAAA;;ADGa,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAiB,YAAA,CAAA;EAN7B,MAAA;EACW,MAAA,CAAA;GAAA,UAAA;GAAqB,iBACd,wBAAwB;GAAM,UAAA;GAAA,QAAA,CAAA,wUAAA;EAAA,CAAA"}

package/fesm2022/hyalo-angular-dialog.mjs

@@ -1,7 +1,8 @@
 import * as i0 from "@angular/core";
 import { ChangeDetectionStrategy, Component, Directive, ElementRef, Injectable, InjectionToken, Injector, afterNextRender, inject, input } from "@angular/core";
 import { filter, firstValueFrom } from "rxjs";
-import { HyFidelity, HyMotion, HySpring, HyVelocityTracker, MOTION, SPRINGS, injectId, project, rubberband } from "@hyalo/angular";
+import { HyMotion, HySpring, HyVelocityTracker, MOTION, SPRINGS, project, rubberband } from "@hyalo/angular/motion";
+import { HyFidelity, injectId } from "@hyalo/angular/core";
 import { Dialog } from "@angular/cdk/dialog";
 import { HyButton } from "@hyalo/angular/button";
 import { createGlobalPositionStrategy } from "@angular/cdk/overlay";
@@ -225,6 +226,10 @@ const HY_DIALOG_PARTS = [
 const SLOP = 10;
 const INTERACTIVE = "button, a[href], input, select, textarea, label, summary, [contenteditable], [role=\"slider\"], [tabindex]:not([tabindex=\"-1\"])";
 function driveSheet(panel, backdrop, side, host) {
+	const lifetime = new ((panel.ownerDocument.defaultView?.AbortController) ?? AbortController)();
+	let disposed = false;
+	let resize;
+	let clickTimer;
 	const vertical = side === "bottom";
 	const rtl = getComputedStyle(panel).direction === "rtl";
 	const sign = vertical ? 1 : side === "end" !== rtl ? 1 : -1;
@@ -242,13 +247,16 @@ function driveSheet(panel, backdrop, side, host) {
 	const spring = new HySpring(0, paint);
 	panel.style.translate = vertical ? "0 100%" : `${sign * 100}% 0`;
 	if (backdrop) backdrop.style.opacity = "0";
-	requestAnimationFrame(() => {
+	let enterFrame = requestAnimationFrame(() => {
+		enterFrame = 0;
 		spring.set(size());
 		spring.to(0, SPRINGS.settle);
 	});
 	let closing = false;
 	const exit = (finish) => {
-		if (panel.ownerDocument.hidden) {
+		cancelAnimationFrame(enterFrame);
+		enterFrame = 0;
+		if (disposed || panel.ownerDocument.hidden) {
 			spring.stop();
 			finish();
 			return;
@@ -264,9 +272,12 @@ function driveSheet(panel, backdrop, side, host) {
 		grabber.className = "hy-drawer__grabber";
 		grabber.setAttribute("aria-hidden", "true");
 		panel.prepend(grabber);
-		if (typeof ResizeObserver === "function") new ResizeObserver(() => {
-			panel.style.touchAction = panel.scrollHeight > panel.clientHeight + 1 ? "" : "none";
-		}).observe(panel);
+		if (typeof ResizeObserver === "function") {
+			resize = new ResizeObserver(() => {
+				panel.style.touchAction = panel.scrollHeight > panel.clientHeight + 1 ? "" : "none";
+			});
+			resize.observe(panel);
+		}
 	}
 	let press = null;
 	const tracker = new HyVelocityTracker();
@@ -304,7 +315,7 @@ function driveSheet(panel, backdrop, side, host) {
 		};
 		press = p;
 		if (spring.running) grab(p, e);
-	});
+	}, { signal: lifetime.signal });
 	panel.addEventListener("pointermove", (e) => {
 		if (!press || e.pointerId !== press.id) return;
 		const moved = along(e) - press.x;
@@ -321,22 +332,24 @@ function driveSheet(panel, backdrop, side, host) {
 		const offset = press.from + moved;
 		tracker.add(offset);
 		spring.set(offset);
-	});
+	}, { signal: lifetime.signal });
+	const swallow = (click) => {
+		click.stopPropagation();
+		click.preventDefault();
+	};
 	const release = (e) => {
 		if (!press || e.pointerId !== press.id) return;
 		const wasDragging = press.dragging;
 		press = null;
 		if (!wasDragging) return;
 		delete panel.dataset["dragging"];
-		const swallow = (click) => {
-			click.stopPropagation();
-			click.preventDefault();
-		};
 		panel.addEventListener("click", swallow, {
 			capture: true,
-			once: true
+			once: true,
+			signal: lifetime.signal
 		});
-		setTimeout(() => panel.removeEventListener("click", swallow, { capture: true }));
+		clearTimeout(clickTimer);
+		clickTimer = setTimeout(() => panel.removeEventListener("click", swallow, { capture: true }));
 		const velocity = e.type === "pointercancel" ? 0 : tracker.velocity();
 		const full = size();
 		const landing = spring.value + project(velocity);
@@ -345,9 +358,21 @@ function driveSheet(panel, backdrop, side, host) {
 		if (out && host.dismissible) host.close();
 		else spring.to(0, SPRINGS.settle);
 	};
-	panel.addEventListener("pointerup", release);
-	panel.addEventListener("pointercancel", release);
-	return exit;
+	panel.addEventListener("pointerup", release, { signal: lifetime.signal });
+	panel.addEventListener("pointercancel", release, { signal: lifetime.signal });
+	return {
+		exit,
+		destroy: () => {
+			if (disposed) return;
+			disposed = true;
+			cancelAnimationFrame(enterFrame);
+			spring.stop();
+			resize?.disconnect();
+			lifetime.abort();
+			clearTimeout(clickTimer);
+			press = null;
+		}
+	};
 }
 function openSurface(cdk, motion, fidelity, content, config, extra) {
 	let ref;
@@ -384,11 +409,15 @@ function openSurface(cdk, motion, fidelity, content, config, extra) {
 		container.classList.add("hy-glass");
 		container.dataset["material"] = fidelity.tier() === "low" ? "solid" : config.material ?? "frosted";
 		container.dataset["thickness"] = "thick";
-		if (extra.sheet && !motion.reduced()) hyRef.exit = driveSheet(container, cdkRef.overlayRef.backdropElement, extra.sheet, {
-			dismissible,
-			close: () => hyRef.close(),
-			cancelClose: () => hyRef.cancelClose()
-		});
+		if (extra.sheet && !motion.reduced()) {
+			const driver = driveSheet(container, cdkRef.overlayRef.backdropElement, extra.sheet, {
+				dismissible,
+				close: () => hyRef.close(),
+				cancelClose: () => hyRef.cancelClose()
+			});
+			hyRef.exit = driver.exit;
+			cdkRef.closed.subscribe(() => driver.destroy());
+		}
 	}
 	if (dismissible) {
 		cdkRef.backdropClick.subscribe(() => hyRef.close());