@skdx/angular-charts 0.33.0 → 0.34.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (65) hide show
  1. package/README.md +96 -41
  2. package/fesm2022/skdx-angular-charts-area.mjs +14 -2
  3. package/fesm2022/skdx-angular-charts-area.mjs.map +1 -1
  4. package/fesm2022/skdx-angular-charts-bar.mjs +18 -15
  5. package/fesm2022/skdx-angular-charts-bar.mjs.map +1 -1
  6. package/fesm2022/skdx-angular-charts-boxplot.mjs +18 -6
  7. package/fesm2022/skdx-angular-charts-boxplot.mjs.map +1 -1
  8. package/fesm2022/skdx-angular-charts-candlestick.mjs +41 -8
  9. package/fesm2022/skdx-angular-charts-candlestick.mjs.map +1 -1
  10. package/fesm2022/skdx-angular-charts-chord.mjs +18 -6
  11. package/fesm2022/skdx-angular-charts-chord.mjs.map +1 -1
  12. package/fesm2022/skdx-angular-charts-funnel.mjs +29 -8
  13. package/fesm2022/skdx-angular-charts-funnel.mjs.map +1 -1
  14. package/fesm2022/skdx-angular-charts-gantt.mjs +23 -11
  15. package/fesm2022/skdx-angular-charts-gantt.mjs.map +1 -1
  16. package/fesm2022/skdx-angular-charts-heatmap.mjs +53 -15
  17. package/fesm2022/skdx-angular-charts-heatmap.mjs.map +1 -1
  18. package/fesm2022/skdx-angular-charts-internal.mjs +2709 -494
  19. package/fesm2022/skdx-angular-charts-internal.mjs.map +1 -1
  20. package/fesm2022/skdx-angular-charts-line.mjs +14 -2
  21. package/fesm2022/skdx-angular-charts-line.mjs.map +1 -1
  22. package/fesm2022/skdx-angular-charts-map.mjs +35 -8
  23. package/fesm2022/skdx-angular-charts-map.mjs.map +1 -1
  24. package/fesm2022/skdx-angular-charts-pie.mjs +37 -5
  25. package/fesm2022/skdx-angular-charts-pie.mjs.map +1 -1
  26. package/fesm2022/skdx-angular-charts-radar.mjs +35 -8
  27. package/fesm2022/skdx-angular-charts-radar.mjs.map +1 -1
  28. package/fesm2022/skdx-angular-charts-radial.mjs +108 -0
  29. package/fesm2022/skdx-angular-charts-radial.mjs.map +1 -0
  30. package/fesm2022/skdx-angular-charts-sankey.mjs +18 -6
  31. package/fesm2022/skdx-angular-charts-sankey.mjs.map +1 -1
  32. package/fesm2022/skdx-angular-charts-scatter.mjs +37 -5
  33. package/fesm2022/skdx-angular-charts-scatter.mjs.map +1 -1
  34. package/fesm2022/skdx-angular-charts-sparkline.mjs +42 -8
  35. package/fesm2022/skdx-angular-charts-sparkline.mjs.map +1 -1
  36. package/fesm2022/skdx-angular-charts-sunburst.mjs +18 -6
  37. package/fesm2022/skdx-angular-charts-sunburst.mjs.map +1 -1
  38. package/fesm2022/skdx-angular-charts-treemap.mjs +26 -6
  39. package/fesm2022/skdx-angular-charts-treemap.mjs.map +1 -1
  40. package/fesm2022/skdx-angular-charts-waterfall.mjs +18 -6
  41. package/fesm2022/skdx-angular-charts-waterfall.mjs.map +1 -1
  42. package/fesm2022/skdx-angular-charts.mjs +2 -0
  43. package/fesm2022/skdx-angular-charts.mjs.map +1 -1
  44. package/package.json +7 -3
  45. package/types/skdx-angular-charts-area.d.ts +1 -1
  46. package/types/skdx-angular-charts-bar.d.ts +5 -13
  47. package/types/skdx-angular-charts-boxplot.d.ts +2 -2
  48. package/types/skdx-angular-charts-candlestick.d.ts +10 -4
  49. package/types/skdx-angular-charts-chord.d.ts +2 -2
  50. package/types/skdx-angular-charts-funnel.d.ts +5 -3
  51. package/types/skdx-angular-charts-gantt.d.ts +6 -6
  52. package/types/skdx-angular-charts-heatmap.d.ts +16 -8
  53. package/types/skdx-angular-charts-internal.d.ts +581 -44
  54. package/types/skdx-angular-charts-line.d.ts +1 -1
  55. package/types/skdx-angular-charts-map.d.ts +4 -3
  56. package/types/skdx-angular-charts-pie.d.ts +10 -2
  57. package/types/skdx-angular-charts-radar.d.ts +8 -3
  58. package/types/skdx-angular-charts-radial.d.ts +34 -0
  59. package/types/skdx-angular-charts-sankey.d.ts +2 -2
  60. package/types/skdx-angular-charts-scatter.d.ts +10 -3
  61. package/types/skdx-angular-charts-sparkline.d.ts +13 -5
  62. package/types/skdx-angular-charts-sunburst.d.ts +2 -2
  63. package/types/skdx-angular-charts-treemap.d.ts +4 -4
  64. package/types/skdx-angular-charts-waterfall.d.ts +2 -2
  65. package/types/skdx-angular-charts.d.ts +2 -1
package/README.md CHANGED
@@ -1,7 +1,7 @@
1
1
  # @skdx/angular-charts
2
2
 
3
- Eighteen SVG charts for angular. Plain SVG colored by `@skdx/tokens`; load
4
- `@skdx/tokens/css` once so the colors resolve.
3
+ Nineteen SVG charts for Angular. Plain SVG colored by `@skdx/tokens`; load `@skdx/tokens/css` once
4
+ so the colors resolve.
5
5
 
6
6
  ```sh
7
7
  pnpm add @skdx/angular-charts @skdx/tokens
@@ -12,46 +12,101 @@ import { SkdxBarChartComponent } from '@skdx/angular-charts/bar';
12
12
 
13
13
  @Component({
14
14
  imports: [SkdxBarChartComponent],
15
- template: `<skdx-bar-chart [series]="series" [categories]="['Q1', 'Q2', 'Q3']"></skdx-bar-chart>`,
15
+ template: `
16
+ <skdx-bar-chart
17
+ [series]="series"
18
+ [categories]="['Jan', 'Feb', 'Mar']"
19
+ [format]="{ style: 'currency', currency: 'USD', digits: 0 }"
20
+ ></skdx-bar-chart>
21
+ `,
16
22
  })
17
- export class Sales {
18
- series = [{ name: 'Sales', data: [3, 5, 2] }];
23
+ export class Revenue {
24
+ series = [{ name: 'MRR', data: [118_000, 124_500, 131_200] }];
19
25
  }
20
26
  ```
21
27
 
22
- Every chart takes `width`, `height` and `label` (the accessible name). Bar, line, area and radar
23
- take `series` (`{ name, data, color? }[]`) and `categories`; bar also takes `stacked`. Pie and
24
- funnel take `data` (`{ name, value, color? }[]`); pie also takes `innerRadius` (0 to 0.95) for a
25
- donut. Scatter takes `series` of `[x, y]` pairs. Sparkline takes `data` (`number[]`). Heatmap takes
26
- `rows`, `columns` and `data` (`number[][]`).
27
-
28
- Sankey takes `links` (`{ source, target, value }[]`). Treemap takes `data` like pie. Candlestick
29
- takes `data` as `{ label, open, high, low, close }[]`. Waterfall takes signed `data` deltas and an
30
- optional `total` label. Gantt takes `tasks` (`{ name, start, end }[]`) and an optional tick
31
- `format`. Boxplot takes `series` of raw samples. Sunburst takes `data` as a tree of
32
- `{ name, value?, children? }`. Chord takes `names` and a flow `matrix`. Map takes `features`
33
- (`{ name, value, geometry }[]` with GeoJSON Polygon or MultiPolygon geometry) and an optional
34
- `color`.
35
- Each mark carries a native `<title>` tooltip and a `data-skdx-part` attribute for styling.
36
-
37
- Every chart is also a secondary entry point (`@skdx/angular-charts/bar`, `/line`, … `/map`), so
38
- an app bundles only what it imports.
39
-
40
- ## Options
41
-
42
- Every chart takes `legend` (a swatch row above the plot, off by default) and `tooltip` (a hover
43
- tooltip for the mark under the pointer, on by default; the native `<title>` stays regardless).
44
- Charts scale down with their container while keeping their aspect ratio.
45
-
46
- | Chart | Option | Effect |
47
- | --------------------- | ---------------------------- | ---------------------------------------------------------------- |
48
- | line, area, sparkline | `curve: 'monotone'` | Smooth cubic segments that never overshoot the data |
49
- | pie | `labels` | Name and share written on each slice |
50
- | radar | `normalize` | Each series scaled to its own maximum; rings read as percentages |
51
- | heatmap | `diverging`, `negativeColor` | Split around zero, opacity by distance from zero |
52
- | waterfall | `total` | Label for a closing bar showing the running total |
53
- | gantt | `format` | Formats the time ticks, e.g. a timestamp as a date |
54
- | candlestick | `scale: 'log'` | Logarithmic price axis with ticks at powers of ten |
55
- | treemap | nested `children` | Branches outlined, children tiled inside |
56
- | sankey | (always) | Links that would close a cycle are dropped |
57
- | map | `projection: 'mercator'` | Mercator instead of equirectangular |
28
+ Every chart takes `width`, `height`, `label` (the accessible name), `description`, `decorative`,
29
+ `legend`, `tooltip`, `format`, `palette`, `hiddenSeries`, `loading`, `error` and `emptyMessage`.
30
+ Bar, line and area take `series` (`{ name, data, type?, axis?, curve?, dash?, markers?, stack? }[]`,
31
+ or `{ type: 'range', name, low, high }`) and `categories` (strings, numbers or dates). Pie, funnel
32
+ and radial take `data` (`{ name, value, color? }[]`). Scatter takes `series` of `[x, y]` pairs or
33
+ `[x, y, size]` triples. Sparkline takes `data` (`(number | null)[]`). Heatmap takes `rows`, `columns`
34
+ and `data` (`(number | null)[][]`), or `calendar` (`{ date, value }[]`). Radar takes `series` and
35
+ `categories`.
36
+
37
+ Sankey takes `links` (`{ source, target, value }[]`). Treemap and sunburst take `data` as a tree of
38
+ `{ name, value?, children? }`. Candlestick takes `data` as `{ label, open, high, low, close, volume? }[]`.
39
+ Waterfall takes signed `data` deltas and an optional `total` label. Gantt takes `tasks`
40
+ (`{ name, start, end, group? }[]`). Boxplot takes `series` of raw samples. Chord takes `names` and a
41
+ flow `matrix`. Map takes `features` (`{ name, value, geometry }[]` with GeoJSON Polygon or
42
+ MultiPolygon geometry). `null` and `NaN` values are gaps; an empty chart renders "No data available".
43
+
44
+ Every chart also takes `animate` (fade in and transition on change; `true` is 300 ms, a number sets
45
+ the duration, off under `prefers-reduced-motion` and above 1500 shapes) and `responsive` (lay out
46
+ at the container's width so text keeps its size). Cartesian charts take `xAxis.type: 'time' |
47
+ 'linear'` to place numeric or date categories proportionally.
48
+
49
+ Every mark carries a native `<title>` tooltip and a `data-skdx-part` attribute for styling. The
50
+ full option reference, the mixed-series (bar + line + range) cartesian model, references, zoom,
51
+ brush, crosshair, histogram, formatting and the accessibility contract are documented once in the
52
+ [repository README](../../README.md); the decisions behind them in [CHARTS.md](../../CHARTS.md).
53
+
54
+ ## Interaction
55
+
56
+ Every chart is keyboard accessible: it takes focus, arrow keys step through the marks with a focus
57
+ ring and tooltip, Home/End jump, Escape clears and Enter/Space clicks. Clicking a legend entry hides
58
+ its series while colors stay stable. Bar, line, area and candlestick charts also zoom (wheel around
59
+ the pointer, drag to pan, double-click to reset), brush (a range strip under the plot) and snap a
60
+ shared tooltip to the nearest category (`crosshair`). Two fingers pinch-zoom on touch screens.
61
+
62
+ | Capability | Angular spelling |
63
+ | ------------------- | ------------------------------------------------------- |
64
+ | item click | `(itemClick)="onItem($event)"` |
65
+ | legend toggles | uncontrolled by default, or `[(hiddenSeries)]="hidden"` |
66
+ | zoom | `[zoomable]="true"`; `[(zoom)]="zoom"` for control |
67
+ | brush and crosshair | `[brush]="true"`, `[crosshair]="true"` |
68
+ | motion and sizing | `[animate]="true"`, `[responsive]="true"` |
69
+
70
+ ## Example: an observability panel
71
+
72
+ ```ts
73
+ import { Component, signal } from '@angular/core';
74
+
75
+ import type { ChartItem, Zoom } from '@skdx/angular-charts';
76
+ import { SkdxLineChartComponent } from '@skdx/angular-charts/line';
77
+
78
+ @Component({
79
+ imports: [SkdxLineChartComponent],
80
+ template: `
81
+ <skdx-line-chart
82
+ label="p95 latency, last 24 hours"
83
+ [categories]="timestamps"
84
+ [xAxis]="{ format: { style: 'time' } }"
85
+ [format]="{ style: 'integer', unit: ' ms' }"
86
+ [series]="series"
87
+ [rightAxis]="{ format: { style: 'percent' }, max: 0.05 }"
88
+ [references]="[{ y: 300, label: 'SLA', variant: 'warning' }]"
89
+ [crosshair]="true"
90
+ [zoomable]="true"
91
+ [brush]="true"
92
+ [legend]="true"
93
+ [(zoom)]="zoom"
94
+ [(hiddenSeries)]="hidden"
95
+ (itemClick)="onItem($event)"
96
+ ></skdx-line-chart>
97
+ `,
98
+ })
99
+ export class LatencyPanel {
100
+ timestamps = timestamps;
101
+ series = [
102
+ { name: 'p95', data: points.p95 },
103
+ { name: 'p50', data: points.p50, dash: '4 3' },
104
+ { name: 'Error rate', type: 'bar' as const, data: points.errors, axis: 'right' as const },
105
+ ];
106
+ zoom = signal<Zoom | undefined>(undefined);
107
+ hidden = signal<string[] | undefined>(undefined);
108
+ onItem(item: ChartItem) {
109
+ console.log(item.series, item.category, item.value);
110
+ }
111
+ }
112
+ ```
@@ -7,7 +7,7 @@ import { SkdxChartBase, layoutAreaChart, SkdxChartRootComponent } from '@skdx/an
7
7
  * This file is part of the SkandaDX organization.
8
8
  * Licensed under the MIT License. See LICENSE in the repository root.
9
9
  */
10
- /** A line chart with each series filled down to the zero baseline. */
10
+ /** Filled, optionally stacked, areas down to zero; series may also be bars, lines or ranges. */
11
11
  class SkdxAreaChartComponent extends SkdxChartBase {
12
12
  constructor() {
13
13
  super(...arguments);
@@ -20,8 +20,14 @@ class SkdxAreaChartComponent extends SkdxChartBase {
20
20
  [layout]="layout()"
21
21
  kind="area"
22
22
  [label]="label() ?? 'Area chart'"
23
+ [zoomable]="zoomable()"
24
+ [responsive]="responsive()"
25
+ (itemClick)="itemClick.emit($event)"
26
+ (hiddenSeriesChange)="toggle($event)"
27
+ (zoomChange)="zoom.set($event)"
28
+ (measured)="measuredWidth.set($event)"
23
29
  ></skdx-chart-root>
24
- `, isInline: true, dependencies: [{ kind: "component", type: SkdxChartRootComponent, selector: "skdx-chart-root", inputs: ["layout", "kind", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
30
+ `, isInline: true, dependencies: [{ kind: "component", type: SkdxChartRootComponent, selector: "skdx-chart-root", inputs: ["layout", "kind", "label", "zoomable", "responsive"], outputs: ["itemClick", "hiddenSeriesChange", "zoomChange", "measured"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
25
31
  }
26
32
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxAreaChartComponent, decorators: [{
27
33
  type: Component,
@@ -35,6 +41,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
35
41
  [layout]="layout()"
36
42
  kind="area"
37
43
  [label]="label() ?? 'Area chart'"
44
+ [zoomable]="zoomable()"
45
+ [responsive]="responsive()"
46
+ (itemClick)="itemClick.emit($event)"
47
+ (hiddenSeriesChange)="toggle($event)"
48
+ (zoomChange)="zoom.set($event)"
49
+ (measured)="measuredWidth.set($event)"
38
50
  ></skdx-chart-root>
39
51
  `,
40
52
  }]
@@ -1 +1 @@
1
- {"version":3,"file":"skdx-angular-charts-area.mjs","sources":["../../src/area/index.ts","../../src/area/skdx-angular-charts-area.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 } from '@angular/core';\n\nimport {\n layoutAreaChart,\n SkdxChartBase,\n SkdxChartRootComponent,\n} from '@skdx/angular-charts/internal';\n\n/** A line chart with each series filled down to the zero baseline. */\n@Component({\n selector: 'skdx-area-chart',\n standalone: true,\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [SkdxChartRootComponent],\n template: `\n <skdx-chart-root\n [layout]=\"layout()\"\n kind=\"area\"\n [label]=\"label() ?? 'Area chart'\"\n ></skdx-chart-root>\n `,\n})\nexport class SkdxAreaChartComponent extends SkdxChartBase {\n protected readonly layout = computed(() => layoutAreaChart(this.input()));\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAAA;;;;AAIG;AAUH;AAcM,MAAO,sBAAuB,SAAQ,aAAa,CAAA;AAbzD,IAAA,WAAA,GAAA;;AAcqB,QAAA,IAAA,CAAA,MAAM,GAAG,QAAQ,CAAC,MAAM,eAAe,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;mFAAC;AAC1E,IAAA;8GAFY,sBAAsB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAtB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,sBAAsB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EARvB;;;;;;AAMT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAPS,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;;2FASrB,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBAblC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,iBAAiB;AAC3B,oBAAA,UAAU,EAAE,IAAI;oBAChB,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,OAAO,EAAE,CAAC,sBAAsB,CAAC;AACjC,oBAAA,QAAQ,EAAE;;;;;;AAMT,EAAA,CAAA;AACF,iBAAA;;;AC3BD;;AAEG;;"}
1
+ {"version":3,"file":"skdx-angular-charts-area.mjs","sources":["../../src/area/index.ts","../../src/area/skdx-angular-charts-area.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 } from '@angular/core';\n\nimport {\n layoutAreaChart,\n SkdxChartBase,\n SkdxChartRootComponent,\n} from '@skdx/angular-charts/internal';\n\n/** Filled, optionally stacked, areas down to zero; series may also be bars, lines or ranges. */\n@Component({\n selector: 'skdx-area-chart',\n standalone: true,\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [SkdxChartRootComponent],\n template: `\n <skdx-chart-root\n [layout]=\"layout()\"\n kind=\"area\"\n [label]=\"label() ?? 'Area chart'\"\n [zoomable]=\"zoomable()\"\n [responsive]=\"responsive()\"\n (itemClick)=\"itemClick.emit($event)\"\n (hiddenSeriesChange)=\"toggle($event)\"\n (zoomChange)=\"zoom.set($event)\"\n (measured)=\"measuredWidth.set($event)\"\n ></skdx-chart-root>\n `,\n})\nexport class SkdxAreaChartComponent extends SkdxChartBase {\n protected readonly layout = computed(() => layoutAreaChart(this.input()));\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAAA;;;;AAIG;AAUH;AAoBM,MAAO,sBAAuB,SAAQ,aAAa,CAAA;AAnBzD,IAAA,WAAA,GAAA;;AAoBqB,QAAA,IAAA,CAAA,MAAM,GAAG,QAAQ,CAAC,MAAM,eAAe,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;mFAAC;AAC1E,IAAA;8GAFY,sBAAsB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAtB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,sBAAsB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAdvB;;;;;;;;;;;;AAYT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAbS,sBAAsB,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,CAAA,QAAA,EAAA,MAAA,EAAA,OAAA,EAAA,UAAA,EAAA,YAAA,CAAA,EAAA,OAAA,EAAA,CAAA,WAAA,EAAA,oBAAA,EAAA,YAAA,EAAA,UAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAerB,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBAnBlC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,iBAAiB;AAC3B,oBAAA,UAAU,EAAE,IAAI;oBAChB,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,OAAO,EAAE,CAAC,sBAAsB,CAAC;AACjC,oBAAA,QAAQ,EAAE;;;;;;;;;;;;AAYT,EAAA,CAAA;AACF,iBAAA;;;ACjCD;;AAEG;;"}
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { input, computed, ChangeDetectionStrategy, Component } from '@angular/core';
2
+ import { computed, ChangeDetectionStrategy, Component } from '@angular/core';
3
3
  import { SkdxChartBase, layoutBarChart, SkdxChartRootComponent } from '@skdx/angular-charts/internal';
4
4
 
5
5
  /*
@@ -7,30 +7,27 @@ import { SkdxChartBase, layoutBarChart, SkdxChartRootComponent } from '@skdx/ang
7
7
  * This file is part of the SkandaDX organization.
8
8
  * Licensed under the MIT License. See LICENSE in the repository root.
9
9
  */
10
- /**
11
- * Grouped or stacked vertical bars, one per value.
12
- *
13
- * ```html
14
- * <skdx-bar-chart [series]="[{ name: 'Sales', data: [3, 5, 2] }]" [categories]="['Q1', 'Q2', 'Q3']"></skdx-bar-chart>
15
- * ```
16
- */
10
+ /** Grouped, stacked, horizontal or histogram bars; series may also be lines, areas or ranges. */
17
11
  class SkdxBarChartComponent extends SkdxChartBase {
18
12
  constructor() {
19
13
  super(...arguments);
20
- /** Stack series on top of each other instead of grouping them side by side. */
21
- this.stacked = input(false, /* @ts-ignore */
22
- ...(ngDevMode ? [{ debugName: "stacked" }] : /* istanbul ignore next */ []));
23
- this.layout = computed(() => layoutBarChart({ ...this.input(), stacked: this.stacked() }), /* @ts-ignore */
14
+ this.layout = computed(() => layoutBarChart(this.input()), /* @ts-ignore */
24
15
  ...(ngDevMode ? [{ debugName: "layout" }] : /* istanbul ignore next */ []));
25
16
  }
26
17
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxBarChartComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
27
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: SkdxBarChartComponent, isStandalone: true, selector: "skdx-bar-chart", inputs: { stacked: { classPropertyName: "stacked", publicName: "stacked", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
18
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.4", type: SkdxBarChartComponent, isStandalone: true, selector: "skdx-bar-chart", usesInheritance: true, ngImport: i0, template: `
28
19
  <skdx-chart-root
29
20
  [layout]="layout()"
30
21
  kind="bar"
31
22
  [label]="label() ?? 'Bar chart'"
23
+ [zoomable]="zoomable()"
24
+ [responsive]="responsive()"
25
+ (itemClick)="itemClick.emit($event)"
26
+ (hiddenSeriesChange)="toggle($event)"
27
+ (zoomChange)="zoom.set($event)"
28
+ (measured)="measuredWidth.set($event)"
32
29
  ></skdx-chart-root>
33
- `, isInline: true, dependencies: [{ kind: "component", type: SkdxChartRootComponent, selector: "skdx-chart-root", inputs: ["layout", "kind", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
30
+ `, isInline: true, dependencies: [{ kind: "component", type: SkdxChartRootComponent, selector: "skdx-chart-root", inputs: ["layout", "kind", "label", "zoomable", "responsive"], outputs: ["itemClick", "hiddenSeriesChange", "zoomChange", "measured"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
34
31
  }
35
32
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxBarChartComponent, decorators: [{
36
33
  type: Component,
@@ -44,10 +41,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
44
41
  [layout]="layout()"
45
42
  kind="bar"
46
43
  [label]="label() ?? 'Bar chart'"
44
+ [zoomable]="zoomable()"
45
+ [responsive]="responsive()"
46
+ (itemClick)="itemClick.emit($event)"
47
+ (hiddenSeriesChange)="toggle($event)"
48
+ (zoomChange)="zoom.set($event)"
49
+ (measured)="measuredWidth.set($event)"
47
50
  ></skdx-chart-root>
48
51
  `,
49
52
  }]
50
- }], propDecorators: { stacked: [{ type: i0.Input, args: [{ isSignal: true, alias: "stacked", required: false }] }] } });
53
+ }] });
51
54
 
52
55
  /**
53
56
  * Generated bundle index. Do not edit.
@@ -1 +1 @@
1
- {"version":3,"file":"skdx-angular-charts-bar.mjs","sources":["../../src/bar/index.ts","../../src/bar/skdx-angular-charts-bar.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 layoutBarChart,\n SkdxChartBase,\n SkdxChartRootComponent,\n} from '@skdx/angular-charts/internal';\n\n/**\n * Grouped or stacked vertical bars, one per value.\n *\n * ```html\n * <skdx-bar-chart [series]=\"[{ name: 'Sales', data: [3, 5, 2] }]\" [categories]=\"['Q1', 'Q2', 'Q3']\"></skdx-bar-chart>\n * ```\n */\n@Component({\n selector: 'skdx-bar-chart',\n standalone: true,\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [SkdxChartRootComponent],\n template: `\n <skdx-chart-root\n [layout]=\"layout()\"\n kind=\"bar\"\n [label]=\"label() ?? 'Bar chart'\"\n ></skdx-chart-root>\n `,\n})\nexport class SkdxBarChartComponent extends SkdxChartBase {\n /** Stack series on top of each other instead of grouping them side by side. */\n readonly stacked = input(false);\n\n protected readonly layout = computed(() =>\n layoutBarChart({ ...this.input(), stacked: this.stacked() }),\n );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAAA;;;;AAIG;AAUH;;;;;;AAMG;AAcG,MAAO,qBAAsB,SAAQ,aAAa,CAAA;AAbxD,IAAA,WAAA,GAAA;;;QAeW,IAAA,CAAA,OAAO,GAAG,KAAK,CAAC,KAAK;oFAAC;QAEZ,IAAA,CAAA,MAAM,GAAG,QAAQ,CAAC,MACnC,cAAc,CAAC,EAAE,GAAG,IAAI,CAAC,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,EAAE,CAAC;mFAC7D;AACF,IAAA;8GAPY,qBAAqB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAArB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,qBAAqB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EARtB;;;;;;AAMT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAPS,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;;2FASrB,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBAbjC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,gBAAgB;AAC1B,oBAAA,UAAU,EAAE,IAAI;oBAChB,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,OAAO,EAAE,CAAC,sBAAsB,CAAC;AACjC,oBAAA,QAAQ,EAAE;;;;;;AAMT,EAAA,CAAA;AACF,iBAAA;;;ACjCD;;AAEG;;"}
1
+ {"version":3,"file":"skdx-angular-charts-bar.mjs","sources":["../../src/bar/index.ts","../../src/bar/skdx-angular-charts-bar.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 } from '@angular/core';\n\nimport {\n layoutBarChart,\n SkdxChartBase,\n SkdxChartRootComponent,\n} from '@skdx/angular-charts/internal';\n\n/** Grouped, stacked, horizontal or histogram bars; series may also be lines, areas or ranges. */\n@Component({\n selector: 'skdx-bar-chart',\n standalone: true,\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [SkdxChartRootComponent],\n template: `\n <skdx-chart-root\n [layout]=\"layout()\"\n kind=\"bar\"\n [label]=\"label() ?? 'Bar chart'\"\n [zoomable]=\"zoomable()\"\n [responsive]=\"responsive()\"\n (itemClick)=\"itemClick.emit($event)\"\n (hiddenSeriesChange)=\"toggle($event)\"\n (zoomChange)=\"zoom.set($event)\"\n (measured)=\"measuredWidth.set($event)\"\n ></skdx-chart-root>\n `,\n})\nexport class SkdxBarChartComponent extends SkdxChartBase {\n protected readonly layout = computed(() => layoutBarChart(this.input()));\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAAA;;;;AAIG;AAUH;AAoBM,MAAO,qBAAsB,SAAQ,aAAa,CAAA;AAnBxD,IAAA,WAAA,GAAA;;AAoBqB,QAAA,IAAA,CAAA,MAAM,GAAG,QAAQ,CAAC,MAAM,cAAc,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;mFAAC;AACzE,IAAA;8GAFY,qBAAqB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAArB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,qBAAqB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAdtB;;;;;;;;;;;;AAYT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAbS,sBAAsB,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,CAAA,QAAA,EAAA,MAAA,EAAA,OAAA,EAAA,UAAA,EAAA,YAAA,CAAA,EAAA,OAAA,EAAA,CAAA,WAAA,EAAA,oBAAA,EAAA,YAAA,EAAA,UAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAerB,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBAnBjC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,gBAAgB;AAC1B,oBAAA,UAAU,EAAE,IAAI;oBAChB,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,OAAO,EAAE,CAAC,sBAAsB,CAAC;AACjC,oBAAA,QAAQ,EAAE;;;;;;;;;;;;AAYT,EAAA,CAAA;AACF,iBAAA;;;ACjCD;;AAEG;;"}
@@ -7,23 +7,29 @@ import { SkdxSizedBase, layoutBoxplot, SkdxChartRootComponent } from '@skdx/angu
7
7
  * This file is part of the SkandaDX organization.
8
8
  * Licensed under the MIT License. See LICENSE in the repository root.
9
9
  */
10
- /** Quartile boxes with Tukey whiskers and outliers, one per series. */
10
+ /** One Tukey box per series over its raw samples. */
11
11
  class SkdxBoxplotComponent extends SkdxSizedBase {
12
12
  constructor() {
13
13
  super(...arguments);
14
14
  this.series = input.required(/* @ts-ignore */
15
15
  ...(ngDevMode ? [{ debugName: "series" }] : /* istanbul ignore next */ []));
16
- this.l = computed(() => layoutBoxplot({ ...this.sized(), series: this.series() }), /* @ts-ignore */
17
- ...(ngDevMode ? [{ debugName: "l" }] : /* istanbul ignore next */ []));
16
+ this.layout = computed(() => layoutBoxplot({ ...this.sized(), series: this.series() }), /* @ts-ignore */
17
+ ...(ngDevMode ? [{ debugName: "layout" }] : /* istanbul ignore next */ []));
18
18
  }
19
19
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxBoxplotComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
20
20
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: SkdxBoxplotComponent, isStandalone: true, selector: "skdx-boxplot", inputs: { series: { classPropertyName: "series", publicName: "series", isSignal: true, isRequired: true, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
21
21
  <skdx-chart-root
22
- [layout]="l()"
22
+ [layout]="layout()"
23
23
  kind="boxplot"
24
24
  [label]="label() ?? 'Box plot'"
25
+ [zoomable]="zoomable()"
26
+ [responsive]="responsive()"
27
+ (itemClick)="itemClick.emit($event)"
28
+ (hiddenSeriesChange)="toggle($event)"
29
+ (zoomChange)="zoom.set($event)"
30
+ (measured)="measuredWidth.set($event)"
25
31
  ></skdx-chart-root>
26
- `, isInline: true, dependencies: [{ kind: "component", type: SkdxChartRootComponent, selector: "skdx-chart-root", inputs: ["layout", "kind", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
32
+ `, isInline: true, dependencies: [{ kind: "component", type: SkdxChartRootComponent, selector: "skdx-chart-root", inputs: ["layout", "kind", "label", "zoomable", "responsive"], outputs: ["itemClick", "hiddenSeriesChange", "zoomChange", "measured"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
27
33
  }
28
34
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxBoxplotComponent, decorators: [{
29
35
  type: Component,
@@ -34,9 +40,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
34
40
  imports: [SkdxChartRootComponent],
35
41
  template: `
36
42
  <skdx-chart-root
37
- [layout]="l()"
43
+ [layout]="layout()"
38
44
  kind="boxplot"
39
45
  [label]="label() ?? 'Box plot'"
46
+ [zoomable]="zoomable()"
47
+ [responsive]="responsive()"
48
+ (itemClick)="itemClick.emit($event)"
49
+ (hiddenSeriesChange)="toggle($event)"
50
+ (zoomChange)="zoom.set($event)"
51
+ (measured)="measuredWidth.set($event)"
40
52
  ></skdx-chart-root>
41
53
  `,
42
54
  }]
@@ -1 +1 @@
1
- {"version":3,"file":"skdx-angular-charts-boxplot.mjs","sources":["../../src/boxplot/index.ts","../../src/boxplot/skdx-angular-charts-boxplot.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 layoutBoxplot,\n type Series,\n SkdxChartRootComponent,\n SkdxSizedBase,\n} from '@skdx/angular-charts/internal';\n\n/** Quartile boxes with Tukey whiskers and outliers, one per series. */\n@Component({\n selector: 'skdx-boxplot',\n standalone: true,\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [SkdxChartRootComponent],\n template: `\n <skdx-chart-root\n [layout]=\"l()\"\n kind=\"boxplot\"\n [label]=\"label() ?? 'Box plot'\"\n ></skdx-chart-root>\n `,\n})\nexport class SkdxBoxplotComponent extends SkdxSizedBase {\n readonly series = input.required<Series[]>();\n\n protected readonly l = computed(() => layoutBoxplot({ ...this.sized(), series: this.series() }));\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAAA;;;;AAIG;AAWH;AAcM,MAAO,oBAAqB,SAAQ,aAAa,CAAA;AAbvD,IAAA,WAAA,GAAA;;QAcW,IAAA,CAAA,MAAM,GAAG,KAAK,CAAC,QAAQ;mFAAY;QAEzB,IAAA,CAAA,CAAC,GAAG,QAAQ,CAAC,MAAM,aAAa,CAAC,EAAE,GAAG,IAAI,CAAC,KAAK,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,EAAE,CAAC;8EAAC;AACjG,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,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EARrB;;;;;;AAMT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAPS,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;;2FASrB,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAbhC,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;;;;;;AAMT,EAAA,CAAA;AACF,iBAAA;;;AC5BD;;AAEG;;"}
1
+ {"version":3,"file":"skdx-angular-charts-boxplot.mjs","sources":["../../src/boxplot/index.ts","../../src/boxplot/skdx-angular-charts-boxplot.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 layoutBoxplot,\n SkdxChartRootComponent,\n SkdxSizedBase,\n type Series,\n} from '@skdx/angular-charts/internal';\n\n/** One Tukey box per series over its raw samples. */\n@Component({\n selector: 'skdx-boxplot',\n standalone: true,\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [SkdxChartRootComponent],\n template: `\n <skdx-chart-root\n [layout]=\"layout()\"\n kind=\"boxplot\"\n [label]=\"label() ?? 'Box plot'\"\n [zoomable]=\"zoomable()\"\n [responsive]=\"responsive()\"\n (itemClick)=\"itemClick.emit($event)\"\n (hiddenSeriesChange)=\"toggle($event)\"\n (zoomChange)=\"zoom.set($event)\"\n (measured)=\"measuredWidth.set($event)\"\n ></skdx-chart-root>\n `,\n})\nexport class SkdxBoxplotComponent extends SkdxSizedBase {\n readonly series = input.required<Series[]>();\n\n protected readonly layout = computed(() =>\n layoutBoxplot({ ...this.sized(), series: this.series() }),\n );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAAA;;;;AAIG;AAWH;AAoBM,MAAO,oBAAqB,SAAQ,aAAa,CAAA;AAnBvD,IAAA,WAAA,GAAA;;QAoBW,IAAA,CAAA,MAAM,GAAG,KAAK,CAAC,QAAQ;mFAAY;QAEzB,IAAA,CAAA,MAAM,GAAG,QAAQ,CAAC,MACnC,aAAa,CAAC,EAAE,GAAG,IAAI,CAAC,KAAK,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,EAAE,CAAC;mFAC1D;AACF,IAAA;8GANY,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,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAdrB;;;;;;;;;;;;AAYT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAbS,sBAAsB,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,CAAA,QAAA,EAAA,MAAA,EAAA,OAAA,EAAA,UAAA,EAAA,YAAA,CAAA,EAAA,OAAA,EAAA,CAAA,WAAA,EAAA,oBAAA,EAAA,YAAA,EAAA,UAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAerB,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAnBhC,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;;;;;;;;;;;;AAYT,EAAA,CAAA;AACF,iBAAA;;;AClCD;;AAEG;;"}
@@ -7,23 +7,50 @@ import { SkdxSizedBase, layoutCandlestick, SkdxChartRootComponent } from '@skdx/
7
7
  * This file is part of the SkandaDX organization.
8
8
  * Licensed under the MIT License. See LICENSE in the repository root.
9
9
  */
10
- /** Open/high/low/close candles, green when closing higher. */
10
+ /** Candles or OHLC bars on a time axis, with an optional volume pane, references, zoom and brush. */
11
11
  class SkdxCandlestickChartComponent extends SkdxSizedBase {
12
12
  constructor() {
13
13
  super(...arguments);
14
14
  this.data = input.required(/* @ts-ignore */
15
15
  ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
16
- this.l = computed(() => layoutCandlestick({ ...this.sized(), data: this.data() }), /* @ts-ignore */
17
- ...(ngDevMode ? [{ debugName: "l" }] : /* istanbul ignore next */ []));
16
+ this.scale = input(/* @ts-ignore */
17
+ ...(ngDevMode ? [undefined, { debugName: "scale" }] : /* istanbul ignore next */ []));
18
+ this.variant = input(/* @ts-ignore */
19
+ ...(ngDevMode ? [undefined, { debugName: "variant" }] : /* istanbul ignore next */ []));
20
+ this.xAxis = input(/* @ts-ignore */
21
+ ...(ngDevMode ? [undefined, { debugName: "xAxis" }] : /* istanbul ignore next */ []));
22
+ this.references = input(/* @ts-ignore */
23
+ ...(ngDevMode ? [undefined, { debugName: "references" }] : /* istanbul ignore next */ []));
24
+ this.brush = input(false, /* @ts-ignore */
25
+ ...(ngDevMode ? [{ debugName: "brush" }] : /* istanbul ignore next */ []));
26
+ this.crosshair = input(false, /* @ts-ignore */
27
+ ...(ngDevMode ? [{ debugName: "crosshair" }] : /* istanbul ignore next */ []));
28
+ this.layout = computed(() => layoutCandlestick({
29
+ ...this.sized(),
30
+ data: this.data(),
31
+ scale: this.scale(),
32
+ variant: this.variant(),
33
+ xAxis: this.xAxis(),
34
+ references: this.references(),
35
+ brush: this.brush(),
36
+ crosshair: this.crosshair(),
37
+ }), /* @ts-ignore */
38
+ ...(ngDevMode ? [{ debugName: "layout" }] : /* istanbul ignore next */ []));
18
39
  }
19
40
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxCandlestickChartComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
20
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: SkdxCandlestickChartComponent, isStandalone: true, selector: "skdx-candlestick-chart", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
41
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: SkdxCandlestickChartComponent, isStandalone: true, selector: "skdx-candlestick-chart", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, scale: { classPropertyName: "scale", publicName: "scale", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, xAxis: { classPropertyName: "xAxis", publicName: "xAxis", isSignal: true, isRequired: false, transformFunction: null }, references: { classPropertyName: "references", publicName: "references", isSignal: true, isRequired: false, transformFunction: null }, brush: { classPropertyName: "brush", publicName: "brush", isSignal: true, isRequired: false, transformFunction: null }, crosshair: { classPropertyName: "crosshair", publicName: "crosshair", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
21
42
  <skdx-chart-root
22
- [layout]="l()"
43
+ [layout]="layout()"
23
44
  kind="candlestick"
24
45
  [label]="label() ?? 'Candlestick chart'"
46
+ [zoomable]="zoomable()"
47
+ [responsive]="responsive()"
48
+ (itemClick)="itemClick.emit($event)"
49
+ (hiddenSeriesChange)="toggle($event)"
50
+ (zoomChange)="zoom.set($event)"
51
+ (measured)="measuredWidth.set($event)"
25
52
  ></skdx-chart-root>
26
- `, isInline: true, dependencies: [{ kind: "component", type: SkdxChartRootComponent, selector: "skdx-chart-root", inputs: ["layout", "kind", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
53
+ `, isInline: true, dependencies: [{ kind: "component", type: SkdxChartRootComponent, selector: "skdx-chart-root", inputs: ["layout", "kind", "label", "zoomable", "responsive"], outputs: ["itemClick", "hiddenSeriesChange", "zoomChange", "measured"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
27
54
  }
28
55
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxCandlestickChartComponent, decorators: [{
29
56
  type: Component,
@@ -34,13 +61,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
34
61
  imports: [SkdxChartRootComponent],
35
62
  template: `
36
63
  <skdx-chart-root
37
- [layout]="l()"
64
+ [layout]="layout()"
38
65
  kind="candlestick"
39
66
  [label]="label() ?? 'Candlestick chart'"
67
+ [zoomable]="zoomable()"
68
+ [responsive]="responsive()"
69
+ (itemClick)="itemClick.emit($event)"
70
+ (hiddenSeriesChange)="toggle($event)"
71
+ (zoomChange)="zoom.set($event)"
72
+ (measured)="measuredWidth.set($event)"
40
73
  ></skdx-chart-root>
41
74
  `,
42
75
  }]
43
- }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }] } });
76
+ }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }], scale: [{ type: i0.Input, args: [{ isSignal: true, alias: "scale", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], xAxis: [{ type: i0.Input, args: [{ isSignal: true, alias: "xAxis", required: false }] }], references: [{ type: i0.Input, args: [{ isSignal: true, alias: "references", required: false }] }], brush: [{ type: i0.Input, args: [{ isSignal: true, alias: "brush", required: false }] }], crosshair: [{ type: i0.Input, args: [{ isSignal: true, alias: "crosshair", required: false }] }] } });
44
77
 
45
78
  /**
46
79
  * Generated bundle index. Do not edit.
@@ -1 +1 @@
1
- {"version":3,"file":"skdx-angular-charts-candlestick.mjs","sources":["../../src/candlestick/index.ts","../../src/candlestick/skdx-angular-charts-candlestick.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 Candle,\n layoutCandlestick,\n SkdxChartRootComponent,\n SkdxSizedBase,\n} from '@skdx/angular-charts/internal';\n\n/** Open/high/low/close candles, green when closing higher. */\n@Component({\n selector: 'skdx-candlestick-chart',\n standalone: true,\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [SkdxChartRootComponent],\n template: `\n <skdx-chart-root\n [layout]=\"l()\"\n kind=\"candlestick\"\n [label]=\"label() ?? 'Candlestick chart'\"\n ></skdx-chart-root>\n `,\n})\nexport class SkdxCandlestickChartComponent extends SkdxSizedBase {\n readonly data = input.required<Candle[]>();\n\n protected readonly l = computed(() => layoutCandlestick({ ...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;AAcM,MAAO,6BAA8B,SAAQ,aAAa,CAAA;AAbhE,IAAA,WAAA,GAAA;;QAcW,IAAA,CAAA,IAAI,GAAG,KAAK,CAAC,QAAQ;iFAAY;QAEvB,IAAA,CAAA,CAAC,GAAG,QAAQ,CAAC,MAAM,iBAAiB,CAAC,EAAE,GAAG,IAAI,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC;8EAAC;AACjG,IAAA;8GAJY,6BAA6B,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAA7B,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,6BAA6B,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,wBAAA,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,EAR9B;;;;;;AAMT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAPS,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;;2FASrB,6BAA6B,EAAA,UAAA,EAAA,CAAA;kBAbzC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,wBAAwB;AAClC,oBAAA,UAAU,EAAE,IAAI;oBAChB,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,OAAO,EAAE,CAAC,sBAAsB,CAAC;AACjC,oBAAA,QAAQ,EAAE;;;;;;AAMT,EAAA,CAAA;AACF,iBAAA;;;AC5BD;;AAEG;;"}
1
+ {"version":3,"file":"skdx-angular-charts-candlestick.mjs","sources":["../../src/candlestick/index.ts","../../src/candlestick/skdx-angular-charts-candlestick.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 layoutCandlestick,\n SkdxChartRootComponent,\n SkdxSizedBase,\n type AxisOptions,\n type Candle,\n type Reference,\n} from '@skdx/angular-charts/internal';\n\n/** Candles or OHLC bars on a time axis, with an optional volume pane, references, zoom and brush. */\n@Component({\n selector: 'skdx-candlestick-chart',\n standalone: true,\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [SkdxChartRootComponent],\n template: `\n <skdx-chart-root\n [layout]=\"layout()\"\n kind=\"candlestick\"\n [label]=\"label() ?? 'Candlestick chart'\"\n [zoomable]=\"zoomable()\"\n [responsive]=\"responsive()\"\n (itemClick)=\"itemClick.emit($event)\"\n (hiddenSeriesChange)=\"toggle($event)\"\n (zoomChange)=\"zoom.set($event)\"\n (measured)=\"measuredWidth.set($event)\"\n ></skdx-chart-root>\n `,\n})\nexport class SkdxCandlestickChartComponent extends SkdxSizedBase {\n readonly data = input.required<Candle[]>();\n readonly scale = input<'linear' | 'log'>();\n readonly variant = input<'candlestick' | 'ohlc'>();\n readonly xAxis = input<Pick<AxisOptions, 'format'>>();\n readonly references = input<Reference[]>();\n readonly brush = input(false);\n readonly crosshair = input(false);\n\n protected readonly layout = computed(() =>\n layoutCandlestick({\n ...this.sized(),\n data: this.data(),\n scale: this.scale(),\n variant: this.variant(),\n xAxis: this.xAxis(),\n references: this.references(),\n brush: this.brush(),\n crosshair: this.crosshair(),\n }),\n );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -7,7 +7,7 @@ import { SkdxSizedBase, layoutChord, SkdxChartRootComponent } from '@skdx/angula
7
7
  * This file is part of the SkandaDX organization.
8
8
  * Licensed under the MIT License. See LICENSE in the repository root.
9
9
  */
10
- /** Ribbons between groups sized by the flow matrix. */
10
+ /** Groups around a circle with ribbons for the flows between them. */
11
11
  class SkdxChordChartComponent extends SkdxSizedBase {
12
12
  constructor() {
13
13
  super(...arguments);
@@ -16,17 +16,23 @@ class SkdxChordChartComponent extends SkdxSizedBase {
16
16
  /** `matrix[i][j]` is the flow from `i` to `j`. */
17
17
  this.matrix = input.required(/* @ts-ignore */
18
18
  ...(ngDevMode ? [{ debugName: "matrix" }] : /* istanbul ignore next */ []));
19
- this.l = computed(() => layoutChord({ ...this.sized(), names: this.names(), matrix: this.matrix() }), /* @ts-ignore */
20
- ...(ngDevMode ? [{ debugName: "l" }] : /* istanbul ignore next */ []));
19
+ this.layout = computed(() => layoutChord({ ...this.sized(), names: this.names(), matrix: this.matrix() }), /* @ts-ignore */
20
+ ...(ngDevMode ? [{ debugName: "layout" }] : /* istanbul ignore next */ []));
21
21
  }
22
22
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxChordChartComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
23
23
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: SkdxChordChartComponent, isStandalone: true, selector: "skdx-chord-chart", inputs: { names: { classPropertyName: "names", publicName: "names", isSignal: true, isRequired: true, transformFunction: null }, matrix: { classPropertyName: "matrix", publicName: "matrix", isSignal: true, isRequired: true, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
24
24
  <skdx-chart-root
25
- [layout]="l()"
25
+ [layout]="layout()"
26
26
  kind="chord"
27
27
  [label]="label() ?? 'Chord chart'"
28
+ [zoomable]="zoomable()"
29
+ [responsive]="responsive()"
30
+ (itemClick)="itemClick.emit($event)"
31
+ (hiddenSeriesChange)="toggle($event)"
32
+ (zoomChange)="zoom.set($event)"
33
+ (measured)="measuredWidth.set($event)"
28
34
  ></skdx-chart-root>
29
- `, isInline: true, dependencies: [{ kind: "component", type: SkdxChartRootComponent, selector: "skdx-chart-root", inputs: ["layout", "kind", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
35
+ `, isInline: true, dependencies: [{ kind: "component", type: SkdxChartRootComponent, selector: "skdx-chart-root", inputs: ["layout", "kind", "label", "zoomable", "responsive"], outputs: ["itemClick", "hiddenSeriesChange", "zoomChange", "measured"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
30
36
  }
31
37
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: SkdxChordChartComponent, decorators: [{
32
38
  type: Component,
@@ -37,9 +43,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
37
43
  imports: [SkdxChartRootComponent],
38
44
  template: `
39
45
  <skdx-chart-root
40
- [layout]="l()"
46
+ [layout]="layout()"
41
47
  kind="chord"
42
48
  [label]="label() ?? 'Chord chart'"
49
+ [zoomable]="zoomable()"
50
+ [responsive]="responsive()"
51
+ (itemClick)="itemClick.emit($event)"
52
+ (hiddenSeriesChange)="toggle($event)"
53
+ (zoomChange)="zoom.set($event)"
54
+ (measured)="measuredWidth.set($event)"
43
55
  ></skdx-chart-root>
44
56
  `,
45
57
  }]
@@ -1 +1 @@
1
- {"version":3,"file":"skdx-angular-charts-chord.mjs","sources":["../../src/chord/index.ts","../../src/chord/skdx-angular-charts-chord.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 { layoutChord, SkdxChartRootComponent, SkdxSizedBase } from '@skdx/angular-charts/internal';\n\n/** Ribbons between groups sized by the flow matrix. */\n@Component({\n selector: 'skdx-chord-chart',\n standalone: true,\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [SkdxChartRootComponent],\n template: `\n <skdx-chart-root\n [layout]=\"l()\"\n kind=\"chord\"\n [label]=\"label() ?? 'Chord chart'\"\n ></skdx-chart-root>\n `,\n})\nexport class SkdxChordChartComponent extends SkdxSizedBase {\n readonly names = input.required<string[]>();\n /** `matrix[i][j]` is the flow from `i` to `j`. */\n readonly matrix = input.required<number[][]>();\n\n protected readonly l = computed(() =>\n layoutChord({ ...this.sized(), names: this.names(), matrix: this.matrix() }),\n );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAAA;;;;AAIG;AAMH;AAcM,MAAO,uBAAwB,SAAQ,aAAa,CAAA;AAb1D,IAAA,WAAA,GAAA;;QAcW,IAAA,CAAA,KAAK,GAAG,KAAK,CAAC,QAAQ;kFAAY;;QAElC,IAAA,CAAA,MAAM,GAAG,KAAK,CAAC,QAAQ;mFAAc;AAE3B,QAAA,IAAA,CAAA,CAAC,GAAG,QAAQ,CAAC,MAC9B,WAAW,CAAC,EAAE,GAAG,IAAI,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,EAAE,CAAC;8EAC7E;AACF,IAAA;8GARY,uBAAuB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAvB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,uBAAuB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EARxB;;;;;;AAMT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAPS,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;;2FASrB,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBAbnC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,kBAAkB;AAC5B,oBAAA,UAAU,EAAE,IAAI;oBAChB,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,OAAO,EAAE,CAAC,sBAAsB,CAAC;AACjC,oBAAA,QAAQ,EAAE;;;;;;AAMT,EAAA,CAAA;AACF,iBAAA;;;ACvBD;;AAEG;;"}
1
+ {"version":3,"file":"skdx-angular-charts-chord.mjs","sources":["../../src/chord/index.ts","../../src/chord/skdx-angular-charts-chord.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 { layoutChord, SkdxChartRootComponent, SkdxSizedBase } from '@skdx/angular-charts/internal';\n\n/** Groups around a circle with ribbons for the flows between them. */\n@Component({\n selector: 'skdx-chord-chart',\n standalone: true,\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [SkdxChartRootComponent],\n template: `\n <skdx-chart-root\n [layout]=\"layout()\"\n kind=\"chord\"\n [label]=\"label() ?? 'Chord chart'\"\n [zoomable]=\"zoomable()\"\n [responsive]=\"responsive()\"\n (itemClick)=\"itemClick.emit($event)\"\n (hiddenSeriesChange)=\"toggle($event)\"\n (zoomChange)=\"zoom.set($event)\"\n (measured)=\"measuredWidth.set($event)\"\n ></skdx-chart-root>\n `,\n})\nexport class SkdxChordChartComponent extends SkdxSizedBase {\n readonly names = input.required<string[]>();\n /** `matrix[i][j]` is the flow from `i` to `j`. */\n readonly matrix = input.required<number[][]>();\n\n protected readonly layout = computed(() =>\n layoutChord({ ...this.sized(), names: this.names(), matrix: this.matrix() }),\n );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAAA;;;;AAIG;AAMH;AAoBM,MAAO,uBAAwB,SAAQ,aAAa,CAAA;AAnB1D,IAAA,WAAA,GAAA;;QAoBW,IAAA,CAAA,KAAK,GAAG,KAAK,CAAC,QAAQ;kFAAY;;QAElC,IAAA,CAAA,MAAM,GAAG,KAAK,CAAC,QAAQ;mFAAc;AAE3B,QAAA,IAAA,CAAA,MAAM,GAAG,QAAQ,CAAC,MACnC,WAAW,CAAC,EAAE,GAAG,IAAI,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,EAAE,CAAC;mFAC7E;AACF,IAAA;8GARY,uBAAuB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAvB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,uBAAuB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAdxB;;;;;;;;;;;;AAYT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAbS,sBAAsB,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,CAAA,QAAA,EAAA,MAAA,EAAA,OAAA,EAAA,UAAA,EAAA,YAAA,CAAA,EAAA,OAAA,EAAA,CAAA,WAAA,EAAA,oBAAA,EAAA,YAAA,EAAA,UAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAerB,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBAnBnC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,kBAAkB;AAC5B,oBAAA,UAAU,EAAE,IAAI;oBAChB,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,OAAO,EAAE,CAAC,sBAAsB,CAAC;AACjC,oBAAA,QAAQ,EAAE;;;;;;;;;;;;AAYT,EAAA,CAAA;AACF,iBAAA;;;AC7BD;;AAEG;;"}