@nasa-terra/components 0.0.186 → 0.0.188

package/cdn/chunks/chunk.MPO2T7WC.js

@@ -0,0 +1,551 @@
+import {
+  time_series_styles_default
+} from "./chunk.2XVRMJAS.js";
+import {
+  getFetchVariableTask
+} from "./chunk.YQXMPDBV.js";
+import {
+  TimeSeriesController
+} from "./chunk.GCKMTUVR.js";
+import {
+  extractHarmonyError,
+  formatHarmonyErrorMessage
+} from "./chunk.F3PALOOP.js";
+import {
+  TerraPlotToolbar
+} from "./chunk.BQYT3WHQ.js";
+import {
+  TerraPlot
+} from "./chunk.IFTFWTIP.js";
+import {
+  AuthController
+} from "./chunk.P34Y4ETY.js";
+import {
+  s
+} from "./chunk.BQDEKCXK.js";
+import {
+  h
+} from "./chunk.ASJLND3B.js";
+import {
+  QueryClientMixin
+} from "./chunk.DOUWGQFH.js";
+import {
+  TerraLoader
+} from "./chunk.6VJOTIIK.js";
+import {
+  formatDate
+} from "./chunk.TKSEPVAL.js";
+import {
+  TerraButton
+} from "./chunk.7TJ44KWM.js";
+import {
+  TerraIcon
+} from "./chunk.FF3LYD7N.js";
+import {
+  TerraAlert
+} from "./chunk.FPUA6LUR.js";
+import {
+  TerraElement,
+  component_styles_default,
+  e,
+  n,
+  r
+} from "./chunk.TZCHRRCA.js";
+import {
+  A,
+  b
+} from "./chunk.RRCYT4LP.js";
+import {
+  __decorateClass,
+  __privateAdd,
+  __privateGet,
+  __privateMethod,
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.ZEOVK2FE.js";
+
+// src/components/time-series/time-series.component.ts
+init_dirname();
+init_buffer();
+init_process();
+var variableEntryIdsConverter = {
+  fromAttribute: (value) => {
+    if (!value) {
+      return [];
+    }
+    try {
+      const parsedValue = JSON.parse(value);
+      if (Array.isArray(parsedValue)) {
+        return parsedValue.map((item) => String(item).trim()).filter(Boolean);
+      }
+    } catch (e2) {
+    }
+    return value.split(",").map((item) => item.trim()).filter(Boolean);
+  },
+  toAttribute: (value) => {
+    if (!(value == null ? void 0 : value.length)) {
+      return null;
+    }
+    return JSON.stringify(value);
+  }
+};
+var _timeSeriesController, _handleQuotaError, _confirmDataPointWarning, confirmDataPointWarning_fn, _cancelDataPointWarning, cancelDataPointWarning_fn, _abortDataLoad, abortDataLoad_fn, _handleComponentLeave, handleComponentLeave_fn, _getYAxisLabel, getYAxisLabel_fn, _hasNoData, hasNoData_fn, _isVariableNotFound, isVariableNotFound_fn, _getErrorMessage, getErrorMessage_fn, _handlePlotRelayout, handlePlotRelayout_fn;
+var TerraTimeSeries = class extends QueryClientMixin(TerraElement) {
+  constructor() {
+    super(...arguments);
+    __privateAdd(this, _confirmDataPointWarning);
+    __privateAdd(this, _cancelDataPointWarning);
+    /**
+     * aborts the underlying data loading task, which cancels the network request
+     */
+    __privateAdd(this, _abortDataLoad);
+    __privateAdd(this, _handleComponentLeave);
+    __privateAdd(this, _getYAxisLabel);
+    __privateAdd(this, _hasNoData);
+    __privateAdd(this, _isVariableNotFound);
+    __privateAdd(this, _getErrorMessage);
+    __privateAdd(this, _handlePlotRelayout);
+    __privateAdd(this, _timeSeriesController, new TimeSeriesController(this));
+    this.variableEntryIds = [];
+    this.showCitation = false;
+    this.showHelp = true;
+    this.disableAutoFetch = false;
+    this.mobileView = false;
+    this.hideToolbar = false;
+    this.cache = false;
+    this.catalogVariables = [];
+    this.quotaExceededOpen = false;
+    this.timeSeriesError = null;
+    this.showDataPointWarning = false;
+    this.estimatedDataPoints = 0;
+    this._authController = new AuthController(this);
+    this._fetchVariableTask = getFetchVariableTask(this);
+    __privateAdd(this, _handleQuotaError, (event) => {
+      const { status, code, message, context } = event.detail;
+      this.timeSeriesError = {
+        code: code || String(status),
+        message,
+        context
+      };
+      if (status === 429) {
+        this.quotaExceededOpen = true;
+      }
+    });
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener(
+      "terra-time-series-error",
+      __privateGet(this, _handleQuotaError)
+    );
+  }
+  updated(changedProps) {
+    super.updated(changedProps);
+    const taskStatus = __privateGet(this, _timeSeriesController).task.status;
+    if (taskStatus === s.PENDING && this.timeSeriesError) {
+      this.timeSeriesError = null;
+    }
+    if (taskStatus === s.ERROR && !this.timeSeriesError) {
+      const taskError = __privateGet(this, _timeSeriesController).task.error;
+      if (taskError) {
+        const errorDetails = extractHarmonyError(taskError);
+        if (errorDetails.isCancellation) {
+          return;
+        }
+        this.timeSeriesError = {
+          code: errorDetails.code,
+          message: errorDetails.message,
+          context: errorDetails.context
+        };
+      }
+    }
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener(
+      "terra-time-series-error",
+      __privateGet(this, _handleQuotaError)
+    );
+  }
+  render() {
+    var _a, _b, _c;
+    return b`
+            <div class="plot-container" @mouseleave=${__privateMethod(this, _handleComponentLeave, handleComponentLeave_fn)}>
+                ${this.quotaExceededOpen ? b`
+                          <terra-alert
+                              variant="warning"
+                              duration="10000"
+                              open=${this.quotaExceededOpen}
+                              closable
+                              @terra-after-hide=${() => this.quotaExceededOpen = false}
+                          >
+                              <terra-icon
+                                  slot="icon"
+                                  name="outline-exclamation-triangle"
+                                  library="heroicons"
+                              ></terra-icon>
+                              You've exceeded your request quota. Please
+                              <a
+                                  href="https://disc.gsfc.nasa.gov/information/documents?title=Contact%20Us"
+                                  >contact the help desk</a
+                              >
+                              for further assistance.
+                          </terra-alert>
+                      ` : ""}
+                ${!this.hideToolbar ? h(
+      this.catalogVariable ? b`<terra-plot-toolbar
+                                    .catalogVariable=${this.catalogVariable}
+                                    .plot=${this.plot}
+                                    .timeSeriesData=${(_a = __privateGet(this, _timeSeriesController).lastTaskValue) != null ? _a : __privateGet(this, _timeSeriesController).emptyPlotData}
+                                    .location=${this.location}
+                                    .startDate=${this.startDate}
+                                    .endDate=${this.endDate}
+                                    .cacheKey=${__privateGet(this, _timeSeriesController).getCacheKey()}
+                                    .variableEntryId=${this.variableEntryId}
+                                    .showCitation=${this.showCitation}
+                                    .showHelp=${this.showHelp}
+                                    .mobileView=${this.mobileView}
+                                    .productLabel=${this.productLabel}
+                                    show-location
+                                >
+                                    <slot name="help-links" slot="help-links"></slot>
+                                </terra-plot-toolbar>` : b`<div class="spacer"></div>`
+    ) : A}
+                ${__privateMethod(this, _hasNoData, hasNoData_fn).call(this) ? b`
+                          <terra-alert
+                              class="no-data-alert"
+                              variant="warning"
+                              open
+                              closable
+                          >
+                              <terra-icon
+                                  slot="icon"
+                                  name="outline-information-circle"
+                                  library="heroicons"
+                              ></terra-icon>
+                              We couldn't find available data for your selection. Try
+                              widening your area or changing the date range to find
+                              more results.
+                          </terra-alert>
+                      ` : ""}
+                ${__privateMethod(this, _isVariableNotFound, isVariableNotFound_fn).call(this) ? b`
+                          <terra-alert
+                              class="no-data-alert"
+                              variant="danger"
+                              open
+                              closable
+                          >
+                              <terra-icon
+                                  slot="icon"
+                                  name="outline-exclamation-triangle"
+                                  library="heroicons"
+                              ></terra-icon>
+                              The selected variable was not found in the catalog
+                          </terra-alert>
+                      ` : ""}
+                ${this.timeSeriesError ? b`
+                          <terra-alert
+                              class="error-alert"
+                              variant="danger"
+                              open
+                              closable
+                              @terra-after-hide=${() => this.timeSeriesError = null}
+                          >
+                              <terra-icon
+                                  slot="icon"
+                                  name="outline-exclamation-triangle"
+                                  library="heroicons"
+                              ></terra-icon>
+                              ${__privateMethod(this, _getErrorMessage, getErrorMessage_fn).call(this, this.timeSeriesError)}
+                          </terra-alert>
+                      ` : ""}
+
+                <terra-plot
+                    exportparts="base:plot__base, plot-title:plot__title"
+                    .data=${(_b = __privateGet(this, _timeSeriesController).lastTaskValue) != null ? _b : __privateGet(this, _timeSeriesController).emptyPlotData}
+                    .layout="${{
+      xaxis: {
+        title: "Time",
+        showgrid: false,
+        zeroline: false,
+        range: (
+          // manually set the range as we may adjust it when we fetch new data as a user pans/zooms the plot
+          this.startDate && this.endDate ? [this.startDate, this.endDate] : void 0
+        )
+      },
+      yaxis: {
+        title: __privateMethod(this, _getYAxisLabel, getYAxisLabel_fn).call(this),
+        showline: false
+      },
+      title: {
+        text: this.catalogVariable && this.location ? `${this.catalogVariable.dataProductShortName}${this.catalogVariables.length > 1 ? ` (${this.catalogVariables.length} variables)` : ""} @ ${this.location}` : null
+      }
+    }}"
+                    .config=${{
+      displayModeBar: true,
+      displaylogo: false,
+      modeBarButtonsToRemove: ["toImage", "zoom2d", "resetScale2d"],
+      responsive: true
+    }}
+                    @terra-plot-relayout=${__privateMethod(this, _handlePlotRelayout, handlePlotRelayout_fn)}
+                ></terra-plot>
+            </div>
+
+            <dialog
+                ?open=${__privateGet(this, _timeSeriesController).task.status === s.PENDING || this._fetchVariableTask.status === s.PENDING}
+            >
+                <terra-loader indeterminate></terra-loader>
+
+                ${__privateGet(this, _timeSeriesController).task.status === s.PENDING ? b`<p>
+                          ${this.catalogVariables.length > 1 ? `Plotting ${this.catalogVariables.length} variables\u2026` : `Plotting ${(_c = this.catalogVariable) == null ? void 0 : _c.dataFieldId}\u2026`}
+                      </p>` : b`<p>Preparing plot&hellip;</p>`}
+
+                <terra-button @click=${__privateMethod(this, _abortDataLoad, abortDataLoad_fn)}>Cancel</terra-button>
+            </dialog>
+
+            <dialog ?open=${this.showDataPointWarning} class="quota-dialog">
+                <h2>This is a large request</h2>
+
+                <p>
+                    You are requesting approximately
+                    ${this.estimatedDataPoints.toLocaleString()} data points.
+                </p>
+
+                <p>
+                    Requesting large amounts of data may cause you to reach your
+                    monthly quota limit.
+                </p>
+
+                <p>Would you still like to proceed with this request?</p>
+
+                <div class="dialog-buttons">
+                    <terra-button
+                        @click=${__privateMethod(this, _cancelDataPointWarning, cancelDataPointWarning_fn)}
+                        variant="default"
+                    >
+                        Cancel
+                    </terra-button>
+
+                    <terra-button
+                        @click=${__privateMethod(this, _confirmDataPointWarning, confirmDataPointWarning_fn)}
+                        variant="primary"
+                    >
+                        Proceed
+                    </terra-button>
+                </div>
+            </dialog>
+        `;
+  }
+};
+_timeSeriesController = new WeakMap();
+_handleQuotaError = new WeakMap();
+_confirmDataPointWarning = new WeakSet();
+confirmDataPointWarning_fn = function() {
+  __privateGet(this, _timeSeriesController).confirmDataPointWarning();
+  __privateGet(this, _timeSeriesController).task.run();
+};
+_cancelDataPointWarning = new WeakSet();
+cancelDataPointWarning_fn = function() {
+  this.showDataPointWarning = false;
+};
+_abortDataLoad = new WeakSet();
+abortDataLoad_fn = function() {
+  var _a;
+  console.log("Aborting data load");
+  (_a = __privateGet(this, _timeSeriesController).task) == null ? void 0 : _a.abort("Cancelled time series request");
+};
+_handleComponentLeave = new WeakSet();
+handleComponentLeave_fn = function(event) {
+  var _a;
+  if (this.mobileView)
+    return;
+  const relatedTarget = event.relatedTarget;
+  if (!this.contains(relatedTarget)) {
+    (_a = this.plotToolbar) == null ? void 0 : _a.closeMenu();
+  }
+};
+_getYAxisLabel = new WeakSet();
+getYAxisLabel_fn = function() {
+  var _a;
+  const units = (this.catalogVariables.length ? this.catalogVariables.map((variable) => variable.dataFieldUnits) : [(_a = this.catalogVariable) == null ? void 0 : _a.dataFieldUnits]).filter(Boolean);
+  const uniqueUnits = [...new Set(units)];
+  if (!uniqueUnits.length) {
+    return;
+  }
+  return uniqueUnits.join(", ");
+};
+_hasNoData = new WeakSet();
+hasNoData_fn = function() {
+  var _a;
+  const taskStatus = __privateGet(this, _timeSeriesController).task.status;
+  if (taskStatus !== s.COMPLETE) {
+    return false;
+  }
+  const plotData = (_a = __privateGet(this, _timeSeriesController).lastTaskValue) != null ? _a : __privateGet(this, _timeSeriesController).emptyPlotData;
+  if (plotData.length === 0) {
+    return true;
+  }
+  const firstSeries = plotData[0];
+  const x = "x" in firstSeries ? firstSeries.x : void 0;
+  const y = "y" in firstSeries ? firstSeries.y : void 0;
+  if (!x || !y || Array.isArray(x) && x.length === 0 || Array.isArray(y) && y.length === 0) {
+    return true;
+  }
+  return false;
+};
+_isVariableNotFound = new WeakSet();
+isVariableNotFound_fn = function() {
+  const variableTaskStatus = this._fetchVariableTask.status;
+  if (variableTaskStatus !== s.COMPLETE) {
+    return false;
+  }
+  const hasVariableRequest = Boolean(
+    this.variableEntryId || this.variableEntryIds.length || this.collection && this.variable
+  );
+  return hasVariableRequest && !this.catalogVariable;
+};
+_getErrorMessage = new WeakSet();
+getErrorMessage_fn = function(error) {
+  return formatHarmonyErrorMessage(error);
+};
+_handlePlotRelayout = new WeakSet();
+handlePlotRelayout_fn = function(e2) {
+  if (this.disableAutoFetch) {
+    return;
+  }
+  let changed = false;
+  if (e2.detail.xAxisMin) {
+    this.startDate = formatDate(e2.detail.xAxisMin);
+    changed = true;
+  }
+  if (e2.detail.xAxisMax) {
+    this.endDate = formatDate(e2.detail.xAxisMax);
+    changed = true;
+  }
+  if (changed) {
+    this.dispatchEvent(
+      new CustomEvent("terra-date-range-change", {
+        detail: {
+          startDate: this.startDate,
+          endDate: this.endDate
+        },
+        bubbles: true,
+        composed: true
+      })
+    );
+  }
+};
+TerraTimeSeries.styles = [component_styles_default, time_series_styles_default];
+TerraTimeSeries.dependencies = {
+  "terra-plot": TerraPlot,
+  "terra-loader": TerraLoader,
+  "terra-icon": TerraIcon,
+  "terra-button": TerraButton,
+  "terra-alert": TerraAlert,
+  "terra-plot-toolbar": TerraPlotToolbar
+};
+__decorateClass([
+  n({ attribute: "variable-entry-id", reflect: true })
+], TerraTimeSeries.prototype, "variableEntryId", 2);
+__decorateClass([
+  n({
+    attribute: "variable-entry-ids",
+    converter: variableEntryIdsConverter
+  })
+], TerraTimeSeries.prototype, "variableEntryIds", 2);
+__decorateClass([
+  n({ reflect: true })
+], TerraTimeSeries.prototype, "collection", 2);
+__decorateClass([
+  n({ reflect: true })
+], TerraTimeSeries.prototype, "variable", 2);
+__decorateClass([
+  n({
+    attribute: "start-date",
+    reflect: true
+  })
+], TerraTimeSeries.prototype, "startDate", 2);
+__decorateClass([
+  n({
+    attribute: "end-date",
+    reflect: true
+  })
+], TerraTimeSeries.prototype, "endDate", 2);
+__decorateClass([
+  n({
+    reflect: true
+  })
+], TerraTimeSeries.prototype, "location", 2);
+__decorateClass([
+  n({ type: Boolean, attribute: "show-citation" })
+], TerraTimeSeries.prototype, "showCitation", 2);
+__decorateClass([
+  n({ type: Boolean, attribute: "show-help" })
+], TerraTimeSeries.prototype, "showHelp", 2);
+__decorateClass([
+  n({ attribute: "application-citation" })
+], TerraTimeSeries.prototype, "applicationCitation", 2);
+__decorateClass([
+  n({ type: Boolean, attribute: "disable-auto-fetch" })
+], TerraTimeSeries.prototype, "disableAutoFetch", 2);
+__decorateClass([
+  n({ attribute: "bearer-token", reflect: false })
+], TerraTimeSeries.prototype, "bearerToken", 2);
+__decorateClass([
+  n({
+    attribute: "mobile-view",
+    type: Boolean,
+    reflect: true
+  })
+], TerraTimeSeries.prototype, "mobileView", 2);
+__decorateClass([
+  n({
+    attribute: "hide-toolbar",
+    type: Boolean,
+    reflect: true
+  })
+], TerraTimeSeries.prototype, "hideToolbar", 2);
+__decorateClass([
+  n({
+    attribute: "product-label",
+    reflect: true
+  })
+], TerraTimeSeries.prototype, "productLabel", 2);
+__decorateClass([
+  n({ attribute: "application-id" })
+], TerraTimeSeries.prototype, "applicationId", 2);
+__decorateClass([
+  n({ type: Boolean })
+], TerraTimeSeries.prototype, "cache", 2);
+__decorateClass([
+  n({ attribute: "job-id" })
+], TerraTimeSeries.prototype, "jobId", 2);
+__decorateClass([
+  e("terra-plot")
+], TerraTimeSeries.prototype, "plot", 2);
+__decorateClass([
+  e("terra-plot-toolbar")
+], TerraTimeSeries.prototype, "plotToolbar", 2);
+__decorateClass([
+  r()
+], TerraTimeSeries.prototype, "catalogVariable", 2);
+__decorateClass([
+  r()
+], TerraTimeSeries.prototype, "catalogVariables", 2);
+__decorateClass([
+  r()
+], TerraTimeSeries.prototype, "quotaExceededOpen", 2);
+__decorateClass([
+  r()
+], TerraTimeSeries.prototype, "timeSeriesError", 2);
+__decorateClass([
+  r()
+], TerraTimeSeries.prototype, "showDataPointWarning", 2);
+__decorateClass([
+  r()
+], TerraTimeSeries.prototype, "estimatedDataPoints", 2);
+
+export {
+  TerraTimeSeries
+};