@weeehaoooz/talos-ui 0.1.0 → 0.1.2

package/fesm2022/weeehaoooz-talos-ui-data-viz-sparkline.mjs

@@ -1,566 +0,0 @@
-import * as i0 from '@angular/core';
-import { inject, ElementRef, input, output, signal, computed, afterNextRender, DestroyRef, Component, NgModule } from '@angular/core';
-
-/**
- * Types and interfaces for TalosSparklineComponent
- */
-const GOLDEN_RATIO = 1.618;
-
-const PRESET_PALETTES = {
-    primary: { stroke: '#2563eb', fillStart: 'rgba(37, 99, 235, 0.35)', fillEnd: 'rgba(37, 99, 235, 0.0)' },
-    blue: { stroke: '#3b82f6', fillStart: 'rgba(59, 130, 246, 0.35)', fillEnd: 'rgba(59, 130, 246, 0.0)' },
-    success: { stroke: '#16a34a', fillStart: 'rgba(22, 163, 74, 0.35)', fillEnd: 'rgba(22, 163, 74, 0.0)' },
-    emerald: { stroke: '#10b981', fillStart: 'rgba(16, 185, 129, 0.35)', fillEnd: 'rgba(16, 185, 129, 0.0)' },
-    danger: { stroke: '#ef4444', fillStart: 'rgba(239, 68, 68, 0.35)', fillEnd: 'rgba(239, 68, 68, 0.0)' },
-    rose: { stroke: '#f43f5e', fillStart: 'rgba(244, 63, 94, 0.35)', fillEnd: 'rgba(244, 63, 94, 0.0)' },
-    warning: { stroke: '#f59e0b', fillStart: 'rgba(245, 158, 11, 0.35)', fillEnd: 'rgba(245, 158, 11, 0.0)' },
-    amber: { stroke: '#d97706', fillStart: 'rgba(217, 119, 6, 0.35)', fillEnd: 'rgba(217, 119, 6, 0.0)' },
-    info: { stroke: '#0284c7', fillStart: 'rgba(2, 132, 199, 0.35)', fillEnd: 'rgba(2, 132, 199, 0.0)' },
-    cyan: { stroke: '#06b6d4', fillStart: 'rgba(6, 182, 212, 0.35)', fillEnd: 'rgba(6, 182, 212, 0.0)' },
-    violet: { stroke: '#8b5cf6', fillStart: 'rgba(139, 92, 246, 0.35)', fillEnd: 'rgba(139, 92, 246, 0.0)' },
-    slate: { stroke: '#64748b', fillStart: 'rgba(100, 116, 139, 0.3)', fillEnd: 'rgba(100, 116, 139, 0.0)' }
-};
-// Golden Ratio (~1.618:1) and proportional defaults
-const DEFAULT_SIZE_DIMENSIONS = {
-    xs: { width: 64, height: 40 },
-    sm: { width: 96, height: 60 },
-    md: { width: 130, height: 80 },
-    lg: { width: 180, height: 110 },
-    responsive: { width: 240, height: 60 },
-    custom: { width: 130, height: 80 }
-};
-let uniqueIdCounter = 0;
-class TalosSparklineComponent {
-    elementRef = inject(ElementRef);
-    resizeObserver;
-    /** Data points (numbers or objects) */
-    data = input([], /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
-    /** Chart type: line, area, or bar */
-    type = input('area', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
-    /** Visual color theme or custom hex code */
-    color = input('primary', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
-    /** Automatically choose green/red based on first -> last delta */
-    autoColorTrend = input(false, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "autoColorTrend" }] : /* istanbul ignore next */ []));
-    /** Smooth Bezier interpolation vs straight line */
-    smooth = input(true, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "smooth" }] : /* istanbul ignore next */ []));
-    /** Stroke line width */
-    strokeWidth = input(2, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "strokeWidth" }] : /* istanbul ignore next */ []));
-    /** Marker dots display mode */
-    showMarkers = input('none', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "showMarkers" }] : /* istanbul ignore next */ []));
-    /** Marker circle radius */
-    markerRadius = input(3.5, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "markerRadius" }] : /* istanbul ignore next */ []));
-    /** Optional reference horizontal baseline */
-    referenceValue = input(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "referenceValue" }] : /* istanbul ignore next */ []));
-    /** Show interactive hover tooltip */
-    showTooltip = input(true, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "showTooltip" }] : /* istanbul ignore next */ []));
-    /** Interactive mouse events enabled */
-    interactive = input(true, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "interactive" }] : /* istanbul ignore next */ []));
-    /** Gap between bars for bar sparklines */
-    barGap = input(3, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "barGap" }] : /* istanbul ignore next */ []));
-    /** Corner radius for bars */
-    barRadius = input(2, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "barRadius" }] : /* istanbul ignore next */ []));
-    /** Preset size */
-    size = input('md', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    /** Aspect ratio configuration (e.g. 'golden', 1.618, '2:1', '16:9') */
-    aspectRatio = input(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "aspectRatio" }] : /* istanbul ignore next */ []));
-    /** Custom width override (e.g. '120px' or '100%') */
-    width = input(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
-    /** Custom height override (e.g. '36px') */
-    height = input(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
-    /** Explicit minimum value bounds */
-    min = input(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
-    /** Explicit maximum value bounds */
-    max = input(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
-    /** Custom accessible label */
-    ariaLabel = input(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
-    /** Value formatter for tooltip */
-    valueFormatter = input((val) => val.toLocaleString(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "valueFormatter" }] : /* istanbul ignore next */ []));
-    /** Hover event emitter */
-    pointHover = output();
-    /** Click event emitter */
-    pointClick = output();
-    // Unique ID for SVG linear gradient IDs
-    gradientId = `talos-sparkline-grad-${++uniqueIdCounter}`;
-    // Interactive hover state
-    hoveredPoint = signal(null, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "hoveredPoint" }] : /* istanbul ignore next */ []));
-    isHovering = signal(false, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "isHovering" }] : /* istanbul ignore next */ []));
-    // Dynamic container dimensions for 1:1 SVG coordinate rendering (prevents non-uniform stretching)
-    containerWidth = signal(120, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "containerWidth" }] : /* istanbul ignore next */ []));
-    containerHeight = signal(36, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "containerHeight" }] : /* istanbul ignore next */ []));
-    svgWidth = computed(() => this.containerWidth(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "svgWidth" }] : /* istanbul ignore next */ []));
-    svgHeight = computed(() => this.containerHeight(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "svgHeight" }] : /* istanbul ignore next */ []));
-    padding = computed(() => {
-        if (this.type() === 'bar')
-            return 2;
-        if (this.showMarkers() !== 'none' || this.interactive())
-            return 5;
-        return 3;
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "padding" }] : /* istanbul ignore next */ []));
-    constructor() {
-        afterNextRender(() => {
-            this.updateDimensions();
-            if (typeof ResizeObserver !== 'undefined') {
-                this.resizeObserver = new ResizeObserver((entries) => {
-                    for (const entry of entries) {
-                        const { width, height } = entry.contentRect;
-                        if (width > 0 && height > 0) {
-                            this.containerWidth.set(Math.round(width));
-                            this.containerHeight.set(Math.round(height));
-                        }
-                    }
-                });
-                this.resizeObserver.observe(this.elementRef.nativeElement);
-            }
-        });
-        inject(DestroyRef).onDestroy(() => {
-            this.resizeObserver?.disconnect();
-        });
-    }
-    updateDimensions() {
-        const el = this.elementRef.nativeElement;
-        const rect = el.getBoundingClientRect();
-        if (rect.width > 0 && rect.height > 0) {
-            this.containerWidth.set(Math.round(rect.width));
-            this.containerHeight.set(Math.round(rect.height));
-        }
-        else {
-            const defaultDims = DEFAULT_SIZE_DIMENSIONS[this.size()] || DEFAULT_SIZE_DIMENSIONS.md;
-            this.containerWidth.set(defaultDims.width);
-            this.containerHeight.set(defaultDims.height);
-        }
-    }
-    /** Host styles */
-    hostWidth = computed(() => {
-        const custom = this.width();
-        if (custom !== null)
-            return typeof custom === 'number' ? `${custom}px` : custom;
-        return null;
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "hostWidth" }] : /* istanbul ignore next */ []));
-    hostHeight = computed(() => {
-        const custom = this.height();
-        if (custom !== null)
-            return typeof custom === 'number' ? `${custom}px` : custom;
-        return null;
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "hostHeight" }] : /* istanbul ignore next */ []));
-    computedAspectRatio = computed(() => {
-        const ar = this.aspectRatio();
-        if (ar === 'golden')
-            return `${GOLDEN_RATIO} / 1`;
-        if (typeof ar === 'number')
-            return `${ar} / 1`;
-        if (typeof ar === 'string') {
-            if (ar.includes(':')) {
-                const [w, h] = ar.split(':');
-                return `${w.trim()} / ${h.trim()}`;
-            }
-            return ar;
-        }
-        return null;
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "computedAspectRatio" }] : /* istanbul ignore next */ []));
-    /** Normalized points array */
-    normalizedPoints = computed(() => {
-        const raw = this.data();
-        if (!raw || raw.length === 0)
-            return [];
-        return raw.map((item, idx) => {
-            if (typeof item === 'number') {
-                return { value: item };
-            }
-            return item;
-        });
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "normalizedPoints" }] : /* istanbul ignore next */ []));
-    /** Determine effective color palette */
-    effectiveColor = computed(() => {
-        if (this.autoColorTrend()) {
-            const pts = this.normalizedPoints();
-            if (pts.length >= 2) {
-                const first = pts[0].value;
-                const last = pts[pts.length - 1].value;
-                if (last >= first) {
-                    return PRESET_PALETTES['success'];
-                }
-                else {
-                    return PRESET_PALETTES['danger'];
-                }
-            }
-        }
-        const c = this.color();
-        if (PRESET_PALETTES[c]) {
-            return PRESET_PALETTES[c];
-        }
-        // Custom hex/rgb
-        return {
-            stroke: c,
-            fillStart: c.startsWith('#') ? `${c}40` : 'rgba(37, 99, 235, 0.3)',
-            fillEnd: c.startsWith('#') ? `${c}00` : 'rgba(37, 99, 235, 0.0)'
-        };
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "effectiveColor" }] : /* istanbul ignore next */ []));
-    /** Min & Max calculation */
-    valueBounds = computed(() => {
-        const pts = this.normalizedPoints();
-        if (pts.length === 0)
-            return { min: 0, max: 100, span: 100, rawMin: 0, rawMax: 100 };
-        let calculatedMin = pts[0].value;
-        let calculatedMax = pts[0].value;
-        for (const p of pts) {
-            if (p.value < calculatedMin)
-                calculatedMin = p.value;
-            if (p.value > calculatedMax)
-                calculatedMax = p.value;
-        }
-        // Include reference value if set
-        const ref = this.referenceValue();
-        if (ref !== null) {
-            if (ref < calculatedMin)
-                calculatedMin = ref;
-            if (ref > calculatedMax)
-                calculatedMax = ref;
-        }
-        // Explicit override
-        const explicitMin = this.min();
-        const explicitMax = this.max();
-        const finalMin = explicitMin !== null ? explicitMin : calculatedMin;
-        const finalMax = explicitMax !== null ? explicitMax : calculatedMax;
-        // Prevent divide by zero if constant value
-        const span = finalMax === finalMin ? 1 : finalMax - finalMin;
-        return { min: finalMin, max: finalMax, span, rawMin: calculatedMin, rawMax: calculatedMax };
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "valueBounds" }] : /* istanbul ignore next */ []));
-    /** Computed internal points with SVG coordinates */
-    internalPoints = computed(() => {
-        const pts = this.normalizedPoints();
-        if (pts.length === 0)
-            return [];
-        const { min, span, rawMin, rawMax } = this.valueBounds();
-        const w = this.svgWidth();
-        const h = this.svgHeight();
-        const p = this.padding();
-        const availableW = Math.max(1, w - p * 2);
-        const availableH = Math.max(1, h - p * 2);
-        const count = pts.length;
-        const stepX = count > 1 ? availableW / (count - 1) : availableW / 2;
-        return pts.map((pt, idx) => {
-            const x = count === 1 ? w / 2 : p + idx * stepX;
-            // Invert Y because SVG 0 is top
-            const normalizedRatio = (pt.value - min) / span;
-            const y = h - p - normalizedRatio * availableH;
-            return {
-                index: idx,
-                value: pt.value,
-                label: pt.label,
-                date: pt.date,
-                x,
-                y,
-                color: pt.color,
-                isMin: pt.value === rawMin,
-                isMax: pt.value === rawMax,
-                isFirst: idx === 0,
-                isLast: idx === count - 1
-            };
-        });
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "internalPoints" }] : /* istanbul ignore next */ []));
-    /** SVG Path line data */
-    linePath = computed(() => {
-        const pts = this.internalPoints();
-        if (pts.length < 2)
-            return '';
-        if (!this.smooth()) {
-            return pts.map((p, idx) => `${idx === 0 ? 'M' : 'L'} ${p.x.toFixed(2)} ${p.y.toFixed(2)}`).join(' ');
-        }
-        // Smooth Bezier Curve (Catmull-Rom or Monotone-like control points)
-        let d = `M ${pts[0].x.toFixed(2)} ${pts[0].y.toFixed(2)}`;
-        for (let i = 0; i < pts.length - 1; i++) {
-            const p0 = i > 0 ? pts[i - 1] : pts[i];
-            const p1 = pts[i];
-            const p2 = pts[i + 1];
-            const p3 = i < pts.length - 2 ? pts[i + 2] : p2;
-            const cp1x = p1.x + (p2.x - p0.x) / 6;
-            const cp1y = p1.y + (p2.y - p0.y) / 6;
-            const cp2x = p2.x - (p3.x - p1.x) / 6;
-            const cp2y = p2.y - (p3.y - p1.y) / 6;
-            d += ` C ${cp1x.toFixed(2)} ${cp1y.toFixed(2)}, ${cp2x.toFixed(2)} ${cp2y.toFixed(2)}, ${p2.x.toFixed(2)} ${p2.y.toFixed(2)}`;
-        }
-        return d;
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "linePath" }] : /* istanbul ignore next */ []));
-    /** SVG Area path (closed polygon under curve) */
-    areaPath = computed(() => {
-        const line = this.linePath();
-        const pts = this.internalPoints();
-        if (!line || pts.length < 2)
-            return '';
-        const lastPt = pts[pts.length - 1];
-        const firstPt = pts[0];
-        const baselineY = this.svgHeight();
-        return `${line} L ${lastPt.x.toFixed(2)} ${baselineY} L ${firstPt.x.toFixed(2)} ${baselineY} Z`;
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "areaPath" }] : /* istanbul ignore next */ []));
-    /** Bar chart segments */
-    barSegments = computed(() => {
-        const pts = this.normalizedPoints();
-        if (pts.length === 0)
-            return [];
-        const explicitMin = this.min();
-        const explicitMax = this.max();
-        const { rawMin, rawMax } = this.valueBounds();
-        // For bar charts, default baseline is 0 unless min is explicitly provided
-        const barMin = explicitMin !== null ? explicitMin : Math.min(0, rawMin);
-        const barMax = explicitMax !== null ? explicitMax : Math.max(0, rawMax);
-        const barSpan = barMax === barMin ? (barMax !== 0 ? Math.abs(barMax) : 1) : barMax - barMin;
-        const w = this.svgWidth();
-        const h = this.svgHeight();
-        const p = this.padding();
-        const gap = this.barGap();
-        const count = pts.length;
-        const availableW = Math.max(1, w - p * 2);
-        const totalGaps = (count - 1) * gap;
-        const barW = Math.max(2, (availableW - totalGaps) / count);
-        const availableH = Math.max(1, h - p * 2);
-        const baseColor = this.effectiveColor().stroke;
-        // Calculate Y position of zero baseline
-        const zeroRatio = Math.max(0, Math.min(1, (0 - barMin) / barSpan));
-        const zeroY = h - p - zeroRatio * availableH;
-        return pts.map((pt, idx) => {
-            const x = p + idx * (barW + gap);
-            const val = pt.value;
-            let y;
-            let barH;
-            if (barMin >= 0) {
-                // All positive (standard case)
-                const ratio = Math.max(0, Math.min(1, (val - barMin) / barSpan));
-                barH = Math.max(2, ratio * availableH);
-                y = h - p - barH;
-            }
-            else if (barMax <= 0) {
-                // All negative
-                const ratio = Math.max(0, Math.min(1, Math.abs(val) / barSpan));
-                barH = Math.max(2, ratio * availableH);
-                y = p;
-            }
-            else {
-                // Mixed positive & negative values around zero baseline
-                if (val >= 0) {
-                    const ratio = Math.min(1, val / barSpan);
-                    barH = Math.max(2, ratio * availableH);
-                    y = zeroY - barH;
-                }
-                else {
-                    const ratio = Math.min(1, Math.abs(val) / barSpan);
-                    barH = Math.max(2, ratio * availableH);
-                    y = zeroY;
-                }
-            }
-            return {
-                index: idx,
-                value: pt.value,
-                label: pt.label,
-                x,
-                y,
-                width: barW,
-                height: barH,
-                color: pt.color || baseColor
-            };
-        });
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "barSegments" }] : /* istanbul ignore next */ []));
-    /** Highlight markers based on showMarkers input */
-    markersToRender = computed(() => {
-        const mode = this.showMarkers();
-        if (mode === 'none')
-            return [];
-        const pts = this.internalPoints();
-        switch (mode) {
-            case 'all':
-                return pts;
-            case 'endpoints':
-                return pts.filter((p) => p.isFirst || p.isLast);
-            case 'min-max':
-                return pts.filter((p) => p.isMin || p.isMax);
-            case 'last':
-                return pts.length > 0 ? [pts[pts.length - 1]] : [];
-            default:
-                return [];
-        }
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "markersToRender" }] : /* istanbul ignore next */ []));
-    /** Reference baseline Y coordinate */
-    referenceLineY = computed(() => {
-        const ref = this.referenceValue();
-        if (ref === null)
-            return null;
-        const { min, span } = this.valueBounds();
-        const h = this.svgHeight();
-        const p = this.padding();
-        const availableH = Math.max(1, h - p * 2);
-        const ratio = (ref - min) / span;
-        return h - p - ratio * availableH;
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "referenceLineY" }] : /* istanbul ignore next */ []));
-    /** Aria label for accessibility */
-    computedAriaLabel = computed(() => {
-        const custom = this.ariaLabel();
-        if (custom)
-            return custom;
-        const pts = this.normalizedPoints();
-        if (pts.length === 0)
-            return 'Empty sparkline';
-        const first = pts[0].value;
-        const last = pts[pts.length - 1].value;
-        const delta = last - first;
-        const direction = delta >= 0 ? 'increased' : 'decreased';
-        return `Sparkline trend: ${first} to ${last} (${direction} by ${Math.abs(delta).toFixed(1)})`;
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "computedAriaLabel" }] : /* istanbul ignore next */ []));
-    /** Handle mouse move for interactive hover tracking */
-    onMouseMove(event) {
-        if (!this.interactive())
-            return;
-        const rect = this.elementRef.nativeElement.getBoundingClientRect();
-        const mouseX = event.clientX - rect.left;
-        if (this.type() === 'bar') {
-            const bars = this.barSegments();
-            if (bars.length === 0)
-                return;
-            let nearest = bars[0];
-            let minDistance = Math.abs(bars[0].x + bars[0].width / 2 - mouseX);
-            for (let i = 1; i < bars.length; i++) {
-                const centerX = bars[i].x + bars[i].width / 2;
-                const dist = Math.abs(centerX - mouseX);
-                if (dist < minDistance) {
-                    minDistance = dist;
-                    nearest = bars[i];
-                }
-            }
-            const point = {
-                index: nearest.index,
-                value: nearest.value,
-                label: nearest.label,
-                x: Math.round(nearest.x + nearest.width / 2),
-                y: nearest.y
-            };
-            this.hoveredPoint.set(point);
-            this.isHovering.set(true);
-            this.pointHover.emit({
-                index: nearest.index,
-                value: nearest.value,
-                label: nearest.label,
-                x: point.x,
-                y: point.y
-            });
-            return;
-        }
-        const pts = this.internalPoints();
-        if (pts.length === 0)
-            return;
-        // Find nearest point based on direct pixel coordinate
-        let nearest = pts[0];
-        let minDistance = Math.abs(pts[0].x - mouseX);
-        for (let i = 1; i < pts.length; i++) {
-            const dist = Math.abs(pts[i].x - mouseX);
-            if (dist < minDistance) {
-                minDistance = dist;
-                nearest = pts[i];
-            }
-        }
-        this.hoveredPoint.set(nearest);
-        this.isHovering.set(true);
-        this.pointHover.emit({
-            index: nearest.index,
-            value: nearest.value,
-            label: nearest.label,
-            x: nearest.x,
-            y: nearest.y
-        });
-    }
-    /** Handle mouse leave */
-    onMouseLeave() {
-        if (!this.interactive())
-            return;
-        this.hoveredPoint.set(null);
-        this.isHovering.set(false);
-        this.pointHover.emit(null);
-    }
-    /** Handle point click */
-    onPointClick(point) {
-        const x = 'width' in point ? Math.round(point.x + point.width / 2) : ('x' in point ? point.x : 0);
-        this.pointClick.emit({
-            index: point.index,
-            value: point.value,
-            label: point.label,
-            x,
-            y: 'y' in point ? point.y : 0
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSparklineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: TalosSparklineComponent, isStandalone: true, selector: "talos-sparkline", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, autoColorTrend: { classPropertyName: "autoColorTrend", publicName: "autoColorTrend", isSignal: true, isRequired: false, transformFunction: null }, smooth: { classPropertyName: "smooth", publicName: "smooth", isSignal: true, isRequired: false, transformFunction: null }, strokeWidth: { classPropertyName: "strokeWidth", publicName: "strokeWidth", isSignal: true, isRequired: false, transformFunction: null }, showMarkers: { classPropertyName: "showMarkers", publicName: "showMarkers", isSignal: true, isRequired: false, transformFunction: null }, markerRadius: { classPropertyName: "markerRadius", publicName: "markerRadius", isSignal: true, isRequired: false, transformFunction: null }, referenceValue: { classPropertyName: "referenceValue", publicName: "referenceValue", isSignal: true, isRequired: false, transformFunction: null }, showTooltip: { classPropertyName: "showTooltip", publicName: "showTooltip", isSignal: true, isRequired: false, transformFunction: null }, interactive: { classPropertyName: "interactive", publicName: "interactive", isSignal: true, isRequired: false, transformFunction: null }, barGap: { classPropertyName: "barGap", publicName: "barGap", isSignal: true, isRequired: false, transformFunction: null }, barRadius: { classPropertyName: "barRadius", publicName: "barRadius", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, aspectRatio: { classPropertyName: "aspectRatio", publicName: "aspectRatio", 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 }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, valueFormatter: { classPropertyName: "valueFormatter", publicName: "valueFormatter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pointHover: "pointHover", pointClick: "pointClick" }, host: { properties: { "class.talos-sparkline-xs": "size() === \"xs\"", "class.talos-sparkline-sm": "size() === \"sm\"", "class.talos-sparkline-md": "size() === \"md\"", "class.talos-sparkline-lg": "size() === \"lg\"", "class.talos-sparkline-responsive": "size() === \"responsive\"", "style.width": "hostWidth()", "style.height": "hostHeight()", "style.aspectRatio": "computedAspectRatio()", "attr.role": "\"img\"", "attr.aria-label": "computedAriaLabel()" }, classAttribute: "talos-sparkline" }, ngImport: i0, template: "<svg\n  class=\"talos-sparkline-svg\"\n  [attr.viewBox]=\"'0 0 ' + svgWidth() + ' ' + svgHeight()\"\n  (mousemove)=\"onMouseMove($event)\"\n  (mouseleave)=\"onMouseLeave()\"\n  aria-hidden=\"true\"\n>\n  <defs>\n    <linearGradient [id]=\"gradientId\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n      <stop offset=\"0%\" [attr.stop-color]=\"effectiveColor().fillStart\" />\n      <stop offset=\"100%\" [attr.stop-color]=\"effectiveColor().fillEnd\" />\n    </linearGradient>\n  </defs>\n\n  <!-- Reference Baseline (if provided) -->\n  @if (referenceLineY() !== null) {\n    <line\n      class=\"talos-sparkline-reference-line\"\n      [attr.x1]=\"0\"\n      [attr.y1]=\"referenceLineY()\"\n      [attr.x2]=\"svgWidth()\"\n      [attr.y2]=\"referenceLineY()\"\n    />\n  }\n\n  <!-- Chart Type: Area / Line -->\n  @if (type() === 'area' || type() === 'line') {\n    @if (type() === 'area' && areaPath()) {\n      <path\n        class=\"talos-sparkline-area\"\n        [attr.d]=\"areaPath()\"\n        [attr.fill]=\"'url(#' + gradientId + ')'\"\n      />\n    }\n\n    @if (linePath()) {\n      <path\n        class=\"talos-sparkline-line\"\n        [attr.d]=\"linePath()\"\n        [attr.stroke]=\"effectiveColor().stroke\"\n        [attr.stroke-width]=\"strokeWidth()\"\n        fill=\"none\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n      />\n    }\n  }\n\n  <!-- Chart Type: Bar -->\n  @if (type() === 'bar') {\n    @for (bar of barSegments(); track bar.index) {\n      <rect\n        class=\"talos-sparkline-bar\"\n        [class.talos-sparkline-bar-hovered]=\"isHovering() && hoveredPoint()?.index === bar.index\"\n        [attr.x]=\"bar.x\"\n        [attr.y]=\"bar.y\"\n        [attr.width]=\"bar.width\"\n        [attr.height]=\"bar.height\"\n        [attr.rx]=\"barRadius()\"\n        [attr.ry]=\"barRadius()\"\n        [attr.fill]=\"bar.color\"\n        (click)=\"onPointClick(bar)\"\n      />\n    }\n  }\n\n  <!-- Highlight Markers -->\n  @for (marker of markersToRender(); track marker.index) {\n    <circle\n      class=\"talos-sparkline-marker\"\n      [attr.cx]=\"marker.x\"\n      [attr.cy]=\"marker.y\"\n      [attr.r]=\"markerRadius()\"\n      [attr.fill]=\"marker.color || effectiveColor().stroke\"\n      [attr.stroke]=\"'#ffffff'\"\n      [attr.stroke-width]=\"1.5\"\n      (click)=\"onPointClick(marker)\"\n    />\n  }\n\n  <!-- Interactive Hover Crosshair / Cursor Dot (Line/Area only) -->\n  @if (type() !== 'bar' && isHovering() && hoveredPoint(); as pt) {\n    <line\n      class=\"talos-sparkline-cursor-line\"\n      [attr.x1]=\"pt.x\"\n      [attr.y1]=\"0\"\n      [attr.x2]=\"pt.x\"\n      [attr.y2]=\"svgHeight()\"\n    />\n    <circle\n      class=\"talos-sparkline-hover-dot-outer\"\n      [attr.cx]=\"pt.x\"\n      [attr.cy]=\"pt.y\"\n      [attr.r]=\"markerRadius() + 2.5\"\n      [attr.fill]=\"effectiveColor().stroke\"\n      opacity=\"0.25\"\n    />\n    <circle\n      class=\"talos-sparkline-hover-dot\"\n      [attr.cx]=\"pt.x\"\n      [attr.cy]=\"pt.y\"\n      [attr.r]=\"markerRadius() + 0.5\"\n      [attr.fill]=\"effectiveColor().stroke\"\n      stroke=\"#ffffff\"\n      [attr.stroke-width]=\"1.5\"\n    />\n  }\n</svg>\n\n<!-- Floating Tooltip on Hover -->\n@if (showTooltip() && isHovering() && hoveredPoint(); as pt) {\n  <div\n    class=\"talos-sparkline-tooltip\"\n    [style.left.px]=\"pt.x\"\n  >\n    @if (pt.label) {\n      <span class=\"talos-sparkline-tooltip-label\">{{ pt.label }}</span>\n    }\n    <span class=\"talos-sparkline-tooltip-value\">{{ valueFormatter()(pt.value) }}</span>\n  </div>\n}\n", styles: [":host{position:relative;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;box-sizing:border-box;overflow:visible;-webkit-user-select:none;user-select:none}:host.talos-sparkline-xs{width:64px;height:40px}:host.talos-sparkline-sm{width:96px;height:60px}:host.talos-sparkline-md{width:130px;height:80px}:host.talos-sparkline-lg{width:180px;height:110px}:host.talos-sparkline-responsive{display:block;width:100%;height:100%;min-height:48px}:host .talos-sparkline-svg{display:block;width:100%;height:100%;overflow:visible;cursor:crosshair}:host .talos-sparkline-area{transition:d .25s ease,opacity .2s ease}:host .talos-sparkline-line{transition:d .25s ease,stroke .2s ease}:host .talos-sparkline-bar{transition:height .2s ease,y .2s ease,opacity .15s ease,filter .15s ease;cursor:pointer}:host .talos-sparkline-bar:hover,:host .talos-sparkline-bar.talos-sparkline-bar-hovered{opacity:.85;filter:brightness(1.1)}:host .talos-sparkline-reference-line{stroke:var(--talos-border-hover, #94a3b8);stroke-width:1;stroke-dasharray:2 2;opacity:.65}:host .talos-sparkline-cursor-line{stroke:var(--talos-text-muted, #64748b);stroke-width:1;stroke-dasharray:2 2;opacity:.7;pointer-events:none}:host .talos-sparkline-marker{filter:drop-shadow(0 1px 2px rgba(0,0,0,.15));cursor:pointer;transition:transform .15s ease}:host .talos-sparkline-marker:hover{transform:scale(1.2)}:host .talos-sparkline-hover-dot{pointer-events:none;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2))}:host .talos-sparkline-tooltip{position:absolute;bottom:calc(100% + 4px);transform:translate(-50%);pointer-events:none;z-index:30;display:flex;flex-direction:column;align-items:center;padding:2px 6px;border-radius:4px;background:var(--talos-text-color, #0f172a);color:var(--talos-card-bg, #ffffff);font-size:.6875rem;font-weight:600;line-height:1.2;white-space:nowrap;box-shadow:0 4px 6px -1px #00000026,0 2px 4px -2px #0000001a;animation:talosSparklineFadeIn .12s ease-out}:host .talos-sparkline-tooltip .talos-sparkline-tooltip-label{font-size:.625rem;font-weight:400;opacity:.8}:host .talos-sparkline-tooltip .talos-sparkline-tooltip-value{letter-spacing:-.01em}:host .talos-sparkline-tooltip:after{content:\"\";position:absolute;top:100%;left:50%;transform:translate(-50%);border-width:3px;border-style:solid;border-color:var(--talos-text-color, #0f172a) transparent transparent transparent}@keyframes talosSparklineFadeIn{0%{opacity:0;transform:translate(-50%,2px)}to{opacity:1;transform:translate(-50%)}}\n"] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSparklineComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'talos-sparkline', host: {
-                        'class': 'talos-sparkline',
-                        '[class.talos-sparkline-xs]': 'size() === "xs"',
-                        '[class.talos-sparkline-sm]': 'size() === "sm"',
-                        '[class.talos-sparkline-md]': 'size() === "md"',
-                        '[class.talos-sparkline-lg]': 'size() === "lg"',
-                        '[class.talos-sparkline-responsive]': 'size() === "responsive"',
-                        '[style.width]': 'hostWidth()',
-                        '[style.height]': 'hostHeight()',
-                        '[style.aspectRatio]': 'computedAspectRatio()',
-                        '[attr.role]': '"img"',
-                        '[attr.aria-label]': 'computedAriaLabel()'
-                    }, template: "<svg\n  class=\"talos-sparkline-svg\"\n  [attr.viewBox]=\"'0 0 ' + svgWidth() + ' ' + svgHeight()\"\n  (mousemove)=\"onMouseMove($event)\"\n  (mouseleave)=\"onMouseLeave()\"\n  aria-hidden=\"true\"\n>\n  <defs>\n    <linearGradient [id]=\"gradientId\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n      <stop offset=\"0%\" [attr.stop-color]=\"effectiveColor().fillStart\" />\n      <stop offset=\"100%\" [attr.stop-color]=\"effectiveColor().fillEnd\" />\n    </linearGradient>\n  </defs>\n\n  <!-- Reference Baseline (if provided) -->\n  @if (referenceLineY() !== null) {\n    <line\n      class=\"talos-sparkline-reference-line\"\n      [attr.x1]=\"0\"\n      [attr.y1]=\"referenceLineY()\"\n      [attr.x2]=\"svgWidth()\"\n      [attr.y2]=\"referenceLineY()\"\n    />\n  }\n\n  <!-- Chart Type: Area / Line -->\n  @if (type() === 'area' || type() === 'line') {\n    @if (type() === 'area' && areaPath()) {\n      <path\n        class=\"talos-sparkline-area\"\n        [attr.d]=\"areaPath()\"\n        [attr.fill]=\"'url(#' + gradientId + ')'\"\n      />\n    }\n\n    @if (linePath()) {\n      <path\n        class=\"talos-sparkline-line\"\n        [attr.d]=\"linePath()\"\n        [attr.stroke]=\"effectiveColor().stroke\"\n        [attr.stroke-width]=\"strokeWidth()\"\n        fill=\"none\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n      />\n    }\n  }\n\n  <!-- Chart Type: Bar -->\n  @if (type() === 'bar') {\n    @for (bar of barSegments(); track bar.index) {\n      <rect\n        class=\"talos-sparkline-bar\"\n        [class.talos-sparkline-bar-hovered]=\"isHovering() && hoveredPoint()?.index === bar.index\"\n        [attr.x]=\"bar.x\"\n        [attr.y]=\"bar.y\"\n        [attr.width]=\"bar.width\"\n        [attr.height]=\"bar.height\"\n        [attr.rx]=\"barRadius()\"\n        [attr.ry]=\"barRadius()\"\n        [attr.fill]=\"bar.color\"\n        (click)=\"onPointClick(bar)\"\n      />\n    }\n  }\n\n  <!-- Highlight Markers -->\n  @for (marker of markersToRender(); track marker.index) {\n    <circle\n      class=\"talos-sparkline-marker\"\n      [attr.cx]=\"marker.x\"\n      [attr.cy]=\"marker.y\"\n      [attr.r]=\"markerRadius()\"\n      [attr.fill]=\"marker.color || effectiveColor().stroke\"\n      [attr.stroke]=\"'#ffffff'\"\n      [attr.stroke-width]=\"1.5\"\n      (click)=\"onPointClick(marker)\"\n    />\n  }\n\n  <!-- Interactive Hover Crosshair / Cursor Dot (Line/Area only) -->\n  @if (type() !== 'bar' && isHovering() && hoveredPoint(); as pt) {\n    <line\n      class=\"talos-sparkline-cursor-line\"\n      [attr.x1]=\"pt.x\"\n      [attr.y1]=\"0\"\n      [attr.x2]=\"pt.x\"\n      [attr.y2]=\"svgHeight()\"\n    />\n    <circle\n      class=\"talos-sparkline-hover-dot-outer\"\n      [attr.cx]=\"pt.x\"\n      [attr.cy]=\"pt.y\"\n      [attr.r]=\"markerRadius() + 2.5\"\n      [attr.fill]=\"effectiveColor().stroke\"\n      opacity=\"0.25\"\n    />\n    <circle\n      class=\"talos-sparkline-hover-dot\"\n      [attr.cx]=\"pt.x\"\n      [attr.cy]=\"pt.y\"\n      [attr.r]=\"markerRadius() + 0.5\"\n      [attr.fill]=\"effectiveColor().stroke\"\n      stroke=\"#ffffff\"\n      [attr.stroke-width]=\"1.5\"\n    />\n  }\n</svg>\n\n<!-- Floating Tooltip on Hover -->\n@if (showTooltip() && isHovering() && hoveredPoint(); as pt) {\n  <div\n    class=\"talos-sparkline-tooltip\"\n    [style.left.px]=\"pt.x\"\n  >\n    @if (pt.label) {\n      <span class=\"talos-sparkline-tooltip-label\">{{ pt.label }}</span>\n    }\n    <span class=\"talos-sparkline-tooltip-value\">{{ valueFormatter()(pt.value) }}</span>\n  </div>\n}\n", styles: [":host{position:relative;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;box-sizing:border-box;overflow:visible;-webkit-user-select:none;user-select:none}:host.talos-sparkline-xs{width:64px;height:40px}:host.talos-sparkline-sm{width:96px;height:60px}:host.talos-sparkline-md{width:130px;height:80px}:host.talos-sparkline-lg{width:180px;height:110px}:host.talos-sparkline-responsive{display:block;width:100%;height:100%;min-height:48px}:host .talos-sparkline-svg{display:block;width:100%;height:100%;overflow:visible;cursor:crosshair}:host .talos-sparkline-area{transition:d .25s ease,opacity .2s ease}:host .talos-sparkline-line{transition:d .25s ease,stroke .2s ease}:host .talos-sparkline-bar{transition:height .2s ease,y .2s ease,opacity .15s ease,filter .15s ease;cursor:pointer}:host .talos-sparkline-bar:hover,:host .talos-sparkline-bar.talos-sparkline-bar-hovered{opacity:.85;filter:brightness(1.1)}:host .talos-sparkline-reference-line{stroke:var(--talos-border-hover, #94a3b8);stroke-width:1;stroke-dasharray:2 2;opacity:.65}:host .talos-sparkline-cursor-line{stroke:var(--talos-text-muted, #64748b);stroke-width:1;stroke-dasharray:2 2;opacity:.7;pointer-events:none}:host .talos-sparkline-marker{filter:drop-shadow(0 1px 2px rgba(0,0,0,.15));cursor:pointer;transition:transform .15s ease}:host .talos-sparkline-marker:hover{transform:scale(1.2)}:host .talos-sparkline-hover-dot{pointer-events:none;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2))}:host .talos-sparkline-tooltip{position:absolute;bottom:calc(100% + 4px);transform:translate(-50%);pointer-events:none;z-index:30;display:flex;flex-direction:column;align-items:center;padding:2px 6px;border-radius:4px;background:var(--talos-text-color, #0f172a);color:var(--talos-card-bg, #ffffff);font-size:.6875rem;font-weight:600;line-height:1.2;white-space:nowrap;box-shadow:0 4px 6px -1px #00000026,0 2px 4px -2px #0000001a;animation:talosSparklineFadeIn .12s ease-out}:host .talos-sparkline-tooltip .talos-sparkline-tooltip-label{font-size:.625rem;font-weight:400;opacity:.8}:host .talos-sparkline-tooltip .talos-sparkline-tooltip-value{letter-spacing:-.01em}:host .talos-sparkline-tooltip:after{content:\"\";position:absolute;top:100%;left:50%;transform:translate(-50%);border-width:3px;border-style:solid;border-color:var(--talos-text-color, #0f172a) transparent transparent transparent}@keyframes talosSparklineFadeIn{0%{opacity:0;transform:translate(-50%,2px)}to{opacity:1;transform:translate(-50%)}}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], autoColorTrend: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoColorTrend", required: false }] }], smooth: [{ type: i0.Input, args: [{ isSignal: true, alias: "smooth", required: false }] }], strokeWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "strokeWidth", required: false }] }], showMarkers: [{ type: i0.Input, args: [{ isSignal: true, alias: "showMarkers", required: false }] }], markerRadius: [{ type: i0.Input, args: [{ isSignal: true, alias: "markerRadius", required: false }] }], referenceValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "referenceValue", required: false }] }], showTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTooltip", required: false }] }], interactive: [{ type: i0.Input, args: [{ isSignal: true, alias: "interactive", required: false }] }], barGap: [{ type: i0.Input, args: [{ isSignal: true, alias: "barGap", required: false }] }], barRadius: [{ type: i0.Input, args: [{ isSignal: true, alias: "barRadius", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], aspectRatio: [{ type: i0.Input, args: [{ isSignal: true, alias: "aspectRatio", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], valueFormatter: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueFormatter", required: false }] }], pointHover: [{ type: i0.Output, args: ["pointHover"] }], pointClick: [{ type: i0.Output, args: ["pointClick"] }] } });
-
-class TalosSparklineModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSparklineModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.1", ngImport: i0, type: TalosSparklineModule, imports: [TalosSparklineComponent], exports: [TalosSparklineComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSparklineModule });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosSparklineModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [TalosSparklineComponent],
-                    exports: [TalosSparklineComponent]
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { GOLDEN_RATIO, TalosSparklineComponent, TalosSparklineModule };
-//# sourceMappingURL=weeehaoooz-talos-ui-data-viz-sparkline.mjs.map