@fusion.dev/helix-headless 0.110.0 → 0.110.2

package/custom-elements.json

@@ -62374,9 +62374,10 @@
               "kind": "field",
               "name": "label",
               "type": {
-                "text": "string | undefined"
+                "text": "string"
               },
-              "description": "The area's name, used in the frame's list.",
+              "default": "'Area'",
+              "description": "The area's name, used in the frame's list and its tile in the layers\nmenu. Defaults to \"Area\", so neither is ever a control with no name.",
               "attribute": "label"
             },
             {
@@ -62743,9 +62744,10 @@
             {
               "name": "label",
               "type": {
-                "text": "string | undefined"
+                "text": "string"
               },
-              "description": "The area's name, used in the frame's list.",
+              "default": "'Area'",
+              "description": "The area's name, used in the frame's list and its tile in the layers\nmenu. Defaults to \"Area\", so neither is ever a control with no name.",
               "fieldName": "label"
             },
             {
@@ -64529,6 +64531,16 @@
               "description": "The word added after a passed place's name. Defaults to \"passed\".",
               "attribute": "passed-label"
             },
+            {
+              "kind": "field",
+              "name": "handingOver",
+              "type": {
+                "text": "boolean"
+              },
+              "privacy": "private",
+              "default": "false",
+              "description": "Whether focus is on this marker as it is gathered, and so has to move on."
+            },
             {
               "kind": "method",
               "name": "extent",
@@ -65133,9 +65145,10 @@
               "kind": "field",
               "name": "label",
               "type": {
-                "text": "string | undefined"
+                "text": "string"
               },
-              "description": "The layer's name, used in the frame's list.",
+              "default": "'Places'",
+              "description": "The layer's name, used in the frame's list, its tile in the layers menu,\nand the group of places the keyboard walks. Defaults to \"Places\".",
               "attribute": "label"
             },
             {
@@ -65658,9 +65671,10 @@
             {
               "name": "label",
               "type": {
-                "text": "string | undefined"
+                "text": "string"
               },
-              "description": "The layer's name, used in the frame's list.",
+              "default": "'Places'",
+              "description": "The layer's name, used in the frame's list, its tile in the layers menu,\nand the group of places the keyboard walks. Defaults to \"Places\".",
               "fieldName": "label"
             },
             {
@@ -65827,9 +65841,10 @@
               "kind": "field",
               "name": "label",
               "type": {
-                "text": "string | undefined"
+                "text": "string"
               },
-              "description": "What it is, such as \"Van 12\". Read by screen readers.",
+              "default": "'Live position'",
+              "description": "What it is, such as \"Van 12\". Read by screen readers. Defaults to \"Live position\".",
               "attribute": "label"
             },
             {
@@ -66258,9 +66273,10 @@
             {
               "name": "label",
               "type": {
-                "text": "string | undefined"
+                "text": "string"
               },
-              "description": "What it is, such as \"Van 12\". Read by screen readers.",
+              "default": "'Live position'",
+              "description": "What it is, such as \"Van 12\". Read by screen readers. Defaults to \"Live position\".",
               "fieldName": "label"
             },
             {
@@ -66423,9 +66439,10 @@
               "kind": "field",
               "name": "label",
               "type": {
-                "text": "string | undefined"
+                "text": "string"
               },
-              "description": "The layer's name in the frame's list.",
+              "default": "'Overlay'",
+              "description": "The layer's name in the frame's list and its tile in the layers menu.\nDefaults to \"Overlay\", so neither is ever a control with no name.",
               "attribute": "label"
             },
             {
@@ -66893,9 +66910,10 @@
             {
               "name": "label",
               "type": {
-                "text": "string | undefined"
+                "text": "string"
               },
-              "description": "The layer's name in the frame's list.",
+              "default": "'Overlay'",
+              "description": "The layer's name in the frame's list and its tile in the layers menu.\nDefaults to \"Overlay\", so neither is ever a control with no name.",
               "fieldName": "label"
             },
             {
@@ -67427,7 +67445,7 @@
                   "text": "void"
                 }
               },
-              "description": "Says the map has moved, where a reader asked it to.\n\n**Called by whatever moves the map**, as `connectMap` does on every frame\nthe view moves. The frame's keys and buttons only ask, and nothing moves\nuntil something answers, so the frame says nothing until it is told the\nview moved: an announcement for a move that never happened is worse than\nnone. A page moving its own map in answer to `helix-map-pan` calls this\nonce it has.\n\nWhat is said waits for the view to settle, so a held key or a long\nanimation is one sentence, and it is the view's state where there is one:\nthe zoom level, the way the map faces, its tilt. A pan has no state to\nsay, so it says which way the map moved.",
+              "description": "Says the map has moved, where a reader asked it to.\n\n**Called by whatever moves the map**, as `connectMap` does on every frame\nthe view moves. The frame's keys and buttons only ask, and nothing moves\nuntil something answers, so the frame says nothing until it is told the\nview moved: an announcement for a move that never happened is worse than\nnone. A page moving its own map in answer to `helix-map-pan` sets\n`zoomLevel`, `bearing` and `pitch` to where the map now is and then calls\nthis, since those are what is said.\n\nWhat is said waits for the view to settle, so a held key or a long\nanimation is one sentence, and it is the view's state where there is one:\nthe zoom level, the way the map faces, its tilt. A pan has no state to\nsay, so it says which way the map moved.",
               "type": {
                 "text": "moved() => void"
               }
@@ -67520,6 +67538,25 @@
               "description": "The imagery among the layers: raster layers drawn as the ground, which the\nmap types show and hide rather than a tile of their own.",
               "readonly": true
             },
+            {
+              "kind": "method",
+              "name": "shown",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "layer",
+                  "type": {
+                    "text": "MapLayer"
+                  }
+                }
+              ],
+              "description": "Whether a layer is drawn: not hidden, and, for imagery of the ground, while\na map type shows imagery.\n\n**The map type decides imagery without writing onto it.** It set `hidden`\non the consumer's own `<helix-map-raster ground>`, before anyone had asked,\nwhich is an attribute their server never sent: the hydration mismatch the\narea rules record. `connectMap` asks the same question."
+            },
             {
               "kind": "method",
               "name": "nameOf",
@@ -67606,7 +67643,7 @@
               "name": "keys",
               "privacy": "protected",
               "readonly": true,
-              "default": "new KeyboardNavigationController(this, { items: () => this.markers.map( (marker, at): NavigableItem => ({ /* The marker itself, as a browser retargets a press from its shadow root to it, or a node inside that root, as an engine that does not retarget reports it. */ contains: (node) => node !== null && (marker.contains(node) || marker.shadowRoot?.contains(node) === true), /* Hidden inside a cluster, which the walk reaches instead. */ disabled: marker.gatheredBy !== undefined, /* The stop moves with the walk rather than waiting to hear focus arrive: a focus event from inside a marker's own shadow root is one an engine can fail to carry out to the frame, and the stop is the walk's to keep. */ focusItem: () => { this.stop = at marker.focus() }, select: () => {}, selected: false, }), ), origin: 'focus', selects: () => false, })"
+              "default": "new KeyboardNavigationController(this, { items: () => this.markers.map( (marker, at): NavigableItem => ({ /* The marker itself, as a browser retargets a press from its shadow root to it, or a node inside that root, as an engine that does not retarget reports it. */ contains: (node) => node !== null && (marker.contains(node) || marker.shadowRoot?.contains(node) === true), /* Hidden inside a cluster, which the walk reaches instead, or with no place to stand, which a stylesheet cannot show: a walk that stopped there moved the stop to a marker nothing could focus. */ disabled: marker.gatheredBy !== undefined || !placed(marker), /* The stop moves with the walk rather than waiting to hear focus arrive: a focus event from inside a marker's own shadow root is one an engine can fail to carry out to the frame, and the stop is the walk's to keep. */ focusItem: () => { this.stop = at marker.focus() }, select: () => {}, selected: false, }), ), origin: 'focus', selects: () => false, })"
             },
             {
               "kind": "method",
@@ -69270,9 +69307,10 @@
               "kind": "field",
               "name": "label",
               "type": {
-                "text": "string | undefined"
+                "text": "string"
               },
-              "description": "The route's name, used in the frame's list.",
+              "default": "'Route'",
+              "description": "The route's name, used in the frame's list and its tile in the layers\nmenu. Defaults to \"Route\", so neither is ever a control with no name.",
               "attribute": "label"
             },
             {
@@ -69648,9 +69686,10 @@
             {
               "name": "label",
               "type": {
-                "text": "string | undefined"
+                "text": "string"
               },
-              "description": "The route's name, used in the frame's list.",
+              "default": "'Route'",
+              "description": "The route's name, used in the frame's list and its tile in the layers\nmenu. Defaults to \"Route\", so neither is ever a control with no name.",
               "fieldName": "label"
             },
             {

package/dist/color-picker/root/color-picker-root.js

@@ -175,6 +175,7 @@ let HelixHeadlessColorPicker = class HelixHeadlessColorPicker extends MixinContr
         hint: channel-hint, label: channel-label, marker: channel-marker,
         marker-label: channel-marker-label, markers: channel-markers, output: channel-output"
       data-channel=${channel}
+      aria-invalid=${this.invalid ? 'true' : nothing}
       label=${label}
       max=${max}
       min="0"
@@ -254,6 +255,7 @@ let HelixHeadlessColorPicker = class HelixHeadlessColorPicker extends MixinContr
           min="0"
           max="100"
           aria-label=${this.saturationLabel}
+          aria-invalid=${this.invalid ? 'true' : nothing}
           .value=${String(color.saturation)}
           ?disabled=${this.isDisabled}
           @input=${(event) => this.takeArea('saturation', event)}
@@ -264,6 +266,7 @@ let HelixHeadlessColorPicker = class HelixHeadlessColorPicker extends MixinContr
           min="0"
           max="100"
           aria-label=${this.brightnessLabel}
+          aria-invalid=${this.invalid ? 'true' : nothing}
           .value=${String(color.brightness)}
           ?disabled=${this.isDisabled}
           @input=${(event) => this.takeArea('brightness', event)}
@@ -298,6 +301,7 @@ let HelixHeadlessColorPicker = class HelixHeadlessColorPicker extends MixinContr
                 part="value"
                 type="text"
                 aria-label=${this.valueLabel}
+                aria-invalid=${this.invalid ? 'true' : nothing}
                 autocomplete=${this.autocomplete || nothing}
                 spellcheck="false"
                 .value=${this.value}

package/dist/map/area/map-area.d.ts

@@ -30,8 +30,11 @@ export declare class HelixHeadlessMapArea extends HelixElement {
     readonly isMapLayer = true;
     /** @internal Which kind of layer, which is how the connector draws it. */
     readonly layerKind: 'area' | 'route';
-    /** The area's name, used in the frame's list. */
-    label?: string;
+    /**
+     * The area's name, used in the frame's list and its tile in the layers
+     * menu. Defaults to "Area", so neither is ever a control with no name.
+     */
+    label: string;
     /**
      * The corners of the shape, in order. The last point connects back to the
      * first.

package/dist/map/area/map-area.js

@@ -13,6 +13,7 @@ let HelixHeadlessMapArea = class HelixHeadlessMapArea extends HelixElement {
         super(...arguments);
         this.isMapLayer = true;
         this.layerKind = 'area';
+        this.label = 'Area';
     }
     updated(changed) {
         super.updated(changed);

package/dist/map/marker/map-marker.d.ts

@@ -95,6 +95,8 @@ export declare class HelixHeadlessMapMarker extends HelixElement {
     passed: boolean;
     /** The word added after a passed place's name. Defaults to "passed". */
     passedLabel: string;
+    /** Whether focus is on this marker as it is gathered, and so has to move on. */
+    private handingOver;
     protected willUpdate(changed: PropertyValues): void;
     /**
      * Tells the connector the place moved or was renamed, which moves the point

package/dist/map/marker/map-marker.js

@@ -28,9 +28,14 @@ let HelixHeadlessMapMarker = class HelixHeadlessMapMarker extends HelixElement {
         this.name = '';
         this.passed = false;
         this.passedLabel = 'passed';
+        this.handingOver = false;
     }
     willUpdate(changed) {
         super.willUpdate(changed);
+        this.handingOver =
+            changed.has('gatheredBy') &&
+                this.gatheredBy !== undefined &&
+                this.getRootNode().activeElement === this;
         this.toggleState('behind', this.behind);
         this.toggleState('cluster', this.gathered.length > 1);
         this.toggleState('clustered', this.gatheredBy !== undefined);
@@ -44,6 +49,10 @@ let HelixHeadlessMapMarker = class HelixHeadlessMapMarker extends HelixElement {
     }
     updated(changed) {
         super.updated(changed);
+        if (this.handingOver) {
+            this.handingOver = false;
+            this.gatheredBy?.focus();
+        }
         const keys = [...changed.keys()];
         if (keys.some((key) => key === 'gathered' || key === 'gatheredBy')) {
             this.dispatchEvent(new HelixMapPartChangeEvent({ kind: 'cluster' }));

package/dist/map/points/map-points.d.ts

@@ -96,8 +96,11 @@ export declare class HelixHeadlessMapPoints extends HelixElement {
     group?: string;
     /** Marks this as a layer for the frame and the connector, whatever its tag. */
     readonly isMapLayer = true;
-    /** The layer's name, used in the frame's list. */
-    label?: string;
+    /**
+     * The layer's name, used in the frame's list, its tile in the layers menu,
+     * and the group of places the keyboard walks. Defaults to "Places".
+     */
+    label: string;
     /** @internal Which kind of layer, which is how the connector draws it. */
     readonly layerKind: 'points';
     /** The GeoJSON property each point is named by. Defaults to `name`. */

package/dist/map/points/map-points.js

@@ -14,6 +14,7 @@ let HelixHeadlessMapPoints = class HelixHeadlessMapPoints extends HelixElement {
         this.cluster = false;
         this.countLabel = '{count} places';
         this.isMapLayer = true;
+        this.label = 'Places';
         this.layerKind = 'points';
         this.nameKey = 'name';
         this.walk = [];

package/dist/map/position/map-position.d.ts

@@ -43,8 +43,8 @@ export declare class HelixHeadlessMapPosition extends HelixElement {
     heading?: number;
     /** Marks this as a position for the connector, whatever its tag. */
     readonly isMapPosition = true;
-    /** What it is, such as "Van 12". Read by screen readers. */
-    label?: string;
+    /** What it is, such as "Van 12". Read by screen readers. Defaults to "Live position". */
+    label: string;
     /** Latitude, in degrees. */
     lat?: number;
     /** Longitude, in degrees. */

package/dist/map/position/map-position.js

@@ -12,6 +12,7 @@ let HelixHeadlessMapPosition = class HelixHeadlessMapPosition extends HelixEleme
         super(...arguments);
         this.announceEvery = 5000;
         this.isMapPosition = true;
+        this.label = 'Live position';
         this.spoken = '';
         this.spokenAt = Number.NEGATIVE_INFINITY;
     }

package/dist/map/raster/map-raster.d.ts

@@ -54,8 +54,11 @@ export declare class HelixHeadlessMapRaster extends HelixElement {
     readonly isMapLayer = true;
     /** @internal Which kind of layer, which is how the connector draws it. */
     readonly layerKind: 'raster';
-    /** The layer's name in the frame's list. */
-    label?: string;
+    /**
+     * The layer's name in the frame's list and its tile in the layers menu.
+     * Defaults to "Overlay", so neither is ever a control with no name.
+     */
+    label: string;
     /**
      * The deepest zoom the provider has tiles for. The map enlarges those tiles
      * at deeper zooms, where it would otherwise ask for tiles that do not exist.
@@ -69,6 +72,7 @@ export declare class HelixHeadlessMapRaster extends HelixElement {
     src?: string;
     /** The timer that moves to the next frame while playing. */
     private timer;
+    connectedCallback(): void;
     disconnectedCallback(): void;
     private stopTimer;
     /** Starts or stops the timer when the frames, the interval, or `playing` change. */

package/dist/map/raster/map-raster.js

@@ -18,9 +18,16 @@ let HelixHeadlessMapRaster = class HelixHeadlessMapRaster extends HelixElement {
         this.interval = 600;
         this.isMapLayer = true;
         this.layerKind = 'raster';
+        this.label = 'Overlay';
         this.opacity = 0.7;
         this.playing = false;
     }
+    connectedCallback() {
+        super.connectedCallback();
+        if (this.hasUpdated) {
+            this.schedule();
+        }
+    }
     disconnectedCallback() {
         super.disconnectedCallback();
         this.stopTimer();

package/dist/map/root/map-root.d.ts

@@ -210,8 +210,9 @@ export declare class HelixHeadlessMap extends HelixHeadlessMap_base {
      * the view moves. The frame's keys and buttons only ask, and nothing moves
      * until something answers, so the frame says nothing until it is told the
      * view moved: an announcement for a move that never happened is worse than
-     * none. A page moving its own map in answer to `helix-map-pan` calls this
-     * once it has.
+     * none. A page moving its own map in answer to `helix-map-pan` sets
+     * `zoomLevel`, `bearing` and `pitch` to where the map now is and then calls
+     * this, since those are what is said.
      *
      * What is said waits for the view to settle, so a held key or a long
      * animation is one sentence, and it is the view's state where there is one:
@@ -242,6 +243,16 @@ export declare class HelixHeadlessMap extends HelixHeadlessMap_base {
      * map types show and hide rather than a tile of their own.
      */
     private get imagery();
+    /**
+     * Whether a layer is drawn: not hidden, and, for imagery of the ground, while
+     * a map type shows imagery.
+     *
+     * **The map type decides imagery without writing onto it.** It set `hidden`
+     * on the consumer's own `<helix-map-raster ground>`, before anyone had asked,
+     * which is an attribute their server never sent: the hydration mismatch the
+     * area rules record. `connectMap` asks the same question.
+     */
+    private shown;
     /** A map type's name on its card. */
     private nameOf;
     /** Shows or hides layers, which `connectMap` draws or takes off the map. */
@@ -288,6 +299,17 @@ export declare class HelixHeadlessMap extends HelixHeadlessMap_base {
     private readonly handleSlotChange;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    /**
+     * Asks for the render the hydration put off, which is the first one to know
+     * the markers and the layers.
+     *
+     * **Without it a map a server sent never drew them.** The hydrating render
+     * reads no children, and the parts' own first updates reach the frame while
+     * its update is still pending, so nothing else asked: every marker kept
+     * `tabindex="-1"` and there was no list of layers until the connector
+     * happened to write a property, and a page moving its own map never did.
+     */
+    protected firstUpdated(changed: PropertyValues): void;
     /**
      * Puts the tab stop on one marker and takes it off the rest, the roving
      * pattern the toolbar uses: every marker at `-1` is a map whose places the

package/dist/map/root/map-root.js

@@ -35,6 +35,7 @@ const iconOf = (layer) => {
 const ROTATE_STEP = 15;
 const TILT_STEP = 10;
 const TILTED = 50;
+const placed = (marker) => Number.isFinite(marker.lat) && Number.isFinite(marker.lng);
 const ASK_LAPSES = 3000;
 const SETTLES = 400;
 let HelixHeadlessMap = class HelixHeadlessMap extends MixinViewport(HelixElement) {
@@ -88,7 +89,7 @@ let HelixHeadlessMap = class HelixHeadlessMap extends MixinViewport(HelixElement
         this.keys = new KeyboardNavigationController(this, {
             items: () => this.markers.map((marker, at) => ({
                 contains: (node) => node !== null && (marker.contains(node) || marker.shadowRoot?.contains(node) === true),
-                disabled: marker.gatheredBy !== undefined,
+                disabled: marker.gatheredBy !== undefined || !placed(marker),
                 focusItem: () => {
                     this.stop = at;
                     marker.focus();
@@ -146,7 +147,7 @@ let HelixHeadlessMap = class HelixHeadlessMap extends MixinViewport(HelixElement
         if (!asked) {
             return;
         }
-        const numbers = formatNumbers(this.lang);
+        const numbers = formatNumbers(this.closest('[lang]')?.getAttribute('lang') ?? '');
         const degrees = (value) => numbers(Math.round(value));
         const bearing = ((Math.round(this.bearing) % 360) + 360) % 360;
         const words = {
@@ -168,7 +169,7 @@ let HelixHeadlessMap = class HelixHeadlessMap extends MixinViewport(HelixElement
                     : bearing === 0
                         ? this.northLabel
                         : fillTemplate(this.turnedLabel, { degrees: degrees(bearing) });
-        this.said = next !== '' && next === this.said.trim() ? `${next}\u00a0` : next;
+        this.said = next !== '' && next === this.said ? `${next}\u00a0` : next;
     }
     ask(kind, side) {
         this.asked = { at: performance.now(), kind, ...(side ? { side } : {}) };
@@ -179,6 +180,9 @@ let HelixHeadlessMap = class HelixHeadlessMap extends MixinViewport(HelixElement
     get imagery() {
         return this.layers.filter((layer) => layer.layerKind === 'raster' && layer.ground === true);
     }
+    shown(layer) {
+        return !layer.hidden && !(layer.layerKind === 'raster' && layer.ground && !this.mapType);
+    }
     nameOf(type) {
         return type === 'hybrid'
             ? this.hybridLabel
@@ -247,14 +251,12 @@ let HelixHeadlessMap = class HelixHeadlessMap extends MixinViewport(HelixElement
         this.removeEventListener('keydown', this.handleMarkerKeydown);
         this.removeEventListener('keyup', this.handleMarkerKeyup);
     }
+    firstUpdated(changed) {
+        super.firstUpdated(changed);
+        this.finishHydration();
+    }
     updated(changed) {
         super.updated(changed);
-        const photographed = this.mapType !== undefined;
-        for (const layer of this.imagery) {
-            if (layer.hidden === photographed) {
-                layer.hidden = !photographed;
-            }
-        }
         if (changed.has('mapType')) {
             this.dispatchEvent(new HelixMapPartChangeEvent({ kind: 'layer' }));
         }
@@ -267,7 +269,8 @@ let HelixHeadlessMap = class HelixHeadlessMap extends MixinViewport(HelixElement
             }
         }
         const markers = this.markers;
-        const on = markers[Math.min(this.stop, markers.length - 1)];
+        const at = markers[Math.min(this.stop, markers.length - 1)];
+        const on = at && placed(at) ? at : (markers.find(placed) ?? at);
         const stop = on?.gatheredBy ?? on;
         for (const marker of markers) {
             marker.current = marker === stop;
@@ -500,7 +503,7 @@ let HelixHeadlessMap = class HelixHeadlessMap extends MixinViewport(HelixElement
         this.toggleState('idle', this.resting);
     }
     renderLayers() {
-        const layers = this.layers.filter((layer) => !layer.hidden);
+        const layers = this.layers.filter((layer) => this.shown(layer));
         if (layers.length === 0) {
             return nothing;
         }
@@ -512,7 +515,7 @@ let HelixHeadlessMap = class HelixHeadlessMap extends MixinViewport(HelixElement
         return html `<div
       part="region"
       role="group"
-      aria-label=${this.label || 'Map'}
+      aria-label=${this.label || this.getAttribute('aria-label') || 'Map'}
       aria-keyshortcuts=${this.keyShortcuts}
       tabindex="0"
       @focusin=${this.idle.stir}

package/dist/map/route/map-route.d.ts

@@ -49,8 +49,11 @@ export declare class HelixHeadlessMapRoute extends HelixElement {
     readonly isMapLayer = true;
     /** @internal Which kind of layer, which is how the connector draws it. */
     readonly layerKind: 'area' | 'route';
-    /** The route's name, used in the frame's list. */
-    label?: string;
+    /**
+     * The route's name, used in the frame's list and its tile in the layers
+     * menu. Defaults to "Route", so neither is ever a control with no name.
+     */
+    label: string;
     /**
      * The points the line passes through, in order. Write the attribute as
      * `lat,lng` pairs separated by spaces, or set the property to an array of `{

package/dist/map/route/map-route.js

@@ -22,6 +22,7 @@ let HelixHeadlessMapRoute = class HelixHeadlessMapRoute extends HelixElement {
         super(...arguments);
         this.isMapLayer = true;
         this.layerKind = 'route';
+        this.label = 'Route';
     }
     updated(changed) {
         super.updated(changed);

package/dist/time-picker/root/time-picker-root.js

@@ -202,6 +202,7 @@ let HelixHeadlessTimePicker = class HelixHeadlessTimePicker extends MixinControl
         return html `<${this.tag('listbox')}
       part="column"
       data-column=${part}
+      aria-invalid=${this.invalid ? 'true' : nothing}
       exportparts="empty: column-empty, feedback: column-feedback, filter-icon: column-filter-icon,
         filter-mark: column-filter-mark, hint: column-hint, items: column-items, label: column-label,
         live: column-live, loading: column-loading, search: column-search, search-field: column-search-field"
@@ -244,6 +245,7 @@ let HelixHeadlessTimePicker = class HelixHeadlessTimePicker extends MixinControl
     renderList() {
         return html `<${this.tag('listbox')}
       part="list"
+      aria-invalid=${this.invalid ? 'true' : nothing}
       exportparts="empty: list-empty, feedback: list-feedback, filter-icon: list-filter-icon,
         filter-mark: list-filter-mark, hint: list-hint, items: list-items, label: list-label,
         live: list-live, loading: list-loading, search: list-search, search-field: list-search-field"

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fusion.dev/helix-headless",
   "description": "Headless component tier. Structure, accessibility, state, and form participation. No styling.",
-  "version": "0.110.0",
+  "version": "0.110.2",
   "license": "MIT",
   "author": "Ross Sheppard <ross.sheppard@fusion.dev>",
   "repository": {
@@ -46,13 +46,13 @@
   },
   "bugs": "https://github.com/project-fusion/fusion/issues",
   "dependencies": {
-    "@fusion.dev/helix-core": "0.110.0",
-    "@fusion.dev/helix-icons": "0.110.0",
+    "@fusion.dev/helix-core": "0.110.2",
+    "@fusion.dev/helix-icons": "0.110.2",
     "uqr": "^0.1.3"
   },
   "devDependencies": {
-    "@fusion.dev/helix-cem": "0.110.0",
-    "@fusion.dev/helix-testing": "0.110.0",
+    "@fusion.dev/helix-cem": "0.110.2",
+    "@fusion.dev/helix-testing": "0.110.2",
     "@fusion.dev/scripts": "0.0.0-dev",
     "@happy-dom/global-registrator": "^20.0.0",
     "@lit-labs/ssr": "^4.1.0",

package/types/jsx.d.ts

@@ -11443,7 +11443,8 @@ export type HelixHeadlessMapAreaProps = {
 dotted legs. The layers menu shows layers in the same group as one entry,
 named by the first of them, and its checkbox shows or hides them all. */
   group?: (HelixHeadlessMapArea["group"]) | undefined;
-  /** The area's name, used in the frame's list. */
+  /** The area's name, used in the frame's list and its tile in the layers
+menu. Defaults to "Area", so neither is ever a control with no name. */
   label?: (HelixHeadlessMapArea["label"]) | undefined;
   /** The corners of the shape, in order. The last point connects back to the
 first. */
@@ -11462,7 +11463,8 @@ export type HelixHeadlessMapAreaSolidJsProps = {
 dotted legs. The layers menu shows layers in the same group as one entry,
 named by the first of them, and its checkbox shows or hides them all. */
   "prop:group"?: (HelixHeadlessMapArea["group"]) | undefined;
-  /** The area's name, used in the frame's list. */
+  /** The area's name, used in the frame's list and its tile in the layers
+menu. Defaults to "Area", so neither is ever a control with no name. */
   "prop:label"?: (HelixHeadlessMapArea["label"]) | undefined;
   /** The corners of the shape, in order. The last point connects back to the
 first. */
@@ -11738,7 +11740,8 @@ the frame's list. */
 dotted legs. The layers menu shows layers in the same group as one entry,
 named by the first of them, and its checkbox shows or hides them all. */
   group?: (HelixHeadlessMapPoints["group"]) | undefined;
-  /** The layer's name, used in the frame's list. */
+  /** The layer's name, used in the frame's list, its tile in the layers menu,
+and the group of places the keyboard walks. Defaults to "Places". */
   label?: (HelixHeadlessMapPoints["label"]) | undefined;
   /** The GeoJSON property each point is named by. Defaults to `name`. */
   "name-key"?: (HelixHeadlessMapPoints["nameKey"]) | undefined;
@@ -11780,7 +11783,8 @@ the frame's list. */
 dotted legs. The layers menu shows layers in the same group as one entry,
 named by the first of them, and its checkbox shows or hides them all. */
   "prop:group"?: (HelixHeadlessMapPoints["group"]) | undefined;
-  /** The layer's name, used in the frame's list. */
+  /** The layer's name, used in the frame's list, its tile in the layers menu,
+and the group of places the keyboard walks. Defaults to "Places". */
   "prop:label"?: (HelixHeadlessMapPoints["label"]) | undefined;
   /** The GeoJSON property each point is named by. Defaults to `name`. */
   "attr:name-key"?: (HelixHeadlessMapPoints["nameKey"]) | undefined;
@@ -11832,7 +11836,7 @@ wait is announced when the wait ends. */
   description?: (HelixHeadlessMapPosition["description"]) | undefined;
   /** The direction it faces, in degrees clockwise from north. Shows an arrow. */
   heading?: (HelixHeadlessMapPosition["heading"]) | undefined;
-  /** What it is, such as "Van 12". Read by screen readers. */
+  /** What it is, such as "Van 12". Read by screen readers. Defaults to "Live position". */
   label?: (HelixHeadlessMapPosition["label"]) | undefined;
   /** Latitude, in degrees. */
   lat?: (HelixHeadlessMapPosition["lat"]) | undefined;
@@ -11858,7 +11862,7 @@ wait is announced when the wait ends. */
   "prop:description"?: (HelixHeadlessMapPosition["description"]) | undefined;
   /** The direction it faces, in degrees clockwise from north. Shows an arrow. */
   "prop:heading"?: (HelixHeadlessMapPosition["heading"]) | undefined;
-  /** What it is, such as "Van 12". Read by screen readers. */
+  /** What it is, such as "Van 12". Read by screen readers. Defaults to "Live position". */
   "prop:label"?: (HelixHeadlessMapPosition["label"]) | undefined;
   /** Latitude, in degrees. */
   "prop:lat"?: (HelixHeadlessMapPosition["lat"]) | undefined;
@@ -11902,7 +11906,8 @@ named by the first of them, and its checkbox shows or hides them all. */
   group?: (HelixHeadlessMapRaster["group"]) | undefined;
   /** How long each frame shows while `playing`, in milliseconds. */
   interval?: (HelixHeadlessMapRaster["interval"]) | undefined;
-  /** The layer's name in the frame's list. */
+  /** The layer's name in the frame's list and its tile in the layers menu.
+Defaults to "Overlay", so neither is ever a control with no name. */
   label?: (HelixHeadlessMapRaster["label"]) | undefined;
   /** The deepest zoom the provider has tiles for. The map enlarges those tiles
 at deeper zooms, where it would otherwise ask for tiles that do not exist. */
@@ -11941,7 +11946,8 @@ named by the first of them, and its checkbox shows or hides them all. */
   "prop:group"?: (HelixHeadlessMapRaster["group"]) | undefined;
   /** How long each frame shows while `playing`, in milliseconds. */
   "prop:interval"?: (HelixHeadlessMapRaster["interval"]) | undefined;
-  /** The layer's name in the frame's list. */
+  /** The layer's name in the frame's list and its tile in the layers menu.
+Defaults to "Overlay", so neither is ever a control with no name. */
   "prop:label"?: (HelixHeadlessMapRaster["label"]) | undefined;
   /** The deepest zoom the provider has tiles for. The map enlarges those tiles
 at deeper zooms, where it would otherwise ask for tiles that do not exist. */
@@ -12524,7 +12530,8 @@ in the frame's list. */
 dotted legs. The layers menu shows layers in the same group as one entry,
 named by the first of them, and its checkbox shows or hides them all. */
   group?: (HelixHeadlessMapRoute["group"]) | undefined;
-  /** The route's name, used in the frame's list. */
+  /** The route's name, used in the frame's list and its tile in the layers
+menu. Defaults to "Route", so neither is ever a control with no name. */
   label?: (HelixHeadlessMapRoute["label"]) | undefined;
   /** The points the line passes through, in order. Write the attribute as
 `lat,lng` pairs separated by spaces, or set the property to an array of `{
@@ -12548,7 +12555,8 @@ in the frame's list. */
 dotted legs. The layers menu shows layers in the same group as one entry,
 named by the first of them, and its checkbox shows or hides them all. */
   "prop:group"?: (HelixHeadlessMapRoute["group"]) | undefined;
-  /** The route's name, used in the frame's list. */
+  /** The route's name, used in the frame's list and its tile in the layers
+menu. Defaults to "Route", so neither is ever a control with no name. */
   "prop:label"?: (HelixHeadlessMapRoute["label"]) | undefined;
   /** The points the line passes through, in order. Write the attribute as
 `lat,lng` pairs separated by spaces, or set the property to an array of `{
@@ -32434,7 +32442,8 @@ export type CustomElements = {
    * - `group`: A name this layer shares with other layers, such as a route and its
    * dotted legs. The layers menu shows layers in the same group as one entry,
    * named by the first of them, and its checkbox shows or hides them all.
-   * - `label`: The area's name, used in the frame's list.
+   * - `label`: The area's name, used in the frame's list and its tile in the layers
+   * menu. Defaults to "Area", so neither is ever a control with no name.
    * - `points`: The corners of the shape, in order. The last point connects back to the
    * first.
    * - `isMapLayer`: Marks this as a layer for the frame and the connector, whatever its tag. (property only) (readonly)
@@ -32778,7 +32787,8 @@ export type CustomElements = {
    * - `group`: A name this layer shares with other layers, such as a route and its
    * dotted legs. The layers menu shows layers in the same group as one entry,
    * named by the first of them, and its checkbox shows or hides them all.
-   * - `label`: The layer's name, used in the frame's list.
+   * - `label`: The layer's name, used in the frame's list, its tile in the layers menu,
+   * and the group of places the keyboard walks. Defaults to "Places".
    * - `name-key`/`nameKey`: The GeoJSON property each point is named by. Defaults to `name`.
    * - `src`: A GeoJSON file of points to load. Ignored when `data` is set.
    * - `data`: The points, as a GeoJSON collection or a list of `{ lat, lng, label, id }`
@@ -32851,7 +32861,7 @@ export type CustomElements = {
    * wait is announced when the wait ends.
    * - `description`: What screen readers announce when it changes, such as "Two stops away".
    * - `heading`: The direction it faces, in degrees clockwise from north. Shows an arrow.
-   * - `label`: What it is, such as "Van 12". Read by screen readers.
+   * - `label`: What it is, such as "Van 12". Read by screen readers. Defaults to "Live position".
    * - `lat`: Latitude, in degrees.
    * - `lng`: Longitude, in degrees.
    * - `isMapPosition`: Marks this as a position for the connector, whatever its tag. (property only) (readonly)
@@ -32937,7 +32947,8 @@ export type CustomElements = {
    * dotted legs. The layers menu shows layers in the same group as one entry,
    * named by the first of them, and its checkbox shows or hides them all.
    * - `interval`: How long each frame shows while `playing`, in milliseconds.
-   * - `label`: The layer's name in the frame's list.
+   * - `label`: The layer's name in the frame's list and its tile in the layers menu.
+   * Defaults to "Overlay", so neither is ever a control with no name.
    * - `max-zoom`/`maxZoom`: The deepest zoom the provider has tiles for. The map enlarges those tiles
    * at deeper zooms, where it would otherwise ask for tiles that do not exist.
    * - `opacity`: How opaque the tiles are, from `0` to `1`.
@@ -33176,8 +33187,9 @@ export type CustomElements = {
    * the view moves. The frame's keys and buttons only ask, and nothing moves
    * until something answers, so the frame says nothing until it is told the
    * view moved: an announcement for a move that never happened is worse than
-   * none. A page moving its own map in answer to `helix-map-pan` calls this
-   * once it has.
+   * none. A page moving its own map in answer to `helix-map-pan` sets
+   * `zoomLevel`, `bearing` and `pitch` to where the map now is and then calls
+   * this, since those are what is said.
    *
    * What is said waits for the view to settle, so a held key or a long
    * animation is one sentence, and it is the view's state where there is one:
@@ -33260,7 +33272,8 @@ export type CustomElements = {
    * - `group`: A name this layer shares with other layers, such as a route and its
    * dotted legs. The layers menu shows layers in the same group as one entry,
    * named by the first of them, and its checkbox shows or hides them all.
-   * - `label`: The route's name, used in the frame's list.
+   * - `label`: The route's name, used in the frame's list and its tile in the layers
+   * menu. Defaults to "Route", so neither is ever a control with no name.
    * - `points`: The points the line passes through, in order. Write the attribute as
    * `lat,lng` pairs separated by spaces, or set the property to an array of `{
    * lat, lng }`.
@@ -52468,7 +52481,8 @@ export type CustomElementsSolidJs = {
    * - `group`: A name this layer shares with other layers, such as a route and its
    * dotted legs. The layers menu shows layers in the same group as one entry,
    * named by the first of them, and its checkbox shows or hides them all.
-   * - `label`: The area's name, used in the frame's list.
+   * - `label`: The area's name, used in the frame's list and its tile in the layers
+   * menu. Defaults to "Area", so neither is ever a control with no name.
    * - `points`: The corners of the shape, in order. The last point connects back to the
    * first.
    * - `isMapLayer`: Marks this as a layer for the frame and the connector, whatever its tag. (property only) (readonly)
@@ -52821,7 +52835,8 @@ export type CustomElementsSolidJs = {
    * - `group`: A name this layer shares with other layers, such as a route and its
    * dotted legs. The layers menu shows layers in the same group as one entry,
    * named by the first of them, and its checkbox shows or hides them all.
-   * - `label`: The layer's name, used in the frame's list.
+   * - `label`: The layer's name, used in the frame's list, its tile in the layers menu,
+   * and the group of places the keyboard walks. Defaults to "Places".
    * - `name-key`/`nameKey`: The GeoJSON property each point is named by. Defaults to `name`.
    * - `src`: A GeoJSON file of points to load. Ignored when `data` is set.
    * - `data`: The points, as a GeoJSON collection or a list of `{ lat, lng, label, id }`
@@ -52897,7 +52912,7 @@ export type CustomElementsSolidJs = {
    * wait is announced when the wait ends.
    * - `description`: What screen readers announce when it changes, such as "Two stops away".
    * - `heading`: The direction it faces, in degrees clockwise from north. Shows an arrow.
-   * - `label`: What it is, such as "Van 12". Read by screen readers.
+   * - `label`: What it is, such as "Van 12". Read by screen readers. Defaults to "Live position".
    * - `lat`: Latitude, in degrees.
    * - `lng`: Longitude, in degrees.
    * - `isMapPosition`: Marks this as a position for the connector, whatever its tag. (property only) (readonly)
@@ -52984,7 +52999,8 @@ export type CustomElementsSolidJs = {
    * dotted legs. The layers menu shows layers in the same group as one entry,
    * named by the first of them, and its checkbox shows or hides them all.
    * - `interval`: How long each frame shows while `playing`, in milliseconds.
-   * - `label`: The layer's name in the frame's list.
+   * - `label`: The layer's name in the frame's list and its tile in the layers menu.
+   * Defaults to "Overlay", so neither is ever a control with no name.
    * - `max-zoom`/`maxZoom`: The deepest zoom the provider has tiles for. The map enlarges those tiles
    * at deeper zooms, where it would otherwise ask for tiles that do not exist.
    * - `opacity`: How opaque the tiles are, from `0` to `1`.
@@ -53226,8 +53242,9 @@ export type CustomElementsSolidJs = {
    * the view moves. The frame's keys and buttons only ask, and nothing moves
    * until something answers, so the frame says nothing until it is told the
    * view moved: an announcement for a move that never happened is worse than
-   * none. A page moving its own map in answer to `helix-map-pan` calls this
-   * once it has.
+   * none. A page moving its own map in answer to `helix-map-pan` sets
+   * `zoomLevel`, `bearing` and `pitch` to where the map now is and then calls
+   * this, since those are what is said.
    *
    * What is said waits for the view to settle, so a held key or a long
    * animation is one sentence, and it is the view's state where there is one:
@@ -53313,7 +53330,8 @@ export type CustomElementsSolidJs = {
    * - `group`: A name this layer shares with other layers, such as a route and its
    * dotted legs. The layers menu shows layers in the same group as one entry,
    * named by the first of them, and its checkbox shows or hides them all.
-   * - `label`: The route's name, used in the frame's list.
+   * - `label`: The route's name, used in the frame's list and its tile in the layers
+   * menu. Defaults to "Route", so neither is ever a control with no name.
    * - `points`: The points the line passes through, in order. Write the attribute as
    * `lat,lng` pairs separated by spaces, or set the property to an array of `{
    * lat, lng }`.

package/types/vue.d.ts

@@ -5859,7 +5859,8 @@ export type HelixHeadlessMapAreaVueProps = {
 dotted legs. The layers menu shows layers in the same group as one entry,
 named by the first of them, and its checkbox shows or hides them all. */
   group?: (HelixHeadlessMapArea["group"]) | undefined;
-  /** The area's name, used in the frame's list. */
+  /** The area's name, used in the frame's list and its tile in the layers
+menu. Defaults to "Area", so neither is ever a control with no name. */
   label?: (HelixHeadlessMapArea["label"]) | undefined;
   /** The corners of the shape, in order. The last point connects back to the
 first. */
@@ -6026,7 +6027,8 @@ the frame's list. */
 dotted legs. The layers menu shows layers in the same group as one entry,
 named by the first of them, and its checkbox shows or hides them all. */
   group?: (HelixHeadlessMapPoints["group"]) | undefined;
-  /** The layer's name, used in the frame's list. */
+  /** The layer's name, used in the frame's list, its tile in the layers menu,
+and the group of places the keyboard walks. Defaults to "Places". */
   label?: (HelixHeadlessMapPoints["label"]) | undefined;
   /** The GeoJSON property each point is named by. Defaults to `name`. */
   "name-key"?: (HelixHeadlessMapPoints["nameKey"]) | undefined;
@@ -6070,7 +6072,7 @@ wait is announced when the wait ends. */
   description?: (HelixHeadlessMapPosition["description"]) | undefined;
   /** The direction it faces, in degrees clockwise from north. Shows an arrow. */
   heading?: (HelixHeadlessMapPosition["heading"]) | undefined;
-  /** What it is, such as "Van 12". Read by screen readers. */
+  /** What it is, such as "Van 12". Read by screen readers. Defaults to "Live position". */
   label?: (HelixHeadlessMapPosition["label"]) | undefined;
   /** Latitude, in degrees. */
   lat?: (HelixHeadlessMapPosition["lat"]) | undefined;
@@ -6110,7 +6112,8 @@ named by the first of them, and its checkbox shows or hides them all. */
   group?: (HelixHeadlessMapRaster["group"]) | undefined;
   /** How long each frame shows while `playing`, in milliseconds. */
   interval?: (HelixHeadlessMapRaster["interval"]) | undefined;
-  /** The layer's name in the frame's list. */
+  /** The layer's name in the frame's list and its tile in the layers menu.
+Defaults to "Overlay", so neither is ever a control with no name. */
   label?: (HelixHeadlessMapRaster["label"]) | undefined;
   /** The deepest zoom the provider has tiles for. The map enlarges those tiles
 at deeper zooms, where it would otherwise ask for tiles that do not exist. */
@@ -6426,7 +6429,8 @@ in the frame's list. */
 dotted legs. The layers menu shows layers in the same group as one entry,
 named by the first of them, and its checkbox shows or hides them all. */
   group?: (HelixHeadlessMapRoute["group"]) | undefined;
-  /** The route's name, used in the frame's list. */
+  /** The route's name, used in the frame's list and its tile in the layers
+menu. Defaults to "Route", so neither is ever a control with no name. */
   label?: (HelixHeadlessMapRoute["label"]) | undefined;
   /** The points the line passes through, in order. Write the attribute as
 `lat,lng` pairs separated by spaces, or set the property to an array of `{