@nasa-terra/components 0.0.171 → 0.0.173

package/cdn/chunks/chunk.22JAM2GR.js

@@ -0,0 +1,149 @@
+import {
+  i
+} from "./chunk.5NHXMCXD.js";
+import {
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.CZA6CSBG.js";
+
+// src/components/dialog/dialog.styles.ts
+init_dirname();
+init_buffer();
+init_process();
+var dialog_styles_default = i`
+    :host {
+        --width: fit-content;
+        --min-width: 20rem;
+        --max-width: calc(100% - var(--terra-spacing-2x-large));
+        --max-height: calc(100% - var(--terra-spacing-2x-large));
+        --header-spacing: var(--terra-spacing-large);
+        --body-spacing: var(--terra-spacing-large);
+        --footer-spacing: var(--terra-spacing-large);
+
+        display: contents;
+    }
+
+    .dialog {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        position: fixed;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        z-index: var(--terra-z-index-dialog);
+    }
+
+    .dialog__panel {
+        display: flex;
+        flex-direction: column;
+        z-index: 2;
+        width: var(--width);
+        min-width: var(--min-width);
+        max-width: var(--max-width);
+        max-height: var(--max-height);
+        background-color: var(--terra-panel-background-color);
+        border-radius: var(--terra-border-radius-medium);
+        box-shadow: var(--terra-shadow-x-large);
+    }
+
+    .dialog__panel:focus {
+        outline: none;
+    }
+
+    /* Ensure there's enough vertical padding for phones that don't update vh when chrome appears (e.g. iPhone) */
+    @media screen and (max-width: 420px) {
+        .dialog__panel {
+            max-height: 80vh;
+        }
+    }
+
+    .dialog--open .dialog__panel {
+        display: flex;
+        opacity: 1;
+    }
+
+    .dialog__header {
+        border-color: var(--terra-dialog-header-border-color, #dee2e6);
+        border-style: var(--terra-dialog-header-border-style, solid none);
+        border-width: var(--terra-dialog-header-border-width, 0 0 1px 0);
+        flex: 0 0 auto;
+        display: flex;
+    }
+
+    .dialog__title {
+        flex: 1 1 auto;
+        font: inherit;
+        font-size: var(--terra-font-size-large);
+        line-height: var(--terra-line-height-dense);
+        padding: var(--header-spacing);
+        margin: 0;
+    }
+
+    .dialog__header-actions {
+        flex-shrink: 0;
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: end;
+        gap: var(--terra-spacing-2x-small);
+        padding: 0 var(--header-spacing);
+    }
+
+    .dialog__header-actions terra-button,
+    .dialog__header-actions ::slotted(terra-button) {
+        flex: 0 0 auto;
+        display: flex;
+        align-items: center;
+        font-size: var(--terra-font-size-medium);
+    }
+
+    .dialog__close {
+        --terra-button-text-text-color: black;
+    }
+
+    .dialog__body {
+        flex: 1 1 auto;
+        display: block;
+        padding: var(--body-spacing);
+        overflow: auto;
+        -webkit-overflow-scrolling: touch;
+    }
+
+    .dialog__footer {
+        border-color: var(--terra-dialog-footer-border-color, #dee2e6);
+        border-style: var(--terra-dialog-footer-border-style, solid none);
+        border-width: var(--terra-dialog-footer-border-width, 1px 0 0 0);
+        flex: 0 0 auto;
+        text-align: right;
+        padding: var(--footer-spacing);
+    }
+
+    .dialog__footer ::slotted(terra-button:not(:first-of-type)) {
+        margin-inline-start: var(--terra-spacing-x-small);
+    }
+
+    .dialog:not(.dialog--has-footer) .dialog__footer {
+        display: none;
+    }
+
+    .dialog__overlay {
+        position: fixed;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        background-color: var(--terra-overlay-background-color);
+    }
+
+    @media (forced-colors: active) {
+        .dialog__panel {
+            border: solid 1px var(--terra-color-spacesuit-white);
+        }
+    }
+`;
+
+export {
+  dialog_styles_default
+};

package/cdn/chunks/chunk.24OQ3U5Z.js

@@ -0,0 +1,78 @@
+import {
+  stepper_styles_default
+} from "./chunk.YTA66SS5.js";
+import {
+  e
+} from "./chunk.P3OLQVQM.js";
+import {
+  TerraElement,
+  component_styles_default,
+  e as e2,
+  n
+} from "./chunk.7F5GSKQM.js";
+import {
+  x
+} from "./chunk.3ZQGAH53.js";
+import {
+  __decorateClass,
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.CZA6CSBG.js";
+
+// src/components/stepper/stepper.component.ts
+init_dirname();
+init_buffer();
+init_process();
+var TerraStepper = class extends TerraElement {
+  constructor() {
+    super(...arguments);
+    this.variant = "default";
+  }
+  handleSlotChange() {
+    const slottedElements = [
+      ...this.defaultSlot.assignedElements({ flatten: true })
+    ];
+    slottedElements.forEach((el, index) => {
+      const step = findStep(el);
+      if (step) {
+        step.toggleAttribute("data-terra-stepper__step", true);
+        step.toggleAttribute("data-terra-stepper__step--first", index === 0);
+        step.toggleAttribute(
+          "data-terra-stepper__step--last",
+          index === slottedElements.length - 1
+        );
+      }
+    });
+  }
+  render() {
+    return x`
+            <div
+                part="base"
+                class=${e({
+      stepper: true,
+      "stepper--default": this.variant === "default",
+      "stepper--condensed": this.variant === "condensed"
+    })}
+            >
+                <slot @slotchange=${this.handleSlotChange}></slot>
+            </div>
+        `;
+  }
+};
+TerraStepper.styles = [component_styles_default, stepper_styles_default];
+__decorateClass([
+  e2("slot")
+], TerraStepper.prototype, "defaultSlot", 2);
+__decorateClass([
+  n({ reflect: true })
+], TerraStepper.prototype, "variant", 2);
+function findStep(el) {
+  var _a;
+  const selector = "terra-stepper-step";
+  return (_a = el.closest(selector)) != null ? _a : el.querySelector(selector);
+}
+
+export {
+  TerraStepper
+};

package/cdn/chunks/chunk.2EMPB3LW.js

@@ -0,0 +1,32 @@
+import {
+  TerraDatePicker
+} from "./chunk.CY32PXBP.js";
+import {
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.CZA6CSBG.js";
+
+// src/react/date-picker/index.ts
+init_dirname();
+init_buffer();
+init_process();
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "terra-date-picker";
+TerraDatePicker.define("terra-date-picker");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: TerraDatePicker,
+  react: React,
+  events: {
+    onTerraDateRangeChange: "terra-date-range-change"
+  },
+  displayName: "TerraDatePicker"
+});
+var date_picker_default = reactWrapper;
+
+export {
+  date_picker_default
+};

package/cdn/chunks/chunk.2QGWAQJN.js

@@ -0,0 +1,60 @@
+import {
+  getRandomIntInclusive
+} from "./chunk.WVVQ6RKA.js";
+import {
+  skeleton_styles_default
+} from "./chunk.4UL4WO5H.js";
+import {
+  TerraElement,
+  component_styles_default,
+  n
+} from "./chunk.7F5GSKQM.js";
+import {
+  x
+} from "./chunk.3ZQGAH53.js";
+import {
+  __decorateClass,
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.CZA6CSBG.js";
+
+// src/components/skeleton/skeleton.component.ts
+init_dirname();
+init_buffer();
+init_process();
+var TerraSkeleton = class extends TerraElement {
+  constructor() {
+    super(...arguments);
+    this.rows = 1;
+    this.effect = "pulse";
+    this.variableWidths = true;
+  }
+  render() {
+    return x`
+            ${new Array(parseInt(this.rows.toString())).fill(0).map(
+      () => x` <div
+                        part="base"
+                        class=${`skeleton ${this.effect === "pulse" ? "skeleton--pulse" : ""} ${this.effect === "sheen" ? "skeleton--sheen" : ""}`}
+                        style=${this.variableWidths ? `width: ${getRandomIntInclusive(60, 100)}%` : ""}
+                    >
+                        <div part="indicator" class="skeleton__indicator"></div>
+                    </div>`
+    )}
+        `;
+  }
+};
+TerraSkeleton.styles = [component_styles_default, skeleton_styles_default];
+__decorateClass([
+  n()
+], TerraSkeleton.prototype, "rows", 2);
+__decorateClass([
+  n()
+], TerraSkeleton.prototype, "effect", 2);
+__decorateClass([
+  n({ type: Boolean, reflect: true })
+], TerraSkeleton.prototype, "variableWidths", 2);
+
+export {
+  TerraSkeleton
+};

package/cdn/chunks/chunk.2WSE4WVS.js

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