@esri/calcite-components 5.2.0-next.86 → 5.2.0-next.88

package/dist/components/calcite-input-time-picker/customElement.d.ts

@@ -7,6 +7,57 @@ import type { Scale, Status } from "../types.js";
 import type { IconName } from "../calcite-icon/types.js";
 import type { TimePicker } from "../calcite-time-picker/customElement.js";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** Specifies the component's background color. */
+  "--calcite-input-time-picker-background-color": "*";
+  /** Specifies the component's border color. */
+  "--calcite-input-time-picker-border-color": "*";
+  /** Specifies the component's icon color. */
+  "--calcite-input-time-picker-icon-color": "*";
+  /** Specifies the component's icon color when hovered. */
+  "--calcite-input-time-picker-icon-color-hover": "*";
+  /** Specifies the component's shadow. */
+  "--calcite-input-time-picker-shadow": "*";
+  /** Specifies the component's border radius. */
+  "--calcite-input-time-picker-corner-radius": "*";
+  /** Specifies the component's input background color. */
+  "--calcite-input-time-picker-input-background-color": "*";
+  /** Specifies the component's input text color. */
+  "--calcite-input-time-picker-input-text-color": "*";
+  /** Specifies the component's input shadow. */
+  "--calcite-input-time-picker-input-shadow": "*";
+  /** Specifies the component's input border radius. */
+  "--calcite-input-time-picker-input-corner-radius": "*";
+  /** Specifies the component's input border color. */
+  "--calcite-input-time-picker-input-border-color": "*";
+  /** Specifies the component's digit text color. */
+  "--calcite-input-time-picker-digit-text-color": "*";
+  /** Specifies the component's digit icon color. */
+  "--calcite-input-time-picker-digit-icon-color": "*";
+  /** Specifies the component's digit border color when pressed. */
+  "--calcite-input-time-picker-digit-border-color-press": "*";
+  /** Specifies the component's digit border color when hovered. */
+  "--calcite-input-time-picker-digit-border-color-hover": "*";
+  /** Specifies the background color of the component's actions when hovered. */
+  "--calcite-input-time-picker-action-background-color-hover": "*";
+  /** Specifies the background color of the component's actions when active. */
+  "--calcite-input-time-picker-action-background-color-press": "*";
+  /** Specifies the background color of the input's `clearable` element. */
+  "--calcite-input-time-picker-input-action-background-color": "*";
+  /** Specifies the background color of the input's `clearable` element when hovered. */
+  "--calcite-input-time-picker-input-action-background-color-hover": "*";
+  /** Specifies the background color of the input's `clearable` element when pressed. */
+  "--calcite-input-time-picker-input-action-background-color-press": "*";
+  /** Specifies the icon color of the input's `clearable` and toggle elements. */
+  "--calcite-input-time-picker-input-action-icon-color": "*";
+  /** Specifies the icon color of the input's `clearable` and toggle elements when hovered. */
+  "--calcite-input-time-picker-input-action-icon-color-hover": "*";
+  /** Specifies the icon color of the input's `clearable` and toggle elements when pressed. */
+  "--calcite-input-time-picker-input-action-icon-color-press": "*";
+}
+}
+
 /** @slot [label-content] - A slot for rendering content next to the component's `labelText`. */
 export abstract class InputTimePicker extends LitElement {
   /**

package/dist/components/calcite-input-time-zone/customElement.d.ts

@@ -5,6 +5,13 @@ import type { OverlayPositioning } from "../../utils/floating-ui.js";
 import type { IconName } from "../calcite-icon/types.js";
 import type { OffsetStyle, TimeZoneMode } from "./types.js";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** Specifies the component's corner radius. */
+  "--calcite-input-time-zone-corner-radius": "*";
+}
+}
+
 /** @slot [label-content] - A slot for rendering content next to the component's `labelText`. */
 export abstract class InputTimeZone extends LitElement {
   /**

package/dist/components/calcite-label/customElement.d.ts

@@ -2,6 +2,15 @@
 import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 import type { Alignment, Scale } from "../types.js";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** Specifies the component's bottom spacing. */
+  "--calcite-label-margin-bottom": "*";
+  /** Specifies the component's text color. */
+  "--calcite-label-text-color": "*";
+}
+}
+
 /** @slot  - A slot for adding text and a component that can be labeled. */
 export abstract class Label extends LitElement {
   /**

package/dist/components/calcite-link/customElement.d.ts

@@ -3,6 +3,13 @@ import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 import type { FlipContext } from "../types.js";
 import type { IconName } from "../calcite-icon/types.js";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** Specifies the component's text color. */
+  "--calcite-link-text-color": "*";
+}
+}
+
 /**
  * Any attributes placed on <calcite-link> component will propagate to the rendered child
  *

package/dist/components/calcite-list/customElement.d.ts

@@ -7,6 +7,13 @@ import type { ListItem } from "../calcite-list-item/customElement.js";
 import type { SelectionAppearance } from "./resources.js";
 import type { ListDisplayMode, ListDragDetail } from "./types.js";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** Specifies the component's background color. */
+  "--calcite-list-background-color": "*";
+}
+}
+
 /**
  * A general purpose list that enables users to construct list items that conform to Calcite styling.
  *

package/dist/components/calcite-list-item/customElement.d.ts

@@ -3,6 +3,29 @@ import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 import type { Scale, FlipContext } from "../types.js";
 import type { IconName } from "../calcite-icon/types.js";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** Specifies the component's background color when hovered. */
+  "--calcite-list-background-color-hover": "*";
+  /** Specifies the component's background color when pressed. */
+  "--calcite-list-background-color-press": "*";
+  /** Specifies the component's background color. */
+  "--calcite-list-background-color": "*";
+  /** Specifies the component's border color. */
+  "--calcite-list-border-color": "*";
+  /** Specifies the content color. */
+  "--calcite-list-content-text-color": "*";
+  /** Specifies the `description` color. */
+  "--calcite-list-description-text-color": "*";
+  /** Specifies the component's icon color. */
+  "--calcite-list-icon-color": "*";
+  /** Specifies the `label` color. */
+  "--calcite-list-label-text-color": "*";
+  /** Specifies the component's selection border color. */
+  "--calcite-list-selection-border-color": "*";
+}
+}
+
 /**
  * @slot  - A slot for adding `calcite-list`, `calcite-list-item` and `calcite-list-item-group` elements.
  * @slot [actions-start] - A slot for adding actionable `calcite-action` elements before the content of the component.

package/dist/components/calcite-list-item-group/customElement.d.ts

@@ -2,6 +2,15 @@
 import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 import type { Scale } from "../types.js";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** Specifies the component's background color. */
+  "--calcite-list-background-color": "*";
+  /** Specifies the component's color. */
+  "--calcite-list-color": "*";
+}
+}
+
 /** @slot  - A slot for adding `calcite-list-item` and `calcite-list-item-group` elements. */
 export abstract class ListItemGroup extends LitElement {
   /**

package/dist/components/calcite-list-item-group/customElement.js

@@ -12,8 +12,8 @@ class ListItemGroup extends LitElement {
     this.disabled = false;
     this.filterHidden = false;
     this.scale = "m";
-    this.calciteInternalListItemGroupDefaultSlotChange = createEvent({ cancelable: false });
     this.calciteInternalListItemGroupChange = createEvent({ cancelable: false });
+    this.calciteInternalListItemGroupDefaultSlotChange = createEvent({ cancelable: false });
   }
   static {
     this.properties = { disabled: [7, {}, { reflect: true, type: Boolean }], filterHidden: [7, {}, { reflect: true, type: Boolean }], heading: [3, {}, { reflect: true }], scale: [3, {}, { reflect: true }] };

package/dist/components/calcite-loader/customElement.d.ts

@@ -3,6 +3,35 @@ import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 import type { Scale } from "../types.js";
 import type { T9nMeta } from "@arcgis/lumina/controllers";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** When `type` is not `"indeterminate"` or `inline`, specifies the font size of the loading percentage. */
+  "--calcite-loader-font-size": "*";
+  /** Specifies the component's width and height. */
+  "--calcite-loader-size": "*";
+  /**
+   * Specifies the width and height of the component when set to inline.
+   *
+   * @deprecated in v3.0.0, removal target v6.0.0 - Use `--calcite-loader-size` instead.
+   */
+  "--calcite-loader-size-inline": "*";
+  /** Specifies the the component's padding. */
+  "--calcite-loader-spacing": "*";
+  /** When `inline`, specifies the component's progress ring color. */
+  "--calcite-loader-progress-color-inline": "*";
+  /** When not `inline`, specifies the component's `text` margin. */
+  "--calcite-loader-text-spacing": "*";
+  /** When not `inline` and `text` is provided, specifies the component's `text` font weight. */
+  "--calcite-loader-text-weight": "*";
+  /** When not `inline` and `text` is provided, specifies the component's `text` color. */
+  "--calcite-loader-text-color": "*";
+  /** When not `inline`, specifies the component's progress ring color. */
+  "--calcite-loader-progress-color": "*";
+  /** Specifies the component's track color. */
+  "--calcite-loader-track-color": "*";
+}
+}
+
 export abstract class Loader extends LitElement {
   /**
    * When `true`, the component displays smaller.

package/dist/components/calcite-menu-item/customElement.d.ts

@@ -3,6 +3,21 @@ import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 import type { FlipContext, Scale } from "../types.js";
 import type { IconName } from "../calcite-icon/types.js";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** When `active`, specifies the component's border color. */
+  "--calcite-menu-item-accent-color": "*";
+  /** Specifies the component's background color. */
+  "--calcite-menu-background-color": "*";
+  /** Specifies the submenu's border color. */
+  "--calcite-menu-item-sub-menu-border-color": "*";
+  /** Specifies the submenu's border radius. */
+  "--calcite-menu-item-sub-menu-corner-radius": "*";
+  /** Specifies the component's text color. */
+  "--calcite-menu-text-color": "*";
+}
+}
+
 /** @slot [submenu-item] - A slot for adding `calcite-menu-item`s in a submenu. */
 export abstract class MenuItem extends LitElement {
   /**

package/dist/components/calcite-meter/customElement.d.ts

@@ -5,6 +5,25 @@ import type { NumberingSystem } from "../../utils/locale.js";
 import type { MeterFillType, MeterLabelType } from "./types.js";
 import type { T9nMeta } from "@arcgis/lumina/controllers";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** Specifies the background color of the component. */
+  "--calcite-meter-background-color": "*";
+  /** Specifies the border color of the component and displayed step lines. */
+  "--calcite-meter-border-color": "*";
+  /** Specifies the box shadow of the component. */
+  "--calcite-meter-shadow": "*";
+  /** Specifies the corner radius of the component. */
+  "--calcite-meter-corner-radius": "*";
+  /** Specifies the color of the component's fill. */
+  "--calcite-meter-fill-color": "*";
+  /** Specifies the color of the component's range labels. */
+  "--calcite-meter-range-text-color": "*";
+  /** Specifies the color of the component's value label. */
+  "--calcite-meter-value-text-color": "*";
+}
+}
+
 export abstract class Meter extends LitElement {
   /**
    * Specifies the appearance of the component.

package/dist/components/calcite-navigation/customElement.d.ts

@@ -2,6 +2,23 @@
 import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 import type { Scale } from "../types.js";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** Specifies the width of the component's content area. */
+  "--calcite-navigation-width": "*";
+  /**
+   * Specifies the background color of the component.
+   *
+   * @deprecated in v3.0.0, removal target v6.0.0 - Use `--calcite-navigation-background-color` instead.
+   */
+  "--calcite-navigation-background": "*";
+  /** Specifies the component's background color. */
+  "--calcite-navigation-background-color": "*";
+  /** Specifies the component's border color. */
+  "--calcite-navigation-border-color": "*";
+}
+}
+
 /**
  * @slot [logo] - A slot for adding a `calcite-logo` component to the primary navigation level.
  * @slot [user] - A slot for adding a `calcite-user` component to the primary navigation level.

package/dist/components/calcite-navigation-logo/customElement.d.ts

@@ -3,6 +3,19 @@ import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 import type { HeadingLevel } from "../functional/Heading.js";
 import type { IconName } from "../calcite-icon/types.js";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** When `active`, specifies the component's border color. */
+  "--calcite-navigation-accent-color": "*";
+  /** Specifies the component's background color. */
+  "--calcite-navigation-background-color": "*";
+  /** Specifies the component's `heading` text color. */
+  "--calcite-navigation-logo-heading-text-color": "*";
+  /** Specifies the component's `description` text color. */
+  "--calcite-navigation-logo-text-color": "*";
+}
+}
+
 export abstract class NavigationLogo extends LitElement {
   /**
    * When `true`, the component is highlighted.

package/dist/components/calcite-navigation-user/customElement.d.ts

@@ -1,6 +1,23 @@
 /// <reference path="../../index.d.ts" />
 import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** When `active`, specifies the component's border color. */
+  "--calcite-navigation-accent-color": "*";
+  /** Specifies the component's avatar corner radius. */
+  "--calcite-navigation-user-avatar-corner-radius": "*";
+  /** Specifies the component's avatar icon color. */
+  "--calcite-navigation-user-avatar-color": "*";
+  /** Specifies the component's background color. */
+  "--calcite-navigation-background-color": "*";
+  /** Specifies the component's `fullName` text color. */
+  "--calcite-navigation-user-full-name-text-color": "*";
+  /** Specifies the component's `username` text color. */
+  "--calcite-navigation-user-name-text-color": "*";
+}
+}
+
 export abstract class NavigationUser extends LitElement {
   /**
    * When `true`, the component is highlighted.

package/dist/components/calcite-notice/customElement.d.ts

@@ -3,6 +3,45 @@ import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 import type { Appearance, Kind, Scale, Width } from "../types.js";
 import type { IconName } from "../calcite-icon/types.js";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** When `appearance="outline-fill"`, specifies the component's background color. */
+  "--calcite-notice-background-color": "*";
+  /** When `appearance="outline-fill"`, specifies the component's border color. */
+  "--calcite-notice-border-color": "*";
+  /** Specifies the component's border radius. */
+  "--calcite-notice-corner-radius": "*";
+  /** Specifies the background color of the component's close element. */
+  "--calcite-notice-close-background-color": "*";
+  /** Specifies the background color of the component's close element when hovered. */
+  "--calcite-notice-close-background-color-hover": "*";
+  /**
+   * Specifies the background color of the component's close element when hovered.
+   *
+   * @deprecated in v5.0.0, removal target v6.0.0 - Use `--calcite-notice-close-background-color-hover` instead.
+   */
+  "--calcite-notice-close-background-color-focus": "*";
+  /** Specifies the background color of the component's close element when active. */
+  "--calcite-notice-close-background-color-press": "*";
+  /** Specifies the icon color of the component's close element when hovered or active. */
+  "--calcite-notice-close-icon-color-hover": "*";
+  /** Specifies the icon color of the component's close element. */
+  "--calcite-notice-close-icon-color": "*";
+  /** Specifies the component's slotted `"title"` content text color. */
+  "--calcite-notice-title-text-color": "*";
+  /** Specifies the component's slotted `"message"` content text color. */
+  "--calcite-notice-content-text-color": "*";
+  /**
+   * Specifies the component's width.
+   *
+   * @deprecated in v3.0.0, removal target v6.0.0.
+   */
+  "--calcite-notice-width": "*";
+  /** Specifies the component's shadow. */
+  "--calcite-notice-shadow": "*";
+}
+}
+
 /**
  * Notices are intended to be used to present users with important-but-not-crucial contextual tips or copy. Because
  * notices are displayed inline, a common use case is displaying them on page-load to present users with short hints or contextual copy.

package/dist/components/calcite-pagination/customElement.d.ts

@@ -3,6 +3,23 @@ import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 import type { NumberingSystem } from "../../utils/locale.js";
 import type { Scale } from "../types.js";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** Specifies the component's item color. */
+  "--calcite-pagination-color": "*";
+  /** Specifies the component's item color when hovered or selected. */
+  "--calcite-pagination-color-hover": "*";
+  /** Specifies the component's item bottom border color when hovered. */
+  "--calcite-pagination-color-border-hover": "*";
+  /** Specifies the component's item bottom border color when selected. */
+  "--calcite-pagination-color-border-active": "*";
+  /** Specifies the component's item background color when active. */
+  "--calcite-pagination-background-color": "*";
+  /** Specifies the component's chevron item background color when hovered. */
+  "--calcite-pagination-icon-color-background-hover": "*";
+}
+}
+
 export abstract class Pagination extends LitElement {
   /**
    * When `true`, number values are displayed with a group separator corresponding to the language and country format.

package/dist/components/calcite-panel/customElement.d.ts

@@ -5,6 +5,69 @@ import type { FlipPlacement, LogicalPlacement, OverlayPositioning } from "../../
 import type { CollapseDirection, Scale } from "../types.js";
 import type { IconName } from "../calcite-icon/types.js";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** Specifies the component's corner radius. */
+  "--calcite-panel-corner-radius": "*";
+  /** Specifies the text color of the component's `heading`. */
+  "--calcite-panel-heading-text-color": "*";
+  /** Specifies the color of the component's icon. */
+  "--calcite-panel-icon-color": "*";
+  /** Specifies the text color of the component's `description`. */
+  "--calcite-panel-description-text-color": "*";
+  /** Specifies the component's border color. */
+  "--calcite-panel-border-color": "*";
+  /** Specifies the component's background color. */
+  "--calcite-panel-background-color": "*";
+  /** Specifies the padding of the component's `content-top` slot. */
+  "--calcite-panel-content-top-space": "*";
+  /** Specifies the padding of the component's `content-bottom` slot. */
+  "--calcite-panel-content-bottom-space": "*";
+  /** Specifies the padding of the component's `header-top` slot. */
+  "--calcite-panel-header-top-space": "*";
+  /** Specifies the background color of the component's header. */
+  "--calcite-panel-header-background-color": "*";
+  /** Specifies the background color of the component's `closable`, `collapsible`, and elements slotted in `header-menu-actions`. */
+  "--calcite-panel-header-action-background-color": "*";
+  /** Specifies the background color of the component's `closable`, `collapsible`, and elements slotted in `header-menu-actions` when hovered. */
+  "--calcite-panel-header-action-background-color-hover": "*";
+  /** Specifies the background color of the component's `closable`, `collapsible`, and elements slotted in `header-menu-actions` when pressed. */
+  "--calcite-panel-header-action-background-color-press": "*";
+  /** Specifies the text color of the component's `closable`, `collapsible`, and elements slotted in `header-menu-actions`. */
+  "--calcite-panel-header-action-text-color": "*";
+  /** Specifies the text color of the component's `closable`, `collapsible`, and elements slotted in `header-menu-actions` when pressed or hovered. */
+  "--calcite-panel-header-action-text-color-press": "*";
+  /** Specifies the background color of the component's footer. */
+  "--calcite-panel-footer-background-color": "*";
+  /** Specifies the padding of the component's `unnamed (default)` slot. */
+  "--calcite-panel-space": "*";
+  /** Specifies the padding of the component's `header-content` slot. */
+  "--calcite-panel-header-content-space": "*";
+  /** Specifies the padding of the component's footer. */
+  "--calcite-panel-footer-space": "*";
+  /** Specifies the border color of the component's internally rendered `calcite-popover`, which is rendered within a `calcite-action` menu when slotted `calcite-action`s are present in the `header-actions-end` slot. Applies to any slotted `calcite-popover`s. */
+  "--calcite-popover-border-color": "*";
+  /**
+   * Specifies the padding of the component's content.
+   *
+   * @deprecated in v3.0.0, removal target v6.0.0 - Use `--calcite-panel-space` instead.
+   */
+  "--calcite-panel-content-space": "*";
+  /**
+   * Specifies the padding of the component's footer.
+   *
+   * @deprecated in v3.0.0, removal target v6.0.0 - Use `--calcite-panel-footer-space` instead.
+   */
+  "--calcite-panel-footer-padding": "*";
+  /**
+   * Specifies the component header's block end border.
+   *
+   * @deprecated in v3.0.0, removal target v6.0.0 - Use `--calcite-panel-border-color` instead.
+   */
+  "--calcite-panel-header-border-block-end": "*";
+}
+}
+
 /**
  * @slot  - A slot for adding custom content.
  * @slot [action-bar] - A slot for adding a `calcite-action-bar` to the component.

package/dist/components/calcite-panel/customElement.js

@@ -82,6 +82,9 @@ class Panel extends LitElement {
   static {
     this.styles = [styles$1, styles];
   }
+  get hasHeaderRow() {
+    return this.hasHeaderContent || !!this.heading || !!this.description || this.hasHeaderHeading || this.hasHeaderDescription || this.hasStartActions || this.hasEndActions || this.collapsible || this.closable || this.hasMenuItems;
+  }
   get closed() {
     return this._closed;
   }
@@ -229,9 +232,6 @@ class Panel extends LitElement {
       }
     });
   }
-  get hasHeaderRow() {
-    return this.hasHeaderContent || !!this.heading || !!this.description || this.hasHeaderHeading || this.hasHeaderDescription || this.hasStartActions || this.hasEndActions || this.collapsible || this.closable || this.hasMenuItems;
-  }
   renderHeaderContent() {
     const { heading, headingLevel, description, hasHeaderContent, hasHeaderDescription, hasHeaderHeading, icon, scale } = this;
     const showHeaderHeading = !!heading || hasHeaderHeading;

package/dist/components/calcite-popover/customElement.d.ts

@@ -5,6 +5,21 @@ import type { HeadingLevel } from "../functional/Heading.js";
 import type { Scale } from "../types.js";
 import type { FocusTrapOptions } from "../../controllers/useFocusTrap.js";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** Specifies the component's background color. */
+  "--calcite-popover-background-color": "*";
+  /** Specifies the component's border color. */
+  "--calcite-popover-border-color": "*";
+  /** Specifies the component's corner radius. */
+  "--calcite-popover-corner-radius": "*";
+  /** Specifies the component's maximum width. */
+  "--calcite-popover-max-size-x": "*";
+  /** Specifies the component's text color. */
+  "--calcite-popover-text-color": "*";
+}
+}
+
 /** @slot  - A slot for adding custom content. */
 export abstract class Popover extends LitElement {
   /**

package/dist/components/calcite-progress/customElement.d.ts

@@ -1,6 +1,17 @@
 /// <reference path="../../index.d.ts" />
 import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** Specifies the component's background color. */
+  "--calcite-progress-background-color": "*";
+  /** Specifies the component's fill color. */
+  "--calcite-progress-fill-color": "*";
+  /** Specifies the component's text color. */
+  "--calcite-progress-text-color": "*";
+}
+}
+
 export abstract class Progress extends LitElement {
   /** Specifies an accessible label for the component. */
   accessor label: string | undefined;

package/dist/components/calcite-radio-button/customElement.d.ts

@@ -2,6 +2,19 @@
 import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 import type { Scale, Status } from "../types.js";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** Specifies the component's background color. */
+  "--calcite-radio-button-background-color": "*";
+  /** Specifies the component's border color. */
+  "--calcite-radio-button-border-color": "*";
+  /** Specifies the component's corner radius. */
+  "--calcite-radio-button-corner-radius": "*";
+  /** Specifies the component's size. */
+  "--calcite-radio-button-size": "*";
+}
+}
+
 export abstract class RadioButton extends LitElement {
   /**
    * When `true`, the component is checked.

package/dist/components/calcite-radio-button-group/customElement.d.ts

@@ -4,6 +4,15 @@ import type { Layout, Scale, Status } from "../types.js";
 import type { IconName } from "../calcite-icon/types.js";
 import type { RadioButton } from "../calcite-radio-button/customElement.js";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** Specifies the space between slotted components in the component. */
+  "--calcite-radio-button-group-gap": "*";
+  /** Specifies the margin spacing at the top of the `calcite-input-message`. */
+  "--calcite-radio-button-input-message-spacing": "*";
+}
+}
+
 /**
  * @slot  - A slot for adding `calcite-radio-button`s.
  * @slot [label-content] - A slot for rendering content next to the component's `labelText`.

package/dist/components/calcite-rating/customElement.d.ts

@@ -3,6 +3,25 @@ import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 import type { Scale, Status } from "../types.js";
 import type { IconName } from "../calcite-icon/types.js";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** Specifies the amount of left and right margin spacing between each item. */
+  "--calcite-rating-spacing": "*";
+  /** Specifies the component's item color when hovered. */
+  "--calcite-rating-color-hover": "*";
+  /** Specifies the component's item color when active. */
+  "--calcite-rating-color-press": "*";
+  /** Specifies the component's item color. */
+  "--calcite-rating-color": "*";
+  /** When `average` is set, specifies the component's item color. */
+  "--calcite-rating-average-color": "*";
+  /** When `average` is set, specifies the component's `average` text color. */
+  "--calcite-rating-average-text-color": "*";
+  /** Specifies the component's text color for `count`. */
+  "--calcite-rating-count-text-color": "*";
+}
+}
+
 /** @slot [label-content] - A slot for rendering content next to the component's `labelText`. */
 export abstract class Rating extends LitElement {
   /** Specifies a cumulative average from previous ratings to display. */

package/dist/components/calcite-scrim/customElement.d.ts

@@ -1,6 +1,13 @@
 /// <reference path="../../index.d.ts" />
 import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** Specifies the component's background color. */
+  "--calcite-scrim-background": "*";
+}
+}
+
 /** @slot  - A slot for adding custom content, primarily loading information. */
 export abstract class Scrim extends LitElement {
   /**

package/dist/components/calcite-segmented-control/customElement.d.ts

@@ -4,6 +4,15 @@ import type { Appearance, Layout, Scale, Status, Width } from "../types.js";
 import type { IconName } from "../calcite-icon/types.js";
 import type { SegmentedControlItem } from "../calcite-segmented-control-item/customElement.js";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** Specifies the component's border color. */
+  "--calcite-segmented-control-border-color": "*";
+  /** Specifies the component's corner radius. */
+  "--calcite-segmented-control-corner-radius": "*";
+}
+}
+
 /**
  * @slot  - A slot for adding `calcite-segmented-control-item`s.
  * @slot [label-content] - A slot for rendering content next to the component's `labelText`.