@oicl/openbridge-webcomponents 2.0.0-next.94 → 2.0.0-next.95
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.
- package/bundle/openbridge-webcomponents.bundle.js +153 -23
- package/bundle/openbridge-webcomponents.bundle.js.map +1 -1
- package/custom-elements.json +66 -49
- package/dist/building-blocks/chart-line/chart-line-base.d.ts +95 -33
- package/dist/building-blocks/chart-line/chart-line-base.d.ts.map +1 -1
- package/dist/building-blocks/chart-line/chart-line-base.js +88 -23
- package/dist/building-blocks/chart-line/chart-line-base.js.map +1 -1
- package/dist/charthelpers/index.d.ts +1 -0
- package/dist/charthelpers/index.d.ts.map +1 -1
- package/dist/charthelpers/index.js +4 -0
- package/dist/charthelpers/index.js.map +1 -1
- package/dist/charthelpers/x-value.d.ts +72 -0
- package/dist/charthelpers/x-value.d.ts.map +1 -0
- package/dist/charthelpers/x-value.js +60 -0
- package/dist/charthelpers/x-value.js.map +1 -0
- package/dist/navigation-instruments/gauge-trend/gauge-trend.d.ts +16 -1
- package/dist/navigation-instruments/gauge-trend/gauge-trend.d.ts.map +1 -1
- package/dist/navigation-instruments/gauge-trend/gauge-trend.js +12 -0
- package/dist/navigation-instruments/gauge-trend/gauge-trend.js.map +1 -1
- package/package.json +1 -1
package/custom-elements.json
CHANGED
|
@@ -31323,10 +31323,10 @@
|
|
|
31323
31323
|
"kind": "field",
|
|
31324
31324
|
"name": "data",
|
|
31325
31325
|
"type": {
|
|
31326
|
-
"text": "Array<{label
|
|
31326
|
+
"text": "Array<{label?: string, x?: number|string|Date|TemporalLike, value: number}>"
|
|
31327
31327
|
},
|
|
31328
31328
|
"default": "[]",
|
|
31329
|
-
"description": "Single-series data array.
|
|
31329
|
+
"description": "Single-series data array. In `category` mode each item needs `label`; in `time`/`number` mode each item needs `x` (epoch ms, ISO string, Date, or Temporal object — `label` is parsed as a fallback). Used when `datasets` is not provided. Points are drawn in array order (no sorting); Temporal Plain* values are interpreted in the system time zone.",
|
|
31330
31330
|
"inheritedFrom": {
|
|
31331
31331
|
"name": "ObcChartLineBase",
|
|
31332
31332
|
"module": "src/building-blocks/chart-line/chart-line-base.ts"
|
|
@@ -31336,10 +31336,10 @@
|
|
|
31336
31336
|
"kind": "field",
|
|
31337
31337
|
"name": "datasets",
|
|
31338
31338
|
"type": {
|
|
31339
|
-
"text": "ChartDataset<'line', (number | {x: string|
|
|
31339
|
+
"text": "ChartDataset<'line', (number | {x: number|string|Date|TemporalLike; y: number})[]>[]"
|
|
31340
31340
|
},
|
|
31341
31341
|
"default": "undefined",
|
|
31342
|
-
"description": "Multi-series Chart.js datasets. Takes precedence over `data`. Each dataset can have `label`, `data` (numeric array or `{x, y}` points), and visual properties like `borderColor`, `backgroundColor`, `fill`, etc.",
|
|
31342
|
+
"description": "Multi-series Chart.js datasets. Takes precedence over `data`. Each dataset can have `label`, `data` (numeric array or `{x, y}` points), and visual properties like `borderColor`, `backgroundColor`, `fill`, etc. In `time`/`number` mode point x-values are normalized like single-series `x`.",
|
|
31343
31343
|
"inheritedFrom": {
|
|
31344
31344
|
"name": "ObcChartLineBase",
|
|
31345
31345
|
"module": "src/building-blocks/chart-line/chart-line-base.ts"
|
|
@@ -31464,9 +31464,9 @@
|
|
|
31464
31464
|
"kind": "field",
|
|
31465
31465
|
"name": "xAxisType",
|
|
31466
31466
|
"type": {
|
|
31467
|
-
"text": "'category'|'time'"
|
|
31467
|
+
"text": "'category'|'time'|'number'"
|
|
31468
31468
|
},
|
|
31469
|
-
"description": "X-axis mode. `'category'` for labeled data points
|
|
31469
|
+
"description": "X-axis mode. `'category'` for labeled, evenly spaced data points; `'time'` for time-based data positioned proportionally (numbers are always epoch ms — `xStepSize`/`xTicksLimit` operate in ms); `'number'` for plain numeric x-values. Default: `'category'`.",
|
|
31470
31470
|
"attribute": "xAxisType",
|
|
31471
31471
|
"inheritedFrom": {
|
|
31472
31472
|
"name": "ObcChartLineBase",
|
|
@@ -31643,7 +31643,7 @@
|
|
|
31643
31643
|
"type": {
|
|
31644
31644
|
"text": "'minutes'|'date'"
|
|
31645
31645
|
},
|
|
31646
|
-
"description": "Time axis label format when `xAxisType='time'`. `'date'` shows
|
|
31646
|
+
"description": "Time axis label format when `xAxisType='time'`. `'date'` shows a locale date, `'minutes'` shows minutes relative to the latest data point. Default: `'date'`.",
|
|
31647
31647
|
"attribute": "timeDisplay",
|
|
31648
31648
|
"inheritedFrom": {
|
|
31649
31649
|
"name": "ObcChartLineBase",
|
|
@@ -32103,7 +32103,7 @@
|
|
|
32103
32103
|
{
|
|
32104
32104
|
"name": "data",
|
|
32105
32105
|
"type": {
|
|
32106
|
-
"text": "| number[]\n |
|
|
32106
|
+
"text": "| number[]\n | {x: number; y: number}[]\n | ChartDataset<'line', ChartLinePoint[]>"
|
|
32107
32107
|
},
|
|
32108
32108
|
"description": "Either numeric values array or existing dataset to normalize"
|
|
32109
32109
|
},
|
|
@@ -32139,14 +32139,14 @@
|
|
|
32139
32139
|
"privacy": "protected",
|
|
32140
32140
|
"return": {
|
|
32141
32141
|
"type": {
|
|
32142
|
-
"text": "ChartDataset<'line',
|
|
32142
|
+
"text": "ChartDataset<'line', ChartLinePoint[]>[]"
|
|
32143
32143
|
}
|
|
32144
32144
|
},
|
|
32145
32145
|
"parameters": [
|
|
32146
32146
|
{
|
|
32147
32147
|
"name": "values",
|
|
32148
32148
|
"type": {
|
|
32149
|
-
"text": "number[]"
|
|
32149
|
+
"text": "number[] | {x: number; y: number}[]"
|
|
32150
32150
|
}
|
|
32151
32151
|
},
|
|
32152
32152
|
{
|
|
@@ -32156,7 +32156,7 @@
|
|
|
32156
32156
|
}
|
|
32157
32157
|
}
|
|
32158
32158
|
],
|
|
32159
|
-
"description": "Create threshold mode datasets: invisible baseline + main dataset with
|
|
32159
|
+
"description": "Create threshold mode datasets: invisible baseline + main dataset with\nabove/below fills. Accepts plain values (category mode) or {x, y} points\n(time/number mode); the baseline mirrors the input x-positions.",
|
|
32160
32160
|
"inheritedFrom": {
|
|
32161
32161
|
"name": "ObcChartLineBase",
|
|
32162
32162
|
"module": "src/building-blocks/chart-line/chart-line-base.ts"
|
|
@@ -32166,7 +32166,7 @@
|
|
|
32166
32166
|
"kind": "method",
|
|
32167
32167
|
"name": "prepareMultiSeriesDatasets",
|
|
32168
32168
|
"privacy": "protected",
|
|
32169
|
-
"description": "Prepare normalized datasets for multi-series charts",
|
|
32169
|
+
"description": "Prepare normalized datasets for multi-series charts.\nIn time/number mode every point's x is normalized (epoch ms / number)\nso strings, Dates and Temporal objects position correctly.",
|
|
32170
32170
|
"inheritedFrom": {
|
|
32171
32171
|
"name": "ObcChartLineBase",
|
|
32172
32172
|
"module": "src/building-blocks/chart-line/chart-line-base.ts"
|
|
@@ -32176,7 +32176,7 @@
|
|
|
32176
32176
|
"kind": "method",
|
|
32177
32177
|
"name": "prepareSingleSeriesDatasets",
|
|
32178
32178
|
"privacy": "protected",
|
|
32179
|
-
"description": "Prepare datasets for single-series charts
|
|
32179
|
+
"description": "Prepare datasets for single-series charts.\nCategory mode: labels + numeric values (unchanged legacy path).\nTime/number mode: normalized {x, y} points on a linear scale.\nHandles both regular and threshold fill modes.",
|
|
32180
32180
|
"inheritedFrom": {
|
|
32181
32181
|
"name": "ObcChartLineBase",
|
|
32182
32182
|
"module": "src/building-blocks/chart-line/chart-line-base.ts"
|
|
@@ -32407,9 +32407,9 @@
|
|
|
32407
32407
|
{
|
|
32408
32408
|
"name": "xAxisType",
|
|
32409
32409
|
"type": {
|
|
32410
|
-
"text": "'category'|'time'"
|
|
32410
|
+
"text": "'category'|'time'|'number'"
|
|
32411
32411
|
},
|
|
32412
|
-
"description": "X-axis mode. `'category'` for labeled data points
|
|
32412
|
+
"description": "X-axis mode. `'category'` for labeled, evenly spaced data points; `'time'` for time-based data positioned proportionally (numbers are always epoch ms — `xStepSize`/`xTicksLimit` operate in ms); `'number'` for plain numeric x-values. Default: `'category'`.",
|
|
32413
32413
|
"fieldName": "xAxisType",
|
|
32414
32414
|
"inheritedFrom": {
|
|
32415
32415
|
"name": "ObcChartLineBase",
|
|
@@ -32523,7 +32523,7 @@
|
|
|
32523
32523
|
"type": {
|
|
32524
32524
|
"text": "'minutes'|'date'"
|
|
32525
32525
|
},
|
|
32526
|
-
"description": "Time axis label format when `xAxisType='time'`. `'date'` shows
|
|
32526
|
+
"description": "Time axis label format when `xAxisType='time'`. `'date'` shows a locale date, `'minutes'` shows minutes relative to the latest data point. Default: `'date'`.",
|
|
32527
32527
|
"fieldName": "timeDisplay",
|
|
32528
32528
|
"inheritedFrom": {
|
|
32529
32529
|
"name": "ObcChartLineBase",
|
|
@@ -33211,10 +33211,10 @@
|
|
|
33211
33211
|
"kind": "field",
|
|
33212
33212
|
"name": "data",
|
|
33213
33213
|
"type": {
|
|
33214
|
-
"text": "Array<{label
|
|
33214
|
+
"text": "Array<{label?: string, x?: number|string|Date|TemporalLike, value: number}>"
|
|
33215
33215
|
},
|
|
33216
33216
|
"default": "[]",
|
|
33217
|
-
"description": "Single-series data array.
|
|
33217
|
+
"description": "Single-series data array. In `category` mode each item needs `label`; in `time`/`number` mode each item needs `x` (epoch ms, ISO string, Date, or Temporal object — `label` is parsed as a fallback). Used when `datasets` is not provided. Points are drawn in array order (no sorting); Temporal Plain* values are interpreted in the system time zone.",
|
|
33218
33218
|
"inheritedFrom": {
|
|
33219
33219
|
"name": "ObcChartLineBase",
|
|
33220
33220
|
"module": "src/building-blocks/chart-line/chart-line-base.ts"
|
|
@@ -33224,10 +33224,10 @@
|
|
|
33224
33224
|
"kind": "field",
|
|
33225
33225
|
"name": "datasets",
|
|
33226
33226
|
"type": {
|
|
33227
|
-
"text": "ChartDataset<'line', (number | {x: string|
|
|
33227
|
+
"text": "ChartDataset<'line', (number | {x: number|string|Date|TemporalLike; y: number})[]>[]"
|
|
33228
33228
|
},
|
|
33229
33229
|
"default": "undefined",
|
|
33230
|
-
"description": "Multi-series Chart.js datasets. Takes precedence over `data`. Each dataset can have `label`, `data` (numeric array or `{x, y}` points), and visual properties like `borderColor`, `backgroundColor`, `fill`, etc.",
|
|
33230
|
+
"description": "Multi-series Chart.js datasets. Takes precedence over `data`. Each dataset can have `label`, `data` (numeric array or `{x, y}` points), and visual properties like `borderColor`, `backgroundColor`, `fill`, etc. In `time`/`number` mode point x-values are normalized like single-series `x`.",
|
|
33231
33231
|
"inheritedFrom": {
|
|
33232
33232
|
"name": "ObcChartLineBase",
|
|
33233
33233
|
"module": "src/building-blocks/chart-line/chart-line-base.ts"
|
|
@@ -33352,9 +33352,9 @@
|
|
|
33352
33352
|
"kind": "field",
|
|
33353
33353
|
"name": "xAxisType",
|
|
33354
33354
|
"type": {
|
|
33355
|
-
"text": "'category'|'time'"
|
|
33355
|
+
"text": "'category'|'time'|'number'"
|
|
33356
33356
|
},
|
|
33357
|
-
"description": "X-axis mode. `'category'` for labeled data points
|
|
33357
|
+
"description": "X-axis mode. `'category'` for labeled, evenly spaced data points; `'time'` for time-based data positioned proportionally (numbers are always epoch ms — `xStepSize`/`xTicksLimit` operate in ms); `'number'` for plain numeric x-values. Default: `'category'`.",
|
|
33358
33358
|
"attribute": "xAxisType",
|
|
33359
33359
|
"inheritedFrom": {
|
|
33360
33360
|
"name": "ObcChartLineBase",
|
|
@@ -33531,7 +33531,7 @@
|
|
|
33531
33531
|
"type": {
|
|
33532
33532
|
"text": "'minutes'|'date'"
|
|
33533
33533
|
},
|
|
33534
|
-
"description": "Time axis label format when `xAxisType='time'`. `'date'` shows
|
|
33534
|
+
"description": "Time axis label format when `xAxisType='time'`. `'date'` shows a locale date, `'minutes'` shows minutes relative to the latest data point. Default: `'date'`.",
|
|
33535
33535
|
"attribute": "timeDisplay",
|
|
33536
33536
|
"inheritedFrom": {
|
|
33537
33537
|
"name": "ObcChartLineBase",
|
|
@@ -33991,7 +33991,7 @@
|
|
|
33991
33991
|
{
|
|
33992
33992
|
"name": "data",
|
|
33993
33993
|
"type": {
|
|
33994
|
-
"text": "| number[]\n |
|
|
33994
|
+
"text": "| number[]\n | {x: number; y: number}[]\n | ChartDataset<'line', ChartLinePoint[]>"
|
|
33995
33995
|
},
|
|
33996
33996
|
"description": "Either numeric values array or existing dataset to normalize"
|
|
33997
33997
|
},
|
|
@@ -34027,14 +34027,14 @@
|
|
|
34027
34027
|
"privacy": "protected",
|
|
34028
34028
|
"return": {
|
|
34029
34029
|
"type": {
|
|
34030
|
-
"text": "ChartDataset<'line',
|
|
34030
|
+
"text": "ChartDataset<'line', ChartLinePoint[]>[]"
|
|
34031
34031
|
}
|
|
34032
34032
|
},
|
|
34033
34033
|
"parameters": [
|
|
34034
34034
|
{
|
|
34035
34035
|
"name": "values",
|
|
34036
34036
|
"type": {
|
|
34037
|
-
"text": "number[]"
|
|
34037
|
+
"text": "number[] | {x: number; y: number}[]"
|
|
34038
34038
|
}
|
|
34039
34039
|
},
|
|
34040
34040
|
{
|
|
@@ -34044,7 +34044,7 @@
|
|
|
34044
34044
|
}
|
|
34045
34045
|
}
|
|
34046
34046
|
],
|
|
34047
|
-
"description": "Create threshold mode datasets: invisible baseline + main dataset with
|
|
34047
|
+
"description": "Create threshold mode datasets: invisible baseline + main dataset with\nabove/below fills. Accepts plain values (category mode) or {x, y} points\n(time/number mode); the baseline mirrors the input x-positions.",
|
|
34048
34048
|
"inheritedFrom": {
|
|
34049
34049
|
"name": "ObcChartLineBase",
|
|
34050
34050
|
"module": "src/building-blocks/chart-line/chart-line-base.ts"
|
|
@@ -34054,7 +34054,7 @@
|
|
|
34054
34054
|
"kind": "method",
|
|
34055
34055
|
"name": "prepareMultiSeriesDatasets",
|
|
34056
34056
|
"privacy": "protected",
|
|
34057
|
-
"description": "Prepare normalized datasets for multi-series charts",
|
|
34057
|
+
"description": "Prepare normalized datasets for multi-series charts.\nIn time/number mode every point's x is normalized (epoch ms / number)\nso strings, Dates and Temporal objects position correctly.",
|
|
34058
34058
|
"inheritedFrom": {
|
|
34059
34059
|
"name": "ObcChartLineBase",
|
|
34060
34060
|
"module": "src/building-blocks/chart-line/chart-line-base.ts"
|
|
@@ -34064,7 +34064,7 @@
|
|
|
34064
34064
|
"kind": "method",
|
|
34065
34065
|
"name": "prepareSingleSeriesDatasets",
|
|
34066
34066
|
"privacy": "protected",
|
|
34067
|
-
"description": "Prepare datasets for single-series charts
|
|
34067
|
+
"description": "Prepare datasets for single-series charts.\nCategory mode: labels + numeric values (unchanged legacy path).\nTime/number mode: normalized {x, y} points on a linear scale.\nHandles both regular and threshold fill modes.",
|
|
34068
34068
|
"inheritedFrom": {
|
|
34069
34069
|
"name": "ObcChartLineBase",
|
|
34070
34070
|
"module": "src/building-blocks/chart-line/chart-line-base.ts"
|
|
@@ -34308,9 +34308,9 @@
|
|
|
34308
34308
|
{
|
|
34309
34309
|
"name": "xAxisType",
|
|
34310
34310
|
"type": {
|
|
34311
|
-
"text": "'category'|'time'"
|
|
34311
|
+
"text": "'category'|'time'|'number'"
|
|
34312
34312
|
},
|
|
34313
|
-
"description": "X-axis mode. `'category'` for labeled data points
|
|
34313
|
+
"description": "X-axis mode. `'category'` for labeled, evenly spaced data points; `'time'` for time-based data positioned proportionally (numbers are always epoch ms — `xStepSize`/`xTicksLimit` operate in ms); `'number'` for plain numeric x-values. Default: `'category'`.",
|
|
34314
34314
|
"fieldName": "xAxisType",
|
|
34315
34315
|
"inheritedFrom": {
|
|
34316
34316
|
"name": "ObcChartLineBase",
|
|
@@ -34424,7 +34424,7 @@
|
|
|
34424
34424
|
"type": {
|
|
34425
34425
|
"text": "'minutes'|'date'"
|
|
34426
34426
|
},
|
|
34427
|
-
"description": "Time axis label format when `xAxisType='time'`. `'date'` shows
|
|
34427
|
+
"description": "Time axis label format when `xAxisType='time'`. `'date'` shows a locale date, `'minutes'` shows minutes relative to the latest data point. Default: `'date'`.",
|
|
34428
34428
|
"fieldName": "timeDisplay",
|
|
34429
34429
|
"inheritedFrom": {
|
|
34430
34430
|
"name": "ObcChartLineBase",
|
|
@@ -78767,7 +78767,7 @@
|
|
|
78767
78767
|
"declarations": [
|
|
78768
78768
|
{
|
|
78769
78769
|
"kind": "class",
|
|
78770
|
-
"description": "Gauge Trend - A navigation instrument combining a line/area chart with an integrated vertical scale.\n\nThis is a high-level, self-contained component that combines:\n- A line/area chart (based on `ObcChartLineBase`) with configurable fill mode\n- An integrated vertical scale (`obc-bar-vertical`) on the right side\n\nThe component is designed for displaying time-series or categorical trend data alongside a calibrated\nvertical measurement scale, commonly used in maritime navigation instruments.\n\n## Architecture\n\nInternally composed of:\n- **Base**: `ObcChartLineBase` (line/area graph functionality)\n- **Right scale**: `obc-bar-vertical` (external scale component)\n\n## Locked Configuration (not user-configurable)\n- Fixed aspect ratio scaling: always enabled\n- Instrument mode: always enabled (8px border radius)\n- X-axis type:
|
|
78770
|
+
"description": "Gauge Trend - A navigation instrument combining a line/area chart with an integrated vertical scale.\n\nThis is a high-level, self-contained component that combines:\n- A line/area chart (based on `ObcChartLineBase`) with configurable fill mode\n- An integrated vertical scale (`obc-bar-vertical`) on the right side\n\nThe component is designed for displaying time-series or categorical trend data alongside a calibrated\nvertical measurement scale, commonly used in maritime navigation instruments.\n\n## Architecture\n\nInternally composed of:\n- **Base**: `ObcChartLineBase` (line/area graph functionality)\n- **Right scale**: `obc-bar-vertical` (external scale component)\n\n## Locked Configuration (not user-configurable)\n- Fixed aspect ratio scaling: always enabled\n- Instrument mode: always enabled (8px border radius)\n- X-axis type: auto-detected — 'category' for `{label, value}` data,\n 'time' for `{x, value}` data (uneven intervals position proportionally).\n Assigning `xAxisType` explicitly disables auto-detection.\n- Line mode: always 'smooth'\n- Grid, tick marks, points, legend: always hidden\n- Scale advice position: always 'inner'\n- Scale state: automatically inherits from `state` property\n\n## Usage Examples\n\n### Basic gauge trend with default area fill\n```html\n<obc-gauge-trend\n .data=${[\n {label: 'Jan', value: 3.5},\n {label: 'Feb', value: 4.2},\n {label: 'Mar', value: 5.0}\n ]}\n .minValue=${3}\n .maxValue=${7}\n .value=${5}\n .width=${480}\n .height=${480}\n></obc-gauge-trend>\n```\n\n### Line-only (no fill) - default\n```html\n<obc-gauge-trend\n .data=${chartData}\n></obc-gauge-trend>\n```\n\n### With area fill\n```html\n<obc-gauge-trend\n .chartFill=${true}\n .data=${chartData}\n></obc-gauge-trend>\n```\n\n### With enhanced colors and setpoint\n```html\n<obc-gauge-trend\n .enhanced=${true}\n .state=${'in-command'}\n .setpoint=${5.5}\n .value=${5.2}\n .hasBar=${true}\n .hasScale=${true}\n></obc-gauge-trend>\n```\n\n### With advice overlays\n```html\n<obc-gauge-trend\n .hasAdvice=${true}\n .advice=${[\n {min: 3, max: 5, type: 'caution', hinted: true},\n {min: 6, max: 7, type: 'advice', hinted: false}\n ]}\n></obc-gauge-trend>\n```\n\n### Time-based data with uneven intervals\n```html\n<obc-gauge-trend\n .data=${[\n {x: '2026-07-06T10:00:00Z', value: 3.5},\n {x: '2026-07-06T10:03:00Z', value: 4.2},\n {x: '2026-07-06T10:15:00Z', value: 5.0}\n ]}\n></obc-gauge-trend>\n```",
|
|
78771
78771
|
"name": "ObcGaugeTrend",
|
|
78772
78772
|
"members": [
|
|
78773
78773
|
{
|
|
@@ -78787,6 +78787,23 @@
|
|
|
78787
78787
|
"privacy": "private",
|
|
78788
78788
|
"default": "false"
|
|
78789
78789
|
},
|
|
78790
|
+
{
|
|
78791
|
+
"kind": "field",
|
|
78792
|
+
"name": "_explicitXAxisType",
|
|
78793
|
+
"type": {
|
|
78794
|
+
"text": "boolean"
|
|
78795
|
+
},
|
|
78796
|
+
"privacy": "private",
|
|
78797
|
+
"default": "false"
|
|
78798
|
+
},
|
|
78799
|
+
{
|
|
78800
|
+
"kind": "field",
|
|
78801
|
+
"name": "_autoAppliedXAxisType",
|
|
78802
|
+
"type": {
|
|
78803
|
+
"text": "XAxisType | undefined"
|
|
78804
|
+
},
|
|
78805
|
+
"privacy": "private"
|
|
78806
|
+
},
|
|
78790
78807
|
{
|
|
78791
78808
|
"kind": "method",
|
|
78792
78809
|
"name": "_createBarVerticalElement",
|
|
@@ -79094,9 +79111,9 @@
|
|
|
79094
79111
|
"kind": "field",
|
|
79095
79112
|
"name": "xAxisType",
|
|
79096
79113
|
"type": {
|
|
79097
|
-
"text": "'category'|'time'"
|
|
79114
|
+
"text": "'category'|'time'|'number'"
|
|
79098
79115
|
},
|
|
79099
|
-
"description": "X-axis mode. `'category'` for labeled data points
|
|
79116
|
+
"description": "X-axis mode. `'category'` for labeled, evenly spaced data points; `'time'` for time-based data positioned proportionally (numbers are always epoch ms — `xStepSize`/`xTicksLimit` operate in ms); `'number'` for plain numeric x-values. Default: `'category'`.",
|
|
79100
79117
|
"attribute": "xAxisType",
|
|
79101
79118
|
"inheritedFrom": {
|
|
79102
79119
|
"name": "ObcChartLineBase",
|
|
@@ -79149,7 +79166,7 @@
|
|
|
79149
79166
|
"type": {
|
|
79150
79167
|
"text": "'minutes'|'date'"
|
|
79151
79168
|
},
|
|
79152
|
-
"description": "Time axis label format when `xAxisType='time'`. `'date'` shows
|
|
79169
|
+
"description": "Time axis label format when `xAxisType='time'`. `'date'` shows a locale date, `'minutes'` shows minutes relative to the latest data point. Default: `'date'`.",
|
|
79153
79170
|
"attribute": "timeDisplay",
|
|
79154
79171
|
"inheritedFrom": {
|
|
79155
79172
|
"name": "ObcChartLineBase",
|
|
@@ -79479,10 +79496,10 @@
|
|
|
79479
79496
|
"kind": "field",
|
|
79480
79497
|
"name": "data",
|
|
79481
79498
|
"type": {
|
|
79482
|
-
"text": "Array<{label
|
|
79499
|
+
"text": "Array<{label?: string, x?: number|string|Date|TemporalLike, value: number}>"
|
|
79483
79500
|
},
|
|
79484
79501
|
"default": "[]",
|
|
79485
|
-
"description": "Single-series data array.
|
|
79502
|
+
"description": "Single-series data array. In `category` mode each item needs `label`; in `time`/`number` mode each item needs `x` (epoch ms, ISO string, Date, or Temporal object — `label` is parsed as a fallback). Used when `datasets` is not provided. Points are drawn in array order (no sorting); Temporal Plain* values are interpreted in the system time zone.",
|
|
79486
79503
|
"inheritedFrom": {
|
|
79487
79504
|
"name": "ObcChartLineBase",
|
|
79488
79505
|
"module": "src/building-blocks/chart-line/chart-line-base.ts"
|
|
@@ -79492,10 +79509,10 @@
|
|
|
79492
79509
|
"kind": "field",
|
|
79493
79510
|
"name": "datasets",
|
|
79494
79511
|
"type": {
|
|
79495
|
-
"text": "ChartDataset<'line', (number | {x: string|
|
|
79512
|
+
"text": "ChartDataset<'line', (number | {x: number|string|Date|TemporalLike; y: number})[]>[]"
|
|
79496
79513
|
},
|
|
79497
79514
|
"default": "undefined",
|
|
79498
|
-
"description": "Multi-series Chart.js datasets. Takes precedence over `data`. Each dataset can have `label`, `data` (numeric array or `{x, y}` points), and visual properties like `borderColor`, `backgroundColor`, `fill`, etc.",
|
|
79515
|
+
"description": "Multi-series Chart.js datasets. Takes precedence over `data`. Each dataset can have `label`, `data` (numeric array or `{x, y}` points), and visual properties like `borderColor`, `backgroundColor`, `fill`, etc. In `time`/`number` mode point x-values are normalized like single-series `x`.",
|
|
79499
79516
|
"inheritedFrom": {
|
|
79500
79517
|
"name": "ObcChartLineBase",
|
|
79501
79518
|
"module": "src/building-blocks/chart-line/chart-line-base.ts"
|
|
@@ -79994,7 +80011,7 @@
|
|
|
79994
80011
|
{
|
|
79995
80012
|
"name": "data",
|
|
79996
80013
|
"type": {
|
|
79997
|
-
"text": "| number[]\n |
|
|
80014
|
+
"text": "| number[]\n | {x: number; y: number}[]\n | ChartDataset<'line', ChartLinePoint[]>"
|
|
79998
80015
|
},
|
|
79999
80016
|
"description": "Either numeric values array or existing dataset to normalize"
|
|
80000
80017
|
},
|
|
@@ -80030,14 +80047,14 @@
|
|
|
80030
80047
|
"privacy": "protected",
|
|
80031
80048
|
"return": {
|
|
80032
80049
|
"type": {
|
|
80033
|
-
"text": "ChartDataset<'line',
|
|
80050
|
+
"text": "ChartDataset<'line', ChartLinePoint[]>[]"
|
|
80034
80051
|
}
|
|
80035
80052
|
},
|
|
80036
80053
|
"parameters": [
|
|
80037
80054
|
{
|
|
80038
80055
|
"name": "values",
|
|
80039
80056
|
"type": {
|
|
80040
|
-
"text": "number[]"
|
|
80057
|
+
"text": "number[] | {x: number; y: number}[]"
|
|
80041
80058
|
}
|
|
80042
80059
|
},
|
|
80043
80060
|
{
|
|
@@ -80047,7 +80064,7 @@
|
|
|
80047
80064
|
}
|
|
80048
80065
|
}
|
|
80049
80066
|
],
|
|
80050
|
-
"description": "Create threshold mode datasets: invisible baseline + main dataset with
|
|
80067
|
+
"description": "Create threshold mode datasets: invisible baseline + main dataset with\nabove/below fills. Accepts plain values (category mode) or {x, y} points\n(time/number mode); the baseline mirrors the input x-positions.",
|
|
80051
80068
|
"inheritedFrom": {
|
|
80052
80069
|
"name": "ObcChartLineBase",
|
|
80053
80070
|
"module": "src/building-blocks/chart-line/chart-line-base.ts"
|
|
@@ -80057,7 +80074,7 @@
|
|
|
80057
80074
|
"kind": "method",
|
|
80058
80075
|
"name": "prepareMultiSeriesDatasets",
|
|
80059
80076
|
"privacy": "protected",
|
|
80060
|
-
"description": "Prepare normalized datasets for multi-series charts",
|
|
80077
|
+
"description": "Prepare normalized datasets for multi-series charts.\nIn time/number mode every point's x is normalized (epoch ms / number)\nso strings, Dates and Temporal objects position correctly.",
|
|
80061
80078
|
"inheritedFrom": {
|
|
80062
80079
|
"name": "ObcChartLineBase",
|
|
80063
80080
|
"module": "src/building-blocks/chart-line/chart-line-base.ts"
|
|
@@ -80067,7 +80084,7 @@
|
|
|
80067
80084
|
"kind": "method",
|
|
80068
80085
|
"name": "prepareSingleSeriesDatasets",
|
|
80069
80086
|
"privacy": "protected",
|
|
80070
|
-
"description": "Prepare datasets for single-series charts
|
|
80087
|
+
"description": "Prepare datasets for single-series charts.\nCategory mode: labels + numeric values (unchanged legacy path).\nTime/number mode: normalized {x, y} points on a linear scale.\nHandles both regular and threshold fill modes.",
|
|
80071
80088
|
"inheritedFrom": {
|
|
80072
80089
|
"name": "ObcChartLineBase",
|
|
80073
80090
|
"module": "src/building-blocks/chart-line/chart-line-base.ts"
|
|
@@ -80524,9 +80541,9 @@
|
|
|
80524
80541
|
{
|
|
80525
80542
|
"name": "xAxisType",
|
|
80526
80543
|
"type": {
|
|
80527
|
-
"text": "'category'|'time'"
|
|
80544
|
+
"text": "'category'|'time'|'number'"
|
|
80528
80545
|
},
|
|
80529
|
-
"description": "X-axis mode. `'category'` for labeled data points
|
|
80546
|
+
"description": "X-axis mode. `'category'` for labeled, evenly spaced data points; `'time'` for time-based data positioned proportionally (numbers are always epoch ms — `xStepSize`/`xTicksLimit` operate in ms); `'number'` for plain numeric x-values. Default: `'category'`.",
|
|
80530
80547
|
"fieldName": "xAxisType",
|
|
80531
80548
|
"inheritedFrom": {
|
|
80532
80549
|
"name": "ObcChartLineBase",
|
|
@@ -80640,7 +80657,7 @@
|
|
|
80640
80657
|
"type": {
|
|
80641
80658
|
"text": "'minutes'|'date'"
|
|
80642
80659
|
},
|
|
80643
|
-
"description": "Time axis label format when `xAxisType='time'`. `'date'` shows
|
|
80660
|
+
"description": "Time axis label format when `xAxisType='time'`. `'date'` shows a locale date, `'minutes'` shows minutes relative to the latest data point. Default: `'date'`.",
|
|
80644
80661
|
"fieldName": "timeDisplay",
|
|
80645
80662
|
"inheritedFrom": {
|
|
80646
80663
|
"name": "ObcChartLineBase",
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import { LitElement, PropertyValues } from 'lit';
|
|
2
2
|
import { ChartOptions, ChartDataset } from 'chart.js';
|
|
3
3
|
import { InstrumentState, FrameStyle, BorderRadiusPosition, Priority } from '../../navigation-instruments/types.js';
|
|
4
|
+
import { XValueMode } from '../../charthelpers/index.js';
|
|
5
|
+
import { ChartXValue } from '../../charthelpers/x-value.js';
|
|
4
6
|
/**
|
|
5
7
|
* Dimension information reported by external scale components.
|
|
6
8
|
* Dispatched via 'scale-dimensions-changed' event from slotted scale elements.
|
|
@@ -11,9 +13,11 @@ export interface ExternalScaleDimensions {
|
|
|
11
13
|
/** Natural thickness in pixels (width for vertical, height for horizontal) */
|
|
12
14
|
thickness: number;
|
|
13
15
|
}
|
|
16
|
+
export type { ChartXValue, TemporalLike } from '../../charthelpers/x-value.js';
|
|
14
17
|
export declare enum XAxisType {
|
|
15
18
|
category = "category",
|
|
16
|
-
time = "time"
|
|
19
|
+
time = "time",
|
|
20
|
+
number = "number"
|
|
17
21
|
}
|
|
18
22
|
export declare enum YAxisPosition {
|
|
19
23
|
left = "left",
|
|
@@ -28,8 +32,19 @@ export declare enum TimeDisplay {
|
|
|
28
32
|
minutes = "minutes",
|
|
29
33
|
date = "date"
|
|
30
34
|
}
|
|
35
|
+
export type ChartLinePoint = number | {
|
|
36
|
+
x: ChartXValue;
|
|
37
|
+
y: number;
|
|
38
|
+
};
|
|
31
39
|
export type ChartLineDataItem = {
|
|
32
|
-
label
|
|
40
|
+
/** Category label. Used when `xAxisType='category'` (the default). */
|
|
41
|
+
label?: string;
|
|
42
|
+
/**
|
|
43
|
+
* X-coordinate for `xAxisType='time'` (epoch ms, ISO string, Date, or
|
|
44
|
+
* Temporal object) or `xAxisType='number'` (plain number). When absent,
|
|
45
|
+
* `label` is parsed as a fallback.
|
|
46
|
+
*/
|
|
47
|
+
x?: ChartXValue;
|
|
33
48
|
value: number;
|
|
34
49
|
};
|
|
35
50
|
export type ChartLineYAxisConfig = {
|
|
@@ -44,7 +59,9 @@ export type ChartLineYAxisConfig = {
|
|
|
44
59
|
*
|
|
45
60
|
* ## Features
|
|
46
61
|
* - **Single or multi-series**: Use `data` for simple single-series or `datasets` for multi-series charts
|
|
47
|
-
* - **
|
|
62
|
+
* - **Category, time and number axes**: `category` (labels, evenly spaced), `time` (epoch ms,
|
|
63
|
+
* ISO strings, `Date` or Temporal objects — positioned proportionally, so uneven intervals
|
|
64
|
+
* render unevenly) and `number` (plain numeric x-values on a linear scale)
|
|
48
65
|
* - **Line styles**: Choose `smooth` (curved), `straight`, or `stepped` line rendering
|
|
49
66
|
* - **Fill modes**: Area fills with `semitransparent`, `solid`, or `threshold` (red/blue above/below midpoint)
|
|
50
67
|
* - **Stacked charts**: Enable `stacked` for multi-series datasets to stack values on y-axis
|
|
@@ -93,6 +110,36 @@ export type ChartLineYAxisConfig = {
|
|
|
93
110
|
* </script>
|
|
94
111
|
* ```
|
|
95
112
|
*
|
|
113
|
+
* Single-series with time axis (uneven intervals position proportionally;
|
|
114
|
+
* x accepts epoch ms, ISO strings, Date or Temporal objects):
|
|
115
|
+
* ```html
|
|
116
|
+
* <obc-line-graph></obc-line-graph>
|
|
117
|
+
* <script>
|
|
118
|
+
* const chart = document.querySelector('obc-line-graph');
|
|
119
|
+
* chart.xAxisType = 'time';
|
|
120
|
+
* chart.timeDisplay = 'minutes';
|
|
121
|
+
* chart.data = [
|
|
122
|
+
* {x: '2026-07-06T10:00:00Z', value: 10},
|
|
123
|
+
* {x: new Date('2026-07-06T10:03:00Z'), value: 14},
|
|
124
|
+
* {x: Temporal.Instant.from('2026-07-06T10:15:00Z'), value: 12}
|
|
125
|
+
* ];
|
|
126
|
+
* </script>
|
|
127
|
+
* ```
|
|
128
|
+
*
|
|
129
|
+
* Single-series with numeric x-axis:
|
|
130
|
+
* ```html
|
|
131
|
+
* <obc-line-graph></obc-line-graph>
|
|
132
|
+
* <script>
|
|
133
|
+
* const chart = document.querySelector('obc-line-graph');
|
|
134
|
+
* chart.xAxisType = 'number';
|
|
135
|
+
* chart.data = [
|
|
136
|
+
* {x: 0, value: 2},
|
|
137
|
+
* {x: 2.5, value: 3},
|
|
138
|
+
* {x: 10, value: 6}
|
|
139
|
+
* ];
|
|
140
|
+
* </script>
|
|
141
|
+
* ```
|
|
142
|
+
*
|
|
96
143
|
* Stacked area chart with solid fill:
|
|
97
144
|
* ```html
|
|
98
145
|
* <obc-line-graph></obc-line-graph>
|
|
@@ -137,12 +184,12 @@ export type ChartLineYAxisConfig = {
|
|
|
137
184
|
* </script>
|
|
138
185
|
* ```
|
|
139
186
|
*
|
|
140
|
-
* @property {Array<{label
|
|
141
|
-
* @property {ChartDataset<'line', (number | {x: string|
|
|
187
|
+
* @property {Array<{label?: string, x?: number|string|Date|TemporalLike, value: number}>} data - Single-series data array. In `category` mode each item needs `label`; in `time`/`number` mode each item needs `x` (epoch ms, ISO string, Date, or Temporal object — `label` is parsed as a fallback). Used when `datasets` is not provided. Points are drawn in array order (no sorting); Temporal Plain* values are interpreted in the system time zone.
|
|
188
|
+
* @property {ChartDataset<'line', (number | {x: number|string|Date|TemporalLike; y: number})[]>[]} datasets - Multi-series Chart.js datasets. Takes precedence over `data`. Each dataset can have `label`, `data` (numeric array or `{x, y}` points), and visual properties like `borderColor`, `backgroundColor`, `fill`, etc. In `time`/`number` mode point x-values are normalized like single-series `x`.
|
|
142
189
|
* @property {(string|number)[]} labels - Explicit labels for category x-axis. If omitted, labels are derived from `data` property or dataset x-values.
|
|
143
190
|
* @property {string[]} colors - Custom color palette (CSS variable names or color strings). Falls back to theme default colors if not provided.
|
|
144
|
-
* @property {'category'|'time'} xAxisType - X-axis mode. `'category'` for labeled data points
|
|
145
|
-
* @property {'minutes'|'date'} timeDisplay - Time axis label format when `xAxisType='time'`. `'date'` shows
|
|
191
|
+
* @property {'category'|'time'|'number'} xAxisType - X-axis mode. `'category'` for labeled, evenly spaced data points; `'time'` for time-based data positioned proportionally (numbers are always epoch ms — `xStepSize`/`xTicksLimit` operate in ms); `'number'` for plain numeric x-values. Default: `'category'`.
|
|
192
|
+
* @property {'minutes'|'date'} timeDisplay - Time axis label format when `xAxisType='time'`. `'date'` shows a locale date, `'minutes'` shows minutes relative to the latest data point. Default: `'date'`.
|
|
146
193
|
* @property {'left'|'right'} yAxisPosition - Single y-axis position. Use this for simple charts with one y-axis. For multiple y-axes, use `yAxes` property instead. Default: `'left'`.
|
|
147
194
|
* @property {Array<{id?: string; position?: 'left'|'right'; min?: number; max?: number; grid?: boolean}>} yAxes - Multiple y-axis definitions for complex charts. Each axis can specify `id` (referenced by dataset `yAxisID`), `position`, `min`/`max` range, and `grid` visibility.
|
|
148
195
|
* @property {boolean} showGrid - Show vertical grid lines (x-axis). When combined with `showGridX` and `showGridY`, controls full grid visibility. Default: `false`.
|
|
@@ -167,13 +214,14 @@ export type ChartLineYAxisConfig = {
|
|
|
167
214
|
* @experimental
|
|
168
215
|
*/
|
|
169
216
|
export declare class ObcChartLineBase extends LitElement {
|
|
170
|
-
/**
|
|
217
|
+
/**
|
|
218
|
+
* Simple single-series data. `{label, value}` items for the category axis;
|
|
219
|
+
* `{x, value}` items for time/number axes (x: epoch ms, ISO string, Date,
|
|
220
|
+
* or Temporal object). Points are drawn in array order (no sorting).
|
|
221
|
+
*/
|
|
171
222
|
data: ChartLineDataItem[];
|
|
172
223
|
/** Chart.js-style datasets for multi-series use. If provided, takes precedence over `data`. */
|
|
173
|
-
datasets?: ChartDataset<'line',
|
|
174
|
-
x: string | number | Date;
|
|
175
|
-
y: number;
|
|
176
|
-
})[]>[];
|
|
224
|
+
datasets?: ChartDataset<'line', ChartLinePoint[]>[];
|
|
177
225
|
/** Optional explicit labels for the x-axis (category mode). If omitted labels are derived from `data` */
|
|
178
226
|
labels?: (string | number)[];
|
|
179
227
|
/** Custom color palette (CSS variable names or color strings). */
|
|
@@ -200,7 +248,11 @@ export declare class ObcChartLineBase extends LitElement {
|
|
|
200
248
|
* Default: 384 (matches Figma design baseline).
|
|
201
249
|
*/
|
|
202
250
|
scaleReferenceSize: number;
|
|
203
|
-
/**
|
|
251
|
+
/**
|
|
252
|
+
* X-axis mode: 'category' for labeled, evenly spaced data points; 'time'
|
|
253
|
+
* for time-based data positioned proportionally; 'number' for plain
|
|
254
|
+
* numeric x-values.
|
|
255
|
+
*/
|
|
204
256
|
xAxisType: XAxisType;
|
|
205
257
|
/** Single y-axis position ('left' or 'right'). For multiple y-axes, use yAxes instead. */
|
|
206
258
|
yAxisPosition: YAxisPosition;
|
|
@@ -238,6 +290,14 @@ export declare class ObcChartLineBase extends LitElement {
|
|
|
238
290
|
* because a `true`-default boolean cannot work as an HTML boolean attribute.
|
|
239
291
|
*/
|
|
240
292
|
hasLabelPadding: boolean;
|
|
293
|
+
/** @internal - True when the x-axis positions points by numeric value. */
|
|
294
|
+
protected get isNumericXAxis(): boolean;
|
|
295
|
+
/** @internal - Normalization mode for the current x-axis type. */
|
|
296
|
+
protected get xValueMode(): XValueMode;
|
|
297
|
+
/** @internal - Last data/datasets reference already warned about. */
|
|
298
|
+
private lastWarnedXSource?;
|
|
299
|
+
/** @internal - Warn once per data assignment about unparseable x-values. */
|
|
300
|
+
private warnOnInvalidX;
|
|
241
301
|
private readonly DEFAULT_TENSION;
|
|
242
302
|
private readonly POINT_RADIUS;
|
|
243
303
|
/** Show point markers on data points. Default: false. */
|
|
@@ -463,34 +523,36 @@ export declare class ObcChartLineBase extends LitElement {
|
|
|
463
523
|
* @param totalCount - Total number of datasets (used for stacked divider logic)
|
|
464
524
|
* @returns Fully configured Chart.js dataset
|
|
465
525
|
*/
|
|
466
|
-
protected buildDataset(data: number[] |
|
|
467
|
-
x:
|
|
526
|
+
protected buildDataset(data: number[] | {
|
|
527
|
+
x: number;
|
|
468
528
|
y: number;
|
|
469
|
-
}
|
|
470
|
-
x: string | number | Date;
|
|
471
|
-
y: number;
|
|
472
|
-
})[]>;
|
|
529
|
+
}[] | ChartDataset<'line', ChartLinePoint[]>, index: number, chartColors: string[], totalCount?: number): ChartDataset<'line', ChartLinePoint[]>;
|
|
473
530
|
/**
|
|
474
|
-
* Create threshold mode datasets: invisible baseline + main dataset with
|
|
531
|
+
* Create threshold mode datasets: invisible baseline + main dataset with
|
|
532
|
+
* above/below fills. Accepts plain values (category mode) or {x, y} points
|
|
533
|
+
* (time/number mode); the baseline mirrors the input x-positions.
|
|
475
534
|
*/
|
|
476
|
-
protected createThresholdDatasets(values: number[]
|
|
535
|
+
protected createThresholdDatasets(values: number[] | {
|
|
536
|
+
x: number;
|
|
537
|
+
y: number;
|
|
538
|
+
}[], chartColors: string[]): ChartDataset<'line', ChartLinePoint[]>[];
|
|
477
539
|
/**
|
|
478
|
-
* Prepare normalized datasets for multi-series charts
|
|
540
|
+
* Prepare normalized datasets for multi-series charts.
|
|
541
|
+
* In time/number mode every point's x is normalized (epoch ms / number)
|
|
542
|
+
* so strings, Dates and Temporal objects position correctly.
|
|
479
543
|
*/
|
|
480
|
-
protected prepareMultiSeriesDatasets(): ChartDataset<"line",
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
})[]>[];
|
|
544
|
+
protected prepareMultiSeriesDatasets(): ChartDataset<"line", ChartLinePoint[]>[];
|
|
545
|
+
/** @internal - Return a copy of the dataset with normalized point x-values. */
|
|
546
|
+
private normalizeDatasetX;
|
|
484
547
|
/**
|
|
485
|
-
* Prepare datasets for single-series charts
|
|
486
|
-
*
|
|
548
|
+
* Prepare datasets for single-series charts.
|
|
549
|
+
* Category mode: labels + numeric values (unchanged legacy path).
|
|
550
|
+
* Time/number mode: normalized {x, y} points on a linear scale.
|
|
551
|
+
* Handles both regular and threshold fill modes.
|
|
487
552
|
*/
|
|
488
553
|
protected prepareSingleSeriesDatasets(): {
|
|
489
|
-
datasets: ChartDataset<"line",
|
|
490
|
-
|
|
491
|
-
y: number;
|
|
492
|
-
})[]>[];
|
|
493
|
-
labels: string[];
|
|
554
|
+
datasets: ChartDataset<"line", ChartLinePoint[]>[];
|
|
555
|
+
labels: (string | number)[];
|
|
494
556
|
};
|
|
495
557
|
/**
|
|
496
558
|
* Get Chart.js options with dynamic sizing and padding
|