@nasa-terra/components 0.0.182 → 0.0.184

package/cdn/chunks/chunk.EWQBAXSZ.js

@@ -1,514 +0,0 @@
-import {
-  SpatialPickerService
-} from "./chunk.RIX7X2OX.js";
-import {
-  spatial_picker_styles_default
-} from "./chunk.35MV26JZ.js";
-import {
-  TerraMap
-} from "./chunk.XCZDPAFQ.js";
-import {
-  LatLng
-} from "./chunk.SN3T4SQP.js";
-import {
-  TerraInput
-} from "./chunk.G6UY4GIZ.js";
-import {
-  TerraDropdown
-} from "./chunk.ACVD4RLC.js";
-import {
-  e as e2,
-  n as n2
-} from "./chunk.APOEQA6N.js";
-import {
-  TerraElement,
-  component_styles_default,
-  e,
-  n,
-  r
-} from "./chunk.7ZVYIV7K.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
-};

package/cdn/chunks/chunk.EXWRYIIG.js

@@ -1,34 +0,0 @@
-import {
-  TerraRadioGroup
-} from "./chunk.3S6TXNYN.js";
-import {
-  init_buffer,
-  init_dirname,
-  init_process
-} from "./chunk.ZEOVK2FE.js";
-
-// src/react/radio-group/index.ts
-init_dirname();
-init_buffer();
-init_process();
-import * as React from "react";
-import { createComponent } from "@lit/react";
-import "@lit/react";
-var tagName = "terra-radio-group";
-TerraRadioGroup.define("terra-radio-group");
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: TerraRadioGroup,
-  react: React,
-  events: {
-    onTerraChange: "terra-change",
-    onTerraInput: "terra-input",
-    onTerraInvalid: "terra-invalid"
-  },
-  displayName: "TerraRadioGroup"
-});
-var radio_group_default = reactWrapper;
-
-export {
-  radio_group_default
-};

package/cdn/chunks/chunk.F7RM6CKI.js

@@ -1,19 +0,0 @@
-import {
-  TerraTabs
-} from "./chunk.653O7V4M.js";
-import {
-  init_buffer,
-  init_dirname,
-  init_process
-} from "./chunk.ZEOVK2FE.js";
-
-// src/components/tabs/tabs.ts
-init_dirname();
-init_buffer();
-init_process();
-var tabs_default = TerraTabs;
-TerraTabs.define("terra-tabs");
-
-export {
-  tabs_default
-};

package/cdn/chunks/chunk.FEU2ZHGK.js

@@ -1,136 +0,0 @@
-import {
-  loader_styles_default
-} from "./chunk.YMMKGSAJ.js";
-import {
-  e
-} from "./chunk.KGXAA5I2.js";
-import {
-  TerraElement,
-  component_styles_default,
-  n,
-  r
-} from "./chunk.7ZVYIV7K.js";
-import {
-  A,
-  b
-} from "./chunk.RRCYT4LP.js";
-import {
-  __decorateClass,
-  init_buffer,
-  init_dirname,
-  init_process
-} from "./chunk.ZEOVK2FE.js";
-
-// src/components/loader/loader.component.ts
-init_dirname();
-init_buffer();
-init_process();
-var TerraLoader = class extends TerraElement {
-  constructor() {
-    super(...arguments);
-    this.variant = "large";
-    this.percent = "0";
-    this.indeterminate = false;
-    this.role = "progressbar";
-    this._currentPercent = 0;
-  }
-  formatPercent(percent) {
-    if (parseInt(percent) > 100) {
-      percent = "100";
-    }
-    return parseInt(percent) > 0 ? percent + "%" : "";
-  }
-  render() {
-    this._currentPercent = parseInt(this.percent);
-    return b`
-            <div
-                class=${e({
-      loader: true,
-      "loader--small": this.variant === "small",
-      "loader--large": this.variant === "large",
-      "loader--orbit": this.variant === "orbit"
-    })}
-                aria-valuenow=${this.formatPercent(this.percent)}
-                .role=${this.role}
-                tabindex="-1"
-            >
-                ${this.variant === "large" || this.variant === "orbit" ? b`
-                          <div
-                              class="percent ${this.variant == "orbit" ? "number-14" : "number-11"}"
-                          >
-                              ${this.formatPercent(this.percent)}
-                          </div>
-                      ` : A}
-                ${this.variant === "orbit" ? b`
-                          <svg viewBox="0 0 160 160">
-                              <circle class="planet" />
-
-                              <!-- total length of orbit ellipse = 298.2393493652344 -->
-                              <path
-                                  id="orbit"
-                                  d="M 53.528 96.775 C 73.584 124.975 100.654 140.601 115.393 130.137 C 132.613 117.912 119.246 79.55 105.434 60.525 C 90.233 39.587 60.506 18.543 44.962 30.114 C 29.456 41.657 38.219 75.25 53.528 96.775 Z"
-                              >
-                                  <animate
-                                      attributeName="stroke-dashoffset"
-                                      begin="-0.25s"
-                                      from="300"
-                                      to="0"
-                                      dur="1.5s"
-                                      repeatCount="indefinite"
-                                  />
-                              </path>
-
-                              <circle class="moon">
-                                  <animateMotion
-                                      begin="0s"
-                                      dur="1.5s"
-                                      repeatCount="indefinite"
-                                  >
-                                      <mpath href="#orbit"></mpath>
-                                  </animateMotion>
-                              </circle>
-
-                              <path
-                                  id="mask"
-                                  class="planet"
-                                  d="M 130.176 80.041 C 130.176 41.552 88.321 17.697 55.544 36.652 C 40.081 45.594 30.865 62.428 30.47 80.094 L 130.176 80.041 Z"
-                                  style="transform-box: fill-box; transform-origin: 49.8347% 100.62%;"
-                                  transform="matrix(-0.350367, -0.936613, 0.936613, -0.350367, -0.148117, -0.20884)"
-                              />
-                          </svg>
-                      ` : A}
-                ${this.variant === "small" || this.variant === "large" ? b`
-                          <svg
-                              viewBox=${this.variant == "small" ? "0 0 30 30" : "0 0 52 52"}
-                              aria-hidden="true"
-                              style="--progress: ${this.percent}"
-                              class="circular-progress ${this.indeterminate ? "indeterminate" : ""}"
-                          >
-                              <circle class="bg"></circle>
-                              <circle class="fg"></circle>
-                          </svg>
-                      ` : A}
-            </div>
-        `;
-  }
-};
-TerraLoader.styles = [component_styles_default, loader_styles_default];
-__decorateClass([
-  n({ reflect: true })
-], TerraLoader.prototype, "variant", 2);
-__decorateClass([
-  n({ type: String })
-], TerraLoader.prototype, "percent", 2);
-__decorateClass([
-  n({ type: Boolean })
-], TerraLoader.prototype, "indeterminate", 2);
-__decorateClass([
-  n({ reflect: true })
-], TerraLoader.prototype, "role", 2);
-__decorateClass([
-  r()
-], TerraLoader.prototype, "_currentPercent", 2);
-
-export {
-  TerraLoader
-};