@honua/app-platform 0.1.0-beta.0 → 0.1.1-beta.0

package/web-components/elements.js

@@ -1,5 +1,6 @@
 import { createHonuaWebComponentController } from "./controller.js";
 import { HonuaMapLibreRenderer } from "./maplibre-renderer.js";
+import { HonuaMeasurementElement } from "./measurement.js";
 const globalDom = globalThis;
 const HTMLElementBase = globalDom.HTMLElement ?? class {
 };
@@ -348,36 +349,110 @@ export class HonuaMapElement extends HonuaElementBase {
         return "No map package";
     }
 }
+/**
+ * `<honua-layer-list>` — the survival-tier layer list (issue #493). Renders a
+ * row per runtime layer (in style order: the last row draws on top) with:
+ *
+ * - a visibility checkbox bound to `controller.setLayerVisibility`;
+ * - an opacity slider (rendered when the controller implements
+ *   `setLayerOpacity`), committed on `change` so keyboard arrows and pointer
+ *   drags both work;
+ * - reorder affordances (rendered when the controller implements
+ *   `moveLayer`): keyboard-operable "Move up"/"Move down" buttons plus HTML5
+ *   drag-and-drop between rows.
+ *
+ * Rows re-render from controller state events, so external visibility /
+ * opacity / order changes stay in sync. Theme via the `--honua-ui-*` CSS
+ * custom properties; rows are exposed as a `role="list"` of `listitem`s.
+ */
 export class HonuaLayerListElement extends HonuaElementBase {
     static get observedAttributes() {
         return ["for", "label"];
     }
+    #dragLayerId;
+    #layersOverride;
+    /**
+     * The layer rows currently rendered. Headless hosts (for example the
+     * esri-compat LayerList shim delegating through `HonuaWidgetHost`) can
+     * assign this directly to bypass the controller; user toggles then surface
+     * only through the `honua-layer-visibility-change` event. Assign
+     * `undefined` to return to controller-driven rows.
+     */
+    get layers() {
+        return this.#layersOverride ?? this.state?.layers ?? [];
+    }
+    set layers(layers) {
+        this.#layersOverride = layers;
+        this.render();
+    }
     attributeChangedCallback() {
         this.resolveControllerFromContext();
         this.render();
     }
+    controllerChanged() {
+        this.render();
+    }
     render() {
-        const layers = this.state?.layers ?? [];
+        const layers = this.layers;
         const label = this.getAttribute("label") ?? "Layers";
+        const supportsOpacity = typeof this.controller?.setLayerOpacity === "function";
+        const supportsReorder = typeof this.controller?.moveLayer === "function";
         this.setShadowHtml(`
-      <style>${baseStyles()}${listStyles()}</style>
+      <style>${baseStyles()}${listStyles()}${layerListStyles()}</style>
       <fieldset class="panel" part="panel">
         <legend>${escapeHtml(label)}</legend>
         <div class="stack" role="list">
           ${layers.length === 0
             ? `<p class="empty">No layers</p>`
             : layers
-                .map((layer) => `
-            <label class="check-row" role="listitem">
-              <input type="checkbox" data-layer-id="${escapeHtml(layer.id)}" ${layer.visible ? "checked" : ""} />
-              <span>${escapeHtml(layer.title)}</span>
-            </label>
-          `)
+                .map((layer, index) => this.renderRow(layer, index, layers.length, supportsOpacity, supportsReorder))
                 .join("")}
         </div>
       </fieldset>
     `);
-        this.shadowRoot?.querySelectorAll("input[data-layer-id]").forEach((input) => {
+        this.bindRows(supportsReorder);
+    }
+    renderRow(layer, index, count, supportsOpacity, supportsReorder) {
+        const id = escapeAttribute(layer.id);
+        const opacityPercent = Math.round((layer.opacity ?? 1) * 100);
+        // Generic control names ("Opacity", "Move up") keep each row's checkbox as
+        // the only control whose accessible name is the layer title; the
+        // surrounding listitem carries the title for context.
+        const opacity = supportsOpacity
+            ? `
+        <input
+          type="range"
+          class="opacity"
+          part="opacity"
+          min="0"
+          max="100"
+          step="1"
+          value="${opacityPercent}"
+          aria-label="Opacity"
+          aria-valuetext="${opacityPercent}%"
+          data-layer-opacity="${id}"
+        />`
+            : "";
+        const reorder = supportsReorder
+            ? `
+        <button type="button" class="move" part="move-up" aria-label="Move up" data-move="up:${id}" ${index === 0 ? "disabled" : ""}>&#9650;</button>
+        <button type="button" class="move" part="move-down" aria-label="Move down" data-move="down:${id}" ${index === count - 1 ? "disabled" : ""}>&#9660;</button>`
+            : "";
+        return `
+      <div class="layer-row" role="listitem" part="row" data-layer-row="${id}"${supportsReorder ? ` draggable="true"` : ""}>
+        <label class="check-row">
+          <input type="checkbox" data-layer-id="${id}" ${layer.visible ? "checked" : ""} />
+          <span>${escapeHtml(layer.title)}</span>
+        </label>
+        ${supportsOpacity || supportsReorder ? `<div class="layer-row__tools">${opacity}${reorder}</div>` : ""}
+      </div>
+    `;
+    }
+    bindRows(supportsReorder) {
+        const root = this.shadowRoot;
+        if (!root)
+            return;
+        root.querySelectorAll("input[data-layer-id]").forEach((input) => {
             input.addEventListener("change", () => {
                 const layerId = input.dataset.layerId;
                 if (!layerId)
@@ -389,32 +464,154 @@ export class HonuaLayerListElement extends HonuaElementBase {
                 });
             });
         });
+        root.querySelectorAll("input[data-layer-opacity]").forEach((input) => {
+            input.addEventListener("change", () => {
+                const layerId = input.dataset.layerOpacity;
+                if (!layerId)
+                    return;
+                const opacity = Math.min(1, Math.max(0, Number(input.value) / 100));
+                this.controller?.setLayerOpacity?.(layerId, opacity);
+                this.dispatchTypedEvent("honua-layer-opacity-change", { layerId, opacity });
+            });
+        });
+        root.querySelectorAll("button[data-move]").forEach((button) => {
+            button.addEventListener("click", () => {
+                const encoded = button.dataset.move ?? "";
+                const separator = encoded.indexOf(":");
+                if (separator === -1)
+                    return;
+                const direction = encoded.slice(0, separator);
+                const layerId = encoded.slice(separator + 1);
+                this.moveByOffset(layerId, direction === "up" ? -1 : 1);
+            });
+        });
+        if (!supportsReorder)
+            return;
+        root.querySelectorAll("[data-layer-row]").forEach((row) => {
+            row.addEventListener("dragstart", (event) => {
+                const layerId = row.dataset.layerRow;
+                if (!layerId)
+                    return;
+                this.#dragLayerId = layerId;
+                const transfer = event.dataTransfer;
+                transfer?.setData("text/plain", layerId);
+                if (transfer)
+                    transfer.effectAllowed = "move";
+            });
+            row.addEventListener("dragover", (event) => {
+                if (this.#dragLayerId)
+                    event.preventDefault();
+            });
+            row.addEventListener("drop", (event) => {
+                event.preventDefault();
+                const source = this.#dragLayerId ?? event.dataTransfer?.getData("text/plain");
+                const target = row.dataset.layerRow;
+                this.#dragLayerId = undefined;
+                if (!source || !target || source === target)
+                    return;
+                this.moveBefore(source, target);
+            });
+            row.addEventListener("dragend", () => {
+                this.#dragLayerId = undefined;
+            });
+        });
+    }
+    /** Moves a layer one list position up (`-1`) or down (`+1`). */
+    moveByOffset(layerId, offset) {
+        const layers = this.layers;
+        const index = layers.findIndex((layer) => layer.id === layerId);
+        if (index === -1)
+            return;
+        const targetIndex = index + offset;
+        if (targetIndex < 0 || targetIndex >= layers.length)
+            return;
+        const beforeId = offset === -1 ? layers[index - 1]?.id : layers[index + 2]?.id;
+        this.applyMove(layerId, beforeId);
+    }
+    moveBefore(layerId, targetId) {
+        this.applyMove(layerId, targetId);
+    }
+    applyMove(layerId, beforeId) {
+        const controller = this.controller;
+        if (!controller?.moveLayer)
+            return;
+        controller.moveLayer(layerId, beforeId);
+        this.dispatchTypedEvent("honua-layer-order-change", {
+            layerId,
+            ...(beforeId !== undefined ? { beforeId } : {}),
+            order: controller.getState().layers.map((layer) => layer.id),
+        });
     }
 }
+/**
+ * `<honua-legend>` — the survival-tier legend (issue #493). Renders
+ * swatch+label rows from the controller's runtime legend model
+ * (`HonuaLegendItem[]` derived from the map package / renderer metadata) and
+ * reacts to layer visibility changes: entries carrying a `layerId` are hidden
+ * while that layer is toggled off, unless the `include-hidden` attribute is
+ * present.
+ *
+ * Headless hosts (for example the esri-compat Legend shim delegating through
+ * `HonuaWidgetHost`) can bypass the controller and assign the `items`
+ * property directly.
+ *
+ * Swatches are `aria-hidden` presentation; the text labels carry the meaning.
+ * Theme via the `--honua-ui-*` CSS custom properties.
+ */
 export class HonuaLegendElement extends HonuaElementBase {
     static get observedAttributes() {
-        return ["for", "label"];
+        return ["for", "label", "include-hidden"];
+    }
+    #itemsOverride;
+    /**
+     * Explicit legend items. When set, these render instead of the controller
+     * state's legend (visibility coupling still applies when the controller is
+     * also present). Assign `undefined` to return to controller-driven items.
+     */
+    get items() {
+        return this.#itemsOverride;
+    }
+    set items(items) {
+        this.#itemsOverride = items;
+        this.render();
+    }
+    /** Render entries for hidden layers too. Reflects the `include-hidden` attribute. */
+    get includeHidden() {
+        return typeof this.hasAttribute === "function" && this.hasAttribute("include-hidden");
     }
     attributeChangedCallback() {
         this.resolveControllerFromContext();
         this.render();
     }
+    /** The items currently rendered (after layer-visibility filtering). */
+    get visibleItems() {
+        const items = this.#itemsOverride ?? this.state?.legend ?? [];
+        if (this.includeHidden)
+            return items;
+        const layers = this.state?.layers ?? [];
+        return items.filter((item) => {
+            if (!item.layerId)
+                return true;
+            const layer = layers.find((candidate) => candidate.id === item.layerId);
+            return layer ? layer.visible : true;
+        });
+    }
     render() {
-        const legend = this.state?.legend ?? [];
+        const legend = this.visibleItems;
         const label = this.getAttribute("label") ?? "Legend";
         this.setShadowHtml(`
       <style>${baseStyles()}${listStyles()}</style>
       <section class="panel" part="panel" aria-label="${escapeHtml(label)}">
         <h2>${escapeHtml(label)}</h2>
-        <ul class="legend">
+        <ul class="legend" role="list">
           ${legend.length === 0
             ? `<li class="empty">No legend</li>`
             : legend
                 .map((item) => `
-            <li>
+            <li role="listitem" data-legend-item="${escapeAttribute(item.id)}">
               ${item.iconUrl
-                ? `<img class="swatch" alt="" src="${escapeAttribute(item.iconUrl)}" />`
-                : `<span class="swatch" style="--swatch:${escapeAttribute(item.color ?? "#64748b")}"></span>`}
+                ? `<img class="swatch" alt="" aria-hidden="true" src="${escapeAttribute(item.iconUrl)}" />`
+                : `<span class="swatch" aria-hidden="true" style="--swatch:${escapeAttribute(item.color ?? "#64748b")}"></span>`}
               <span>${escapeHtml(item.label)}</span>
             </li>
           `)
@@ -535,37 +732,109 @@ export class HonuaFeatureTableElement extends HonuaElementBase {
         return Number.isFinite(parsed) && parsed > 0 ? parsed : undefined;
     }
 }
+/**
+ * `<honua-search>` — the survival-tier search box (issue #493).
+ *
+ * Two lanes:
+ *
+ * - **Feature search** (default) — submitting the form runs
+ *   `controller.search` over the shared dataset state and renders selectable
+ *   feature results (the pre-existing behavior).
+ * - **Geocoding search** — assign the `geocoder` property a provider
+ *   satisfying {@link HonuaSearchGeocoderLike} (a `HonuaGeocodingClient` from
+ *   the stable `@honua/sdk-js/geocoding` entrypoint fits structurally). The
+ *   input becomes an ARIA combobox with debounced typeahead suggestions
+ *   (`debounce` attribute, default 250 ms) navigated with ArrowUp / ArrowDown,
+ *   accepted with Enter, dismissed with Escape. Selecting a suggestion (or
+ *   submitting) forward-geocodes and pans/zooms the map by writing the
+ *   controller viewport (`zoom` attribute, default 15), then dispatches
+ *   `honua-geocode-select`.
+ */
 export class HonuaSearchElement extends HonuaElementBase {
     static get observedAttributes() {
-        return ["for", "source", "placeholder", "label"];
+        return ["for", "source", "placeholder", "label", "debounce", "zoom"];
     }
     #query = "";
     #results = [];
+    #geocoder;
+    #suggestions = [];
+    #activeIndex = -1;
+    #status = "";
+    #suggestTimer;
+    #suggestToken = 0;
+    #geocodeToken = 0;
+    /** The geocoding provider powering typeahead + geocode-on-submit. */
+    get geocoder() {
+        return this.#geocoder;
+    }
+    set geocoder(geocoder) {
+        this.#geocoder = geocoder;
+        this.#clearSuggestTimer();
+        this.#suggestions = [];
+        this.#activeIndex = -1;
+        this.#status = "";
+        this.render();
+    }
     attributeChangedCallback() {
         this.resolveControllerFromContext();
         this.render();
     }
+    disconnectedCallback() {
+        this.#clearSuggestTimer();
+        super.disconnectedCallback();
+    }
     render() {
         const label = this.getAttribute("label") ?? "Search";
         const placeholder = this.getAttribute("placeholder") ?? "Search";
+        const geocoding = this.#geocoder !== undefined;
+        const expanded = geocoding && this.#suggestions.length > 0;
+        const comboboxAttributes = geocoding
+            ? ` role="combobox" aria-autocomplete="list" aria-expanded="${String(expanded)}" aria-controls="honua-search-listbox"${this.#activeIndex >= 0 ? ` aria-activedescendant="honua-search-option-${this.#activeIndex}"` : ""}`
+            : "";
         this.setShadowHtml(`
       <style>${baseStyles()}${searchStyles()}</style>
       <section class="search" part="panel" aria-label="${escapeHtml(label)}">
         <form>
           <label class="sr-only" for="honua-search-input">${escapeHtml(label)}</label>
-          <input id="honua-search-input" name="q" value="${escapeAttribute(this.#query)}" placeholder="${escapeAttribute(placeholder)}" autocomplete="off" />
+          <input id="honua-search-input" name="q" value="${escapeAttribute(this.#query)}" placeholder="${escapeAttribute(placeholder)}" autocomplete="off"${comboboxAttributes} />
           <button type="submit">Search</button>
         </form>
+        ${geocoding
+            ? `<ul class="suggestions" id="honua-search-listbox" role="listbox" aria-label="${escapeAttribute(`${label} suggestions`)}"${expanded ? "" : " hidden"}>
+          ${this.#suggestions
+                .map((suggestion, index) => `<li id="honua-search-option-${index}" role="option" aria-selected="${String(index === this.#activeIndex)}" data-suggestion-index="${index}">${escapeHtml(suggestion.text)}</li>`)
+                .join("")}
+        </ul>
+        <p class="status" role="status" aria-live="polite">${escapeHtml(this.#status)}</p>`
+            : ""}
         <ul class="results" aria-live="polite">
           ${this.#results.map((result) => `<li><button type="button" data-result-id="${escapeHtml(result.id)}">${escapeHtml(result.label)}</button></li>`).join("")}
         </ul>
       </section>
     `);
+        const input = this.shadowRoot?.querySelector("input[name='q']");
         this.shadowRoot?.querySelector("form")?.addEventListener("submit", (event) => {
             event.preventDefault();
-            const input = this.shadowRoot?.querySelector("input[name='q']");
-            void this.runSearch(input?.value ?? "");
+            const query = input?.value ?? "";
+            if (this.#geocoder)
+                void this.runGeocode(query);
+            else
+                void this.runSearch(query);
         });
+        if (this.#geocoder) {
+            input?.addEventListener("input", () => {
+                this.#query = input.value;
+                this.scheduleSuggest();
+            });
+            input?.addEventListener("keydown", (event) => this.onComboboxKeydown(event));
+            this.shadowRoot?.querySelectorAll("li[data-suggestion-index]").forEach((option) => {
+                option.addEventListener("click", () => {
+                    const index = Number(option.dataset.suggestionIndex);
+                    if (Number.isInteger(index))
+                        void this.selectSuggestion(index);
+                });
+            });
+        }
         this.shadowRoot?.querySelectorAll("button[data-result-id]").forEach((button) => {
             button.addEventListener("click", () => {
                 const result = this.#results.find((candidate) => candidate.id === button.dataset.resultId);
@@ -584,6 +853,126 @@ export class HonuaSearchElement extends HonuaElementBase {
             });
         });
     }
+    onComboboxKeydown(event) {
+        if (this.#suggestions.length === 0)
+            return;
+        if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+            event.preventDefault();
+            const count = this.#suggestions.length;
+            const offset = event.key === "ArrowDown" ? 1 : -1;
+            this.#activeIndex = (this.#activeIndex + offset + count) % count;
+            this.render();
+            return;
+        }
+        if (event.key === "Enter" && this.#activeIndex >= 0) {
+            event.preventDefault();
+            void this.selectSuggestion(this.#activeIndex);
+            return;
+        }
+        if (event.key === "Escape") {
+            event.preventDefault();
+            this.#clearSuggestTimer();
+            this.#suggestions = [];
+            this.#activeIndex = -1;
+            this.render();
+        }
+    }
+    scheduleSuggest() {
+        this.#clearSuggestTimer();
+        const geocoder = this.#geocoder;
+        if (!geocoder?.suggest)
+            return;
+        const text = this.#query.trim();
+        if (!text) {
+            this.#suggestions = [];
+            this.#activeIndex = -1;
+            this.render();
+            return;
+        }
+        this.#suggestTimer = setTimeout(() => {
+            this.#suggestTimer = undefined;
+            void this.runSuggest(text);
+        }, this.debounceMs());
+    }
+    async runSuggest(text) {
+        const geocoder = this.#geocoder;
+        if (!geocoder?.suggest)
+            return;
+        const token = ++this.#suggestToken;
+        try {
+            const suggestions = await geocoder.suggest(text, { maxSuggestions: 8 });
+            if (token !== this.#suggestToken)
+                return;
+            this.#suggestions = suggestions;
+            this.#activeIndex = -1;
+            this.render();
+        }
+        catch (error) {
+            if (token !== this.#suggestToken)
+                return;
+            this.#suggestions = [];
+            this.#activeIndex = -1;
+            this.#status = error instanceof Error ? error.message : "Suggestions unavailable.";
+            this.render();
+        }
+    }
+    async selectSuggestion(index) {
+        const suggestion = this.#suggestions[index];
+        if (!suggestion)
+            return;
+        this.#query = suggestion.text;
+        this.#suggestions = [];
+        this.#activeIndex = -1;
+        await this.runGeocode(suggestion.text);
+    }
+    async runGeocode(query) {
+        const geocoder = this.#geocoder;
+        if (!geocoder)
+            return;
+        this.#clearSuggestTimer();
+        this.#suggestToken += 1;
+        // Overlapping geocodes resolve out of order on slow networks; only the
+        // most recent request may write the viewport/status or emit the event.
+        const token = ++this.#geocodeToken;
+        this.#query = query;
+        this.#suggestions = [];
+        this.#activeIndex = -1;
+        const trimmed = query.trim();
+        if (!trimmed) {
+            this.#status = "";
+            this.render();
+            return;
+        }
+        try {
+            const candidates = await geocoder.forwardGeocode(trimmed, { maxResults: 1 });
+            if (token !== this.#geocodeToken)
+                return;
+            const candidate = candidates[0];
+            if (!candidate) {
+                this.#status = `No results for "${trimmed}".`;
+                this.render();
+                return;
+            }
+            const viewport = {
+                center: [candidate.longitude, candidate.latitude],
+                zoom: this.resultZoom(),
+            };
+            this.controller?.setViewport(viewport);
+            this.#status = candidate.address;
+            this.dispatchTypedEvent("honua-geocode-select", {
+                query: trimmed,
+                candidate,
+                viewport,
+            });
+            this.render();
+        }
+        catch (error) {
+            if (token !== this.#geocodeToken)
+                return;
+            this.#status = error instanceof Error ? error.message : "Geocoding failed.";
+            this.render();
+        }
+    }
     async runSearch(query) {
         this.#query = query;
         const sourceId = this.getAttribute("source") ?? undefined;
@@ -591,6 +980,20 @@ export class HonuaSearchElement extends HonuaElementBase {
         this.dispatchTypedEvent("honua-search", { query, results: this.#results });
         this.render();
     }
+    debounceMs() {
+        const parsed = Number(this.getAttribute("debounce"));
+        return Number.isFinite(parsed) && parsed >= 0 ? parsed : 250;
+    }
+    resultZoom() {
+        const parsed = Number(this.getAttribute("zoom"));
+        return Number.isFinite(parsed) ? parsed : 15;
+    }
+    #clearSuggestTimer() {
+        if (this.#suggestTimer === undefined)
+            return;
+        clearTimeout(this.#suggestTimer);
+        this.#suggestTimer = undefined;
+    }
 }
 export class HonuaEditorElement extends HonuaElementBase {
     static get observedAttributes() {
@@ -1160,6 +1563,7 @@ export function defineHonuaWebComponents(registry = globalDom.customElements) {
     defineIfMissing(registry, "honua-bookmarks", HonuaBookmarksElement);
     defineIfMissing(registry, "honua-locate-control", HonuaLocateControlElement);
     defineIfMissing(registry, "honua-measure-control", HonuaMeasureControlElement);
+    defineIfMissing(registry, "honua-measurement", HonuaMeasurementElement);
     defineIfMissing(registry, "honua-sketch-control", HonuaSketchControlElement);
     defineIfMissing(registry, "honua-print-export", HonuaPrintExportElement);
     defineIfMissing(registry, "honua-map-status", HonuaMapStatusElement);
@@ -1499,6 +1903,24 @@ function listStyles() {
     img.swatch { object-fit: cover; }
   `;
 }
+function layerListStyles() {
+    return `
+    .layer-row {
+      border-top: 1px solid transparent;
+      display: grid;
+      gap: 4px;
+    }
+    .layer-row[draggable="true"] { cursor: grab; }
+    .layer-row__tools {
+      align-items: center;
+      display: flex;
+      gap: 6px;
+      padding-left: 24px;
+    }
+    .opacity { flex: 1; min-width: 60px; }
+    .move { min-width: 32px; padding: 0; }
+  `;
+}
 function tableStyles() {
     return `
     .table-panel {
@@ -1546,6 +1968,23 @@ function searchStyles() {
     }
     .results { display: grid; gap: 6px; list-style: none; margin: 10px 0 0; padding: 0; }
     .results button { text-align: left; width: 100%; }
+    .suggestions {
+      border: 1px solid var(--honua-ui-border);
+      border-radius: 6px;
+      display: grid;
+      list-style: none;
+      margin: 6px 0 0;
+      overflow: hidden;
+      padding: 0;
+    }
+    .suggestions[hidden] { display: none; }
+    .suggestions [role="option"] { cursor: pointer; padding: 6px 9px; }
+    .suggestions [role="option"][aria-selected="true"] {
+      background: var(--honua-ui-accent);
+      color: var(--honua-ui-accent-fg);
+    }
+    .status { color: var(--honua-ui-muted); margin: 6px 0 0; }
+    .status:empty { display: none; }
   `;
 }
 function editorStyles() {

package/web-components/index.d.ts

@@ -13,6 +13,12 @@
  * `createHonuaWebComponentController`. Without a provider both controls render
  * disabled by design with a "configure a provider" affordance.
  *
+ * The survival-tier widget set (issue #493) — `<honua-legend>`,
+ * `<honua-layer-list>` (visibility / opacity / reorder), `<honua-search>`
+ * (geocoding-provider-aware), and `<honua-measurement>` (self-contained
+ * distance/area drawing on the map's pointer events, computed with
+ * `@honua/geometry` ops) — needs no external drawing provider.
+ *
  * @experimental This entrypoint is not yet covered by the SDK's semver contract
  *   — the surface may change in any minor release prior to `1.0.0`.
  * @module
@@ -20,5 +26,6 @@
 import "./elements.js";
 export { HonuaInMemoryWebComponentController, createHonuaWebComponentController, createHonuaWebComponentControllerFromRuntime, layersFromMapPackage, legendFromMapPackage, } from "./controller.js";
 export { HonuaActionPanelElement, HonuaBasemapControlElement, HonuaBookmarksElement, HonuaChartElement, HonuaEditorElement, HonuaFeatureTableElement, HonuaLayerListElement, HonuaLegendElement, HonuaLocateControlElement, HonuaMapElement, HonuaMapStatusElement, HonuaMeasureControlElement, HonuaPrintExportElement, HonuaSearchElement, HonuaSketchControlElement, defineHonuaWebComponents, } from "./elements.js";
-export type { HonuaActionDetail, HonuaActionPanelAction, HonuaBasemapChangeDetail, HonuaBookmark, HonuaBookmarkChangeDetail, CreateHonuaWebComponentControllerOptions, HonuaChartDatum, HonuaChartModel, HonuaComponentStatus, HonuaControllerReadyDetail, HonuaControllerStateListener, HonuaControllerSubscription, HonuaEditCapabilities, HonuaEditChangeDetail, HonuaEditRequest, HonuaEditorModel, HonuaExportDetail, HonuaFeatureRecord, HonuaFeatureStateEntry, HonuaFeatureStateTarget, HonuaFeatureTableModel, HonuaFilterChangeDetail, HonuaFilterState, HonuaFullscreenChangeDetail, HonuaLayerModel, HonuaLayerVisibilityChangeDetail, HonuaLegendItem, HonuaLocateChangeDetail, HonuaMapClickDetail, HonuaMapErrorDetail, HonuaMapHoverDetail, HonuaMapInteractionDetail, HonuaMapInteractionPoint, HonuaMapReadyDetail, HonuaMeasureChangeDetail, HonuaMeasureMode, HonuaMeasureProvider, HonuaMeasureResult, HonuaQueryFeaturesOptions, HonuaSearchDetail, HonuaSearchOptions, HonuaSearchResult, HonuaSelectionChangeDetail, HonuaSelectionState, HonuaSketchChangeDetail, HonuaSketchMode, HonuaSketchProvider, HonuaSketchResult, HonuaViewportChangeDetail, HonuaViewportState, HonuaWebComponentController, HonuaWebComponentRuntimeLike, HonuaWebComponentState, } from "./types.js";
+export { HonuaMeasurementElement, defineHonuaMeasurement } from "./measurement.js";
+export type { HonuaActionDetail, HonuaActionPanelAction, HonuaBasemapChangeDetail, HonuaBookmark, HonuaBookmarkChangeDetail, CreateHonuaWebComponentControllerOptions, HonuaChartDatum, HonuaChartModel, HonuaComponentStatus, HonuaControllerReadyDetail, HonuaControllerStateListener, HonuaControllerSubscription, HonuaEditCapabilities, HonuaEditChangeDetail, HonuaEditRequest, HonuaEditorModel, HonuaExportDetail, HonuaFeatureRecord, HonuaFeatureStateEntry, HonuaFeatureStateTarget, HonuaFeatureTableModel, HonuaFilterChangeDetail, HonuaFilterState, HonuaFullscreenChangeDetail, HonuaGeocodeSelectDetail, HonuaLayerModel, HonuaLayerOpacityChangeDetail, HonuaLayerOrderChangeDetail, HonuaLayerVisibilityChangeDetail, HonuaLegendItem, HonuaLocateChangeDetail, HonuaMapClickDetail, HonuaMapErrorDetail, HonuaMapHoverDetail, HonuaMapInteractionDetail, HonuaMapInteractionPoint, HonuaMapReadyDetail, HonuaMeasureChangeDetail, HonuaMeasureMode, HonuaMeasureProvider, HonuaMeasureResult, HonuaMeasurementMap, HonuaQueryFeaturesOptions, HonuaSearchDetail, HonuaSearchGeocodeCandidate, HonuaSearchGeocodeSuggestion, HonuaSearchGeocoderLike, HonuaSearchOptions, HonuaSearchResult, HonuaSelectionChangeDetail, HonuaSelectionState, HonuaSketchChangeDetail, HonuaSketchMode, HonuaSketchProvider, HonuaSketchResult, HonuaViewportChangeDetail, HonuaViewportState, HonuaWebComponentController, HonuaWebComponentRuntimeLike, HonuaWebComponentState, } from "./types.js";
 //# sourceMappingURL=index.d.ts.map

package/web-components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/web-components/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,OAAO,eAAe,CAAC;AAEvB,OAAO,EACL,mCAAmC,EACnC,iCAAiC,EACjC,4CAA4C,EAC5C,oBAAoB,EACpB,oBAAoB,GACrB,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EACL,uBAAuB,EACvB,0BAA0B,EAC1B,qBAAqB,EACrB,iBAAiB,EACjB,kBAAkB,EAClB,wBAAwB,EACxB,qBAAqB,EACrB,kBAAkB,EAClB,yBAAyB,EACzB,eAAe,EACf,qBAAqB,EACrB,0BAA0B,EAC1B,uBAAuB,EACvB,kBAAkB,EAClB,yBAAyB,EACzB,wBAAwB,GACzB,MAAM,eAAe,CAAC;AAEvB,YAAY,EACV,iBAAiB,EACjB,sBAAsB,EACtB,wBAAwB,EACxB,aAAa,EACb,yBAAyB,EACzB,wCAAwC,EACxC,eAAe,EACf,eAAe,EACf,oBAAoB,EACpB,0BAA0B,EAC1B,4BAA4B,EAC5B,2BAA2B,EAC3B,qBAAqB,EACrB,qBAAqB,EACrB,gBAAgB,EAChB,gBAAgB,EAChB,iBAAiB,EACjB,kBAAkB,EAClB,sBAAsB,EACtB,uBAAuB,EACvB,sBAAsB,EACtB,uBAAuB,EACvB,gBAAgB,EAChB,2BAA2B,EAC3B,eAAe,EACf,gCAAgC,EAChC,eAAe,EACf,uBAAuB,EACvB,mBAAmB,EACnB,mBAAmB,EACnB,mBAAmB,EACnB,yBAAyB,EACzB,wBAAwB,EACxB,mBAAmB,EACnB,wBAAwB,EACxB,gBAAgB,EAChB,oBAAoB,EACpB,kBAAkB,EAClB,yBAAyB,EACzB,iBAAiB,EACjB,kBAAkB,EAClB,iBAAiB,EACjB,0BAA0B,EAC1B,mBAAmB,EACnB,uBAAuB,EACvB,eAAe,EACf,mBAAmB,EACnB,iBAAiB,EACjB,yBAAyB,EACzB,kBAAkB,EAClB,2BAA2B,EAC3B,4BAA4B,EAC5B,sBAAsB,GACvB,MAAM,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/web-components/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,OAAO,eAAe,CAAC;AAEvB,OAAO,EACL,mCAAmC,EACnC,iCAAiC,EACjC,4CAA4C,EAC5C,oBAAoB,EACpB,oBAAoB,GACrB,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EACL,uBAAuB,EACvB,0BAA0B,EAC1B,qBAAqB,EACrB,iBAAiB,EACjB,kBAAkB,EAClB,wBAAwB,EACxB,qBAAqB,EACrB,kBAAkB,EAClB,yBAAyB,EACzB,eAAe,EACf,qBAAqB,EACrB,0BAA0B,EAC1B,uBAAuB,EACvB,kBAAkB,EAClB,yBAAyB,EACzB,wBAAwB,GACzB,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,uBAAuB,EAAE,sBAAsB,EAAE,MAAM,kBAAkB,CAAC;AAEnF,YAAY,EACV,iBAAiB,EACjB,sBAAsB,EACtB,wBAAwB,EACxB,aAAa,EACb,yBAAyB,EACzB,wCAAwC,EACxC,eAAe,EACf,eAAe,EACf,oBAAoB,EACpB,0BAA0B,EAC1B,4BAA4B,EAC5B,2BAA2B,EAC3B,qBAAqB,EACrB,qBAAqB,EACrB,gBAAgB,EAChB,gBAAgB,EAChB,iBAAiB,EACjB,kBAAkB,EAClB,sBAAsB,EACtB,uBAAuB,EACvB,sBAAsB,EACtB,uBAAuB,EACvB,gBAAgB,EAChB,2BAA2B,EAC3B,wBAAwB,EACxB,eAAe,EACf,6BAA6B,EAC7B,2BAA2B,EAC3B,gCAAgC,EAChC,eAAe,EACf,uBAAuB,EACvB,mBAAmB,EACnB,mBAAmB,EACnB,mBAAmB,EACnB,yBAAyB,EACzB,wBAAwB,EACxB,mBAAmB,EACnB,wBAAwB,EACxB,gBAAgB,EAChB,oBAAoB,EACpB,kBAAkB,EAClB,mBAAmB,EACnB,yBAAyB,EACzB,iBAAiB,EACjB,2BAA2B,EAC3B,4BAA4B,EAC5B,uBAAuB,EACvB,kBAAkB,EAClB,iBAAiB,EACjB,0BAA0B,EAC1B,mBAAmB,EACnB,uBAAuB,EACvB,eAAe,EACf,mBAAmB,EACnB,iBAAiB,EACjB,yBAAyB,EACzB,kBAAkB,EAClB,2BAA2B,EAC3B,4BAA4B,EAC5B,sBAAsB,GACvB,MAAM,YAAY,CAAC"}

package/web-components/index.js

@@ -13,6 +13,12 @@
  * `createHonuaWebComponentController`. Without a provider both controls render
  * disabled by design with a "configure a provider" affordance.
  *
+ * The survival-tier widget set (issue #493) — `<honua-legend>`,
+ * `<honua-layer-list>` (visibility / opacity / reorder), `<honua-search>`
+ * (geocoding-provider-aware), and `<honua-measurement>` (self-contained
+ * distance/area drawing on the map's pointer events, computed with
+ * `@honua/geometry` ops) — needs no external drawing provider.
+ *
  * @experimental This entrypoint is not yet covered by the SDK's semver contract
  *   — the surface may change in any minor release prior to `1.0.0`.
  * @module
@@ -20,3 +26,4 @@
 import "./elements.js";
 export { HonuaInMemoryWebComponentController, createHonuaWebComponentController, createHonuaWebComponentControllerFromRuntime, layersFromMapPackage, legendFromMapPackage, } from "./controller.js";
 export { HonuaActionPanelElement, HonuaBasemapControlElement, HonuaBookmarksElement, HonuaChartElement, HonuaEditorElement, HonuaFeatureTableElement, HonuaLayerListElement, HonuaLegendElement, HonuaLocateControlElement, HonuaMapElement, HonuaMapStatusElement, HonuaMeasureControlElement, HonuaPrintExportElement, HonuaSearchElement, HonuaSketchControlElement, defineHonuaWebComponents, } from "./elements.js";
+export { HonuaMeasurementElement, defineHonuaMeasurement } from "./measurement.js";

package/web-components/maplibre-renderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"maplibre-renderer.d.ts","sourceRoot":"","sources":["../../../src/web-components/maplibre-renderer.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAErD,OAAO,KAAK,EAGV,mBAAmB,EACnB,mBAAmB,EACnB,mBAAmB,EACnB,mBAAmB,EACnB,0BAA0B,EAC1B,yBAAyB,EACzB,2BAA2B,EAC3B,4BAA4B,EAC5B,sBAAsB,EACvB,MAAM,YAAY,CAAC;AAqCpB,MAAM,WAAW,4BAA4B,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IACvE,SAAS,EAAE,WAAW,CAAC;IACvB,SAAS,IAAI,WAAW,GAAG,SAAS,CAAC;IACrC,aAAa,IAAI,2BAA2B,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC;IAC5D,OAAO,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;IAC9C,OAAO,CAAC,MAAM,EAAE,mBAAmB,GAAG,IAAI,CAAC;IAC3C,UAAU,CAAC,MAAM,EAAE,yBAAyB,GAAG,IAAI,CAAC;IACpD,OAAO,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;IAC9C,OAAO,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;IAC9C,WAAW,CAAC,MAAM,EAAE,0BAA0B,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;CAC1D;AAED,qBAAa,qBAAqB,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;;gBAczC,OAAO,EAAE,4BAA4B,CAAC,CAAC,CAAC;IAI3D,IAAW,GAAG,IAAI,OAAO,GAAG,SAAS,CAEpC;IAED,IAAW,OAAO,IAAI,4BAA4B,CAAC,CAAC,CAAC,GAAG,SAAS,CAEhE;IAEY,UAAU,CAAC,KAAK,EAAE,sBAAsB,CAAC,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;IAgBjE,UAAU,IAAI,IAAI;CAuT1B"}
+{"version":3,"file":"maplibre-renderer.d.ts","sourceRoot":"","sources":["../../../src/web-components/maplibre-renderer.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAErD,OAAO,KAAK,EAGV,mBAAmB,EACnB,mBAAmB,EACnB,mBAAmB,EACnB,mBAAmB,EACnB,0BAA0B,EAC1B,yBAAyB,EACzB,2BAA2B,EAC3B,4BAA4B,EAC5B,sBAAsB,EACvB,MAAM,YAAY,CAAC;AAqCpB,MAAM,WAAW,4BAA4B,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IACvE,SAAS,EAAE,WAAW,CAAC;IACvB,SAAS,IAAI,WAAW,GAAG,SAAS,CAAC;IACrC,aAAa,IAAI,2BAA2B,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC;IAC5D,OAAO,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;IAC9C,OAAO,CAAC,MAAM,EAAE,mBAAmB,GAAG,IAAI,CAAC;IAC3C,UAAU,CAAC,MAAM,EAAE,yBAAyB,GAAG,IAAI,CAAC;IACpD,OAAO,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;IAC9C,OAAO,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;IAC9C,WAAW,CAAC,MAAM,EAAE,0BAA0B,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;CAC1D;AAED,qBAAa,qBAAqB,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;;gBAgBzC,OAAO,EAAE,4BAA4B,CAAC,CAAC,CAAC;IAI3D,IAAW,GAAG,IAAI,OAAO,GAAG,SAAS,CAEpC;IAED,IAAW,OAAO,IAAI,4BAA4B,CAAC,CAAC,CAAC,GAAG,SAAS,CAEhE;IAEY,UAAU,CAAC,KAAK,EAAE,sBAAsB,CAAC,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;IAkBjE,UAAU,IAAI,IAAI;CAwW1B"}