ngwr 15.0.1 → 15.2.0

package/fesm2022/ngwr-charts-sparkline-testing.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngwr-charts-sparkline-testing.mjs","names":[],"sources":["../../../projects/lib/charts/sparkline/testing/wr-sparkline-harness.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { ComponentHarness, HarnessPredicate } from '@angular/cdk/testing';\n\nimport type { WrSparklineHarnessFilters } from './types';\n\n/**\n * Test harness for `<wr-sparkline>`.\n *\n * **The interesting assertion here is the ARIA one.** A sparkline is a trend line\n * with no axes and no labels, so it is either given an `ariaLabel` — in which case it\n * announces itself as an image — or it is decoration, and must be `aria-hidden` so a\n * screen reader does not stop on a nameless graphic. The component switches between\n * those two states on one input, and {@link isDecorative} is how a spec pins which\n * one it is in.\n *\n * The line itself is an SVG path, and a path's `d` is not something a spec should\n * assert: it is a rendering detail that changes with the viewBox, the stroke width\n * and the smoothing. What IS worth asserting is whether the parts are there —\n * {@link hasLine}, {@link hasArea}, {@link hasTip} — since each is an input the\n * consumer set, and an empty dataset draws none of them.\n *\n * @see https://ngwr.dev/guides/testing\n */\nexport class WrSparklineHarness extends ComponentHarness {\n  static hostSelector = 'wr-sparkline';\n\n  /** Build a predicate that narrows the query — pass to `getHarness` / `getAllHarnesses`. */\n  static with(options: WrSparklineHarnessFilters = {}): HarnessPredicate<WrSparklineHarness> {\n    return new HarnessPredicate(WrSparklineHarness, options).addOption(\n      'ariaLabel',\n      options.ariaLabel,\n      (harness, label) => HarnessPredicate.stringMatches(harness.getAccessibleName(), label)\n    );\n  }\n\n  private readonly svg = this.locatorFor('svg');\n\n  /** The name the chart announces, or `null` when it is decoration. */\n  async getAccessibleName(): Promise<string | null> {\n    return (await this.svg()).getAttribute('aria-label');\n  }\n\n  /** The role the chart claims — `img` when it is named, `null` when it is not. */\n  async getRole(): Promise<string | null> {\n    return (await this.svg()).getAttribute('role');\n  }\n\n  /**\n   * Whether the chart is hidden from assistive tech.\n   *\n   * The other half of {@link getAccessibleName}, and the pairing worth asserting\n   * together: a named sparkline must NOT be hidden, and an unnamed one must be, or a\n   * screen reader announces a graphic with nothing to say about it.\n   */\n  async isDecorative(): Promise<boolean> {\n    return (await (await this.svg()).getAttribute('aria-hidden')) === 'true';\n  }\n\n  /** Whether a trend line was drawn — `false` for an empty or single-point dataset. */\n  async hasLine(): Promise<boolean> {\n    return (await this.locatorForOptional('.wr-sparkline__line')()) !== null;\n  }\n\n  /** Whether the area under the line is filled (`showArea`). */\n  async hasArea(): Promise<boolean> {\n    return (await this.locatorForOptional('.wr-sparkline__area')()) !== null;\n  }\n\n  /** Whether the last point is marked with a dot (`showTip`). */\n  async hasTip(): Promise<boolean> {\n    return (await this.locatorForOptional('.wr-sparkline__tip')()) !== null;\n  }\n\n  /** The stroke colour as the component passed it through — a CSS value, not a resolved one. */\n  async getColor(): Promise<string | null> {\n    const line = await this.locatorForOptional('.wr-sparkline__line')();\n    return line ? line.getAttribute('stroke') : null;\n  }\n}\n"],"mappings":";;;;;;;AA6BA,IAAa,qBAAb,MAAa,2BAA2B,iBAAgB;CACtD,OAAO,eAAe;CAGtB,OAAO,KAAK,UAAqC,CAAA,GAAE;EACjD,OAAO,IAAI,iBAAiB,oBAAoB,OAAO,CAAC,CAAC,UACvD,aACA,QAAQ,YACP,SAAS,UAAU,iBAAiB,cAAc,QAAQ,kBAAiB,GAAI,KAAK,CAAC;CAE1F;CAEiB,MAAM,KAAK,WAAW,KAAK;CAG5C,MAAM,oBAAiB;EACrB,QAAQ,MAAM,KAAK,IAAG,EAAA,CAAI,aAAa,YAAY;CACrD;CAGA,MAAM,UAAO;EACX,QAAQ,MAAM,KAAK,IAAG,EAAA,CAAI,aAAa,MAAM;CAC/C;CASA,MAAM,eAAY;EAChB,OAAQ,OAAO,MAAM,KAAK,IAAG,EAAA,CAAI,aAAa,aAAa,MAAO;CACpE;CAGA,MAAM,UAAO;EACX,OAAQ,MAAM,KAAK,mBAAmB,qBAAqB,CAAC,CAAA,MAAQ;CACtE;CAGA,MAAM,UAAO;EACX,OAAQ,MAAM,KAAK,mBAAmB,qBAAqB,CAAC,CAAA,MAAQ;CACtE;CAGA,MAAM,SAAM;EACV,OAAQ,MAAM,KAAK,mBAAmB,oBAAoB,CAAC,CAAA,MAAQ;CACrE;CAGA,MAAM,WAAQ;EACZ,MAAM,OAAO,MAAM,KAAK,mBAAmB,qBAAqB,CAAC,CAAA;EACjE,OAAO,OAAO,KAAK,aAAa,QAAQ,IAAI;CAC9C"}
+{"version":3,"file":"ngwr-charts-sparkline-testing.mjs","names":[],"sources":["../../../projects/lib/charts/sparkline/testing/wr-sparkline-harness.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { ComponentHarness, HarnessPredicate } from '@angular/cdk/testing';\n\nimport type { WrSparklineHarnessFilters } from './types';\n\n/**\n * Test harness for `<wr-sparkline>`.\n *\n * **The interesting assertion here is the ARIA one.** A sparkline is a trend line\n * with no axes and no labels, so it is either given an `ariaLabel` — in which case it\n * announces itself as an image — or it is decoration, and must be `aria-hidden` so a\n * screen reader does not stop on a nameless graphic. The component switches between\n * those two states on one input, and {@link isDecorative} is how a spec pins which\n * one it is in.\n *\n * The line itself is an SVG path, and a path's `d` is not something a spec should\n * assert: it is a rendering detail that changes with the viewBox, the stroke width\n * and the smoothing. What IS worth asserting is whether the parts are there —\n * {@link hasLine}, {@link hasArea}, {@link hasTip} — since each is an input the\n * consumer set, and an empty dataset draws none of them.\n *\n * @see https://ngwr.dev/guides/testing\n */\nexport class WrSparklineHarness extends ComponentHarness {\n  static hostSelector = 'wr-sparkline';\n\n  /** Build a predicate that narrows the query — pass to `getHarness` / `getAllHarnesses`. */\n  static with(options: WrSparklineHarnessFilters = {}): HarnessPredicate<WrSparklineHarness> {\n    return new HarnessPredicate(WrSparklineHarness, options).addOption(\n      'ariaLabel',\n      options.ariaLabel,\n      (harness, label) => HarnessPredicate.stringMatches(harness.getAccessibleName(), label)\n    );\n  }\n\n  private readonly svg = this.locatorFor('svg');\n\n  /** The name the chart announces, or `null` when it is decoration. */\n  async getAccessibleName(): Promise<string | null> {\n    return (await this.svg()).getAttribute('aria-label');\n  }\n\n  /** The role the chart claims — `img` when it is named, `null` when it is not. */\n  async getRole(): Promise<string | null> {\n    return (await this.svg()).getAttribute('role');\n  }\n\n  /**\n   * Whether the chart is hidden from assistive tech.\n   *\n   * The other half of {@link getAccessibleName}, and the pairing worth asserting\n   * together: a named sparkline must NOT be hidden, and an unnamed one must be, or a\n   * screen reader announces a graphic with nothing to say about it.\n   */\n  async isDecorative(): Promise<boolean> {\n    return (await (await this.svg()).getAttribute('aria-hidden')) === 'true';\n  }\n\n  /**\n   * Whether a trend line was drawn — `false` for an empty dataset. A single point is a\n   * line that returns to its start, which the round cap paints as a dot, so it is `true`.\n   */\n  async hasLine(): Promise<boolean> {\n    return (await this.locatorForOptional('.wr-sparkline__line')()) !== null;\n  }\n\n  /** Whether the area under the line is filled (`showArea`). */\n  async hasArea(): Promise<boolean> {\n    return (await this.locatorForOptional('.wr-sparkline__area')()) !== null;\n  }\n\n  /** Whether the last point is marked with a dot (`showTip`). */\n  async hasTip(): Promise<boolean> {\n    return (await this.locatorForOptional('.wr-sparkline__tip')()) !== null;\n  }\n\n  /** The stroke colour as the component passed it through — a CSS value, not a resolved one. */\n  async getColor(): Promise<string | null> {\n    const line = await this.locatorForOptional('.wr-sparkline__line')();\n    return line ? line.getAttribute('stroke') : null;\n  }\n}\n"],"mappings":";;;;;;;AA6BA,IAAa,qBAAb,MAAa,2BAA2B,iBAAgB;CACtD,OAAO,eAAe;CAGtB,OAAO,KAAK,UAAqC,CAAA,GAAE;EACjD,OAAO,IAAI,iBAAiB,oBAAoB,OAAO,CAAC,CAAC,UACvD,aACA,QAAQ,YACP,SAAS,UAAU,iBAAiB,cAAc,QAAQ,kBAAiB,GAAI,KAAK,CAAC;CAE1F;CAEiB,MAAM,KAAK,WAAW,KAAK;CAG5C,MAAM,oBAAiB;EACrB,QAAQ,MAAM,KAAK,IAAG,EAAA,CAAI,aAAa,YAAY;CACrD;CAGA,MAAM,UAAO;EACX,QAAQ,MAAM,KAAK,IAAG,EAAA,CAAI,aAAa,MAAM;CAC/C;CASA,MAAM,eAAY;EAChB,OAAQ,OAAO,MAAM,KAAK,IAAG,EAAA,CAAI,aAAa,aAAa,MAAO;CACpE;CAMA,MAAM,UAAO;EACX,OAAQ,MAAM,KAAK,mBAAmB,qBAAqB,CAAC,CAAA,MAAQ;CACtE;CAGA,MAAM,UAAO;EACX,OAAQ,MAAM,KAAK,mBAAmB,qBAAqB,CAAC,CAAA,MAAQ;CACtE;CAGA,MAAM,SAAM;EACV,OAAQ,MAAM,KAAK,mBAAmB,oBAAoB,CAAC,CAAA,MAAQ;CACrE;CAGA,MAAM,WAAQ;EACZ,MAAM,OAAO,MAAM,KAAK,mBAAmB,qBAAqB,CAAC,CAAA;EACjE,OAAO,OAAO,KAAK,aAAa,QAAQ,IAAI;CAC9C"}

package/fesm2022/ngwr-charts-sparkline.mjs

@@ -1,6 +1,7 @@
 import * as i0 from "@angular/core";
-import { Component, ElementRef, LOCALE_ID, ViewEncapsulation, computed, inject, input, viewChild } from "@angular/core";
+import { Component, ElementRef, ViewEncapsulation, computed, inject, input, viewChild } from "@angular/core";
 import { coerceBooleanProperty, coerceNumberProperty } from "@angular/cdk/coercion";
+import { useChartNumbers } from "ngwr/charts/core";
 import { useChartTooltip } from "ngwr/popover";
 /**
 * @license
@@ -31,14 +32,7 @@ var WrSparkline = class WrSparkline {
 		transform: coerceBooleanProperty
 	});
 	valueFormat = input(null, ...ngDevMode ? [{ debugName: "valueFormat" }] : /* istanbul ignore next */ []);
-	locale = inject(LOCALE_ID);
-	numbers = new Intl.NumberFormat(this.locale);
-	smallNumbers = new Intl.NumberFormat(this.locale, { maximumSignificantDigits: 3 });
-	formatValue(value) {
-		const custom = this.valueFormat();
-		if (custom) return custom(value);
-		return (value !== 0 && Math.abs(value) < 1 ? this.smallNumbers : this.numbers).format(value);
-	}
+	numbers = useChartNumbers(this.valueFormat);
 	host = inject(ElementRef);
 	svg = viewChild("svg", ...ngDevMode ? [{ debugName: "svg" }] : /* istanbul ignore next */ []);
 	marker = viewChild("marker", ...ngDevMode ? [{ debugName: "marker" }] : /* istanbul ignore next */ []);
@@ -72,7 +66,11 @@ var WrSparkline = class WrSparkline {
 			y: pad + h - (v - min) / span * h
 		}));
 	}, ...ngDevMode ? [{ debugName: "points" }] : /* istanbul ignore next */ []);
-	linePath = computed(() => this.points().map((p, i) => `${i === 0 ? "M" : "L"} ${p.x.toFixed(2)} ${p.y.toFixed(2)}`).join(" "), ...ngDevMode ? [{ debugName: "linePath" }] : /* istanbul ignore next */ []);
+	linePath = computed(() => {
+		const points = this.points();
+		const path = points.map((p, i) => `${i === 0 ? "M" : "L"} ${p.x.toFixed(2)} ${p.y.toFixed(2)}`).join(" ");
+		return points.length === 1 ? `${path} L ${points[0].x.toFixed(2)} ${points[0].y.toFixed(2)}` : path;
+	}, ...ngDevMode ? [{ debugName: "linePath" }] : /* istanbul ignore next */ []);
 	areaPath = computed(() => {
 		const pts = this.points();
 		if (pts.length < 2) return "";
@@ -91,7 +89,7 @@ var WrSparkline = class WrSparkline {
 		return {
 			datum: {
 				label: this.ariaLabel() ?? void 0,
-				value: this.formatValue(value),
+				value: this.numbers.value(value),
 				color: this.color()
 			},
 			anchor: marker
@@ -130,7 +128,7 @@ var WrSparkline = class WrSparkline {
 	}
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
-		version: "22.2.3",
+		version: "22.2.4",
 		ngImport: i0,
 		type: WrSparkline,
 		deps: [],
@@ -138,7 +136,7 @@ var WrSparkline = class WrSparkline {
 	});
 	static ɵcmp = i0.ɵɵngDeclareComponent({
 		minVersion: "17.0.0",
-		version: "22.2.3",
+		version: "22.2.4",
 		type: WrSparkline,
 		isStandalone: true,
 		selector: "wr-sparkline",
@@ -229,13 +227,13 @@ var WrSparkline = class WrSparkline {
 			isSignal: true
 		}],
 		ngImport: i0,
-		template: "<svg\n  #svg\n  [attr.viewBox]=\"viewBox\"\n  [style.width]=\"width()\"\n  [style.height]=\"height()\"\n  [attr.role]=\"ariaLabel() ? 'img' : null\"\n  [attr.aria-label]=\"ariaLabel()\"\n  [attr.aria-hidden]=\"ariaLabel() ? null : 'true'\"\n  preserveAspectRatio=\"none\"\n  (mousemove)=\"onPointerMove($event)\"\n  (mouseleave)=\"tip.leave($event)\"\n>\n  @if (showArea() && areaPath()) {\n    <path class=\"wr-sparkline__area\" [attr.d]=\"areaPath()\" [attr.fill]=\"color()\" fill-opacity=\"0.15\" stroke=\"none\" />\n  }\n  @if (linePath()) {\n    <path\n      class=\"wr-sparkline__line\"\n      [attr.d]=\"linePath()\"\n      fill=\"none\"\n      [attr.stroke]=\"color()\"\n      [attr.stroke-width]=\"strokeWidth()\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n      vector-effect=\"non-scaling-stroke\"\n    />\n  }\n  <!-- A zero-length line with a round cap and a non-scaling stroke, which stays a\n       circle however the drawing stretches; a `<circle>` stretched with it, into a\n       21 × 5px pill on the docs' full-width demo. Three times the line's width. -->\n  @if (showTip() && tipPath(); as d) {\n    <path\n      class=\"wr-sparkline__tip\"\n      [attr.d]=\"d\"\n      fill=\"none\"\n      [attr.stroke]=\"color()\"\n      [attr.stroke-width]=\"strokeWidth() * 3\"\n      stroke-linecap=\"round\"\n      vector-effect=\"non-scaling-stroke\"\n    />\n  }\n</svg>\n@if (markerAt(); as at) {\n  <span\n    #marker\n    class=\"wr-sparkline__marker\"\n    aria-hidden=\"true\"\n    [style.left.px]=\"at.x\"\n    [style.top.px]=\"at.y\"\n    [style.background]=\"color()\"\n  ></span>\n}\n",
+		template: "<svg\n  #svg\n  [attr.viewBox]=\"viewBox\"\n  [style.width]=\"width()\"\n  [style.height]=\"height()\"\n  [attr.role]=\"ariaLabel() ? 'img' : null\"\n  [attr.aria-label]=\"ariaLabel()\"\n  [attr.aria-hidden]=\"ariaLabel() ? null : 'true'\"\n  preserveAspectRatio=\"none\"\n  (mousemove)=\"onPointerMove($event)\"\n  (mouseleave)=\"tip.leave($event)\"\n>\n  @if (showArea() && areaPath()) {\n    <!-- The fill's share of its colour is the stylesheet's, from `--wr-sparkline-area-opacity`. -->\n    <path class=\"wr-sparkline__area\" [attr.d]=\"areaPath()\" [attr.fill]=\"color()\" stroke=\"none\" />\n  }\n  @if (linePath()) {\n    <path\n      class=\"wr-sparkline__line\"\n      [attr.d]=\"linePath()\"\n      fill=\"none\"\n      [attr.stroke]=\"color()\"\n      [attr.stroke-width]=\"strokeWidth()\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n      vector-effect=\"non-scaling-stroke\"\n    />\n  }\n  <!-- A zero-length line with a round cap and a non-scaling stroke, which stays a\n       circle however the drawing stretches; a `<circle>` stretched with it, into a\n       21 × 5px pill on the docs' full-width demo. Three times the line's width. -->\n  @if (showTip() && tipPath(); as d) {\n    <path\n      class=\"wr-sparkline__tip\"\n      [attr.d]=\"d\"\n      fill=\"none\"\n      [attr.stroke]=\"color()\"\n      [attr.stroke-width]=\"strokeWidth() * 3\"\n      stroke-linecap=\"round\"\n      vector-effect=\"non-scaling-stroke\"\n    />\n  }\n</svg>\n@if (markerAt(); as at) {\n  <span\n    #marker\n    class=\"wr-sparkline__marker\"\n    aria-hidden=\"true\"\n    [style.left.px]=\"at.x\"\n    [style.top.px]=\"at.y\"\n    [style.background]=\"color()\"\n  ></span>\n}\n",
 		encapsulation: i0.ViewEncapsulation.None
 	});
 };
 i0.ɵɵngDeclareClassMetadata({
 	minVersion: "12.0.0",
-	version: "22.2.3",
+	version: "22.2.4",
 	ngImport: i0,
 	type: WrSparkline,
 	decorators: [{
@@ -244,7 +242,7 @@ i0.ɵɵngDeclareClassMetadata({
 			selector: "wr-sparkline",
 			encapsulation: ViewEncapsulation.None,
 			host: { class: "wr-sparkline" },
-			template: "<svg\n  #svg\n  [attr.viewBox]=\"viewBox\"\n  [style.width]=\"width()\"\n  [style.height]=\"height()\"\n  [attr.role]=\"ariaLabel() ? 'img' : null\"\n  [attr.aria-label]=\"ariaLabel()\"\n  [attr.aria-hidden]=\"ariaLabel() ? null : 'true'\"\n  preserveAspectRatio=\"none\"\n  (mousemove)=\"onPointerMove($event)\"\n  (mouseleave)=\"tip.leave($event)\"\n>\n  @if (showArea() && areaPath()) {\n    <path class=\"wr-sparkline__area\" [attr.d]=\"areaPath()\" [attr.fill]=\"color()\" fill-opacity=\"0.15\" stroke=\"none\" />\n  }\n  @if (linePath()) {\n    <path\n      class=\"wr-sparkline__line\"\n      [attr.d]=\"linePath()\"\n      fill=\"none\"\n      [attr.stroke]=\"color()\"\n      [attr.stroke-width]=\"strokeWidth()\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n      vector-effect=\"non-scaling-stroke\"\n    />\n  }\n  <!-- A zero-length line with a round cap and a non-scaling stroke, which stays a\n       circle however the drawing stretches; a `<circle>` stretched with it, into a\n       21 × 5px pill on the docs' full-width demo. Three times the line's width. -->\n  @if (showTip() && tipPath(); as d) {\n    <path\n      class=\"wr-sparkline__tip\"\n      [attr.d]=\"d\"\n      fill=\"none\"\n      [attr.stroke]=\"color()\"\n      [attr.stroke-width]=\"strokeWidth() * 3\"\n      stroke-linecap=\"round\"\n      vector-effect=\"non-scaling-stroke\"\n    />\n  }\n</svg>\n@if (markerAt(); as at) {\n  <span\n    #marker\n    class=\"wr-sparkline__marker\"\n    aria-hidden=\"true\"\n    [style.left.px]=\"at.x\"\n    [style.top.px]=\"at.y\"\n    [style.background]=\"color()\"\n  ></span>\n}\n"
+			template: "<svg\n  #svg\n  [attr.viewBox]=\"viewBox\"\n  [style.width]=\"width()\"\n  [style.height]=\"height()\"\n  [attr.role]=\"ariaLabel() ? 'img' : null\"\n  [attr.aria-label]=\"ariaLabel()\"\n  [attr.aria-hidden]=\"ariaLabel() ? null : 'true'\"\n  preserveAspectRatio=\"none\"\n  (mousemove)=\"onPointerMove($event)\"\n  (mouseleave)=\"tip.leave($event)\"\n>\n  @if (showArea() && areaPath()) {\n    <!-- The fill's share of its colour is the stylesheet's, from `--wr-sparkline-area-opacity`. -->\n    <path class=\"wr-sparkline__area\" [attr.d]=\"areaPath()\" [attr.fill]=\"color()\" stroke=\"none\" />\n  }\n  @if (linePath()) {\n    <path\n      class=\"wr-sparkline__line\"\n      [attr.d]=\"linePath()\"\n      fill=\"none\"\n      [attr.stroke]=\"color()\"\n      [attr.stroke-width]=\"strokeWidth()\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n      vector-effect=\"non-scaling-stroke\"\n    />\n  }\n  <!-- A zero-length line with a round cap and a non-scaling stroke, which stays a\n       circle however the drawing stretches; a `<circle>` stretched with it, into a\n       21 × 5px pill on the docs' full-width demo. Three times the line's width. -->\n  @if (showTip() && tipPath(); as d) {\n    <path\n      class=\"wr-sparkline__tip\"\n      [attr.d]=\"d\"\n      fill=\"none\"\n      [attr.stroke]=\"color()\"\n      [attr.stroke-width]=\"strokeWidth() * 3\"\n      stroke-linecap=\"round\"\n      vector-effect=\"non-scaling-stroke\"\n    />\n  }\n</svg>\n@if (markerAt(); as at) {\n  <span\n    #marker\n    class=\"wr-sparkline__marker\"\n    aria-hidden=\"true\"\n    [style.left.px]=\"at.x\"\n    [style.top.px]=\"at.y\"\n    [style.background]=\"color()\"\n  ></span>\n}\n"
 		}]
 	}],
 	propDecorators: {

package/fesm2022/ngwr-charts-sparkline.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngwr-charts-sparkline.mjs","names":[],"sources":["../../../projects/lib/charts/sparkline/sparkline.ts","../../../projects/lib/charts/sparkline/sparkline.html"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';\nimport { Component, ElementRef, LOCALE_ID, ViewEncapsulation, computed, inject, input, viewChild } from '@angular/core';\n\nimport { useChartTooltip } from 'ngwr/popover';\n\n/**\n * Tiny inline trend line. SVG path drawn from `[data]: number[]` — no\n * axes, no labels, just the shape. Optional area fill + tip dot.\n *\n * @example\n * ```html\n * <wr-sparkline [data]=\"[12, 14, 9, 17, 21, 18, 23]\" />\n * <wr-sparkline [data]=\"prices\" [showArea]=\"true\" color=\"var(--wr-color-success)\" />\n * ```\n *\n * @see https://ngwr.dev/charts/sparkline\n */\n@Component({\n  selector: 'wr-sparkline',\n  templateUrl: './sparkline.html',\n  encapsulation: ViewEncapsulation.None,\n  host: { class: 'wr-sparkline' },\n})\nexport class WrSparkline {\n  /**\n   * The values, left to right. Evenly spaced — a sparkline carries no x axis, so\n   * pass an already-ordered series rather than points with their own timestamps.\n   */\n  readonly data = input<readonly number[]>([]);\n\n  /**\n   * Accessible name. A sparkline usually sits beside the number it summarises, where\n   * announcing it again is noise — so it is `aria-hidden` by default and becomes a\n   * named `role=\"img\"` only when a consumer says what it shows.\n   */\n  readonly ariaLabel = input<string | null>(null);\n\n  /** Stroke colour. @default `var(--wr-color-primary)` */\n  readonly color = input<string>('var(--wr-color-primary)');\n\n  /**\n   * Line thickness in CSS pixels — `vector-effect=\"non-scaling-stroke\"` keeps it at\n   * that width whatever the box is stretched to, so it is NOT in viewBox units.\n   * @default 1.5\n   */\n  readonly strokeWidth = input(1.5, {\n    transform: (v: unknown): number => Math.max(0.1, coerceNumberProperty(v, 1.5)),\n  });\n\n  /** Fill the area below the line. @default false */\n  readonly showArea = input(false, { transform: coerceBooleanProperty });\n\n  /** Show a dot at the last data point. @default true */\n  readonly showTip = input(true, { transform: coerceBooleanProperty });\n\n  /** CSS width. @default '8rem' */\n  readonly width = input<string>('8rem');\n\n  /** CSS height. @default '2rem' */\n  readonly height = input<string>('2rem');\n\n  /**\n   * Show a tooltip with the value of the point nearest the pointer, marking that\n   * point, and named by `ariaLabel` when one is given. Pointer only. @default true\n   */\n  readonly tooltip = input(true, { transform: coerceBooleanProperty });\n\n  /**\n   * Writes the value in the tooltip. `null` uses `Intl.NumberFormat` in `LOCALE_ID`.\n   */\n  readonly valueFormat = input<((value: number) => string) | null>(null);\n\n  private readonly locale = inject(LOCALE_ID);\n  private readonly numbers = new Intl.NumberFormat(this.locale);\n  /** Below one, by significant digits, which keep 0.0004 from rounding to `0`. */\n  private readonly smallNumbers = new Intl.NumberFormat(this.locale, { maximumSignificantDigits: 3 });\n\n  private formatValue(value: number): string {\n    const custom = this.valueFormat();\n    if (custom) return custom(value);\n    return (value !== 0 && Math.abs(value) < 1 ? this.smallNumbers : this.numbers).format(value);\n  }\n\n  private readonly host = inject<ElementRef<HTMLElement>>(ElementRef);\n  private readonly svg = viewChild<ElementRef<SVGSVGElement>>('svg');\n  private readonly marker = viewChild<ElementRef<HTMLElement>>('marker');\n\n  // Drawn in a 100×40 viewBox — scales smoothly to any CSS size.\n  private readonly vbW = 100;\n  private readonly vbH = 40;\n  private readonly padding = 2;\n\n  /**\n   * The data as drawn. Non-finite values are dropped rather than scaled: every\n   * `min`/`max` comparison against a NaN is false, so it survived into the scale and\n   * `toFixed(2)` wrote the literal text `NaN` into the path `d` — invalid geometry,\n   * and the line vanishes. The tooltip reads this list too, so the value it shows is\n   * the one under the point it marks.\n   */\n  private readonly values = computed(() => this.data().filter(v => Number.isFinite(v)));\n\n  /** Mapped `{ x, y }` points for the path. */\n  protected readonly points = computed(() => {\n    const data = this.values();\n    if (data.length === 0) return [] as readonly { x: number; y: number }[];\n    if (data.length === 1) return [{ x: this.vbW / 2, y: this.vbH / 2 }];\n\n    let min = data[0];\n    let max = data[0];\n    for (const v of data) {\n      if (v < min) min = v;\n      if (v > max) max = v;\n    }\n    const pad = this.padding;\n    const w = this.vbW - pad * 2;\n    const h = this.vbH - pad * 2;\n    // A series with no spread has no shape, and dividing by the old `|| 1` fallback\n    // pinned every point to `pad + h` — the bottom edge — so a steady series at 500\n    // read as rock bottom. Centred instead, which is what a lone datum already does.\n    if (max === min) {\n      return data.map((_, i) => ({ x: pad + (i / (data.length - 1)) * w, y: this.vbH / 2 }));\n    }\n    const span = max - min;\n    return data.map((v, i) => ({\n      x: pad + (i / (data.length - 1)) * w,\n      y: pad + h - ((v - min) / span) * h,\n    }));\n  });\n\n  protected readonly linePath = computed(() =>\n    this.points()\n      .map((p, i) => `${i === 0 ? 'M' : 'L'} ${p.x.toFixed(2)} ${p.y.toFixed(2)}`)\n      .join(' ')\n  );\n\n  protected readonly areaPath = computed(() => {\n    const pts = this.points();\n    if (pts.length < 2) return '';\n    const baseY = this.vbH - this.padding;\n    const start = `M ${pts[0].x.toFixed(2)} ${baseY}`;\n    const line = pts.map(p => `L ${p.x.toFixed(2)} ${p.y.toFixed(2)}`).join(' ');\n    const close = `L ${pts[pts.length - 1].x.toFixed(2)} ${baseY} Z`;\n    return `${start} ${line} ${close}`;\n  });\n\n  /** A zero-length line at the last point, which a round cap paints as the tip dot. */\n  protected readonly tipPath = computed(() => {\n    const last = this.points().at(-1);\n    return last ? `M ${last.x.toFixed(2)} ${last.y.toFixed(2)} h 0` : null;\n  });\n\n  protected readonly viewBox = `0 0 ${this.vbW} ${this.vbH}`;\n\n  /**\n   * One tooltip, pointing at the hovered point: above its marker, below it when there\n   * is no room. The marker is the anchor element itself, drawn for the point the\n   * tooltip reads — it renders before this runs, since both follow `tip.active()`.\n   *\n   * The chip sits INSIDE the drawing, over the stretch of line above the marker, so the\n   * helper is also told which point any spot over the drawing reads: a pointer scrubbing\n   * along the top of a sparkline would otherwise land on the chip and stop there.\n   */\n  protected readonly tip = useChartTooltip(\n    this.tooltip,\n    index => {\n      const value = this.values()[index];\n      const marker = this.marker()?.nativeElement;\n      if (value === undefined || !marker) return null;\n      return {\n        datum: { label: this.ariaLabel() ?? undefined, value: this.formatValue(value), color: this.color() },\n        anchor: marker,\n      };\n    },\n    (x, y) => {\n      const svg = this.svg()?.nativeElement;\n      if (!svg) return null;\n      const box = svg.getBoundingClientRect();\n      if (x < box.left || x > box.right || y < box.top || y > box.bottom) return null;\n      return this.indexAt(x, box);\n    }\n  );\n\n  /**\n   * The marker's place in pixels from the host's padding edge, measured off the\n   * DRAWING's box. An element rather than a `<circle>`: the drawing stretches to\n   * any box with `preserveAspectRatio=\"none\"`, which would squash a circle into an\n   * ellipse.\n   *\n   * Not percentages of the host, which is what it was: the host is only the\n   * drawing's size until something stretches it — `width: 100%` on the element,\n   * `display: block`, a column flex parent — while the drawing keeps its `width`.\n   * Measured in Chromium, WebKit and Firefox on a 327px host round the default\n   * 128px drawing, the marker for a point at 115px landed at 292px, out in empty\n   * space with the chip above it. Read when a point is hovered, so the boxes are\n   * laid out; `tip.active()` is never set on the server.\n   */\n  protected readonly markerAt = computed(() => {\n    const index = this.tip.active();\n    const point = index === null ? undefined : this.points()[index];\n    const svg = this.svg()?.nativeElement;\n    if (!point || !svg) return null;\n    const host = this.host.nativeElement;\n    const outer = host.getBoundingClientRect();\n    const box = svg.getBoundingClientRect();\n    return {\n      x: box.left - outer.left - host.clientLeft + (point.x / this.vbW) * box.width,\n      y: box.top - outer.top - host.clientTop + (point.y / this.vbH) * box.height,\n    };\n  });\n\n  protected onPointerMove(event: MouseEvent): void {\n    const index = this.indexAt(event.clientX, (event.currentTarget as Element).getBoundingClientRect());\n    if (index !== null) this.tip.enter(index);\n  }\n\n  /**\n   * The point nearest the pointer, along x only — the points are evenly spaced, so\n   * that is a rounding rather than a search. A box with no width (nothing laid out\n   * yet) answers nothing rather than a NaN index.\n   */\n  private indexAt(clientX: number, box: DOMRect): number | null {\n    const count = this.points().length;\n    if (count === 0 || box.width <= 0) return null;\n    if (count === 1) return 0;\n    const x = ((clientX - box.left) / box.width) * this.vbW;\n    const step = (this.vbW - this.padding * 2) / (count - 1);\n    return Math.min(count - 1, Math.max(0, Math.round((x - this.padding) / step)));\n  }\n}\n","<svg\n  #svg\n  [attr.viewBox]=\"viewBox\"\n  [style.width]=\"width()\"\n  [style.height]=\"height()\"\n  [attr.role]=\"ariaLabel() ? 'img' : null\"\n  [attr.aria-label]=\"ariaLabel()\"\n  [attr.aria-hidden]=\"ariaLabel() ? null : 'true'\"\n  preserveAspectRatio=\"none\"\n  (mousemove)=\"onPointerMove($event)\"\n  (mouseleave)=\"tip.leave($event)\"\n>\n  @if (showArea() && areaPath()) {\n    <path class=\"wr-sparkline__area\" [attr.d]=\"areaPath()\" [attr.fill]=\"color()\" fill-opacity=\"0.15\" stroke=\"none\" />\n  }\n  @if (linePath()) {\n    <path\n      class=\"wr-sparkline__line\"\n      [attr.d]=\"linePath()\"\n      fill=\"none\"\n      [attr.stroke]=\"color()\"\n      [attr.stroke-width]=\"strokeWidth()\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n      vector-effect=\"non-scaling-stroke\"\n    />\n  }\n  <!-- A zero-length line with a round cap and a non-scaling stroke, which stays a\n       circle however the drawing stretches; a `<circle>` stretched with it, into a\n       21 × 5px pill on the docs' full-width demo. Three times the line's width. -->\n  @if (showTip() && tipPath(); as d) {\n    <path\n      class=\"wr-sparkline__tip\"\n      [attr.d]=\"d\"\n      fill=\"none\"\n      [attr.stroke]=\"color()\"\n      [attr.stroke-width]=\"strokeWidth() * 3\"\n      stroke-linecap=\"round\"\n      vector-effect=\"non-scaling-stroke\"\n    />\n  }\n</svg>\n@if (markerAt(); as at) {\n  <span\n    #marker\n    class=\"wr-sparkline__marker\"\n    aria-hidden=\"true\"\n    [style.left.px]=\"at.x\"\n    [style.top.px]=\"at.y\"\n    [style.background]=\"color()\"\n  ></span>\n}\n"],"mappings":"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"}
+{"version":3,"file":"ngwr-charts-sparkline.mjs","names":[],"sources":["../../../projects/lib/charts/sparkline/sparkline.ts","../../../projects/lib/charts/sparkline/sparkline.html"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';\nimport { Component, ElementRef, ViewEncapsulation, computed, inject, input, viewChild } from '@angular/core';\n\nimport { useChartNumbers } from 'ngwr/charts/core';\nimport { useChartTooltip } from 'ngwr/popover';\n\n/**\n * Tiny inline trend line. SVG path drawn from `[data]: number[]` — no\n * axes, no labels, just the shape. Optional area fill + tip dot.\n *\n * @example\n * ```html\n * <wr-sparkline [data]=\"[12, 14, 9, 17, 21, 18, 23]\" />\n * <wr-sparkline [data]=\"prices\" [showArea]=\"true\" color=\"var(--wr-color-success)\" />\n * ```\n *\n * @see https://ngwr.dev/charts/sparkline\n */\n@Component({\n  selector: 'wr-sparkline',\n  templateUrl: './sparkline.html',\n  encapsulation: ViewEncapsulation.None,\n  host: { class: 'wr-sparkline' },\n})\nexport class WrSparkline {\n  /**\n   * The values, left to right. Evenly spaced — a sparkline carries no x axis, so\n   * pass an already-ordered series rather than points with their own timestamps.\n   */\n  readonly data = input<readonly number[]>([]);\n\n  /**\n   * Accessible name. A sparkline usually sits beside the number it summarises, where\n   * announcing it again is noise — so it is `aria-hidden` by default and becomes a\n   * named `role=\"img\"` only when a consumer says what it shows.\n   */\n  readonly ariaLabel = input<string | null>(null);\n\n  /** Stroke colour. @default 'var(--wr-color-primary)' */\n  readonly color = input<string>('var(--wr-color-primary)');\n\n  /**\n   * Line thickness in CSS pixels — `vector-effect=\"non-scaling-stroke\"` keeps it at\n   * that width whatever the box is stretched to, so it is NOT in viewBox units.\n   * @default 1.5\n   */\n  readonly strokeWidth = input(1.5, {\n    transform: (v: unknown): number => Math.max(0.1, coerceNumberProperty(v, 1.5)),\n  });\n\n  /** Fill the area below the line, faintly (`--wr-sparkline-area-opacity`). @default false */\n  readonly showArea = input(false, { transform: coerceBooleanProperty });\n\n  /** Show a dot at the last data point. @default true */\n  readonly showTip = input(true, { transform: coerceBooleanProperty });\n\n  /** CSS width. @default '8rem' */\n  readonly width = input<string>('8rem');\n\n  /** CSS height. @default '2rem' */\n  readonly height = input<string>('2rem');\n\n  /**\n   * Show a tooltip with the value of the point nearest the pointer, marking that\n   * point, and named by `ariaLabel` when one is given. Pointer only. @default true\n   */\n  readonly tooltip = input(true, { transform: coerceBooleanProperty });\n\n  /**\n   * Writes the value in the tooltip. `null` uses `Intl.NumberFormat` in `LOCALE_ID`.\n   */\n  readonly valueFormat = input<((value: number) => string) | null>(null);\n\n  /** The value as the tooltip writes it — in full, never compact, to `Intl`'s default precision. */\n  private readonly numbers = useChartNumbers(this.valueFormat);\n\n  private readonly host = inject<ElementRef<HTMLElement>>(ElementRef);\n  private readonly svg = viewChild<ElementRef<SVGSVGElement>>('svg');\n  private readonly marker = viewChild<ElementRef<HTMLElement>>('marker');\n\n  // Drawn in a 100×40 viewBox — scales smoothly to any CSS size.\n  private readonly vbW = 100;\n  private readonly vbH = 40;\n  private readonly padding = 2;\n\n  /**\n   * The data as drawn. Non-finite values are dropped rather than scaled: every\n   * `min`/`max` comparison against a NaN is false, so it survived into the scale and\n   * `toFixed(2)` wrote the literal text `NaN` into the path `d` — invalid geometry,\n   * and the line vanishes. The tooltip reads this list too, so the value it shows is\n   * the one under the point it marks.\n   */\n  private readonly values = computed(() => this.data().filter(v => Number.isFinite(v)));\n\n  /** Mapped `{ x, y }` points for the path. */\n  protected readonly points = computed(() => {\n    const data = this.values();\n    if (data.length === 0) return [] as readonly { x: number; y: number }[];\n    if (data.length === 1) return [{ x: this.vbW / 2, y: this.vbH / 2 }];\n\n    let min = data[0];\n    let max = data[0];\n    for (const v of data) {\n      if (v < min) min = v;\n      if (v > max) max = v;\n    }\n    const pad = this.padding;\n    const w = this.vbW - pad * 2;\n    const h = this.vbH - pad * 2;\n    // A series with no spread has no shape, and dividing by the old `|| 1` fallback\n    // pinned every point to `pad + h` — the bottom edge — so a steady series at 500\n    // read as rock bottom. Centred instead, which is what a lone datum already does.\n    if (max === min) {\n      return data.map((_, i) => ({ x: pad + (i / (data.length - 1)) * w, y: this.vbH / 2 }));\n    }\n    const span = max - min;\n    return data.map((v, i) => ({\n      x: pad + (i / (data.length - 1)) * w,\n      y: pad + h - ((v - min) / span) * h,\n    }));\n  });\n\n  /**\n   * The line through every point. A lone point repeats itself: a subpath of one `M` is\n   * never stroked, so a one-value sparkline with `showTip` off drew nothing at all, and\n   * the round cap paints the repeat as a dot of the line's width.\n   */\n  protected readonly linePath = computed(() => {\n    const points = this.points();\n    const path = points.map((p, i) => `${i === 0 ? 'M' : 'L'} ${p.x.toFixed(2)} ${p.y.toFixed(2)}`).join(' ');\n    return points.length === 1 ? `${path} L ${points[0].x.toFixed(2)} ${points[0].y.toFixed(2)}` : path;\n  });\n\n  protected readonly areaPath = computed(() => {\n    const pts = this.points();\n    if (pts.length < 2) return '';\n    const baseY = this.vbH - this.padding;\n    const start = `M ${pts[0].x.toFixed(2)} ${baseY}`;\n    const line = pts.map(p => `L ${p.x.toFixed(2)} ${p.y.toFixed(2)}`).join(' ');\n    const close = `L ${pts[pts.length - 1].x.toFixed(2)} ${baseY} Z`;\n    return `${start} ${line} ${close}`;\n  });\n\n  /** A zero-length line at the last point, which a round cap paints as the tip dot. */\n  protected readonly tipPath = computed(() => {\n    const last = this.points().at(-1);\n    return last ? `M ${last.x.toFixed(2)} ${last.y.toFixed(2)} h 0` : null;\n  });\n\n  protected readonly viewBox = `0 0 ${this.vbW} ${this.vbH}`;\n\n  /**\n   * One tooltip, pointing at the hovered point: above its marker, below it when there\n   * is no room. The marker is the anchor element itself, drawn for the point the\n   * tooltip reads — it renders before this runs, since both follow `tip.active()`.\n   *\n   * The chip sits INSIDE the drawing, over the stretch of line above the marker, so the\n   * helper is also told which point any spot over the drawing reads: a pointer scrubbing\n   * along the top of a sparkline would otherwise land on the chip and stop there.\n   */\n  protected readonly tip = useChartTooltip(\n    this.tooltip,\n    index => {\n      const value = this.values()[index];\n      const marker = this.marker()?.nativeElement;\n      if (value === undefined || !marker) return null;\n      return {\n        datum: { label: this.ariaLabel() ?? undefined, value: this.numbers.value(value), color: this.color() },\n        anchor: marker,\n      };\n    },\n    (x, y) => {\n      const svg = this.svg()?.nativeElement;\n      if (!svg) return null;\n      const box = svg.getBoundingClientRect();\n      if (x < box.left || x > box.right || y < box.top || y > box.bottom) return null;\n      return this.indexAt(x, box);\n    }\n  );\n\n  /**\n   * The marker's place in pixels from the host's padding edge, measured off the\n   * DRAWING's box. An element rather than a `<circle>`: the drawing stretches to\n   * any box with `preserveAspectRatio=\"none\"`, which would squash a circle into an\n   * ellipse.\n   *\n   * Not percentages of the host, which is what it was: the host is only the\n   * drawing's size until something stretches it — `width: 100%` on the element,\n   * `display: block`, a column flex parent — while the drawing keeps its `width`.\n   * Measured in Chromium, WebKit and Firefox on a 327px host round the default\n   * 128px drawing, the marker for a point at 115px landed at 292px, out in empty\n   * space with the chip above it. Read when a point is hovered, so the boxes are\n   * laid out; `tip.active()` is never set on the server.\n   */\n  protected readonly markerAt = computed(() => {\n    const index = this.tip.active();\n    const point = index === null ? undefined : this.points()[index];\n    const svg = this.svg()?.nativeElement;\n    if (!point || !svg) return null;\n    const host = this.host.nativeElement;\n    const outer = host.getBoundingClientRect();\n    const box = svg.getBoundingClientRect();\n    return {\n      x: box.left - outer.left - host.clientLeft + (point.x / this.vbW) * box.width,\n      y: box.top - outer.top - host.clientTop + (point.y / this.vbH) * box.height,\n    };\n  });\n\n  protected onPointerMove(event: MouseEvent): void {\n    const index = this.indexAt(event.clientX, (event.currentTarget as Element).getBoundingClientRect());\n    if (index !== null) this.tip.enter(index);\n  }\n\n  /**\n   * The point nearest the pointer, along x only — the points are evenly spaced, so\n   * that is a rounding rather than a search. A box with no width (nothing laid out\n   * yet) answers nothing rather than a NaN index.\n   */\n  private indexAt(clientX: number, box: DOMRect): number | null {\n    const count = this.points().length;\n    if (count === 0 || box.width <= 0) return null;\n    if (count === 1) return 0;\n    const x = ((clientX - box.left) / box.width) * this.vbW;\n    const step = (this.vbW - this.padding * 2) / (count - 1);\n    return Math.min(count - 1, Math.max(0, Math.round((x - this.padding) / step)));\n  }\n}\n","<svg\n  #svg\n  [attr.viewBox]=\"viewBox\"\n  [style.width]=\"width()\"\n  [style.height]=\"height()\"\n  [attr.role]=\"ariaLabel() ? 'img' : null\"\n  [attr.aria-label]=\"ariaLabel()\"\n  [attr.aria-hidden]=\"ariaLabel() ? null : 'true'\"\n  preserveAspectRatio=\"none\"\n  (mousemove)=\"onPointerMove($event)\"\n  (mouseleave)=\"tip.leave($event)\"\n>\n  @if (showArea() && areaPath()) {\n    <!-- The fill's share of its colour is the stylesheet's, from `--wr-sparkline-area-opacity`. -->\n    <path class=\"wr-sparkline__area\" [attr.d]=\"areaPath()\" [attr.fill]=\"color()\" stroke=\"none\" />\n  }\n  @if (linePath()) {\n    <path\n      class=\"wr-sparkline__line\"\n      [attr.d]=\"linePath()\"\n      fill=\"none\"\n      [attr.stroke]=\"color()\"\n      [attr.stroke-width]=\"strokeWidth()\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n      vector-effect=\"non-scaling-stroke\"\n    />\n  }\n  <!-- A zero-length line with a round cap and a non-scaling stroke, which stays a\n       circle however the drawing stretches; a `<circle>` stretched with it, into a\n       21 × 5px pill on the docs' full-width demo. Three times the line's width. -->\n  @if (showTip() && tipPath(); as d) {\n    <path\n      class=\"wr-sparkline__tip\"\n      [attr.d]=\"d\"\n      fill=\"none\"\n      [attr.stroke]=\"color()\"\n      [attr.stroke-width]=\"strokeWidth() * 3\"\n      stroke-linecap=\"round\"\n      vector-effect=\"non-scaling-stroke\"\n    />\n  }\n</svg>\n@if (markerAt(); as at) {\n  <span\n    #marker\n    class=\"wr-sparkline__marker\"\n    aria-hidden=\"true\"\n    [style.left.px]=\"at.x\"\n    [style.top.px]=\"at.y\"\n    [style.background]=\"color()\"\n  ></span>\n}\n"],"mappings":"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"}

package/fesm2022/ngwr-charts-treemap-chart-testing.mjs

@@ -0,0 +1,103 @@
+import { ComponentHarness, HarnessPredicate } from "@angular/cdk/testing";
+/**
+* @license
+*
+* Use of this source code is governed by an MIT-style license that can be
+* found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+*/
+function declaration(style, property) {
+	const escaped = property.replace(/[-/\\^$*+?.()|[\]{}]/g, "\\$&");
+	return new RegExp(`(?:^|;)\\s*${escaped}:\\s*([^;]+)`).exec(style)?.[1].trim() ?? null;
+}
+var TableRowHarness = class extends ComponentHarness {
+	static hostSelector = ".wr-chart-table tbody tr";
+	async read() {
+		const header = await this.locatorFor("th[scope=\"row\"]")();
+		const cells = await this.locatorForAll("td")();
+		return {
+			header: await header.text(),
+			cells: await Promise.all(cells.map((cell) => cell.text()))
+		};
+	}
+};
+var TileHarness = class extends ComponentHarness {
+	static hostSelector = ".wr-treemap-chart__tile";
+	async read() {
+		const host = await this.host();
+		const label = await this.locatorForOptional(".wr-treemap-chart__label")();
+		const value = await this.locatorForOptional(".wr-treemap-chart__value")();
+		const style = await host.getAttribute("style") ?? "";
+		const box = (property) => {
+			const written = declaration(style, property);
+			if (!written?.endsWith("%")) throw new Error(`WrTreemapChartHarness.getTiles(): no percentage for \`${property}\` on a tile (style: "${style}"). The component writes all four unconditionally, so its absence is the bug rather than a zero.`);
+			return Number.parseFloat(written);
+		};
+		const rect = {
+			start: box("inset-inline-start"),
+			top: box("top"),
+			width: box("width"),
+			height: box("height")
+		};
+		return {
+			label: label ? await label.text() : null,
+			value: value ? await value.text() : null,
+			group: await host.hasClass("wr-treemap-chart__tile--group"),
+			color: declaration(style, "--wr-treemap-chart-tile-color"),
+			box: rect
+		};
+	}
+};
+var WrTreemapChartHarness = class WrTreemapChartHarness extends ComponentHarness {
+	static hostSelector = "wr-treemap-chart";
+	static with(options = {}) {
+		return new HarnessPredicate(WrTreemapChartHarness, options).addOption("ariaLabel", options.ariaLabel, (harness, label) => HarnessPredicate.stringMatches(harness.getAccessibleName(), label)).addOption("tileLabel", options.tileLabel, async (harness, label) => {
+			for (const name of await harness.getLabels()) if (await HarnessPredicate.stringMatches(name, label)) return true;
+			return false;
+		});
+	}
+	async getAccessibleName() {
+		return (await this.locatorFor(".wr-treemap-chart__plot")()).getAttribute("aria-label");
+	}
+	async getTiles() {
+		const tiles = await this.locatorForAll(TileHarness)();
+		return Promise.all(tiles.map((tile) => tile.read()));
+	}
+	async getTileCount() {
+		return (await this.locatorForAll(".wr-treemap-chart__tile")()).length;
+	}
+	async getGroupCount() {
+		return (await this.locatorForAll(".wr-treemap-chart__tile--group")()).length;
+	}
+	async getLeafCount() {
+		return (await this.locatorForAll(".wr-treemap-chart__tile--leaf")()).length;
+	}
+	async getLabels() {
+		const labels = await this.locatorForAll(".wr-treemap-chart__label")();
+		return Promise.all(labels.map((label) => label.text()));
+	}
+	async hasDataTable() {
+		return await this.locatorForOptional(".wr-chart-table")() !== null;
+	}
+	async getTableColumns() {
+		await this.assertDataTable("getTableColumns");
+		const headings = await this.locatorForAll(".wr-chart-table thead th[scope=\"col\"]")();
+		return Promise.all(headings.map((heading) => heading.text()));
+	}
+	async getTableRows() {
+		await this.assertDataTable("getTableRows");
+		const rows = await this.locatorForAll(TableRowHarness)();
+		return Promise.all(rows.map((row) => row.read()));
+	}
+	async getPlotHeight() {
+		const style = await (await this.locatorFor(".wr-treemap-chart__plot")()).getAttribute("style") ?? "";
+		const written = declaration(style, "height");
+		if (!written?.endsWith("px")) throw new Error(`WrTreemapChartHarness.getPlotHeight(): no inline height on .wr-treemap-chart__plot (style: "${style}"). The component writes one unconditionally, so its absence is the bug rather than a zero.`);
+		return Number.parseFloat(written);
+	}
+	async assertDataTable(method) {
+		if (!await this.hasDataTable()) throw new Error(`WrTreemapChartHarness.${method}(): the chart renders no data table — \`dataTable\` is off. Ask hasDataTable() first.`);
+	}
+};
+export { WrTreemapChartHarness };
+
+//# sourceMappingURL=ngwr-charts-treemap-chart-testing.mjs.map

package/fesm2022/ngwr-charts-treemap-chart-testing.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngwr-charts-treemap-chart-testing.mjs","names":[],"sources":["../../../projects/lib/charts/treemap-chart/testing/wr-treemap-chart-harness.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { ComponentHarness, HarnessPredicate } from '@angular/cdk/testing';\n\nimport type {\n  WrTreemapChartHarnessFilters,\n  WrTreemapChartTableRow,\n  WrTreemapChartTile,\n  WrTreemapChartTileBox,\n} from './types';\n\n/** One declaration of an inline `style` attribute, or `null` when the component wrote none. */\nfunction declaration(style: string, property: string): string | null {\n  const escaped = property.replace(/[-/\\\\^$*+?.()|[\\]{}]/g, '\\\\$&');\n  return new RegExp(`(?:^|;)\\\\s*${escaped}:\\\\s*([^;]+)`).exec(style)?.[1].trim() ?? null;\n}\n\n/**\n * One body row of the chart's data table, so its header and cells are read off the row\n * they sit in rather than matched up by position across the whole table.\n */\nclass TableRowHarness extends ComponentHarness {\n  static hostSelector = '.wr-chart-table tbody tr';\n\n  async read(): Promise<WrTreemapChartTableRow> {\n    const header = await this.locatorFor('th[scope=\"row\"]')();\n    const cells = await this.locatorForAll('td')();\n    return { header: await header.text(), cells: await Promise.all(cells.map(cell => cell.text())) };\n  }\n}\n\n/** One tile, so its name and figure are read off the tile they sit in. */\nclass TileHarness extends ComponentHarness {\n  static hostSelector = '.wr-treemap-chart__tile';\n\n  async read(): Promise<WrTreemapChartTile> {\n    const host = await this.host();\n    const label = await this.locatorForOptional('.wr-treemap-chart__label')();\n    const value = await this.locatorForOptional('.wr-treemap-chart__value')();\n    const style = (await host.getAttribute('style')) ?? '';\n    const box = (property: string): number => {\n      const written = declaration(style, property);\n      if (!written?.endsWith('%')) {\n        throw new Error(\n          `WrTreemapChartHarness.getTiles(): no percentage for \\`${property}\\` on a tile (style: \"${style}\"). ` +\n            'The component writes all four unconditionally, so its absence is the bug rather than a zero.'\n        );\n      }\n      return Number.parseFloat(written);\n    };\n    const rect: WrTreemapChartTileBox = {\n      start: box('inset-inline-start'),\n      top: box('top'),\n      width: box('width'),\n      height: box('height'),\n    };\n    return {\n      label: label ? await label.text() : null,\n      value: value ? await value.text() : null,\n      group: await host.hasClass('wr-treemap-chart__tile--group'),\n      color: declaration(style, '--wr-treemap-chart-tile-color'),\n      box: rect,\n    };\n  }\n}\n\n/**\n * Test harness for `<wr-treemap-chart>`.\n *\n * **What it reads is what the component WROTE**: each tile's rectangle as the\n * percentages on its `style` attribute, its colour as the custom property beside them,\n * its name and figure as text, and the data table. Those are what the layout and the\n * data wiring produce, and what breaks when either does. jsdom lays nothing out, so a\n * name is read in full whether a browser would ellipsise it or not, and there is no\n * method for whether it was. Nor for whether a value fits: the stylesheet hides a value\n * wider than its tile by wrapping it out of sight, which takes a layout jsdom does not\n * have, so {@link getTiles} gives the text the component printed, fitting or not.\n *\n * **The layout is cut for the plot's measured size**, and jsdom measures nothing: in a\n * spec the chart cuts it for the width it assumes before measuring, 640 px, at its\n * `height`. So a spec can pin areas and order, which hold at any size, and should not\n * pin a tile's exact shape, which a browser's real width changes.\n *\n * **The tooltip is not opened from here.** It is pointer only, it renders into the\n * overlay container rather than the chart, and it says nothing the data table does not:\n * {@link getTableRows} reads the same path, value and share, which is where a keyboard\n * and a screen reader find them too.\n *\n * @example\n * ```ts\n * const chart = await loader.getHarness(WrTreemapChartHarness.with({ ariaLabel: 'Budget' }));\n *\n * expect(await chart.getLabels()).toContain('Engineering');\n * expect(await chart.getGroupCount()).toBe(2);\n * ```\n *\n * @see https://ngwr.dev/guides/testing\n */\nexport class WrTreemapChartHarness extends ComponentHarness {\n  static hostSelector = 'wr-treemap-chart';\n\n  /** Build a predicate that narrows the query — pass to `getHarness` / `getAllHarnesses`. */\n  static with(options: WrTreemapChartHarnessFilters = {}): HarnessPredicate<WrTreemapChartHarness> {\n    return new HarnessPredicate(WrTreemapChartHarness, options)\n      .addOption('ariaLabel', options.ariaLabel, (harness, label) =>\n        HarnessPredicate.stringMatches(harness.getAccessibleName(), label)\n      )\n      .addOption('tileLabel', options.tileLabel, async (harness, label) => {\n        for (const name of await harness.getLabels()) {\n          if (await HarnessPredicate.stringMatches(name, label)) return true;\n        }\n        return false;\n      });\n  }\n\n  /** The drawing's accessible name — the only thing about it a screen reader hears. */\n  async getAccessibleName(): Promise<string | null> {\n    return (await this.locatorFor('.wr-treemap-chart__plot')()).getAttribute('aria-label');\n  }\n\n  /**\n   * Every tile drawn, parents before their children and siblings largest first: its name\n   * and figure where it has room for them, whether it holds its children, its colour, and\n   * its rectangle.\n   *\n   * A node with no area — no value, zero, negative — draws no tile, and is in the data\n   * table all the same.\n   */\n  async getTiles(): Promise<WrTreemapChartTile[]> {\n    const tiles = await this.locatorForAll(TileHarness)();\n    return Promise.all(tiles.map(tile => tile.read()));\n  }\n\n  /** How many tiles were drawn, groups and leaves together. */\n  async getTileCount(): Promise<number> {\n    return (await this.locatorForAll('.wr-treemap-chart__tile')()).length;\n  }\n\n  /** How many tiles hold their children inside them. */\n  async getGroupCount(): Promise<number> {\n    return (await this.locatorForAll('.wr-treemap-chart__tile--group')()).length;\n  }\n\n  /** How many tiles hold nothing: leaves, and groups too small to draw their children in. */\n  async getLeafCount(): Promise<number> {\n    return (await this.locatorForAll('.wr-treemap-chart__tile--leaf')()).length;\n  }\n\n  /**\n   * The names written on the tiles, in the order drawn — a group's in its strip, a leaf's\n   * in its corner. A tile too small for its name writes none, and `showLabels` off writes\n   * none at all.\n   */\n  async getLabels(): Promise<string[]> {\n    const labels = await this.locatorForAll('.wr-treemap-chart__label')();\n    return Promise.all(labels.map(label => label.text()));\n  }\n\n  /** Whether the hidden data table is rendered (`dataTable`). */\n  async hasDataTable(): Promise<boolean> {\n    return (await this.locatorForOptional('.wr-chart-table')()) !== null;\n  }\n\n  /**\n   * The data table's column headings: the value's name (`valueLabel`) and the share's.\n   *\n   * Throws when the chart renders no table (`dataTable` off) rather than answering with no\n   * columns.\n   */\n  async getTableColumns(): Promise<string[]> {\n    await this.assertDataTable('getTableColumns');\n    const headings = await this.locatorForAll('.wr-chart-table thead th[scope=\"col\"]')();\n    return Promise.all(headings.map(heading => heading.text()));\n  }\n\n  /**\n   * The data table's rows, one per node, parents before their children in the data's own\n   * order: its path, its value and its share of the whole, as a screen reader walks them.\n   * A node with no area has an empty share, and a leaf with no value an empty value too.\n   *\n   * Throws when the chart renders no table (`dataTable` off), for the reason\n   * {@link getTableColumns} gives.\n   */\n  async getTableRows(): Promise<WrTreemapChartTableRow[]> {\n    await this.assertDataTable('getTableRows');\n    const rows = await this.locatorForAll(TableRowHarness)();\n    return Promise.all(rows.map(row => row.read()));\n  }\n\n  /**\n   * The plot's height in pixels — `height` as the component wrote it — read off the\n   * `style` ATTRIBUTE of the plot rather than through `getCssValue()`, which answers from\n   * the laid-out box and so agrees in jsdom and not in a browser.\n   */\n  async getPlotHeight(): Promise<number> {\n    const style = (await (await this.locatorFor('.wr-treemap-chart__plot')()).getAttribute('style')) ?? '';\n    const written = declaration(style, 'height');\n    if (!written?.endsWith('px')) {\n      throw new Error(\n        `WrTreemapChartHarness.getPlotHeight(): no inline height on .wr-treemap-chart__plot (style: \"${style}\"). ` +\n          'The component writes one unconditionally, so its absence is the bug rather than a zero.'\n      );\n    }\n    return Number.parseFloat(written);\n  }\n\n  private async assertDataTable(method: string): Promise<void> {\n    if (!(await this.hasDataTable())) {\n      throw new Error(\n        `WrTreemapChartHarness.${method}(): the chart renders no data table — \\`dataTable\\` is off. Ask hasDataTable() first.`\n      );\n    }\n  }\n}\n"],"mappings":"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"}