@fusion.dev/helix 0.113.0 → 0.115.0

package/custom-elements.json

@@ -77453,6 +77453,33 @@
               "attribute": "tone",
               "reflects": true
             },
+            {
+              "kind": "field",
+              "name": "caption",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Words drawn on the map with the area, such as `A` for a search sector.\nUnset, nothing is drawn. Keep it short: it is a caption on a map, and the\narea's `label` is what a screen reader hears.",
+              "attribute": "caption",
+              "inheritedFrom": {
+                "name": "HelixHeadlessMapArea",
+                "module": "src/map/area/map-area.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "captionPlacement",
+              "type": {
+                "text": "'inside' | 'outside'"
+              },
+              "default": "'inside'",
+              "description": "Where the caption stands. `inside`, the default, at the point of the area\nfurthest from its edges. `outside`, just above the area's northernmost\npoint, clear of the shape, for an area whose caption would cover what is\nin it.",
+              "attribute": "caption-placement",
+              "inheritedFrom": {
+                "name": "HelixHeadlessMapArea",
+                "module": "src/map/area/map-area.ts"
+              }
+            },
             {
               "kind": "field",
               "name": "description",
@@ -77854,6 +77881,31 @@
               "description": "The area's color. Uses your primary color unless set.",
               "fieldName": "tone"
             },
+            {
+              "name": "caption",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Words drawn on the map with the area, such as `A` for a search sector.\nUnset, nothing is drawn. Keep it short: it is a caption on a map, and the\narea's `label` is what a screen reader hears.",
+              "fieldName": "caption",
+              "inheritedFrom": {
+                "name": "HelixHeadlessMapArea",
+                "module": "src/map/area/map-area.ts"
+              }
+            },
+            {
+              "name": "caption-placement",
+              "type": {
+                "text": "'inside' | 'outside'"
+              },
+              "default": "'inside'",
+              "description": "Where the caption stands. `inside`, the default, at the point of the area\nfurthest from its edges. `outside`, just above the area's northernmost\npoint, clear of the shape, for an area whose caption would cover what is\nin it.",
+              "fieldName": "captionPlacement",
+              "inheritedFrom": {
+                "name": "HelixHeadlessMapArea",
+                "module": "src/map/area/map-area.ts"
+              }
+            },
             {
               "name": "description",
               "type": {
@@ -84168,6 +84220,56 @@
                 "module": "src/map/root/map-root.ts"
               }
             },
+            {
+              "kind": "field",
+              "name": "ready",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Whether the map has been drawn whole, which `drawn()` says. For a page that\nconnects after `helix-map-ready` has been sent, and missed it.",
+              "readonly": true,
+              "inheritedFrom": {
+                "name": "HelixHeadlessMap",
+                "module": "src/map/root/map-root.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "whole",
+              "type": {
+                "text": "boolean"
+              },
+              "privacy": "private",
+              "default": "false",
+              "description": "What `ready` reads, written by `drawn()`.",
+              "inheritedFrom": {
+                "name": "HelixHeadlessMap",
+                "module": "src/map/root/map-root.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "drawn",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "whole",
+                  "default": "true"
+                }
+              ],
+              "description": "Says the map has been drawn whole, or with `false`, that it no longer is.\n\n**Called by whatever draws the map**, as `connectMap` does once its driver\nhas every tile the view needs and the ground where there is terrain, and\nwith `false` when it disconnects. A page drawing its own map calls it when\nthat map is finished. The first call after the map was not drawn sends\n`helix-map-ready` and turns on `:state(ready)`, so a page can wait on the\nevent or select on the state, and a page that connects late reads `ready`.",
+              "type": {
+                "text": "drawn(whole = true) => void"
+              },
+              "inheritedFrom": {
+                "name": "HelixHeadlessMap",
+                "module": "src/map/root/map-root.ts"
+              }
+            },
             {
               "kind": "method",
               "name": "say",
@@ -85558,6 +85660,10 @@
                 "description": "A frame around a map, with pan and zoom buttons and the map credit.",
                 "slug": "preview"
               },
+              {
+                "description": "Search sectors, each named on the map by its caption: two inside their sector and one above it, clear of what it holds.",
+                "slug": "areas"
+              },
               {
                 "description": "A map behind a page's own words, filling a hero whose words decide its height, with its credit in a corner and no landmarks.",
                 "slug": "behind-content"
@@ -85956,6 +86062,18 @@
                 "module": "src/map/root/map-root.ts"
               }
             },
+            {
+              "type": {
+                "text": "HelixMapReadyEvent"
+              },
+              "description": "The map has been drawn whole: its style, every tile the view needs, and the ground where it has terrain. Sent once per connection. Show a map that is finished on it, where it would otherwise draw in stages.",
+              "name": "helix-map-ready",
+              "reactProp": "onhelix-map-ready",
+              "inheritedFrom": {
+                "name": "HelixHeadlessMap",
+                "module": "src/map/root/map-root.ts"
+              }
+            },
             {
               "type": {
                 "text": "HelixMapRotateEvent"
@@ -86010,6 +86128,14 @@
                 "module": "src/map/root/map-root.ts"
               }
             },
+            {
+              "description": "The map has been drawn whole, after `helix-map-ready`.",
+              "name": "ready",
+              "inheritedFrom": {
+                "name": "HelixHeadlessMap",
+                "module": "src/map/root/map-root.ts"
+              }
+            },
             {
               "description": "Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.",
               "name": "settled",

package/dist/element-events.generated.js

@@ -105,6 +105,7 @@ registerElementEvents({
         'helix-map-cluster',
         'helix-map-pan',
         'helix-map-part-change',
+        'helix-map-ready',
         'helix-map-rotate',
         'helix-map-tilt',
         'helix-map-zoom',

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fusion.dev/helix",
   "description": "Styled component tier. Extends the headless tier with token-driven presentation.",
-  "version": "0.113.0",
+  "version": "0.115.0",
   "license": "MIT",
   "author": "Ross Sheppard <ross.sheppard@fusion.dev>",
   "repository": {
@@ -51,13 +51,13 @@
   },
   "bugs": "https://github.com/project-fusion/fusion/issues",
   "dependencies": {
-    "@fusion.dev/helix-core": "0.113.0",
-    "@fusion.dev/helix-headless": "0.113.0",
-    "@fusion.dev/helix-styles": "0.113.0"
+    "@fusion.dev/helix-core": "0.115.0",
+    "@fusion.dev/helix-headless": "0.115.0",
+    "@fusion.dev/helix-styles": "0.115.0"
   },
   "devDependencies": {
-    "@fusion.dev/helix-cem": "0.113.0",
-    "@fusion.dev/helix-testing": "0.113.0",
+    "@fusion.dev/helix-cem": "0.115.0",
+    "@fusion.dev/helix-testing": "0.115.0",
     "@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

@@ -112,6 +112,7 @@ import type {
   HelixMapPoints,
   HelixMapPosition,
   HelixMapRaster,
+  HelixMapReadyEvent,
   HelixMapRotateEvent,
   HelixMapRoute,
   HelixMapTerrain,
@@ -13626,6 +13627,20 @@ export type HelixMapAreaHelixMapPartChangeElementEvent =
 export type HelixMapAreaProps = {
   /** The area's color. Uses your primary color unless set. */
   tone?: (HelixMapArea["tone"]) | undefined;
+  /** Words drawn on the map with the area, such as `A` for a search sector.
+Unset, nothing is drawn. Keep it short: it is a caption on a map, and the
+area's `label` is what a screen reader hears. */
+  caption?: (HelixMapArea["caption"]) | undefined;
+  /** Where the caption stands. `inside`, the default, at the point of the area
+furthest from its edges. `outside`, just above the area's northernmost
+point, clear of the shape, for an area whose caption would cover what is
+in it. */
+  "caption-placement"?: (HelixMapArea["captionPlacement"]) | undefined;
+  /** Where the caption stands. `inside`, the default, at the point of the area
+furthest from its edges. `outside`, just above the area's northernmost
+point, clear of the shape, for an area whose caption would cover what is
+in it. */
+  captionPlacement?: (HelixMapArea["captionPlacement"]) | undefined;
   /** More about the area. Read after its label in the frame's list. */
   description?: (HelixMapArea["description"]) | undefined;
   /** A name this layer shares with other layers, such as a route and its
@@ -13648,6 +13663,20 @@ first. */
 export type HelixMapAreaSolidJsProps = {
   /** The area's color. Uses your primary color unless set. */
   "prop:tone"?: (HelixMapArea["tone"]) | undefined;
+  /** Words drawn on the map with the area, such as `A` for a search sector.
+Unset, nothing is drawn. Keep it short: it is a caption on a map, and the
+area's `label` is what a screen reader hears. */
+  "prop:caption"?: (HelixMapArea["caption"]) | undefined;
+  /** Where the caption stands. `inside`, the default, at the point of the area
+furthest from its edges. `outside`, just above the area's northernmost
+point, clear of the shape, for an area whose caption would cover what is
+in it. */
+  "attr:caption-placement"?: (HelixMapArea["captionPlacement"]) | undefined;
+  /** Where the caption stands. `inside`, the default, at the point of the area
+furthest from its edges. `outside`, just above the area's northernmost
+point, clear of the shape, for an area whose caption would cover what is
+in it. */
+  "prop:captionPlacement"?: (HelixMapArea["captionPlacement"]) | undefined;
   /** More about the area. Read after its label in the frame's list. */
   "prop:description"?: (HelixMapArea["description"]) | undefined;
   /** A name this layer shares with other layers, such as a route and its
@@ -14227,6 +14256,9 @@ export type HelixMapHelixMapPanElementEvent =
 /** `helix-map-part-change` event type */
 export type HelixMapHelixMapPartChangeElementEvent =
   HelixMapElementEvent<HelixMapPartChangeEvent>;
+/** `helix-map-ready` event type */
+export type HelixMapHelixMapReadyElementEvent =
+  HelixMapElementEvent<HelixMapReadyEvent>;
 /** `helix-map-rotate` event type */
 export type HelixMapHelixMapRotateElementEvent =
   HelixMapElementEvent<HelixMapRotateEvent>;
@@ -14501,6 +14533,8 @@ current, and the map says it after a zoom. */
   "onhelix-map-part-change"?: ((
     e: HelixMapHelixMapPartChangeElementEvent,
   ) => void) | undefined;
+  /** The map has been drawn whole: its style, every tile the view needs, and the ground where it has terrain. Sent once per connection. Show a map that is finished on it, where it would otherwise draw in stages. */
+  "onhelix-map-ready"?: ((e: HelixMapHelixMapReadyElementEvent) => void) | undefined;
   /** A rotate or Face north button, or Shift with Left or Right, was pressed. Turn your map in response. */
   "onhelix-map-rotate"?: ((e: HelixMapHelixMapRotateElementEvent) => void) | undefined;
   /** The 3D button, or Shift with Up or Down, was pressed. Tilt your map in response. */
@@ -14772,6 +14806,8 @@ current, and the map says it after a zoom. */
   "on:helix-map-part-change"?: ((
     e: HelixMapHelixMapPartChangeElementEvent,
   ) => void) | undefined;
+  /** The map has been drawn whole: its style, every tile the view needs, and the ground where it has terrain. Sent once per connection. Show a map that is finished on it, where it would otherwise draw in stages. */
+  "on:helix-map-ready"?: ((e: HelixMapHelixMapReadyElementEvent) => void) | undefined;
   /** A rotate or Face north button, or Shift with Left or Right, was pressed. Turn your map in response. */
   "on:helix-map-rotate"?: ((e: HelixMapHelixMapRotateElementEvent) => void) | undefined;
   /** The 3D button, or Shift with Up or Down, was pressed. Tilt your map in response. */
@@ -37007,6 +37043,13 @@ export type CustomElements = {
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
    * - `tone`: The area's color. Uses your primary color unless set.
+   * - `caption`: Words drawn on the map with the area, such as `A` for a search sector.
+   * Unset, nothing is drawn. Keep it short: it is a caption on a map, and the
+   * area's `label` is what a screen reader hears.
+   * - `caption-placement`/`captionPlacement`: Where the caption stands. `inside`, the default, at the point of the area
+   * furthest from its edges. `outside`, just above the area's northernmost
+   * point, clear of the shape, for an area whose caption would cover what is
+   * in it.
    * - `description`: More about the area. Read after its label in the frame's list.
    * - `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,
@@ -37695,6 +37738,8 @@ export type CustomElements = {
    * - `zoomed-label`/`zoomedLabel`: What screen readers hear after a zoom. `{level}` is the zoom level.
    * - `zoom-level`/`zoomLevel`: How far the map is zoomed, in its renderer's levels. `connectMap` keeps it
    * current, and the map says it after a zoom.
+   * - `ready`: Whether the map has been drawn whole, which `drawn()` says. For a page that
+   * connects after `helix-map-ready` has been sent, and missed it. (property only) (readonly)
    * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
    *
    * **Named `whenSettled` because `settled` is taken four times over**, by
@@ -37724,6 +37769,7 @@ export type CustomElements = {
    * - `helix-map-cluster`: A cluster was pressed. Sent from the marker that shows the cluster, with the names of its places.
    * - `helix-map-pan`: A pan button or arrow key was pressed. Move your map in response.
    * - `helix-map-part-change`: Clustering was turned on or off. Used by `connectMap`; pages do not need to listen for it.
+   * - `helix-map-ready`: The map has been drawn whole: its style, every tile the view needs, and the ground where it has terrain. Sent once per connection. Show a map that is finished on it, where it would otherwise draw in stages.
    * - `helix-map-rotate`: A rotate or Face north button, or Shift with Left or Right, was pressed. Turn your map in response.
    * - `helix-map-tilt`: The 3D button, or Shift with Up or Down, was pressed. Tilt your map in response.
    * - `helix-map-zoom`: A zoom button or key was pressed, with a direction. Zoom your map in response.
@@ -37758,6 +37804,14 @@ export type CustomElements = {
    * animation is one sentence, and it is the view's state where there is one:
    * the zoom level, the way the map faces, its tilt. A pan has no state to
    * say, so it says which way the map moved.
+   * - `drawn(whole = true) => void`: Says the map has been drawn whole, or with `false`, that it no longer is.
+   *
+   * **Called by whatever draws the map**, as `connectMap` does once its driver
+   * has every tile the view needs and the ground where there is terrain, and
+   * with `false` when it disconnects. A page drawing its own map calls it when
+   * that map is finished. The first call after the map was not drawn sends
+   * `helix-map-ready` and turns on `:state(ready)`, so a page can wait on the
+   * event or select on the state, and a page that connects late reads `ready`.
    * - `rotate(by: number) => void`: Turns the map by some degrees, clockwise where positive.
    * - `faceNorth() => void`: Turns the map to face north.
    * - `tilt(by: number) => void`: Tilts the map by some degrees, toward the horizon where positive.
@@ -37816,6 +37870,7 @@ export type CustomElements = {
    *
    * - `fullscreen`: The map fills the screen.
    * - `idle`: The user has been still long enough for the header and footer to fade.
+   * - `ready`: The map has been drawn whole, after `helix-map-ready`.
    * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
    */
   "helix-map": Partial<HelixMapProps & BaseProps<HelixMap> & BaseEvents<HelixMap>>;
@@ -58997,6 +59052,13 @@ export type CustomElementsSolidJs = {
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
    * - `tone`: The area's color. Uses your primary color unless set.
+   * - `caption`: Words drawn on the map with the area, such as `A` for a search sector.
+   * Unset, nothing is drawn. Keep it short: it is a caption on a map, and the
+   * area's `label` is what a screen reader hears.
+   * - `caption-placement`/`captionPlacement`: Where the caption stands. `inside`, the default, at the point of the area
+   * furthest from its edges. `outside`, just above the area's northernmost
+   * point, clear of the shape, for an area whose caption would cover what is
+   * in it.
    * - `description`: More about the area. Read after its label in the frame's list.
    * - `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,
@@ -59709,6 +59771,8 @@ export type CustomElementsSolidJs = {
    * - `zoomed-label`/`zoomedLabel`: What screen readers hear after a zoom. `{level}` is the zoom level.
    * - `zoom-level`/`zoomLevel`: How far the map is zoomed, in its renderer's levels. `connectMap` keeps it
    * current, and the map says it after a zoom.
+   * - `ready`: Whether the map has been drawn whole, which `drawn()` says. For a page that
+   * connects after `helix-map-ready` has been sent, and missed it. (property only) (readonly)
    * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
    *
    * **Named `whenSettled` because `settled` is taken four times over**, by
@@ -59738,6 +59802,7 @@ export type CustomElementsSolidJs = {
    * - `helix-map-cluster`: A cluster was pressed. Sent from the marker that shows the cluster, with the names of its places.
    * - `helix-map-pan`: A pan button or arrow key was pressed. Move your map in response.
    * - `helix-map-part-change`: Clustering was turned on or off. Used by `connectMap`; pages do not need to listen for it.
+   * - `helix-map-ready`: The map has been drawn whole: its style, every tile the view needs, and the ground where it has terrain. Sent once per connection. Show a map that is finished on it, where it would otherwise draw in stages.
    * - `helix-map-rotate`: A rotate or Face north button, or Shift with Left or Right, was pressed. Turn your map in response.
    * - `helix-map-tilt`: The 3D button, or Shift with Up or Down, was pressed. Tilt your map in response.
    * - `helix-map-zoom`: A zoom button or key was pressed, with a direction. Zoom your map in response.
@@ -59772,6 +59837,14 @@ export type CustomElementsSolidJs = {
    * animation is one sentence, and it is the view's state where there is one:
    * the zoom level, the way the map faces, its tilt. A pan has no state to
    * say, so it says which way the map moved.
+   * - `drawn(whole = true) => void`: Says the map has been drawn whole, or with `false`, that it no longer is.
+   *
+   * **Called by whatever draws the map**, as `connectMap` does once its driver
+   * has every tile the view needs and the ground where there is terrain, and
+   * with `false` when it disconnects. A page drawing its own map calls it when
+   * that map is finished. The first call after the map was not drawn sends
+   * `helix-map-ready` and turns on `:state(ready)`, so a page can wait on the
+   * event or select on the state, and a page that connects late reads `ready`.
    * - `rotate(by: number) => void`: Turns the map by some degrees, clockwise where positive.
    * - `faceNorth() => void`: Turns the map to face north.
    * - `tilt(by: number) => void`: Tilts the map by some degrees, toward the horizon where positive.
@@ -59830,6 +59903,7 @@ export type CustomElementsSolidJs = {
    *
    * - `fullscreen`: The map fills the screen.
    * - `idle`: The user has been still long enough for the header and footer to fade.
+   * - `ready`: The map has been drawn whole, after `helix-map-ready`.
    * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
    */
   "helix-map": Partial<

package/types/vue.d.ts

@@ -192,6 +192,7 @@ import type {
   HelixMapPartChangeEvent,
   HelixMapClusterEvent,
   HelixMapPanEvent,
+  HelixMapReadyEvent,
   HelixMapRotateEvent,
   HelixMapTiltEvent,
   HelixMapZoomEvent,
@@ -6968,6 +6969,20 @@ export type HelixMapAreaHelixMapPartChangeElementEvent =
 export type HelixMapAreaVueProps = {
   /** The area's color. Uses your primary color unless set. */
   tone?: (HelixMapArea["tone"]) | undefined;
+  /** Words drawn on the map with the area, such as `A` for a search sector.
+Unset, nothing is drawn. Keep it short: it is a caption on a map, and the
+area's `label` is what a screen reader hears. */
+  caption?: (HelixMapArea["caption"]) | undefined;
+  /** Where the caption stands. `inside`, the default, at the point of the area
+furthest from its edges. `outside`, just above the area's northernmost
+point, clear of the shape, for an area whose caption would cover what is
+in it. */
+  "caption-placement"?: (HelixMapArea["captionPlacement"]) | undefined;
+  /** Where the caption stands. `inside`, the default, at the point of the area
+furthest from its edges. `outside`, just above the area's northernmost
+point, clear of the shape, for an area whose caption would cover what is
+in it. */
+  captionPlacement?: (HelixMapArea["captionPlacement"]) | undefined;
   /** More about the area. Read after its label in the frame's list. */
   description?: (HelixMapArea["description"]) | undefined;
   /** A name this layer shares with other layers, such as a route and its
@@ -7290,6 +7305,9 @@ export type HelixMapHelixMapPanElementEvent =
 /** `helix-map-part-change` event type */
 export type HelixMapHelixMapPartChangeElementEvent =
   HelixMapElementEvent<HelixMapPartChangeEvent>;
+/** `helix-map-ready` event type */
+export type HelixMapHelixMapReadyElementEvent =
+  HelixMapElementEvent<HelixMapReadyEvent>;
 /** `helix-map-rotate` event type */
 export type HelixMapHelixMapRotateElementEvent =
   HelixMapElementEvent<HelixMapRotateEvent>;
@@ -7564,6 +7582,8 @@ export type HelixMapVueEvents = {
   "helix-map-pan": HelixMapHelixMapPanElementEvent;
   /** Clustering was turned on or off. Used by `connectMap`; pages do not need to listen for it. */
   "helix-map-part-change": HelixMapHelixMapPartChangeElementEvent;
+  /** The map has been drawn whole: its style, every tile the view needs, and the ground where it has terrain. Sent once per connection. Show a map that is finished on it, where it would otherwise draw in stages. */
+  "helix-map-ready": HelixMapHelixMapReadyElementEvent;
   /** A rotate or Face north button, or Shift with Left or Right, was pressed. Turn your map in response. */
   "helix-map-rotate": HelixMapHelixMapRotateElementEvent;
   /** The 3D button, or Shift with Up or Down, was pressed. Tilt your map in response. */