@fusion.dev/helix-headless 0.149.1 → 0.151.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/custom-elements.json +1211 -110
- package/dist/area-chart/root/area-chart-root.d.ts +36 -0
- package/dist/area-chart/root/area-chart-root.js +17 -2
- package/dist/bar-chart/root/bar-chart-root.d.ts +28 -4
- package/dist/bar-chart/root/bar-chart-root.js +17 -4
- package/dist/button/root/button-root.d.ts +5 -0
- package/dist/button/root/button-root.js +3 -0
- package/dist/callout/root/callout-root.d.ts +20 -0
- package/dist/callout/root/callout-root.js +19 -4
- package/dist/chat/composer/chat-composer.d.ts +30 -0
- package/dist/chat/composer/chat-composer.js +47 -2
- package/dist/chat/root/chat-root.d.ts +10 -0
- package/dist/chat/root/chat-root.js +14 -0
- package/dist/color-input/root/color-input-root.d.ts +1 -0
- package/dist/color-picker/root/color-picker-root.js +1 -0
- package/dist/combobox/root/combobox-root.d.ts +12 -1
- package/dist/combobox/root/combobox-root.js +8 -0
- package/dist/copy-button/root/copy-button-root.d.ts +4 -3
- package/dist/copy-button/root/copy-button-root.js +5 -1
- package/dist/data-table/root/data-table-root.d.ts +34 -2
- package/dist/data-table/root/data-table-root.js +63 -2
- package/dist/date-input/root/date-input-root.d.ts +1 -0
- package/dist/divider/root/divider-root.d.ts +8 -6
- package/dist/divider/root/divider-root.js +10 -2
- package/dist/element-events.generated.js +5 -1
- package/dist/filter-input/chip/filter-chip.d.ts +2 -1
- package/dist/filter-input/root/filter-input-root.d.ts +5 -0
- package/dist/filter-input/root/filter-input-root.js +7 -0
- package/dist/kbd/root/kbd-root.d.ts +7 -1
- package/dist/kbd/root/kbd-root.js +8 -4
- package/dist/line-chart/root/line-chart-root.d.ts +36 -0
- package/dist/line-chart/root/line-chart-root.js +15 -2
- package/dist/number-input/root/number-input-root.d.ts +6 -0
- package/dist/number-input/root/number-input-root.js +14 -3
- package/dist/option/root/option-root.d.ts +17 -8
- package/dist/option/root/option-root.js +18 -4
- package/dist/radio/group/radio-group.d.ts +8 -1
- package/dist/radio/group/radio-group.js +15 -1
- package/dist/scatter-chart/root/scatter-chart-root.d.ts +18 -0
- package/dist/scatter-chart/root/scatter-chart-root.js +38 -15
- package/dist/slider/root/slider-root.d.ts +8 -0
- package/dist/slider/root/slider-root.js +6 -3
- package/dist/table/column/table-column.js +3 -2
- package/dist/table/grid-controller.d.ts +14 -2
- package/dist/table/grid-controller.js +27 -1
- package/dist/table/root/table-root.d.ts +30 -4
- package/dist/table/root/table-root.js +45 -7
- package/dist/table/row/table-row.d.ts +12 -2
- package/dist/table/row/table-row.js +8 -2
- package/dist/tag/group/tag-group.d.ts +22 -1
- package/dist/tag/group/tag-group.js +63 -3
- package/dist/tag/root/tag-root.d.ts +9 -0
- package/dist/tag/root/tag-root.js +5 -1
- package/dist/time-input/root/time-input-root.d.ts +1 -0
- package/dist/toggle/group/toggle-group.d.ts +6 -0
- package/dist/toggle/group/toggle-group.js +16 -1
- package/dist/toggle/root/toggle-root.d.ts +21 -3
- package/dist/toggle/root/toggle-root.js +22 -5
- package/dist/video/root/video-root.d.ts +6 -0
- package/dist/video/root/video-root.js +5 -1
- package/dist/video-playlist/root/video-playlist-root.d.ts +4 -0
- package/dist/video-playlist/root/video-playlist-root.js +4 -1
- package/dist/virtual-list/root/virtual-list-root.d.ts +23 -1
- package/dist/virtual-list/root/virtual-list-root.js +21 -2
- package/lint.json +1 -1
- package/package.json +5 -5
- package/types/jsx.d.ts +808 -156
- package/types/vue.d.ts +223 -59
- package/types/words.d.ts +4 -2
package/custom-elements.json
CHANGED
|
@@ -2908,13 +2908,23 @@
|
|
|
2908
2908
|
"declarations": [
|
|
2909
2909
|
{
|
|
2910
2910
|
"kind": "class",
|
|
2911
|
-
"description": "Shows how a total is made up. Each numeric column of the table is a part, the\nparts add up to the total at each reading, and the top edge is that total.\nThe thickness of a band is that part's amount.\n\nUse `LineChart` with `area` to show how each series moved: it fills each\nseries from the floor separately, so the fills overlap. Use this chart to\nshow the composition: it stacks the series.\n\n**The value axis always starts at zero**, as in `BarChart`, because a band's\nthickness is its value. For the same reason there is no streamgraph mode,\nwhich moves the baseline. To show how the composition changed, set `share`.\n\nBand edges are straight between readings by default. A smoothed curve through\none sum can dip below the curve through the sum beneath it, which draws a\npart as less than zero. Other curves:\n\n- `curve=\"smooth\"`: for a stack read as an overall shape.\n- `curve=\"step\"`: holds each reading and jumps at the midpoint, so stacked\n edges stay in order, as with `straight`. Use it for a quantity that changes\n at a moment, such as a headcount or a price.\n\n`share` draws each reading as 100 percent, so the top edge is flat and the\nbands show each part's share. Use it to see which part grew. The default\nshows whether the total grew.\n\n`overlap` draws every band from zero, one in front of another, so each\npart's own amount is its height: the first column is in front. Use it to\ncompare the parts with each other; the scale then fits the largest part\nrather than the total.\n\nThe drawing is hidden from screen readers. The text summary gives the latest\nreading's total and each part's share of it, and the table beside the chart\nhas every number.\n\n**The plot is read by key.** It takes focus, named by `label` or the caption.\nThe left and right arrows move from reading to reading, Home and End go to\nthe first and the last, and the up and down arrows move among the series of\na reading. The tooltip follows, the `live` part says the reading in words,\nand Escape puts the tooltip away.\n\nEvery numeric column is a part, so leave a total column out of the table the\nchart reads, or it is counted twice. A negative reading is drawn as zero.",
|
|
2911
|
+
"description": "Shows how a total is made up. Each numeric column of the table is a part, the\nparts add up to the total at each reading, and the top edge is that total.\nThe thickness of a band is that part's amount.\n\nUse `LineChart` with `area` to show how each series moved: it fills each\nseries from the floor separately, so the fills overlap. Use this chart to\nshow the composition: it stacks the series.\n\n**The value axis always starts at zero**, as in `BarChart`, because a band's\nthickness is its value. For the same reason there is no streamgraph mode,\nwhich moves the baseline. To show how the composition changed, set `share`.\n\nBand edges are straight between readings by default. A smoothed curve through\none sum can dip below the curve through the sum beneath it, which draws a\npart as less than zero. Other curves:\n\n- `curve=\"smooth\"`: for a stack read as an overall shape.\n- `curve=\"step\"`: holds each reading and jumps at the midpoint, so stacked\n edges stay in order, as with `straight`. Use it for a quantity that changes\n at a moment, such as a headcount or a price.\n\n`share` draws each reading as 100 percent, so the top edge is flat and the\nbands show each part's share. Use it to see which part grew. The default\nshows whether the total grew.\n\n`overlap` draws every band from zero, one in front of another, so each\npart's own amount is its height: the first column is in front. Use it to\ncompare the parts with each other; the scale then fits the largest part\nrather than the total.\n\n`value-axis` draws the scale's numbers beside the plot, at the levels\n`gridlines` rules: amounts in `locale`, or percentages under `share`.\n\nThe drawing is hidden from screen readers. The text summary gives the latest\nreading's total and each part's share of it, and the table beside the chart\nhas every number.\n\n**The plot is read by key.** It takes focus, named by `label` or the caption.\nThe left and right arrows move from reading to reading, Home and End go to\nthe first and the last, and the up and down arrows move among the series of\na reading. The tooltip follows, the `live` part says the reading in words,\nand Escape puts the tooltip away.\n\nEvery numeric column is a part, so leave a total column out of the table the\nchart reads, or it is counted twice. A negative reading is drawn as zero.\n\n**A tap shows the reading under it**, and keeps it until a tap lands\nelsewhere. `helix-reading-change` says each move of the reading, by pointer,\ntap or key, and `helix-reading-press` says a reading was clicked, tapped, or\npressed with Enter or Space, for a page that opens what a reading stands for.",
|
|
2912
2912
|
"name": "HelixHeadlessAreaChart",
|
|
2913
|
+
"cssProperties": [
|
|
2914
|
+
{
|
|
2915
|
+
"description": "The width of the axis, in `ch`, set from the widest number on it. Written by the component on the axis.",
|
|
2916
|
+
"name": "--area-chart-axis"
|
|
2917
|
+
}
|
|
2918
|
+
],
|
|
2913
2919
|
"cssParts": [
|
|
2914
2920
|
{
|
|
2915
2921
|
"description": "One part's band.",
|
|
2916
2922
|
"name": "area"
|
|
2917
2923
|
},
|
|
2924
|
+
{
|
|
2925
|
+
"description": "The numbers of the scale beside the plot, under `value-axis`.",
|
|
2926
|
+
"name": "axis"
|
|
2927
|
+
},
|
|
2918
2928
|
{
|
|
2919
2929
|
"description": "The rule at zero, which is the floor of the drawing.",
|
|
2920
2930
|
"name": "baseline"
|
|
@@ -2959,6 +2969,10 @@
|
|
|
2959
2969
|
"description": "The drawing surface the bands sit on.",
|
|
2960
2970
|
"name": "svg"
|
|
2961
2971
|
},
|
|
2972
|
+
{
|
|
2973
|
+
"description": "One number on the axis, placed with `inset-block-start` at its level.",
|
|
2974
|
+
"name": "tick"
|
|
2975
|
+
},
|
|
2962
2976
|
{
|
|
2963
2977
|
"description": "The bubble, forwarded from `Tooltip`.",
|
|
2964
2978
|
"name": "tooltip"
|
|
@@ -3106,6 +3120,17 @@
|
|
|
3106
3120
|
"words": true
|
|
3107
3121
|
}
|
|
3108
3122
|
},
|
|
3123
|
+
{
|
|
3124
|
+
"kind": "field",
|
|
3125
|
+
"name": "valueAxis",
|
|
3126
|
+
"type": {
|
|
3127
|
+
"text": "boolean"
|
|
3128
|
+
},
|
|
3129
|
+
"default": "false",
|
|
3130
|
+
"description": "Draws the scale's numbers beside the plot, the `axis` part, at the levels\n`gridlines` rules: amounts, or percentages under `share`.\n\nAbsent draws none: bands read as a composition need no numbers beside\nthem, and the tooltip and the table hold every reading.",
|
|
3131
|
+
"attribute": "value-axis",
|
|
3132
|
+
"reflects": true
|
|
3133
|
+
},
|
|
3109
3134
|
{
|
|
3110
3135
|
"kind": "field",
|
|
3111
3136
|
"name": "warnedAboutNegatives",
|
|
@@ -3156,6 +3181,31 @@
|
|
|
3156
3181
|
},
|
|
3157
3182
|
"description": "Says once that a reading was below zero, and what was drawn instead.\n\nOnce per element, and in a browser only: a server render warning per\nrequest is one nobody can act on."
|
|
3158
3183
|
},
|
|
3184
|
+
{
|
|
3185
|
+
"kind": "method",
|
|
3186
|
+
"name": "renderAxis",
|
|
3187
|
+
"privacy": "protected",
|
|
3188
|
+
"return": {
|
|
3189
|
+
"type": {
|
|
3190
|
+
"text": "TemplateResult"
|
|
3191
|
+
}
|
|
3192
|
+
},
|
|
3193
|
+
"parameters": [
|
|
3194
|
+
{
|
|
3195
|
+
"name": "y",
|
|
3196
|
+
"type": {
|
|
3197
|
+
"text": "(value: number) => number"
|
|
3198
|
+
}
|
|
3199
|
+
},
|
|
3200
|
+
{
|
|
3201
|
+
"name": "domain",
|
|
3202
|
+
"type": {
|
|
3203
|
+
"text": "[number, number]"
|
|
3204
|
+
}
|
|
3205
|
+
}
|
|
3206
|
+
],
|
|
3207
|
+
"description": "The scale's numbers beside the plot, under `value-axis`: amounts written\nin the chart's locale, or percentages under `share`. A seam, so a\nsubclass can write the numbers its own way, such as a currency."
|
|
3208
|
+
},
|
|
3159
3209
|
{
|
|
3160
3210
|
"kind": "method",
|
|
3161
3211
|
"name": "renderPlot",
|
|
@@ -4024,6 +4074,24 @@
|
|
|
4024
4074
|
}
|
|
4025
4075
|
}
|
|
4026
4076
|
],
|
|
4077
|
+
"events": [
|
|
4078
|
+
{
|
|
4079
|
+
"type": {
|
|
4080
|
+
"text": "HelixReadingChangeEvent"
|
|
4081
|
+
},
|
|
4082
|
+
"description": "The reading shown moved, or was put away: `index` is the row, or `-1` for none, with its `label`, the `series` the keys rest on, and the `pointerType` that moved it.",
|
|
4083
|
+
"name": "helix-reading-change",
|
|
4084
|
+
"reactProp": "onhelix-reading-change"
|
|
4085
|
+
},
|
|
4086
|
+
{
|
|
4087
|
+
"type": {
|
|
4088
|
+
"text": "HelixReadingPressEvent"
|
|
4089
|
+
},
|
|
4090
|
+
"description": "A reading was clicked, tapped, or pressed with Enter or Space, with the same detail as `helix-reading-change`.",
|
|
4091
|
+
"name": "helix-reading-press",
|
|
4092
|
+
"reactProp": "onhelix-reading-press"
|
|
4093
|
+
}
|
|
4094
|
+
],
|
|
4027
4095
|
"attributes": [
|
|
4028
4096
|
{
|
|
4029
4097
|
"name": "curve",
|
|
@@ -4077,6 +4145,15 @@
|
|
|
4077
4145
|
"description": "The name for the sum of the parts, shown in the tooltip and the summary.",
|
|
4078
4146
|
"fieldName": "totalLabel"
|
|
4079
4147
|
},
|
|
4148
|
+
{
|
|
4149
|
+
"name": "value-axis",
|
|
4150
|
+
"type": {
|
|
4151
|
+
"text": "boolean"
|
|
4152
|
+
},
|
|
4153
|
+
"default": "false",
|
|
4154
|
+
"description": "Draws the scale's numbers beside the plot, the `axis` part, at the levels\n`gridlines` rules: amounts, or percentages under `share`.\n\nAbsent draws none: bands read as a composition need no numbers beside\nthem, and the tooltip and the table hold every reading.",
|
|
4155
|
+
"fieldName": "valueAxis"
|
|
4156
|
+
},
|
|
4080
4157
|
{
|
|
4081
4158
|
"name": "for",
|
|
4082
4159
|
"type": {
|
|
@@ -6217,7 +6294,7 @@
|
|
|
6217
6294
|
"declarations": [
|
|
6218
6295
|
{
|
|
6219
6296
|
"kind": "class",
|
|
6220
|
-
"description": "Every bar is measured from zero, and no property changes the baseline,\nbecause a bar's length is its value. To show the differences between values,\nuse a line chart.\n\nThe labels are HTML beside the drawing. An `<svg>` that fills its box scales\nthe text inside it: the same `font-size` renders at 10px in a narrow chart\nand 43px in a wide one, and SVG has no setting that keeps text at one size\nthe way `vector-effect` does for strokes.\n\nThe table is the accessible representation, and the drawing is hidden from\nscreen readers, so they get the numbers themselves. The `summary` part names\nthe chart, from `label` or the table's caption, and gives each series' highest\nreading.\n\n**The plot is read by key.** It takes focus, named by `label` or the caption.\nThe arrows along the categories move from one to the next, which is left and\nright for columns and up and down for `orientation=\"horizontal\"`. Home and\nEnd go to the first and the last, and the other pair of arrows moves among\nthe series of a category. The tooltip follows, the `live` part says the\nreading in words, and Escape puts the tooltip away.\n\nThe component writes the custom properties below with numbers it computes,\nand the stylesheet that draws the chart reads them. Do not set them yourself.",
|
|
6297
|
+
"description": "Every bar is measured from zero, and no property changes the baseline,\nbecause a bar's length is its value. To show the differences between values,\nuse a line chart.\n\nThe labels are HTML beside the drawing. An `<svg>` that fills its box scales\nthe text inside it: the same `font-size` renders at 10px in a narrow chart\nand 43px in a wide one, and SVG has no setting that keeps text at one size\nthe way `vector-effect` does for strokes.\n\nThe table is the accessible representation, and the drawing is hidden from\nscreen readers, so they get the numbers themselves. The `summary` part names\nthe chart, from `label` or the table's caption, and gives each series' highest\nreading.\n\n**The plot is read by key.** It takes focus, named by `label` or the caption.\nThe arrows along the categories move from one to the next, which is left and\nright for columns and up and down for `orientation=\"horizontal\"`. Home and\nEnd go to the first and the last, and the other pair of arrows moves among\nthe series of a category. The tooltip follows, the `live` part says the\nreading in words, and Escape puts the tooltip away.\n\nThe component writes the custom properties below with numbers it computes,\nand the stylesheet that draws the chart reads them. Do not set them yourself.\n\n**A tap shows the reading under it**, and keeps it until a tap lands\nelsewhere. `helix-reading-change` says each move of the reading, by pointer,\ntap or key, and `helix-reading-press` says a reading was clicked, tapped, or\npressed with Enter or Space, for a page that opens what a reading stands for.",
|
|
6221
6298
|
"name": "HelixHeadlessBarChart",
|
|
6222
6299
|
"cssProperties": [
|
|
6223
6300
|
{
|
|
@@ -6235,7 +6312,7 @@
|
|
|
6235
6312
|
],
|
|
6236
6313
|
"cssParts": [
|
|
6237
6314
|
{
|
|
6238
|
-
"description": "The numbers of one scale
|
|
6315
|
+
"description": "The numbers of one scale: the primary under `value-axis`, and both when `secondary` splits the chart into two scales.",
|
|
6239
6316
|
"name": "axis"
|
|
6240
6317
|
},
|
|
6241
6318
|
{
|
|
@@ -6461,6 +6538,17 @@
|
|
|
6461
6538
|
"words": true
|
|
6462
6539
|
}
|
|
6463
6540
|
},
|
|
6541
|
+
{
|
|
6542
|
+
"kind": "field",
|
|
6543
|
+
"name": "valueAxis",
|
|
6544
|
+
"type": {
|
|
6545
|
+
"text": "boolean"
|
|
6546
|
+
},
|
|
6547
|
+
"default": "false",
|
|
6548
|
+
"description": "Draws the numbers of the scale the bars are measured on, the `axis` part,\nat the levels `gridlines` rules: down the side of columns, and along the\nbottom of bars under `orientation=\"horizontal\"`.\n\nAbsent draws none with one scale, since bars compared with each other need\nno numbers. With `secondary` both scales are drawn whatever this says.",
|
|
6549
|
+
"attribute": "value-axis",
|
|
6550
|
+
"reflects": true
|
|
6551
|
+
},
|
|
6464
6552
|
{
|
|
6465
6553
|
"kind": "field",
|
|
6466
6554
|
"name": "scaled",
|
|
@@ -6655,7 +6743,7 @@
|
|
|
6655
6743
|
}
|
|
6656
6744
|
}
|
|
6657
6745
|
],
|
|
6658
|
-
"description": "The numbers along one scale, drawn only where there are two of them.\n\n**A chart with one scale renders no axis, on purpose.** Columns measured\nagainst each other need no numbers to be compared, and a row of them beside\na small chart is furniture that makes the drawing smaller for no reading a\nreader was going to do. With two scales that argument inverts: a reader\ncannot tell there are two, cannot tell which series is on which, and cannot\nrecover either from the picture. So this appears with `secondary
|
|
6746
|
+
"description": "The numbers along one scale, drawn only where there are two of them.\n\n**A chart with one scale renders no axis, on purpose.** Columns measured\nagainst each other need no numbers to be compared, and a row of them beside\na small chart is furniture that makes the drawing smaller for no reading a\nreader was going to do. With two scales that argument inverts: a reader\ncannot tell there are two, cannot tell which series is on which, and cannot\nrecover either from the picture. So this appears with `secondary`, and\nwith one scale only where `value-axis` asks for its numbers.\n\n**Beside the plot and not inside it.** Inside, the numbers are drawn over\nthe drawing, and a horizontal chart shows it immediately: its value axis\nruns along the bottom, which is where the last row of bars is. The vertical\ncase has the same fault and enough slack to hide it. The plot is also the\npointer's catchment and the tooltip's containing block, both measured from\nits box, so padding it to make room would move every reading half an axis\nto the right.\n\nA column of the host grid instead, which the stylesheet grows only when\n`secondary` or `value-axis` is set. That is what the two reflect for.\n\nThe primary hugs the edge the drawing starts at and the secondary the edge\nit ends at: down the two sides for columns, along the bottom and top for\nbars, which is where each axis is when the chart is turned."
|
|
6659
6747
|
},
|
|
6660
6748
|
{
|
|
6661
6749
|
"kind": "method",
|
|
@@ -7429,6 +7517,24 @@
|
|
|
7429
7517
|
}
|
|
7430
7518
|
}
|
|
7431
7519
|
],
|
|
7520
|
+
"events": [
|
|
7521
|
+
{
|
|
7522
|
+
"type": {
|
|
7523
|
+
"text": "HelixReadingChangeEvent"
|
|
7524
|
+
},
|
|
7525
|
+
"description": "The reading shown moved, or was put away: `index` is the row, or `-1` for none, with its `label`, the `series` the keys rest on, and the `pointerType` that moved it.",
|
|
7526
|
+
"name": "helix-reading-change",
|
|
7527
|
+
"reactProp": "onhelix-reading-change"
|
|
7528
|
+
},
|
|
7529
|
+
{
|
|
7530
|
+
"type": {
|
|
7531
|
+
"text": "HelixReadingPressEvent"
|
|
7532
|
+
},
|
|
7533
|
+
"description": "A reading was clicked, tapped, or pressed with Enter or Space, with the same detail as `helix-reading-change`.",
|
|
7534
|
+
"name": "helix-reading-press",
|
|
7535
|
+
"reactProp": "onhelix-reading-press"
|
|
7536
|
+
}
|
|
7537
|
+
],
|
|
7432
7538
|
"attributes": [
|
|
7433
7539
|
{
|
|
7434
7540
|
"name": "gridlines",
|
|
@@ -7489,6 +7595,15 @@
|
|
|
7489
7595
|
"description": "The summary's sentence. `{highestLabel}` is `highest-label`, and\n`{readings}` each series' highest reading: the series, the category and\nthe reading as the table writes it.",
|
|
7490
7596
|
"fieldName": "summaryLabel"
|
|
7491
7597
|
},
|
|
7598
|
+
{
|
|
7599
|
+
"name": "value-axis",
|
|
7600
|
+
"type": {
|
|
7601
|
+
"text": "boolean"
|
|
7602
|
+
},
|
|
7603
|
+
"default": "false",
|
|
7604
|
+
"description": "Draws the numbers of the scale the bars are measured on, the `axis` part,\nat the levels `gridlines` rules: down the side of columns, and along the\nbottom of bars under `orientation=\"horizontal\"`.\n\nAbsent draws none with one scale, since bars compared with each other need\nno numbers. With `secondary` both scales are drawn whatever this says.",
|
|
7605
|
+
"fieldName": "valueAxis"
|
|
7606
|
+
},
|
|
7492
7607
|
{
|
|
7493
7608
|
"name": "for",
|
|
7494
7609
|
"type": {
|
|
@@ -11729,6 +11844,23 @@
|
|
|
11729
11844
|
"module": "src/mixins/mixin-dismissible/mixin-dismissible.ts"
|
|
11730
11845
|
}
|
|
11731
11846
|
},
|
|
11847
|
+
{
|
|
11848
|
+
"kind": "field",
|
|
11849
|
+
"name": "dismissLabel",
|
|
11850
|
+
"type": {
|
|
11851
|
+
"text": "string"
|
|
11852
|
+
},
|
|
11853
|
+
"default": "'Dismiss {label}'",
|
|
11854
|
+
"description": "The dismiss button's name, read by screen readers, with `{label}` for\nwhat the callout is called: its heading, or the tone's name where it has\nnone.\n\n\"Dismiss Scheduled maintenance\" says which of several callouts the button\ntakes away, where every button was \"Dismiss\". A label without `{label}` is\nread as written.",
|
|
11855
|
+
"attribute": "dismiss-label",
|
|
11856
|
+
"helix": {
|
|
11857
|
+
"words": true
|
|
11858
|
+
},
|
|
11859
|
+
"inheritedFrom": {
|
|
11860
|
+
"name": "MixinDismissible",
|
|
11861
|
+
"module": "src/mixins/mixin-dismissible/mixin-dismissible.ts"
|
|
11862
|
+
}
|
|
11863
|
+
},
|
|
11732
11864
|
{
|
|
11733
11865
|
"kind": "field",
|
|
11734
11866
|
"name": "tone",
|
|
@@ -11798,6 +11930,25 @@
|
|
|
11798
11930
|
},
|
|
11799
11931
|
"description": "The cross inside the dismiss button, behind a seam, for the reason\n`renderIcon` gives: the slot answers the page and the method the tier\nabove."
|
|
11800
11932
|
},
|
|
11933
|
+
{
|
|
11934
|
+
"kind": "method",
|
|
11935
|
+
"name": "dismissName",
|
|
11936
|
+
"privacy": "private",
|
|
11937
|
+
"return": {
|
|
11938
|
+
"type": {
|
|
11939
|
+
"text": "string"
|
|
11940
|
+
}
|
|
11941
|
+
},
|
|
11942
|
+
"parameters": [
|
|
11943
|
+
{
|
|
11944
|
+
"name": "tone",
|
|
11945
|
+
"type": {
|
|
11946
|
+
"text": "string"
|
|
11947
|
+
}
|
|
11948
|
+
}
|
|
11949
|
+
],
|
|
11950
|
+
"description": "The dismiss button's name: `dismissLabel` with the heading's words, or the\ntone's name.\n\nThe heading is read from the children, so a server and a hydrating render\nname the button for the tone, and the update after names it for the\nheading."
|
|
11951
|
+
},
|
|
11801
11952
|
{
|
|
11802
11953
|
"kind": "field",
|
|
11803
11954
|
"name": "dismissible",
|
|
@@ -11813,23 +11964,6 @@
|
|
|
11813
11964
|
"module": "src/mixins/mixin-dismissible/mixin-dismissible.ts"
|
|
11814
11965
|
}
|
|
11815
11966
|
},
|
|
11816
|
-
{
|
|
11817
|
-
"kind": "field",
|
|
11818
|
-
"name": "dismissLabel",
|
|
11819
|
-
"type": {
|
|
11820
|
-
"text": "string"
|
|
11821
|
-
},
|
|
11822
|
-
"default": "'Dismiss'",
|
|
11823
|
-
"description": "The dismiss control's label, read by screen readers.\n\n`attribute` is spelled out because Lit lowercases a property name to\nderive one rather than dash-casing it, so this would otherwise be\nreachable only as `dismisslabel`, which nobody would guess and no linter\nwould catch.\n\nA word property: register it for a locale under the host's key. A family\nthat names the control otherwise, such as Tag's `Remove {label}`,\ndeclares its own English with `@words` above the override.",
|
|
11824
|
-
"attribute": "dismiss-label",
|
|
11825
|
-
"helix": {
|
|
11826
|
-
"words": true
|
|
11827
|
-
},
|
|
11828
|
-
"inheritedFrom": {
|
|
11829
|
-
"name": "MixinDismissible",
|
|
11830
|
-
"module": "src/mixins/mixin-dismissible/mixin-dismissible.ts"
|
|
11831
|
-
}
|
|
11832
|
-
},
|
|
11833
11967
|
{
|
|
11834
11968
|
"kind": "method",
|
|
11835
11969
|
"name": "dismissEvent",
|
|
@@ -12315,6 +12449,19 @@
|
|
|
12315
12449
|
}
|
|
12316
12450
|
],
|
|
12317
12451
|
"attributes": [
|
|
12452
|
+
{
|
|
12453
|
+
"name": "dismiss-label",
|
|
12454
|
+
"type": {
|
|
12455
|
+
"text": "string"
|
|
12456
|
+
},
|
|
12457
|
+
"default": "'Dismiss {label}'",
|
|
12458
|
+
"description": "The dismiss button's name, read by screen readers, with `{label}` for\nwhat the callout is called: its heading, or the tone's name where it has\nnone.\n\n\"Dismiss Scheduled maintenance\" says which of several callouts the button\ntakes away, where every button was \"Dismiss\". A label without `{label}` is\nread as written.",
|
|
12459
|
+
"fieldName": "dismissLabel",
|
|
12460
|
+
"inheritedFrom": {
|
|
12461
|
+
"name": "MixinDismissible",
|
|
12462
|
+
"module": "src/mixins/mixin-dismissible/mixin-dismissible.ts"
|
|
12463
|
+
}
|
|
12464
|
+
},
|
|
12318
12465
|
{
|
|
12319
12466
|
"name": "tone",
|
|
12320
12467
|
"type": {
|
|
@@ -12353,19 +12500,6 @@
|
|
|
12353
12500
|
"name": "MixinDismissible",
|
|
12354
12501
|
"module": "src/mixins/mixin-dismissible/mixin-dismissible.ts"
|
|
12355
12502
|
}
|
|
12356
|
-
},
|
|
12357
|
-
{
|
|
12358
|
-
"name": "dismiss-label",
|
|
12359
|
-
"type": {
|
|
12360
|
-
"text": "string"
|
|
12361
|
-
},
|
|
12362
|
-
"default": "'Dismiss'",
|
|
12363
|
-
"description": "The dismiss control's label, read by screen readers.\n\n`attribute` is spelled out because Lit lowercases a property name to\nderive one rather than dash-casing it, so this would otherwise be\nreachable only as `dismisslabel`, which nobody would guess and no linter\nwould catch.\n\nA word property: register it for a locale under the host's key. A family\nthat names the control otherwise, such as Tag's `Remove {label}`,\ndeclares its own English with `@words` above the override.",
|
|
12364
|
-
"fieldName": "dismissLabel",
|
|
12365
|
-
"inheritedFrom": {
|
|
12366
|
-
"name": "MixinDismissible",
|
|
12367
|
-
"module": "src/mixins/mixin-dismissible/mixin-dismissible.ts"
|
|
12368
|
-
}
|
|
12369
12503
|
}
|
|
12370
12504
|
],
|
|
12371
12505
|
"mixins": [
|
|
@@ -21242,7 +21376,7 @@
|
|
|
21242
21376
|
"declarations": [
|
|
21243
21377
|
{
|
|
21244
21378
|
"kind": "class",
|
|
21245
|
-
"description": "The composer is a separate element so you can replace it. If you need\nattachments, slash commands, or a model picker, replace the composer and keep\nthe transcript.\n\nBy default, Enter sends and Shift+Enter starts a new line, the convention in\nmessaging apps. Document editors mostly use the opposite, so `submit-on`\ntakes `enter` or `button`. Use `button` for a long-form composer.\n\nThe composer clears only when no listener cancels the send, so the text is\nkept when you cancel a send that failed.\n\n**In a form, the draft is the composer's value**, submitted under `name`. A\nform reset puts back the `value` the markup declared, and a `<fieldset\ndisabled>` turns the composer off. Sending is still `helix-send`, and it\ndoes not submit the form.\n\n**`typing` says whether the user is writing**, and `helix-typing` is sent\neach time it changes: when they start, and when they send or stop for\n`typing-timeout` milliseconds. Pass it on to show \"is typing\" to the other\nside.",
|
|
21379
|
+
"description": "The composer is a separate element so you can replace it. If you need\nattachments, slash commands, or a model picker, replace the composer and keep\nthe transcript.\n\nBy default, Enter sends and Shift+Enter starts a new line, the convention in\nmessaging apps. Document editors mostly use the opposite, so `submit-on`\ntakes `enter` or `button`. Use `button` for a long-form composer.\n\nThe composer clears only when no listener cancels the send, so the text is\nkept when you cancel a send that failed.\n\n**In a form, the draft is the composer's value**, submitted under `name`. A\nform reset puts back the `value` the markup declared, and a `<fieldset\ndisabled>` turns the composer off. Sending is still `helix-send`, and it\ndoes not submit the form.\n\n**`required`, `minlength` and `maxlength` are checked by the browser**, as\non a `<textarea>`, and the message is the browser's. `maxlength` stops the\nfield taking more. A draft that fails them does not send, and the composer\ntakes `:state(invalid)` and `aria-invalid` once the reader has tried to send\nit, the form was submitted, or the reader edited the field and left it.\nTabbing past an empty composer marks nothing.\n\n**`typing` says whether the user is writing**, and `helix-typing` is sent\neach time it changes: when they start, and when they send or stop for\n`typing-timeout` milliseconds. Pass it on to show \"is typing\" to the other\nside.",
|
|
21246
21380
|
"name": "HelixHeadlessChatComposer",
|
|
21247
21381
|
"cssParts": [
|
|
21248
21382
|
{
|
|
@@ -21308,6 +21442,24 @@
|
|
|
21308
21442
|
"words": true
|
|
21309
21443
|
}
|
|
21310
21444
|
},
|
|
21445
|
+
{
|
|
21446
|
+
"kind": "field",
|
|
21447
|
+
"name": "maxLength",
|
|
21448
|
+
"type": {
|
|
21449
|
+
"text": "number | undefined"
|
|
21450
|
+
},
|
|
21451
|
+
"description": "The most characters a draft can have. The field stops taking more.",
|
|
21452
|
+
"attribute": "maxlength"
|
|
21453
|
+
},
|
|
21454
|
+
{
|
|
21455
|
+
"kind": "field",
|
|
21456
|
+
"name": "minLength",
|
|
21457
|
+
"type": {
|
|
21458
|
+
"text": "number | undefined"
|
|
21459
|
+
},
|
|
21460
|
+
"description": "The fewest characters a draft can have, once the reader has written in\nthe field, as on a `<textarea>`.",
|
|
21461
|
+
"attribute": "minlength"
|
|
21462
|
+
},
|
|
21311
21463
|
{
|
|
21312
21464
|
"kind": "field",
|
|
21313
21465
|
"name": "placeholder",
|
|
@@ -21318,6 +21470,16 @@
|
|
|
21318
21470
|
"description": "Placeholder text shown in an empty field.",
|
|
21319
21471
|
"attribute": "placeholder"
|
|
21320
21472
|
},
|
|
21473
|
+
{
|
|
21474
|
+
"kind": "field",
|
|
21475
|
+
"name": "required",
|
|
21476
|
+
"type": {
|
|
21477
|
+
"text": "boolean"
|
|
21478
|
+
},
|
|
21479
|
+
"default": "false",
|
|
21480
|
+
"description": "Whether the form needs a draft to submit. An empty draft never sends,\nrequired or not.",
|
|
21481
|
+
"attribute": "required"
|
|
21482
|
+
},
|
|
21321
21483
|
{
|
|
21322
21484
|
"kind": "field",
|
|
21323
21485
|
"name": "rows",
|
|
@@ -21381,6 +21543,26 @@
|
|
|
21381
21543
|
"default": "false",
|
|
21382
21544
|
"description": "Whether the user is writing, which `helix-typing` announces."
|
|
21383
21545
|
},
|
|
21546
|
+
{
|
|
21547
|
+
"kind": "field",
|
|
21548
|
+
"name": "touched",
|
|
21549
|
+
"type": {
|
|
21550
|
+
"text": "boolean"
|
|
21551
|
+
},
|
|
21552
|
+
"privacy": "private",
|
|
21553
|
+
"default": "false",
|
|
21554
|
+
"description": "Whether the reader has tried to send or submit the draft, or edited it and left."
|
|
21555
|
+
},
|
|
21556
|
+
{
|
|
21557
|
+
"kind": "field",
|
|
21558
|
+
"name": "shownInvalid",
|
|
21559
|
+
"type": {
|
|
21560
|
+
"text": "boolean"
|
|
21561
|
+
},
|
|
21562
|
+
"privacy": "private",
|
|
21563
|
+
"default": "false",
|
|
21564
|
+
"description": "Whether the composer shows that its draft is wrong."
|
|
21565
|
+
},
|
|
21384
21566
|
{
|
|
21385
21567
|
"kind": "field",
|
|
21386
21568
|
"name": "pause",
|
|
@@ -21457,6 +21639,13 @@
|
|
|
21457
21639
|
"text": "formResetCallback() => void"
|
|
21458
21640
|
}
|
|
21459
21641
|
},
|
|
21642
|
+
{
|
|
21643
|
+
"kind": "field",
|
|
21644
|
+
"name": "touch",
|
|
21645
|
+
"privacy": "private",
|
|
21646
|
+
"readonly": true,
|
|
21647
|
+
"description": "The reader has had a go at the draft, so whether it is wrong can be shown."
|
|
21648
|
+
},
|
|
21460
21649
|
{
|
|
21461
21650
|
"kind": "method",
|
|
21462
21651
|
"name": "formStateRestoreCallback",
|
|
@@ -22343,6 +22532,22 @@
|
|
|
22343
22532
|
"description": "The field's name, read by screen readers.",
|
|
22344
22533
|
"fieldName": "label"
|
|
22345
22534
|
},
|
|
22535
|
+
{
|
|
22536
|
+
"name": "maxlength",
|
|
22537
|
+
"type": {
|
|
22538
|
+
"text": "number | undefined"
|
|
22539
|
+
},
|
|
22540
|
+
"description": "The most characters a draft can have. The field stops taking more.",
|
|
22541
|
+
"fieldName": "maxLength"
|
|
22542
|
+
},
|
|
22543
|
+
{
|
|
22544
|
+
"name": "minlength",
|
|
22545
|
+
"type": {
|
|
22546
|
+
"text": "number | undefined"
|
|
22547
|
+
},
|
|
22548
|
+
"description": "The fewest characters a draft can have, once the reader has written in\nthe field, as on a `<textarea>`.",
|
|
22549
|
+
"fieldName": "minLength"
|
|
22550
|
+
},
|
|
22346
22551
|
{
|
|
22347
22552
|
"name": "placeholder",
|
|
22348
22553
|
"type": {
|
|
@@ -22352,6 +22557,15 @@
|
|
|
22352
22557
|
"description": "Placeholder text shown in an empty field.",
|
|
22353
22558
|
"fieldName": "placeholder"
|
|
22354
22559
|
},
|
|
22560
|
+
{
|
|
22561
|
+
"name": "required",
|
|
22562
|
+
"type": {
|
|
22563
|
+
"text": "boolean"
|
|
22564
|
+
},
|
|
22565
|
+
"default": "false",
|
|
22566
|
+
"description": "Whether the form needs a draft to submit. An empty draft never sends,\nrequired or not.",
|
|
22567
|
+
"fieldName": "required"
|
|
22568
|
+
},
|
|
22355
22569
|
{
|
|
22356
22570
|
"name": "rows",
|
|
22357
22571
|
"type": {
|
|
@@ -22424,6 +22638,20 @@
|
|
|
22424
22638
|
}
|
|
22425
22639
|
}
|
|
22426
22640
|
],
|
|
22641
|
+
"cssStates": [
|
|
22642
|
+
{
|
|
22643
|
+
"description": "The draft fails `required`, `minlength`, `maxlength`, or a custom error, and the reader has tried to send or submit it, or edited the field and left it.",
|
|
22644
|
+
"name": "invalid"
|
|
22645
|
+
},
|
|
22646
|
+
{
|
|
22647
|
+
"description": "Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.",
|
|
22648
|
+
"name": "settled",
|
|
22649
|
+
"inheritedFrom": {
|
|
22650
|
+
"name": "HelixElement",
|
|
22651
|
+
"module": "src/helix-element/helix-element.ts"
|
|
22652
|
+
}
|
|
22653
|
+
}
|
|
22654
|
+
],
|
|
22427
22655
|
"superclass": {
|
|
22428
22656
|
"name": "HelixFormElement",
|
|
22429
22657
|
"package": "@fusion.dev/helix-core"
|
|
@@ -22444,16 +22672,6 @@
|
|
|
22444
22672
|
},
|
|
22445
22673
|
"tagName": "helix-headless-chat-composer",
|
|
22446
22674
|
"customElement": true,
|
|
22447
|
-
"cssStates": [
|
|
22448
|
-
{
|
|
22449
|
-
"description": "Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.",
|
|
22450
|
-
"name": "settled",
|
|
22451
|
-
"inheritedFrom": {
|
|
22452
|
-
"name": "HelixElement",
|
|
22453
|
-
"module": "src/helix-element/helix-element.ts"
|
|
22454
|
-
}
|
|
22455
|
-
}
|
|
22456
|
-
],
|
|
22457
22675
|
"modulePath": "src/chat/composer/chat-composer.ts",
|
|
22458
22676
|
"definitionPath": "src/chat/composer/chat-composer.ts"
|
|
22459
22677
|
}
|
|
@@ -23992,6 +24210,17 @@
|
|
|
23992
24210
|
"description": "The element that scrolls, once there is one.",
|
|
23993
24211
|
"readonly": true
|
|
23994
24212
|
},
|
|
24213
|
+
{
|
|
24214
|
+
"kind": "method",
|
|
24215
|
+
"name": "markScroller",
|
|
24216
|
+
"privacy": "private",
|
|
24217
|
+
"return": {
|
|
24218
|
+
"type": {
|
|
24219
|
+
"text": "void"
|
|
24220
|
+
}
|
|
24221
|
+
},
|
|
24222
|
+
"description": "Makes the log a tab stop while it scrolls, and takes the stop away when it\ndoes not.\n\n**A reader on a keyboard scrolls the history from the log itself.**\nChromium and Firefox make a box that scrolls focusable on their own, and\nSafari does not, so there the arrow keys could not reach a long history.\nA log that fits is no stop at all, so Tab goes straight to the composer."
|
|
24223
|
+
},
|
|
23995
24224
|
{
|
|
23996
24225
|
"kind": "field",
|
|
23997
24226
|
"name": "atBottom",
|
|
@@ -24497,6 +24726,20 @@
|
|
|
24497
24726
|
"module": "src/mixins/mixin-collection/mixin-collection.ts"
|
|
24498
24727
|
}
|
|
24499
24728
|
},
|
|
24729
|
+
{
|
|
24730
|
+
"kind": "field",
|
|
24731
|
+
"name": "statusSlots",
|
|
24732
|
+
"type": {
|
|
24733
|
+
"text": "boolean"
|
|
24734
|
+
},
|
|
24735
|
+
"privacy": "protected",
|
|
24736
|
+
"default": "false",
|
|
24737
|
+
"description": "Whether the status line is an `empty` or `loading` slot, with\n`empty-text` or `loading-text` as its fallback.\n\n**Off unless a family turns it on**, because a slot is published API:\neach family that renders one documents it in its own manifest. The live\nregion keeps saying the text either way, because a slotted picture has no\nwords to say.",
|
|
24738
|
+
"inheritedFrom": {
|
|
24739
|
+
"name": "MixinCollection",
|
|
24740
|
+
"module": "src/mixins/mixin-collection/mixin-collection.ts"
|
|
24741
|
+
}
|
|
24742
|
+
},
|
|
24500
24743
|
{
|
|
24501
24744
|
"kind": "field",
|
|
24502
24745
|
"name": "tier",
|
|
@@ -30684,6 +30927,10 @@
|
|
|
30684
30927
|
"description": "Help text under the field.",
|
|
30685
30928
|
"name": "hint"
|
|
30686
30929
|
},
|
|
30930
|
+
{
|
|
30931
|
+
"description": "The label, for content richer than the `label` text.",
|
|
30932
|
+
"name": "label"
|
|
30933
|
+
},
|
|
30687
30934
|
{
|
|
30688
30935
|
"description": "Content in the panel under the picker, such as a note or an action.",
|
|
30689
30936
|
"name": "panel-footer"
|
|
@@ -35741,7 +35988,7 @@
|
|
|
35741
35988
|
"declarations": [
|
|
35742
35989
|
{
|
|
35743
35990
|
"kind": "class",
|
|
35744
|
-
"description": "The list is a `Listbox`, which handles filtering, the empty state, the\nhighlight, `aria-activedescendant`, and scrolling an option into view. This\nelement handles the field, the panel, and the communication between them.\n\nThe typed text and the value are separate. The text is a filter: it narrows\nthe list and is then discarded. The value is the option you choose, and the\nfield then shows that option's text. The filter clears on close, so a\nreopened combobox starts from the whole list.\n\nFocus stays in the text field. The arrow keys move through the list with the\nlistbox's public `navigate` method. As typing narrows the list, a screen\nreader hears how many options are left, such as \"3 results\". Emptying the\nfield and leaving it clears a single choice.\n\n**Keyboard.**\n\n| Key | What it does |\n|---|---|\n| Down, Up | On a closed field, opens the list on the chosen option, or the first or the last. In the open list, moves the highlight, round from the last option to the first. |\n| Page Down, Page Up | In the open list, moves the highlight by as many options as the list shows at once. |\n| Enter | Chooses the highlighted option. With nothing left in the list, creates what was typed with `creatable`, or takes it with `allows-custom-value`. On a closed field, submits the form. |\n| Escape | Closes the list and puts the chosen words back. On a closed field, a second Escape clears a single choice. |\n| Tab | Closes the list and moves on. |\n| Backspace | With `multiple`, on an empty field, removes the last tag. |\n| Space, Home, End, letters | Edit the text. |\n\n**ARIA.** The input is the `combobox`, named by the label, with\n`aria-expanded`, `aria-controls` naming the list, `aria-autocomplete`\n(`both` with `suggest`, `list` otherwise) and `aria-activedescendant` on\nthe highlighted option. The list is the listbox `Listbox` describes.\n\nOn Apple devices, where VoiceOver does not read the option the field points\nto, the field says it in a live region as the highlight moves, says how many\noptions there are as the list opens, and says a choice once it is made, as\nReact Aria's combobox does there.\n\nSet `autocomplete` to let a browser's autofill choose an option.\n\nWith `multiple`, each chosen option is a tag in the field with its own remove\ncontrol. The panel stays open and the filter clears after each choice, so the\nnext choice starts from the whole list.\n\nWith `creatable`, the combobox offers a create row and fires `helix-create`.\nIt does not add the option. The options are your light DOM, and your\nframework would re-render over an element the combobox inserted, so add the\noption in your event handler.",
|
|
35991
|
+
"description": "The list is a `Listbox`, which handles filtering, the empty state, the\nhighlight, `aria-activedescendant`, and scrolling an option into view. This\nelement handles the field, the panel, and the communication between them.\n\nThe typed text and the value are separate. The text is a filter: it narrows\nthe list and is then discarded. The value is the option you choose, and the\nfield then shows that option's text. The filter clears on close, so a\nreopened combobox starts from the whole list.\n\nFocus stays in the text field. The arrow keys move through the list with the\nlistbox's public `navigate` method. As typing narrows the list, a screen\nreader hears how many options are left, such as \"3 results\". Emptying the\nfield and leaving it clears a single choice.\n\n**Keyboard.**\n\n| Key | What it does |\n|---|---|\n| Down, Up | On a closed field, opens the list on the chosen option, or the first or the last. In the open list, moves the highlight, round from the last option to the first. |\n| Page Down, Page Up | In the open list, moves the highlight by as many options as the list shows at once. |\n| Enter | Chooses the highlighted option. With nothing left in the list, creates what was typed with `creatable`, or takes it with `allows-custom-value`. On a closed field, submits the form. |\n| Escape | Closes the list and puts the chosen words back. On a closed field, a second Escape clears a single choice. |\n| Tab | Closes the list and moves on. |\n| Backspace | With `multiple`, on an empty field, removes the last tag. |\n| Left | With `multiple`, with the caret at the start of the text, moves to the last tag's remove button. Right on a right-to-left page. |\n| Left, Right on a tag | Move between the tags, and past the last back to the text. |\n| Delete, Backspace on a tag | Removes the tag. |\n| Space, Home, End, letters | Edit the text. |\n\n**ARIA.** The input is the `combobox`, named by the label, with\n`aria-expanded`, `aria-controls` naming the list, `aria-autocomplete`\n(`both` with `suggest`, `list` otherwise) and `aria-activedescendant` on\nthe highlighted option. The list is the listbox `Listbox` describes.\n\nOn Apple devices, where VoiceOver does not read the option the field points\nto, the field says it in a live region as the highlight moves, says how many\noptions there are as the list opens, and says a choice once it is made, as\nReact Aria's combobox does there.\n\nSet `autocomplete` to let a browser's autofill choose an option.\n\nWith `multiple`, each chosen option is a tag in the field with its own remove\ncontrol. The text is the field's one tab stop, and the arrow keys reach the\ntags from it. The panel stays open and the filter clears after each choice, so the\nnext choice starts from the whole list.\n\nWith `creatable`, the combobox offers a create row and fires `helix-create`.\nIt does not add the option. The options are your light DOM, and your\nframework would re-render over an element the combobox inserted, so add the\noption in your event handler.",
|
|
35745
35992
|
"name": "HelixHeadlessCombobox",
|
|
35746
35993
|
"cssParts": [
|
|
35747
35994
|
{
|
|
@@ -36719,6 +36966,35 @@
|
|
|
36719
36966
|
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
36720
36967
|
}
|
|
36721
36968
|
},
|
|
36969
|
+
{
|
|
36970
|
+
"kind": "method",
|
|
36971
|
+
"name": "tokenElements",
|
|
36972
|
+
"privacy": "protected",
|
|
36973
|
+
"return": {
|
|
36974
|
+
"type": {
|
|
36975
|
+
"text": "HTMLElement[]"
|
|
36976
|
+
}
|
|
36977
|
+
},
|
|
36978
|
+
"description": "The tags, which the arrow keys reach from the text.",
|
|
36979
|
+
"inheritedFrom": {
|
|
36980
|
+
"name": "MixinTokens",
|
|
36981
|
+
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
36982
|
+
}
|
|
36983
|
+
},
|
|
36984
|
+
{
|
|
36985
|
+
"kind": "field",
|
|
36986
|
+
"name": "focusTarget",
|
|
36987
|
+
"type": {
|
|
36988
|
+
"text": "HTMLElement | null"
|
|
36989
|
+
},
|
|
36990
|
+
"privacy": "protected",
|
|
36991
|
+
"description": "Focus goes to the text field, the one tab stop, and never to a tag's remove\nbutton ahead of it, where Enter or Space would take a choice away.",
|
|
36992
|
+
"readonly": true,
|
|
36993
|
+
"inheritedFrom": {
|
|
36994
|
+
"name": "HelixFormElement",
|
|
36995
|
+
"module": "src/helix-form-element/helix-form-element.ts"
|
|
36996
|
+
}
|
|
36997
|
+
},
|
|
36722
36998
|
{
|
|
36723
36999
|
"kind": "field",
|
|
36724
37000
|
"name": "handleDismiss",
|
|
@@ -37056,6 +37332,46 @@
|
|
|
37056
37332
|
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
37057
37333
|
}
|
|
37058
37334
|
},
|
|
37335
|
+
{
|
|
37336
|
+
"kind": "method",
|
|
37337
|
+
"name": "tokenStops",
|
|
37338
|
+
"privacy": "private",
|
|
37339
|
+
"return": {
|
|
37340
|
+
"type": {
|
|
37341
|
+
"text": "HTMLElement[]"
|
|
37342
|
+
}
|
|
37343
|
+
},
|
|
37344
|
+
"description": "The remove button of each token shown that has one, in order.",
|
|
37345
|
+
"inheritedFrom": {
|
|
37346
|
+
"name": "MixinTokens",
|
|
37347
|
+
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
37348
|
+
}
|
|
37349
|
+
},
|
|
37350
|
+
{
|
|
37351
|
+
"kind": "field",
|
|
37352
|
+
"name": "tokenControl",
|
|
37353
|
+
"type": {
|
|
37354
|
+
"text": "HTMLInputElement | null"
|
|
37355
|
+
},
|
|
37356
|
+
"privacy": "private",
|
|
37357
|
+
"description": "The host's text field.",
|
|
37358
|
+
"readonly": true,
|
|
37359
|
+
"inheritedFrom": {
|
|
37360
|
+
"name": "MixinTokens",
|
|
37361
|
+
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
37362
|
+
}
|
|
37363
|
+
},
|
|
37364
|
+
{
|
|
37365
|
+
"kind": "field",
|
|
37366
|
+
"name": "handleTokenKeydown",
|
|
37367
|
+
"privacy": "private",
|
|
37368
|
+
"readonly": true,
|
|
37369
|
+
"description": "The arrow keys between the tokens, and Delete or Backspace on one.\n\nThe arrow toward the end of the line moves to the next token, and past\nthe last into the text with the caret at its start. Delete or Backspace\nasks the focused token to go, as its remove button does, and focus that\nleaves with it comes back to the text.",
|
|
37370
|
+
"inheritedFrom": {
|
|
37371
|
+
"name": "MixinTokens",
|
|
37372
|
+
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
37373
|
+
}
|
|
37374
|
+
},
|
|
37059
37375
|
{
|
|
37060
37376
|
"kind": "method",
|
|
37061
37377
|
"name": "renderRest",
|
|
@@ -37920,20 +38236,6 @@
|
|
|
37920
38236
|
"text": "setCustomValidity(message: string) => void"
|
|
37921
38237
|
}
|
|
37922
38238
|
},
|
|
37923
|
-
{
|
|
37924
|
-
"kind": "field",
|
|
37925
|
-
"name": "focusTarget",
|
|
37926
|
-
"type": {
|
|
37927
|
-
"text": "HTMLElement | null"
|
|
37928
|
-
},
|
|
37929
|
-
"privacy": "protected",
|
|
37930
|
-
"description": "The element focus goes to: the control's first tab stop, or `null` where\nthere is none.\n\nRead through shadow roots and slots, so a group lands on the member that\nholds its tab stop, which is the chosen radio in a radio group.",
|
|
37931
|
-
"readonly": true,
|
|
37932
|
-
"inheritedFrom": {
|
|
37933
|
-
"name": "HelixFormElement",
|
|
37934
|
-
"module": "src/helix-form-element/helix-form-element.ts"
|
|
37935
|
-
}
|
|
37936
|
-
},
|
|
37937
38239
|
{
|
|
37938
38240
|
"kind": "method",
|
|
37939
38241
|
"name": "focus",
|
|
@@ -40102,7 +40404,7 @@
|
|
|
40102
40404
|
"declarations": [
|
|
40103
40405
|
{
|
|
40104
40406
|
"kind": "class",
|
|
40105
|
-
"description": "Copies text to the clipboard and confirms the copy. The platform gives no\nfeedback for a clipboard write, so without a confirmation a press that copies\nlooks the same as one that fails.\n\nThe confirmation and the event wait for the write to finish. The browser can\nrefuse a clipboard write, for example on an insecure origin, in a document\nthat is not focused, or after a gesture that does not qualify. A refused\nwrite, or nothing to copy, names the button with `error-label` for the same\nmoment a copy shows `copied-label`, draws a cross, and sends\n`helix-copy-error`.\n\n`from` copies from another element on the page: its text, an attribute\nwritten `id[attribute]`, or a property written `id.property`, read at the\npress. It takes the place of `value`.\n\nIt replaces Button's render and its press, so it never submits a form or\nsends a command: `type`, `command`, `commandfor` and the `form*` overrides\nhave no effect, and the `start` and `end` slots and the `text` part are not\nrendered. An `aria-label` on the element names it before a copy, in place of\n`label`.\n\n**Keyboard.** Enter and Space copy, as they press a native button.\n\nThe button is named `label`, or the host's `aria-label`, and its name\nchanges to `copied-label` or `error-label` for the moment after a press
|
|
40407
|
+
"description": "Copies text to the clipboard and confirms the copy. The platform gives no\nfeedback for a clipboard write, so without a confirmation a press that copies\nlooks the same as one that fails.\n\nThe confirmation and the event wait for the write to finish. The browser can\nrefuse a clipboard write, for example on an insecure origin, in a document\nthat is not focused, or after a gesture that does not qualify. A refused\nwrite, or nothing to copy, names the button with `error-label` for the same\nmoment a copy shows `copied-label`, draws a cross, and sends\n`helix-copy-error`.\n\n`from` copies from another element on the page: its text, an attribute\nwritten `id[attribute]`, or a property written `id.property`, read at the\npress. It takes the place of `value`.\n\nIt replaces Button's render and its press, so it never submits a form or\nsends a command: `type`, `command`, `commandfor` and the `form*` overrides\nhave no effect, and the `start` and `end` slots and the `text` part are not\nrendered. An `aria-label` on the element names it before a copy, in place of\n`label`.\n\n**Keyboard.** Enter and Space copy, as they press a native button.\n\nThe button is named `label`, or the host's `aria-label`, and its name\nchanges to `copied-label` or `error-label` for the moment after a press. The\nsame words are said in a live region, so a screen reader hears the result,\nand the tooltip shows them.",
|
|
40106
40408
|
"name": "HelixHeadlessCopyButton",
|
|
40107
40409
|
"cssParts": [
|
|
40108
40410
|
{
|
|
@@ -40114,7 +40416,7 @@
|
|
|
40114
40416
|
}
|
|
40115
40417
|
},
|
|
40116
40418
|
{
|
|
40117
|
-
"description": "The live region that says `pending-label` when the button becomes pending under focus. It is rendered from the first time
|
|
40419
|
+
"description": "The live region that says `copied-label` or `error-label` after a press, and `pending-label` when the button becomes pending under focus. It is rendered from the first time it says anything.",
|
|
40118
40420
|
"name": "live",
|
|
40119
40421
|
"inheritedFrom": {
|
|
40120
40422
|
"name": "HelixHeadlessButton",
|
|
@@ -41900,7 +42202,7 @@
|
|
|
41900
42202
|
"declarations": [
|
|
41901
42203
|
{
|
|
41902
42204
|
"kind": "class",
|
|
41903
|
-
"description": "Declare the columns as `TableColumn` children and pass the rows as an array.\nThe schema stays readable in the HTML, and the rows can be windowed, which\nten thousand row elements cannot be.\n\n```html\n<helix-headless-data-table .rows=${rows} sort=\"name:asc\" page-size=\"20\">\n <helix-headless-table-column field=\"name\" sortable>Name</helix-headless-table-column>\n <helix-headless-table-column field=\"size\" text-align=\"end\" sortable .cell=${bytes}>Size</helix-headless-table-column>\n</helix-headless-data-table>\n```\n\nFor a short table written out by hand, use `Table`, which takes rows as\nmarkup.\n\nSort and filter apply to the whole set, including the rows on other pages.\n\n**The cell values do not server-render.** The headings and the row elements\ndo. Reading a cell needs the columns, and Lit SSR does not pass the column\nchildren to this element, so a crawler sees an empty table of the right\nshape. Use `Table` when the served HTML has to carry the values.\n\n`selectable` adds a column of checkboxes, keyed on `row-key`:\n\n- A row is selected by its key, so the selection survives a sort, a filter,\n and a page change.\n- `selected` holds the chosen keys, comma separated, the same shape `Listbox`\n uses for a multiple choice. As with `sort`, writing it applies the\n selection, and `default-selected` holds what the markup declared.\n- The checkbox in the heading selects every row in the result, across pages,\n and shows a dash while only some are chosen.\n- Shift with a press on a checkbox selects every row between it and the row\n last chosen.\n\nTo act on a single row, such as opening it, put a link or a button in a cell.\n\n**Keyboard.** The grid is one tab stop, and the arrow keys move between its\ncells, the headings included.\n\n| Key | What it does |\n|---|---|\n| Right, Left | Moves one cell along the row. Left moves on, on a right-to-left page. |\n| Down, Up | Moves one row, the heading row and the `load-more` row included. |\n| Home, End | Moves to the first or the last cell of the row. |\n| Control with Home or End | Moves to the first or the last cell of the grid. |\n| Page Down, Page Up | Moves by the rows that fit in view. |\n| Enter, F2 | Moves into the cell's controls. Escape moves back to the cell, and Tab moves between the controls of one cell. |\n| Enter, Space on a sortable heading | Sorts by the column. |\n| Enter, Space on the `load-more` row | Sends `helix-load-more`. |\n| Space on a row | Selects the row, in a `selectable` table. |\n| Shift with Down or Up | Selects the rows it moves across, in a `selectable` table. |\n| Shift with Space | Selects every row from the one last chosen, in a `selectable` table. |\n| Control or Command with A | Selects every row, in a `selectable` table. |\n| Right on a row header in a tree grid | Opens a closed row, and moves one cell along an open one. |\n| Left on a row header in a tree grid | Closes an open row, and moves to the parent of a closed one. |\n| A letter or a word | Moves to the next row whose row header starts with what you typed. |\n\n`selected` and `expanded` hold their keys in the order of the rows, as do\n`helix-select`, `helix-selected` and `helix-expand`.\n\nEach row is named by its row header, the column marked `row-header`, or the\nfirst column with a `field` where none is. A screen reader says it as a reader\nmoves between rows.\n\n**Rows that hold rows.** `child-field` names the field that holds a row's\nchild rows, and the grid becomes a tree grid. The row header column draws a\nmark that a press opens and closes a row by, and `expanded` holds the keys of the open\nrows, which `row-key` names. Right on a closed row's header opens it, Left on\nan open one closes it, and Left on a child moves to its parent. A sort orders\nthe rows under each parent, and a search shows the rows that lead to each\nmatch, open.\n\n`load-more` adds a row after the last one with a button that sends\n`helix-load-more`. A `windowed` table also sends it by itself once a reader\nscrolls within one screen of the end, once for each number of rows. Add the\nnext rows to `rows`, and set `loading` while they are on their way.\n\nThe controls inside the cells leave the tab order, so Tab moves past the\nwhole grid. A windowed table keeps the row holding focus drawn while the\nrest scroll away.\n\nPeople can resize and reorder the columns. `resizable` on a column puts a\nseparator on its edge. `reorderable` on the table puts a grip on each heading\nthat has a `field`, moved by dragging or with the arrow keys. The new order\nis written to `order` as a list of fields. Your markup is not rewritten: the\ntable assigns the headings to its header in that order.\n\n**`reorderable-rows` lets people move rows.** A column of grips leads each\nrow, named by `move-row-label`. Drag a grip to move its row, and the table\nscrolls near an edge. Or press Space or Enter on a grip, or click it, to pick\nup its row, move it with Down and Up, Home and End, and press Space or Enter\nagain to drop it. A click on another row drops it there, and Escape puts it\nback. The table says each step in its `live` region. A drop sends\n`helix-before-reorder`, which you can refuse, and then `helix-reorder` with\n`kind` set to `row`, whose `keys` hold every key of `rows` in the new order.\n**You move the rows**: set `rows` to the new order, and the table draws it.\nSet `row-key`, so a row is known by its key once it has moved. The grips do\nnothing while a `sort` is set, since the sort decides the order, and a tree\ngrid draws none.\n\n`csv()` returns the result as text: every row that passes the filter, in the\norder and the columns on screen. Saving the file is up to you.\n\n`DataTable` has no `columns` attribute. Each `TableColumn` is part of the\nschema, so you size a column with its own `width`. `Table` has `columns`\nbecause its cells are markup you write and it can have no columns at all.\nWritten on `DataTable`, `columns` has no effect, so watch for it when you\nmove a table from `Table` to `DataTable`.",
|
|
42205
|
+
"description": "Declare the columns as `TableColumn` children and pass the rows as an array.\nThe schema stays readable in the HTML, and the rows can be windowed, which\nten thousand row elements cannot be.\n\n```html\n<helix-headless-data-table .rows=${rows} sort=\"name:asc\" page-size=\"20\">\n <helix-headless-table-column field=\"name\" sortable>Name</helix-headless-table-column>\n <helix-headless-table-column field=\"size\" text-align=\"end\" sortable .cell=${bytes}>Size</helix-headless-table-column>\n</helix-headless-data-table>\n```\n\nFor a short table written out by hand, use `Table`, which takes rows as\nmarkup.\n\nSort and filter apply to the whole set, including the rows on other pages.\n\n**The cell values do not server-render.** The headings and the row elements\ndo. Reading a cell needs the columns, and Lit SSR does not pass the column\nchildren to this element, so a crawler sees an empty table of the right\nshape. Use `Table` when the served HTML has to carry the values.\n\n`selectable` adds a column of checkboxes, keyed on `row-key`:\n\n- A row is selected by its key, so the selection survives a sort, a filter,\n and a page change.\n- `selected` holds the chosen keys, comma separated, the same shape `Listbox`\n uses for a multiple choice. As with `sort`, writing it applies the\n selection, and `default-selected` holds what the markup declared.\n- The checkbox in the heading selects every row in the result, across pages,\n and shows a dash while only some are chosen.\n- Shift with a press on a checkbox selects every row between it and the row\n last chosen.\n- `selection-behavior=\"replace\"` makes a press or a move select the row\n alone, as a file list does. Control or Command with a press adds or takes\n out one row, and Shift with a press selects every row from the one last\n chosen.\n\nTo act on a single row, such as opening it, put a link or a button in a cell.\n\n**Keyboard.** The grid is one tab stop, and the arrow keys move between its\ncells, the headings included.\n\n| Key | What it does |\n|---|---|\n| Right, Left | Moves one cell along the row. Left moves on, on a right-to-left page. |\n| Down, Up | Moves one row, the heading row and the `load-more` row included. |\n| Home, End | Moves to the first or the last cell of the row. |\n| Control with Home or End | Moves to the first or the last cell of the grid. |\n| Page Down, Page Up | Moves by the rows that fit in view. |\n| Enter, F2 | Moves into the cell's controls. Escape moves back to the cell, and Tab moves between the controls of one cell. |\n| Enter, Space on a sortable heading | Sorts by the column. |\n| Enter, Space on the `load-more` row | Sends `helix-load-more`. |\n| Space on a row | Selects the row, in a `selectable` table. Under `selection-behavior=\"replace\"`, selects it alone, and Control or Command with Space adds or takes out the row. |\n| Down, Up, Page Down, Page Up under `selection-behavior=\"replace\"` | Selects the row it moves to alone. Control or Command with the key moves without selecting. |\n| Shift with Down or Up | Selects the rows it moves across, in a `selectable` table. |\n| Shift with Space | Selects every row from the one last chosen, in a `selectable` table. |\n| Control or Command with A | Selects every row, in a `selectable` table. |\n| Right on a row header in a tree grid | Opens a closed row, and moves one cell along an open one. |\n| Left on a row header in a tree grid | Closes an open row, and moves to the parent of a closed one. |\n| A letter or a word | Moves to the next row whose row header starts with what you typed. |\n\n`selected` and `expanded` hold their keys in the order of the rows, as do\n`helix-select`, `helix-selected` and `helix-expand`.\n\nEach row is named by its row header, the column marked `row-header`, or the\nfirst column with a `field` where none is. A screen reader says it as a reader\nmoves between rows.\n\n**Rows that hold rows.** `child-field` names the field that holds a row's\nchild rows, and the grid becomes a tree grid. The row header column draws a\nmark that a press opens and closes a row by, and `expanded` holds the keys of the open\nrows, which `row-key` names. Right on a closed row's header opens it, Left on\nan open one closes it, and Left on a child moves to its parent. A sort orders\nthe rows under each parent, and a search shows the rows that lead to each\nmatch, open.\n\n`load-more` adds a row after the last one with a button that sends\n`helix-load-more`. A `windowed` table also sends it by itself once a reader\nscrolls within one screen of the end, once for each number of rows. Add the\nnext rows to `rows`, and set `loading` while they are on their way.\n\nThe controls inside the cells leave the tab order, so Tab moves past the\nwhole grid. A windowed table keeps the row holding focus drawn while the\nrest scroll away.\n\nPeople can resize and reorder the columns. `resizable` on a column puts a\nseparator on its edge. `reorderable` on the table puts a grip on each heading\nthat has a `field`, moved by dragging or with the arrow keys. The new order\nis written to `order` as a list of fields. Your markup is not rewritten: the\ntable assigns the headings to its header in that order.\n\n**`reorderable-rows` lets people move rows.** A column of grips leads each\nrow, named by `move-row-label`. Drag a grip to move its row, and the table\nscrolls near an edge. Or press Space or Enter on a grip, or click it, to pick\nup its row, move it with Down and Up, Home and End, and press Space or Enter\nagain to drop it. A click on another row drops it there, and Escape puts it\nback. The table says each step in its `live` region. A drop sends\n`helix-before-reorder`, which you can refuse, and then `helix-reorder` with\n`kind` set to `row`, whose `keys` hold every key of `rows` in the new order.\n**You move the rows**: set `rows` to the new order, and the table draws it.\nSet `row-key`, so a row is known by its key once it has moved. The grips do\nnothing while a `sort` is set, since the sort decides the order, and a tree\ngrid draws none.\n\n`csv()` returns the result as text: every row that passes the filter, in the\norder and the columns on screen. Saving the file is up to you.\n\n`DataTable` has no `columns` attribute. Each `TableColumn` is part of the\nschema, so you size a column with its own `width`. `Table` has `columns`\nbecause its cells are markup you write and it can have no columns at all.\nWritten on `DataTable`, `columns` has no effect, so watch for it when you\nmove a table from `Table` to `DataTable`.",
|
|
41904
42206
|
"name": "HelixHeadlessDataTable",
|
|
41905
42207
|
"cssProperties": [
|
|
41906
42208
|
{
|
|
@@ -42139,10 +42441,18 @@
|
|
|
42139
42441
|
"description": "The columns, as `TableColumn` elements.",
|
|
42140
42442
|
"name": ""
|
|
42141
42443
|
},
|
|
42444
|
+
{
|
|
42445
|
+
"description": "Content shown when there are no rows to show and none are loading, such as a picture and a link. Falls back to `empty-text`, which the live region still says.",
|
|
42446
|
+
"name": "empty"
|
|
42447
|
+
},
|
|
42142
42448
|
{
|
|
42143
42449
|
"description": "Content below the grid. It replaces the built-in pagination.",
|
|
42144
42450
|
"name": "footer"
|
|
42145
42451
|
},
|
|
42452
|
+
{
|
|
42453
|
+
"description": "Content shown while the rows load, such as a spinner. Falls back to `loading-text`, which the live region still says.",
|
|
42454
|
+
"name": "loading"
|
|
42455
|
+
},
|
|
42146
42456
|
{
|
|
42147
42457
|
"description": "Content above the grid, such as a search field or actions.",
|
|
42148
42458
|
"name": "toolbar"
|
|
@@ -42173,6 +42483,20 @@
|
|
|
42173
42483
|
"module": "src/mixins/mixin-collection/mixin-collection.ts"
|
|
42174
42484
|
}
|
|
42175
42485
|
},
|
|
42486
|
+
{
|
|
42487
|
+
"kind": "field",
|
|
42488
|
+
"name": "statusSlots",
|
|
42489
|
+
"type": {
|
|
42490
|
+
"text": "boolean"
|
|
42491
|
+
},
|
|
42492
|
+
"privacy": "protected",
|
|
42493
|
+
"default": "true",
|
|
42494
|
+
"description": "The empty and loading lines are the `empty` and `loading` slots.",
|
|
42495
|
+
"inheritedFrom": {
|
|
42496
|
+
"name": "MixinCollection",
|
|
42497
|
+
"module": "src/mixins/mixin-collection/mixin-collection.ts"
|
|
42498
|
+
}
|
|
42499
|
+
},
|
|
42176
42500
|
{
|
|
42177
42501
|
"kind": "field",
|
|
42178
42502
|
"name": "ascendingLabel",
|
|
@@ -42645,6 +42969,16 @@
|
|
|
42645
42969
|
"words": true
|
|
42646
42970
|
}
|
|
42647
42971
|
},
|
|
42972
|
+
{
|
|
42973
|
+
"kind": "field",
|
|
42974
|
+
"name": "selectionBehavior",
|
|
42975
|
+
"type": {
|
|
42976
|
+
"text": "'replace' | 'toggle'"
|
|
42977
|
+
},
|
|
42978
|
+
"default": "'toggle'",
|
|
42979
|
+
"description": "What a key or a press on a row does to the rows already selected, in a\n`selectable` table. `toggle`, the default, keeps them: Space adds or takes\nout the row. `replace` selects the row alone, as a file list does: Down and\nUp carry the selection with them, and a press on a row selects it. Control\nor Command with a press or Space adds or takes out one row, and with a move\ngoes without selecting. The checkboxes add or take out one row either way.",
|
|
42980
|
+
"attribute": "selection-behavior"
|
|
42981
|
+
},
|
|
42648
42982
|
{
|
|
42649
42983
|
"kind": "field",
|
|
42650
42984
|
"name": "selectRowLabel",
|
|
@@ -43802,7 +44136,7 @@
|
|
|
43802
44136
|
"text": "void"
|
|
43803
44137
|
}
|
|
43804
44138
|
},
|
|
43805
|
-
"description": "The columns into the header row, everything else into the
|
|
44139
|
+
"description": "The columns into the header row, everything else into the slot it names.\n\nManual assignment, so a consumer's own markup is never written to."
|
|
43806
44140
|
},
|
|
43807
44141
|
{
|
|
43808
44142
|
"kind": "field",
|
|
@@ -44225,6 +44559,42 @@
|
|
|
44225
44559
|
"readonly": true,
|
|
44226
44560
|
"description": "Notes whether Shift is held, before the press reaches a checkbox, whose\nrequest carries only the state it asks for."
|
|
44227
44561
|
},
|
|
44562
|
+
{
|
|
44563
|
+
"kind": "field",
|
|
44564
|
+
"name": "replaces",
|
|
44565
|
+
"type": {
|
|
44566
|
+
"text": "boolean"
|
|
44567
|
+
},
|
|
44568
|
+
"privacy": "private",
|
|
44569
|
+
"description": "Whether a press or a move on a row selects it alone.",
|
|
44570
|
+
"readonly": true
|
|
44571
|
+
},
|
|
44572
|
+
{
|
|
44573
|
+
"kind": "method",
|
|
44574
|
+
"name": "chooseOnly",
|
|
44575
|
+
"privacy": "private",
|
|
44576
|
+
"return": {
|
|
44577
|
+
"type": {
|
|
44578
|
+
"text": "void"
|
|
44579
|
+
}
|
|
44580
|
+
},
|
|
44581
|
+
"parameters": [
|
|
44582
|
+
{
|
|
44583
|
+
"name": "row",
|
|
44584
|
+
"type": {
|
|
44585
|
+
"text": "number"
|
|
44586
|
+
}
|
|
44587
|
+
}
|
|
44588
|
+
],
|
|
44589
|
+
"description": "Selects the row at `row` on the page alone, and makes it where a range\nruns from. Asks nothing where it is already the only one selected."
|
|
44590
|
+
},
|
|
44591
|
+
{
|
|
44592
|
+
"kind": "field",
|
|
44593
|
+
"name": "handleRowClick",
|
|
44594
|
+
"privacy": "private",
|
|
44595
|
+
"readonly": true,
|
|
44596
|
+
"description": "A press on a row under `selection-behavior=\"replace\"`: it selects the row\nalone, Control or Command adds or takes out the row, and Shift selects\nevery row from the one last chosen. A press on a control in a cell, or on\nthe checkbox or grip column, is the control's."
|
|
44597
|
+
},
|
|
44228
44598
|
{
|
|
44229
44599
|
"kind": "field",
|
|
44230
44600
|
"name": "handleHeadClick",
|
|
@@ -45550,6 +45920,15 @@
|
|
|
45550
45920
|
"description": "What screen readers hear when the chosen rows change. `{count}` is how many\nrows are chosen, written in the locale, and a language that needs plural\nforms writes them: `{count, plural, one {# wybrany} few {# wybrane} many\n{# wybranych} other {# wybranego}}`.",
|
|
45551
45921
|
"fieldName": "selectedLabel"
|
|
45552
45922
|
},
|
|
45923
|
+
{
|
|
45924
|
+
"name": "selection-behavior",
|
|
45925
|
+
"type": {
|
|
45926
|
+
"text": "'replace' | 'toggle'"
|
|
45927
|
+
},
|
|
45928
|
+
"default": "'toggle'",
|
|
45929
|
+
"description": "What a key or a press on a row does to the rows already selected, in a\n`selectable` table. `toggle`, the default, keeps them: Space adds or takes\nout the row. `replace` selects the row alone, as a file list does: Down and\nUp carry the selection with them, and a press on a row selects it. Control\nor Command with a press or Space adds or takes out one row, and with a move\ngoes without selecting. The checkboxes add or take out one row either way.",
|
|
45930
|
+
"fieldName": "selectionBehavior"
|
|
45931
|
+
},
|
|
45553
45932
|
{
|
|
45554
45933
|
"name": "select-row-label",
|
|
45555
45934
|
"type": {
|
|
@@ -46027,6 +46406,10 @@
|
|
|
46027
46406
|
"description": "The help text under the field.",
|
|
46028
46407
|
"name": "hint"
|
|
46029
46408
|
},
|
|
46409
|
+
{
|
|
46410
|
+
"description": "The label, for content richer than the `label` text.",
|
|
46411
|
+
"name": "label"
|
|
46412
|
+
},
|
|
46030
46413
|
{
|
|
46031
46414
|
"description": "The icon on the calendar's next month control.",
|
|
46032
46415
|
"name": "next-icon"
|
|
@@ -47235,6 +47618,17 @@
|
|
|
47235
47618
|
"module": "src/mixins/mixin-picker-editing/mixin-picker-editing.ts"
|
|
47236
47619
|
}
|
|
47237
47620
|
},
|
|
47621
|
+
{
|
|
47622
|
+
"kind": "field",
|
|
47623
|
+
"name": "handleEditKey",
|
|
47624
|
+
"privacy": "private",
|
|
47625
|
+
"readonly": true,
|
|
47626
|
+
"description": "The first key that moves the caret or edits, while the focused field\nshows its rendering, puts the value in the field before the key acts.\n\nPicking hands focus back to a field that shows `August 5, 2026`, which is\nwhat the reader chose. `Intl` formats and does not parse, so a key that\nedited the rendering wrote text no date could be read from. The caret\nkeeps its place at the start, at the end, or around the whole text, and\ngoes to the end otherwise.",
|
|
47627
|
+
"inheritedFrom": {
|
|
47628
|
+
"name": "MixinPickerEditing",
|
|
47629
|
+
"module": "src/mixins/mixin-picker-editing/mixin-picker-editing.ts"
|
|
47630
|
+
}
|
|
47631
|
+
},
|
|
47238
47632
|
{
|
|
47239
47633
|
"kind": "field",
|
|
47240
47634
|
"name": "handleFocus",
|
|
@@ -47698,6 +48092,60 @@
|
|
|
47698
48092
|
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
47699
48093
|
}
|
|
47700
48094
|
},
|
|
48095
|
+
{
|
|
48096
|
+
"kind": "method",
|
|
48097
|
+
"name": "tokenElements",
|
|
48098
|
+
"privacy": "protected",
|
|
48099
|
+
"return": {
|
|
48100
|
+
"type": {
|
|
48101
|
+
"text": "HTMLElement[]"
|
|
48102
|
+
}
|
|
48103
|
+
},
|
|
48104
|
+
"inheritedFrom": {
|
|
48105
|
+
"name": "MixinTokens",
|
|
48106
|
+
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
48107
|
+
}
|
|
48108
|
+
},
|
|
48109
|
+
{
|
|
48110
|
+
"kind": "method",
|
|
48111
|
+
"name": "tokenStops",
|
|
48112
|
+
"privacy": "private",
|
|
48113
|
+
"return": {
|
|
48114
|
+
"type": {
|
|
48115
|
+
"text": "HTMLElement[]"
|
|
48116
|
+
}
|
|
48117
|
+
},
|
|
48118
|
+
"description": "The remove button of each token shown that has one, in order.",
|
|
48119
|
+
"inheritedFrom": {
|
|
48120
|
+
"name": "MixinTokens",
|
|
48121
|
+
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
48122
|
+
}
|
|
48123
|
+
},
|
|
48124
|
+
{
|
|
48125
|
+
"kind": "field",
|
|
48126
|
+
"name": "tokenControl",
|
|
48127
|
+
"type": {
|
|
48128
|
+
"text": "HTMLInputElement | null"
|
|
48129
|
+
},
|
|
48130
|
+
"privacy": "private",
|
|
48131
|
+
"description": "The host's text field.",
|
|
48132
|
+
"readonly": true,
|
|
48133
|
+
"inheritedFrom": {
|
|
48134
|
+
"name": "MixinTokens",
|
|
48135
|
+
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
48136
|
+
}
|
|
48137
|
+
},
|
|
48138
|
+
{
|
|
48139
|
+
"kind": "field",
|
|
48140
|
+
"name": "handleTokenKeydown",
|
|
48141
|
+
"privacy": "private",
|
|
48142
|
+
"readonly": true,
|
|
48143
|
+
"description": "The arrow keys between the tokens, and Delete or Backspace on one.\n\nThe arrow toward the end of the line moves to the next token, and past\nthe last into the text with the caret at its start. Delete or Backspace\nasks the focused token to go, as its remove button does, and focus that\nleaves with it comes back to the text.",
|
|
48144
|
+
"inheritedFrom": {
|
|
48145
|
+
"name": "MixinTokens",
|
|
48146
|
+
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
48147
|
+
}
|
|
48148
|
+
},
|
|
47701
48149
|
{
|
|
47702
48150
|
"kind": "method",
|
|
47703
48151
|
"name": "renderRest",
|
|
@@ -54442,7 +54890,7 @@
|
|
|
54442
54890
|
"declarations": [
|
|
54443
54891
|
{
|
|
54444
54892
|
"kind": "class",
|
|
54445
|
-
"description": "The separator role is on the rule inside the shadow root. A role does not\nneed to cross the shadow boundary the way an IDREF does, so it can sit on the\nrendered element. The semantics are then in the server-rendered markup, with\nno attribute written by script after the element connects.\n\n**The line is a separator**, as `<hr>` is, and as Radix Separator, React\nAria Separator, and Web Awesome's divider are. It is named by any content\nset into it, so a screen reader says \"Or, separator\" where you wrote \"Or\" on\nthe line. Set `decorative` on
|
|
54893
|
+
"description": "The separator role is on the rule inside the shadow root. A role does not\nneed to cross the shadow boundary the way an IDREF does, so it can sit on the\nrendered element. The semantics are then in the server-rendered markup, with\nno attribute written by script after the element connects.\n\n**The line is a separator**, as `<hr>` is, and as Radix Separator, React\nAria Separator, and Web Awesome's divider are. It is named by any content\nset into it, so a screen reader says \"Or, separator\" where you wrote \"Or\" on\nthe line, and the words are read once, as that name. Set words into a\nseparator and no controls, which are hidden with them. Set `decorative` on\na rule that separates nothing, such as one under a heading or between the\nfacts of a byline, and it leaves the accessibility tree.\n\nUse `orientation=\"vertical\"` between items on one line. A vertical divider\nstretches to fit its flex parent and sets no height of its own.\n\n**Inside a toolbar it runs across the toolbar** without being told: vertical\nin a horizontal toolbar and horizontal in a vertical one, with\n`aria-orientation` to match, as React Aria's separator does inside a\ntoolbar. Inside means a child of Toolbar or of the page's own\n`role=\"toolbar\"`. An `orientation` you write still wins. A server cannot see\nthe toolbar, so the turn arrives with hydration, inside the shadow root.",
|
|
54446
54894
|
"name": "HelixHeadlessDivider",
|
|
54447
54895
|
"cssParts": [
|
|
54448
54896
|
{
|
|
@@ -54468,7 +54916,7 @@
|
|
|
54468
54916
|
"text": "boolean"
|
|
54469
54917
|
},
|
|
54470
54918
|
"default": "false",
|
|
54471
|
-
"description": "Whether screen readers announce the line as a separator, which they now do\nby default
|
|
54919
|
+
"description": "Whether screen readers announce the line as a separator, which they now do\nby default.",
|
|
54472
54920
|
"attribute": "announced",
|
|
54473
54921
|
"reflects": true
|
|
54474
54922
|
},
|
|
@@ -54861,7 +55309,7 @@
|
|
|
54861
55309
|
"text": "boolean"
|
|
54862
55310
|
},
|
|
54863
55311
|
"default": "false",
|
|
54864
|
-
"description": "Whether screen readers announce the line as a separator, which they now do\nby default
|
|
55312
|
+
"description": "Whether screen readers announce the line as a separator, which they now do\nby default.",
|
|
54865
55313
|
"fieldName": "announced"
|
|
54866
55314
|
},
|
|
54867
55315
|
{
|
|
@@ -58574,6 +59022,20 @@
|
|
|
58574
59022
|
"module": "src/mixins/mixin-collection/mixin-collection.ts"
|
|
58575
59023
|
}
|
|
58576
59024
|
},
|
|
59025
|
+
{
|
|
59026
|
+
"kind": "field",
|
|
59027
|
+
"name": "statusSlots",
|
|
59028
|
+
"type": {
|
|
59029
|
+
"text": "boolean"
|
|
59030
|
+
},
|
|
59031
|
+
"privacy": "protected",
|
|
59032
|
+
"default": "false",
|
|
59033
|
+
"description": "Whether the status line is an `empty` or `loading` slot, with\n`empty-text` or `loading-text` as its fallback.\n\n**Off unless a family turns it on**, because a slot is published API:\neach family that renders one documents it in its own manifest. The live\nregion keeps saying the text either way, because a slotted picture has no\nwords to say.",
|
|
59034
|
+
"inheritedFrom": {
|
|
59035
|
+
"name": "MixinCollection",
|
|
59036
|
+
"module": "src/mixins/mixin-collection/mixin-collection.ts"
|
|
59037
|
+
}
|
|
59038
|
+
},
|
|
58577
59039
|
{
|
|
58578
59040
|
"kind": "field",
|
|
58579
59041
|
"name": "tier",
|
|
@@ -62066,7 +62528,7 @@
|
|
|
62066
62528
|
"declarations": [
|
|
62067
62529
|
{
|
|
62068
62530
|
"kind": "class",
|
|
62069
|
-
"description": "Shows one filter declared by a `FilterField`: the field, the operator, and\nthe values, with a control to remove the filter.\n\nThe operator is shown only when it is not the field's default:\n\n```\nDisposition refunded, chargeback default operator, hidden\nDisposition is not refunded chosen operator, shown\nCreated after 1 Aug a scalar field has no default\n```\n\nOmit `operator-label` for the field's default operator and pass it for every\nother operator. The code that builds the chip has the field, and the field\ndefines its default.\n\nThe chip shows a filter and does not apply it. Dismissing fires\n`helix-dismiss` as a request, as on `Tag` and `Announcement`. The chip is\nyour element in your list, so you remove it, which keeps your model and the\ndocument in step. Call `preventDefault()` on `helix-dismiss` to cancel the\ndismissal, which is also how you take control of the interaction for one\npress. `requestChange` documents the pattern.\n\n**Keyboard.** The remove button is a tab stop of its own, and Enter or Space\non it asks to remove the filter. In a `FilterInput`, Backspace in the empty\nfield asks to remove the last chip.\n\nThe remove button is named `dismiss-label` followed by the chip's words,\nsuch as \"Remove filter Status is not open\", so a row of chips says which\nfilter each button removes. Write `{label}` in `dismiss-label` to put the\nwords elsewhere.\n\nTo let the user change the operator, slot a menu trigger into `operator`.\nWith the text fallback, the operator is a label. The chip does not interpret\noperators: their meaning belongs to your domain, as `FilterOperator`\nexplains.",
|
|
62531
|
+
"description": "Shows one filter declared by a `FilterField`: the field, the operator, and\nthe values, with a control to remove the filter.\n\nThe operator is shown only when it is not the field's default:\n\n```\nDisposition refunded, chargeback default operator, hidden\nDisposition is not refunded chosen operator, shown\nCreated after 1 Aug a scalar field has no default\n```\n\nOmit `operator-label` for the field's default operator and pass it for every\nother operator. The code that builds the chip has the field, and the field\ndefines its default.\n\nThe chip shows a filter and does not apply it. Dismissing fires\n`helix-dismiss` as a request, as on `Tag` and `Announcement`. The chip is\nyour element in your list, so you remove it, which keeps your model and the\ndocument in step. Call `preventDefault()` on `helix-dismiss` to cancel the\ndismissal, which is also how you take control of the interaction for one\npress. `requestChange` documents the pattern.\n\n**Keyboard.** The remove button is a tab stop of its own, and Enter or Space\non it asks to remove the filter. In a `FilterInput`, Backspace in the empty\nfield asks to remove the last chip, the arrow keys move between the field\nand the chips, and Delete or Backspace on a chip asks to remove it.\n\nThe remove button is named `dismiss-label` followed by the chip's words,\nsuch as \"Remove filter Status is not open\", so a row of chips says which\nfilter each button removes. Write `{label}` in `dismiss-label` to put the\nwords elsewhere.\n\nTo let the user change the operator, slot a menu trigger into `operator`.\nWith the text fallback, the operator is a label. The chip does not interpret\noperators: their meaning belongs to your domain, as `FilterOperator`\nexplains.",
|
|
62070
62532
|
"name": "HelixHeadlessFilterChip",
|
|
62071
62533
|
"cssParts": [
|
|
62072
62534
|
{
|
|
@@ -64567,7 +65029,7 @@
|
|
|
64567
65029
|
"declarations": [
|
|
64568
65030
|
{
|
|
64569
65031
|
"kind": "class",
|
|
64570
|
-
"description": "Tokens are your own elements, slotted in. A filter can be a facet with a\nprefix, a saved query, or a range, and these belong to your model, so the\nelement does not render tokens from a list of strings. Removing a token is a\nrequest the element fires, and you apply it. Combobox works the other way:\nits tokens show a selection it owns, drawn from the options it was given.\n\n`value` is the typed text. Every keystroke fires `input` with the text on the\nelement, so a table can narrow as the user types. Backspace in an empty field\nfires `helix-dismiss` on the last token, the same event its remove control\nfires, so one handler covers the pointer and the keyboard.\n\n**What a form receives.** The text under `name`, and then one more entry\nunder `name` for each token, in the order the tokens stand:\n\n| Token | Entry |\n|---|---|\n| Any element with a `value` attribute | The value as written: `saved:mine` |\n| `FilterChip` with `name` and values | `status:open,pending` |\n| The same, with `operator=\"none\"` (what a typed `-status:` makes) | `-status:open,pending` |\n| The same, with any other `operator` except `any` | `created[after]:2024` |\n| A token with neither | Nothing |\n\nThe values are the chip's text outside its `field` and `operator` slots,\nwith the spaces around each comma removed. A server splits an entry at its\nfirst colon, reads a leading `-` as the negation, and reads a word in\nbrackets before the colon as the comparison.\n\n**Keyboard.** Focus stays in the text. The text names the highlighted\nsuggestion as its `aria-activedescendant`.\n\n| Key | What it does |\n|---|---|\n| Enter | Presses the highlighted suggestion. With none highlighted, reads the typed filters into chips, or submits the form when there are none. |\n| Down, Up | Moves the highlight through the suggestions, wrapping, and opens the panel. |\n| Home, End | Highlights the first or the last suggestion while the panel is open. |\n| Escape | Closes the panel and stops there, so a dialog around the field stays open. |\n| Backspace | In an empty field, asks the last token to go. |\n\n**Typed filters.** The field parses only the fields you declare. Write\n`FilterField` elements, usually inside the `FilterMenu` slotted into `start`,\nso the picker and the text share one set. On Enter, the field reads the text\nagainst them. `disposition:refunded,settled` and `-disposition:refunded` fire\n`helix-facet` exactly as ticking those values in the picker would, and the\nparsed text is removed. Everything else stays, so `refund tuesday\ndisposition:settled` is a filter and a search at once. Helix defines the\npunctuation and you define every word. `grammar.ts` has the full rule, so\nread it before you rely on it. A field with no `FilterField` in it parses\nnothing.\n\nA field whose values cannot be listed, such as `assignee:ada`, goes directly\ninside this element, outside the menu. It is not assigned to a slot, so\nnothing draws it and the menu has no page for it, and the grammar still reads\nit.\n\n**Suggestions.** Slot options into `suggestions` and the field shows them,\nmoves through them with the arrow keys, and presses one on Enter. The option\nfires its own `helix-select`, and you decide what choosing it means. Keys\nbefore a colon and values after it use the same panel with different\ncontents. `filter-suggestions` narrows the panel to the options whose words\nhold the term at the caret, after its colon, ignoring case and accents, and\nhides the rest. `readFilterText` is exported so you can narrow it yourself\nagainst partly typed text. While the panel is open, a reader hears how many\nsuggestions it offers. The panel opens when it has options and closes when it has\nnone, and a choice does not close it, so after picking a key you see its\nvalues next. Use `selectionStart` and `setSelectionRange` to write a\ncompletion back and put the caret after it, or the next parse reads the wrong\nterm.\n\n**State.** Three things have three different owners:\n\n- `value` is the text. The user types, the element applies it, and `input`\n reports it. Setting `value` seeds or corrects the text, and the next\n keystroke overwrites it, even in React. To control the value, cancel\n `helix-before-change` and write the value you want, as with every field in\n this library. `default-value` seeds the field.\n- `open` is the suggestions panel. Cancel `helix-before-open` or\n `helix-before-close` to control it, and use `default-open` to seed it.\n- Tokens are your elements in a slot and hold no state. A token goes when you\n remove it from your markup after `helix-dismiss`. A `FilterChip` naming a\n declared field works differently, because the picker holds what is ticked\n and removing the chip alone would leave its value ticked in the hidden\n menu. Its dismissal is treated as the field being filtered by nothing, so\n it fires `helix-facet` like every other change, and the chip goes when the\n filter goes.",
|
|
65032
|
+
"description": "Tokens are your own elements, slotted in. A filter can be a facet with a\nprefix, a saved query, or a range, and these belong to your model, so the\nelement does not render tokens from a list of strings. Removing a token is a\nrequest the element fires, and you apply it. Combobox works the other way:\nits tokens show a selection it owns, drawn from the options it was given.\n\n`value` is the typed text. Every keystroke fires `input` with the text on the\nelement, so a table can narrow as the user types. Backspace in an empty field\nfires `helix-dismiss` on the last token, the same event its remove control\nfires, so one handler covers the pointer and the keyboard.\n\n**What a form receives.** The text under `name`, and then one more entry\nunder `name` for each token, in the order the tokens stand:\n\n| Token | Entry |\n|---|---|\n| Any element with a `value` attribute | The value as written: `saved:mine` |\n| `FilterChip` with `name` and values | `status:open,pending` |\n| The same, with `operator=\"none\"` (what a typed `-status:` makes) | `-status:open,pending` |\n| The same, with any other `operator` except `any` | `created[after]:2024` |\n| A token with neither | Nothing |\n\nThe values are the chip's text outside its `field` and `operator` slots,\nwith the spaces around each comma removed. A server splits an entry at its\nfirst colon, reads a leading `-` as the negation, and reads a word in\nbrackets before the colon as the comparison.\n\n**Keyboard.** Focus stays in the text. The text names the highlighted\nsuggestion as its `aria-activedescendant`.\n\n| Key | What it does |\n|---|---|\n| Enter | Presses the highlighted suggestion. With none highlighted, reads the typed filters into chips, or submits the form when there are none. |\n| Down, Up | Moves the highlight through the suggestions, wrapping, and opens the panel. |\n| Home, End | Highlights the first or the last suggestion while the panel is open. |\n| Escape | Closes the panel and stops there, so a dialog around the field stays open. |\n| Backspace | In an empty field, asks the last token to go. |\n| Left | With the caret at the start of the text, moves to the last token's remove button. Right on a right-to-left page. |\n| Left, Right on a token | Move between the tokens, and past the last back to the text. |\n| Delete, Backspace on a token | Asks the token to go. |\n\n**Typed filters.** The field parses only the fields you declare. Write\n`FilterField` elements, usually inside the `FilterMenu` slotted into `start`,\nso the picker and the text share one set. On Enter, the field reads the text\nagainst them. `disposition:refunded,settled` and `-disposition:refunded` fire\n`helix-facet` exactly as ticking those values in the picker would, and the\nparsed text is removed. Everything else stays, so `refund tuesday\ndisposition:settled` is a filter and a search at once. Helix defines the\npunctuation and you define every word. `grammar.ts` has the full rule, so\nread it before you rely on it. A field with no `FilterField` in it parses\nnothing.\n\nA field whose values cannot be listed, such as `assignee:ada`, goes directly\ninside this element, outside the menu. It is not assigned to a slot, so\nnothing draws it and the menu has no page for it, and the grammar still reads\nit.\n\n**Suggestions.** Slot options into `suggestions` and the field shows them,\nmoves through them with the arrow keys, and presses one on Enter. The option\nfires its own `helix-select`, and you decide what choosing it means. Keys\nbefore a colon and values after it use the same panel with different\ncontents. `filter-suggestions` narrows the panel to the options whose words\nhold the term at the caret, after its colon, ignoring case and accents, and\nhides the rest. `readFilterText` is exported so you can narrow it yourself\nagainst partly typed text. While the panel is open, a reader hears how many\nsuggestions it offers. The panel opens when it has options and closes when it has\nnone, and a choice does not close it, so after picking a key you see its\nvalues next. Use `selectionStart` and `setSelectionRange` to write a\ncompletion back and put the caret after it, or the next parse reads the wrong\nterm.\n\n**State.** Three things have three different owners:\n\n- `value` is the text. The user types, the element applies it, and `input`\n reports it. Setting `value` seeds or corrects the text, and the next\n keystroke overwrites it, even in React. To control the value, cancel\n `helix-before-change` and write the value you want, as with every field in\n this library. `default-value` seeds the field.\n- `open` is the suggestions panel. Cancel `helix-before-open` or\n `helix-before-close` to control it, and use `default-open` to seed it.\n- Tokens are your elements in a slot and hold no state. A token goes when you\n remove it from your markup after `helix-dismiss`. A `FilterChip` naming a\n declared field works differently, because the picker holds what is ticked\n and removing the chip alone would leave its value ticked in the hidden\n menu. Its dismissal is treated as the field being filtered by nothing, so\n it fires `helix-facet` like every other change, and the chip goes when the\n filter goes.",
|
|
64571
65033
|
"name": "HelixHeadlessFilterInput",
|
|
64572
65034
|
"cssParts": [
|
|
64573
65035
|
{
|
|
@@ -65173,6 +65635,21 @@
|
|
|
65173
65635
|
"readonly": true,
|
|
65174
65636
|
"description": "The row again, whenever what is in it changes."
|
|
65175
65637
|
},
|
|
65638
|
+
{
|
|
65639
|
+
"kind": "method",
|
|
65640
|
+
"name": "tokenElements",
|
|
65641
|
+
"privacy": "protected",
|
|
65642
|
+
"return": {
|
|
65643
|
+
"type": {
|
|
65644
|
+
"text": "HTMLElement[]"
|
|
65645
|
+
}
|
|
65646
|
+
},
|
|
65647
|
+
"description": "The tokens slotted in `tags`, which the arrow keys reach from the text.",
|
|
65648
|
+
"inheritedFrom": {
|
|
65649
|
+
"name": "MixinTokens",
|
|
65650
|
+
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
65651
|
+
}
|
|
65652
|
+
},
|
|
65176
65653
|
{
|
|
65177
65654
|
"kind": "method",
|
|
65178
65655
|
"name": "removeLastToken",
|
|
@@ -65501,6 +65978,46 @@
|
|
|
65501
65978
|
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
65502
65979
|
}
|
|
65503
65980
|
},
|
|
65981
|
+
{
|
|
65982
|
+
"kind": "method",
|
|
65983
|
+
"name": "tokenStops",
|
|
65984
|
+
"privacy": "private",
|
|
65985
|
+
"return": {
|
|
65986
|
+
"type": {
|
|
65987
|
+
"text": "HTMLElement[]"
|
|
65988
|
+
}
|
|
65989
|
+
},
|
|
65990
|
+
"description": "The remove button of each token shown that has one, in order.",
|
|
65991
|
+
"inheritedFrom": {
|
|
65992
|
+
"name": "MixinTokens",
|
|
65993
|
+
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
65994
|
+
}
|
|
65995
|
+
},
|
|
65996
|
+
{
|
|
65997
|
+
"kind": "field",
|
|
65998
|
+
"name": "tokenControl",
|
|
65999
|
+
"type": {
|
|
66000
|
+
"text": "HTMLInputElement | null"
|
|
66001
|
+
},
|
|
66002
|
+
"privacy": "private",
|
|
66003
|
+
"description": "The host's text field.",
|
|
66004
|
+
"readonly": true,
|
|
66005
|
+
"inheritedFrom": {
|
|
66006
|
+
"name": "MixinTokens",
|
|
66007
|
+
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
66008
|
+
}
|
|
66009
|
+
},
|
|
66010
|
+
{
|
|
66011
|
+
"kind": "field",
|
|
66012
|
+
"name": "handleTokenKeydown",
|
|
66013
|
+
"privacy": "private",
|
|
66014
|
+
"readonly": true,
|
|
66015
|
+
"description": "The arrow keys between the tokens, and Delete or Backspace on one.\n\nThe arrow toward the end of the line moves to the next token, and past\nthe last into the text with the caret at its start. Delete or Backspace\nasks the focused token to go, as its remove button does, and focus that\nleaves with it comes back to the text.",
|
|
66016
|
+
"inheritedFrom": {
|
|
66017
|
+
"name": "MixinTokens",
|
|
66018
|
+
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
66019
|
+
}
|
|
66020
|
+
},
|
|
65504
66021
|
{
|
|
65505
66022
|
"kind": "method",
|
|
65506
66023
|
"name": "renderRest",
|
|
@@ -79991,7 +80508,7 @@
|
|
|
79991
80508
|
"declarations": [
|
|
79992
80509
|
{
|
|
79993
80510
|
"kind": "class",
|
|
79994
|
-
"description": "Renders a `<kbd>` element.\n\nEach element holds one key, except when you use `keys`. For a sequence or a\nchord, write one element per key and put the separator between them as text,\nsuch as \"then\" or \"plus\".\n\n`keys` renders the right glyphs for the platform. Given `mod`, it renders\n`⌘K` on Apple devices and `Ctrl+K` everywhere else. A `⌘K` typed into a\ntemplate is wrong for anyone on Windows.\n\nThe element binds the shortcut only when `within` is set. By default it draws\nthe key and listens for nothing.\n\n**`for` names the control the shortcut works**, and the key writes its chord\nonto that control's `aria-keyshortcuts`, in the platform's words (`Meta+K`\non an Apple keyboard, `Control+K` elsewhere), so a screen reader announces\nthe shortcut with the control. A chord the page wrote there itself is left\nalone, and the key takes back only what it added.\n\n`caps` draws a chord as a key per key: each is a `key` part and the `+`\nbetween two a `separator` part, so a sheet can draw a cap for each.\n`key-labels` renames any key, on every platform, such as\n`key-labels='{\"mod\":\"Command\"}'`. On an Apple keyboard a word joins the\nnext key with a hyphen, as in `Command-K`.\n\n**`activate` makes the shortcut work the control `for` names**, with no\nscript: `activate=\"focus\"` moves focus to it, as `/` does to a search\nfield, and `activate=\"click\"` presses it. It acts once `helix-shortcut` has\ngone out and no listener canceled it, and only where `within` listens.",
|
|
80511
|
+
"description": "Renders a `<kbd>` element.\n\nEach element holds one key, except when you use `keys`. For a sequence or a\nchord, write one element per key and put the separator between them as text,\nsuch as \"then\" or \"plus\".\n\n`keys` renders the right glyphs for the platform. Given `mod`, it renders\n`⌘K` on Apple devices and `Ctrl+K` everywhere else. A `⌘K` typed into a\ntemplate is wrong for anyone on Windows.\n\nThe element binds the shortcut only when `within` is set. By default it draws\nthe key and listens for nothing.\n\n**`for` names the control the shortcut works**, and the key writes its chord\nonto that control's `aria-keyshortcuts`, in the platform's words (`Meta+K`\non an Apple keyboard, `Control+K` elsewhere), so a screen reader announces\nthe shortcut with the control. A chord the page wrote there itself is left\nalone, and the key takes back only what it added.\n\nA chord is drawn with the platform's modifiers first, in its order, so one\n`keys` value is right everywhere: `mod+shift+p` is `⇧⌘P` on an Apple\nkeyboard and `Ctrl+Shift+P` elsewhere. Where it is drawn in glyphs, it is\nread in words, such as `Shift Command P`.\n\n`caps` draws a chord as a key per key: each is a `key` part and the `+`\nbetween two a `separator` part, so a sheet can draw a cap for each.\n`key-labels` renames any key, on every platform, such as\n`key-labels='{\"mod\":\"Command\"}'`. On an Apple keyboard a word joins the\nnext key with a hyphen, as in `Command-K`.\n\n**`activate` makes the shortcut work the control `for` names**, with no\nscript: `activate=\"focus\"` moves focus to it, as `/` does to a search\nfield, and `activate=\"click\"` presses it. It acts once `helix-shortcut` has\ngone out and no listener canceled it, and only where `within` listens.",
|
|
79995
80512
|
"name": "HelixHeadlessKbd",
|
|
79996
80513
|
"cssParts": [
|
|
79997
80514
|
{
|
|
@@ -80169,7 +80686,7 @@
|
|
|
80169
80686
|
"text": "TemplateResult"
|
|
80170
80687
|
}
|
|
80171
80688
|
},
|
|
80172
|
-
"description": "The chord under `caps`, a part for each key and for each `+` between two,\nso a sheet can draw a cap per key. Written with no space between, so a\nchord reads as the one label it was."
|
|
80689
|
+
"description": "The chord under `caps`, a part for each key and for each `+` between two,\nso a sheet can draw a cap per key. Written with no space between, so a\nchord reads as the one label it was. Where the chord is said in words,\nthe parts are hidden from a screen reader, which reads the words."
|
|
80173
80690
|
},
|
|
80174
80691
|
{
|
|
80175
80692
|
"kind": "field",
|
|
@@ -84294,7 +84811,7 @@
|
|
|
84294
84811
|
"declarations": [
|
|
84295
84812
|
{
|
|
84296
84813
|
"kind": "class",
|
|
84297
|
-
"description": "A line chart shows the shape of each series: where the readings went.\n\nThe scale covers the range of the data. Including zero in the range of a\nseries that moves between 980 and 1020 would flatten the line into a rule\nacross the top of the box. `BarChart` always starts at zero, because a bar's\nlength is its value. Set `zero` when the distance from zero is the point.\n\nEvery series shares one scale, as in the bar chart.\n\n`dashed` names the series drawn as a dashed line, such as a forecast or a\ntarget beside the readings: `dashed=\"Forecast\"`. Each takes a\n`line-dashed` part beside `line`.\n\n`area` fills each series down to the floor on its own, so the fills overlap.\nFor a total made of parts, use `Area Chart`, which stacks the series so the\ntop edge is the total and each band is a share.\n\nThe labels are HTML beside the drawing, as in `BarChart`. Text inside an\n`<svg>` that fills its box scales with the box, so the same `font-size` can\nrender at 10px in a narrow chart and 43px in a wide one.\n\nThe table is the accessible representation, and the drawing is hidden from\nscreen readers, who get the numbers. The `summary` part names the chart, from\n`label` or the table's caption, and gives each series' latest reading.\n\n**The plot is read by key.** It takes focus, named by `label` or the caption.\nThe left and right arrows move from reading to reading, Home and End go to\nthe first and the last, and the up and down arrows move among the series of\na reading. The tooltip follows, the `live` part says the reading in words,\nand Escape puts the tooltip away.",
|
|
84814
|
+
"description": "A line chart shows the shape of each series: where the readings went.\n\nThe scale covers the range of the data. Including zero in the range of a\nseries that moves between 980 and 1020 would flatten the line into a rule\nacross the top of the box. `BarChart` always starts at zero, because a bar's\nlength is its value. Set `zero` when the distance from zero is the point.\n\nEvery series shares one scale, as in the bar chart.\n\n`dashed` names the series drawn as a dashed line, such as a forecast or a\ntarget beside the readings: `dashed=\"Forecast\"`. Each takes a\n`line-dashed` part beside `line`.\n\n`area` fills each series down to the floor on its own, so the fills overlap.\nFor a total made of parts, use `Area Chart`, which stacks the series so the\ntop edge is the total and each band is a share.\n\nThe labels are HTML beside the drawing, as in `BarChart`. Text inside an\n`<svg>` that fills its box scales with the box, so the same `font-size` can\nrender at 10px in a narrow chart and 43px in a wide one.\n\n`value-axis` draws the scale's numbers beside the plot, at the levels\n`gridlines` rules, written in `locale`.\n\nThe table is the accessible representation, and the drawing is hidden from\nscreen readers, who get the numbers. The `summary` part names the chart, from\n`label` or the table's caption, and gives each series' latest reading.\n\n**The plot is read by key.** It takes focus, named by `label` or the caption.\nThe left and right arrows move from reading to reading, Home and End go to\nthe first and the last, and the up and down arrows move among the series of\na reading. The tooltip follows, the `live` part says the reading in words,\nand Escape puts the tooltip away.\n\n**A tap shows the reading under it**, and keeps it until a tap lands\nelsewhere. `helix-reading-change` says each move of the reading, by pointer,\ntap or key, and `helix-reading-press` says a reading was clicked, tapped, or\npressed with Enter or Space, for a page that opens what a reading stands for.",
|
|
84298
84815
|
"name": "HelixHeadlessLineChart",
|
|
84299
84816
|
"cssProperties": [
|
|
84300
84817
|
{
|
|
@@ -84304,6 +84821,10 @@
|
|
|
84304
84821
|
{
|
|
84305
84822
|
"description": "Where a series' last reading sits vertically, as a percentage. Written by the component.",
|
|
84306
84823
|
"name": "--chart-terminus-y"
|
|
84824
|
+
},
|
|
84825
|
+
{
|
|
84826
|
+
"description": "The width of the axis, in `ch`, set from the widest number on it. Written by the component on the axis.",
|
|
84827
|
+
"name": "--line-chart-axis"
|
|
84307
84828
|
}
|
|
84308
84829
|
],
|
|
84309
84830
|
"cssParts": [
|
|
@@ -84311,6 +84832,10 @@
|
|
|
84311
84832
|
"description": "The wash under one line, where `area` is set.",
|
|
84312
84833
|
"name": "area"
|
|
84313
84834
|
},
|
|
84835
|
+
{
|
|
84836
|
+
"description": "The numbers of the scale beside the plot, under `value-axis`.",
|
|
84837
|
+
"name": "axis"
|
|
84838
|
+
},
|
|
84314
84839
|
{
|
|
84315
84840
|
"description": "The band around the reading under the pointer.",
|
|
84316
84841
|
"name": "band"
|
|
@@ -84375,6 +84900,10 @@
|
|
|
84375
84900
|
"description": "The mark on one series' last reading.",
|
|
84376
84901
|
"name": "terminus"
|
|
84377
84902
|
},
|
|
84903
|
+
{
|
|
84904
|
+
"description": "One number on the axis, placed with `inset-block-start` at its level.",
|
|
84905
|
+
"name": "tick"
|
|
84906
|
+
},
|
|
84378
84907
|
{
|
|
84379
84908
|
"description": "The bubble, forwarded from `Tooltip`.",
|
|
84380
84909
|
"name": "tooltip"
|
|
@@ -84536,6 +85065,17 @@
|
|
|
84536
85065
|
"attribute": "terminus",
|
|
84537
85066
|
"reflects": true
|
|
84538
85067
|
},
|
|
85068
|
+
{
|
|
85069
|
+
"kind": "field",
|
|
85070
|
+
"name": "valueAxis",
|
|
85071
|
+
"type": {
|
|
85072
|
+
"text": "boolean"
|
|
85073
|
+
},
|
|
85074
|
+
"default": "false",
|
|
85075
|
+
"description": "Draws the scale's numbers beside the plot, the `axis` part, at the levels\n`gridlines` rules, so a reading can be measured off the drawing as well\nas read from the tooltip.\n\nAbsent draws none: a line read for its shape needs no numbers beside it,\nand the tooltip and the table hold every reading.",
|
|
85076
|
+
"attribute": "value-axis",
|
|
85077
|
+
"reflects": true
|
|
85078
|
+
},
|
|
84539
85079
|
{
|
|
84540
85080
|
"kind": "method",
|
|
84541
85081
|
"name": "range",
|
|
@@ -84597,6 +85137,31 @@
|
|
|
84597
85137
|
],
|
|
84598
85138
|
"description": "Where each series ends, as percentages of the drawing's own box.\n\nPercentages rather than user units, for the reason the mark is a `<span>`\nrather than a `<circle>`: `preserveAspectRatio=\"none\"` stretches the\ncoordinate space, so a length in there means two different things depending\non how wide the consumer made the chart. The host's box stretches nothing."
|
|
84599
85139
|
},
|
|
85140
|
+
{
|
|
85141
|
+
"kind": "method",
|
|
85142
|
+
"name": "renderAxis",
|
|
85143
|
+
"privacy": "protected",
|
|
85144
|
+
"return": {
|
|
85145
|
+
"type": {
|
|
85146
|
+
"text": "TemplateResult"
|
|
85147
|
+
}
|
|
85148
|
+
},
|
|
85149
|
+
"parameters": [
|
|
85150
|
+
{
|
|
85151
|
+
"name": "y",
|
|
85152
|
+
"type": {
|
|
85153
|
+
"text": "(value: number) => number"
|
|
85154
|
+
}
|
|
85155
|
+
},
|
|
85156
|
+
{
|
|
85157
|
+
"name": "domain",
|
|
85158
|
+
"type": {
|
|
85159
|
+
"text": "[number, number]"
|
|
85160
|
+
}
|
|
85161
|
+
}
|
|
85162
|
+
],
|
|
85163
|
+
"description": "The scale's numbers beside the plot, under `value-axis`, written in the\nchart's locale. A seam, so a subclass can write the numbers its own way,\nsuch as a currency."
|
|
85164
|
+
},
|
|
84600
85165
|
{
|
|
84601
85166
|
"kind": "method",
|
|
84602
85167
|
"name": "renderSummary",
|
|
@@ -85502,6 +86067,24 @@
|
|
|
85502
86067
|
}
|
|
85503
86068
|
}
|
|
85504
86069
|
],
|
|
86070
|
+
"events": [
|
|
86071
|
+
{
|
|
86072
|
+
"type": {
|
|
86073
|
+
"text": "HelixReadingChangeEvent"
|
|
86074
|
+
},
|
|
86075
|
+
"description": "The reading shown moved, or was put away: `index` is the row, or `-1` for none, with its `label`, the `series` the keys rest on, and the `pointerType` that moved it.",
|
|
86076
|
+
"name": "helix-reading-change",
|
|
86077
|
+
"reactProp": "onhelix-reading-change"
|
|
86078
|
+
},
|
|
86079
|
+
{
|
|
86080
|
+
"type": {
|
|
86081
|
+
"text": "HelixReadingPressEvent"
|
|
86082
|
+
},
|
|
86083
|
+
"description": "A reading was clicked, tapped, or pressed with Enter or Space, with the same detail as `helix-reading-change`.",
|
|
86084
|
+
"name": "helix-reading-press",
|
|
86085
|
+
"reactProp": "onhelix-reading-press"
|
|
86086
|
+
}
|
|
86087
|
+
],
|
|
85505
86088
|
"attributes": [
|
|
85506
86089
|
{
|
|
85507
86090
|
"name": "area",
|
|
@@ -85554,6 +86137,15 @@
|
|
|
85554
86137
|
"description": "The shape of the mark on each series' last reading.\n\nAbsent is a dot, and absent rather than defaulted because a reflecting\nproperty with a default writes its attribute onto a host the consumer\nrendered, which React reports as a hydration mismatch.\n\n**One per series, in a column at the far edge**, because every series here\nshares an x-axis and therefore ends at the same reading. That column is the\nuseful thing: it is where a reader looks for \"and what is it now\", which is\nthe question a sparkline's single mark answers too.\n\n`none` lets the lines stop on their own, which suits a chart read for its\nshape rather than for where it finished. `square` is the same mark with its\ncorners, for a drawing whose neighbors are square, the columns of a table\nbeside it for instance. `ring` lets the ground through, for a chart drawn\nover something busy. `triangle` points along the axis and reads as \"and\nonward\" rather than as a second claim about the data.\n\nThe shapes come from one shared sheet, the same one `Sparkline` takes, so\nthe set is identical wherever one appears. **Which is why every value is\nnamed here.** `Sparkline` shipped `square` implemented, drawn, asserted and\nundocumented until the cohort before this one; this family reads the same\nfour out of the same sheet and had left two of them unwritten, so the\nfinding arrived twice. A shared vocabulary wants naming at each door into\nit, because a reader arrives at one door and not at the set.\n\n`ring` is the one that asks something of the drawing. It leaves a hole and a\nline ends at the reading, which is the hole's center, so the `<svg>` is\nmasked with one disc per series and every stroke stops at its own ring's\ninner edge. `mask-composite: intersect` is what makes N holes out of N\nlayers; a single `mask-image` would only ever cut the last one.",
|
|
85555
86138
|
"fieldName": "terminus"
|
|
85556
86139
|
},
|
|
86140
|
+
{
|
|
86141
|
+
"name": "value-axis",
|
|
86142
|
+
"type": {
|
|
86143
|
+
"text": "boolean"
|
|
86144
|
+
},
|
|
86145
|
+
"default": "false",
|
|
86146
|
+
"description": "Draws the scale's numbers beside the plot, the `axis` part, at the levels\n`gridlines` rules, so a reading can be measured off the drawing as well\nas read from the tooltip.\n\nAbsent draws none: a line read for its shape needs no numbers beside it,\nand the tooltip and the table hold every reading.",
|
|
86147
|
+
"fieldName": "valueAxis"
|
|
86148
|
+
},
|
|
85557
86149
|
{
|
|
85558
86150
|
"name": "zero",
|
|
85559
86151
|
"type": {
|
|
@@ -89106,6 +89698,20 @@
|
|
|
89106
89698
|
"module": "src/mixins/mixin-collection/mixin-collection.ts"
|
|
89107
89699
|
}
|
|
89108
89700
|
},
|
|
89701
|
+
{
|
|
89702
|
+
"kind": "field",
|
|
89703
|
+
"name": "statusSlots",
|
|
89704
|
+
"type": {
|
|
89705
|
+
"text": "boolean"
|
|
89706
|
+
},
|
|
89707
|
+
"privacy": "protected",
|
|
89708
|
+
"default": "false",
|
|
89709
|
+
"description": "Whether the status line is an `empty` or `loading` slot, with\n`empty-text` or `loading-text` as its fallback.\n\n**Off unless a family turns it on**, because a slot is published API:\neach family that renders one documents it in its own manifest. The live\nregion keeps saying the text either way, because a slotted picture has no\nwords to say.",
|
|
89710
|
+
"inheritedFrom": {
|
|
89711
|
+
"name": "MixinCollection",
|
|
89712
|
+
"module": "src/mixins/mixin-collection/mixin-collection.ts"
|
|
89713
|
+
}
|
|
89714
|
+
},
|
|
89109
89715
|
{
|
|
89110
89716
|
"kind": "field",
|
|
89111
89717
|
"name": "defaultValue",
|
|
@@ -103377,6 +103983,20 @@
|
|
|
103377
103983
|
"module": "src/mixins/mixin-collection/mixin-collection.ts"
|
|
103378
103984
|
}
|
|
103379
103985
|
},
|
|
103986
|
+
{
|
|
103987
|
+
"kind": "field",
|
|
103988
|
+
"name": "statusSlots",
|
|
103989
|
+
"type": {
|
|
103990
|
+
"text": "boolean"
|
|
103991
|
+
},
|
|
103992
|
+
"privacy": "protected",
|
|
103993
|
+
"default": "false",
|
|
103994
|
+
"description": "Whether the status line is an `empty` or `loading` slot, with\n`empty-text` or `loading-text` as its fallback.\n\n**Off unless a family turns it on**, because a slot is published API:\neach family that renders one documents it in its own manifest. The live\nregion keeps saying the text either way, because a slotted picture has no\nwords to say.",
|
|
103995
|
+
"inheritedFrom": {
|
|
103996
|
+
"name": "MixinCollection",
|
|
103997
|
+
"module": "src/mixins/mixin-collection/mixin-collection.ts"
|
|
103998
|
+
}
|
|
103999
|
+
},
|
|
103380
104000
|
{
|
|
103381
104001
|
"kind": "field",
|
|
103382
104002
|
"name": "defaultOpen",
|
|
@@ -108423,6 +109043,20 @@
|
|
|
108423
109043
|
"module": "src/mixins/mixin-collection/mixin-collection.ts"
|
|
108424
109044
|
}
|
|
108425
109045
|
},
|
|
109046
|
+
{
|
|
109047
|
+
"kind": "field",
|
|
109048
|
+
"name": "statusSlots",
|
|
109049
|
+
"type": {
|
|
109050
|
+
"text": "boolean"
|
|
109051
|
+
},
|
|
109052
|
+
"privacy": "protected",
|
|
109053
|
+
"default": "false",
|
|
109054
|
+
"description": "Whether the status line is an `empty` or `loading` slot, with\n`empty-text` or `loading-text` as its fallback.\n\n**Off unless a family turns it on**, because a slot is published API:\neach family that renders one documents it in its own manifest. The live\nregion keeps saying the text either way, because a slotted picture has no\nwords to say.",
|
|
109055
|
+
"inheritedFrom": {
|
|
109056
|
+
"name": "MixinCollection",
|
|
109057
|
+
"module": "src/mixins/mixin-collection/mixin-collection.ts"
|
|
109058
|
+
}
|
|
109059
|
+
},
|
|
108426
109060
|
{
|
|
108427
109061
|
"kind": "field",
|
|
108428
109062
|
"name": "tier",
|
|
@@ -109705,6 +110339,15 @@
|
|
|
109705
110339
|
"readonly": true,
|
|
109706
110340
|
"description": "Relayed, because `change` does not cross a shadow boundary on its own.\n\n**Settled first.** The field's `change` arrives before its `blur`, so\nrelaying it as it came announced the number as typed, 150 in a field whose\n`max` is 100, and the clamp that followed sent `input` alone: a consumer\nsaving on `change` kept 150 while the form submitted 100."
|
|
109707
110341
|
},
|
|
110342
|
+
{
|
|
110343
|
+
"kind": "field",
|
|
110344
|
+
"name": "enterCommit",
|
|
110345
|
+
"type": {
|
|
110346
|
+
"text": "string | undefined"
|
|
110347
|
+
},
|
|
110348
|
+
"privacy": "private",
|
|
110349
|
+
"description": "The value Enter settled and announced, until the field's `change` or the next keystroke."
|
|
110350
|
+
},
|
|
109708
110351
|
{
|
|
109709
110352
|
"kind": "field",
|
|
109710
110353
|
"name": "handleKeydown",
|
|
@@ -109776,7 +110419,7 @@
|
|
|
109776
110419
|
"name": "handleKeypress",
|
|
109777
110420
|
"privacy": "private",
|
|
109778
110421
|
"readonly": true,
|
|
109779
|
-
"description": "Enter submits the form, as it does in a native text field.\n\nOn `keypress`, where the platform runs its own implicit submission, so a\nconsumer who prevents the `keydown` for Enter stops this too."
|
|
110422
|
+
"description": "Enter submits the form, as it does in a native text field.\n\nOn `keypress`, where the platform runs its own implicit submission, so a\nconsumer who prevents the `keydown` for Enter stops this too.\n\n**Settled first**, as blur settles it. The typed text is read as a number,\n`change` announces it, and the form value is written before the form is\nsubmitted, so a field showing `$2,500.50` submits 2500.5."
|
|
109780
110423
|
},
|
|
109781
110424
|
{
|
|
109782
110425
|
"kind": "field",
|
|
@@ -113888,10 +114531,18 @@
|
|
|
113888
114531
|
"description": "The option's label.",
|
|
113889
114532
|
"name": ""
|
|
113890
114533
|
},
|
|
114534
|
+
{
|
|
114535
|
+
"description": "A second line under the label, for content richer than the `description` text.",
|
|
114536
|
+
"name": "description"
|
|
114537
|
+
},
|
|
113891
114538
|
{
|
|
113892
114539
|
"description": "Content after the label, such as a shortcut or a count.",
|
|
113893
114540
|
"name": "end"
|
|
113894
114541
|
},
|
|
114542
|
+
{
|
|
114543
|
+
"description": "An icon shown while the option is chosen, in place of the check the styled option draws.",
|
|
114544
|
+
"name": "indicator"
|
|
114545
|
+
},
|
|
113895
114546
|
{
|
|
113896
114547
|
"description": "Content before the label, such as an icon or an avatar.",
|
|
113897
114548
|
"name": "start"
|
|
@@ -113943,7 +114594,7 @@
|
|
|
113943
114594
|
"type": {
|
|
113944
114595
|
"text": "string | undefined"
|
|
113945
114596
|
},
|
|
113946
|
-
"description": "A second line under the label that describes the choice.\n\nA palette row reads better as a name and a caption than as one sentence\ncarrying both: \"Helix\" and \"the design system\" are two facts, and a comma\nbetween them makes a reader parse the punctuation to find where the name\nends. Matching still reads the label, so what somebody types is matched\nagainst the name rather than against prose about it.\n\
|
|
114597
|
+
"description": "A second line under the label that describes the choice.\n\nA palette row reads better as a name and a caption than as one sentence\ncarrying both: \"Helix\" and \"the design system\" are two facts, and a comma\nbetween them makes a reader parse the punctuation to find where the name\nends. Matching still reads the label, so what somebody types is matched\nagainst the name rather than against prose about it.\n\nFor a caption richer than a string, slot it into `description`. The\nproperty is that slot's fallback inside the `description` part. With no\nproperty the slot is drawn bare, which takes no box while it is empty, so\nan option without a caption carries no empty line.\n\nIt does not reflect, per the rule that payload state stays off the host: a\nstring is not a fact a selector needs.",
|
|
113947
114598
|
"attribute": "description"
|
|
113948
114599
|
},
|
|
113949
114600
|
{
|
|
@@ -114007,6 +114658,15 @@
|
|
|
114007
114658
|
"description": "Whether this choice is currently chosen.\n\nWritten by the listbox.",
|
|
114008
114659
|
"attribute": "selected"
|
|
114009
114660
|
},
|
|
114661
|
+
{
|
|
114662
|
+
"kind": "field",
|
|
114663
|
+
"name": "selectionFollowsActive",
|
|
114664
|
+
"type": {
|
|
114665
|
+
"text": "boolean"
|
|
114666
|
+
},
|
|
114667
|
+
"default": "false",
|
|
114668
|
+
"description": "Whether the option says it is selected while the keyboard is on it.\n\nWritten by a control whose list holds suggestions, such as `FilterInput`:\nnothing there stays chosen, so the row the keyboard is on is the\nselection, as the APG combobox's list with selection that follows focus\nsays. No attribute: it is coordination between elements."
|
|
114669
|
+
},
|
|
114010
114670
|
{
|
|
114011
114671
|
"kind": "field",
|
|
114012
114672
|
"name": "target",
|
|
@@ -114451,7 +115111,7 @@
|
|
|
114451
115111
|
"type": {
|
|
114452
115112
|
"text": "string | undefined"
|
|
114453
115113
|
},
|
|
114454
|
-
"description": "A second line under the label that describes the choice.\n\nA palette row reads better as a name and a caption than as one sentence\ncarrying both: \"Helix\" and \"the design system\" are two facts, and a comma\nbetween them makes a reader parse the punctuation to find where the name\nends. Matching still reads the label, so what somebody types is matched\nagainst the name rather than against prose about it.\n\
|
|
115114
|
+
"description": "A second line under the label that describes the choice.\n\nA palette row reads better as a name and a caption than as one sentence\ncarrying both: \"Helix\" and \"the design system\" are two facts, and a comma\nbetween them makes a reader parse the punctuation to find where the name\nends. Matching still reads the label, so what somebody types is matched\nagainst the name rather than against prose about it.\n\nFor a caption richer than a string, slot it into `description`. The\nproperty is that slot's fallback inside the `description` part. With no\nproperty the slot is drawn bare, which takes no box while it is empty, so\nan option without a caption carries no empty line.\n\nIt does not reflect, per the rule that payload state stays off the host: a\nstring is not a fact a selector needs.",
|
|
114455
115115
|
"fieldName": "description"
|
|
114456
115116
|
},
|
|
114457
115117
|
{
|
|
@@ -114541,6 +115201,14 @@
|
|
|
114541
115201
|
"description": "While the keyboard is on the option, which is the option `aria-activedescendant` names.",
|
|
114542
115202
|
"name": "active"
|
|
114543
115203
|
},
|
|
115204
|
+
{
|
|
115205
|
+
"description": "While the option cannot be chosen.",
|
|
115206
|
+
"name": "disabled"
|
|
115207
|
+
},
|
|
115208
|
+
{
|
|
115209
|
+
"description": "An icon is slotted into `indicator`.",
|
|
115210
|
+
"name": "has-indicator"
|
|
115211
|
+
},
|
|
114544
115212
|
{
|
|
114545
115213
|
"description": "While the option is chosen.",
|
|
114546
115214
|
"name": "selected"
|
|
@@ -124690,9 +125358,17 @@
|
|
|
124690
125358
|
"type": {
|
|
124691
125359
|
"text": "HelixHeadlessRadio[]"
|
|
124692
125360
|
},
|
|
124693
|
-
"description": "The radios, in light-DOM order. Client only: the server has no tree.",
|
|
125361
|
+
"description": "The radios, in light-DOM order. Client only: the server has no tree.\n\nDescendants, as `Checkbox.Group` reads its boxes, so a radio inside a\nlayout wrapper of yours is one of the group's. A radio held by a group\nnested inside this one is that group's.",
|
|
124694
125362
|
"readonly": true
|
|
124695
125363
|
},
|
|
125364
|
+
{
|
|
125365
|
+
"kind": "field",
|
|
125366
|
+
"name": "observer",
|
|
125367
|
+
"type": {
|
|
125368
|
+
"text": "MutationObserver | undefined"
|
|
125369
|
+
},
|
|
125370
|
+
"privacy": "private"
|
|
125371
|
+
},
|
|
124696
125372
|
{
|
|
124697
125373
|
"kind": "field",
|
|
124698
125374
|
"name": "handleSelection",
|
|
@@ -129218,7 +129894,7 @@
|
|
|
129218
129894
|
"declarations": [
|
|
129219
129895
|
{
|
|
129220
129896
|
"kind": "class",
|
|
129221
|
-
"description": "A scatter chart shows how two measures relate. The table's first numeric\ncolumn is measured across, every other numeric column is measured up, and\neach row is one point. A table of countries with an income column and a life\nexpectancy column draws one point for each country. Each additional numeric\ncolumn is another series, in its own color.\n\nBoth axes are labeled, because both positions are values. The ticks sit at\nround numbers, and the range extends to them.\n\n`trend` draws each series' line of best fit, by least squares, across the\nplot in the series' color.\n\n**`size-by` names a third measure, drawn as each point's size**, as a bubble\nchart does: `size-by=\"Population\"` takes that column out of the series and\ngives each point an area in proportion to its row's number there. The\ntooltip and the table still say the number.\n\nThe summary gives each series' correlation coefficient and its number of\npoints. The table has every number, and the drawing is hidden from screen\nreaders.\n\n**The plot is read by key.** It takes focus, named by `label` or the caption.\nThe left and right arrows move from row to row in the table's order, Home\nand End go to the first and the last, and the up and down arrows move among\nthe series of a row. The tooltip sits on that point, the `live` part says the\nrow in words, and Escape puts the tooltip away.\n\nEach point is a `<span>` placed by percentage over the drawing, as\n`LineChart` places its end points, so points stay round when the drawing\nstretches.\n\nThe plot runs left to right in every text direction, as a number line does.\nThe plot, its axes, and the axis names sit in a `plane` part with\n`dir=\"ltr\"`. The axis names carry `dir=\"auto\"`, so a name in Arabic or Hebrew\nreads in its own direction. The summary and the tooltip bubble follow the\npage's direction.",
|
|
129897
|
+
"description": "A scatter chart shows how two measures relate. The table's first numeric\ncolumn is measured across, every other numeric column is measured up, and\neach row is one point. A table of countries with an income column and a life\nexpectancy column draws one point for each country. Each additional numeric\ncolumn is another series, in its own color.\n\nBoth axes are labeled, because both positions are values. The ticks sit at\nround numbers, and the range extends to them.\n\n`trend` draws each series' line of best fit, by least squares, across the\nplot in the series' color.\n\n**`size-by` names a third measure, drawn as each point's size**, as a bubble\nchart does: `size-by=\"Population\"` takes that column out of the series and\ngives each point an area in proportion to its row's number there. The\ntooltip and the table still say the number.\n\nThe summary gives each series' correlation coefficient and its number of\npoints. The table has every number, and the drawing is hidden from screen\nreaders.\n\n**The plot is read by key.** It takes focus, named by `label` or the caption.\nThe left and right arrows move from row to row in the table's order, Home\nand End go to the first and the last, and the up and down arrows move among\nthe series of a row. The tooltip sits on that point, the `live` part says the\nrow in words, and Escape puts the tooltip away.\n\nEach point is a `<span>` placed by percentage over the drawing, as\n`LineChart` places its end points, so points stay round when the drawing\nstretches.\n\nThe plot runs left to right in every text direction, as a number line does.\nThe plot, its axes, and the axis names sit in a `plane` part with\n`dir=\"ltr\"`. The axis names carry `dir=\"auto\"`, so a name in Arabic or Hebrew\nreads in its own direction. The summary and the tooltip bubble follow the\npage's direction.\n\n**A tap shows the reading under it**, and keeps it until a tap lands\nelsewhere. `helix-reading-change` says each move of the reading, by pointer,\ntap or key, and `helix-reading-press` says a reading was clicked, tapped, or\npressed with Enter or Space, for a page that opens what a reading stands for.",
|
|
129222
129898
|
"name": "HelixHeadlessScatterChart",
|
|
129223
129899
|
"cssProperties": [
|
|
129224
129900
|
{
|
|
@@ -129636,6 +130312,38 @@
|
|
|
129636
130312
|
"readonly": true,
|
|
129637
130313
|
"description": "The point a pointer is nearest, within reach.\n\nMeasured in the plot's pixels rather than in percent, because the plot is\nrarely square and a percent across is a different distance from a percent\nup. A mouse or a pen only, as every chart here: a finger has no hover to\nrest on a point with."
|
|
129638
130314
|
},
|
|
130315
|
+
{
|
|
130316
|
+
"kind": "field",
|
|
130317
|
+
"name": "handleTap",
|
|
130318
|
+
"privacy": "private",
|
|
130319
|
+
"readonly": true,
|
|
130320
|
+
"description": "The point a tap lands nearest, within twice a pointer's reach, a finger\nbeing broader than a cursor. It stays shown until a tap lands elsewhere."
|
|
130321
|
+
},
|
|
130322
|
+
{
|
|
130323
|
+
"kind": "method",
|
|
130324
|
+
"name": "pointNear",
|
|
130325
|
+
"privacy": "private",
|
|
130326
|
+
"return": {
|
|
130327
|
+
"type": {
|
|
130328
|
+
"text": "ScatterPoint | undefined | null"
|
|
130329
|
+
}
|
|
130330
|
+
},
|
|
130331
|
+
"parameters": [
|
|
130332
|
+
{
|
|
130333
|
+
"name": "event",
|
|
130334
|
+
"type": {
|
|
130335
|
+
"text": "PointerEvent"
|
|
130336
|
+
}
|
|
130337
|
+
},
|
|
130338
|
+
{
|
|
130339
|
+
"name": "reach",
|
|
130340
|
+
"type": {
|
|
130341
|
+
"text": "number"
|
|
130342
|
+
}
|
|
130343
|
+
}
|
|
130344
|
+
],
|
|
130345
|
+
"description": "The drawn point nearest a pointer, within `reach` pixels, `undefined` for\nnone in reach, and `null` with no plot to measure."
|
|
130346
|
+
},
|
|
129639
130347
|
{
|
|
129640
130348
|
"kind": "field",
|
|
129641
130349
|
"name": "handleLeave",
|
|
@@ -130255,6 +130963,24 @@
|
|
|
130255
130963
|
}
|
|
130256
130964
|
}
|
|
130257
130965
|
],
|
|
130966
|
+
"events": [
|
|
130967
|
+
{
|
|
130968
|
+
"type": {
|
|
130969
|
+
"text": "HelixReadingChangeEvent"
|
|
130970
|
+
},
|
|
130971
|
+
"description": "The reading shown moved, or was put away: `index` is the row, or `-1` for none, with its `label`, the `series` the keys rest on, and the `pointerType` that moved it.",
|
|
130972
|
+
"name": "helix-reading-change",
|
|
130973
|
+
"reactProp": "onhelix-reading-change"
|
|
130974
|
+
},
|
|
130975
|
+
{
|
|
130976
|
+
"type": {
|
|
130977
|
+
"text": "HelixReadingPressEvent"
|
|
130978
|
+
},
|
|
130979
|
+
"description": "A reading was clicked, tapped, or pressed with Enter or Space, with the same detail as `helix-reading-change`.",
|
|
130980
|
+
"name": "helix-reading-press",
|
|
130981
|
+
"reactProp": "onhelix-reading-press"
|
|
130982
|
+
}
|
|
130983
|
+
],
|
|
130258
130984
|
"attributes": [
|
|
130259
130985
|
{
|
|
130260
130986
|
"name": "correlation-label",
|
|
@@ -135645,6 +136371,16 @@
|
|
|
135645
136371
|
"description": "A single thumb's fill: `--slider-fraction`, and under `origin` the span\nfrom the origin to the thumb as `--slider-from` and `--slider-to`.",
|
|
135646
136372
|
"readonly": true
|
|
135647
136373
|
},
|
|
136374
|
+
{
|
|
136375
|
+
"kind": "field",
|
|
136376
|
+
"name": "axis",
|
|
136377
|
+
"type": {
|
|
136378
|
+
"text": "string"
|
|
136379
|
+
},
|
|
136380
|
+
"privacy": "private",
|
|
136381
|
+
"description": "The range's axis, written on it, so a vertical slider is vertical to the\naccessibility tree with no stylesheet: Chromium reads a range's\norientation off its writing mode and ignores `aria-orientation` there.\n`direction: rtl` puts the maximum at the top, which `vertical-lr` alone\nputs at the foot.",
|
|
136382
|
+
"readonly": true
|
|
136383
|
+
},
|
|
135648
136384
|
{
|
|
135649
136385
|
"kind": "method",
|
|
135650
136386
|
"name": "snapped",
|
|
@@ -147677,7 +148413,7 @@
|
|
|
147677
148413
|
"declarations": [
|
|
147678
148414
|
{
|
|
147679
148415
|
"kind": "class",
|
|
147680
|
-
"description": "The keyboard of a `grid` table: one tab stop among its cells, the arrow\nkeys, Home, End and the Page keys between them,
|
|
148416
|
+
"description": "The keyboard of a `grid` table: one tab stop among its cells, the arrow\nkeys, Home, End and the Page keys between them, Enter or F2 into a cell's\ncontrols, typeahead over the rows, and Shift ranges of rows.\n\n**Tab leaves the grid.** The controls in a cell are the consumer's, so their\ntab order is left as written: Tab on a cell, or past the last control of a\ncell, focuses an empty box at the grid's end (Shift: its start) and lets the\nkey go on from there, as React Aria's collections do. A control in a cell\nthat focus reaches from outside by the keyboard hands it to the stop, so the\ngrid is one stop from either side. A press, or a script focusing a cell, is\nleft where it lands, and the stop follows it.",
|
|
147681
148417
|
"name": "TableGridController",
|
|
147682
148418
|
"members": [
|
|
147683
148419
|
{
|
|
@@ -147768,6 +148504,14 @@
|
|
|
147768
148504
|
"default": "new Set<HTMLElement>()",
|
|
147769
148505
|
"description": "The cells given a `tabindex`, so a table that stops being a grid takes it back."
|
|
147770
148506
|
},
|
|
148507
|
+
{
|
|
148508
|
+
"kind": "field",
|
|
148509
|
+
"name": "typeahead",
|
|
148510
|
+
"privacy": "private",
|
|
148511
|
+
"readonly": true,
|
|
148512
|
+
"default": "new Typeahead()",
|
|
148513
|
+
"description": "The letters a reader has typed at the rows."
|
|
148514
|
+
},
|
|
147771
148515
|
{
|
|
147772
148516
|
"kind": "method",
|
|
147773
148517
|
"name": "hostConnected",
|
|
@@ -148131,7 +148875,7 @@
|
|
|
148131
148875
|
"declarations": [
|
|
148132
148876
|
{
|
|
148133
148877
|
"kind": "class",
|
|
148134
|
-
"description": "Lays out the rows on a CSS grid, so every column lines up across rows and\neach row stays a real element that can be styled, hidden, or made\ninteractive. A `<table>` layout aligns columns but limits almost everything\nelse.\n\nA grid of elements has no table structure for assistive technology, so the\nroles are set explicitly: `table`, `row`, `cell`, `columnheader`, and\n`rowheader` for a `header` cell in a row of values. Rows are\n`display: contents`, so their cells become items of the one grid.\n\n**Sorting.** A column with `sortable` and a `field` draws its heading as a\nbutton that sorts the rows by the text of its cells, numbers by their value.\nYour markup is not reordered: the table draws the rows in the sorted order.\n\n1. Each press cycles the column through ascending, descending, and the\n order the rows were written in, which keeps a server's own ranking\n reachable.\n2. `helix-sort` asks first, with `field:direction`, or empty for the written\n order. Refuse it to keep the order, or to sort the rows yourself and set\n `sort`.\n3. `helix-sorted` follows once the order stands, and `sort` holds it.\n4. The heading carries `aria-sort`, and a screen reader hears `sorted-label`\n (\"Sorted by Name, ascending\") or `unsorted-label` from a polite region.\n\nTab reaches each sort button, and Enter or Space presses it.\n\nThe `heading` slot names the table: slot a heading or a line of text into\nit, and the table is named by its words. An `aria-label` or `aria-labelledby` on the\nhost wins over it.\n\n**Selecting.** `selectable` adds a column of checkboxes.\n\n1. Each row is known by its `value`, or by its place among the rows where it\n has none, and `selected` holds the chosen keys, comma separated, the same\n shape `DataTable` uses. `default-selected` is where it starts.\n2. A row's checkbox is named by `select-row-label` (\"Select {row}\") with the\n words of the row's first cell. The checkbox in the heading selects every\n row, and shows a dash while only some are chosen.\n3. `helix-select` asks first, with every key the change would leave.\n Refuse it to keep the selection. `helix-selected` follows once it stands.\n4. A chosen row takes `:state(selected)`, and a screen reader hears\n `selected-label` (\"2 selected\") from a polite region.\n\nTab reaches each checkbox, and Space ticks it. To act on one row, put a\nlink or a button in a cell, or give the row an `href`.\n\n**Moving rows.** `reorderable` adds a column of grips before the checkboxes,\nunder a heading named by `row-grips-label`.\n\n1. Each row is known by its `value`, or by its place among the rows where it\n has none, as for selecting. Give rows a `value` when they move, so a key\n stays with its row.\n2. A grip is a button named by `move-row-label` (\"Move {row}\") with the\n words of the row's first cell. Drag it to move its row, and the page\n scrolls near an edge. Or press it with Space, Enter, or a click to pick\n the row up, move it with Up, Down, Home, and End, and press it again to\n drop it. A click on another row drops it there, and Escape puts it back.\n3. `helix-before-reorder` asks first, and `helix-reorder` follows with\n `keys`, every row's key in the new order. **You move the rows**: the\n table moves no element of yours, and focus goes back to the moved row's\n grip once you have.\n4. Each step is said in the table's live region, in words you can change:\n `picked-up-label`, `moved-label`, `dropped-label`, and `canceled-label`.\n The grips do nothing while a sort is set.\n\n**A grid.** `grid` makes the table one tab stop that the arrow keys move\nthrough cell by cell, the headings included, as React Aria's table is. The\ntable is then a `grid` and each value a `gridcell`, and the table gives\nevery cell a `tabindex` so focus can rest on it: set `grid` only where the\ncells may carry one
|
|
148878
|
+
"description": "Lays out the rows on a CSS grid, so every column lines up across rows and\neach row stays a real element that can be styled, hidden, or made\ninteractive. A `<table>` layout aligns columns but limits almost everything\nelse.\n\nA grid of elements has no table structure for assistive technology, so the\nroles are set explicitly: `table`, `row`, `cell`, `columnheader`, and\n`rowheader` for a `header` cell in a row of values. Rows are\n`display: contents`, so their cells become items of the one grid.\n\n**Sorting.** A column with `sortable` and a `field` draws its heading as a\nbutton that sorts the rows by the text of its cells, numbers by their value.\nYour markup is not reordered: the table draws the rows in the sorted order.\n\n1. Each press cycles the column through ascending, descending, and the\n order the rows were written in, which keeps a server's own ranking\n reachable.\n2. `helix-sort` asks first, with `field:direction`, or empty for the written\n order. Refuse it to keep the order, or to sort the rows yourself and set\n `sort`.\n3. `helix-sorted` follows once the order stands, and `sort` holds it.\n4. The heading carries `aria-sort`, and a screen reader hears `sorted-label`\n (\"Sorted by Name, ascending\") or `unsorted-label` from a polite region.\n\nTab reaches each sort button, and Enter or Space presses it.\n\nThe `heading` slot names the table: slot a heading or a line of text into\nit, and the table is named by its words. An `aria-label` or `aria-labelledby` on the\nhost wins over it.\n\n**Selecting.** `selectable` adds a column of checkboxes.\n\n1. Each row is known by its `value`, or by its place among the rows where it\n has none, and `selected` holds the chosen keys, comma separated, the same\n shape `DataTable` uses. `default-selected` is where it starts.\n2. A row's checkbox is named by `select-row-label` (\"Select {row}\") with the\n words of the row's first cell. The checkbox in the heading selects every\n row, and shows a dash while only some are chosen.\n3. `helix-select` asks first, with every key the change would leave.\n Refuse it to keep the selection. `helix-selected` follows once it stands.\n4. A chosen row takes `:state(selected)`, and a screen reader hears\n `selected-label` (\"2 selected\") from a polite region.\n\nTab reaches each checkbox, and Space ticks it. To act on one row, put a\nlink or a button in a cell, or give the row an `href`.\n\n**Moving rows.** `reorderable` adds a column of grips before the checkboxes,\nunder a heading named by `row-grips-label`.\n\n1. Each row is known by its `value`, or by its place among the rows where it\n has none, as for selecting. Give rows a `value` when they move, so a key\n stays with its row.\n2. A grip is a button named by `move-row-label` (\"Move {row}\") with the\n words of the row's first cell. Drag it to move its row, and the page\n scrolls near an edge. Or press it with Space, Enter, or a click to pick\n the row up, move it with Up, Down, Home, and End, and press it again to\n drop it. A click on another row drops it there, and Escape puts it back.\n3. `helix-before-reorder` asks first, and `helix-reorder` follows with\n `keys`, every row's key in the new order. **You move the rows**: the\n table moves no element of yours, and focus goes back to the moved row's\n grip once you have.\n4. Each step is said in the table's live region, in words you can change:\n `picked-up-label`, `moved-label`, `dropped-label`, and `canceled-label`.\n The grips do nothing while a sort is set.\n\n**A grid.** `grid` makes the table one tab stop that the arrow keys move\nthrough cell by cell, the headings included, as React Aria's table is. The\ntable is then a `grid` and each value a `gridcell`, and the table gives\nevery cell a `tabindex` so focus can rest on it: set `grid` only where the\ncells may carry one.\n\n| Key | What it does |\n|---|---|\n| Right, Left | Moves one cell along the row. Left moves on, on a right-to-left page. |\n| Down, Up | Moves one row, the headings included. |\n| Home, End | Moves to the first or the last cell of the row. |\n| Control with Home or End | Moves to the first or the last cell of the table. |\n| Page Down, Page Up | Moves by the rows that fit in view. |\n| Enter, F2 | Moves into the cell's links and controls. Escape or F2 moves back to the cell, and Tab moves between the controls of one cell. |\n| Enter on a cell of a row with `href` | Follows the row's link. |\n| Enter, Space on a sortable heading | Sorts by the column. |\n| Space on a row, Enter or Space on its checkbox cell | Selects the row, in a `selectable` table. |\n| Enter or Space on a grip cell | Picks the row up, or drops it, in a `reorderable` table. Up, Down, Home, and End move a row picked up, and Escape puts it back. |\n| Shift with Down or Up | Selects the rows it moves across, in a `selectable` table. |\n| Shift with Space | Selects every row from the one last chosen, in a `selectable` table. |\n| Control or Command with A | Selects every row, in a `selectable` table. |\n| A letter or a word | Moves to the next row whose first cell starts with what you typed. |\n| Tab | Leaves the table. |\n\nThe CSS custom properties listed for this component are written by it and\nread by the stylesheet that draws it. Do not set them. Each holds a number\nthe component computes and CSS cannot, so the stylesheet can draw the table\nwithout measuring anything.",
|
|
148135
148879
|
"name": "HelixHeadlessTable",
|
|
148136
148880
|
"cssProperties": [
|
|
148137
148881
|
{
|
|
@@ -148230,9 +148974,17 @@
|
|
|
148230
148974
|
"description": "The table's rows.",
|
|
148231
148975
|
"name": ""
|
|
148232
148976
|
},
|
|
148977
|
+
{
|
|
148978
|
+
"description": "Content shown when there are no rows and none are loading, such as a picture and a link. Falls back to `empty-text`, which the live region still says.",
|
|
148979
|
+
"name": "empty"
|
|
148980
|
+
},
|
|
148233
148981
|
{
|
|
148234
148982
|
"description": "Words that name the table, shown above it, such as a heading.",
|
|
148235
148983
|
"name": "heading"
|
|
148984
|
+
},
|
|
148985
|
+
{
|
|
148986
|
+
"description": "Content shown while the rows load, such as a spinner. Falls back to `loading-text`, which the live region still says.",
|
|
148987
|
+
"name": "loading"
|
|
148236
148988
|
}
|
|
148237
148989
|
],
|
|
148238
148990
|
"members": [
|
|
@@ -148250,6 +149002,20 @@
|
|
|
148250
149002
|
"module": "src/mixins/mixin-collection/mixin-collection.ts"
|
|
148251
149003
|
}
|
|
148252
149004
|
},
|
|
149005
|
+
{
|
|
149006
|
+
"kind": "field",
|
|
149007
|
+
"name": "statusSlots",
|
|
149008
|
+
"type": {
|
|
149009
|
+
"text": "boolean"
|
|
149010
|
+
},
|
|
149011
|
+
"privacy": "protected",
|
|
149012
|
+
"default": "true",
|
|
149013
|
+
"description": "The empty and loading lines are the `empty` and `loading` slots.",
|
|
149014
|
+
"inheritedFrom": {
|
|
149015
|
+
"name": "MixinCollection",
|
|
149016
|
+
"module": "src/mixins/mixin-collection/mixin-collection.ts"
|
|
149017
|
+
}
|
|
149018
|
+
},
|
|
148253
149019
|
{
|
|
148254
149020
|
"kind": "field",
|
|
148255
149021
|
"name": "ascendingLabel",
|
|
@@ -148561,7 +149327,7 @@
|
|
|
148561
149327
|
"name": "gridKeys",
|
|
148562
149328
|
"privacy": "private",
|
|
148563
149329
|
"readonly": true,
|
|
148564
|
-
"default": "new TableGridController(this, { activate: (place, event) => this.activate(place, event), columns: () => this.tableColumns.filter((column) => column.shown), lead: () => this.lead, on: () => this.grid, part: (name) => this.partNamed(name), rows: () => (this.childrenKnown ? this.arrangedRows : []), selectAll: () => this.selectable && this.requestSelected(new Set(this.
|
|
149330
|
+
"default": "new TableGridController(this, { activate: (place, event) => this.activate(place, event), columns: () => this.tableColumns.filter((column) => column.shown), lead: () => this.lead, on: () => this.grid, part: (name) => this.partNamed(name), rows: () => (this.childrenKnown ? this.arrangedRows : []), rowWords: () => this.arrangedRows.map((row) => textOf(row.children[0])), selectAll: () => this.selectable && this.requestSelected(new Set([...this.chosen, ...this.enabledKeys])), selectRange: (to, from) => this.selectRange(to, from), })",
|
|
148565
149331
|
"description": "The keyboard of a `grid` table, in `grid-controller.ts`."
|
|
148566
149332
|
},
|
|
148567
149333
|
{
|
|
@@ -148792,6 +149558,35 @@
|
|
|
148792
149558
|
"description": "Every row's key, in the order the rows are written.",
|
|
148793
149559
|
"readonly": true
|
|
148794
149560
|
},
|
|
149561
|
+
{
|
|
149562
|
+
"kind": "field",
|
|
149563
|
+
"name": "enabledKeys",
|
|
149564
|
+
"type": {
|
|
149565
|
+
"text": "string[]"
|
|
149566
|
+
},
|
|
149567
|
+
"privacy": "private",
|
|
149568
|
+
"description": "The keys of the rows that can be chosen: every row that is not `disabled`.",
|
|
149569
|
+
"readonly": true
|
|
149570
|
+
},
|
|
149571
|
+
{
|
|
149572
|
+
"kind": "method",
|
|
149573
|
+
"name": "isDisabled",
|
|
149574
|
+
"privacy": "private",
|
|
149575
|
+
"return": {
|
|
149576
|
+
"type": {
|
|
149577
|
+
"text": "boolean"
|
|
149578
|
+
}
|
|
149579
|
+
},
|
|
149580
|
+
"parameters": [
|
|
149581
|
+
{
|
|
149582
|
+
"name": "key",
|
|
149583
|
+
"type": {
|
|
149584
|
+
"text": "string"
|
|
149585
|
+
}
|
|
149586
|
+
}
|
|
149587
|
+
],
|
|
149588
|
+
"description": "Whether the row of that key is `disabled`."
|
|
149589
|
+
},
|
|
148795
149590
|
{
|
|
148796
149591
|
"kind": "method",
|
|
148797
149592
|
"name": "chooseAll",
|
|
@@ -148801,7 +149596,42 @@
|
|
|
148801
149596
|
"text": "void"
|
|
148802
149597
|
}
|
|
148803
149598
|
},
|
|
148804
|
-
"description": "The checkbox in the heading: every row, or none where
|
|
149599
|
+
"description": "The checkbox in the heading: every row that can be chosen, or none of\nthem where each already is. A `disabled` row keeps what it had."
|
|
149600
|
+
},
|
|
149601
|
+
{
|
|
149602
|
+
"kind": "field",
|
|
149603
|
+
"name": "anchorKey",
|
|
149604
|
+
"type": {
|
|
149605
|
+
"text": "string | undefined"
|
|
149606
|
+
},
|
|
149607
|
+
"privacy": "private",
|
|
149608
|
+
"default": "undefined",
|
|
149609
|
+
"description": "The key of the row a Shift range runs from: the one last chosen."
|
|
149610
|
+
},
|
|
149611
|
+
{
|
|
149612
|
+
"kind": "method",
|
|
149613
|
+
"name": "selectRange",
|
|
149614
|
+
"privacy": "private",
|
|
149615
|
+
"return": {
|
|
149616
|
+
"type": {
|
|
149617
|
+
"text": "boolean"
|
|
149618
|
+
}
|
|
149619
|
+
},
|
|
149620
|
+
"parameters": [
|
|
149621
|
+
{
|
|
149622
|
+
"name": "to",
|
|
149623
|
+
"type": {
|
|
149624
|
+
"text": "number"
|
|
149625
|
+
}
|
|
149626
|
+
},
|
|
149627
|
+
{
|
|
149628
|
+
"name": "from",
|
|
149629
|
+
"type": {
|
|
149630
|
+
"text": "number"
|
|
149631
|
+
}
|
|
149632
|
+
}
|
|
149633
|
+
],
|
|
149634
|
+
"description": "Selects every row from the one last chosen to the drawn row `to`, keeping\nwhat was already selected. With no row to run from, the range is the row\nthe reader is on, `from`, and it becomes the one to run from. Says whether\nthe table selects at all."
|
|
148805
149635
|
},
|
|
148806
149636
|
{
|
|
148807
149637
|
"kind": "method",
|
|
@@ -148826,7 +149656,7 @@
|
|
|
148826
149656
|
}
|
|
148827
149657
|
}
|
|
148828
149658
|
],
|
|
148829
|
-
"description": "One row's checkbox, ticked or not."
|
|
149659
|
+
"description": "One row's checkbox, ticked or not. It becomes the row a range runs from."
|
|
148830
149660
|
},
|
|
148831
149661
|
{
|
|
148832
149662
|
"kind": "method",
|
|
@@ -148990,7 +149820,7 @@
|
|
|
148990
149820
|
"text": "Element[]"
|
|
148991
149821
|
},
|
|
148992
149822
|
"privacy": "protected",
|
|
148993
|
-
"description": "The rows: every child that is not a column, which is what the body slot is assigned.",
|
|
149823
|
+
"description": "The rows: every child that is not a column, a heading, or the content of\nthe `empty` or `loading` slot, which is what the body slot is assigned.",
|
|
148994
149824
|
"readonly": true,
|
|
148995
149825
|
"inheritedFrom": {
|
|
148996
149826
|
"name": "MixinCollection",
|
|
@@ -149951,7 +150781,7 @@
|
|
|
149951
150781
|
"declarations": [
|
|
149952
150782
|
{
|
|
149953
150783
|
"kind": "class",
|
|
149954
|
-
"description": "The row renders its cells straight through and lays out none of them, so a\nstylesheet can place them in the table's grid and every column lines up\nacross rows. The row still exists as an element, so you can style it, hide\nit, or make it interactive.\n\nIn a `selectable` table the row draws a checkbox cell before its own cells,\nand `value` is the key the table's `selected` lists it by.\n\nIn a `reorderable` table the row draws a grip cell before those, holding a\nbutton named by the table's `move-row-label`, and `value` is the key\n`helix-reorder` lists it by. The table says which row is moving and where\nthe drop indicator is, with the `dragging`, `drop-before`, and `drop-after`\nstates.\n\n**`href` makes the whole row a link**, as a row action does in React Aria's\ntable: a press anywhere on the row follows it, except on a link or a control\nof the row's own, and Control, Command or Shift open it the way they open a\nlink. A drag that selects text follows nothing. A row in a table is not a\nstop of its own, so put the same link in a cell, usually the row header,\nwhich is what the keyboard and a screen reader reach. In a `grid` table,\nEnter on any cell of the row follows it as well.",
|
|
150784
|
+
"description": "The row renders its cells straight through and lays out none of them, so a\nstylesheet can place them in the table's grid and every column lines up\nacross rows. The row still exists as an element, so you can style it, hide\nit, or make it interactive.\n\nIn a `selectable` table the row draws a checkbox cell before its own cells,\nand `value` is the key the table's `selected` lists it by. `disabled` keeps\nthe row out of the selection and out of its link.\n\nIn a `reorderable` table the row draws a grip cell before those, holding a\nbutton named by the table's `move-row-label`, and `value` is the key\n`helix-reorder` lists it by. The table says which row is moving and where\nthe drop indicator is, with the `dragging`, `drop-before`, and `drop-after`\nstates.\n\n**`href` makes the whole row a link**, as a row action does in React Aria's\ntable: a press anywhere on the row follows it, except on a link or a control\nof the row's own, and Control, Command or Shift open it the way they open a\nlink. A drag that selects text follows nothing. A row in a table is not a\nstop of its own, so put the same link in a cell, usually the row header,\nwhich is what the keyboard and a screen reader reach. In a `grid` table,\nEnter on any cell of the row follows it as well.",
|
|
149955
150785
|
"name": "HelixHeadlessTableRow",
|
|
149956
150786
|
"cssParts": [
|
|
149957
150787
|
{
|
|
@@ -150026,6 +150856,17 @@
|
|
|
150026
150856
|
}
|
|
150027
150857
|
],
|
|
150028
150858
|
"members": [
|
|
150859
|
+
{
|
|
150860
|
+
"kind": "field",
|
|
150861
|
+
"name": "disabled",
|
|
150862
|
+
"type": {
|
|
150863
|
+
"text": "boolean"
|
|
150864
|
+
},
|
|
150865
|
+
"default": "false",
|
|
150866
|
+
"description": "Takes the row out of the table's selection and out of its link: the row's\ncheckbox is disabled, Space, Shift ranges, and the checkbox in the heading\npass over it, and a press does not follow `href`. A row already selected\nstays selected. A screen reader hears it as unavailable, and in a `grid`\ntable the arrow keys still reach it, as a disabled cell in a grid is\nreached.",
|
|
150867
|
+
"attribute": "disabled",
|
|
150868
|
+
"reflects": true
|
|
150869
|
+
},
|
|
150029
150870
|
{
|
|
150030
150871
|
"kind": "field",
|
|
150031
150872
|
"name": "href",
|
|
@@ -150453,6 +151294,15 @@
|
|
|
150453
151294
|
}
|
|
150454
151295
|
],
|
|
150455
151296
|
"attributes": [
|
|
151297
|
+
{
|
|
151298
|
+
"name": "disabled",
|
|
151299
|
+
"type": {
|
|
151300
|
+
"text": "boolean"
|
|
151301
|
+
},
|
|
151302
|
+
"default": "false",
|
|
151303
|
+
"description": "Takes the row out of the table's selection and out of its link: the row's\ncheckbox is disabled, Space, Shift ranges, and the checkbox in the heading\npass over it, and a press does not follow `href`. A row already selected\nstays selected. A screen reader hears it as unavailable, and in a `grid`\ntable the arrow keys still reach it, as a disabled cell in a grid is\nreached.",
|
|
151304
|
+
"fieldName": "disabled"
|
|
151305
|
+
},
|
|
150456
151306
|
{
|
|
150457
151307
|
"name": "href",
|
|
150458
151308
|
"type": {
|
|
@@ -150504,7 +151354,7 @@
|
|
|
150504
151354
|
"name": "drop-before"
|
|
150505
151355
|
},
|
|
150506
151356
|
{
|
|
150507
|
-
"description": "While the row has `href`, so a press on it follows the link.",
|
|
151357
|
+
"description": "While the row has `href` and is not `disabled`, so a press on it follows the link.",
|
|
150508
151358
|
"name": "link"
|
|
150509
151359
|
},
|
|
150510
151360
|
{
|
|
@@ -152510,7 +153360,7 @@
|
|
|
152510
153360
|
"declarations": [
|
|
152511
153361
|
{
|
|
152512
153362
|
"kind": "class",
|
|
152513
|
-
"description": "A part of `Tag` that holds tags as one control: a grid of rows, one tab stop\nfor the whole set. The arrow keys move between tags, Home and End go to the\nfirst and the last, and a typed letter goes to the next tag starting with\nit. Delete or Backspace removes the focused tag where it is `dismissible`,\nby sending its `helix-dismiss`: remove it from your list in the handler, and\nfocus moves to the next tag, or the previous one after the last.\n\n`selection-mode` lets a reader select tags, with Space, Enter or a press:\n`single` selects one at a time and `multiple` any number. `value` holds the\nselected tags' values, separated by commas, and a change asks with\n`helix-before-change` and tells with `change`. Enter on a tag with an\n`href` follows its link. A `disabled` tag is passed over. A selected tag\nthat is removed leaves `value`, which then sends `change`.\n\nName the set with `label`. Each tag is named by its words alone, without\nits remove button. `value` takes an array of values on the property as\nwell, as React sets `value={['Apple']}`; a press writes it back as a\nstring.\n\n**Removing the last tag keeps focus in the group.** With no tags left the\nset is a `group`, and focus moves to its `empty` part,\nwhich holds the `empty` slot: put words there such as \"No filters\" for a\nreader to hear. With nothing slotted it says `empty-label`, \"No tags\".",
|
|
153363
|
+
"description": "A part of `Tag` that holds tags as one control: a grid of rows, one tab stop\nfor the whole set. The arrow keys move between tags, Home and End go to the\nfirst and the last, and a typed letter goes to the next tag starting with\nit. Delete or Backspace removes the focused tag where it is `dismissible`,\nby sending its `helix-dismiss`: remove it from your list in the handler, and\nfocus moves to the next tag, or the previous one after the last.\n\n`selection-mode` lets a reader select tags, with Space, Enter or a press:\n`single` selects one at a time and `multiple` any number. In `multiple`,\nShift with an arrow, Home or End selects the range from the tag last\npressed to the tag focus moves to, and Control or Command with A selects\nevery tag that is not disabled. `value` holds the\nselected tags' values, separated by commas, and a change asks with\n`helix-before-change` and tells with `change`. Enter on a tag with an\n`href` follows its link. A `disabled` tag is passed over. A selected tag\nthat is removed leaves `value`, which then sends `change`.\n\nName the set with `label`. Each tag is named by its words alone, without\nits remove button. `value` takes an array of values on the property as\nwell, as React sets `value={['Apple']}`; a press writes it back as a\nstring.\n\n**Removing the last tag keeps focus in the group.** With no tags left the\nset is a `group`, and focus moves to its `empty` part,\nwhich holds the `empty` slot: put words there such as \"No filters\" for a\nreader to hear. With nothing slotted it says `empty-label`, \"No tags\".\nWhere only disabled tags are left, the first of them holds the tab stop and\ntakes focus, so the reader stays in the set.",
|
|
152514
153364
|
"name": "HelixHeadlessTagGroup",
|
|
152515
153365
|
"cssParts": [
|
|
152516
153366
|
{
|
|
@@ -152590,6 +153440,23 @@
|
|
|
152590
153440
|
"privacy": "private",
|
|
152591
153441
|
"description": "The tag the reader was last on, which keeps the tab stop."
|
|
152592
153442
|
},
|
|
153443
|
+
{
|
|
153444
|
+
"kind": "field",
|
|
153445
|
+
"name": "anchor",
|
|
153446
|
+
"type": {
|
|
153447
|
+
"text": "HelixHeadlessTag | undefined"
|
|
153448
|
+
},
|
|
153449
|
+
"privacy": "private",
|
|
153450
|
+
"description": "Where a range chosen with Shift and an arrow starts, and where it reached,\nin `multiple`: the tag last pressed or moved to without Shift."
|
|
153451
|
+
},
|
|
153452
|
+
{
|
|
153453
|
+
"kind": "field",
|
|
153454
|
+
"name": "reached",
|
|
153455
|
+
"type": {
|
|
153456
|
+
"text": "HelixHeadlessTag | undefined"
|
|
153457
|
+
},
|
|
153458
|
+
"privacy": "private"
|
|
153459
|
+
},
|
|
152593
153460
|
{
|
|
152594
153461
|
"kind": "field",
|
|
152595
153462
|
"name": "keys",
|
|
@@ -152714,6 +153581,75 @@
|
|
|
152714
153581
|
],
|
|
152715
153582
|
"description": "Selects the tag, or lets it go, asking first.\n\n`helix-before-change` carries the `value` the press would leave, and a\nlistener that refuses it keeps the selection. `change` follows once it\nhas moved."
|
|
152716
153583
|
},
|
|
153584
|
+
{
|
|
153585
|
+
"kind": "method",
|
|
153586
|
+
"name": "span",
|
|
153587
|
+
"privacy": "private",
|
|
153588
|
+
"return": {
|
|
153589
|
+
"type": {
|
|
153590
|
+
"text": "HelixHeadlessTag[]"
|
|
153591
|
+
}
|
|
153592
|
+
},
|
|
153593
|
+
"parameters": [
|
|
153594
|
+
{
|
|
153595
|
+
"name": "from",
|
|
153596
|
+
"type": {
|
|
153597
|
+
"text": "HelixHeadlessTag"
|
|
153598
|
+
}
|
|
153599
|
+
},
|
|
153600
|
+
{
|
|
153601
|
+
"name": "to",
|
|
153602
|
+
"type": {
|
|
153603
|
+
"text": "HelixHeadlessTag"
|
|
153604
|
+
}
|
|
153605
|
+
}
|
|
153606
|
+
],
|
|
153607
|
+
"description": "The reachable tags from one to the other, either way round."
|
|
153608
|
+
},
|
|
153609
|
+
{
|
|
153610
|
+
"kind": "method",
|
|
153611
|
+
"name": "extend",
|
|
153612
|
+
"privacy": "private",
|
|
153613
|
+
"return": {
|
|
153614
|
+
"type": {
|
|
153615
|
+
"text": "void"
|
|
153616
|
+
}
|
|
153617
|
+
},
|
|
153618
|
+
"parameters": [
|
|
153619
|
+
{
|
|
153620
|
+
"name": "from",
|
|
153621
|
+
"type": {
|
|
153622
|
+
"text": "HelixHeadlessTag"
|
|
153623
|
+
}
|
|
153624
|
+
},
|
|
153625
|
+
{
|
|
153626
|
+
"name": "to",
|
|
153627
|
+
"type": {
|
|
153628
|
+
"text": "HelixHeadlessTag"
|
|
153629
|
+
}
|
|
153630
|
+
}
|
|
153631
|
+
],
|
|
153632
|
+
"description": "Shift and an arrow, Home or End, in `multiple`: the range from the anchor\nto the tag focus moved to is selected, in place of the range the last such\nkey selected, as React Aria's selection extends."
|
|
153633
|
+
},
|
|
153634
|
+
{
|
|
153635
|
+
"kind": "method",
|
|
153636
|
+
"name": "choose",
|
|
153637
|
+
"privacy": "private",
|
|
153638
|
+
"return": {
|
|
153639
|
+
"type": {
|
|
153640
|
+
"text": "void"
|
|
153641
|
+
}
|
|
153642
|
+
},
|
|
153643
|
+
"parameters": [
|
|
153644
|
+
{
|
|
153645
|
+
"name": "tags",
|
|
153646
|
+
"type": {
|
|
153647
|
+
"text": "readonly HelixHeadlessTag[]"
|
|
153648
|
+
}
|
|
153649
|
+
}
|
|
153650
|
+
],
|
|
153651
|
+
"description": "Asks for `value` to hold these tags' values, in their order."
|
|
153652
|
+
},
|
|
152717
153653
|
{
|
|
152718
153654
|
"kind": "field",
|
|
152719
153655
|
"name": "handleKeydown",
|
|
@@ -153325,6 +154261,15 @@
|
|
|
153325
154261
|
"module": "src/mixins/mixin-dismissible/mixin-dismissible.ts"
|
|
153326
154262
|
}
|
|
153327
154263
|
},
|
|
154264
|
+
{
|
|
154265
|
+
"kind": "field",
|
|
154266
|
+
"name": "dismissTabStop",
|
|
154267
|
+
"type": {
|
|
154268
|
+
"text": "boolean"
|
|
154269
|
+
},
|
|
154270
|
+
"default": "true",
|
|
154271
|
+
"description": "Whether the remove button is a tab stop of its own, outside a `Tag.Group`.\n\nA field that holds tags as its tokens, such as a `multiple` Combobox,\nwrites `false`: the field's text is its one tab stop, and the arrow keys\nmove from the text to the tags. No attribute: it is coordination between\nelements, as `focusable` is."
|
|
154272
|
+
},
|
|
153328
154273
|
{
|
|
153329
154274
|
"kind": "field",
|
|
153330
154275
|
"name": "focusable",
|
|
@@ -156439,6 +157384,10 @@
|
|
|
156439
157384
|
"description": "Help under the field.",
|
|
156440
157385
|
"name": "hint"
|
|
156441
157386
|
},
|
|
157387
|
+
{
|
|
157388
|
+
"description": "The label, for content richer than the `label` text.",
|
|
157389
|
+
"name": "label"
|
|
157390
|
+
},
|
|
156442
157391
|
{
|
|
156443
157392
|
"description": "Content in the panel under the times, such as a note or an action.",
|
|
156444
157393
|
"name": "panel-footer"
|
|
@@ -157442,6 +158391,17 @@
|
|
|
157442
158391
|
"module": "src/mixins/mixin-picker-editing/mixin-picker-editing.ts"
|
|
157443
158392
|
}
|
|
157444
158393
|
},
|
|
158394
|
+
{
|
|
158395
|
+
"kind": "field",
|
|
158396
|
+
"name": "handleEditKey",
|
|
158397
|
+
"privacy": "private",
|
|
158398
|
+
"readonly": true,
|
|
158399
|
+
"description": "The first key that moves the caret or edits, while the focused field\nshows its rendering, puts the value in the field before the key acts.\n\nPicking hands focus back to a field that shows `August 5, 2026`, which is\nwhat the reader chose. `Intl` formats and does not parse, so a key that\nedited the rendering wrote text no date could be read from. The caret\nkeeps its place at the start, at the end, or around the whole text, and\ngoes to the end otherwise.",
|
|
158400
|
+
"inheritedFrom": {
|
|
158401
|
+
"name": "MixinPickerEditing",
|
|
158402
|
+
"module": "src/mixins/mixin-picker-editing/mixin-picker-editing.ts"
|
|
158403
|
+
}
|
|
158404
|
+
},
|
|
157445
158405
|
{
|
|
157446
158406
|
"kind": "field",
|
|
157447
158407
|
"name": "handleFocus",
|
|
@@ -157928,6 +158888,60 @@
|
|
|
157928
158888
|
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
157929
158889
|
}
|
|
157930
158890
|
},
|
|
158891
|
+
{
|
|
158892
|
+
"kind": "method",
|
|
158893
|
+
"name": "tokenElements",
|
|
158894
|
+
"privacy": "protected",
|
|
158895
|
+
"return": {
|
|
158896
|
+
"type": {
|
|
158897
|
+
"text": "HTMLElement[]"
|
|
158898
|
+
}
|
|
158899
|
+
},
|
|
158900
|
+
"inheritedFrom": {
|
|
158901
|
+
"name": "MixinTokens",
|
|
158902
|
+
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
158903
|
+
}
|
|
158904
|
+
},
|
|
158905
|
+
{
|
|
158906
|
+
"kind": "method",
|
|
158907
|
+
"name": "tokenStops",
|
|
158908
|
+
"privacy": "private",
|
|
158909
|
+
"return": {
|
|
158910
|
+
"type": {
|
|
158911
|
+
"text": "HTMLElement[]"
|
|
158912
|
+
}
|
|
158913
|
+
},
|
|
158914
|
+
"description": "The remove button of each token shown that has one, in order.",
|
|
158915
|
+
"inheritedFrom": {
|
|
158916
|
+
"name": "MixinTokens",
|
|
158917
|
+
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
158918
|
+
}
|
|
158919
|
+
},
|
|
158920
|
+
{
|
|
158921
|
+
"kind": "field",
|
|
158922
|
+
"name": "tokenControl",
|
|
158923
|
+
"type": {
|
|
158924
|
+
"text": "HTMLInputElement | null"
|
|
158925
|
+
},
|
|
158926
|
+
"privacy": "private",
|
|
158927
|
+
"description": "The host's text field.",
|
|
158928
|
+
"readonly": true,
|
|
158929
|
+
"inheritedFrom": {
|
|
158930
|
+
"name": "MixinTokens",
|
|
158931
|
+
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
158932
|
+
}
|
|
158933
|
+
},
|
|
158934
|
+
{
|
|
158935
|
+
"kind": "field",
|
|
158936
|
+
"name": "handleTokenKeydown",
|
|
158937
|
+
"privacy": "private",
|
|
158938
|
+
"readonly": true,
|
|
158939
|
+
"description": "The arrow keys between the tokens, and Delete or Backspace on one.\n\nThe arrow toward the end of the line moves to the next token, and past\nthe last into the text with the caret at its start. Delete or Backspace\nasks the focused token to go, as its remove button does, and focus that\nleaves with it comes back to the text.",
|
|
158940
|
+
"inheritedFrom": {
|
|
158941
|
+
"name": "MixinTokens",
|
|
158942
|
+
"module": "src/mixins/mixin-tokens/mixin-tokens.ts"
|
|
158943
|
+
}
|
|
158944
|
+
},
|
|
157931
158945
|
{
|
|
157932
158946
|
"kind": "method",
|
|
157933
158947
|
"name": "renderRest",
|
|
@@ -165486,8 +166500,17 @@
|
|
|
165486
166500
|
"text": "HelixHeadlessToggle[]"
|
|
165487
166501
|
},
|
|
165488
166502
|
"privacy": "private",
|
|
166503
|
+
"description": "The toggles, in light-DOM order, at any depth, so a toggle inside a layout\nwrapper of yours is one of the group's. A toggle held by a group nested\ninside this one is that group's.",
|
|
165489
166504
|
"readonly": true
|
|
165490
166505
|
},
|
|
166506
|
+
{
|
|
166507
|
+
"kind": "field",
|
|
166508
|
+
"name": "observer",
|
|
166509
|
+
"type": {
|
|
166510
|
+
"text": "MutationObserver | undefined"
|
|
166511
|
+
},
|
|
166512
|
+
"privacy": "private"
|
|
166513
|
+
},
|
|
165491
166514
|
{
|
|
165492
166515
|
"kind": "field",
|
|
165493
166516
|
"name": "handleSelection",
|
|
@@ -167105,7 +168128,7 @@
|
|
|
167105
168128
|
"declarations": [
|
|
167106
168129
|
{
|
|
167107
168130
|
"kind": "class",
|
|
167108
|
-
"description": "Renders a `<button role=\"radio\">` for use as a form control. In a group with\n`selection-mode=\"multiple\"` it is a `<button>` that says whether it is\npressed with `aria-pressed`.\n\nDo not use it for navigation. For navigation, use links marked with\n`aria-current` and styled by the `data-navigation-item` recipe in the base\nlayer. The recipe has the same look, and links are not announced as choices.",
|
|
168131
|
+
"description": "Renders a `<button role=\"radio\">` for use as a form control. In a group with\n`selection-mode=\"multiple\"` it is a `<button>` that says whether it is\npressed with `aria-pressed`.\n\n**On its own, outside a `Toggle.Group`, it is a toggle button**, as React\nAria's `ToggleButton`: a `<button>` with `aria-pressed`. A press, Enter or\nSpace sends `helix-select`, which you can cancel, then flips `selected` and\nsends `change`. Write `selected` in the markup to start it pressed.\n\nDo not use it for navigation. For navigation, use links marked with\n`aria-current` and styled by the `data-navigation-item` recipe in the base\nlayer. The recipe has the same look, and links are not announced as choices.",
|
|
167109
168132
|
"name": "HelixHeadlessToggle",
|
|
167110
168133
|
"cssParts": [
|
|
167111
168134
|
{
|
|
@@ -167142,7 +168165,7 @@
|
|
|
167142
168165
|
"type": {
|
|
167143
168166
|
"text": "boolean | undefined"
|
|
167144
168167
|
},
|
|
167145
|
-
"description": "Whether the item holds the group's tab stop. Unset, the
|
|
168168
|
+
"description": "Whether the item holds the group's tab stop. Unset, no group holds the\nitem, and it is a toggle button with a tab stop of its own.\n\nWritten by the group on every item: `true` for the chosen item, or for the\nfirst item that can be chosen while there is no selection to carry the\nstop, and `false` for every item, the chosen one too, while a toolbar the\ngroup sits in holds the stop. No attribute: it is coordination between\nelements, and `tabindex` on a host the consumer rendered is the change a\nReact consumer's hydration reports and does not patch up."
|
|
167146
168169
|
},
|
|
167147
168170
|
{
|
|
167148
168171
|
"kind": "field",
|
|
@@ -167152,6 +168175,33 @@
|
|
|
167152
168175
|
},
|
|
167153
168176
|
"description": "Whether the item is pressed, in a group where several can be, and\n`undefined` in a group where one is chosen.\n\nWritten by the group, like `selected`, so no attribute."
|
|
167154
168177
|
},
|
|
168178
|
+
{
|
|
168179
|
+
"kind": "field",
|
|
168180
|
+
"name": "alone",
|
|
168181
|
+
"type": {
|
|
168182
|
+
"text": "boolean"
|
|
168183
|
+
},
|
|
168184
|
+
"privacy": "private",
|
|
168185
|
+
"description": "Whether no `Toggle.Group` holds the item, which makes it a toggle button\nof its own. A group writes `focusable` on every item it holds. A server,\nand the render that hydrates its markup, cannot tell, and draw the item a\ngroup holds.",
|
|
168186
|
+
"readonly": true
|
|
168187
|
+
},
|
|
168188
|
+
{
|
|
168189
|
+
"kind": "method",
|
|
168190
|
+
"name": "select",
|
|
168191
|
+
"return": {
|
|
168192
|
+
"type": {
|
|
168193
|
+
"text": "boolean"
|
|
168194
|
+
}
|
|
168195
|
+
},
|
|
168196
|
+
"description": "Chooses the item in its group, or, on its own, flips `selected` once\n`helix-select` stands and sends `change`.",
|
|
168197
|
+
"inheritedFrom": {
|
|
168198
|
+
"name": "MixinSelectableItem",
|
|
168199
|
+
"module": "src/mixins/mixin-selectable-item/mixin-selectable-item.ts"
|
|
168200
|
+
},
|
|
168201
|
+
"type": {
|
|
168202
|
+
"text": "select() => boolean"
|
|
168203
|
+
}
|
|
168204
|
+
},
|
|
167155
168205
|
{
|
|
167156
168206
|
"kind": "field",
|
|
167157
168207
|
"name": "disabled",
|
|
@@ -167226,23 +168276,6 @@
|
|
|
167226
168276
|
"text": "focusItem() => void"
|
|
167227
168277
|
}
|
|
167228
168278
|
},
|
|
167229
|
-
{
|
|
167230
|
-
"kind": "method",
|
|
167231
|
-
"name": "select",
|
|
167232
|
-
"return": {
|
|
167233
|
-
"type": {
|
|
167234
|
-
"text": "boolean"
|
|
167235
|
-
}
|
|
167236
|
-
},
|
|
167237
|
-
"description": "Selects the item and fires `helix-select`. Returns `false` if the item is\ndisabled or a listener cancels the event.",
|
|
167238
|
-
"inheritedFrom": {
|
|
167239
|
-
"name": "MixinSelectableItem",
|
|
167240
|
-
"module": "src/mixins/mixin-selectable-item/mixin-selectable-item.ts"
|
|
167241
|
-
},
|
|
167242
|
-
"type": {
|
|
167243
|
-
"text": "select() => boolean"
|
|
167244
|
-
}
|
|
167245
|
-
},
|
|
167246
168279
|
{
|
|
167247
168280
|
"kind": "field",
|
|
167248
168281
|
"name": "tier",
|
|
@@ -167584,6 +168617,14 @@
|
|
|
167584
168617
|
}
|
|
167585
168618
|
],
|
|
167586
168619
|
"events": [
|
|
168620
|
+
{
|
|
168621
|
+
"type": {
|
|
168622
|
+
"text": "Event"
|
|
168623
|
+
},
|
|
168624
|
+
"description": "Fired after a toggle button on its own is pressed or released.",
|
|
168625
|
+
"name": "change",
|
|
168626
|
+
"reactProp": "onchange"
|
|
168627
|
+
},
|
|
167587
168628
|
{
|
|
167588
168629
|
"type": {
|
|
167589
168630
|
"text": "HelixSelectEvent"
|
|
@@ -167621,7 +168662,7 @@
|
|
|
167621
168662
|
"name": "HelixElement",
|
|
167622
168663
|
"package": "@fusion.dev/helix-core"
|
|
167623
168664
|
},
|
|
167624
|
-
"summary": "One option in a toggle group.",
|
|
168665
|
+
"summary": "One option in a toggle group, or a toggle button on its own.",
|
|
167625
168666
|
"helix": {
|
|
167626
168667
|
"category": "actions",
|
|
167627
168668
|
"since": "0.1.0",
|
|
@@ -173633,6 +174674,20 @@
|
|
|
173633
174674
|
"module": "src/mixins/mixin-collection/mixin-collection.ts"
|
|
173634
174675
|
}
|
|
173635
174676
|
},
|
|
174677
|
+
{
|
|
174678
|
+
"kind": "field",
|
|
174679
|
+
"name": "statusSlots",
|
|
174680
|
+
"type": {
|
|
174681
|
+
"text": "boolean"
|
|
174682
|
+
},
|
|
174683
|
+
"privacy": "protected",
|
|
174684
|
+
"default": "false",
|
|
174685
|
+
"description": "Whether the status line is an `empty` or `loading` slot, with\n`empty-text` or `loading-text` as its fallback.\n\n**Off unless a family turns it on**, because a slot is published API:\neach family that renders one documents it in its own manifest. The live\nregion keeps saying the text either way, because a slotted picture has no\nwords to say.",
|
|
174686
|
+
"inheritedFrom": {
|
|
174687
|
+
"name": "MixinCollection",
|
|
174688
|
+
"module": "src/mixins/mixin-collection/mixin-collection.ts"
|
|
174689
|
+
}
|
|
174690
|
+
},
|
|
173636
174691
|
{
|
|
173637
174692
|
"kind": "field",
|
|
173638
174693
|
"name": "active",
|
|
@@ -176649,7 +177704,7 @@
|
|
|
176649
177704
|
"declarations": [
|
|
176650
177705
|
{
|
|
176651
177706
|
"kind": "class",
|
|
176652
|
-
"description": "**You slot the player**, so it keeps your appearance, extra controls,\ncaptions, and poster treatment. `Sandbox` takes its preview and `Menu` its\ntrigger the same way.\n\n**Entries are markup.** React skips properties it would set imperatively\nduring hydration, so an array property on a custom element is missing on the\nfirst paint of a server-rendered page. `using-the-elements.mdx` has the\nmeasurement. Markup also makes each entry a real button with its name inside.\n\n**The playlist does not play media.** It sets `src` on the player and tracks\nwhich entry is current. The current entry moves when:\n\n- an entry is pressed,\n- the player dispatches `helix-next` or `helix-previous`, or\n- the player reaches the end.\n\nOn `ended` the playlist advances and the next clip starts playing, because\nthe user already pressed play once. `repeat` decides what happens at the\nend: `one` plays the same entry again, and `all` goes from the last entry\nback to the first. Without it, the playlist stops on the last entry and\nsends `helix-end`. `shuffle` plays the entries in a random order, starting\nfrom the one that is current, and `previous` retraces that order.\n\n**Keyboard.** Each entry is a button in the tab order, and Enter or Space\nplays it. The current entry carries `aria-current`. While focus is on the\nplayer, the player's own keys work, and `Video` lists them. Its previous\nand next controls move through the entries in the same order the playlist\ndoes.",
|
|
177707
|
+
"description": "**You slot the player**, so it keeps your appearance, extra controls,\ncaptions, and poster treatment. `Sandbox` takes its preview and `Menu` its\ntrigger the same way.\n\n**Entries are markup.** React skips properties it would set imperatively\nduring hydration, so an array property on a custom element is missing on the\nfirst paint of a server-rendered page. `using-the-elements.mdx` has the\nmeasurement. Markup also makes each entry a real button with its name inside.\n\n**The playlist does not play media.** It sets `src` on the player and tracks\nwhich entry is current. The current entry moves when:\n\n- an entry is pressed,\n- the player dispatches `helix-next` or `helix-previous`, or\n- the player reaches the end.\n\nOn `ended` the playlist advances and the next clip starts playing, because\nthe user already pressed play once. `repeat` decides what happens at the\nend: `one` plays the same entry again, and `all` goes from the last entry\nback to the first. Without it, the playlist stops on the last entry and\nsends `helix-end`. `shuffle` plays the entries in a random order, starting\nfrom the one that is current, and `previous` retraces that order.\n\n**The player is named by the current entry**, and the device's own media\ncontrols show the entry as the title. A player you gave a `label` keeps\nyour name, and only the title follows the entry.\n\n**Keyboard.** Each entry is a button in the tab order, and Enter or Space\nplays it. The current entry carries `aria-current`. While focus is on the\nplayer, the player's own keys work, and `Video` lists them. Its previous\nand next controls move through the entries in the same order the playlist\ndoes.",
|
|
176653
177708
|
"name": "HelixHeadlessVideoPlaylist",
|
|
176654
177709
|
"cssParts": [
|
|
176655
177710
|
{
|
|
@@ -178301,6 +179356,16 @@
|
|
|
178301
179356
|
"attribute": "loop",
|
|
178302
179357
|
"reflects": true
|
|
178303
179358
|
},
|
|
179359
|
+
{
|
|
179360
|
+
"kind": "field",
|
|
179361
|
+
"name": "mediaTitle",
|
|
179362
|
+
"type": {
|
|
179363
|
+
"text": "string"
|
|
179364
|
+
},
|
|
179365
|
+
"default": "''",
|
|
179366
|
+
"description": "The title the device's own media controls show while the video plays,\nsuch as on a lock screen. Empty, the default, shows `label`. A playlist\nwrites the current entry's name here.",
|
|
179367
|
+
"attribute": "media-title"
|
|
179368
|
+
},
|
|
178304
179369
|
{
|
|
178305
179370
|
"kind": "field",
|
|
178306
179371
|
"name": "moreLabel",
|
|
@@ -180037,6 +181102,15 @@
|
|
|
180037
181102
|
"description": "Whether the video starts again at the end.",
|
|
180038
181103
|
"fieldName": "loop"
|
|
180039
181104
|
},
|
|
181105
|
+
{
|
|
181106
|
+
"name": "media-title",
|
|
181107
|
+
"type": {
|
|
181108
|
+
"text": "string"
|
|
181109
|
+
},
|
|
181110
|
+
"default": "''",
|
|
181111
|
+
"description": "The title the device's own media controls show while the video plays,\nsuch as on a lock screen. Empty, the default, shows `label`. A playlist\nwrites the current entry's name here.",
|
|
181112
|
+
"fieldName": "mediaTitle"
|
|
181113
|
+
},
|
|
180040
181114
|
{
|
|
180041
181115
|
"name": "more-label",
|
|
180042
181116
|
"type": {
|
|
@@ -180727,7 +181801,7 @@
|
|
|
180727
181801
|
"declarations": [
|
|
180728
181802
|
{
|
|
180729
181803
|
"kind": "class",
|
|
180730
|
-
"description": "The items arrive as data, in one of two ways:\n\n- `items` takes an array. A framework sets it as a property, and React\n hydration keeps it.\n- `for` names a `<script type=\"application/json\">` that holds an array, which\n a server sends as markup.\n\nEach item is drawn into a row in one of two ways:\n\n- `renderItem` is a function from an item and its index to the row's\n content: a Lit template, a string, or a DOM node.\n- A `<template>` child defines one row. `data-field=\"name\"` fills an element\n with the item's `name` as text, and `data-field-href=\"url\"` writes the\n item's `url` into `href`, the same for any attribute. A field may be a path\n of keys, such as `author.name`.\n\nRows are your markup in the light DOM, so your stylesheet styles them.\n\n**A grid.** `columns` lays the items out that many to a line, as a grid of\nequal columns, and windows the set a line at a time, as React Aria's grid\nlayout does. Each item draws one element, a cell of the grid, and\n`estimate` is the height of a line. Space the items with padding inside\neach one, which the list measures with the line.\n\n**Keyboard.** The list is one tab stop.\n\n| Key | What it does |\n|---|---|\n| Down, Up | Moves to the next or the previous item, or in a grid to the item in the same column on the next or the previous line. |\n| Right, Left | In a grid, moves to the next or the previous item along the line, the other way round on a right-to-left page. |\n| Home, End | Moves to the first or the last item. |\n| Page Down, Page Up | Moves by the number of items, or of lines in a grid, on screen. |\n| A letter or a word | Moves to the next item whose text starts with what you typed. |\n| Tab | Moves into the focused row's own links and buttons, then out of the list. |\n\nAn item that is not drawn is scrolled into view and focused, so a keyboard\nreaches the whole set. When the row holding the tab stop scrolls away, the\nstop moves to the first row on screen. Typing matches each item's\n`text-field`, which is the first `data-field` of the row template by default,\nor the item itself when it is a string or a number.\n\nEach row says its place in the whole set with `aria-posinset` and\n`aria-setsize`, so a screen reader says \"4,000 of 10,000\". The row holding\nfocus stays drawn when it scrolls out.\n\n**Selecting.** `selection-mode` makes the list a list box a reader chooses\nfrom: `single` selects one item and `multiple` any number. Space or a press\nselects an item, Shift with Space, an arrow, Home, End or a press takes in\nthe items from the last one chosen, and Control or Command with A selects\nthem all, in `multiple`. `value` holds the chosen items' keys, separated by\ncommas, in the order of the set: `key-field` names each item's key, and a\nstring or a number item is its own key. A change asks with\n`helix-before-change` and tells with `change`. Each row is an `option`\nmarked `aria-selected`, so a row's own links and buttons are not reached\nthere: keep those to a list without `selection-mode`.\n\n**Loading more.** `helix-range-change` fires as the items on screen change,\nand `range` holds them. `helix-load-more` fires once a reader is within one\nscreen of the end, once for each length of the set: add to `items` and it can\nfire again. While you fetch, set `loading`: the list is busy, and a row after\nthe last item says \"Loading more\" (`loading-label`, or your own content in\nthe `loading` slot). `scrollToIndex` takes a reader to an item.\n\n**Row height.** Rows are placed by `estimate` until they are drawn. Then the\nlist reads the drawn rows' height once and places every row by it, so a\nwrong estimate still reaches the last item. Set `measured` for rows of\ndifferent heights. Once the list draws rows of different heights, such as\nrows that wrap on a narrow screen, it places each row by its own height\nwhether `measured` is set or not.\n\nThe list follows its source. A new `items` array, an edit to the script's\ntext, or a script replaced under the same id draws the new rows. A row that\nstays in view keeps its element as the list scrolls.\n\nThe viewport scrolls on this tier. It carries `data-scroller`, and `core`\nships `[data-scroller] { overflow: auto }` into every shadow root, so\n`scrollTop` works with no stylesheet. You still need to set a block size.",
|
|
181804
|
+
"description": "The items arrive as data, in one of two ways:\n\n- `items` takes an array. A framework sets it as a property, and React\n hydration keeps it.\n- `for` names a `<script type=\"application/json\">` that holds an array, which\n a server sends as markup.\n\nEach item is drawn into a row in one of two ways:\n\n- `renderItem` is a function from an item and its index to the row's\n content: a Lit template, a string, or a DOM node.\n- A `<template>` child defines one row. `data-field=\"name\"` fills an element\n with the item's `name` as text, and `data-field-href=\"url\"` writes the\n item's `url` into `href`, the same for any attribute. A field may be a path\n of keys, such as `author.name`.\n\nRows are your markup in the light DOM, so your stylesheet styles them.\n\n**A grid.** `columns` lays the items out that many to a line, as a grid of\nequal columns, and windows the set a line at a time, as React Aria's grid\nlayout does. Each item draws one element, a cell of the grid, and\n`estimate` is the height of a line. Space the items with padding inside\neach one, which the list measures with the line.\n\n**Keyboard.** The list is one tab stop.\n\n| Key | What it does |\n|---|---|\n| Down, Up | Moves to the next or the previous item, or in a grid to the item in the same column on the next or the previous line. |\n| Right, Left | In a grid, moves to the next or the previous item along the line, the other way round on a right-to-left page. |\n| Home, End | Moves to the first or the last item. |\n| Page Down, Page Up | Moves by the number of items, or of lines in a grid, on screen. |\n| A letter or a word | Moves to the next item whose text starts with what you typed. |\n| Tab | Moves into the focused row's own links and buttons, then out of the list. |\n\nAn item that is not drawn is scrolled into view and focused, so a keyboard\nreaches the whole set. When the row holding the tab stop scrolls away, the\nstop moves to the first row on screen. Typing matches each item's\n`text-field`, which is the first `data-field` of the row template by default,\nor the item itself when it is a string or a number.\n\nEach row says its place in the whole set with `aria-posinset` and\n`aria-setsize`, so a screen reader says \"4,000 of 10,000\". The row holding\nfocus stays drawn when it scrolls out.\n\n**Selecting.** `selection-mode` makes the list a list box a reader chooses\nfrom: `single` selects one item and `multiple` any number. Space or a press\nselects an item, Shift with Space, an arrow, Home, End or a press takes in\nthe items from the last one chosen, and Control or Command with A selects\nthem all, in `multiple`. `value` holds the chosen items' keys, separated by\ncommas, in the order of the set: `key-field` names each item's key, and a\nstring or a number item is its own key. A change asks with\n`helix-before-change` and tells with `change`. Each row is an `option`\nmarked `aria-selected`, so a row's own links and buttons are not reached\nthere: keep those to a list without `selection-mode`.\n\n**Loading more.** `helix-range-change` fires as the items on screen change,\nand `range` holds them. `helix-load-more` fires once a reader is within one\nscreen of the end, once for each length of the set: add to `items` and it can\nfire again. While you fetch, set `loading`: the list is busy, and a row after\nthe last item says \"Loading more\" (`loading-label`, or your own content in\nthe `loading` slot). `scrollToIndex` takes a reader to an item.\n\n**An empty list.** Set `empty-label`, or put your own content in the `empty`\nslot, for a row shown when there are no items and none are loading, such as\n\"No messages yet\" and a link to write one. Without either, an empty list\nshows nothing, since a list whose items have not arrived yet has not said\nit has none.\n\n**Row height.** Rows are placed by `estimate` until they are drawn. Then the\nlist reads the drawn rows' height once and places every row by it, so a\nwrong estimate still reaches the last item. Set `measured` for rows of\ndifferent heights. Once the list draws rows of different heights, such as\nrows that wrap on a narrow screen, it places each row by its own height\nwhether `measured` is set or not.\n\nThe list follows its source. A new `items` array, an edit to the script's\ntext, or a script replaced under the same id draws the new rows. A row that\nstays in view keeps its element as the list scrolls.\n\nThe viewport scrolls on this tier. It carries `data-scroller`, and `core`\nships `[data-scroller] { overflow: auto }` into every shadow root, so\n`scrollTop` works with no stylesheet. You still need to set a block size.",
|
|
180731
181805
|
"name": "HelixHeadlessVirtualList",
|
|
180732
181806
|
"cssParts": [
|
|
180733
181807
|
{
|
|
@@ -180738,6 +181812,10 @@
|
|
|
180738
181812
|
"description": "The space that stands in for the rows above the rendered ones.",
|
|
180739
181813
|
"name": "before"
|
|
180740
181814
|
},
|
|
181815
|
+
{
|
|
181816
|
+
"description": "The row shown when there are no items and none are loading, where `empty-label` or the `empty` slot gives it content.",
|
|
181817
|
+
"name": "empty"
|
|
181818
|
+
},
|
|
180741
181819
|
{
|
|
180742
181820
|
"description": "The row after the last item while `loading` is set.",
|
|
180743
181821
|
"name": "loading"
|
|
@@ -180752,6 +181830,10 @@
|
|
|
180752
181830
|
"description": "The `<template>` that defines one row. The list writes the rows it renders beside it, and this slot shows them between the two spacers.",
|
|
180753
181831
|
"name": ""
|
|
180754
181832
|
},
|
|
181833
|
+
{
|
|
181834
|
+
"description": "Content for the row shown when there are no items and none are loading. Falls back to `empty-label`.",
|
|
181835
|
+
"name": "empty"
|
|
181836
|
+
},
|
|
180755
181837
|
{
|
|
180756
181838
|
"description": "Content for the row after the last item while `loading` is set. Falls back to `loading-label`.",
|
|
180757
181839
|
"name": "loading"
|
|
@@ -180778,6 +181860,16 @@
|
|
|
180778
181860
|
"description": "How many items a line holds. One, the default, is a list; more lays the\nitems out as a grid of that many equal columns, windowed a line at a\ntime, with Left and Right moving along a line.",
|
|
180779
181861
|
"attribute": "columns"
|
|
180780
181862
|
},
|
|
181863
|
+
{
|
|
181864
|
+
"kind": "field",
|
|
181865
|
+
"name": "emptyLabel",
|
|
181866
|
+
"type": {
|
|
181867
|
+
"text": "string"
|
|
181868
|
+
},
|
|
181869
|
+
"default": "''",
|
|
181870
|
+
"description": "The text of the row shown when there are no items and none are loading,\nwhere the `empty` slot is empty. Empty, the default, shows no row.",
|
|
181871
|
+
"attribute": "empty-label"
|
|
181872
|
+
},
|
|
180781
181873
|
{
|
|
180782
181874
|
"kind": "field",
|
|
180783
181875
|
"name": "estimate",
|
|
@@ -181339,7 +182431,7 @@
|
|
|
181339
182431
|
"name": "handleFocusOut",
|
|
181340
182432
|
"privacy": "private",
|
|
181341
182433
|
"readonly": true,
|
|
181342
|
-
"description": "The row kept for focus is let go once focus has left it."
|
|
182434
|
+
"description": "The row kept for focus is let go once focus has left it.\n\n**A task later, and not at once.** Between `focusout` and `focusin` the\npage's focus is on `<body>`, and Chromium runs microtasks there when a key\nmoves focus. An update asked for here ran in that gap: Tab from a kept row\nto its own link found no row holding focus, removed the row, and the link\nwent with it, leaving focus on `<body>`. A move to a control inside this\nlist asks for its own update in `handleFocusIn`, so it needs nothing here."
|
|
181343
182435
|
},
|
|
181344
182436
|
{
|
|
181345
182437
|
"kind": "field",
|
|
@@ -181880,6 +182972,15 @@
|
|
|
181880
182972
|
"description": "How many items a line holds. One, the default, is a list; more lays the\nitems out as a grid of that many equal columns, windowed a line at a\ntime, with Left and Right moving along a line.",
|
|
181881
182973
|
"fieldName": "columns"
|
|
181882
182974
|
},
|
|
182975
|
+
{
|
|
182976
|
+
"name": "empty-label",
|
|
182977
|
+
"type": {
|
|
182978
|
+
"text": "string"
|
|
182979
|
+
},
|
|
182980
|
+
"default": "''",
|
|
182981
|
+
"description": "The text of the row shown when there are no items and none are loading,\nwhere the `empty` slot is empty. Empty, the default, shows no row.",
|
|
182982
|
+
"fieldName": "emptyLabel"
|
|
182983
|
+
},
|
|
181883
182984
|
{
|
|
181884
182985
|
"name": "estimate",
|
|
181885
182986
|
"type": {
|
|
@@ -182029,6 +183130,6 @@
|
|
|
182029
183130
|
],
|
|
182030
183131
|
"helix": {
|
|
182031
183132
|
"package": "@fusion.dev/helix-headless",
|
|
182032
|
-
"version": "0.
|
|
183133
|
+
"version": "0.151.0"
|
|
182033
183134
|
}
|
|
182034
183135
|
}
|