@adia-ai/web-components 0.8.42 → 0.8.43
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/CHANGELOG.md +14 -0
- package/MIGRATION.md +130 -80
- package/USAGE.md +1 -1
- package/color/index.js +1 -1
- package/components/action-list/action-item.a2ui.json +3 -8
- package/components/action-list/action-item.yaml +10 -16
- package/components/action-list/action-list.class.js +5 -61
- package/components/action-list/action-list.d.ts +1 -3
- package/components/button/button.yaml +1 -1
- package/components/calendar-picker/calendar-picker.a2ui.json +1 -1
- package/components/calendar-picker/calendar-picker.class.js +2 -3
- package/components/calendar-picker/calendar-picker.css +16 -18
- package/components/calendar-picker/calendar-picker.yaml +2 -2
- package/components/card/card.css +3 -3
- package/components/chart/chart.a2ui.json +3 -18
- package/components/chart/chart.class.js +4 -44
- package/components/chart/chart.d.ts +3 -9
- package/components/chart/chart.yaml +6 -31
- package/components/chart-legend/chart-legend.a2ui.json +3 -12
- package/components/chart-legend/chart-legend.class.js +10 -54
- package/components/chart-legend/chart-legend.d.ts +1 -3
- package/components/chart-legend/chart-legend.yaml +9 -19
- package/components/check/check.css +9 -0
- package/components/color-area/color-area.a2ui.json +1 -1
- package/components/color-area/color-area.class.js +2 -2
- package/components/color-area/color-area.css +4 -7
- package/components/color-area/color-area.d.ts +1 -1
- package/components/color-area/color-area.yaml +3 -3
- package/components/color-input/color-input.a2ui.json +1 -1
- package/components/color-input/color-input.class.js +1 -1
- package/components/color-input/color-input.yaml +2 -2
- package/components/drilldown/drilldown.a2ui.json +3 -0
- package/components/drilldown/drilldown.css +8 -1
- package/components/drilldown/drilldown.yaml +2 -0
- package/components/field/field.class.js +5 -5
- package/components/index.js +0 -4
- package/components/input/input.a2ui.json +4 -4
- package/components/input/input.class.js +8 -0
- package/components/input/input.css +6 -0
- package/components/input/input.yaml +11 -8
- package/components/menu/menu-item.a2ui.json +3 -8
- package/components/menu/menu-item.yaml +13 -21
- package/components/menu/menu.class.js +5 -27
- package/components/menu/menu.d.ts +1 -3
- package/components/pane/pane.a2ui.json +2 -12
- package/components/pane/pane.class.js +5 -30
- package/components/pane/pane.d.ts +3 -5
- package/components/pane/pane.yaml +7 -19
- package/components/progress/progress.a2ui.json +1 -1
- package/components/progress/progress.class.js +2 -2
- package/components/progress/progress.d.ts +1 -1
- package/components/progress/progress.yaml +2 -2
- package/components/radio/radio.css +7 -0
- package/components/search/search.css +10 -1
- package/components/segment/segment.a2ui.json +1 -2
- package/components/segment/segment.css +10 -0
- package/components/segment/segment.yaml +1 -2
- package/components/segmented/segmented.a2ui.json +1 -3
- package/components/segmented/segmented.class.js +2 -2
- package/components/segmented/segmented.yaml +2 -4
- package/components/select/select.css +6 -0
- package/components/step-progress/step-progress.yaml +1 -1
- package/components/switch/switch.css +8 -0
- package/components/table-toolbar/table-toolbar.a2ui.json +42 -1
- package/components/table-toolbar/table-toolbar.class.js +151 -11
- package/components/table-toolbar/table-toolbar.css +46 -0
- package/components/table-toolbar/table-toolbar.d.ts +13 -1
- package/components/table-toolbar/table-toolbar.yaml +104 -14
- package/components/textarea/textarea.css +4 -0
- package/components/time-picker/time-picker.yaml +3 -2
- package/components/tree/tree.yaml +1 -1
- package/components/upload/upload.class.js +16 -0
- package/components/upload/upload.d.ts +7 -0
- package/components/upload/upload.yaml +7 -3
- package/core/icons.js +2 -5
- package/custom-elements.json +101 -597
- package/dist/host.min.css +1 -1
- package/dist/host.sheet.js +1 -1
- package/dist/theme-provider.min.js +1 -1
- package/dist/web-components.min.css +1 -1
- package/dist/web-components.min.js +92 -89
- package/dist/web-components.sheet.js +1 -1
- package/index.d.ts +0 -15
- package/package.json +1 -1
- package/patterns/chart-in-card/chart-in-card.examples.html +10 -10
- package/patterns/conversion-funnel/conversion-funnel.html +2 -2
- package/patterns/editor-shell/editor-shell.examples.html +3 -3
- package/styles/colors/semantics/features.css +8 -1
- package/styles/components.css +0 -4
- package/traits/arrow-grid-nav/arrow-grid-nav.js +1 -1
- package/traits/resize-observer/resize-observer.js +1 -1
- package/components/color-picker/color-picker.a2ui.json +0 -148
- package/components/color-picker/color-picker.class.js +0 -46
- package/components/color-picker/color-picker.css +0 -14
- package/components/color-picker/color-picker.d.ts +0 -99
- package/components/color-picker/color-picker.examples.md +0 -19
- package/components/color-picker/color-picker.js +0 -17
- package/components/color-picker/color-picker.yaml +0 -175
- package/components/datetime-picker/datetime-picker.a2ui.json +0 -256
- package/components/datetime-picker/datetime-picker.class.js +0 -58
- package/components/datetime-picker/datetime-picker.css +0 -11
- package/components/datetime-picker/datetime-picker.d.ts +0 -87
- package/components/datetime-picker/datetime-picker.examples.md +0 -25
- package/components/datetime-picker/datetime-picker.js +0 -17
- package/components/datetime-picker/datetime-picker.yaml +0 -254
- package/components/progress-row/progress-row.a2ui.json +0 -107
- package/components/progress-row/progress-row.class.js +0 -118
- package/components/progress-row/progress-row.css +0 -60
- package/components/progress-row/progress-row.d.ts +0 -24
- package/components/progress-row/progress-row.examples.md +0 -7
- package/components/progress-row/progress-row.js +0 -17
- package/components/progress-row/progress-row.yaml +0 -85
- package/components/toggle-group/toggle-group.a2ui.json +0 -148
- package/components/toggle-group/toggle-group.class.js +0 -195
- package/components/toggle-group/toggle-group.css +0 -127
- package/components/toggle-group/toggle-group.d.ts +0 -50
- package/components/toggle-group/toggle-group.examples.md +0 -33
- package/components/toggle-group/toggle-group.js +0 -18
- package/components/toggle-group/toggle-group.yaml +0 -135
- package/components/toggle-group/toggle-option.a2ui.json +0 -86
- package/components/toggle-group/toggle-option.yaml +0 -75
|
@@ -34,14 +34,12 @@ export class UIActionList extends UIElement {
|
|
|
34
34
|
}
|
|
35
35
|
|
|
36
36
|
export class UIActionItem extends UIElement {
|
|
37
|
-
/** Optional secondary description line rendered under the label. Canonical spelling (ADR-0063, gh#1571) replacing `subtitle` — converges action-item onto the same spelling <menu-item-ui> adopted under gh#1563. */
|
|
37
|
+
/** Optional secondary description line rendered under the label. Canonical spelling (ADR-0063, gh#1571) replacing `subtitle` — converges action-item onto the same spelling <menu-item-ui> adopted under gh#1563. The deprecated `subtitle` prop alias was cut in 0.8.43 (gh#1617). */
|
|
38
38
|
description: string;
|
|
39
39
|
/** Disables click + keyboard activation; aria-disabled is set. */
|
|
40
40
|
disabled: boolean;
|
|
41
41
|
/** Leading icon name (Phosphor). */
|
|
42
42
|
icon: string;
|
|
43
|
-
/** DEPRECATED (ADR-0063, gh#1571) — use `description` instead. Same type/default/rendered position; kept working as a dual-read compat shim (one-time console.warn when it's the name that resolves). Removed in 0.9.0. (The `subtitle` SLOT below is a separate surface, deliberately left unrenamed in this pass — see its own description.) */
|
|
44
|
-
subtitle: string;
|
|
45
43
|
/** Action label. */
|
|
46
44
|
text: string;
|
|
47
45
|
/** Identifier passed to the action-list change/activate handlers. */
|
|
@@ -165,7 +165,7 @@ a2ui:
|
|
|
165
165
|
reason: 'Per existing slot.discipline rule — visual redundancy guard.'
|
|
166
166
|
- rule: 'For navigation (route-change) use <nav-item-ui> or anchor; button-ui is for actions only.'
|
|
167
167
|
reason: 'Action vs navigation semantics.'
|
|
168
|
-
- rule: 'For toggleable on/off state use <switch-ui>; for multi-select clusters use <segmented-ui multiple> + <segment-ui> (
|
|
168
|
+
- rule: 'For toggleable on/off state use <switch-ui>; for multi-select clusters use <segmented-ui multiple> + <segment-ui> (<toggle-group-ui>/<toggle-option-ui> were cut in 0.8.43, gh#1617, gh#1369).'
|
|
169
169
|
reason: 'Stateless action vs stateful toggle.'
|
|
170
170
|
anti_patterns:
|
|
171
171
|
- description: >-
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"$schema": "https://json-schema.org/draft/2020-12/schema",
|
|
3
3
|
"$id": "https://adiaui.dev/a2ui/v0_9/components/CalendarPicker.json",
|
|
4
4
|
"title": "CalendarPicker",
|
|
5
|
-
"description": "Date (and, per `[precision]`, date+time) picker with trigger button and popover panel. Form-associated input emitting an ISO date (or, when `precision` is `minute`/`second`, ISO datetime) string via change events; supports min/max and disabled-date masks. Use for single-date or single-datetime input in forms; for date ranges use <date-range-picker-ui> instead of composing two calendar-picker instances. gh#1372 (#1363 C3c) folded <datetime-picker-ui>'s surface into this widened `precision` axis —
|
|
5
|
+
"description": "Date (and, per `[precision]`, date+time) picker with trigger button and popover panel. Form-associated input emitting an ISO date (or, when `precision` is `minute`/`second`, ISO datetime) string via change events; supports min/max and disabled-date masks. Use for single-date or single-datetime input in forms; for date ranges use <date-range-picker-ui> instead of composing two calendar-picker instances. gh#1372 (#1363 C3c) folded <datetime-picker-ui>'s surface into this widened `precision` axis — that thin alias component was cut in 0.8.43 (gh#1617); this is the sole tag now.",
|
|
6
6
|
"type": "object",
|
|
7
7
|
"allOf": [
|
|
8
8
|
{
|
|
@@ -25,9 +25,8 @@
|
|
|
25
25
|
* `"minute"`/`"second"` additionally composes `<divider-ui>` +
|
|
26
26
|
* `<time-picker-ui>` as a second pane, `value` becomes a full ISO 8601
|
|
27
27
|
* datetime string, and `hour-cycle`/`step`/`locale` become active — the same
|
|
28
|
-
* contract `<datetime-picker-ui>` shipped
|
|
29
|
-
*
|
|
30
|
-
* `precision="minute"` by default. Per ADR-0027, the consumer must
|
|
28
|
+
* contract `<datetime-picker-ui>` shipped; that thin alias subclass was cut
|
|
29
|
+
* in 0.8.43 (gh#1617) — this is the sole tag now. Per ADR-0027, the consumer must
|
|
31
30
|
* explicitly import every composed primitive (see `composes:` in
|
|
32
31
|
* calendar-picker.yaml) — this class doesn't auto-import them.
|
|
33
32
|
*
|
|
@@ -1,9 +1,7 @@
|
|
|
1
|
-
/* gh#1372, #1363 C3c — datetime-picker-ui
|
|
2
|
-
subclass
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
<calendar-picker-ui precision="minute">. */
|
|
6
|
-
@scope (calendar-picker-ui, datetime-picker-ui) {
|
|
1
|
+
/* gh#1372, #1363 C3c — datetime-picker-ui was a thin UICalendarPicker
|
|
2
|
+
subclass folding datetime mode into this component's widened precision
|
|
3
|
+
axis; cut in 0.8.43 (gh#1617). calendar-picker-ui is the sole tag now. */
|
|
4
|
+
@scope (calendar-picker-ui) {
|
|
7
5
|
:where(:scope) {
|
|
8
6
|
/* ── Tokens ── */
|
|
9
7
|
|
|
@@ -192,7 +190,7 @@
|
|
|
192
190
|
/* ── Calendar popover (outside @scope — popover lives in top layer) ── */
|
|
193
191
|
/* Custom properties inherit from the host, so --calendar-picker-* tokens are available here. */
|
|
194
192
|
|
|
195
|
-
|
|
193
|
+
calendar-picker-ui [slot="popover"] {
|
|
196
194
|
margin: 0;
|
|
197
195
|
padding: var(--calendar-picker-popover-padding);
|
|
198
196
|
border: 1px solid var(--calendar-picker-popover-border);
|
|
@@ -211,7 +209,7 @@
|
|
|
211
209
|
translate var(--a-duration-fast) var(--a-easing-out);
|
|
212
210
|
}
|
|
213
211
|
|
|
214
|
-
|
|
212
|
+
calendar-picker-ui [slot="popover"]:popover-open {
|
|
215
213
|
@starting-style {
|
|
216
214
|
opacity: 0;
|
|
217
215
|
translate: 0 -4px;
|
|
@@ -219,7 +217,7 @@
|
|
|
219
217
|
}
|
|
220
218
|
|
|
221
219
|
@media (prefers-reduced-motion: reduce) {
|
|
222
|
-
|
|
220
|
+
calendar-picker-ui [slot="popover"] { transition: none; }
|
|
223
221
|
}
|
|
224
222
|
|
|
225
223
|
/* ── Substrate grid (gh#1371, #1363 C3a) ──
|
|
@@ -231,7 +229,7 @@
|
|
|
231
229
|
so an existing consumer override keeps working unchanged (non-breaking —
|
|
232
230
|
ADR-0055 precedent) and mirrors date-range-picker's own
|
|
233
231
|
`date-range-picker-ui calendar-grid-ui { --calendar-grid-*: … }` pattern. */
|
|
234
|
-
|
|
232
|
+
calendar-picker-ui calendar-grid-ui {
|
|
235
233
|
--calendar-grid-header-gap: var(--calendar-picker-header-gap);
|
|
236
234
|
--calendar-grid-header-mb: var(--calendar-picker-header-mb);
|
|
237
235
|
--calendar-grid-title-fg: var(--calendar-picker-title-fg);
|
|
@@ -281,11 +279,11 @@
|
|
|
281
279
|
single-pane (date-only, default) popover keeps its original fixed-width
|
|
282
280
|
block layout unchanged. Ported near-verbatim from the former
|
|
283
281
|
datetime-picker.css. */
|
|
284
|
-
|
|
282
|
+
calendar-picker-ui [slot="popover"]:has([data-time-pane]) {
|
|
285
283
|
width: auto;
|
|
286
284
|
}
|
|
287
285
|
|
|
288
|
-
|
|
286
|
+
calendar-picker-ui [slot="popover"]:has([data-time-pane]):popover-open {
|
|
289
287
|
display: grid;
|
|
290
288
|
grid-template-columns: auto auto auto;
|
|
291
289
|
grid-template-areas: "cal divider time";
|
|
@@ -293,22 +291,22 @@
|
|
|
293
291
|
align-items: start;
|
|
294
292
|
}
|
|
295
293
|
|
|
296
|
-
|
|
294
|
+
calendar-picker-ui [slot="popover"] > calendar-grid-ui {
|
|
297
295
|
grid-area: cal;
|
|
298
296
|
}
|
|
299
|
-
|
|
297
|
+
calendar-picker-ui [slot="popover"] > [data-pane-divider] {
|
|
300
298
|
grid-area: divider;
|
|
301
299
|
align-self: stretch;
|
|
302
300
|
--divider-color: var(--calendar-picker-divider);
|
|
303
301
|
}
|
|
304
|
-
|
|
302
|
+
calendar-picker-ui [slot="popover"] > [data-time-pane] {
|
|
305
303
|
grid-area: time;
|
|
306
304
|
align-self: start;
|
|
307
305
|
}
|
|
308
306
|
|
|
309
307
|
/* Footer area (consumer-supplied [slot="footer"]) — spans all columns
|
|
310
308
|
under the pane(s), in either single- or two-pane mode. */
|
|
311
|
-
|
|
309
|
+
calendar-picker-ui [slot="popover"] [slot="footer"] {
|
|
312
310
|
grid-column: 1 / -1;
|
|
313
311
|
display: flex;
|
|
314
312
|
justify-content: flex-end;
|
|
@@ -320,14 +318,14 @@
|
|
|
320
318
|
/* Narrow surfaces (e.g. inside a card on mobile): stack the panes
|
|
321
319
|
vertically and replace the vertical divider with a horizontal rule. */
|
|
322
320
|
@container (max-width: 32rem) {
|
|
323
|
-
|
|
321
|
+
calendar-picker-ui [slot="popover"]:has([data-time-pane]):popover-open {
|
|
324
322
|
grid-template-columns: 1fr;
|
|
325
323
|
grid-template-areas:
|
|
326
324
|
"cal"
|
|
327
325
|
"divider"
|
|
328
326
|
"time";
|
|
329
327
|
}
|
|
330
|
-
|
|
328
|
+
calendar-picker-ui [slot="popover"] > [data-pane-divider] {
|
|
331
329
|
align-self: auto;
|
|
332
330
|
}
|
|
333
331
|
}
|
|
@@ -13,8 +13,8 @@ description: >-
|
|
|
13
13
|
single-datetime input in forms; for date ranges use
|
|
14
14
|
<date-range-picker-ui> instead of composing two calendar-picker
|
|
15
15
|
instances. gh#1372 (#1363 C3c) folded <datetime-picker-ui>'s surface into
|
|
16
|
-
this widened `precision` axis —
|
|
17
|
-
|
|
16
|
+
this widened `precision` axis — that thin alias component was cut in
|
|
17
|
+
0.8.43 (gh#1617); this is the sole tag now.
|
|
18
18
|
# Per ADR-0027 — primitives that programmatically create other primitives
|
|
19
19
|
# in their render() do NOT auto-import them. Consumer (or demo shell) must
|
|
20
20
|
# explicitly import each composed primitive.
|
package/components/card/card.css
CHANGED
|
@@ -431,7 +431,7 @@
|
|
|
431
431
|
only collision-free for the bare-marks case: a sparkline (its
|
|
432
432
|
renderer never emits axis ticks, gridlines, value labels, or a
|
|
433
433
|
legend — chart.class.js #renderSparkline), or any other chart-ui
|
|
434
|
-
type with BOTH [
|
|
434
|
+
type with BOTH [no-grid] and [no-values] set (the author opted
|
|
435
435
|
out of every text element). A chart that still draws guides or
|
|
436
436
|
value text — or is paired with a <chart-legend-ui> — needs
|
|
437
437
|
clearance from the card's frame, or that text collides with the
|
|
@@ -444,8 +444,8 @@
|
|
|
444
444
|
section below, wired via chart-legend-ui[for="<chart id>"], which
|
|
445
445
|
never enters this selector (see chart-in-card.examples.html's
|
|
446
446
|
"Full-bleed chart + legend band" example). */
|
|
447
|
-
& > section[bleed]:has(> chart-ui:not([type="sparkline"]):not([
|
|
448
|
-
& > section[bleed]:has(> chart-ui:not([type="sparkline"]):not([
|
|
447
|
+
& > section[bleed]:has(> chart-ui:not([type="sparkline"]):not([no-grid])),
|
|
448
|
+
& > section[bleed]:has(> chart-ui:not([type="sparkline"]):not([no-values])),
|
|
449
449
|
& > section[bleed]:has(> chart-legend-ui) {
|
|
450
450
|
margin: var(--card-inset);
|
|
451
451
|
padding: 0;
|
|
@@ -87,38 +87,23 @@
|
|
|
87
87
|
],
|
|
88
88
|
"default": "abbr"
|
|
89
89
|
},
|
|
90
|
-
"hideAverage": {
|
|
91
|
-
"description": "DEPRECATED (ADR-0063, gh#1563) — use `noAverage` instead. Same meaning, same default; kept working as a dual-read compat shim (one- time console.warn when it's the name that resolves). Removed in 0.9.0.",
|
|
92
|
-
"type": "boolean",
|
|
93
|
-
"default": false
|
|
94
|
-
},
|
|
95
|
-
"hideGrid": {
|
|
96
|
-
"description": "DEPRECATED (ADR-0063, gh#1563) — use `noGrid` instead. Same meaning, same default; kept working as a dual-read compat shim (one-time console.warn when it's the name that resolves). Removed in 0.9.0.",
|
|
97
|
-
"type": "boolean",
|
|
98
|
-
"default": false
|
|
99
|
-
},
|
|
100
|
-
"hideValues": {
|
|
101
|
-
"description": "DEPRECATED (ADR-0063, gh#1563) — use `noValues` instead. Same meaning, same default; kept working as a dual-read compat shim (one- time console.warn when it's the name that resolves). Removed in 0.9.0.",
|
|
102
|
-
"type": "boolean",
|
|
103
|
-
"default": false
|
|
104
|
-
},
|
|
105
90
|
"loading": {
|
|
106
91
|
"description": "Show a skeleton placeholder instead of the chart body. Set to true while data is being fetched; clear once data arrives. Preserves the element's aspect-ratio dimensions so the skeleton occupies the same space the chart will fill. Parity with stat-ui[loading] and table-ui[loading] (§FB-12, v0.6.27).",
|
|
107
92
|
"type": "boolean",
|
|
108
93
|
"default": false
|
|
109
94
|
},
|
|
110
95
|
"noAverage": {
|
|
111
|
-
"description": "When true, suppress the overlaid average line. Canonical spelling (ADR-0063, gh#1563)
|
|
96
|
+
"description": "When true, suppress the overlaid average line. Canonical spelling (ADR-0063, gh#1563) — the deprecated `hideAverage` dual-read shim was cut in 0.8.43 (gh#1617).",
|
|
112
97
|
"type": "boolean",
|
|
113
98
|
"default": false
|
|
114
99
|
},
|
|
115
100
|
"noGrid": {
|
|
116
|
-
"description": "Hide gridlines. Canonical spelling (ADR-0063, gh#1563)
|
|
101
|
+
"description": "Hide gridlines. Canonical spelling (ADR-0063, gh#1563) — the deprecated `hideGrid` dual-read shim was cut in 0.8.43 (gh#1617).",
|
|
117
102
|
"type": "boolean",
|
|
118
103
|
"default": false
|
|
119
104
|
},
|
|
120
105
|
"noValues": {
|
|
121
|
-
"description": "Hide value labels. Canonical spelling (ADR-0063, gh#1563)
|
|
106
|
+
"description": "Hide value labels. Canonical spelling (ADR-0063, gh#1563) — the deprecated `hideValues` dual-read shim was cut in 0.8.43 (gh#1617).",
|
|
122
107
|
"type": "boolean",
|
|
123
108
|
"default": false
|
|
124
109
|
},
|
|
@@ -22,10 +22,9 @@
|
|
|
22
22
|
* x — key for X-axis data
|
|
23
23
|
* y — key(s) for Y-axis, comma-separated for multi-series
|
|
24
24
|
* no-average — suppress the overlaid average line on bar/line (default: false — line shown).
|
|
25
|
-
* `hide-average` is a deprecated dual-read alias (ADR-0063, gh#1563).
|
|
26
25
|
* color — accent/success/warning/danger/info
|
|
27
|
-
* no-grid — hide gridlines.
|
|
28
|
-
* no-values — hide value labels.
|
|
26
|
+
* no-grid — hide gridlines.
|
|
27
|
+
* no-values — hide value labels.
|
|
29
28
|
* corner-radius — bar corner radius in px (default: null, falls back to --a-radius)
|
|
30
29
|
* dots — line/multi-line marker visibility: all|none|hover|last (default: all)
|
|
31
30
|
* series-emphasis — multi-line: series key that keeps full area+line treatment; others render line-only, dimmed
|
|
@@ -216,18 +215,11 @@ export class UIChart extends UIElement {
|
|
|
216
215
|
type: { type: String, default: 'bar', reflect: true },
|
|
217
216
|
x: { type: String, default: '', reflect: true },
|
|
218
217
|
y: { type: String, default: '', reflect: true },
|
|
219
|
-
// ADR-0063 (gh#1563) — `no-*` is the ratified negation prefix;
|
|
220
|
-
//
|
|
221
|
-
// read compat, 0.8.42) so old markup keeps reflecting; `#resolveNoAttr()`
|
|
222
|
-
// (called from connected()) mirrors an old-only value onto the new prop
|
|
223
|
-
// + warns once per attribute. Every internal render usage reads the
|
|
224
|
-
// canonical `noAverage`/`noGrid`/`noValues` below.
|
|
225
|
-
hideAverage: { type: Boolean, default: false, reflect: true, attribute: 'hide-average' },
|
|
218
|
+
// ADR-0063 (gh#1563) — `no-*` is the ratified negation prefix; the
|
|
219
|
+
// deprecated `hide-*` dual-read shim was cut in 0.8.43 (gh#1617).
|
|
226
220
|
noAverage: { type: Boolean, default: false, reflect: true, attribute: 'no-average' },
|
|
227
221
|
color: { type: String, default: '', reflect: true },
|
|
228
|
-
hideGrid: { type: Boolean, default: false, reflect: true, attribute: 'hide-grid' },
|
|
229
222
|
noGrid: { type: Boolean, default: false, reflect: true, attribute: 'no-grid' },
|
|
230
|
-
hideValues: { type: Boolean, default: false, reflect: true, attribute: 'hide-values' },
|
|
231
223
|
noValues: { type: Boolean, default: false, reflect: true, attribute: 'no-values' },
|
|
232
224
|
cornerRadius: { type: Number, default: null, reflect: true, attribute: 'corner-radius' },
|
|
233
225
|
smooth: { type: Number, default: 0.4, reflect: true },
|
|
@@ -251,32 +243,6 @@ export class UIChart extends UIElement {
|
|
|
251
243
|
|
|
252
244
|
static template = () => null;
|
|
253
245
|
|
|
254
|
-
// ADR-0063 (gh#1563) compat-shim warn-once flags — one per renamed
|
|
255
|
-
// attribute (not collapsed into one flag; each fires independently the
|
|
256
|
-
// first time its own old attribute resolves). Per-class, matching
|
|
257
|
-
// toggle-group.class.js's #deprecationWarned idiom.
|
|
258
|
-
static #warned = { hideAverage: false, hideGrid: false, hideValues: false };
|
|
259
|
-
|
|
260
|
-
/** Dual-read resolution for one `hide-*` → `no-*` rename (ADR-0063).
|
|
261
|
-
* New-name precedence: if `newAttr` is present, the old attribute is
|
|
262
|
-
* ignored outright (no mirror, no warn) — the new prop already reflects
|
|
263
|
-
* its own attribute normally. Otherwise, when only the old attribute is
|
|
264
|
-
* present, mirror its (always-true, boolean-presence) value onto the
|
|
265
|
-
* new prop and warn once per class. */
|
|
266
|
-
#resolveNoAttr(oldAttr, newAttr, newProp, warnKey) {
|
|
267
|
-
if (this.hasAttribute(newAttr)) return;
|
|
268
|
-
if (!this.hasAttribute(oldAttr)) return;
|
|
269
|
-
this[newProp] = true;
|
|
270
|
-
if (!UIChart.#warned[warnKey]) {
|
|
271
|
-
UIChart.#warned[warnKey] = true;
|
|
272
|
-
// eslint-disable-next-line no-console
|
|
273
|
-
console.warn(
|
|
274
|
-
`[AdiaUI] <chart-ui [${oldAttr}]> is deprecated — use [${newAttr}] ` +
|
|
275
|
-
`instead (ADR-0063, gh#1563). Kept working as-is; no behavior change.`,
|
|
276
|
-
);
|
|
277
|
-
}
|
|
278
|
-
}
|
|
279
|
-
|
|
280
246
|
#data = [];
|
|
281
247
|
#shapeWarned = false; // FEEDBACK-24: one-shot wrong-.data-shape warning
|
|
282
248
|
#resizeObs = null;
|
|
@@ -353,12 +319,6 @@ export class UIChart extends UIElement {
|
|
|
353
319
|
}
|
|
354
320
|
|
|
355
321
|
connected() {
|
|
356
|
-
// ADR-0063 (gh#1563) compat shims — resolve BEFORE the first render so
|
|
357
|
-
// there's no wrong-then-right flash; see #resolveNoAttr() above.
|
|
358
|
-
this.#resolveNoAttr('hide-average', 'no-average', 'noAverage', 'hideAverage');
|
|
359
|
-
this.#resolveNoAttr('hide-grid', 'no-grid', 'noGrid', 'hideGrid');
|
|
360
|
-
this.#resolveNoAttr('hide-values', 'no-values', 'noValues', 'hideValues');
|
|
361
|
-
|
|
362
322
|
if (!this.hasAttribute('role')) this.setAttribute('role', 'img');
|
|
363
323
|
if (!this.hasAttribute('aria-label')) this.setAttribute('aria-label', `${this.type} chart`);
|
|
364
324
|
|
|
@@ -30,19 +30,13 @@ export class UIChart extends UIElement {
|
|
|
30
30
|
dots: 'all' | 'none' | 'hover' | 'last';
|
|
31
31
|
/** Number-format mode applied to axis labels + value overlays + donut total + gauge value + treemap value + funnel value + internal tooltip. `abbr` is the legacy 1.2K / 3M format; `decimal` fixes 2 decimals; `currency` prefixes via `--chart-currency-prefix` token (default "$"); `percent` multiplies × 100 and adds a % suffix. */
|
|
32
32
|
format: 'abbr' | 'decimal' | 'currency' | 'percent';
|
|
33
|
-
/** DEPRECATED (ADR-0063, gh#1563) — use `noAverage` instead. Same meaning, same default; kept working as a dual-read compat shim (one- time console.warn when it's the name that resolves). Removed in 0.9.0. */
|
|
34
|
-
hideAverage: boolean;
|
|
35
|
-
/** DEPRECATED (ADR-0063, gh#1563) — use `noGrid` instead. Same meaning, same default; kept working as a dual-read compat shim (one-time console.warn when it's the name that resolves). Removed in 0.9.0. */
|
|
36
|
-
hideGrid: boolean;
|
|
37
|
-
/** DEPRECATED (ADR-0063, gh#1563) — use `noValues` instead. Same meaning, same default; kept working as a dual-read compat shim (one- time console.warn when it's the name that resolves). Removed in 0.9.0. */
|
|
38
|
-
hideValues: boolean;
|
|
39
33
|
/** Show a skeleton placeholder instead of the chart body. Set to true while data is being fetched; clear once data arrives. Preserves the element's aspect-ratio dimensions so the skeleton occupies the same space the chart will fill. Parity with stat-ui[loading] and table-ui[loading] (§FB-12, v0.6.27). */
|
|
40
34
|
loading: boolean;
|
|
41
|
-
/** When true, suppress the overlaid average line. Canonical spelling (ADR-0063, gh#1563)
|
|
35
|
+
/** When true, suppress the overlaid average line. Canonical spelling (ADR-0063, gh#1563) — the deprecated `hideAverage` dual-read shim was cut in 0.8.43 (gh#1617). */
|
|
42
36
|
noAverage: boolean;
|
|
43
|
-
/** Hide gridlines. Canonical spelling (ADR-0063, gh#1563)
|
|
37
|
+
/** Hide gridlines. Canonical spelling (ADR-0063, gh#1563) — the deprecated `hideGrid` dual-read shim was cut in 0.8.43 (gh#1617). */
|
|
44
38
|
noGrid: boolean;
|
|
45
|
-
/** Hide value labels. Canonical spelling (ADR-0063, gh#1563)
|
|
39
|
+
/** Hide value labels. Canonical spelling (ADR-0063, gh#1563) — the deprecated `hideValues` dual-read shim was cut in 0.8.43 (gh#1617). */
|
|
46
40
|
noValues: boolean;
|
|
47
41
|
/** Multi-line only. Names one series key (matching a `y` key) to render at full strength — area fill + full-opacity line. Every other series drops its area fill and renders line-only at --chart-deemphasized-opacity. Empty (default) applies full treatment to every series, unchanged from pre-gh#561 behavior. */
|
|
48
42
|
seriesEmphasis: string;
|
|
@@ -61,50 +61,25 @@ props:
|
|
|
61
61
|
- warning
|
|
62
62
|
- danger
|
|
63
63
|
- info
|
|
64
|
-
hideAverage:
|
|
65
|
-
description: >-
|
|
66
|
-
DEPRECATED (ADR-0063, gh#1563) — use `noAverage` instead. Same
|
|
67
|
-
meaning, same default; kept working as a dual-read compat shim (one-
|
|
68
|
-
time console.warn when it's the name that resolves). Removed in
|
|
69
|
-
0.9.0.
|
|
70
|
-
type: boolean
|
|
71
|
-
default: false
|
|
72
|
-
attribute: hide-average
|
|
73
64
|
noAverage:
|
|
74
65
|
description: >-
|
|
75
66
|
When true, suppress the overlaid average line. Canonical spelling
|
|
76
|
-
(ADR-0063, gh#1563)
|
|
67
|
+
(ADR-0063, gh#1563) — the deprecated `hideAverage` dual-read shim
|
|
68
|
+
was cut in 0.8.43 (gh#1617).
|
|
77
69
|
type: boolean
|
|
78
70
|
default: false
|
|
79
71
|
attribute: no-average
|
|
80
|
-
hideGrid:
|
|
81
|
-
description: >-
|
|
82
|
-
DEPRECATED (ADR-0063, gh#1563) — use `noGrid` instead. Same meaning,
|
|
83
|
-
same default; kept working as a dual-read compat shim (one-time
|
|
84
|
-
console.warn when it's the name that resolves). Removed in 0.9.0.
|
|
85
|
-
type: boolean
|
|
86
|
-
default: false
|
|
87
|
-
attribute: hide-grid
|
|
88
72
|
noGrid:
|
|
89
73
|
description: >-
|
|
90
|
-
Hide gridlines. Canonical spelling (ADR-0063, gh#1563)
|
|
91
|
-
`hideGrid
|
|
74
|
+
Hide gridlines. Canonical spelling (ADR-0063, gh#1563) — the
|
|
75
|
+
deprecated `hideGrid` dual-read shim was cut in 0.8.43 (gh#1617).
|
|
92
76
|
type: boolean
|
|
93
77
|
default: false
|
|
94
78
|
attribute: no-grid
|
|
95
|
-
hideValues:
|
|
96
|
-
description: >-
|
|
97
|
-
DEPRECATED (ADR-0063, gh#1563) — use `noValues` instead. Same
|
|
98
|
-
meaning, same default; kept working as a dual-read compat shim (one-
|
|
99
|
-
time console.warn when it's the name that resolves). Removed in
|
|
100
|
-
0.9.0.
|
|
101
|
-
type: boolean
|
|
102
|
-
default: false
|
|
103
|
-
attribute: hide-values
|
|
104
79
|
noValues:
|
|
105
80
|
description: >-
|
|
106
|
-
Hide value labels. Canonical spelling (ADR-0063, gh#1563)
|
|
107
|
-
`hideValues
|
|
81
|
+
Hide value labels. Canonical spelling (ADR-0063, gh#1563) — the
|
|
82
|
+
deprecated `hideValues` dual-read shim was cut in 0.8.43 (gh#1617).
|
|
108
83
|
type: boolean
|
|
109
84
|
default: false
|
|
110
85
|
attribute: no-values
|
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
"default": ""
|
|
28
28
|
},
|
|
29
29
|
"interactive": {
|
|
30
|
-
"description": "Canonical opt-in spelling (ADR-0063, gh#1563)
|
|
30
|
+
"description": "Canonical opt-in spelling (ADR-0063, gh#1563) — the deprecated `static` opt-out alias was cut in 0.8.43 (gh#1617). Rows are interactive <button>-role badges by default — this default stays `true` (deliberately NOT flipped yet; the 0.9.0 cut inverts it to `false` after a full consumer scan of every `<chart-legend-ui>` tag per the ADR).",
|
|
31
31
|
"type": "boolean",
|
|
32
32
|
"default": true
|
|
33
33
|
},
|
|
@@ -61,11 +61,6 @@
|
|
|
61
61
|
"dashed"
|
|
62
62
|
],
|
|
63
63
|
"default": "dot"
|
|
64
|
-
},
|
|
65
|
-
"static": {
|
|
66
|
-
"description": "DEPRECATED (ADR-0063, gh#1563) — use `interactive` instead. When set (and `interactive` is absent), rows are non-interactive <span>s (no click, no toggle). Kept working as a dual-read compat shim (one-time console.warn when it's the name that resolves). Removed in 0.9.0.",
|
|
67
|
-
"type": "boolean",
|
|
68
|
-
"default": false
|
|
69
64
|
}
|
|
70
65
|
},
|
|
71
66
|
"required": [
|
|
@@ -81,7 +76,7 @@
|
|
|
81
76
|
],
|
|
82
77
|
"events": {
|
|
83
78
|
"toggle": {
|
|
84
|
-
"description": "Fires on row click
|
|
79
|
+
"description": "Fires on row click when interactive. Detail: {key, active, mode}. `active` is the new state (true=visible). Consumers (or chart-ui via [for]) wire this to series visibility.",
|
|
85
80
|
"detail": {
|
|
86
81
|
"active": {
|
|
87
82
|
"description": "New visibility state (true = visible).",
|
|
@@ -138,12 +133,8 @@
|
|
|
138
133
|
"name": "idle"
|
|
139
134
|
},
|
|
140
135
|
{
|
|
141
|
-
"description": "Rows are <button>s.
|
|
136
|
+
"description": "Rows are <button>s (the default). When false, rows are <span>s — no click handler, no toggle affordance.",
|
|
142
137
|
"name": "interactive"
|
|
143
|
-
},
|
|
144
|
-
{
|
|
145
|
-
"description": "Rows are <span>s. No click handler, no toggle affordance.",
|
|
146
|
-
"name": "static"
|
|
147
138
|
}
|
|
148
139
|
],
|
|
149
140
|
"status": "stable",
|
|
@@ -38,16 +38,15 @@
|
|
|
38
38
|
* interactive — canonical opt-in spelling (ADR-0063, gh#1563). Rows
|
|
39
39
|
* default interactive (`role="button"` badges that toggle
|
|
40
40
|
* on click + Enter/Space) until the 0.9.0 default-inversion
|
|
41
|
-
* cut. `static`
|
|
42
|
-
* (
|
|
43
|
-
* non-interactive badges (no role/tabindex/handlers).
|
|
41
|
+
* cut. The deprecated `static` opt-out alias was cut in
|
|
42
|
+
* 0.8.43 (gh#1617).
|
|
44
43
|
* on-toggle — hide | opacity. Default hide. Escape hatch per OD-CHART-09.
|
|
45
44
|
* Reported via the `toggle` event detail; chart-ui reads it
|
|
46
45
|
* when wired via [for].
|
|
47
46
|
*
|
|
48
47
|
* Events:
|
|
49
48
|
* toggle — detail: {key, active, mode}. Fires on row click when
|
|
50
|
-
*
|
|
49
|
+
* interactive. `active` is the new state (true=visible).
|
|
51
50
|
*/
|
|
52
51
|
|
|
53
52
|
import { UIElement } from '../../core/element.js';
|
|
@@ -61,67 +60,24 @@ export class UIChartLegend extends UIElement {
|
|
|
61
60
|
items: { type: String, default: '', reflect: false },
|
|
62
61
|
shape: { type: String, default: 'dot', reflect: true },
|
|
63
62
|
position: { type: String, default: 'bottom', reflect: true },
|
|
64
|
-
// ADR-0063 (gh#1563) — `
|
|
65
|
-
//
|
|
66
|
-
//
|
|
67
|
-
// default
|
|
68
|
-
//
|
|
69
|
-
//
|
|
70
|
-
//
|
|
71
|
-
// requirement (every `<chart-legend-ui>` tag needs review first).
|
|
72
|
-
static: { type: Boolean, default: false, reflect: true },
|
|
63
|
+
// ADR-0063 (gh#1563) — `interactive` (opt-in) is the canonical
|
|
64
|
+
// positively-named boolean; the deprecated `static` opt-out alias was
|
|
65
|
+
// cut in 0.8.43 (gh#1617). Deliberately keeps its `true` default:
|
|
66
|
+
// the real default-inversion (interactive defaulting to `false`) is
|
|
67
|
+
// still scheduled for 0.9.0 per the ADR's own consumer-scan
|
|
68
|
+
// requirement (every `<chart-legend-ui>` tag needs review first) —
|
|
69
|
+
// out of this ticket's scope, which only cuts the `static` alias.
|
|
73
70
|
interactive: { type: Boolean, default: true, reflect: true },
|
|
74
71
|
onToggle: { type: String, default: 'hide', reflect: true, attribute: 'on-toggle' },
|
|
75
72
|
};
|
|
76
73
|
|
|
77
74
|
static template = () => null;
|
|
78
75
|
|
|
79
|
-
// ADR-0063 (gh#1563) one-shot-per-class deprecation warn for [static].
|
|
80
|
-
static #warnedStatic = false;
|
|
81
|
-
|
|
82
76
|
#target = null;
|
|
83
77
|
#targetListener = null;
|
|
84
78
|
#hiddenKeys = new Set();
|
|
85
79
|
|
|
86
|
-
// ADR-0063 (gh#1563) — captured by overriding `connectedCallback()` to run
|
|
87
|
-
// BEFORE calling `super.connectedCallback()`. `interactive` defaults
|
|
88
|
-
// `true` (a reflected Boolean), and UIElement's own connectedCallback
|
|
89
|
-
// pre-sync loop stamps the attribute for any reflected Boolean prop whose
|
|
90
|
-
// value is already `true` and whose attribute is absent (gh#961) — that
|
|
91
|
-
// stamp happens INSIDE `super.connectedCallback()`, so a check made from
|
|
92
|
-
// `connected()` (which UIElement invokes AFTER its pre-sync loop) would
|
|
93
|
-
// see `[interactive]` present even when the author never wrote it.
|
|
94
|
-
// Capturing here, before the super call, reads only the AUTHORED markup —
|
|
95
|
-
// the constructor is too early (elements are constructed attribute-less
|
|
96
|
-
// then have each attribute set individually as the parser processes them;
|
|
97
|
-
// by connectedCallback time every authored attribute has already landed).
|
|
98
|
-
#authoredInteractive = false;
|
|
99
|
-
#authoredStatic = false;
|
|
100
|
-
|
|
101
|
-
connectedCallback() {
|
|
102
|
-
this.#authoredInteractive = this.hasAttribute('interactive');
|
|
103
|
-
this.#authoredStatic = this.hasAttribute('static');
|
|
104
|
-
super.connectedCallback();
|
|
105
|
-
}
|
|
106
|
-
|
|
107
80
|
connected() {
|
|
108
|
-
// ADR-0063 (gh#1563) compat shim — resolve BEFORE the first render/paint
|
|
109
|
-
// so there's no wrong-then-right flash. New-name precedence: [interactive]
|
|
110
|
-
// wins outright when present, regardless of [static]; only fall back to
|
|
111
|
-
// (and mirror) [static] when [interactive] is absent from markup.
|
|
112
|
-
if (!this.#authoredInteractive && this.#authoredStatic) {
|
|
113
|
-
this.interactive = false;
|
|
114
|
-
if (!UIChartLegend.#warnedStatic) {
|
|
115
|
-
UIChartLegend.#warnedStatic = true;
|
|
116
|
-
// eslint-disable-next-line no-console
|
|
117
|
-
console.warn(
|
|
118
|
-
'[AdiaUI] <chart-legend-ui [static]> is deprecated — use ' +
|
|
119
|
-
'[interactive] instead (ADR-0063, gh#1563). Note: [interactive] ' +
|
|
120
|
-
'still defaults to true until the 0.9.0 default-inversion cut. ' +
|
|
121
|
-
'Kept working as-is; no behavior change.',
|
|
122
|
-
);
|
|
123
|
-
}
|
|
124
|
-
}
|
|
125
81
|
this.setAttribute('role', 'list');
|
|
126
82
|
this.#resolveTarget();
|
|
127
83
|
this.#paint();
|
|
@@ -28,7 +28,7 @@ export class UIChartLegend extends UIElement {
|
|
|
28
28
|
items: string;
|
|
29
29
|
/** id-ref of a chart-ui / heatmap-ui to mirror series from. */
|
|
30
30
|
for: string;
|
|
31
|
-
/** Canonical opt-in spelling (ADR-0063, gh#1563)
|
|
31
|
+
/** Canonical opt-in spelling (ADR-0063, gh#1563) — the deprecated `static` opt-out alias was cut in 0.8.43 (gh#1617). Rows are interactive <button>-role badges by default — this default stays `true` (deliberately NOT flipped yet; the 0.9.0 cut inverts it to `false` after a full consumer scan of every `<chart-legend-ui>` tag per the ADR). */
|
|
32
32
|
interactive: boolean;
|
|
33
33
|
/** Series-toggle mode emitted via the `toggle` event. `hide` removes the series from the render; `opacity` fades it. Wired via [for] on chart-ui. */
|
|
34
34
|
onToggle: 'hide' | 'opacity';
|
|
@@ -36,8 +36,6 @@ export class UIChartLegend extends UIElement {
|
|
|
36
36
|
position: 'top' | 'bottom' | 'left' | 'right';
|
|
37
37
|
/** Swatch shape. Maps to badge-ui's icon for dot/square variants. */
|
|
38
38
|
shape: 'dot' | 'square' | 'line' | 'dashed';
|
|
39
|
-
/** DEPRECATED (ADR-0063, gh#1563) — use `interactive` instead. When set (and `interactive` is absent), rows are non-interactive <span>s (no click, no toggle). Kept working as a dual-read compat shim (one-time console.warn when it's the name that resolves). Removed in 0.9.0. */
|
|
40
|
-
static: boolean;
|
|
41
39
|
|
|
42
40
|
addEventListener(type: 'toggle', listener: (ev: ChartLegendToggleEvent) => unknown, options?: boolean | AddEventListenerOptions): void;
|
|
43
41
|
addEventListener<K extends keyof HTMLElementEventMap>(
|
|
@@ -47,22 +47,14 @@ props:
|
|
|
47
47
|
- left
|
|
48
48
|
- right
|
|
49
49
|
reflect: true
|
|
50
|
-
static:
|
|
51
|
-
description: >-
|
|
52
|
-
DEPRECATED (ADR-0063, gh#1563) — use `interactive` instead. When set
|
|
53
|
-
(and `interactive` is absent), rows are non-interactive <span>s (no
|
|
54
|
-
click, no toggle). Kept working as a dual-read compat shim (one-time
|
|
55
|
-
console.warn when it's the name that resolves). Removed in 0.9.0.
|
|
56
|
-
type: boolean
|
|
57
|
-
default: false
|
|
58
|
-
reflect: true
|
|
59
50
|
interactive:
|
|
60
51
|
description: >-
|
|
61
|
-
Canonical opt-in spelling (ADR-0063, gh#1563)
|
|
62
|
-
opt-out
|
|
63
|
-
default — this default stays
|
|
64
|
-
flipped yet; the 0.9.0 cut inverts it to
|
|
65
|
-
consumer scan of every `<chart-legend-ui>` tag
|
|
52
|
+
Canonical opt-in spelling (ADR-0063, gh#1563) — the deprecated
|
|
53
|
+
`static` opt-out alias was cut in 0.8.43 (gh#1617). Rows are
|
|
54
|
+
interactive <button>-role badges by default — this default stays
|
|
55
|
+
`true` (deliberately NOT flipped yet; the 0.9.0 cut inverts it to
|
|
56
|
+
`false` after a full consumer scan of every `<chart-legend-ui>` tag
|
|
57
|
+
per the ADR).
|
|
66
58
|
type: boolean
|
|
67
59
|
default: true
|
|
68
60
|
reflect: true
|
|
@@ -80,7 +72,7 @@ props:
|
|
|
80
72
|
events:
|
|
81
73
|
toggle:
|
|
82
74
|
description: >-
|
|
83
|
-
Fires on row click
|
|
75
|
+
Fires on row click when interactive. Detail: {key, active, mode}. `active` is
|
|
84
76
|
the new state (true=visible). Consumers (or chart-ui via [for]) wire
|
|
85
77
|
this to series visibility.
|
|
86
78
|
detail:
|
|
@@ -104,9 +96,7 @@ states:
|
|
|
104
96
|
- name: idle
|
|
105
97
|
description: Default, ready for interaction.
|
|
106
98
|
- name: interactive
|
|
107
|
-
description: Rows are <button>s.
|
|
108
|
-
- name: static
|
|
109
|
-
description: Rows are <span>s. No click handler, no toggle affordance.
|
|
99
|
+
description: Rows are <button>s (the default). When false, rows are <span>s — no click handler, no toggle affordance.
|
|
110
100
|
traits: []
|
|
111
101
|
tokens: {}
|
|
112
102
|
a2ui:
|
|
@@ -115,7 +105,7 @@ a2ui:
|
|
|
115
105
|
reason: 'Legend pattern.'
|
|
116
106
|
- rule: 'Pairs with <chart-ui> via [for] id-ref (auto-bidirectional series toggling) or via items= for standalone use.'
|
|
117
107
|
reason: 'Composition contract.'
|
|
118
|
-
- rule: 'position attribute (top|bottom|left|right) places legend relative to its chart;
|
|
108
|
+
- rule: 'position attribute (top|bottom|left|right) places legend relative to its chart; interactive="false" disables interactivity.'
|
|
119
109
|
reason: 'Layout + interaction knobs.'
|
|
120
110
|
anti_patterns: []
|
|
121
111
|
examples:
|