@nasa-terra/components 0.0.137 → 0.0.139

package/dist/chunks/chunk.M25BNXYX.js

@@ -1,446 +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;
-  }
-  __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.137";
-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.M7XZ2USH.js

@@ -1,24 +0,0 @@
-import {
-  TerraPagination
-} from "./chunk.IIP7XENC.js";
-
-// src/react/pagination/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-import "@lit/react";
-var tagName = "terra-pagination";
-TerraPagination.define("terra-pagination");
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: TerraPagination,
-  react: React,
-  events: {
-    onTerraPageChange: "terra-page-change"
-  },
-  displayName: "TerraPagination"
-});
-var pagination_default = reactWrapper;
-
-export {
-  pagination_default
-};

package/dist/chunks/chunk.MKBGUN2U.js

@@ -1,28 +0,0 @@
-import {
-  TerraToggle
-} from "./chunk.IVICUROI.js";
-
-// src/react/toggle/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-import "@lit/react";
-var tagName = "terra-toggle";
-TerraToggle.define("terra-toggle");
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: TerraToggle,
-  react: React,
-  events: {
-    onTerraBlur: "terra-blur",
-    onTerraChange: "terra-change",
-    onTerraInput: "terra-input",
-    onTerraFocus: "terra-focus",
-    onTerraInvalid: "terra-invalid"
-  },
-  displayName: "TerraToggle"
-});
-var toggle_default = reactWrapper;
-
-export {
-  toggle_default
-};

package/dist/chunks/chunk.MPCO3AK6.js

@@ -1,180 +0,0 @@
-import {
-  scroll_hint_styles_default
-} from "./chunk.SBGZPKIA.js";
-import {
-  TerraIcon
-} from "./chunk.7ULUL7UB.js";
-import {
-  watch
-} from "./chunk.NWXJOH5T.js";
-import {
-  TerraElement,
-  component_styles_default
-} from "./chunk.M25BNXYX.js";
-import {
-  __decorateClass
-} from "./chunk.SHKVBVTI.js";
-
-// src/components/scroll-hint/scroll-hint.component.ts
-import { html } from "lit";
-import { property, state } from "lit/decorators.js";
-var TerraScrollHint = class extends TerraElement {
-  constructor() {
-    super(...arguments);
-    this.inline = false;
-    this.dark = false;
-    this.inactivityDelay = 3e3;
-    this.visible = false;
-    this.handleScroll = () => {
-      if (this.inline) {
-        return;
-      }
-      const isAtBottom = this.isAtBottomOfPage();
-      if (isAtBottom) {
-        if (this.visible) {
-          this.hide();
-        }
-        this.clearTimers();
-      } else {
-        if (this.visible) {
-          this.hide();
-          this.startInactivityTimer();
-        }
-      }
-    };
-    this.handleDocumentClick = (e) => {
-      if (this.contains(e.target)) {
-        return;
-      }
-      if (!this.inline && this.visible) {
-        this.hide();
-        this.startInactivityTimer();
-      }
-    };
-    this.handleClick = () => {
-      this.emit("terra-scroll");
-      if (!this.inline) {
-        this.hide();
-        setTimeout(() => {
-          this.startInactivityTimer();
-        }, 100);
-      }
-      this.scrollDown();
-    };
-  }
-  handleInlineChange() {
-    if (this.inline) {
-      this.visible = true;
-      this.clearTimers();
-    } else {
-      this.visible = false;
-      this.clearTimers();
-      this.startInactivityTimer();
-    }
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    this.setupEventListeners();
-    if (this.inline) {
-      this.visible = true;
-    } else {
-      this.startInactivityTimer();
-    }
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback();
-    this.cleanupEventListeners();
-    this.clearTimers();
-  }
-  setupEventListeners() {
-    window.addEventListener("scroll", this.handleScroll, { passive: true });
-    document.addEventListener("click", this.handleDocumentClick);
-  }
-  cleanupEventListeners() {
-    window.removeEventListener("scroll", this.handleScroll);
-    document.removeEventListener("click", this.handleDocumentClick);
-  }
-  isAtBottomOfPage() {
-    const windowHeight = window.innerHeight;
-    const documentHeight = document.documentElement.scrollHeight;
-    const scrollTop = window.scrollY || document.documentElement.scrollTop;
-    const threshold = 100;
-    return scrollTop + windowHeight >= documentHeight - threshold;
-  }
-  scrollDown() {
-    const viewportHeight = window.innerHeight;
-    window.scrollBy({
-      top: viewportHeight,
-      behavior: "smooth"
-    });
-  }
-  hide() {
-    this.visible = false;
-    this.clearTimers();
-  }
-  startInactivityTimer() {
-    if (this.inline) {
-      return;
-    }
-    if (this.isAtBottomOfPage()) {
-      return;
-    }
-    this.inactivityTimeout = window.setTimeout(() => {
-      if (!this.isAtBottomOfPage()) {
-        this.visible = true;
-      }
-    }, this.inactivityDelay);
-  }
-  clearTimers() {
-    clearTimeout(this.scrollTimeout);
-    clearTimeout(this.clickTimeout);
-    clearTimeout(this.inactivityTimeout);
-  }
-  render() {
-    if (!this.visible) {
-      return html``;
-    }
-    return html`
-            <button
-                part="button"
-                class="scroll-hint"
-                @click="${this.handleClick}"
-                aria-label="Scroll to continue"
-            >
-                <div part="icon-container" class="scroll-hint__icon-container">
-                    <div part="ring" class="scroll-hint__ring"></div>
-                    <div part="icon" class="scroll-hint__icon">
-                        <terra-icon
-                            name="chevron-down"
-                            library="default"
-                        ></terra-icon>
-                    </div>
-                </div>
-                <span part="text" class="scroll-hint__text">SCROLL TO CONTINUE</span>
-            </button>
-        `;
-  }
-};
-TerraScrollHint.styles = [component_styles_default, scroll_hint_styles_default];
-TerraScrollHint.dependencies = {
-  "terra-icon": TerraIcon
-};
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], TerraScrollHint.prototype, "inline", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], TerraScrollHint.prototype, "dark", 2);
-__decorateClass([
-  property({ type: Number })
-], TerraScrollHint.prototype, "inactivityDelay", 2);
-__decorateClass([
-  state()
-], TerraScrollHint.prototype, "visible", 2);
-__decorateClass([
-  watch("inline")
-], TerraScrollHint.prototype, "handleInlineChange", 1);
-
-export {
-  TerraScrollHint
-};

package/dist/chunks/chunk.N2DBICDG.js

@@ -1,31 +0,0 @@
-import {
-  TerraDataGrid
-} from "./chunk.DLTYQJNF.js";
-
-// src/react/data-grid/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-import "@lit/react";
-var tagName = "terra-data-grid";
-TerraDataGrid.define("terra-data-grid");
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: TerraDataGrid,
-  react: React,
-  events: {
-    onTerraGridReady: "terra-grid-ready",
-    onTerraSelectionChanged: "terra-selection-changed",
-    onTerraSortChanged: "terra-sort-changed",
-    onTerraFilterChanged: "terra-filter-changed",
-    onTerraRowClicked: "terra-row-clicked",
-    onTerraRowDoubleClicked: "terra-row-double-clicked",
-    onTerraCellClicked: "terra-cell-clicked",
-    onTerraCellValueChanged: "terra-cell-value-changed"
-  },
-  displayName: "TerraDataGrid"
-});
-var data_grid_default = reactWrapper;
-
-export {
-  data_grid_default
-};