@nasa-terra/components 0.0.194 → 0.0.195

package/cdn/chunks/chunk.N4S5SN4O.js

@@ -0,0 +1,234 @@
+import {
+  radio_styles_default
+} from "./chunk.2FWCEY7A.js";
+import {
+  defaultValue,
+  l
+} from "./chunk.PZUVUD4C.js";
+import {
+  form_control_styles_default
+} from "./chunk.LNM5ZU6K.js";
+import {
+  FormControlController
+} from "./chunk.BJIN2WV3.js";
+import {
+  o
+} from "./chunk.VH7AMLEP.js";
+import {
+  e
+} from "./chunk.KGXAA5I2.js";
+import {
+  watch
+} from "./chunk.MPVZOQYA.js";
+import {
+  TerraElement,
+  component_styles_default,
+  e as e2,
+  n,
+  r
+} from "./chunk.MUSV5WD7.js";
+import {
+  b
+} from "./chunk.RRCYT4LP.js";
+import {
+  __decorateClass,
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.ZEOVK2FE.js";
+
+// src/components/radio/radio.component.ts
+init_dirname();
+init_buffer();
+init_process();
+var TerraRadio = class extends TerraElement {
+  constructor() {
+    super(...arguments);
+    this.formControlController = new FormControlController(this, {
+      value: (control) => control.checked ? control.value || "on" : void 0,
+      defaultValue: (control) => control.defaultChecked,
+      setValue: (control, checked) => control.checked = checked
+    });
+    this.hasFocus = false;
+    this.title = "";
+    this.name = "";
+    this.size = "medium";
+    this.disabled = false;
+    this.checked = false;
+    this.defaultChecked = false;
+    this.form = "";
+    this.required = false;
+  }
+  /** Gets the validity state object */
+  get validity() {
+    return this.input.validity;
+  }
+  /** Gets the validation message */
+  get validationMessage() {
+    return this.input.validationMessage;
+  }
+  firstUpdated() {
+    this.formControlController.updateValidity();
+  }
+  handleBlur() {
+    this.hasFocus = false;
+    this.emit("terra-blur");
+  }
+  handleClick() {
+    if (!this.disabled) {
+      this.checked = true;
+      this.emit("terra-change");
+    }
+  }
+  handleFocus() {
+    this.hasFocus = true;
+    this.emit("terra-focus");
+  }
+  handleInput() {
+    this.emit("terra-input");
+  }
+  handleChange() {
+    this.checked = this.input.checked;
+    this.emit("terra-change");
+  }
+  handleInvalid(event) {
+    this.formControlController.setValidity(false);
+    this.formControlController.emitInvalidEvent(event);
+  }
+  handleDisabledChange() {
+    this.formControlController.setValidity(this.disabled);
+  }
+  handleCheckedChange() {
+    this.input.checked = this.checked;
+    this.formControlController.updateValidity();
+  }
+  /** Simulates a click on the radio. */
+  click() {
+    this.input.click();
+  }
+  /** Sets focus on the radio. */
+  focus(options) {
+    this.input.focus(options);
+  }
+  /** Removes focus from the radio. */
+  blur() {
+    this.input.blur();
+  }
+  /** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */
+  checkValidity() {
+    return this.input.checkValidity();
+  }
+  /** Gets the associated form, if one exists. */
+  getForm() {
+    return this.formControlController.getForm();
+  }
+  /** Checks for validity and shows the browser's validation message if the control is invalid. */
+  reportValidity() {
+    return this.input.reportValidity();
+  }
+  /**
+   * Sets a custom validation message. The value provided will be shown to the user when the form is submitted. To clear
+   * the custom validation message, call this method with an empty string.
+   */
+  setCustomValidity(message) {
+    this.input.setCustomValidity(message);
+    this.formControlController.updateValidity();
+  }
+  render() {
+    return b`
+            <label
+                part="base"
+                class=${e({
+      radio: true,
+      "radio--checked": this.checked,
+      "radio--disabled": this.disabled,
+      "radio--focused": this.hasFocus,
+      "radio--small": this.size === "small",
+      "radio--medium": this.size === "medium",
+      "radio--large": this.size === "large"
+    })}
+            >
+                <input
+                    class="radio__input"
+                    type="radio"
+                    title=${this.title}
+                    name=${this.name}
+                    value=${o(this.value)}
+                    .checked=${l(this.checked)}
+                    .disabled=${this.disabled}
+                    .required=${this.required}
+                    aria-checked=${this.checked ? "true" : "false"}
+                    @click=${this.handleClick}
+                    @input=${this.handleInput}
+                    @change=${this.handleChange}
+                    @invalid=${this.handleInvalid}
+                    @blur=${this.handleBlur}
+                    @focus=${this.handleFocus}
+                />
+
+                <span
+                    part="${`control${this.checked ? " control--checked" : ""}`}"
+                    class="radio__control"
+                >
+                    ${this.checked ? b`
+                              <svg
+                                  part="checked-icon"
+                                  class="radio__checked-icon"
+                                  viewBox="0 0 24 24"
+                                  fill="none"
+                                  xmlns="http://www.w3.org/2000/svg"
+                              >
+                                  <circle cx="12" cy="12" r="6" fill="currentColor" />
+                              </svg>
+                          ` : ""}
+                </span>
+
+                <slot part="label" class="radio__label"></slot>
+            </label>
+        `;
+  }
+};
+TerraRadio.styles = [component_styles_default, form_control_styles_default, radio_styles_default];
+__decorateClass([
+  e2('input[type="radio"]')
+], TerraRadio.prototype, "input", 2);
+__decorateClass([
+  r()
+], TerraRadio.prototype, "hasFocus", 2);
+__decorateClass([
+  n()
+], TerraRadio.prototype, "title", 2);
+__decorateClass([
+  n()
+], TerraRadio.prototype, "name", 2);
+__decorateClass([
+  n()
+], TerraRadio.prototype, "value", 2);
+__decorateClass([
+  n({ reflect: true })
+], TerraRadio.prototype, "size", 2);
+__decorateClass([
+  n({ type: Boolean, reflect: true })
+], TerraRadio.prototype, "disabled", 2);
+__decorateClass([
+  n({ type: Boolean, reflect: true })
+], TerraRadio.prototype, "checked", 2);
+__decorateClass([
+  defaultValue("checked")
+], TerraRadio.prototype, "defaultChecked", 2);
+__decorateClass([
+  n({ reflect: true })
+], TerraRadio.prototype, "form", 2);
+__decorateClass([
+  n({ type: Boolean, reflect: true })
+], TerraRadio.prototype, "required", 2);
+__decorateClass([
+  watch("disabled", { waitUntilFirstUpdate: true })
+], TerraRadio.prototype, "handleDisabledChange", 1);
+__decorateClass([
+  watch("checked", { waitUntilFirstUpdate: true })
+], TerraRadio.prototype, "handleCheckedChange", 1);
+
+export {
+  TerraRadio
+};

package/cdn/chunks/chunk.NF6QKS66.js

@@ -0,0 +1,35 @@
+import {
+  TerraBanner
+} from "./chunk.3FZNWJLU.js";
+import {
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.ZEOVK2FE.js";
+
+// src/react/banner/index.ts
+init_dirname();
+init_buffer();
+init_process();
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "terra-banner";
+TerraBanner.define("terra-banner");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: TerraBanner,
+  react: React,
+  events: {
+    onTerraShow: "terra-show",
+    onTerraAfterShow: "terra-after-show",
+    onTerraHide: "terra-hide",
+    onTerraAfterHide: "terra-after-hide"
+  },
+  displayName: "TerraBanner"
+});
+var banner_default = reactWrapper;
+
+export {
+  banner_default
+};

package/cdn/chunks/chunk.NPMUVLNM.js

@@ -0,0 +1,162 @@
+import {
+  plot_styles_default
+} from "./chunk.TOI4RMEC.js";
+import {
+  require_plotly_min
+} from "./chunk.NPCTDW7V.js";
+import {
+  watch
+} from "./chunk.MPVZOQYA.js";
+import {
+  TerraElement,
+  component_styles_default,
+  e,
+  n
+} from "./chunk.MUSV5WD7.js";
+import {
+  b
+} from "./chunk.RRCYT4LP.js";
+import {
+  __decorateClass,
+  __privateAdd,
+  __privateGet,
+  __privateMethod,
+  __privateSet,
+  __spreadProps,
+  __spreadValues,
+  __toESM,
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.ZEOVK2FE.js";
+
+// src/components/plot/plot.component.ts
+init_dirname();
+init_buffer();
+init_process();
+var PlotlyModule = __toESM(require_plotly_min(), 1);
+var Plotly = typeof PlotlyModule.newPlot === "function" ? PlotlyModule : globalThis.Plotly;
+var _resizeObserver, _handlePlotlyRelayout, handlePlotlyRelayout_fn;
+var TerraPlot = class extends TerraElement {
+  constructor() {
+    super(...arguments);
+    __privateAdd(this, _handlePlotlyRelayout);
+    __privateAdd(this, _resizeObserver, void 0);
+    this.layout = {};
+    this.config = {};
+    this.data = [];
+    this.colors = [
+      "#1f77b4",
+      // blue
+      "#ff7f0e",
+      // orange
+      "#2ca02c",
+      // green
+      "#d62728",
+      // red
+      "#9467bd",
+      // purple
+      "#8c564b",
+      // brown
+      "#e377c2",
+      // pink
+      "#7f7f7f",
+      // gray
+      "#bcbd22",
+      // yellow-green
+      "#17becf"
+      // cyan
+    ];
+  }
+  handleDataChange() {
+    this.updatePlotWithData();
+  }
+  firstUpdated() {
+    __privateSet(this, _resizeObserver, new ResizeObserver(() => {
+      Plotly.Plots.resize(this.base);
+    }));
+    __privateGet(this, _resizeObserver).observe(this.base);
+    if (this.data.length) {
+      this.updatePlotWithData();
+    }
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    __privateGet(this, _resizeObserver).disconnect();
+  }
+  updatePlotWithData() {
+    if (!this.base)
+      return;
+    const coloredData = this.data.map((trace, index) => {
+      const color = this.colors[index % this.colors.length];
+      if (!trace.type || trace.type === "scatter") {
+        const scatterTrace = trace;
+        return __spreadProps(__spreadValues({
+          type: "scatter",
+          mode: "lines"
+        }, scatterTrace), {
+          line: __spreadValues({
+            color
+          }, scatterTrace.line || {})
+        });
+      }
+      return trace;
+    });
+    Plotly.newPlot(
+      this.base,
+      coloredData,
+      __spreadValues({
+        title: {
+          text: this.plotTitle
+          // support for adding a title directly
+        }
+      }, this.layout),
+      __spreadValues({ responsive: true }, this.config)
+    );
+    this.base.on("plotly_relayout", __privateMethod(this, _handlePlotlyRelayout, handlePlotlyRelayout_fn).bind(this));
+  }
+  render() {
+    return b`<div part="base"></div>`;
+  }
+  updated() {
+    var _a, _b;
+    (_b = (_a = this.shadowRoot) == null ? void 0 : _a.querySelector(".gtitle")) == null ? void 0 : _b.part.add("plot-title");
+  }
+};
+_resizeObserver = new WeakMap();
+_handlePlotlyRelayout = new WeakSet();
+handlePlotlyRelayout_fn = function(e2) {
+  const detail = __spreadValues(__spreadValues(__spreadValues(__spreadValues({}, e2["xaxis.range[0]"] && { xAxisMin: e2["xaxis.range[0]"] }), e2["xaxis.range[1]"] && { xAxisMax: e2["xaxis.range[1]"] }), e2["yaxis.range[0]"] && { yAxisMin: e2["yaxis.range[0]"] }), e2["yaxis.range[1]"] && { yAxisMax: e2["yaxis.range[1]"] });
+  if (!Object.keys(detail).length) {
+    return;
+  }
+  this.emit("terra-plot-relayout", {
+    detail
+  });
+};
+TerraPlot.styles = [component_styles_default, plot_styles_default];
+__decorateClass([
+  e('[part="base"]')
+], TerraPlot.prototype, "base", 2);
+__decorateClass([
+  n()
+], TerraPlot.prototype, "plotTitle", 2);
+__decorateClass([
+  n()
+], TerraPlot.prototype, "layout", 2);
+__decorateClass([
+  n()
+], TerraPlot.prototype, "config", 2);
+__decorateClass([
+  n({ type: Array })
+], TerraPlot.prototype, "data", 2);
+__decorateClass([
+  n({ type: Array })
+], TerraPlot.prototype, "colors", 2);
+__decorateClass([
+  watch("data")
+], TerraPlot.prototype, "handleDataChange", 1);
+
+export {
+  TerraPlot
+};

package/cdn/chunks/chunk.NSJCS746.js

@@ -0,0 +1,170 @@
+import {
+  getUTCDate
+} from "./chunk.X2BIJLHO.js";
+import {
+  queryGiovanniVariables
+} from "./chunk.GOSTHSKP.js";
+import {
+  giovanni_api_default
+} from "./chunk.4PJFGXBZ.js";
+import {
+  QueryController
+} from "./chunk.YY3ZUPZV.js";
+import {
+  __privateAdd,
+  __privateGet,
+  __privateMethod,
+  __privateSet,
+  __spreadProps,
+  __spreadValues,
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.ZEOVK2FE.js";
+
+// src/components/browse-variables/browse-variables.controller.ts
+init_dirname();
+init_buffer();
+init_process();
+var _query, _host, _hasAutoSelectedVariables, _selectVariables, selectVariables_fn, _buildSearchParams, buildSearchParams_fn, _adaptVariables, adaptVariables_fn, _getReasonableInitialDates, getReasonableInitialDates_fn;
+var BrowseVariablesController = class {
+  constructor(host) {
+    __privateAdd(this, _selectVariables);
+    __privateAdd(this, _buildSearchParams);
+    __privateAdd(this, _adaptVariables);
+    __privateAdd(this, _getReasonableInitialDates);
+    __privateAdd(this, _query, void 0);
+    __privateAdd(this, _host, void 0);
+    __privateAdd(this, _hasAutoSelectedVariables, false);
+    __privateSet(this, _host, host);
+    host.addController(this);
+    __privateSet(this, _query, new QueryController(host, () => {
+      const { q, filter } = __privateMethod(this, _buildSearchParams, buildSearchParams_fn).call(this);
+      return queryGiovanniVariables({ q, filter });
+    }));
+  }
+  hostConnected() {
+  }
+  hostDisconnected() {
+  }
+  async hostUpdated() {
+    var _a;
+    const data = (_a = __privateGet(this, _query).result) == null ? void 0 : _a.data;
+    if (!data || __privateGet(this, _hasAutoSelectedVariables))
+      return;
+    await __privateMethod(this, _selectVariables, selectVariables_fn).call(this, data);
+  }
+  get facetsByCategory() {
+    var _a;
+    const data = (_a = __privateGet(this, _query).result) == null ? void 0 : _a.data;
+    if (!data)
+      return void 0;
+    const facetsByCategory = {
+      depths: [],
+      disciplines: [],
+      measurements: [],
+      observations: [],
+      platformInstruments: [],
+      portals: [],
+      spatialResolutions: [],
+      specialFeatures: [],
+      temporalResolutions: [],
+      wavelengths: []
+    };
+    for (const facet of data.facets) {
+      const category = facet.category;
+      if (category in facetsByCategory) {
+        facetsByCategory[category] = facet.values;
+      }
+    }
+    return facetsByCategory;
+  }
+  get variables() {
+    var _a;
+    const data = (_a = __privateGet(this, _query).result) == null ? void 0 : _a.data;
+    return data ? __privateMethod(this, _adaptVariables, adaptVariables_fn).call(this, data.variables) : [];
+  }
+  get total() {
+    var _a, _b, _c;
+    return (_c = (_b = (_a = __privateGet(this, _query).result) == null ? void 0 : _a.data) == null ? void 0 : _b.total) != null ? _c : 0;
+  }
+  get isPending() {
+    var _a, _b;
+    return (_b = (_a = __privateGet(this, _query).result) == null ? void 0 : _a.isFetching) != null ? _b : false;
+  }
+  async getVariable(variableEntryId) {
+    const variable = await giovanni_api_default.getVariable(variableEntryId);
+    return variable ? __privateMethod(this, _adaptVariables, adaptVariables_fn).call(this, [variable])[0] : null;
+  }
+};
+_query = new WeakMap();
+_host = new WeakMap();
+_hasAutoSelectedVariables = new WeakMap();
+_selectVariables = new WeakSet();
+selectVariables_fn = async function(data) {
+  if (!__privateGet(this, _host).selectedVariableEntryIds || __privateGet(this, _host).selectedVariables.length > 0) {
+    return;
+  }
+  __privateSet(this, _hasAutoSelectedVariables, true);
+  const adaptedVariables = __privateMethod(this, _adaptVariables, adaptVariables_fn).call(this, data.variables);
+  const variableEntryIds = __privateGet(this, _host).selectedVariableEntryIds.split(",");
+  const variables = adaptedVariables.filter(
+    (variable) => variableEntryIds.includes(variable.dataFieldId) || variableEntryIds.includes(
+      `${variable.dataProductShortName}_${variable.dataProductVersion}_${variable.dataFieldAccessName}`
+    )
+  );
+  const missingVariableIds = variableEntryIds.filter(
+    (id) => !variables.some((v) => v.dataFieldId === id)
+  );
+  const missingVariables = (await Promise.all(missingVariableIds.map((id) => this.getVariable(id)))).filter(Boolean);
+  __privateGet(this, _host).selectedVariables = [...variables, ...missingVariables];
+};
+_buildSearchParams = new WeakSet();
+buildSearchParams_fn = function() {
+  var _a, _b;
+  const { searchQuery: query, selectedFacets } = __privateGet(this, _host);
+  if ((query === "Aerosols" || query === "aerosols") && !((_a = selectedFacets == null ? void 0 : selectedFacets.observations) == null ? void 0 : _a.includes("Aerosols"))) {
+    return {
+      q: void 0,
+      filter: __spreadProps(__spreadValues({}, selectedFacets), {
+        disciplines: [...(_b = selectedFacets == null ? void 0 : selectedFacets.disciplines) != null ? _b : [], "Aerosols"]
+      })
+    };
+  }
+  return {
+    q: query,
+    filter: selectedFacets
+  };
+};
+_adaptVariables = new WeakSet();
+adaptVariables_fn = function(variables) {
+  return variables.map((variable) => {
+    const exampleInitialDates = __privateMethod(this, _getReasonableInitialDates, getReasonableInitialDates_fn).call(this, variable);
+    return __spreadProps(__spreadValues({}, variable), {
+      exampleInitialStartDate: exampleInitialDates == null ? void 0 : exampleInitialDates.exampleInitialStartDate,
+      exampleInitialEndDate: exampleInitialDates == null ? void 0 : exampleInitialDates.exampleInitialEndDate,
+      dataFieldShortName: !variable.dataFieldShortName || variable.dataFieldShortName === "" ? variable.dataFieldAccessName : variable.dataFieldShortName
+    });
+  });
+};
+_getReasonableInitialDates = new WeakSet();
+getReasonableInitialDates_fn = function(variable) {
+  if (!(variable == null ? void 0 : variable.dataProductBeginDateTime) || !(variable == null ? void 0 : variable.dataProductEndDateTime)) {
+    return void 0;
+  }
+  const diff = Math.abs(
+    new Date(variable.dataProductEndDateTime).getTime() - new Date(variable.dataProductBeginDateTime).getTime()
+  );
+  const threeQuarterRange = Math.floor(diff * 0.75);
+  const startDate = Math.abs(
+    new Date(variable.dataProductBeginDateTime).getTime() + threeQuarterRange
+  );
+  return {
+    exampleInitialStartDate: getUTCDate(startDate),
+    exampleInitialEndDate: getUTCDate(variable.dataProductEndDateTime)
+  };
+};
+
+export {
+  BrowseVariablesController
+};