@konce-pt/chart 0.8.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 konce.pt
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,53 @@
+<p align="center">
+  <img src="https://ui.konce.pt/images/koncept_ui_lib.png" alt="Koncept UI — Angular component library" width="100%" />
+</p>
+
+# @konce-pt/chart
+
+Rdzeń geometrii wykresów [Koncept UI](https://gitlab.com/konce-pt/koncept-ui): skale i podziałki,
+ścieżki linii i obszaru, układ słupków, geometria wykresów kołowych, polarnych i radaru. Czysty
+TypeScript, **zero zależności runtime**, bez wiązania z frameworkiem.
+
+Zwykle nie instalujesz go samodzielnie: używają go `@konce-pt/angular/charts`
+i `@konce-pt/react/charts`, i oba re-eksportują jego API. Sięgnij po niego wprost, gdy renderujesz
+wykres po stronie serwera albo budujesz własny typ wykresu na tej samej geometrii.
+
+```bash
+npm i @konce-pt/chart
+```
+
+```ts
+import { niceScale, linePath, pieSlices } from '@konce-pt/chart';
+
+// Oś zawsze zawiera zero i ma równe, „ładne" kroki.
+niceScale(12, 87); // { min: 0, max: 100, step: 25, ticks: [0, 25, 50, 75, 100] }
+
+// Trzy tryby interpolacji; monotoniczny nie przestrzeliwuje ekstremów danych.
+linePath([{ x: 0, y: 10 }, { x: 10, y: 0 }], 'cubic-monotonic');
+
+// Same zera nie rysują nic, zamiast dzielić przez zero.
+pieSlices([0, 0], 50, 50, 40); // []
+```
+
+## API
+
+- **Skale** — `extent`, `linearScale`, `bandScale`, `niceScale`
+- **Linie** — `linePath`, `areaPath`
+- **Słupki** — `barLayout`
+- **Łuki** — `arcPath`, `pieSlices`, `polarSlices`, `polarToCartesian`
+- **Radar** — `radarGrid`, `radarPoints`, `polygonPath`
+- **Układ i prezentacja** — `plotArea`, `radialArea`, `seriesColor`, `KPT_CHART_PALETTE`,
+  `formatNumber`, `round`
+- **Typy** — `KptChartConfig` i wszystko, do czego się odwołuje
+
+Pełny opis: [`llms.txt`](./llms.txt) (EN) i [`llms-pl.txt`](./llms-pl.txt) (PL).
+
+## Testy
+
+```bash
+pnpm --filter @konce-pt/chart exec node --test "src/**/*.test.ts"
+```
+
+## Licencja
+
+MIT © [konce.pt](https://konce.pt)

package/dist/arc.d.ts

@@ -0,0 +1,26 @@
+import type { KptPoint } from './types.ts';
+/** Punkt na okręgu dla kąta (0 = góra, rośnie zgodnie z zegarem). */
+export declare function polarToCartesian(cx: number, cy: number, radius: number, angle: number): KptPoint;
+/**
+ * Ścieżka wycinka pierścienia od `startAngle` do `endAngle`.
+ * `innerRadius = 0` → pełny wycinek koła (pie); > 0 → pierścień (doughnut).
+ */
+export declare function arcPath(cx: number, cy: number, outerRadius: number, innerRadius: number, startAngle: number, endAngle: number): string;
+export interface ArcSlice {
+    path: string;
+    /** Kąt środka wycinka (do pozycjonowania etykiet/tooltipa). */
+    midAngle: number;
+    startAngle: number;
+    endAngle: number;
+    value: number;
+}
+/**
+ * Wycinki pie/doughnut: kąt proporcjonalny do wartości (Σ = 2π).
+ * `innerRadius` w px (0 dla pie).
+ */
+export declare function pieSlices(values: number[], cx: number, cy: number, outerRadius: number, innerRadius?: number): ArcSlice[];
+/**
+ * Wycinki polar area: równy kąt (2π/N), promień proporcjonalny do wartości.
+ * `maxValue` skaluje promień do `outerRadius`.
+ */
+export declare function polarSlices(values: number[], cx: number, cy: number, outerRadius: number, maxValue?: number): ArcSlice[];

package/dist/arc.js

@@ -0,0 +1,101 @@
+const HALF_PI = Math.PI / 2;
+function n(value) {
+    return Number.isInteger(value) ? String(value) : value.toFixed(3);
+}
+/** Punkt na okręgu dla kąta (0 = góra, rośnie zgodnie z zegarem). */
+export function polarToCartesian(cx, cy, radius, angle) {
+    const a = angle - HALF_PI;
+    return { x: cx + radius * Math.cos(a), y: cy + radius * Math.sin(a) };
+}
+/**
+ * Ścieżka wycinka pierścienia od `startAngle` do `endAngle`.
+ * `innerRadius = 0` → pełny wycinek koła (pie); > 0 → pierścień (doughnut).
+ */
+export function arcPath(cx, cy, outerRadius, innerRadius, startAngle, endAngle) {
+    const sweep = endAngle - startAngle;
+    const largeArc = sweep > Math.PI ? 1 : 0;
+    // Pełny okrąg (np. pojedynczy wycinek 100%) — rozbijamy na dwa łuki.
+    if (sweep >= Math.PI * 2 - 1e-6) {
+        const outer = fullCircle(cx, cy, outerRadius, 1);
+        if (innerRadius <= 0)
+            return outer;
+        return `${outer} ${fullCircle(cx, cy, innerRadius, 0)}`;
+    }
+    const oStart = polarToCartesian(cx, cy, outerRadius, startAngle);
+    const oEnd = polarToCartesian(cx, cy, outerRadius, endAngle);
+    if (innerRadius <= 0) {
+        return [
+            `M ${n(cx)} ${n(cy)}`,
+            `L ${n(oStart.x)} ${n(oStart.y)}`,
+            `A ${n(outerRadius)} ${n(outerRadius)} 0 ${largeArc} 1 ${n(oEnd.x)} ${n(oEnd.y)}`,
+            'Z',
+        ].join(' ');
+    }
+    const iStart = polarToCartesian(cx, cy, innerRadius, endAngle);
+    const iEnd = polarToCartesian(cx, cy, innerRadius, startAngle);
+    return [
+        `M ${n(oStart.x)} ${n(oStart.y)}`,
+        `A ${n(outerRadius)} ${n(outerRadius)} 0 ${largeArc} 1 ${n(oEnd.x)} ${n(oEnd.y)}`,
+        `L ${n(iStart.x)} ${n(iStart.y)}`,
+        `A ${n(innerRadius)} ${n(innerRadius)} 0 ${largeArc} 0 ${n(iEnd.x)} ${n(iEnd.y)}`,
+        'Z',
+    ].join(' ');
+}
+/** Pełny okrąg jako dwa półłuki (sweepFlag steruje kierunkiem — dla wycięcia). */
+function fullCircle(cx, cy, r, sweepFlag) {
+    const top = polarToCartesian(cx, cy, r, 0);
+    const bottom = polarToCartesian(cx, cy, r, Math.PI);
+    return [
+        `M ${n(top.x)} ${n(top.y)}`,
+        `A ${n(r)} ${n(r)} 0 1 ${sweepFlag} ${n(bottom.x)} ${n(bottom.y)}`,
+        `A ${n(r)} ${n(r)} 0 1 ${sweepFlag} ${n(top.x)} ${n(top.y)}`,
+        'Z',
+    ].join(' ');
+}
+/**
+ * Wycinki pie/doughnut: kąt proporcjonalny do wartości (Σ = 2π).
+ * `innerRadius` w px (0 dla pie).
+ */
+export function pieSlices(values, cx, cy, outerRadius, innerRadius = 0) {
+    const total = values.reduce((a, v) => a + Math.max(0, v), 0);
+    if (total <= 0)
+        return [];
+    const slices = [];
+    let angle = 0;
+    for (const value of values) {
+        const sweep = (Math.max(0, value) / total) * Math.PI * 2;
+        const start = angle;
+        const end = angle + sweep;
+        slices.push({
+            path: arcPath(cx, cy, outerRadius, innerRadius, start, end),
+            midAngle: (start + end) / 2,
+            startAngle: start,
+            endAngle: end,
+            value,
+        });
+        angle = end;
+    }
+    return slices;
+}
+/**
+ * Wycinki polar area: równy kąt (2π/N), promień proporcjonalny do wartości.
+ * `maxValue` skaluje promień do `outerRadius`.
+ */
+export function polarSlices(values, cx, cy, outerRadius, maxValue = 1) {
+    const count = values.length;
+    if (count === 0)
+        return [];
+    const sweep = (Math.PI * 2) / count;
+    return values.map((value, i) => {
+        const start = i * sweep;
+        const end = start + sweep;
+        const r = (Math.max(0, value) / maxValue) * outerRadius;
+        return {
+            path: arcPath(cx, cy, r, 0, start, end),
+            midAngle: (start + end) / 2,
+            startAngle: start,
+            endAngle: end,
+            value,
+        };
+    });
+}

package/dist/bar.d.ts

@@ -0,0 +1,29 @@
+import { niceScale } from './scale.ts';
+import type { KptBarOrientation, KptRect } from './types.ts';
+export interface BarGeom {
+    rect: KptRect;
+    /** Ścieżka słupka z zaokrąglonymi rogami „od strony wzrostu". */
+    path: string;
+    seriesIndex: number;
+    categoryIndex: number;
+    value: number;
+}
+export interface BarLayout {
+    bars: BarGeom[];
+    /** Podziałki osi wartości (wartość → współrzędna). */
+    ticks: {
+        value: number;
+        pos: number;
+    }[];
+    /** Współrzędna linii bazowej (0). */
+    baseline: number;
+    scale: ReturnType<typeof niceScale>;
+}
+/**
+ * Wylicza słupki dla obszaru `plot`.
+ * @param seriesData  wartości[serie][kategorie]
+ * @param plot        obszar rysowania {x,y,width,height}
+ * @param orientation pionowa (rośnie w górę) lub pozioma (rośnie w prawo)
+ * @param borderRadius promień zaokrąglenia w px
+ */
+export declare function barLayout(seriesData: number[][], categoryCount: number, plot: KptRect, orientation: KptBarOrientation, borderRadius: number): BarLayout;

package/dist/bar.js

@@ -0,0 +1,101 @@
+/*
+ * Geometria wykresu słupkowego (pionowego i poziomego) z zaokrągleniem rogów.
+ * Wspiera wiele serii (grupowanie obok siebie w obrębie kategorii).
+ */
+import { bandScale, linearScale, niceScale } from "./scale.js";
+function n(value) {
+    return Number.isInteger(value) ? String(value) : value.toFixed(3);
+}
+/** Prostokąt z zaokrąglonymi rogami tylko po wybranych stronach. */
+function roundedRect(x, y, w, h, r, corners) {
+    const radius = Math.max(0, Math.min(r, w / 2, h / 2));
+    const tl = corners.tl ? radius : 0;
+    const tr = corners.tr ? radius : 0;
+    const br = corners.br ? radius : 0;
+    const bl = corners.bl ? radius : 0;
+    return [
+        `M ${n(x + tl)} ${n(y)}`,
+        `H ${n(x + w - tr)}`,
+        tr ? `A ${n(tr)} ${n(tr)} 0 0 1 ${n(x + w)} ${n(y + tr)}` : '',
+        `V ${n(y + h - br)}`,
+        br ? `A ${n(br)} ${n(br)} 0 0 1 ${n(x + w - br)} ${n(y + h)}` : '',
+        `H ${n(x + bl)}`,
+        bl ? `A ${n(bl)} ${n(bl)} 0 0 1 ${n(x)} ${n(y + h - bl)}` : '',
+        `V ${n(y + tl)}`,
+        tl ? `A ${n(tl)} ${n(tl)} 0 0 1 ${n(x + tl)} ${n(y)}` : '',
+        'Z',
+    ]
+        .filter(Boolean)
+        .join(' ');
+}
+/**
+ * Wylicza słupki dla obszaru `plot`.
+ * @param seriesData  wartości[serie][kategorie]
+ * @param plot        obszar rysowania {x,y,width,height}
+ * @param orientation pionowa (rośnie w górę) lub pozioma (rośnie w prawo)
+ * @param borderRadius promień zaokrąglenia w px
+ */
+export function barLayout(seriesData, categoryCount, plot, orientation, borderRadius) {
+    let min = 0;
+    let max = 0;
+    for (const row of seriesData) {
+        for (const v of row) {
+            if (v < min)
+                min = v;
+            if (v > max)
+                max = v;
+        }
+    }
+    const scale = niceScale(min, max, 5);
+    const seriesCount = seriesData.length || 1;
+    const bars = [];
+    if (orientation === 'vertical') {
+        const value = linearScale(scale.min, scale.max, plot.y + plot.height, plot.y);
+        const baseline = value(0);
+        const cat = bandScale(categoryCount, plot.x, plot.x + plot.width, 0.2);
+        const group = bandScale(seriesCount, 0, cat.bandwidth, 0.1);
+        seriesData.forEach((values, s) => {
+            for (let c = 0; c < categoryCount; c++) {
+                const v = values[c] ?? 0;
+                const x = cat.start(c) + group.start(s);
+                const w = group.bandwidth;
+                const yv = value(v);
+                const top = Math.min(baseline, yv);
+                const h = Math.abs(yv - baseline);
+                const up = v >= 0;
+                bars.push({
+                    rect: { x, y: top, width: w, height: h },
+                    path: roundedRect(x, top, w, h, borderRadius, up ? { tl: true, tr: true } : { bl: true, br: true }),
+                    seriesIndex: s,
+                    categoryIndex: c,
+                    value: v,
+                });
+            }
+        });
+        return { bars, baseline, scale, ticks: scale.ticks.map((t) => ({ value: t, pos: value(t) })) };
+    }
+    // horizontal
+    const value = linearScale(scale.min, scale.max, plot.x, plot.x + plot.width);
+    const baseline = value(0);
+    const cat = bandScale(categoryCount, plot.y, plot.y + plot.height, 0.2);
+    const group = bandScale(seriesCount, 0, cat.bandwidth, 0.1);
+    seriesData.forEach((values, s) => {
+        for (let c = 0; c < categoryCount; c++) {
+            const v = values[c] ?? 0;
+            const y = cat.start(c) + group.start(s);
+            const h = group.bandwidth;
+            const xv = value(v);
+            const left = Math.min(baseline, xv);
+            const w = Math.abs(xv - baseline);
+            const right = v >= 0;
+            bars.push({
+                rect: { x: left, y, width: w, height: h },
+                path: roundedRect(left, y, w, h, borderRadius, right ? { tr: true, br: true } : { tl: true, bl: true }),
+                seriesIndex: s,
+                categoryIndex: c,
+                value: v,
+            });
+        }
+    });
+    return { bars, baseline, scale, ticks: scale.ticks.map((t) => ({ value: t, pos: value(t) })) };
+}

package/dist/color.d.ts

@@ -0,0 +1,4 @@
+/** Kolejność kolorów dla kolejnych serii / wycinków. */
+export declare const KPT_CHART_PALETTE: readonly string[];
+/** Kolor serii/wycinka: jawny z danych albo z palety (cyklicznie). */
+export declare function seriesColor(explicit: string | undefined, index: number, palette?: readonly string[]): string;

package/dist/color.js

@@ -0,0 +1,21 @@
+/*
+ * Domyślna paleta kolorów wykresów — oparta o semantyczne tokeny Koncept UI.
+ * Rozszerzona o dodatkowe odcienie skali, by obsłużyć wiele serii/wycinków.
+ */
+/** Kolejność kolorów dla kolejnych serii / wycinków. */
+export const KPT_CHART_PALETTE = [
+    'var(--kpt-color-primary)',
+    'var(--kpt-color-info)',
+    'var(--kpt-color-success)',
+    'var(--kpt-color-warning)',
+    'var(--kpt-color-danger)',
+    'var(--kpt-color-blue-700)',
+    'var(--kpt-color-green-700)',
+    'var(--kpt-color-amber-700)',
+    'var(--kpt-color-red-700)',
+    'var(--kpt-color-neutral-500)',
+];
+/** Kolor serii/wycinka: jawny z danych albo z palety (cyklicznie). */
+export function seriesColor(explicit, index, palette = KPT_CHART_PALETTE) {
+    return explicit ?? palette[index % palette.length];
+}

package/dist/format.d.ts

@@ -0,0 +1,4 @@
+/** Formatuje liczbę zwięźle (do 2 miejsc, bez zer końcowych). */
+export declare function formatNumber(value: number, locale?: string): string;
+/** Zaokrągla do skończonej liczby miejsc (do etykiet osi). */
+export declare function round(value: number, digits?: number): number;

package/dist/format.js

@@ -0,0 +1,15 @@
+/*
+ * Lekki formatter liczb dla etykiet osi i tooltipów.
+ * Framework-free; korzysta z wbudowanego Intl (dostępny w przeglądarce i Node).
+ */
+/** Formatuje liczbę zwięźle (do 2 miejsc, bez zer końcowych). */
+export function formatNumber(value, locale) {
+    if (!Number.isFinite(value))
+        return '';
+    return new Intl.NumberFormat(locale, { maximumFractionDigits: 2 }).format(value);
+}
+/** Zaokrągla do skończonej liczby miejsc (do etykiet osi). */
+export function round(value, digits = 0) {
+    const f = 10 ** digits;
+    return Math.round(value * f) / f;
+}

package/dist/index.d.ts

@@ -0,0 +1,9 @@
+export * from './types.ts';
+export * from './scale.ts';
+export * from './line.ts';
+export * from './bar.ts';
+export * from './arc.ts';
+export * from './radar.ts';
+export * from './layout.ts';
+export * from './color.ts';
+export * from './format.ts';

package/dist/index.js

@@ -0,0 +1,10 @@
+/* Rdzeń wykresów (pure TS) — barrel eksportów. */
+export * from "./types.js";
+export * from "./scale.js";
+export * from "./line.js";
+export * from "./bar.js";
+export * from "./arc.js";
+export * from "./radar.js";
+export * from "./layout.js";
+export * from "./color.js";
+export * from "./format.js";

package/dist/layout.d.ts

@@ -0,0 +1,15 @@
+import type { KptRect } from './types.ts';
+export interface Insets {
+    top: number;
+    right: number;
+    bottom: number;
+    left: number;
+}
+/** Obszar rysowania po odjęciu marginesów od pełnego viewBoxa. */
+export declare function plotArea(width: number, height: number, insets: Insets): KptRect;
+/** Środek i promień dla wykresów promieniowych (pie/doughnut/polar/radar). */
+export declare function radialArea(width: number, height: number, padding: number): {
+    cx: number;
+    cy: number;
+    radius: number;
+};

package/dist/layout.js

@@ -0,0 +1,16 @@
+/** Obszar rysowania po odjęciu marginesów od pełnego viewBoxa. */
+export function plotArea(width, height, insets) {
+    return {
+        x: insets.left,
+        y: insets.top,
+        width: Math.max(0, width - insets.left - insets.right),
+        height: Math.max(0, height - insets.top - insets.bottom),
+    };
+}
+/** Środek i promień dla wykresów promieniowych (pie/doughnut/polar/radar). */
+export function radialArea(width, height, padding) {
+    const cx = width / 2;
+    const cy = height / 2;
+    const radius = Math.max(0, Math.min(width, height) / 2 - padding);
+    return { cx, cy, radius };
+}

package/dist/line.d.ts

@@ -0,0 +1,5 @@
+import type { KptLineInterpolation, KptPoint } from './types.ts';
+/** Ścieżka linii dla wybranego trybu interpolacji. */
+export declare function linePath(points: KptPoint[], mode?: KptLineInterpolation): string;
+/** Ścieżka obszaru pod linią (domknięta do `baselineY`). */
+export declare function areaPath(points: KptPoint[], baselineY: number, mode?: KptLineInterpolation): string;

package/dist/line.js

@@ -0,0 +1,105 @@
+function n(value) {
+    // Skraca zapis (mniejszy DOM) i unika notacji wykładniczej dla małych liczb.
+    return Number.isInteger(value) ? String(value) : value.toFixed(3);
+}
+/** Ścieżka odcinkowa (M/L). */
+function linearPath(points) {
+    return points.map((p, i) => `${i === 0 ? 'M' : 'L'} ${n(p.x)} ${n(p.y)}`).join(' ');
+}
+/** Standardowa interpolacja sześcienna (Catmull-Rom przez punkty → krzywe Béziera). */
+function cubicPath(points) {
+    if (points.length < 3)
+        return linearPath(points);
+    let d = `M ${n(points[0].x)} ${n(points[0].y)}`;
+    for (let i = 0; i < points.length - 1; i++) {
+        const p0 = points[i - 1] ?? points[i];
+        const p1 = points[i];
+        const p2 = points[i + 1];
+        const p3 = points[i + 2] ?? p2;
+        const c1x = p1.x + (p2.x - p0.x) / 6;
+        const c1y = p1.y + (p2.y - p0.y) / 6;
+        const c2x = p2.x - (p3.x - p1.x) / 6;
+        const c2y = p2.y - (p3.y - p1.y) / 6;
+        d += ` C ${n(c1x)} ${n(c1y)}, ${n(c2x)} ${n(c2y)}, ${n(p2.x)} ${n(p2.y)}`;
+    }
+    return d;
+}
+/**
+ * Monotoniczna interpolacja sześcienna (Fritsch–Carlson).
+ * Styczne przycinane tak, by krzywa nie przestrzelała ekstremów danych.
+ * Liczona względem indeksu punktu (równe odstępy w X, typowe dla osi kategorii).
+ */
+function monotonePath(points) {
+    const size = points.length;
+    if (size < 3)
+        return linearPath(points);
+    const dx = [];
+    const dy = [];
+    const slope = [];
+    for (let i = 0; i < size - 1; i++) {
+        dx[i] = points[i + 1].x - points[i].x;
+        dy[i] = points[i + 1].y - points[i].y;
+        slope[i] = dy[i] / (dx[i] || 1);
+    }
+    // Styczne w węzłach (m).
+    const m = new Array(size);
+    m[0] = slope[0];
+    m[size - 1] = slope[size - 2];
+    for (let i = 1; i < size - 1; i++) {
+        if (slope[i - 1] * slope[i] <= 0) {
+            m[i] = 0; // lokalne ekstremum → styczna pozioma
+        }
+        else {
+            m[i] = (slope[i - 1] + slope[i]) / 2;
+        }
+    }
+    // Ograniczenie Fritsch–Carlson.
+    for (let i = 0; i < size - 1; i++) {
+        if (slope[i] === 0) {
+            m[i] = 0;
+            m[i + 1] = 0;
+            continue;
+        }
+        const a = m[i] / slope[i];
+        const b = m[i + 1] / slope[i];
+        const h = Math.hypot(a, b);
+        if (h > 3) {
+            const t = 3 / h;
+            m[i] = t * a * slope[i];
+            m[i + 1] = t * b * slope[i];
+        }
+    }
+    let d = `M ${n(points[0].x)} ${n(points[0].y)}`;
+    for (let i = 0; i < size - 1; i++) {
+        const c1x = points[i].x + dx[i] / 3;
+        const c1y = points[i].y + (m[i] * dx[i]) / 3;
+        const c2x = points[i + 1].x - dx[i] / 3;
+        const c2y = points[i + 1].y - (m[i + 1] * dx[i]) / 3;
+        d += ` C ${n(c1x)} ${n(c1y)}, ${n(c2x)} ${n(c2y)}, ${n(points[i + 1].x)} ${n(points[i + 1].y)}`;
+    }
+    return d;
+}
+/** Ścieżka linii dla wybranego trybu interpolacji. */
+export function linePath(points, mode = 'linear') {
+    if (points.length === 0)
+        return '';
+    if (points.length === 1)
+        return `M ${n(points[0].x)} ${n(points[0].y)}`;
+    switch (mode) {
+        case 'cubic':
+            return cubicPath(points);
+        case 'cubic-monotonic':
+            return monotonePath(points);
+        default:
+            return linearPath(points);
+    }
+}
+/** Ścieżka obszaru pod linią (domknięta do `baselineY`). */
+export function areaPath(points, baselineY, mode = 'linear') {
+    if (points.length === 0)
+        return '';
+    const top = linePath(points, mode);
+    const first = points[0];
+    const last = points.at(-1);
+    return `${top} L ${n(last.x)} ${n(baselineY)} L ${n(first.x)} ${n(baselineY)} Z`;
+}

package/dist/radar.d.ts

@@ -0,0 +1,18 @@
+import type { KptPoint } from './types.ts';
+export interface RadarAxis {
+    /** Punkt na obwodzie (koniec osi). */
+    end: KptPoint;
+    angle: number;
+    labelIndex: number;
+}
+export interface RadarGrid {
+    /** Poziomy siatki (pierścienie) jako ścieżki wielokątów. */
+    rings: string[];
+    axes: RadarAxis[];
+}
+/** Siatka radaru: `levels` koncentrycznych wielokątów + osie do etykiet. */
+export declare function radarGrid(count: number, cx: number, cy: number, radius: number, levels?: number): RadarGrid;
+/** Punkty wielokąta serii (wartość → promień, skalowane do `maxValue`). */
+export declare function radarPoints(values: number[], cx: number, cy: number, radius: number, maxValue: number): KptPoint[];
+/** Zamknięta ścieżka wielokąta łącząca punkty. */
+export declare function polygonPath(points: KptPoint[]): string;

package/dist/radar.js

@@ -0,0 +1,33 @@
+/*
+ * Geometria wykresu radarowego: osie promieniowe + wielokąty serii.
+ */
+import { polarToCartesian } from "./arc.js";
+/** Siatka radaru: `levels` koncentrycznych wielokątów + osie do etykiet. */
+export function radarGrid(count, cx, cy, radius, levels = 4) {
+    const axes = [];
+    const step = (Math.PI * 2) / Math.max(1, count);
+    for (let i = 0; i < count; i++) {
+        const angle = i * step;
+        axes.push({ angle, labelIndex: i, end: polarToCartesian(cx, cy, radius, angle) });
+    }
+    const rings = [];
+    for (let l = 1; l <= levels; l++) {
+        const r = (radius * l) / levels;
+        rings.push(polygonPath(axes.map((a) => polarToCartesian(cx, cy, r, a.angle))));
+    }
+    return { rings, axes };
+}
+/** Punkty wielokąta serii (wartość → promień, skalowane do `maxValue`). */
+export function radarPoints(values, cx, cy, radius, maxValue) {
+    const count = values.length;
+    const step = (Math.PI * 2) / Math.max(1, count);
+    const max = maxValue || 1;
+    return values.map((v, i) => polarToCartesian(cx, cy, (Math.max(0, v) / max) * radius, i * step));
+}
+/** Zamknięta ścieżka wielokąta łącząca punkty. */
+export function polygonPath(points) {
+    if (points.length === 0)
+        return '';
+    const nf = (v) => (Number.isInteger(v) ? String(v) : v.toFixed(3));
+    return points.map((p, i) => `${i === 0 ? 'M' : 'L'} ${nf(p.x)} ${nf(p.y)}`).join(' ') + ' Z';
+}

package/dist/scale.d.ts

@@ -0,0 +1,29 @@
+/** Zakres [min, max] tablicy liczb (0..0 dla pustej). */
+export declare function extent(values: number[]): [number, number];
+/** Interpolacja liniowa domeny → zakresu (np. wartość → współrzędna piksela). */
+export declare function linearScale(domainMin: number, domainMax: number, rangeMin: number, rangeMax: number): (value: number) => number;
+export interface NiceScale {
+    min: number;
+    max: number;
+    step: number;
+    ticks: number[];
+}
+/**
+ * „Ładna" skala obejmująca [dataMin, dataMax] z ~`maxTicks` podziałkami.
+ * Wynikowy zakres jest rozszerzony do równych kroków; zawsze zawiera 0,
+ * gdy dane są jednoznakowe (typowe dla słupków/linii wartościowych).
+ */
+export declare function niceScale(dataMin: number, dataMax: number, maxTicks?: number): NiceScale;
+export interface BandScale {
+    /** Lewy/górny brzeg pasma dla danego indeksu kategorii. */
+    start: (index: number) => number;
+    /** Szerokość pojedynczego pasma kategorii. */
+    bandwidth: number;
+    /** Środek pasma dla danego indeksu (np. pozycja punktu linii). */
+    center: (index: number) => number;
+}
+/**
+ * Skala pasmowa: dzieli [rangeStart, rangeEnd] na `count` równych pasm
+ * z marginesem `padding` (0..1 udziału pasma) po bokach i między pasmami.
+ */
+export declare function bandScale(count: number, rangeStart: number, rangeEnd: number, padding?: number): BandScale;

package/dist/scale.js

@@ -0,0 +1,90 @@
+/*
+ * Skalowanie i „ładne" podziałki osi (auto-skala).
+ * Wszystkie funkcje czyste — bez stanu i DOM.
+ */
+/** Zakres [min, max] tablicy liczb (0..0 dla pustej). */
+export function extent(values) {
+    if (values.length === 0)
+        return [0, 0];
+    let min = values[0];
+    let max = values[0];
+    for (const v of values) {
+        if (v < min)
+            min = v;
+        if (v > max)
+            max = v;
+    }
+    return [min, max];
+}
+/** Interpolacja liniowa domeny → zakresu (np. wartość → współrzędna piksela). */
+export function linearScale(domainMin, domainMax, rangeMin, rangeMax) {
+    const dSpan = domainMax - domainMin || 1;
+    const rSpan = rangeMax - rangeMin;
+    return (value) => rangeMin + ((value - domainMin) / dSpan) * rSpan;
+}
+/** Zaokrągla liczbę do „ładnej" wartości (1/2/5 × 10ⁿ). */
+function niceNum(range, round) {
+    const exponent = Math.floor(Math.log10(range || 1));
+    const fraction = (range || 1) / 10 ** exponent;
+    return niceFraction(fraction, round) * 10 ** exponent;
+}
+/** Mantysa 1/2/5/10 — do najbliższej (`round`) albo w górę. */
+function niceFraction(fraction, round) {
+    if (round) {
+        if (fraction < 1.5)
+            return 1;
+        if (fraction < 3)
+            return 2;
+        if (fraction < 7)
+            return 5;
+        return 10;
+    }
+    if (fraction <= 1)
+        return 1;
+    if (fraction <= 2)
+        return 2;
+    if (fraction <= 5)
+        return 5;
+    return 10;
+}
+/**
+ * „Ładna" skala obejmująca [dataMin, dataMax] z ~`maxTicks` podziałkami.
+ * Wynikowy zakres jest rozszerzony do równych kroków; zawsze zawiera 0,
+ * gdy dane są jednoznakowe (typowe dla słupków/linii wartościowych).
+ */
+export function niceScale(dataMin, dataMax, maxTicks = 5) {
+    let lo = dataMin;
+    let hi = dataMax;
+    if (lo > 0)
+        lo = 0;
+    if (hi < 0)
+        hi = 0;
+    if (lo === hi) {
+        hi = lo + 1;
+    }
+    const range = niceNum(hi - lo, false);
+    const step = niceNum(range / Math.max(1, maxTicks - 1), true);
+    const niceMin = Math.floor(lo / step) * step;
+    const niceMax = Math.ceil(hi / step) * step;
+    const ticks = [];
+    // +1e-9: zabezpieczenie przed błędami zmiennoprzecinkowymi na krańcu pętli.
+    for (let t = niceMin; t <= niceMax + 1e-9; t += step) {
+        ticks.push(Math.abs(t) < 1e-9 ? 0 : t);
+    }
+    return { min: niceMin, max: niceMax, step, ticks };
+}
+/**
+ * Skala pasmowa: dzieli [rangeStart, rangeEnd] na `count` równych pasm
+ * z marginesem `padding` (0..1 udziału pasma) po bokach i między pasmami.
+ */
+export function bandScale(count, rangeStart, rangeEnd, padding = 0.1) {
+    const span = rangeEnd - rangeStart;
+    const step = count > 0 ? span / count : span;
+    const bandwidth = step * (1 - padding);
+    const offset = (step - bandwidth) / 2;
+    return {
+        bandwidth,
+        start: (index) => rangeStart + index * step + offset,
+        center: (index) => rangeStart + index * step + step / 2,
+    };
+}

package/dist/types.d.ts

@@ -0,0 +1,103 @@
+export type KptChartType = 'line' | 'bar' | 'pie' | 'doughnut' | 'polarArea' | 'radar';
+/** Tryb interpolacji linii dla wykresu liniowego. */
+export type KptLineInterpolation = 'linear' | 'cubic' | 'cubic-monotonic';
+/** Orientacja słupków. */
+export type KptBarOrientation = 'vertical' | 'horizontal';
+/** Pojedyncza seria danych. Kolejność wartości odpowiada `labels`. */
+export interface KptChartSeries {
+    /** Nazwa serii (legenda, tooltip). */
+    name: string;
+    /** Wartości; długość zwykle równa liczbie etykiet. */
+    data: number[];
+    /** Kolor (CSS). Domyślnie z palety tokenów. */
+    color?: string;
+}
+export type KptLegendPosition = 'top' | 'bottom' | 'left' | 'right';
+export type KptAlign = 'start' | 'center' | 'end';
+export type KptPointStyle = 'circle' | 'rect' | 'rectRot' | 'triangle' | 'line';
+export interface KptLegendTitle {
+    display?: boolean;
+    text?: string;
+    position?: KptAlign;
+}
+export interface KptLegendOptions {
+    display?: boolean;
+    position?: KptLegendPosition;
+    align?: KptAlign;
+    pointStyle?: KptPointStyle;
+    title?: KptLegendTitle;
+}
+export interface KptFont {
+    family?: string;
+    size?: number;
+    weight?: string | number;
+}
+export interface KptPadding {
+    top?: number;
+    bottom?: number;
+}
+export interface KptTitleOptions {
+    display?: boolean;
+    text?: string;
+    align?: KptAlign;
+    color?: string;
+    font?: KptFont;
+    padding?: KptPadding;
+}
+/** Kontekst przekazywany do formatera tooltipa. */
+export interface KptTooltipContext {
+    series: string;
+    label: string;
+    value: number;
+}
+export interface KptTooltipOptions {
+    enabled?: boolean;
+    format?: (ctx: KptTooltipContext) => string;
+}
+export interface KptAnimationOptions {
+    enabled?: boolean;
+    /** Czas trwania w ms (domyślnie 400). */
+    duration?: number;
+    /** Opóźnienie startu w ms (domyślnie 0). */
+    delay?: number;
+    /** Przesunięcie kolejnych elementów w ms (`delay = index * stagger`). */
+    stagger?: number;
+}
+/** Pełna konfiguracja wykresu. Jeden kształt dla wszystkich typów. */
+export interface KptChartConfig {
+    type: KptChartType;
+    /** Etykiety osi kategorii / wycinków. */
+    labels: string[];
+    series: KptChartSeries[];
+    /** Bar: orientacja słupków (domyślnie 'vertical'). */
+    orientation?: KptBarOrientation;
+    /** Line: tryb interpolacji (domyślnie 'linear'). */
+    interpolation?: KptLineInterpolation;
+    /** Line: wypełnienie obszaru pod linią. */
+    area?: boolean;
+    /** Line: punkty danych widoczne (domyślnie true). */
+    points?: boolean;
+    /** Line: pionowa prowadnica + podświetlona etykieta osi X przy hoverze punktu. */
+    crosshair?: boolean;
+    /** Doughnut/PolarArea/Radar: promień wewnętrzny 0..1 (doughnut, domyślnie 0.6). */
+    innerRadius?: number;
+    /** Bar: promień zaokrąglenia rogów w px (domyślnie 4). */
+    borderRadius?: number;
+    animation?: KptAnimationOptions;
+    legend?: KptLegendOptions;
+    title?: KptTitleOptions;
+    subtitle?: KptTitleOptions;
+    tooltip?: KptTooltipOptions;
+}
+/** Punkt w układzie SVG. */
+export interface KptPoint {
+    x: number;
+    y: number;
+}
+/** Prostokąt obszaru rysowania (plot area). */
+export interface KptRect {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}

package/dist/types.js

@@ -0,0 +1,5 @@
+/*
+ * Rdzeń wykresów — czyste typy TypeScript (bez zależności od DOM/frameworka).
+ * Współdzielone przez warstwę Angular (Faza 1) i React (Faza 2).
+ */
+export {};

package/package.json

@@ -0,0 +1,45 @@
+{
+  "name": "@konce-pt/chart",
+  "version": "0.8.0",
+  "description": "Chart geometry core for Koncept UI — scales, line and area paths, bar layout, pie and radar geometry. Framework-free TypeScript, zero runtime dependencies.",
+  "license": "MIT",
+  "author": "konce.pt",
+  "homepage": "https://ui.konce.pt/",
+  "repository": {
+    "type": "git",
+    "url": "git+https://gitlab.com/konce-pt/koncept-ui.git",
+    "directory": "packages/chart"
+  },
+  "bugs": {
+    "url": "https://gitlab.com/konce-pt/koncept-ui/-/issues"
+  },
+  "keywords": [
+    "charts",
+    "svg",
+    "data-visualization",
+    "design-system",
+    "koncept-ui",
+    "kpt"
+  ],
+  "type": "module",
+  "sideEffects": false,
+  "files": [
+    "dist"
+  ],
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    }
+  },
+  "devDependencies": {
+    "typescript": "~6.0.3"
+  },
+  "scripts": {
+    "build": "tsc -p tsconfig.build.json",
+    "test": "node --test \"src/**/*.test.ts\"",
+    "clean": "node -e \"require('fs').rmSync('dist',{recursive:true,force:true})\""
+  }
+}