@nasa-terra/components 0.0.179 → 0.0.182

package/cdn/chunks/chunk.CU6Y4S4O.js

@@ -0,0 +1,134 @@
+import {
+  c
+} from "./chunk.BVACLOKI.js";
+import {
+  b
+} from "./chunk.RRCYT4LP.js";
+import {
+  __spreadProps,
+  __spreadValues,
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.ZEOVK2FE.js";
+
+// src/components/variable-combobox/lib.ts
+init_dirname();
+init_buffer();
+init_process();
+function renderSearchResult(listItem, index) {
+  return b`<li class="listbox-option-group" data-tree-walker="filter_skip">
+        <span class="group-title" data-tree-walker="filter_skip"
+            >${listItem.collectionEntryId}</span
+        >
+        <ul data-tree-walker="filter_skip">
+            ${c(
+    listItem.variables,
+    (variable) => `${variable.collectionShortName}_${variable.collectionVersion}--${variable.longName}`,
+    (variable, subIndex) => {
+      return b`
+                        <li
+                            id="listbox-option-${index}.${subIndex}"
+                            role="option"
+                            class="listbox-option"
+                            data-name=${variable.name}
+                            data-long-name=${variable.longName}
+                            data-event-detail=${variable.eventDetail}
+                        >
+                            ${variable.longName} (${variable.units})
+                        </li>
+                    `;
+    }
+  )}
+        </ul>
+    </li>`;
+}
+function removeEmptyCollections(docs) {
+  const nonEmptyCollections = docs.filter((doc) => {
+    return !!doc.variables.length;
+  });
+  return nonEmptyCollections;
+}
+function groupDocsByCollection(docs = []) {
+  const groupedDocs = {};
+  for (const doc of docs) {
+    const key = `${doc.collectionShortName}_${doc.collectionVersion}`;
+    Array.isArray(groupedDocs[key]) ? groupedDocs[key].push(doc) : groupedDocs[key] = [doc];
+  }
+  return Object.entries(groupedDocs).map(([collectionEntryId, variables]) => {
+    return {
+      collectionEntryId,
+      variables
+    };
+  });
+}
+function cherryPickDocInfo(docs) {
+  return docs.map((doc) => {
+    const renderableData = {
+      collectionBeginningDateTime: doc["Collection.BeginDateTime"],
+      collectionEndingDateTime: doc["Collection.EndDateTime"],
+      collectionLongName: doc["Collection.LongName"],
+      collectionShortName: doc["Collection.ShortName"],
+      collectionVersion: doc["Collection.Version"],
+      entryId: doc["Variable.Id"],
+      longName: doc["Variable.LongName"],
+      name: doc["Variable.Name"],
+      standardName: doc["Variable.StandardName"],
+      units: doc["Variable.Units"],
+      timeInterval: doc["Collection.TimeInterval"]
+    };
+    return __spreadProps(__spreadValues({}, renderableData), {
+      eventDetail: JSON.stringify(__spreadProps(__spreadValues({}, renderableData), {
+        datasetLandingPage: doc["Collection.DescriptionUrl"],
+        variableLandingPage: doc["Variable.DescriptionUrl"]
+      }))
+    });
+  });
+}
+function clearSelection(combobox, listbox) {
+  combobox.removeAttribute("aria-activedescendant");
+  listbox.querySelectorAll("[aria-selected]").forEach((option) => option.removeAttribute("aria-selected"));
+}
+function walkToOption(walker, combobox, direction = "next") {
+  const maybeCurrentElement = direction === "next" ? walker.nextNode() : walker.previousNode();
+  if (maybeCurrentElement === null || maybeCurrentElement === walker.root) {
+    direction === "next" ? walkToFirst(walker) : walkToLast(walker);
+  }
+  combobox.setAttribute(
+    "aria-activedescendant",
+    walker.currentNode.id
+  );
+  walker.currentNode.setAttribute("aria-selected", "true");
+  globalThis.setTimeout(() => {
+    ;
+    walker.currentNode.scrollIntoView({
+      behavior: "auto",
+      block: "nearest"
+    });
+  }, 100);
+}
+function walkToFirst(walker) {
+  walker.parentNode();
+  walker.firstChild();
+}
+function walkToLast(walker) {
+  walker.parentNode();
+  walker.lastChild();
+}
+function adaptValueToVariableMetadata(value) {
+  const lastUnderscoreIndex = value.lastIndexOf("_");
+  const collection = value.substring(0, lastUnderscoreIndex);
+  const variableName = value.substring(lastUnderscoreIndex + 1);
+  const modifiedCollection = collection.replace(/_v(?=[^_]*$)/, "_");
+  return `${modifiedCollection}_${variableName}`;
+}
+
+export {
+  renderSearchResult,
+  removeEmptyCollections,
+  groupDocsByCollection,
+  cherryPickDocInfo,
+  clearSelection,
+  walkToOption,
+  adaptValueToVariableMetadata
+};

package/cdn/chunks/chunk.DCABAUTG.js

@@ -0,0 +1,29 @@
+import {
+  TerraStepperStep
+} from "./chunk.7CTLZBMK.js";
+import {
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.ZEOVK2FE.js";
+
+// src/react/stepper-step/index.ts
+init_dirname();
+init_buffer();
+init_process();
+import * as React from "react";
+import { createComponent } from "@lit/react";
+var tagName = "terra-stepper-step";
+TerraStepperStep.define("terra-stepper-step");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: TerraStepperStep,
+  react: React,
+  events: {},
+  displayName: "TerraStepperStep"
+});
+var stepper_step_default = reactWrapper;
+
+export {
+  stepper_step_default
+};

package/cdn/chunks/chunk.DCDKEGGF.js

@@ -0,0 +1,60 @@
+import {
+  card_styles_default
+} from "./chunk.RWGG5FYE.js";
+import {
+  HasSlotController
+} from "./chunk.PACUQ7ID.js";
+import {
+  e
+} from "./chunk.KGXAA5I2.js";
+import {
+  TerraElement,
+  component_styles_default
+} from "./chunk.7ZVYIV7K.js";
+import {
+  b
+} from "./chunk.RRCYT4LP.js";
+import {
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.ZEOVK2FE.js";
+
+// src/components/card/card.component.ts
+init_dirname();
+init_buffer();
+init_process();
+var TerraCard = class extends TerraElement {
+  constructor() {
+    super(...arguments);
+    this.hasSlotController = new HasSlotController(
+      this,
+      "footer",
+      "header",
+      "image"
+    );
+  }
+  render() {
+    return b`
+            <div
+                part="base"
+                class=${e({
+      card: true,
+      "card--has-footer": this.hasSlotController.test("footer"),
+      "card--has-image": this.hasSlotController.test("image"),
+      "card--has-header": this.hasSlotController.test("header")
+    })}
+            >
+                <slot name="image" part="image" class="card__image"></slot>
+                <slot name="header" part="header" class="card__header"></slot>
+                <slot part="body" class="card__body"></slot>
+                <slot name="footer" part="footer" class="card__footer"></slot>
+            </div>
+        `;
+  }
+};
+TerraCard.styles = [component_styles_default, card_styles_default];
+
+export {
+  TerraCard
+};

package/cdn/chunks/chunk.DHUO654N.js

@@ -0,0 +1,19 @@
+import {
+  TerraDropdown
+} from "./chunk.ACVD4RLC.js";
+import {
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.ZEOVK2FE.js";
+
+// src/components/dropdown/dropdown.ts
+init_dirname();
+init_buffer();
+init_process();
+var dropdown_default = TerraDropdown;
+TerraDropdown.define("terra-dropdown");
+
+export {
+  dropdown_default
+};

package/cdn/chunks/chunk.DHZRFA4Q.js

@@ -0,0 +1,71 @@
+import {
+  tab_panel_styles_default
+} from "./chunk.NFI5NVW6.js";
+import {
+  e
+} from "./chunk.KGXAA5I2.js";
+import {
+  watch
+} from "./chunk.MPVZOQYA.js";
+import {
+  TerraElement,
+  component_styles_default,
+  n
+} from "./chunk.7ZVYIV7K.js";
+import {
+  b
+} from "./chunk.RRCYT4LP.js";
+import {
+  __decorateClass,
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.ZEOVK2FE.js";
+
+// src/components/tab-panel/tab-panel.component.ts
+init_dirname();
+init_buffer();
+init_process();
+var id = 0;
+var TerraTabPanel = class extends TerraElement {
+  constructor() {
+    super(...arguments);
+    this.attrId = ++id;
+    this.componentId = `terra-tab-panel-${this.attrId}`;
+    this.name = "";
+    this.active = false;
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.id = this.id.length > 0 ? this.id : this.componentId;
+    this.setAttribute("role", "tabpanel");
+  }
+  handleActiveChange() {
+    this.setAttribute("aria-hidden", this.active ? "false" : "true");
+  }
+  render() {
+    return b`
+            <slot
+                part="base"
+                class=${e({
+      "tab-panel": true,
+      "tab-panel--active": this.active
+    })}
+            ></slot>
+        `;
+  }
+};
+TerraTabPanel.styles = [component_styles_default, tab_panel_styles_default];
+__decorateClass([
+  n({ reflect: true })
+], TerraTabPanel.prototype, "name", 2);
+__decorateClass([
+  n({ type: Boolean, reflect: true })
+], TerraTabPanel.prototype, "active", 2);
+__decorateClass([
+  watch("active")
+], TerraTabPanel.prototype, "handleActiveChange", 1);
+
+export {
+  TerraTabPanel
+};

package/cdn/chunks/chunk.DKR37O6M.js

@@ -0,0 +1,99 @@
+import {
+  login_styles_default
+} from "./chunk.GWVXU5WI.js";
+import {
+  loader_default
+} from "./chunk.27H6Y66N.js";
+import {
+  AuthController
+} from "./chunk.7DYV7ZXX.js";
+import {
+  icon_default
+} from "./chunk.R5WMOIJK.js";
+import {
+  button_default
+} from "./chunk.VGXUJ5AG.js";
+import {
+  TerraElement,
+  component_styles_default,
+  n
+} from "./chunk.7ZVYIV7K.js";
+import {
+  b
+} from "./chunk.RRCYT4LP.js";
+import {
+  __decorateClass,
+  __privateAdd,
+  __privateGet,
+  __privateMethod,
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.ZEOVK2FE.js";
+
+// src/components/login/login.component.ts
+init_dirname();
+init_buffer();
+init_process();
+var _authController, _applyUserToMessage, applyUserToMessage_fn;
+var TerraLogin = class extends TerraElement {
+  constructor() {
+    super(...arguments);
+    __privateAdd(this, _applyUserToMessage);
+    this.buttonLabel = "Earthdata Login";
+    __privateAdd(this, _authController, new AuthController(this));
+  }
+  login() {
+    __privateGet(this, _authController).login();
+  }
+  logout() {
+    __privateGet(this, _authController).logout();
+  }
+  render() {
+    var _a;
+    if ((_a = __privateGet(this, _authController).state.user) == null ? void 0 : _a.uid) {
+      const template = this.querySelector(
+        'template[slot="logged-in"]'
+      );
+      return b`${template ? template.content.cloneNode(true) : b`<slot name="logged-in" .user=${__privateGet(this, _authController).state.user}
+                      >${__privateMethod(this, _applyUserToMessage, applyUserToMessage_fn).call(this, this.loggedInMessage)}</slot
+                  >`}`;
+    }
+    if (__privateGet(this, _authController).state.isLoading) {
+      return b`<slot name="loading">${this.loadingMessage}</slot>`;
+    }
+    return b` <slot name="logged-out">${this.loggedOutMessage}</slot
+            ><terra-button @click=${this.login}> ${this.buttonLabel}</terra-button>`;
+  }
+};
+_authController = new WeakMap();
+_applyUserToMessage = new WeakSet();
+applyUserToMessage_fn = function(message) {
+  var _a, _b, _c, _d, _e, _f;
+  return (message != null ? message : "").replace("{username}", (_b = (_a = __privateGet(this, _authController).state.user) == null ? void 0 : _a.uid) != null ? _b : "").replace(
+    "{first_name}",
+    (_d = (_c = __privateGet(this, _authController).state.user) == null ? void 0 : _c.first_name) != null ? _d : ""
+  ).replace("{last_name}", (_f = (_e = __privateGet(this, _authController).state.user) == null ? void 0 : _e.last_name) != null ? _f : "");
+};
+TerraLogin.dependencies = {
+  "terra-button": button_default,
+  "terra-icon": icon_default,
+  "terra-loader": loader_default
+};
+TerraLogin.styles = [component_styles_default, login_styles_default];
+__decorateClass([
+  n({ attribute: "button-label" })
+], TerraLogin.prototype, "buttonLabel", 2);
+__decorateClass([
+  n({ attribute: "logged-in-message" })
+], TerraLogin.prototype, "loggedInMessage", 2);
+__decorateClass([
+  n({ attribute: "logged-out-message" })
+], TerraLogin.prototype, "loggedOutMessage", 2);
+__decorateClass([
+  n({ attribute: "loading-message" })
+], TerraLogin.prototype, "loadingMessage", 2);
+
+export {
+  TerraLogin
+};

package/cdn/chunks/chunk.E5INDWJO.js

@@ -0,0 +1,231 @@
+import {
+  pagination_styles_default
+} from "./chunk.QCZUWUCV.js";
+import {
+  e
+} from "./chunk.KGXAA5I2.js";
+import {
+  TerraIcon
+} from "./chunk.S3QWAZET.js";
+import {
+  watch
+} from "./chunk.MPVZOQYA.js";
+import {
+  TerraElement,
+  component_styles_default,
+  n,
+  r
+} from "./chunk.7ZVYIV7K.js";
+import {
+  b
+} from "./chunk.RRCYT4LP.js";
+import {
+  __decorateClass,
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.ZEOVK2FE.js";
+
+// src/components/pagination/pagination.component.ts
+init_dirname();
+init_buffer();
+init_process();
+var TerraPagination = class extends TerraElement {
+  constructor() {
+    super(...arguments);
+    this.current = 1;
+    this.total = 1;
+    this.variant = "full";
+    this.centered = false;
+    this._visiblePages = [];
+  }
+  handlePropsChange() {
+    this._updateVisiblePages();
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this._updateVisiblePages();
+  }
+  _updateVisiblePages() {
+    const pages = [];
+    const total = Math.max(1, this.total);
+    const current = Math.max(1, Math.min(this.current, total));
+    if (this.variant === "simple") {
+      this._visiblePages = [];
+      return;
+    }
+    if (total <= 7) {
+      for (let i = 1; i <= total; i++) {
+        pages.push(i);
+      }
+    } else {
+      pages.push(1);
+      if (current <= 4) {
+        for (let i = 2; i <= 5; i++) {
+          pages.push(i);
+        }
+        pages.push(-1);
+        pages.push(total);
+      } else if (current >= total - 3) {
+        pages.push(-1);
+        for (let i = total - 4; i <= total; i++) {
+          pages.push(i);
+        }
+      } else {
+        pages.push(-1);
+        for (let i = current - 1; i <= current + 1; i++) {
+          pages.push(i);
+        }
+        pages.push(-1);
+        pages.push(total);
+      }
+    }
+    this._visiblePages = pages;
+  }
+  _handlePageClick(page) {
+    if (page === this.current || page < 1 || page > this.total) {
+      return;
+    }
+    this.current = page;
+    this._updateVisiblePages();
+    this.emit("terra-page-change", { detail: { page } });
+  }
+  _handlePrevClick() {
+    if (this.current > 1) {
+      this._handlePageClick(this.current - 1);
+    }
+  }
+  _handleNextClick() {
+    if (this.current < this.total) {
+      this._handlePageClick(this.current + 1);
+    }
+  }
+  render() {
+    const total = Math.max(1, this.total);
+    const current = Math.max(1, Math.min(this.current, total));
+    const isPrevDisabled = current === 1;
+    const isNextDisabled = current === total;
+    const showNumbers = this.variant === "full";
+    return b`
+            <div
+                part="base"
+                class=${e({
+      pagination: true,
+      "pagination--centered": this.centered,
+      "pagination--left": this.variant === "full" && !this.centered,
+      "pagination--simple": this.variant === "simple"
+    })}
+            >
+                <nav part="nav" class="pagination__nav">
+                    <button
+                        part="prev"
+                        class="pagination__button pagination__button--prev"
+                        ?disabled=${isPrevDisabled}
+                        @click=${this._handlePrevClick}
+                        aria-label="Previous page"
+                    >
+                        ${this.variant === "simple" ? b`
+                                  <terra-icon
+                                      name="chevron-left"
+                                      library="default"
+                                  ></terra-icon>
+                                  <span class="pagination__button-text"
+                                      >Previous</span
+                                  >
+                              ` : b`
+                                  <terra-icon
+                                      name="chevron-left"
+                                      library="default"
+                                  ></terra-icon>
+                              `}
+                    </button>
+
+                    ${showNumbers ? b`
+                              ${this._visiblePages.map((page) => {
+      if (page === -1) {
+        return b`
+                                          <span
+                                              part="ellipsis"
+                                              class="pagination__ellipsis"
+                                              aria-hidden="true"
+                                              >…</span
+                                          >
+                                      `;
+      }
+      const isCurrent = page === current;
+      return b`
+                                      <button
+                                          part=${isCurrent ? "button-current button" : "button"}
+                                          class=${e({
+        pagination__button: true,
+        "pagination__button--page": true,
+        "pagination__button--current": isCurrent
+      })}
+                                          ?disabled=${isCurrent}
+                                          @click=${() => this._handlePageClick(page)}
+                                          aria-label=${`Page ${page}`}
+                                          aria-current=${isCurrent ? "page" : void 0}
+                                      >
+                                          ${page}
+                                      </button>
+                                  `;
+    })}
+                          ` : ""}
+
+                    <button
+                        part="next"
+                        class="pagination__button pagination__button--next"
+                        ?disabled=${isNextDisabled}
+                        @click=${this._handleNextClick}
+                        aria-label="Next page"
+                    >
+                        ${this.variant === "simple" ? b`
+                                  <span class="pagination__button-text">Next</span>
+                                  <terra-icon
+                                      name="chevron-right"
+                                      library="default"
+                                  ></terra-icon>
+                              ` : b`
+                                  <terra-icon
+                                      name="chevron-right"
+                                      library="default"
+                                  ></terra-icon>
+                              `}
+                    </button>
+                </nav>
+
+                ${this.variant === "full" && !this.centered ? b`
+                          <div part="slot" class="pagination__slot">
+                              <slot></slot>
+                          </div>
+                      ` : ""}
+            </div>
+        `;
+  }
+};
+TerraPagination.styles = [component_styles_default, pagination_styles_default];
+TerraPagination.dependencies = {
+  "terra-icon": TerraIcon
+};
+__decorateClass([
+  n({ type: Number })
+], TerraPagination.prototype, "current", 2);
+__decorateClass([
+  n({ type: Number })
+], TerraPagination.prototype, "total", 2);
+__decorateClass([
+  n({ reflect: true })
+], TerraPagination.prototype, "variant", 2);
+__decorateClass([
+  n({ type: Boolean })
+], TerraPagination.prototype, "centered", 2);
+__decorateClass([
+  r()
+], TerraPagination.prototype, "_visiblePages", 2);
+__decorateClass([
+  watch(["current", "total", "variant"])
+], TerraPagination.prototype, "handlePropsChange", 1);
+
+export {
+  TerraPagination
+};

package/cdn/chunks/chunk.EB57UDHS.js

@@ -0,0 +1,29 @@
+import {
+  TerraCombobox
+} from "./chunk.VS4OOTZG.js";
+import {
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.ZEOVK2FE.js";
+
+// src/react/combobox/index.ts
+init_dirname();
+init_buffer();
+init_process();
+import * as React from "react";
+import { createComponent } from "@lit/react";
+var tagName = "terra-combobox";
+TerraCombobox.define("terra-combobox");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: TerraCombobox,
+  react: React,
+  events: {},
+  displayName: "TerraCombobox"
+});
+var combobox_default = reactWrapper;
+
+export {
+  combobox_default
+};