@nasa-terra/components 0.0.23 → 0.0.26

package/cdn/web-types.json

@@ -1,59 +1,11 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "name": "@nasa-terra/components",
-  "version": "0.0.23",
+  "version": "0.0.26",
   "description-markup": "markdown",
   "contributions": {
     "html": {
       "elements": [
-        {
-          "name": "terra-browse-variables",
-          "description": "Browse through the NASA CMR or Giovanni catalogs.\n---\n",
-          "doc-url": "",
-          "attributes": [
-            {
-              "name": "catalog",
-              "description": "Allows the user to switch the catalog between different providers\nTODO: add support for CMR catalog and make it the default",
-              "value": { "type": "'giovanni'", "default": "'giovanni'" }
-            }
-          ],
-          "events": [],
-          "js": {
-            "properties": [
-              {
-                "name": "catalog",
-                "description": "Allows the user to switch the catalog between different providers\nTODO: add support for CMR catalog and make it the default",
-                "type": "'giovanni'"
-              },
-              { "name": "searchQuery", "type": "string" },
-              { "name": "selectedFacets", "type": "SelectedFacets" },
-              { "name": "showVariablesBrowse", "type": "boolean" }
-            ],
-            "events": []
-          }
-        },
-        {
-          "name": "terra-chip",
-          "description": "Used for contacts and tags\n---\n\n\n### **Slots:**\n - _default_ - The chip's label.",
-          "doc-url": "",
-          "attributes": [
-            {
-              "name": "size",
-              "value": {
-                "type": "'small' | 'medium' | 'large'",
-                "default": "'medium'"
-              }
-            }
-          ],
-          "slots": [{ "name": "", "description": "The chip's label." }],
-          "events": [],
-          "js": {
-            "properties": [
-              { "name": "size", "type": "'small' | 'medium' | 'large'" }
-            ],
-            "events": []
-          }
-        },
         {
           "name": "terra-button",
           "description": "Buttons represent actions that are available to the user.\n---\n\n\n### **Methods:**\n - **click()** - Simulates a click on the button.\n- **focus(options: _FocusOptions_)** - Sets focus on the button.\n- **blur()** - Removes focus from the button.\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n\n### **Slots:**\n - _default_ - The button's label.\n- **prefix** - A presentational prefix icon or similar element.\n- **suffix** - A presentational suffix icon or similar element.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **prefix** - The container that wraps the prefix.\n- **label** - The button's label.\n- **suffix** - The container that wraps the suffix.\n- **caret** - The button's caret icon, an `<sl-icon>` element.\n- **spinner** - The spinner that shows when the button is in the loading state.",
@@ -177,6 +129,11 @@
               "value": {
                 "type": "| '_self'\n        | '_blank'\n        | '_parent'\n        | '_top'\n        | string"
               }
+            },
+            {
+              "name": "for-dialog",
+              "description": "Used to connect this button to a dqialog on the page. Clicking the button will toggle the dialog's visiblity",
+              "value": { "type": "string | undefined" }
             }
           ],
           "slots": [
@@ -304,6 +261,16 @@
                 "description": "Used to override the form owner's `target` attribute.",
                 "type": "| '_self'\n        | '_blank'\n        | '_parent'\n        | '_top'\n        | string"
               },
+              {
+                "name": "forDialog",
+                "description": "Used to connect this button to a dqialog on the page. Clicking the button will toggle the dialog's visiblity",
+                "type": "string | undefined"
+              },
+              {
+                "name": "expanded",
+                "description": "if button is used to control another element on the page, such as an accordion or dialog, this state communicates whether the controlled element is expanded",
+                "type": "boolean"
+              },
               {
                 "name": "validity",
                 "description": "Gets the validity state object"
@@ -316,6 +283,54 @@
             "events": []
           }
         },
+        {
+          "name": "terra-browse-variables",
+          "description": "Browse through the NASA CMR or Giovanni catalogs.\n---\n",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "catalog",
+              "description": "Allows the user to switch the catalog between different providers\nTODO: add support for CMR catalog and make it the default",
+              "value": { "type": "'giovanni'", "default": "'giovanni'" }
+            }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              {
+                "name": "catalog",
+                "description": "Allows the user to switch the catalog between different providers\nTODO: add support for CMR catalog and make it the default",
+                "type": "'giovanni'"
+              },
+              { "name": "searchQuery", "type": "string" },
+              { "name": "selectedFacets", "type": "SelectedFacets" },
+              { "name": "showVariablesBrowse", "type": "boolean" }
+            ],
+            "events": []
+          }
+        },
+        {
+          "name": "terra-chip",
+          "description": "Used for contacts and tags\n---\n\n\n### **Slots:**\n - _default_ - The chip's label.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "size",
+              "value": {
+                "type": "'small' | 'medium' | 'large'",
+                "default": "'medium'"
+              }
+            }
+          ],
+          "slots": [{ "name": "", "description": "The chip's label." }],
+          "events": [],
+          "js": {
+            "properties": [
+              { "name": "size", "type": "'small' | 'medium' | 'large'" }
+            ],
+            "events": []
+          }
+        },
         {
           "name": "terra-combobox",
           "description": "Fuzzy-search for combobox with list autocomplete.\n---\n\n\n### **CSS Properties:**\n - **--host-height** - The height of the host element. _(default: undefined)_\n- **--help-height** - The height of the search help element. _(default: undefined)_\n- **--label-height** - The height of the input's label element. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - A `search` element, the component's base.\n- **combobox** - An `input` element used for searching.\n- **button** - A `button` used for toggling the listbox's visibility.\n- **listbox** - A `ul` that holds the clickable options.",
@@ -461,134 +476,88 @@
           }
         },
         {
-          "name": "terra-giovanni-search",
-          "description": "Fuzzy-search for dataset keywords in combobox with list autocomplete.\n---\n\n\n### **Events:**\n - **terra-giovanni-search-change** - Emitted when an option is selected.\n- **terra-search** - Emitted when the component is triggering a search (like a form triggering submit).\n\n### **CSS Properties:**\n - **--host-height** - The height of the host element. _(default: undefined)_\n- **--label-height** - The height of the input's label element. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - A `search` element, the component's base.\n- **combobox** - An `input` element used for searching.\n- **button** - A `button` used for toggling the listbox's visibility.\n- **listbox** - A `ul` that holds the clickable options.",
+          "name": "terra-dialog",
+          "description": "Used to create both modal and non-modal dialog boxes.\n---\n\n\n### **Events:**\n - **terra-dialog-show** - Emitted when the dialog opens.\n- **terra-dialog-hide** - Emitted when the dialog closes.\n\n### **Slots:**\n - _default_ - The dialog's main content",
           "doc-url": "",
           "attributes": [
             {
-              "name": "label",
-              "description": "Label the combobox with this.",
-              "value": {
-                "type": "string",
-                "default": "'Enter search terms (e.g., precipitation, AOD)'"
-              }
+              "name": "id",
+              "description": "the ID to be used for accessibility associations",
+              "value": { "type": "string" }
             },
             {
-              "name": "placeholder",
-              "description": "Set a placeholder for the combobox with this.\nDefaults to the label's value.",
-              "value": { "type": "string" }
+              "name": "width",
+              "description": "the width of the dialog",
+              "value": { "type": "string", "default": "'500px'" }
             },
             {
-              "name": "hide-label",
-              "description": "Hide the combobox's label text.\nWhen hidden, still presents to screen readers.",
-              "value": { "type": "boolean", "default": "true" }
+              "name": "open",
+              "description": "used to set the dialog's open state",
+              "value": { "type": "boolean", "default": "false" }
             },
             {
-              "name": "searchConfig",
-              "description": "type can be `Boolean`, `String`, `Number`, `Object`, or `Array`",
-              "value": {
-                "type": "object",
-                "default": "{\n        //* @see {@link https://www.fusejs.io/api/options.html#options}\n        keys: ['id'],\n        useExtendedSearch: true,\n    }"
-              }
+              "name": "click-outside-to-close",
+              "description": "allow closing the dialog when clicking outside of it",
+              "value": { "type": "boolean", "default": "true" }
             },
-            { "name": "value", "value": { "type": "string" } }
+            {
+              "name": "show-backdrop",
+              "description": "Show a backdrop behind the dialog",
+              "value": { "type": "boolean", "default": "true" }
+            }
           ],
+          "slots": [{ "name": "", "description": "The dialog's main content" }],
           "events": [
             {
-              "name": "terra-giovanni-search-change",
-              "description": "Emitted when an option is selected."
+              "name": "terra-dialog-show",
+              "description": "Emitted when the dialog opens."
             },
             {
-              "name": "terra-search",
-              "description": "Emitted when the component is triggering a search (like a form triggering submit)."
+              "name": "terra-dialog-hide",
+              "description": "Emitted when the dialog closes."
             }
           ],
           "js": {
             "properties": [
+              { "name": "dialogEl", "type": "HTMLDialogElement" },
               {
-                "name": "label",
-                "description": "Label the combobox with this.",
+                "name": "id",
+                "description": "the ID to be used for accessibility associations",
                 "type": "string"
               },
               {
-                "name": "placeholder",
-                "description": "Set a placeholder for the combobox with this.\nDefaults to the label's value.",
+                "name": "width",
+                "description": "the width of the dialog",
                 "type": "string"
               },
               {
-                "name": "hideLabel",
-                "description": "Hide the combobox's label text.\nWhen hidden, still presents to screen readers.",
+                "name": "open",
+                "description": "used to set the dialog's open state",
                 "type": "boolean"
               },
               {
-                "name": "searchConfig",
-                "description": "type can be `Boolean`, `String`, `Number`, `Object`, or `Array`",
-                "type": "object"
+                "name": "clickOutsideToClose",
+                "description": "allow closing the dialog when clicking outside of it",
+                "type": "boolean"
               },
-              { "name": "value", "type": "string" },
-              { "name": "isExpanded", "type": "boolean" },
-              { "name": "query" },
-              { "name": "searchResults", "type": "ListItem[]" }
+              {
+                "name": "showBackdrop",
+                "description": "Show a backdrop behind the dialog",
+                "type": "boolean"
+              }
             ],
             "events": [
               {
-                "name": "terra-giovanni-search-change",
-                "description": "Emitted when an option is selected."
+                "name": "terra-dialog-show",
+                "description": "Emitted when the dialog opens."
               },
               {
-                "name": "terra-search",
-                "description": "Emitted when the component is triggering a search (like a form triggering submit)."
+                "name": "terra-dialog-hide",
+                "description": "Emitted when the dialog closes."
               }
             ]
           }
         },
-        {
-          "name": "terra-loader",
-          "description": "Loaders are used to indicate there is content that is loading.\n---\n\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
-          "doc-url": "",
-          "attributes": [
-            {
-              "name": "variant",
-              "description": "The loader's variant",
-              "value": {
-                "type": "'small' | 'large' | 'orbit'",
-                "default": "'large'"
-              }
-            },
-            {
-              "name": "percent",
-              "description": "The percent complete for the loader to display",
-              "value": { "type": "string", "default": "'0'" }
-            },
-            {
-              "name": "indeterminate",
-              "description": "an indeterminate loader has an unknown progress and will show a spinner",
-              "value": { "type": "boolean", "default": "false" }
-            }
-          ],
-          "events": [],
-          "js": {
-            "properties": [
-              {
-                "name": "variant",
-                "description": "The loader's variant",
-                "type": "'small' | 'large' | 'orbit'"
-              },
-              {
-                "name": "percent",
-                "description": "The percent complete for the loader to display",
-                "type": "string"
-              },
-              {
-                "name": "indeterminate",
-                "description": "an indeterminate loader has an unknown progress and will show a spinner",
-                "type": "boolean"
-              },
-              { "name": "_currentPercent", "type": "number" }
-            ],
-            "events": []
-          }
-        },
         {
           "name": "terra-icon",
           "description": "Icons are symbols that can be used to represent various options within an application.\n---\n\n\n### **Events:**\n - **terra-load** - Emitted when the icon has loaded.\n- **terra-error** - Emitted when the icon fails to load due to an error.\n\n### **CSS Parts:**\n - **svg** - The internal SVG element.",
@@ -687,6 +656,135 @@
             ]
           }
         },
+        {
+          "name": "terra-giovanni-search",
+          "description": "Fuzzy-search for dataset keywords in combobox with list autocomplete.\n---\n\n\n### **Events:**\n - **terra-giovanni-search-change** - Emitted when an option is selected.\n- **terra-search** - Emitted when the component is triggering a search (like a form triggering submit).\n\n### **CSS Properties:**\n - **--host-height** - The height of the host element. _(default: undefined)_\n- **--label-height** - The height of the input's label element. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - A `search` element, the component's base.\n- **combobox** - An `input` element used for searching.\n- **button** - A `button` used for toggling the listbox's visibility.\n- **listbox** - A `ul` that holds the clickable options.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "label",
+              "description": "Label the combobox with this.",
+              "value": {
+                "type": "string",
+                "default": "'Enter search terms (e.g., precipitation, AOD)'"
+              }
+            },
+            {
+              "name": "placeholder",
+              "description": "Set a placeholder for the combobox with this.\nDefaults to the label's value.",
+              "value": { "type": "string" }
+            },
+            {
+              "name": "hide-label",
+              "description": "Hide the combobox's label text.\nWhen hidden, still presents to screen readers.",
+              "value": { "type": "boolean", "default": "true" }
+            },
+            {
+              "name": "searchConfig",
+              "description": "type can be `Boolean`, `String`, `Number`, `Object`, or `Array`",
+              "value": {
+                "type": "object",
+                "default": "{\n        //* @see {@link https://www.fusejs.io/api/options.html#options}\n        keys: ['id'],\n        useExtendedSearch: true,\n    }"
+              }
+            },
+            { "name": "value", "value": { "type": "string" } }
+          ],
+          "events": [
+            {
+              "name": "terra-giovanni-search-change",
+              "description": "Emitted when an option is selected."
+            },
+            {
+              "name": "terra-search",
+              "description": "Emitted when the component is triggering a search (like a form triggering submit)."
+            }
+          ],
+          "js": {
+            "properties": [
+              {
+                "name": "label",
+                "description": "Label the combobox with this.",
+                "type": "string"
+              },
+              {
+                "name": "placeholder",
+                "description": "Set a placeholder for the combobox with this.\nDefaults to the label's value.",
+                "type": "string"
+              },
+              {
+                "name": "hideLabel",
+                "description": "Hide the combobox's label text.\nWhen hidden, still presents to screen readers.",
+                "type": "boolean"
+              },
+              {
+                "name": "searchConfig",
+                "description": "type can be `Boolean`, `String`, `Number`, `Object`, or `Array`",
+                "type": "object"
+              },
+              { "name": "value", "type": "string" },
+              { "name": "isExpanded", "type": "boolean" },
+              { "name": "query" },
+              { "name": "searchResults", "type": "ListItem[]" }
+            ],
+            "events": [
+              {
+                "name": "terra-giovanni-search-change",
+                "description": "Emitted when an option is selected."
+              },
+              {
+                "name": "terra-search",
+                "description": "Emitted when the component is triggering a search (like a form triggering submit)."
+              }
+            ]
+          }
+        },
+        {
+          "name": "terra-loader",
+          "description": "Loaders are used to indicate there is content that is loading.\n---\n\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "variant",
+              "description": "The loader's variant",
+              "value": {
+                "type": "'small' | 'large' | 'orbit'",
+                "default": "'large'"
+              }
+            },
+            {
+              "name": "percent",
+              "description": "The percent complete for the loader to display",
+              "value": { "type": "string", "default": "'0'" }
+            },
+            {
+              "name": "indeterminate",
+              "description": "an indeterminate loader has an unknown progress and will show a spinner",
+              "value": { "type": "boolean", "default": "false" }
+            }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              {
+                "name": "variant",
+                "description": "The loader's variant",
+                "type": "'small' | 'large' | 'orbit'"
+              },
+              {
+                "name": "percent",
+                "description": "The percent complete for the loader to display",
+                "type": "string"
+              },
+              {
+                "name": "indeterminate",
+                "description": "an indeterminate loader has an unknown progress and will show a spinner",
+                "type": "boolean"
+              },
+              { "name": "_currentPercent", "type": "number" }
+            ],
+            "events": []
+          }
+        },
         {
           "name": "terra-login",
           "description": "A form that logs in to Earthdata Login (EDL) and returns a bearer token.\n---\n\n\n### **Events:**\n - **terra-login** - Emitted when a bearer token has been received from EDL.",
@@ -909,6 +1007,11 @@
             {
               "name": "is-expanded",
               "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "inline",
+              "description": "Whether the map should be shown inline, or as part of the normal content flow\nthe default is false, the map is positioned absolute under the input",
+              "value": { "type": "boolean", "default": "false" }
             }
           ],
           "events": [],
@@ -960,6 +1063,11 @@
                 "type": "string"
               },
               { "name": "isExpanded", "type": "boolean" },
+              {
+                "name": "inline",
+                "description": "Whether the map should be shown inline, or as part of the normal content flow\nthe default is false, the map is positioned absolute under the input",
+                "type": "boolean"
+              },
               { "name": "mapValue", "type": "any" },
               { "name": "spatialInput", "type": "HTMLInputElement" }
             ],

package/dist/chunks/{chunk.ROL3YWUL.js → chunk.2O33NVOZ.js}

@@ -1,6 +1,6 @@
 import {
   TerraMap
-} from "./chunk.GY6V5GTO.js";
+} from "./chunk.5A2NXDXH.js";
 
 // src/react/map/index.ts
 import * as React from "react";

package/{cdn/chunks/chunk.OMXNKQ4J.js → dist/chunks/chunk.2RJWA6A5.js}

@@ -1,6 +1,6 @@
 import {
   TerraSkeleton
-} from "./chunk.MF2HKAU4.js";
+} from "./chunk.IUJHXLVB.js";
 
 // src/components/skeleton/skeleton.ts
 var skeleton_default = TerraSkeleton;

package/{cdn/chunks/chunk.3P27SYOG.js → dist/chunks/chunk.2X75ZZLQ.js}

@@ -1,6 +1,6 @@
 import {
   TerraSpatialPicker
-} from "./chunk.SO3ICKNN.js";
+} from "./chunk.XYXKKZTD.js";
 
 // src/react/spatial-picker/index.ts
 import * as React from "react";

package/{cdn/chunks/chunk.5CPVH5F3.js → dist/chunks/chunk.35BNTLUN.js}

@@ -1,6 +1,6 @@
 import {
   TerraDateRangeSlider
-} from "./chunk.VJ6ZCI4D.js";
+} from "./chunk.B2K5RQP6.js";
 
 // src/components/date-range-slider/date-range-slider.ts
 var date_range_slider_default = TerraDateRangeSlider;

package/{cdn/chunks/chunk.WTF7QMVO.js → dist/chunks/chunk.37O2PHBO.js}

@@ -1,6 +1,6 @@
 import {
   TerraIcon
-} from "./chunk.KIEHEHU5.js";
+} from "./chunk.3VRBGLE2.js";
 
 // src/components/icon/icon.ts
 var icon_default = TerraIcon;

package/dist/chunks/{chunk.5GIZ5MAH.js → chunk.3VRBGLE2.js}

@@ -12,7 +12,7 @@ import {
 import {
   TerraElement,
   component_styles_default
-} from "./chunk.PVDILQEJ.js";
+} from "./chunk.PYOU5GNJ.js";
 import {
   __decorateClass,
   __privateAdd,

package/dist/chunks/{chunk.OHDG3PUV.js → chunk.57W5VBEO.js}

@@ -1,6 +1,6 @@
 import {
   TerraPlot
-} from "./chunk.ZKCIZ7YJ.js";
+} from "./chunk.A6MFFTZ4.js";
 
 // src/components/plot/plot.ts
 var plot_default = TerraPlot;

package/dist/chunks/{chunk.GY6V5GTO.js → chunk.5A2NXDXH.js}

@@ -1,3 +1,6 @@
+import {
+  leaflet_draw_styles_default
+} from "./chunk.AAWOHDFX.js";
 import {
   Leaflet
 } from "./chunk.UBBSTKSW.js";
@@ -10,16 +13,13 @@ import {
 import {
   map_styles_default
 } from "./chunk.GR7XHOA3.js";
-import {
-  leaflet_draw_styles_default
-} from "./chunk.AAWOHDFX.js";
 import {
   watch
 } from "./chunk.SK7IZCKP.js";
 import {
   TerraElement,
   component_styles_default
-} from "./chunk.PVDILQEJ.js";
+} from "./chunk.PYOU5GNJ.js";
 import {
   __decorateClass,
   __privateAdd,

package/dist/chunks/{chunk.XFWWZ3NP.js → chunk.5DBTQCSS.js}

@@ -1,6 +1,6 @@
 import {
   TerraCombobox
-} from "./chunk.LHX3WEK6.js";
+} from "./chunk.GAC7ING2.js";
 
 // src/react/combobox/index.ts
 import * as React from "react";