@nasa-terra/components 0.0.167 → 0.0.169

package/cdn/chunks/chunk.W7KGVFJQ.js

@@ -0,0 +1,52 @@
+import {
+  GiovanniVariableCatalog
+} from "./chunk.K7EC2QO6.js";
+import {
+  h,
+  s
+} from "./chunk.WQPCK3PB.js";
+import {
+  __privateAdd,
+  __privateGet,
+  __privateSet,
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.CZA6CSBG.js";
+
+// src/components/variable-keyword-search/variable-keyword-search.controller.ts
+init_dirname();
+init_buffer();
+init_process();
+var _apiTask;
+var FetchController = class {
+  constructor(host) {
+    __privateAdd(this, _apiTask, void 0);
+    const variableCatalog = new GiovanniVariableCatalog();
+    __privateSet(this, _apiTask, new h(host, {
+      task: async () => variableCatalog.getSearchKeywords(),
+      args: () => []
+    }));
+  }
+  get taskComplete() {
+    return __privateGet(this, _apiTask).taskComplete;
+  }
+  get value() {
+    return __privateGet(this, _apiTask).value;
+  }
+  get taskStatus() {
+    const readableStatus = Object.entries(s).reduce((accumulator, [key, value]) => {
+      accumulator[value] = key;
+      return accumulator;
+    }, {});
+    return readableStatus[__privateGet(this, _apiTask).status];
+  }
+  render(renderFunctions) {
+    return __privateGet(this, _apiTask).render(renderFunctions);
+  }
+};
+_apiTask = new WeakMap();
+
+export {
+  FetchController
+};

package/cdn/chunks/chunk.WACY4TCH.js

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

package/cdn/chunks/chunk.WHG6YFIB.js

@@ -0,0 +1,19 @@
+import {
+  TerraToast
+} from "./chunk.BJDNJHIM.js";
+import {
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.CZA6CSBG.js";
+
+// src/components/toast/toast.ts
+init_dirname();
+init_buffer();
+init_process();
+var toast_default = TerraToast;
+TerraToast.define("terra-toast");
+
+export {
+  toast_default
+};

package/cdn/chunks/chunk.WQRXNFMU.js

@@ -0,0 +1,60 @@
+import {
+  card_styles_default
+} from "./chunk.6F6BC7HB.js";
+import {
+  HasSlotController
+} from "./chunk.YTY4DQKX.js";
+import {
+  e
+} from "./chunk.P3OLQVQM.js";
+import {
+  TerraElement,
+  component_styles_default
+} from "./chunk.7NG6N5I3.js";
+import {
+  x
+} from "./chunk.3ZQGAH53.js";
+import {
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.CZA6CSBG.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 x`
+            <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.X4TM7GM6.js

@@ -0,0 +1,29 @@
+import {
+  TerraButtonGroup
+} from "./chunk.4TIGHFD5.js";
+import {
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.CZA6CSBG.js";
+
+// src/react/button-group/index.ts
+init_dirname();
+init_buffer();
+init_process();
+import * as React from "react";
+import { createComponent } from "@lit/react";
+var tagName = "terra-button-group";
+TerraButtonGroup.define("terra-button-group");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: TerraButtonGroup,
+  react: React,
+  events: {},
+  displayName: "TerraButtonGroup"
+});
+var button_group_default = reactWrapper;
+
+export {
+  button_group_default
+};

package/cdn/chunks/chunk.XDGH7ACO.js

@@ -0,0 +1,155 @@
+import {
+  progress_bar_styles_default
+} from "./chunk.SLPZU6ID.js";
+import {
+  o
+} from "./chunk.TVDMMEGB.js";
+import {
+  e as e2
+} from "./chunk.P3OLQVQM.js";
+import {
+  e,
+  i,
+  t
+} from "./chunk.JLIAPPXF.js";
+import {
+  TerraElement,
+  component_styles_default,
+  n
+} from "./chunk.7NG6N5I3.js";
+import {
+  T,
+  x
+} from "./chunk.3ZQGAH53.js";
+import {
+  __decorateClass,
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.CZA6CSBG.js";
+
+// src/components/progress-bar/progress-bar.component.ts
+init_dirname();
+init_buffer();
+init_process();
+
+// node_modules/lit/directives/style-map.js
+init_dirname();
+init_buffer();
+init_process();
+
+// node_modules/lit-html/directives/style-map.js
+init_dirname();
+init_buffer();
+init_process();
+var n2 = "important";
+var i2 = " !" + n2;
+var o2 = e(class extends i {
+  constructor(t2) {
+    var _a;
+    if (super(t2), t2.type !== t.ATTRIBUTE || "style" !== t2.name || ((_a = t2.strings) == null ? void 0 : _a.length) > 2)
+      throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.");
+  }
+  render(t2) {
+    return Object.keys(t2).reduce((e3, r) => {
+      const s = t2[r];
+      return null == s ? e3 : e3 + `${r = r.includes("-") ? r : r.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g, "-$&").toLowerCase()}:${s};`;
+    }, "");
+  }
+  update(e3, [r]) {
+    const { style: s } = e3.element;
+    if (void 0 === this.ft)
+      return this.ft = new Set(Object.keys(r)), this.render(r);
+    for (const t2 of this.ft)
+      null == r[t2] && (this.ft.delete(t2), t2.includes("-") ? s.removeProperty(t2) : s[t2] = null);
+    for (const t2 in r) {
+      const e4 = r[t2];
+      if (null != e4) {
+        this.ft.add(t2);
+        const r2 = "string" == typeof e4 && e4.endsWith(i2);
+        t2.includes("-") || r2 ? s.setProperty(t2, r2 ? e4.slice(0, -11) : e4, r2 ? n2 : "") : s[t2] = e4;
+      }
+    }
+    return T;
+  }
+});
+
+// src/components/progress-bar/progress-bar.component.ts
+var TerraProgressBar = class extends TerraElement {
+  constructor() {
+    super(...arguments);
+    this.value = 0;
+    this.indeterminate = false;
+    this.label = "";
+    this.variant = "primary";
+    this.title = "";
+  }
+  // make reactive to pass through
+  render() {
+    const isRtl = getComputedStyle(this).direction === "rtl";
+    return x`
+            <div
+                part="base"
+                class=${e2({
+      "progress-bar": true,
+      "progress-bar--indeterminate": this.indeterminate,
+      "progress-bar--rtl": isRtl,
+      "progress-bar--default": this.variant === "default",
+      "progress-bar--primary": this.variant === "primary",
+      "progress-bar--success": this.variant === "success",
+      "progress-bar--warning": this.variant === "warning",
+      "progress-bar--danger": this.variant === "danger"
+    })}
+                role="progressbar"
+                title=${o(this.title || void 0)}
+                aria-label=${this.label || "Progress"}
+                aria-valuemin="0"
+                aria-valuemax="100"
+                aria-valuenow=${o(
+      this.indeterminate ? void 0 : this.value
+    )}
+            >
+                <div
+                    part="indicator"
+                    class="progress-bar__indicator"
+                    style=${o2({
+      width: this.indeterminate ? void 0 : `${this.value}%`
+    })}
+                >
+                    ${!this.indeterminate ? x`
+                              <slot part="label" class="progress-bar__label"></slot>
+                          ` : ""}
+                </div>
+            </div>
+        `;
+  }
+};
+TerraProgressBar.styles = [component_styles_default, progress_bar_styles_default];
+__decorateClass([
+  n({ type: Number, reflect: true })
+], TerraProgressBar.prototype, "value", 2);
+__decorateClass([
+  n({ type: Boolean, reflect: true })
+], TerraProgressBar.prototype, "indeterminate", 2);
+__decorateClass([
+  n()
+], TerraProgressBar.prototype, "label", 2);
+__decorateClass([
+  n({ reflect: true })
+], TerraProgressBar.prototype, "variant", 2);
+__decorateClass([
+  n()
+], TerraProgressBar.prototype, "title", 2);
+
+export {
+  TerraProgressBar
+};
+/*! Bundled license information:
+
+lit-html/directives/style-map.js:
+  (**
+   * @license
+   * Copyright 2018 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   *)
+*/

package/cdn/chunks/chunk.XGW4U4H6.js

@@ -0,0 +1,19 @@
+import {
+  TerraCard
+} from "./chunk.WQRXNFMU.js";
+import {
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.CZA6CSBG.js";
+
+// src/components/card/card.ts
+init_dirname();
+init_buffer();
+init_process();
+var card_default = TerraCard;
+TerraCard.define("terra-card");
+
+export {
+  card_default
+};

package/cdn/chunks/chunk.XHRAL6WO.js

@@ -0,0 +1,19 @@
+import {
+  TerraInput
+} from "./chunk.4UP2HCBT.js";
+import {
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.CZA6CSBG.js";
+
+// src/components/input/input.ts
+init_dirname();
+init_buffer();
+init_process();
+var input_default = TerraInput;
+TerraInput.define("terra-input");
+
+export {
+  input_default
+};

package/cdn/chunks/chunk.XLU2JHSE.js

@@ -0,0 +1,29 @@
+import {
+  TerraDataRods
+} from "./chunk.GOEOLG2N.js";
+import {
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.CZA6CSBG.js";
+
+// src/react/data-rods/index.ts
+init_dirname();
+init_buffer();
+init_process();
+import * as React from "react";
+import { createComponent } from "@lit/react";
+var tagName = "terra-data-rods";
+TerraDataRods.define("terra-data-rods");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: TerraDataRods,
+  react: React,
+  events: {},
+  displayName: "TerraDataRods"
+});
+var data_rods_default = reactWrapper;
+
+export {
+  data_rods_default
+};

package/cdn/chunks/chunk.XVPTDJKQ.js

@@ -0,0 +1,136 @@
+import {
+  loader_styles_default
+} from "./chunk.P3JNZDXP.js";
+import {
+  e
+} from "./chunk.P3OLQVQM.js";
+import {
+  TerraElement,
+  component_styles_default,
+  n,
+  r
+} from "./chunk.7NG6N5I3.js";
+import {
+  E,
+  x
+} from "./chunk.3ZQGAH53.js";
+import {
+  __decorateClass,
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.CZA6CSBG.js";
+
+// src/components/loader/loader.component.ts
+init_dirname();
+init_buffer();
+init_process();
+var TerraLoader = class extends TerraElement {
+  constructor() {
+    super(...arguments);
+    this.variant = "large";
+    this.percent = "0";
+    this.indeterminate = false;
+    this.role = "progressbar";
+    this._currentPercent = 0;
+  }
+  formatPercent(percent) {
+    if (parseInt(percent) > 100) {
+      percent = "100";
+    }
+    return parseInt(percent) > 0 ? percent + "%" : "";
+  }
+  render() {
+    this._currentPercent = parseInt(this.percent);
+    return x`
+            <div
+                class=${e({
+      loader: true,
+      "loader--small": this.variant === "small",
+      "loader--large": this.variant === "large",
+      "loader--orbit": this.variant === "orbit"
+    })}
+                aria-valuenow=${this.formatPercent(this.percent)}
+                .role=${this.role}
+                tabindex="-1"
+            >
+                ${this.variant === "large" || this.variant === "orbit" ? x`
+                          <div
+                              class="percent ${this.variant == "orbit" ? "number-14" : "number-11"}"
+                          >
+                              ${this.formatPercent(this.percent)}
+                          </div>
+                      ` : E}
+                ${this.variant === "orbit" ? x`
+                          <svg viewBox="0 0 160 160">
+                              <circle class="planet" />
+
+                              <!-- total length of orbit ellipse = 298.2393493652344 -->
+                              <path
+                                  id="orbit"
+                                  d="M 53.528 96.775 C 73.584 124.975 100.654 140.601 115.393 130.137 C 132.613 117.912 119.246 79.55 105.434 60.525 C 90.233 39.587 60.506 18.543 44.962 30.114 C 29.456 41.657 38.219 75.25 53.528 96.775 Z"
+                              >
+                                  <animate
+                                      attributeName="stroke-dashoffset"
+                                      begin="-0.25s"
+                                      from="300"
+                                      to="0"
+                                      dur="1.5s"
+                                      repeatCount="indefinite"
+                                  />
+                              </path>
+
+                              <circle class="moon">
+                                  <animateMotion
+                                      begin="0s"
+                                      dur="1.5s"
+                                      repeatCount="indefinite"
+                                  >
+                                      <mpath href="#orbit"></mpath>
+                                  </animateMotion>
+                              </circle>
+
+                              <path
+                                  id="mask"
+                                  class="planet"
+                                  d="M 130.176 80.041 C 130.176 41.552 88.321 17.697 55.544 36.652 C 40.081 45.594 30.865 62.428 30.47 80.094 L 130.176 80.041 Z"
+                                  style="transform-box: fill-box; transform-origin: 49.8347% 100.62%;"
+                                  transform="matrix(-0.350367, -0.936613, 0.936613, -0.350367, -0.148117, -0.20884)"
+                              />
+                          </svg>
+                      ` : E}
+                ${this.variant === "small" || this.variant === "large" ? x`
+                          <svg
+                              viewBox=${this.variant == "small" ? "0 0 30 30" : "0 0 52 52"}
+                              aria-hidden="true"
+                              style="--progress: ${this.percent}"
+                              class="circular-progress ${this.indeterminate ? "indeterminate" : ""}"
+                          >
+                              <circle class="bg"></circle>
+                              <circle class="fg"></circle>
+                          </svg>
+                      ` : E}
+            </div>
+        `;
+  }
+};
+TerraLoader.styles = [component_styles_default, loader_styles_default];
+__decorateClass([
+  n({ reflect: true })
+], TerraLoader.prototype, "variant", 2);
+__decorateClass([
+  n({ type: String })
+], TerraLoader.prototype, "percent", 2);
+__decorateClass([
+  n({ type: Boolean })
+], TerraLoader.prototype, "indeterminate", 2);
+__decorateClass([
+  n({ reflect: true })
+], TerraLoader.prototype, "role", 2);
+__decorateClass([
+  r()
+], TerraLoader.prototype, "_currentPercent", 2);
+
+export {
+  TerraLoader
+};

package/cdn/chunks/chunk.XZUP4GG5.js

@@ -0,0 +1,19 @@
+import {
+  TerraPlot
+} from "./chunk.E2XB6ZUN.js";
+import {
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.CZA6CSBG.js";
+
+// src/components/plot/plot.ts
+init_dirname();
+init_buffer();
+init_process();
+var plot_default = TerraPlot;
+TerraPlot.define("terra-plot");
+
+export {
+  plot_default
+};