@nasa-terra/components 0.0.157 → 0.0.159

package/cdn/types/vue/index.d.ts

@@ -1,10 +1,10 @@
 import type { DefineComponent } from "vue";
 
 import type { TerraAccordion } from "../../components/accordion/accordion.component.js";
+import type { TerraAlert } from "../../components/alert/alert.component.js";
 import type { TerraBadge } from "../../components/badge/badge.component.js";
-import type { TerraAvatar } from "../../components/avatar/avatar.component.js";
 import type { TerraBreadcrumb } from "../../components/breadcrumb/breadcrumb.component.js";
-import type { TerraAlert } from "../../components/alert/alert.component.js";
+import type { TerraAvatar } from "../../components/avatar/avatar.component.js";
 import type { TerraBreadcrumbs } from "../../components/breadcrumbs/breadcrumbs.component.js";
 import type { TerraBrowseVariables } from "../../components/browse-variables/browse-variables.component.js";
 import type { TerraButton } from "../../components/button/button.component.js";
@@ -31,8 +31,8 @@ import type { TerraInput } from "../../components/input/input.component.js";
 import type { TerraLoader } from "../../components/loader/loader.component.js";
 import type { TerraLogin } from "../../components/login/login.component.js";
 import type { TerraMap } from "../../components/map/map.component.js";
-import type { TerraMenuItem } from "../../components/menu-item/menu-item.component.js";
 import type { TerraMenu } from "../../components/menu/menu.component.js";
+import type { TerraMenuItem } from "../../components/menu-item/menu-item.component.js";
 import type { TerraOption } from "../../components/option/option.component.js";
 import type { TerraPagination } from "../../components/pagination/pagination.component.js";
 import type { TerraPlot } from "../../components/plot/plot.component.js";
@@ -43,26 +43,26 @@ import type { TerraRadio } from "../../components/radio/radio.component.js";
 import type { TerraRadioGroup } from "../../components/radio-group/radio-group.component.js";
 import type { TerraScrollHint } from "../../components/scroll-hint/scroll-hint.component.js";
 import type { TerraSelect } from "../../components/select/select.component.js";
-import type { TerraSiteHeader } from "../../components/site-header/site-header.component.js";
 import type { TerraSkeleton } from "../../components/skeleton/skeleton.component.js";
 import type { TerraSiteNavigation } from "../../components/site-navigation/site-navigation.component.js";
-import type { TerraSpatialPicker } from "../../components/spatial-picker/spatial-picker.component.js";
+import type { TerraSiteHeader } from "../../components/site-header/site-header.component.js";
 import type { TerraSlider } from "../../components/slider/slider.component.js";
+import type { TerraSpatialPicker } from "../../components/spatial-picker/spatial-picker.component.js";
 import type { TerraStatusIndicator } from "../../components/status-indicator/status-indicator.component.js";
-import type { TerraStepperStep } from "../../components/stepper-step/stepper-step.component.js";
 import type { TerraStepper } from "../../components/stepper/stepper.component.js";
-import type { TerraTabPanel } from "../../components/tab-panel/tab-panel.component.js";
+import type { TerraStepperStep } from "../../components/stepper-step/stepper-step.component.js";
 import type { TerraTab } from "../../components/tab/tab.component.js";
 import type { TerraTabs } from "../../components/tabs/tabs.component.js";
 import type { TerraTag } from "../../components/tag/tag.component.js";
 import type { TerraTextarea } from "../../components/textarea/textarea.component.js";
 import type { TerraTimeAverageMap } from "../../components/time-average-map/time-average-map.component.js";
 import type { TerraTimeSeries, CustomEvent } from "../../components/time-series/time-series.component.js";
+import type { TerraTabPanel } from "../../components/tab-panel/tab-panel.component.js";
 import type { TerraToast } from "../../components/toast/toast.component.js";
-import type { TerraToggle } from "../../components/toggle/toggle.component.js";
 import type { TerraTooltip } from "../../components/tooltip/tooltip.component.js";
-import type { TerraVariableCombobox } from "../../components/variable-combobox/variable-combobox.component.js";
+import type { TerraToggle } from "../../components/toggle/toggle.component.js";
 import type { TerraVariableKeywordSearch } from "../../components/variable-keyword-search/variable-keyword-search.component.js";
+import type { TerraVariableCombobox } from "../../components/variable-combobox/variable-combobox.component.js";
 
 type TerraAccordionProps = {
   /** The summary/header for the accordion. Use the property for simple text, or the slot for custom content. */
@@ -76,39 +76,6 @@ type TerraAccordionProps = {
   onTerraAccordionToggle?: (e: CustomEvent<never>) => void;
 };
 
-type TerraBadgeProps = {
-  /** The badge's theme variant. */
-  variant?: TerraBadge["variant"];
-  /** Draws a pill-style badge with rounded edges. */
-  pill?: TerraBadge["pill"];
-  /** Makes the badge pulsate to draw attention. */
-  pulse?: TerraBadge["pulse"];
-};
-
-type TerraAvatarProps = {
-  /** The image source to use for the avatar. */
-  image?: TerraAvatar["image"];
-  /** A label to use to describe the avatar to assistive devices. */
-  label?: TerraAvatar["label"];
-  /** Initials to use as a fallback when no image is available (1-2 characters max recommended). */
-  initials?: TerraAvatar["initials"];
-  /** Indicates how the browser should load the image. */
-  loading?: TerraAvatar["loading"];
-  /** The shape of the avatar. */
-  shape?: TerraAvatar["shape"];
-
-  /** The image could not be loaded. This may because of an invalid URL, a temporary network condition, or some unknown cause. */
-  onTerraError?: (e: CustomEvent<never>) => void;
-};
-
-type TerraBreadcrumbProps = {
-  /** The URL the breadcrumb points to. When omitted, the breadcrumb is rendered as plain text. */
-  href?: TerraBreadcrumb["href"];
-  /** Indicates that this breadcrumb represents the current page.
-When set, `aria-current="page"` will be applied to the underlying element. */
-  current?: TerraBreadcrumb["current"];
-};
-
 type TerraAlertProps = {
   /** Indicates whether or not the alert is open. You can toggle this attribute to show and hide the alert, or you can
 use the `show()` and `hide()` methods and this attribute will reflect the alert's open state. */
@@ -141,6 +108,39 @@ Typically used to indicate the remaining time before a whole app refresh. */
   onTerraAfterHide?: (e: CustomEvent<never>) => void;
 };
 
+type TerraBadgeProps = {
+  /** The badge's theme variant. */
+  variant?: TerraBadge["variant"];
+  /** Draws a pill-style badge with rounded edges. */
+  pill?: TerraBadge["pill"];
+  /** Makes the badge pulsate to draw attention. */
+  pulse?: TerraBadge["pulse"];
+};
+
+type TerraBreadcrumbProps = {
+  /** The URL the breadcrumb points to. When omitted, the breadcrumb is rendered as plain text. */
+  href?: TerraBreadcrumb["href"];
+  /** Indicates that this breadcrumb represents the current page.
+When set, `aria-current="page"` will be applied to the underlying element. */
+  current?: TerraBreadcrumb["current"];
+};
+
+type TerraAvatarProps = {
+  /** The image source to use for the avatar. */
+  image?: TerraAvatar["image"];
+  /** A label to use to describe the avatar to assistive devices. */
+  label?: TerraAvatar["label"];
+  /** Initials to use as a fallback when no image is available (1-2 characters max recommended). */
+  initials?: TerraAvatar["initials"];
+  /** Indicates how the browser should load the image. */
+  loading?: TerraAvatar["loading"];
+  /** The shape of the avatar. */
+  shape?: TerraAvatar["shape"];
+
+  /** The image could not be loaded. This may because of an invalid URL, a temporary network condition, or some unknown cause. */
+  onTerraError?: (e: CustomEvent<never>) => void;
+};
+
 type TerraBreadcrumbsProps = {
   /** Accessible label for the breadcrumb navigation. */
   "aria-label"?: TerraBreadcrumbs["ariaLabel"];
@@ -502,6 +502,8 @@ type TerraDataSubsetterProps = {
   /**  */
   granuleMaxDate?: TerraDataSubsetter["granuleMaxDate"];
   /**  */
+  giovanniConfiguredVariables?: TerraDataSubsetter["giovanniConfiguredVariables"];
+  /**  */
   spatialPicker?: TerraDataSubsetter["spatialPicker"];
   /**  */
   dialogElement?: TerraDataSubsetter["dialogElement"];
@@ -972,6 +974,13 @@ Format: 'west, south, east, north' */
   _mapController?: TerraMap["_mapController"];
 };
 
+type TerraMenuProps = {
+  /**  */
+  defaultSlot?: TerraMenu["defaultSlot"];
+  /** Emitted when a menu item is selected. The event detail contains the selected menu item. */
+  onTerraSelect?: (e: CustomEvent<never>) => void;
+};
+
 type TerraMenuItemProps = {
   /** The type of menu item to render. To use `checked`, this value must be set to `checkbox`. */
   type?: TerraMenuItem["type"];
@@ -989,13 +998,6 @@ type TerraMenuItemProps = {
   menuItem?: TerraMenuItem["menuItem"];
 };
 
-type TerraMenuProps = {
-  /**  */
-  defaultSlot?: TerraMenu["defaultSlot"];
-  /** Emitted when a menu item is selected. The event detail contains the selected menu item. */
-  onTerraSelect?: (e: CustomEvent<never>) => void;
-};
-
 type TerraOptionProps = {
   /** The option's value. When selected, the containing form control will receive this value. The value must be unique
 from other options in the same group. Values may not contain spaces, as spaces are used as delimiters when listing
@@ -1360,11 +1362,6 @@ be an array. **For this reason, values must not contain spaces.** */
   onTerraInvalid?: (e: CustomEvent<never>) => void;
 };
 
-type TerraSiteHeaderProps = {
-  /** The default site name displayed in the title slot if no content is provided. */
-  "site-name"?: TerraSiteHeader["siteName"];
-};
-
 type TerraSkeletonProps = {
   /**  */
   rows?: TerraSkeleton["rows"];
@@ -1379,6 +1376,44 @@ type TerraSiteNavigationProps = {
   "full-width"?: TerraSiteNavigation["fullWidth"];
 };
 
+type TerraSiteHeaderProps = {
+  /** The default site name displayed in the title slot if no content is provided. */
+  "site-name"?: TerraSiteHeader["siteName"];
+};
+
+type TerraSliderProps = {
+  /** The slider mode - either 'single' for one value or 'range' for selecting a range. */
+  mode?: TerraSlider["mode"];
+  /** The minimum value of the slider. */
+  min?: TerraSlider["min"];
+  /** The maximum value of the slider. */
+  max?: TerraSlider["max"];
+  /** The step size for the slider. Use integers (1, 2, 5) for whole numbers or decimals (0.1, 0.2, 0.5) for fractional steps. */
+  step?: TerraSlider["step"];
+  /** Disables the slider. */
+  disabled?: TerraSlider["disabled"];
+  /** Shows tick marks and labels on the slider. */
+  "has-pips"?: TerraSlider["hasPips"];
+  /** Shows tooltips on the slider handles.
+When false (default), selected values are shown in the top right instead. */
+  "has-tooltips"?: TerraSlider["hasTooltips"];
+  /** Shows input fields below the slider for precise value entry. */
+  "show-inputs"?: TerraSlider["showInputs"];
+  /** The current value for single mode sliders. */
+  value?: TerraSlider["value"];
+  /** The start value for range mode sliders. */
+  "start-value"?: TerraSlider["startValue"];
+  /** The end value for range mode sliders. */
+  "end-value"?: TerraSlider["endValue"];
+  /** The label text for the slider. */
+  label?: TerraSlider["label"];
+  /** Hide the slider's label text.
+When hidden, still presents to screen readers. */
+  "hide-label"?: TerraSlider["hideLabel"];
+  /**  */
+  slider?: TerraSlider["slider"];
+};
+
 type TerraSpatialPickerProps = {
   /** Minimum zoom level of the map. */
   "min-zoom"?: TerraSpatialPicker["minZoom"];
@@ -1432,39 +1467,6 @@ the default is false, the map is positioned absolute under the input */
   parsedConstraints?: TerraSpatialPicker["parsedConstraints"];
 };
 
-type TerraSliderProps = {
-  /** The slider mode - either 'single' for one value or 'range' for selecting a range. */
-  mode?: TerraSlider["mode"];
-  /** The minimum value of the slider. */
-  min?: TerraSlider["min"];
-  /** The maximum value of the slider. */
-  max?: TerraSlider["max"];
-  /** The step size for the slider. Use integers (1, 2, 5) for whole numbers or decimals (0.1, 0.2, 0.5) for fractional steps. */
-  step?: TerraSlider["step"];
-  /** Disables the slider. */
-  disabled?: TerraSlider["disabled"];
-  /** Shows tick marks and labels on the slider. */
-  "has-pips"?: TerraSlider["hasPips"];
-  /** Shows tooltips on the slider handles.
-When false (default), selected values are shown in the top right instead. */
-  "has-tooltips"?: TerraSlider["hasTooltips"];
-  /** Shows input fields below the slider for precise value entry. */
-  "show-inputs"?: TerraSlider["showInputs"];
-  /** The current value for single mode sliders. */
-  value?: TerraSlider["value"];
-  /** The start value for range mode sliders. */
-  "start-value"?: TerraSlider["startValue"];
-  /** The end value for range mode sliders. */
-  "end-value"?: TerraSlider["endValue"];
-  /** The label text for the slider. */
-  label?: TerraSlider["label"];
-  /** Hide the slider's label text.
-When hidden, still presents to screen readers. */
-  "hide-label"?: TerraSlider["hideLabel"];
-  /**  */
-  slider?: TerraSlider["slider"];
-};
-
 type TerraStatusIndicatorProps = {
   /** The status variant. Determines the color of the indicator dot. */
   variant?: TerraStatusIndicator["variant"];
@@ -1472,16 +1474,6 @@ type TerraStatusIndicatorProps = {
   dark?: TerraStatusIndicator["dark"];
 };
 
-type TerraStepperStepProps = {
-  /** The step's state. "completed" shows a checkmark, "current" highlights the step as active,
-and "upcoming" shows the step as not yet reached. */
-  state?: TerraStepperStep["state"];
-  /** The step's title. Should be short, preferably 1-2 words. */
-  title?: TerraStepperStep["title"];
-  /** When true, hides the checkmark icon for completed steps. */
-  "hide-checkmark"?: TerraStepperStep["hideCheckmark"];
-};
-
 type TerraStepperProps = {
   /** The stepper's variant. The default variant includes titles and optional captions for each step.
 The condensed variant uses colored bars to represent each step and is useful when space is a concern. */
@@ -1490,11 +1482,14 @@ The condensed variant uses colored bars to represent each step and is useful whe
   defaultSlot?: TerraStepper["defaultSlot"];
 };
 
-type TerraTabPanelProps = {
-  /** The tab panel's name. */
-  name?: TerraTabPanel["name"];
-  /** When true, the tab panel will be shown. */
-  active?: TerraTabPanel["active"];
+type TerraStepperStepProps = {
+  /** The step's state. "completed" shows a checkmark, "current" highlights the step as active,
+and "upcoming" shows the step as not yet reached. */
+  state?: TerraStepperStep["state"];
+  /** The step's title. Should be short, preferably 1-2 words. */
+  title?: TerraStepperStep["title"];
+  /** When true, hides the checkmark icon for completed steps. */
+  "hide-checkmark"?: TerraStepperStep["hideCheckmark"];
 };
 
 type TerraTabProps = {
@@ -1723,6 +1718,13 @@ The property's value will be inserted after "Bearer" (the authentication scheme)
   onTerraTimeSeriesDataChange?: (e: CustomEvent<never>) => void;
 };
 
+type TerraTabPanelProps = {
+  /** The tab panel's name. */
+  name?: TerraTabPanel["name"];
+  /** When true, the tab panel will be shown. */
+  active?: TerraTabPanel["active"];
+};
+
 type TerraToastProps = {
   /** The toast's theme variant. */
   variant?: TerraToast["variant"];
@@ -1746,47 +1748,6 @@ Typically used for toasts with relatively long duration. */
   onTerraAfterHide?: (e: CustomEvent<never>) => void;
 };
 
-type TerraToggleProps = {
-  /**  */
-  title?: TerraToggle["title"];
-  /** The name of the switch, submitted as a name/value pair with form data. */
-  name?: TerraToggle["name"];
-  /** The current value of the switch, submitted as a name/value pair with form data. */
-  value?: TerraToggle["value"];
-  /** The switch's size. */
-  size?: TerraToggle["size"];
-  /** Disables the switch. */
-  disabled?: TerraToggle["disabled"];
-  /** Draws the switch in a checked state. */
-  checked?: TerraToggle["checked"];
-  /** By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you
-to place the form control outside of a form and associate it with the form that has this `id`. The form must be in
-the same document or shadow root for this to work. */
-  form?: TerraToggle["form"];
-  /** Makes the switch a required field. */
-  required?: TerraToggle["required"];
-  /** The switch's help text. If you need to display HTML, use the `help-text` slot instead. */
-  "help-text"?: TerraToggle["helpText"];
-  /**  */
-  input?: TerraToggle["input"];
-  /** The default value of the form control. Primarily used for resetting the form control. */
-  defaultChecked?: TerraToggle["defaultChecked"];
-  /** Gets the validity state object */
-  validity?: TerraToggle["validity"];
-  /** Gets the validation message */
-  validationMessage?: TerraToggle["validationMessage"];
-  /** Emitted when the control loses focus. */
-  onTerraBlur?: (e: CustomEvent<never>) => void;
-  /** Emitted when the control's checked state changes. */
-  onTerraChange?: (e: CustomEvent<never>) => void;
-  /** Emitted when the control receives input. */
-  onTerraInput?: (e: CustomEvent<never>) => void;
-  /** Emitted when the control gains focus. */
-  onTerraFocus?: (e: CustomEvent<never>) => void;
-  /** Emitted when the form control has been checked for validity and its constraints aren't satisfied. */
-  onTerraInvalid?: (e: CustomEvent<never>) => void;
-};
-
 type TerraTooltipProps = {
   /** The tooltip or popover content. If you need to display HTML, use the `content` slot instead. */
   content?: TerraTooltip["content"];
@@ -1828,39 +1789,45 @@ scenarios. */
   onTerraAfterHide?: (e: CustomEvent<never>) => void;
 };
 
-type TerraVariableComboboxProps = {
-  /** Label the combobox with this. */
-  label?: TerraVariableCombobox["label"];
-  /** Set a placeholder for the combobox with this.
-Defaults to the label's value. */
-  placeholder?: TerraVariableCombobox["placeholder"];
-  /** Hide the combobox's help text.
-When hidden, not rendered at all. */
-  "hide-help"?: TerraVariableCombobox["hideHelp"];
-  /** Hide the combobox's label text.
-When hidden, still presents to screen readers. */
-  "hide-label"?: TerraVariableCombobox["hideLabel"];
-  /** Determines if the variable combobox uses tags or plain text to display the query. */
-  "use-tags"?: TerraVariableCombobox["useTags"];
-  /** Represents the EntryID (<collection-name>_<variable-name>) of the selected variable.
-Other components (like the time-series graphing component) will use this. */
-  value?: TerraVariableCombobox["value"];
-  /** The token to be used for authentication with remote servers.
-The component provides the header "Authorization: Bearer" (the request header and authentication scheme).
-The property's value will be inserted after "Bearer" (the authentication scheme). */
-  "bearer-token"?: TerraVariableCombobox["bearerToken"];
-  /**  */
-  isExpanded?: TerraVariableCombobox["isExpanded"];
-  /**  */
-  query?: TerraVariableCombobox["query"];
-  /**  */
-  searchResults?: TerraVariableCombobox["searchResults"];
+type TerraToggleProps = {
   /**  */
-  tags?: TerraVariableCombobox["tags"];
+  title?: TerraToggle["title"];
+  /** The name of the switch, submitted as a name/value pair with form data. */
+  name?: TerraToggle["name"];
+  /** The current value of the switch, submitted as a name/value pair with form data. */
+  value?: TerraToggle["value"];
+  /** The switch's size. */
+  size?: TerraToggle["size"];
+  /** Disables the switch. */
+  disabled?: TerraToggle["disabled"];
+  /** Draws the switch in a checked state. */
+  checked?: TerraToggle["checked"];
+  /** By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you
+to place the form control outside of a form and associate it with the form that has this `id`. The form must be in
+the same document or shadow root for this to work. */
+  form?: TerraToggle["form"];
+  /** Makes the switch a required field. */
+  required?: TerraToggle["required"];
+  /** The switch's help text. If you need to display HTML, use the `help-text` slot instead. */
+  "help-text"?: TerraToggle["helpText"];
   /**  */
-  tagContainerWidth?: TerraVariableCombobox["tagContainerWidth"];
-  /** Emitted when an option is selected. */
-  onTerraComboboxChange?: (e: CustomEvent<never>) => void;
+  input?: TerraToggle["input"];
+  /** The default value of the form control. Primarily used for resetting the form control. */
+  defaultChecked?: TerraToggle["defaultChecked"];
+  /** Gets the validity state object */
+  validity?: TerraToggle["validity"];
+  /** Gets the validation message */
+  validationMessage?: TerraToggle["validationMessage"];
+  /** Emitted when the control loses focus. */
+  onTerraBlur?: (e: CustomEvent<never>) => void;
+  /** Emitted when the control's checked state changes. */
+  onTerraChange?: (e: CustomEvent<never>) => void;
+  /** Emitted when the control receives input. */
+  onTerraInput?: (e: CustomEvent<never>) => void;
+  /** Emitted when the control gains focus. */
+  onTerraFocus?: (e: CustomEvent<never>) => void;
+  /** Emitted when the form control has been checked for validity and its constraints aren't satisfied. */
+  onTerraInvalid?: (e: CustomEvent<never>) => void;
 };
 
 type TerraVariableKeywordSearchProps = {
@@ -1888,6 +1855,41 @@ When hidden, still presents to screen readers. */
   onTerraSearch?: (e: CustomEvent<never>) => void;
 };
 
+type TerraVariableComboboxProps = {
+  /** Label the combobox with this. */
+  label?: TerraVariableCombobox["label"];
+  /** Set a placeholder for the combobox with this.
+Defaults to the label's value. */
+  placeholder?: TerraVariableCombobox["placeholder"];
+  /** Hide the combobox's help text.
+When hidden, not rendered at all. */
+  "hide-help"?: TerraVariableCombobox["hideHelp"];
+  /** Hide the combobox's label text.
+When hidden, still presents to screen readers. */
+  "hide-label"?: TerraVariableCombobox["hideLabel"];
+  /** Determines if the variable combobox uses tags or plain text to display the query. */
+  "use-tags"?: TerraVariableCombobox["useTags"];
+  /** Represents the EntryID (<collection-name>_<variable-name>) of the selected variable.
+Other components (like the time-series graphing component) will use this. */
+  value?: TerraVariableCombobox["value"];
+  /** The token to be used for authentication with remote servers.
+The component provides the header "Authorization: Bearer" (the request header and authentication scheme).
+The property's value will be inserted after "Bearer" (the authentication scheme). */
+  "bearer-token"?: TerraVariableCombobox["bearerToken"];
+  /**  */
+  isExpanded?: TerraVariableCombobox["isExpanded"];
+  /**  */
+  query?: TerraVariableCombobox["query"];
+  /**  */
+  searchResults?: TerraVariableCombobox["searchResults"];
+  /**  */
+  tags?: TerraVariableCombobox["tags"];
+  /**  */
+  tagContainerWidth?: TerraVariableCombobox["tagContainerWidth"];
+  /** Emitted when an option is selected. */
+  onTerraComboboxChange?: (e: CustomEvent<never>) => void;
+};
+
 export type CustomElements = {
   /**
    * A collapsible content panel for showing and hiding content.
@@ -1904,39 +1906,45 @@ export type CustomElements = {
   "terra-accordion": DefineComponent<TerraAccordionProps>;
 
   /**
-   * Badges are used to draw attention and display statuses or counts.
+   * Alerts are used to display important messages inline or as toast notifications.
    * ---
    *
    *
+   * ### **Events:**
+   *  - **terra-show** - Emitted when the alert opens.
+   * - **terra-after-show** - Emitted after the alert opens and all animations are complete.
+   * - **terra-hide** - Emitted when the alert closes.
+   * - **terra-after-hide** - Emitted after the alert closes and all animations are complete.
+   *
+   * ### **Methods:**
+   *  - **show()** - Shows the alert.
+   * - **hide()** - Hides the alert
+   * - **toast()** - Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when
+   * dismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by
+   * calling this method again. The returned promise will resolve after the alert is hidden.
+   *
    * ### **Slots:**
-   *  - _default_ - The badge's content.
+   *  - _default_ - The alert's main content.
    *
    * ### **CSS Parts:**
    *  - **base** - The component's base wrapper.
+   * - **icon** - The container that wraps the optional icon.
+   * - **message** - The container that wraps the alert's main content.
    */
-  "terra-badge": DefineComponent<TerraBadgeProps>;
+  "terra-alert": DefineComponent<TerraAlertProps>;
 
   /**
-   * Avatars are used to represent a person or object.
+   * Badges are used to draw attention and display statuses or counts.
    * ---
    *
    *
-   * ### **Events:**
-   *  - **terra-error** - The image could not be loaded. This may because of an invalid URL, a temporary network condition, or some unknown cause.
-   *
    * ### **Slots:**
-   *  - **icon** - The default icon to use when no image or initials are present. Works best with `<terra-icon>`.
-   *
-   * ### **CSS Properties:**
-   *  - **--size** - The size of the avatar. _(default: undefined)_
+   *  - _default_ - The badge's content.
    *
    * ### **CSS Parts:**
    *  - **base** - The component's base wrapper.
-   * - **icon** - The container that wraps the avatar's icon.
-   * - **initials** - The container that wraps the avatar's initials.
-   * - **image** - The avatar image. Only shown when the `image` attribute is set.
    */
-  "terra-avatar": DefineComponent<TerraAvatarProps>;
+  "terra-badge": DefineComponent<TerraBadgeProps>;
 
   /**
    * A single breadcrumb item used inside `terra-breadcrumbs`.
@@ -1959,32 +1967,26 @@ export type CustomElements = {
   "terra-breadcrumb": DefineComponent<TerraBreadcrumbProps>;
 
   /**
-   * Alerts are used to display important messages inline or as toast notifications.
+   * Avatars are used to represent a person or object.
    * ---
    *
    *
    * ### **Events:**
-   *  - **terra-show** - Emitted when the alert opens.
-   * - **terra-after-show** - Emitted after the alert opens and all animations are complete.
-   * - **terra-hide** - Emitted when the alert closes.
-   * - **terra-after-hide** - Emitted after the alert closes and all animations are complete.
-   *
-   * ### **Methods:**
-   *  - **show()** - Shows the alert.
-   * - **hide()** - Hides the alert
-   * - **toast()** - Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when
-   * dismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by
-   * calling this method again. The returned promise will resolve after the alert is hidden.
+   *  - **terra-error** - The image could not be loaded. This may because of an invalid URL, a temporary network condition, or some unknown cause.
    *
    * ### **Slots:**
-   *  - _default_ - The alert's main content.
+   *  - **icon** - The default icon to use when no image or initials are present. Works best with `<terra-icon>`.
+   *
+   * ### **CSS Properties:**
+   *  - **--size** - The size of the avatar. _(default: undefined)_
    *
    * ### **CSS Parts:**
    *  - **base** - The component's base wrapper.
-   * - **icon** - The container that wraps the optional icon.
-   * - **message** - The container that wraps the alert's main content.
+   * - **icon** - The container that wraps the avatar's icon.
+   * - **initials** - The container that wraps the avatar's initials.
+   * - **image** - The avatar image. Only shown when the `image` attribute is set.
    */
-  "terra-alert": DefineComponent<TerraAlertProps>;
+  "terra-avatar": DefineComponent<TerraAvatarProps>;
 
   /**
    * A collection of breadcrumb items that shows the current page's location in the site hierarchy.
@@ -2496,6 +2498,19 @@ export type CustomElements = {
    */
   "terra-map": DefineComponent<TerraMapProps>;
 
+  /**
+   * Menus provide a list of options for the user to choose from.
+   * ---
+   *
+   *
+   * ### **Events:**
+   *  - **terra-select** - Emitted when a menu item is selected. The event detail contains the selected menu item.
+   *
+   * ### **Slots:**
+   *  - _default_ - The menu's content, typically `<terra-menu-item>` elements.
+   */
+  "terra-menu": DefineComponent<TerraMenuProps>;
+
   /**
    * Menu items provide options for the user to pick from in a menu.
    * ---
@@ -2525,19 +2540,6 @@ export type CustomElements = {
    */
   "terra-menu-item": DefineComponent<TerraMenuItemProps>;
 
-  /**
-   * Menus provide a list of options for the user to choose from.
-   * ---
-   *
-   *
-   * ### **Events:**
-   *  - **terra-select** - Emitted when a menu item is selected. The event detail contains the selected menu item.
-   *
-   * ### **Slots:**
-   *  - _default_ - The menu's content, typically `<terra-menu-item>` elements.
-   */
-  "terra-menu": DefineComponent<TerraMenuProps>;
-
   /**
    * Options define the selectable items within various form controls such as [select](/components/select).
    * ---
@@ -2820,25 +2822,6 @@ export type CustomElements = {
    */
   "terra-select": DefineComponent<TerraSelectProps>;
 
-  /**
-   * Site headers provide a consistent navigation structure at the top of pages.
-   * ---
-   *
-   *
-   * ### **Slots:**
-   *  - **title** - The site title displayed next to the logo. Defaults to the `site-name` prop value.
-   * - **center** - Content displayed in the center of the header (e.g., navigation).
-   * - **right** - Content displayed on the right side of the header. Defaults to a search icon button.
-   *
-   * ### **CSS Parts:**
-   *  - **base** - The component's base wrapper.
-   * - **logo** - The NASA logo container.
-   * - **title** - The site title container.
-   * - **center** - The center content container.
-   * - **right** - The right content container.
-   */
-  "terra-site-header": DefineComponent<TerraSiteHeaderProps>;
-
   /**
    * Skeletons are loading indicators to represent where content will eventually be drawn.
    * ---
@@ -2860,11 +2843,23 @@ export type CustomElements = {
   "terra-site-navigation": DefineComponent<TerraSiteNavigationProps>;
 
   /**
-   * A component that allows input of coordinates and rendering of map.
+   * Site headers provide a consistent navigation structure at the top of pages.
    * ---
    *
+   *
+   * ### **Slots:**
+   *  - **title** - The site title displayed next to the logo. Defaults to the `site-name` prop value.
+   * - **center** - Content displayed in the center of the header (e.g., navigation).
+   * - **right** - Content displayed on the right side of the header. Defaults to a search icon button.
+   *
+   * ### **CSS Parts:**
+   *  - **base** - The component's base wrapper.
+   * - **logo** - The NASA logo container.
+   * - **title** - The site title container.
+   * - **center** - The center content container.
+   * - **right** - The right content container.
    */
-  "terra-spatial-picker": DefineComponent<TerraSpatialPickerProps>;
+  "terra-site-header": DefineComponent<TerraSiteHeaderProps>;
 
   /**
    *
@@ -2873,6 +2868,13 @@ export type CustomElements = {
    */
   "terra-slider": DefineComponent<TerraSliderProps>;
 
+  /**
+   * A component that allows input of coordinates and rendering of map.
+   * ---
+   *
+   */
+  "terra-spatial-picker": DefineComponent<TerraSpatialPickerProps>;
+
   /**
    * Status indicators are dynamic labels that indicate the current state of a mission or project.
    * ---
@@ -2895,24 +2897,6 @@ export type CustomElements = {
    */
   "terra-status-indicator": DefineComponent<TerraStatusIndicatorProps>;
 
-  /**
-   * A step within a stepper component that displays progress through a multi-step workflow.
-   * ---
-   *
-   *
-   * ### **Slots:**
-   *  - _default_ - The step's caption (optional, only shown in default variant).
-   *
-   * ### **CSS Parts:**
-   *  - **base** - The component's base wrapper.
-   * - **bar** - The progress bar indicator.
-   * - **content** - The content area containing title and caption.
-   * - **title** - The step's title.
-   * - **caption** - The step's caption.
-   * - **icon** - The checkmark icon (shown when completed).
-   */
-  "terra-stepper-step": DefineComponent<TerraStepperStepProps>;
-
   /**
    * Steppers display a visitor's progress through linear workflows and experiences with multiple steps.
    * ---
@@ -2927,20 +2911,22 @@ export type CustomElements = {
   "terra-stepper": DefineComponent<TerraStepperProps>;
 
   /**
-   * Tab panels are used inside [tabs](/components/tabs) to display tabbed content.
+   * A step within a stepper component that displays progress through a multi-step workflow.
    * ---
    *
    *
    * ### **Slots:**
-   *  - _default_ - The tab panel's content.
-   *
-   * ### **CSS Properties:**
-   *  - **--padding** - The tab panel's padding. _(default: undefined)_
+   *  - _default_ - The step's caption (optional, only shown in default variant).
    *
    * ### **CSS Parts:**
    *  - **base** - The component's base wrapper.
+   * - **bar** - The progress bar indicator.
+   * - **content** - The content area containing title and caption.
+   * - **title** - The step's title.
+   * - **caption** - The step's caption.
+   * - **icon** - The checkmark icon (shown when completed).
    */
-  "terra-tab-panel": DefineComponent<TerraTabPanelProps>;
+  "terra-stepper-step": DefineComponent<TerraStepperStepProps>;
 
   /**
    * Tabs are used inside [tabs](/components/tabs) to represent and activate [tab panels](/components/tab-panel).
@@ -3086,6 +3072,22 @@ export type CustomElements = {
    */
   "terra-time-series": DefineComponent<TerraTimeSeriesProps>;
 
+  /**
+   * Tab panels are used inside [tabs](/components/tabs) to display tabbed content.
+   * ---
+   *
+   *
+   * ### **Slots:**
+   *  - _default_ - The tab panel's content.
+   *
+   * ### **CSS Properties:**
+   *  - **--padding** - The tab panel's padding. _(default: undefined)_
+   *
+   * ### **CSS Parts:**
+   *  - **base** - The component's base wrapper.
+   */
+  "terra-tab-panel": DefineComponent<TerraTabPanelProps>;
+
   /**
    * Toasts are used to display brief, non-intrusive notifications that appear temporarily.
    * ---
@@ -3118,6 +3120,39 @@ export type CustomElements = {
    */
   "terra-toast": DefineComponent<TerraToastProps>;
 
+  /**
+   * Tooltips display brief, contextual help on hover or focus. Popovers show richer supporting content.
+   * ---
+   *
+   *
+   * ### **Events:**
+   *  - **terra-show** - Emitted when the tooltip or popover begins to show.
+   * - **terra-after-show** - Emitted after it has shown and all animations are complete.
+   * - **terra-hide** - Emitted when the tooltip or popover begins to hide.
+   * - **terra-after-hide** - Emitted after it has hidden and all animations are complete.
+   *
+   * ### **Methods:**
+   *  - **show()** - Shows the tooltip or popover.
+   * - **hide()** - Hides the tooltip or popover.
+   *
+   * ### **Slots:**
+   *  - _default_ - The tooltip or popover target element. Avoid slotting in more than one element, as subsequent ones will be ignored.
+   * - **content** - The content to render in the tooltip or popover. Alternatively, you can use the `content` attribute.
+   * - **image** - Optional image slot for popovers. When provided, the image will span the full width of the popover.
+   *
+   * ### **CSS Properties:**
+   *  - **--max-width** - The maximum width of the tooltip before its content will wrap. _(default: undefined)_
+   * - **--hide-delay** - The amount of time to wait before hiding the tooltip when hovering. _(default: undefined)_
+   * - **--show-delay** - The amount of time to wait before showing the tooltip when hovering. _(default: undefined)_
+   *
+   * ### **CSS Parts:**
+   *  - **base** - The component's base wrapper, an `<terra-popup>` element.
+   * - **base__popup** - The popup's exported `popup` part. Use this to target the tooltip's popup container.
+   * - **base__arrow** - The popup's exported `arrow` part. Use this to target the tooltip's arrow.
+   * - **body** - The tooltip or popover body where its content is rendered.
+   */
+  "terra-tooltip": DefineComponent<TerraTooltipProps>;
+
   /**
    * Switches allow the user to toggle an option on or off.
    * ---
@@ -3158,37 +3193,25 @@ export type CustomElements = {
   "terra-toggle": DefineComponent<TerraToggleProps>;
 
   /**
-   * Tooltips display brief, contextual help on hover or focus. Popovers show richer supporting content.
+   * Fuzzy-search for dataset keywords in combobox with list autocomplete.
    * ---
    *
    *
    * ### **Events:**
-   *  - **terra-show** - Emitted when the tooltip or popover begins to show.
-   * - **terra-after-show** - Emitted after it has shown and all animations are complete.
-   * - **terra-hide** - Emitted when the tooltip or popover begins to hide.
-   * - **terra-after-hide** - Emitted after it has hidden and all animations are complete.
-   *
-   * ### **Methods:**
-   *  - **show()** - Shows the tooltip or popover.
-   * - **hide()** - Hides the tooltip or popover.
-   *
-   * ### **Slots:**
-   *  - _default_ - The tooltip or popover target element. Avoid slotting in more than one element, as subsequent ones will be ignored.
-   * - **content** - The content to render in the tooltip or popover. Alternatively, you can use the `content` attribute.
-   * - **image** - Optional image slot for popovers. When provided, the image will span the full width of the popover.
+   *  - **terra-variable-keyword-search-change** - Emitted when an option is selected.
+   * - **terra-search** - Emitted when the component is triggering a search (like a form triggering submit).
    *
    * ### **CSS Properties:**
-   *  - **--max-width** - The maximum width of the tooltip before its content will wrap. _(default: undefined)_
-   * - **--hide-delay** - The amount of time to wait before hiding the tooltip when hovering. _(default: undefined)_
-   * - **--show-delay** - The amount of time to wait before showing the tooltip when hovering. _(default: undefined)_
+   *  - **--host-height** - The height of the host element. _(default: undefined)_
+   * - **--label-height** - The height of the input's label element. _(default: undefined)_
    *
    * ### **CSS Parts:**
-   *  - **base** - The component's base wrapper, an `<terra-popup>` element.
-   * - **base__popup** - The popup's exported `popup` part. Use this to target the tooltip's popup container.
-   * - **base__arrow** - The popup's exported `arrow` part. Use this to target the tooltip's arrow.
-   * - **body** - The tooltip or popover body where its content is rendered.
+   *  - **base** - A `search` element, the component's base.
+   * - **combobox** - An `input` element used for searching.
+   * - **button** - A `button` used for toggling the listbox's visibility.
+   * - **listbox** - A `ul` that holds the clickable options.
    */
-  "terra-tooltip": DefineComponent<TerraTooltipProps>;
+  "terra-variable-keyword-search": DefineComponent<TerraVariableKeywordSearchProps>;
 
   /**
    * Fuzzy-search for dataset variables in combobox with list autocomplete.
@@ -3214,27 +3237,6 @@ export type CustomElements = {
    * - **listbox** - A `ul` that holds the clickable options.
    */
   "terra-variable-combobox": DefineComponent<TerraVariableComboboxProps>;
-
-  /**
-   * Fuzzy-search for dataset keywords in combobox with list autocomplete.
-   * ---
-   *
-   *
-   * ### **Events:**
-   *  - **terra-variable-keyword-search-change** - Emitted when an option is selected.
-   * - **terra-search** - Emitted when the component is triggering a search (like a form triggering submit).
-   *
-   * ### **CSS Properties:**
-   *  - **--host-height** - The height of the host element. _(default: undefined)_
-   * - **--label-height** - The height of the input's label element. _(default: undefined)_
-   *
-   * ### **CSS Parts:**
-   *  - **base** - A `search` element, the component's base.
-   * - **combobox** - An `input` element used for searching.
-   * - **button** - A `button` used for toggling the listbox's visibility.
-   * - **listbox** - A `ul` that holds the clickable options.
-   */
-  "terra-variable-keyword-search": DefineComponent<TerraVariableKeywordSearchProps>;
 };
 
 declare module "vue" {