@skdx/angular-charts 0.33.0 → 0.34.1

package/fesm2022/skdx-angular-charts-swarm.mjs

@@ -0,0 +1,101 @@
+import * as i0 from '@angular/core';
+import { input, computed, ChangeDetectionStrategy, Component } from '@angular/core';
+import { SkdxSizedBase, layoutSwarmPlot, SkdxChartRootComponent } from '@skdx/angular-charts/internal';
+
+/*
+ * Copyright (c) 2026 SkandaDX
+ * This file is part of the SkandaDX organization.
+ * Licensed under the MIT License. See LICENSE in the repository root.
+ */
+/** A beeswarm: every observation as a dot, spread sideways so none overlap. */
+class SkdxSwarmPlotComponent extends SkdxSizedBase {
+    constructor() {
+        super(...arguments);
+        /** One swarm per series, over its raw samples. */
+        this.series = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "series" }] : /* istanbul ignore next */ []));
+        this.orientation = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "orientation" }] : /* istanbul ignore next */ []));
+        /** Dot radius in pixels. */
+        this.markerSize = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "markerSize" }] : /* istanbul ignore next */ []));
+        this.yAxis = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "yAxis" }] : /* istanbul ignore next */ []));
+        this.references = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "references" }] : /* istanbul ignore next */ []));
+        this.layout = computed(() => layoutSwarmPlot({
+            ...this.sized(),
+            series: this.series(),
+            orientation: this.orientation(),
+            markerSize: this.markerSize(),
+            yAxis: this.yAxis(),
+            references: this.references(),
+        }), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "layout" }] : /* istanbul ignore next */ []));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxSwarmPlotComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: SkdxSwarmPlotComponent, isStandalone: true, selector: "skdx-swarm-plot", inputs: { series: { classPropertyName: "series", publicName: "series", isSignal: true, isRequired: true, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, markerSize: { classPropertyName: "markerSize", publicName: "markerSize", isSignal: true, isRequired: false, transformFunction: null }, yAxis: { classPropertyName: "yAxis", publicName: "yAxis", isSignal: true, isRequired: false, transformFunction: null }, references: { classPropertyName: "references", publicName: "references", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+    <skdx-chart-root
+      [layout]="layout()"
+      [options]="options()"
+      kind="swarm"
+      [label]="label() ?? 'Swarm plot'"
+      [zoomable]="zoomable()"
+      [selectionMode]="selectionMode()"
+      [editable]="editable()"
+      [syncId]="syncId()"
+      [crosshair]="syncedCrosshair()"
+      [responsive]="!!responsive()"
+      (itemClick)="itemClick.emit($event)"
+      (dataIssue)="dataIssue.emit($event)"
+      (taskChange)="taskChange.emit($event)"
+      (hiddenSeriesChange)="toggle($event)"
+      (zoomChange)="zoom.set($event)"
+      (viewChange)="view.set($event)"
+      (selectedChange)="selected.set($event)"
+      (highlightedChange)="highlighted.set($event)"
+      (syncChange)="sync($event)"
+      (measured)="measuredWidth.set($event)"
+    ></skdx-chart-root>
+  `, isInline: true, dependencies: [{ kind: "component", type: SkdxChartRootComponent, selector: "skdx-chart-root", inputs: ["layout", "options", "kind", "label", "zoomable", "selectionMode", "editable", "syncId", "crosshair", "responsive"], outputs: ["itemClick", "hiddenSeriesChange", "zoomChange", "viewChange", "selectedChange", "highlightedChange", "dataIssue", "taskChange", "syncChange", "measured"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxSwarmPlotComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'skdx-swarm-plot',
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [SkdxChartRootComponent],
+                    template: `
+    <skdx-chart-root
+      [layout]="layout()"
+      [options]="options()"
+      kind="swarm"
+      [label]="label() ?? 'Swarm plot'"
+      [zoomable]="zoomable()"
+      [selectionMode]="selectionMode()"
+      [editable]="editable()"
+      [syncId]="syncId()"
+      [crosshair]="syncedCrosshair()"
+      [responsive]="!!responsive()"
+      (itemClick)="itemClick.emit($event)"
+      (dataIssue)="dataIssue.emit($event)"
+      (taskChange)="taskChange.emit($event)"
+      (hiddenSeriesChange)="toggle($event)"
+      (zoomChange)="zoom.set($event)"
+      (viewChange)="view.set($event)"
+      (selectedChange)="selected.set($event)"
+      (highlightedChange)="highlighted.set($event)"
+      (syncChange)="sync($event)"
+      (measured)="measuredWidth.set($event)"
+    ></skdx-chart-root>
+  `,
+                }]
+        }], propDecorators: { series: [{ type: i0.Input, args: [{ isSignal: true, alias: "series", required: true }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], markerSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "markerSize", required: false }] }], yAxis: [{ type: i0.Input, args: [{ isSignal: true, alias: "yAxis", required: false }] }], references: [{ type: i0.Input, args: [{ isSignal: true, alias: "references", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SkdxSwarmPlotComponent };
+//# sourceMappingURL=skdx-angular-charts-swarm.mjs.map

package/fesm2022/skdx-angular-charts-swarm.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"skdx-angular-charts-swarm.mjs","sources":["../../src/swarm/index.ts","../../src/swarm/skdx-angular-charts-swarm.ts"],"sourcesContent":["/*\n * Copyright (c) 2026 SkandaDX\n * This file is part of the SkandaDX organization.\n * Licensed under the MIT License. See LICENSE in the repository root.\n */\n\nimport { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';\n\nimport {\n  layoutSwarmPlot,\n  SkdxChartRootComponent,\n  SkdxSizedBase,\n  type AxisOptions,\n  type Reference,\n  type Series,\n} from '@skdx/angular-charts/internal';\n\n/** A beeswarm: every observation as a dot, spread sideways so none overlap. */\n@Component({\n  selector: 'skdx-swarm-plot',\n  standalone: true,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [SkdxChartRootComponent],\n  template: `\n    <skdx-chart-root\n      [layout]=\"layout()\"\n      [options]=\"options()\"\n      kind=\"swarm\"\n      [label]=\"label() ?? 'Swarm plot'\"\n      [zoomable]=\"zoomable()\"\n      [selectionMode]=\"selectionMode()\"\n      [editable]=\"editable()\"\n      [syncId]=\"syncId()\"\n      [crosshair]=\"syncedCrosshair()\"\n      [responsive]=\"!!responsive()\"\n      (itemClick)=\"itemClick.emit($event)\"\n      (dataIssue)=\"dataIssue.emit($event)\"\n      (taskChange)=\"taskChange.emit($event)\"\n      (hiddenSeriesChange)=\"toggle($event)\"\n      (zoomChange)=\"zoom.set($event)\"\n      (viewChange)=\"view.set($event)\"\n      (selectedChange)=\"selected.set($event)\"\n      (highlightedChange)=\"highlighted.set($event)\"\n      (syncChange)=\"sync($event)\"\n      (measured)=\"measuredWidth.set($event)\"\n    ></skdx-chart-root>\n  `,\n})\nexport class SkdxSwarmPlotComponent extends SkdxSizedBase {\n  /** One swarm per series, over its raw samples. */\n  readonly series = input.required<Series[]>();\n  readonly orientation = input<'vertical' | 'horizontal'>();\n  /** Dot radius in pixels. */\n  readonly markerSize = input<number>();\n  readonly yAxis = input<AxisOptions>();\n  readonly references = input<Reference[]>();\n\n  protected readonly layout = computed(() =>\n    layoutSwarmPlot({\n      ...this.sized(),\n      series: this.series(),\n      orientation: this.orientation(),\n      markerSize: this.markerSize(),\n      yAxis: this.yAxis(),\n      references: this.references(),\n    }),\n  );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/skdx-angular-charts-timeline.mjs

@@ -0,0 +1,98 @@
+import * as i0 from '@angular/core';
+import { input, computed, ChangeDetectionStrategy, Component } from '@angular/core';
+import { SkdxSizedBase, layoutTimelineChart, SkdxChartRootComponent } from '@skdx/angular-charts/internal';
+
+/*
+ * Copyright (c) 2026 SkandaDX
+ * This file is part of the SkandaDX organization.
+ * Licensed under the MIT License. See LICENSE in the repository root.
+ */
+/** Point-in-time events on a time axis, in lanes with staggered labels, or as a vertical list. */
+class SkdxTimelineChartComponent extends SkdxSizedBase {
+    constructor() {
+        super(...arguments);
+        this.events = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "events" }] : /* istanbul ignore next */ []));
+        this.orientation = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "orientation" }] : /* istanbul ignore next */ []));
+        /** How dates are written. */
+        this.xAxis = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "xAxis" }] : /* istanbul ignore next */ []));
+        /** Write event labels. */
+        this.labels = input(true, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "labels" }] : /* istanbul ignore next */ []));
+        this.layout = computed(() => layoutTimelineChart({
+            ...this.sized(),
+            events: this.events(),
+            orientation: this.orientation(),
+            xAxis: this.xAxis(),
+            labels: this.labels(),
+        }), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "layout" }] : /* istanbul ignore next */ []));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxTimelineChartComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: SkdxTimelineChartComponent, isStandalone: true, selector: "skdx-timeline-chart", inputs: { events: { classPropertyName: "events", publicName: "events", isSignal: true, isRequired: true, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, xAxis: { classPropertyName: "xAxis", publicName: "xAxis", isSignal: true, isRequired: false, transformFunction: null }, labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+    <skdx-chart-root
+      [layout]="layout()"
+      [options]="options()"
+      kind="timeline"
+      [label]="label() ?? 'Timeline chart'"
+      [zoomable]="zoomable()"
+      [selectionMode]="selectionMode()"
+      [editable]="editable()"
+      [syncId]="syncId()"
+      [crosshair]="syncedCrosshair()"
+      [responsive]="!!responsive()"
+      (itemClick)="itemClick.emit($event)"
+      (dataIssue)="dataIssue.emit($event)"
+      (taskChange)="taskChange.emit($event)"
+      (hiddenSeriesChange)="toggle($event)"
+      (zoomChange)="zoom.set($event)"
+      (viewChange)="view.set($event)"
+      (selectedChange)="selected.set($event)"
+      (highlightedChange)="highlighted.set($event)"
+      (syncChange)="sync($event)"
+      (measured)="measuredWidth.set($event)"
+    ></skdx-chart-root>
+  `, isInline: true, dependencies: [{ kind: "component", type: SkdxChartRootComponent, selector: "skdx-chart-root", inputs: ["layout", "options", "kind", "label", "zoomable", "selectionMode", "editable", "syncId", "crosshair", "responsive"], outputs: ["itemClick", "hiddenSeriesChange", "zoomChange", "viewChange", "selectedChange", "highlightedChange", "dataIssue", "taskChange", "syncChange", "measured"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxTimelineChartComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'skdx-timeline-chart',
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [SkdxChartRootComponent],
+                    template: `
+    <skdx-chart-root
+      [layout]="layout()"
+      [options]="options()"
+      kind="timeline"
+      [label]="label() ?? 'Timeline chart'"
+      [zoomable]="zoomable()"
+      [selectionMode]="selectionMode()"
+      [editable]="editable()"
+      [syncId]="syncId()"
+      [crosshair]="syncedCrosshair()"
+      [responsive]="!!responsive()"
+      (itemClick)="itemClick.emit($event)"
+      (dataIssue)="dataIssue.emit($event)"
+      (taskChange)="taskChange.emit($event)"
+      (hiddenSeriesChange)="toggle($event)"
+      (zoomChange)="zoom.set($event)"
+      (viewChange)="view.set($event)"
+      (selectedChange)="selected.set($event)"
+      (highlightedChange)="highlighted.set($event)"
+      (syncChange)="sync($event)"
+      (measured)="measuredWidth.set($event)"
+    ></skdx-chart-root>
+  `,
+                }]
+        }], propDecorators: { events: [{ type: i0.Input, args: [{ isSignal: true, alias: "events", required: true }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], xAxis: [{ type: i0.Input, args: [{ isSignal: true, alias: "xAxis", required: false }] }], labels: [{ type: i0.Input, args: [{ isSignal: true, alias: "labels", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SkdxTimelineChartComponent };
+//# sourceMappingURL=skdx-angular-charts-timeline.mjs.map

package/fesm2022/skdx-angular-charts-timeline.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"skdx-angular-charts-timeline.mjs","sources":["../../src/timeline/index.ts","../../src/timeline/skdx-angular-charts-timeline.ts"],"sourcesContent":["/*\n * Copyright (c) 2026 SkandaDX\n * This file is part of the SkandaDX organization.\n * Licensed under the MIT License. See LICENSE in the repository root.\n */\n\nimport { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';\n\nimport {\n  layoutTimelineChart,\n  SkdxChartRootComponent,\n  SkdxSizedBase,\n  type AxisOptions,\n  type TimelineEvent,\n} from '@skdx/angular-charts/internal';\n\n/** Point-in-time events on a time axis, in lanes with staggered labels, or as a vertical list. */\n@Component({\n  selector: 'skdx-timeline-chart',\n  standalone: true,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [SkdxChartRootComponent],\n  template: `\n    <skdx-chart-root\n      [layout]=\"layout()\"\n      [options]=\"options()\"\n      kind=\"timeline\"\n      [label]=\"label() ?? 'Timeline chart'\"\n      [zoomable]=\"zoomable()\"\n      [selectionMode]=\"selectionMode()\"\n      [editable]=\"editable()\"\n      [syncId]=\"syncId()\"\n      [crosshair]=\"syncedCrosshair()\"\n      [responsive]=\"!!responsive()\"\n      (itemClick)=\"itemClick.emit($event)\"\n      (dataIssue)=\"dataIssue.emit($event)\"\n      (taskChange)=\"taskChange.emit($event)\"\n      (hiddenSeriesChange)=\"toggle($event)\"\n      (zoomChange)=\"zoom.set($event)\"\n      (viewChange)=\"view.set($event)\"\n      (selectedChange)=\"selected.set($event)\"\n      (highlightedChange)=\"highlighted.set($event)\"\n      (syncChange)=\"sync($event)\"\n      (measured)=\"measuredWidth.set($event)\"\n    ></skdx-chart-root>\n  `,\n})\nexport class SkdxTimelineChartComponent extends SkdxSizedBase {\n  readonly events = input.required<TimelineEvent[]>();\n  readonly orientation = input<'horizontal' | 'vertical'>();\n  /** How dates are written. */\n  readonly xAxis = input<Pick<AxisOptions, 'format' | 'label'>>();\n  /** Write event labels. */\n  readonly labels = input(true);\n\n  protected readonly layout = computed(() =>\n    layoutTimelineChart({\n      ...this.sized(),\n      events: this.events(),\n      orientation: this.orientation(),\n      xAxis: this.xAxis(),\n      labels: this.labels(),\n    }),\n  );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/skdx-angular-charts-tree.mjs

@@ -0,0 +1,118 @@
+import * as i0 from '@angular/core';
+import { input, computed, ChangeDetectionStrategy, Component } from '@angular/core';
+import { SkdxSizedBase, layoutTreeChart, SkdxChartRootComponent } from '@skdx/angular-charts/internal';
+
+/*
+ * Copyright (c) 2026 SkandaDX
+ * This file is part of the SkandaDX organization.
+ * Licensed under the MIT License. See LICENSE in the repository root.
+ */
+/** A node-link tree: one dot or box per node with links to its children, top-down or left-right. */
+class SkdxTreeChartComponent extends SkdxSizedBase {
+    constructor() {
+        super(...arguments);
+        this.data = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
+        /** Root at the top, or at the left. */
+        this.orientation = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "orientation" }] : /* istanbul ignore next */ []));
+        /** Dots with labels beside them, or boxes holding the name. */
+        this.nodeShape = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "nodeShape" }] : /* istanbul ignore next */ []));
+        this.linkStyle = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "linkStyle" }] : /* istanbul ignore next */ []));
+        /** Id (or name) of the node shown as the root. */
+        this.rootId = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "rootId" }] : /* istanbul ignore next */ []));
+        /** Nodes whose children are hidden. */
+        this.collapsed = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "collapsed" }] : /* istanbul ignore next */ []));
+        /** Deepest level drawn. */
+        this.maxDepth = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "maxDepth" }] : /* istanbul ignore next */ []));
+        /** Write node names. */
+        this.labels = input(true, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "labels" }] : /* istanbul ignore next */ []));
+        /** Dot radius, or box height, in pixels. */
+        this.nodeSize = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "nodeSize" }] : /* istanbul ignore next */ []));
+        this.layout = computed(() => layoutTreeChart({
+            ...this.sized(),
+            data: this.data(),
+            orientation: this.orientation(),
+            nodeShape: this.nodeShape(),
+            linkStyle: this.linkStyle(),
+            rootId: this.rootId(),
+            collapsed: this.collapsed(),
+            maxDepth: this.maxDepth(),
+            labels: this.labels(),
+            nodeSize: this.nodeSize(),
+        }), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "layout" }] : /* istanbul ignore next */ []));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxTreeChartComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: SkdxTreeChartComponent, isStandalone: true, selector: "skdx-tree-chart", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, nodeShape: { classPropertyName: "nodeShape", publicName: "nodeShape", isSignal: true, isRequired: false, transformFunction: null }, linkStyle: { classPropertyName: "linkStyle", publicName: "linkStyle", isSignal: true, isRequired: false, transformFunction: null }, rootId: { classPropertyName: "rootId", publicName: "rootId", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, maxDepth: { classPropertyName: "maxDepth", publicName: "maxDepth", isSignal: true, isRequired: false, transformFunction: null }, labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: false, transformFunction: null }, nodeSize: { classPropertyName: "nodeSize", publicName: "nodeSize", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+    <skdx-chart-root
+      [layout]="layout()"
+      [options]="options()"
+      kind="tree"
+      [label]="label() ?? 'Tree chart'"
+      [zoomable]="zoomable()"
+      [selectionMode]="selectionMode()"
+      [editable]="editable()"
+      [syncId]="syncId()"
+      [crosshair]="syncedCrosshair()"
+      [responsive]="!!responsive()"
+      (itemClick)="itemClick.emit($event)"
+      (dataIssue)="dataIssue.emit($event)"
+      (taskChange)="taskChange.emit($event)"
+      (hiddenSeriesChange)="toggle($event)"
+      (zoomChange)="zoom.set($event)"
+      (viewChange)="view.set($event)"
+      (selectedChange)="selected.set($event)"
+      (highlightedChange)="highlighted.set($event)"
+      (syncChange)="sync($event)"
+      (measured)="measuredWidth.set($event)"
+    ></skdx-chart-root>
+  `, isInline: true, dependencies: [{ kind: "component", type: SkdxChartRootComponent, selector: "skdx-chart-root", inputs: ["layout", "options", "kind", "label", "zoomable", "selectionMode", "editable", "syncId", "crosshair", "responsive"], outputs: ["itemClick", "hiddenSeriesChange", "zoomChange", "viewChange", "selectedChange", "highlightedChange", "dataIssue", "taskChange", "syncChange", "measured"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxTreeChartComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'skdx-tree-chart',
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [SkdxChartRootComponent],
+                    template: `
+    <skdx-chart-root
+      [layout]="layout()"
+      [options]="options()"
+      kind="tree"
+      [label]="label() ?? 'Tree chart'"
+      [zoomable]="zoomable()"
+      [selectionMode]="selectionMode()"
+      [editable]="editable()"
+      [syncId]="syncId()"
+      [crosshair]="syncedCrosshair()"
+      [responsive]="!!responsive()"
+      (itemClick)="itemClick.emit($event)"
+      (dataIssue)="dataIssue.emit($event)"
+      (taskChange)="taskChange.emit($event)"
+      (hiddenSeriesChange)="toggle($event)"
+      (zoomChange)="zoom.set($event)"
+      (viewChange)="view.set($event)"
+      (selectedChange)="selected.set($event)"
+      (highlightedChange)="highlighted.set($event)"
+      (syncChange)="sync($event)"
+      (measured)="measuredWidth.set($event)"
+    ></skdx-chart-root>
+  `,
+                }]
+        }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], nodeShape: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodeShape", required: false }] }], linkStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "linkStyle", required: false }] }], rootId: [{ type: i0.Input, args: [{ isSignal: true, alias: "rootId", required: false }] }], collapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsed", required: false }] }], maxDepth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxDepth", required: false }] }], labels: [{ type: i0.Input, args: [{ isSignal: true, alias: "labels", required: false }] }], nodeSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodeSize", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SkdxTreeChartComponent };
+//# sourceMappingURL=skdx-angular-charts-tree.mjs.map

package/fesm2022/skdx-angular-charts-tree.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"skdx-angular-charts-tree.mjs","sources":["../../src/tree/index.ts","../../src/tree/skdx-angular-charts-tree.ts"],"sourcesContent":["/*\n * Copyright (c) 2026 SkandaDX\n * This file is part of the SkandaDX organization.\n * Licensed under the MIT License. See LICENSE in the repository root.\n */\n\nimport { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';\n\nimport {\n  layoutTreeChart,\n  SkdxChartRootComponent,\n  SkdxSizedBase,\n  type ChartItemId,\n  type TreeNode,\n} from '@skdx/angular-charts/internal';\n\n/** A node-link tree: one dot or box per node with links to its children, top-down or left-right. */\n@Component({\n  selector: 'skdx-tree-chart',\n  standalone: true,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [SkdxChartRootComponent],\n  template: `\n    <skdx-chart-root\n      [layout]=\"layout()\"\n      [options]=\"options()\"\n      kind=\"tree\"\n      [label]=\"label() ?? 'Tree chart'\"\n      [zoomable]=\"zoomable()\"\n      [selectionMode]=\"selectionMode()\"\n      [editable]=\"editable()\"\n      [syncId]=\"syncId()\"\n      [crosshair]=\"syncedCrosshair()\"\n      [responsive]=\"!!responsive()\"\n      (itemClick)=\"itemClick.emit($event)\"\n      (dataIssue)=\"dataIssue.emit($event)\"\n      (taskChange)=\"taskChange.emit($event)\"\n      (hiddenSeriesChange)=\"toggle($event)\"\n      (zoomChange)=\"zoom.set($event)\"\n      (viewChange)=\"view.set($event)\"\n      (selectedChange)=\"selected.set($event)\"\n      (highlightedChange)=\"highlighted.set($event)\"\n      (syncChange)=\"sync($event)\"\n      (measured)=\"measuredWidth.set($event)\"\n    ></skdx-chart-root>\n  `,\n})\nexport class SkdxTreeChartComponent extends SkdxSizedBase {\n  readonly data = input.required<TreeNode[]>();\n  /** Root at the top, or at the left. */\n  readonly orientation = input<'vertical' | 'horizontal'>();\n  /** Dots with labels beside them, or boxes holding the name. */\n  readonly nodeShape = input<'circle' | 'box'>();\n  readonly linkStyle = input<'curve' | 'elbow' | 'straight'>();\n  /** Id (or name) of the node shown as the root. */\n  readonly rootId = input<ChartItemId>();\n  /** Nodes whose children are hidden. */\n  readonly collapsed = input<ChartItemId[]>();\n  /** Deepest level drawn. */\n  readonly maxDepth = input<number>();\n  /** Write node names. */\n  readonly labels = input(true);\n  /** Dot radius, or box height, in pixels. */\n  readonly nodeSize = input<number>();\n\n  protected readonly layout = computed(() =>\n    layoutTreeChart({\n      ...this.sized(),\n      data: this.data(),\n      orientation: this.orientation(),\n      nodeShape: this.nodeShape(),\n      linkStyle: this.linkStyle(),\n      rootId: this.rootId(),\n      collapsed: this.collapsed(),\n      maxDepth: this.maxDepth(),\n      labels: this.labels(),\n      nodeSize: this.nodeSize(),\n    }),\n  );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/skdx-angular-charts-treemap.mjs

@@ -7,19 +7,75 @@ import { SkdxSizedBase, layoutTreemap, SkdxChartRootComponent } from '@skdx/angu
  * This file is part of the SkandaDX organization.
  * Licensed under the MIT License. See LICENSE in the repository root.
  */
-/** Squarified tiles, one per datum, sized by value. */
+/** Squarified tiles by value; branches are outlined and their children tiled inside. */
 class SkdxTreemapComponent extends SkdxSizedBase {
     constructor() {
         super(...arguments);
         this.data = input.required(/* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
-        this.l = computed(() => layoutTreemap({ ...this.sized(), data: this.data() }), /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "l" }] : /* istanbul ignore next */ []));
+        /** Id (or name) of the node shown as the whole chart: controlled drill-down. */
+        this.rootId = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "rootId" }] : /* istanbul ignore next */ []));
+        /** Write the path to `rootId` above the tiles. */
+        this.breadcrumbs = input(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "breadcrumbs" }] : /* istanbul ignore next */ []));
+        /** Deepest level tiled. */
+        this.maxDepth = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "maxDepth" }] : /* istanbul ignore next */ []));
+        /** Tile order inside a branch. */
+        this.sort = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "sort" }] : /* istanbul ignore next */ []));
+        /** Inset of children inside their branch, in pixels. */
+        this.padding = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "padding" }] : /* istanbul ignore next */ []));
+        /** Tiling algorithm. */
+        this.tiling = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "tiling" }] : /* istanbul ignore next */ []));
+        /** Colors leaves by their value. */
+        this.colorScale = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "colorScale" }] : /* istanbul ignore next */ []));
+        /** Write leaf names on tiles wide enough. */
+        this.labels = input(true, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "labels" }] : /* istanbul ignore next */ []));
+        this.layout = computed(() => layoutTreemap({
+            ...this.sized(),
+            data: this.data(),
+            rootId: this.rootId(),
+            breadcrumbs: this.breadcrumbs(),
+            maxDepth: this.maxDepth(),
+            sort: this.sort(),
+            padding: this.padding(),
+            tiling: this.tiling(),
+            colorScale: this.colorScale(),
+            labels: this.labels(),
+        }), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "layout" }] : /* istanbul ignore next */ []));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxTreemapComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: SkdxTreemapComponent, isStandalone: true, selector: "skdx-treemap", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
-    <skdx-chart-root [layout]="l()" kind="treemap" [label]="label() ?? 'Treemap'"></skdx-chart-root>
-  `, isInline: true, dependencies: [{ kind: "component", type: SkdxChartRootComponent, selector: "skdx-chart-root", inputs: ["layout", "kind", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: SkdxTreemapComponent, isStandalone: true, selector: "skdx-treemap", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, rootId: { classPropertyName: "rootId", publicName: "rootId", isSignal: true, isRequired: false, transformFunction: null }, breadcrumbs: { classPropertyName: "breadcrumbs", publicName: "breadcrumbs", isSignal: true, isRequired: false, transformFunction: null }, maxDepth: { classPropertyName: "maxDepth", publicName: "maxDepth", isSignal: true, isRequired: false, transformFunction: null }, sort: { classPropertyName: "sort", publicName: "sort", isSignal: true, isRequired: false, transformFunction: null }, padding: { classPropertyName: "padding", publicName: "padding", isSignal: true, isRequired: false, transformFunction: null }, tiling: { classPropertyName: "tiling", publicName: "tiling", isSignal: true, isRequired: false, transformFunction: null }, colorScale: { classPropertyName: "colorScale", publicName: "colorScale", isSignal: true, isRequired: false, transformFunction: null }, labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+    <skdx-chart-root
+      [layout]="layout()"
+      [options]="options()"
+      kind="treemap"
+      [label]="label() ?? 'Treemap'"
+      [zoomable]="zoomable()"
+      [selectionMode]="selectionMode()"
+      [editable]="editable()"
+      [syncId]="syncId()"
+      [crosshair]="syncedCrosshair()"
+      [responsive]="!!responsive()"
+      (itemClick)="itemClick.emit($event)"
+      (dataIssue)="dataIssue.emit($event)"
+      (taskChange)="taskChange.emit($event)"
+      (hiddenSeriesChange)="toggle($event)"
+      (zoomChange)="zoom.set($event)"
+      (viewChange)="view.set($event)"
+      (selectedChange)="selected.set($event)"
+      (highlightedChange)="highlighted.set($event)"
+      (syncChange)="sync($event)"
+      (measured)="measuredWidth.set($event)"
+    ></skdx-chart-root>
+  `, isInline: true, dependencies: [{ kind: "component", type: SkdxChartRootComponent, selector: "skdx-chart-root", inputs: ["layout", "options", "kind", "label", "zoomable", "selectionMode", "editable", "syncId", "crosshair", "responsive"], outputs: ["itemClick", "hiddenSeriesChange", "zoomChange", "viewChange", "selectedChange", "highlightedChange", "dataIssue", "taskChange", "syncChange", "measured"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxTreemapComponent, decorators: [{
             type: Component,
@@ -29,10 +85,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     imports: [SkdxChartRootComponent],
                     template: `
-    <skdx-chart-root [layout]="l()" kind="treemap" [label]="label() ?? 'Treemap'"></skdx-chart-root>
+    <skdx-chart-root
+      [layout]="layout()"
+      [options]="options()"
+      kind="treemap"
+      [label]="label() ?? 'Treemap'"
+      [zoomable]="zoomable()"
+      [selectionMode]="selectionMode()"
+      [editable]="editable()"
+      [syncId]="syncId()"
+      [crosshair]="syncedCrosshair()"
+      [responsive]="!!responsive()"
+      (itemClick)="itemClick.emit($event)"
+      (dataIssue)="dataIssue.emit($event)"
+      (taskChange)="taskChange.emit($event)"
+      (hiddenSeriesChange)="toggle($event)"
+      (zoomChange)="zoom.set($event)"
+      (viewChange)="view.set($event)"
+      (selectedChange)="selected.set($event)"
+      (highlightedChange)="highlighted.set($event)"
+      (syncChange)="sync($event)"
+      (measured)="measuredWidth.set($event)"
+    ></skdx-chart-root>
   `,
                 }]
-        }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }] } });
+        }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }], rootId: [{ type: i0.Input, args: [{ isSignal: true, alias: "rootId", required: false }] }], breadcrumbs: [{ type: i0.Input, args: [{ isSignal: true, alias: "breadcrumbs", required: false }] }], maxDepth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxDepth", required: false }] }], sort: [{ type: i0.Input, args: [{ isSignal: true, alias: "sort", required: false }] }], padding: [{ type: i0.Input, args: [{ isSignal: true, alias: "padding", required: false }] }], tiling: [{ type: i0.Input, args: [{ isSignal: true, alias: "tiling", required: false }] }], colorScale: [{ type: i0.Input, args: [{ isSignal: true, alias: "colorScale", required: false }] }], labels: [{ type: i0.Input, args: [{ isSignal: true, alias: "labels", required: false }] }] } });
 
 /**
  * Generated bundle index. Do not edit.

package/fesm2022/skdx-angular-charts-treemap.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"skdx-angular-charts-treemap.mjs","sources":["../../src/treemap/index.ts","../../src/treemap/skdx-angular-charts-treemap.ts"],"sourcesContent":["/*\n * Copyright (c) 2026 SkandaDX\n * This file is part of the SkandaDX organization.\n * Licensed under the MIT License. See LICENSE in the repository root.\n */\n\nimport { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';\n\nimport {\n  type Datum,\n  layoutTreemap,\n  SkdxChartRootComponent,\n  SkdxSizedBase,\n} from '@skdx/angular-charts/internal';\n\n/** Squarified tiles, one per datum, sized by value. */\n@Component({\n  selector: 'skdx-treemap',\n  standalone: true,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [SkdxChartRootComponent],\n  template: `\n    <skdx-chart-root [layout]=\"l()\" kind=\"treemap\" [label]=\"label() ?? 'Treemap'\"></skdx-chart-root>\n  `,\n})\nexport class SkdxTreemapComponent extends SkdxSizedBase {\n  readonly data = input.required<Datum[]>();\n\n  protected readonly l = computed(() => layoutTreemap({ ...this.sized(), data: this.data() }));\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAAA;;;;AAIG;AAWH;AAUM,MAAO,oBAAqB,SAAQ,aAAa,CAAA;AATvD,IAAA,WAAA,GAAA;;QAUW,IAAA,CAAA,IAAI,GAAG,KAAK,CAAC,QAAQ;iFAAW;QAEtB,IAAA,CAAA,CAAC,GAAG,QAAQ,CAAC,MAAM,aAAa,CAAC,EAAE,GAAG,IAAI,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC;8EAAC;AAC7F,IAAA;8GAJY,oBAAoB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAApB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,oBAAoB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAJrB;;AAET,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAHS,sBAAsB,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,CAAA,QAAA,EAAA,MAAA,EAAA,OAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAKrB,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAThC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,cAAc;AACxB,oBAAA,UAAU,EAAE,IAAI;oBAChB,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,OAAO,EAAE,CAAC,sBAAsB,CAAC;AACjC,oBAAA,QAAQ,EAAE;;AAET,EAAA,CAAA;AACF,iBAAA;;;ACxBD;;AAEG;;"}
+{"version":3,"file":"skdx-angular-charts-treemap.mjs","sources":["../../src/treemap/index.ts","../../src/treemap/skdx-angular-charts-treemap.ts"],"sourcesContent":["/*\n * Copyright (c) 2026 SkandaDX\n * This file is part of the SkandaDX organization.\n * Licensed under the MIT License. See LICENSE in the repository root.\n */\n\nimport { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';\n\nimport {\n  layoutTreemap,\n  SkdxChartRootComponent,\n  SkdxSizedBase,\n  type ChartItemId,\n  type ColorScale,\n  type TreeNode,\n} from '@skdx/angular-charts/internal';\n\n/** Squarified tiles by value; branches are outlined and their children tiled inside. */\n@Component({\n  selector: 'skdx-treemap',\n  standalone: true,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [SkdxChartRootComponent],\n  template: `\n    <skdx-chart-root\n      [layout]=\"layout()\"\n      [options]=\"options()\"\n      kind=\"treemap\"\n      [label]=\"label() ?? 'Treemap'\"\n      [zoomable]=\"zoomable()\"\n      [selectionMode]=\"selectionMode()\"\n      [editable]=\"editable()\"\n      [syncId]=\"syncId()\"\n      [crosshair]=\"syncedCrosshair()\"\n      [responsive]=\"!!responsive()\"\n      (itemClick)=\"itemClick.emit($event)\"\n      (dataIssue)=\"dataIssue.emit($event)\"\n      (taskChange)=\"taskChange.emit($event)\"\n      (hiddenSeriesChange)=\"toggle($event)\"\n      (zoomChange)=\"zoom.set($event)\"\n      (viewChange)=\"view.set($event)\"\n      (selectedChange)=\"selected.set($event)\"\n      (highlightedChange)=\"highlighted.set($event)\"\n      (syncChange)=\"sync($event)\"\n      (measured)=\"measuredWidth.set($event)\"\n    ></skdx-chart-root>\n  `,\n})\nexport class SkdxTreemapComponent extends SkdxSizedBase {\n  readonly data = input.required<TreeNode[]>();\n  /** Id (or name) of the node shown as the whole chart: controlled drill-down. */\n  readonly rootId = input<ChartItemId>();\n  /** Write the path to `rootId` above the tiles. */\n  readonly breadcrumbs = input(false);\n  /** Deepest level tiled. */\n  readonly maxDepth = input<number>();\n  /** Tile order inside a branch. */\n  readonly sort = input<'asc' | 'desc' | 'none'>();\n  /** Inset of children inside their branch, in pixels. */\n  readonly padding = input<number>();\n  /** Tiling algorithm. */\n  readonly tiling = input<'squarify' | 'slice' | 'dice' | 'sliceDice'>();\n  /** Colors leaves by their value. */\n  readonly colorScale = input<ColorScale>();\n  /** Write leaf names on tiles wide enough. */\n  readonly labels = input(true);\n\n  protected readonly layout = computed(() =>\n    layoutTreemap({\n      ...this.sized(),\n      data: this.data(),\n      rootId: this.rootId(),\n      breadcrumbs: this.breadcrumbs(),\n      maxDepth: this.maxDepth(),\n      sort: this.sort(),\n      padding: this.padding(),\n      tiling: this.tiling(),\n      colorScale: this.colorScale(),\n      labels: this.labels(),\n    }),\n  );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/skdx-angular-charts-waffle.mjs

@@ -0,0 +1,113 @@
+import * as i0 from '@angular/core';
+import { input, computed, ChangeDetectionStrategy, Component } from '@angular/core';
+import { SkdxSizedBase, layoutWaffleChart, SkdxChartRootComponent } from '@skdx/angular-charts/internal';
+
+/*
+ * Copyright (c) 2026 SkandaDX
+ * This file is part of the SkandaDX organization.
+ * Licensed under the MIT License. See LICENSE in the repository root.
+ */
+/** A grid of cells, each standing for a share of the total, colored by datum. */
+class SkdxWaffleChartComponent extends SkdxSizedBase {
+    constructor() {
+        super(...arguments);
+        this.data = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
+        /** What the whole grid stands for. */
+        this.total = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "total" }] : /* istanbul ignore next */ []));
+        this.rows = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "rows" }] : /* istanbul ignore next */ []));
+        this.columns = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "columns" }] : /* istanbul ignore next */ []));
+        /** Fill direction. */
+        this.orientation = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "orientation" }] : /* istanbul ignore next */ []));
+        /** Gap between cells in pixels. */
+        this.cellGap = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "cellGap" }] : /* istanbul ignore next */ []));
+        /** Cell corner radius in pixels. */
+        this.cellRadius = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "cellRadius" }] : /* istanbul ignore next */ []));
+        /** Write each datum's share after its name in the legend. */
+        this.labels = input(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "labels" }] : /* istanbul ignore next */ []));
+        this.layout = computed(() => layoutWaffleChart({
+            ...this.sized(),
+            data: this.data(),
+            total: this.total(),
+            rows: this.rows(),
+            columns: this.columns(),
+            orientation: this.orientation(),
+            cellGap: this.cellGap(),
+            cellRadius: this.cellRadius(),
+            labels: this.labels(),
+        }), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "layout" }] : /* istanbul ignore next */ []));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxWaffleChartComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: SkdxWaffleChartComponent, isStandalone: true, selector: "skdx-waffle-chart", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, cellGap: { classPropertyName: "cellGap", publicName: "cellGap", isSignal: true, isRequired: false, transformFunction: null }, cellRadius: { classPropertyName: "cellRadius", publicName: "cellRadius", isSignal: true, isRequired: false, transformFunction: null }, labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+    <skdx-chart-root
+      [layout]="layout()"
+      [options]="options()"
+      kind="waffle"
+      [label]="label() ?? 'Waffle chart'"
+      [zoomable]="zoomable()"
+      [selectionMode]="selectionMode()"
+      [editable]="editable()"
+      [syncId]="syncId()"
+      [crosshair]="syncedCrosshair()"
+      [responsive]="!!responsive()"
+      (itemClick)="itemClick.emit($event)"
+      (dataIssue)="dataIssue.emit($event)"
+      (taskChange)="taskChange.emit($event)"
+      (hiddenSeriesChange)="toggle($event)"
+      (zoomChange)="zoom.set($event)"
+      (viewChange)="view.set($event)"
+      (selectedChange)="selected.set($event)"
+      (highlightedChange)="highlighted.set($event)"
+      (syncChange)="sync($event)"
+      (measured)="measuredWidth.set($event)"
+    ></skdx-chart-root>
+  `, isInline: true, dependencies: [{ kind: "component", type: SkdxChartRootComponent, selector: "skdx-chart-root", inputs: ["layout", "options", "kind", "label", "zoomable", "selectionMode", "editable", "syncId", "crosshair", "responsive"], outputs: ["itemClick", "hiddenSeriesChange", "zoomChange", "viewChange", "selectedChange", "highlightedChange", "dataIssue", "taskChange", "syncChange", "measured"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxWaffleChartComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'skdx-waffle-chart',
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [SkdxChartRootComponent],
+                    template: `
+    <skdx-chart-root
+      [layout]="layout()"
+      [options]="options()"
+      kind="waffle"
+      [label]="label() ?? 'Waffle chart'"
+      [zoomable]="zoomable()"
+      [selectionMode]="selectionMode()"
+      [editable]="editable()"
+      [syncId]="syncId()"
+      [crosshair]="syncedCrosshair()"
+      [responsive]="!!responsive()"
+      (itemClick)="itemClick.emit($event)"
+      (dataIssue)="dataIssue.emit($event)"
+      (taskChange)="taskChange.emit($event)"
+      (hiddenSeriesChange)="toggle($event)"
+      (zoomChange)="zoom.set($event)"
+      (viewChange)="view.set($event)"
+      (selectedChange)="selected.set($event)"
+      (highlightedChange)="highlighted.set($event)"
+      (syncChange)="sync($event)"
+      (measured)="measuredWidth.set($event)"
+    ></skdx-chart-root>
+  `,
+                }]
+        }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }], total: [{ type: i0.Input, args: [{ isSignal: true, alias: "total", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], cellGap: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellGap", required: false }] }], cellRadius: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellRadius", required: false }] }], labels: [{ type: i0.Input, args: [{ isSignal: true, alias: "labels", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SkdxWaffleChartComponent };
+//# sourceMappingURL=skdx-angular-charts-waffle.mjs.map