@nasa-terra/components 0.0.195 → 0.0.197

package/cdn/chunks/chunk.CLL4XXBG.js

@@ -0,0 +1,188 @@
+import {
+  toast_styles_default
+} from "./chunk.NJ3TPG7D.js";
+import {
+  TerraAlert
+} from "./chunk.35W6TJ7F.js";
+import {
+  TerraElement,
+  component_styles_default,
+  n
+} from "./chunk.W56KFXW3.js";
+import {
+  b
+} from "./chunk.RRCYT4LP.js";
+import {
+  __decorateClass,
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.ZEOVK2FE.js";
+
+// src/components/toast/toast.component.ts
+init_dirname();
+init_buffer();
+init_process();
+var TerraToast = class extends TerraElement {
+  constructor() {
+    super(...arguments);
+    this.variant = "information";
+    this.duration = 3e3;
+    this.closable = true;
+  }
+  get alert() {
+    if (!this.shadowRoot) {
+      return null;
+    }
+    return this.shadowRoot.querySelector("terra-alert");
+  }
+  firstUpdated() {
+    const alert = this.alert;
+    if (alert) {
+      alert.addEventListener("terra-show", () => this.emit("terra-show"));
+      alert.addEventListener(
+        "terra-after-show",
+        () => this.emit("terra-after-show")
+      );
+      alert.addEventListener("terra-hide", () => this.emit("terra-hide"));
+      alert.addEventListener(
+        "terra-after-hide",
+        () => this.emit("terra-after-hide")
+      );
+    }
+  }
+  /**
+   * Displays the toast as a notification. This will move the toast out of its position in the DOM and, when
+   * dismissed, it will be removed from the DOM completely. By storing a reference to the toast, you can reuse it by
+   * calling this method again. The returned promise will resolve after the toast is hidden.
+   */
+  async toast() {
+    return new Promise(async (resolve) => {
+      await this.updateComplete;
+      if (!this.shadowRoot) {
+        await this.updateComplete;
+      }
+      let alert = this.alert;
+      if (!alert) {
+        await customElements.whenDefined("terra-alert");
+        await this.updateComplete;
+        alert = this.alert;
+      }
+      if (!alert) {
+        resolve();
+        return;
+      }
+      await alert.updateComplete;
+      const toastStack = TerraAlert.toastStack;
+      if (toastStack.parentElement === null) {
+        document.body.append(toastStack);
+      }
+      toastStack.appendChild(this);
+      requestAnimationFrame(async () => {
+        this.clientWidth;
+        await this.updateComplete;
+        await alert.updateComplete;
+        if (!alert.open) {
+          await alert.show();
+        }
+      });
+      this.addEventListener(
+        "terra-after-hide",
+        () => {
+          if (toastStack.contains(this)) {
+            toastStack.removeChild(this);
+          }
+          resolve();
+          if (toastStack.querySelector("terra-toast") === null && toastStack.querySelector("terra-alert") === null) {
+            toastStack.remove();
+          }
+        },
+        { once: true }
+      );
+    });
+  }
+  /** Shows the toast. */
+  async show() {
+    await this.updateComplete;
+    const alert = this.alert;
+    if (!alert) {
+      throw new Error("TerraToast: Alert element not found");
+    }
+    await alert.updateComplete;
+    return alert.show();
+  }
+  /** Hides the toast. */
+  async hide() {
+    await this.updateComplete;
+    const alert = this.alert;
+    if (!alert) {
+      throw new Error("TerraToast: Alert element not found");
+    }
+    await alert.updateComplete;
+    return alert.hide();
+  }
+  /**
+   * Creates a toast notification imperatively. This is a convenience method that creates a toast, appends it to the
+   * body, and displays it as a notification.
+   *
+   * @param message - The message to display in the toast.
+   * @param variant - The toast variant. Defaults to 'information'.
+   * @param icon - Optional icon name to display. Defaults to undefined.
+   * @param duration - The duration in milliseconds. Defaults to 3000.
+   * @returns A promise that resolves after the toast is hidden.
+   */
+  static async notify(message, variant = "information", icon, duration = 3e3) {
+    const escapeHtml = (html) => {
+      const div = document.createElement("div");
+      div.textContent = html;
+      return div.innerHTML;
+    };
+    const toast = Object.assign(document.createElement("terra-toast"), {
+      variant,
+      duration,
+      closable: true,
+      innerHTML: icon ? `
+                    <terra-icon name="${icon}" slot="icon" library="heroicons"></terra-icon>
+                    ${escapeHtml(message)}
+                ` : escapeHtml(message)
+    });
+    document.body.append(toast);
+    await customElements.whenDefined("terra-toast");
+    await toast.updateComplete;
+    return toast.toast();
+  }
+  render() {
+    return b`
+            <terra-alert
+                part="base"
+                exportparts="base:base__base, icon:base__icon, message:base__message"
+                variant=${this.variant}
+                duration=${this.duration}
+                closable=${this.closable}
+                countdown=${this.countdown || ""}
+                appearance="filled"
+            >
+                <slot name="icon" slot="icon"></slot>
+                <slot></slot>
+            </terra-alert>
+        `;
+  }
+};
+TerraToast.styles = [component_styles_default, toast_styles_default];
+TerraToast.dependencies = { "terra-alert": TerraAlert };
+__decorateClass([
+  n({ reflect: true })
+], TerraToast.prototype, "variant", 2);
+__decorateClass([
+  n({ type: Number })
+], TerraToast.prototype, "duration", 2);
+__decorateClass([
+  n({ type: Boolean, reflect: true })
+], TerraToast.prototype, "closable", 2);
+__decorateClass([
+  n({ type: String, reflect: true })
+], TerraToast.prototype, "countdown", 2);
+
+export {
+  TerraToast
+};

package/cdn/chunks/chunk.CLYZO6RS.js

@@ -0,0 +1,19 @@
+import {
+  TerraSkeleton
+} from "./chunk.D7P7KTFB.js";
+import {
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.ZEOVK2FE.js";
+
+// src/components/skeleton/skeleton.ts
+init_dirname();
+init_buffer();
+init_process();
+var skeleton_default = TerraSkeleton;
+TerraSkeleton.define("terra-skeleton");
+
+export {
+  skeleton_default
+};

package/cdn/chunks/chunk.COWPPOED.js

@@ -0,0 +1,298 @@
+import {
+  TerraDataSubsetter
+} from "./chunk.WD7YIW7Q.js";
+import {
+  TerraDialog
+} from "./chunk.6FJCGU4K.js";
+import {
+  data_subsetter_history_styles_default
+} from "./chunk.4X6WWIPJ.js";
+import {
+  AuthController
+} from "./chunk.4JXPGYJW.js";
+import {
+  queryHarmonyJobs
+} from "./chunk.I7HUTXHU.js";
+import {
+  QueryClientMixin
+} from "./chunk.DOUWGQFH.js";
+import {
+  QueryController
+} from "./chunk.YY3ZUPZV.js";
+import {
+  TerraIcon
+} from "./chunk.UD7NUYVG.js";
+import {
+  TerraElement,
+  component_styles_default,
+  e,
+  n,
+  r,
+  undefinedStringConverter
+} from "./chunk.W56KFXW3.js";
+import {
+  A,
+  b
+} from "./chunk.RRCYT4LP.js";
+import {
+  __decorateClass,
+  __privateAdd,
+  __privateMethod,
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.ZEOVK2FE.js";
+
+// src/components/data-subsetter-history/data-subsetter-history.component.ts
+init_dirname();
+init_buffer();
+init_process();
+var _renderHistoryItems, renderHistoryItems_fn, _renderSubsetterHistoryItem, renderSubsetterHistoryItem_fn, _handleHistoryItemClick, handleHistoryItemClick_fn, _parseLabelsAsJson, parseLabelsAsJson_fn;
+var TerraDataSubsetterHistory = class extends QueryClientMixin(
+  TerraElement
+) {
+  constructor() {
+    super(...arguments);
+    __privateAdd(this, _renderHistoryItems);
+    __privateAdd(this, _renderSubsetterHistoryItem);
+    __privateAdd(this, _handleHistoryItemClick);
+    __privateAdd(this, _parseLabelsAsJson);
+    this.label = "History";
+    this.alwaysShow = true;
+    this.collapsed = true;
+    this.hideCancelled = true;
+    this.jobsQuery = new QueryController(
+      this,
+      () => queryHarmonyJobs({ page: 1 }, { bearerToken: this.bearerToken })
+    );
+    this._authController = new AuthController(this);
+  }
+  toggleCollapsed() {
+    this.collapsed = !this.collapsed;
+  }
+  render() {
+    var _a;
+    const jobs = (_a = this.jobsQuery.result) == null ? void 0 : _a.data;
+    const hasJobs = jobs && jobs.jobs.length > 0;
+    if (!hasJobs) {
+      return A;
+    }
+    return b`
+            <div class="${this.collapsed ? "collapsed" : ""}">
+                <div class="history-header" @click=${this.toggleCollapsed}>
+                    <span>${this.label}</span>
+                </div>
+
+                <div class="history-panel">
+                    ${hasJobs ? b`
+                              <div class="history-link-row">
+                                  <label>
+                                      <input
+                                          type="checkbox"
+                                          .checked=${this.hideCancelled}
+                                          @change=${(e2) => {
+      this.hideCancelled = e2.target.checked;
+    }}
+                                      />
+                                      Hide Cancelled
+                                  </label>
+
+                                  <a
+                                      href="https://harmony.earthdata.nasa.gov/workflow-ui"
+                                      target="_blank"
+                                      rel="noopener noreferrer"
+                                      class="history-link"
+                                  >
+                                      View all
+                                      <terra-icon
+                                          name="outline-arrow-top-right-on-square"
+                                          library="heroicons"
+                                          size="32px"
+                                      ></terra-icon>
+                                  </a>
+                              </div>
+                          ` : A}
+
+                    <div class="history-list">
+                        ${jobs ? hasJobs ? __privateMethod(this, _renderHistoryItems, renderHistoryItems_fn).call(this, jobs) : b`<div class="history-alert-message">
+                                      You haven't made any requests yet.<br />
+                                      Get started by
+                                      <a
+                                          href="#"
+                                          class="history-alert-link"
+                                          @click=${(e2) => {
+      var _a2;
+      e2.preventDefault();
+      this.selectedJob = void 0;
+      this.selectedCollectionEntryId = void 0;
+      (_a2 = this.dialog) == null ? void 0 : _a2.show();
+    }}
+                                      >
+                                          creating your first request!</a
+                                      >.
+                                  </div>` : b`<div class="history-alert-message">
+                                  Retrieving your requests....
+                              </div>`}
+                    </div>
+                </div>
+            </div>
+
+            <terra-data-subsetter
+                .jobId=${this.selectedJob}
+                .collectionEntryId=${this.selectedCollectionEntryId}
+                .bearerToken=${this.bearerToken}
+                is-history-view
+                dialog="history-dialog"
+                part="subsetter"
+            ></terra-data-subsetter>
+        `;
+  }
+};
+_renderHistoryItems = new WeakSet();
+renderHistoryItems_fn = function(subsetJobs) {
+  const filteredJobs = subsetJobs.jobs.slice().filter((job) => {
+    if (this.hideCancelled) {
+      return job.status !== "canceled" /* CANCELED */;
+    }
+    return true;
+  }).sort(
+    (a, b2) => new Date(b2.createdAt).getTime() - new Date(a.createdAt).getTime()
+  );
+  if (!filteredJobs.length) {
+    return b`
+                <div class="history-alert-message">
+                    There are no active requests to show.<br />
+                    If you'd like, you can
+                    <a
+                        href="#"
+                        class="history-alert-link"
+                        @click=${(e2) => {
+      var _a;
+      e2.preventDefault();
+      this.selectedJob = void 0;
+      this.selectedCollectionEntryId = void 0;
+      (_a = this.dialog) == null ? void 0 : _a.show();
+    }}
+                    >
+                        create a new request.</a
+                    >
+                </div>
+            `;
+  }
+  return filteredJobs.map((job) => {
+    let fillColor = "#0066cc";
+    if (job.status === "successful" /* SUCCESSFUL */ || job.status === "complete_with_errors" /* COMPLETE_WITH_ERRORS */ || job.status === "running_with_errors" /* RUNNING_WITH_ERRORS */) {
+      fillColor = "#28a745";
+    } else if (job.status === "failed" /* FAILED */) {
+      fillColor = "#dc3545";
+    } else if (job.status === "canceled" /* CANCELED */) {
+      fillColor = "#ffc107";
+    }
+    const progressLabel = job.status === "failed" /* FAILED */ || job.status === "canceled" /* CANCELED */ ? job.status : `${job.progress}%`;
+    const progress = job.status === "failed" /* FAILED */ || job.status === "canceled" /* CANCELED */ ? 100 : job.progress;
+    const parsedLabels = __privateMethod(this, _parseLabelsAsJson, parseLabelsAsJson_fn).call(this, job.labels || []);
+    return b`
+                <div
+                    class="history-item"
+                    @click=${__privateMethod(this, _handleHistoryItemClick, handleHistoryItemClick_fn).bind(this, job)}
+                >
+                    <div class="item-header">
+                        <div class="item-title">
+                            ${__privateMethod(this, _renderSubsetterHistoryItem, renderSubsetterHistoryItem_fn).call(this, job, parsedLabels)}
+                        </div>
+                    </div>
+
+                    <div class="progress-bar">
+                        <div
+                            class="progress-fill"
+                            style="width: ${progress}%; background-color: ${fillColor}"
+                        >
+                            ${progressLabel}
+                        </div>
+                    </div>
+                </div>
+            `;
+  });
+};
+_renderSubsetterHistoryItem = new WeakSet();
+renderSubsetterHistoryItem_fn = function(job, labels) {
+  var _a;
+  return b`
+            <div class="subsetter-history-item">
+                <div class="history-item-title">
+                    ${(_a = labels["collection-entry-id"]) != null ? _a : job.jobID}
+                </div>
+                <div>${new Date(job.createdAt).toLocaleString()}</div>
+            </div>
+        `;
+};
+_handleHistoryItemClick = new WeakSet();
+handleHistoryItemClick_fn = function(job) {
+  var _a;
+  const parsedLabels = __privateMethod(this, _parseLabelsAsJson, parseLabelsAsJson_fn).call(this, job.labels || []);
+  this.selectedJob = job.jobID;
+  this.selectedCollectionEntryId = parsedLabels["collection-entry-id"];
+  (_a = this.subsetter) == null ? void 0 : _a.showDialog();
+};
+_parseLabelsAsJson = new WeakSet();
+parseLabelsAsJson_fn = function(labels) {
+  try {
+    return Object.fromEntries(
+      labels.map((line) => {
+        const [key, ...rest] = line.split(":");
+        const valueRaw = rest.join(":").trim();
+        let value = valueRaw;
+        if (valueRaw.startsWith("{") || valueRaw.startsWith("[")) {
+          try {
+            value = JSON.parse(valueRaw);
+          } catch (e2) {
+            value = valueRaw;
+          }
+        }
+        return [key.trim(), value];
+      })
+    );
+  } catch (e2) {
+    return {};
+  }
+};
+TerraDataSubsetterHistory.dependencies = {
+  "terra-icon": TerraIcon,
+  "terra-data-subsetter": TerraDataSubsetter,
+  "terra-dialog": TerraDialog
+};
+TerraDataSubsetterHistory.styles = [component_styles_default, data_subsetter_history_styles_default];
+__decorateClass([
+  n()
+], TerraDataSubsetterHistory.prototype, "label", 2);
+__decorateClass([
+  n({
+    attribute: "bearer-token",
+    converter: undefinedStringConverter
+  })
+], TerraDataSubsetterHistory.prototype, "bearerToken", 2);
+__decorateClass([
+  n({ attribute: "always-show", type: Boolean })
+], TerraDataSubsetterHistory.prototype, "alwaysShow", 2);
+__decorateClass([
+  r()
+], TerraDataSubsetterHistory.prototype, "collapsed", 2);
+__decorateClass([
+  r()
+], TerraDataSubsetterHistory.prototype, "selectedJob", 2);
+__decorateClass([
+  r()
+], TerraDataSubsetterHistory.prototype, "selectedCollectionEntryId", 2);
+__decorateClass([
+  r()
+], TerraDataSubsetterHistory.prototype, "hideCancelled", 2);
+__decorateClass([
+  e('[part~="dialog"]')
+], TerraDataSubsetterHistory.prototype, "dialog", 2);
+__decorateClass([
+  e('[part~="subsetter"]')
+], TerraDataSubsetterHistory.prototype, "subsetter", 2);
+
+export {
+  TerraDataSubsetterHistory
+};

package/cdn/chunks/chunk.CROGJ6YF.js

@@ -0,0 +1,128 @@
+import {
+  MutationController
+} from "./chunk.5YAN7WHN.js";
+import {
+  queryCancelHarmonySubsetJob,
+  queryCreateHarmonySubsetJob,
+  queryHarmonyJobStatus
+} from "./chunk.I7HUTXHU.js";
+import {
+  QueryController
+} from "./chunk.YY3ZUPZV.js";
+import {
+  __privateAdd,
+  __privateGet,
+  __privateMethod,
+  __privateSet,
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.ZEOVK2FE.js";
+
+// src/controllers/harmony-request.controller.ts
+init_dirname();
+init_buffer();
+init_process();
+var _jobId, _options, _createJob, _jobStatus, _cancelJob, _getEmptyJob, getEmptyJob_fn;
+var HarmonyRequestController = class {
+  constructor(host) {
+    this.host = host;
+    __privateAdd(this, _getEmptyJob);
+    __privateAdd(this, _jobId, null);
+    __privateAdd(this, _options, void 0);
+    __privateAdd(this, _createJob, void 0);
+    __privateAdd(this, _jobStatus, void 0);
+    __privateAdd(this, _cancelJob, void 0);
+    host.addController(this);
+    __privateSet(this, _createJob, new MutationController(host, queryCreateHarmonySubsetJob()));
+    __privateSet(this, _jobStatus, new QueryController(
+      host,
+      () => queryHarmonyJobStatus(__privateGet(this, _jobId), __privateGet(this, _options))
+    ));
+    __privateSet(this, _cancelJob, new MutationController(host, queryCancelHarmonySubsetJob()));
+  }
+  hostConnected() {
+  }
+  async startJob(variables) {
+    __privateSet(this, _options, variables.options);
+    __privateSet(this, _jobId, "new");
+    try {
+      const result = await __privateGet(this, _createJob).mutate(variables);
+      __privateSet(this, _jobId, result.jobID);
+      return result;
+    } catch (error) {
+      __privateSet(this, _jobId, null);
+      throw error;
+    } finally {
+      this.host.requestUpdate();
+    }
+  }
+  async cancelJob(options) {
+    return __privateGet(this, _cancelJob).mutate(options);
+  }
+  startPollForJobStatus(jobId, options) {
+    __privateSet(this, _options, options);
+    __privateSet(this, _jobId, jobId);
+  }
+  reset() {
+    __privateSet(this, _jobId, null);
+    __privateSet(this, _options, void 0);
+    this.host.requestUpdate();
+  }
+  get jobId() {
+    return __privateGet(this, _jobId);
+  }
+  get data() {
+    var _a, _b;
+    if (__privateGet(this, _jobId) === "new") {
+      return __privateMethod(this, _getEmptyJob, getEmptyJob_fn).call(this);
+    }
+    return (_b = (_a = __privateGet(this, _jobStatus).result) == null ? void 0 : _a.data) != null ? _b : null;
+  }
+  get progress() {
+    var _a, _b;
+    return (_b = (_a = this.data) == null ? void 0 : _a.progress) != null ? _b : 0;
+  }
+  get status() {
+    var _a, _b;
+    if (__privateGet(this, _jobId) === "new") {
+      return "running" /* RUNNING */;
+    }
+    return (_b = (_a = __privateGet(this, _jobStatus).result) == null ? void 0 : _a.data) == null ? void 0 : _b.status;
+  }
+  get isCreating() {
+    var _a, _b;
+    if (__privateGet(this, _jobId) === "new") {
+      return true;
+    }
+    return (_b = (_a = __privateGet(this, _createJob).result) == null ? void 0 : _a.isPending) != null ? _b : false;
+  }
+  get isPolling() {
+    var _a;
+    return ((_a = __privateGet(this, _jobStatus).result) == null ? void 0 : _a.fetchStatus) === "fetching";
+  }
+};
+_jobId = new WeakMap();
+_options = new WeakMap();
+_createJob = new WeakMap();
+_jobStatus = new WeakMap();
+_cancelJob = new WeakMap();
+_getEmptyJob = new WeakSet();
+getEmptyJob_fn = function() {
+  return {
+    jobID: "",
+    status: "running" /* RUNNING */,
+    message: "Your job is being created and will start soon.",
+    progress: 0,
+    createdAt: (/* @__PURE__ */ new Date()).toISOString(),
+    updatedAt: (/* @__PURE__ */ new Date()).toISOString(),
+    dataExpiration: "",
+    request: "",
+    numInputGranules: 0,
+    links: []
+  };
+};
+
+export {
+  HarmonyRequestController
+};