@xiriframework/xiri-ng 0.2.24 → 0.2.26

package/types/xiriframework-xiri-ng.d.ts

@@ -258,9 +258,11 @@ interface XiriRawTableSettings {
     fields?: XiriTableField[];
     dense?: number;
     forceMinWidth?: boolean;
+    showHeader?: boolean;
 }
 declare class XiriRawTableComponent {
     settings: _angular_core.InputSignal<XiriRawTableSettings>;
+    showHeader: _angular_core.Signal<boolean>;
     displayedColumns: any[];
     columnsToDisplay: string[];
     dataSource: MatTableDataSource<any>;
@@ -340,7 +342,7 @@ declare class XiriButtonlineComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<XiriButtonlineComponent, "xiri-buttonline", never, { "settings": { "alias": "settings"; "required": true; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "filterData": { "alias": "filterData"; "required": false; "isSignal": true; }; }, { "result": "result"; }, never, never, true, never>;
 }
 
-type XiriDynDataType = 'card' | 'buttonline' | 'table' | 'cardlink' | 'links' | 'form' | 'query' | 'stepper' | 'header' | 'list' | 'spacer' | 'container' | 'infopoint' | 'multiprogress' | 'imagetext' | 'tabs' | 'expansion' | 'infotext' | 'html' | 'stat' | 'empty-state' | 'timeline' | 'page-header' | 'section' | 'divider' | 'stat-grid' | 'toolbar' | 'description-list' | 'barchart';
+type XiriDynDataType = 'card' | 'buttonline' | 'table' | 'cardlink' | 'links' | 'form' | 'query' | 'stepper' | 'header' | 'list' | 'spacer' | 'container' | 'infopoint' | 'multiprogress' | 'imagetext' | 'tabs' | 'expansion' | 'infotext' | 'html' | 'stat' | 'empty-state' | 'timeline' | 'page-header' | 'section' | 'divider' | 'stat-grid' | 'toolbar' | 'description-list' | 'barchart' | 'linechart' | 'piechart' | 'gaugechart' | 'heatmap' | 'calendar' | 'tree' | 'sankey' | 'gantt';
 interface XiriDynData {
     id?: number;
     type: XiriDynDataType | (string & {});
@@ -619,6 +621,7 @@ interface XiriCardSettings {
     reload?: boolean;
     data?: any;
     fields?: XiriTableField[];
+    components?: XiriDynData[];
     header?: string;
     headerSub?: string;
     headerIcon?: string;
@@ -627,9 +630,11 @@ interface XiriCardSettings {
     buttonsBottom?: XiriButtonlineSettings;
     dense?: number;
     forceMinWidth?: boolean;
+    showHeader?: boolean;
     collapsible?: boolean;
     collapsed?: boolean;
     maxHeight?: string;
+    padding?: string;
 }
 declare class XiriCardComponent {
     private dataService;
@@ -640,6 +645,9 @@ declare class XiriCardComponent {
     isCollapsed: _angular_core.WritableSignal<boolean>;
     private _data;
     cardData: Signal<any>;
+    hasComponents: Signal<boolean>;
+    /** Resolves padding setting (token or free CSS value) into a CSS length string. */
+    componentsPadding: Signal<string>;
     rawTable: Signal<XiriRawTableSettings | null>;
     constructor();
     toggleCollapse(): void;
@@ -672,9 +680,11 @@ interface XiriCardlinkSettings {
     iconSet: string;
     text?: string;
     sub?: string;
+    compact?: boolean;
 }
 declare class XiriCardlinkComponent {
     settings: _angular_core.InputSignal<XiriCardlinkSettings>;
+    compact: _angular_core.Signal<boolean>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<XiriCardlinkComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<XiriCardlinkComponent, "xiri-cardlink", never, { "settings": { "alias": "settings"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
 }
@@ -685,9 +695,11 @@ interface XiriLinksSettings {
     headerIconColor?: XiriColor;
     headerSub?: string;
     header?: string;
+    compact?: boolean;
 }
 declare class XiriLinksComponent implements OnDestroy {
     settings: _angular_core.InputSignal<XiriLinksSettings>;
+    compact: _angular_core.Signal<boolean>;
     private dialog;
     private router;
     private dialogRef?;
@@ -826,9 +838,11 @@ interface XiriInfopointSettings {
     iconSet?: string;
     iconColor: XiriColor;
     dense?: boolean;
+    compact?: boolean;
 }
 declare class XiriInfopointComponent {
     settings: _angular_core.InputSignal<XiriInfopointSettings>;
+    compact: _angular_core.Signal<boolean>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<XiriInfopointComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<XiriInfopointComponent, "xiri-infopoint", never, { "settings": { "alias": "settings"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
 }
@@ -839,6 +853,7 @@ interface XiriMultiprogressSettings {
     headerIconColor?: XiriColor;
     header?: string;
     show?: number;
+    compact?: boolean;
 }
 interface XiriMultiprogressItem {
     text: string;
@@ -849,6 +864,7 @@ interface XiriMultiprogressItem {
 declare class XiriMultiprogressComponent {
     isOpen: _angular_core.WritableSignal<boolean>;
     settings: _angular_core.InputSignal<XiriMultiprogressSettings>;
+    compact: _angular_core.Signal<boolean>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<XiriMultiprogressComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<XiriMultiprogressComponent, "xiri-multiprogress", never, { "settings": { "alias": "settings"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
 }
@@ -860,10 +876,12 @@ interface XiriImagetextSettings {
     headerIconColor?: XiriColor;
     headerSub?: string;
     header?: string;
+    compact?: boolean;
 }
 declare class XiriImagetextComponent {
     settings: _angular_core.InputSignal<XiriImagetextSettings>;
     loading: _angular_core.WritableSignal<boolean>;
+    compact: _angular_core.Signal<boolean>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<XiriImagetextComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<XiriImagetextComponent, "xiri-imagetext", never, { "settings": { "alias": "settings"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
 }
@@ -1038,9 +1056,11 @@ interface XiriStatSettings {
     prefix?: string;
     suffix?: string;
     color?: XiriColor;
+    compact?: boolean;
 }
 declare class XiriStatComponent {
     settings: _angular_core.InputSignal<XiriStatSettings>;
+    compact: _angular_core.Signal<boolean>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<XiriStatComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<XiriStatComponent, "xiri-stat", never, { "settings": { "alias": "settings"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
 }
@@ -1086,11 +1106,656 @@ interface XiriBarChartSettings {
     color?: XiriColor;
     bars?: XiriBarChartBar[];
     points?: XiriBarChartPoint[];
+    compact?: boolean;
 }
-declare class XiriBarChartComponent implements AfterViewInit, OnDestroy {
+declare class XiriBarChartComponent {
     mode: _angular_core.InputSignal<string>;
     settings: _angular_core.InputSignal<XiriBarChartSettings>;
-    chartHost: _angular_core.Signal<ElementRef<HTMLDivElement>>;
+    compact: _angular_core.Signal<boolean>;
+    option: _angular_core.Signal<{
+        grid: {
+            left: number;
+            right: number;
+            top: number;
+            bottom: number;
+            containLabel: boolean;
+        };
+        tooltip: {
+            trigger: string;
+            formatter: (params: any) => string;
+        };
+        xAxis: {
+            type: string;
+            data: string[];
+            axisLine: {
+                show: boolean;
+            };
+            axisTick: {
+                show: boolean;
+            };
+        };
+        yAxis: {
+            type: string;
+            min: number;
+            max: number;
+            splitLine: {
+                lineStyle: {
+                    color: string;
+                };
+            };
+        };
+        series: any[];
+    } | {
+        grid: {
+            left: number;
+            right: number;
+            top: number;
+            bottom: number;
+            containLabel: boolean;
+        };
+        tooltip: {
+            trigger: string;
+            formatter: (params: any) => string;
+        };
+        xAxis: {
+            type: string;
+            axisLine: {
+                show: boolean;
+            };
+            axisTick: {
+                show: boolean;
+            };
+            splitLine: {
+                show: boolean;
+            };
+        };
+        yAxis: {
+            type: string;
+            min: number;
+            max: number;
+            show: boolean;
+        };
+        series: {
+            type: string;
+            barMinWidth: number;
+            barMaxWidth: number;
+            data: number[][];
+            itemStyle: {
+                color: string;
+            };
+        }[];
+    }>;
+    private baseGrid;
+    private simpleOption;
+    private stackedOption;
+    private heatmapOption;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<XiriBarChartComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<XiriBarChartComponent, "xiri-barchart", never, { "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "settings": { "alias": "settings"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface XiriLineChartLine {
+    name: string;
+    values: number[];
+    color?: XiriColor;
+    dashed?: boolean;
+    area?: boolean;
+}
+interface XiriLineChartSettings {
+    title?: string;
+    xLabels: string[];
+    lines: XiriLineChartLine[];
+    yMin?: number;
+    yMax?: number;
+    smooth?: boolean;
+    compact?: boolean;
+}
+declare class XiriLineChartComponent {
+    settings: _angular_core.InputSignal<XiriLineChartSettings>;
+    compact: _angular_core.Signal<boolean>;
+    option: _angular_core.Signal<{
+        grid: {
+            left: number;
+            right: number;
+            top: number;
+            bottom: number;
+            containLabel: boolean;
+        };
+        tooltip: {
+            trigger: string;
+            formatter: (params: any) => string;
+        };
+        legend: {
+            top: number;
+            right: number;
+            type: string;
+        };
+        xAxis: {
+            type: string;
+            data: string[];
+            boundaryGap: boolean;
+            axisLine: {
+                show: boolean;
+            };
+            axisTick: {
+                show: boolean;
+            };
+        };
+        yAxis: {
+            type: string;
+            min: number;
+            max: number;
+            splitLine: {
+                lineStyle: {
+                    color: string;
+                };
+            };
+        };
+        series: {
+            type: string;
+            name: string;
+            smooth: boolean;
+            symbol: string;
+            symbolSize: number;
+            lineStyle: {
+                width: number;
+                type: string;
+                color: string;
+            };
+            itemStyle: {
+                color: string;
+            };
+            areaStyle: {
+                color: string;
+                opacity: number;
+            };
+            data: number[];
+        }[];
+    }>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<XiriLineChartComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<XiriLineChartComponent, "xiri-linechart", never, { "settings": { "alias": "settings"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface XiriPieChartSlice {
+    name: string;
+    value: number;
+    color?: XiriColor;
+}
+interface XiriPieChartSettings {
+    title?: string;
+    slices: XiriPieChartSlice[];
+    donut?: boolean;
+    nightingale?: boolean;
+    nightingaleType?: 'radius' | 'area';
+    compact?: boolean;
+}
+declare class XiriPieChartComponent {
+    settings: _angular_core.InputSignal<XiriPieChartSettings>;
+    compact: _angular_core.Signal<boolean>;
+    option: _angular_core.Signal<{
+        tooltip: {
+            trigger: string;
+            formatter: (p: any) => string;
+        };
+        legend: {
+            bottom: number;
+            type: string;
+        };
+        series: any[];
+    }>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<XiriPieChartComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<XiriPieChartComponent, "xiri-piechart", never, { "settings": { "alias": "settings"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface XiriGaugeChartSettings {
+    title?: string;
+    value: number;
+    min?: number;
+    max?: number;
+    color?: XiriColor;
+    label?: string;
+    compact?: boolean;
+}
+declare class XiriGaugeChartComponent {
+    settings: _angular_core.InputSignal<XiriGaugeChartSettings>;
+    compact: _angular_core.Signal<boolean>;
+    option: _angular_core.Signal<{
+        series: {
+            type: string;
+            min: number;
+            max: number;
+            center: string[];
+            radius: string;
+            progress: {
+                show: boolean;
+                width: number;
+                itemStyle: {
+                    color: string;
+                };
+            };
+            axisLine: {
+                lineStyle: {
+                    width: number;
+                    color: (string | number)[][];
+                };
+            };
+            pointer: {
+                show: boolean;
+            };
+            axisTick: {
+                show: boolean;
+            };
+            splitLine: {
+                show: boolean;
+            };
+            axisLabel: {
+                show: boolean;
+                distance: number;
+                fontSize: number;
+            };
+            anchor: {
+                show: boolean;
+            };
+            title: {
+                show: boolean;
+            };
+            detail: {
+                valueAnimation: boolean;
+                offsetCenter: (string | number)[];
+                fontSize: number;
+                fontWeight: string;
+                formatter: string;
+                rich: {
+                    label: {
+                        fontSize: number;
+                        fontWeight: string;
+                        color: string;
+                    };
+                };
+                color: string;
+            };
+            data: {
+                value: number;
+            }[];
+        }[];
+    }>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<XiriGaugeChartComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<XiriGaugeChartComponent, "xiri-gaugechart", never, { "settings": { "alias": "settings"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface XiriHeatmapCell {
+    x: number;
+    y: number;
+    value: number;
+    label?: string;
+}
+interface XiriHeatmapSettings {
+    title?: string;
+    xLabels: string[];
+    yLabels: string[];
+    cells: XiriHeatmapCell[];
+    min?: number;
+    max?: number;
+    colorRange?: [string, string];
+    showValues?: boolean;
+    compact?: boolean;
+}
+declare class XiriHeatmapComponent {
+    settings: _angular_core.InputSignal<XiriHeatmapSettings>;
+    compact: _angular_core.Signal<boolean>;
+    height: _angular_core.Signal<string>;
+    option: _angular_core.Signal<{
+        grid: {
+            left: number;
+            right: number;
+            top: number;
+            bottom: number;
+            containLabel: boolean;
+        };
+        tooltip: {
+            position: string;
+            formatter: (p: any) => string;
+        };
+        xAxis: {
+            type: string;
+            data: string[];
+            splitArea: {
+                show: boolean;
+            };
+            axisLine: {
+                show: boolean;
+            };
+            axisTick: {
+                show: boolean;
+            };
+        };
+        yAxis: {
+            type: string;
+            data: string[];
+            splitArea: {
+                show: boolean;
+            };
+            axisLine: {
+                show: boolean;
+            };
+            axisTick: {
+                show: boolean;
+            };
+        };
+        visualMap: {
+            min: number;
+            max: number;
+            calculable: boolean;
+            orient: string;
+            left: string;
+            bottom: number;
+            inRange: {
+                color: string[];
+            };
+            show: boolean;
+        };
+        series: {
+            type: string;
+            data: number[][];
+            label: {
+                show: boolean;
+                formatter: (p: any) => string;
+            };
+            emphasis: {
+                itemStyle: {
+                    shadowBlur: number;
+                    shadowColor: string;
+                };
+            };
+        }[];
+    }>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<XiriHeatmapComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<XiriHeatmapComponent, "xiri-heatmap", never, { "settings": { "alias": "settings"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface XiriCalendarCell {
+    date: string;
+    value: number;
+}
+interface XiriCalendarSettings {
+    title?: string;
+    range: string | [string, string];
+    cells: XiriCalendarCell[];
+    min?: number;
+    max?: number;
+    colorRange?: [string, string];
+    cellSize?: number;
+    compact?: boolean;
+}
+declare class XiriCalendarComponent {
+    settings: _angular_core.InputSignal<XiriCalendarSettings>;
+    compact: _angular_core.Signal<boolean>;
+    private cellSize;
+    height: _angular_core.Signal<string>;
+    option: _angular_core.Signal<{
+        tooltip: {
+            formatter: (p: any) => string;
+        };
+        visualMap: {
+            min: number;
+            max: number;
+            orient: string;
+            left: string;
+            bottom: number;
+            show: boolean;
+            inRange: {
+                color: string[];
+            };
+        };
+        calendar: {
+            range: string | [string, string];
+            cellSize: number[];
+            splitLine: {
+                show: boolean;
+            };
+            itemStyle: {
+                borderColor: string;
+                borderWidth: number;
+            };
+            yearLabel: {
+                show: boolean;
+            };
+            dayLabel: {
+                fontSize: number;
+            };
+            monthLabel: {
+                fontSize: number;
+            };
+            top: number;
+            left: number;
+            right: number;
+        };
+        series: {
+            type: string;
+            coordinateSystem: string;
+            data: (string | number)[][];
+        }[];
+    }>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<XiriCalendarComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<XiriCalendarComponent, "xiri-calendar", never, { "settings": { "alias": "settings"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface XiriTreeNode {
+    name: string;
+    value?: number;
+    children?: XiriTreeNode[];
+    collapsed?: boolean;
+}
+interface XiriTreeSettings {
+    title?: string;
+    root: XiriTreeNode;
+    orient?: 'LR' | 'RL' | 'TB' | 'BT';
+    layout?: 'orthogonal' | 'radial';
+    compact?: boolean;
+}
+declare class XiriTreeComponent {
+    settings: _angular_core.InputSignal<XiriTreeSettings>;
+    compact: _angular_core.Signal<boolean>;
+    height: _angular_core.Signal<string>;
+    option: _angular_core.Signal<{
+        tooltip: {
+            trigger: string;
+            triggerOn: string;
+            formatter: (p: any) => string;
+        };
+        series: {
+            type: string;
+            data: XiriTreeNode[];
+            top: number;
+            bottom: number;
+            left: string | number;
+            right: string | number;
+            layout: "orthogonal" | "radial";
+            orient: "LR" | "RL" | "TB" | "BT";
+            symbol: string;
+            symbolSize: number;
+            initialTreeDepth: number;
+            label: {
+                position: string;
+                align: string;
+                verticalAlign: string;
+                fontSize: number;
+                overflow: string;
+            };
+            leaves: {
+                label: {
+                    position: string;
+                    align: string;
+                    overflow: string;
+                };
+            };
+            expandAndCollapse: boolean;
+            animationDuration: number;
+            animationDurationUpdate: number;
+        }[];
+    }>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<XiriTreeComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<XiriTreeComponent, "xiri-tree", never, { "settings": { "alias": "settings"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface XiriSankeyNode {
+    name: string;
+    color?: XiriColor;
+}
+interface XiriSankeyLink {
+    source: string;
+    target: string;
+    value: number;
+}
+interface XiriSankeySettings {
+    title?: string;
+    nodes: XiriSankeyNode[];
+    links: XiriSankeyLink[];
+    orient?: 'horizontal' | 'vertical';
+    compact?: boolean;
+}
+declare class XiriSankeyComponent {
+    settings: _angular_core.InputSignal<XiriSankeySettings>;
+    compact: _angular_core.Signal<boolean>;
+    height: _angular_core.Signal<string>;
+    option: _angular_core.Signal<{
+        tooltip: {
+            trigger: string;
+            triggerOn: string;
+        };
+        series: {
+            type: string;
+            orient: "horizontal" | "vertical";
+            top: number;
+            bottom: number;
+            left: number;
+            right: number;
+            emphasis: {
+                focus: string;
+            };
+            lineStyle: {
+                color: string;
+                curveness: number;
+            };
+            label: {
+                fontSize: number;
+            };
+            data: {
+                name: string;
+                itemStyle: {
+                    color: string;
+                };
+            }[];
+            links: XiriSankeyLink[];
+        }[];
+    }>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<XiriSankeyComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<XiriSankeyComponent, "xiri-sankey", never, { "settings": { "alias": "settings"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface XiriGanttTask {
+    row: number;
+    name: string;
+    start: number;
+    end: number;
+    color?: XiriColor;
+}
+interface XiriGanttSettings {
+    title?: string;
+    rows: string[];
+    tasks: XiriGanttTask[];
+    rangeStart?: number;
+    rangeEnd?: number;
+    compact?: boolean;
+}
+declare class XiriGanttComponent {
+    settings: _angular_core.InputSignal<XiriGanttSettings>;
+    compact: _angular_core.Signal<boolean>;
+    height: _angular_core.Signal<string>;
+    option: _angular_core.Signal<{
+        tooltip: {
+            formatter: (p: any) => string;
+        };
+        grid: {
+            left: number;
+            right: number;
+            top: number;
+            bottom: number;
+            containLabel: boolean;
+        };
+        xAxis: {
+            type: string;
+            min: number;
+            max: number;
+            splitLine: {
+                lineStyle: {
+                    color: string;
+                };
+            };
+        };
+        yAxis: {
+            type: string;
+            data: string[];
+            inverse: boolean;
+            splitLine: {
+                show: boolean;
+            };
+            axisLine: {
+                show: boolean;
+            };
+            axisTick: {
+                show: boolean;
+            };
+        };
+        series: {
+            type: string;
+            encode: {
+                x: number[];
+                y: number;
+            };
+            clip: boolean;
+            renderItem: (_params: any, api: any) => {
+                type: string;
+                transition: string[];
+                shape: {
+                    x: any;
+                    y: number;
+                    width: number;
+                    height: number;
+                    r: number;
+                };
+                style: {
+                    fill: any;
+                };
+            };
+            data: (string | number)[][];
+        }[];
+    }>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<XiriGanttComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<XiriGanttComponent, "xiri-gantt", never, { "settings": { "alias": "settings"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * `xiri-echarts-host` — shared echarts plumbing for all chart components.
+ *
+ * Handles lazy `import('echarts')`, init / setOption / dispose, ResizeObserver,
+ * the optional mat-card surface (with header + compact mode), and a flat
+ * variant when nested inside another card.
+ *
+ * Specialized chart components (`xiri-barchart`, `xiri-linechart`, …) build
+ * a typed echarts option from their settings and feed it via the `option`
+ * input. Each re-emit of `option` re-renders the chart with `setOption(option, true)`.
+ *
+ * Compact-Mode strips the outer mat-card so the chart sits flat inside an
+ * outer xiri-card without card-in-card visuals.
+ */
+declare class XiriEchartsHostComponent implements AfterViewInit, OnDestroy {
+    option: _angular_core.InputSignal<any>;
+    compact: _angular_core.InputSignal<boolean>;
+    title: _angular_core.InputSignal<string>;
+    headerIcon: _angular_core.InputSignal<string>;
+    headerIconColor: _angular_core.InputSignal<XiriColor>;
+    chartHeight: _angular_core.InputSignal<string>;
+    chartHostRef: _angular_core.Signal<ElementRef<HTMLDivElement>>;
     private zone;
     private destroyRef;
     private chart;
@@ -1098,19 +1763,32 @@ declare class XiriBarChartComponent implements AfterViewInit, OnDestroy {
     private resizeObserver;
     private loadError;
     readonly error: _angular_core.Signal<string>;
+    readonly hasHeader: _angular_core.Signal<boolean>;
     constructor();
     ngAfterViewInit(): Promise<void>;
     ngOnDestroy(): void;
     private dispose;
     private render;
-    private baseGrid;
-    private simpleOption;
-    private stackedOption;
-    private heatmapOption;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<XiriBarChartComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<XiriBarChartComponent, "xiri-barchart", never, { "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "settings": { "alias": "settings"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<XiriEchartsHostComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<XiriEchartsHostComponent, "xiri-echarts-host", never, { "option": { "alias": "option"; "required": true; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "headerIcon": { "alias": "headerIcon"; "required": false; "isSignal": true; }; "headerIconColor": { "alias": "headerIconColor"; "required": false; "isSignal": true; }; "chartHeight": { "alias": "chartHeight"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
+/**
+ * Maps semantic XiriColor names to concrete CSS color values.
+ *
+ * Theme tokens use Material 3 system variables; extended tokens use
+ * fixed brand colors that work both in light and dark themes.
+ */
+declare const COLOR_CSS_VAR: Record<string, string>;
+/**
+ * Resolves a XiriColor token (or a freeform CSS color) to a CSS-color string
+ * usable in echarts options. Unknown tokens fall back to the given fallback.
+ */
+declare function resolveColor(color: XiriColor | string | undefined, fallback?: string): string;
+
+/** Escapes characters that would otherwise be interpreted as HTML in echarts tooltip strings. */
+declare function escapeHtml(s: string): string;
+
 interface XiriPageHeaderSettings {
     title: string;
     subtitle?: string;
@@ -1382,6 +2060,6 @@ declare class XiriDownloadService {
 
 declare function provideXiriServices(config: Partial<XiriDataServiceConfig>): EnvironmentProviders;
 
-export { DEFAULT_COMPARE, DEFAULT_PREDICATE, SafehtmlPipe, ThemeService, XiriAlertComponent, XiriBarChartComponent, XiriBreadcrumbComponent, XiriButtonComponent, XiriButtonlineComponent, XiriButtonstyleComponent, XiriCardComponent, XiriCardlinkComponent, XiriDataService, XiriDataServiceConfig, XiriDateService, XiriDescriptionListComponent, XiriDialogComponent, XiriDividerComponent, XiriDoneComponent, XiriDownloadService, XiriDynComponentComponent, XiriEmptyStateComponent, XiriErrorComponent, XiriExpansionComponent, XiriFormComponent, XiriFormFieldsComponent, XiriFormService, XiriHeaderComponent, XiriImagetextComponent, XiriInfopointComponent, XiriLinksComponent, XiriListComponent, XiriLocalStorageService, XiriMultiprogressComponent, XiriNumberService, XiriPageHeaderComponent, XiriQueryComponent, XiriRawTableComponent, XiriResponseHandlerService, XiriSearchComponent, XiriSectionComponent, XiriSelectDirective, XiriSessionStorageService, XiriSidenavComponent, XiriSkeletonComponent, XiriSnackbarService, XiriStatComponent, XiriStatGridComponent, XiriStepperComponent, XiriTableComponent, XiriTabsComponent, XiriTimelineComponent, XiriToolbarComponent, defaultXiriDataServiceConfig, provideXiriServices };
-export type { ThemeMode, XiriAlertConfig, XiriBarChartBar, XiriBarChartMode, XiriBarChartPoint, XiriBarChartSegment, XiriBarChartSettings, XiriBreadcrumbItem, XiriButton, XiriButtonResult, XiriButtonlineSettings, XiriCardSettings, XiriCardlinkSettings, XiriColor, XiriDescriptionListItem, XiriDescriptionListSettings, XiriDialogSettings, XiriDividerSettings, XiriDynData, XiriDynDataType, XiriEmptyStateSettings, XiriExpansionPanelSettings, XiriExpansionSettings, XiriExtendedColor, XiriFormField, XiriFormFieldCondition, XiriFormFieldConditionOperator, XiriFormFieldDisplay, XiriFormFieldSelectOption, XiriFormServiceData, XiriFormServiceError, XiriFormSettings, XiriFormValidator, XiriHeaderSettings, XiriImagetextSettings, XiriInfopointSettings, XiriLinksSettings, XiriListItem, XiriListSection, XiriListSettings, XiriMultiprogressItem, XiriMultiprogressSettings, XiriNavigationField, XiriPageHeaderSettings, XiriQuerySettings, XiriRawTableSettings, XiriSectionSettings, XiriSelectCompare, XiriSelectPredicate, XiriSidebarSettings, XiriSkeletonType, XiriSnackbarType, XiriStatGridSettings, XiriStatSettings, XiriStatTrend, XiriStepperSettings, XiriStepperStep, XiriTabSettings, XiriTableEmptyState, XiriTableField, XiriTableOptions, XiriTableSettings, XiriTabsSettings, XiriTagChip, XiriThemeColor, XiriTimelineItem, XiriTimelineSettings, XiriToolbarSearchConfig, XiriToolbarSettings };
+export { COLOR_CSS_VAR, DEFAULT_COMPARE, DEFAULT_PREDICATE, SafehtmlPipe, ThemeService, XiriAlertComponent, XiriBarChartComponent, XiriBreadcrumbComponent, XiriButtonComponent, XiriButtonlineComponent, XiriButtonstyleComponent, XiriCalendarComponent, XiriCardComponent, XiriCardlinkComponent, XiriDataService, XiriDataServiceConfig, XiriDateService, XiriDescriptionListComponent, XiriDialogComponent, XiriDividerComponent, XiriDoneComponent, XiriDownloadService, XiriDynComponentComponent, XiriEchartsHostComponent, XiriEmptyStateComponent, XiriErrorComponent, XiriExpansionComponent, XiriFormComponent, XiriFormFieldsComponent, XiriFormService, XiriGanttComponent, XiriGaugeChartComponent, XiriHeaderComponent, XiriHeatmapComponent, XiriImagetextComponent, XiriInfopointComponent, XiriLineChartComponent, XiriLinksComponent, XiriListComponent, XiriLocalStorageService, XiriMultiprogressComponent, XiriNumberService, XiriPageHeaderComponent, XiriPieChartComponent, XiriQueryComponent, XiriRawTableComponent, XiriResponseHandlerService, XiriSankeyComponent, XiriSearchComponent, XiriSectionComponent, XiriSelectDirective, XiriSessionStorageService, XiriSidenavComponent, XiriSkeletonComponent, XiriSnackbarService, XiriStatComponent, XiriStatGridComponent, XiriStepperComponent, XiriTableComponent, XiriTabsComponent, XiriTimelineComponent, XiriToolbarComponent, XiriTreeComponent, defaultXiriDataServiceConfig, escapeHtml, provideXiriServices, resolveColor };
+export type { ThemeMode, XiriAlertConfig, XiriBarChartBar, XiriBarChartMode, XiriBarChartPoint, XiriBarChartSegment, XiriBarChartSettings, XiriBreadcrumbItem, XiriButton, XiriButtonResult, XiriButtonlineSettings, XiriCalendarCell, XiriCalendarSettings, XiriCardSettings, XiriCardlinkSettings, XiriColor, XiriDescriptionListItem, XiriDescriptionListSettings, XiriDialogSettings, XiriDividerSettings, XiriDynData, XiriDynDataType, XiriEmptyStateSettings, XiriExpansionPanelSettings, XiriExpansionSettings, XiriExtendedColor, XiriFormField, XiriFormFieldCondition, XiriFormFieldConditionOperator, XiriFormFieldDisplay, XiriFormFieldSelectOption, XiriFormServiceData, XiriFormServiceError, XiriFormSettings, XiriFormValidator, XiriGanttSettings, XiriGanttTask, XiriGaugeChartSettings, XiriHeaderSettings, XiriHeatmapCell, XiriHeatmapSettings, XiriImagetextSettings, XiriInfopointSettings, XiriLineChartLine, XiriLineChartSettings, XiriLinksSettings, XiriListItem, XiriListSection, XiriListSettings, XiriMultiprogressItem, XiriMultiprogressSettings, XiriNavigationField, XiriPageHeaderSettings, XiriPieChartSettings, XiriPieChartSlice, XiriQuerySettings, XiriRawTableSettings, XiriSankeyLink, XiriSankeyNode, XiriSankeySettings, XiriSectionSettings, XiriSelectCompare, XiriSelectPredicate, XiriSidebarSettings, XiriSkeletonType, XiriSnackbarType, XiriStatGridSettings, XiriStatSettings, XiriStatTrend, XiriStepperSettings, XiriStepperStep, XiriTabSettings, XiriTableEmptyState, XiriTableField, XiriTableOptions, XiriTableSettings, XiriTabsSettings, XiriTagChip, XiriThemeColor, XiriTimelineItem, XiriTimelineSettings, XiriToolbarSearchConfig, XiriToolbarSettings, XiriTreeNode, XiriTreeSettings };
 //# sourceMappingURL=xiriframework-xiri-ng.d.ts.map