@nasa-terra/components 0.0.185 → 0.0.186

package/cdn/chunks/chunk.FNLDWEWY.js

@@ -1,514 +0,0 @@
-import {
-  SpatialPickerService
-} from "./chunk.RIX7X2OX.js";
-import {
-  spatial_picker_styles_default
-} from "./chunk.35MV26JZ.js";
-import {
-  TerraMap
-} from "./chunk.ODIU7SOE.js";
-import {
-  LatLng
-} from "./chunk.SN3T4SQP.js";
-import {
-  TerraInput
-} from "./chunk.4J575NT4.js";
-import {
-  TerraDropdown
-} from "./chunk.6SFTEJ5X.js";
-import {
-  e as e2,
-  n as n2
-} from "./chunk.LRZIT4M2.js";
-import {
-  TerraElement,
-  component_styles_default,
-  e,
-  n,
-  r
-} from "./chunk.D4C4IM6K.js";
-import {
-  A,
-  b
-} from "./chunk.RRCYT4LP.js";
-import {
-  __decorateClass,
-  init_buffer,
-  init_dirname,
-  init_process
-} from "./chunk.ZEOVK2FE.js";
-
-// src/components/spatial-picker/spatial-picker.component.ts
-init_dirname();
-init_buffer();
-init_process();
-var TerraSpatialPicker = class extends TerraElement {
-  constructor() {
-    super(...arguments);
-    this.minZoom = 0;
-    this.maxZoom = 23;
-    this.zoom = 1;
-    this.hasNavigation = true;
-    this.hasCoordTracker = true;
-    this.hasShapeSelector = false;
-    this.showBoundingBoxSelection = true;
-    this.showPointSelection = true;
-    this.initialValue = "";
-    this.hideLabel = false;
-    this.label = "Select Region";
-    this.spatialConstraints = "-180, -90, 180, 90";
-    this.isExpanded = false;
-    this.worldWrap = false;
-    this.inline = false;
-    this.showMapOnFocus = false;
-    this.urlState = false;
-    this.helpText = "";
-    this.error = "";
-    this.dropdownRef = e2();
-  }
-  set hideBoundingBoxSelection(value) {
-    console.warn(
-      '"hide-bounding-box-selection" is deprecated. Use "show-bounding-box-selection" instead.'
-    );
-    this.showBoundingBoxSelection = !value;
-  }
-  get hideBoundingBoxSelection() {
-    return !this.showBoundingBoxSelection;
-  }
-  set hidePointSelection(value) {
-    console.warn(
-      '"hide-point-selection" is deprecated. Use "show-point-selection" instead.'
-    );
-    this.showPointSelection = !value;
-  }
-  get hidePointSelection() {
-    return !this.showPointSelection;
-  }
-  // ─── Derived helpers ───────────────────────────────────────────────────────
-  get _allowedTypes() {
-    return {
-      allowPoint: this.showPointSelection,
-      allowBbox: this.showBoundingBoxSelection
-    };
-  }
-  firstUpdated() {
-    const urlParams = new URLSearchParams(window.location.search);
-    const spatialParam = urlParams.get("spatial");
-    const seed = this.urlState && spatialParam ? spatialParam : this.initialValue;
-    if (seed) {
-      if (typeof seed === "string") {
-        this._applyValue(seed, { emit: false });
-      } else {
-        this._commit(SpatialPickerService.serialize(seed), seed);
-      }
-    }
-  }
-  // ─── Public API ────────────────────────────────────────────────────────────
-  setValue(value) {
-    this._applyValue(value, { emit: true });
-  }
-  clear() {
-    this._clearValue();
-  }
-  open() {
-    var _a;
-    if (!this.inline)
-      (_a = this.dropdownRef.value) == null ? void 0 : _a.show();
-  }
-  close() {
-    var _a;
-    if (!this.inline)
-      (_a = this.dropdownRef.value) == null ? void 0 : _a.hide();
-  }
-  setOpen(open) {
-    open ? this.open() : this.close();
-  }
-  // ─── Input event handlers ──────────────────────────────────────────────────
-  _input() {
-    var _a;
-    this.error = "";
-    (_a = this.terraInput) == null ? void 0 : _a.setCustomValidity("");
-  }
-  _change() {
-    var _a, _b;
-    this._input();
-    const raw = (_b = (_a = this.terraInput) == null ? void 0 : _a.value) != null ? _b : "";
-    if (!raw.trim()) {
-      this._clearValue();
-      return;
-    }
-    this._validateAndCommit(raw);
-  }
-  _keydown(event) {
-    var _a, _b, _c;
-    if (event.key === " ") {
-      event.stopPropagation();
-      return;
-    }
-    if (event.key === "Enter") {
-      event.preventDefault();
-      this._validateAndCommit((_b = (_a = this.terraInput) == null ? void 0 : _a.value) != null ? _b : "");
-      (_c = this.terraInput) == null ? void 0 : _c.blur();
-    }
-  }
-  _blur() {
-    var _a, _b;
-    this._validateAndCommit((_b = (_a = this.terraInput) == null ? void 0 : _a.value) != null ? _b : "");
-  }
-  _focus() {
-    var _a;
-    if (this.showMapOnFocus && !this.inline) {
-      (_a = this.dropdownRef.value) == null ? void 0 : _a.show();
-    }
-  }
-  _click(e3) {
-    e3.stopPropagation();
-    if (!this.inline) {
-      this.isExpanded ? this.close() : this.open();
-    }
-  }
-  // ─── Map event handler ─────────────────────────────────────────────────────
-  _handleMapChange(event) {
-    const detail = event.detail;
-    if (detail.cause === "clear") {
-      this._clearValue();
-      return;
-    }
-    if (detail.cause !== "draw")
-      return;
-    let value;
-    if (detail.type === "bbox" /* BBOX */ && detail.bounds) {
-      value = detail.bounds;
-    } else if (detail.type === "point" /* POINT */ && detail.latLng) {
-      value = detail.latLng;
-    } else {
-      this.emit("terra-map-change", { detail });
-      return;
-    }
-    const constraintError = SpatialPickerService.validateConstraints(
-      value,
-      this.spatialConstraints
-    );
-    if (constraintError) {
-      this.error = constraintError;
-      this.mapValue = void 0;
-      return;
-    }
-    const serialized = SpatialPickerService.serialize(value);
-    this._commit(serialized, value);
-  }
-  // ─── Dropdown handlers ─────────────────────────────────────────────────────
-  handleDropdownShow() {
-    this.isExpanded = true;
-  }
-  handleDropdownHide() {
-    this.isExpanded = false;
-  }
-  // ─── Internal helpers ──────────────────────────────────────────────────────
-  /**
-   * Parse, validate and commit a raw string value.
-   */
-  _validateAndCommit(raw) {
-    var _a;
-    if (!raw.trim()) {
-      this._clearValue();
-      return;
-    }
-    const result = SpatialPickerService.validate(
-      raw,
-      this._allowedTypes,
-      this.spatialConstraints
-    );
-    if (!result.ok) {
-      this.error = result.error;
-      (_a = this.terraInput) == null ? void 0 : _a.setCustomValidity(result.error);
-      return;
-    }
-    this._commit(result.serialized, result.value);
-  }
-  /**
-   * Apply a value without going through the validation pipeline
-   * (used for initialValue / setValue where we still want to display what
-   * was given, but we do want to show an error if it's malformed).
-   */
-  _applyValue(raw, { emit }) {
-    if (typeof raw !== "string") {
-      const serialized = SpatialPickerService.serialize(raw);
-      this.error = "";
-      this.mapValue = serialized;
-      if (this.terraInput)
-        this.terraInput.value = serialized;
-      if (emit)
-        this._emitChange(raw);
-      this._updateURLParam(serialized);
-      return;
-    }
-    const result = SpatialPickerService.validate(
-      raw,
-      this._allowedTypes,
-      this.spatialConstraints
-    );
-    if (!result.ok) {
-      this.error = result.error;
-      return;
-    }
-    this.error = "";
-    this.mapValue = result.serialized;
-    if (this.terraInput)
-      this.terraInput.value = result.serialized;
-    if (emit) {
-      this._emitChange(result.value);
-    }
-    this._updateURLParam(result.serialized);
-  }
-  /**
-   * Commit a validated value: sync UI, mapValue, URL, and emit.
-   */
-  _commit(serialized, value) {
-    var _a;
-    this.error = "";
-    (_a = this.terraInput) == null ? void 0 : _a.setCustomValidity("");
-    this.mapValue = serialized;
-    if (this.terraInput)
-      this.terraInput.value = serialized;
-    this.initialValue = serialized;
-    this._updateURLParam(serialized);
-    this._emitChange(value);
-  }
-  _clearValue() {
-    var _a;
-    this.error = "";
-    this.mapValue = void 0;
-    (_a = this.terraInput) == null ? void 0 : _a.setCustomValidity("");
-    if (this.terraInput)
-      this.terraInput.value = "";
-    this._updateURLParam(null);
-  }
-  _emitChange(value) {
-    if (value instanceof LatLng) {
-      this.emit("terra-map-change", {
-        detail: {
-          cause: "draw",
-          type: "point" /* POINT */,
-          latLng: value
-        }
-      });
-    } else {
-      this.emit("terra-map-change", {
-        detail: {
-          cause: "draw",
-          type: "bbox" /* BBOX */,
-          bounds: value
-        }
-      });
-    }
-  }
-  _updateURLParam(value) {
-    if (!this.urlState)
-      return;
-    const url = new URL(window.location.href);
-    value ? url.searchParams.set("spatial", value) : url.searchParams.delete("spatial");
-    window.history.replaceState({}, "", url.toString());
-  }
-  // ─── Rendering ─────────────────────────────────────────────────────────────
-  renderMap() {
-    return b`<terra-map
-            class="${this.inline ? "inline" : ""}"
-            exportparts="map"
-            min-zoom=${this.minZoom}
-            max-zoom=${this.maxZoom}
-            zoom=${this.zoom}
-            ?show-mouse-coordinates=${this.hasCoordTracker}
-            .value=${this.mapValue}
-            ?has-navigation=${this.hasNavigation}
-            ?has-shape-selector=${this.hasShapeSelector}
-            ?show-bounding-box-selection=${this.showBoundingBoxSelection}
-            ?show-point-selection=${this.showPointSelection}
-            ?no-world-wrap=${!this.worldWrap}
-            spatial-constraints=${this.spatialConstraints}
-            @terra-map-change=${this._handleMapChange}
-        ></terra-map>`;
-  }
-  _inputTemplate(slot) {
-    return b`<terra-input
-            slot=${slot != null ? slot : A}
-            .label=${this.label}
-            .hideLabel=${this.hideLabel}
-            .value=${SpatialPickerService.serialize(this.initialValue)}
-            placeholder="${this.spatialConstraints}"
-            aria-controls="map"
-            aria-expanded=${this.inline ? true : this.isExpanded}
-            @terra-input=${this._input}
-            @terra-change=${this._change}
-            @terra-blur=${this._blur}
-            @terra-focus=${this._focus}
-            @keydown=${this._keydown}
-            @click=${(e3) => {
-      e3.stopPropagation();
-      this._click(e3);
-    }}
-            name="spatial"
-            .helpText=${this.helpText}
-        >
-            <div slot="suffix" class="spatial-picker__suffix-icons">
-                ${this.mapValue ? b`<button
-                          type="button"
-                          class="spatial-picker__clear-btn"
-                          aria-label="Clear input"
-                          tabindex="-1"
-                          @click=${(e3) => {
-      e3.stopPropagation();
-      this._clearValue();
-    }}
-                      >
-                          <svg
-                              xmlns="http://www.w3.org/2000/svg"
-                              viewBox="0 0 24 24"
-                              fill="currentColor"
-                          >
-                              <path
-                                  fill-rule="evenodd"
-                                  d="M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25Zm-1.72 6.97a.75.75 0 1 0-1.06 1.06L10.94 12l-1.72 1.72a.75.75 0 1 0 1.06 1.06L12 13.06l1.72 1.72a.75.75 0 1 0 1.06-1.06L13.06 12l1.72-1.72a.75.75 0 1 0-1.06-1.06L12 10.94l-1.72-1.72Z"
-                                  clip-rule="evenodd"
-                              />
-                          </svg>
-                      </button>` : A}
-                <svg
-                    class="spatial-picker__input_icon"
-                    xmlns="http://www.w3.org/2000/svg"
-                    fill="none"
-                    viewBox="0 0 24 24"
-                    stroke-width="1.5"
-                    stroke="currentColor"
-                    @click=${this._click}
-                >
-                    <path
-                        stroke-linecap="round"
-                        stroke-linejoin="round"
-                        d="M9 6.75V15m6-6v8.25m.503 3.498 4.875-2.437c.381-.19.622-.58.622-1.006V4.82c0-.836-.88-1.38-1.628-1.006l-3.869 1.934c-.317.159-.69.159-1.006 0L9.503 3.252a1.125 1.125 0 0 0-1.006 0L3.622 5.689C3.24 5.88 3 6.27 3 6.695V19.18c0 .836.88 1.38 1.628 1.006l3.869-1.934c.317-.159.69-.159 1.006 0l4.994 2.497c.317.158.69.158 1.006 0Z"
-                    />
-                </svg>
-            </div>
-        </terra-input>`;
-  }
-  render() {
-    if (this.inline) {
-      return b`
-                <div class="spatial-picker">
-                    ${this._inputTemplate()}
-                    <slot name="additional-text"></slot>
-                    <div
-                        class="spatial-picker__map-container spatial-picker__map-container--inline"
-                    >
-                        ${this.renderMap()}
-                    </div>
-                    ${this.error ? b`<div class="spatial-picker__error">${this.error}</div>` : A}
-                </div>
-            `;
-    }
-    return b`
-            <div class="spatial-picker">
-                <terra-dropdown
-                    ${n2(this.dropdownRef)}
-                    placement="bottom-start"
-                    distance="4"
-                    @terra-show=${this.handleDropdownShow}
-                    @terra-hide=${this.handleDropdownHide}
-                    hoist
-                >
-                    ${this._inputTemplate("trigger")}
-                    <slot name="additional-text"></slot>
-                    <div
-                        class="spatial-picker__map-container"
-                        @click=${(e3) => e3.stopPropagation()}
-                    >
-                        ${this.renderMap()}
-                    </div>
-                </terra-dropdown>
-                ${this.error ? b`<div class="spatial-picker__error">${this.error}</div>` : A}
-            </div>
-        `;
-  }
-};
-TerraSpatialPicker.styles = [component_styles_default, spatial_picker_styles_default];
-TerraSpatialPicker.dependencies = {
-  "terra-map": TerraMap,
-  "terra-input": TerraInput,
-  "terra-dropdown": TerraDropdown
-};
-__decorateClass([
-  n({ attribute: "min-zoom", type: Number })
-], TerraSpatialPicker.prototype, "minZoom", 2);
-__decorateClass([
-  n({ attribute: "max-zoom", type: Number })
-], TerraSpatialPicker.prototype, "maxZoom", 2);
-__decorateClass([
-  n({ type: Number })
-], TerraSpatialPicker.prototype, "zoom", 2);
-__decorateClass([
-  n({ attribute: "has-navigation", type: Boolean })
-], TerraSpatialPicker.prototype, "hasNavigation", 2);
-__decorateClass([
-  n({ attribute: "has-coord-tracker", type: Boolean })
-], TerraSpatialPicker.prototype, "hasCoordTracker", 2);
-__decorateClass([
-  n({ attribute: "has-shape-selector", type: Boolean })
-], TerraSpatialPicker.prototype, "hasShapeSelector", 2);
-__decorateClass([
-  n({ attribute: "show-bounding-box-selection", type: Boolean })
-], TerraSpatialPicker.prototype, "showBoundingBoxSelection", 2);
-__decorateClass([
-  n({ attribute: "hide-bounding-box-selection", type: Boolean })
-], TerraSpatialPicker.prototype, "hideBoundingBoxSelection", 1);
-__decorateClass([
-  n({ attribute: "show-point-selection", type: Boolean })
-], TerraSpatialPicker.prototype, "showPointSelection", 2);
-__decorateClass([
-  n({ attribute: "hide-point-selection", type: Boolean })
-], TerraSpatialPicker.prototype, "hidePointSelection", 1);
-__decorateClass([
-  n({ attribute: "initial-value" })
-], TerraSpatialPicker.prototype, "initialValue", 2);
-__decorateClass([
-  n({ attribute: "hide-label", type: Boolean })
-], TerraSpatialPicker.prototype, "hideLabel", 2);
-__decorateClass([
-  n()
-], TerraSpatialPicker.prototype, "label", 2);
-__decorateClass([
-  n({ attribute: "spatial-constraints" })
-], TerraSpatialPicker.prototype, "spatialConstraints", 2);
-__decorateClass([
-  n({ attribute: "is-expanded", type: Boolean, reflect: true })
-], TerraSpatialPicker.prototype, "isExpanded", 2);
-__decorateClass([
-  n({ attribute: "world-wrap", type: Boolean })
-], TerraSpatialPicker.prototype, "worldWrap", 2);
-__decorateClass([
-  n({ type: Boolean })
-], TerraSpatialPicker.prototype, "inline", 2);
-__decorateClass([
-  n({ attribute: "show-map-on-focus", type: Boolean })
-], TerraSpatialPicker.prototype, "showMapOnFocus", 2);
-__decorateClass([
-  n({ attribute: "url-state", type: Boolean })
-], TerraSpatialPicker.prototype, "urlState", 2);
-__decorateClass([
-  n({ attribute: "help-text" })
-], TerraSpatialPicker.prototype, "helpText", 2);
-__decorateClass([
-  r()
-], TerraSpatialPicker.prototype, "mapValue", 2);
-__decorateClass([
-  r()
-], TerraSpatialPicker.prototype, "error", 2);
-__decorateClass([
-  e("terra-input")
-], TerraSpatialPicker.prototype, "terraInput", 2);
-__decorateClass([
-  e("terra-map")
-], TerraSpatialPicker.prototype, "map", 2);
-
-export {
-  TerraSpatialPicker
-};