@fusion.dev/helix 0.176.1 → 0.177.1
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/custom-elements.json +1476 -684
- package/dist/aura/root/aura-root.d.ts +12 -1
- package/dist/aura/root/aura-root.js +14 -2
- package/dist/avatar/root/avatar-root.d.ts +1 -1
- package/dist/canvas/root/canvas-root.d.ts +4 -0
- package/dist/donut-chart/root/donut-chart-root.css.js +1 -1
- package/dist/donut-chart/root/donut-chart-root.js +2 -1
- package/dist/element-events.generated.js +2 -0
- package/dist/graph/root/graph-root.d.ts +4 -0
- package/dist/heatmap/root/heatmap-root.css.js +2 -1
- package/dist/icon-button/root/icon-button-root.css.js +2 -2
- package/dist/loader/root/loader-root.css.js +2 -2
- package/dist/loader/root/loader-root.d.ts +4 -1
- package/dist/map/root/map-root.d.ts +4 -0
- package/dist/scatter-chart/root/scatter-chart-root.css.js +1 -1
- package/dist/shared/chart/status.css.js +1 -1
- package/dist/tree/item/tree-item.d.ts +1 -1
- package/lint.json +1 -1
- package/package.json +6 -6
- package/types/jsx.d.ts +487 -337
- package/types/vue.d.ts +101 -15
package/types/jsx.d.ts
CHANGED
|
@@ -1696,6 +1696,13 @@ hit-testable at rest, or it would swallow clicks meant for what is over it,
|
|
|
1696
1696
|
and an element that is not hit-testable never receives the `pointermove`
|
|
1697
1697
|
this listens for. Asking for the pointer is asking for the hit test. */
|
|
1698
1698
|
interactive?: (HelixAura["interactive"]) | undefined;
|
|
1699
|
+
/** Whether the field holds still on the frame it shows.
|
|
1700
|
+
|
|
1701
|
+
Set it from a pause control on your page, so a reader can stop the motion,
|
|
1702
|
+
as WCAG 2.2.2 asks of anything that moves for more than five seconds. A
|
|
1703
|
+
change to another property still repaints the frame. Clearing it starts
|
|
1704
|
+
the field from where it stopped. */
|
|
1705
|
+
paused?: (HelixAura["paused"]) | undefined;
|
|
1699
1706
|
/** How far the pointer reaches into the field, `0` upward.
|
|
1700
1707
|
|
|
1701
1708
|
Multiplied into the presence the pointer already fades in and out with, so
|
|
@@ -1808,6 +1815,13 @@ hit-testable at rest, or it would swallow clicks meant for what is over it,
|
|
|
1808
1815
|
and an element that is not hit-testable never receives the `pointermove`
|
|
1809
1816
|
this listens for. Asking for the pointer is asking for the hit test. */
|
|
1810
1817
|
"prop:interactive"?: (HelixAura["interactive"]) | undefined;
|
|
1818
|
+
/** Whether the field holds still on the frame it shows.
|
|
1819
|
+
|
|
1820
|
+
Set it from a pause control on your page, so a reader can stop the motion,
|
|
1821
|
+
as WCAG 2.2.2 asks of anything that moves for more than five seconds. A
|
|
1822
|
+
change to another property still repaints the frame. Clearing it starts
|
|
1823
|
+
the field from where it stopped. */
|
|
1824
|
+
"prop:paused"?: (HelixAura["paused"]) | undefined;
|
|
1811
1825
|
/** How far the pointer reaches into the field, `0` upward.
|
|
1812
1826
|
|
|
1813
1827
|
Multiplied into the presence the pointer already fades in and out with, so
|
|
@@ -6532,7 +6546,7 @@ Here rather than on each control. */
|
|
|
6532
6546
|
"onhelix-send"?: ((e: HelixChatComposerHelixSendElementEvent) => void) | undefined;
|
|
6533
6547
|
/** The user started or stopped writing, with `typing` saying which, as the composer's `typing` does. */
|
|
6534
6548
|
"onhelix-typing"?: ((e: HelixChatComposerHelixTypingElementEvent) => void) | undefined;
|
|
6535
|
-
/** The user changed the text. Read it from `value`, for a typing indicator or a saved draft.
|
|
6549
|
+
/** The user changed the text. Read it from `value`, for a typing indicator or a saved draft. Bubbles and is composed, as a native field's is. */
|
|
6536
6550
|
oninput?: ((e: HelixChatComposerElementEvent) => void) | undefined;
|
|
6537
6551
|
};
|
|
6538
6552
|
|
|
@@ -6621,7 +6635,7 @@ Here rather than on each control. */
|
|
|
6621
6635
|
"on:helix-send"?: ((e: HelixChatComposerHelixSendElementEvent) => void) | undefined;
|
|
6622
6636
|
/** The user started or stopped writing, with `typing` saying which, as the composer's `typing` does. */
|
|
6623
6637
|
"on:helix-typing"?: ((e: HelixChatComposerHelixTypingElementEvent) => void) | undefined;
|
|
6624
|
-
/** The user changed the text. Read it from `value`, for a typing indicator or a saved draft.
|
|
6638
|
+
/** The user changed the text. Read it from `value`, for a typing indicator or a saved draft. Bubbles and is composed, as a native field's is. */
|
|
6625
6639
|
"on:input"?: ((e: HelixChatComposerElementEvent) => void) | undefined;
|
|
6626
6640
|
|
|
6627
6641
|
/** Set the innerHTML of the element */
|
|
@@ -14216,6 +14230,18 @@ Unset is horizontal, or across the toolbar the divider sits in. */
|
|
|
14216
14230
|
textContent?: (string | number) | undefined;
|
|
14217
14231
|
};
|
|
14218
14232
|
|
|
14233
|
+
/** `HelixDonutChart` component event */
|
|
14234
|
+
export type HelixDonutChartElementEvent<E = Event> = TypedEvent<
|
|
14235
|
+
HelixDonutChart,
|
|
14236
|
+
E
|
|
14237
|
+
>;
|
|
14238
|
+
/** `helix-reading-change` event type */
|
|
14239
|
+
export type HelixDonutChartHelixReadingChangeElementEvent =
|
|
14240
|
+
HelixDonutChartElementEvent<HelixReadingChangeEvent>;
|
|
14241
|
+
/** `helix-reading-press` event type */
|
|
14242
|
+
export type HelixDonutChartHelixReadingPressElementEvent =
|
|
14243
|
+
HelixDonutChartElementEvent<HelixReadingPressEvent>;
|
|
14244
|
+
|
|
14219
14245
|
export type HelixDonutChartProps = {
|
|
14220
14246
|
/** How strongly the slices are drawn.
|
|
14221
14247
|
|
|
@@ -14258,6 +14284,25 @@ chart and a card mean the same thing by the word.
|
|
|
14258
14284
|
material choice, it is an absent series, and a chart says that by not
|
|
14259
14285
|
having the datum rather than by painting it invisibly. */
|
|
14260
14286
|
material?: (HelixDonutChart["material"]) | undefined;
|
|
14287
|
+
/** The words shown in place of the drawing when the table has no readings,
|
|
14288
|
+
and the fallback of the `empty` slot. */
|
|
14289
|
+
"empty-text"?: (HelixDonutChart["emptyText"]) | undefined;
|
|
14290
|
+
/** The words shown in place of the drawing when the table has no readings,
|
|
14291
|
+
and the fallback of the `empty` slot. */
|
|
14292
|
+
emptyText?: (HelixDonutChart["emptyText"]) | undefined;
|
|
14293
|
+
/** Whether the readings are still on their way. The chart shows
|
|
14294
|
+
`loading-text` in place of an empty drawing until it has readings.
|
|
14295
|
+
|
|
14296
|
+
Reflected, so a stylesheet can treat the chart while it waits. A chart
|
|
14297
|
+
that already has readings keeps drawing them, so a refresh does not
|
|
14298
|
+
blank it. */
|
|
14299
|
+
loading?: (HelixDonutChart["loading"]) | undefined;
|
|
14300
|
+
/** The words shown in place of the drawing while `loading` is set and
|
|
14301
|
+
there are no readings yet, and the fallback of the `loading` slot. */
|
|
14302
|
+
"loading-text"?: (HelixDonutChart["loadingText"]) | undefined;
|
|
14303
|
+
/** The words shown in place of the drawing while `loading` is set and
|
|
14304
|
+
there are no readings yet, and the fallback of the `loading` slot. */
|
|
14305
|
+
loadingText?: (HelixDonutChart["loadingText"]) | undefined;
|
|
14261
14306
|
/** The id of the table to read.
|
|
14262
14307
|
|
|
14263
14308
|
Names a table in the same tree, so a chart inside another component's
|
|
@@ -14381,6 +14426,15 @@ frame, and the summary, the keys and the readout are then the whole of
|
|
|
14381
14426
|
what a screen reader is given. Set a new object to redraw: the chart
|
|
14382
14427
|
does not look inside the one it has. */
|
|
14383
14428
|
data?: (HelixDonutChart["data"]) | undefined;
|
|
14429
|
+
|
|
14430
|
+
/** The slice shown moved, or was put away: `index` is the slice's row, or `-1` for none, with its `label` and the `pointerType` that moved it. */
|
|
14431
|
+
"onhelix-reading-change"?: ((
|
|
14432
|
+
e: HelixDonutChartHelixReadingChangeElementEvent,
|
|
14433
|
+
) => void) | undefined;
|
|
14434
|
+
/** A slice was clicked, tapped, or pressed with Enter or Space, with the same detail as `helix-reading-change`. */
|
|
14435
|
+
"onhelix-reading-press"?: ((
|
|
14436
|
+
e: HelixDonutChartHelixReadingPressElementEvent,
|
|
14437
|
+
) => void) | undefined;
|
|
14384
14438
|
};
|
|
14385
14439
|
|
|
14386
14440
|
export type HelixDonutChartSolidJsProps = {
|
|
@@ -14425,6 +14479,25 @@ chart and a card mean the same thing by the word.
|
|
|
14425
14479
|
material choice, it is an absent series, and a chart says that by not
|
|
14426
14480
|
having the datum rather than by painting it invisibly. */
|
|
14427
14481
|
"prop:material"?: (HelixDonutChart["material"]) | undefined;
|
|
14482
|
+
/** The words shown in place of the drawing when the table has no readings,
|
|
14483
|
+
and the fallback of the `empty` slot. */
|
|
14484
|
+
"attr:empty-text"?: (HelixDonutChart["emptyText"]) | undefined;
|
|
14485
|
+
/** The words shown in place of the drawing when the table has no readings,
|
|
14486
|
+
and the fallback of the `empty` slot. */
|
|
14487
|
+
"prop:emptyText"?: (HelixDonutChart["emptyText"]) | undefined;
|
|
14488
|
+
/** Whether the readings are still on their way. The chart shows
|
|
14489
|
+
`loading-text` in place of an empty drawing until it has readings.
|
|
14490
|
+
|
|
14491
|
+
Reflected, so a stylesheet can treat the chart while it waits. A chart
|
|
14492
|
+
that already has readings keeps drawing them, so a refresh does not
|
|
14493
|
+
blank it. */
|
|
14494
|
+
"prop:loading"?: (HelixDonutChart["loading"]) | undefined;
|
|
14495
|
+
/** The words shown in place of the drawing while `loading` is set and
|
|
14496
|
+
there are no readings yet, and the fallback of the `loading` slot. */
|
|
14497
|
+
"attr:loading-text"?: (HelixDonutChart["loadingText"]) | undefined;
|
|
14498
|
+
/** The words shown in place of the drawing while `loading` is set and
|
|
14499
|
+
there are no readings yet, and the fallback of the `loading` slot. */
|
|
14500
|
+
"prop:loadingText"?: (HelixDonutChart["loadingText"]) | undefined;
|
|
14428
14501
|
/** The id of the table to read.
|
|
14429
14502
|
|
|
14430
14503
|
Names a table in the same tree, so a chart inside another component's
|
|
@@ -14548,6 +14621,14 @@ frame, and the summary, the keys and the readout are then the whole of
|
|
|
14548
14621
|
what a screen reader is given. Set a new object to redraw: the chart
|
|
14549
14622
|
does not look inside the one it has. */
|
|
14550
14623
|
"prop:data"?: (HelixDonutChart["data"]) | undefined;
|
|
14624
|
+
/** The slice shown moved, or was put away: `index` is the slice's row, or `-1` for none, with its `label` and the `pointerType` that moved it. */
|
|
14625
|
+
"on:helix-reading-change"?: ((
|
|
14626
|
+
e: HelixDonutChartHelixReadingChangeElementEvent,
|
|
14627
|
+
) => void) | undefined;
|
|
14628
|
+
/** A slice was clicked, tapped, or pressed with Enter or Space, with the same detail as `helix-reading-change`. */
|
|
14629
|
+
"on:helix-reading-press"?: ((
|
|
14630
|
+
e: HelixDonutChartHelixReadingPressElementEvent,
|
|
14631
|
+
) => void) | undefined;
|
|
14551
14632
|
|
|
14552
14633
|
/** Set the innerHTML of the element */
|
|
14553
14634
|
innerHTML?: (string) | undefined;
|
|
@@ -17140,6 +17221,14 @@ own, since the fallback name is the same word. Empty leaves the role. */
|
|
|
17140
17221
|
"selected-label"?: (HelixGraph["selectedLabel"]) | undefined;
|
|
17141
17222
|
/** How the selected note is described in the list. */
|
|
17142
17223
|
selectedLabel?: (HelixGraph["selectedLabel"]) | undefined;
|
|
17224
|
+
/** What screen readers hear after a reader selects a note, in the list or in
|
|
17225
|
+
the drawing, with `{note}` for its name and `{count}` for how many notes
|
|
17226
|
+
the list then holds, written with `count-label`. */
|
|
17227
|
+
"selection-label"?: (HelixGraph["selectionLabel"]) | undefined;
|
|
17228
|
+
/** What screen readers hear after a reader selects a note, in the list or in
|
|
17229
|
+
the drawing, with `{note}` for its name and `{count}` for how many notes
|
|
17230
|
+
the list then holds, written with `count-label`. */
|
|
17231
|
+
selectionLabel?: (HelixGraph["selectionLabel"]) | undefined;
|
|
17143
17232
|
/** The hint shown when one finger swipes over the graph with `gestures="cooperative"`. */
|
|
17144
17233
|
"two-finger-hint-label"?: (HelixGraph["twoFingerHintLabel"]) | undefined;
|
|
17145
17234
|
/** The hint shown when one finger swipes over the graph with `gestures="cooperative"`. */
|
|
@@ -17459,6 +17548,14 @@ own, since the fallback name is the same word. Empty leaves the role. */
|
|
|
17459
17548
|
"attr:selected-label"?: (HelixGraph["selectedLabel"]) | undefined;
|
|
17460
17549
|
/** How the selected note is described in the list. */
|
|
17461
17550
|
"prop:selectedLabel"?: (HelixGraph["selectedLabel"]) | undefined;
|
|
17551
|
+
/** What screen readers hear after a reader selects a note, in the list or in
|
|
17552
|
+
the drawing, with `{note}` for its name and `{count}` for how many notes
|
|
17553
|
+
the list then holds, written with `count-label`. */
|
|
17554
|
+
"attr:selection-label"?: (HelixGraph["selectionLabel"]) | undefined;
|
|
17555
|
+
/** What screen readers hear after a reader selects a note, in the list or in
|
|
17556
|
+
the drawing, with `{note}` for its name and `{count}` for how many notes
|
|
17557
|
+
the list then holds, written with `count-label`. */
|
|
17558
|
+
"prop:selectionLabel"?: (HelixGraph["selectionLabel"]) | undefined;
|
|
17462
17559
|
/** The hint shown when one finger swipes over the graph with `gestures="cooperative"`. */
|
|
17463
17560
|
"attr:two-finger-hint-label"?: (HelixGraph["twoFingerHintLabel"]) | undefined;
|
|
17464
17561
|
/** The hint shown when one finger swipes over the graph with `gestures="cooperative"`. */
|
|
@@ -17876,8 +17973,9 @@ no order in it. */
|
|
|
17876
17973
|
/** The name the `overview` gives the total of the readings drawn,
|
|
17877
17974
|
`{totalLabel}` in `overview-label`. */
|
|
17878
17975
|
totalLabel?: (HelixHeatmap["totalLabel"]) | undefined;
|
|
17879
|
-
/** The selected cells, by
|
|
17880
|
-
`2026-06-11`,
|
|
17976
|
+
/** The selected cells, separated by commas: each by the date its row's
|
|
17977
|
+
header carries in a `<time datetime>`, such as `2026-06-11`, or by the
|
|
17978
|
+
header's words where it carries none.
|
|
17881
17979
|
|
|
17882
17980
|
Set it to start with cells selected. Written by a press or a key under
|
|
17883
17981
|
`selection-mode`. */
|
|
@@ -18082,8 +18180,9 @@ no order in it. */
|
|
|
18082
18180
|
/** The name the `overview` gives the total of the readings drawn,
|
|
18083
18181
|
`{totalLabel}` in `overview-label`. */
|
|
18084
18182
|
"prop:totalLabel"?: (HelixHeatmap["totalLabel"]) | undefined;
|
|
18085
|
-
/** The selected cells, by
|
|
18086
|
-
`2026-06-11`,
|
|
18183
|
+
/** The selected cells, separated by commas: each by the date its row's
|
|
18184
|
+
header carries in a `<time datetime>`, such as `2026-06-11`, or by the
|
|
18185
|
+
header's words where it carries none.
|
|
18087
18186
|
|
|
18088
18187
|
Set it to start with cells selected. Written by a press or a key under
|
|
18089
18188
|
`selection-mode`. */
|
|
@@ -21900,6 +21999,10 @@ loader is on the page.
|
|
|
21900
21999
|
Names an element in the same tree. In React it arrives as a property, the
|
|
21901
22000
|
way `Tooltip.for` does. */
|
|
21902
22001
|
for?: (HelixLoader["for"]) | undefined;
|
|
22002
|
+
/** Whether no work is in progress. The loader draws nothing of its own, has
|
|
22003
|
+
no role, and marks no region busy, and what is in the `content` slot
|
|
22004
|
+
shows. Clearing it starts `delay` again. */
|
|
22005
|
+
idle?: (HelixLoader["idle"]) | undefined;
|
|
21903
22006
|
/** The loader's name, announced by screen readers while the work is in
|
|
21904
22007
|
progress. */
|
|
21905
22008
|
label?: (HelixLoader["label"]) | undefined;
|
|
@@ -21930,6 +22033,10 @@ loader is on the page.
|
|
|
21930
22033
|
Names an element in the same tree. In React it arrives as a property, the
|
|
21931
22034
|
way `Tooltip.for` does. */
|
|
21932
22035
|
"prop:for"?: (HelixLoader["for"]) | undefined;
|
|
22036
|
+
/** Whether no work is in progress. The loader draws nothing of its own, has
|
|
22037
|
+
no role, and marks no region busy, and what is in the `content` slot
|
|
22038
|
+
shows. Clearing it starts `delay` again. */
|
|
22039
|
+
"prop:idle"?: (HelixLoader["idle"]) | undefined;
|
|
21933
22040
|
/** The loader's name, announced by screen readers while the work is in
|
|
21934
22041
|
progress. */
|
|
21935
22042
|
"prop:label"?: (HelixLoader["label"]) | undefined;
|
|
@@ -31994,6 +32101,18 @@ cannot be written in an attribute. */
|
|
|
31994
32101
|
textContent?: (string | number) | undefined;
|
|
31995
32102
|
};
|
|
31996
32103
|
|
|
32104
|
+
/** `HelixSparkline` component event */
|
|
32105
|
+
export type HelixSparklineElementEvent<E = Event> = TypedEvent<
|
|
32106
|
+
HelixSparkline,
|
|
32107
|
+
E
|
|
32108
|
+
>;
|
|
32109
|
+
/** `helix-reading-change` event type */
|
|
32110
|
+
export type HelixSparklineHelixReadingChangeElementEvent =
|
|
32111
|
+
HelixSparklineElementEvent<HelixReadingChangeEvent>;
|
|
32112
|
+
/** `helix-reading-press` event type */
|
|
32113
|
+
export type HelixSparklineHelixReadingPressElementEvent =
|
|
32114
|
+
HelixSparklineElementEvent<HelixReadingPressEvent>;
|
|
32115
|
+
|
|
31997
32116
|
export type HelixSparklineProps = {
|
|
31998
32117
|
/** How strongly the line, area, or columns are drawn.
|
|
31999
32118
|
|
|
@@ -32177,6 +32296,15 @@ with `values={[1240, 1318]}`. The attribute is the form to prefer, because
|
|
|
32177
32296
|
a string is what survives React's hydration where an array property does
|
|
32178
32297
|
not. */
|
|
32179
32298
|
values?: (HelixSparkline["values"]) | undefined;
|
|
32299
|
+
|
|
32300
|
+
/** The reading shown moved, or was put away: `index` is the reading, or `-1` for none, with its row's `label` from a table and the `pointerType` that moved it. */
|
|
32301
|
+
"onhelix-reading-change"?: ((
|
|
32302
|
+
e: HelixSparklineHelixReadingChangeElementEvent,
|
|
32303
|
+
) => void) | undefined;
|
|
32304
|
+
/** A reading was clicked, tapped, or pressed with Enter or Space, with the same detail as `helix-reading-change`. */
|
|
32305
|
+
"onhelix-reading-press"?: ((
|
|
32306
|
+
e: HelixSparklineHelixReadingPressElementEvent,
|
|
32307
|
+
) => void) | undefined;
|
|
32180
32308
|
};
|
|
32181
32309
|
|
|
32182
32310
|
export type HelixSparklineSolidJsProps = {
|
|
@@ -32362,6 +32490,14 @@ with `values={[1240, 1318]}`. The attribute is the form to prefer, because
|
|
|
32362
32490
|
a string is what survives React's hydration where an array property does
|
|
32363
32491
|
not. */
|
|
32364
32492
|
"prop:values"?: (HelixSparkline["values"]) | undefined;
|
|
32493
|
+
/** The reading shown moved, or was put away: `index` is the reading, or `-1` for none, with its row's `label` from a table and the `pointerType` that moved it. */
|
|
32494
|
+
"on:helix-reading-change"?: ((
|
|
32495
|
+
e: HelixSparklineHelixReadingChangeElementEvent,
|
|
32496
|
+
) => void) | undefined;
|
|
32497
|
+
/** A reading was clicked, tapped, or pressed with Enter or Space, with the same detail as `helix-reading-change`. */
|
|
32498
|
+
"on:helix-reading-press"?: ((
|
|
32499
|
+
e: HelixSparklineHelixReadingPressElementEvent,
|
|
32500
|
+
) => void) | undefined;
|
|
32365
32501
|
|
|
32366
32502
|
/** Set the innerHTML of the element */
|
|
32367
32503
|
innerHTML?: (string) | undefined;
|
|
@@ -35295,8 +35431,9 @@ Absent selects nothing, and the tags carry no selected state at all. */
|
|
|
35295
35431
|
|
|
35296
35432
|
Absent selects nothing, and the tags carry no selected state at all. */
|
|
35297
35433
|
selectionMode?: (HelixTagGroup["selectionMode"]) | undefined;
|
|
35298
|
-
/** The selected tags' values, separated by commas
|
|
35299
|
-
space.
|
|
35434
|
+
/** The selected tags' values, separated by commas with no space, as Toggle
|
|
35435
|
+
Group and Table write theirs, since a value may hold a space. A value
|
|
35436
|
+
written with a space after each comma is read the same way.
|
|
35300
35437
|
|
|
35301
35438
|
Set it to start with tags selected. A tag's value is its `value`, or its
|
|
35302
35439
|
words where it has none. */
|
|
@@ -35352,8 +35489,9 @@ Absent selects nothing, and the tags carry no selected state at all. */
|
|
|
35352
35489
|
|
|
35353
35490
|
Absent selects nothing, and the tags carry no selected state at all. */
|
|
35354
35491
|
"prop:selectionMode"?: (HelixTagGroup["selectionMode"]) | undefined;
|
|
35355
|
-
/** The selected tags' values, separated by commas
|
|
35356
|
-
space.
|
|
35492
|
+
/** The selected tags' values, separated by commas with no space, as Toggle
|
|
35493
|
+
Group and Table write theirs, since a value may hold a space. A value
|
|
35494
|
+
written with a space after each comma is read the same way.
|
|
35357
35495
|
|
|
35358
35496
|
Set it to start with tags selected. A tag's value is its `value`, or its
|
|
35359
35497
|
words where it has none. */
|
|
@@ -36508,10 +36646,22 @@ never something this element would refuse to read back. */
|
|
|
36508
36646
|
/** The message shown when `disable-times` bars a time. */
|
|
36509
36647
|
unavailableMessage?: (HelixTimeInput["unavailableMessage"]) | undefined;
|
|
36510
36648
|
/** The message for text that is no time, where `bad-input-message` is not
|
|
36511
|
-
set. `{mode}` is `single`, `range`, or `multiple`,
|
|
36649
|
+
set. `{mode}` is `single`, `range`, or `multiple`, `{example}` is a time
|
|
36650
|
+
written as the field writes one, `2:30 PM` in `en-US` and `14:30` in
|
|
36651
|
+
`de-DE`, and `{shape}` is `HH:mm`, or `HH:mm:ss` with `seconds`.
|
|
36652
|
+
|
|
36653
|
+
**The default names a time the field reads back.** It said "Enter a time
|
|
36654
|
+
as HH:mm." to a reader whose field showed `2:30 PM`, and a pattern token
|
|
36655
|
+
is words for a developer. */
|
|
36512
36656
|
"unreadable-message"?: (HelixTimeInput["unreadableMessage"]) | undefined;
|
|
36513
36657
|
/** The message for text that is no time, where `bad-input-message` is not
|
|
36514
|
-
set. `{mode}` is `single`, `range`, or `multiple`,
|
|
36658
|
+
set. `{mode}` is `single`, `range`, or `multiple`, `{example}` is a time
|
|
36659
|
+
written as the field writes one, `2:30 PM` in `en-US` and `14:30` in
|
|
36660
|
+
`de-DE`, and `{shape}` is `HH:mm`, or `HH:mm:ss` with `seconds`.
|
|
36661
|
+
|
|
36662
|
+
**The default names a time the field reads back.** It said "Enter a time
|
|
36663
|
+
as HH:mm." to a reader whose field showed `2:30 PM`, and a pattern token
|
|
36664
|
+
is words for a developer. */
|
|
36515
36665
|
unreadableMessage?: (HelixTimeInput["unreadableMessage"]) | undefined;
|
|
36516
36666
|
/** Whether the panel shows one list of times or a column for each part of the
|
|
36517
36667
|
time.
|
|
@@ -36904,10 +37054,22 @@ never something this element would refuse to read back. */
|
|
|
36904
37054
|
/** The message shown when `disable-times` bars a time. */
|
|
36905
37055
|
"prop:unavailableMessage"?: (HelixTimeInput["unavailableMessage"]) | undefined;
|
|
36906
37056
|
/** The message for text that is no time, where `bad-input-message` is not
|
|
36907
|
-
set. `{mode}` is `single`, `range`, or `multiple`,
|
|
37057
|
+
set. `{mode}` is `single`, `range`, or `multiple`, `{example}` is a time
|
|
37058
|
+
written as the field writes one, `2:30 PM` in `en-US` and `14:30` in
|
|
37059
|
+
`de-DE`, and `{shape}` is `HH:mm`, or `HH:mm:ss` with `seconds`.
|
|
37060
|
+
|
|
37061
|
+
**The default names a time the field reads back.** It said "Enter a time
|
|
37062
|
+
as HH:mm." to a reader whose field showed `2:30 PM`, and a pattern token
|
|
37063
|
+
is words for a developer. */
|
|
36908
37064
|
"attr:unreadable-message"?: (HelixTimeInput["unreadableMessage"]) | undefined;
|
|
36909
37065
|
/** The message for text that is no time, where `bad-input-message` is not
|
|
36910
|
-
set. `{mode}` is `single`, `range`, or `multiple`,
|
|
37066
|
+
set. `{mode}` is `single`, `range`, or `multiple`, `{example}` is a time
|
|
37067
|
+
written as the field writes one, `2:30 PM` in `en-US` and `14:30` in
|
|
37068
|
+
`de-DE`, and `{shape}` is `HH:mm`, or `HH:mm:ss` with `seconds`.
|
|
37069
|
+
|
|
37070
|
+
**The default names a time the field reads back.** It said "Enter a time
|
|
37071
|
+
as HH:mm." to a reader whose field showed `2:30 PM`, and a pattern token
|
|
37072
|
+
is words for a developer. */
|
|
36911
37073
|
"prop:unreadableMessage"?: (HelixTimeInput["unreadableMessage"]) | undefined;
|
|
36912
37074
|
/** Whether the panel shows one list of times or a column for each part of the
|
|
36913
37075
|
time.
|
|
@@ -42593,12 +42755,6 @@ export type CustomElements = {
|
|
|
42593
42755
|
*
|
|
42594
42756
|
* Absent draws none: bands read as a composition need no numbers beside
|
|
42595
42757
|
* them, and the tooltip and the table hold every reading.
|
|
42596
|
-
* - `pointer`: Finds the reading nearest the pointer, so the tooltip can sit on it.
|
|
42597
|
-
*
|
|
42598
|
-
* Public for the same reason `series` and `named` are: a protected member
|
|
42599
|
-
* cannot be cast onto across unrelated classes, so it would be invisible to
|
|
42600
|
-
* every chart that needs it. Reading where a pointer is resting is a fair
|
|
42601
|
-
* thing to ask a chart anyway. (property only) (readonly)
|
|
42602
42758
|
* - `data`: The readings as data, in the shape of a table, where the page has no
|
|
42603
42759
|
* table to point `for` at. `for` wins where both are set.
|
|
42604
42760
|
*
|
|
@@ -42637,21 +42793,6 @@ export type CustomElements = {
|
|
|
42637
42793
|
* names an element, and the chart is a generic around its plot: written
|
|
42638
42794
|
* on the host, the name reached nobody. The plot takes it, as Heatmap's
|
|
42639
42795
|
* strip always did. (property only) (readonly)
|
|
42640
|
-
* - `readingsKnown`: Whether the readings have been looked for: false on the server and
|
|
42641
|
-
* while hydrating, where no table is resolved and no data is read. A
|
|
42642
|
-
* chart says it has no readings only once this is true. (property only) (readonly)
|
|
42643
|
-
* - `sourceRows`: Every row of the table, with each cell's text and number.
|
|
42644
|
-
*
|
|
42645
|
-
* This is where a tooltip's content comes from, and it is deliberately not
|
|
42646
|
-
* `series`. A chart draws numbers; a reader resting a pointer on one wants
|
|
42647
|
-
* what the table says, which is `$128k` and not `128000`, and often wants
|
|
42648
|
-
* the column beside it that nothing plotted at all.
|
|
42649
|
-
*
|
|
42650
|
-
* **Not `rows`.** It is the source table's rows, and `rows` on a chart is a
|
|
42651
|
-
* name a chart wants for itself: `helix-heatmap` takes `rows="7"` to mean a
|
|
42652
|
-
* calendar week, and declaring that against a base class whose `rows` is a
|
|
42653
|
-
* `Row[]` getter is a type error at best. Name the member for what it holds
|
|
42654
|
-
* rather than for the shortest word available. (property only) (readonly)
|
|
42655
42796
|
* - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
|
|
42656
42797
|
*
|
|
42657
42798
|
* The same test `readSeries` applies when it drops a column of notes: a
|
|
@@ -42697,8 +42838,6 @@ export type CustomElements = {
|
|
|
42697
42838
|
*
|
|
42698
42839
|
* Methods that can be called to access component functionality.
|
|
42699
42840
|
*
|
|
42700
|
-
* - `attributeChangedCallback(name: string, old: string | null, value: string | null) => void`: Called by the browser when an observed attribute changes. A new
|
|
42701
|
-
* `aria-label` asks for an update, because it names the plot.
|
|
42702
42841
|
* - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
|
|
42703
42842
|
*
|
|
42704
42843
|
* **A cell's place in its row is not its series' depth, and the tooltip
|
|
@@ -42758,9 +42897,10 @@ export type CustomElements = {
|
|
|
42758
42897
|
* - `live`: The readout: a polite live region that says the reading the keys moved to. Hide it visually.
|
|
42759
42898
|
* - `loading`: The words in place of the drawing while `loading` is set and there are no readings: the `loading` slot, falling back to `loading-text`.
|
|
42760
42899
|
* - `mark`: The invisible point the tooltip is anchored to.
|
|
42761
|
-
* - `plot`: The drawing, which takes focus to be read by key.
|
|
42900
|
+
* - `plot`: The drawing, which takes focus to be read by key. With nothing to draw, a group named as the chart is, holding the `empty` or `loading` part.
|
|
42762
42901
|
* - `summary`: The total and each part's share at the latest reading, written as a sentence for screen readers.
|
|
42763
42902
|
* - `svg`: The drawing surface the bands sit on.
|
|
42903
|
+
* - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
|
|
42764
42904
|
* - `tick`: One number on the axis, placed with `inset-block-start` at its level.
|
|
42765
42905
|
* - `tooltip`: The bubble, forwarded from `Tooltip`.
|
|
42766
42906
|
* - `tooltip-anchor`: The `Tooltip` element itself.
|
|
@@ -42783,6 +42923,9 @@ export type CustomElements = {
|
|
|
42783
42923
|
*
|
|
42784
42924
|
* These can be used to apply styling when a component is in a given state.
|
|
42785
42925
|
*
|
|
42926
|
+
* - `active`: While a reading is shown, under the pointer or the keys, with its tooltip open.
|
|
42927
|
+
* - `empty`: While the `empty` part stands in the plot.
|
|
42928
|
+
* - `loading`: While the `loading` part stands in the plot.
|
|
42786
42929
|
* - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
|
|
42787
42930
|
*/
|
|
42788
42931
|
"helix-area-chart": Partial<
|
|
@@ -42807,6 +42950,8 @@ export type CustomElements = {
|
|
|
42807
42950
|
* The shader stops drawing in these cases:
|
|
42808
42951
|
* - The element is off screen or in a background tab.
|
|
42809
42952
|
* - `prefers-reduced-motion` is set. The element shows one still frame.
|
|
42953
|
+
* - `paused` is set, from a pause control on your page. The element holds the
|
|
42954
|
+
* frame it shows.
|
|
42810
42955
|
* - The browser takes back the drawing context, on a GPU reset or past its
|
|
42811
42956
|
* limit of about sixteen contexts. The gradient shows until the context
|
|
42812
42957
|
* returns.
|
|
@@ -42869,6 +43014,12 @@ export type CustomElements = {
|
|
|
42869
43014
|
* hit-testable at rest, or it would swallow clicks meant for what is over it,
|
|
42870
43015
|
* and an element that is not hit-testable never receives the `pointermove`
|
|
42871
43016
|
* this listens for. Asking for the pointer is asking for the hit test.
|
|
43017
|
+
* - `paused`: Whether the field holds still on the frame it shows.
|
|
43018
|
+
*
|
|
43019
|
+
* Set it from a pause control on your page, so a reader can stop the motion,
|
|
43020
|
+
* as WCAG 2.2.2 asks of anything that moves for more than five seconds. A
|
|
43021
|
+
* change to another property still repaints the frame. Clearing it starts
|
|
43022
|
+
* the field from where it stopped.
|
|
42872
43023
|
* - `reach`: How far the pointer reaches into the field, `0` upward.
|
|
42873
43024
|
*
|
|
42874
43025
|
* Multiplied into the presence the pointer already fades in and out with, so
|
|
@@ -43172,7 +43323,7 @@ export type CustomElements = {
|
|
|
43172
43323
|
*
|
|
43173
43324
|
* Areas where markup can be added to the component.
|
|
43174
43325
|
*
|
|
43175
|
-
* - `(default)`:
|
|
43326
|
+
* - `(default)`: Shown when there is no usable image, in place of the initials, for an icon. Hidden from assistive technology when the avatar has a `name`, which the host announces.
|
|
43176
43327
|
*
|
|
43177
43328
|
* ## CSS Custom Properties
|
|
43178
43329
|
*
|
|
@@ -43586,12 +43737,6 @@ export type CustomElements = {
|
|
|
43586
43737
|
*
|
|
43587
43738
|
* Absent draws none with one scale, since bars compared with each other need
|
|
43588
43739
|
* no numbers. With `secondary` both scales are drawn whatever this says.
|
|
43589
|
-
* - `pointer`: Finds the reading nearest the pointer, so the tooltip can sit on it.
|
|
43590
|
-
*
|
|
43591
|
-
* Public for the same reason `series` and `named` are: a protected member
|
|
43592
|
-
* cannot be cast onto across unrelated classes, so it would be invisible to
|
|
43593
|
-
* every chart that needs it. Reading where a pointer is resting is a fair
|
|
43594
|
-
* thing to ask a chart anyway. (property only) (readonly)
|
|
43595
43740
|
* - `data`: The readings as data, in the shape of a table, where the page has no
|
|
43596
43741
|
* table to point `for` at. `for` wins where both are set.
|
|
43597
43742
|
*
|
|
@@ -43630,21 +43775,6 @@ export type CustomElements = {
|
|
|
43630
43775
|
* names an element, and the chart is a generic around its plot: written
|
|
43631
43776
|
* on the host, the name reached nobody. The plot takes it, as Heatmap's
|
|
43632
43777
|
* strip always did. (property only) (readonly)
|
|
43633
|
-
* - `readingsKnown`: Whether the readings have been looked for: false on the server and
|
|
43634
|
-
* while hydrating, where no table is resolved and no data is read. A
|
|
43635
|
-
* chart says it has no readings only once this is true. (property only) (readonly)
|
|
43636
|
-
* - `sourceRows`: Every row of the table, with each cell's text and number.
|
|
43637
|
-
*
|
|
43638
|
-
* This is where a tooltip's content comes from, and it is deliberately not
|
|
43639
|
-
* `series`. A chart draws numbers; a reader resting a pointer on one wants
|
|
43640
|
-
* what the table says, which is `$128k` and not `128000`, and often wants
|
|
43641
|
-
* the column beside it that nothing plotted at all.
|
|
43642
|
-
*
|
|
43643
|
-
* **Not `rows`.** It is the source table's rows, and `rows` on a chart is a
|
|
43644
|
-
* name a chart wants for itself: `helix-heatmap` takes `rows="7"` to mean a
|
|
43645
|
-
* calendar week, and declaring that against a base class whose `rows` is a
|
|
43646
|
-
* `Row[]` getter is a type error at best. Name the member for what it holds
|
|
43647
|
-
* rather than for the shortest word available. (property only) (readonly)
|
|
43648
43778
|
* - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
|
|
43649
43779
|
*
|
|
43650
43780
|
* The same test `readSeries` applies when it drops a column of notes: a
|
|
@@ -43690,8 +43820,6 @@ export type CustomElements = {
|
|
|
43690
43820
|
*
|
|
43691
43821
|
* Methods that can be called to access component functionality.
|
|
43692
43822
|
*
|
|
43693
|
-
* - `attributeChangedCallback(name: string, old: string | null, value: string | null) => void`: Called by the browser when an observed attribute changes. A new
|
|
43694
|
-
* `aria-label` asks for an update, because it names the plot.
|
|
43695
43823
|
* - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
|
|
43696
43824
|
*
|
|
43697
43825
|
* **A cell's place in its row is not its series' depth, and the tooltip
|
|
@@ -43759,9 +43887,10 @@ export type CustomElements = {
|
|
|
43759
43887
|
* - `live`: The readout: a polite live region that says the reading the keys moved to. Hide it visually.
|
|
43760
43888
|
* - `loading`: The words in place of the drawing while `loading` is set and there are no readings: the `loading` slot, falling back to `loading-text`.
|
|
43761
43889
|
* - `mark`: The invisible point the tooltip is anchored to.
|
|
43762
|
-
* - `plot`: The drawing, which takes focus to be read by key.
|
|
43890
|
+
* - `plot`: The drawing, which takes focus to be read by key. With nothing to draw, a group named as the chart is, holding the `empty` or `loading` part.
|
|
43763
43891
|
* - `summary`: The chart's name and each series' highest reading, written as a sentence for screen readers. Hide it visually.
|
|
43764
43892
|
* - `svg`: The drawing surface the bars and lines sit on.
|
|
43893
|
+
* - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
|
|
43765
43894
|
* - `tick`: One number on an axis.
|
|
43766
43895
|
* - `tooltip`: The tooltip bubble, forwarded from `Tooltip`.
|
|
43767
43896
|
* - `tooltip-anchor`: The `Tooltip` element itself.
|
|
@@ -43784,6 +43913,9 @@ export type CustomElements = {
|
|
|
43784
43913
|
*
|
|
43785
43914
|
* These can be used to apply styling when a component is in a given state.
|
|
43786
43915
|
*
|
|
43916
|
+
* - `active`: While a reading is shown, under the pointer or the keys, with its tooltip open.
|
|
43917
|
+
* - `empty`: While the `empty` part stands in the plot.
|
|
43918
|
+
* - `loading`: While the `loading` part stands in the plot.
|
|
43787
43919
|
* - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
|
|
43788
43920
|
*/
|
|
43789
43921
|
"helix-bar-chart": Partial<
|
|
@@ -44945,6 +45077,10 @@ export type CustomElements = {
|
|
|
44945
45077
|
* that one transform reads, so the cards are placed once in the document's
|
|
44946
45078
|
* coordinates and are not laid out again.
|
|
44947
45079
|
*
|
|
45080
|
+
* The [Canvases](https://fusion.dev/helix/docs/canvases) guide loads and saves
|
|
45081
|
+
* a board, keeps it in your state, and lists every key and the roles a screen
|
|
45082
|
+
* reader meets.
|
|
45083
|
+
*
|
|
44948
45084
|
* ## Attributes & Properties
|
|
44949
45085
|
*
|
|
44950
45086
|
* Component attributes and properties that can be applied to the element or by using JavaScript.
|
|
@@ -45968,7 +46104,7 @@ export type CustomElements = {
|
|
|
45968
46104
|
*
|
|
45969
46105
|
* - `helix-send`: Fired when the user sends their turn, and cancelable.
|
|
45970
46106
|
* - `helix-typing`: The user started or stopped writing, with `typing` saying which, as the composer's `typing` does.
|
|
45971
|
-
* - `input`: The user changed the text. Read it from `value`, for a typing indicator or a saved draft.
|
|
46107
|
+
* - `input`: The user changed the text. Read it from `value`, for a typing indicator or a saved draft. Bubbles and is composed, as a native field's is.
|
|
45972
46108
|
*
|
|
45973
46109
|
* ## Slots
|
|
45974
46110
|
*
|
|
@@ -46034,6 +46170,8 @@ export type CustomElements = {
|
|
|
46034
46170
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
46035
46171
|
* string, as on a native control. The form does not submit while it is set.
|
|
46036
46172
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
46173
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
46174
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
46037
46175
|
*
|
|
46038
46176
|
* ## CSS Custom Properties
|
|
46039
46177
|
*
|
|
@@ -46597,6 +46735,8 @@ export type CustomElements = {
|
|
|
46597
46735
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
46598
46736
|
* string, as on a native control. The form does not submit while it is set.
|
|
46599
46737
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
46738
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
46739
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
46600
46740
|
*
|
|
46601
46741
|
* ## CSS Custom Properties
|
|
46602
46742
|
*
|
|
@@ -46878,6 +47018,8 @@ export type CustomElements = {
|
|
|
46878
47018
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
46879
47019
|
* string, as on a native control. The form does not submit while it is set.
|
|
46880
47020
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
47021
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
47022
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
46881
47023
|
*
|
|
46882
47024
|
* ## CSS Custom Properties
|
|
46883
47025
|
*
|
|
@@ -47528,6 +47670,8 @@ export type CustomElements = {
|
|
|
47528
47670
|
* and shows the browser's message at the control.
|
|
47529
47671
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
47530
47672
|
* string, as on a native control. The form does not submit while it is set.
|
|
47673
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
47674
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
47531
47675
|
*
|
|
47532
47676
|
* ## CSS Custom Properties
|
|
47533
47677
|
*
|
|
@@ -47938,6 +48082,8 @@ export type CustomElements = {
|
|
|
47938
48082
|
* and shows the browser's message at the control.
|
|
47939
48083
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
47940
48084
|
* string, as on a native control. The form does not submit while it is set.
|
|
48085
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
48086
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
47941
48087
|
*
|
|
47942
48088
|
* ## CSS Custom Properties
|
|
47943
48089
|
*
|
|
@@ -48356,6 +48502,8 @@ export type CustomElements = {
|
|
|
48356
48502
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
48357
48503
|
* string, as on a native control. The form does not submit while it is set.
|
|
48358
48504
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
48505
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
48506
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
48359
48507
|
*
|
|
48360
48508
|
* ## CSS Custom Properties
|
|
48361
48509
|
*
|
|
@@ -48777,7 +48925,8 @@ export type CustomElements = {
|
|
|
48777
48925
|
*
|
|
48778
48926
|
* Methods that can be called to access component functionality.
|
|
48779
48927
|
*
|
|
48780
|
-
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the
|
|
48928
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
48929
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
48781
48930
|
* - `formDisabledCallback(disabled: boolean) => void`: Called by the browser when an ancestor fieldset is disabled or enabled.
|
|
48782
48931
|
*
|
|
48783
48932
|
* **The argument is the effective state, and taking it whole is what latched
|
|
@@ -49691,6 +49840,8 @@ export type CustomElements = {
|
|
|
49691
49840
|
* and shows the browser's message at the control.
|
|
49692
49841
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
49693
49842
|
* string, as on a native control. The form does not submit while it is set.
|
|
49843
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
49844
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
49694
49845
|
*
|
|
49695
49846
|
* ## CSS Custom Properties
|
|
49696
49847
|
*
|
|
@@ -50100,6 +50251,8 @@ export type CustomElements = {
|
|
|
50100
50251
|
* and shows the browser's message at the control.
|
|
50101
50252
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
50102
50253
|
* string, as on a native control. The form does not submit while it is set.
|
|
50254
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
50255
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
50103
50256
|
*
|
|
50104
50257
|
* ## CSS Custom Properties
|
|
50105
50258
|
*
|
|
@@ -50734,6 +50887,16 @@ export type CustomElements = {
|
|
|
50734
50887
|
* **`transparent` is where this one stops.** A mark with no ink is not a
|
|
50735
50888
|
* material choice, it is an absent series, and a chart says that by not
|
|
50736
50889
|
* having the datum rather than by painting it invisibly.
|
|
50890
|
+
* - `empty-text`/`emptyText`: The words shown in place of the drawing when the table has no readings,
|
|
50891
|
+
* and the fallback of the `empty` slot.
|
|
50892
|
+
* - `loading`: Whether the readings are still on their way. The chart shows
|
|
50893
|
+
* `loading-text` in place of an empty drawing until it has readings.
|
|
50894
|
+
*
|
|
50895
|
+
* Reflected, so a stylesheet can treat the chart while it waits. A chart
|
|
50896
|
+
* that already has readings keeps drawing them, so a refresh does not
|
|
50897
|
+
* blank it.
|
|
50898
|
+
* - `loading-text`/`loadingText`: The words shown in place of the drawing while `loading` is set and
|
|
50899
|
+
* there are no readings yet, and the fallback of the `loading` slot.
|
|
50737
50900
|
* - `for`: The id of the table to read.
|
|
50738
50901
|
*
|
|
50739
50902
|
* Names a table in the same tree, so a chart inside another component's
|
|
@@ -50811,12 +50974,6 @@ export type CustomElements = {
|
|
|
50811
50974
|
* rotation that puts the first slice at nine o'clock, the aspect ratio of a
|
|
50812
50975
|
* box that is no longer square, and where the middle sits once the bottom of
|
|
50813
50976
|
* the circle is not drawn.
|
|
50814
|
-
* - `pointer`: Finds the reading nearest the pointer, so the tooltip can sit on it.
|
|
50815
|
-
*
|
|
50816
|
-
* Public for the same reason `series` and `named` are: a protected member
|
|
50817
|
-
* cannot be cast onto across unrelated classes, so it would be invisible to
|
|
50818
|
-
* every chart that needs it. Reading where a pointer is resting is a fair
|
|
50819
|
-
* thing to ask a chart anyway. (property only) (readonly)
|
|
50820
50977
|
* - `data`: The readings as data, in the shape of a table, where the page has no
|
|
50821
50978
|
* table to point `for` at. `for` wins where both are set.
|
|
50822
50979
|
*
|
|
@@ -50855,21 +51012,6 @@ export type CustomElements = {
|
|
|
50855
51012
|
* names an element, and the chart is a generic around its plot: written
|
|
50856
51013
|
* on the host, the name reached nobody. The plot takes it, as Heatmap's
|
|
50857
51014
|
* strip always did. (property only) (readonly)
|
|
50858
|
-
* - `readingsKnown`: Whether the readings have been looked for: false on the server and
|
|
50859
|
-
* while hydrating, where no table is resolved and no data is read. A
|
|
50860
|
-
* chart says it has no readings only once this is true. (property only) (readonly)
|
|
50861
|
-
* - `sourceRows`: Every row of the table, with each cell's text and number.
|
|
50862
|
-
*
|
|
50863
|
-
* This is where a tooltip's content comes from, and it is deliberately not
|
|
50864
|
-
* `series`. A chart draws numbers; a reader resting a pointer on one wants
|
|
50865
|
-
* what the table says, which is `$128k` and not `128000`, and often wants
|
|
50866
|
-
* the column beside it that nothing plotted at all.
|
|
50867
|
-
*
|
|
50868
|
-
* **Not `rows`.** It is the source table's rows, and `rows` on a chart is a
|
|
50869
|
-
* name a chart wants for itself: `helix-heatmap` takes `rows="7"` to mean a
|
|
50870
|
-
* calendar week, and declaring that against a base class whose `rows` is a
|
|
50871
|
-
* `Row[]` getter is a type error at best. Name the member for what it holds
|
|
50872
|
-
* rather than for the shortest word available. (property only) (readonly)
|
|
50873
51015
|
* - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
|
|
50874
51016
|
*
|
|
50875
51017
|
* The same test `readSeries` applies when it drops a column of notes: a
|
|
@@ -50897,18 +51039,25 @@ export type CustomElements = {
|
|
|
50897
51039
|
* browser harness's awaits it alone: a browser always runs the frame, and a
|
|
50898
51040
|
* timer beside it was a bet on how long one takes, which a busy run lost. (property only) (readonly)
|
|
50899
51041
|
*
|
|
51042
|
+
* ## Events
|
|
51043
|
+
*
|
|
51044
|
+
* Events that will be emitted by the component.
|
|
51045
|
+
*
|
|
51046
|
+
* - `helix-reading-change`: The slice shown moved, or was put away: `index` is the slice's row, or `-1` for none, with its `label` and the `pointerType` that moved it.
|
|
51047
|
+
* - `helix-reading-press`: A slice was clicked, tapped, or pressed with Enter or Space, with the same detail as `helix-reading-change`.
|
|
51048
|
+
*
|
|
50900
51049
|
* ## Slots
|
|
50901
51050
|
*
|
|
50902
51051
|
* Areas where markup can be added to the component.
|
|
50903
51052
|
*
|
|
50904
51053
|
* - `(default)`: Content in the middle of the ring, usually a total. It is read by screen readers, while the ring itself is hidden from them.
|
|
51054
|
+
* - `empty`: Content shown in place of the ring when the table has no readings. Falls back to `empty-text`.
|
|
51055
|
+
* - `loading`: Content shown in place of the ring while `loading` is set and there are no readings yet. Falls back to `loading-text`.
|
|
50905
51056
|
*
|
|
50906
51057
|
* ## Methods
|
|
50907
51058
|
*
|
|
50908
51059
|
* Methods that can be called to access component functionality.
|
|
50909
51060
|
*
|
|
50910
|
-
* - `attributeChangedCallback(name: string, old: string | null, value: string | null) => void`: Called by the browser when an observed attribute changes. A new
|
|
50911
|
-
* `aria-label` asks for an update, because it names the plot.
|
|
50912
51061
|
* - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
|
|
50913
51062
|
*
|
|
50914
51063
|
* **A cell's place in its row is not its series' depth, and the tooltip
|
|
@@ -50958,14 +51107,17 @@ export type CustomElements = {
|
|
|
50958
51107
|
* Custom selectors for styling elements within the component.
|
|
50959
51108
|
*
|
|
50960
51109
|
* - `center`: The middle of the ring, holding whatever is slotted.
|
|
51110
|
+
* - `empty`: The words in place of the ring when the table has no readings: the `empty` slot, falling back to `empty-text`. Not drawn while the table cannot be read yet, on the server and during hydration.
|
|
50961
51111
|
* - `live`: The readout: a polite live region that says the slice the keys moved to. Hide it visually.
|
|
51112
|
+
* - `loading`: The words in place of the ring while `loading` is set and there are no readings: the `loading` slot, falling back to `loading-text`.
|
|
50962
51113
|
* - `mark`: The invisible point the tooltip is anchored to.
|
|
50963
|
-
* - `plot`: The drawing, which takes focus to be read by key.
|
|
51114
|
+
* - `plot`: The drawing, which takes focus to be read by key. With nothing to draw, a group named as the chart is, holding the `empty` or `loading` part.
|
|
50964
51115
|
* - `segment`: One slice.
|
|
50965
51116
|
* - `segment-active`: The slice under the pointer. Set alongside `segment`.
|
|
50966
51117
|
* - `segment-edge`: One slice as a closed shape, used to draw its outline.
|
|
50967
51118
|
* - `slice-label`: One slice's share, written on the slice under `slice-labels`. Placed with `left` and `top`, or `inset-inline-start` and `top` on a half ring, and carries its series color as `--chart-series`.
|
|
50968
51119
|
* - `summary`: The chart's name and each slice's share, written as a sentence for screen readers. Hide it visually.
|
|
51120
|
+
* - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
|
|
50969
51121
|
* - `tooltip`: The bubble, forwarded from `Tooltip`.
|
|
50970
51122
|
* - `tooltip-anchor`: The `Tooltip` element itself.
|
|
50971
51123
|
* - `tooltip-arrow`: The bubble's point, forwarded from `Tooltip`.
|
|
@@ -50988,6 +51140,9 @@ export type CustomElements = {
|
|
|
50988
51140
|
*
|
|
50989
51141
|
* These can be used to apply styling when a component is in a given state.
|
|
50990
51142
|
*
|
|
51143
|
+
* - `active`: While a slice is shown, under the pointer or the keys, with its tooltip open.
|
|
51144
|
+
* - `empty`: While the `empty` part stands in place of the ring.
|
|
51145
|
+
* - `loading`: While the `loading` part stands in place of the ring.
|
|
50991
51146
|
* - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
|
|
50992
51147
|
*/
|
|
50993
51148
|
"helix-donut-chart": Partial<
|
|
@@ -51750,6 +51905,8 @@ export type CustomElements = {
|
|
|
51750
51905
|
* and shows the browser's message at the control.
|
|
51751
51906
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
51752
51907
|
* string, as on a native control. The form does not submit while it is set.
|
|
51908
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
51909
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
51753
51910
|
*
|
|
51754
51911
|
* ## CSS Custom Properties
|
|
51755
51912
|
*
|
|
@@ -52563,6 +52720,8 @@ export type CustomElements = {
|
|
|
52563
52720
|
* and shows the browser's message at the control.
|
|
52564
52721
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
52565
52722
|
* string, as on a native control. The form does not submit while it is set.
|
|
52723
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
52724
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
52566
52725
|
*
|
|
52567
52726
|
* ## CSS Custom Properties
|
|
52568
52727
|
*
|
|
@@ -52898,6 +53057,10 @@ export type CustomElements = {
|
|
|
52898
53057
|
* `no-panel`, the drawing takes the whole frame, and a button among the
|
|
52899
53058
|
* controls opens the search and the list over its end.
|
|
52900
53059
|
*
|
|
53060
|
+
* The [Graphs](https://fusion.dev/helix/docs/graphs) guide connects a
|
|
53061
|
+
* renderer, lists the keys and what a screen reader hears, and describes the
|
|
53062
|
+
* methods of a driver for another renderer.
|
|
53063
|
+
*
|
|
52901
53064
|
* ## Attributes & Properties
|
|
52902
53065
|
*
|
|
52903
53066
|
* Component attributes and properties that can be applied to the element or by using JavaScript.
|
|
@@ -53024,6 +53187,9 @@ export type CustomElements = {
|
|
|
53024
53187
|
* own, since the fallback name is the same word. Empty leaves the role.
|
|
53025
53188
|
* - `search-label`/`searchLabel`: The search field's name.
|
|
53026
53189
|
* - `selected-label`/`selectedLabel`: How the selected note is described in the list.
|
|
53190
|
+
* - `selection-label`/`selectionLabel`: What screen readers hear after a reader selects a note, in the list or in
|
|
53191
|
+
* the drawing, with `{note}` for its name and `{count}` for how many notes
|
|
53192
|
+
* the list then holds, written with `count-label`.
|
|
53027
53193
|
* - `two-finger-hint-label`/`twoFingerHintLabel`: The hint shown when one finger swipes over the graph with `gestures="cooperative"`.
|
|
53028
53194
|
* - `using-label`/`usingLabel`: The line shown while the graph, with `gestures="activate"`, has the gestures.
|
|
53029
53195
|
* - `wheel-hint-label`/`wheelHintLabel`: The hint shown when the wheel scrolls past the graph with
|
|
@@ -53174,7 +53340,7 @@ export type CustomElements = {
|
|
|
53174
53340
|
* - `gesture-hint`: Words over the graph for a moment when it lets a gesture pass to the page, such as how to zoom it.
|
|
53175
53341
|
* - `gesture-status`: The line shown while a graph with `gestures="activate"` has the gestures.
|
|
53176
53342
|
* - `header`: The strip above the graph.
|
|
53177
|
-
* - `legend`: The groups over the drawing, with `legend
|
|
53343
|
+
* - `legend`: The groups over the drawing, with `legend`: a toolbar of buttons, each showing or hiding its notes, which is one tab stop.
|
|
53178
53344
|
* - `legend-item`: One group in the legend, pressed while its notes are shown. Carries `data-tone` where every note in the group has the same tone, which colors the notes over the group's own color.
|
|
53179
53345
|
* - `legend-item-hidden`: A group in the legend whose notes are hidden.
|
|
53180
53346
|
* - `legend-swatch`: The mark in a group's color, before its name.
|
|
@@ -53435,17 +53601,12 @@ export type CustomElements = {
|
|
|
53435
53601
|
* no order in it.
|
|
53436
53602
|
* - `total-label`/`totalLabel`: The name the `overview` gives the total of the readings drawn,
|
|
53437
53603
|
* `{totalLabel}` in `overview-label`.
|
|
53438
|
-
* - `value`: The selected cells, by
|
|
53439
|
-
* `2026-06-11`,
|
|
53604
|
+
* - `value`: The selected cells, separated by commas: each by the date its row's
|
|
53605
|
+
* header carries in a `<time datetime>`, such as `2026-06-11`, or by the
|
|
53606
|
+
* header's words where it carries none.
|
|
53440
53607
|
*
|
|
53441
53608
|
* Set it to start with cells selected. Written by a press or a key under
|
|
53442
53609
|
* `selection-mode`.
|
|
53443
|
-
* - `pointer`: Finds the reading nearest the pointer, so the tooltip can sit on it.
|
|
53444
|
-
*
|
|
53445
|
-
* Public for the same reason `series` and `named` are: a protected member
|
|
53446
|
-
* cannot be cast onto across unrelated classes, so it would be invisible to
|
|
53447
|
-
* every chart that needs it. Reading where a pointer is resting is a fair
|
|
53448
|
-
* thing to ask a chart anyway. (property only) (readonly)
|
|
53449
53610
|
* - `data`: The readings as data, in the shape of a table, where the page has no
|
|
53450
53611
|
* table to point `for` at. `for` wins where both are set.
|
|
53451
53612
|
*
|
|
@@ -53484,21 +53645,6 @@ export type CustomElements = {
|
|
|
53484
53645
|
* names an element, and the chart is a generic around its plot: written
|
|
53485
53646
|
* on the host, the name reached nobody. The plot takes it, as Heatmap's
|
|
53486
53647
|
* strip always did. (property only) (readonly)
|
|
53487
|
-
* - `readingsKnown`: Whether the readings have been looked for: false on the server and
|
|
53488
|
-
* while hydrating, where no table is resolved and no data is read. A
|
|
53489
|
-
* chart says it has no readings only once this is true. (property only) (readonly)
|
|
53490
|
-
* - `sourceRows`: Every row of the table, with each cell's text and number.
|
|
53491
|
-
*
|
|
53492
|
-
* This is where a tooltip's content comes from, and it is deliberately not
|
|
53493
|
-
* `series`. A chart draws numbers; a reader resting a pointer on one wants
|
|
53494
|
-
* what the table says, which is `$128k` and not `128000`, and often wants
|
|
53495
|
-
* the column beside it that nothing plotted at all.
|
|
53496
|
-
*
|
|
53497
|
-
* **Not `rows`.** It is the source table's rows, and `rows` on a chart is a
|
|
53498
|
-
* name a chart wants for itself: `helix-heatmap` takes `rows="7"` to mean a
|
|
53499
|
-
* calendar week, and declaring that against a base class whose `rows` is a
|
|
53500
|
-
* `Row[]` getter is a type error at best. Name the member for what it holds
|
|
53501
|
-
* rather than for the shortest word available. (property only) (readonly)
|
|
53502
53648
|
* - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
|
|
53503
53649
|
*
|
|
53504
53650
|
* The same test `readSeries` applies when it drops a column of notes: a
|
|
@@ -53560,8 +53706,6 @@ export type CustomElements = {
|
|
|
53560
53706
|
*
|
|
53561
53707
|
* Methods that can be called to access component functionality.
|
|
53562
53708
|
*
|
|
53563
|
-
* - `attributeChangedCallback(name: string, old: string | null, value: string | null) => void`: Called by the browser when an observed attribute changes. A new
|
|
53564
|
-
* `aria-label` asks for an update, because it names the plot.
|
|
53565
53709
|
* - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
|
|
53566
53710
|
*
|
|
53567
53711
|
* **A cell's place in its row is not its series' depth, and the tooltip
|
|
@@ -53654,11 +53798,14 @@ export type CustomElements = {
|
|
|
53654
53798
|
* - `selection`: A polite region that says how many cells are selected after a change, rendered from the first change. Hide it visually.
|
|
53655
53799
|
* - `start`: The leading slot's box.
|
|
53656
53800
|
* - `summary`: The middle slot's box.
|
|
53801
|
+
* - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
|
|
53657
53802
|
*
|
|
53658
53803
|
* ## CSS States
|
|
53659
53804
|
*
|
|
53660
53805
|
* These can be used to apply styling when a component is in a given state.
|
|
53661
53806
|
*
|
|
53807
|
+
* - `active`: While a cell is shown, under the pointer or the keys, with its tooltip open.
|
|
53808
|
+
* - `empty`: While the `empty` part stands in place of the cells.
|
|
53662
53809
|
* - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
|
|
53663
53810
|
*/
|
|
53664
53811
|
"helix-heatmap": Partial<
|
|
@@ -53898,7 +54045,8 @@ export type CustomElements = {
|
|
|
53898
54045
|
*
|
|
53899
54046
|
* Methods that can be called to access component functionality.
|
|
53900
54047
|
*
|
|
53901
|
-
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the
|
|
54048
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
54049
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
53902
54050
|
* - `formDisabledCallback(disabled: boolean) => void`: Called by the browser when an ancestor fieldset is disabled or enabled.
|
|
53903
54051
|
*
|
|
53904
54052
|
* **The argument is the effective state, and taking it whole is what latched
|
|
@@ -54547,6 +54695,8 @@ export type CustomElements = {
|
|
|
54547
54695
|
* and shows the browser's message at the control.
|
|
54548
54696
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
54549
54697
|
* string, as on a native control. The form does not submit while it is set.
|
|
54698
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
54699
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
54550
54700
|
*
|
|
54551
54701
|
* ## CSS Custom Properties
|
|
54552
54702
|
*
|
|
@@ -55367,12 +55517,6 @@ export type CustomElements = {
|
|
|
55367
55517
|
* Set it where the distance from nothing is the point rather than the shape,
|
|
55368
55518
|
* and accept that a series which never approaches zero becomes a flat rule
|
|
55369
55519
|
* near the top of the box.
|
|
55370
|
-
* - `pointer`: Finds the reading nearest the pointer, so the tooltip can sit on it.
|
|
55371
|
-
*
|
|
55372
|
-
* Public for the same reason `series` and `named` are: a protected member
|
|
55373
|
-
* cannot be cast onto across unrelated classes, so it would be invisible to
|
|
55374
|
-
* every chart that needs it. Reading where a pointer is resting is a fair
|
|
55375
|
-
* thing to ask a chart anyway. (property only) (readonly)
|
|
55376
55520
|
* - `data`: The readings as data, in the shape of a table, where the page has no
|
|
55377
55521
|
* table to point `for` at. `for` wins where both are set.
|
|
55378
55522
|
*
|
|
@@ -55411,21 +55555,6 @@ export type CustomElements = {
|
|
|
55411
55555
|
* names an element, and the chart is a generic around its plot: written
|
|
55412
55556
|
* on the host, the name reached nobody. The plot takes it, as Heatmap's
|
|
55413
55557
|
* strip always did. (property only) (readonly)
|
|
55414
|
-
* - `readingsKnown`: Whether the readings have been looked for: false on the server and
|
|
55415
|
-
* while hydrating, where no table is resolved and no data is read. A
|
|
55416
|
-
* chart says it has no readings only once this is true. (property only) (readonly)
|
|
55417
|
-
* - `sourceRows`: Every row of the table, with each cell's text and number.
|
|
55418
|
-
*
|
|
55419
|
-
* This is where a tooltip's content comes from, and it is deliberately not
|
|
55420
|
-
* `series`. A chart draws numbers; a reader resting a pointer on one wants
|
|
55421
|
-
* what the table says, which is `$128k` and not `128000`, and often wants
|
|
55422
|
-
* the column beside it that nothing plotted at all.
|
|
55423
|
-
*
|
|
55424
|
-
* **Not `rows`.** It is the source table's rows, and `rows` on a chart is a
|
|
55425
|
-
* name a chart wants for itself: `helix-heatmap` takes `rows="7"` to mean a
|
|
55426
|
-
* calendar week, and declaring that against a base class whose `rows` is a
|
|
55427
|
-
* `Row[]` getter is a type error at best. Name the member for what it holds
|
|
55428
|
-
* rather than for the shortest word available. (property only) (readonly)
|
|
55429
55558
|
* - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
|
|
55430
55559
|
*
|
|
55431
55560
|
* The same test `readSeries` applies when it drops a column of notes: a
|
|
@@ -55471,8 +55600,6 @@ export type CustomElements = {
|
|
|
55471
55600
|
*
|
|
55472
55601
|
* Methods that can be called to access component functionality.
|
|
55473
55602
|
*
|
|
55474
|
-
* - `attributeChangedCallback(name: string, old: string | null, value: string | null) => void`: Called by the browser when an observed attribute changes. A new
|
|
55475
|
-
* `aria-label` asks for an update, because it names the plot.
|
|
55476
55603
|
* - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
|
|
55477
55604
|
*
|
|
55478
55605
|
* **A cell's place in its row is not its series' depth, and the tooltip
|
|
@@ -55543,9 +55670,10 @@ export type CustomElements = {
|
|
|
55543
55670
|
* - `mark`: The invisible point the tooltip is anchored to.
|
|
55544
55671
|
* - `marker`: The mark on one reading, under `markers`, and on a reading with a blank on either side. Placed with `inset-inline-start` and `inset-block-start`, and carries its series color as `--chart-series`.
|
|
55545
55672
|
* - `marker-lone`: A `marker` on a reading with a blank on either side, which no line reaches. Set alongside `marker`.
|
|
55546
|
-
* - `plot`: The drawing, which takes focus to be read by key.
|
|
55673
|
+
* - `plot`: The drawing, which takes focus to be read by key. With nothing to draw, a group named as the chart is, holding the `empty` or `loading` part.
|
|
55547
55674
|
* - `summary`: The chart's name and each series' latest reading, written as a sentence for screen readers. Hide it visually.
|
|
55548
55675
|
* - `svg`: The drawing surface the lines and areas sit on.
|
|
55676
|
+
* - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
|
|
55549
55677
|
* - `terminus`: The mark on one series' last reading.
|
|
55550
55678
|
* - `tick`: One number on the axis, placed with `inset-block-start` at its level.
|
|
55551
55679
|
* - `tooltip`: The bubble, forwarded from `Tooltip`.
|
|
@@ -55569,6 +55697,9 @@ export type CustomElements = {
|
|
|
55569
55697
|
*
|
|
55570
55698
|
* These can be used to apply styling when a component is in a given state.
|
|
55571
55699
|
*
|
|
55700
|
+
* - `active`: While a reading is shown, under the pointer or the keys, with its tooltip open.
|
|
55701
|
+
* - `empty`: While the `empty` part stands in the plot.
|
|
55702
|
+
* - `loading`: While the `loading` part stands in the plot.
|
|
55572
55703
|
* - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
|
|
55573
55704
|
*/
|
|
55574
55705
|
"helix-line-chart": Partial<
|
|
@@ -56238,6 +56369,8 @@ export type CustomElements = {
|
|
|
56238
56369
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
56239
56370
|
* string, as on a native control. The form does not submit while it is set.
|
|
56240
56371
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
56372
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
56373
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
56241
56374
|
*
|
|
56242
56375
|
* ## CSS Custom Properties
|
|
56243
56376
|
*
|
|
@@ -56300,6 +56433,9 @@ export type CustomElements = {
|
|
|
56300
56433
|
* While `delay` runs, the loader keeps its size and draws nothing, so the line
|
|
56301
56434
|
* it sits in does not move when it appears.
|
|
56302
56435
|
*
|
|
56436
|
+
* With something in the `content` slot, the loader takes the larger of the ring
|
|
56437
|
+
* and the content, and the ring centers over the content while the work runs.
|
|
56438
|
+
*
|
|
56303
56439
|
* ## Attributes & Properties
|
|
56304
56440
|
*
|
|
56305
56441
|
* Component attributes and properties that can be applied to the element or by using JavaScript.
|
|
@@ -56324,6 +56460,9 @@ export type CustomElements = {
|
|
|
56324
56460
|
*
|
|
56325
56461
|
* Names an element in the same tree. In React it arrives as a property, the
|
|
56326
56462
|
* way `Tooltip.for` does.
|
|
56463
|
+
* - `idle`: Whether no work is in progress. The loader draws nothing of its own, has
|
|
56464
|
+
* no role, and marks no region busy, and what is in the `content` slot
|
|
56465
|
+
* shows. Clearing it starts `delay` again.
|
|
56327
56466
|
* - `label`: The loader's name, announced by screen readers while the work is in
|
|
56328
56467
|
* progress.
|
|
56329
56468
|
* - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
|
|
@@ -56352,13 +56491,14 @@ export type CustomElements = {
|
|
|
56352
56491
|
* Areas where markup can be added to the component.
|
|
56353
56492
|
*
|
|
56354
56493
|
* - `(default)`: An icon or logo that stays still at the center. Empty by default.
|
|
56494
|
+
* - `content`: What the loader stands in for while the work runs, such as a button. It keeps its size, hidden and inert, until `idle` is set.
|
|
56355
56495
|
*
|
|
56356
56496
|
* ## CSS Custom Properties
|
|
56357
56497
|
*
|
|
56358
56498
|
* CSS variables available for styling the component.
|
|
56359
56499
|
*
|
|
56360
56500
|
* - `--loader-color`: Color of the moving arc.
|
|
56361
|
-
* - `--loader-duration`: How long one turn of the arc takes, 0.8s by default. With motion reduced the
|
|
56501
|
+
* - `--loader-duration`: How long one turn of the arc takes, 0.8s by default. With motion reduced the arc turns once every four seconds, whatever this says.
|
|
56362
56502
|
* - `--loader-size`: Diameter. Defaults to the size token that `size` picks, which is 1.5rem at the default density.
|
|
56363
56503
|
* - `--loader-track-color`: Color of the circle behind the arc.
|
|
56364
56504
|
* - `--loader-track-width`: Width of the arc and the circle behind it, in units of a 24-unit drawing. Defaults to 2.
|
|
@@ -56367,6 +56507,7 @@ export type CustomElements = {
|
|
|
56367
56507
|
*
|
|
56368
56508
|
* Custom selectors for styling elements within the component.
|
|
56369
56509
|
*
|
|
56510
|
+
* - `content`: The box that holds the `content` slot. Hidden while the work runs, and shown while `idle` is set.
|
|
56370
56511
|
* - `indicator`: The arc that turns.
|
|
56371
56512
|
* - `mark`: The region that holds the slotted content at the center.
|
|
56372
56513
|
* - `svg`: The rotating circle pair.
|
|
@@ -56977,6 +57118,10 @@ export type CustomElements = {
|
|
|
56977
57118
|
* to draw the map's credit compact in a corner over the map, which suits a
|
|
56978
57119
|
* map the width of the page.
|
|
56979
57120
|
*
|
|
57121
|
+
* The [Maps](https://fusion.dev/helix/docs/maps) guide connects a renderer,
|
|
57122
|
+
* lists the keys and what a screen reader hears, and describes every method
|
|
57123
|
+
* a driver for another renderer can have.
|
|
57124
|
+
*
|
|
56980
57125
|
* ## Attributes & Properties
|
|
56981
57126
|
*
|
|
56982
57127
|
* Component attributes and properties that can be applied to the element or by using JavaScript.
|
|
@@ -59184,6 +59329,8 @@ export type CustomElements = {
|
|
|
59184
59329
|
* and shows the browser's message at the control.
|
|
59185
59330
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
59186
59331
|
* string, as on a native control. The form does not submit while it is set.
|
|
59332
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
59333
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
59187
59334
|
*
|
|
59188
59335
|
* ## CSS Custom Properties
|
|
59189
59336
|
*
|
|
@@ -60433,6 +60580,8 @@ export type CustomElements = {
|
|
|
60433
60580
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
60434
60581
|
* string, as on a native control. The form does not submit while it is set.
|
|
60435
60582
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
60583
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
60584
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
60436
60585
|
*
|
|
60437
60586
|
* ## CSS Custom Properties
|
|
60438
60587
|
*
|
|
@@ -60778,6 +60927,8 @@ export type CustomElements = {
|
|
|
60778
60927
|
* and shows the browser's message at the control.
|
|
60779
60928
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
60780
60929
|
* string, as on a native control. The form does not submit while it is set.
|
|
60930
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
60931
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
60781
60932
|
*
|
|
60782
60933
|
* ## CSS Custom Properties
|
|
60783
60934
|
*
|
|
@@ -61575,6 +61726,8 @@ export type CustomElements = {
|
|
|
61575
61726
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
61576
61727
|
* string, as on a native control. The form does not submit while it is set.
|
|
61577
61728
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
61729
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
61730
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
61578
61731
|
*
|
|
61579
61732
|
* ## CSS Custom Properties
|
|
61580
61733
|
*
|
|
@@ -62071,6 +62224,8 @@ export type CustomElements = {
|
|
|
62071
62224
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
62072
62225
|
* string, as on a native control. The form does not submit while it is set.
|
|
62073
62226
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
62227
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
62228
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
62074
62229
|
*
|
|
62075
62230
|
* ## CSS Custom Properties
|
|
62076
62231
|
*
|
|
@@ -63055,12 +63210,6 @@ export type CustomElements = {
|
|
|
63055
63210
|
* Absent draws none. A series with fewer than two points, or with every
|
|
63056
63211
|
* point at one measure across, has no line to draw. The summary already
|
|
63057
63212
|
* gives each series' correlation, which says how near the points are to it.
|
|
63058
|
-
* - `pointer`: Finds the reading nearest the pointer, so the tooltip can sit on it.
|
|
63059
|
-
*
|
|
63060
|
-
* Public for the same reason `series` and `named` are: a protected member
|
|
63061
|
-
* cannot be cast onto across unrelated classes, so it would be invisible to
|
|
63062
|
-
* every chart that needs it. Reading where a pointer is resting is a fair
|
|
63063
|
-
* thing to ask a chart anyway. (property only) (readonly)
|
|
63064
63213
|
* - `data`: The readings as data, in the shape of a table, where the page has no
|
|
63065
63214
|
* table to point `for` at. `for` wins where both are set.
|
|
63066
63215
|
*
|
|
@@ -63099,21 +63248,6 @@ export type CustomElements = {
|
|
|
63099
63248
|
* names an element, and the chart is a generic around its plot: written
|
|
63100
63249
|
* on the host, the name reached nobody. The plot takes it, as Heatmap's
|
|
63101
63250
|
* strip always did. (property only) (readonly)
|
|
63102
|
-
* - `readingsKnown`: Whether the readings have been looked for: false on the server and
|
|
63103
|
-
* while hydrating, where no table is resolved and no data is read. A
|
|
63104
|
-
* chart says it has no readings only once this is true. (property only) (readonly)
|
|
63105
|
-
* - `sourceRows`: Every row of the table, with each cell's text and number.
|
|
63106
|
-
*
|
|
63107
|
-
* This is where a tooltip's content comes from, and it is deliberately not
|
|
63108
|
-
* `series`. A chart draws numbers; a reader resting a pointer on one wants
|
|
63109
|
-
* what the table says, which is `$128k` and not `128000`, and often wants
|
|
63110
|
-
* the column beside it that nothing plotted at all.
|
|
63111
|
-
*
|
|
63112
|
-
* **Not `rows`.** It is the source table's rows, and `rows` on a chart is a
|
|
63113
|
-
* name a chart wants for itself: `helix-heatmap` takes `rows="7"` to mean a
|
|
63114
|
-
* calendar week, and declaring that against a base class whose `rows` is a
|
|
63115
|
-
* `Row[]` getter is a type error at best. Name the member for what it holds
|
|
63116
|
-
* rather than for the shortest word available. (property only) (readonly)
|
|
63117
63251
|
* - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
|
|
63118
63252
|
*
|
|
63119
63253
|
* The same test `readSeries` applies when it drops a column of notes: a
|
|
@@ -63159,8 +63293,6 @@ export type CustomElements = {
|
|
|
63159
63293
|
*
|
|
63160
63294
|
* Methods that can be called to access component functionality.
|
|
63161
63295
|
*
|
|
63162
|
-
* - `attributeChangedCallback(name: string, old: string | null, value: string | null) => void`: Called by the browser when an observed attribute changes. A new
|
|
63163
|
-
* `aria-label` asks for an update, because it names the plot.
|
|
63164
63296
|
* - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
|
|
63165
63297
|
*
|
|
63166
63298
|
* **A cell's place in its row is not its series' depth, and the tooltip
|
|
@@ -63219,11 +63351,12 @@ export type CustomElements = {
|
|
|
63219
63351
|
* - `loading`: The words in place of the drawing while `loading` is set and there are no readings: the `loading` slot, falling back to `loading-text`.
|
|
63220
63352
|
* - `mark`: The invisible point the tooltip is anchored to.
|
|
63221
63353
|
* - `plane`: The grid that holds the plot, both axes, and their names. It runs left to right on every page.
|
|
63222
|
-
* - `plot`: The drawing, which takes focus to be read by key.
|
|
63354
|
+
* - `plot`: The drawing, which takes focus to be read by key. With nothing to draw, a group named as the chart is, holding the `empty` or `loading` part.
|
|
63223
63355
|
* - `point`: One row, as a point.
|
|
63224
63356
|
* - `point-active`: A point in the row under the pointer. Set alongside `point`.
|
|
63225
63357
|
* - `summary`: The text that says how strongly the measures relate, for people who cannot see the points.
|
|
63226
63358
|
* - `svg`: The drawing surface the gridlines and the trend lines sit on.
|
|
63359
|
+
* - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
|
|
63227
63360
|
* - `tooltip`: The bubble, forwarded from `Tooltip`.
|
|
63228
63361
|
* - `tooltip-anchor`: The `Tooltip` element itself.
|
|
63229
63362
|
* - `tooltip-arrow`: The bubble's point, forwarded from `Tooltip`.
|
|
@@ -63243,7 +63376,7 @@ export type CustomElements = {
|
|
|
63243
63376
|
* - `trend`: One series' line of best fit, under `trend`. Carries its series color as `--chart-series`.
|
|
63244
63377
|
* - `x-axis`: The values along the horizontal axis, under the plot.
|
|
63245
63378
|
* - `x-name`: The name of the horizontal measure.
|
|
63246
|
-
* - `x-tick`: One labeled value on the horizontal axis. Each axis has its own tick part, because `::part()` cannot tell which axis a tick is on.
|
|
63379
|
+
* - `x-tick`: One labeled value on the horizontal axis. Each axis has its own tick part, because `::part()` cannot tell which axis a tick is on. The one at the far edge carries `data-edge="end"`.
|
|
63247
63380
|
* - `y-axis`: The values along the vertical axis, beside the plot.
|
|
63248
63381
|
* - `y-name`: The name of the vertical measure.
|
|
63249
63382
|
* - `y-tick`: One labeled value on the vertical axis.
|
|
@@ -63252,6 +63385,9 @@ export type CustomElements = {
|
|
|
63252
63385
|
*
|
|
63253
63386
|
* These can be used to apply styling when a component is in a given state.
|
|
63254
63387
|
*
|
|
63388
|
+
* - `active`: While a reading is shown, under the pointer or the keys, with its tooltip open.
|
|
63389
|
+
* - `empty`: While the `empty` part stands in the plot.
|
|
63390
|
+
* - `loading`: While the `loading` part stands in the plot.
|
|
63255
63391
|
* - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
|
|
63256
63392
|
*/
|
|
63257
63393
|
"helix-scatter-chart": Partial<
|
|
@@ -63698,6 +63834,8 @@ export type CustomElements = {
|
|
|
63698
63834
|
* and shows the browser's message at the control.
|
|
63699
63835
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
63700
63836
|
* string, as on a native control. The form does not submit while it is set.
|
|
63837
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
63838
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
63701
63839
|
*
|
|
63702
63840
|
* ## CSS Custom Properties
|
|
63703
63841
|
*
|
|
@@ -64198,6 +64336,8 @@ export type CustomElements = {
|
|
|
64198
64336
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
64199
64337
|
* string, as on a native control. The form does not submit while it is set.
|
|
64200
64338
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
64339
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
64340
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
64201
64341
|
*
|
|
64202
64342
|
* ## CSS Custom Properties
|
|
64203
64343
|
*
|
|
@@ -64425,8 +64565,6 @@ export type CustomElements = {
|
|
|
64425
64565
|
* with `values={[1240, 1318]}`. The attribute is the form to prefer, because
|
|
64426
64566
|
* a string is what survives React's hydration where an array property does
|
|
64427
64567
|
* not.
|
|
64428
|
-
* - `pointer`: Finds the reading a pointer or a key rests on, as it does for every
|
|
64429
|
-
* chart, so a sparkline is read the way they are. (property only) (readonly)
|
|
64430
64568
|
* - `named`: The drawing's name: an `aria-label` written on the sparkline, then `label`. (property only) (readonly)
|
|
64431
64569
|
* - `readings`: How many readings there are, which the pointer and the keys walk. (property only) (readonly)
|
|
64432
64570
|
* - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
|
|
@@ -64450,11 +64588,12 @@ export type CustomElements = {
|
|
|
64450
64588
|
* browser harness's awaits it alone: a browser always runs the frame, and a
|
|
64451
64589
|
* timer beside it was a bet on how long one takes, which a busy run lost. (property only) (readonly)
|
|
64452
64590
|
*
|
|
64453
|
-
* ##
|
|
64591
|
+
* ## Events
|
|
64454
64592
|
*
|
|
64455
|
-
*
|
|
64593
|
+
* Events that will be emitted by the component.
|
|
64456
64594
|
*
|
|
64457
|
-
* - `
|
|
64595
|
+
* - `helix-reading-change`: The reading shown moved, or was put away: `index` is the reading, or `-1` for none, with its row's `label` from a table and the `pointerType` that moved it.
|
|
64596
|
+
* - `helix-reading-press`: A reading was clicked, tapped, or pressed with Enter or Space, with the same detail as `helix-reading-change`.
|
|
64458
64597
|
*
|
|
64459
64598
|
* ## CSS Custom Properties
|
|
64460
64599
|
*
|
|
@@ -65906,6 +66045,8 @@ export type CustomElements = {
|
|
|
65906
66045
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
65907
66046
|
* string, as on a native control. The form does not submit while it is set.
|
|
65908
66047
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
66048
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
66049
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
65909
66050
|
*
|
|
65910
66051
|
* ## CSS Custom Properties
|
|
65911
66052
|
*
|
|
@@ -66920,8 +67061,9 @@ export type CustomElements = {
|
|
|
66920
67061
|
* - `selection-mode`/`selectionMode`: How many tags a reader can select: `single`, `multiple`, or none.
|
|
66921
67062
|
*
|
|
66922
67063
|
* Absent selects nothing, and the tags carry no selected state at all.
|
|
66923
|
-
* - `value`: The selected tags' values, separated by commas
|
|
66924
|
-
* space.
|
|
67064
|
+
* - `value`: The selected tags' values, separated by commas with no space, as Toggle
|
|
67065
|
+
* Group and Table write theirs, since a value may hold a space. A value
|
|
67066
|
+
* written with a space after each comma is read the same way.
|
|
66925
67067
|
*
|
|
66926
67068
|
* Set it to start with tags selected. A tag's value is its `value`, or its
|
|
66927
67069
|
* words where it has none.
|
|
@@ -67524,6 +67666,8 @@ export type CustomElements = {
|
|
|
67524
67666
|
* and shows the browser's message at the control.
|
|
67525
67667
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
67526
67668
|
* string, as on a native control. The form does not submit while it is set.
|
|
67669
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
67670
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
67527
67671
|
*
|
|
67528
67672
|
* ## CSS Custom Properties
|
|
67529
67673
|
*
|
|
@@ -67724,7 +67868,13 @@ export type CustomElements = {
|
|
|
67724
67868
|
* - `trigger-label`/`triggerLabel`: The name of the button that opens the list, read by screen readers.
|
|
67725
67869
|
* - `unavailable-message`/`unavailableMessage`: The message shown when `disable-times` bars a time.
|
|
67726
67870
|
* - `unreadable-message`/`unreadableMessage`: The message for text that is no time, where `bad-input-message` is not
|
|
67727
|
-
* set. `{mode}` is `single`, `range`, or `multiple`,
|
|
67871
|
+
* set. `{mode}` is `single`, `range`, or `multiple`, `{example}` is a time
|
|
67872
|
+
* written as the field writes one, `2:30 PM` in `en-US` and `14:30` in
|
|
67873
|
+
* `de-DE`, and `{shape}` is `HH:mm`, or `HH:mm:ss` with `seconds`.
|
|
67874
|
+
*
|
|
67875
|
+
* **The default names a time the field reads back.** It said "Enter a time
|
|
67876
|
+
* as HH:mm." to a reader whose field showed `2:30 PM`, and a pattern token
|
|
67877
|
+
* is words for a developer.
|
|
67728
67878
|
* - `variant`: Whether the panel shows one list of times or a column for each part of the
|
|
67729
67879
|
* time.
|
|
67730
67880
|
*
|
|
@@ -67883,6 +68033,8 @@ export type CustomElements = {
|
|
|
67883
68033
|
* and shows the browser's message at the control.
|
|
67884
68034
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
67885
68035
|
* string, as on a native control. The form does not submit while it is set.
|
|
68036
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
68037
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
67886
68038
|
*
|
|
67887
68039
|
* ## CSS Custom Properties
|
|
67888
68040
|
*
|
|
@@ -68335,6 +68487,8 @@ export type CustomElements = {
|
|
|
68335
68487
|
* and shows the browser's message at the control.
|
|
68336
68488
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
68337
68489
|
* string, as on a native control. The form does not submit while it is set.
|
|
68490
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
68491
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
68338
68492
|
*
|
|
68339
68493
|
* ## CSS Custom Properties
|
|
68340
68494
|
*
|
|
@@ -69150,6 +69304,8 @@ export type CustomElements = {
|
|
|
69150
69304
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
69151
69305
|
* string, as on a native control. The form does not submit while it is set.
|
|
69152
69306
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
69307
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
69308
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
69153
69309
|
*
|
|
69154
69310
|
* ## CSS Custom Properties
|
|
69155
69311
|
*
|
|
@@ -70035,7 +70191,7 @@ export type CustomElements = {
|
|
|
70035
70191
|
*
|
|
70036
70192
|
* Areas where markup can be added to the component.
|
|
70037
70193
|
*
|
|
70038
|
-
* - `(default)`: The item's label.
|
|
70194
|
+
* - `(default)`: The item's label. A nested item does not go here: give it `slot="children"`. In a development build, an item nested here is reported.
|
|
70039
70195
|
* - `chevron`: Replaces the expand and collapse mark of a branch. A slotted icon is sized and turned like the drawn one.
|
|
70040
70196
|
* - `children`: Nested items, which make this a branch.
|
|
70041
70197
|
* - `end`: Content after the label, at the far side of the row, such as a count or a state.
|
|
@@ -72178,12 +72334,6 @@ export type CustomElementsSolidJs = {
|
|
|
72178
72334
|
*
|
|
72179
72335
|
* Absent draws none: bands read as a composition need no numbers beside
|
|
72180
72336
|
* them, and the tooltip and the table hold every reading.
|
|
72181
|
-
* - `pointer`: Finds the reading nearest the pointer, so the tooltip can sit on it.
|
|
72182
|
-
*
|
|
72183
|
-
* Public for the same reason `series` and `named` are: a protected member
|
|
72184
|
-
* cannot be cast onto across unrelated classes, so it would be invisible to
|
|
72185
|
-
* every chart that needs it. Reading where a pointer is resting is a fair
|
|
72186
|
-
* thing to ask a chart anyway. (property only) (readonly)
|
|
72187
72337
|
* - `data`: The readings as data, in the shape of a table, where the page has no
|
|
72188
72338
|
* table to point `for` at. `for` wins where both are set.
|
|
72189
72339
|
*
|
|
@@ -72222,21 +72372,6 @@ export type CustomElementsSolidJs = {
|
|
|
72222
72372
|
* names an element, and the chart is a generic around its plot: written
|
|
72223
72373
|
* on the host, the name reached nobody. The plot takes it, as Heatmap's
|
|
72224
72374
|
* strip always did. (property only) (readonly)
|
|
72225
|
-
* - `readingsKnown`: Whether the readings have been looked for: false on the server and
|
|
72226
|
-
* while hydrating, where no table is resolved and no data is read. A
|
|
72227
|
-
* chart says it has no readings only once this is true. (property only) (readonly)
|
|
72228
|
-
* - `sourceRows`: Every row of the table, with each cell's text and number.
|
|
72229
|
-
*
|
|
72230
|
-
* This is where a tooltip's content comes from, and it is deliberately not
|
|
72231
|
-
* `series`. A chart draws numbers; a reader resting a pointer on one wants
|
|
72232
|
-
* what the table says, which is `$128k` and not `128000`, and often wants
|
|
72233
|
-
* the column beside it that nothing plotted at all.
|
|
72234
|
-
*
|
|
72235
|
-
* **Not `rows`.** It is the source table's rows, and `rows` on a chart is a
|
|
72236
|
-
* name a chart wants for itself: `helix-heatmap` takes `rows="7"` to mean a
|
|
72237
|
-
* calendar week, and declaring that against a base class whose `rows` is a
|
|
72238
|
-
* `Row[]` getter is a type error at best. Name the member for what it holds
|
|
72239
|
-
* rather than for the shortest word available. (property only) (readonly)
|
|
72240
72375
|
* - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
|
|
72241
72376
|
*
|
|
72242
72377
|
* The same test `readSeries` applies when it drops a column of notes: a
|
|
@@ -72282,8 +72417,6 @@ export type CustomElementsSolidJs = {
|
|
|
72282
72417
|
*
|
|
72283
72418
|
* Methods that can be called to access component functionality.
|
|
72284
72419
|
*
|
|
72285
|
-
* - `attributeChangedCallback(name: string, old: string | null, value: string | null) => void`: Called by the browser when an observed attribute changes. A new
|
|
72286
|
-
* `aria-label` asks for an update, because it names the plot.
|
|
72287
72420
|
* - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
|
|
72288
72421
|
*
|
|
72289
72422
|
* **A cell's place in its row is not its series' depth, and the tooltip
|
|
@@ -72343,9 +72476,10 @@ export type CustomElementsSolidJs = {
|
|
|
72343
72476
|
* - `live`: The readout: a polite live region that says the reading the keys moved to. Hide it visually.
|
|
72344
72477
|
* - `loading`: The words in place of the drawing while `loading` is set and there are no readings: the `loading` slot, falling back to `loading-text`.
|
|
72345
72478
|
* - `mark`: The invisible point the tooltip is anchored to.
|
|
72346
|
-
* - `plot`: The drawing, which takes focus to be read by key.
|
|
72479
|
+
* - `plot`: The drawing, which takes focus to be read by key. With nothing to draw, a group named as the chart is, holding the `empty` or `loading` part.
|
|
72347
72480
|
* - `summary`: The total and each part's share at the latest reading, written as a sentence for screen readers.
|
|
72348
72481
|
* - `svg`: The drawing surface the bands sit on.
|
|
72482
|
+
* - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
|
|
72349
72483
|
* - `tick`: One number on the axis, placed with `inset-block-start` at its level.
|
|
72350
72484
|
* - `tooltip`: The bubble, forwarded from `Tooltip`.
|
|
72351
72485
|
* - `tooltip-anchor`: The `Tooltip` element itself.
|
|
@@ -72368,6 +72502,9 @@ export type CustomElementsSolidJs = {
|
|
|
72368
72502
|
*
|
|
72369
72503
|
* These can be used to apply styling when a component is in a given state.
|
|
72370
72504
|
*
|
|
72505
|
+
* - `active`: While a reading is shown, under the pointer or the keys, with its tooltip open.
|
|
72506
|
+
* - `empty`: While the `empty` part stands in the plot.
|
|
72507
|
+
* - `loading`: While the `loading` part stands in the plot.
|
|
72371
72508
|
* - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
|
|
72372
72509
|
*/
|
|
72373
72510
|
"helix-area-chart": Partial<
|
|
@@ -72395,6 +72532,8 @@ export type CustomElementsSolidJs = {
|
|
|
72395
72532
|
* The shader stops drawing in these cases:
|
|
72396
72533
|
* - The element is off screen or in a background tab.
|
|
72397
72534
|
* - `prefers-reduced-motion` is set. The element shows one still frame.
|
|
72535
|
+
* - `paused` is set, from a pause control on your page. The element holds the
|
|
72536
|
+
* frame it shows.
|
|
72398
72537
|
* - The browser takes back the drawing context, on a GPU reset or past its
|
|
72399
72538
|
* limit of about sixteen contexts. The gradient shows until the context
|
|
72400
72539
|
* returns.
|
|
@@ -72457,6 +72596,12 @@ export type CustomElementsSolidJs = {
|
|
|
72457
72596
|
* hit-testable at rest, or it would swallow clicks meant for what is over it,
|
|
72458
72597
|
* and an element that is not hit-testable never receives the `pointermove`
|
|
72459
72598
|
* this listens for. Asking for the pointer is asking for the hit test.
|
|
72599
|
+
* - `paused`: Whether the field holds still on the frame it shows.
|
|
72600
|
+
*
|
|
72601
|
+
* Set it from a pause control on your page, so a reader can stop the motion,
|
|
72602
|
+
* as WCAG 2.2.2 asks of anything that moves for more than five seconds. A
|
|
72603
|
+
* change to another property still repaints the frame. Clearing it starts
|
|
72604
|
+
* the field from where it stopped.
|
|
72460
72605
|
* - `reach`: How far the pointer reaches into the field, `0` upward.
|
|
72461
72606
|
*
|
|
72462
72607
|
* Multiplied into the presence the pointer already fades in and out with, so
|
|
@@ -72765,7 +72910,7 @@ export type CustomElementsSolidJs = {
|
|
|
72765
72910
|
*
|
|
72766
72911
|
* Areas where markup can be added to the component.
|
|
72767
72912
|
*
|
|
72768
|
-
* - `(default)`:
|
|
72913
|
+
* - `(default)`: Shown when there is no usable image, in place of the initials, for an icon. Hidden from assistive technology when the avatar has a `name`, which the host announces.
|
|
72769
72914
|
*
|
|
72770
72915
|
* ## CSS Custom Properties
|
|
72771
72916
|
*
|
|
@@ -73187,12 +73332,6 @@ export type CustomElementsSolidJs = {
|
|
|
73187
73332
|
*
|
|
73188
73333
|
* Absent draws none with one scale, since bars compared with each other need
|
|
73189
73334
|
* no numbers. With `secondary` both scales are drawn whatever this says.
|
|
73190
|
-
* - `pointer`: Finds the reading nearest the pointer, so the tooltip can sit on it.
|
|
73191
|
-
*
|
|
73192
|
-
* Public for the same reason `series` and `named` are: a protected member
|
|
73193
|
-
* cannot be cast onto across unrelated classes, so it would be invisible to
|
|
73194
|
-
* every chart that needs it. Reading where a pointer is resting is a fair
|
|
73195
|
-
* thing to ask a chart anyway. (property only) (readonly)
|
|
73196
73335
|
* - `data`: The readings as data, in the shape of a table, where the page has no
|
|
73197
73336
|
* table to point `for` at. `for` wins where both are set.
|
|
73198
73337
|
*
|
|
@@ -73231,21 +73370,6 @@ export type CustomElementsSolidJs = {
|
|
|
73231
73370
|
* names an element, and the chart is a generic around its plot: written
|
|
73232
73371
|
* on the host, the name reached nobody. The plot takes it, as Heatmap's
|
|
73233
73372
|
* strip always did. (property only) (readonly)
|
|
73234
|
-
* - `readingsKnown`: Whether the readings have been looked for: false on the server and
|
|
73235
|
-
* while hydrating, where no table is resolved and no data is read. A
|
|
73236
|
-
* chart says it has no readings only once this is true. (property only) (readonly)
|
|
73237
|
-
* - `sourceRows`: Every row of the table, with each cell's text and number.
|
|
73238
|
-
*
|
|
73239
|
-
* This is where a tooltip's content comes from, and it is deliberately not
|
|
73240
|
-
* `series`. A chart draws numbers; a reader resting a pointer on one wants
|
|
73241
|
-
* what the table says, which is `$128k` and not `128000`, and often wants
|
|
73242
|
-
* the column beside it that nothing plotted at all.
|
|
73243
|
-
*
|
|
73244
|
-
* **Not `rows`.** It is the source table's rows, and `rows` on a chart is a
|
|
73245
|
-
* name a chart wants for itself: `helix-heatmap` takes `rows="7"` to mean a
|
|
73246
|
-
* calendar week, and declaring that against a base class whose `rows` is a
|
|
73247
|
-
* `Row[]` getter is a type error at best. Name the member for what it holds
|
|
73248
|
-
* rather than for the shortest word available. (property only) (readonly)
|
|
73249
73373
|
* - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
|
|
73250
73374
|
*
|
|
73251
73375
|
* The same test `readSeries` applies when it drops a column of notes: a
|
|
@@ -73291,8 +73415,6 @@ export type CustomElementsSolidJs = {
|
|
|
73291
73415
|
*
|
|
73292
73416
|
* Methods that can be called to access component functionality.
|
|
73293
73417
|
*
|
|
73294
|
-
* - `attributeChangedCallback(name: string, old: string | null, value: string | null) => void`: Called by the browser when an observed attribute changes. A new
|
|
73295
|
-
* `aria-label` asks for an update, because it names the plot.
|
|
73296
73418
|
* - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
|
|
73297
73419
|
*
|
|
73298
73420
|
* **A cell's place in its row is not its series' depth, and the tooltip
|
|
@@ -73360,9 +73482,10 @@ export type CustomElementsSolidJs = {
|
|
|
73360
73482
|
* - `live`: The readout: a polite live region that says the reading the keys moved to. Hide it visually.
|
|
73361
73483
|
* - `loading`: The words in place of the drawing while `loading` is set and there are no readings: the `loading` slot, falling back to `loading-text`.
|
|
73362
73484
|
* - `mark`: The invisible point the tooltip is anchored to.
|
|
73363
|
-
* - `plot`: The drawing, which takes focus to be read by key.
|
|
73485
|
+
* - `plot`: The drawing, which takes focus to be read by key. With nothing to draw, a group named as the chart is, holding the `empty` or `loading` part.
|
|
73364
73486
|
* - `summary`: The chart's name and each series' highest reading, written as a sentence for screen readers. Hide it visually.
|
|
73365
73487
|
* - `svg`: The drawing surface the bars and lines sit on.
|
|
73488
|
+
* - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
|
|
73366
73489
|
* - `tick`: One number on an axis.
|
|
73367
73490
|
* - `tooltip`: The tooltip bubble, forwarded from `Tooltip`.
|
|
73368
73491
|
* - `tooltip-anchor`: The `Tooltip` element itself.
|
|
@@ -73385,6 +73508,9 @@ export type CustomElementsSolidJs = {
|
|
|
73385
73508
|
*
|
|
73386
73509
|
* These can be used to apply styling when a component is in a given state.
|
|
73387
73510
|
*
|
|
73511
|
+
* - `active`: While a reading is shown, under the pointer or the keys, with its tooltip open.
|
|
73512
|
+
* - `empty`: While the `empty` part stands in the plot.
|
|
73513
|
+
* - `loading`: While the `loading` part stands in the plot.
|
|
73388
73514
|
* - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
|
|
73389
73515
|
*/
|
|
73390
73516
|
"helix-bar-chart": Partial<
|
|
@@ -74573,6 +74699,10 @@ export type CustomElementsSolidJs = {
|
|
|
74573
74699
|
* that one transform reads, so the cards are placed once in the document's
|
|
74574
74700
|
* coordinates and are not laid out again.
|
|
74575
74701
|
*
|
|
74702
|
+
* The [Canvases](https://fusion.dev/helix/docs/canvases) guide loads and saves
|
|
74703
|
+
* a board, keeps it in your state, and lists every key and the roles a screen
|
|
74704
|
+
* reader meets.
|
|
74705
|
+
*
|
|
74576
74706
|
* ## Attributes & Properties
|
|
74577
74707
|
*
|
|
74578
74708
|
* Component attributes and properties that can be applied to the element or by using JavaScript.
|
|
@@ -75604,7 +75734,7 @@ export type CustomElementsSolidJs = {
|
|
|
75604
75734
|
*
|
|
75605
75735
|
* - `helix-send`: Fired when the user sends their turn, and cancelable.
|
|
75606
75736
|
* - `helix-typing`: The user started or stopped writing, with `typing` saying which, as the composer's `typing` does.
|
|
75607
|
-
* - `input`: The user changed the text. Read it from `value`, for a typing indicator or a saved draft.
|
|
75737
|
+
* - `input`: The user changed the text. Read it from `value`, for a typing indicator or a saved draft. Bubbles and is composed, as a native field's is.
|
|
75608
75738
|
*
|
|
75609
75739
|
* ## Slots
|
|
75610
75740
|
*
|
|
@@ -75670,6 +75800,8 @@ export type CustomElementsSolidJs = {
|
|
|
75670
75800
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
75671
75801
|
* string, as on a native control. The form does not submit while it is set.
|
|
75672
75802
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
75803
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
75804
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
75673
75805
|
*
|
|
75674
75806
|
* ## CSS Custom Properties
|
|
75675
75807
|
*
|
|
@@ -76241,6 +76373,8 @@ export type CustomElementsSolidJs = {
|
|
|
76241
76373
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
76242
76374
|
* string, as on a native control. The form does not submit while it is set.
|
|
76243
76375
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
76376
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
76377
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
76244
76378
|
*
|
|
76245
76379
|
* ## CSS Custom Properties
|
|
76246
76380
|
*
|
|
@@ -76525,6 +76659,8 @@ export type CustomElementsSolidJs = {
|
|
|
76525
76659
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
76526
76660
|
* string, as on a native control. The form does not submit while it is set.
|
|
76527
76661
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
76662
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
76663
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
76528
76664
|
*
|
|
76529
76665
|
* ## CSS Custom Properties
|
|
76530
76666
|
*
|
|
@@ -77183,6 +77319,8 @@ export type CustomElementsSolidJs = {
|
|
|
77183
77319
|
* and shows the browser's message at the control.
|
|
77184
77320
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
77185
77321
|
* string, as on a native control. The form does not submit while it is set.
|
|
77322
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
77323
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
77186
77324
|
*
|
|
77187
77325
|
* ## CSS Custom Properties
|
|
77188
77326
|
*
|
|
@@ -77596,6 +77734,8 @@ export type CustomElementsSolidJs = {
|
|
|
77596
77734
|
* and shows the browser's message at the control.
|
|
77597
77735
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
77598
77736
|
* string, as on a native control. The form does not submit while it is set.
|
|
77737
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
77738
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
77599
77739
|
*
|
|
77600
77740
|
* ## CSS Custom Properties
|
|
77601
77741
|
*
|
|
@@ -78017,6 +78157,8 @@ export type CustomElementsSolidJs = {
|
|
|
78017
78157
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
78018
78158
|
* string, as on a native control. The form does not submit while it is set.
|
|
78019
78159
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
78160
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
78161
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
78020
78162
|
*
|
|
78021
78163
|
* ## CSS Custom Properties
|
|
78022
78164
|
*
|
|
@@ -78444,7 +78586,8 @@ export type CustomElementsSolidJs = {
|
|
|
78444
78586
|
*
|
|
78445
78587
|
* Methods that can be called to access component functionality.
|
|
78446
78588
|
*
|
|
78447
|
-
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the
|
|
78589
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
78590
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
78448
78591
|
* - `formDisabledCallback(disabled: boolean) => void`: Called by the browser when an ancestor fieldset is disabled or enabled.
|
|
78449
78592
|
*
|
|
78450
78593
|
* **The argument is the effective state, and taking it whole is what latched
|
|
@@ -79364,6 +79507,8 @@ export type CustomElementsSolidJs = {
|
|
|
79364
79507
|
* and shows the browser's message at the control.
|
|
79365
79508
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
79366
79509
|
* string, as on a native control. The form does not submit while it is set.
|
|
79510
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
79511
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
79367
79512
|
*
|
|
79368
79513
|
* ## CSS Custom Properties
|
|
79369
79514
|
*
|
|
@@ -79776,6 +79921,8 @@ export type CustomElementsSolidJs = {
|
|
|
79776
79921
|
* and shows the browser's message at the control.
|
|
79777
79922
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
79778
79923
|
* string, as on a native control. The form does not submit while it is set.
|
|
79924
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
79925
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
79779
79926
|
*
|
|
79780
79927
|
* ## CSS Custom Properties
|
|
79781
79928
|
*
|
|
@@ -80423,6 +80570,16 @@ export type CustomElementsSolidJs = {
|
|
|
80423
80570
|
* **`transparent` is where this one stops.** A mark with no ink is not a
|
|
80424
80571
|
* material choice, it is an absent series, and a chart says that by not
|
|
80425
80572
|
* having the datum rather than by painting it invisibly.
|
|
80573
|
+
* - `empty-text`/`emptyText`: The words shown in place of the drawing when the table has no readings,
|
|
80574
|
+
* and the fallback of the `empty` slot.
|
|
80575
|
+
* - `loading`: Whether the readings are still on their way. The chart shows
|
|
80576
|
+
* `loading-text` in place of an empty drawing until it has readings.
|
|
80577
|
+
*
|
|
80578
|
+
* Reflected, so a stylesheet can treat the chart while it waits. A chart
|
|
80579
|
+
* that already has readings keeps drawing them, so a refresh does not
|
|
80580
|
+
* blank it.
|
|
80581
|
+
* - `loading-text`/`loadingText`: The words shown in place of the drawing while `loading` is set and
|
|
80582
|
+
* there are no readings yet, and the fallback of the `loading` slot.
|
|
80426
80583
|
* - `for`: The id of the table to read.
|
|
80427
80584
|
*
|
|
80428
80585
|
* Names a table in the same tree, so a chart inside another component's
|
|
@@ -80500,12 +80657,6 @@ export type CustomElementsSolidJs = {
|
|
|
80500
80657
|
* rotation that puts the first slice at nine o'clock, the aspect ratio of a
|
|
80501
80658
|
* box that is no longer square, and where the middle sits once the bottom of
|
|
80502
80659
|
* the circle is not drawn.
|
|
80503
|
-
* - `pointer`: Finds the reading nearest the pointer, so the tooltip can sit on it.
|
|
80504
|
-
*
|
|
80505
|
-
* Public for the same reason `series` and `named` are: a protected member
|
|
80506
|
-
* cannot be cast onto across unrelated classes, so it would be invisible to
|
|
80507
|
-
* every chart that needs it. Reading where a pointer is resting is a fair
|
|
80508
|
-
* thing to ask a chart anyway. (property only) (readonly)
|
|
80509
80660
|
* - `data`: The readings as data, in the shape of a table, where the page has no
|
|
80510
80661
|
* table to point `for` at. `for` wins where both are set.
|
|
80511
80662
|
*
|
|
@@ -80544,21 +80695,6 @@ export type CustomElementsSolidJs = {
|
|
|
80544
80695
|
* names an element, and the chart is a generic around its plot: written
|
|
80545
80696
|
* on the host, the name reached nobody. The plot takes it, as Heatmap's
|
|
80546
80697
|
* strip always did. (property only) (readonly)
|
|
80547
|
-
* - `readingsKnown`: Whether the readings have been looked for: false on the server and
|
|
80548
|
-
* while hydrating, where no table is resolved and no data is read. A
|
|
80549
|
-
* chart says it has no readings only once this is true. (property only) (readonly)
|
|
80550
|
-
* - `sourceRows`: Every row of the table, with each cell's text and number.
|
|
80551
|
-
*
|
|
80552
|
-
* This is where a tooltip's content comes from, and it is deliberately not
|
|
80553
|
-
* `series`. A chart draws numbers; a reader resting a pointer on one wants
|
|
80554
|
-
* what the table says, which is `$128k` and not `128000`, and often wants
|
|
80555
|
-
* the column beside it that nothing plotted at all.
|
|
80556
|
-
*
|
|
80557
|
-
* **Not `rows`.** It is the source table's rows, and `rows` on a chart is a
|
|
80558
|
-
* name a chart wants for itself: `helix-heatmap` takes `rows="7"` to mean a
|
|
80559
|
-
* calendar week, and declaring that against a base class whose `rows` is a
|
|
80560
|
-
* `Row[]` getter is a type error at best. Name the member for what it holds
|
|
80561
|
-
* rather than for the shortest word available. (property only) (readonly)
|
|
80562
80698
|
* - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
|
|
80563
80699
|
*
|
|
80564
80700
|
* The same test `readSeries` applies when it drops a column of notes: a
|
|
@@ -80586,18 +80722,25 @@ export type CustomElementsSolidJs = {
|
|
|
80586
80722
|
* browser harness's awaits it alone: a browser always runs the frame, and a
|
|
80587
80723
|
* timer beside it was a bet on how long one takes, which a busy run lost. (property only) (readonly)
|
|
80588
80724
|
*
|
|
80725
|
+
* ## Events
|
|
80726
|
+
*
|
|
80727
|
+
* Events that will be emitted by the component.
|
|
80728
|
+
*
|
|
80729
|
+
* - `helix-reading-change`: The slice shown moved, or was put away: `index` is the slice's row, or `-1` for none, with its `label` and the `pointerType` that moved it.
|
|
80730
|
+
* - `helix-reading-press`: A slice was clicked, tapped, or pressed with Enter or Space, with the same detail as `helix-reading-change`.
|
|
80731
|
+
*
|
|
80589
80732
|
* ## Slots
|
|
80590
80733
|
*
|
|
80591
80734
|
* Areas where markup can be added to the component.
|
|
80592
80735
|
*
|
|
80593
80736
|
* - `(default)`: Content in the middle of the ring, usually a total. It is read by screen readers, while the ring itself is hidden from them.
|
|
80737
|
+
* - `empty`: Content shown in place of the ring when the table has no readings. Falls back to `empty-text`.
|
|
80738
|
+
* - `loading`: Content shown in place of the ring while `loading` is set and there are no readings yet. Falls back to `loading-text`.
|
|
80594
80739
|
*
|
|
80595
80740
|
* ## Methods
|
|
80596
80741
|
*
|
|
80597
80742
|
* Methods that can be called to access component functionality.
|
|
80598
80743
|
*
|
|
80599
|
-
* - `attributeChangedCallback(name: string, old: string | null, value: string | null) => void`: Called by the browser when an observed attribute changes. A new
|
|
80600
|
-
* `aria-label` asks for an update, because it names the plot.
|
|
80601
80744
|
* - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
|
|
80602
80745
|
*
|
|
80603
80746
|
* **A cell's place in its row is not its series' depth, and the tooltip
|
|
@@ -80647,14 +80790,17 @@ export type CustomElementsSolidJs = {
|
|
|
80647
80790
|
* Custom selectors for styling elements within the component.
|
|
80648
80791
|
*
|
|
80649
80792
|
* - `center`: The middle of the ring, holding whatever is slotted.
|
|
80793
|
+
* - `empty`: The words in place of the ring when the table has no readings: the `empty` slot, falling back to `empty-text`. Not drawn while the table cannot be read yet, on the server and during hydration.
|
|
80650
80794
|
* - `live`: The readout: a polite live region that says the slice the keys moved to. Hide it visually.
|
|
80795
|
+
* - `loading`: The words in place of the ring while `loading` is set and there are no readings: the `loading` slot, falling back to `loading-text`.
|
|
80651
80796
|
* - `mark`: The invisible point the tooltip is anchored to.
|
|
80652
|
-
* - `plot`: The drawing, which takes focus to be read by key.
|
|
80797
|
+
* - `plot`: The drawing, which takes focus to be read by key. With nothing to draw, a group named as the chart is, holding the `empty` or `loading` part.
|
|
80653
80798
|
* - `segment`: One slice.
|
|
80654
80799
|
* - `segment-active`: The slice under the pointer. Set alongside `segment`.
|
|
80655
80800
|
* - `segment-edge`: One slice as a closed shape, used to draw its outline.
|
|
80656
80801
|
* - `slice-label`: One slice's share, written on the slice under `slice-labels`. Placed with `left` and `top`, or `inset-inline-start` and `top` on a half ring, and carries its series color as `--chart-series`.
|
|
80657
80802
|
* - `summary`: The chart's name and each slice's share, written as a sentence for screen readers. Hide it visually.
|
|
80803
|
+
* - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
|
|
80658
80804
|
* - `tooltip`: The bubble, forwarded from `Tooltip`.
|
|
80659
80805
|
* - `tooltip-anchor`: The `Tooltip` element itself.
|
|
80660
80806
|
* - `tooltip-arrow`: The bubble's point, forwarded from `Tooltip`.
|
|
@@ -80677,6 +80823,9 @@ export type CustomElementsSolidJs = {
|
|
|
80677
80823
|
*
|
|
80678
80824
|
* These can be used to apply styling when a component is in a given state.
|
|
80679
80825
|
*
|
|
80826
|
+
* - `active`: While a slice is shown, under the pointer or the keys, with its tooltip open.
|
|
80827
|
+
* - `empty`: While the `empty` part stands in place of the ring.
|
|
80828
|
+
* - `loading`: While the `loading` part stands in place of the ring.
|
|
80680
80829
|
* - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
|
|
80681
80830
|
*/
|
|
80682
80831
|
"helix-donut-chart": Partial<
|
|
@@ -81456,6 +81605,8 @@ export type CustomElementsSolidJs = {
|
|
|
81456
81605
|
* and shows the browser's message at the control.
|
|
81457
81606
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
81458
81607
|
* string, as on a native control. The form does not submit while it is set.
|
|
81608
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
81609
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
81459
81610
|
*
|
|
81460
81611
|
* ## CSS Custom Properties
|
|
81461
81612
|
*
|
|
@@ -82284,6 +82435,8 @@ export type CustomElementsSolidJs = {
|
|
|
82284
82435
|
* and shows the browser's message at the control.
|
|
82285
82436
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
82286
82437
|
* string, as on a native control. The form does not submit while it is set.
|
|
82438
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
82439
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
82287
82440
|
*
|
|
82288
82441
|
* ## CSS Custom Properties
|
|
82289
82442
|
*
|
|
@@ -82627,6 +82780,10 @@ export type CustomElementsSolidJs = {
|
|
|
82627
82780
|
* `no-panel`, the drawing takes the whole frame, and a button among the
|
|
82628
82781
|
* controls opens the search and the list over its end.
|
|
82629
82782
|
*
|
|
82783
|
+
* The [Graphs](https://fusion.dev/helix/docs/graphs) guide connects a
|
|
82784
|
+
* renderer, lists the keys and what a screen reader hears, and describes the
|
|
82785
|
+
* methods of a driver for another renderer.
|
|
82786
|
+
*
|
|
82630
82787
|
* ## Attributes & Properties
|
|
82631
82788
|
*
|
|
82632
82789
|
* Component attributes and properties that can be applied to the element or by using JavaScript.
|
|
@@ -82753,6 +82910,9 @@ export type CustomElementsSolidJs = {
|
|
|
82753
82910
|
* own, since the fallback name is the same word. Empty leaves the role.
|
|
82754
82911
|
* - `search-label`/`searchLabel`: The search field's name.
|
|
82755
82912
|
* - `selected-label`/`selectedLabel`: How the selected note is described in the list.
|
|
82913
|
+
* - `selection-label`/`selectionLabel`: What screen readers hear after a reader selects a note, in the list or in
|
|
82914
|
+
* the drawing, with `{note}` for its name and `{count}` for how many notes
|
|
82915
|
+
* the list then holds, written with `count-label`.
|
|
82756
82916
|
* - `two-finger-hint-label`/`twoFingerHintLabel`: The hint shown when one finger swipes over the graph with `gestures="cooperative"`.
|
|
82757
82917
|
* - `using-label`/`usingLabel`: The line shown while the graph, with `gestures="activate"`, has the gestures.
|
|
82758
82918
|
* - `wheel-hint-label`/`wheelHintLabel`: The hint shown when the wheel scrolls past the graph with
|
|
@@ -82903,7 +83063,7 @@ export type CustomElementsSolidJs = {
|
|
|
82903
83063
|
* - `gesture-hint`: Words over the graph for a moment when it lets a gesture pass to the page, such as how to zoom it.
|
|
82904
83064
|
* - `gesture-status`: The line shown while a graph with `gestures="activate"` has the gestures.
|
|
82905
83065
|
* - `header`: The strip above the graph.
|
|
82906
|
-
* - `legend`: The groups over the drawing, with `legend
|
|
83066
|
+
* - `legend`: The groups over the drawing, with `legend`: a toolbar of buttons, each showing or hiding its notes, which is one tab stop.
|
|
82907
83067
|
* - `legend-item`: One group in the legend, pressed while its notes are shown. Carries `data-tone` where every note in the group has the same tone, which colors the notes over the group's own color.
|
|
82908
83068
|
* - `legend-item-hidden`: A group in the legend whose notes are hidden.
|
|
82909
83069
|
* - `legend-swatch`: The mark in a group's color, before its name.
|
|
@@ -83171,17 +83331,12 @@ export type CustomElementsSolidJs = {
|
|
|
83171
83331
|
* no order in it.
|
|
83172
83332
|
* - `total-label`/`totalLabel`: The name the `overview` gives the total of the readings drawn,
|
|
83173
83333
|
* `{totalLabel}` in `overview-label`.
|
|
83174
|
-
* - `value`: The selected cells, by
|
|
83175
|
-
* `2026-06-11`,
|
|
83334
|
+
* - `value`: The selected cells, separated by commas: each by the date its row's
|
|
83335
|
+
* header carries in a `<time datetime>`, such as `2026-06-11`, or by the
|
|
83336
|
+
* header's words where it carries none.
|
|
83176
83337
|
*
|
|
83177
83338
|
* Set it to start with cells selected. Written by a press or a key under
|
|
83178
83339
|
* `selection-mode`.
|
|
83179
|
-
* - `pointer`: Finds the reading nearest the pointer, so the tooltip can sit on it.
|
|
83180
|
-
*
|
|
83181
|
-
* Public for the same reason `series` and `named` are: a protected member
|
|
83182
|
-
* cannot be cast onto across unrelated classes, so it would be invisible to
|
|
83183
|
-
* every chart that needs it. Reading where a pointer is resting is a fair
|
|
83184
|
-
* thing to ask a chart anyway. (property only) (readonly)
|
|
83185
83340
|
* - `data`: The readings as data, in the shape of a table, where the page has no
|
|
83186
83341
|
* table to point `for` at. `for` wins where both are set.
|
|
83187
83342
|
*
|
|
@@ -83220,21 +83375,6 @@ export type CustomElementsSolidJs = {
|
|
|
83220
83375
|
* names an element, and the chart is a generic around its plot: written
|
|
83221
83376
|
* on the host, the name reached nobody. The plot takes it, as Heatmap's
|
|
83222
83377
|
* strip always did. (property only) (readonly)
|
|
83223
|
-
* - `readingsKnown`: Whether the readings have been looked for: false on the server and
|
|
83224
|
-
* while hydrating, where no table is resolved and no data is read. A
|
|
83225
|
-
* chart says it has no readings only once this is true. (property only) (readonly)
|
|
83226
|
-
* - `sourceRows`: Every row of the table, with each cell's text and number.
|
|
83227
|
-
*
|
|
83228
|
-
* This is where a tooltip's content comes from, and it is deliberately not
|
|
83229
|
-
* `series`. A chart draws numbers; a reader resting a pointer on one wants
|
|
83230
|
-
* what the table says, which is `$128k` and not `128000`, and often wants
|
|
83231
|
-
* the column beside it that nothing plotted at all.
|
|
83232
|
-
*
|
|
83233
|
-
* **Not `rows`.** It is the source table's rows, and `rows` on a chart is a
|
|
83234
|
-
* name a chart wants for itself: `helix-heatmap` takes `rows="7"` to mean a
|
|
83235
|
-
* calendar week, and declaring that against a base class whose `rows` is a
|
|
83236
|
-
* `Row[]` getter is a type error at best. Name the member for what it holds
|
|
83237
|
-
* rather than for the shortest word available. (property only) (readonly)
|
|
83238
83378
|
* - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
|
|
83239
83379
|
*
|
|
83240
83380
|
* The same test `readSeries` applies when it drops a column of notes: a
|
|
@@ -83296,8 +83436,6 @@ export type CustomElementsSolidJs = {
|
|
|
83296
83436
|
*
|
|
83297
83437
|
* Methods that can be called to access component functionality.
|
|
83298
83438
|
*
|
|
83299
|
-
* - `attributeChangedCallback(name: string, old: string | null, value: string | null) => void`: Called by the browser when an observed attribute changes. A new
|
|
83300
|
-
* `aria-label` asks for an update, because it names the plot.
|
|
83301
83439
|
* - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
|
|
83302
83440
|
*
|
|
83303
83441
|
* **A cell's place in its row is not its series' depth, and the tooltip
|
|
@@ -83390,11 +83528,14 @@ export type CustomElementsSolidJs = {
|
|
|
83390
83528
|
* - `selection`: A polite region that says how many cells are selected after a change, rendered from the first change. Hide it visually.
|
|
83391
83529
|
* - `start`: The leading slot's box.
|
|
83392
83530
|
* - `summary`: The middle slot's box.
|
|
83531
|
+
* - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
|
|
83393
83532
|
*
|
|
83394
83533
|
* ## CSS States
|
|
83395
83534
|
*
|
|
83396
83535
|
* These can be used to apply styling when a component is in a given state.
|
|
83397
83536
|
*
|
|
83537
|
+
* - `active`: While a cell is shown, under the pointer or the keys, with its tooltip open.
|
|
83538
|
+
* - `empty`: While the `empty` part stands in place of the cells.
|
|
83398
83539
|
* - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
|
|
83399
83540
|
*/
|
|
83400
83541
|
"helix-heatmap": Partial<
|
|
@@ -83637,7 +83778,8 @@ export type CustomElementsSolidJs = {
|
|
|
83637
83778
|
*
|
|
83638
83779
|
* Methods that can be called to access component functionality.
|
|
83639
83780
|
*
|
|
83640
|
-
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the
|
|
83781
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
83782
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
83641
83783
|
* - `formDisabledCallback(disabled: boolean) => void`: Called by the browser when an ancestor fieldset is disabled or enabled.
|
|
83642
83784
|
*
|
|
83643
83785
|
* **The argument is the effective state, and taking it whole is what latched
|
|
@@ -84296,6 +84438,8 @@ export type CustomElementsSolidJs = {
|
|
|
84296
84438
|
* and shows the browser's message at the control.
|
|
84297
84439
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
84298
84440
|
* string, as on a native control. The form does not submit while it is set.
|
|
84441
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
84442
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
84299
84443
|
*
|
|
84300
84444
|
* ## CSS Custom Properties
|
|
84301
84445
|
*
|
|
@@ -85132,12 +85276,6 @@ export type CustomElementsSolidJs = {
|
|
|
85132
85276
|
* Set it where the distance from nothing is the point rather than the shape,
|
|
85133
85277
|
* and accept that a series which never approaches zero becomes a flat rule
|
|
85134
85278
|
* near the top of the box.
|
|
85135
|
-
* - `pointer`: Finds the reading nearest the pointer, so the tooltip can sit on it.
|
|
85136
|
-
*
|
|
85137
|
-
* Public for the same reason `series` and `named` are: a protected member
|
|
85138
|
-
* cannot be cast onto across unrelated classes, so it would be invisible to
|
|
85139
|
-
* every chart that needs it. Reading where a pointer is resting is a fair
|
|
85140
|
-
* thing to ask a chart anyway. (property only) (readonly)
|
|
85141
85279
|
* - `data`: The readings as data, in the shape of a table, where the page has no
|
|
85142
85280
|
* table to point `for` at. `for` wins where both are set.
|
|
85143
85281
|
*
|
|
@@ -85176,21 +85314,6 @@ export type CustomElementsSolidJs = {
|
|
|
85176
85314
|
* names an element, and the chart is a generic around its plot: written
|
|
85177
85315
|
* on the host, the name reached nobody. The plot takes it, as Heatmap's
|
|
85178
85316
|
* strip always did. (property only) (readonly)
|
|
85179
|
-
* - `readingsKnown`: Whether the readings have been looked for: false on the server and
|
|
85180
|
-
* while hydrating, where no table is resolved and no data is read. A
|
|
85181
|
-
* chart says it has no readings only once this is true. (property only) (readonly)
|
|
85182
|
-
* - `sourceRows`: Every row of the table, with each cell's text and number.
|
|
85183
|
-
*
|
|
85184
|
-
* This is where a tooltip's content comes from, and it is deliberately not
|
|
85185
|
-
* `series`. A chart draws numbers; a reader resting a pointer on one wants
|
|
85186
|
-
* what the table says, which is `$128k` and not `128000`, and often wants
|
|
85187
|
-
* the column beside it that nothing plotted at all.
|
|
85188
|
-
*
|
|
85189
|
-
* **Not `rows`.** It is the source table's rows, and `rows` on a chart is a
|
|
85190
|
-
* name a chart wants for itself: `helix-heatmap` takes `rows="7"` to mean a
|
|
85191
|
-
* calendar week, and declaring that against a base class whose `rows` is a
|
|
85192
|
-
* `Row[]` getter is a type error at best. Name the member for what it holds
|
|
85193
|
-
* rather than for the shortest word available. (property only) (readonly)
|
|
85194
85317
|
* - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
|
|
85195
85318
|
*
|
|
85196
85319
|
* The same test `readSeries` applies when it drops a column of notes: a
|
|
@@ -85236,8 +85359,6 @@ export type CustomElementsSolidJs = {
|
|
|
85236
85359
|
*
|
|
85237
85360
|
* Methods that can be called to access component functionality.
|
|
85238
85361
|
*
|
|
85239
|
-
* - `attributeChangedCallback(name: string, old: string | null, value: string | null) => void`: Called by the browser when an observed attribute changes. A new
|
|
85240
|
-
* `aria-label` asks for an update, because it names the plot.
|
|
85241
85362
|
* - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
|
|
85242
85363
|
*
|
|
85243
85364
|
* **A cell's place in its row is not its series' depth, and the tooltip
|
|
@@ -85308,9 +85429,10 @@ export type CustomElementsSolidJs = {
|
|
|
85308
85429
|
* - `mark`: The invisible point the tooltip is anchored to.
|
|
85309
85430
|
* - `marker`: The mark on one reading, under `markers`, and on a reading with a blank on either side. Placed with `inset-inline-start` and `inset-block-start`, and carries its series color as `--chart-series`.
|
|
85310
85431
|
* - `marker-lone`: A `marker` on a reading with a blank on either side, which no line reaches. Set alongside `marker`.
|
|
85311
|
-
* - `plot`: The drawing, which takes focus to be read by key.
|
|
85432
|
+
* - `plot`: The drawing, which takes focus to be read by key. With nothing to draw, a group named as the chart is, holding the `empty` or `loading` part.
|
|
85312
85433
|
* - `summary`: The chart's name and each series' latest reading, written as a sentence for screen readers. Hide it visually.
|
|
85313
85434
|
* - `svg`: The drawing surface the lines and areas sit on.
|
|
85435
|
+
* - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
|
|
85314
85436
|
* - `terminus`: The mark on one series' last reading.
|
|
85315
85437
|
* - `tick`: One number on the axis, placed with `inset-block-start` at its level.
|
|
85316
85438
|
* - `tooltip`: The bubble, forwarded from `Tooltip`.
|
|
@@ -85334,6 +85456,9 @@ export type CustomElementsSolidJs = {
|
|
|
85334
85456
|
*
|
|
85335
85457
|
* These can be used to apply styling when a component is in a given state.
|
|
85336
85458
|
*
|
|
85459
|
+
* - `active`: While a reading is shown, under the pointer or the keys, with its tooltip open.
|
|
85460
|
+
* - `empty`: While the `empty` part stands in the plot.
|
|
85461
|
+
* - `loading`: While the `loading` part stands in the plot.
|
|
85337
85462
|
* - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
|
|
85338
85463
|
*/
|
|
85339
85464
|
"helix-line-chart": Partial<
|
|
@@ -86011,6 +86136,8 @@ export type CustomElementsSolidJs = {
|
|
|
86011
86136
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
86012
86137
|
* string, as on a native control. The form does not submit while it is set.
|
|
86013
86138
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
86139
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
86140
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
86014
86141
|
*
|
|
86015
86142
|
* ## CSS Custom Properties
|
|
86016
86143
|
*
|
|
@@ -86076,6 +86203,9 @@ export type CustomElementsSolidJs = {
|
|
|
86076
86203
|
* While `delay` runs, the loader keeps its size and draws nothing, so the line
|
|
86077
86204
|
* it sits in does not move when it appears.
|
|
86078
86205
|
*
|
|
86206
|
+
* With something in the `content` slot, the loader takes the larger of the ring
|
|
86207
|
+
* and the content, and the ring centers over the content while the work runs.
|
|
86208
|
+
*
|
|
86079
86209
|
* ## Attributes & Properties
|
|
86080
86210
|
*
|
|
86081
86211
|
* Component attributes and properties that can be applied to the element or by using JavaScript.
|
|
@@ -86100,6 +86230,9 @@ export type CustomElementsSolidJs = {
|
|
|
86100
86230
|
*
|
|
86101
86231
|
* Names an element in the same tree. In React it arrives as a property, the
|
|
86102
86232
|
* way `Tooltip.for` does.
|
|
86233
|
+
* - `idle`: Whether no work is in progress. The loader draws nothing of its own, has
|
|
86234
|
+
* no role, and marks no region busy, and what is in the `content` slot
|
|
86235
|
+
* shows. Clearing it starts `delay` again.
|
|
86103
86236
|
* - `label`: The loader's name, announced by screen readers while the work is in
|
|
86104
86237
|
* progress.
|
|
86105
86238
|
* - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
|
|
@@ -86128,13 +86261,14 @@ export type CustomElementsSolidJs = {
|
|
|
86128
86261
|
* Areas where markup can be added to the component.
|
|
86129
86262
|
*
|
|
86130
86263
|
* - `(default)`: An icon or logo that stays still at the center. Empty by default.
|
|
86264
|
+
* - `content`: What the loader stands in for while the work runs, such as a button. It keeps its size, hidden and inert, until `idle` is set.
|
|
86131
86265
|
*
|
|
86132
86266
|
* ## CSS Custom Properties
|
|
86133
86267
|
*
|
|
86134
86268
|
* CSS variables available for styling the component.
|
|
86135
86269
|
*
|
|
86136
86270
|
* - `--loader-color`: Color of the moving arc.
|
|
86137
|
-
* - `--loader-duration`: How long one turn of the arc takes, 0.8s by default. With motion reduced the
|
|
86271
|
+
* - `--loader-duration`: How long one turn of the arc takes, 0.8s by default. With motion reduced the arc turns once every four seconds, whatever this says.
|
|
86138
86272
|
* - `--loader-size`: Diameter. Defaults to the size token that `size` picks, which is 1.5rem at the default density.
|
|
86139
86273
|
* - `--loader-track-color`: Color of the circle behind the arc.
|
|
86140
86274
|
* - `--loader-track-width`: Width of the arc and the circle behind it, in units of a 24-unit drawing. Defaults to 2.
|
|
@@ -86143,6 +86277,7 @@ export type CustomElementsSolidJs = {
|
|
|
86143
86277
|
*
|
|
86144
86278
|
* Custom selectors for styling elements within the component.
|
|
86145
86279
|
*
|
|
86280
|
+
* - `content`: The box that holds the `content` slot. Hidden while the work runs, and shown while `idle` is set.
|
|
86146
86281
|
* - `indicator`: The arc that turns.
|
|
86147
86282
|
* - `mark`: The region that holds the slotted content at the center.
|
|
86148
86283
|
* - `svg`: The rotating circle pair.
|
|
@@ -86780,6 +86915,10 @@ export type CustomElementsSolidJs = {
|
|
|
86780
86915
|
* to draw the map's credit compact in a corner over the map, which suits a
|
|
86781
86916
|
* map the width of the page.
|
|
86782
86917
|
*
|
|
86918
|
+
* The [Maps](https://fusion.dev/helix/docs/maps) guide connects a renderer,
|
|
86919
|
+
* lists the keys and what a screen reader hears, and describes every method
|
|
86920
|
+
* a driver for another renderer can have.
|
|
86921
|
+
*
|
|
86783
86922
|
* ## Attributes & Properties
|
|
86784
86923
|
*
|
|
86785
86924
|
* Component attributes and properties that can be applied to the element or by using JavaScript.
|
|
@@ -89023,6 +89162,8 @@ export type CustomElementsSolidJs = {
|
|
|
89023
89162
|
* and shows the browser's message at the control.
|
|
89024
89163
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
89025
89164
|
* string, as on a native control. The form does not submit while it is set.
|
|
89165
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
89166
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
89026
89167
|
*
|
|
89027
89168
|
* ## CSS Custom Properties
|
|
89028
89169
|
*
|
|
@@ -90295,6 +90436,8 @@ export type CustomElementsSolidJs = {
|
|
|
90295
90436
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
90296
90437
|
* string, as on a native control. The form does not submit while it is set.
|
|
90297
90438
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
90439
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
90440
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
90298
90441
|
*
|
|
90299
90442
|
* ## CSS Custom Properties
|
|
90300
90443
|
*
|
|
@@ -90646,6 +90789,8 @@ export type CustomElementsSolidJs = {
|
|
|
90646
90789
|
* and shows the browser's message at the control.
|
|
90647
90790
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
90648
90791
|
* string, as on a native control. The form does not submit while it is set.
|
|
90792
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
90793
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
90649
90794
|
*
|
|
90650
90795
|
* ## CSS Custom Properties
|
|
90651
90796
|
*
|
|
@@ -91460,6 +91605,8 @@ export type CustomElementsSolidJs = {
|
|
|
91460
91605
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
91461
91606
|
* string, as on a native control. The form does not submit while it is set.
|
|
91462
91607
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
91608
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
91609
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
91463
91610
|
*
|
|
91464
91611
|
* ## CSS Custom Properties
|
|
91465
91612
|
*
|
|
@@ -91964,6 +92111,8 @@ export type CustomElementsSolidJs = {
|
|
|
91964
92111
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
91965
92112
|
* string, as on a native control. The form does not submit while it is set.
|
|
91966
92113
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
92114
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
92115
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
91967
92116
|
*
|
|
91968
92117
|
* ## CSS Custom Properties
|
|
91969
92118
|
*
|
|
@@ -92969,12 +93118,6 @@ export type CustomElementsSolidJs = {
|
|
|
92969
93118
|
* Absent draws none. A series with fewer than two points, or with every
|
|
92970
93119
|
* point at one measure across, has no line to draw. The summary already
|
|
92971
93120
|
* gives each series' correlation, which says how near the points are to it.
|
|
92972
|
-
* - `pointer`: Finds the reading nearest the pointer, so the tooltip can sit on it.
|
|
92973
|
-
*
|
|
92974
|
-
* Public for the same reason `series` and `named` are: a protected member
|
|
92975
|
-
* cannot be cast onto across unrelated classes, so it would be invisible to
|
|
92976
|
-
* every chart that needs it. Reading where a pointer is resting is a fair
|
|
92977
|
-
* thing to ask a chart anyway. (property only) (readonly)
|
|
92978
93121
|
* - `data`: The readings as data, in the shape of a table, where the page has no
|
|
92979
93122
|
* table to point `for` at. `for` wins where both are set.
|
|
92980
93123
|
*
|
|
@@ -93013,21 +93156,6 @@ export type CustomElementsSolidJs = {
|
|
|
93013
93156
|
* names an element, and the chart is a generic around its plot: written
|
|
93014
93157
|
* on the host, the name reached nobody. The plot takes it, as Heatmap's
|
|
93015
93158
|
* strip always did. (property only) (readonly)
|
|
93016
|
-
* - `readingsKnown`: Whether the readings have been looked for: false on the server and
|
|
93017
|
-
* while hydrating, where no table is resolved and no data is read. A
|
|
93018
|
-
* chart says it has no readings only once this is true. (property only) (readonly)
|
|
93019
|
-
* - `sourceRows`: Every row of the table, with each cell's text and number.
|
|
93020
|
-
*
|
|
93021
|
-
* This is where a tooltip's content comes from, and it is deliberately not
|
|
93022
|
-
* `series`. A chart draws numbers; a reader resting a pointer on one wants
|
|
93023
|
-
* what the table says, which is `$128k` and not `128000`, and often wants
|
|
93024
|
-
* the column beside it that nothing plotted at all.
|
|
93025
|
-
*
|
|
93026
|
-
* **Not `rows`.** It is the source table's rows, and `rows` on a chart is a
|
|
93027
|
-
* name a chart wants for itself: `helix-heatmap` takes `rows="7"` to mean a
|
|
93028
|
-
* calendar week, and declaring that against a base class whose `rows` is a
|
|
93029
|
-
* `Row[]` getter is a type error at best. Name the member for what it holds
|
|
93030
|
-
* rather than for the shortest word available. (property only) (readonly)
|
|
93031
93159
|
* - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
|
|
93032
93160
|
*
|
|
93033
93161
|
* The same test `readSeries` applies when it drops a column of notes: a
|
|
@@ -93073,8 +93201,6 @@ export type CustomElementsSolidJs = {
|
|
|
93073
93201
|
*
|
|
93074
93202
|
* Methods that can be called to access component functionality.
|
|
93075
93203
|
*
|
|
93076
|
-
* - `attributeChangedCallback(name: string, old: string | null, value: string | null) => void`: Called by the browser when an observed attribute changes. A new
|
|
93077
|
-
* `aria-label` asks for an update, because it names the plot.
|
|
93078
93204
|
* - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
|
|
93079
93205
|
*
|
|
93080
93206
|
* **A cell's place in its row is not its series' depth, and the tooltip
|
|
@@ -93133,11 +93259,12 @@ export type CustomElementsSolidJs = {
|
|
|
93133
93259
|
* - `loading`: The words in place of the drawing while `loading` is set and there are no readings: the `loading` slot, falling back to `loading-text`.
|
|
93134
93260
|
* - `mark`: The invisible point the tooltip is anchored to.
|
|
93135
93261
|
* - `plane`: The grid that holds the plot, both axes, and their names. It runs left to right on every page.
|
|
93136
|
-
* - `plot`: The drawing, which takes focus to be read by key.
|
|
93262
|
+
* - `plot`: The drawing, which takes focus to be read by key. With nothing to draw, a group named as the chart is, holding the `empty` or `loading` part.
|
|
93137
93263
|
* - `point`: One row, as a point.
|
|
93138
93264
|
* - `point-active`: A point in the row under the pointer. Set alongside `point`.
|
|
93139
93265
|
* - `summary`: The text that says how strongly the measures relate, for people who cannot see the points.
|
|
93140
93266
|
* - `svg`: The drawing surface the gridlines and the trend lines sit on.
|
|
93267
|
+
* - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
|
|
93141
93268
|
* - `tooltip`: The bubble, forwarded from `Tooltip`.
|
|
93142
93269
|
* - `tooltip-anchor`: The `Tooltip` element itself.
|
|
93143
93270
|
* - `tooltip-arrow`: The bubble's point, forwarded from `Tooltip`.
|
|
@@ -93157,7 +93284,7 @@ export type CustomElementsSolidJs = {
|
|
|
93157
93284
|
* - `trend`: One series' line of best fit, under `trend`. Carries its series color as `--chart-series`.
|
|
93158
93285
|
* - `x-axis`: The values along the horizontal axis, under the plot.
|
|
93159
93286
|
* - `x-name`: The name of the horizontal measure.
|
|
93160
|
-
* - `x-tick`: One labeled value on the horizontal axis. Each axis has its own tick part, because `::part()` cannot tell which axis a tick is on.
|
|
93287
|
+
* - `x-tick`: One labeled value on the horizontal axis. Each axis has its own tick part, because `::part()` cannot tell which axis a tick is on. The one at the far edge carries `data-edge="end"`.
|
|
93161
93288
|
* - `y-axis`: The values along the vertical axis, beside the plot.
|
|
93162
93289
|
* - `y-name`: The name of the vertical measure.
|
|
93163
93290
|
* - `y-tick`: One labeled value on the vertical axis.
|
|
@@ -93166,6 +93293,9 @@ export type CustomElementsSolidJs = {
|
|
|
93166
93293
|
*
|
|
93167
93294
|
* These can be used to apply styling when a component is in a given state.
|
|
93168
93295
|
*
|
|
93296
|
+
* - `active`: While a reading is shown, under the pointer or the keys, with its tooltip open.
|
|
93297
|
+
* - `empty`: While the `empty` part stands in the plot.
|
|
93298
|
+
* - `loading`: While the `loading` part stands in the plot.
|
|
93169
93299
|
* - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
|
|
93170
93300
|
*/
|
|
93171
93301
|
"helix-scatter-chart": Partial<
|
|
@@ -93618,6 +93748,8 @@ export type CustomElementsSolidJs = {
|
|
|
93618
93748
|
* and shows the browser's message at the control.
|
|
93619
93749
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
93620
93750
|
* string, as on a native control. The form does not submit while it is set.
|
|
93751
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
93752
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
93621
93753
|
*
|
|
93622
93754
|
* ## CSS Custom Properties
|
|
93623
93755
|
*
|
|
@@ -94127,6 +94259,8 @@ export type CustomElementsSolidJs = {
|
|
|
94127
94259
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
94128
94260
|
* string, as on a native control. The form does not submit while it is set.
|
|
94129
94261
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
94262
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
94263
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
94130
94264
|
*
|
|
94131
94265
|
* ## CSS Custom Properties
|
|
94132
94266
|
*
|
|
@@ -94357,8 +94491,6 @@ export type CustomElementsSolidJs = {
|
|
|
94357
94491
|
* with `values={[1240, 1318]}`. The attribute is the form to prefer, because
|
|
94358
94492
|
* a string is what survives React's hydration where an array property does
|
|
94359
94493
|
* not.
|
|
94360
|
-
* - `pointer`: Finds the reading a pointer or a key rests on, as it does for every
|
|
94361
|
-
* chart, so a sparkline is read the way they are. (property only) (readonly)
|
|
94362
94494
|
* - `named`: The drawing's name: an `aria-label` written on the sparkline, then `label`. (property only) (readonly)
|
|
94363
94495
|
* - `readings`: How many readings there are, which the pointer and the keys walk. (property only) (readonly)
|
|
94364
94496
|
* - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
|
|
@@ -94382,11 +94514,12 @@ export type CustomElementsSolidJs = {
|
|
|
94382
94514
|
* browser harness's awaits it alone: a browser always runs the frame, and a
|
|
94383
94515
|
* timer beside it was a bet on how long one takes, which a busy run lost. (property only) (readonly)
|
|
94384
94516
|
*
|
|
94385
|
-
* ##
|
|
94517
|
+
* ## Events
|
|
94386
94518
|
*
|
|
94387
|
-
*
|
|
94519
|
+
* Events that will be emitted by the component.
|
|
94388
94520
|
*
|
|
94389
|
-
* - `
|
|
94521
|
+
* - `helix-reading-change`: The reading shown moved, or was put away: `index` is the reading, or `-1` for none, with its row's `label` from a table and the `pointerType` that moved it.
|
|
94522
|
+
* - `helix-reading-press`: A reading was clicked, tapped, or pressed with Enter or Space, with the same detail as `helix-reading-change`.
|
|
94390
94523
|
*
|
|
94391
94524
|
* ## CSS Custom Properties
|
|
94392
94525
|
*
|
|
@@ -95871,6 +96004,8 @@ export type CustomElementsSolidJs = {
|
|
|
95871
96004
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
95872
96005
|
* string, as on a native control. The form does not submit while it is set.
|
|
95873
96006
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
96007
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
96008
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
95874
96009
|
*
|
|
95875
96010
|
* ## CSS Custom Properties
|
|
95876
96011
|
*
|
|
@@ -96909,8 +97044,9 @@ export type CustomElementsSolidJs = {
|
|
|
96909
97044
|
* - `selection-mode`/`selectionMode`: How many tags a reader can select: `single`, `multiple`, or none.
|
|
96910
97045
|
*
|
|
96911
97046
|
* Absent selects nothing, and the tags carry no selected state at all.
|
|
96912
|
-
* - `value`: The selected tags' values, separated by commas
|
|
96913
|
-
* space.
|
|
97047
|
+
* - `value`: The selected tags' values, separated by commas with no space, as Toggle
|
|
97048
|
+
* Group and Table write theirs, since a value may hold a space. A value
|
|
97049
|
+
* written with a space after each comma is read the same way.
|
|
96914
97050
|
*
|
|
96915
97051
|
* Set it to start with tags selected. A tag's value is its `value`, or its
|
|
96916
97052
|
* words where it has none.
|
|
@@ -97520,6 +97656,8 @@ export type CustomElementsSolidJs = {
|
|
|
97520
97656
|
* and shows the browser's message at the control.
|
|
97521
97657
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
97522
97658
|
* string, as on a native control. The form does not submit while it is set.
|
|
97659
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
97660
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
97523
97661
|
*
|
|
97524
97662
|
* ## CSS Custom Properties
|
|
97525
97663
|
*
|
|
@@ -97723,7 +97861,13 @@ export type CustomElementsSolidJs = {
|
|
|
97723
97861
|
* - `trigger-label`/`triggerLabel`: The name of the button that opens the list, read by screen readers.
|
|
97724
97862
|
* - `unavailable-message`/`unavailableMessage`: The message shown when `disable-times` bars a time.
|
|
97725
97863
|
* - `unreadable-message`/`unreadableMessage`: The message for text that is no time, where `bad-input-message` is not
|
|
97726
|
-
* set. `{mode}` is `single`, `range`, or `multiple`,
|
|
97864
|
+
* set. `{mode}` is `single`, `range`, or `multiple`, `{example}` is a time
|
|
97865
|
+
* written as the field writes one, `2:30 PM` in `en-US` and `14:30` in
|
|
97866
|
+
* `de-DE`, and `{shape}` is `HH:mm`, or `HH:mm:ss` with `seconds`.
|
|
97867
|
+
*
|
|
97868
|
+
* **The default names a time the field reads back.** It said "Enter a time
|
|
97869
|
+
* as HH:mm." to a reader whose field showed `2:30 PM`, and a pattern token
|
|
97870
|
+
* is words for a developer.
|
|
97727
97871
|
* - `variant`: Whether the panel shows one list of times or a column for each part of the
|
|
97728
97872
|
* time.
|
|
97729
97873
|
*
|
|
@@ -97882,6 +98026,8 @@ export type CustomElementsSolidJs = {
|
|
|
97882
98026
|
* and shows the browser's message at the control.
|
|
97883
98027
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
97884
98028
|
* string, as on a native control. The form does not submit while it is set.
|
|
98029
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
98030
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
97885
98031
|
*
|
|
97886
98032
|
* ## CSS Custom Properties
|
|
97887
98033
|
*
|
|
@@ -98337,6 +98483,8 @@ export type CustomElementsSolidJs = {
|
|
|
98337
98483
|
* and shows the browser's message at the control.
|
|
98338
98484
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
98339
98485
|
* string, as on a native control. The form does not submit while it is set.
|
|
98486
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
98487
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
98340
98488
|
*
|
|
98341
98489
|
* ## CSS Custom Properties
|
|
98342
98490
|
*
|
|
@@ -99172,6 +99320,8 @@ export type CustomElementsSolidJs = {
|
|
|
99172
99320
|
* - `setCustomValidity(message: string) => void`: Marks the control invalid with `message`, or clears that with an empty
|
|
99173
99321
|
* string, as on a native control. The form does not submit while it is set.
|
|
99174
99322
|
* - `focus(options?: FocusOptions) => void`: Moves focus to the control, as focusing a native control does.
|
|
99323
|
+
* - `formAssociatedCallback(form: HTMLFormElement | null) => void`: Called by the browser when the control's form changes: watches the new
|
|
99324
|
+
* form's `checkValidity()`, as connecting does for the form it starts in.
|
|
99175
99325
|
*
|
|
99176
99326
|
* ## CSS Custom Properties
|
|
99177
99327
|
*
|
|
@@ -100074,7 +100224,7 @@ export type CustomElementsSolidJs = {
|
|
|
100074
100224
|
*
|
|
100075
100225
|
* Areas where markup can be added to the component.
|
|
100076
100226
|
*
|
|
100077
|
-
* - `(default)`: The item's label.
|
|
100227
|
+
* - `(default)`: The item's label. A nested item does not go here: give it `slot="children"`. In a development build, an item nested here is reported.
|
|
100078
100228
|
* - `chevron`: Replaces the expand and collapse mark of a branch. A slotted icon is sized and turned like the drawn one.
|
|
100079
100229
|
* - `children`: Nested items, which make this a branch.
|
|
100080
100230
|
* - `end`: Content after the label, at the far side of the row, such as a count or a state.
|
|
@@ -102728,7 +102878,7 @@ export type CustomCssProperties = {
|
|
|
102728
102878
|
"--listbox-max-block-size"?: (string) | undefined;
|
|
102729
102879
|
/** Color of the moving arc. */
|
|
102730
102880
|
"--loader-color"?: (string) | undefined;
|
|
102731
|
-
/** How long one turn of the arc takes, 0.8s by default. With motion reduced the
|
|
102881
|
+
/** How long one turn of the arc takes, 0.8s by default. With motion reduced the arc turns once every four seconds, whatever this says. */
|
|
102732
102882
|
"--loader-duration"?: (string) | undefined;
|
|
102733
102883
|
/** Diameter. Defaults to the size token that `size` picks, which is 1.5rem at the default density. */
|
|
102734
102884
|
"--loader-size"?: (string) | undefined;
|