@nasa-terra/components 0.0.15 → 0.0.16-a2

package/README.md

@@ -54,14 +54,14 @@ Then run the following:
 ### Publishing to NPM and PyPI
 
 The Lit components are available on NPM at: https://www.npmjs.com/package/@nasa-terra/components
-The Python widgets are available on PyPI:
+The Python widgets are available on PyPI: https://pypi.org/project/terra_ui_components/
 
 To build a new version and publish it, you can use NPM commands. The Python equivalents will be run automatically for you (see the "scripts" in package.json for details). You will need access to both repositories in order to publish.
 
 ```bash
 # commit all your changes first
 npm version patch # bump the version, you can use "major", "minor", "patch", etc.
-npm publish --scope=public
+npm publish --access=public
 ```
 
 ## License

package/cdn/chunks/{chunk.5CCX4IZB.js → chunk.2W5ZPHDI.js}

@@ -1,45 +1,45 @@
 import {
   FetchController
-} from "./chunk.GCXPHNE2.js";
+} from "./chunk.KRV3QC6E.js";
+import {
+  variable_combobox_styles_default
+} from "./chunk.SWEK2UAG.js";
 import {
   clearSelection,
   groupDocsByCollection,
   removeEmptyCollections,
   renderSearchResult,
   walkToOption
-} from "./chunk.7JHEI2UU.js";
+} from "./chunk.MJY6U2Q2.js";
 import {
-  variable_combobox_styles_default
-} from "./chunk.SWEK2UAG.js";
+  h
+} from "./chunk.QB5SASDL.js";
 import {
   icon_default
-} from "./chunk.6OVO6QRG.js";
+} from "./chunk.GDNDO47R.js";
 import {
   button_default
-} from "./chunk.2CGVGYJY.js";
-import {
-  h
-} from "./chunk.QB5SASDL.js";
+} from "./chunk.XF6W7JNP.js";
 import {
   Fuse
-} from "./chunk.NTNL4P6D.js";
-import {
-  n as n2
-} from "./chunk.2XCNCXGV.js";
+} from "./chunk.U7L2FN7F.js";
 import {
   o
 } from "./chunk.QEA4QW6G.js";
+import {
+  n as n2
+} from "./chunk.2XCNCXGV.js";
 import {
   watch
-} from "./chunk.IUDWCWFV.js";
+} from "./chunk.CBV7M6CJ.js";
 import {
   TerraElement,
   component_styles_default
-} from "./chunk.ESBZCVC3.js";
+} from "./chunk.UNIX57HO.js";
 import {
   n,
   r
-} from "./chunk.K4EJQG4O.js";
+} from "./chunk.QCK7PTWV.js";
 import {
   T,
   s,
@@ -52,7 +52,7 @@ import {
   __privateSet,
   __spreadProps,
   __spreadValues
-} from "./chunk.6QUGTGJO.js";
+} from "./chunk.MR27IH5Z.js";
 
 // src/components/variable-combobox/variable-combobox.component.ts
 var _combobox, _fetchController, _searchableList, _listbox, _searchEngine, _walker, _dispatchChange, _handleButtonClick, _handleComboboxChange, _handleOptionClick, _handleKeydown, _manageListboxVisibility, _selectOption;
@@ -60,7 +60,7 @@ var _TerraVariableCombobox = class _TerraVariableCombobox extends TerraElement {
   constructor() {
     super(...arguments);
     __privateAdd(this, _combobox, null);
-    __privateAdd(this, _fetchController, new FetchController(this));
+    __privateAdd(this, _fetchController, void 0);
     __privateAdd(this, _searchableList, []);
     __privateAdd(this, _listbox, null);
     __privateAdd(this, _searchEngine, null);
@@ -194,6 +194,7 @@ var _TerraVariableCombobox = class _TerraVariableCombobox extends TerraElement {
   }
   connectedCallback() {
     super.connectedCallback();
+    __privateSet(this, _fetchController, new FetchController(this, this.bearerToken));
     globalThis.addEventListener("click", __privateGet(this, _manageListboxVisibility));
   }
   disconnectedCallback() {
@@ -398,6 +399,9 @@ __decorateClass([
 __decorateClass([
   n()
 ], _TerraVariableCombobox.prototype, "value", 2);
+__decorateClass([
+  n({ attribute: "bearer-token", reflect: false })
+], _TerraVariableCombobox.prototype, "bearerToken", 2);
 __decorateClass([
   r()
 ], _TerraVariableCombobox.prototype, "isExpanded", 2);

package/cdn/chunks/{chunk.UDWR66V2.js → chunk.3QMDTBVG.js}

@@ -1,6 +1,6 @@
 import {
   TerraGiovanniSearch
-} from "./chunk.QVIMX2BO.js";
+} from "./chunk.MXSMSH6D.js";
 
 // src/components/giovanni-search/giovanni-search.ts
 var giovanni_search_default = TerraGiovanniSearch;

package/cdn/chunks/{chunk.KMTO4VEC.js → chunk.4BM5VFHP.js}

@@ -2,7 +2,7 @@ import {
   __commonJS,
   __spreadValues,
   __toESM
-} from "./chunk.6QUGTGJO.js";
+} from "./chunk.MR27IH5Z.js";
 
 // node_modules/leaflet/dist/leaflet-src.js
 var require_leaflet_src = __commonJS({
@@ -10623,10 +10623,12 @@ var Leaflet = class {
     return transformedShapes;
   }
   async fetchSelectedShape(query) {
-    const url = new URL("http://localhost:9000/getGeoJSON");
+    const url = new URL(
+      "https://windmill-load-balancer-641499207.us-east-1.elb.amazonaws.com/api/r/giovanni/geojson"
+    );
     const [key, value] = query.split("=");
     if (key && value) {
-      url.searchParams.append(key, encodeURIComponent(value));
+      url.searchParams.append(key, value);
     }
     const data = await fetch(url.toString(), {
       method: "GET",

package/{dist/chunks/chunk.YJCD6IHO.js → cdn/chunks/chunk.4UQ7VKU4.js}

@@ -1,6 +1,6 @@
 import {
   TerraGiovanniSearch
-} from "./chunk.NP4FHHB6.js";
+} from "./chunk.MXSMSH6D.js";
 
 // src/react/giovanni-search/index.ts
 import * as React from "react";

package/cdn/chunks/{chunk.ZYBTSZ7U.js → chunk.4ZM7V5AR.js}

@@ -1,6 +1,6 @@
 import {
   TerraBrowseVariables
-} from "./chunk.LGPUBVZX.js";
+} from "./chunk.THHV2MXF.js";
 
 // src/components/browse-variables/browse-variables.ts
 var browse_variables_default = TerraBrowseVariables;

package/cdn/chunks/{chunk.BT4IJCQK.js → chunk.5LUW7D6O.js}

@@ -1,7 +1,7 @@
 import {
   __spreadProps,
   __spreadValues
-} from "./chunk.6QUGTGJO.js";
+} from "./chunk.MR27IH5Z.js";
 
 // src/internal/form.ts
 var formCollections = /* @__PURE__ */ new WeakMap();

package/cdn/chunks/chunk.5NEBDVWJ.js

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

package/cdn/chunks/chunk.5NFJHWRY.js

@@ -0,0 +1,11 @@
+import {
+  TerraSkeleton
+} from "./chunk.NDSG7XSH.js";
+
+// src/components/skeleton/skeleton.ts
+var skeleton_default = TerraSkeleton;
+TerraSkeleton.define("terra-skeleton");
+
+export {
+  skeleton_default
+};

package/cdn/chunks/chunk.5P7TDN4M.js

@@ -0,0 +1,107 @@
+import {
+  i
+} from "./chunk.PH7RLQK2.js";
+
+// src/components/login/login.styles.ts
+var login_styles_default = i`
+    :host {
+        --block-size: 20rem;
+        --inline-size: 14rem;
+
+        block-size: var(--block-size);
+        box-sizing: border-box;
+        inline-size: var(--inline-size);
+        color: #1b1b1b; /* HDS uses this color for body text but does not have a defined color in the HDS palette */
+        contain: layout size style;
+        contain-intrinsic-size: auto var(--block-size) auto var(--block-size);
+        display: block;
+        font-family: var(--terra-font-family--public-sans);
+    }
+
+    .help-text {
+        color: var(--terra-color-carbon-60);
+        font-size: var(--terra-font-size-small);
+        line-height: var(--terra-line-height-normal);
+        margin-block: 0;
+    }
+
+    label,
+    input {
+        display: block;
+    }
+
+    input {
+        padding-inline: 0.5em;
+    }
+
+    terra-button[data-task-status='2']::part(base),
+    terra-button[data-task-status='3']::part(base) {
+        padding-inline: 0;
+
+        transition-delay: 4s;
+        transition-property: padding-inline;
+    }
+
+    terra-button[data-task-status='2']::part(label),
+    terra-button[data-task-status='3']::part(label) {
+        padding-inline: var(--terra-spacing-medium);
+    }
+
+    .login-task {
+        animation-delay: 4s;
+        animation-duration: 0.3s;
+        animation-fill-mode: forwards;
+        animation-name: fade-out;
+        animation-timing-function: ease-in;
+
+        transition-behavior: allow-discrete;
+    }
+
+    .login-task--pending {
+        font-size: 1em;
+    }
+
+    .login-task--complete {
+        color: var(--terra-color-active-green-tint);
+        font-size: 1.8em;
+    }
+
+    .login-task--error {
+        color: var(--terra-color-international-orange-tint);
+        font-size: 1.8em;
+    }
+
+    .form-feedback {
+        color: var(--terra-color-nasa-red-shade);
+        display: block;
+        font-size: 0.875em;
+    }
+
+    @keyframes fade-out {
+        0% {
+            opacity: 1;
+            scale: 1;
+        }
+
+        50% {
+            opacity: 0;
+            scale: 1;
+        }
+
+        95% {
+            opacity: 0;
+            scale: 1;
+        }
+
+        100% {
+            display: none;
+            opacity: 0;
+            scale: 0;
+            font-size: 0;
+        }
+    }
+`;
+
+export {
+  login_styles_default
+};

package/cdn/chunks/{chunk.VXECBVAR.js → chunk.5UWGY3SI.js}

@@ -1,6 +1,6 @@
 import {
   TerraVariableCombobox
-} from "./chunk.5CCX4IZB.js";
+} from "./chunk.2W5ZPHDI.js";
 
 // src/components/variable-combobox/variable-combobox.ts
 var variable_combobox_default = TerraVariableCombobox;

package/cdn/chunks/{chunk.ZF2DPGIP.js → chunk.5ZOXIBZ3.js}

@@ -7,18 +7,18 @@ import {
 import {
   TerraElement,
   component_styles_default
-} from "./chunk.ESBZCVC3.js";
+} from "./chunk.UNIX57HO.js";
 import {
   n,
   r
-} from "./chunk.K4EJQG4O.js";
+} from "./chunk.QCK7PTWV.js";
 import {
   T,
   x
 } from "./chunk.PQFHJHNO.js";
 import {
   __decorateClass
-} from "./chunk.6QUGTGJO.js";
+} from "./chunk.MR27IH5Z.js";
 
 // src/components/loader/loader.component.ts
 var TerraLoader = class extends TerraElement {

package/{dist/chunks/chunk.BZDLO6X5.js → cdn/chunks/chunk.6254VAZW.js}

@@ -1,6 +1,6 @@
 import {
   TerraDateRangeSlider
-} from "./chunk.BIO4JLT3.js";
+} from "./chunk.LP3UPZDO.js";
 
 // src/react/date-range-slider/index.ts
 import * as React from "react";

package/{dist/chunks/chunk.YOKF5TOY.js → cdn/chunks/chunk.6EP256OG.js}

@@ -1,6 +1,6 @@
 import {
   TerraLoader
-} from "./chunk.SDX3Z2MY.js";
+} from "./chunk.5ZOXIBZ3.js";
 
 // src/components/loader/loader.ts
 var loader_default = TerraLoader;

package/cdn/chunks/chunk.7PAVW6KC.js

@@ -0,0 +1,8 @@
+// src/utilities/number.ts
+function getRandomIntInclusive(min, max) {
+  return Math.floor(Math.random() * (Math.floor(max) - Math.ceil(min) + 1)) + Math.ceil(min);
+}
+
+export {
+  getRandomIntInclusive
+};

package/cdn/chunks/{chunk.IUDWCWFV.js → chunk.CBV7M6CJ.js}

@@ -1,6 +1,6 @@
 import {
   __spreadValues
-} from "./chunk.6QUGTGJO.js";
+} from "./chunk.MR27IH5Z.js";
 
 // src/internal/watch.ts
 function watch(propertyName, options) {

package/cdn/chunks/{chunk.5ZJOZU2G.js → chunk.CUJ24LWZ.js}

@@ -9,28 +9,28 @@ import {
   walkToOption
 } from "./chunk.LMGJJIIS.js";
 import {
-  Fuse
-} from "./chunk.NTNL4P6D.js";
+  combobox_styles_default
+} from "./chunk.USC76EZL.js";
 import {
-  n as n2
-} from "./chunk.2XCNCXGV.js";
+  Fuse
+} from "./chunk.U7L2FN7F.js";
 import {
   o
 } from "./chunk.QEA4QW6G.js";
 import {
-  combobox_styles_default
-} from "./chunk.USC76EZL.js";
+  n as n2
+} from "./chunk.2XCNCXGV.js";
 import {
   watch
-} from "./chunk.IUDWCWFV.js";
+} from "./chunk.CBV7M6CJ.js";
 import {
   TerraElement,
   component_styles_default
-} from "./chunk.ESBZCVC3.js";
+} from "./chunk.UNIX57HO.js";
 import {
   n,
   r
-} from "./chunk.K4EJQG4O.js";
+} from "./chunk.QCK7PTWV.js";
 import {
   T,
   s,
@@ -43,7 +43,7 @@ import {
   __privateSet,
   __spreadProps,
   __spreadValues
-} from "./chunk.6QUGTGJO.js";
+} from "./chunk.MR27IH5Z.js";
 
 // node_modules/lit-html/directives/choose.js
 var r2 = (r3, o2, t) => {

package/cdn/chunks/{chunk.O7AXAEKY.js → chunk.D3IGIATM.js}

@@ -1,9 +1,21 @@
 // src/components/browse-variables/repositories/giovanni.repository.ts
 var GIOVANNI_CATALOG_URL = "https://windmill-load-balancer-641499207.us-east-1.elb.amazonaws.com/api/r/giovanni/catalog";
 var GiovanniRepository = class {
-  async searchVariablesAndFacets(_query, _selectedFacetFields, options) {
+  async searchVariablesAndFacets(query, selectedFacets, options) {
     var _a;
-    const response = await fetch(GIOVANNI_CATALOG_URL, {
+    const url = new URL(GIOVANNI_CATALOG_URL);
+    if (query) {
+      url.searchParams.append("q", query);
+    }
+    if (selectedFacets) {
+      Object.keys(selectedFacets).forEach((facet) => {
+        url.searchParams.append(
+          `filter[${facet}]`,
+          selectedFacets[facet].toString()
+        );
+      });
+    }
+    const response = await fetch(url.toString(), {
       signal: (_a = options == null ? void 0 : options.signal) != null ? _a : null
     });
     if (!response.ok) {
@@ -13,7 +25,8 @@ var GiovanniRepository = class {
     const result = await response.json();
     return {
       facetsByCategory: result.facets,
-      variables: result.variables
+      variables: result.variables,
+      total: result.total
     };
   }
 };

package/cdn/chunks/{chunk.BJDFUSWQ.js → chunk.D7RUNWOI.js}

@@ -6,7 +6,6 @@ import {
 var giovanni_search_styles_default = i`
     :host {
         --label-height: 1.8125rem;
-        --host-height: 5.8125rem;
 
         block-size: var(--terra-block-size, 2.1875rem);
         box-sizing: border-box;
@@ -16,18 +15,11 @@ var giovanni_search_styles_default = i`
             calc(33vh + var(--terra-block-size, 2.1875rem));
         display: block;
         font-family: var(--terra-font-family--public-sans);
-        height: var(--terra-block-size, var(--host-height));
         inline-size: var(--terra-inline-size, 100%);
         position: relative;
         z-index: 10;
     }
 
-    :host([hide-label]) {
-        height: calc(
-            var(--terra-block-size, var(--host-height)) - var(--label-height)
-        );
-    }
-
     * {
         box-sizing: inherit;
     }

package/cdn/chunks/chunk.DGA3BVXS.js

@@ -0,0 +1,156 @@
+import {
+  i
+} from "./chunk.PH7RLQK2.js";
+
+// src/components/browse-variables/browse-variables.styles.ts
+var browse_variables_styles_default = i`
+    :host {
+        --light-blue-color: color-mix(
+            in hsl,
+            var(--terra-color-nasa-blue-tint) 65%,
+            white
+        ); /* this color doesn't exist in HDS, perhaps the design should change? */
+
+        background-color: var(--terra-color-nasa-blue-dark);
+        color: white;
+        display: block;
+        padding-bottom: 55%;
+        position: relative;
+        width: 100%;
+    }
+
+    h3 {
+        color: var(--light-blue-color);
+        margin-bottom: 1rem;
+    }
+
+    dialog {
+        position: absolute;
+        z-index: 999;
+        width: 100px;
+        height: 100px;
+        padding: 0;
+        place-self: center;
+    }
+
+    .container {
+        position: absolute;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        display: grid;
+        grid-template-rows: auto 1fr;
+    }
+
+    .scrollable {
+        overflow-y: auto;
+        display: grid;
+        grid-template-columns: 250px 1fr;
+        grid-column: span 2;
+        width: 100%;
+    }
+
+    header.search {
+        border-bottom: 1px solid var(--terra-color-nasa-blue-shade);
+        grid-column: span 2;
+        padding: 15px;
+        padding-bottom: 25px;
+        display: flex;
+        gap: 10px;
+    }
+
+    header.search button {
+        width: 36px;
+        height: 36px;
+    }
+
+    .browse-by-category aside {
+        padding: 0 15px;
+    }
+
+    .browse-by-category main {
+        display: grid;
+        grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
+        gap: 2rem;
+        min-width: 800px;
+        overflow-x: auto;
+    }
+
+    .column {
+        min-width: 0; /* Prevents overflow issues */
+    }
+
+    .browse-by-category ul {
+        list-style: none;
+        padding: 0;
+    }
+
+    .browse-by-category li {
+        border-radius: 4px;
+        cursor: pointer;
+        margin: 0;
+        margin-bottom: 0.5rem;
+        padding: 8px;
+        transition: background-color 0.15s;
+    }
+
+    .browse-by-category li:hover {
+        background-color: rgba(255, 255, 255, 0.1);
+    }
+
+    .browse-by-category terra-button {
+        margin-top: 15px;
+    }
+
+    .browse-by-category terra-button::part(base) {
+        color: white;
+    }
+
+    label {
+        color: white;
+        display: flex;
+        align-items: center;
+    }
+
+    input[type='radio'] {
+        margin-right: 10px;
+    }
+
+    .variables-container {
+        display: grid;
+        grid-template-areas:
+            'header header'
+            'aside main';
+        grid-template-columns: 250px 1fr;
+        grid-template-rows: auto 1fr;
+    }
+
+    .variables-container header {
+        grid-area: header;
+        padding: 15px;
+        padding-bottom: 0;
+    }
+
+    .variables-container aside {
+        grid-area: aside;
+        padding: 15px;
+    }
+
+    .variables-container main {
+        grid-area: main;
+        display: grid;
+        grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
+        gap: 2rem;
+        overflow-x: auto;
+        padding: 15px;
+    }
+
+    .facet {
+        margin-left: 10px;
+    }
+`;
+
+export {
+  browse_variables_styles_default
+};

package/{dist/chunks/chunk.GBWKBH4N.js → cdn/chunks/chunk.DHT3ZCRR.js}

@@ -1,6 +1,6 @@
 import {
   TerraBrowseVariables
-} from "./chunk.ZHWO5LMF.js";
+} from "./chunk.THHV2MXF.js";
 
 // src/react/browse-variables/index.ts
 import * as React from "react";

package/cdn/chunks/{chunk.LDWRVHUB.js → chunk.ECWXSH6F.js}

@@ -1,17 +1,20 @@
 import {
   TerraTimeSeries
-} from "./chunk.ELUZJB3A.js";
+} from "./chunk.GUGKXNLE.js";
 
 // src/react/time-series/index.ts
 import * as React from "react";
 import { createComponent } from "@lit/react";
+import "@lit/react";
 var tagName = "terra-time-series";
 TerraTimeSeries.define("terra-time-series");
 var reactWrapper = createComponent({
   tagName,
   elementClass: TerraTimeSeries,
   react: React,
-  events: {},
+  events: {
+    onTerraTimeSeriesDataChange: "terra-time-series-data-change"
+  },
   displayName: "TerraTimeSeries"
 });
 var time_series_default = reactWrapper;