@ojiepermana/angular 0.1.0 → 21.0.0

package/types/ojiepermana-angular-chart.d.ts

@@ -0,0 +1,1094 @@
+import * as _angular_core from '@angular/core';
+import { Type, Signal, TemplateRef } from '@angular/core';
+import * as _ojiepermana_angular_chart from '@ojiepermana/angular/chart';
+import { ScaleBand, ScaleLinear, scaleBand, scaleLinear, scalePoint, ScalePoint } from 'd3-scale';
+
+/**
+ * Theme-aware color definition for a chart series.
+ *
+ * Either:
+ * - a single `color` string (raw CSS color — hex, hsl, oklch, CSS var ref), or
+ * - a `theme` map whose keys match the document color scheme (`light` / `dark`).
+ *
+ * Values are injected verbatim into a scoped `<style>` block as
+ * `--color-<key>: <value>;`, so any valid CSS color works.
+ *
+ * Defaults reference the theme tokens from `@ojiepermana/angular/theme`
+ * (e.g. `'hsl(var(--chart-1))'`).
+ */
+interface ChartSeriesConfig {
+    /** Human-readable label (shown in legend, tooltip). */
+    readonly label?: string;
+    /** Optional icon component rendered next to the label. */
+    readonly icon?: Type<unknown>;
+    /** Raw color. Mutually exclusive with `theme`. */
+    readonly color?: string;
+    /** Theme-aware colors — keyed by color scheme. */
+    readonly theme?: Readonly<Record<ChartThemeKey, string>>;
+}
+/** Supported color scheme keys. */
+type ChartThemeKey = 'light' | 'dark';
+/** Map of series-key → config. */
+type ChartConfig = Readonly<Record<string, ChartSeriesConfig>>;
+/** CSS selector under which a chart instance is scoped. */
+declare const CHART_DATA_ATTRIBUTE = "data-chart";
+/** Default color schemes supported by the generated `<style>` block. */
+declare const CHART_THEMES: ReadonlyArray<{
+    readonly key: ChartThemeKey;
+    readonly selector: string;
+}>;
+/**
+ * Generate the CSS rule-set for a chart instance: one `--color-<key>` per
+ * series, scoped to the owning `[data-chart]` element, with optional dark
+ * variant via `[data-mode="dark"] [data-chart="…"]`.
+ *
+ * Series without any color are skipped (consumer can fall back to a default).
+ *
+ * @param chartId  Unique chart id (used as attribute value).
+ * @param config   Series configuration map.
+ */
+declare function buildChartCss(chartId: string, config: ChartConfig): string;
+/** Resolve the `var(--color-<key>)` reference for a given series. */
+declare function seriesColorVar(seriesKey: string): string;
+
+/** Pixel dimensions of the chart render area. */
+interface ChartDimensions {
+    readonly width: number;
+    readonly height: number;
+}
+/** Active data point (for tooltip / crosshair) shared across primitives. */
+interface ChartActivePoint {
+    readonly index: number;
+    readonly datumIndex?: number;
+    readonly seriesKey?: string;
+    readonly clientX?: number;
+    readonly clientY?: number;
+}
+/**
+ * Shared chart state provided by `ChartContainer` to all nested chart
+ * components (axes, grid, tooltip, legend, chart types).
+ *
+ * All state is exposed as signals so consumers can derive computed state
+ * (scales, visible series, tooltip position) without manual subscriptions.
+ */
+declare class ChartContext {
+    /** Stable instance id — used in the `data-chart` attribute and CSS scope. */
+    readonly id: _angular_core.WritableSignal<string>;
+    /** User-provided series config. */
+    readonly config: _angular_core.WritableSignal<Readonly<Record<string, _ojiepermana_angular_chart.ChartSeriesConfig>>>;
+    /** Measured render-area dimensions (ResizeObserver-driven). */
+    readonly dimensions: _angular_core.WritableSignal<ChartDimensions>;
+    /** Currently highlighted data point (tooltip / crosshair). */
+    readonly activePoint: _angular_core.WritableSignal<ChartActivePoint | null>;
+    /** Series keys the user has toggled off via legend. */
+    readonly hiddenSeries: _angular_core.WritableSignal<ReadonlySet<string>>;
+    /** Ordered list of series keys (from `config`). */
+    readonly seriesKeys: Signal<readonly string[]>;
+    /** Series keys currently visible (config order minus `hiddenSeries`). */
+    readonly visibleSeriesKeys: Signal<readonly string[]>;
+    /** Toggle visibility of a series. */
+    toggleSeries(key: string): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ChartContext, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<ChartContext>;
+}
+
+/**
+ * Emits a scoped `<style>` block mapping every series key in the current
+ * `ChartConfig` to a `--color-<key>` CSS custom property, scoped to
+ * `[data-chart="<id>"]`. Dark-mode values are scoped under `[data-mode="dark"]`.
+ *
+ * Implemented as an empty component that injects a real `<style>` element
+ * into its host via `Renderer2`. We avoid rendering `<style>` directly in a
+ * template — Angular hoists those into component CSS and strips
+ * interpolations from them.
+ *
+ * Consumers never instantiate this directly — `ChartContainer` renders it.
+ */
+declare class ChartStyle {
+    private readonly ctx;
+    private readonly host;
+    private readonly renderer;
+    private styleEl;
+    protected readonly css: _angular_core.Signal<string>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ChartStyle, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ChartStyle, "ui-chart-style", never, {}, {}, never, never, true, never>;
+}
+
+/**
+ * Root of every chart. Provides `ChartContext` to descendants, reflects the
+ * chart id via `data-chart`, injects the per-instance CSS-variable
+ * `<style>` block, and tracks its render-area dimensions via
+ * `ResizeObserver`.
+ *
+ * Usage:
+ * ```html
+ * <ui-chart-container [config]="cfg">
+ *   <ui-bar-chart [data]="data" />
+ * </ui-chart-container>
+ * ```
+ */
+declare class ChartContainer {
+    protected readonly ctx: ChartContext;
+    private readonly host;
+    private readonly zone;
+    private readonly platformId;
+    private readonly destroyRef;
+    /** Series configuration. Required for color / label resolution. */
+    readonly config: _angular_core.InputSignal<Readonly<Record<string, _ojiepermana_angular_chart.ChartSeriesConfig>>>;
+    /**
+     * Tailwind aspect-ratio utility for the container. Defaults to `aspect-video`
+     * for cartesian charts; override with `aspect-square` for radial / pie layouts.
+     */
+    readonly aspect: _angular_core.InputSignal<string>;
+    protected readonly hostClass: _angular_core.Signal<string>;
+    /**
+     * Optional explicit id override. When omitted, a stable auto-id is
+     * generated (`chart-<n>`), unique across the document.
+     */
+    readonly chartId: _angular_core.InputSignal<string | null>;
+    constructor();
+    private observeSize;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ChartContainer, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ChartContainer, "ui-chart-container", never, { "config": { "alias": "config"; "required": true; "isSignal": true; }; "aspect": { "alias": "aspect"; "required": false; "isSignal": true; }; "chartId": { "alias": "chartId"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/** A single row of chart data — one categorical key + N numeric series. */
+type ChartDatum = Readonly<Record<string, unknown>>;
+/** Render-area margins inside the chart's SVG (px). */
+interface ChartMargin {
+    readonly top: number;
+    readonly right: number;
+    readonly bottom: number;
+    readonly left: number;
+}
+/** Axis orientation for cartesian charts. */
+type ChartOrientation = 'vertical' | 'horizontal';
+/** Primary axis scale — band for categorical, linear for numeric. */
+type CategoryScale = ScaleBand<string>;
+type ValueScale = ScaleLinear<number, number>;
+/**
+ * Cartesian plotting frame shared between a chart type (Bar, Line, Area…)
+ * and its axis / grid primitives.
+ *
+ * The owning chart component provides an instance and publishes its scales;
+ * descendants read them via signals and re-render when dimensions or data
+ * change.
+ */
+declare class CartesianContext {
+    /** Inner width (outer width − margin.left − margin.right). */
+    readonly innerWidth: _angular_core.WritableSignal<number>;
+    /** Inner height (outer height − margin.top − margin.bottom). */
+    readonly innerHeight: _angular_core.WritableSignal<number>;
+    /** Margins around the plotting area. */
+    readonly margin: _angular_core.WritableSignal<ChartMargin>;
+    /** Layout orientation (drives which axis holds the band scale). */
+    readonly orientation: _angular_core.WritableSignal<ChartOrientation>;
+    /** Band (categorical) scale. */
+    readonly categoryScale: _angular_core.WritableSignal<CategoryScale | null>;
+    /** Linear (numeric) scale. */
+    readonly valueScale: _angular_core.WritableSignal<ValueScale | null>;
+    /** Ordered category domain (e.g. x labels for vertical, y labels for horizontal). */
+    readonly categories: _angular_core.WritableSignal<readonly string[]>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<CartesianContext, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<CartesianContext>;
+}
+/** Resolve the scale that maps to the X axis for a given orientation. */
+declare function xScale(ctx: Pick<CartesianContext, 'orientation' | 'categoryScale' | 'valueScale'>): Signal<CategoryScale | ValueScale | null>;
+/** Resolve the scale that maps to the Y axis for a given orientation. */
+declare function yScale(ctx: Pick<CartesianContext, 'orientation' | 'categoryScale' | 'valueScale'>): Signal<CategoryScale | ValueScale | null>;
+
+/** A tick descriptor for rendering axes. */
+interface ChartTick {
+    readonly value: string | number;
+    /** Offset (px) along the axis. For band scales this is the band center. */
+    readonly offset: number;
+    /** Display label. */
+    readonly label: string;
+}
+/** Produce evenly-spaced ticks for a band (categorical) scale. */
+declare function bandTicks(scale: ScaleBand<string>): ChartTick[];
+/**
+ * Produce ticks for a linear scale.
+ *
+ * @param scale      The linear scale.
+ * @param count      Approximate number of ticks (hint, d3 may return fewer/more).
+ * @param formatter  Label formatter.
+ */
+declare function linearTicks(scale: ScaleLinear<number, number>, count?: number, formatter?: (value: number) => string): ChartTick[];
+
+interface ChartIndexRange {
+    readonly startIndex: number;
+    readonly endIndex: number;
+}
+type NumericDomain = readonly [number, number];
+declare function normalizeIndexRange(start: number, end: number, maxCount: number): ChartIndexRange | null;
+declare function effectiveIndexRange(range: ChartIndexRange | null, maxCount: number): ChartIndexRange | null;
+declare function indexRangeSize(range: ChartIndexRange | null, maxCount: number): number;
+declare function sliceByIndexRange<T>(data: readonly T[], range: ChartIndexRange | null): readonly T[];
+declare function zoomIndexRange(current: ChartIndexRange | null, maxCount: number, anchorIndex: number, factor: number): ChartIndexRange | null;
+declare function panIndexRange(current: ChartIndexRange | null, maxCount: number, deltaSteps: number): ChartIndexRange | null;
+declare function normalizeNumericDomain(a: number, b: number): NumericDomain;
+declare function zoomNumericDomain(current: NumericDomain, full: NumericDomain, anchor: number, factor: number): NumericDomain;
+declare function panNumericDomain(current: NumericDomain, full: NumericDomain, delta: number): NumericDomain;
+
+/**
+ * X axis for a cartesian chart. Reads scales from `CartesianContext`.
+ *
+ * Renders as `<svg:g>` — must be placed inside the owning chart's SVG.
+ */
+declare class ChartAxisX {
+    private readonly ctx;
+    /** Approximate tick count for linear (value) scales. */
+    readonly tickCount: _angular_core.InputSignal<number>;
+    /** Show 6-px tick marks between the axis line and the labels. */
+    readonly tickLine: _angular_core.InputSignal<boolean>;
+    /** Formatter for numeric tick labels. */
+    readonly tickFormat: _angular_core.InputSignal<(value: number) => string>;
+    protected readonly innerWidth: _angular_core.WritableSignal<number>;
+    protected readonly transform: _angular_core.Signal<string>;
+    protected readonly ticks: _angular_core.Signal<ChartTick[]>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ChartAxisX, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ChartAxisX, "svg:g[ui-chart-axis-x]", never, { "tickCount": { "alias": "tickCount"; "required": false; "isSignal": true; }; "tickLine": { "alias": "tickLine"; "required": false; "isSignal": true; }; "tickFormat": { "alias": "tickFormat"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Y axis for a cartesian chart. Reads scales from `CartesianContext`.
+ *
+ * Renders as `<svg:g>` — must be placed inside the owning chart's SVG.
+ */
+declare class ChartAxisY {
+    private readonly ctx;
+    readonly tickCount: _angular_core.InputSignal<number>;
+    readonly tickLine: _angular_core.InputSignal<boolean>;
+    readonly tickFormat: _angular_core.InputSignal<(value: number) => string>;
+    protected readonly innerHeight: _angular_core.WritableSignal<number>;
+    protected readonly ticks: _angular_core.Signal<ChartTick[]>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ChartAxisY, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ChartAxisY, "svg:g[ui-chart-axis-y]", never, { "tickCount": { "alias": "tickCount"; "required": false; "isSignal": true; }; "tickLine": { "alias": "tickLine"; "required": false; "isSignal": true; }; "tickFormat": { "alias": "tickFormat"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Horizontal / vertical grid lines for the cartesian plotting area.
+ *
+ * Reads tick positions from `CartesianContext.valueScale`. Direction of the
+ * grid lines follows `orientation`:
+ *  - vertical   → horizontal grid lines (one per y-tick)
+ *  - horizontal → vertical grid lines (one per x-tick)
+ */
+declare class ChartGrid {
+    private readonly ctx;
+    readonly tickCount: _angular_core.InputSignal<number>;
+    protected readonly ticks: _angular_core.Signal<_ojiepermana_angular_chart.ChartTick[]>;
+    protected readonly line: (offset: number) => {
+        x1: number;
+        x2: number;
+        y1: number;
+        y2: number;
+    };
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ChartGrid, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ChartGrid, "svg:g[ui-chart-grid]", never, { "tickCount": { "alias": "tickCount"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Crosshair primitive — a line drawn through the currently active data point
+ * perpendicular to the categorical axis. Reads `activePoint` from
+ * `ChartContext` and the scales from `CartesianContext`.
+ *
+ * Place inside a cartesian chart's SVG inner group.
+ */
+declare class ChartCrosshair {
+    private readonly root;
+    private readonly cart;
+    protected readonly line: _angular_core.Signal<{
+        x1: number;
+        x2: number;
+        y1: number;
+        y2: number;
+    } | null>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ChartCrosshair, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ChartCrosshair, "svg:g[ui-chart-crosshair]", never, {}, {}, never, never, true, never>;
+}
+
+declare class ChartBrush {
+    private readonly hitbox;
+    private readonly cart;
+    private readonly categorical;
+    private readonly scatter;
+    private readonly mode;
+    private readonly activePointerId;
+    private readonly categoryStartIndex;
+    private readonly categoryPanStart;
+    private readonly scatterBrush;
+    private readonly scatterPan;
+    protected readonly width: _angular_core.Signal<number>;
+    protected readonly height: _angular_core.Signal<number>;
+    protected readonly categoryPreview: _angular_core.Signal<{
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    } | null>;
+    protected readonly scatterPreviewRect: _angular_core.Signal<{
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    } | null>;
+    protected onPointerDown(event: PointerEvent): void;
+    protected onPointerMove(event: PointerEvent): void;
+    protected onPointerUp(event?: PointerEvent): void;
+    protected onPointerCancel(event: PointerEvent): void;
+    protected onWheel(event: WheelEvent): void;
+    protected resetZoom(): void;
+    private onScatterPointerDown;
+    private localPoint;
+    private pointerAxis;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ChartBrush, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ChartBrush, "svg:g[ui-chart-brush]", never, {}, {}, never, never, true, never>;
+}
+
+/**
+ * Attach to a chart's `<svg:svg>` to publish pointer-driven active-point
+ * state into the surrounding `ChartContext`.
+ *
+ * Computes the local (x, y) of the pointer relative to the inner plotting
+ * area, resolves the nearest category, and updates
+ * `ChartContext.activePoint`. Clears it on `pointerleave`.
+ */
+declare class ChartPointerTracker {
+    private readonly root;
+    private readonly cart;
+    private readonly viewport;
+    protected onMove(event: PointerEvent): void;
+    protected onLeave(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ChartPointerTracker, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ChartPointerTracker, "svg:svg[uiChartPointerTracker]", never, {}, {}, never, never, true, never>;
+}
+
+/** Row of data fed to tooltip templates. */
+interface ChartTooltipRow {
+    readonly seriesKey: string;
+    readonly label: string;
+    readonly value: unknown;
+    readonly color: string;
+    readonly icon?: Type<unknown>;
+}
+/** Payload available to a user-supplied tooltip template. */
+interface ChartTooltipPayload {
+    readonly category: string;
+    readonly datum: ChartDatum;
+    readonly rows: readonly ChartTooltipRow[];
+}
+/** Indicator rendered beside each tooltip row. */
+type ChartTooltipIndicator = 'dot' | 'line' | 'dashed' | 'none';
+/** Signature for the per-row value formatter (string output). */
+type ChartTooltipValueFormatter = (value: unknown, row: ChartTooltipRow, payload: ChartTooltipPayload) => string;
+/** Signature for the tooltip header (label) formatter. */
+type ChartTooltipLabelFormatter = (label: string, payload: ChartTooltipPayload) => string;
+/**
+ * Tooltip overlay — renders the default tooltip card (or a user-supplied
+ * template) anchored to the currently active data point.
+ *
+ * Shadcn-compatible knobs:
+ * - `indicator="line"` / `"none"` / `"dashed"` — swap the row glyph
+ * - `hideLabel` — drop the header row
+ * - `label="Activities"` — override the header text
+ * - `labelKey="activities"` — resolve the header from `config[labelKey].label`
+ * - `labelFormatter` — transform the header (e.g. ISO date → long date)
+ * - `formatter` — format per-row values (e.g. `"380 kcal"`)
+ * - `valueKey` — for pie/radial/radar, read row value from a single field
+ * - Icons are picked up automatically from `config[key].icon`.
+ */
+declare class ChartTooltip {
+    private readonly root;
+    private readonly host;
+    /** Data key on each datum whose value is the category label (x-axis). */
+    readonly xKey: _angular_core.InputSignal<string | null>;
+    /** Data source (optional — if omitted tooltip reads from chart data via activePoint.datumIndex). */
+    readonly data: _angular_core.InputSignal<readonly Readonly<Record<string, unknown>>[] | null>;
+    /**
+     * Optional key for per-datum value lookup (pie / radial / radar datasets
+     * store values on a single field like `visitors` instead of one field per
+     * series). When set and `activePoint.seriesKey` is active, the tooltip row
+     * reads `datum[valueKey]` for its value.
+     */
+    readonly valueKey: _angular_core.InputSignal<string | null>;
+    /** Indicator variant next to each row. Default `'dot'`. */
+    readonly indicator: _angular_core.InputSignal<ChartTooltipIndicator>;
+    /** Hide the header label entirely. */
+    readonly hideLabel: _angular_core.InputSignal<boolean>;
+    /** Override the header label with a fixed string. Takes precedence over `labelKey`. */
+    readonly label: _angular_core.InputSignal<string | null>;
+    /**
+     * Resolve the header label from `config[labelKey].label`. Useful when the
+     * header should come from a config entry rather than the datum itself
+     * (shadcn's "Custom label" variant).
+     */
+    readonly labelKey: _angular_core.InputSignal<string | null>;
+    /** Transform the final header string (e.g. ISO date → long date). */
+    readonly labelFormatter: _angular_core.InputSignal<ChartTooltipLabelFormatter | null>;
+    /** Format each row's value (return string — HTML is not interpreted). */
+    readonly formatter: _angular_core.InputSignal<ChartTooltipValueFormatter | null>;
+    readonly customTpl: _angular_core.Signal<TemplateRef<any> | undefined>;
+    protected readonly visible: _angular_core.Signal<boolean>;
+    protected readonly payload: _angular_core.Signal<ChartTooltipPayload | null>;
+    /** Resolve the header string honoring `label`, `labelKey`, then `labelFormatter`. */
+    protected headerText(p: ChartTooltipPayload): string | null;
+    /** Apply per-row value formatter (or stringify). */
+    protected formatRow(row: ChartTooltipRow, p: ChartTooltipPayload): string;
+    protected readonly position: _angular_core.Signal<{
+        x: number;
+        y: number;
+    }>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ChartTooltip, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ChartTooltip, "ui-chart-tooltip", never, { "xKey": { "alias": "xKey"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "valueKey": { "alias": "valueKey"; "required": false; "isSignal": true; }; "indicator": { "alias": "indicator"; "required": false; "isSignal": true; }; "hideLabel": { "alias": "hideLabel"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "labelKey": { "alias": "labelKey"; "required": false; "isSignal": true; }; "labelFormatter": { "alias": "labelFormatter"; "required": false; "isSignal": true; }; "formatter": { "alias": "formatter"; "required": false; "isSignal": true; }; }, {}, ["customTpl"], never, true, never>;
+}
+
+/**
+ * Legend — renders a list of series swatches. Clicking an item toggles
+ * visibility via `ChartContext.toggleSeries`.
+ *
+ * Place as a child of `<ui-chart-container>`:
+ * ```html
+ * <ui-chart-container [config]="cfg">
+ *   <ui-bar-chart ... />
+ *   <ui-chart-legend />
+ * </ui-chart-container>
+ * ```
+ */
+declare class ChartLegend {
+    private readonly root;
+    protected readonly items: _angular_core.Signal<{
+        seriesKey: string;
+        label: string;
+        color: string;
+        hidden: boolean;
+    }[]>;
+    protected toggle(key: string): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ChartLegend, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ChartLegend, "ui-chart-legend", never, {}, {}, never, never, true, never>;
+}
+
+declare class ChartZoomControls {
+    private readonly categorical;
+    private readonly scatter;
+    protected readonly status: _angular_core.Signal<string | null>;
+    protected readonly hint: _angular_core.Signal<"Drag to brush a region. Use the wheel to zoom and one-finger touch drag to pan while zoomed." | "Drag to select a category range. Use the wheel to zoom and one-finger touch drag to pan while zoomed.">;
+    protected resetZoom(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ChartZoomControls, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ChartZoomControls, "ui-chart-zoom-controls", never, {}, {}, never, never, true, never>;
+}
+
+declare class PieCenter {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PieCenter, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PieCenter, "ui-pie-center", never, {}, {}, never, ["*"], true, never>;
+}
+
+declare class RadialCenter {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RadialCenter, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<RadialCenter, "ui-radial-center", never, {}, {}, never, ["*"], true, never>;
+}
+
+/** Bar-chart layout variant. */
+type BarVariant = 'grouped' | 'stacked';
+/** A single bar rectangle ready to render. */
+interface BarRect {
+    readonly key: string;
+    readonly seriesKey: string;
+    readonly datumIndex: number;
+    readonly category: string;
+    readonly value: number;
+    readonly x: number;
+    readonly y: number;
+    readonly width: number;
+    readonly height: number;
+    readonly color: string;
+    readonly active: boolean;
+}
+/** Inputs required to compute bar-chart geometry. */
+interface BarLayoutInput {
+    readonly data: readonly ChartDatum[];
+    readonly xKey: string;
+    readonly seriesKeys: readonly string[];
+    readonly variant: BarVariant;
+    readonly orientation: ChartOrientation;
+    readonly innerWidth: number;
+    readonly innerHeight: number;
+    readonly bandPadding: number;
+    readonly groupPadding: number;
+    readonly colorKey?: string;
+    readonly activeKey?: string;
+    readonly activeValue?: string | number;
+}
+/** Computed layout: bars + scales. */
+interface BarLayoutResult {
+    readonly bars: readonly BarRect[];
+    readonly categoryScale: ReturnType<typeof scaleBand<string>>;
+    readonly valueScale: ReturnType<typeof scaleLinear<number, number>>;
+    readonly categories: readonly string[];
+}
+/** Build all bar rectangles for the given config. */
+declare function computeBarLayout(input: BarLayoutInput): BarLayoutResult;
+
+/** Event emitted when a user clicks a bar. */
+interface BarClickEvent {
+    readonly seriesKey: string;
+    readonly datumIndex: number;
+    readonly category: string;
+    readonly value: number;
+    readonly datum: ChartDatum;
+}
+/**
+ * Bar chart — composable within `<ui-chart-container>`.
+ *
+ * Layout variants (via inputs):
+ * - `orientation`: `'vertical'` (default) or `'horizontal'`
+ * - `variant`:     `'grouped'`  (default) or `'stacked'`
+ */
+declare class BarChart {
+    private readonly root;
+    private readonly cart;
+    readonly data: _angular_core.InputSignal<readonly Readonly<Record<string, unknown>>[]>;
+    readonly xKey: _angular_core.InputSignal<string>;
+    readonly orientation: _angular_core.InputSignal<ChartOrientation>;
+    readonly variant: _angular_core.InputSignal<BarVariant>;
+    readonly margin: _angular_core.InputSignal<ChartMargin>;
+    readonly bandPadding: _angular_core.InputSignal<number>;
+    readonly groupPadding: _angular_core.InputSignal<number>;
+    readonly cornerRadius: _angular_core.InputSignal<number>;
+    readonly colorKey: _angular_core.InputSignal<string | undefined>;
+    readonly activeKey: _angular_core.InputSignal<string | undefined>;
+    readonly activeValue: _angular_core.InputSignal<string | number | undefined>;
+    readonly showValueLabels: _angular_core.InputSignal<boolean>;
+    readonly valueLabelFormat: _angular_core.InputSignal<(value: number) => string>;
+    readonly barClick: _angular_core.OutputEmitterRef<BarClickEvent>;
+    protected readonly innerWidth: _angular_core.Signal<number>;
+    protected readonly innerHeight: _angular_core.Signal<number>;
+    protected readonly layout: _angular_core.Signal<_ojiepermana_angular_chart.BarLayoutResult>;
+    protected readonly bars: _angular_core.Signal<readonly BarRect[]>;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly innerTransform: _angular_core.Signal<string>;
+    protected readonly ariaSummary: _angular_core.Signal<string>;
+    constructor();
+    protected emitClick(bar: BarRect): void;
+    protected setActivePoint(event: FocusEvent, bar: BarRect): void;
+    protected clearActivePoint(): void;
+    protected barOpacity(bar: BarRect): number;
+    protected formatValueLabel(bar: BarRect): string;
+    protected barLabelX(bar: BarRect): number;
+    protected barLabelY(bar: BarRect): number;
+    protected barLabelAnchor(bar: BarRect): 'middle' | 'start' | 'end';
+    protected barAriaLabel(bar: BarRect): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BarChart, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<BarChart, "ui-bar-chart", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "xKey": { "alias": "xKey"; "required": true; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "margin": { "alias": "margin"; "required": false; "isSignal": true; }; "bandPadding": { "alias": "bandPadding"; "required": false; "isSignal": true; }; "groupPadding": { "alias": "groupPadding"; "required": false; "isSignal": true; }; "cornerRadius": { "alias": "cornerRadius"; "required": false; "isSignal": true; }; "colorKey": { "alias": "colorKey"; "required": false; "isSignal": true; }; "activeKey": { "alias": "activeKey"; "required": false; "isSignal": true; }; "activeValue": { "alias": "activeValue"; "required": false; "isSignal": true; }; "showValueLabels": { "alias": "showValueLabels"; "required": false; "isSignal": true; }; "valueLabelFormat": { "alias": "valueLabelFormat"; "required": false; "isSignal": true; }; }, { "barClick": "barClick"; }, never, ["svg\\:g[ui-chart-grid]", "svg\\:g[ui-chart-axis-x]", "svg\\:g[ui-chart-axis-y]", "svg\\:g[ui-chart-crosshair]", "*", "ui-chart-tooltip", "ui-chart-legend"], true, never>;
+}
+
+/** Curve type shared by line & area charts. */
+type LineCurve = 'linear' | 'monotone' | 'step';
+/** A single series ready to render as either a line or an area. */
+interface LineSeriesPath {
+    readonly seriesKey: string;
+    readonly color: string;
+    readonly linePath: string;
+    /** Optional area path — only populated when `computeAreaLayout` is used. */
+    readonly areaPath?: string;
+    /** Raw points for dots / active markers. */
+    readonly points: readonly LinePoint[];
+}
+/** One resolved (x, y) point for a series. */
+interface LinePoint {
+    readonly seriesKey: string;
+    readonly datumIndex: number;
+    readonly category: string;
+    readonly value: number;
+    readonly x: number;
+    readonly y: number;
+}
+interface CartesianBase {
+    readonly data: readonly ChartDatum[];
+    readonly xKey: string;
+    readonly seriesKeys: readonly string[];
+    readonly orientation: ChartOrientation;
+    readonly innerWidth: number;
+    readonly innerHeight: number;
+    readonly curve: LineCurve;
+}
+interface LineLayoutResult {
+    readonly series: readonly LineSeriesPath[];
+    readonly points: readonly LinePoint[];
+    readonly categoryScale: ReturnType<typeof scalePoint<string>>;
+    readonly valueScale: ReturnType<typeof scaleLinear<number, number>>;
+    readonly categories: readonly string[];
+}
+interface AreaLayoutResult extends LineLayoutResult {
+    readonly stacked: boolean;
+}
+/** Build category + value scales for point-based charts (line / area). */
+declare function buildCartesianScales(input: CartesianBase): {
+    categories: readonly string[];
+    categoryScale: ReturnType<typeof scalePoint<string>>;
+    valueScale: ReturnType<typeof scaleLinear<number, number>>;
+};
+/** Compute line-chart geometry. */
+declare function computeLineLayout(input: CartesianBase): LineLayoutResult;
+interface AreaLayoutInput extends CartesianBase {
+    readonly stacked: boolean;
+    readonly expanded?: boolean;
+}
+/** Compute area-chart geometry (single or stacked). */
+declare function computeAreaLayout(input: AreaLayoutInput): AreaLayoutResult;
+
+/** Emitted when a data point is activated (click or keyboard). */
+interface LinePointClickEvent {
+    readonly seriesKey: string;
+    readonly datumIndex: number;
+    readonly category: string;
+    readonly value: number;
+    readonly datum: ChartDatum;
+}
+declare class LineChart {
+    private readonly root;
+    private readonly cart;
+    private readonly viewport;
+    readonly data: _angular_core.InputSignal<readonly Readonly<Record<string, unknown>>[]>;
+    readonly xKey: _angular_core.InputSignal<string>;
+    readonly orientation: _angular_core.InputSignal<ChartOrientation>;
+    readonly curve: _angular_core.InputSignal<LineCurve>;
+    readonly margin: _angular_core.InputSignal<ChartMargin>;
+    readonly strokeWidth: _angular_core.InputSignal<number>;
+    readonly showDots: _angular_core.InputSignal<boolean>;
+    readonly dotRadius: _angular_core.InputSignal<number>;
+    readonly dotColorKey: _angular_core.InputSignal<string | undefined>;
+    readonly dotStrokeColor: _angular_core.InputSignal<string | undefined>;
+    readonly dotStrokeWidth: _angular_core.InputSignal<number>;
+    readonly showValueLabels: _angular_core.InputSignal<boolean>;
+    readonly valueLabelFormat: _angular_core.InputSignal<(value: number) => string>;
+    readonly pointClick: _angular_core.OutputEmitterRef<LinePointClickEvent>;
+    protected readonly innerWidth: _angular_core.Signal<number>;
+    protected readonly innerHeight: _angular_core.Signal<number>;
+    protected readonly visibleStartIndex: _angular_core.Signal<number>;
+    protected readonly visibleData: _angular_core.Signal<readonly Readonly<Record<string, unknown>>[]>;
+    protected readonly layout: _angular_core.Signal<_ojiepermana_angular_chart.LineLayoutResult>;
+    protected readonly series: _angular_core.Signal<readonly LineSeriesPath[]>;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly innerTransform: _angular_core.Signal<string>;
+    protected readonly ariaSummary: _angular_core.Signal<string>;
+    constructor();
+    protected emitClick(p: LinePoint): void;
+    protected setActivePoint(event: FocusEvent, p: LinePoint): void;
+    protected clearActivePoint(): void;
+    protected dotFill(point: LinePoint, fallbackColor: string): string;
+    protected formatValueLabel(point: LinePoint): string;
+    protected labelX(point: LinePoint): number;
+    protected labelY(point: LinePoint): number;
+    protected labelAnchor(): 'middle' | 'start';
+    protected pointAriaLabel(p: LinePoint): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LineChart, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LineChart, "ui-line-chart", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "xKey": { "alias": "xKey"; "required": true; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "curve": { "alias": "curve"; "required": false; "isSignal": true; }; "margin": { "alias": "margin"; "required": false; "isSignal": true; }; "strokeWidth": { "alias": "strokeWidth"; "required": false; "isSignal": true; }; "showDots": { "alias": "showDots"; "required": false; "isSignal": true; }; "dotRadius": { "alias": "dotRadius"; "required": false; "isSignal": true; }; "dotColorKey": { "alias": "dotColorKey"; "required": false; "isSignal": true; }; "dotStrokeColor": { "alias": "dotStrokeColor"; "required": false; "isSignal": true; }; "dotStrokeWidth": { "alias": "dotStrokeWidth"; "required": false; "isSignal": true; }; "showValueLabels": { "alias": "showValueLabels"; "required": false; "isSignal": true; }; "valueLabelFormat": { "alias": "valueLabelFormat"; "required": false; "isSignal": true; }; }, { "pointClick": "pointClick"; }, never, ["svg\\:g[ui-chart-grid]", "svg\\:g[ui-chart-axis-x]", "svg\\:g[ui-chart-axis-y]", "svg\\:g[ui-chart-crosshair]", "svg:g[ui-chart-brush]", "ui-chart-tooltip", "ui-chart-legend", "ui-chart-zoom-controls"], true, never>;
+}
+
+/**
+ * Publish a `scalePoint` from line/area layouts to the `CartesianContext`,
+ * which expects a `scaleBand`. We adapt by building a band with zero padding
+ * centered on the same positions, so axis ticks render at the correct
+ * offsets.
+ *
+ * This keeps axes/grid primitives agnostic to whether the underlying chart
+ * uses `scaleBand` (bar) or `scalePoint` (line/area).
+ */
+declare function pointToBandAdapter(pointScale: ScalePoint<string>, range: [number, number]): ReturnType<typeof scaleBand<string>>;
+/** Recreate a linear scale with the same domain/range (handy for effects). */
+declare function cloneLinear(scale: ReturnType<typeof scaleLinear<number, number>>): ReturnType<typeof scaleLinear<number, number>>;
+declare function provideCartesianFromLineLayout(ctx: CartesianContext, layout: {
+    categoryScale: ScalePoint<string>;
+    valueScale: ReturnType<typeof scaleLinear<number, number>>;
+    categories: readonly string[];
+}, orientation: 'vertical' | 'horizontal', innerWidth: number, innerHeight: number): void;
+
+interface AreaPointClickEvent {
+    readonly seriesKey: string;
+    readonly datumIndex: number;
+    readonly category: string;
+    readonly value: number;
+    readonly datum: ChartDatum;
+}
+/**
+ * Area chart — composable within `<ui-chart-container>`.
+ *
+ * - `stacked=true` stacks series along the value axis.
+ * - `gradient=true` fills each area with a vertical linear-gradient from
+ *   the series color (top) to transparent (bottom). The gradient is
+ *   emitted as `<defs><linearGradient>` per series, unique per chart id.
+ */
+declare class AreaChart {
+    private readonly root;
+    private readonly cart;
+    private readonly viewport;
+    readonly data: _angular_core.InputSignal<readonly Readonly<Record<string, unknown>>[]>;
+    readonly xKey: _angular_core.InputSignal<string>;
+    readonly orientation: _angular_core.InputSignal<ChartOrientation>;
+    readonly stacked: _angular_core.InputSignal<boolean>;
+    readonly expanded: _angular_core.InputSignal<boolean>;
+    readonly gradient: _angular_core.InputSignal<boolean>;
+    readonly curve: _angular_core.InputSignal<LineCurve>;
+    readonly margin: _angular_core.InputSignal<ChartMargin>;
+    readonly strokeWidth: _angular_core.InputSignal<number>;
+    readonly showDots: _angular_core.InputSignal<boolean>;
+    readonly dotRadius: _angular_core.InputSignal<number>;
+    readonly pointClick: _angular_core.OutputEmitterRef<AreaPointClickEvent>;
+    protected readonly innerWidth: _angular_core.Signal<number>;
+    protected readonly innerHeight: _angular_core.Signal<number>;
+    protected readonly visibleStartIndex: _angular_core.Signal<number>;
+    protected readonly visibleData: _angular_core.Signal<readonly Readonly<Record<string, unknown>>[]>;
+    protected readonly layout: _angular_core.Signal<_ojiepermana_angular_chart.AreaLayoutResult>;
+    protected readonly series: _angular_core.Signal<readonly LineSeriesPath[]>;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly innerTransform: _angular_core.Signal<string>;
+    protected readonly ariaSummary: _angular_core.Signal<string>;
+    constructor();
+    protected gradientId(seriesKey: string): string;
+    protected areaFill(seriesKey: string, color: string): string;
+    protected emitClick(p: LinePoint): void;
+    protected setActivePoint(event: FocusEvent, p: LinePoint): void;
+    protected clearActivePoint(): void;
+    protected pointAriaLabel(p: LinePoint): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AreaChart, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AreaChart, "ui-area-chart", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "xKey": { "alias": "xKey"; "required": true; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "stacked": { "alias": "stacked"; "required": false; "isSignal": true; }; "expanded": { "alias": "expanded"; "required": false; "isSignal": true; }; "gradient": { "alias": "gradient"; "required": false; "isSignal": true; }; "curve": { "alias": "curve"; "required": false; "isSignal": true; }; "margin": { "alias": "margin"; "required": false; "isSignal": true; }; "strokeWidth": { "alias": "strokeWidth"; "required": false; "isSignal": true; }; "showDots": { "alias": "showDots"; "required": false; "isSignal": true; }; "dotRadius": { "alias": "dotRadius"; "required": false; "isSignal": true; }; }, { "pointClick": "pointClick"; }, never, ["svg\\:g[ui-chart-grid]", "svg\\:g[ui-chart-axis-x]", "svg\\:g[ui-chart-axis-y]", "svg\\:g[ui-chart-crosshair]", "svg:g[ui-chart-brush]", "ui-chart-tooltip", "ui-chart-legend", "ui-chart-zoom-controls"], true, never>;
+}
+
+interface PieLayoutInput {
+    readonly data: readonly ChartDatum[];
+    /** Field on each datum whose value is the slice's numeric magnitude. */
+    readonly valueKey: string;
+    /** Field on each datum whose value is the slice's categorical label. */
+    readonly nameKey: string;
+    /**
+     * Ordered series keys used to resolve color (`var(--color-<key>)`).
+     * Must have the same length as `data`. If omitted, falls back to
+     * `nameKey` values.
+     */
+    readonly seriesKeys?: readonly string[];
+    readonly innerWidth: number;
+    readonly innerHeight: number;
+    /** Inner radius for donut-style charts (0 = full pie). */
+    readonly innerRadius: number;
+    /** Gap between slices, in radians. */
+    readonly padAngle: number;
+    /** Corner radius for slices (px). */
+    readonly cornerRadius: number;
+    /** Starting angle in radians (default −π/2 = 12 o'clock). */
+    readonly startAngle: number;
+    /** Ending angle in radians (default 3π/2). */
+    readonly endAngle: number;
+    readonly activeIndex?: number;
+    readonly activeOffset?: number;
+}
+interface PieSliceRect {
+    readonly seriesKey: string;
+    readonly name: string;
+    readonly value: number;
+    readonly datumIndex: number;
+    readonly color: string;
+    readonly arcPath: string;
+    readonly centroid: readonly [number, number];
+    readonly startAngle: number;
+    readonly endAngle: number;
+    readonly translateX: number;
+    readonly translateY: number;
+}
+interface PieLayout {
+    readonly slices: readonly PieSliceRect[];
+    readonly centerX: number;
+    readonly centerY: number;
+    readonly outerRadius: number;
+}
+declare function computePieLayout(input: PieLayoutInput): PieLayout;
+
+interface PieSliceClickEvent {
+    readonly seriesKey: string;
+    readonly name: string;
+    readonly value: number;
+    readonly datumIndex: number;
+    readonly datum: ChartDatum;
+}
+declare class PieChart {
+    private readonly root;
+    readonly data: _angular_core.InputSignal<readonly Readonly<Record<string, unknown>>[]>;
+    readonly valueKey: _angular_core.InputSignal<string>;
+    readonly nameKey: _angular_core.InputSignal<string>;
+    readonly seriesKeys: _angular_core.InputSignal<readonly string[] | undefined>;
+    readonly margin: _angular_core.InputSignal<ChartMargin>;
+    readonly innerRadius: _angular_core.InputSignal<number>;
+    readonly padAngle: _angular_core.InputSignal<number>;
+    readonly cornerRadius: _angular_core.InputSignal<number>;
+    readonly startAngle: _angular_core.InputSignal<number>;
+    readonly endAngle: _angular_core.InputSignal<number>;
+    readonly showLabels: _angular_core.InputSignal<boolean>;
+    readonly activeIndex: _angular_core.InputSignal<number | undefined>;
+    readonly activeOffset: _angular_core.InputSignal<number>;
+    readonly sliceClick: _angular_core.OutputEmitterRef<PieSliceClickEvent>;
+    protected readonly innerWidth: _angular_core.Signal<number>;
+    protected readonly innerHeight: _angular_core.Signal<number>;
+    protected readonly layout: _angular_core.Signal<_ojiepermana_angular_chart.PieLayout>;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly innerTransform: _angular_core.Signal<string>;
+    protected readonly ariaSummary: _angular_core.Signal<string>;
+    protected sliceAriaLabel(s: PieSliceRect): string;
+    protected sliceTransform(s: PieSliceRect): string | null;
+    protected emitClick(s: PieSliceRect): void;
+    protected setActive(event: PointerEvent | FocusEvent, s: PieSliceRect): void;
+    protected clearActive(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PieChart, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PieChart, "ui-pie-chart", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "valueKey": { "alias": "valueKey"; "required": true; "isSignal": true; }; "nameKey": { "alias": "nameKey"; "required": true; "isSignal": true; }; "seriesKeys": { "alias": "seriesKeys"; "required": false; "isSignal": true; }; "margin": { "alias": "margin"; "required": false; "isSignal": true; }; "innerRadius": { "alias": "innerRadius"; "required": false; "isSignal": true; }; "padAngle": { "alias": "padAngle"; "required": false; "isSignal": true; }; "cornerRadius": { "alias": "cornerRadius"; "required": false; "isSignal": true; }; "startAngle": { "alias": "startAngle"; "required": false; "isSignal": true; }; "endAngle": { "alias": "endAngle"; "required": false; "isSignal": true; }; "showLabels": { "alias": "showLabels"; "required": false; "isSignal": true; }; "activeIndex": { "alias": "activeIndex"; "required": false; "isSignal": true; }; "activeOffset": { "alias": "activeOffset"; "required": false; "isSignal": true; }; }, { "sliceClick": "sliceClick"; }, never, ["ui-pie-center", "ui-chart-tooltip", "ui-chart-legend"], true, never>;
+}
+
+type RadarCurve = 'linear' | 'cardinal';
+type RadarGrid = 'polygon' | 'circle' | 'none';
+interface RadarLayoutInput {
+    readonly data: readonly ChartDatum[];
+    readonly axisKey: string;
+    readonly seriesKeys: readonly string[];
+    readonly innerWidth: number;
+    readonly innerHeight: number;
+    readonly maxValue?: number;
+    readonly levels: number;
+    readonly curve: RadarCurve;
+    readonly grid: RadarGrid;
+}
+interface RadarAxisInfo {
+    readonly name: string;
+    readonly angle: number;
+    readonly x: number;
+    readonly y: number;
+}
+interface RadarSeries {
+    readonly seriesKey: string;
+    readonly color: string;
+    readonly path: string;
+    readonly points: readonly {
+        readonly x: number;
+        readonly y: number;
+        readonly value: number;
+        readonly axis: string;
+    }[];
+}
+interface RadarLevel {
+    readonly value: number;
+    readonly radius: number;
+    readonly path: string;
+}
+interface RadarLayout {
+    readonly centerX: number;
+    readonly centerY: number;
+    readonly radius: number;
+    readonly axes: readonly RadarAxisInfo[];
+    readonly levels: readonly RadarLevel[];
+    readonly maxValue: number;
+    readonly series: readonly RadarSeries[];
+    readonly grid: RadarGrid;
+}
+declare function computeRadarLayout(input: RadarLayoutInput): RadarLayout;
+
+declare class RadarChart {
+    private readonly root;
+    readonly data: _angular_core.InputSignal<readonly Readonly<Record<string, unknown>>[]>;
+    readonly axisKey: _angular_core.InputSignal<string>;
+    readonly margin: _angular_core.InputSignal<ChartMargin>;
+    readonly curve: _angular_core.InputSignal<RadarCurve>;
+    readonly levels: _angular_core.InputSignal<number>;
+    readonly maxValue: _angular_core.InputSignal<number | undefined>;
+    readonly strokeWidth: _angular_core.InputSignal<number>;
+    readonly fillOpacity: _angular_core.InputSignal<number>;
+    readonly showLabels: _angular_core.InputSignal<boolean>;
+    readonly showDots: _angular_core.InputSignal<boolean>;
+    readonly dotRadius: _angular_core.InputSignal<number>;
+    readonly grid: _angular_core.InputSignal<RadarGrid>;
+    readonly gridFilled: _angular_core.InputSignal<boolean>;
+    readonly showAxes: _angular_core.InputSignal<boolean>;
+    readonly linesOnly: _angular_core.InputSignal<boolean>;
+    protected readonly innerWidth: _angular_core.Signal<number>;
+    protected readonly innerHeight: _angular_core.Signal<number>;
+    protected readonly layout: _angular_core.Signal<_ojiepermana_angular_chart.RadarLayout>;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly innerTransform: _angular_core.Signal<string>;
+    protected readonly ariaSummary: _angular_core.Signal<string>;
+    protected gridFill(): string;
+    protected gridFillOpacity(levelIndex: number): number | null;
+    protected dotAriaLabel(seriesKey: string, p: {
+        axis: string;
+        value: number;
+    }): string;
+    protected setActive(event: PointerEvent | FocusEvent, seriesKey: string, index: number): void;
+    protected clearActive(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RadarChart, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<RadarChart, "ui-radar-chart", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "axisKey": { "alias": "axisKey"; "required": true; "isSignal": true; }; "margin": { "alias": "margin"; "required": false; "isSignal": true; }; "curve": { "alias": "curve"; "required": false; "isSignal": true; }; "levels": { "alias": "levels"; "required": false; "isSignal": true; }; "maxValue": { "alias": "maxValue"; "required": false; "isSignal": true; }; "strokeWidth": { "alias": "strokeWidth"; "required": false; "isSignal": true; }; "fillOpacity": { "alias": "fillOpacity"; "required": false; "isSignal": true; }; "showLabels": { "alias": "showLabels"; "required": false; "isSignal": true; }; "showDots": { "alias": "showDots"; "required": false; "isSignal": true; }; "dotRadius": { "alias": "dotRadius"; "required": false; "isSignal": true; }; "grid": { "alias": "grid"; "required": false; "isSignal": true; }; "gridFilled": { "alias": "gridFilled"; "required": false; "isSignal": true; }; "showAxes": { "alias": "showAxes"; "required": false; "isSignal": true; }; "linesOnly": { "alias": "linesOnly"; "required": false; "isSignal": true; }; }, {}, never, ["*", "ui-chart-tooltip", "ui-chart-legend"], true, never>;
+}
+
+interface RadialLayoutInput {
+    readonly data: readonly ChartDatum[];
+    readonly nameKey: string;
+    readonly valueKey: string;
+    readonly innerWidth: number;
+    readonly innerHeight: number;
+    /** Optional explicit series-key list (same length as data). */
+    readonly seriesKeys?: readonly string[];
+    /** Gap between concentric tracks (px). */
+    readonly trackPadding: number;
+    /** Start / end angle (radians). */
+    readonly startAngle: number;
+    readonly endAngle: number;
+    readonly cornerRadius: number;
+    readonly maxValue?: number;
+}
+interface RadialBarRect {
+    readonly seriesKey: string;
+    readonly name: string;
+    readonly value: number;
+    readonly datumIndex: number;
+    readonly color: string;
+    readonly arcPath: string;
+    readonly backgroundPath: string;
+    readonly innerRadius: number;
+    readonly outerRadius: number;
+    readonly endAngle: number;
+}
+interface RadialLayout {
+    readonly centerX: number;
+    readonly centerY: number;
+    readonly outerRadius: number;
+    readonly bars: readonly RadialBarRect[];
+    readonly maxValue: number;
+}
+declare function computeRadialLayout(input: RadialLayoutInput): RadialLayout;
+
+type RadialValueLabelFormatter = (value: number, name: string) => string;
+interface RadialBarClickEvent {
+    readonly seriesKey: string;
+    readonly name: string;
+    readonly value: number;
+    readonly datumIndex: number;
+    readonly datum: ChartDatum;
+}
+declare class RadialChart {
+    private readonly root;
+    readonly data: _angular_core.InputSignal<readonly Readonly<Record<string, unknown>>[]>;
+    readonly nameKey: _angular_core.InputSignal<string>;
+    readonly valueKey: _angular_core.InputSignal<string>;
+    readonly seriesKeys: _angular_core.InputSignal<readonly string[] | undefined>;
+    readonly margin: _angular_core.InputSignal<ChartMargin>;
+    readonly trackPadding: _angular_core.InputSignal<number>;
+    readonly cornerRadius: _angular_core.InputSignal<number>;
+    readonly startAngle: _angular_core.InputSignal<number>;
+    readonly endAngle: _angular_core.InputSignal<number>;
+    readonly maxValue: _angular_core.InputSignal<number | undefined>;
+    readonly showTrack: _angular_core.InputSignal<boolean>;
+    readonly showValueLabels: _angular_core.InputSignal<boolean>;
+    readonly valueLabelFormat: _angular_core.InputSignal<RadialValueLabelFormatter>;
+    readonly barClick: _angular_core.OutputEmitterRef<RadialBarClickEvent>;
+    protected readonly innerWidth: _angular_core.Signal<number>;
+    protected readonly innerHeight: _angular_core.Signal<number>;
+    protected readonly layout: _angular_core.Signal<_ojiepermana_angular_chart.RadialLayout>;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly innerTransform: _angular_core.Signal<string>;
+    protected readonly ariaSummary: _angular_core.Signal<string>;
+    protected barAriaLabel(b: RadialBarRect): string;
+    protected formatValueLabel(b: RadialBarRect): string;
+    protected barLabelX(b: RadialBarRect): number;
+    protected barLabelY(b: RadialBarRect): number;
+    protected barLabelAnchor(b: RadialBarRect): 'start' | 'end';
+    protected emitClick(b: RadialBarRect): void;
+    protected setActive(event: PointerEvent | FocusEvent, b: RadialBarRect): void;
+    protected clearActive(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RadialChart, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<RadialChart, "ui-radial-chart", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "nameKey": { "alias": "nameKey"; "required": true; "isSignal": true; }; "valueKey": { "alias": "valueKey"; "required": true; "isSignal": true; }; "seriesKeys": { "alias": "seriesKeys"; "required": false; "isSignal": true; }; "margin": { "alias": "margin"; "required": false; "isSignal": true; }; "trackPadding": { "alias": "trackPadding"; "required": false; "isSignal": true; }; "cornerRadius": { "alias": "cornerRadius"; "required": false; "isSignal": true; }; "startAngle": { "alias": "startAngle"; "required": false; "isSignal": true; }; "endAngle": { "alias": "endAngle"; "required": false; "isSignal": true; }; "maxValue": { "alias": "maxValue"; "required": false; "isSignal": true; }; "showTrack": { "alias": "showTrack"; "required": false; "isSignal": true; }; "showValueLabels": { "alias": "showValueLabels"; "required": false; "isSignal": true; }; "valueLabelFormat": { "alias": "valueLabelFormat"; "required": false; "isSignal": true; }; }, { "barClick": "barClick"; }, never, ["ui-radial-center", "ui-chart-tooltip", "ui-chart-legend"], true, never>;
+}
+
+interface ScatterLayoutInput {
+    readonly data: readonly ChartDatum[];
+    readonly xKey: string;
+    readonly yKey: string;
+    readonly sizeKey?: string;
+    readonly seriesKey?: string;
+    readonly seriesKeys: readonly string[];
+    readonly innerWidth: number;
+    readonly innerHeight: number;
+    readonly minPointRadius: number;
+    readonly maxPointRadius: number;
+    readonly xDomain?: readonly [number, number];
+    readonly yDomain?: readonly [number, number];
+}
+interface ScatterPoint {
+    readonly seriesKey: string;
+    readonly color: string;
+    readonly x: number;
+    readonly y: number;
+    readonly radius: number;
+    readonly datumIndex: number;
+    readonly rawX: number;
+    readonly rawY: number;
+    readonly rawSize: number;
+}
+interface ScatterLayout {
+    readonly points: readonly ScatterPoint[];
+    readonly xScale: ScaleLinear<number, number>;
+    readonly yScale: ScaleLinear<number, number>;
+    readonly xDomain: NumericDomain;
+    readonly yDomain: NumericDomain;
+}
+declare function resolveScatterDomains(input: Pick<ScatterLayoutInput, 'data' | 'xKey' | 'yKey' | 'xDomain' | 'yDomain'>): {
+    xDomain: NumericDomain;
+    yDomain: NumericDomain;
+};
+declare function computeScatterLayout(input: ScatterLayoutInput): ScatterLayout;
+
+interface ScatterPointClickEvent {
+    readonly seriesKey: string;
+    readonly datumIndex: number;
+    readonly x: number;
+    readonly y: number;
+    readonly datum: ChartDatum;
+}
+/**
+ * Scatter chart — one dot per datum. Both axes are linear; color can
+ * come from a fixed series key or per-row via `seriesKey` field. Point
+ * radius optionally scales with `sizeKey`.
+ */
+declare class ScatterChart {
+    private readonly root;
+    private readonly viewport;
+    readonly data: _angular_core.InputSignal<readonly Readonly<Record<string, unknown>>[]>;
+    readonly xKey: _angular_core.InputSignal<string>;
+    readonly yKey: _angular_core.InputSignal<string>;
+    /** Optional numeric field to drive point radius. */
+    readonly sizeKey: _angular_core.InputSignal<string | undefined>;
+    /** Optional field on each datum used as color key. */
+    readonly seriesKey: _angular_core.InputSignal<string | undefined>;
+    readonly margin: _angular_core.InputSignal<ChartMargin>;
+    readonly minPointRadius: _angular_core.InputSignal<number>;
+    readonly maxPointRadius: _angular_core.InputSignal<number>;
+    readonly xDomain: _angular_core.InputSignal<readonly [number, number] | undefined>;
+    readonly yDomain: _angular_core.InputSignal<readonly [number, number] | undefined>;
+    readonly pointClick: _angular_core.OutputEmitterRef<ScatterPointClickEvent>;
+    protected readonly innerWidth: _angular_core.Signal<number>;
+    protected readonly innerHeight: _angular_core.Signal<number>;
+    protected readonly resolvedDomains: _angular_core.Signal<{
+        xDomain: _ojiepermana_angular_chart.NumericDomain;
+        yDomain: _ojiepermana_angular_chart.NumericDomain;
+    }>;
+    protected readonly currentXDomain: _angular_core.Signal<_ojiepermana_angular_chart.NumericDomain>;
+    protected readonly currentYDomain: _angular_core.Signal<_ojiepermana_angular_chart.NumericDomain>;
+    protected readonly layout: _angular_core.Signal<_ojiepermana_angular_chart.ScatterLayout>;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly innerTransform: _angular_core.Signal<string>;
+    protected readonly clipPathId: _angular_core.Signal<string>;
+    protected readonly ariaSummary: _angular_core.Signal<string>;
+    constructor();
+    protected pointAriaLabel(p: ScatterPoint): string;
+    protected emitClick(p: ScatterPoint): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ScatterChart, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ScatterChart, "ui-scatter-chart", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "xKey": { "alias": "xKey"; "required": true; "isSignal": true; }; "yKey": { "alias": "yKey"; "required": true; "isSignal": true; }; "sizeKey": { "alias": "sizeKey"; "required": false; "isSignal": true; }; "seriesKey": { "alias": "seriesKey"; "required": false; "isSignal": true; }; "margin": { "alias": "margin"; "required": false; "isSignal": true; }; "minPointRadius": { "alias": "minPointRadius"; "required": false; "isSignal": true; }; "maxPointRadius": { "alias": "maxPointRadius"; "required": false; "isSignal": true; }; "xDomain": { "alias": "xDomain"; "required": false; "isSignal": true; }; "yDomain": { "alias": "yDomain"; "required": false; "isSignal": true; }; }, { "pointClick": "pointClick"; }, never, ["svg:g[ui-chart-brush]", "ui-chart-legend", "ui-chart-zoom-controls"], true, never>;
+}
+
+export { AreaChart, BarChart, CHART_DATA_ATTRIBUTE, CHART_THEMES, CartesianContext, ChartAxisX, ChartAxisY, ChartBrush, ChartContainer, ChartContext, ChartCrosshair, ChartGrid, ChartLegend, ChartPointerTracker, ChartStyle, ChartTooltip, ChartZoomControls, LineChart, PieCenter, PieChart, RadarChart, RadialCenter, RadialChart, ScatterChart, bandTicks, buildCartesianScales, buildChartCss, cloneLinear, computeAreaLayout, computeBarLayout, computeLineLayout, computePieLayout, computeRadarLayout, computeRadialLayout, computeScatterLayout, effectiveIndexRange, indexRangeSize, linearTicks, normalizeIndexRange, normalizeNumericDomain, panIndexRange, panNumericDomain, pointToBandAdapter, provideCartesianFromLineLayout, resolveScatterDomains, seriesColorVar, sliceByIndexRange, xScale, yScale, zoomIndexRange, zoomNumericDomain };
+export type { AreaLayoutInput, AreaLayoutResult, AreaPointClickEvent, BarClickEvent, BarLayoutInput, BarLayoutResult, BarRect, BarVariant, CartesianBase, CategoryScale, ChartActivePoint, ChartConfig, ChartDatum, ChartDimensions, ChartIndexRange, ChartMargin, ChartOrientation, ChartSeriesConfig, ChartThemeKey, ChartTick, ChartTooltipIndicator, ChartTooltipLabelFormatter, ChartTooltipPayload, ChartTooltipRow, ChartTooltipValueFormatter, LineCurve, LineLayoutResult, LinePoint, LinePointClickEvent, LineSeriesPath, NumericDomain, PieLayout, PieLayoutInput, PieSliceClickEvent, PieSliceRect, RadarAxisInfo, RadarCurve, RadarGrid, RadarLayout, RadarLayoutInput, RadarLevel, RadarSeries, RadialBarClickEvent, RadialBarRect, RadialLayout, RadialLayoutInput, RadialValueLabelFormatter, ScatterLayout, ScatterLayoutInput, ScatterPoint, ScatterPointClickEvent, ValueScale };