@hyalo/angular 0.1.0 → 0.3.1

package/fesm2022/hyalo-angular-skeleton.mjs

@@ -0,0 +1,131 @@
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, computed, inject, input } from "@angular/core";
+import { HyMotion } from "@hyalo/angular/motion";
+var HySkeleton = class HySkeleton {
+	motion = inject(HyMotion);
+	animate = computed(() => this.motion.enabled() && this.animation() !== "none", ...ngDevMode ? [{ debugName: "animate" }] : /* istanbul ignore next */ []);
+	animation = input("shimmer", ...ngDevMode ? [{ debugName: "animation" }] : /* istanbul ignore next */ []);
+	shape = input("text", ...ngDevMode ? [{ debugName: "shape" }] : /* istanbul ignore next */ []);
+	width = input("100%", ...ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []);
+	height = input("1em", ...ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HySkeleton,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.3",
+		type: HySkeleton,
+		isStandalone: true,
+		selector: "hy-skeleton",
+		inputs: {
+			animation: {
+				classPropertyName: "animation",
+				publicName: "animation",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			shape: {
+				classPropertyName: "shape",
+				publicName: "shape",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			width: {
+				classPropertyName: "width",
+				publicName: "width",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			height: {
+				classPropertyName: "height",
+				publicName: "height",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: {
+			attributes: { "aria-hidden": "true" },
+			properties: {
+				"attr.data-shape": "shape()",
+				"attr.data-animate": "animate()",
+				"attr.data-animation": "animation()",
+				"style.inline-size": "width()",
+				"style.block-size": "height()"
+			}
+		},
+		ngImport: i0,
+		template: "",
+		isInline: true,
+		styles: [":host{display:block;position:relative;overflow:clip;border-radius:var(--hy-radius-s);background:var(--hy-surface-3)}:host([data-shape=\"circle\"]){border-radius:50%}:host([data-animate=\"true\"][data-animation=\"shimmer\"]):after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent,var(--hy-surface-1),transparent);animation:hy-shimmer 1.8s linear infinite}:host([data-animate=\"true\"][data-animation=\"pulse\"]){animation:hy-pulse 1.8s var(--hy-ease-inout) infinite}@keyframes hy-pulse{50%{opacity:.45}}@keyframes hy-shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}@media(prefers-reduced-motion:reduce){:host,:host:after{animation:none!important}}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HySkeleton,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "hy-skeleton",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: {
+				"aria-hidden": "true",
+				"[attr.data-shape]": "shape()",
+				"[attr.data-animate]": "animate()",
+				"[attr.data-animation]": "animation()",
+				"[style.inline-size]": "width()",
+				"[style.block-size]": "height()"
+			},
+			template: "",
+			styles: [":host{display:block;position:relative;overflow:clip;border-radius:var(--hy-radius-s);background:var(--hy-surface-3)}:host([data-shape=\"circle\"]){border-radius:50%}:host([data-animate=\"true\"][data-animation=\"shimmer\"]):after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent,var(--hy-surface-1),transparent);animation:hy-shimmer 1.8s linear infinite}:host([data-animate=\"true\"][data-animation=\"pulse\"]){animation:hy-pulse 1.8s var(--hy-ease-inout) infinite}@keyframes hy-pulse{50%{opacity:.45}}@keyframes hy-shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}@media(prefers-reduced-motion:reduce){:host,:host:after{animation:none!important}}\n"]
+		}]
+	}],
+	propDecorators: {
+		animation: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "animation",
+				required: false
+			}]
+		}],
+		shape: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "shape",
+				required: false
+			}]
+		}],
+		width: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "width",
+				required: false
+			}]
+		}],
+		height: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "height",
+				required: false
+			}]
+		}]
+	}
+});
+export { HySkeleton };
+
+//# sourceMappingURL=hyalo-angular-skeleton.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"hyalo-angular-skeleton.mjs","names":[],"sources":["../../../projects/hyalo/skeleton/skeleton.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, inject, input } from '@angular/core';\r\nimport { HyMotion } from '@hyalo/angular/motion';\r\nexport type HySkeletonAnimation = 'shimmer' | 'pulse' | 'none';\r\n/** Decorative placeholder. Put aria-busy on the region being loaded. */\r\n@Component({\r\n  selector: 'hy-skeleton',\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  host: {\r\n    'aria-hidden': 'true',\r\n    '[attr.data-shape]': 'shape()',\r\n    '[attr.data-animate]': 'animate()',\r\n    '[attr.data-animation]': 'animation()',\r\n    '[style.inline-size]': 'width()',\r\n    '[style.block-size]': 'height()',\r\n  },\r\n  template: '',\r\n  styleUrl: './skeleton.css',\r\n})\r\nexport class HySkeleton {\r\n  private readonly motion = inject(HyMotion);\r\n  protected readonly animate = computed(() => this.motion.enabled() && this.animation() !== 'none');\r\n  readonly animation = input<HySkeletonAnimation>('shimmer');\r\n  readonly shape = input<'text' | 'circle' | 'rect'>('text');\r\n  readonly width = input('100%');\r\n  readonly height = input('1em');\r\n}\r\n"],"mappings":";;;AAkBA,IAAa,aAAb,MAAa,WAAU;CACJ,SAAS,OAAO,QAAQ;CACtB,UAAU,eAAe,KAAK,OAAO,QAAO,KAAM,KAAK,UAAS,MAAO,QAAO,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;CACxF,YAAY,MAA2B,WAAU,GAAA,YAAA,CAAA,EAAA,WAAA,YAAA,CAAA,+BAAA,CAAA,CAAA;CACjD,QAAQ,MAAkC,QAAO,GAAA,YAAA,CAAA,EAAA,WAAA,QAAA,CAAA,+BAAA,CAAA,CAAA;CACjD,QAAQ,MAAM,QAAO,GAAA,YAAA,CAAA,EAAA,WAAA,QAAA,CAAA,+BAAA,CAAA,CAAA;CACrB,SAAS,MAAM,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;CANnB,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAU,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAAV,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAU,cAAA;EAAA,UAAA;EAAA,QAAA;GAAA,WAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,OAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,OAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,QAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;EAAA;EAAA,MAAA;GAAA,YAAA,EAAA,eAAA,OAAA;GAAA,YAAA;IAAA,mBAAA;IAAA,qBAAA;IAAA,uBAAA;IAAA,qBAAA;IAAA,oBAAA;GAAA;EAAA;EAAA,UAAA;EAAA,UAHX;EAAE,UAAA;EAAA,QAAA,CAAA,isBAAA;EAAA,iBAAA,GAAA,wBAAA;CAAA,CAAA;;AAGD,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAU,YAAA,CAAA;EAdtB,MAAA;EACW,MAAA,CAAA;GAAA,UAAA;GAAa,iBACN,wBAAwB;GAAM,MACzC;IACJ,eAAe;IACf,qBAAqB;IACrB,uBAAuB;IACvB,yBAAyB;IACzB,uBAAuB;IACvB,sBAAsB;GACvB;GAAA,UACS;GAAE,QAAA,CAAA,isBAAA;EAAA,CAAA"}

package/fesm2022/hyalo-angular-sparkline.mjs

@@ -0,0 +1,110 @@
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, computed, input } from "@angular/core";
+var HySparkline = class HySparkline {
+	data = input.required(...ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []);
+	label = input.required(...ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []);
+	points = computed(() => {
+		const values = this.data().filter(Number.isFinite);
+		if (!values.length) return "";
+		const maximum = values[0] ?? 0;
+		let scale = Math.abs(maximum);
+		for (const value of values) scale = Math.max(scale, Math.abs(value));
+		const normalized = values.map((value) => scale ? value / scale : 0);
+		let min = Infinity, max = -Infinity;
+		for (const value of normalized) {
+			min = Math.min(min, value);
+			max = Math.max(max, value);
+		}
+		const selected = /* @__PURE__ */ new Set([0, values.length - 1]);
+		const bucket = Math.max(1, Math.ceil(values.length / 80));
+		for (let start = 0; start < values.length; start += bucket) {
+			let low = start, high = start;
+			for (let i = start; i < Math.min(values.length, start + bucket); i++) {
+				if ((normalized[i] ?? 0) < (normalized[low] ?? 0)) low = i;
+				if ((normalized[i] ?? 0) > (normalized[high] ?? 0)) high = i;
+			}
+			selected.add(low);
+			selected.add(high);
+		}
+		return [...selected].sort((a, b) => a - b).map((index) => (values.length === 1 ? 100 : index / (values.length - 1) * 196 + 2).toFixed(2) + "," + (max === min ? 24 : 44 - ((normalized[index] ?? 0) - min) / (max - min) * 40).toFixed(2)).join(" ");
+	}, ...ngDevMode ? [{ debugName: "points" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HySparkline,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.3",
+		type: HySparkline,
+		isStandalone: true,
+		selector: "hy-sparkline",
+		inputs: {
+			data: {
+				classPropertyName: "data",
+				publicName: "data",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			label: {
+				classPropertyName: "label",
+				publicName: "label",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			}
+		},
+		host: {
+			attributes: { "role": "img" },
+			properties: { "attr.aria-label": "label()" }
+		},
+		ngImport: i0,
+		template: "<svg viewBox=\"0 0 200 48\" preserveAspectRatio=\"none\" aria-hidden=\"true\">\r\n  <polyline\r\n    [attr.points]=\"points()\"\r\n    fill=\"none\"\r\n    stroke=\"currentColor\"\r\n    stroke-width=\"2\"\r\n    stroke-linejoin=\"round\"\r\n    stroke-linecap=\"round\"\r\n    vector-effect=\"non-scaling-stroke\"\r\n  />\r\n</svg>\r\n",
+		styles: [":host{display:block;inline-size:100%;block-size:3rem;color:var(--hy-primary)}svg{display:block;inline-size:100%;block-size:100%}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HySparkline,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "hy-sparkline",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: {
+				role: "img",
+				"[attr.aria-label]": "label()"
+			},
+			template: "<svg viewBox=\"0 0 200 48\" preserveAspectRatio=\"none\" aria-hidden=\"true\">\r\n  <polyline\r\n    [attr.points]=\"points()\"\r\n    fill=\"none\"\r\n    stroke=\"currentColor\"\r\n    stroke-width=\"2\"\r\n    stroke-linejoin=\"round\"\r\n    stroke-linecap=\"round\"\r\n    vector-effect=\"non-scaling-stroke\"\r\n  />\r\n</svg>\r\n",
+			styles: [":host{display:block;inline-size:100%;block-size:3rem;color:var(--hy-primary)}svg{display:block;inline-size:100%;block-size:100%}\n"]
+		}]
+	}],
+	propDecorators: {
+		data: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "data",
+				required: true
+			}]
+		}],
+		label: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "label",
+				required: true
+			}]
+		}]
+	}
+});
+export { HySparkline };
+
+//# sourceMappingURL=hyalo-angular-sparkline.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"hyalo-angular-sparkline.mjs","names":[],"sources":["../../../projects/hyalo/sparkline/sparkline.ts","../../../projects/hyalo/sparkline/sparkline.html"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';\r\n@Component({\r\n  selector: 'hy-sparkline',\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  templateUrl: './sparkline.html',\r\n  styleUrl: './sparkline.css',\r\n  host: { role: 'img', '[attr.aria-label]': 'label()' },\r\n})\r\nexport class HySparkline {\r\n  readonly data = input.required<readonly number[]>();\r\n  readonly label = input.required<string>();\r\n  readonly points = computed(() => {\r\n    const values = this.data().filter(Number.isFinite);\r\n    if (!values.length) return '';\r\n    const maximum = values[0] ?? 0;\r\n    let scale = Math.abs(maximum);\r\n    for (const value of values) scale = Math.max(scale, Math.abs(value));\r\n    const normalized = values.map((value) => (scale ? value / scale : 0));\r\n    let min = Infinity,\r\n      max = -Infinity;\r\n    for (const value of normalized) {\r\n      min = Math.min(min, value);\r\n      max = Math.max(max, value);\r\n    }\r\n    const selected = new Set([0, values.length - 1]);\r\n    const bucket = Math.max(1, Math.ceil(values.length / 80));\r\n    for (let start = 0; start < values.length; start += bucket) {\r\n      let low = start,\r\n        high = start;\r\n      for (let i = start; i < Math.min(values.length, start + bucket); i++) {\r\n        if ((normalized[i] ?? 0) < (normalized[low] ?? 0)) low = i;\r\n        if ((normalized[i] ?? 0) > (normalized[high] ?? 0)) high = i;\r\n      }\r\n      selected.add(low);\r\n      selected.add(high);\r\n    }\r\n    return [...selected]\r\n      .sort((a, b) => a - b)\r\n      .map(\r\n        (index) =>\r\n          (values.length === 1 ? 100 : (index / (values.length - 1)) * 196 + 2).toFixed(2) +\r\n          ',' +\r\n          (max === min ? 24 : 44 - (((normalized[index] ?? 0) - min) / (max - min)) * 40).toFixed(\r\n            2,\r\n          ),\r\n      )\r\n      .join(' ');\r\n  });\r\n}\r\n","<svg viewBox=\"0 0 200 48\" preserveAspectRatio=\"none\" aria-hidden=\"true\">\r\n  <polyline\r\n    [attr.points]=\"points()\"\r\n    fill=\"none\"\r\n    stroke=\"currentColor\"\r\n    stroke-width=\"2\"\r\n    stroke-linejoin=\"round\"\r\n    stroke-linecap=\"round\"\r\n    vector-effect=\"non-scaling-stroke\"\r\n  />\r\n</svg>\r\n"],"mappings":";;AAQA,IAAa,cAAb,MAAa,YAAW;CACb,OAAO,MAAM,SAA6B,GAAA,YAAA,CAAA,EAAA,WAAA,OAAA,CAAA,+BAAA,CAAA,CAAA;CAC1C,QAAQ,MAAM,SAAkB,GAAA,YAAA,CAAA,EAAA,WAAA,QAAA,CAAA,+BAAA,CAAA,CAAA;CAChC,SAAS,eAAc;EAC9B,MAAM,SAAS,KAAK,KAAI,CAAE,CAAC,OAAO,OAAO,QAAQ;EACjD,IAAI,CAAC,OAAO,QAAQ,OAAO;EAC3B,MAAM,UAAU,OAAO,MAAM;EAC7B,IAAI,QAAQ,KAAK,IAAI,OAAO;EAC5B,KAAK,MAAM,SAAS,QAAQ,QAAQ,KAAK,IAAI,OAAO,KAAK,IAAI,KAAK,CAAC;EACnE,MAAM,aAAa,OAAO,KAAK,UAAW,QAAQ,QAAQ,QAAQ,CAAE;EACpE,IAAI,MAAM,UACR,MAAM;EACR,KAAK,MAAM,SAAS,YAAY;GAC9B,MAAM,KAAK,IAAI,KAAK,KAAK;GACzB,MAAM,KAAK,IAAI,KAAK,KAAK;EAC3B;EACA,MAAM,2BAAW,IAAI,IAAI,CAAC,GAAG,OAAO,SAAS,CAAC,CAAC;EAC/C,MAAM,SAAS,KAAK,IAAI,GAAG,KAAK,KAAK,OAAO,SAAS,EAAE,CAAC;EACxD,KAAK,IAAI,QAAQ,GAAG,QAAQ,OAAO,QAAQ,SAAS,QAAQ;GAC1D,IAAI,MAAM,OACR,OAAO;GACT,KAAK,IAAI,IAAI,OAAO,IAAI,KAAK,IAAI,OAAO,QAAQ,QAAQ,MAAM,GAAG,KAAK;IACpE,KAAK,WAAW,MAAM,MAAM,WAAW,QAAQ,IAAI,MAAM;IACzD,KAAK,WAAW,MAAM,MAAM,WAAW,SAAS,IAAI,OAAO;GAC7D;GACA,SAAS,IAAI,GAAG;GAChB,SAAS,IAAI,IAAI;EACnB;EACA,OAAO,CAAC,GAAG,QAAQ,CAAC,CACjB,MAAM,GAAG,MAAM,IAAI,CAAC,CAAC,CACrB,KACE,WACE,OAAO,WAAW,IAAI,MAAO,SAAS,OAAO,SAAS,KAAM,MAAM,EAAA,CAAG,QAAQ,CAAC,IAC/E,OACC,QAAQ,MAAM,KAAK,OAAQ,WAAW,UAAU,KAAK,QAAQ,MAAM,OAAQ,GAAA,CAAI,QAC9E,CAAC,CACF,CACJ,CACA,KAAK,GAAG;CACb,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;CAvCS,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAW,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAAX,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAW,cAAA;EAAA,UAAA;EAAA,QAAA;GAAA,MAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,OAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;EAAA;EAAA,MAAA;GAAA,YAAA,EAAA,QAAA,MAAA;GAAA,YAAA,EAAA,mBAAA,UAAA;EAAA;EAAA,UAAA;EAAA,UCRxB;EAWA,QAAA,CAAA,oIAAA;EAAA,iBAAA,GAAA,wBAAA;CAAA,CAAA;;ADHa,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAW,YAAA,CAAA;EAPvB,MAAA;EACW,MAAA,CAAA;GAAA,UAAA;GAAc,iBACP,wBAAwB;GAAM,MAGzC;IAAE,MAAM;IAAO,qBAAqB;GAAS;GAAE,UAAA;GAAA,QAAA,CAAA,oIAAA;EAAA,CAAA"}

package/fesm2022/hyalo-angular-split-text.mjs

@@ -0,0 +1,126 @@
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, DestroyRef, ElementRef, afterNextRender, afterRenderEffect, computed, inject, input, signal, viewChild } from "@angular/core";
+import { HyMotion } from "@hyalo/angular/motion";
+var HySplitText = class HySplitText {
+	el = inject(ElementRef).nativeElement;
+	motion = inject(HyMotion);
+	destroyRef = inject(DestroyRef);
+	measure = viewChild.required("measure", ...ngDevMode ? [{ debugName: "measure" }] : /* istanbul ignore next */ []);
+	text = input.required(...ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []);
+	lines = signal([], ...ngDevMode ? [{ debugName: "lines" }] : /* istanbul ignore next */ []);
+	entered = signal(false, ...ngDevMode ? [{ debugName: "entered" }] : /* istanbul ignore next */ []);
+	ready = signal(false, ...ngDevMode ? [{ debugName: "ready" }] : /* istanbul ignore next */ []);
+	remeasure;
+	shown = computed(() => this.entered() || !this.motion.enabled(), ...ngDevMode ? [{ debugName: "shown" }] : /* istanbul ignore next */ []);
+	words = computed(() => this.text().split(/(\s+)/u), ...ngDevMode ? [{ debugName: "words" }] : /* istanbul ignore next */ []);
+	constructor() {
+		afterRenderEffect(() => {
+			this.text();
+			if (this.ready()) this.remeasure?.();
+		});
+		afterNextRender(() => {
+			let alive = true;
+			const split = () => {
+				const lines = [];
+				let top;
+				for (const child of Array.from(this.measure().nativeElement.children)) {
+					const y = child.getBoundingClientRect().top;
+					if (top === void 0 || Math.abs(y - top) > 2) {
+						lines.push(child.textContent ?? "");
+						top = y;
+					} else lines[lines.length - 1] += child.textContent ?? "";
+				}
+				this.lines.set(lines);
+			};
+			const resize = typeof ResizeObserver === "function" ? new ResizeObserver(split) : null;
+			this.remeasure = split;
+			resize?.observe(this.el);
+			this.el.ownerDocument.fonts?.ready.then(() => {
+				if (alive) split();
+			});
+			split();
+			this.ready.set(true);
+			const observer = typeof IntersectionObserver === "function" ? new IntersectionObserver(([entry]) => {
+				if (entry?.isIntersecting) {
+					this.entered.set(true);
+					observer?.disconnect();
+				}
+			}) : null;
+			if (observer) observer.observe(this.el);
+			else this.entered.set(true);
+			this.destroyRef.onDestroy(() => {
+				alive = false;
+				resize?.disconnect();
+				observer?.disconnect();
+			});
+		});
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HySplitText,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.3",
+		type: HySplitText,
+		isStandalone: true,
+		selector: "hy-split-text",
+		inputs: { text: {
+			classPropertyName: "text",
+			publicName: "text",
+			isSignal: true,
+			isRequired: true,
+			transformFunction: null
+		} },
+		host: { properties: { "attr.data-shown": "shown()" } },
+		viewQueries: [{
+			propertyName: "measure",
+			first: true,
+			predicate: ["measure"],
+			descendants: true,
+			isSignal: true
+		}],
+		ngImport: i0,
+		template: "<span class=\"accessible\">{{ text() }}</span>\r\n<span #measure class=\"measure\" aria-hidden=\"true\">\r\n  @for (word of words(); track $index) {\r\n    <span>{{ word }}</span>\r\n  }\r\n</span>\r\n<span class=\"visual\" aria-hidden=\"true\">\r\n  @for (line of lines(); track $index; let i = $index) {\r\n    <span class=\"line\"\r\n      ><span [style.transition-delay.ms]=\"i * 60\">{{ line }}</span></span\r\n    >\r\n  } @empty {\r\n    {{ text() }}\r\n  }\r\n</span>\r\n",
+		styles: [":host{display:block;position:relative}.accessible{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.measure{position:absolute;inset:0;visibility:hidden;pointer-events:none;white-space:pre-wrap}.line{display:block;overflow:clip}.line>span{display:block;transition:transform var(--hy-dur-scene) var(--hy-ease-out),opacity var(--hy-dur-scene) var(--hy-ease-out)}:host([data-shown=\"false\"]) .line>span{transform:translateY(100%);opacity:0}@media(prefers-reduced-motion:reduce){.line>span{transform:none!important;opacity:1!important;transition:none}}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HySplitText,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "hy-split-text",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: { "[attr.data-shown]": "shown()" },
+			template: "<span class=\"accessible\">{{ text() }}</span>\r\n<span #measure class=\"measure\" aria-hidden=\"true\">\r\n  @for (word of words(); track $index) {\r\n    <span>{{ word }}</span>\r\n  }\r\n</span>\r\n<span class=\"visual\" aria-hidden=\"true\">\r\n  @for (line of lines(); track $index; let i = $index) {\r\n    <span class=\"line\"\r\n      ><span [style.transition-delay.ms]=\"i * 60\">{{ line }}</span></span\r\n    >\r\n  } @empty {\r\n    {{ text() }}\r\n  }\r\n</span>\r\n",
+			styles: [":host{display:block;position:relative}.accessible{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.measure{position:absolute;inset:0;visibility:hidden;pointer-events:none;white-space:pre-wrap}.line{display:block;overflow:clip}.line>span{display:block;transition:transform var(--hy-dur-scene) var(--hy-ease-out),opacity var(--hy-dur-scene) var(--hy-ease-out)}:host([data-shown=\"false\"]) .line>span{transform:translateY(100%);opacity:0}@media(prefers-reduced-motion:reduce){.line>span{transform:none!important;opacity:1!important;transition:none}}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		measure: [{
+			type: i0.ViewChild,
+			args: ["measure", { isSignal: true }]
+		}],
+		text: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "text",
+				required: true
+			}]
+		}]
+	}
+});
+export { HySplitText };
+
+//# sourceMappingURL=hyalo-angular-split-text.mjs.map

package/fesm2022/hyalo-angular-split-text.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"hyalo-angular-split-text.mjs","names":[],"sources":["../../../projects/hyalo/split-text/split-text.ts","../../../projects/hyalo/split-text/split-text.html"],"sourcesContent":["import {\r\n  ChangeDetectionStrategy,\r\n  Component,\r\n  DestroyRef,\r\n  ElementRef,\r\n  afterNextRender,\r\n  afterRenderEffect,\r\n  computed,\r\n  inject,\r\n  input,\r\n  signal,\r\n  viewChild,\r\n} from '@angular/core';\r\nimport { HyMotion } from '@hyalo/angular/motion';\r\n/** Splits measured lines after hydration. The accessible text is read once. */\r\n@Component({\r\n  selector: 'hy-split-text',\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  host: { '[attr.data-shown]': 'shown()' },\r\n  templateUrl: './split-text.html',\r\n  styleUrl: './split-text.css',\r\n})\r\nexport class HySplitText {\r\n  private readonly el = inject<ElementRef<HTMLElement>>(ElementRef).nativeElement;\r\n  private readonly motion = inject(HyMotion);\r\n  private readonly destroyRef = inject(DestroyRef);\r\n  private readonly measure = viewChild.required<ElementRef<HTMLElement>>('measure');\r\n  readonly text = input.required<string>();\r\n  protected readonly lines = signal<readonly string[]>([]);\r\n  private readonly entered = signal(false);\r\n  private readonly ready = signal(false);\r\n  private remeasure: (() => void) | undefined;\r\n  protected readonly shown = computed(() => this.entered() || !this.motion.enabled());\r\n  protected readonly words = computed(() => this.text().split(/(\\s+)/u));\r\n  constructor() {\r\n    afterRenderEffect(() => {\r\n      this.text();\r\n      if (this.ready()) this.remeasure?.();\r\n    });\r\n    afterNextRender(() => {\r\n      let alive = true;\r\n      const split = (): void => {\r\n        const lines: string[] = [];\r\n        let top: number | undefined;\r\n        for (const child of Array.from(this.measure().nativeElement.children)) {\r\n          const y = child.getBoundingClientRect().top;\r\n          if (top === undefined || Math.abs(y - top) > 2) {\r\n            lines.push(child.textContent ?? '');\r\n            top = y;\r\n          } else lines[lines.length - 1] += child.textContent ?? '';\r\n        }\r\n        this.lines.set(lines);\r\n      };\r\n      const resize = typeof ResizeObserver === 'function' ? new ResizeObserver(split) : null;\r\n      this.remeasure = split;\r\n      resize?.observe(this.el);\r\n      void this.el.ownerDocument.fonts?.ready.then(() => {\r\n        if (alive) split();\r\n      });\r\n      split();\r\n      this.ready.set(true);\r\n      const observer =\r\n        typeof IntersectionObserver === 'function'\r\n          ? new IntersectionObserver(([entry]) => {\r\n              if (entry?.isIntersecting) {\r\n                this.entered.set(true);\r\n                observer?.disconnect();\r\n              }\r\n            })\r\n          : null;\r\n      if (observer) observer.observe(this.el);\r\n      else this.entered.set(true);\r\n      this.destroyRef.onDestroy(() => {\r\n        alive = false;\r\n        resize?.disconnect();\r\n        observer?.disconnect();\r\n      });\r\n    });\r\n  }\r\n}\r\n","<span class=\"accessible\">{{ text() }}</span>\r\n<span #measure class=\"measure\" aria-hidden=\"true\">\r\n  @for (word of words(); track $index) {\r\n    <span>{{ word }}</span>\r\n  }\r\n</span>\r\n<span class=\"visual\" aria-hidden=\"true\">\r\n  @for (line of lines(); track $index; let i = $index) {\r\n    <span class=\"line\"\r\n      ><span [style.transition-delay.ms]=\"i * 60\">{{ line }}</span></span\r\n    >\r\n  } @empty {\r\n    {{ text() }}\r\n  }\r\n</span>\r\n"],"mappings":"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"}

package/fesm2022/hyalo-angular-stat.mjs

@@ -0,0 +1,193 @@
+import { HyNumberTicker } from "@hyalo/angular/number-ticker";
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, booleanAttribute, computed, input } from "@angular/core";
+var HyStat = class HyStat {
+	value = input.required(...ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []);
+	label = input.required(...ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []);
+	trend = input("", ...ngDevMode ? [{ debugName: "trend" }] : /* istanbul ignore next */ []);
+	locale = input(...ngDevMode ? [void 0, { debugName: "locale" }] : /* istanbul ignore next */ []);
+	format = input({ maximumFractionDigits: 0 }, ...ngDevMode ? [{ debugName: "format" }] : /* istanbul ignore next */ []);
+	animate = input(false, {
+		...ngDevMode ? { debugName: "animate" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	prefix = input("", ...ngDevMode ? [{ debugName: "prefix" }] : /* istanbul ignore next */ []);
+	suffix = input("", ...ngDevMode ? [{ debugName: "suffix" }] : /* istanbul ignore next */ []);
+	formatted = computed(() => this.prefix() + new Intl.NumberFormat(this.locale(), this.format()).format(Number.isFinite(this.value()) ? this.value() : 0) + this.suffix(), ...ngDevMode ? [{ debugName: "formatted" }] : /* istanbul ignore next */ []);
+	accessible = this.formatted;
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyStat,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.3",
+		type: HyStat,
+		isStandalone: true,
+		selector: "hy-stat",
+		inputs: {
+			value: {
+				classPropertyName: "value",
+				publicName: "value",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			label: {
+				classPropertyName: "label",
+				publicName: "label",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			trend: {
+				classPropertyName: "trend",
+				publicName: "trend",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			locale: {
+				classPropertyName: "locale",
+				publicName: "locale",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			format: {
+				classPropertyName: "format",
+				publicName: "format",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			animate: {
+				classPropertyName: "animate",
+				publicName: "animate",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			prefix: {
+				classPropertyName: "prefix",
+				publicName: "prefix",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			suffix: {
+				classPropertyName: "suffix",
+				publicName: "suffix",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "<dl>\r\n  <dt>{{ label() }}</dt>\r\n  <dd>\r\n    <hy-number-ticker\r\n      [value]=\"value()\"\r\n      [locale]=\"locale()\"\r\n      [format]=\"format()\"\r\n      [animate]=\"animate()\"\r\n      [prefix]=\"prefix()\"\r\n      [suffix]=\"suffix()\"\r\n    />\r\n  </dd>\r\n</dl>\r\n@if (trend()) {\r\n  <p>{{ trend() }}</p>\r\n}\r\n<ng-content />\r\n",
+		styles: [":host{display:block;min-inline-size:0;padding:1.5rem;background:var(--hy-surface-1);border:1px solid var(--hy-line);border-radius:var(--hy-radius-l);color:var(--hy-ink)}dl,p{margin:0}dt{color:var(--hy-ink-2);font-size:.875rem}dd{margin:.5rem 0 0;font-weight:600;font-size:clamp(1.75rem,3vw,2.5rem);letter-spacing:-.04em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}p{color:var(--hy-ink-2);font-size:.8125rem;margin-block-start:.5rem}.sr{position:absolute;inline-size:1px;block-size:1px;clip-path:inset(50%);overflow:hidden}\n"],
+		dependencies: [{
+			kind: "component",
+			type: HyNumberTicker,
+			selector: "hy-number-ticker",
+			inputs: [
+				"value",
+				"locale",
+				"format",
+				"animate",
+				"prefix",
+				"suffix"
+			]
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyStat,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "hy-stat",
+			imports: [HyNumberTicker],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<dl>\r\n  <dt>{{ label() }}</dt>\r\n  <dd>\r\n    <hy-number-ticker\r\n      [value]=\"value()\"\r\n      [locale]=\"locale()\"\r\n      [format]=\"format()\"\r\n      [animate]=\"animate()\"\r\n      [prefix]=\"prefix()\"\r\n      [suffix]=\"suffix()\"\r\n    />\r\n  </dd>\r\n</dl>\r\n@if (trend()) {\r\n  <p>{{ trend() }}</p>\r\n}\r\n<ng-content />\r\n",
+			styles: [":host{display:block;min-inline-size:0;padding:1.5rem;background:var(--hy-surface-1);border:1px solid var(--hy-line);border-radius:var(--hy-radius-l);color:var(--hy-ink)}dl,p{margin:0}dt{color:var(--hy-ink-2);font-size:.875rem}dd{margin:.5rem 0 0;font-weight:600;font-size:clamp(1.75rem,3vw,2.5rem);letter-spacing:-.04em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}p{color:var(--hy-ink-2);font-size:.8125rem;margin-block-start:.5rem}.sr{position:absolute;inline-size:1px;block-size:1px;clip-path:inset(50%);overflow:hidden}\n"]
+		}]
+	}],
+	propDecorators: {
+		value: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "value",
+				required: true
+			}]
+		}],
+		label: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "label",
+				required: true
+			}]
+		}],
+		trend: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "trend",
+				required: false
+			}]
+		}],
+		locale: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "locale",
+				required: false
+			}]
+		}],
+		format: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "format",
+				required: false
+			}]
+		}],
+		animate: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "animate",
+				required: false
+			}]
+		}],
+		prefix: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "prefix",
+				required: false
+			}]
+		}],
+		suffix: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "suffix",
+				required: false
+			}]
+		}]
+	}
+});
+export { HyStat };
+
+//# sourceMappingURL=hyalo-angular-stat.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"hyalo-angular-stat.mjs","names":[],"sources":["../../../projects/hyalo/stat/stat.ts","../../../projects/hyalo/stat/stat.html"],"sourcesContent":["import { HyNumberTicker } from '@hyalo/angular/number-ticker';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  booleanAttribute,\n  computed,\n  input,\n} from '@angular/core';\n@Component({\n  selector: 'hy-stat',\n  imports: [HyNumberTicker],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  templateUrl: './stat.html',\n  styleUrl: './stat.css',\n})\nexport class HyStat {\n  readonly value = input.required<number>();\n  readonly label = input.required<string>();\n  readonly trend = input('');\n  readonly locale = input<string>();\n  readonly format = input<Intl.NumberFormatOptions>({ maximumFractionDigits: 0 });\n  readonly animate = input(false, { transform: booleanAttribute });\n  readonly prefix = input('');\n  readonly suffix = input('');\n  readonly formatted = computed(\n    () =>\n      this.prefix() +\n      new Intl.NumberFormat(this.locale(), this.format()).format(\n        Number.isFinite(this.value()) ? this.value() : 0,\n      ) +\n      this.suffix(),\n  );\n  readonly accessible = this.formatted;\n}\n","<dl>\r\n  <dt>{{ label() }}</dt>\r\n  <dd>\r\n    <hy-number-ticker\r\n      [value]=\"value()\"\r\n      [locale]=\"locale()\"\r\n      [format]=\"format()\"\r\n      [animate]=\"animate()\"\r\n      [prefix]=\"prefix()\"\r\n      [suffix]=\"suffix()\"\r\n    />\r\n  </dd>\r\n</dl>\r\n@if (trend()) {\r\n  <p>{{ trend() }}</p>\r\n}\r\n<ng-content />\r\n"],"mappings":";;;AAeA,IAAa,SAAb,MAAa,OAAM;CACR,QAAQ,MAAM,SAAkB,GAAA,YAAA,CAAA,EAAA,WAAA,QAAA,CAAA,+BAAA,CAAA,CAAA;CAChC,QAAQ,MAAM,SAAkB,GAAA,YAAA,CAAA,EAAA,WAAA,QAAA,CAAA,+BAAA,CAAA,CAAA;CAChC,QAAQ,MAAM,IAAG,GAAA,YAAA,CAAA,EAAA,WAAA,QAAA,CAAA,+BAAA,CAAA,CAAA;CACjB,SAAS,MAAe,GAAA,YAAA,CAAA,QAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;CACxB,SAAS,MAAgC,EAAE,uBAAuB,EAAC,GAAG,GAAA,YAAA,CAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;CACtE,UAAU,MAAM,OAAK;EAAA,GAAA,YAAA,EAAA,WAAA,UAAA,+BAAA,CAAA;EAAI,WAAW;CAAgB,CAAA;CACpD,SAAS,MAAM,IAAG,GAAA,YAAA,CAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;CAClB,SAAS,MAAM,IAAG,GAAA,YAAA,CAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;CAClB,YAAY,eAEjB,KAAK,OAAM,IACX,IAAI,KAAK,aAAa,KAAK,OAAM,GAAI,KAAK,OAAM,CAAE,CAAC,CAAC,OAClD,OAAO,SAAS,KAAK,MAAK,CAAE,IAAI,KAAK,MAAK,IAAK,CAAC,IAElD,KAAK,OAAM,GACd,GAAA,YAAA,CAAA,EAAA,WAAA,YAAA,CAAA,+BAAA,CAAA,CAAA;CACQ,aAAa,KAAK;CAjBhB,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAM,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAAN,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAM,cAAA;EAAA,UAAA;EAAA,QAAA;GAAA,OAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,OAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,OAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,QAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,QAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,SAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,QAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,QAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;EAAA;EAAA,UAAA;EAAA,UCfnB;EAiBA,QAAA,CAAA,2hBAAA;EAAA,cAAA,CAAA;GAAA,MAAA;GAAA,MDPY;GAAc,UAAA;GAAA,QAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;GAAA;EAAA,CAAA;EAAA,iBAAA,GAAA,wBAAA;CAAA,CAAA;;AAKb,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAM,YAAA,CAAA;EAPlB,MAAA;EACW,MAAA,CAAA;GAAA,UAAA;GAAS,SACV,CAAC,cAAc;GAAC,iBACR,wBAAwB;GAAM,UAAA;GAAA,QAAA,CAAA,2hBAAA;EAAA,CAAA"}