@momentum-design/components 0.129.36 → 0.129.38

package/dist/components/popover/popover.constants.d.ts

@@ -58,4 +58,9 @@ declare const DEFAULTS: {
     readonly IS_BACKDROP_INVISIBLE: true;
     readonly ANIMATION_FRAME: false;
 };
-export { TAG_NAME, POPOVER_PLACEMENT, COLOR, STRATEGY, TRIGGER, DEFAULTS };
+declare const TIMEOUTS: {
+    readonly OPEN: "open";
+    readonly HOVER: "hover";
+    readonly CLOSE: "close";
+};
+export { TAG_NAME, POPOVER_PLACEMENT, COLOR, STRATEGY, TRIGGER, DEFAULTS, TIMEOUTS };

package/dist/components/popover/popover.constants.js

@@ -60,4 +60,9 @@ const DEFAULTS = {
     IS_BACKDROP_INVISIBLE: true,
     ANIMATION_FRAME: false,
 };
-export { TAG_NAME, POPOVER_PLACEMENT, COLOR, STRATEGY, TRIGGER, DEFAULTS };
+const TIMEOUTS = {
+    OPEN: 'open',
+    HOVER: 'hover',
+    CLOSE: 'close',
+};
+export { TAG_NAME, POPOVER_PLACEMENT, COLOR, STRATEGY, TRIGGER, DEFAULTS, TIMEOUTS };

package/dist/components/staticcheckbox/staticcheckbox.component.d.ts

@@ -2,25 +2,36 @@ import { CSSResult } from 'lit';
 import { Component } from '../../models';
 declare const StaticCheckbox_base: import("../../utils/mixins/index.types").Constructor<import("../../utils/mixins/DisabledMixin").DisabledMixinInterface> & typeof Component;
 /**
- * StaticCheckbox is a decorative component styled as a checkbox for visual presentation.
- * Unlike the interactive `mdc-checkbox`, this component does not handle user interactions or form submissions.
- * It is used purely for displaying checkbox states in read-only scenarios.
+ * The StaticCheckbox component is a decorative, non-interactive checkbox used for visual
+ * presentation in read-only scenarios. Unlike the interactive `mdc-checkbox`, it does not
+ * handle user interactions or form submissions.
  *
- * This component supports five display states: checked, indeterminate, disabled, readonly, and soft-disabled.
+ * This component supports multiple visual states: checked, indeterminate, disabled, readonly,
+ * and soft-disabled.
+ *
+ * ## When to use
+ * Use StaticCheckbox to display checkbox states in read-only contexts such as summary views,
+ * confirmation screens, or when showing historical form data. For interactive checkboxes, use
+ * `mdc-checkbox` instead.
+ *
+ * ## Accessibility
+ * - StaticCheckbox is decorative and non-interactive by design
+ * - Always pair with descriptive text labels in the default slot
+ * - Do not use this as a replacement for interactive checkboxes in forms
  *
  * @tagname mdc-staticcheckbox
  *
  * @dependency mdc-icon
  *
- * @cssproperty --mdc-staticcheckbox-border-color - The border color of the checkbox.
- * @cssproperty --mdc-staticcheckbox-background-color - The background color of the checkbox.
- * @cssproperty --mdc-staticcheckbox-icon-color - The icon color of the checkbox.
- * @cssproperty --mdc-staticcheckbox-size - The size of the checkbox.
+ * @cssproperty --mdc-staticcheckbox-border-color - Border color of the checkbox.
+ * @cssproperty --mdc-staticcheckbox-background-color - Background color of the checkbox.
+ * @cssproperty --mdc-staticcheckbox-icon-color - Icon color of the checkbox.
+ * @cssproperty --mdc-staticcheckbox-size - Size of the checkbox.
  *
- * @csspart icon-container - The container for the checkbox icon
- * @csspart checkbox-icon - The checkbox icon element
+ * @csspart icon-container - The container for the checkbox icon.
+ * @csspart checkbox-icon - The checkbox icon element.
  *
- * @slot - Default slot for adding label text
+ * @slot - Default slot for label text.
  */
 declare class StaticCheckbox extends StaticCheckbox_base {
     /**

package/dist/components/staticcheckbox/staticcheckbox.component.js

@@ -14,25 +14,36 @@ import { DisabledMixin } from '../../utils/mixins/DisabledMixin';
 import styles from './staticcheckbox.styles';
 import { ICON_NAME } from './staticcheckbox.constants';
 /**
- * StaticCheckbox is a decorative component styled as a checkbox for visual presentation.
- * Unlike the interactive `mdc-checkbox`, this component does not handle user interactions or form submissions.
- * It is used purely for displaying checkbox states in read-only scenarios.
+ * The StaticCheckbox component is a decorative, non-interactive checkbox used for visual
+ * presentation in read-only scenarios. Unlike the interactive `mdc-checkbox`, it does not
+ * handle user interactions or form submissions.
  *
- * This component supports five display states: checked, indeterminate, disabled, readonly, and soft-disabled.
+ * This component supports multiple visual states: checked, indeterminate, disabled, readonly,
+ * and soft-disabled.
+ *
+ * ## When to use
+ * Use StaticCheckbox to display checkbox states in read-only contexts such as summary views,
+ * confirmation screens, or when showing historical form data. For interactive checkboxes, use
+ * `mdc-checkbox` instead.
+ *
+ * ## Accessibility
+ * - StaticCheckbox is decorative and non-interactive by design
+ * - Always pair with descriptive text labels in the default slot
+ * - Do not use this as a replacement for interactive checkboxes in forms
  *
  * @tagname mdc-staticcheckbox
  *
  * @dependency mdc-icon
  *
- * @cssproperty --mdc-staticcheckbox-border-color - The border color of the checkbox.
- * @cssproperty --mdc-staticcheckbox-background-color - The background color of the checkbox.
- * @cssproperty --mdc-staticcheckbox-icon-color - The icon color of the checkbox.
- * @cssproperty --mdc-staticcheckbox-size - The size of the checkbox.
+ * @cssproperty --mdc-staticcheckbox-border-color - Border color of the checkbox.
+ * @cssproperty --mdc-staticcheckbox-background-color - Background color of the checkbox.
+ * @cssproperty --mdc-staticcheckbox-icon-color - Icon color of the checkbox.
+ * @cssproperty --mdc-staticcheckbox-size - Size of the checkbox.
  *
- * @csspart icon-container - The container for the checkbox icon
- * @csspart checkbox-icon - The checkbox icon element
+ * @csspart icon-container - The container for the checkbox icon.
+ * @csspart checkbox-icon - The checkbox icon element.
  *
- * @slot - Default slot for adding label text
+ * @slot - Default slot for label text.
  */
 class StaticCheckbox extends DisabledMixin(Component) {
     constructor() {

package/dist/components/staticradio/staticradio.component.d.ts

@@ -2,23 +2,33 @@ import { CSSResult } from 'lit';
 import { Component } from '../../models';
 declare const StaticRadio_base: import("../../utils/mixins/index.types").Constructor<import("../../utils/mixins/DisabledMixin").DisabledMixinInterface> & typeof Component;
 /**
- * StaticRadio is a decorative component styled as a radio button for visual presentation.
- * Unlike the interactive `mdc-radio`, this component does not handle user interactions or form submissions.
- * It is used purely for displaying radio button states in read-only scenarios.
+ * The StaticRadio component is a decorative, non-interactive radio button used for visual
+ * presentation in read-only scenarios. Unlike the interactive `mdc-radio`, it does not
+ * handle user interactions or form submissions.
  *
- * This component supports four display states: checked, disabled, readonly, and soft-disabled.
+ * This component supports multiple visual states: checked, disabled, readonly, and soft-disabled.
+ *
+ * ## When to use
+ * Use StaticRadio to display radio button states in read-only contexts such as summary views,
+ * confirmation screens, or when showing historical form data. For interactive radio buttons, use
+ * `mdc-radio` instead.
+ *
+ * ## Accessibility
+ * - StaticRadio is decorative and non-interactive by design
+ * - Always pair with descriptive text labels in the default slot
+ * - Do not use this as a replacement for interactive radio buttons in forms
  *
  * @tagname mdc-staticradio
  *
- * @cssproperty --mdc-staticradio-inner-circle-size - The size of the inner circle when checked.
- * @cssproperty --mdc-staticradio-outer-circle-size - The size of the outer circle border.
- * @cssproperty --mdc-staticradio-inner-circle-background-color - The background color of the inner circle when checked.
- * @cssproperty --mdc-staticradio-outer-circle-border-color - The border color of the outer circle.
- * @cssproperty --mdc-staticradio-outer-circle-background-color - The background color of the outer circle.
+ * @cssproperty --mdc-staticradio-inner-circle-size - Size of the inner circle when checked.
+ * @cssproperty --mdc-staticradio-outer-circle-size - Size of the outer circle border.
+ * @cssproperty --mdc-staticradio-inner-circle-background-color - Background color of the inner circle when checked.
+ * @cssproperty --mdc-staticradio-outer-circle-border-color - Border color of the outer circle.
+ * @cssproperty --mdc-staticradio-outer-circle-background-color - Background color of the outer circle.
  *
- * @csspart radio-icon - The radio icon element
+ * @csspart radio-icon - The radio icon element.
  *
- * @slot - Default slot for the label of the radio
+ * @slot - Default slot for the label of the radio.
  */
 declare class StaticRadio extends StaticRadio_base {
     /**

package/dist/components/staticradio/staticradio.component.js

@@ -13,23 +13,33 @@ import { Component } from '../../models';
 import { DisabledMixin } from '../../utils/mixins/DisabledMixin';
 import styles from './staticradio.styles';
 /**
- * StaticRadio is a decorative component styled as a radio button for visual presentation.
- * Unlike the interactive `mdc-radio`, this component does not handle user interactions or form submissions.
- * It is used purely for displaying radio button states in read-only scenarios.
+ * The StaticRadio component is a decorative, non-interactive radio button used for visual
+ * presentation in read-only scenarios. Unlike the interactive `mdc-radio`, it does not
+ * handle user interactions or form submissions.
  *
- * This component supports four display states: checked, disabled, readonly, and soft-disabled.
+ * This component supports multiple visual states: checked, disabled, readonly, and soft-disabled.
+ *
+ * ## When to use
+ * Use StaticRadio to display radio button states in read-only contexts such as summary views,
+ * confirmation screens, or when showing historical form data. For interactive radio buttons, use
+ * `mdc-radio` instead.
+ *
+ * ## Accessibility
+ * - StaticRadio is decorative and non-interactive by design
+ * - Always pair with descriptive text labels in the default slot
+ * - Do not use this as a replacement for interactive radio buttons in forms
  *
  * @tagname mdc-staticradio
  *
- * @cssproperty --mdc-staticradio-inner-circle-size - The size of the inner circle when checked.
- * @cssproperty --mdc-staticradio-outer-circle-size - The size of the outer circle border.
- * @cssproperty --mdc-staticradio-inner-circle-background-color - The background color of the inner circle when checked.
- * @cssproperty --mdc-staticradio-outer-circle-border-color - The border color of the outer circle.
- * @cssproperty --mdc-staticradio-outer-circle-background-color - The background color of the outer circle.
+ * @cssproperty --mdc-staticradio-inner-circle-size - Size of the inner circle when checked.
+ * @cssproperty --mdc-staticradio-outer-circle-size - Size of the outer circle border.
+ * @cssproperty --mdc-staticradio-inner-circle-background-color - Background color of the inner circle when checked.
+ * @cssproperty --mdc-staticradio-outer-circle-border-color - Border color of the outer circle.
+ * @cssproperty --mdc-staticradio-outer-circle-background-color - Background color of the outer circle.
  *
- * @csspart radio-icon - The radio icon element
+ * @csspart radio-icon - The radio icon element.
  *
- * @slot - Default slot for the label of the radio
+ * @slot - Default slot for the label of the radio.
  */
 class StaticRadio extends DisabledMixin(Component) {
     constructor() {

package/dist/components/statictoggle/statictoggle.component.d.ts

@@ -3,26 +3,39 @@ import { Component } from '../../models';
 import type { ToggleSize } from './statictoggle.types';
 declare const StaticToggle_base: import("../../utils/mixins/index.types").Constructor<import("../../utils/mixins/DisabledMixin").DisabledMixinInterface> & typeof Component;
 /**
- * The StaticToggle is a decorative component that visually represents a toggle switch without interactive functionality.
- * It is primarily used for display purposes or as a building block within custom interactive components.
- * This component shares the same visual styling as the interactive `mdc-toggle` component.
+ * The StaticToggle component is a decorative, non-interactive toggle switch used for visual
+ * presentation. It shares the same styling as the interactive `mdc-toggle` component but does
+ * not provide user interaction functionality.
  *
- * @dependency mdc-icon
+ * This component supports multiple visual states: checked, disabled, readonly, soft-disabled,
+ * and size variations (default, compact).
+ *
+ * ## When to use
+ * Use StaticToggle to display toggle states in read-only contexts such as summary views,
+ * confirmation screens, or as a building block within custom interactive components. For
+ * interactive toggles, use `mdc-toggle` instead.
+ *
+ * ## Accessibility
+ * - StaticToggle is decorative and non-interactive by design
+ * - When used within parent components, ensure proper ARIA attributes are provided by the parent
+ * - Do not use this as a replacement for interactive toggles in forms
  *
  * @tagname mdc-statictoggle
  *
- * @slot - Default slot for slotted content (typically used by parent `mdc-toggle` for the checkbox input).
+ * @dependency mdc-icon
  *
- * @cssproperty --mdc-statictoggle-width - The width of the static toggle.
- * @cssproperty --mdc-statictoggle-height - The height of the static toggle.
- * @cssproperty --mdc-statictoggle-border-radius - The border radius of the static toggle.
- * @cssproperty --mdc-statictoggle-border-color - The border color of the static toggle.
- * @cssproperty --mdc-statictoggle-background-color - The background color of the static toggle.
- * @cssproperty --mdc-statictoggle-icon-color - The icon color of the static toggle.
- * @cssproperty --mdc-statictoggle-icon-background-color - The icon background color of the static toggle.
+ * @cssproperty --mdc-statictoggle-width - Width of the static toggle.
+ * @cssproperty --mdc-statictoggle-height - Height of the static toggle.
+ * @cssproperty --mdc-statictoggle-border-radius - Border radius of the static toggle.
+ * @cssproperty --mdc-statictoggle-border-color - Border color of the static toggle.
+ * @cssproperty --mdc-statictoggle-background-color - Background color of the static toggle.
+ * @cssproperty --mdc-statictoggle-icon-color - Icon color of the static toggle.
+ * @cssproperty --mdc-statictoggle-icon-background-color - Icon background color of the static toggle.
  *
  * @csspart slider - The slider part of the toggle.
  * @csspart toggle-icon - The icon part of the toggle.
+ *
+ * @slot - Default slot for slotted content (typically used by parent `mdc-toggle` for the checkbox input).
  */
 declare class StaticToggle extends StaticToggle_base {
     /**

package/dist/components/statictoggle/statictoggle.component.js

@@ -14,26 +14,39 @@ import { DisabledMixin } from '../../utils/mixins/DisabledMixin';
 import { DEFAULTS, ICON_NAME, ICON_SIZE_IN_REM } from './statictoggle.constants';
 import styles from './statictoggle.styles';
 /**
- * The StaticToggle is a decorative component that visually represents a toggle switch without interactive functionality.
- * It is primarily used for display purposes or as a building block within custom interactive components.
- * This component shares the same visual styling as the interactive `mdc-toggle` component.
+ * The StaticToggle component is a decorative, non-interactive toggle switch used for visual
+ * presentation. It shares the same styling as the interactive `mdc-toggle` component but does
+ * not provide user interaction functionality.
  *
- * @dependency mdc-icon
+ * This component supports multiple visual states: checked, disabled, readonly, soft-disabled,
+ * and size variations (default, compact).
+ *
+ * ## When to use
+ * Use StaticToggle to display toggle states in read-only contexts such as summary views,
+ * confirmation screens, or as a building block within custom interactive components. For
+ * interactive toggles, use `mdc-toggle` instead.
+ *
+ * ## Accessibility
+ * - StaticToggle is decorative and non-interactive by design
+ * - When used within parent components, ensure proper ARIA attributes are provided by the parent
+ * - Do not use this as a replacement for interactive toggles in forms
  *
  * @tagname mdc-statictoggle
  *
- * @slot - Default slot for slotted content (typically used by parent `mdc-toggle` for the checkbox input).
+ * @dependency mdc-icon
  *
- * @cssproperty --mdc-statictoggle-width - The width of the static toggle.
- * @cssproperty --mdc-statictoggle-height - The height of the static toggle.
- * @cssproperty --mdc-statictoggle-border-radius - The border radius of the static toggle.
- * @cssproperty --mdc-statictoggle-border-color - The border color of the static toggle.
- * @cssproperty --mdc-statictoggle-background-color - The background color of the static toggle.
- * @cssproperty --mdc-statictoggle-icon-color - The icon color of the static toggle.
- * @cssproperty --mdc-statictoggle-icon-background-color - The icon background color of the static toggle.
+ * @cssproperty --mdc-statictoggle-width - Width of the static toggle.
+ * @cssproperty --mdc-statictoggle-height - Height of the static toggle.
+ * @cssproperty --mdc-statictoggle-border-radius - Border radius of the static toggle.
+ * @cssproperty --mdc-statictoggle-border-color - Border color of the static toggle.
+ * @cssproperty --mdc-statictoggle-background-color - Background color of the static toggle.
+ * @cssproperty --mdc-statictoggle-icon-color - Icon color of the static toggle.
+ * @cssproperty --mdc-statictoggle-icon-background-color - Icon background color of the static toggle.
  *
  * @csspart slider - The slider part of the toggle.
  * @csspart toggle-icon - The icon part of the toggle.
+ *
+ * @slot - Default slot for slotted content (typically used by parent `mdc-toggle` for the checkbox input).
  */
 class StaticToggle extends DisabledMixin(Component) {
     constructor() {