@hyalo/angular 0.0.0-stage → 0.3.1

package/fesm2022/hyalo-angular-hover-card.mjs

@@ -0,0 +1,233 @@
+import { DOCUMENT } from "@angular/common";
+import { createFlexibleConnectedPositionStrategy, createOverlayRef, createRepositionScrollStrategy } from "@angular/cdk/overlay";
+import { TemplatePortal } from "@angular/cdk/portal";
+import * as i0 from "@angular/core";
+import { DestroyRef, Directive, ElementRef, Injector, ViewContainerRef, inject, input, signal } from "@angular/core";
+import { HyFidelity, injectId } from "@hyalo/angular/core";
+import { HyHoverIntent, hyConnectedPositions } from "@hyalo/angular/overlay";
+import { take } from "rxjs";
+var HyHoverCard = class HyHoverCard {
+	content = input.required({
+		...ngDevMode ? { debugName: "content" } : /* istanbul ignore next */ {},
+		alias: "hyHoverCard"
+	});
+	hoverCardLabel = input.required(...ngDevMode ? [{ debugName: "hoverCardLabel" }] : /* istanbul ignore next */ []);
+	placement = input("top", ...ngDevMode ? [{ debugName: "placement" }] : /* istanbul ignore next */ []);
+	open = signal(false, ...ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []);
+	id = injectId("hover-card");
+	injector = inject(Injector);
+	host = inject(ElementRef);
+	container = inject(ViewContainerRef);
+	fidelity = inject(HyFidelity);
+	document = inject(DOCUMENT);
+	intent = new HyHoverIntent(this.document);
+	ref;
+	timer;
+	disposed = false;
+	suppressFocus = false;
+	focusTrigger() {
+		if (!this.suppressFocus) this.show();
+	}
+	constructor() {
+		inject(DestroyRef).onDestroy(() => {
+			this.disposed = true;
+			clearTimeout(this.timer);
+			this.intent.cancel();
+			this.ref?.dispose();
+		});
+	}
+	enter(event) {
+		this.intent.cancel();
+		if (event.pointerType === "touch") return;
+		clearTimeout(this.timer);
+		this.timer = setTimeout(() => this.show(), 250);
+	}
+	leave(event) {
+		clearTimeout(this.timer);
+		this.intent.leave(event, this.ref?.overlayElement, () => {
+			if (this.ref?.overlayElement.contains(this.document.activeElement) || this.host.nativeElement.contains(this.document.activeElement)) return;
+			this.hide();
+		});
+	}
+	focusOut(event) {
+		if (event.relatedTarget && this.ref?.overlayElement.contains(event.relatedTarget)) return;
+		this.leave();
+	}
+	escape(event) {
+		if (this.open()) {
+			event.preventDefault();
+			event.stopPropagation();
+			this.hide();
+			this.suppressFocus = true;
+			this.host.nativeElement.focus();
+			this.suppressFocus = false;
+		}
+	}
+	focusCard(event) {
+		event.preventDefault();
+		this.show();
+		const pane = this.ref?.overlayElement;
+		if (!pane) return;
+		const focusable = pane.querySelector("a[href],button:not([disabled]),input:not([disabled]),[tabindex=\"0\"]");
+		pane.tabIndex = -1;
+		(focusable ?? pane).focus();
+	}
+	show() {
+		clearTimeout(this.timer);
+		if (this.disposed || this.open()) return;
+		if (!this.ref) {
+			const position = createFlexibleConnectedPositionStrategy(this.injector, this.host).withPositions(hyConnectedPositions(this.placement(), 8)).withViewportMargin(12).withPush(true);
+			this.ref = createOverlayRef(this.injector, {
+				positionStrategy: position,
+				scrollStrategy: createRepositionScrollStrategy(this.injector),
+				panelClass: "hy-hover-card-pane"
+			});
+			const pane = this.ref.overlayElement;
+			pane.classList.add("hy-glass");
+			pane.style.cssText = "max-inline-size:min(22rem,calc(100vw - 2rem));max-block-size:70dvh;overflow:auto;padding:1.25rem;border-radius:var(--hy-radius-m);border:1px solid var(--hy-line-strong);color:var(--hy-ink)";
+			pane.id = this.id;
+			pane.setAttribute("role", "dialog");
+			pane.addEventListener("pointerenter", () => {
+				clearTimeout(this.timer);
+				this.intent.cancel();
+			});
+			pane.addEventListener("pointerleave", () => this.leave());
+			pane.addEventListener("focusout", (event) => {
+				const next = event.relatedTarget;
+				if (!next || !pane.contains(next) && !this.host.nativeElement.contains(next)) this.leave();
+			});
+			this.ref.keydownEvents().subscribe((event) => {
+				if (event.key === "Escape") this.escape(event);
+			});
+			this.ref.outsidePointerEvents().subscribe((event) => {
+				if (!this.host.nativeElement.contains(event.target)) this.hide();
+			});
+		}
+		const pane = this.ref.overlayElement;
+		pane.setAttribute("aria-label", this.hoverCardLabel());
+		pane.dataset["material"] = this.fidelity.tier() === "low" ? "solid" : "frosted";
+		pane.style.visibility = "hidden";
+		const strategy = this.ref.getConfig().positionStrategy;
+		strategy.withPositions(hyConnectedPositions(this.placement(), 8));
+		strategy.positionChanges.pipe(take(1)).subscribe(() => pane.style.removeProperty("visibility"));
+		this.open.set(true);
+		this.ref.attach(new TemplatePortal(this.content(), this.container));
+	}
+	hide() {
+		clearTimeout(this.timer);
+		this.intent.cancel();
+		this.open.set(false);
+		this.ref?.detach();
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyHoverCard,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Directive
+	});
+	static ɵdir = i0.ɵɵngDeclareDirective({
+		minVersion: "17.1.0",
+		version: "22.2.3",
+		type: HyHoverCard,
+		isStandalone: true,
+		selector: "[hyHoverCard]",
+		inputs: {
+			content: {
+				classPropertyName: "content",
+				publicName: "hyHoverCard",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			hoverCardLabel: {
+				classPropertyName: "hoverCardLabel",
+				publicName: "hoverCardLabel",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			placement: {
+				classPropertyName: "placement",
+				publicName: "placement",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: {
+			attributes: { "aria-haspopup": "dialog" },
+			listeners: {
+				"pointerenter": "enter($event)",
+				"pointerleave": "leave($event)",
+				"focusin": "focusTrigger()",
+				"focusout": "focusOut($event)",
+				"keydown.escape": "escape($event)",
+				"keydown.arrowdown": "focusCard($event)",
+				"click": "show()"
+			},
+			properties: {
+				"attr.aria-expanded": "open()",
+				"attr.aria-controls": "open()?id:null"
+			}
+		},
+		exportAs: ["hyHoverCard"],
+		ngImport: i0
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyHoverCard,
+	decorators: [{
+		type: Directive,
+		args: [{
+			selector: "[hyHoverCard]",
+			exportAs: "hyHoverCard",
+			host: {
+				"(pointerenter)": "enter($event)",
+				"(pointerleave)": "leave($event)",
+				"(focusin)": "focusTrigger()",
+				"(focusout)": "focusOut($event)",
+				"(keydown.escape)": "escape($event)",
+				"(keydown.arrowdown)": "focusCard($event)",
+				"(click)": "show()",
+				"aria-haspopup": "dialog",
+				"[attr.aria-expanded]": "open()",
+				"[attr.aria-controls]": "open()?id:null"
+			}
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		content: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "hyHoverCard",
+				required: true
+			}]
+		}],
+		hoverCardLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "hoverCardLabel",
+				required: true
+			}]
+		}],
+		placement: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "placement",
+				required: false
+			}]
+		}]
+	}
+});
+export { HyHoverCard };
+
+//# sourceMappingURL=hyalo-angular-hover-card.mjs.map

package/fesm2022/hyalo-angular-hover-card.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"hyalo-angular-hover-card.mjs","names":[],"sources":["../../../projects/hyalo/hover-card/hover-card.ts"],"sourcesContent":["import { DOCUMENT } from '@angular/common';\r\nimport {\r\n  createFlexibleConnectedPositionStrategy,\r\n  createOverlayRef,\r\n  createRepositionScrollStrategy,\r\n  type OverlayRef,\r\n} from '@angular/cdk/overlay';\r\nimport { TemplatePortal } from '@angular/cdk/portal';\r\nimport {\r\n  DestroyRef,\r\n  Directive,\r\n  ElementRef,\r\n  Injector,\r\n  TemplateRef,\r\n  ViewContainerRef,\r\n  inject,\r\n  input,\r\n  signal,\r\n} from '@angular/core';\r\nimport { HyFidelity, injectId } from '@hyalo/angular/core';\r\nimport { HyHoverIntent, hyConnectedPositions, type HyPlacement } from '@hyalo/angular/overlay';\r\nimport { take } from 'rxjs';\r\n@Directive({\r\n  selector: '[hyHoverCard]',\r\n  exportAs: 'hyHoverCard',\r\n  host: {\r\n    '(pointerenter)': 'enter($event)',\r\n    '(pointerleave)': 'leave($event)',\r\n    '(focusin)': 'focusTrigger()',\r\n    '(focusout)': 'focusOut($event)',\r\n    '(keydown.escape)': 'escape($event)',\r\n    '(keydown.arrowdown)': 'focusCard($event)',\r\n    '(click)': 'show()',\r\n    'aria-haspopup': 'dialog',\r\n    '[attr.aria-expanded]': 'open()',\r\n    '[attr.aria-controls]': 'open()?id:null',\r\n  },\r\n})\r\nexport class HyHoverCard {\r\n  readonly content = input.required<TemplateRef<unknown>>({ alias: 'hyHoverCard' });\r\n  readonly hoverCardLabel = input.required<string>();\r\n  readonly placement = input<HyPlacement>('top');\r\n  readonly open = signal(false);\r\n  protected readonly id = injectId('hover-card');\r\n  private readonly injector = inject(Injector);\r\n  private readonly host = inject<ElementRef<HTMLElement>>(ElementRef);\r\n  private readonly container = inject(ViewContainerRef);\r\n  private readonly fidelity = inject(HyFidelity);\r\n  private readonly document = inject(DOCUMENT);\r\n  private readonly intent = new HyHoverIntent(this.document);\r\n  private ref: OverlayRef | undefined;\r\n  private timer: ReturnType<typeof setTimeout> | undefined;\r\n  private disposed = false;\r\n  private suppressFocus = false;\r\n  protected focusTrigger(): void {\r\n    if (!this.suppressFocus) this.show();\r\n  }\r\n  constructor() {\r\n    inject(DestroyRef).onDestroy(() => {\r\n      this.disposed = true;\r\n      clearTimeout(this.timer);\r\n      this.intent.cancel();\r\n      this.ref?.dispose();\r\n    });\r\n  }\r\n  protected enter(event: PointerEvent): void {\r\n    this.intent.cancel();\r\n    if (event.pointerType === 'touch') return;\r\n    clearTimeout(this.timer);\r\n    this.timer = setTimeout(() => this.show(), 250);\r\n  }\r\n  protected leave(event?: PointerEvent): void {\r\n    clearTimeout(this.timer);\r\n    this.intent.leave(event, this.ref?.overlayElement, () => {\r\n      if (\r\n        this.ref?.overlayElement.contains(this.document.activeElement) ||\r\n        this.host.nativeElement.contains(this.document.activeElement)\r\n      )\r\n        return;\r\n      this.hide();\r\n    });\r\n  }\r\n  protected focusOut(event: FocusEvent): void {\r\n    if (event.relatedTarget && this.ref?.overlayElement.contains(event.relatedTarget as Node))\r\n      return;\r\n    this.leave();\r\n  }\r\n  protected escape(event: Event): void {\r\n    if (this.open()) {\r\n      event.preventDefault();\r\n      event.stopPropagation();\r\n      this.hide();\r\n      this.suppressFocus = true;\r\n      this.host.nativeElement.focus();\r\n      this.suppressFocus = false;\r\n    }\r\n  }\r\n  protected focusCard(event: Event): void {\r\n    event.preventDefault();\r\n    this.show();\r\n    const pane = this.ref?.overlayElement;\r\n    if (!pane) return;\r\n    const focusable = pane.querySelector<HTMLElement>(\r\n      'a[href],button:not([disabled]),input:not([disabled]),[tabindex=\"0\"]',\r\n    );\r\n    pane.tabIndex = -1;\r\n    (focusable ?? pane).focus();\r\n  }\r\n  show(): void {\r\n    clearTimeout(this.timer);\r\n    if (this.disposed || this.open()) return;\r\n    if (!this.ref) {\r\n      const position = createFlexibleConnectedPositionStrategy(this.injector, this.host)\r\n        .withPositions(hyConnectedPositions(this.placement(), 8))\r\n        .withViewportMargin(12)\r\n        .withPush(true);\r\n      this.ref = createOverlayRef(this.injector, {\r\n        positionStrategy: position,\r\n        scrollStrategy: createRepositionScrollStrategy(this.injector),\r\n        panelClass: 'hy-hover-card-pane',\r\n      });\r\n      const pane = this.ref.overlayElement;\r\n      pane.classList.add('hy-glass');\r\n      pane.style.cssText =\r\n        'max-inline-size:min(22rem,calc(100vw - 2rem));max-block-size:70dvh;overflow:auto;padding:1.25rem;border-radius:var(--hy-radius-m);border:1px solid var(--hy-line-strong);color:var(--hy-ink)';\r\n      pane.id = this.id;\r\n      pane.setAttribute('role', 'dialog');\r\n      pane.addEventListener('pointerenter', () => {\r\n        clearTimeout(this.timer);\r\n        this.intent.cancel();\r\n      });\r\n      pane.addEventListener('pointerleave', () => this.leave());\r\n      pane.addEventListener('focusout', (event) => {\r\n        const next = event.relatedTarget as Node | null;\r\n        if (!next || (!pane.contains(next) && !this.host.nativeElement.contains(next)))\r\n          this.leave();\r\n      });\r\n      this.ref.keydownEvents().subscribe((event) => {\r\n        if (event.key === 'Escape') this.escape(event);\r\n      });\r\n      this.ref.outsidePointerEvents().subscribe((event) => {\r\n        if (!this.host.nativeElement.contains(event.target as Node)) this.hide();\r\n      });\r\n    }\r\n    const pane = this.ref.overlayElement;\r\n    pane.setAttribute('aria-label', this.hoverCardLabel());\r\n    pane.dataset['material'] = this.fidelity.tier() === 'low' ? 'solid' : 'frosted';\r\n    pane.style.visibility = 'hidden';\r\n    const strategy = this.ref.getConfig().positionStrategy as ReturnType<\r\n      typeof createFlexibleConnectedPositionStrategy\r\n    >;\r\n    strategy.withPositions(hyConnectedPositions(this.placement(), 8));\r\n    strategy.positionChanges.pipe(take(1)).subscribe(() => pane.style.removeProperty('visibility'));\r\n    this.open.set(true);\r\n    this.ref.attach(new TemplatePortal(this.content(), this.container));\r\n  }\r\n  hide(): void {\r\n    clearTimeout(this.timer);\r\n    this.intent.cancel();\r\n    this.open.set(false);\r\n    this.ref?.detach();\r\n  }\r\n}\r\n"],"mappings":"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"}

package/fesm2022/hyalo-angular-icon.mjs

@@ -0,0 +1,385 @@
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, Directive, ElementRef, Injectable, InjectionToken, Renderer2, computed, effect, inject, input, isDevMode } from "@angular/core";
+const HY_BUILTIN_ICONS = {
+	home: { node: [["path", { d: "m3 10 9-7 9 7v10a1 1 0 0 1-1 1h-5v-7H9v7H4a1 1 0 0 1-1-1Z" }]] },
+	grid: { node: [
+		["rect", {
+			x: 3,
+			y: 3,
+			width: 7,
+			height: 7,
+			rx: 1
+		}],
+		["rect", {
+			x: 14,
+			y: 3,
+			width: 7,
+			height: 7,
+			rx: 1
+		}],
+		["rect", {
+			x: 3,
+			y: 14,
+			width: 7,
+			height: 7,
+			rx: 1
+		}],
+		["rect", {
+			x: 14,
+			y: 14,
+			width: 7,
+			height: 7,
+			rx: 1
+		}]
+	] },
+	user: { node: [["circle", {
+		cx: 12,
+		cy: 8,
+		r: 4
+	}], ["path", { d: "M4 21v-2a7 7 0 0 1 7-7h2a7 7 0 0 1 7 7v2" }]] },
+	search: { node: [["circle", {
+		cx: 11,
+		cy: 11,
+		r: 8
+	}], ["path", { d: "m21 21-4.35-4.35" }]] },
+	settings: { node: [["path", { d: "M12 8a4 4 0 1 0 0 8 4 4 0 0 0 0-8Z" }], ["path", { d: "M9 3h6l1 3 3 1 2 5-2 5-3 1-1 3H9l-1-3-3-1-2-5 2-5 3-1Z" }]] },
+	x: { node: [["path", { d: "M18 6 6 18" }], ["path", { d: "m6 6 12 12" }]] },
+	check: { node: [["path", { d: "M20 6 9 17l-5-5" }]] },
+	minus: { node: [["path", { d: "M5 12h14" }]] },
+	"chevron-down": { node: [["path", { d: "m6 9 6 6 6-6" }]] },
+	"chevron-end": {
+		node: [["path", { d: "m9 18 6-6-6-6" }]],
+		mirrorRtl: true
+	},
+	menu: { node: [
+		["path", { d: "M4 5h16" }],
+		["path", { d: "M4 12h16" }],
+		["path", { d: "M4 19h16" }]
+	] },
+	info: { node: [
+		["circle", {
+			cx: 12,
+			cy: 12,
+			r: 10
+		}],
+		["path", { d: "M12 16v-4" }],
+		["path", { d: "M12 8h.01" }]
+	] },
+	success: { node: [["circle", {
+		cx: 12,
+		cy: 12,
+		r: 10
+	}], ["path", { d: "m16 9-5.5 5.5L8 12" }]] },
+	warning: { node: [
+		["path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }],
+		["path", { d: "M12 9v4" }],
+		["path", { d: "M12 17h.01" }]
+	] },
+	danger: { node: [
+		["circle", {
+			cx: 12,
+			cy: 12,
+			r: 10
+		}],
+		["path", { d: "M12 8v4" }],
+		["path", { d: "M12 16h.01" }]
+	] },
+	spinner: { node: [["path", { d: "M21 12a9 9 0 1 1-6.219-8.56" }]] }
+};
+const HY_ICONS = new InjectionToken("HY_ICONS");
+function provideHyaloIcons(icons) {
+	return {
+		provide: HY_ICONS,
+		multi: true,
+		useValue: icons
+	};
+}
+function isDef(value) {
+	return !Array.isArray(value);
+}
+var HyIconRegistry = class HyIconRegistry {
+	icons = new Map(Object.entries(HY_BUILTIN_ICONS));
+	sets = inject(HY_ICONS, { optional: true }) ?? [];
+	constructor() {
+		for (const set of this.sets) for (const [name, icon] of Object.entries(set)) this.register(name, icon);
+	}
+	register(name, icon) {
+		this.icons.set(name, isDef(icon) ? icon : { node: icon });
+	}
+	get(name) {
+		return this.icons.get(name);
+	}
+	lookup(name, sets) {
+		if (sets && sets !== this.sets) for (const set of [...sets].reverse()) {
+			const icon = Object.hasOwn(set, name) ? set[name] : void 0;
+			if (icon) return isDef(icon) ? icon : { node: icon };
+		}
+		return this.get(name);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyIconRegistry,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyIconRegistry,
+		providedIn: "root"
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyIconRegistry,
+	decorators: [{
+		type: Injectable,
+		args: [{ providedIn: "root" }]
+	}],
+	ctorParameters: () => []
+});
+const SAFE_ATTRS = /* @__PURE__ */ new Set([
+	"d",
+	"cx",
+	"cy",
+	"r",
+	"rx",
+	"ry",
+	"x",
+	"y",
+	"x1",
+	"x2",
+	"y1",
+	"y2",
+	"width",
+	"height",
+	"points",
+	"fill",
+	"stroke",
+	"stroke-width",
+	"opacity",
+	"transform"
+]);
+var HyIconAttrs = class HyIconAttrs {
+	el = inject(ElementRef).nativeElement;
+	renderer = inject(Renderer2);
+	hyIconAttrs = input.required(...ngDevMode ? [{ debugName: "hyIconAttrs" }] : /* istanbul ignore next */ []);
+	constructor() {
+		let applied = /* @__PURE__ */ new Set();
+		effect(() => {
+			const next = /* @__PURE__ */ new Set();
+			for (const [name, value] of Object.entries(this.hyIconAttrs())) {
+				if (!SAFE_ATTRS.has(name)) continue;
+				this.renderer.setAttribute(this.el, name, String(value));
+				next.add(name);
+			}
+			for (const name of applied) if (!next.has(name)) this.renderer.removeAttribute(this.el, name);
+			applied = next;
+		});
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyIconAttrs,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Directive
+	});
+	static ɵdir = i0.ɵɵngDeclareDirective({
+		minVersion: "17.1.0",
+		version: "22.2.3",
+		type: HyIconAttrs,
+		isStandalone: true,
+		selector: "[hyIconAttrs]",
+		inputs: { hyIconAttrs: {
+			classPropertyName: "hyIconAttrs",
+			publicName: "hyIconAttrs",
+			isSignal: true,
+			isRequired: true,
+			transformFunction: null
+		} },
+		ngImport: i0
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyIconAttrs,
+	decorators: [{
+		type: Directive,
+		args: [{ selector: "[hyIconAttrs]" }]
+	}],
+	ctorParameters: () => [],
+	propDecorators: { hyIconAttrs: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "hyIconAttrs",
+			required: true
+		}]
+	}] }
+});
+var HyIcon = class HyIcon {
+	registry = inject(HyIconRegistry);
+	sets = inject(HY_ICONS, { optional: true });
+	name = input(...ngDevMode ? [void 0, { debugName: "name" }] : /* istanbul ignore next */ []);
+	icon = input(...ngDevMode ? [void 0, { debugName: "icon" }] : /* istanbul ignore next */ []);
+	label = input(...ngDevMode ? [void 0, { debugName: "label" }] : /* istanbul ignore next */ []);
+	size = input(...ngDevMode ? [void 0, { debugName: "size" }] : /* istanbul ignore next */ []);
+	strokeWidth = input(1.75, ...ngDevMode ? [{ debugName: "strokeWidth" }] : /* istanbul ignore next */ []);
+	def = computed(() => {
+		const icon = this.icon();
+		if (icon) return Array.isArray(icon) ? { node: icon } : icon;
+		const name = this.name();
+		const found = name ? this.registry.lookup(name, this.sets) : void 0;
+		if (name && !found && isDevMode()) console.warn(`[hyalo] Unknown icon "${name}". Register it with provideHyaloIcons().`);
+		return found;
+	}, ...ngDevMode ? [{ debugName: "def" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyIcon,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.3",
+		type: HyIcon,
+		isStandalone: true,
+		selector: "hy-icon",
+		inputs: {
+			name: {
+				classPropertyName: "name",
+				publicName: "name",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			icon: {
+				classPropertyName: "icon",
+				publicName: "icon",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			label: {
+				classPropertyName: "label",
+				publicName: "label",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			size: {
+				classPropertyName: "size",
+				publicName: "size",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			strokeWidth: {
+				classPropertyName: "strokeWidth",
+				publicName: "strokeWidth",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: {
+			properties: {
+				"attr.role": "label() ? \"img\" : null",
+				"attr.aria-label": "label() || null",
+				"attr.aria-hidden": "label() ? null : \"true\"",
+				"attr.data-mirror-rtl": "def()?.mirrorRtl || null",
+				"style.--hy-icon-size": "size()"
+			},
+			classAttribute: "hy-icon"
+		},
+		ngImport: i0,
+		template: "<svg\r\n  viewBox=\"0 0 24 24\"\r\n  fill=\"none\"\r\n  stroke=\"currentColor\"\r\n  [attr.stroke-width]=\"strokeWidth()\"\r\n  stroke-linecap=\"round\"\r\n  stroke-linejoin=\"round\"\r\n  focusable=\"false\"\r\n>\r\n  @for (child of def()?.node; track $index) {\r\n    @switch (child[0]) {\r\n      @case ('path') {\r\n        <svg:path [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n      @case ('circle') {\r\n        <svg:circle [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n      @case ('line') {\r\n        <svg:line [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n      @case ('rect') {\r\n        <svg:rect [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n      @case ('polyline') {\r\n        <svg:polyline [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n      @case ('polygon') {\r\n        <svg:polygon [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n      @case ('ellipse') {\r\n        <svg:ellipse [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n    }\r\n  }\r\n</svg>\r\n",
+		styles: [":host{display:inline-flex;flex:none;inline-size:var(--hy-icon-size, 1.25em);block-size:var(--hy-icon-size, 1.25em);vertical-align:middle}svg{inline-size:100%;block-size:100%}:host-context([dir=\"rtl\"])[data-mirror-rtl] svg{transform:scaleX(-1)}\n"],
+		dependencies: [{
+			kind: "directive",
+			type: HyIconAttrs,
+			selector: "[hyIconAttrs]",
+			inputs: ["hyIconAttrs"]
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyIcon,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "hy-icon",
+			imports: [HyIconAttrs],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: {
+				class: "hy-icon",
+				"[attr.role]": "label() ? \"img\" : null",
+				"[attr.aria-label]": "label() || null",
+				"[attr.aria-hidden]": "label() ? null : \"true\"",
+				"[attr.data-mirror-rtl]": "def()?.mirrorRtl || null",
+				"[style.--hy-icon-size]": "size()"
+			},
+			template: "<svg\r\n  viewBox=\"0 0 24 24\"\r\n  fill=\"none\"\r\n  stroke=\"currentColor\"\r\n  [attr.stroke-width]=\"strokeWidth()\"\r\n  stroke-linecap=\"round\"\r\n  stroke-linejoin=\"round\"\r\n  focusable=\"false\"\r\n>\r\n  @for (child of def()?.node; track $index) {\r\n    @switch (child[0]) {\r\n      @case ('path') {\r\n        <svg:path [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n      @case ('circle') {\r\n        <svg:circle [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n      @case ('line') {\r\n        <svg:line [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n      @case ('rect') {\r\n        <svg:rect [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n      @case ('polyline') {\r\n        <svg:polyline [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n      @case ('polygon') {\r\n        <svg:polygon [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n      @case ('ellipse') {\r\n        <svg:ellipse [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n    }\r\n  }\r\n</svg>\r\n",
+			styles: [":host{display:inline-flex;flex:none;inline-size:var(--hy-icon-size, 1.25em);block-size:var(--hy-icon-size, 1.25em);vertical-align:middle}svg{inline-size:100%;block-size:100%}:host-context([dir=\"rtl\"])[data-mirror-rtl] svg{transform:scaleX(-1)}\n"]
+		}]
+	}],
+	propDecorators: {
+		name: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "name",
+				required: false
+			}]
+		}],
+		icon: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "icon",
+				required: false
+			}]
+		}],
+		label: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "label",
+				required: false
+			}]
+		}],
+		size: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "size",
+				required: false
+			}]
+		}],
+		strokeWidth: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "strokeWidth",
+				required: false
+			}]
+		}]
+	}
+});
+export { HY_BUILTIN_ICONS, HY_ICONS, HyIcon, HyIconAttrs, HyIconRegistry, provideHyaloIcons };
+
+//# sourceMappingURL=hyalo-angular-icon.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"hyalo-angular-icon.mjs","names":[],"sources":["../../../projects/hyalo/icon/icons.ts","../../../projects/hyalo/icon/registry.ts","../../../projects/hyalo/icon/icon.ts","../../../projects/hyalo/icon/icon.html"],"sourcesContent":["/**\r\n * Icon data in the same shape Lucide uses (`IconNode`), so any Lucide icon\r\n * can be registered as is:\r\n *\r\n * ```ts\r\n * import { ArrowRight } from 'lucide';\r\n * provideHyaloIcons({ 'arrow-right': ArrowRight })\r\n * ```\r\n *\r\n * Icons are data, not SVG strings, so nothing is ever parsed as HTML.\r\n */\r\nexport type HyIconNode = readonly (readonly [string, Readonly<Record<string, string | number>>])[];\r\n\r\n/** An icon plus how it behaves in right-to-left layouts. */\r\nexport interface HyIconDef {\r\n  readonly node: HyIconNode;\r\n  /** Mirror the icon in RTL. Set it for icons that point somewhere, like arrows. */\r\n  readonly mirrorRtl?: boolean;\r\n}\r\n\r\n/*\r\n * The few icons the kit uses itself. Paths are from Lucide (ISC license,\r\n * Copyright (c) Lucide Icons and Contributors), https://lucide.dev.\r\n */\r\nexport const HY_BUILTIN_ICONS: Readonly<Record<string, HyIconDef>> = {\r\n  home: { node: [['path', { d: 'm3 10 9-7 9 7v10a1 1 0 0 1-1 1h-5v-7H9v7H4a1 1 0 0 1-1-1Z' }]] },\r\n  grid: {\r\n    node: [\r\n      ['rect', { x: 3, y: 3, width: 7, height: 7, rx: 1 }],\r\n      ['rect', { x: 14, y: 3, width: 7, height: 7, rx: 1 }],\r\n      ['rect', { x: 3, y: 14, width: 7, height: 7, rx: 1 }],\r\n      ['rect', { x: 14, y: 14, width: 7, height: 7, rx: 1 }],\r\n    ],\r\n  },\r\n  user: {\r\n    node: [\r\n      ['circle', { cx: 12, cy: 8, r: 4 }],\r\n      ['path', { d: 'M4 21v-2a7 7 0 0 1 7-7h2a7 7 0 0 1 7 7v2' }],\r\n    ],\r\n  },\r\n  search: {\r\n    node: [\r\n      ['circle', { cx: 11, cy: 11, r: 8 }],\r\n      ['path', { d: 'm21 21-4.35-4.35' }],\r\n    ],\r\n  },\r\n  settings: {\r\n    node: [\r\n      ['path', { d: 'M12 8a4 4 0 1 0 0 8 4 4 0 0 0 0-8Z' }],\r\n      ['path', { d: 'M9 3h6l1 3 3 1 2 5-2 5-3 1-1 3H9l-1-3-3-1-2-5 2-5 3-1Z' }],\r\n    ],\r\n  },\r\n  x: {\r\n    node: [\r\n      ['path', { d: 'M18 6 6 18' }],\r\n      ['path', { d: 'm6 6 12 12' }],\r\n    ],\r\n  },\r\n  check: { node: [['path', { d: 'M20 6 9 17l-5-5' }]] },\r\n  minus: { node: [['path', { d: 'M5 12h14' }]] },\r\n  'chevron-down': { node: [['path', { d: 'm6 9 6 6 6-6' }]] },\r\n  'chevron-end': { node: [['path', { d: 'm9 18 6-6-6-6' }]], mirrorRtl: true },\r\n  menu: {\r\n    node: [\r\n      ['path', { d: 'M4 5h16' }],\r\n      ['path', { d: 'M4 12h16' }],\r\n      ['path', { d: 'M4 19h16' }],\r\n    ],\r\n  },\r\n  info: {\r\n    node: [\r\n      ['circle', { cx: 12, cy: 12, r: 10 }],\r\n      ['path', { d: 'M12 16v-4' }],\r\n      ['path', { d: 'M12 8h.01' }],\r\n    ],\r\n  },\r\n  success: {\r\n    node: [\r\n      ['circle', { cx: 12, cy: 12, r: 10 }],\r\n      ['path', { d: 'm16 9-5.5 5.5L8 12' }],\r\n    ],\r\n  },\r\n  warning: {\r\n    node: [\r\n      ['path', { d: 'm21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3' }],\r\n      ['path', { d: 'M12 9v4' }],\r\n      ['path', { d: 'M12 17h.01' }],\r\n    ],\r\n  },\r\n  danger: {\r\n    node: [\r\n      ['circle', { cx: 12, cy: 12, r: 10 }],\r\n      ['path', { d: 'M12 8v4' }],\r\n      ['path', { d: 'M12 16h.01' }],\r\n    ],\r\n  },\r\n  spinner: { node: [['path', { d: 'M21 12a9 9 0 1 1-6.219-8.56' }]] },\r\n};\r\n","import { Injectable, InjectionToken, Provider, inject } from '@angular/core';\r\nimport { HY_BUILTIN_ICONS, type HyIconDef, type HyIconNode } from './icons';\r\n\r\ntype HyIconSet = Readonly<Record<string, HyIconDef | HyIconNode>>;\r\n\r\n/** Icons added with {@link provideHyaloIcons}. Collected from every provider. */\r\nexport const HY_ICONS = new InjectionToken<readonly HyIconSet[]>('HY_ICONS');\r\n\r\n/**\r\n * Registers icons by name. Only the icons you import end up in the bundle.\r\n *\r\n * ```ts\r\n * provideHyaloIcons({ search: Search, 'arrow-end': { node: ArrowRight, mirrorRtl: true } })\r\n * ```\r\n *\r\n * Works in `app.config.ts` and in a route's or component's `providers`.\r\n * Icons from the nearest provider win over app-wide ones.\r\n */\r\nexport function provideHyaloIcons(\r\n  icons: Readonly<Record<string, HyIconDef | HyIconNode>>,\r\n): Provider {\r\n  return { provide: HY_ICONS, multi: true, useValue: icons };\r\n}\r\n\r\nfunction isDef(value: HyIconDef | HyIconNode): value is HyIconDef {\r\n  return !Array.isArray(value);\r\n}\r\n\r\n/** Looks up icons by name: built-ins first, then registered sets in order. */\r\n@Injectable({ providedIn: 'root' })\r\nexport class HyIconRegistry {\r\n  private readonly icons = new Map<string, HyIconDef>(Object.entries(HY_BUILTIN_ICONS));\r\n  private readonly sets = inject(HY_ICONS, { optional: true }) ?? [];\r\n\r\n  constructor() {\r\n    for (const set of this.sets) {\r\n      for (const [name, icon] of Object.entries(set)) this.register(name, icon);\r\n    }\r\n  }\r\n\r\n  /** Adds or replaces an icon at runtime. */\r\n  register(name: string, icon: HyIconDef | HyIconNode): void {\r\n    this.icons.set(name, isDef(icon) ? icon : { node: icon });\r\n  }\r\n\r\n  /** Returns the icon, or undefined when the name is unknown. */\r\n  get(name: string): HyIconDef | undefined {\r\n    return this.icons.get(name);\r\n  }\r\n\r\n  /**\r\n   * @internal Looks in sets from a route or component injector first. This\r\n   * registry lives in the root injector, so it never sees those itself.\r\n   */\r\n  lookup(name: string, sets: readonly HyIconSet[] | null): HyIconDef | undefined {\r\n    if (sets && sets !== this.sets) {\r\n      for (const set of [...sets].reverse()) {\r\n        const icon = Object.hasOwn(set, name) ? set[name] : undefined;\r\n        if (icon) return isDef(icon) ? icon : { node: icon };\r\n      }\r\n    }\r\n    return this.get(name);\r\n  }\r\n}\r\n","import {\r\n  ChangeDetectionStrategy,\r\n  Component,\r\n  Directive,\r\n  ElementRef,\r\n  Renderer2,\r\n  computed,\r\n  effect,\r\n  inject,\r\n  input,\r\n  isDevMode,\r\n} from '@angular/core';\r\nimport type { HyIconDef, HyIconNode } from './icons';\r\nimport { HY_ICONS, HyIconRegistry } from './registry';\r\n\r\nconst SAFE_ATTRS = new Set([\r\n  'd',\r\n  'cx',\r\n  'cy',\r\n  'r',\r\n  'rx',\r\n  'ry',\r\n  'x',\r\n  'y',\r\n  'x1',\r\n  'x2',\r\n  'y1',\r\n  'y2',\r\n  'width',\r\n  'height',\r\n  'points',\r\n  'fill',\r\n  'stroke',\r\n  'stroke-width',\r\n  'opacity',\r\n  'transform',\r\n]);\r\n\r\n/** Copies whitelisted geometry attributes onto an SVG child element. */\r\n@Directive({ selector: '[hyIconAttrs]' })\r\nexport class HyIconAttrs {\r\n  private readonly el = inject(ElementRef).nativeElement as SVGElement;\r\n  private readonly renderer = inject(Renderer2);\r\n  readonly hyIconAttrs = input.required<Readonly<Record<string, string | number>>>();\r\n\r\n  constructor() {\r\n    let applied = new Set<string>();\r\n    effect(() => {\r\n      const next = new Set<string>();\r\n      for (const [name, value] of Object.entries(this.hyIconAttrs())) {\r\n        if (!SAFE_ATTRS.has(name)) continue;\r\n        this.renderer.setAttribute(this.el, name, String(value));\r\n        next.add(name);\r\n      }\r\n      // A swapped icon may not use every attribute the previous one did.\r\n      for (const name of applied) {\r\n        if (!next.has(name)) this.renderer.removeAttribute(this.el, name);\r\n      }\r\n      applied = next;\r\n    });\r\n  }\r\n}\r\n\r\n/**\r\n * An SVG icon from the registry, or passed in directly.\r\n *\r\n * ```html\r\n * <hy-icon name=\"check\" />\r\n * <hy-icon [icon]=\"ArrowRight\" label=\"Next\" />\r\n * ```\r\n *\r\n * Icons are decorative (`aria-hidden`) unless `label` is set, in which case\r\n * they get `role=\"img\"` and that label. The size follows the font size.\r\n */\r\n@Component({\r\n  selector: 'hy-icon',\r\n  imports: [HyIconAttrs],\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  host: {\r\n    class: 'hy-icon',\r\n    '[attr.role]': 'label() ? \"img\" : null',\r\n    '[attr.aria-label]': 'label() || null',\r\n    '[attr.aria-hidden]': 'label() ? null : \"true\"',\r\n    '[attr.data-mirror-rtl]': 'def()?.mirrorRtl || null',\r\n    '[style.--hy-icon-size]': 'size()',\r\n  },\r\n  templateUrl: './icon.html',\r\n  styleUrl: './icon.css',\r\n})\r\nexport class HyIcon {\r\n  private readonly registry = inject(HyIconRegistry);\r\n  private readonly sets = inject(HY_ICONS, { optional: true });\r\n\r\n  /** Registered icon name. */\r\n  readonly name = input<string>();\r\n  /** Icon data, used instead of `name`. */\r\n  readonly icon = input<HyIconDef | HyIconNode>();\r\n  /** Accessible name. Leave empty for decorative icons. */\r\n  readonly label = input<string>();\r\n  /** Any CSS length. Defaults to 1.25em. */\r\n  readonly size = input<string>();\r\n  /** Stroke width in viewBox units. */\r\n  readonly strokeWidth = input(1.75);\r\n\r\n  protected readonly def = computed<HyIconDef | undefined>(() => {\r\n    const icon = this.icon();\r\n    if (icon) return Array.isArray(icon) ? { node: icon as HyIconNode } : (icon as HyIconDef);\r\n    const name = this.name();\r\n    const found = name ? this.registry.lookup(name, this.sets) : undefined;\r\n    if (name && !found && isDevMode()) {\r\n      console.warn(`[hyalo] Unknown icon \"${name}\". Register it with provideHyaloIcons().`); // eslint-disable-line no-console\r\n    }\r\n    return found;\r\n  });\r\n}\r\n","<svg\r\n  viewBox=\"0 0 24 24\"\r\n  fill=\"none\"\r\n  stroke=\"currentColor\"\r\n  [attr.stroke-width]=\"strokeWidth()\"\r\n  stroke-linecap=\"round\"\r\n  stroke-linejoin=\"round\"\r\n  focusable=\"false\"\r\n>\r\n  @for (child of def()?.node; track $index) {\r\n    @switch (child[0]) {\r\n      @case ('path') {\r\n        <svg:path [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n      @case ('circle') {\r\n        <svg:circle [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n      @case ('line') {\r\n        <svg:line [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n      @case ('rect') {\r\n        <svg:rect [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n      @case ('polyline') {\r\n        <svg:polyline [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n      @case ('polygon') {\r\n        <svg:polygon [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n      @case ('ellipse') {\r\n        <svg:ellipse [hyIconAttrs]=\"child[1]\" />\r\n      }\r\n    }\r\n  }\r\n</svg>\r\n"],"mappings":"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"}