@nasa-terra/components 0.0.165 → 0.0.167

package/dist/chunks/chunk.BMP66UJR.js

@@ -1,451 +0,0 @@
-import {
-  __decorateClass,
-  __privateAdd,
-  __privateGet,
-  __privateMethod,
-  __privateSet,
-  __spreadValues
-} from "./chunk.SHKVBVTI.js";
-
-// src/styles/component.styles.ts
-import { css } from "lit";
-var component_styles_default = css`
-    :host {
-        box-sizing: border-box;
-        display: none;
-    }
-
-    :host *,
-    :host *::before,
-    :host *::after {
-        box-sizing: inherit;
-    }
-
-    :host {
-        background-color: var(--background-color);
-        color: var(--color);
-    }
-
-    [hidden] {
-        display: none !important;
-    }
-
-    /* Horizon Design System Font Classes */
-
-    /* Display Fonts */
-
-    .display-120 {
-        font-family: var(--terra-font-family--inter);
-        font-size: 7.5rem; /* 120px */
-        font-weight: var(--terra-font-weight-bold);
-    }
-
-    .display-100 {
-        font-family: var(--terra-font-family--inter);
-        font-size: 6.25rem; /* 100px */
-        font-weight: var(--terra-font-weight-bold);
-    }
-
-    .display-80 {
-        font-family: var(--terra-font-family--inter);
-        font-size: 5rem; /* 80px */
-        font-weight: var(--terra-font-weight-bold);
-    }
-
-    .display-72 {
-        font-family: var(--terra-font-family--inter);
-        font-size: 4.5rem; /* 72px */
-        font-weight: var(--terra-font-weight-bold);
-    }
-
-    .display-60 {
-        font-family: var(--terra-font-family--inter);
-        font-size: 3.75rem; /* 60px */
-        font-weight: var(--terra-font-weight-bold);
-    }
-
-    .display-48 {
-        font-family: var(--terra-font-family--inter);
-        font-size: 3rem; /* 48px */
-        font-weight: var(--terra-font-weight-bold);
-    }
-
-    .display-41 {
-        font-family: var(--terra-font-family--inter);
-        font-size: 2.563rem; /* 41px */
-        font-weight: var(--terra-font-weight-bold);
-    }
-
-    /* Heading Fonts */
-
-    .heading-36-bold {
-        font-family: var(--terra-font-family--inter);
-        font-size: 2.25rem; /* 36px */
-        font-weight: var(--terra-font-weight-bold);
-    }
-
-    .heading-36-light {
-        font-family: var(--terra-font-family--inter);
-        font-size: 2.25rem; /* 36px */
-        font-weight: var(--terra-font-weight-light);
-    }
-
-    .heading-29-bold {
-        font-family: var(--terra-font-family--inter);
-        font-size: 1.813rem; /* 29px */
-        font-weight: var(--terra-font-weight-bold);
-    }
-
-    .heading-29-light {
-        font-family: var(--terra-font-family--inter);
-        font-size: 1.813rem; /* 29px */
-        font-weight: var(--terra-font-weight-light);
-    }
-
-    .heading-22-bold {
-        font-family: var(--terra-font-family--inter);
-        font-size: 1.375rem; /* 22px */
-        font-weight: var(--terra-font-weight-bold);
-    }
-
-    .heading-22-light {
-        font-family: var(--terra-font-family--inter);
-        font-size: 1.375rem; /*22px */
-        font-weight: var(--terra-font-weight-light);
-    }
-
-    .heading-18-bold {
-        font-family: var(--terra-font-family--inter);
-        font-size: 1.125rem; /* 18px */
-        font-weight: var(--terra-font-weight-bold);
-    }
-
-    .heading-18-light {
-        font-family: var(--terra-font-family--inter);
-        font-size: 1.125rem; /* 18px */
-        font-weight: var(--terra-font-weight-light);
-    }
-
-    .heading-16-bold {
-        font-family: var(--terra-font-family--inter);
-        font-size: 1rem; /* 16px */
-        font-weight: var(--terra-font-weight-bold);
-    }
-
-    .heading-16-light {
-        font-family: var(--terra-font-family--inter);
-        font-size: 1rem; /* 16px */
-        font-weight: var(--terra-font-weight-light);
-    }
-
-    .heading-14-bold {
-        font-family: var(--terra-font-family--inter);
-        font-size: 0.875rem; /* 14px */
-        font-weight: var(--terra-font-weight-bold);
-    }
-
-    .heading-14-light {
-        font-family: var(--terra-font-family--inter);
-        font-size: 0.875rem; /* 14px */
-        font-weight: var(--terra-font-weight-light);
-    }
-
-    .heading-12-bold {
-        font-family: var(--terra-font-family--inter);
-        font-size: 0.75rem; /* 12px */
-        font-weight: var(--terra-font-weight-bold);
-    }
-
-    .heading-12-light {
-        font-family: var(--terra-font-family--inter);
-        font-size: 0.75rem; /* 12px */
-        font-weight: var(--terra-font-weight-light);
-    }
-
-    .heading-11-semi-bold {
-        font-family: var(--terra-font-family--inter);
-        font-size: 0.688rem; /* 11px */
-        font-weight: var(--terra-font-weight-semi-bold);
-    }
-
-    /* Body Fonts */
-
-    .body-18 {
-        font-family: var(--terra-font-family--public-sans);
-        font-size: 1.125rem; /* 18px */
-        font-weight: var(--terra-font-weight-normal);
-    }
-
-    .body-16 {
-        font-family: var(--terra-font-family--public-sans);
-        font-size: 1rem; /* 16px */
-        font-weight: var(--terra-font-weight-normal);
-    }
-
-    .body-14 {
-        font-family: var(--terra-font-family--public-sans);
-        font-size: 0.875rem; /* 14px */
-        font-weight: var(--terra-font-weight-normal);
-    }
-
-    .body-12 {
-        font-family: var(--terra-font-family--public-sans);
-        font-size: 0.75rem; /* 12px */
-        font-weight: var(--terra-font-weight-normal);
-    }
-
-    .body-11 {
-        font-family: var(--terra-font-family--public-sans);
-        font-size: 0.688rem; /* 11px */
-        font-weight: var(--terra-font-weight-normal);
-    }
-
-    /* Number & Label Fonts */
-
-    .number-240 {
-        font-family: var(--terra-font-family--dm-mono);
-        font-size: 15rem; /* 240px */
-        font-weight: var(--terra-font-weight-light);
-    }
-
-    .number-120 {
-        font-family: var(--terra-font-family--dm-mono);
-        font-size: 7.5rem; /* 120px */
-        font-weight: var(--terra-font-weight-light);
-    }
-
-    .number-48 {
-        font-family: var(--terra-font-family--dm-mono);
-        font-size: 3rem; /* 48px */
-        font-weight: var(--terra-font-weight-light);
-    }
-
-    .number-36 {
-        font-family: var(--terra-font-family--dm-mono);
-        font-size: 2.25rem; /* 36px */
-        font-weight: var(--terra-font-weight-light);
-    }
-
-    .number-14 {
-        font-family: var(--terra-font-family--dm-mono);
-        font-size: 0.875rem; /* 14px */
-        font-weight: 500;
-    }
-
-    .number-11 {
-        font-family: var(--terra-font-family--dm-mono);
-        font-size: 0.688rem; /* 11px */
-        font-weight: 500;
-    }
-
-    .label-14 {
-        font-family: var(--terra-font-family--dm-mono);
-        font-size: 0.875rem; /* 14px */
-        font-weight: var(--terra-font-weight-light);
-        text-transform: uppercase;
-    }
-
-    .label-12 {
-        font-family: var(--terra-font-family--dm-mono);
-        font-size: 0.75rem; /* 12px */
-        font-weight: var(--terra-font-weight-light);
-        text-transform: uppercase;
-    }
-
-    .label-11 {
-        font-family: var(--terra-font-family--dm-mono);
-        font-size: 0.688rem; /* 11px */
-        font-weight: var(--terra-font-weight-light);
-        text-transform: uppercase;
-    }
-
-    /* Forms */
-
-    /* Input Field */
-
-    select,
-    .input {
-        font-family: var(--terra-input-font-family);
-        font-size: var(--terra-input-font-size);
-        color: var(--terra-input-color);
-        font-weight: var(--terra-input-font-weight);
-        line-height: var(--terra-input-line-height);
-        background-color: var(--terra-input-background-color);
-        border: var(--terra-input-border-width) solid var(--terra-input-border-color);
-        border-radius: var(--terra-input-border-radius);
-    }
-
-    label,
-    .input-label {
-        font-family: var(--terra-input-label-font-family);
-        font-size: var(--terra-input-label-font-size);
-        color: var(--terra-input-label-color);
-        font-weight: var(--terra-font-weight-semibold);
-        line-height: var(--terra-input-label-line-height);
-    }
-
-    /* Elements */
-
-    a {
-        text-decoration: underline;
-        text-decoration-color: #585858;
-        text-decoration-style: dashed;
-        text-decoration-thickness: 0.05em;
-        text-underline-offset: 0.25rem;
-        color: var(--terra-color-carbon-60);
-    }
-
-    /* UTILITY CSS */
-    .sr-only {
-        block-size: 1px;
-        border-width: 0;
-        clip: rect(0, 0, 0, 0);
-        margin: -1px;
-        overflow: hidden;
-        padding: 0;
-        position: absolute;
-        white-space: nowrap;
-        width: 1px;
-    }
-`;
-
-// src/internal/terra-element.ts
-import { LitElement } from "lit";
-import { property, state } from "lit/decorators.js";
-var _io, _observeVisibility, observeVisibility_fn, _isComponentVisible, isComponentVisible_fn;
-var TerraElement = class extends LitElement {
-  constructor() {
-    super();
-    __privateAdd(this, _observeVisibility);
-    /**
-     * Check if the component is visible on the page
-     * @returns true if the component is visible, false otherwise
-     */
-    __privateAdd(this, _isComponentVisible);
-    this.environment = "prod" /* PROD */;
-    this.isVisible = false;
-    __privateAdd(this, _io, void 0);
-    Object.entries(
-      this.constructor.dependencies
-    ).forEach(([name, component]) => {
-      ;
-      this.constructor.define(name, component);
-    });
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    __privateMethod(this, _observeVisibility, observeVisibility_fn).call(this);
-  }
-  disconnectedCallback() {
-    var _a;
-    super.disconnectedCallback();
-    (_a = __privateGet(this, _io)) == null ? void 0 : _a.disconnect();
-    __privateSet(this, _io, void 0);
-  }
-  /**
-   * Called when the component is visible on the page
-   * Example: if the component is in a dialog, this will be triggered the first time the dialog opens
-   */
-  firstVisible() {
-  }
-  emit(name, options) {
-    const event = new CustomEvent(name, __spreadValues({
-      bubbles: true,
-      cancelable: false,
-      composed: true,
-      detail: {}
-    }, options));
-    this.dispatchEvent(event);
-    return event;
-  }
-  /* eslint-enable */
-  static define(name, elementConstructor = this, options = {}) {
-    const currentlyRegisteredConstructor = customElements.get(name);
-    if (!currentlyRegisteredConstructor) {
-      customElements.define(
-        name,
-        class extends elementConstructor {
-        },
-        options
-      );
-      return;
-    }
-    let newVersion = " (unknown version)";
-    let existingVersion = newVersion;
-    if ("version" in elementConstructor && elementConstructor.version) {
-      newVersion = " v" + elementConstructor.version;
-    }
-    if ("version" in currentlyRegisteredConstructor && currentlyRegisteredConstructor.version) {
-      existingVersion = " v" + currentlyRegisteredConstructor.version;
-    }
-    if (newVersion && existingVersion && newVersion === existingVersion) {
-      return;
-    }
-    console.warn(
-      `Attempted to register <${name}>${newVersion}, but <${name}>${existingVersion} has already been registered.`
-    );
-  }
-};
-_io = new WeakMap();
-_observeVisibility = new WeakSet();
-observeVisibility_fn = function() {
-  if (__privateGet(this, _io)) {
-    return;
-  }
-  this.isVisible = __privateMethod(this, _isComponentVisible, isComponentVisible_fn).call(this);
-  if (this.isVisible) {
-    this.firstVisible();
-    return;
-  }
-  if (!("IntersectionObserver" in window)) {
-    this.isVisible = true;
-    this.firstVisible();
-    return;
-  }
-  __privateSet(this, _io, new IntersectionObserver(
-    (entries) => {
-      var _a;
-      if (entries.some((e) => e.isIntersecting)) {
-        (_a = __privateGet(this, _io)) == null ? void 0 : _a.disconnect();
-        __privateSet(this, _io, void 0);
-        this.isVisible = true;
-        setTimeout(() => this.firstVisible(), 500);
-      }
-    },
-    { root: null, threshold: 0 }
-  ));
-  __privateGet(this, _io).observe(this);
-};
-_isComponentVisible = new WeakSet();
-isComponentVisible_fn = function() {
-  if (!this.isConnected) {
-    return false;
-  }
-  const rect = this.getBoundingClientRect();
-  const style = getComputedStyle(this);
-  return rect.width > 0 && rect.height > 0 && style.display !== "none" && style.visibility !== "hidden";
-};
-/* eslint-disable */
-// @ts-expect-error This is auto-injected at build time.
-TerraElement.version = "0.0.165";
-TerraElement.dependencies = {};
-__decorateClass([
-  property()
-], TerraElement.prototype, "dir", 2);
-__decorateClass([
-  property()
-], TerraElement.prototype, "lang", 2);
-__decorateClass([
-  property()
-], TerraElement.prototype, "environment", 2);
-__decorateClass([
-  property()
-], TerraElement.prototype, "bearerToken", 2);
-__decorateClass([
-  state()
-], TerraElement.prototype, "isVisible", 2);
-
-export {
-  component_styles_default,
-  TerraElement
-};

package/dist/chunks/chunk.BN7IWGKR.js

@@ -1,24 +0,0 @@
-import {
-  TerraScrollHint
-} from "./chunk.DITKLYBN.js";
-
-// src/react/scroll-hint/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-import "@lit/react";
-var tagName = "terra-scroll-hint";
-TerraScrollHint.define("terra-scroll-hint");
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: TerraScrollHint,
-  react: React,
-  events: {
-    onTerraScroll: "terra-scroll"
-  },
-  displayName: "TerraScrollHint"
-});
-var scroll_hint_default = reactWrapper;
-
-export {
-  scroll_hint_default
-};

package/dist/chunks/chunk.BPYGZWI3.js

@@ -1,180 +0,0 @@
-import {
-  toast_styles_default
-} from "./chunk.YXBUPVH7.js";
-import {
-  TerraAlert
-} from "./chunk.QT2W6HFD.js";
-import {
-  TerraElement,
-  component_styles_default
-} from "./chunk.BMP66UJR.js";
-import {
-  __decorateClass
-} from "./chunk.SHKVBVTI.js";
-
-// src/components/toast/toast.component.ts
-import { html } from "lit";
-import { property } from "lit/decorators.js";
-var TerraToast = class extends TerraElement {
-  constructor() {
-    super(...arguments);
-    this.variant = "primary";
-    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 'primary'.
-   * @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 = "primary", icon, duration = 3e3) {
-    const escapeHtml = (html2) => {
-      const div = document.createElement("div");
-      div.textContent = html2;
-      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 html`
-            <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([
-  property({ reflect: true })
-], TerraToast.prototype, "variant", 2);
-__decorateClass([
-  property({ type: Number })
-], TerraToast.prototype, "duration", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], TerraToast.prototype, "closable", 2);
-__decorateClass([
-  property({ type: String, reflect: true })
-], TerraToast.prototype, "countdown", 2);
-
-export {
-  TerraToast
-};

package/dist/chunks/chunk.BRSRN5QN.js

@@ -1,24 +0,0 @@
-import {
-  TerraAccordion
-} from "./chunk.X2LVPENQ.js";
-
-// src/react/accordion/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-import "@lit/react";
-var tagName = "terra-accordion";
-TerraAccordion.define("terra-accordion");
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: TerraAccordion,
-  react: React,
-  events: {
-    onTerraAccordionToggle: "terra-accordion-toggle"
-  },
-  displayName: "TerraAccordion"
-});
-var accordion_default = reactWrapper;
-
-export {
-  accordion_default
-};

package/dist/chunks/chunk.CE47STSQ.js

@@ -1,11 +0,0 @@
-import {
-  TerraAvatar
-} from "./chunk.T5D6H2LT.js";
-
-// src/components/avatar/avatar.ts
-var avatar_default = TerraAvatar;
-TerraAvatar.define("terra-avatar");
-
-export {
-  avatar_default
-};