@sentropic/design-system-angular 0.36.54

package/dist/HeatmapChart.js

@@ -0,0 +1,331 @@
+import { NgFor } from "@angular/common";
+import { Component, Input as NgInput } from "@angular/core";
+import { classNames } from "./classNames.js";
+import * as i0 from "@angular/core";
+const MARGIN = { top: 28, right: 18, bottom: 44, left: 64 };
+const TONES = [
+    "category1",
+    "category2",
+    "category3",
+    "category4",
+    "category5",
+    "category6",
+    "category7",
+    "category8",
+];
+function uniqueInOrder(values) {
+    const seen = new Set();
+    const out = [];
+    for (const value of values) {
+        if (!seen.has(value)) {
+            seen.add(value);
+            out.push(value);
+        }
+    }
+    return out;
+}
+function normalizedScale(value) {
+    return value === "sequential" ? "sequential" : "categorical";
+}
+function toneForValue(value, min, max) {
+    if (!Number.isFinite(value) || max <= min)
+        return "category1";
+    const index = Math.max(0, Math.min(TONES.length - 1, Math.floor(((value - min) / (max - min)) * TONES.length)));
+    return TONES[index];
+}
+export class HeatmapChart {
+    static stComponentName = "HeatmapChart";
+    componentName = "HeatmapChart";
+    margin = MARGIN;
+    tones = TONES;
+    data = [];
+    width;
+    height;
+    scale;
+    legend;
+    label;
+    classInput;
+    hoveredIndex = null;
+    get resolvedScale() {
+        return normalizedScale(this.scale);
+    }
+    get resolvedWidth() {
+        return this.width ?? 480;
+    }
+    get resolvedHeight() {
+        return this.height ?? 300;
+    }
+    get viewBox() {
+        return `0 0 ${this.resolvedWidth} ${this.resolvedHeight}`;
+    }
+    get hostClass() {
+        return classNames("st-heatmapChart", `st-heatmapChart--${this.resolvedScale}`, this.classInput);
+    }
+    get xLabels() {
+        return uniqueInOrder((this.data ?? []).map((d) => d.x));
+    }
+    get yLabels() {
+        return uniqueInOrder((this.data ?? []).map((d) => d.y));
+    }
+    get plotWidth() {
+        return Math.max(this.resolvedWidth - MARGIN.left - MARGIN.right, 1);
+    }
+    get plotHeight() {
+        return Math.max(this.resolvedHeight - MARGIN.top - MARGIN.bottom, 1);
+    }
+    get cells() {
+        const data = this.data ?? [];
+        const xLabels = this.xLabels;
+        const yLabels = this.yLabels;
+        const cellWidth = xLabels.length > 0 ? this.plotWidth / xLabels.length : this.plotWidth;
+        const cellHeight = yLabels.length > 0 ? this.plotHeight / yLabels.length : this.plotHeight;
+        const values = data.map((d) => d.value).filter(Number.isFinite);
+        const min = values.length > 0 ? Math.min(...values) : 0;
+        const max = values.length > 0 ? Math.max(...values) : 1;
+        return data.map((datum) => {
+            const xIndex = Math.max(0, xLabels.indexOf(datum.x));
+            const yIndex = Math.max(0, yLabels.indexOf(datum.y));
+            const x = MARGIN.left + xIndex * cellWidth;
+            const y = MARGIN.top + yIndex * cellHeight;
+            return {
+                datum,
+                tone: this.resolvedScale === "sequential" ? toneForValue(datum.value, min, max) : datum.tone ?? toneForValue(datum.value, min, max),
+                x,
+                y,
+                width: Math.max(cellWidth - 2, 1),
+                height: Math.max(cellHeight - 2, 1),
+                cx: x + cellWidth / 2,
+                cy: y + cellHeight / 2,
+            };
+        });
+    }
+    get dataValueItems() {
+        return (this.data ?? []).map((d) => `${d.y}, ${d.x}: ${d.value}`);
+    }
+    get hoveredCell() {
+        return this.hoveredIndex !== null ? this.cells[this.hoveredIndex] : undefined;
+    }
+    get tooltipLeft() {
+        const cell = this.hoveredCell;
+        return cell ? `${(cell.cx / this.resolvedWidth) * 100}%` : "0%";
+    }
+    get tooltipTop() {
+        const cell = this.hoveredCell;
+        return cell ? `${(cell.cy / this.resolvedHeight) * 100}%` : "0%";
+    }
+    get tooltipLabel() {
+        const cell = this.hoveredCell;
+        return cell ? `${cell.datum.y}, ${cell.datum.x}` : "";
+    }
+    get tooltipValue() {
+        const cell = this.hoveredCell;
+        return cell ? String(cell.datum.value) : "";
+    }
+    maxCount(value) {
+        return Math.max(value, 1);
+    }
+    cellClass(index, tone) {
+        return classNames("st-heatmapChart__cell", `st-heatmapChart__cell--${tone}`, this.hoveredIndex !== null && this.hoveredIndex !== index ? "st-heatmapChart__cell--dim" : undefined);
+    }
+    handleVisualPointerMove(event) {
+        const target = event.target;
+        if (!(target instanceof Element)) {
+            this.hoveredIndex = null;
+            return;
+        }
+        const index = Number(target.getAttribute("data-chart-index"));
+        this.hoveredIndex = Number.isInteger(index) ? index : null;
+    }
+    handleLeave() {
+        this.hoveredIndex = null;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: HeatmapChart, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.17", type: HeatmapChart, isStandalone: true, selector: "st-heatmap-chart", inputs: { data: "data", width: "width", height: "height", scale: "scale", legend: "legend", label: "label", classInput: ["class", "classInput"] }, ngImport: i0, template: `
+    <div [attr.data-st-component]="componentName" [class]="hostClass">
+      <div
+        class="st-heatmapChart__visual"
+        role="img"
+        [attr.aria-label]="label"
+        (pointermove)="handleVisualPointerMove($event)"
+        (pointerleave)="handleLeave()"
+      >
+        <svg
+          [attr.viewBox]="viewBox"
+          preserveAspectRatio="xMidYMid meet"
+          width="100%"
+          height="100%"
+          focusable="false"
+          aria-hidden="true"
+        >
+          <text
+            *ngFor="let yLabel of yLabels; let row = index"
+            class="st-heatmapChart__axisLabel st-heatmapChart__axisLabel--y"
+            [attr.x]="margin.left - 8"
+            [attr.y]="margin.top + (row + 0.5) * (plotHeight / maxCount(yLabels.length))"
+            text-anchor="end"
+            dominant-baseline="middle"
+          >{{ yLabel }}</text>
+
+          <text
+            *ngFor="let xLabel of xLabels; let column = index"
+            class="st-heatmapChart__axisLabel st-heatmapChart__axisLabel--x"
+            [attr.x]="margin.left + (column + 0.5) * (plotWidth / maxCount(xLabels.length))"
+            [attr.y]="resolvedHeight - margin.bottom + 20"
+            text-anchor="middle"
+          >{{ xLabel }}</text>
+
+          <rect
+            class="st-heatmapChart__plot"
+            [attr.x]="margin.left"
+            [attr.y]="margin.top"
+            [attr.width]="plotWidth"
+            [attr.height]="plotHeight"
+          ></rect>
+
+          <rect
+            *ngFor="let cell of cells; let i = index"
+            [attr.class]="cellClass(i, cell.tone)"
+            [attr.x]="cell.x"
+            [attr.y]="cell.y"
+            [attr.width]="cell.width"
+            [attr.height]="cell.height"
+            rx="2"
+            [attr.data-chart-index]="i"
+          ></rect>
+        </svg>
+      </div>
+
+      <ul class="st-chartDataList" [attr.aria-label]="label + ' data'">
+        <li *ngFor="let item of dataValueItems">{{ item }}</li>
+      </ul>
+
+      <div
+        class="st-heatmapChart__tooltip"
+        role="presentation"
+        [style.display]="hoveredCell ? 'inline-flex' : 'none'"
+        [style.left]="tooltipLeft"
+        [style.top]="tooltipTop"
+      >
+        <span class="st-heatmapChart__tooltipLabel">{{ tooltipLabel }}</span>
+        <span class="st-heatmapChart__tooltipValue">{{ tooltipValue }}</span>
+      </div>
+
+      <div class="st-heatmapChart__legend" aria-hidden="true" [style.display]="legend ? 'flex' : 'none'">
+        <span class="st-heatmapChart__legendText">Low</span>
+        <span class="st-heatmapChart__legendRamp">
+          <span
+            *ngFor="let tone of tones"
+            [attr.class]="'st-heatmapChart__legendSwatch st-heatmapChart__legendSwatch--' + tone"
+          ></span>
+        </span>
+        <span class="st-heatmapChart__legendText">High</span>
+      </div>
+    </div>
+  `, isInline: true, dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: HeatmapChart, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "st-heatmap-chart",
+                    standalone: true,
+                    imports: [NgFor],
+                    template: `
+    <div [attr.data-st-component]="componentName" [class]="hostClass">
+      <div
+        class="st-heatmapChart__visual"
+        role="img"
+        [attr.aria-label]="label"
+        (pointermove)="handleVisualPointerMove($event)"
+        (pointerleave)="handleLeave()"
+      >
+        <svg
+          [attr.viewBox]="viewBox"
+          preserveAspectRatio="xMidYMid meet"
+          width="100%"
+          height="100%"
+          focusable="false"
+          aria-hidden="true"
+        >
+          <text
+            *ngFor="let yLabel of yLabels; let row = index"
+            class="st-heatmapChart__axisLabel st-heatmapChart__axisLabel--y"
+            [attr.x]="margin.left - 8"
+            [attr.y]="margin.top + (row + 0.5) * (plotHeight / maxCount(yLabels.length))"
+            text-anchor="end"
+            dominant-baseline="middle"
+          >{{ yLabel }}</text>
+
+          <text
+            *ngFor="let xLabel of xLabels; let column = index"
+            class="st-heatmapChart__axisLabel st-heatmapChart__axisLabel--x"
+            [attr.x]="margin.left + (column + 0.5) * (plotWidth / maxCount(xLabels.length))"
+            [attr.y]="resolvedHeight - margin.bottom + 20"
+            text-anchor="middle"
+          >{{ xLabel }}</text>
+
+          <rect
+            class="st-heatmapChart__plot"
+            [attr.x]="margin.left"
+            [attr.y]="margin.top"
+            [attr.width]="plotWidth"
+            [attr.height]="plotHeight"
+          ></rect>
+
+          <rect
+            *ngFor="let cell of cells; let i = index"
+            [attr.class]="cellClass(i, cell.tone)"
+            [attr.x]="cell.x"
+            [attr.y]="cell.y"
+            [attr.width]="cell.width"
+            [attr.height]="cell.height"
+            rx="2"
+            [attr.data-chart-index]="i"
+          ></rect>
+        </svg>
+      </div>
+
+      <ul class="st-chartDataList" [attr.aria-label]="label + ' data'">
+        <li *ngFor="let item of dataValueItems">{{ item }}</li>
+      </ul>
+
+      <div
+        class="st-heatmapChart__tooltip"
+        role="presentation"
+        [style.display]="hoveredCell ? 'inline-flex' : 'none'"
+        [style.left]="tooltipLeft"
+        [style.top]="tooltipTop"
+      >
+        <span class="st-heatmapChart__tooltipLabel">{{ tooltipLabel }}</span>
+        <span class="st-heatmapChart__tooltipValue">{{ tooltipValue }}</span>
+      </div>
+
+      <div class="st-heatmapChart__legend" aria-hidden="true" [style.display]="legend ? 'flex' : 'none'">
+        <span class="st-heatmapChart__legendText">Low</span>
+        <span class="st-heatmapChart__legendRamp">
+          <span
+            *ngFor="let tone of tones"
+            [attr.class]="'st-heatmapChart__legendSwatch st-heatmapChart__legendSwatch--' + tone"
+          ></span>
+        </span>
+        <span class="st-heatmapChart__legendText">High</span>
+      </div>
+    </div>
+  `,
+                }]
+        }], propDecorators: { data: [{
+                type: NgInput
+            }], width: [{
+                type: NgInput
+            }], height: [{
+                type: NgInput
+            }], scale: [{
+                type: NgInput
+            }], legend: [{
+                type: NgInput
+            }], label: [{
+                type: NgInput
+            }], classInput: [{
+                type: NgInput,
+                args: ["class"]
+            }] } });
+//# sourceMappingURL=HeatmapChart.js.map

package/dist/HeatmapChart.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HeatmapChart.js","sourceRoot":"","sources":["../src/HeatmapChart.ts"],"names":[],"mappings":"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"}

package/dist/HeikinAshiChart.d.ts

@@ -0,0 +1,82 @@
+import * as i0 from "@angular/core";
+export type HeikinAshiChartDatum = {
+    label: string;
+    open: number;
+    high: number;
+    low: number;
+    close: number;
+};
+export type HeikinAshiChartProps = {
+    data: HeikinAshiChartDatum[];
+    label: string;
+    width?: number;
+    height?: number;
+    class?: string;
+};
+type HACandle = {
+    label: string;
+    haOpen: number;
+    haHigh: number;
+    haLow: number;
+    haClose: number;
+};
+type Candle = {
+    datum: HACandle;
+    index: number;
+    bullish: boolean;
+    centerX: number;
+    bodyX: number;
+    bodyY: number;
+    bodyW: number;
+    bodyH: number;
+    wickHighY: number;
+    wickLowY: number;
+    tooltipY: number;
+};
+type GridItem = {
+    tick: number;
+    y: number;
+};
+export declare class HeikinAshiChart {
+    static readonly stComponentName = "HeikinAshiChart";
+    readonly componentName = "HeikinAshiChart";
+    readonly margin: {
+        readonly top: 12;
+        readonly right: 16;
+        readonly bottom: 32;
+        readonly left: 52;
+    };
+    private hoveredIndex;
+    data: HeikinAshiChartDatum[];
+    label: string;
+    width?: number;
+    height?: number;
+    classInput?: string;
+    get hostClass(): string;
+    get widthValue(): number;
+    get heightValue(): number;
+    get viewBox(): string;
+    get plotWidth(): number;
+    get plotHeight(): number;
+    get validData(): HeikinAshiChartDatum[];
+    get haData(): HACandle[];
+    get ticks(): number[];
+    get domainMin(): number;
+    get domainMax(): number;
+    get gridItems(): GridItem[];
+    get candles(): Candle[];
+    get dataValueItems(): string[];
+    get hoveredCandle(): Candle | null;
+    wickClass(c: Candle): string;
+    bodyClass(c: Candle): string;
+    formatTickLabel(tick: number): string;
+    fmtTooltip(v: number): string;
+    tooltipLeftPct(c: Candle): string;
+    tooltipTopPct(c: Candle): string;
+    handlePointerMove(event: PointerEvent): void;
+    handlePointerLeave(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<HeikinAshiChart, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<HeikinAshiChart, "st-heikin-ashi-chart", never, { "data": { "alias": "data"; "required": false; }; "label": { "alias": "label"; "required": false; }; "width": { "alias": "width"; "required": false; }; "height": { "alias": "height"; "required": false; }; "classInput": { "alias": "class"; "required": false; }; }, {}, never, never, true, never>;
+}
+export {};
+//# sourceMappingURL=HeikinAshiChart.d.ts.map

package/dist/HeikinAshiChart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HeikinAshiChart.d.ts","sourceRoot":"","sources":["../src/HeikinAshiChart.ts"],"names":[],"mappings":"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"}