@fusion.dev/helix-headless 0.228.0 → 0.229.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/api.json +1 -1
- package/custom-elements.json +1 -1
- package/dist/announcement/root/announcement-root.d.ts +0 -23
- package/dist/announcement/root/announcement-root.js +0 -3
- package/dist/button-group/root/button-group-root.d.ts +2 -3
- package/dist/canvas/edge/canvas-edge.d.ts +9 -9
- package/dist/canvas/edge/canvas-edge.js +3 -3
- package/dist/canvas/node/canvas-node.d.ts +1 -1
- package/dist/canvas/node/canvas-node.js +1 -1
- package/dist/canvas/root/canvas-root.js +1 -1
- package/dist/code-block/root/code-block-root.d.ts +9 -9
- package/dist/code-block/root/code-block-root.js +4 -4
- package/dist/color-input/root/color-input-root.d.ts +7 -7
- package/dist/color-input/root/color-input-root.js +9 -9
- package/dist/filter-input/chip/filter-chip.js +1 -1
- package/dist/image/root/image-root.d.ts +3 -0
- package/dist/image/root/image-root.js +9 -6
- package/dist/list/root/list-root.d.ts +1 -1
- package/dist/list/root/list-root.js +2 -1
- package/dist/map/marker/map-marker.d.ts +1 -1
- package/dist/map/marker/map-marker.js +1 -1
- package/dist/megamenu/root/megamenu-root.d.ts +24 -24
- package/dist/megamenu/root/megamenu-root.js +4 -4
- package/dist/meter/segment/meter-segment.d.ts +0 -5
- package/dist/meter/segment/meter-segment.js +0 -3
- package/dist/navigation/root/navigation-root.d.ts +7 -7
- package/dist/navigation/root/navigation-root.js +2 -2
- package/dist/option/root/option-root.d.ts +1 -1
- package/dist/option/root/option-root.js +3 -3
- package/dist/outline/root/outline-root.d.ts +21 -21
- package/dist/outline/root/outline-root.js +6 -6
- package/dist/radio/root/radio-root.d.ts +1 -1
- package/dist/select/root/select-root.js +1 -1
- package/dist/spatial-bar-chart/root/spatial-bar-chart-root.d.ts +33 -33
- package/dist/spatial-bar-chart/root/spatial-bar-chart-root.js +5 -5
- package/dist/steps/root/steps-root.d.ts +17 -17
- package/dist/steps/root/steps-root.js +3 -3
- package/dist/switch/root/switch-root.d.ts +1 -0
- package/dist/switch/root/switch-root.js +4 -0
- package/dist/tabs/root/tabs-root.d.ts +13 -13
- package/dist/tabs/root/tabs-root.js +3 -3
- package/dist/time-input/root/time-input-root.d.ts +26 -26
- package/dist/time-input/root/time-input-root.js +10 -10
- package/dist/time-picker/root/time-picker-root.d.ts +40 -40
- package/dist/time-picker/root/time-picker-root.js +10 -10
- package/examples.json +1 -1
- package/lint.json +1 -1
- package/package.json +5 -5
- package/types/jsx.d.ts +207 -237
- package/types/vue.d.ts +159 -184
- package/types/words.d.ts +8 -1
package/types/vue.d.ts
CHANGED
|
@@ -197,27 +197,6 @@ before it in the same parent, showing when the last of them is removed.
|
|
|
197
197
|
|
|
198
198
|
Off by default, so every announcement on a page shows at once. */
|
|
199
199
|
"queued"?: HelixHeadlessAnnouncement["queued"] | undefined;
|
|
200
|
-
/** The band's color.
|
|
201
|
-
|
|
202
|
-
Paint only: unlike `Callout`, no value here draws a mark, changes the label,
|
|
203
|
-
or moves the live region off polite. `neutral` is the resting value, said
|
|
204
|
-
out loud so a consumer can put a band back to it from markup.
|
|
205
|
-
|
|
206
|
-
**The set is `Tag`'s and `Badge`'s, and now actually is.** This doc claimed
|
|
207
|
-
to match `Tag` while differing from it in both directions: it carried
|
|
208
|
-
`surface`, which `Tag` does not, and lacked `accent`, which `Tag` has. Three
|
|
209
|
-
components saying what a thing means, in three vocabularies, one of which
|
|
210
|
-
described itself as a fourth.
|
|
211
|
-
|
|
212
|
-
`accent` is the second emphasis, the second color a theme names, and the
|
|
213
|
-
brand itself until one is named. `primary` is the brand.
|
|
214
|
-
|
|
215
|
-
**`surface` was never a color and has moved to `separation`**, which is the
|
|
216
|
-
axis that owns where a box sits relative to the page. It said the band rode
|
|
217
|
-
the surface step instead of the sunken one, which is an elevation, and a
|
|
218
|
-
band can be `info` and elevated at once: two values true together are two
|
|
219
|
-
axes, which is the test the registry answers to. */
|
|
220
|
-
"tone"?: HelixHeadlessAnnouncement["tone"] | undefined;
|
|
221
200
|
/** Whether the element shows a control that dismisses it. */
|
|
222
201
|
"dismissible"?: HelixHeadlessAnnouncement["dismissible"] | undefined;
|
|
223
202
|
/** The dismiss control's label, read by screen readers.
|
|
@@ -1031,9 +1010,8 @@ it and nothing lands on the host that a consumer's markup did not have. */
|
|
|
1031
1010
|
Unset is a row and stays unset, so a reflected default cannot appear on a
|
|
1032
1011
|
host whose server output never had it.
|
|
1033
1012
|
|
|
1034
|
-
**A property and not an `auto`, which the splitter and
|
|
1035
|
-
|
|
1036
|
-
arrow keys, how many slides a page holds. A group of buttons turning is
|
|
1013
|
+
**A property and not an `auto`, which the splitter earned and this has not.**
|
|
1014
|
+
Turning a splitter changes what it *does*: a drag axis and arrow keys. A group of buttons turning is
|
|
1037
1015
|
paint, so there is no state to resolve and nothing to observe; what it needs
|
|
1038
1016
|
is for a consumer who knows the column is narrow to be able to say so.
|
|
1039
1017
|
|
|
@@ -1348,6 +1326,13 @@ the board can draw. */
|
|
|
1348
1326
|
"readonly"?: HelixHeadlessCanvasEdge["readOnly"] | undefined;
|
|
1349
1327
|
/** Prevents the connection from being removed. */
|
|
1350
1328
|
"readOnly"?: HelixHeadlessCanvasEdge["readOnly"] | undefined;
|
|
1329
|
+
/** How the line is drawn: `dashed` or `dotted`. Unset is solid.
|
|
1330
|
+
|
|
1331
|
+
**A stroke rather than an axis**, which is what the registry keeps it for:
|
|
1332
|
+
no other family draws a line whose stroke says something, and a dashed
|
|
1333
|
+
connection is the ordinary way to draw a weaker or an optional one. On the
|
|
1334
|
+
headless tier because the board that draws the line is. */
|
|
1335
|
+
"stroke"?: HelixHeadlessCanvasEdge["stroke"] | undefined;
|
|
1351
1336
|
/** The name of the card the connection ends at. */
|
|
1352
1337
|
"to"?: HelixHeadlessCanvasEdge["to"] | undefined;
|
|
1353
1338
|
/** The marker at the end of the connection. Unset is an arrow, as JSON Canvas specifies. */
|
|
@@ -1365,13 +1350,6 @@ board carries the value across from where it was written. */
|
|
|
1365
1350
|
"to-side"?: HelixHeadlessCanvasEdge["toSide"] | undefined;
|
|
1366
1351
|
/** The side of the `to` card the connection arrives at, when the document sets one. */
|
|
1367
1352
|
"toSide"?: HelixHeadlessCanvasEdge["toSide"] | undefined;
|
|
1368
|
-
/** How the line is drawn: `dashed` or `dotted`. Unset is solid.
|
|
1369
|
-
|
|
1370
|
-
**A variant rather than an axis**, which is what the registry keeps it for:
|
|
1371
|
-
no other family draws a line whose stroke says something, and a dashed
|
|
1372
|
-
connection is the ordinary way to draw a weaker or an optional one. On the
|
|
1373
|
-
headless tier because the board that draws the line is. */
|
|
1374
|
-
"variant"?: HelixHeadlessCanvasEdge["variant"] | undefined;
|
|
1375
1353
|
};
|
|
1376
1354
|
|
|
1377
1355
|
export type HelixHeadlessCanvasEdgeVueEvents = {
|
|
@@ -2826,6 +2804,12 @@ A block with no `label` is named by it, in the header and on the copy
|
|
|
2826
2804
|
button, as a docs site names a snippet by its language. Absent hands
|
|
2827
2805
|
`highlight` an empty string and names nothing. */
|
|
2828
2806
|
"language"?: HelixHeadlessCodeBlock["language"] | undefined;
|
|
2807
|
+
/** How a diff's two versions are arranged. It has no effect without `diff`.
|
|
2808
|
+
|
|
2809
|
+
Absent is unified, each removal above its replacement, which fits any
|
|
2810
|
+
width. `split` sets the old version beside the new one. Optional rather
|
|
2811
|
+
than defaulted, so the host carries no attribute the consumer did not write. */
|
|
2812
|
+
"layout"?: HelixHeadlessCodeBlock["layout"] | undefined;
|
|
2829
2813
|
/** Whether the lines are numbered in a gutter beside the code.
|
|
2830
2814
|
|
|
2831
2815
|
The numbers are hidden from the accessibility tree and are not part of a
|
|
@@ -2873,12 +2857,6 @@ diff with `context-lines`. `{count}` is how many. */
|
|
|
2873
2857
|
"show-unchanged-label"?: HelixHeadlessCodeBlock["showUnchangedLabel"] | undefined;
|
|
2874
2858
|
/** The words of a button that shows a folded run of unchanged lines, in a diff with `context-lines`. `{count}` is how many. */
|
|
2875
2859
|
"showUnchangedLabel"?: HelixHeadlessCodeBlock["showUnchangedLabel"] | undefined;
|
|
2876
|
-
/** How a diff's two versions are arranged. It has no effect without `diff`.
|
|
2877
|
-
|
|
2878
|
-
Absent is unified, each removal above its replacement, which fits any
|
|
2879
|
-
width. `split` sets the old version beside the new one. Optional rather
|
|
2880
|
-
than defaulted, so the host carries no attribute the consumer did not write. */
|
|
2881
|
-
"variant"?: HelixHeadlessCodeBlock["variant"] | undefined;
|
|
2882
2860
|
/** Whether long lines wrap. Without it they scroll.
|
|
2883
2861
|
|
|
2884
2862
|
Off by default, so long lines scroll, because a line break can be
|
|
@@ -3437,16 +3415,12 @@ Date Input and Time Input. */
|
|
|
3437
3415
|
"readOnly"?: HelixHeadlessColorInput["readOnly"] | undefined;
|
|
3438
3416
|
/** Colors offered under the picker, as a comma-separated list. */
|
|
3439
3417
|
"swatches"?: HelixHeadlessColorInput["swatches"] | undefined;
|
|
3440
|
-
/** What the swatch says in `
|
|
3418
|
+
/** What the swatch says in `trigger="swatch"`, after the field's label, once
|
|
3441
3419
|
there is a color. `{name}` is the color's name, such as "vibrant red", and
|
|
3442
3420
|
`{value}` the value as written. */
|
|
3443
3421
|
"swatch-label"?: HelixHeadlessColorInput["swatchLabel"] | undefined;
|
|
3444
|
-
/** What the swatch says in `
|
|
3422
|
+
/** What the swatch says in `trigger="swatch"`, after the field's label, once there is a color. `{name}` is the color's name, such as "vibrant red", and `{value}` the value as written. */
|
|
3445
3423
|
"swatchLabel"?: HelixHeadlessColorInput["swatchLabel"] | undefined;
|
|
3446
|
-
/** Accessible name for the control that opens the panel. */
|
|
3447
|
-
"trigger-label"?: HelixHeadlessColorInput["triggerLabel"] | undefined;
|
|
3448
|
-
/** Accessible name for the control that opens the panel. */
|
|
3449
|
-
"triggerLabel"?: HelixHeadlessColorInput["triggerLabel"] | undefined;
|
|
3450
3424
|
/** Whether the field is a text box with a swatch on it, or only the swatch.
|
|
3451
3425
|
|
|
3452
3426
|
`swatch` is the native control's shape: a block of color that opens a
|
|
@@ -3462,7 +3436,11 @@ readable and typeable exactly once, in whichever of the two is present.
|
|
|
3462
3436
|
The trade is real and is the reason this is not the default: a swatch cannot
|
|
3463
3437
|
be read or pasted into without opening the panel, which is worse for a form
|
|
3464
3438
|
where the color is the answer rather than a setting. */
|
|
3465
|
-
"
|
|
3439
|
+
"trigger"?: HelixHeadlessColorInput["trigger"] | undefined;
|
|
3440
|
+
/** Accessible name for the control that opens the panel. */
|
|
3441
|
+
"trigger-label"?: HelixHeadlessColorInput["triggerLabel"] | undefined;
|
|
3442
|
+
/** Accessible name for the control that opens the panel. */
|
|
3443
|
+
"triggerLabel"?: HelixHeadlessColorInput["triggerLabel"] | undefined;
|
|
3466
3444
|
/** Draws the panel's hue as a wheel around the square, in place of the hue
|
|
3467
3445
|
ramp. See Color Picker's `wheel`. */
|
|
3468
3446
|
"wheel"?: HelixHeadlessColorInput["wheel"] | undefined;
|
|
@@ -9314,9 +9292,9 @@ Absent is `all`. */
|
|
|
9314
9292
|
/** The old name of `empty-text`, read only where a page sets it. */
|
|
9315
9293
|
"emptyLabel"?: HelixHeadlessList["emptyLabel"] | undefined;
|
|
9316
9294
|
/** The text of the row shown while the list has no rows, where the `empty`
|
|
9317
|
-
slot is empty.
|
|
9295
|
+
slot is empty. An empty string shows no row. */
|
|
9318
9296
|
"empty-text"?: HelixHeadlessList["emptyText"] | undefined;
|
|
9319
|
-
/** The text of the row shown while the list has no rows, where the `empty` slot is empty.
|
|
9297
|
+
/** The text of the row shown while the list has no rows, where the `empty` slot is empty. An empty string shows no row. */
|
|
9320
9298
|
"emptyText"?: HelixHeadlessList["emptyText"] | undefined;
|
|
9321
9299
|
/** The kind of list, which follows from the content.
|
|
9322
9300
|
|
|
@@ -10797,6 +10775,27 @@ trigger to the panel. The attribute also takes a CSS time, such as `0.2s`. */
|
|
|
10797
10775
|
"closeDelay"?: HelixHeadlessMegamenu["closeDelay"] | `${number}` | undefined;
|
|
10798
10776
|
/** The section's name, used for the default trigger and the panel. */
|
|
10799
10777
|
"label"?: HelixHeadlessMegamenu["label"] | undefined;
|
|
10778
|
+
/** Whether the panel is a card under the trigger or a band across the page.
|
|
10779
|
+
|
|
10780
|
+
The resting one is the card, hanging off the trigger and as wide as it
|
|
10781
|
+
needs to be. `band` is the other shape navigations use: a run from edge to
|
|
10782
|
+
edge under the header, with its contents held to the page's own measure, so
|
|
10783
|
+
a set of destinations too wide to sit under one word gets the whole width
|
|
10784
|
+
to lay out in.
|
|
10785
|
+
|
|
10786
|
+
**A band and not a width, which is why the word is not `full`.** It changes
|
|
10787
|
+
where the panel goes as well as how wide it is, which is why this tier
|
|
10788
|
+
knows about it at all: a band spans the viewport, so there is nothing to
|
|
10789
|
+
measure it against and nothing to flip or shift to, and the placing pass is
|
|
10790
|
+
told not to run. Everything else the popover gives, the top layer and the
|
|
10791
|
+
dismissal, is exactly what such a band needs. `full` is the registry's word
|
|
10792
|
+
for a width, and `Button` and `Dialog` are the two families answering that
|
|
10793
|
+
question; borrowing it here would put a third meaning on it.
|
|
10794
|
+
|
|
10795
|
+
`layout` and not an axis, for the reason the registry gives: a card under
|
|
10796
|
+
a word and a band under a header are two arrangements this family has, and
|
|
10797
|
+
no other family is being asked the same question. */
|
|
10798
|
+
"layout"?: HelixHeadlessMegamenu["layout"] | undefined;
|
|
10800
10799
|
/** How long a pointer rests on the trigger before the panel opens, in
|
|
10801
10800
|
milliseconds, under `open-on="hover"`. A pointer crossing the bar on its
|
|
10802
10801
|
way somewhere else opens nothing. The attribute also takes a CSS time, such
|
|
@@ -10818,27 +10817,6 @@ heavy enough that opening it on the way past is rude. */
|
|
|
10818
10817
|
moves if that side does not fit. A band ignores it, since a band spans the
|
|
10819
10818
|
page under its bar. */
|
|
10820
10819
|
"placement"?: HelixHeadlessMegamenu["placement"] | undefined;
|
|
10821
|
-
/** Whether the panel is a card under the trigger or a band across the page.
|
|
10822
|
-
|
|
10823
|
-
The resting one is the card, hanging off the trigger and as wide as it
|
|
10824
|
-
needs to be. `band` is the other shape navigations use: a run from edge to
|
|
10825
|
-
edge under the header, with its contents held to the page's own measure, so
|
|
10826
|
-
a set of destinations too wide to sit under one word gets the whole width
|
|
10827
|
-
to lay out in.
|
|
10828
|
-
|
|
10829
|
-
**A band and not a width, which is why the word is not `full`.** It changes
|
|
10830
|
-
where the panel goes as well as how wide it is, which is why this tier
|
|
10831
|
-
knows about it at all: a band spans the viewport, so there is nothing to
|
|
10832
|
-
measure it against and nothing to flip or shift to, and the placing pass is
|
|
10833
|
-
told not to run. Everything else the popover gives, the top layer and the
|
|
10834
|
-
dismissal, is exactly what such a band needs. `full` is the registry's word
|
|
10835
|
-
for a width, and `Button` and `Dialog` are the two families answering that
|
|
10836
|
-
question; borrowing it here would put a third meaning on it.
|
|
10837
|
-
|
|
10838
|
-
`variant` and not an axis, for the reason the registry gives: a card under
|
|
10839
|
-
a word and a band under a header are two arrangements this family has, and
|
|
10840
|
-
no other family is being asked the same question. */
|
|
10841
|
-
"variant"?: HelixHeadlessMegamenu["variant"] | undefined;
|
|
10842
10820
|
/** Whether the element starts open. Ignored once `open` is written. */
|
|
10843
10821
|
"default-open"?: HelixHeadlessMegamenu["defaultOpen"] | undefined;
|
|
10844
10822
|
/** Whether the element starts open. Ignored once `open` is written. */
|
|
@@ -11292,9 +11270,6 @@ rests on it.
|
|
|
11292
11270
|
|
|
11293
11271
|
Not announced: see the note on a meter's children above. */
|
|
11294
11272
|
"label"?: HelixHeadlessMeterSegment["label"] | undefined;
|
|
11295
|
-
/** What the segment means, as it does on a callout. Takes the tone's color in
|
|
11296
|
-
place of the next color in the series. */
|
|
11297
|
-
"tone"?: HelixHeadlessMeterSegment["tone"] | undefined;
|
|
11298
11273
|
/** How much of the meter's range the segment takes, in the units of the meter's
|
|
11299
11274
|
`min` and `max`.
|
|
11300
11275
|
|
|
@@ -11343,10 +11318,6 @@ second "Main".
|
|
|
11343
11318
|
|
|
11344
11319
|
Empty by default, which leaves the name to `fallbackLabel`. */
|
|
11345
11320
|
"label"?: HelixHeadlessNavigation["label"] | undefined;
|
|
11346
|
-
/** Stacks the destinations in a column, for a sidebar, where unset is a row
|
|
11347
|
-
for a header or a footer. The marker follows the current destination down
|
|
11348
|
-
the column as it does along the row. */
|
|
11349
|
-
"orientation"?: HelixHeadlessNavigation["orientation"] | undefined;
|
|
11350
11321
|
/** How the destinations are drawn, with `Tabs`' three values and for the same
|
|
11351
11322
|
reasons.
|
|
11352
11323
|
|
|
@@ -11366,7 +11337,11 @@ column's inline end.
|
|
|
11366
11337
|
|
|
11367
11338
|
Reflected and left unset by default, so the host carries nothing a
|
|
11368
11339
|
consumer's server markup does not already have. */
|
|
11369
|
-
"
|
|
11340
|
+
"marker"?: HelixHeadlessNavigation["marker"] | undefined;
|
|
11341
|
+
/** Stacks the destinations in a column, for a sidebar, where unset is a row
|
|
11342
|
+
for a header or a footer. The marker follows the current destination down
|
|
11343
|
+
the column as it does along the row. */
|
|
11344
|
+
"orientation"?: HelixHeadlessNavigation["orientation"] | undefined;
|
|
11370
11345
|
};
|
|
11371
11346
|
|
|
11372
11347
|
export type HelixHeadlessNavigationVueEvents = {
|
|
@@ -12188,6 +12163,15 @@ slot names it in place of this.
|
|
|
12188
12163
|
|
|
12189
12164
|
Empty by default, which leaves the name to `fallbackLabel`. */
|
|
12190
12165
|
"label"?: HelixHeadlessOutline["label"] | undefined;
|
|
12166
|
+
/** The rail form: a slim column of ticks, one per link, that opens on hover,
|
|
12167
|
+
focus, or a tap into a surface holding the links.
|
|
12168
|
+
|
|
12169
|
+
A marker because no registered axis (emphasis, material, nesting,
|
|
12170
|
+
orientation, separation, shape, size, tone, width) has a value for it, and
|
|
12171
|
+
a rail is an arrangement of this family alone, as Megamenu's
|
|
12172
|
+
`marker="band"` is. It has no default: the outline without it is the list
|
|
12173
|
+
of links. */
|
|
12174
|
+
"marker"?: HelixHeadlessOutline["marker"] | undefined;
|
|
12191
12175
|
/** Which links are marked. `reading` marks the one section being read, the
|
|
12192
12176
|
last whose heading has passed the reading line. `visible` marks every
|
|
12193
12177
|
section with part of it on screen, and the mark runs across their links. */
|
|
@@ -12200,15 +12184,6 @@ The reading line. A page with a sticky masthead sets this to its height, or
|
|
|
12200
12184
|
a little more: without it the current section changes as a heading slides
|
|
12201
12185
|
under the chrome rather than as it reaches the top of what can be seen. */
|
|
12202
12186
|
"offset"?: HelixHeadlessOutline["offset"] | undefined;
|
|
12203
|
-
/** The rail form: a slim column of ticks, one per link, that opens on hover,
|
|
12204
|
-
focus, or a tap into a surface holding the links.
|
|
12205
|
-
|
|
12206
|
-
A variant because no registered axis (emphasis, material, nesting,
|
|
12207
|
-
orientation, separation, shape, size, tone, width) has a value for it, and
|
|
12208
|
-
a rail is an arrangement of this family alone, as Megamenu's
|
|
12209
|
-
`variant="band"` is. It has no default: the outline without it is the list
|
|
12210
|
-
of links. */
|
|
12211
|
-
"variant"?: HelixHeadlessOutline["variant"] | undefined;
|
|
12212
12187
|
};
|
|
12213
12188
|
|
|
12214
12189
|
export type HelixHeadlessOutlineVueEvents = {
|
|
@@ -14130,6 +14105,38 @@ height. */
|
|
|
14130
14105
|
"grow-again"?: HelixHeadlessSpatialBarChart["growAgain"] | undefined;
|
|
14131
14106
|
/** Grows the bars again each time the chart comes back into view after it left it, as a pane does when it is opened again, where `grow` alone grows them the first time only. Only a chart that grows takes it. */
|
|
14132
14107
|
"growAgain"?: HelixHeadlessSpatialBarChart["growAgain"] | undefined;
|
|
14108
|
+
/** How the bars stand.
|
|
14109
|
+
|
|
14110
|
+
Unset, they stand on a grid of categories across and series in depth,
|
|
14111
|
+
in a box the camera looks at from a corner, so the grid recedes at an
|
|
14112
|
+
angle. `row` lays the categories in a straight line across the page and
|
|
14113
|
+
turns each bar to the camera, showing its top and two sides, for one row
|
|
14114
|
+
of readings in a small space such as a pane: turning the view turns each
|
|
14115
|
+
bar where it stands, and the row stays level. It is the chart's own
|
|
14116
|
+
drawing that lays the row: a renderer connected through
|
|
14117
|
+
`@fusion.dev/helix-plot` stands the bars on the grid.
|
|
14118
|
+
|
|
14119
|
+
`diagonal` is the same row climbing to the right as it recedes, each
|
|
14120
|
+
place a step further back than the one before, as a row of days on a
|
|
14121
|
+
product's page is drawn: the row rises one part in five across the page
|
|
14122
|
+
from any turn, and its floor and names climb with it. A row whose bars
|
|
14123
|
+
have a size climbs at most a quarter of the plot's height, so the bars
|
|
14124
|
+
of a long row keep theirs.
|
|
14125
|
+
|
|
14126
|
+
**A row draws its floor in place of a box**: each place as an outline a
|
|
14127
|
+
little wider than its bar, and each category's name under it, as many
|
|
14128
|
+
names as fit without touching. A name whose bar names a tone is written
|
|
14129
|
+
first, in that tone. `no-box` leaves the floor and the names out.
|
|
14130
|
+
|
|
14131
|
+
**A `column-gap` on the `fallback` part gives a row's bars one width**,
|
|
14132
|
+
which the styled tier sets from `--spatial-bar-chart-bar-size`: one bar
|
|
14133
|
+
stands as wide as each of twenty, the row is as long as its bars and
|
|
14134
|
+
centered, the tallest bar stands as high as the plot has room for and
|
|
14135
|
+
no taller than the row is long and a quarter again, so one bar stands
|
|
14136
|
+
as a block, and `fits` says how many bars the plot holds, so a page
|
|
14137
|
+
can give it the latest of a longer table. It is read when the plot's
|
|
14138
|
+
size changes. */
|
|
14139
|
+
"layout"?: HelixHeadlessSpatialBarChart["layout"] | undefined;
|
|
14133
14140
|
/** Draws no box: no edges, grid, numbers, or names, and in a `row` no
|
|
14134
14141
|
floor, so the readings stand alone and fill the plot, as a picture on a
|
|
14135
14142
|
product's own page does. The
|
|
@@ -14162,38 +14169,6 @@ and `{low}` and `{high}` the lowest and the highest value. */
|
|
|
14162
14169
|
"summary-label"?: HelixHeadlessSpatialBarChart["summaryLabel"] | undefined;
|
|
14163
14170
|
/** The `summary` part's sentence. `{count}`, `{series}`, and `{categories}` are the number of bars, series, and categories, written in the locale, and `{low}` and `{high}` the lowest and the highest value. */
|
|
14164
14171
|
"summaryLabel"?: HelixHeadlessSpatialBarChart["summaryLabel"] | undefined;
|
|
14165
|
-
/** How the bars stand.
|
|
14166
|
-
|
|
14167
|
-
Unset, they stand on a grid of categories across and series in depth,
|
|
14168
|
-
in a box the camera looks at from a corner, so the grid recedes at an
|
|
14169
|
-
angle. `row` lays the categories in a straight line across the page and
|
|
14170
|
-
turns each bar to the camera, showing its top and two sides, for one row
|
|
14171
|
-
of readings in a small space such as a pane: turning the view turns each
|
|
14172
|
-
bar where it stands, and the row stays level. It is the chart's own
|
|
14173
|
-
drawing that lays the row: a renderer connected through
|
|
14174
|
-
`@fusion.dev/helix-plot` stands the bars on the grid.
|
|
14175
|
-
|
|
14176
|
-
`diagonal` is the same row climbing to the right as it recedes, each
|
|
14177
|
-
place a step further back than the one before, as a row of days on a
|
|
14178
|
-
product's page is drawn: the row rises one part in five across the page
|
|
14179
|
-
from any turn, and its floor and names climb with it. A row whose bars
|
|
14180
|
-
have a size climbs at most a quarter of the plot's height, so the bars
|
|
14181
|
-
of a long row keep theirs.
|
|
14182
|
-
|
|
14183
|
-
**A row draws its floor in place of a box**: each place as an outline a
|
|
14184
|
-
little wider than its bar, and each category's name under it, as many
|
|
14185
|
-
names as fit without touching. A name whose bar names a tone is written
|
|
14186
|
-
first, in that tone. `no-box` leaves the floor and the names out.
|
|
14187
|
-
|
|
14188
|
-
**A `column-gap` on the `fallback` part gives a row's bars one width**,
|
|
14189
|
-
which the styled tier sets from `--spatial-bar-chart-bar-size`: one bar
|
|
14190
|
-
stands as wide as each of twenty, the row is as long as its bars and
|
|
14191
|
-
centered, the tallest bar stands as high as the plot has room for and
|
|
14192
|
-
no taller than the row is long and a quarter again, so one bar stands
|
|
14193
|
-
as a block, and `fits` says how many bars the plot holds, so a page
|
|
14194
|
-
can give it the latest of a longer table. It is read when the plot's
|
|
14195
|
-
size changes. */
|
|
14196
|
-
"variant"?: HelixHeadlessSpatialBarChart["variant"] | undefined;
|
|
14197
14172
|
/** The words shown in place of the drawing when the table has no readings,
|
|
14198
14173
|
and the fallback of the `empty` slot. */
|
|
14199
14174
|
"empty-text"?: HelixHeadlessSpatialBarChart["emptyText"] | undefined;
|
|
@@ -15609,6 +15584,17 @@ Empty by default, which leaves the name to `fallbackLabel`. */
|
|
|
15609
15584
|
/** Whether a reader has to finish each stage, or pass an `optional` one,
|
|
15610
15585
|
before going on to the next. */
|
|
15611
15586
|
"linear"?: HelixHeadlessSteps["linear"] | undefined;
|
|
15587
|
+
/** What each step is marked with.
|
|
15588
|
+
|
|
15589
|
+
Absent is the state itself: a check where a stage is done, a target where
|
|
15590
|
+
the reader is, an empty ring ahead of them. Three marks that need no
|
|
15591
|
+
legend, which a number does: "3" says where a stage sits in the order and
|
|
15592
|
+
nothing about whether it is finished.
|
|
15593
|
+
|
|
15594
|
+
`numeric` is the older convention and is still the right one where the
|
|
15595
|
+
order is the point, a form that says "step 3 of 5" beside it, or a sequence
|
|
15596
|
+
a reader is told to come back to by number. */
|
|
15597
|
+
"marker"?: HelixHeadlessSteps["marker"] | undefined;
|
|
15612
15598
|
/** Which way the steps run.
|
|
15613
15599
|
|
|
15614
15600
|
Absent is a row, which is what a form header wants, with each name under
|
|
@@ -15628,17 +15614,6 @@ number, for a sentence that places the sign itself. */
|
|
|
15628
15614
|
"progress-label"?: HelixHeadlessSteps["progressLabel"] | undefined;
|
|
15629
15615
|
/** What the `progress` part says to a screen reader. `{share, number, percent}` writes `progress` as a percentage the way the locale writes one, such as `40%`, or `40 %` in French. `{percent}` is `progress` as a whole number, for a sentence that places the sign itself. */
|
|
15630
15616
|
"progressLabel"?: HelixHeadlessSteps["progressLabel"] | undefined;
|
|
15631
|
-
/** What each step is marked with.
|
|
15632
|
-
|
|
15633
|
-
Absent is the state itself: a check where a stage is done, a target where
|
|
15634
|
-
the reader is, an empty ring ahead of them. Three marks that need no
|
|
15635
|
-
legend, which a number does: "3" says where a stage sits in the order and
|
|
15636
|
-
nothing about whether it is finished.
|
|
15637
|
-
|
|
15638
|
-
`numeric` is the older convention and is still the right one where the
|
|
15639
|
-
order is the point, a form that says "step 3 of 5" beside it, or a sequence
|
|
15640
|
-
a reader is told to come back to by number. */
|
|
15641
|
-
"variant"?: HelixHeadlessSteps["variant"] | undefined;
|
|
15642
15617
|
/** The `value` of the current item.
|
|
15643
15618
|
|
|
15644
15619
|
Not `option.active`, which is the option the keyboard is on: that is a
|
|
@@ -16306,16 +16281,6 @@ Automatic is the default because showing a panel is usually cheap. Set this
|
|
|
16306
16281
|
where it is not, so a reader arrowing past four tabs does not load four
|
|
16307
16282
|
panels on the way. */
|
|
16308
16283
|
"manual"?: HelixHeadlessTabs["manual"] | undefined;
|
|
16309
|
-
/** The direction the tabs run. `vertical` sets them in a column beside the
|
|
16310
|
-
panels and tells a screen reader the list is vertical.
|
|
16311
|
-
|
|
16312
|
-
Optional, so the resting row writes no attribute onto the host. */
|
|
16313
|
-
"orientation"?: HelixHeadlessTabs["orientation"] | undefined;
|
|
16314
|
-
/** Whether a strip with more tabs than fit shows a button at each end it can
|
|
16315
|
-
scroll toward. */
|
|
16316
|
-
"scroll-controls"?: HelixHeadlessTabs["scrollControls"] | undefined;
|
|
16317
|
-
/** Whether a strip with more tabs than fit shows a button at each end it can scroll toward. */
|
|
16318
|
-
"scrollControls"?: HelixHeadlessTabs["scrollControls"] | undefined;
|
|
16319
16284
|
/** How the row of tabs is drawn.
|
|
16320
16285
|
|
|
16321
16286
|
Unset is a raised pill on the selected tab with nothing behind the row,
|
|
@@ -16338,7 +16303,17 @@ away.
|
|
|
16338
16303
|
|
|
16339
16304
|
Reflected and left unset by default, so the host carries nothing a
|
|
16340
16305
|
consumer's server markup does not already have. */
|
|
16341
|
-
"
|
|
16306
|
+
"marker"?: HelixHeadlessTabs["marker"] | undefined;
|
|
16307
|
+
/** The direction the tabs run. `vertical` sets them in a column beside the
|
|
16308
|
+
panels and tells a screen reader the list is vertical.
|
|
16309
|
+
|
|
16310
|
+
Optional, so the resting row writes no attribute onto the host. */
|
|
16311
|
+
"orientation"?: HelixHeadlessTabs["orientation"] | undefined;
|
|
16312
|
+
/** Whether a strip with more tabs than fit shows a button at each end it can
|
|
16313
|
+
scroll toward. */
|
|
16314
|
+
"scroll-controls"?: HelixHeadlessTabs["scrollControls"] | undefined;
|
|
16315
|
+
/** Whether a strip with more tabs than fit shows a button at each end it can scroll toward. */
|
|
16316
|
+
"scrollControls"?: HelixHeadlessTabs["scrollControls"] | undefined;
|
|
16342
16317
|
/** The `value` of the current item.
|
|
16343
16318
|
|
|
16344
16319
|
Not `option.active`, which is the option the keyboard is on: that is a
|
|
@@ -16973,6 +16948,21 @@ on why a wheel cannot do either. */
|
|
|
16973
16948
|
"now-label"?: HelixHeadlessTimeInput["nowLabel"] | undefined;
|
|
16974
16949
|
/** The words on the list's button that chooses the current time, drawn with `show-now`. */
|
|
16975
16950
|
"nowLabel"?: HelixHeadlessTimeInput["nowLabel"] | undefined;
|
|
16951
|
+
/** Whether the panel shows one list of times or a column for each part of the
|
|
16952
|
+
time.
|
|
16953
|
+
|
|
16954
|
+
`list` offers whole times, which is what a product with slots or opening
|
|
16955
|
+
hours has. `wheels` splits them into an hour, a minute and a meridiem where
|
|
16956
|
+
the locale uses one, which is the only way to reach `23:45` without
|
|
16957
|
+
scrolling most of a day. `TimePicker` carries the longer note on the trade.
|
|
16958
|
+
|
|
16959
|
+
**Optional rather than defaulted, which is not a style preference.** A
|
|
16960
|
+
reflecting property with a default writes its attribute onto every host the
|
|
16961
|
+
moment the element upgrades, including the ones a consumer rendered and did
|
|
16962
|
+
not touch, and React reads that as a hydration mismatch. The absent
|
|
16963
|
+
attribute *is* the list, which the stylesheet reads as the base rule, so
|
|
16964
|
+
only the departure has to be named. */
|
|
16965
|
+
"picker"?: HelixHeadlessTimeInput["picker"] | undefined;
|
|
16976
16966
|
/** Placeholder text shown before a time is entered. */
|
|
16977
16967
|
"placeholder"?: HelixHeadlessTimeInput["placeholder"] | undefined;
|
|
16978
16968
|
/** The message shown when a range holds more than two times.
|
|
@@ -17042,21 +17032,6 @@ is words for a developer. */
|
|
|
17042
17032
|
"unreadable-message"?: HelixHeadlessTimeInput["unreadableMessage"] | undefined;
|
|
17043
17033
|
/** The message for text that is no time, where `bad-input-message` is not set. `{mode}` is `single`, `range`, or `multiple`, `{example}` is a time written as the field writes one, `2:30 PM` in `en-US` and `14:30` in `de-DE`, and `{shape}` is `HH:mm`, or `HH:mm:ss` with `seconds`. */
|
|
17044
17034
|
"unreadableMessage"?: HelixHeadlessTimeInput["unreadableMessage"] | undefined;
|
|
17045
|
-
/** Whether the panel shows one list of times or a column for each part of the
|
|
17046
|
-
time.
|
|
17047
|
-
|
|
17048
|
-
`list` offers whole times, which is what a product with slots or opening
|
|
17049
|
-
hours has. `wheels` splits them into an hour, a minute and a meridiem where
|
|
17050
|
-
the locale uses one, which is the only way to reach `23:45` without
|
|
17051
|
-
scrolling most of a day. `TimePicker` carries the longer note on the trade.
|
|
17052
|
-
|
|
17053
|
-
**Optional rather than defaulted, which is not a style preference.** A
|
|
17054
|
-
reflecting property with a default writes its attribute onto every host the
|
|
17055
|
-
moment the element upgrades, including the ones a consumer rendered and did
|
|
17056
|
-
not touch, and React reads that as a hydration mismatch. The absent
|
|
17057
|
-
attribute *is* the list, which the stylesheet reads as the base rule, so
|
|
17058
|
-
only the departure has to be named. */
|
|
17059
|
-
"variant"?: HelixHeadlessTimeInput["variant"] | undefined;
|
|
17060
17035
|
/** What a row of segments reports when the field is required and every
|
|
17061
17036
|
segment is empty, where `value-missing-message` is not set. `{kind}` is
|
|
17062
17037
|
`date` or `time`. */
|
|
@@ -17375,7 +17350,7 @@ behavior and a reader who has met one has met both. The alternative, a
|
|
|
17375
17350
|
separate "from" and "to" control, is two answers to what a product asks as
|
|
17376
17351
|
one, and it makes the between part impossible to show.
|
|
17377
17352
|
|
|
17378
|
-
**Neither works on wheels and the
|
|
17353
|
+
**Neither works on wheels and the picker falls back.** A range on
|
|
17379
17354
|
wheels is two sets of wheels, which is two controls; a multiple is a set,
|
|
17380
17355
|
and a wheel has exactly one value by construction. Rather than draw
|
|
17381
17356
|
something that cannot say what it holds, `wheels` renders as a list
|
|
@@ -17386,6 +17361,32 @@ whenever a mode is set. */
|
|
|
17386
17361
|
"now-label"?: HelixHeadlessTimePicker["nowLabel"] | undefined;
|
|
17387
17362
|
/** The words on the button that chooses the current time, drawn with `show-now`. */
|
|
17388
17363
|
"nowLabel"?: HelixHeadlessTimePicker["nowLabel"] | undefined;
|
|
17364
|
+
/** Shows the times as one `list`, or as `wheels` with a column for each part
|
|
17365
|
+
of the time.
|
|
17366
|
+
|
|
17367
|
+
`list` is the default and offers whole times, which is what a product with
|
|
17368
|
+
opening hours or slots actually has. `wheels` splits them into an hour, a
|
|
17369
|
+
minute and, where the locale uses one, a meridiem: three short columns
|
|
17370
|
+
instead of ninety-six rows, and the only way to reach `23:45` without
|
|
17371
|
+
scrolling most of a day.
|
|
17372
|
+
|
|
17373
|
+
The trade is that a wheel cannot say which *combinations* are on offer. A
|
|
17374
|
+
list of half hours from nine to five is seventeen rows and every one of them
|
|
17375
|
+
is a time the product has; the same thing as columns is an hour column and a
|
|
17376
|
+
minute column, and nothing in either says the two are only valid together.
|
|
17377
|
+
The bounds are still enforced, so a reader can be refused after the fact,
|
|
17378
|
+
which is worse than not being offered it.
|
|
17379
|
+
|
|
17380
|
+
So: `list` where the set is the point, `wheels` where any time is allowed
|
|
17381
|
+
and the range is a whole day.
|
|
17382
|
+
|
|
17383
|
+
**Optional rather than defaulted, which is not a style preference.** A
|
|
17384
|
+
reflecting property with a default writes its attribute onto every host the
|
|
17385
|
+
moment the element upgrades, including the ones a consumer rendered and did
|
|
17386
|
+
not touch, and React reads that as a hydration mismatch. The absent
|
|
17387
|
+
attribute *is* the list, which the stylesheet reads as the base rule, so
|
|
17388
|
+
only the departure has to be named. */
|
|
17389
|
+
"picker"?: HelixHeadlessTimePicker["picker"] | undefined;
|
|
17389
17390
|
/** The validation message for a time after `max`. `{max}` is replaced with
|
|
17390
17391
|
`max`, written in `locale`. */
|
|
17391
17392
|
"range-overflow-message"?: HelixHeadlessTimePicker["rangeOverflowMessage"] | undefined;
|
|
@@ -17456,32 +17457,6 @@ Anything under five is a thousand rows and wants a field instead. */
|
|
|
17456
17457
|
"value-missing-message"?: HelixHeadlessTimePicker["valueMissingMessage"] | undefined;
|
|
17457
17458
|
/** The validation message for a required time picker with no time chosen. */
|
|
17458
17459
|
"valueMissingMessage"?: HelixHeadlessTimePicker["valueMissingMessage"] | undefined;
|
|
17459
|
-
/** Shows the times as one `list`, or as `wheels` with a column for each part
|
|
17460
|
-
of the time.
|
|
17461
|
-
|
|
17462
|
-
`list` is the default and offers whole times, which is what a product with
|
|
17463
|
-
opening hours or slots actually has. `wheels` splits them into an hour, a
|
|
17464
|
-
minute and, where the locale uses one, a meridiem: three short columns
|
|
17465
|
-
instead of ninety-six rows, and the only way to reach `23:45` without
|
|
17466
|
-
scrolling most of a day.
|
|
17467
|
-
|
|
17468
|
-
The trade is that a wheel cannot say which *combinations* are on offer. A
|
|
17469
|
-
list of half hours from nine to five is seventeen rows and every one of them
|
|
17470
|
-
is a time the product has; the same thing as columns is an hour column and a
|
|
17471
|
-
minute column, and nothing in either says the two are only valid together.
|
|
17472
|
-
The bounds are still enforced, so a reader can be refused after the fact,
|
|
17473
|
-
which is worse than not being offered it.
|
|
17474
|
-
|
|
17475
|
-
So: `list` where the set is the point, `wheels` where any time is allowed
|
|
17476
|
-
and the range is a whole day.
|
|
17477
|
-
|
|
17478
|
-
**Optional rather than defaulted, which is not a style preference.** A
|
|
17479
|
-
reflecting property with a default writes its attribute onto every host the
|
|
17480
|
-
moment the element upgrades, including the ones a consumer rendered and did
|
|
17481
|
-
not touch, and React reads that as a hydration mismatch. The absent
|
|
17482
|
-
attribute *is* the list, which the stylesheet reads as the base rule, so
|
|
17483
|
-
only the departure has to be named. */
|
|
17484
|
-
"variant"?: HelixHeadlessTimePicker["variant"] | undefined;
|
|
17485
17460
|
/** A message under the picker, such as what is wrong with the answer.
|
|
17486
17461
|
|
|
17487
17462
|
While set, the picker is invalid and does not submit, as a field's
|
|
@@ -20887,7 +20862,7 @@ export interface HelixVueGlobalComponents {
|
|
|
20887
20862
|
* depend on color. Where a removed line is paired with the added line that
|
|
20888
20863
|
* replaced it, the words each does not share with the other are the `changed`
|
|
20889
20864
|
* part, so the eye goes to what changed within the line. Each file in the patch is its own block under its own name,
|
|
20890
|
-
* and its copy button copies the new version of the file. `
|
|
20865
|
+
* and its copy button copies the new version of the file. `layout="split"`
|
|
20891
20866
|
* shows the old version beside the new, each removal opposite its replacement.
|
|
20892
20867
|
* `context-lines` folds each long run of unchanged lines, keeping that many
|
|
20893
20868
|
* beside each change, behind a button that shows them and hides them again,
|
|
@@ -24052,7 +24027,7 @@ export interface HelixVueGlobalComponents {
|
|
|
24052
24027
|
* marked, so `a[aria-current]` and `a[data-depth="2"]` are the hooks for a
|
|
24053
24028
|
* rule of yours.
|
|
24054
24029
|
*
|
|
24055
|
-
* **The rail.** `
|
|
24030
|
+
* **The rail.** `marker="rail"` draws a slim column of ticks at the edge of a
|
|
24056
24031
|
* long scroll, one per link, with the section in view drawn longer and a deeper
|
|
24057
24032
|
* level shorter. Hovering or focusing the rail opens a surface holding the
|
|
24058
24033
|
* links, each on one line, and Escape closes it. A tap opens it too, and it stays
|
|
@@ -25920,7 +25895,7 @@ export interface HelixVueGlobalComponents {
|
|
|
25920
25895
|
* with `aria-haspopup="dialog"`, `aria-expanded`, and `aria-controls`, since
|
|
25921
25896
|
* Down opens the list from it. In the list, the arrow keys, typed digits and PageUp and PageDown
|
|
25922
25897
|
* move through the times, and Enter, Space or a click chooses one and closes
|
|
25923
|
-
* the panel. With `
|
|
25898
|
+
* the panel. With `picker="wheels"` each wheel moves the time as you turn it,
|
|
25924
25899
|
* the panel stays open, and Enter or Escape closes it.
|
|
25925
25900
|
*
|
|
25926
25901
|
* With `segmented`, the field is a row of segments in place of the text: an
|
|
@@ -25955,7 +25930,7 @@ export interface HelixVueGlobalComponents {
|
|
|
25955
25930
|
/**
|
|
25956
25931
|
* Shows the times at each `step` as a `Listbox`, which provides the keyboard
|
|
25957
25932
|
* behavior, typeahead, scrolling into view, and announcements for a set of
|
|
25958
|
-
* options. `
|
|
25933
|
+
* options. `picker="wheels"` shows a column each for the hour, the minute, and
|
|
25959
25934
|
* the meridiem, and one for the second with `seconds`. Left and Right move
|
|
25960
25935
|
* between the wheels, and Tab does too.
|
|
25961
25936
|
*
|
package/types/words.d.ts
CHANGED
|
@@ -959,7 +959,7 @@ declare module '@fusion.dev/helix-core' {
|
|
|
959
959
|
}
|
|
960
960
|
'helix-color-input': {
|
|
961
961
|
/**
|
|
962
|
-
* What the swatch says in `
|
|
962
|
+
* What the swatch says in `trigger="swatch"`, after the field's label, once
|
|
963
963
|
* there is a color. `{name}` is the color's name, such as "vibrant red", and
|
|
964
964
|
* `{value}` the value as written.
|
|
965
965
|
*
|
|
@@ -2846,6 +2846,13 @@ declare module '@fusion.dev/helix-core' {
|
|
|
2846
2846
|
* English: `Dropped`
|
|
2847
2847
|
*/
|
|
2848
2848
|
droppedLabel: Message
|
|
2849
|
+
/**
|
|
2850
|
+
* The text of the row shown while the list has no rows, where the `empty`
|
|
2851
|
+
* slot is empty. An empty string shows no row.
|
|
2852
|
+
*
|
|
2853
|
+
* English: `No items`
|
|
2854
|
+
*/
|
|
2855
|
+
emptyText: Message
|
|
2849
2856
|
/**
|
|
2850
2857
|
* The text of the row drawn while `loading` is set, where the `loading` slot is empty.
|
|
2851
2858
|
*
|