@nasa-terra/components 0.0.1 → 0.0.3

package/dist/chunks/chunk.2O76GCUZ.js

@@ -1,21 +0,0 @@
-import {
-  TerraTimeSeries
-} from "./chunk.27YQ2AOA.js";
-
-// src/react/time-series/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-var tagName = "terra-time-series";
-TerraTimeSeries.define("terra-time-series");
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: TerraTimeSeries,
-  react: React,
-  events: {},
-  displayName: "TerraTimeSeries"
-});
-var time_series_default = reactWrapper;
-
-export {
-  time_series_default
-};

package/dist/chunks/chunk.2WZAYHEX.js

@@ -1,214 +0,0 @@
-import {
-  icon_styles_default
-} from "./chunk.7VUSSQRI.js";
-import {
-  getIconLibrary,
-  unwatchIcon,
-  watchIcon
-} from "./chunk.MDRUDBRH.js";
-import {
-  watch
-} from "./chunk.ZK7QVWBI.js";
-import {
-  TerraElement,
-  component_styles_default
-} from "./chunk.ORZO3BCW.js";
-import {
-  __decorateClass,
-  __privateAdd,
-  __privateGet,
-  __privateMethod,
-  __privateSet
-} from "./chunk.RYPAZDXE.js";
-
-// src/components/icon/icon.component.ts
-import { property, state } from "lit/decorators.js";
-import { isTemplateResult } from "lit/directive-helpers.js";
-var CACHEABLE_ERROR = Symbol();
-var RETRYABLE_ERROR = Symbol();
-var parser;
-var iconCache = /* @__PURE__ */ new Map();
-var _initialRender, _resolveIcon, resolveIcon_fn, _getIconSource, getIconSource_fn, _styleFromAttributes, styleFromAttributes_fn;
-var TerraIcon = class extends TerraElement {
-  constructor() {
-    super(...arguments);
-    /** Given a URL, this function returns the resulting SVG element or an appropriate error symbol. */
-    __privateAdd(this, _resolveIcon);
-    __privateAdd(this, _getIconSource);
-    /**
-     * SVG takes a few presentation attributes. Since we're using a template for SVG and our host element isn't an SVG, we can pass those presentational attributes into a style attribute to affect the underlying SVG.
-     * Merge select attributes with existing inline style attribute to forward values to underlying SVG.
-     */
-    __privateAdd(this, _styleFromAttributes);
-    __privateAdd(this, _initialRender, false);
-    this.svg = null;
-    this.label = "";
-    this.library = "default";
-    this.color = null;
-    this.fontSize = null;
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    watchIcon(this);
-  }
-  firstUpdated() {
-    __privateSet(this, _initialRender, true);
-    this.setIcon();
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback();
-    unwatchIcon(this);
-  }
-  handleLabelChange() {
-    const hasLabel = typeof this.label === "string" && this.label.length > 0;
-    if (hasLabel) {
-      this.setAttribute("role", "img");
-      this.setAttribute("aria-label", this.label);
-      this.removeAttribute("aria-hidden");
-    } else {
-      this.removeAttribute("role");
-      this.removeAttribute("aria-label");
-      this.setAttribute("aria-hidden", "true");
-    }
-  }
-  async setIcon() {
-    var _a;
-    const { url, fromLibrary } = __privateMethod(this, _getIconSource, getIconSource_fn).call(this);
-    const library = fromLibrary ? getIconLibrary(this.library) : void 0;
-    if (!url) {
-      this.svg = null;
-      return;
-    }
-    let iconResolver = iconCache.get(url);
-    if (!iconResolver) {
-      iconResolver = __privateMethod(this, _resolveIcon, resolveIcon_fn).call(this, url);
-      iconCache.set(url, iconResolver);
-    }
-    if (!__privateGet(this, _initialRender)) {
-      return;
-    }
-    const svg = await iconResolver;
-    if (svg === RETRYABLE_ERROR) {
-      iconCache.delete(url);
-    }
-    if (url !== __privateMethod(this, _getIconSource, getIconSource_fn).call(this).url) {
-      return;
-    }
-    if (isTemplateResult(svg)) {
-      this.svg = svg;
-      return;
-    }
-    switch (svg) {
-      case RETRYABLE_ERROR:
-      case CACHEABLE_ERROR:
-        this.svg = null;
-        this.emit("terra-error");
-        break;
-      default:
-        this.svg = svg.cloneNode(true);
-        (_a = library == null ? void 0 : library.mutator) == null ? void 0 : _a.call(library, this.svg);
-        this.emit("terra-load");
-    }
-  }
-  render() {
-    __privateMethod(this, _styleFromAttributes, styleFromAttributes_fn).call(this);
-    return this.svg;
-  }
-};
-_initialRender = new WeakMap();
-_resolveIcon = new WeakSet();
-resolveIcon_fn = async function(url) {
-  var _a;
-  let fileData;
-  try {
-    fileData = await fetch(url, { mode: "cors" });
-    if (!fileData.ok) {
-      return fileData.status === 410 ? CACHEABLE_ERROR : RETRYABLE_ERROR;
-    }
-  } catch (e) {
-    return RETRYABLE_ERROR;
-  }
-  try {
-    const div = document.createElement("div");
-    div.innerHTML = await fileData.text();
-    const svg = div.firstElementChild;
-    if (((_a = svg == null ? void 0 : svg.tagName) == null ? void 0 : _a.toLowerCase()) !== "svg") {
-      return CACHEABLE_ERROR;
-    }
-    if (!parser) {
-      parser = new DOMParser();
-    }
-    const doc = parser.parseFromString(svg.outerHTML, "text/html");
-    const svgEl = doc.body.querySelector("svg");
-    if (!svgEl) {
-      return CACHEABLE_ERROR;
-    }
-    svgEl.part.add("svg");
-    return document.adoptNode(svgEl);
-  } catch (e) {
-    return CACHEABLE_ERROR;
-  }
-};
-_getIconSource = new WeakSet();
-getIconSource_fn = function() {
-  const library = getIconLibrary(this.library);
-  if (this.name && library) {
-    return {
-      url: library.resolver(this.name),
-      fromLibrary: true
-    };
-  }
-  return {
-    url: this.src,
-    fromLibrary: false
-  };
-};
-_styleFromAttributes = new WeakSet();
-styleFromAttributes_fn = function() {
-  const svgAttributes = [
-    { attribute: "color", property: this.color },
-    { attribute: "font-size", property: this.fontSize }
-  ];
-  const style = svgAttributes.reduce((accumulator, { attribute, property: property2 }) => {
-    if (typeof property2 === "string" && property2.length > 0) {
-      accumulator += ` ${attribute}: ${property2};`;
-    }
-    this.removeAttribute(attribute);
-    return accumulator;
-  }, `${this.style.cssText}`);
-  if (style.length > 0) {
-    this.setAttribute("style", style);
-  }
-};
-TerraIcon.styles = [component_styles_default, icon_styles_default];
-__decorateClass([
-  state()
-], TerraIcon.prototype, "svg", 2);
-__decorateClass([
-  property({ reflect: true })
-], TerraIcon.prototype, "name", 2);
-__decorateClass([
-  property()
-], TerraIcon.prototype, "src", 2);
-__decorateClass([
-  property()
-], TerraIcon.prototype, "label", 2);
-__decorateClass([
-  property({ reflect: true })
-], TerraIcon.prototype, "library", 2);
-__decorateClass([
-  property()
-], TerraIcon.prototype, "color", 2);
-__decorateClass([
-  property({ attribute: "font-size" })
-], TerraIcon.prototype, "fontSize", 2);
-__decorateClass([
-  watch("label")
-], TerraIcon.prototype, "handleLabelChange", 1);
-__decorateClass([
-  watch(["name", "src", "library"])
-], TerraIcon.prototype, "setIcon", 1);
-
-export {
-  TerraIcon
-};

package/dist/chunks/chunk.356SSUTI.js

@@ -1,11 +0,0 @@
-import {
-  TerraLoader
-} from "./chunk.Z2WXDYZC.js";
-
-// src/components/loader/loader.ts
-var loader_default = TerraLoader;
-TerraLoader.define("terra-loader");
-
-export {
-  loader_default
-};

package/dist/chunks/chunk.36AVAQOO.js

@@ -1,404 +0,0 @@
-import {
-  variable_combobox_styles_default
-} from "./chunk.T322FDKI.js";
-import {
-  FetchController
-} from "./chunk.MWHQHPUM.js";
-import {
-  clearSelection,
-  groupDocsByCollection,
-  removeEmptyCollections,
-  renderSearchResult,
-  walkToOption
-} from "./chunk.UU46CLE7.js";
-import {
-  icon_default
-} from "./chunk.SMRM4VEQ.js";
-import {
-  button_default
-} from "./chunk.MXAZ646L.js";
-import {
-  watch
-} from "./chunk.ZK7QVWBI.js";
-import {
-  TerraElement,
-  component_styles_default
-} from "./chunk.PJXIJK2G.js";
-import {
-  __decorateClass,
-  __privateAdd,
-  __privateGet,
-  __privateSet,
-  __spreadProps,
-  __spreadValues
-} from "./chunk.RYPAZDXE.js";
-
-// src/components/variable-combobox/variable-combobox.component.ts
-import Fuse from "fuse.js";
-import { LitElement, html, nothing } from "lit";
-import { property, state } from "lit/decorators.js";
-import { cache } from "lit/directives/cache.js";
-import { map } from "lit/directives/map.js";
-import { ref } from "lit/directives/ref.js";
-var _combobox, _fetchController, _searchableList, _listbox, _searchEngine, _walker, _dispatchChange, _handleButtonClick, _handleComboboxChange, _handleOptionClick, _handleKeydown, _manageListboxVisibility, _selectOption;
-var _TerraVariableCombobox = class _TerraVariableCombobox extends TerraElement {
-  constructor() {
-    super(...arguments);
-    __privateAdd(this, _combobox, null);
-    __privateAdd(this, _fetchController, new FetchController(this));
-    __privateAdd(this, _searchableList, []);
-    __privateAdd(this, _listbox, null);
-    __privateAdd(this, _searchEngine, null);
-    __privateAdd(this, _walker, null);
-    this.label = "Search for Variables";
-    this.hideHelp = false;
-    this.hideLabel = false;
-    this.isExpanded = false;
-    this.query = _TerraVariableCombobox.initialQuery;
-    this.searchResults = [];
-    __privateAdd(this, _dispatchChange, (stringifiedData) => {
-      this.emit("terra-combobox-change", { detail: JSON.parse(stringifiedData) });
-    });
-    __privateAdd(this, _handleButtonClick, () => {
-      var _a;
-      this.isExpanded = !this.isExpanded;
-      (_a = __privateGet(this, _combobox)) == null ? void 0 : _a.focus();
-    });
-    __privateAdd(this, _handleComboboxChange, (event) => {
-      var _a;
-      const target = event.target;
-      this.query = target.value;
-      if (target.value) {
-        this.isExpanded = true;
-      }
-      this.searchResults = (_a = __privateGet(this, _searchEngine)) == null ? void 0 : _a.search(target.value).map(({ item }) => item);
-    });
-    __privateAdd(this, _handleOptionClick, (event) => {
-      const path = event.composedPath();
-      const [target] = path.filter(
-        (eventTarget) => eventTarget.role === "option"
-      );
-      if (!target) {
-        return;
-      }
-      __privateGet(this, _selectOption).call(this, target);
-    });
-    __privateAdd(this, _handleKeydown, (event) => {
-      var _a;
-      switch (event.key) {
-        case "ArrowDown": {
-          clearSelection(
-            __privateGet(this, _combobox),
-            __privateGet(this, _listbox)
-          );
-          if (!this.isExpanded) {
-            this.isExpanded = true;
-          }
-          if (event.altKey) {
-            break;
-          }
-          walkToOption(
-            __privateGet(this, _walker),
-            __privateGet(this, _combobox),
-            "next"
-          );
-          break;
-        }
-        case "ArrowUp": {
-          clearSelection(
-            __privateGet(this, _combobox),
-            __privateGet(this, _listbox)
-          );
-          if (!this.isExpanded) {
-            this.isExpanded = true;
-          }
-          walkToOption(
-            __privateGet(this, _walker),
-            __privateGet(this, _combobox),
-            "previous"
-          );
-          break;
-        }
-        case "Enter": {
-          __privateGet(this, _selectOption).call(this, (_a = __privateGet(this, _walker)) == null ? void 0 : _a.currentNode);
-          break;
-        }
-        case "Escape": {
-          clearSelection(
-            __privateGet(this, _combobox),
-            __privateGet(this, _listbox)
-          );
-          if (this.isExpanded) {
-            this.isExpanded = false;
-            this.dispatchEvent(new Event("cancel"));
-          } else {
-            this.query = _TerraVariableCombobox.initialQuery;
-          }
-          break;
-        }
-        default: {
-          break;
-        }
-      }
-    });
-    __privateAdd(this, _manageListboxVisibility, (event) => {
-      const path = event.composedPath();
-      const containedThis = path.some(
-        (eventTarget) => eventTarget.localName === _TerraVariableCombobox.tagName
-      );
-      if (!containedThis) {
-        this.isExpanded = false;
-      }
-    });
-    __privateAdd(this, _selectOption, (option) => {
-      const { longName, eventDetail } = option.dataset;
-      this.query = `${longName}`;
-      __privateGet(this, _dispatchChange).call(this, eventDetail);
-      this.isExpanded = false;
-      clearSelection(
-        __privateGet(this, _combobox),
-        __privateGet(this, _listbox)
-      );
-    });
-  }
-  async valueChanged() {
-    var _a;
-    await __privateGet(this, _fetchController).taskComplete;
-    const selectedVariable = (_a = __privateGet(this, _fetchController).value) == null ? void 0 : _a.find((variable) => {
-      return variable.entryId === this.value;
-    });
-    if (selectedVariable) {
-      this.query = selectedVariable.longName;
-      __privateGet(this, _dispatchChange).call(this, selectedVariable.eventDetail);
-    }
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    globalThis.addEventListener("click", __privateGet(this, _manageListboxVisibility));
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback();
-    globalThis.addEventListener("click", __privateGet(this, _manageListboxVisibility));
-  }
-  clear() {
-    this.query = _TerraVariableCombobox.initialQuery;
-  }
-  close() {
-    this.isExpanded = false;
-  }
-  toggle() {
-    this.isExpanded = !this.isExpanded;
-  }
-  render() {
-    var _a, _b, _c;
-    const searchHasNoMatches = ((_a = this.searchResults) == null ? void 0 : _a.length) === 0 && ((_b = __privateGet(this, _searchableList)) == null ? void 0 : _b.length) !== 0 && this.query !== _TerraVariableCombobox.initialQuery;
-    return html`<search part="base" title="Search through the list.">
-            <label
-                for="combobox"
-                class=${this.hideLabel ? "sr-only" : "search-input-label"}
-                >${this.label}</label
-            >
-            <div class="search-input-group">
-                <input
-                    ${ref((el) => {
-      var _a2;
-      if (el) {
-        (_a2 = __privateGet(this, _combobox)) != null ? _a2 : __privateSet(this, _combobox, el);
-      }
-    })}
-                    aria-autocomplete="list"
-                    aria-controls="listbox"
-                    aria-expanded=${this.isExpanded}
-                    class="combobox"
-                    id="combobox"
-                    part="combobox"
-                    role="combobox"
-                    type="text"
-                    .placeholder=${(_c = this.placeholder) != null ? _c : `${this.label}\u2026`}
-                    .value=${this.query}
-                    @input=${__privateGet(this, _handleComboboxChange)}
-                    @keydown=${__privateGet(this, _handleKeydown)}
-                />
-                <button
-                    aria-controls="listbox"
-                    aria-expanded=${this.isExpanded}
-                    aria-label="List of Searchable Variables"
-                    class="combobox-button"
-                    id="combobox-button"
-                    part="button"
-                    tabindex="-1"
-                    type="button"
-                    @click=${__privateGet(this, _handleButtonClick)}
-                >
-                    ${["COMPLETE", "ERROR"].includes(__privateGet(this, _fetchController).taskStatus) ? html`<terra-icon
-                              class="chevron"
-                              name="chevron-down"
-                          ></terra-icon>` : html`<svg
-                              class="button-icon spinner"
-                              stroke="currentColor"
-                              viewBox="0 0 24 24"
-                              xmlns="http://www.w3.org/2000/svg"
-                          >
-                              <circle
-                                  cx="12"
-                                  cy="12"
-                                  r="9.5"
-                                  fill="none"
-                                  stroke-width="3"
-                              ></circle>
-                          </svg>`}
-                </button>
-
-                ${this.hideHelp ? nothing : html`<p class="search-help">
-                          See
-                          <a
-                              href="https://www.fusejs.io/examples.html#extended-search"
-                              rel="noopener noreferrer"
-                              tabindex=${this.isExpanded ? "-1 " : "0"}
-                              target="_blank"
-                              >extended search syntax
-                              <svg
-                                  aria-hidden="true"
-                                  class="external-link"
-                                  xmlns="http://www.w3.org/2000/svg"
-                                  width="14"
-                                  height="14"
-                                  viewBox="0 0 24 24"
-                              >
-                                  <path
-                                      d="M19 19H5V5h7V3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"
-                                  /></svg></a
-                          >.
-                      </p>`}
-            </div>
-
-            <ul
-                ${ref((el) => {
-      var _a2;
-      if (el) {
-        (_a2 = __privateGet(this, _listbox)) != null ? _a2 : __privateSet(this, _listbox, el);
-        __privateSet(this, _walker, document.createTreeWalker(
-          el,
-          NodeFilter.SHOW_ELEMENT,
-          (node) => {
-            return node.dataset.treeWalker === "filter_skip" ? NodeFilter.FILTER_SKIP : NodeFilter.FILTER_ACCEPT;
-          }
-        ));
-      }
-    })}
-                ?inert=${!this.isExpanded}
-                ?open=${this.isExpanded}
-                @click=${__privateGet(this, _handleOptionClick)}
-                aria-label=${this.query ? `Variables Matching ${this.query}` : "Variables"}
-                id="listbox"
-                part="listbox"
-                role="listbox"
-                class="search-results"
-            >
-                ${searchHasNoMatches ? html`<li
-                          class="listbox-option-group"
-                          data-tree-walker="filter_skip"
-                      >
-                          <terra-button
-                              @click=${() => this.query = _TerraVariableCombobox.initialQuery}
-                              class="clear-button"
-                              data-tree-walker="filter_skip"
-                          >
-                              clear search
-                          </terra-button>
-                      </li>` : nothing}
-                ${__privateGet(this, _fetchController).render({
-      initial: () => html`<li class="updating">Updating List of Variables</li>`,
-      pending: () => html`<li class="updating">Updating List of Variables</li>`,
-      complete: (list) => {
-        __privateSet(this, _searchableList, list);
-        __privateSet(this, _searchEngine, new Fuse(__privateGet(this, _searchableList), {
-          //* @see {@link https://www.fusejs.io/examples.html#nested-search}
-          findAllMatches: true,
-          keys: [
-            "entryId",
-            "longName",
-            "name",
-            "standardName",
-            "units"
-          ],
-          useExtendedSearch: true
-        }));
-        return cache(
-          this.query === _TerraVariableCombobox.initialQuery ? map(
-            removeEmptyCollections(
-              groupDocsByCollection(__privateGet(this, _searchableList))
-            ),
-            renderSearchResult
-          ) : map(
-            removeEmptyCollections(
-              groupDocsByCollection(this.searchResults)
-            ),
-            renderSearchResult
-          )
-        );
-      },
-      // TODO: Consider a more robust error strategy...like retry w/ backoff?
-      error: (errorMessage) => html`<li class="error" data-tree-walker="filter_skip">
-                            ${errorMessage}
-                        </li>`
-    })}
-            </ul>
-        </search>`;
-  }
-};
-_combobox = new WeakMap();
-_fetchController = new WeakMap();
-_searchableList = new WeakMap();
-_listbox = new WeakMap();
-_searchEngine = new WeakMap();
-_walker = new WeakMap();
-_dispatchChange = new WeakMap();
-_handleButtonClick = new WeakMap();
-_handleComboboxChange = new WeakMap();
-_handleOptionClick = new WeakMap();
-_handleKeydown = new WeakMap();
-_manageListboxVisibility = new WeakMap();
-_selectOption = new WeakMap();
-_TerraVariableCombobox.dependencies = {
-  "terra-button": button_default,
-  "terra-icon": icon_default
-};
-_TerraVariableCombobox.styles = [component_styles_default, variable_combobox_styles_default];
-_TerraVariableCombobox.shadowRootOptions = __spreadProps(__spreadValues({}, LitElement.shadowRootOptions), {
-  delegatesFocus: true
-});
-_TerraVariableCombobox.tagName = "terra-variable-combobox";
-_TerraVariableCombobox.initialQuery = "";
-__decorateClass([
-  property()
-], _TerraVariableCombobox.prototype, "label", 2);
-__decorateClass([
-  property()
-], _TerraVariableCombobox.prototype, "placeholder", 2);
-__decorateClass([
-  property({ attribute: "hide-help", type: Boolean })
-], _TerraVariableCombobox.prototype, "hideHelp", 2);
-__decorateClass([
-  property({ attribute: "hide-label", type: Boolean })
-], _TerraVariableCombobox.prototype, "hideLabel", 2);
-__decorateClass([
-  property()
-], _TerraVariableCombobox.prototype, "value", 2);
-__decorateClass([
-  state()
-], _TerraVariableCombobox.prototype, "isExpanded", 2);
-__decorateClass([
-  state()
-], _TerraVariableCombobox.prototype, "query", 2);
-__decorateClass([
-  state()
-], _TerraVariableCombobox.prototype, "searchResults", 2);
-__decorateClass([
-  watch("value")
-], _TerraVariableCombobox.prototype, "valueChanged", 1);
-var TerraVariableCombobox = _TerraVariableCombobox;
-
-export {
-  TerraVariableCombobox
-};

package/dist/chunks/chunk.3D66L46K.js

@@ -1,11 +0,0 @@
-import {
-  TerraCombobox
-} from "./chunk.YDJ7Z7YW.js";
-
-// src/components/combobox/combobox.ts
-var combobox_default = TerraCombobox;
-TerraCombobox.define("terra-combobox");
-
-export {
-  combobox_default
-};

package/dist/chunks/chunk.4MN2BLJS.js

@@ -1,21 +0,0 @@
-import {
-  TerraMap
-} from "./chunk.NOEGCTIS.js";
-
-// src/react/map/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-var tagName = "terra-map";
-TerraMap.define("terra-map");
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: TerraMap,
-  react: React,
-  events: {},
-  displayName: "TerraMap"
-});
-var map_default = reactWrapper;
-
-export {
-  map_default
-};